@import '../css/themify-icons.css';
@import '../css/flaticon.css';
@import '../css/bootstrap.min.css';
@import '../css/animate.css';
@import '../css/owl.carousel.css';
@import '../css/owl.theme.css';
@import '../css/slick.css';
@import '../css/slick-theme.css';
@import '../css/swiper.min.css';
@import '../css/owl.transitions.css';
@import '../css/jquery.fancybox.css';
@import '../css/odometer-theme-default.css';
@import '../sass/style.css';


@font-face {
    font-family: 'FiraGO';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/FiraGO-Regular.ttf) format('woff');
  }
  
  


.wpo-header-style-s5 #navbar {

     margin-left: 0px; 
}

.wpo-site-header #navbar > ul > li > a {
    font-feature-settings: 'case' on;
    font-size: 17px;
}
.theme-btn, .view-cart-btn {
    font-feature-settings: 'case' on; 
}

.mobile-number {
    font-size: 17px;
    color: #fff;
    text-decoration: underline;
    margin-right: 10px;
}

.wpo-hero-slider .slide-content h2 {
    font-size: 70px;
    line-height: 90px;
}

.languages img {
    height: 24px;
    margin-right: 10px;
    margin-top: 4px;
}

.languages a{
    color: #fff;
    font-size: 16px;
    margin-right: 5px;
    padding: 3px 5px;
}

.choose-buttons {
    font-size: 14px!important;
}
.wpo-header-style-s5 {
    /* -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px); */
    background-color: #fff;
}

.live {
    background: #ff6e6e;
    color: #fff;
    /* padding: 5px 10px; */
    border-radius: 50%;
    width: 40px;
    height: 40px;
    text-align: center;
    padding-top: 9px;
    margin-left: 10px;
    margin-right: 10px;
}
.active-lang {
    background: #406187;
}

.wpo-about-section-s4 .about-wrap .content .about-btn .theme-btn {
    background: #406187!important; 
    border-color: #406187!important; ; 
}

.odometer.odometer-auto-theme .odometer-digit .odometer-value {
    color: #406187!important; 
    border-color: #406187!important; ;  
}
.wpo-about-section-s4 .about-wrap .experience .icon {
    color: #406187!important;   
}

.wpo-about-section-s4 {
    margin: 0px 30px 20px;
    height: auto;
    position: relative;
}
.wpo-project-section-s2 .project-wrap .project-card-s2 .content h2 {
    color:#fff;
}

.project-wrap .project-card-s2 {
    flex-basis: 20%!important;
}

.wpo-project-section-s2 .project-wrap .project-card-s2 img {
    height: 600px;
}

.wpo-project-section-s2 .project-wrap .project-card-s2 .content {
    background: #00000078;
}
.wpo-project-section-s2 .project-wrap .project-card-s2 .content h2 {
    font-size: 20px;
}

.wpo-project-section-s5 {
    background-color: #fff!important;
    background: #fff!important;
}

.wpo-project-section-s5 .top-content .title h2 {
color: #000;
font-size: 60px;
}
.project-card-s5 .content h2 a {
    color:#000;
}

.wpo-project-section-s5 .top-content .title h2 .bg-text {
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #3636360f;
    color: transparent;
    font-size: 400px;
    font-weight: 700;
    text-transform: uppercase;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: -1;
}

.wpo-project-section-s14 {
    background-color: #fff;
}

.wpo-project-section-s14 .title h2 {
    color:#000;
}

.wpo-project-section-s14 .title p {
    color:#000;
}

.wpo-project-section-s14 .project-content .item .content h2 a {
    color:#000; 
}

.wpo-project-section-s14 .project-content .item .content h3 {
    color: #43434326;
}

.wpo-project-section-s14 .title h2 {
    font-size: 60px;
}

.project-card-s5 img {
    width: 100%;

    height: 450px;
}
.project-card-s5  {
    margin-bottom: 50px;
}

.wpo-cta-section .title h2, .wpo-cta-section-s2 .title h2 {
    font-size: 60px;
}
.wpo-cta-section .title a span, .wpo-cta-section-s2 .title a span {
    font-size: 15px;
}
.wpo-cta-section, .wpo-cta-section-s2 {
    height: 600px;
}

.wpo-project-section-s12 {
    background: #F4F1ED;
    padding: 100px 0;
    position: relative;
    z-index: 1;
    overflow: hidden;
    padding-right: 20px;
    padding-left: 20px;
}

