
@font-face {
    font-family: 'MontserratRegular';
    src: url('../fonts/MontserratRegular.eot');
    src: url('../fonts/MontserratRegular.eot') format('embedded-opentype'),
         url('../fonts/MontserratRegular.woff2') format('woff2'),
         url('../fonts/MontserratRegular.woff') format('woff'),
         url('../fonts/MontserratRegular.ttf') format('truetype'),
         url('../fonts/MontserratRegular.svg#MontserratRegular') format('svg');
}

@font-face {
    font-family: 'MontserratBold';
    src: url('../fonts/MontserratBold.eot');
    src: url('../fonts/MontserratBold.eot') format('embedded-opentype'),
         url('../fonts/MontserratBold.woff2') format('woff2'),
         url('../fonts/MontserratBold.woff') format('woff'),
         url('../fonts/MontserratBold.ttf') format('truetype'),
         url('../fonts/MontserratBold.svg#MontserratBold') format('svg');
}

@font-face {
    font-family: 'MontserratSemiBold';
    src: url('../fonts/MontserratSemiBold.eot');
    src: url('../fonts/MontserratSemiBold.eot') format('embedded-opentype'),
         url('../fonts/MontserratSemiBold.woff2') format('woff2'),
         url('../fonts/MontserratSemiBold.woff') format('woff'),
         url('../fonts/MontserratSemiBold.ttf') format('truetype'),
         url('../fonts/MontserratSemiBold.svg#MontserratSemiBold') format('svg');
}
@font-face {
    font-family: 'MontserratMedium';
    src: url('../fonts/MontserratMedium.eot');
    src: url('../fonts/MontserratMedium.eot') format('embedded-opentype'),
         url('../fonts/MontserratMedium.woff2') format('woff2'),
         url('../fonts/MontserratMedium.woff') format('woff'),
         url('../fonts/MontserratMedium.ttf') format('truetype'),
         url('../fonts/MontserratMedium.svg#MontserratMedium') format('svg');
}
@font-face {
    font-family: 'ZurichBoldExtraCondensedBT';
    src: url('../fonts/ZurichBoldExtraCondensedBT.eot');
    src: url('../fonts/ZurichBoldExtraCondensedBT.eot') format('embedded-opentype'),
         url('../fonts/ZurichBoldExtraCondensedBT.woff2') format('woff2'),
         url('../fonts/ZurichBoldExtraCondensedBT.woff') format('woff'),
         url('../fonts/ZurichBoldExtraCondensedBT.ttf') format('truetype'),
         url('../fonts/ZurichBoldExtraCondensedBT.svg#ZurichBoldExtraCondensedBT') format('svg');
}


