html,body
{
    padding: 0px;
    margin:0px;
    font-family: "BPG WEB 001", sans-serif;
}

button, input, optgroup, select, textarea{
    font-family: "BPG WEB 001", sans-serif;
}
#banner_section{
    background-image: url("../images/banner.jpg");
    background-size:auto ;
    background-repeat: no-repeat;
    background-position: center bottom;
}
header
{
    height: 120px;
    padding-top: 24px;;
}
header nav{padding-top:0px;}

.dropdown-toggle:after{
    display: none;
}
.langs .dropdown-menu{
    border-radius: 0px;
    transition: 0.3 ease;
}
.langs .btn:focus{
    box-shadow: none;
}
.langs .dropdown-menu a:hover{
    background-color: transparent;
    color: #ffa801;
}

/*  dropdown */
.dropbtn {

}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #ffffff;
    min-width: 135px;
    border:1px solid #ccc;
    z-index: 1;
    padding:10px;
    text-align: left;
}

.dropdown-content a {
    color: #9aa1ab;
    font-size: 12px;
    padding: 4px 10px;
    text-decoration: none;
    display: block;
    transition: 0.3s;
    border:0px;
}

.dropdown-content a:hover{
    color:#ffa801;
}
.dropdown:hover .dropdown-content {display: block;}