.wpo-project-section-s7 .title h2, .wpo-project-section-s10 .title h2
 {
    color:#000;
    font-size: 70px;
    line-height: 70px;
 }
 .wpo-project-section-s7, .wpo-project-section-s10 {
    background-color: #fff;
    background: #fff;
 }

 .wpo-project-section-s7 .title p, .wpo-project-section-s10 .title p {
    color:#000;
 }

 .wpo-project-section-s7 .title p, .wpo-project-section-s10 .title p {
    font-size: 16px;
 }


 .wpo-project-section-s7 .item .content h2 a, .wpo-project-section-s10 .item .content h2 a {
    font-size: 20px;
    color:#000;
 }

 .wpo-project-section-s7 .item img, .wpo-project-section-s10 .item img {
    height: 100%!important;
 }

 .swiper-button-next,
 .swiper-button-prev {
     color: white;
     background-color: rgba(0, 0, 0, 0.4);
     border-radius: 50%;
     width: 40px;
     height: 40px;
 }

 .swiper-button-next::after,
 .swiper-button-prev::after {
     font-size: 18px;
 }

 .wpo-service-section .service-top .content h2 {
    font-size: 50px;
    line-height: 60px;
 }

 .list-opo li {
    color:#fff;
    font-size: 17px;
    margin-bottom: 10px;
 }

 .wpo-site-header #navbar > ul > li > a {
    color:#000;
 }

 .mobile-number {
    font-size: 17px;
    color:#000;
 }

 .languages a {
    color:#000;
 }
 .active-lang {
    color:#fff!important;
 }

 .languages img {
    filter: brightness(0) saturate(100%) invert(33%) sepia(86%) saturate(327%) hue-rotate(172deg) brightness(85%) contrast(82%);
 }
 .live:hover {
    color:#fff;
    opacity:0.8;
 }
 .close-form a{
    border: 1px solid #406187;
    color:#406187;
 }
 .close-form a:hover {
    opacity: 0.8;
 }
 .choose-buttons:hover {
    opacity: 0.8;
    color:#406187;
 }

 .wpo-site-header .navigation.sticky-header {
    background-color: #fff;
    background: #fff;
    box-shadow: rgba(8, 106, 216, 0.29) 0px -5px 15px;
 }

 .mobile-number:hover {
    color:#000;
    opacity: 0.6;
    text-decoration: underline;
 }
 /* .wpo-site-header #navbar > ul > li > a:hover {
    opacity: 0.8;
    color:#406187;
 } */

 .wpo-site-header .navigation.sticky-header #navbar > ul li a:hover {
    opacity: 0.8;
    color:#406187;
 }

 .choose-buttons{
    margin-top: 7px;
 }




.callback-call {

    position: fixed;

    z-index: 999998;

    transform: translate(-50%, -50%);

}



.callback_botright {

    right: 60px;

    margin-top: 60px;

    bottom: 150px;

}



.callback_topleft {

    left: 60px;

    top: 60px;

}



.callback_topright {

    right: 60px;

    top: 60px;

}



.callback-call:hover .glyphicon {

    display: none;

}



.callback-call:hover .btn_text {

    display: block;

}



.callback-call .glyphicon.glyphicon-earphone {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    font-size: 24px;

    color: #ffffff;

    animation: call 2s infinite;

    cursor: pointer;

}



.callback-wrapper {

    position: fixed;

    z-index: 9999999;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    padding: 100px 20px 20px;

    display: none;

}



.cfront-circle {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    background-color: #fff;

    opacity: 0.2;

    border-radius: 100%;

    width: 0px;

    height: 0px;

    animation: breath 2s infinite;

}



.callback-call * {

    cursor: pointer;

}



@keyframes back {

    0% {

        height: 0px;

        width: 0px;

    }

    50% {

        height: 60px;

        width: 60px;

        opacity: 0.4;

    }

    70% {

        height: 120px;

        width: 120px;

        opacity: 0.1;

    }

    100% {

        height: 130px;

        width: 130px;

        opacity: 0;

    }

}



@keyframes ring {

    0% {}

    50% {

        height: 100px;

        width: 100px;

    }

}



@keyframes call {

    0% {}

    2.5% {

        transform: translate(-30%, -50%);

    }

    5% {

        transform: translate(-70%, -50%);

    }

    7.5% {

        transform: translate(-30%, -50%);

    }

    10% {

        transform: translate(-70%, -50%);

    }

    15% {

        transform: translate(-20%, -50%);

    }

    20% {

        transform: translate(-50%, -50%);

    }

    100% {}

}



