/**
 * guidelines.index.css
 *
 * This page include Global CSS, Guideline CSS along with (Header Section, Banner Section, Footer Section, Floating Button) and Media Queries.
 * Sirmaglobal Release: Version Beta 0.0.0.1
 *
 * Contents
 *
 * Settings
 * Global...............Globally-available variables and config.
 *
 * Generic
 * Box-sizing...........Better default `box-sizing`.
 *
 * Base
 * h1–h6.............Headings styles.
 *
 * Components
 * banner_header............The Banner page header.
 * header............The main page header.
 * footer............The main page footer.
 * button..............Button elements.
 * section.............The each block in body.
 * p.............The Description block in body.
 * img............The Image Tag in body
 * 
 *
 * Copyright Sirmaglobal 2021
 */
    /**
 * Html-Global-level smoothness & Box-sizing.
 */
    
    html {
        scroll-behavior: smooth;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    
    .word-break-all {
        word-break: break-all;
    }
    
    *,
    *:before,
    *:after {
        -webkit-box-sizing: inherit;
        -moz-box-sizing: inherit;
        box-sizing: inherit;
    }
    /**
 * Body-level font family and margin.
 */
    
    body {
        margin: 0;
        /* Typography */
        font-family: Arial, Helvetica, sans-serif;
        line-height: 1.5;
        color: #333;
    }
    /**
 * Basic-tags-level display by default show.
 */
    
    article,
    aside,
    details,
    figcaption,
    figure,
    footer,
    header,
    main,
    menu,
    nav,
    section {
        display: block;
    }
    /**
 * Paragraph-level font-weight and color.
 */
    
    p {
        color: #000;
        font-weight: 300;
        font-size: 14px;
    }
    
    .sub_header2 {
        font-size: 16px;
    }
    
    a {
        outline: none;
    }
    /**
 * Headings-level font-weight.
 */
    
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        font-weight: bold;
    }
    /**
 * Image-level alignment.
 */
    
    img {
        vertical-align: middle;
    }
    /**
 * Section-level padding.
 */
    
    section {
        padding-top: 16px;
        padding-bottom: 16px;
    }
    /**
 * Header-Bar-level height.
 */
    
    header {
        height: 87px;
    }
    
    .header_bg_color {
        background-color: rgba(0, 0, 0, 0.26);
    }
    /**
 * Banner-Header-level font size and background colors.
 */
    
    .banner_header {
        font-size: 60px;
        font-weight: bold;
    }
    /**
 * Header-level font size and background colors.
 */
    
    .header {
        /*font-size: 30px;*/
        font-size: 35px;
    }
    /**
 * SubHeader-level font size.
 */
    
    .sub_header {
        /*font-size: 22px;*/
        font-size: 20px;
    }
    
    .sbc_banner_image {
        width: 100%;
    }
    /**
 * Primary-level color and background colors.
 */
    
    .primary_color {
        color: #ec2224;
    }
    
    .primary_bg_color {
        background-color: #ec2224;
    }
    /**
 * Secondary-level color and background colors.
 */
    
    .secondary_color {
        color: #a2322e;
    }
    
    .secondary_bg_color {
        background-color: #a2322e;
    }
    /**
 * Primary-Neutral-level color and background colors.
 */
    
    .primary_nt_color {
        color: #ffffff;
    }
    
    .primary_nt_bg_color {
        background-color: #ffffff;
    }
    /**
 * Secondary-Neutral-level color and background colors.
 */
    
    .secondary_nt_color {
        color: #000000;
    }
    
    .secondary_nt_bg_color {
        background-color: #000000;
    }
    /**
* Heading-Theme-level all properties .
*/
    
    .heading_theme:after {
        background-image: url(Libraries/images/Arrow.svg);
        display: inline-block;
        width: 30px;
        height: 30px;
        content: "";
        background-repeat: no-repeat;
        position: relative;
        top: -14px;
        right: 4px;
        background-size: cover;
    }
    
    .border_bottom_theme {
        border-bottom: 4px solid #650000;
        border-bottom-width: 3px;
    }
    
    .heading_theme-top:after {
        background-image: url(Libraries/images/top_arrow.png);
        display: inline-block;
        width: 96px;
        height: 96px;
        content: "";
        background-repeat: no-repeat;
        position: relative;
        top: -10px;
        left: -28px;
        background-size: cover;
    }
    
    .heading_theme_white:after {
        background-image: url(Libraries/images/Arrow_wte.svg);
        display: inline-block;
        width: 30px;
        height: 30px;
        content: "";
        background-repeat: no-repeat;
        position: relative;
        top: -14px;
        right: 4px;
        background-size: cover;
    }
    
    .border_bottom_theme_white {
        border-bottom: 4px solid white;
        border-bottom-width: 10%;
    }
    
    .color-white {
        color: #fff;
    }
    
    .color-red {
        color: red;
    }
    
    .color-black {
        color: black;
    }
    
    .font-size-14 {
        font-size: 14px;
    }
    
    .font-weight-300 {
        font-weight: 300;
    }
    /**
* Header Block Start
*/
    
    .header-bg {
        background: #ffffff
    }
    
    .navbar-brand img {
        height: 60px;
    }
    
    .navbar-shadow {
        border-bottom-color: rgba(255, 255, 255, 0);
        border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    }
    
    .nav-link {
        color: black !important;
        font-weight: bold;
    }
    
    .active .nav-link {
        color: red !important;
    }
    
    .navbar-nav {
        font-size: 16px;
        /* margin-left: 250px; */
        /* margin-left: 60px; */
    }
    
    @media only screen and (max-width: 1100px) {
        .navbar-nav {
            font-size: 16px;
            margin-left: 0px;
            white-space: nowrap;
        }
    }
    
    .nav-item {
        margin: 0 0 0 20px;
    }
    /**
* Header Block End
*/
    /**
* Banner Block Start
*/
    
    .intro-arrow {
        /*clip-path: polygon(100% 0, 100% 89%, 50% 100%, 0 89%, 0 0);
     background-image: linear-gradient(to right, red, black);*/
        clip-path: polygon(100% 0, 100% 89%, 50% 100%, 0 89%, 0 0);
        background-image: linear-gradient(to right, red, rgb(250, 70, 85), red, rgb(250, 70, 85), red);
        /*transition: 4s;*/
    }
    
    .intro-arrow-white {
        /*clip-path: polygon(100% 0, 100% 89%, 50% 100%, 0 89%, 0 0);
     background-image: linear-gradient(to right, red, black);*/
        clip-path: polygon(100% 0, 100% 89%, 50% 100%, 0 89%, 0 0);
        background: white !important;
        transition: 0.3s;
    }
    
    .intro-item-video {
        width: 100%;
        margin-bottom: -10px;
        clip-path: polygon(100% 0, 100% 87%, 50% 97%, 0 87%, 0 0);
    }
    
    .intro-item-image {
        width: 100%;
        margin-bottom: 0px;
        clip-path: polygon(100% 0, 100% 87%, 50% 97%, 0 87%, 0 0);
    }
    
    .intro-item-image-secondary {
        width: 100%;
        margin-bottom: 0px;
    }
    
    .carousel-header {
        text-align: center;
        text-shadow: 0 0 10px rgba(0, 0, 0, 0.20);
    }
    
    .carousel-content {
        font-size: 26px;
        color: white;
        text-shadow: 0 0 6px rgb(0, 0, 0);
    }
    
    .carousel-control-next,
    .carousel-control-prev {
        width: 8%;
        color: #fff;
        text-align: center;
        opacity: .5;
        background: rgba(0, 0, 0);
    }
    /**
* Banner Block End
*/
    /**
* Footer Block Start
*/
    
    #footer,
    footer {
        background: transparent linear-gradient(108deg, #AECCEF 0%, #E7F0FD 100%) 0% 0% no-repeat padding-box;
        color: black;
    }
    
    .footer_company_logo {
        height: 60px;
    }
    
    .block-social>a {
        display: inline-block;
        width: 25px;
        height: 25px;
        line-height: 26px;
        text-align: center;
        margin-right: 5px;
        -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
        border-radius: 2px;
    }
    
    .block-social>a:hover {
        color: white;
        background: red;
    }
    
    .block-social {
        margin-top: 10px;
    }
    
    .block-social img,
    .social-buttons img {
        vertical-align: unset;
    }
    
    .contact {
        height: 18px;
    }
    
    .social-buttons {
        list-style: none;
    }
    
    .social-btn.whatsapp {
        background: rgb(121, 232, 119);
    }
    
    .social-btn.telegram {
        background: rgb(64, 168, 220);
    }
    
    .social-btn.phone {
        background: rgb(0, 0, 255);
    }
    
    .social-btn.envelope {
        background: rgb(255, 0, 0);
    }
    
    .social-btn-tool-tip {
        width: 140px;
        border-radius: 5%;
        -moz-border-radius: 5%;
        -webkit-border-radius: 5%;
        -o-border-radius: 5%;
        background: rgb(36, 40, 48);
        display: inline-block;
        color: rgb(255, 255, 255);
        font-size: 14px;
        line-height: 40px;
        text-align: center;
        box-shadow: 0 0 3px black;
        padding: 0px 10px;
    }
    
    .social-btn {
        width: 40px;
        height: 40px;
        border-radius: 30%;
        -moz-border-radius: 30%;
        -webkit-border-radius: 30%;
        -o-border-radius: 30%;
        display: inline-block;
        color: rgb(255, 255, 255);
        font-size: 18px;
        line-height: 40px;
        text-align: center;
        box-shadow: 0 0 3px black;
        display: inline-block;
        vertical-align: middle;
        -webkit-transform: perspective(1px) translateZ(0);
        transform: perspective(1px) translateZ(0);
        box-shadow: 0 0 1px rgba(0, 0, 0, 0);
        position: relative;
        -webkit-transition-property: color;
        transition-property: color;
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
    }
    
    .social-btn::before {
        content: "";
        position: absolute;
        z-index: -1;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        -webkit-transform: scale(0);
        transform: scale(0);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
        -webkit-transition-property: transform;
        transition-property: transform;
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
        -webkit-transition-timing-function: ease-out;
        transition-timing-function: ease-out;
        border-radius: 50%;
        -moz-border-radius: 50%;
        -webkit-border-radius: 50%;
        -o-border-radius: 50%;
    }
    
    .social-btn:hover:before,
    .social-btn:focus:before,
    .social-btn:active:before {
        -webkit-transform: scale(1);
        transform: scale(1);
        /*transform: rotate(45deg);*/
    }
    
    .social-btn:hover,
    .social-btn:visited,
    .social-btn:focus {
        box-shadow: 0 0 10px 2px rgb(0, 0, 0);
        color: white;
        -webkit-transition: 0.6s;
        transition: 0.6s;
    }
    
    .social-buttons li {
        display: inline-block;
    }
    
    .bt-linkedin {
        background-color: white;
        color: rgb(32, 115, 176);
    }
    
    .bt-twitter {
        background-color: white;
        color: rgb(48, 161, 242);
    }
    
    .bt-facebook {
        background-color: white;
        color: rgb(59, 89, 153);
    }
    
    .bt-pinterest {
        background-color: white;
        color: rgb(204, 63, 39);
    }
    
    .bt-youtube {
        background-color: white;
        color: rgb(223, 70, 43);
    }
    
    .bt-whatsapp {
        background-color: white;
        color: rgb(121, 232, 119);
    }
    
    .bt-telegram {
        background-color: white;
        color: rgb(64, 168, 220);
    }
    
    .bt-phone {
        background-color: white;
        color: rgb(0, 0, 255);
    }
    
    .bt-envelope {
        background: white;
        color: rgb(255, 0, 0);
    }
    
    .letsconnect-btn {
        background: red !important;
        color: white;
        font-weight: bold;
        border-radius: 50px;
        border: 1px solid red !important;
        outline: none;
    }
    
    .copyright {
        margin: 0;
        padding-bottom: 1rem;
    }
    /**
* Footer Block End
*/
    /*@@@@@@@@@@@ letsconnect css start @@@@@@@@@@@*/
    
    #letsconnect .form-control {
        border-color: unset;
        -webkit-box-shadow: none;
        border: none;
        border-bottom: 1px solid #ccc;
        border-radius: 0px;
    }
    
    #letsconnect .form-control:focus {
        border-bottom-width: 2px;
        /*border-bottom-color: rgb(96, 125, 139);*/
        border-bottom-color: black;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
    
    #letsconnect .form-group {
        position: relative;
        margin-bottom: 1.5rem;
    }
    
    #letsconnect .form-control-placeholder {
        position: absolute;
        top: 0;
        padding: 7px 0 0 13px;
        transition: all 200ms;
        opacity: 0.5;
        font-size: 16px;
    }
    
    #letsconnect .form-control:focus+.form-control-placeholder,
    #letsconnect .form-control:valid+.form-control-placeholder {
        font-size: 75%;
        transform: translate3d(0, -100%, 0);
        opacity: 1;
    }
    
    #letsconnect label {
        font-weight: 300;
    }
    
    #letsconnect .letsconnect_submit {
        box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
        float: left !important;
        padding: .84rem 2.14rem;
        font-size: 16px;
        background-color: rgb(235, 35, 36);
        color: rgb(255, 255, 255);
        font-weight: bold;
        outline: none;
    }
    
    #letsconnect .letsconnect_submit+p {
        margin-bottom: 20px;
        text-align: right;
        font-size: 14px;
    }
    
    #letsconnect .letsconnect {
        margin-bottom: 20px;
        background-color: white;
        position: relative;
        box-shadow: 0 0 20px rgba(0, 0, 0, 0.40);
    }
    
    #letsconnect .letsconnect_address {
        background: linear-gradient(100deg, red, black);
        color: white;
        padding-top: 30px;
    }
    
    #letsconnect .letsconnect_form {
        padding: 25px 100px 25px 70px;
        background-color: white;
    }
    
    #letsconnect .letsconnect_border_bottom_red {
        border-bottom: 4px solid red;
    }
    /*@@@@@@@@@@@ letsconnect css end @@@@@@@@@@@*/
    /* Ajax loading animation Start */
    
    #overlay2Mail {
        position: fixed;
        top: 0;
        z-index: 9999;
        width: 100%;
        height: 100%;
        display: none;
        background: rgba(0, 0, 0, 0.6);
    }
    
    .cv-spinner2Mail {
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    #overlayMail {
        position: fixed;
        top: 0;
        z-index: 9999;
        width: 100%;
        height: 100%;
        display: none;
        background: rgba(0, 0, 0, 0.6);
    }
    
    .cv-spinnerMail {
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    .spinnerMail {
        width: 40px;
        height: 40px;
        border: 4px #ddd solid;
        border-top: 4px red solid;
        border-radius: 50%;
        animation: sp-animeMail 0.8s infinite linear;
    }
    
    @keyframes sp-animeMail {
        0% {
            transform: rotate(0deg);
        }
        100% {
            transform: rotate(359deg);
        }
    }
    
    .is-hide {
        display: none;
    }
    /* Ajax loading animation End */
    /**
* Floating Block Start
*/
    
    #floating-icon-oracle {
        height: 5.5vh;
        width: auto;
        border-radius: 6px;
        margin-bottom: -14px;
        background-color: white;
        box-shadow: 0 0 5px rgb(154, 154, 154);
    }
    
    #oracleGoldPartner {
        position: fixed;
        /*left: 0;*/
        /*right: unset;*/
        left: 30px;
        bottom: 10px;
        /*width: 150px;*/
        color: white;
        text-align: center;
        z-index: 95;
        -webkit-transition: all 0.6s;
        -moz-transition: all 0.6s;
        transition: all 0.6s;
    }
    
    #letsAnimate {
        position: fixed;
        /*left: 0;*/
        /*right: unset;*/
        right: 30px;
        bottom: 10px;
        /*width: 150px;*/
        color: white;
        text-align: center;
        z-index: 95;
        -webkit-transition: all 0.6s;
        -moz-transition: all 0.6s;
        transition: all 0.6s;
    }
    /**
* Floating Block End
*/
    /**
* Dropdown Block Start
*/
    
    .dropdown-menu {
        border-radius: 0px;
        padding: 0px;
        background: white;
        top: 61px;
        border: unset;
        max-height: 400px;
        overflow: auto;
    }
    /* Let's get this party started */
    
    .dropdown-menu::-webkit-scrollbar {
        width: 6px;
    }
    /* Track */
    
    .dropdown-menu::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3)\;
        -webkit-border-radius: 10px;
        border-radius: 10px;
    }
    /* Handle */
    
    .dropdown-menu::-webkit-scrollbar-thumb {
        -webkit-border-radius: 10px;
        border-radius: 10px;
        background: red;
        -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
    }
    
    .dropdown-menu::-webkit-scrollbar-thumb:window-inactive {
        background: red;
    }
    
    .dropdown-item {
        padding: 12px 25px;
        color: black;
        font-weight: bold;
    }
    
    .dropdown-item:focus,
    .dropdown-item:hover {
        color: white;
        background: transparent linear-gradient(109deg, #7795C4 0%, #E7F0FD 100%) 0% 0% no-repeat padding-box;
        font-weight: bold;
    }
    /**
* Dropdown Block End
*/
    
    .carousel-caption {
        top: 25%;
        left: 12%;
    }
    
    .sbc_overlay {
        height: 100%;
        width: 100%;
        position: absolute;
        background-color: #0000006B;
        opacity: 1;
    }
    
    /* section,
    .sbc_banner {
        position: relative;
        z-index: 1;
    } */
    
    .texthead {
        position: absolute;
        left: -80px;
        top: 20px;
        text-align: left;
    }
    
    .texthead2 {
        position: absolute;
        left: -80px;
        top: 144px;
    }
    
    @media only screen and (max-width: 1024px) {
        .carousel-caption {
            top: 20%;
            left: 50px;
        }
        .carousel-content {
            font-size: 22px;
        }
        /**
    * Banner-Header-level font size.
    */
        .banner_header {
            font-size: 52px;
        }
        /**
    * Header-level font size.
    */
        .header {
            font-size: 22px;
        }
        /**
    * Sub-Header-level font size.
    */
        .sub_header {
            font-size: 18px;
        }
    }
    
    @media only screen and (max-width: 768px) {
        .carousel-caption {
            top: 20%;
            left: 5%;
        }
        .heading_theme-top:after {
            height: 50px !important;
            width: 50px !important;
            top: -5px;
            left: -12px;
        }
        .navbar-brand img {
            height: 40px;
        }
        .navbar-nav .nav-link,
        .navbar-nav .dropdown-item {
            font-size: 10px;
        }
        .dropdown-menu {
            top: 47px;
        }
        .carousel-content {
            font-size: 18px;
        }
        /**
    * Section-level padding.
    */
        section {
            padding: 18px;
        }
        /**
    * Banner-Header-level font size.
    */
        .banner_header {
            font-size: 36px;
        }
        /**
    * Header-level font size.
    */
        .header {
            font-size: 20px;
        }
        /**
    * Sub-Header-level font size.
    */
        .sub_header {
            font-size: 16px;
        }
        .vertical {
            display: none;
        }
        .heading_red:after {
            display: none;
        }
        /**
    * Heading-Theme-level all properties .
    */
        .heading_theme:after {
            width: 24px;
            height: 24px;
            top: -14px;
        }
        .heading_theme_white:after {
            width: 24px;
            height: 24px;
            top: -14px;
        }
    }
    
    @media only screen and (max-width: 480px) {
        .carousel-caption {
            top: 24%;
            left: 30px;
        }
        .heading_theme-top:after {
            height: 30px !important;
            width: 30px !important;
            top: -5px;
            left: -12px;
        }
        .intro-item-video {
            height: 320px;
            width: auto;
        }
        .intro-arrow {
            clip-path: polygon(100% 0, 100% 93%, 50% 100%, 0 93%, 0 0);
        }
        .carousel-content {
            font-size: 14px;
        }
        .navbar-brand img {
            height: 30px;
        }
        /**
    * Section-level padding.
    */
        section {
            padding: 12px;
        }
        /**
    * Banner-Header-level font size.
    */
        .banner_header {
            font-size: 24px;
        }
        /**
    * Header-level font size.
    */
        .header {
            font-size: 20px;
        }
        /**
    * Heading-Theme-level all properties .
    */
        .heading_theme:after {
            width: 20px;
            height: 20px;
            top: -10px;
        }
        .heading_theme_white:after {
            width: 20px;
            height: 20px;
            top: -10px;
        }
        /*@@@@@@@@@@@ letsconnect css start @@@@@@@@@@@*/
        #letsconnect .letsconnect_form {
            padding: 25px 45px 25px 40px;
        }
        /*@@@@@@@@@@@ letsconnect css end @@@@@@@@@@@*/
    }