.dropdown:hover .dropbtn {color:#ffa801;}

/*  dropdown */

.langs .btn,.langs a{font-size: 14px; color:#9aa1ab; font-family: 'BPGWEB001';}
.langs .dropdown-menu{min-width: auto;}


/* new navbar  */

.site-logo:active,.site-logo:focus,.site-logo:hover{
    color:#000;
}
/* navigation start */
.site-nav{
    float:right
}
.site-main-nav .active>a{color:#3e3e3e;}
.site-mobile-menu-active .site-nav{
    text-align:center;
    position:fixed;/*
    display:block!important;*/
    overflow-y:auto;
    top:0;
    right:0;
    bottom:0;
    z-index:1100;
    height:100%;
    width:50%;
    background:rgba(255,255,255,0.5);
    /*filter: blur(2px);*/
    -webkit-backdrop-filter: blur(30px);
    backdrop-filter: blur(30px);
    padding:40px;
    -webkit-transition:.3s all ease-out;
    transition:.3s all ease-out;
    -webkit-transform:translateX(300px);
    transform:translateX(300px)
}
.site-mobile-menu-active .mobile-langs{
    position:absolute;
    bottom:36px;
    margin-left:auto;
    margin-right:auto;
    left:0px;
    right:0px;
    font-size: 14px;
    font-family: 'BPGArial';
}
.site-mobile-menu-active .mobile-langs a{
    color:#535353;
    transition: 0.3 ease;
    padding-right:15px;
}
.site-mobile-menu-active .mobile-langs a:hover{
    color:#ffa801;
    text-decoration: none;
}
.site-mobile-menu-active .site-nav .extra-text{
    display:block;
    float:left;
    clear:both;
    margin-top:30px;
    columns: #3e3e3e;;
}
.site-mobile-menu-active .site-nav .extra-text .social-buttons{
    padding:0;
    margin:0 0 20px
}
.site-mobile-menu-active .site-nav .extra-text .social-buttons li{
    display:inline-block;
    zoom:1;
    padding:0;
    margin:0;
}
.site-mobile-menu-active .site-nav .extra-text .social-buttons li a{
    color:#9aa1ab;
    padding:10px;

}

.site-mobile-menu-active.show .site-nav{
    -webkit-transform:translateX(0);
    transform:translateX(0)
}
.site-main-nav{
    margin:0;
    padding:0;
    margin-top:20px;
}
.site-mobile-menu-active .site-main-nav{
    float:left;
    margin-top:40px;
    width:100%;
}
.site-main-nav li{
    margin:0;
    list-style:none;
    display:inline;
    font-size:14px
}
.site-mobile-menu-active .site-main-nav li{

    display:block
}
.site-main-nav li>a{
    font-size: 14px;
    border-right: 1px solid rgba(154,161,171,0.5);
    font-family: 'BPGWEB001';
    color: #9aa1ab;
    padding: 9px 38px;
    transition: 0.3 ease;
    text-decoration: none;
}
.dropdown-content a{
    border-right:0px;
}
.site-main-nav li a:hover{
    color:#ffa801;
}
.site-mobile-menu-active.show .site-main-nav li a{
    color: #3e3e3e; border-right:0px;
}
.site-mobile-menu-active .site-main-nav li a{
    margin-bottom:10px;
    padding:5px 0;
    display:block;
    border-bottom:none!important
}
.site-mobile-menu-active .site-main-nav li a:hover{
    color:#ffa801;
}
.site-main-nav li.site-cta{
    margin-left:20px
}
.site-main-nav li.site-cta a{
    color:#ffa801;
}
.site-main-nav li.site-cta a:hover{
    color:#ffa801;
    text-decoration: none;
}
.site-mobile-menu-active .site-main-nav li.site-cta{
    margin-left:0;
    margin-top:20px
}
.site-mobile-menu-active .site-main-nav li.site-cta a{
    padding-top:2px;
    padding-bottom:2px
}
.site-mobile-menu-active .site-main-nav li.active a{
    color:#ffa801;
}
.mobile-menu-overlay{
    z-index:1099;
    position:fixed;
    top:0;
    bottom:0;
    left:0;
    right:0;
    width:100vw;
    height:100vh;/*
    background:rgba(0,0,0,.6);*/
    opacity:0;
    visibility:hidden;
    -webkit-transition:.3s all ease-out;
    transition:.3s all ease-out
}
.site-mobile-menu-active.show .mobile-menu-overlay{
    opacity:1;
    visibility:visible
}
.site-text-intro{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    z-index:49
}
.site-burger-menu{
    display:inline-block;
    width:23px;
    height:23px;
    cursor:pointer;
    text-decoration:none
}
.site-burger-menu i{
    position:relative;
    display:inline-block;
    width:18px;
    height:2px;
    color:#000;
    font:700 14px/.4 Helvetica,arial;
    text-transform:uppercase;
    text-indent:-55px;
    background:#000;
    -webkit-transition:all .2s ease-out;
    transition:all .2s ease-out
}
.site-burger-menu i::after,.site-burger-menu i::before{
    content:'';
    width:18px;
    height:2px;
    background:#000;
    position:absolute;
    left:0;
    -webkit-transition:all .2s ease-out;
    transition:all .2s ease-out
}
.site-burger-menu i::before{
    top:-7px
}
.site-burger-menu i::after{
    bottom:-7px
}
.site-burger-menu:hover i::before{
    top:-10px
}
.site-burger-menu:hover i::after{
    bottom:-10px
}
.site-burger-menu.active i{
    background:0 0;
    right:25px;
}
.site-burger-menu.active i::before{
    top:0;
    -webkit-transform:rotateZ(45deg);
    transform:rotateZ(45deg)
}
.site-burger-menu.active i::after{
    bottom:0;
    -webkit-transform:rotateZ(-45deg);
    transform:rotateZ(-45deg)
}
.site-mobile-menu-active.show .site-burger-menu i{
    color:#9aa1ab;
}
.site-mobile-menu-active.show .site-burger-menu i::after,.site-mobile-menu-active.show .site-burger-menu i::before{
    background:#3e3e3e;
}
.site-burger-menu{
    position:absolute;
    top:30px;
    right:20px
}
/* new navbar  */

.section-title{
    color: #ffa801;
    font-family: 'ArchyEDT-Bold';
    font-size: 44px;
}
#collaborative .section-title{
    color:#3e3e3e;
}
.card-container{
    border:1px solid #3e3e3e;
    padding-left:26px
}
.card-img-top{
    border-radius: 0px;
}
.card-title{
    background-color:#3e3e3e;
    color:#fff;
    text-align:right;
    height: 36px;
    padding-right:18px;
    padding-top:5px;
    margin-left:12px;
    line-height: 22px;
    font-family: ArchyEDT;
    font-size:18px;
    margin-bottom: 50px;
}
.card-text{
    font-size: 12px;
    line-height:16px;
    font-family:'BPGWEB001';
    color:#9aa1ab;
    padding:28px 24px 76px 0;
}
.card{
    border-radius: 0px;
    border:0px;
}

.indicators-row{
    height: 150px;
    margin-top:10px;
}

#projects_section .carousel-indicators{
    margin:0px;
}
.carousel-indicators li{
    width:25%; height: 130px; opacity: 1;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    margin-right:10px;
}
.carousel-indicators .active{/*
    border:1px solid #ffa801;*/
}
.vrtc{
    width:1px;
    height: 30px;
    background:#9aa1ab;
    margin-top:5px;
}
.hor{
    width:60px;
    height: 1px;
    background:#9aa1ab;
}
.carousel-control-prev,.carousel-control-next{
    color:#9aa1ab; font-family: 'BPGWEB001'; font-size: 14px; opacity: 1;
}
.carousel-control-prev:hover,.carousel-control-next:hover{
    color:#9aa1ab;
}
.carousel-control-prev:focus,.carousel-control-next:focus{
    color:#9aa1ab;
}
.carousel-indicators .read-more{width: 25%; height:130px; position: relative;}
.carousel-indicators .read-more div{

    position: absolute;
    top:0px; left: 0px;
    width: 100%; height: 100%;
    z-index: 2;
    background-color:rgba(255,255,255,0.8);
}
.carousel-indicators .read-more p{
    position: absolute;
    z-index: 3;
    right: 20px;
    bottom:30px;
    font-family: 'BPGWEB001';
    font-size: 14px;
    color:#9aa1ab;
}
.carousel-indicators .read-more p a{
    text-decoration: underline;
    color:#9aa1ab;
}
#materials_section{
    background:#f5f0ed;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active{
    background:none;
    border:0px;
    color:#ffa801;
    border-bottom: 1px solid #ffa801;
}