body{font-family: 'MontserratRegular'; color:#1A1A18; font-size: 18px;}
a{ color: #EF7C00; text-decoration: none;}
a:hover{ color:#1A1A18}
b{ font-family: 'MontserratSemiBold';}
.btn{ font-weight: 500;}
.font-18{ font-size: 1.125rem;}
.font-12{ font-size: .75rem;}
.font-14{ font-size: .875rem;}
.font-20{ font-size: 1.25rem;}
.font-24{ font-size: 1.5rem;}
.font-weight-300{ font-weight: 300;}
.font-weight-400{ font-weight: 400;}
.font-weight-600{font-weight: 600;}
h3{ font-weight: 700; color:#33358C}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    line-height: 1.0; font-family: 'ZurichBoldExtraCondensedBT';
}
nav{ font-family: 'ZurichBoldExtraCondensedBT'; text-transform: uppercase; font-size: 28px;}
.darkHeader{ background-color: #1A1A18;}
.orange-text{ color:#EF7C00}
.carousel-caption{color:#1B1B28;}
header{box-shadow: 0px 3px 6px #00000029; position: relative; z-index: 10000;}
.header-top{ background-color: #053d67; min-height: 43px;}
.headerbtn{min-width: 120px;
    background: #EF7C00;
    padding: 10px;
    /* box-shadow: 0px 3px 6px #00000029; */
    /* border: 1px solid #FFFFFF; */
    border-radius: 0;
    color: #ffffff;
    font-size: 28px;
    padding-top: 5px;
    padding-bottom: 5px;
    height: auto;}
.headerbtn:hover{ border-color:#ffffff!important; background-color: #ffffff;; color:#EF7C00}
.nav-link{ color:#ffffff; font-weight: 500;}
.nav-link:hover, .navbar-nav .nav-link.active, .navbar-nav .show>.nav-link{ color:#EF7C00;}
.orangebg{    background: #EF7C00;
    padding-left: 10px;
    padding-right: 10px;}
.btn-primary{ background: #24A0FB; padding-left:30px; padding-right:30px}
.btn-round{ border-radius:25rem}
.btn-outline-outside:before {content: ""; border: 1px solid #0A043C; border-radius: 10px; width: 100%; height: 100%; position: absolute; left: -4px; top: -4px;}
.btn-grey{    background: #e5e5f0; border: 1px solid #80a1dd; border-radius: 20px; padding: 25px 60px; color: #33358C; font-weight: 600;}
.btn-grey:hover{    background: #33358C; color: #ffffff; border-color:#33358C}

.btn-outline{background: #ffffff; border-color: #094DBC; color: #094DBC;}
.btn-primary:hover{ background-color: #33358C; border-color: #33358C}

.headersocial img{ width: 24px; margin-left: 5px;}

.carousel-item{height: 100vh; background:#F7FAFF linear-gradient(90deg, #F7FAFF 20.97%, rgba(247, 247, 253, 0) 91.7%); }
.mainslider .carousel-caption{    height: 100%; display: flex; flex-direction: column; justify-content: end; bottom: auto; top: 0px; width: 100%; left: 0px; padding-bottom: 170px;}
.mainslider .carousel-caption h1{ font-weight: 700; line-height: 60px; color: #ffffff; font-family: 'ZurichBoldExtraCondensedBT'; font-size: 50px; text-align: center; margin-bottom: 10px;}
    .mainslider .carousel-caption h4   {font-family: 'MontserratRegular'; color: #ffffff; text-align: center; font-size: 25px;}
.mainslider .carousel-caption p{     font-size: 1rem; font-weight: 400; padding-top: 10px; color: #23496B; line-height: 27px;}
.sm-head{ color: #25B0E5;position: relative; display: flex; align-items: center;}
.sm-head hr{background: #25B0E5; width: 80px; height: 1px;  opacity: 1; margin-left: 20px;}
.carousel-caption .btn-white{    background: none;
    border: 4px solid #ffffff;
    border-radius: 0px;
    color: #ffffff;
    font-size: 24px;
    margin-top: 20px;
    font-family: 'ZurichBoldExtraCondensedBT';
    text-transform: uppercase;
    padding-left: 30px;
    padding-right: 30px;}
    .carousel-caption .btn-white:hover{ background-color: #EF7C00;}

.btn-white{ background: #ffffff; color:#094DBC;}
.banner-btn{  margin-top: 10px;}
.btn-lg{ font-size: 1.125rem; font-weight: 500; height: 48px; min-width: 200px; max-width: 200px; display: flex; justify-content: center; align-items: center; line-height: 0px; border:none;}
.card .btn-lg{font-size: 1rem; height: 50px; min-width: 180px; max-width:180px;}
.heading{    font-size: 2.7rem; font-weight: 600; position: relative; margin-bottom: 30px; text-transform: uppercase;}
.no-radius{ border-radius: 0px;}
.icon{width: 72px; height: 72px; background: rgba(0, 0, 0, .20); text-align: center; display: flex; align-items: center; justify-content: center; font-size: 42px; border-radius: 10px; margin-right: 15px;}
.btn-orange-outline{    background: none;
    border: 4px solid #EF7C00;
    border-radius: 0px;
    color: #EF7C00;
    font-size: 24px;
    margin-top: 20px;
    font-family: 'ZurichBoldExtraCondensedBT';
    text-transform: uppercase;
    padding-left: 30px;
    padding-right: 30px;}
.bg-dark{ background-color: #3B3B3A;}
.learn-more{font-family: 'ZurichBoldExtraCondensedBT'; font-size: 24px;}

.subheading{ font-size: 2.7rem; margin-bottom: 20px; font-weight: 700;}
.subheading-2{ font-size: 2.2rem;}
.subheading small, h3 small{font-weight: 500; font-size: .7em;}
.our-clients .card{height: 100%; display: flex; align-items: center; justify-content: center; padding-top: 2px; padding-bottom: 2px;}
.our-clients div[class*='col'], .video-services div[class*='col'], .featured-video div[class*='col']{ margin-bottom: 25px;}
.headingcaption{ font-family: 'MontserratRegular';}
.video-services{ background-color: #EF7C00;}
.video-service-card{ padding: 50px 30px; height: 100%;}

.section-padding{ padding-top: 70px; padding-bottom: 70px;}
.inner-section-padding{ padding-top: 70px; padding-bottom: 70px;}
/*.inner-section-padding{ padding-top: 100px; padding-bottom: 100px;}*/

.custom-form .form-control{background: #ECECED; border-radius: 0px; padding:10px}


footer.bg-dark{ background: #0C245A!important; color:#ffffff}
footer b{ font-weight: 500;}
footer li a{text-decoration: none; color: #ffffff; font-weight: 300; padding-top: 5px; padding-bottom: 5px; display: block;}
footer li a:hover, .color-orange{ color:#EB8455}
footer h6{ margin-bottom: 15px;}
.no-bg{ margin-top: -4px;}

.inner-banner{min-height: 300px;
    display: flex;
    align-items: center; color:#ffffff; padding-top: 120px;}

.portfolio-heading{ background-color: #f0801a;}

.divider:after, .divider:before { content: ""; flex: 1; height: 1px; background: #eee;}
.loginsignup-form input.form-control{border: 1px solid #D7D7D7; border-radius: 6px; font-size: 16px; height: 48px; padding-left: 20px; padding-right: 20px;}
.loginsignup-form .btn{height: 48px;}
.loginsignup-form a{ text-decoration: none;}

#form:after{ content: ""; background: url(../images/right-arrow.png) no-repeat left bottom;  width: 147px; height: 294px; position: absolute; bottom: 80px; left: 0px;}
#form:before{content: ""; background: url(../images/left-arrow.png) no-repeat left top;  width: 147px; height: 294px; position: absolute; top: 80px; right: 0px;}

.breadcrumb-area .breadcrumb-item+.breadcrumb-item::before { color:#ffffff}
.green{ color:#009D4F}
.bid-box{border: 1px solid #EBEBEB; padding: 30px; border-radius: 8px;}
.bid-details:after {content: ""; width: 40px; height: 3px; background: #EB8455; position: absolute; left: 0px; bottom: -10px;}
.bid-search .form-control{ height: 48px; border:1px solid #D7D7D7}
.iframevideo{ width: 100%; height: 200px;}
.iframevideo-300{ height: 300px;}

.inner-header{    background-color: #1A1A18;}


.mainslider{background: rgba(0, 0, 0, .6);}
.ratio {
    position: relative;
    width: 100%;
    /* padding-top: calc(16/9*100%); */
    padding-top: 56.25%;
    z-index: 1; margin-top: -75px; pointer-events: none;
  }
  
  .vimeo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    z-index: -1; pointer-events: none;
  }
  .changebox{
    margin: 0 5px;
    color: #FF5722;
    overflow: hidden;
    transition: .5s;
    white-space: nowrap; background: #EF7C00; /* width: 320px!important; */ margin-left: 20px;
 }
 .changebox span{font-size: 60px;
    text-align: center; color:#ffffff; padding-left: 20px; padding-right: 20px; height: 100%; display: flex; align-items: center; justify-content: center; margin-top: 5px;}
 
    .orange-sec-bg{ background-color: #ef7c00;}
    .bottom-arrow:after {
        content: "";
        position: absolute;
        width: 0;
        height: 0;
        border-left: 25px solid transparent;
        border-right: 25px solid transparent;
        border-top: 25px solid #ef7c00;
        font-size: 0;
        line-height: 0;
        float: left;
     
        margin-top: 24px;
    }

.iconwithbg{ padding-left: 80px!important; padding-right:80px!important}
    .iconwithbg:before{content: "";
    width: auto;
    height: 115px;
    position: absolute;
    background: url(../images/listen.png);
    background-repeat: no-repeat;
    background-position: right top;
    left: 0px;
    right: 25px;
    top: -15px;
    background-size: contain;
} 

.probg:before{background: url(../images/production.png) no-repeat right top; background-size: contain;}
.preprobg:before{background: url(../images/pre-production.png) no-repeat right top; background-size: contain;}
.ideatebg:before{background: url(../images/ideate.png) no-repeat right top; background-size: contain;}

.inner-banner-with-image{ padding-top: 0px; min-height: 500px; padding-top: 80px;  background-size: cover!important;}
.social-media-videos-banner{ background: url(../images/social-media-video-banner.jpg) no-repeat left top;}
.get-quote-banner{ background: url(../images/get-a-quote-bg.jpg) no-repeat left top;}



@media (min-width: 1400px){
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1200px;
    }
}

@media (min-width: 1920px){
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1400px;
    }
}



@media screen and (max-width:992px){
    body{ font-size: 16px;}
    .navbar-brand img{ max-width: 170px;}
    .navbar, .headerbtn{font-size: 24px;}
 
    .nav-link.px-3{ padding-left:.5rem!important; padding-right:.5rem!important}
    .navbar-nav.mb-2{ margin-bottom: 0px!important;}
    .carousel-item{ height: 100vh;}
    .mainslider .carousel-caption h1, .changebox span{ font-size: 3.5rem; line-height: 2.85rem; flex-direction: inherit;}
 .bannerimage{    background-size: cover!important; background-position: center top 0px!important;}
    #aboutus {min-height: 300px; background-size: contain;}
    .section-padding {padding-top: 100px; padding-bottom: 100px;}
    .inner-section-padding {
        padding-top: 70px;
        padding-bottom: 70px;
    }
    .ratio{ margin-top: 0px;}
    .mainslider .carousel-caption{ padding-bottom: 60px;}


}

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

    .navbar-toggler-icon{background-image: url(../images/menu.png);}
    .navbar-toggler{border: none;}
    .navbar-toggler:focus{ box-shadow:none}
    .navbar {
        background-color: #1A1A18;
    }
    .ratio{ margin-top: 62px;}
    .border-bg::after, .border-bg::before{ display: none;}
    .navbar-brand img{    max-width: 250px;}
    .navbar .container{ flex-direction: row;}
    .mainslider .carousel-caption{ padding-right: 0px; background: rgba(255, 255, 255, .7); width: 100%; padding-bottom:0px; padding-left: 15px; padding-right: 15px;}
    .my-5 {
        margin-top: 2rem!important;
        margin-bottom: 2rem!important;
    }
    .mainslider .carousel-caption h4 {
        font-size: 16px;
    }
    .section-padding {
        padding-top: 65px;
        padding-bottom: 65px;
    }
    .carousel-item:before {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, .65);
    }
    .subheading{font-size: 1.75rem;}
    /*.d-none-mobile{ display: none;}*/
    footer .col-md-2.pt-4{ padding-top: 0px!important; margin-top: -16px;}
   
    .nav-link.px-3 {padding-left: 0rem!important; padding-right: 0rem!important;    }
    .navbar-nav.mb-2{ padding-top: 15px; padding-bottom: 10px;}
     .bannerimage{background-position:center!important; background-size: contain;}
    .mainslider .carousel-caption h1, .changebox span {font-size: 1.5rem; margin-bottom: 0px;
        line-height: 3.2rem;}
        .changebox{ width: 100%!important;}
    .mainslider .carousel-caption p {font-size: 1rem; font-weight:500; padding-top: 10px; padding-right: 15px;}
    .heading {    font-size: 2.5rem;}
.about-us .row{    flex-direction: column-reverse;}
.about-us img{ margin-bottom: 30px;}
  
    footer .col-md-4{ margin-bottom: 30px;}
    footer .col-md-3.ps-5{ padding-left: 12px!important; margin-left: 0px!important;}
    .form-box{ width: 100%;}
    .heroimage .heading.mt-4{ margin-top: 0px!important;}
    .innerbanner{ background-position: left -420px top;}
    .iframevideo{ width: 100%; height: 200px;}

    /*.mainslider{ display: none;}*/
    .font-24 {
        font-size: 1.25rem;
    }
    .w-75 {
        width: 100%!important;
    }
    .iconwithbg {
         padding-left: 20px!important;
         padding-right: 20px!important;
    }
    .iconwithbg:before{ height: 92px; top:-32px}
    .bottom-arrow:after{ left: 45%;}
    .video-right .row{ flex-direction: column-reverse;}
    .iframevideo{ margin-bottom: 30px;}
    .inner-section-padding {
        padding-top: 30px;
        padding-bottom: 30px;
    }
 
}
