@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');
:root{
    --fw-light:300;
    --fw-regular:400;
    --fw-medium:500;
    --fw-bold:700;
    --dark:#111;
    --secondary:#333;
    --space:70px;
    --f20:1.125rem;
    --f24:1.25rem;
    --f30:1.375rem;
    --f36:1.625rem;
}
@media(min-width:768px){
    :root{
        --spac:100px;
        --f20:1.25rem;
        --f24:1.325rem;
        --f30:1.5rem;
        --f36:1.75rem;
    }
    body{
        font-size:16px;
    }     
}
@media (min-width:992px){
    :root{
        --spac:130px;
        --f24:1.5rem;
        --f30:1.625rem;
        --f36:2rem;
    }
}
@media (min-width:1200px){
    :root{
        --spac:150px;
        --f30:1.75rem;
        --f36:2.25rem;
    }
}

html, body{
    height: 100%;
}
body{
    font-family: 'Roboto', sans-serif;
    color:#7E7D7D;
    font-size:16px;
}
[data-aos][data-aos][data-aos-duration="50"],
body[data-aos-duration="50"] [data-aos] {
    transition-duration: 50ms
}

[data-aos][data-aos][data-aos-delay="50"],
body[data-aos-delay="50"] [data-aos] {
    transition-delay: 0
}

[data-aos][data-aos][data-aos-delay="50"].aos-animate,
body[data-aos-delay="50"] [data-aos].aos-animate {
    transition-delay: 50ms
}

[data-aos][data-aos][data-aos-duration="100"],
body[data-aos-duration="100"] [data-aos] {
    transition-duration: .1s
}

[data-aos][data-aos][data-aos-delay="100"],
body[data-aos-delay="100"] [data-aos] {
    transition-delay: 0
}

[data-aos][data-aos][data-aos-delay="100"].aos-animate,
body[data-aos-delay="100"] [data-aos].aos-animate {
    transition-delay: .1s
}

[data-aos][data-aos][data-aos-duration="150"],
body[data-aos-duration="150"] [data-aos] {
    transition-duration: .15s
}

[data-aos][data-aos][data-aos-delay="150"],
body[data-aos-delay="150"] [data-aos] {
    transition-delay: 0
}

[data-aos][data-aos][data-aos-delay="150"].aos-animate,
body[data-aos-delay="150"] [data-aos].aos-animate {
    transition-delay: .15s
}

[data-aos][data-aos][data-aos-duration="200"],
body[data-aos-duration="200"] [data-aos] {
    transition-duration: .2s
}

[data-aos][data-aos][data-aos-delay="200"],
body[data-aos-delay="200"] [data-aos] {
    transition-delay: 0
}

[data-aos][data-aos][data-aos-delay="200"].aos-animate,
body[data-aos-delay="200"] [data-aos].aos-animate {
    transition-delay: .2s
}

[data-aos][data-aos][data-aos-duration="250"],
body[data-aos-duration="250"] [data-aos] {
    transition-duration: .25s
}

[data-aos][data-aos][data-aos-delay="250"],
body[data-aos-delay="250"] [data-aos] {
    transition-delay: 0
}

[data-aos][data-aos][data-aos-delay="250"].aos-animate,
body[data-aos-delay="250"] [data-aos].aos-animate {
    transition-delay: .25s
}

[data-aos][data-aos][data-aos-duration="300"],
body[data-aos-duration="300"] [data-aos] {
    transition-duration: .3s
}

[data-aos][data-aos][data-aos-delay="300"],
body[data-aos-delay="300"] [data-aos] {
    transition-delay: 0
}

[data-aos][data-aos][data-aos-delay="300"].aos-animate,
body[data-aos-delay="300"] [data-aos].aos-animate {
    transition-delay: .3s
}

[data-aos][data-aos][data-aos-duration="350"],
body[data-aos-duration="350"] [data-aos] {
    transition-duration: .35s
}

[data-aos][data-aos][data-aos-delay="350"],
body[data-aos-delay="350"] [data-aos] {
    transition-delay: 0
}

[data-aos][data-aos][data-aos-delay="350"].aos-animate,
body[data-aos-delay="350"] [data-aos].aos-animate {
    transition-delay: .35s
}

[data-aos][data-aos][data-aos-duration="400"],
body[data-aos-duration="400"] [data-aos] {
    transition-duration: .4s
}
[data-aos][data-aos][data-aos-duration="450"],
body[data-aos-duration="450"] [data-aos] {
    transition-duration: .45s
}

