/* Common CSS  */
.bg-gray{background-color: #F7F7FA;}
.container-fluid{ max-width: 1364px;}
html,body{font-family: 'Montserrat', sans-serif;}

/* Layout Structure */

header{
    position: relative;
    z-index: 2;
}
header .header-wrap{
    box-shadow: 0 10px 10px -10px rgba(74,74,74,0.55);
    padding: 10px 0;
    z-index: 99;
    
}
header .biotech-logo{
    max-width: 120px;;
}
header h1{font-size:18px; margin-top:15px; float: right; font-weight:500;  }
a{color:#000; }

/* Select Service Structure */

.service-select{
    position:relative;
    transform:translateZ(0) scale(1.0, 1.0);
    backface-visibility:hidden;
    background-position: center center;
    background-size: cover;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}


.service-select.active .caption{
    background-color: rgba(35, 76, 91, 1);
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}
.service-select.inactive{
    opacity: 0.5;
}
.service-select.active:after{
    height: 8px;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}
/*.service-select:before{
    display:block;
    content:" ";
    width:100%;
    padding-top:80%;
}*/
.service-select .caption{
    position: relative;
    padding:60px;
    color: #fff;
    font-weight: 300;
/*    background-color: rgba(35, 76, 91, 0.7);*/
    left: 0px;
    right: 0px;
    bottom: 0px;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}
.service-select h2{
    font-size: 20px;
}
.service-select p{
    font-size: 30px;
}


.filter{
    visibility: hidden;
    height: 0px;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
    opacity: 0;
    display: none;
}
.filter-wrap{
    padding: 30px 40px;
    background-color: rgba(35, 76, 91, 1);
}
.filter.active{
    visibility: visible;
    height: auto;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
    opacity: 1;
}
.filter label{
    font-size: 14px;
    font-weight: 600;
    color: #fff;
}


.results{
    padding: 15px 0px 0px;
    /*display: none;*/
}

.results .table thead th{
    font-size: 14px;
    border-top: 0px;
    border-bottom: 2px solid #1EB8D8;
}

.table td, .table th{
    font-size: 14px;
}

.custom-checkbox .custom-control-label::before{
    border-radius: 0px;
}

.custom-control-label::before{
    top: 0.0rem;
left: -2rem;
display: block;
width: 1.5rem;
height: 1.5rem;
}

.custom-control-label::after{
    top: -0.1rem;
left: -2.1rem;
display: block;
width: 1.8rem;
height: 1.8rem;
}
.custom-control{
    padding-left: 2rem;
}

.custom-control-input:checked ~ .custom-control-label::before{
    border-color: #1EB8D8;
background-color: #1EB8D8;
}

.custom-control-label::before{
 border:2px solid #ced4da
}

.boxcolor-1{background-color:#2e75b6;}
.boxcolor-2{background-color:#1fb8d8; }
.boxcolor-3{background-color:#1c7c90; }
footer{ padding:0.1em 0; text-align:center;     background-color: #F7F7FA;}
footer .biotech-logo {
   display: block;
    margin: 0 auto;
    padding-bottom: 15px;
}
.hero{max-height:415px; }
.footerbg{background-color: #234c5a;  padding:2em 0;}


.footerbg  a{color:#fff; padding:5px; font-size:14px;   }

.modal-body h5{font-size:20px; margin:10px 0px;  }
.modal-dialog {max-width:768px;margin: 1.75rem auto;}





















/*Responsive Setting*/
@media only screen and (min-width: 2500px) {

}

@media only screen and (min-width: 1900px) {


}

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



}



@media only screen and (max-width: 1440px) {
.videobox span {right: 36%;}
.hero .caption{right:3%;}
}
    

}

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

.videobox span {left:40%; bottom:17%; display: none;}



}

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



}

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



}



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





}



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



}



@media only screen and (max-width: 1024px) {
.service-select p {font-size: 27px;}
.service-select .caption{padding: 15px;}

}

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



}

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





}



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





}



@media only screen and (max-width: 768px) and (min-width: 1024px) {



}



@media only screen and (max-width: 768px) {
.service-select p {font-size: 27px;}
.service-select .caption{padding: 15px;}


}

@media only screen and (max-width: 767px) {
.r169:before {
    padding: 100% !important;
}
.searchbx {
    background: #fff;
    padding: 2em;
    position: absolute;
    right: 0%;
    left: 4%;
    z-index: 99;
    top: 35%;
    width: 92%;
    border-radius: 9px;
    box-shadow: -7px 0px 30px 4px rgb(0 0 0 / 23%);
    -webkit-box-shadow: -7px 0px 30px 4px rgb(0 0 0 / 23%);
    -moz-box-shadow: -7px 0px 30px 4px rgba(0,0,0,0.23);
}

}



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


}

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



}

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

.r169:before {padding:100% !important;}

}

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

}

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



}

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



}



@media only screen and (max-width: 320px) {
.r169:before {padding-top:100% !important;}


}