@keyframes breath {

    0% {}

    50% {

        width: 100px;

        height: 100px;

    }

    100% {}

}



.callback_text_holder {

    margin: 0 auto;

    float: none;

}



.callback_title {

    font-size: 18px;

    line-height: 24px;

    margin-bottom: 20px;

    color: #fff;

    text-align: center;

}



.callback-wrapper-in {

    overflow: auto;

    max-height: 100%;

}



#saveCallback label {

    color: #fff;

    font-weight: normal;

}



.callback_close {

    text-align: right;

    margin-bottom: 20px;

}



@media only screen and (max-width:680px) {

    .callback-wrapper {

        padding: 20px;

    }

}



.callback-call {

    position: fixed;

    z-index: 999998;

    transform: translate(-50%, -50%);

}



.cback-circle {

   background-image: -webkit-gradient(linear, left top, right top, from(#2F5AA6), to(#2560a9));

    background-image: linear-gradient( 

90deg

 , #2F5AA6b8 0, #3775b5bf);}



.callback-call * {

    cursor: pointer;

}



.cback-circle {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    opacity: 0;

    border-radius: 100%;

    animation: back 2s infinite;

    animation-delay: 0.3s;

}



.cbutton {

   background-image: -webkit-gradient(linear, left top, right top, from(#2F5AA6), to(#2560a9));

    background-image: linear-gradient( 

90deg

 , #2F5AA6b8 0, #3775b5bf);}



.callback-call * {

    cursor: pointer;

}



.cbutton {

    position: absolute;

    height: 60px;

    width: 60px;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    border-radius: 75px;

    animation: ring 2s infinite;

}



.cfront-circle {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    background-color: #fff;

    opacity: 0.2;

    border-radius: 100%;

    width: 0px;

    height: 0px;

    animation: breath 2s infinite;

}



.callback-call * {

    cursor: pointer;

}


.btn_text {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    font-size: 24px;

    color: #fff;

    text-align: center;

    font-size: 12px;

    line-height: 16px;

    animation: call 2s infinite;

    cursor: pointer;

    display: none;

}



.callback-wrapper-bg {

   background-image: -webkit-gradient(linear, left top, right top, from(#2F5AA6), to(#2560a9));

    background-image: linear-gradient( 

90deg

 , #2F5AA6b8 0, #3775b5bf);    opacity: 0.8;

    position: absolute;

    left: 0;

    top: 0;

    right: 0;

    bottom: 0;

    z-index: -1;

    opacity: 0.8;

}

.project-card-s5 .content h2 {
    font-size: 25px;
}

.theme-btn img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(1%) saturate(7449%) hue-rotate(218deg) brightness(118%) contrast(94%);
}

.wpo-about-section-s12 .about-right p {
    font-size: 18px;
    line-height: 27px;
}

.about-right p strong {
    font-weight: bold;
    color:#406187
}

@media (min-width: 992px) {
    .wpo-header-style-s5 #navbar ul li a:hover {
        color: #406187;
        opacity: 0.8;
    }
}

.wpo-site-footer {
    background: #f7f7f7;
}

.wpo-site-footer .about-widget p {
    color:#000;
}

.wpo-site-footer .social-widget ul li a {
    color: #406187;
}
.wpo-site-footer .about-widget p {
    font-size: 16px;
}
.wpo-site-footer .widget-title h3 {
    color:#000;
}
.wpo-site-footer li {
    color:#000;  
}

.wpo-site-footer .link-widget ul li a {
    color:#000;
}

.wpo-site-footer .link-widget ul li a:hover {
    color:#406187;
}

.wpo-about-section-s12 {
    border: 1px solid #e3e3e300;
}
.wpo-site-footer .widget-title h3 {
    font-size: 23px;
}
.wpo-site-footer .link-widget ul li {
    font-size: 16px;
}

.wpo-site-footer .wpo-upper-footer {
    padding: 40px 0px;
}
.wpo-site-footer .wpo-lower-footer .copyright {
    font-size: 16px;
}

.wpo-site-footer .wpo-lower-footer .row {
    padding: 20px 0;
    position: relative;
    border-top: 1px solid #31313100;
}

.modal-content {
    position: relative;
    display: flex
;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgb(0 0 0 / 0%);
    border-radius: 0px;
    outline: 0;
}

.intl-tel-input .flag-dropdown .selected-flag {
    margin-top: 8px!important;
    margin-left: 9px!important;
}