[data-aos][data-aos][data-aos-delay="450"],
body[data-aos-delay="450"] [data-aos] {
    transition-delay: 0
}

[data-aos][data-aos][data-aos-delay="450"].aos-animate,
body[data-aos-delay="450"] [data-aos].aos-animate {
    transition-delay: .45s
}

[data-aos][data-aos][data-aos-duration="500"],
body[data-aos-duration="500"] [data-aos] {
    transition-duration: .5s
}

[data-aos][data-aos][data-aos-delay="500"],
body[data-aos-delay="500"] [data-aos] {
    transition-delay: 0
}

[data-aos][data-aos][data-aos-delay="500"].aos-animate,
body[data-aos-delay="500"] [data-aos].aos-animate {
    transition-delay: .5s
}

[data-aos][data-aos][data-aos-duration="550"],
body[data-aos-duration="550"] [data-aos] {
    transition-duration: .55s
}

[data-aos][data-aos][data-aos-delay="550"],
body[data-aos-delay="550"] [data-aos] {
    transition-delay: 0
}

[data-aos][data-aos][data-aos-delay="550"].aos-animate,
body[data-aos-delay="550"] [data-aos].aos-animate {
    transition-delay: .55s
}

[data-aos][data-aos][data-aos-duration="600"],
body[data-aos-duration="600"] [data-aos] {
    transition-duration: .6s
}

[data-aos][data-aos][data-aos-delay="600"],
body[data-aos-delay="600"] [data-aos] {
    transition-delay: 0
}

[data-aos][data-aos][data-aos-delay="600"].aos-animate,
body[data-aos-delay="600"] [data-aos].aos-animate {
    transition-delay: .6s
}

[data-aos][data-aos][data-aos-duration="650"],
body[data-aos-duration="650"] [data-aos] {
    transition-duration: .65s
}

[data-aos][data-aos][data-aos-delay="650"],
body[data-aos-delay="650"] [data-aos] {
    transition-delay: 0
}

[data-aos][data-aos][data-aos-delay="650"].aos-animate,
body[data-aos-delay="650"] [data-aos].aos-animate {
    transition-delay: .65s
}

[data-aos][data-aos][data-aos-duration="700"],
body[data-aos-duration="700"] [data-aos] {
    transition-duration: .7s
}

[data-aos][data-aos][data-aos-delay="700"],
body[data-aos-delay="700"] [data-aos] {
    transition-delay: 0
}

[data-aos][data-aos][data-aos-delay="700"].aos-animate,
body[data-aos-delay="700"] [data-aos].aos-animate {
    transition-delay: .7s
}

[data-aos][data-aos][data-aos-duration="750"],
body[data-aos-duration="750"] [data-aos] {
    transition-duration: .75s
}

[data-aos][data-aos][data-aos-delay="750"],
body[data-aos-delay="750"] [data-aos] {
    transition-delay: 0
}

[data-aos][data-aos][data-aos-delay="750"].aos-animate,
body[data-aos-delay="750"] [data-aos].aos-animate {
    transition-delay: .75s
}

[data-aos][data-aos][data-aos-duration="800"],
body[data-aos-duration="800"] [data-aos] {
    transition-duration: .8s
}

[data-aos][data-aos][data-aos-delay="800"],
body[data-aos-delay="800"] [data-aos] {
    transition-delay: 0
}
[data-aos^=fade][data-aos^=fade] {
    opacity: 0;
    transition-property: opacity, transform
}

[data-aos^=fade][data-aos^=fade].aos-animate {
    opacity: 1;
    transform: translateZ(0)
}

[data-aos=fade-up] {
    transform: translate3d(0, 75px, 0)
}

[data-aos=fade-down] {
    transform: translate3d(0, -75px, 0)
}
[data-aos=fade-right] {
    transform: translate3d(-50px, 0, 0)
}

[data-aos=fade-left] {
    transform: translate3d(50px, 0, 0)
}
[data-aos^=zoom][data-aos^=zoom] {
    opacity: 0;
    transition-property: opacity, transform
}

[data-aos^=zoom][data-aos^=zoom].aos-animate {
    opacity: 1;
    transform: translateZ(0) scale(1)
}