.gallery-tabs .active a{color:#ffa801; }
.gallery-tabs .nav-link{
    font-family: 'BPGWEB001';
    line-height: 1.21;
    color:#9aa1ab;
    font-size: 14px;
    transition: 0.3s ease;
    border-radius: 0px;
    border:0px;
}
.gallery-tabs ul li a:hover{
    color:#ffa801;
    border:0px;
    border-bottom: 1px solid #ffa801;
}
.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover{
    border:0px;
    border-bottom:1px solid #ffa801;
}
.gallery-tabs .nav-item{
    border:0px;
    border-radius:0px;

}
.gallery-tabs .nav-tabs{border:0px; margin:auto;}

.section-title-small{
    color:#9aa1ab;
    font-family: 'BPGWEB001';
    font-size:14px;
    padding-left:30px;
    transition: 0.3 ease;
}
#map_section{
    position: relative;
}
footer{
    position: absolute;
    bottom:50px;
    height: 40px;
    background-color: #ffa801;
    color: #fff;
    width: 100%;
    padding:9px;
}
footer img{
    margin-left: 12px;;
}
#map{
    height:100%;
}
#content {
    background-image:url(../images/union.png);
    background-position: top;
    background-repeat: no-repeat;
    padding-left:0px;
    border: 0px solid #ffa801;
    width:273px;
    height: 198px;
    border-radius: 0px;
    box-shadow: none;
}
#content .hr1{
    width: 20px;
    border:1px;
    height: 1px;
    border-top:1px solid #ffa801;
    margin-right:13px;
    margin-left:1px;
}
#content p{margin-top:23px;}
#content div{display:inline-block; font-size:12px; padding-top:5px; color:#3e3e3e; font-family: 'BPGWEB001';}
/* The popup bubble styling. */
.popup-bubble {
    /* Position the bubble centred-above its parent. */
    position: absolute;
    top: 0;
    left: 0;
    transform: translate(-104%, -130%);
    /* Style the bubble. */
    font-family: sans-serif;
    overflow-y: auto;
}
/* The parent of the bubble. A zero-height div at the top of the tip. */
.popup-bubble-anchor {
    /* Position the div a fixed distance above the tip. */
    position: absolute;
    width: 100%;
    bottom: /* TIP_HEIGHT= */ 8px;
    left: 0;
}
/* This element draws the tip. */
.popup-bubble-anchor::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    /* Center the tip horizontally. */
    transform: translate(-50%, 0);
    /* The tip is a https://css-tricks.com/snippets/css/css-triangle/ */
    width: 0;
    height: 0;
    /* The tip is 8px high, and 12px wide. */
}
/* JavaScript will position this div at the bottom of the popup tip. */
.popup-container {
    cursor: auto;
    height: 0;
    position: absolute;
    /* The max width of the info window. */
    width: 200px;
}

/* fancybox  */
#fancybox-loading, .fancybox-close{
    background-image: url(../images/close.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size:14px 14px;
    width: 14px; height: 14px;
    right:0px; top:-20px;
}
.fancybox-next span{
    background-image: url(next.png);
}
.fancybox-opened .fancybox-title{
    display: none;
}
.fancybox-custom .fancybox-skin{box-shadow: none; background:transparent;}
#fancybox-buttons ul{
    width:20%;
}

#contact_us{
    height:530px;
    background-image:url(../images/mozaik.png);
    background-position: left top;
    background-repeat: no-repeat;
    background-color:#3e3e3e;
}

.about_us_banner{
    height:635px;
    background-image:url(../images/about_us_banner.png);
    background-position:center;
    background-size:100%;
    background-repeat: no-repeat;
}
.about-us-content{
    height: 560px;
    background:rgba(255,255,255,0.95);
    margin-top:75px;
    padding:47px 36px 47px 60px;
}
.about-us-content h2{
    color:#3e3e3e;
    font-size: 34px;
    font-family: 'Mont Heavy DEMO';
    font-weight:900;
    line-height:1.5;
    margin-bottom:30px;
    text-align: right;
}

.about-us-content p{
    font-family:'BPGWEB001';
    color:#3e3e3e;
    font-size: 14px;
}
.carousel-item img{height:480px;}

.bg-color{
    background-color:#f5f0ed;
}

.products-intro{margin-top:60px; padding-bottom: 130px;}
.products-intro .carousel{width:90%;}
.carousel-item h5{
    font-size:18px; line-height: 22px; color:#3e3e3e; font-family: 'BPGWEB001'; margin-bottom:10px;
}
.product-image{ height:380px;
    background-position:center; background-size:cover; background-repeat:no-repeat;}