[data-aos=zoom-in] {
    transform: scale(.6)
}
[data-aos=zoom-in-up] {
    transform: translate3d(0, 100px, 0) scale(.6)
}
[data-aos=zoom-out] {
    transform: scale(1.2)
}
[data-aos=zoom-out-up] {
    transform: translate3d(0, 100px, 0) scale(1.2)
}
.fw-light{
    font-weight: 300;
}
.fw-medium{
    font-weight: 500;
}
.fw-bold{
    font-weight: 700;
}
.w-33 {
  width: 33.3333% !important;
}
.sectop{
    margin-top:var(--space);
}
.secbot{
    margin-bottom:var(--space);
}
.dark{
    color:var(--dark);
}
.secondary{
    color:var(--secondary);
}
.f-20{
    font-size:var(--f20);
}
.f-24{
    font-size:var(--f24);
}
.f-30, f-36{
        line-height: 1.2;
}
.f-30{
    font-size:var(--f30);
}
.f-36{
    font-size:var(--f36);
}
a:-webkit-any-link:focus-visible {
    outline:0;
}
.btn-check:active+.btn-outline-dark:focus, .btn-check:checked+.btn-outline-dark:focus, .btn-check:focus+.btn-outline-dark, .btn-outline-dark.active:focus, .btn-outline-dark.dropdown-toggle.show:focus, .btn-outline-dark:active:focus, .btn-outline-dark:focus,.btn-check:focus + .btn, .btn:focus, .btn-dark:active:focus, .btn-dark:focus, .btn:focus, .btn-light:active:focus, .btn-light:focus {box-shadow: none;}

/* header */
header{    
    position: relative;
}
header .header-bg{
    width: 100%;
    height: 100%;
    min-height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
}
.navbar{
    background-color:rgba(51,51,51,.35);
    -webkit-transition: all 2s ease;
      -moz-transition: all 2s ease;
      -ms-transition: all 2s ease;
      transition: all 2s ease;
}
.header_bg .navbar{
    background-color:rgba(51,51,51,.90);
}
@media(max-width:399px){
.navbar-light .navbar-brand img{
    width:235px;
    }}
.navbar-toggler {
    position: relative;
    padding: 0 10px 9px 10px;
    height: 30px;
    border:0;
}
.navbar-toggler .icon-bar {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 1px;
    background-color: #fff
}
.navbar-light .navbar-toggler{
    border: 0;
}
.navbar-toggler:focus{
    box-shadow: none;
}
.navbar-toggler .icon-bar:nth-of-type(2) {
  top: 4px;
}
.navbar-toggler .icon-bar:nth-of-type(3) {
  top: 8px;
}
.navbar-toggler .icon-bar {
  position: relative;
  transition: all 500ms ease-in-out;
}
.navbar-toggler.active .icon-bar:nth-of-type(1) {
  top: 4px;
  transform: rotate(45deg);
}
.navbar-toggler.active .icon-bar:nth-of-type(2) {
  background-color: transparent;
}
.navbar-toggler.active .icon-bar:nth-of-type(3) {
  top: 0px;
  transform: rotate(-45deg);
}

.navbar-light .navbar-nav .nav-link span{
    display: block;
    border-bottom:1px solid transparent;
    padding-bottom: 5px;
    line-height: 1;
}
#home .nav-item.home{display: none}

@media (max-width: 767px) {
  .offcanvas-collapse {
    position: fixed;
    top: 0; /* Height of navbar */
    bottom: 0;
    left: 100%;
    width: 100%;
    padding: 1rem;
    overflow-y: auto;
    visibility: hidden;
    background-color: #343a40;
    transition: transform 0.3s ease-in-out, visibility 0.3s ease-in-out;
  }
  .offcanvas-collapse.open {
    visibility: visible;
    transform: translateX(-100%);
  }
    .navbar-nav{
        margin-top:50px;
    }
    .nav-link{
          font-size:2rem;
        padding:1.5rem 1rem;
        font-weight:300;
        text-align: center;
    }
    .nav-item{
        border-top:1px solid rgba(255,255,255,.1);
    }
      .nav-item:first-child{
        border-top:0;
    }
    .navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus {
        color: rgba(255,255,255,0.4);
    }
    .navbar-light .navbar-nav .nav-link span{
        display: inline-block;
    }
    
}
.navbar-light .navbar-nav .nav-link span{
    position: relative;
}
.navbar-light .navbar-nav .nav-link span:before {
    content: '';
    width: 0;
    height: 1px;
    background: #fff;
    position: absolute;
    bottom: 0;
    left: 0;
    transition: ease all .2s;
}
.navbar-light .navbar-nav .nav-link:hover span:before{
   width: 100%; 
}
.navbar-light .navbar-nav .nav-item.active .nav-link span:before{
    width: 100%;
}


/* home */
.slick-dots {
  display: none !important;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 0 3px;
}
.slick-dots li {
  cursor: pointer;
  float: left;
  width: 33.3%;
  background: #000;
  padding: 0;
  border-right: 1px solid #fff;
}
.slick-dots li:last-child {
  border: none;
}
.slick-dots li, .slick-dots li button {
  outline: none;
}
.slick-dots li button {
  background: #99B386;
  border: none;
  width: 0px;
  height: 10px;
  padding: 0;
  cursor: pointer;
  display: block;
}

.hero-slider .img--holder {
  background-position: bottom center;
  transform: scale(1.1) rotate(0);
  transition: transform 8s linear;
}

.hero-slider .slide-init .img--holder {
  transform: scale(1.1) rotate(0) !important;
  transition: transform 0s linear;
}

.slick-active .img--holder {
  transform: scale(1) rotate(0);
}

.slick-slide .img--holder {
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}

.slick-slide.home-slider .img--holder {
  background-position: bottom center;
}



/* Slider */
.slick-slider
{
    position: relative;

    display: block;
    box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}
.slide1 .img--holder{
    background-image:url(../img/banner-1-mo_WsoWotncm.jpg);
}
.slide2 .img--holder{
    background-image:url(../img/banner-2-mo_VI2zD7uqr.jpg);
}
.slide3 .img--holder{
    background-image:url(../img/banner-3-mo_07n7RP4ac.jpg);
}

@media(min-width:576px){
   .slide1 .img--holder{
    background-image:url(../img/banner-1_9xagSlZw7.jpg);
}
.slide2 .img--holder{
    background-image:url(../img/banner-2_Idr-JJ4PO.jpg);
}
.slide3 .img--holder{
    background-image:url(../img/banner-3_SDacabw7a.jpg);
} 
}
/* project listing */
figure {
  margin: 0;
  display: grid;
  grid-template-rows: 1fr auto;
  margin-bottom: 10px;
  break-inside: avoid;
}

figure > img {
  grid-row: 1 / -1;
  grid-column: 1;
}
.box{
    overflow: hidden;
    position: relative;
}
    .box img{
    transition: all 0.5s ease-out;
}