.products-intro .carousel-control-next{top:450px;}
.products-intro .carousel-control-prev{top:450px; left:calc(100% - 200px);}
.products-intro h2{font-family: 'Mont Heavy Demo'; text-align: right; color:#ffa801; line-height: 66px; font-size:44px; margin-bottom:15px; font-weight: 900;}
.products-intro-text{margin-bottom:15px; line-height:20px; color:#3e3e3e; font-size:14px; font-family: 'BPGWEB001'; padding-left:40px; }
.fill-the-form{
    border-radius: 4px; border:2px solid #ffa801; color:#ffa801; font-size:16px;
    font-weight:900; font-family: 'Monte Heavy Demo'; width:300px; height: 62px; float: right; margin-top:30px; transition: 0.3 ease;
}
.fill-the-form:hover{
    background-color:#ffa801; color:#fff;
}

.modal-header:not(#modalBottomHeader){border-bottom:0px;}
.modal .close{font-weight:normal;}
#products_list{padding-top:50px; padding-bottom:50px;}
.product-list-image{
    width: 100%; height:250px; background-position: center; background-size:cover; background-repeat:no-repeat;
    margin-bottom:20px;
}
.product-list-item{margin-bottom:30px; cursor:pointer;}
.product-list-item h3{
    font-family:'BPGWEB001';
    color:#3e3e3e;
    font-size:14px;
    border-bottom:1px solid #3e3e3e;
    line-height:17px;
    padding-bottom:15px;
    transition: 0.3s ease;
    text-transform: uppercase;
}
.product-list-item h3:hover{color:#ffa801;}
.product-list-item a>h3:hover .product-list-item{border-color:#ffa801;}

/*filters*/
.filter-title button{
    position: relative;
    color:#3e3e3e;
    font-family: 'BPGWEB001';
    font-size:16px;
    line-height:1.19;
    width:100%;
    text-align: left;
    transition:0.3s ease;
    margin-bottom:50px;
}
.filter-title button:hover{
    color:#ffa801;
    text-decoration:none;
}

.filter-title button i{
    position: absolute;
    right: 0px;
}
/*filters*/

/*product in*/

#productsInnerCarousel .carousel-item img{height:380px;}
#productsInnerCarousel .carousel-indicators{bottom:-170px; margin-left:0px; margin-right:0px;}

#productsInnerCarousel .carousel-indicators li{ width: 33%; height:115px; position: relative;}
.active .active-border-top{position: absolute; height:6px; top:-6px; border:1px solid #ffa801; border-bottom:0px; width:70%; margin-left:auto; margin-right: auto; left:0; right:0;}
.active .active-border-bottom{position: absolute; height:6px; bottom:-6px; border:1px solid #ffa801; border-top:0px; width:70%; margin-left:auto; margin-right: auto; left:0; right:0;}
.products-carousel-indicators{
    height: 115px;
    background-repeat: no-repeat;
    background-position: center;
    background-size:cover;
}
.product-name{
    font-family: 'Mont Heavy Demo';
    text-align: right;
    color: #ffa801;
    line-height: 50px;
    font-size: 34px;
    font-weight: 900;
}
.product-number{color: #ffa801; text-align: right; font-size: 12px; font-family: 'BPGWEB001'; line-height: 14px;}
.icons-list{float: left; margin-top:30px; margin-bottom: 30px;}
.icons-list span{font-size: 10px; color:#3e3e3e; line-height: 12px; font-family: 'BPGWEB001'; text-align: center;}
.icons-list .nav-item{margin-right: 40px;}
.price{
    color:#ffa801; font-size:24px; font-family: 'Mont Heavy Demo'; line-height:35px;
}
.text-product-in{text-align: left;}
.other-products{
    font-family: 'Mont Heavy Demo';
    color: #ffa801;
    line-height: 35px;
    font-size: 24px;
    font-weight: 900;
    margin-bottom:10px;
}

/* custom checkbox  */

/* Customize the label (the container) */
.checkbox-container {
    display: block;
    position: relative;
    padding-left: 57px;
    margin-bottom: 10px;
    cursor: pointer;
    font-size: 12px;
    font-weight:normal;
    font-family: 'BPGWEB001';
    color:#9aa1ab;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.checkbox-container.test{color:#3e3e3e;}
.color-checkbox-container{
    display:inline-block;
    width:30px; height:30px;
    background:red; position: relative;
    margin-left:24px; text-align: center;
    margin-bottom:24px; cursor:pointer;
}

/* Hide the browser's default checkbox */
[class$="checkbox-container"] input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

/* Create a custom checkbox */
.checkbox-container .checkmark {
    position: absolute;
    top: -5px;
    left: 27px;
    height: 20px;
    width: 20px;
    border:1px solid #9aa1ab;
}



.color-checkbox-container .checkmark {
    position: absolute;
    height: 13px;
    width: 13px;
    top:8px; left:8px;
    background-color:transparent;

}
/* On mouse-over, add a grey background color */
[class$="checkbox-container"]:hover input ~ .checkmark {
    border-color: #ffa801;
}

/* When the checkbox is checked, add a blue background */
[class$="checkbox-container"] input:checked ~ .checkmark {
    background-color: #ffffff;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.checkbox-container input:checked ~ .checkmark:after {
    display: block;
}
.color-checkbox-container input:checked ~ .checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
.checkbox-container .checkmark:after {
    left: 7px;
    top: 3px;
    width: 5px;
    height: 10px;
    border: solid #ffa801;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
.color-checkbox-container .checkmark:after {
    left: 4px;
    top: -1px;
    width: 5px;
    height: 10px;
    border: solid #ffa801;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* custom checkbox  */

/*contacts*/


p {
    font-family: 'BPGWEB001';
    font-size: 14px;
    line-height: 1.7;
    color: #666666;
    margin: 0px;
}

ul, li {
    margin: 0px;
    list-style-type: none;
}


input {
    outline: none;
    border: none;
}

textarea {
    outline: none;
    border: none;
}

textarea:focus, input:focus {
    border-color: transparent !important;
}

input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; }
input:focus::-moz-placeholder { color:transparent; }
input:focus:-ms-input-placeholder { color:transparent; }

textarea:focus::-webkit-input-placeholder { color:transparent; }
textarea:focus:-moz-placeholder { color:transparent; }
textarea:focus::-moz-placeholder { color:transparent; }
textarea:focus:-ms-input-placeholder { color:transparent; }

input::-webkit-input-placeholder { color: #999999; }
input:-moz-placeholder { color: #999999; }
input::-moz-placeholder { color: #999999; }
input:-ms-input-placeholder { color: #999999; }

textarea::-webkit-input-placeholder { color: #999999; }
textarea:-moz-placeholder { color: #999999; }
textarea::-moz-placeholder { color: #999999; }
textarea:-ms-input-placeholder { color: #999999; }

/*---------------------------------------------*/
button {
    outline: none !important;
    border: none;
    background: transparent;
}

button:hover {
    cursor: pointer;
}

iframe {
    border: none !important;
}


.wrap-contact2 {
    margin:auto;
    width:40%;
    overflow: hidden;
}

#FillTheFormModal .wrap-contact2{
    width:90%; margin-bottom:70px;
}
#FillTheFormModal .contact2-form-title{
    text-align: right;
    padding-top:10px;
}


.contact2-form {
    width: 100%;
}

.contact2-form-title {
    display: block;
    padding-top:50px;
    font-size: 44px;
    font-family: 'Mont Heavy DEMO';
    color: #ffa801;
    line-height: 1.5;
    text-align: left;
}


.wrap-input2 {
    width: 100%;
    position: relative;
    border-bottom: 1px solid #9aa1ab;
    margin-bottom: 30px;
}

.input2 {
    display: block;
    width: 100%;
    background:transparent;
    font-size: 15px;
    color: #9aa1ab;
    line-height: 1.5;
}

.focus-input2 {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    pointer-events: none;
}

.focus-input2::before {
    content: "";
    display: block;
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 2px;

    -webkit-transition: all 0.4s;
    -o-transition: all 0.4s;
    -moz-transition: all 0.4s;
    transition: all 0.4s;

    background: #FFF;
}

#FillTheFormModal .focus-input2::before{
    background:#ffa801;
    font-size:16px;
}

#FillTheFormModal .input2{
    color:#d9d9d9;
}
.focus-input2::after {
    content: attr(data-placeholder);
    display: block;
    width: 100%;
    position: absolute;
    top: 0px;
    left: 0;

    font-family: 'BPGWEB001';
    font-size: 16px;
    color: #9aa1ab;
    line-height: 1.5;
    -webkit-transition: all 0.4s;
    -o-transition: all 0.4s;
    -moz-transition: all 0.4s;
    transition: all 0.4s;
}


/*---------------------------------------------*/
input.input2 {
    height: 40px;
}

input.input2 + .focus-input2::after {
    top: 16px;
    left: 0;
}

textarea.input2 {
    min-height: 115px;
    padding-top: 13px;
    padding-bottom: 13px;
}

textarea.input2 + .focus-input2::after {
    top: 16px;
    left: 0;
}

.input2:focus + .focus-input2::after {
    top: -13px;
}
#FillTheFormModal .input2:focus{
    font-size:12px;
}
.input2:focus + .focus-input2::before {
    width: 100%;
}

.has-val.input2 + .focus-input2::after {
    top: -13px;
}

.has-val.input2 + .focus-input2::before {
    width: 100%;
}

/*------------------------------------------------------------------
[ Button ]*/
.container-contact2-form-btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    justify-content: right;
    padding-top: 13px;
}

.wrap-contact2-form-btn {
    display: block;
    position: relative;
    z-index: 1;
    border-radius: 4px;
    border:2px solid #ffa801;
    width: auto;
    overflow: hidden;
}

.contact2-form-bgbtn {
    position: absolute;
    z-index: -1;
    width: 300%;
    height: 100%;
    top: 0;
    left: -100%;
    color:#ffa801;
    font-size: 16px;
    font-family: 'Mont Heavy DEMO';
    -webkit-transition: all 0.4s;
    -o-transition: all 0.4s;
    -moz-transition: all 0.4s;
    transition: all 0.4s;
}

.contact2-form-btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 20px;
    min-width: 244px;
    height: 50px;
    color:#ffa801;
    font-size: 16px;
    font-family: 'Mont Heavy DEMO';
    line-height: 1.2;


}

.wrap-contact2-form-btn:hover .contact2-form-bgbtn {
    left: 0;
}

/*------------------------------------------------------------------
[ Responsive ]*/

@media (max-width: 576px) {
    .wrap-contact2 {
        padding: 72px 15px 90px 15px;
    }
}


/*contact*/
@media (max-width: 768px) {
    .indicators-row{margin-top:80px;}
    .carousel-indicators li{height: 140px; width:40%;}
    .carousel-indicators .read-more{height: 70px;}
    .carousel-indicators .read-more p{bottom:0px; top:3px;}
    .carousel-control-next, .carousel-control-prev{width:33%;}
    .carousel-control-next .hor, .carousel-control-prev .hor{width:90px;}
    .carousel-control-next .vrtc, .carousel-control-prev .vrtc{height:40px;}
    .gallery-items{margin-left:0px; margin-right:0px;}
    .gallery-items .img-fluid{height:140px;}
    #collaborative .card-container{
        margin:0 15px 15px 15px;
    }
    .dropdown-content{display: none;}
    #content{
        width:170px; height:130px; background-size:100% 100%;
    }
    .popup-bubble{transform: translate(-103%, -141%);}
    #content p{margin-top:15px;}
    .langs{display: none;}
    .section-title{padding-left:20px; font-size:24px;}
    .carousel-item img{height:248px;}
    .about-us-content{
        background:rgba(255,255,255,1); height:auto;
        margin-top:0px;  padding:10px 40px 0 40px; text-align: justify;
    }
    .about_us_banner{height:248px;}
    .about-us-content h2{
        text-align: center;
        font-size: 16px;
        font-family: 'Mont Heavy DEMO';
        margin-bottom:15px;
    }
    .about-us-content p{margin-bottom:35px; line-height:20px;}
    .products-intro .carousel{width: 100%;  }
    .products-intro{padding-bottom: 50px; margin-top:20px;}
    .carousel-item h5{text-align: right;}
    .products-intro h2{font-size:38px; line-height: 30px;}
    .product-image{height:280px;}
    .products-intro .carousel-control-next{top:390px; width:35%; right:12%;}
    .products-intro .carousel-control-prev{top:390px; width:35%; left:12%;}
    .products-intro .carousel{margin-bottom: 70px;}
    .products-intro-text{padding-left:0px;}
    .products-intro .fill-the-form{width:100%; float:none; }
    .product-list-image{height: 160px;}
    .product-list-item h3{font-size:10px;}
    .filter-btn{padding-left:0px; color:#9aa1ab; font-size:12px; line-height:14px; font-family:'BPG Arial';}
    .filter-btn:focus{box-shadow: none;}

    /*filter modal*/
    .modal.fade .modal-bottom {
        -webkit-transform: translate(0, 25%);
        -o-transform: translate(0, 25%);
        transform: translate(0, 25%);
    }
    .modal .modal-bottom {
        margin:0;
        margin-top:auto;
        padding: 0;
        position:absolute;
        bottom:0;
        top:auto;
        left:auto;
        right:0;
        height:auto; /* default height:45% its just for demo*/
    }

    .modal .modal-bottom>.modal-content{

        height:100%;
        border-color: #fff;
        border-radius:0;
        margin:0;

    }
    .modal-bottom .filter-btn{font-size:14px;}
    .modal-bottom .modal-body{height: calc(100% - 140px);overflow-y:auto;}

    @media (min-width: 1px){
        .modal-bottom {max-width: 100%;width:100%;}
    }
    /*Custume scroll bar*/
    .modal-bottom ::-webkit-scrollbar {width:8px}
    .modal-bottom ::-webkit-scrollbar-button {width:8px;height:5px}
    .modal-bottom ::-webkit-scrollbar-thumb:hover {background: #ccc}
    .modal-bottom ::-webkit-scrollbar-thumb {	background:#f1f1f1;border: thin solid white;border-radius: 10px}
    .modal-bottom ::-webkit-scrollbar-track {background: #fff;border:thin solid white}

    /*filter*/
    .filter-title{text-align: center;}
    .filter-title button{margin-bottom:20px; width:35%;}
    .checkbox-container{padding-left:20px;}
    .checkbox-container .checkmark{left:-20px; top:-1px;}
    #accordionExampleMobile .card-body{padding-top:0px;}
    #collapseTwoMobile .card-body{padding:0px;}
    #collapseThreeMobile .card-body{padding:0px;}
    #collapseThreeMobile  .checkbox-container .checkmark{left:0px; top:-1px;}
    #collapseThreeMobile  .checkbox-container{padding-left:40px;}
    .color-checkbox-container{margin-left:0px; margin-right:15px;}
    #productsInnerCarousel .carousel-item img{height:300px;}
    #productsInnerCarousel .carousel-indicators li{height:90px;}
    .products-carousel-indicators{height: 90px;}
    #productsInnerCarousel .carousel-indicators{bottom:-140px;}
    .icons-list .nav-item{margin-right:40px; margin-left:0px;}
    .text-product-in{text-align: left;}
    #products_list{margin-bottom:50px;}
}
/* Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) and (max-width: 991.98px) {
    .site-main-nav li>a{
        font-size:12px;
        padding:9px 15px;
    }
    .langs .btn, .langs a{
        font-size:12px;
    }
    .product-image{
        height:250px;
    }
    .products-intro .carousel-control-next{top:320px; width:28%;}
    .products-intro .carousel-control-prev{top:320px; width:28%;}
    .products-intro-text{padding-left: 0;}
    .products-intro h2{font-size:38px; line-height:25px;}
    .products-intro .carousel{width:100%;}
    .products-intro{padding-bottom: 90px;}
    .product-list-image{height: 150px;}
    .product-list-item h3{font-size: 10px;}
    .card-body{padding:0px;}
    .filter-title button{margin-bottom: 20px;}
    .color-checkbox-container{margin-left:15px;}
    .checkbox-container .checkmark{top:0px;}
    .icons-list .nav-item{margin-left:20px;}
    #productsInnerCarousel .carousel-item img{height:300px;}
    .products-carousel-indicators{height:90px;}
    #productsInnerCarousel .carousel-indicators li{height: 90px;}
    #productsInnerCarousel .carousel-indicators{bottom:-140px;}
}
/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .site-main-nav li>a{
        padding:9px 30px;
    }
}

/* Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
    .site-main-nav li>a{
        padding:9px 38px;
    }
}