.box .box-content{
    color: #fff;
    width: 100%;
    padding: 10px;
    position: absolute;
    bottom:0;
    left: 0;
    z-index: 1;
    background: rgba(0,0,0,.4)
}   
.box .title{
    margin: 0;
    line-height: 1.1;
    font-weight: var(--fs-medium);
}
        @media(min-width:992px){
            .box{
                background: linear-gradient(#7E7D7D,#111111);}
            .box .title{
                transform: perspective(200px) rotateX(90deg);
    transform-origin: bottom center;
    transition: all 0.5s ease 0s;
            }
            .box:hover .title{ transform: rotateX(0); }
           .box:hover img{ opacity: 0.2; } 
            .box .box-content{background: transparent; bottom:20px;padding: 0 20px;}
        }

.grid {
   column-count: 2;
  column-gap: 10px;
}
@media(min-width:768px){
 .grid {
   column-count: 3;
  column-gap: 10px;
}   
}
/* project detail */
.project-detail{
            position: absolute; 
            right:18px; 
            top: 70px; 
            width:335px;
        }
 .project-info{
        float:right;
        overflow: hidden;
        background: #fff;
    }
    .project-info-inner{
        width: 300px;
        padding: 30px;
    }
        .project-detail a{
            writing-mode: vertical-lr;
            text-orientation: mixed;
            float: right;
            background: #D9D9D9;
            color:var(--dark);
            text-transform: uppercase;
            padding:10px 5px;
            cursor: pointer;
           min-height: 152px
        }
.project-detail a:hover, .project-detail a:active, .project-detail a:focus {
    color:#767676;
}
.slide-toggle:before, .close-class:before{
            content: '';
        display: inline-block;
        border-left: 1px solid var(--dark);
        line-height: 1px;
        height: 20px;
        background: transparent;
        margin-bottom: 10px;  
        }
        .project-title{
            font-weight: var(--fw-light);
            color:#040832;
            font-size: 1.5rem;
            text-transform: uppercase;
        }
        .project-info-inner li{
            margin-top: 20px;
        }
        .project-txt-head{
            text-transform: uppercase;
            color:#999;
            font-size:.75rem;
            align-items: center;
        }
         .project-txt-head:before{
             content: '';
        display: inline-block;
        border-top: 1px solid #999;
        line-height: 1px;
        width: 20px;
             height: 1px;
        background: transparent;
        margin-right: 10px;
        }
        .project-txt-data{
            color:#222;
            padding-left: 30px;
            margin-top: 5px;
        }

.project-col{
    padding:5px;
}
.project-grid, .content-wrap{
    margin-top: 30px;
}
.backProject{
    display: none;
}
@media(min-width:600px){
.project-grid, .content-wrap{
    margin-top: 50px;
}    
}
@media(max-width:575px){
    .quality-carousel-wrap{display: none;}
}
@media(max-width:767px){
    .project-grid{margin-top:5px;}
    .backProject{
        position: fixed;
        z-index: 1;
        left:0;
        bottom:0;
        width: 100%;
        text-align: center; display: block}
}

/* about */
.highlight-content{
    border: 6px solid var(--secondary);
    font-size:1.5rem;
    padding:20px;
     line-height: 1.1;
    display: inline-block;
}
.highlight-content span{
    font-size:3rem;
}
.about-company-txt{
    padding-top:30px;
}
@media(min-width:576px){
    .highlight-content{    
     padding:20px 40px;  
    }
    .highlight-content span{
    font-size:3.5rem;
}
}
@media(min-width:768px){
    .highlight-content{
         border-width: 13px;
        padding:20px 40px;
        font-size: 2rem;
    }
    .about-company-txt{
        padding-top:33px;
        padding-left:4%;
    }
    .highlight-content span{
    font-size:4.15rem;
}
}
@media(min-width:992px){
    .highlight-content{
       padding:40px 58px;
        font-size:2.25rem;
    }
    .about-company-txt{
    padding-top:53px;
       
}
    .highlight-content span{
    font-size:4.75rem;
}
}
@media(min-width:1400px){
    .highlight-content{
      padding:60px 85px;  
    }
    .about-company-txt{
    padding-top:73px;
}
    .highlight-content span{
    font-size:5.25rem;
}
}

#about-designer{
    background-color:#F2F2F2;
    color:#686868;
    padding-top:calc(var(--space)/2);
    padding-bottom:calc(var(--space)/2)
}
.pdesigner{
    display: flex;
    align-items: center;
}
.pdesigner:before, .pdesigner:after{    
    display: inline-block;
    height: 1px;   
    background:#cdcdcd;    
    position: relative;
    z-index: 1;
}
.pdesigner:before{
    content:'';
     width:20px;
    margin-right: 10px;
}

 
@media(min-width:576px){
    .designer-txt{
    padding-left:4%;
}

}
@media(min-width:992px){
   .designer-txt{
    padding-left:3%;
} 
    .pdesigner:after{
    content:'';   
    width:225px;
    margin-left: 10px;
}
    .pdesigner:before{
        display: none
    }
       .pdesigner{
   width: 400px;
    margin-top:18px;
    }
}
@media(min-width:1200px){
   .designer-txt{
    padding-left:4%;} 
}
@media(min-width:1400px){
   .designer-txt{
    padding-right:8%;
    padding-left:inherit;} 
    .pdesigner{
        margin-top: 16px;
    }
}
.designer-txt{
    padding-top:50px;
}
.quality-carousel-wrap {
    position: absolute;
    bottom: 0;
    width: 100%;
}
.quality-carousel {
  padding-bottom: 0;
  overflow: hidden;
}

.quality-carousel .item-wrap {
  transform: translateX(0px);
  width: 100%;
  position: relative;
  white-space: nowrap;
  display: flex;
    
}

.item { 
  text-align: center;
  display: flex;
  flex: 1;
    color:rgba(255,255,255,.3);
  justify-content: center;
  align-items: center;
    font-size:6.5rem;
    margin-right:100px;
    font-weight: var(--fw-bold);
    line-height: 1;
}
#grouploop-2 .item {
        margin-right:150px;
        }
#grouploop-3 .item {
        margin-right:50px;
        }
@media (min-width: 768px) {
    .item { 
       font-size:9rem; 
    }
    .quality-carousel .item-wrap { width: 200%; }
     .quality-carousel-wrap {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%)
    -ms-transform: translateY(-50%)
    transform: translateY(-50%)}
    #grouploop-2 .item {
        margin-right:250px;
        }
#grouploop-3 .item {
        margin-right:100px;
        }

}
@media(min-width:992px){
    .team-txt{padding-right:0}
}


/* contact */
.form-section{
    border-radius:10px; box-shadow:0 0 15px rgba(0,0,0,.2);
}
.form-control:focus{
    box-shadow: none;
    border:1px solid #000;
}
.error{
    font-size:.75rem;
    color:#ff0000;
    display: block;
}
.career-section-wrap{
    background:#000; border-radius: 0  0 10px 10px ; color:#fff; position: relative;height: 100%;}
.career-section-wrap, form{
    padding:2.2rem 1.5rem;
}
.career-section-wrap h4{
    font-weight:400; letter-spacing:0.02em}
.career-section p{
    line-height:1.6; letter-spacing:0.03em
}
@media(min-width:576px){
    form,  .career-section-wrap{
    padding:3rem}
}
@media(min-width:992px){
    .career-section-wrap{
    border-radius:0 10px 10px 0; }
}

/* footer */
.noinfo{display: none;}
#contact-section{
    background:#fff url(../img/contact-bg-992_xg-Pwi_Zo.jpg) no-repeat 0% 100%;
    padding-top:60px;
       background-size: 100%;
    min-height: 300px;  
}
.contact-btn{
    border-color:#cdcdcd;
    color:#111;
    border-radius: 0.2rem;
    font-weight: var(--fw-light);
    text-transform: uppercase;
}
.btn-outline-dark:active{
    color:#111;
}
.contact-btn:hover{
    background:#111!important;
    color:#fff;
}
.submit-btn:hover{
    background: #fff;
    color:#111;
    border-color:#111;
}
.join-us:hover{
   background:#111;
    color:#fff;
    border-color:#fff;
}
@media(min-width:768px){
    #contact-section{
     min-height: 400px;      
    }
}
@media(min-width:992px){
    #contact-section{
        background-image: url(../img/contact-bg_syITzeHi7.jpg);   
    }
}
@media(min-width:1440px){
    #contact-section{
        background-image: url(../img/contact-bg-1920_MmuTLQWLg.jpg);    
    padding-top:127px;
     background-size: 100%;   
    }
}
@media(min-width:1920px){
    #contact-section{
        height: 484px;
         padding-top:250px;
    }
}
@media(min-width:2560px){
    #contact-section{
         padding-top:350px;
        height: 650px;
    }
}
.footer-bottom{
    background:#111;
    color:#fff;
    font-size:.875rem;
    padding-top:1.5rem;
    padding-bottom:1.5rem;
}
.footer-bottom .flogo{
    width:230px;
}
@media(min-width:1440px){
 .footer-bottom .flogo{
    width:260px;
}   
}
@media(max-width:767px){
    footer{
        z-index: 2;
        position: relative;
    }
    .footer-widget{
        margin-bottom: 1.5rem;
        text-align: center;
    }
    .social-list{
        justify-content: center;
    }    
}
.footer-bottom h4{
    font-size:1rem;
    font-weight: var(--fw-regular);
    margin-bottom: .75rem;
}
.footer-bottom a, .footer-bottom address{
    color:rgba(255,255,255,.50)
}
.footer-bottom a:hover{
    color:rgba(255,255,255,.65)
}
.connect li:first-child{
    margin-bottom: .5rem;
}
.social-list li{
    margin-left: 10px;
}
.social-list li:first-child{
    margin-left: 0;
}
.social-list li svg{
    fill:rgba(255,255,255,.35);
    border-radius: 3px;
}
.social-list li svg:hover{
    fill:rgba(255,255,255,.65);
}
@media(max-width:319px){
    .social, .connect{
        width:100%;
    }
}
.copyright{
    background-color:#333333;
    color:rgba(255,255,255,.50);
    font-size:.75rem;
    padding:.5rem 1rem; 
}


/* Hover Animation Consistency */
a,
button,
input[type="submit"] {
  transition: all 0.3s ease-in-out;
}

a:hover,
button:hover,
input[type="submit"]:hover {
  opacity: 0.85;
  transform: scale(1.02);
}