/*                                                    /MERV                                                           */
/*====================================================================================================================*/
.merv-images{
    margin: 0 auto;
    justify-content: center;
    max-width: 100%;
}
.button-group{
    z-index: 9;
    bottom: -40px;
}
.merv-box {
    border-radius: 5%;
    background-color: #dedee9;
    margin: 0 15px 0 15px;
    cursor: pointer;
}
.selector-btn{
    border-radius: 5%;
    background-color: white;
    padding: 15px 15px 7px;
    cursor: pointer;
}
.merv-title{
    text-align: right;
    font-size: 80px;
    font-weight: bold
}
.arrows{
    margin-left: 40%;
    width: 200px;
}
.margin-auto{
    margin: auto;
}
.margin-b-20{
    margin-bottom: 20px;
}
.margin-0{
    margin: 0;
}
.selected-08{
    border: 3px solid #9ac877;
}
.selected-09{
    border: 3px solid #69c9f2;
}
.selected-10{
    border: 3px solid #8dabad;
}
.selected-11{
    border: 3px solid #dd9283;
}
.selected-12{
    border: 3px solid #b5d666;
}
.selected-13{
    border: 3px solid #c19eb3;
}
.selected-14{
    border: 3px solid #e2ae8f;
}
.selected-15{
    border: 3px solid #72ccc6;
}
.selected-16{
    border: 3px solid #9a80ba
}
.selected-08-chosen{
    background-color: #9ac877;
}
.selected-09-chosen{
    background-color: #69c9f2;
}
.selected-10-chosen{
    background-color: #8dabad;
}
.selected-11-chosen{
    background-color: #dd9283;
}
.selected-12-chosen{
    background-color: #b5d666;
}
.selected-13-chosen{
    background-color: #c19eb3;
}
.selected-14-chosen{
    background-color: #e2ae8f;
}
.selected-15-chosen{
    background-color: #72ccc6;
}
.selected-16-chosen{
    background-color: #9a80ba;
}
/*                                                /LOST & /SUCCESS                                                    */
/*====================================================================================================================*/

.circle-img{
    height: 15rem;
    width: 15rem;
}
.circle-text{
    cursor: pointer;
    color: black;
    text-align: center;
    top: -47%;
    font-size: 1.5rem;
}

/*                                               /RESOURCES & COMPANY                                                     */
/*====================================================================================================================*/
.border-2px-black{
    border-bottom: 2px solid black;
}
.sectional{
    padding-top: 20px;
    padding-bottom: 20px;
    text-align: center;
}
#section3{
    padding-left: 100px;
    padding-right: 100px;
}
.sectional-card-div{
    padding: 0% 15% 0% 15%;
}
.small-logo{
    width: 20%;
    margin-left: 200px;
}
#section1{
    padding-top: 100px;
    padding-left: 100px;
    padding-right: 100px;
}
#section2{
    padding-left:100px;
    padding-right:100px;
}
.product-box-img{
    width: 300px;
    height: 300px;
}
#productBoxImgDiv{
    width: 100%; height: 80%; justify-content: center; display: flex;
}
@media only screen and (max-width: 960px) {
    .sectional{
        padding-left: 50px;
        padding-right: 50px;
    }
    .sectional-card-div{
        padding: 0;
    }
    .small-logo{
        width:150px;
        margin-left: 0;
    }
    #section3{
        padding-left:36px;
        padding-right:36px;
    }
    #section2{
        padding-left:36px;
        padding-right:36px;
    }
    #section1{
        padding-top: 20px;
        padding-left:36px;
        padding-right:36px;
    }
    .product-box{
        padding-top: 50px
    }
}


.card-img{
    height: 100%;
    width: 100%;
}
.tab-row img{
    max-height: 100%;
    max-width: 100%;
}
.location-anchors{
    text-decoration: none;
}
.button-select{
    border-bottom: 2px solid #2d2b52; padding-bottom: 5px; color: #2d2b52; font-size: 25px
}
.locationBtn, .serviceBtn, .policyBtn, .aboutBtn, .protocolsBtn, .qualityBtn, .standardsBtn, .costsBtn, .product1Btn, .product2Btn, .product3Btn{
    transition-duration: .25s;
    margin-bottom: 0;
    cursor: pointer;
}
.button-deselect:hover{
    border-bottom: 1px solid #2d2b52;
}
.button-deselect{
    color: #808080
}
/*                                                    /CALCULATOR                                                     */
/*====================================================================================================================*/
#filterDescriptionTable{
    width: 100%;
}
#filterDescriptionTable td{
    border-bottom: 1px solid #7d8b99;
}
.totalCosts{
    width: 100%;
}
.totalCosts th, td{
    padding: 5px;
    text-align: left;
    font-size: 18px;
}
#totalCostsBlock{
    z-index: 999;
}
.tableBorder{
    border: 2px solid #0f82ff;
    border-radius: 25px;
    padding: 15px;
    background-color: #f8f9fa;
}
.totalCosts td{
    border-bottom: 1px solid #7d8b99;
}
.tcoTable th, td{
    padding: 10px;
    text-align: left;
    font-size: 18px;
}
.tcoTable{
    width: 100%;
}
.vertical-line{
    border-right: 2px solid black;
}
.calculator{
    padding-bottom: 40px;
}
.tcoTable tr td span{
    margin-left: 10px;
}
#dollarSign{
    margin-left: 0;
    margin-right: 5px;
}
.tcoTable tr{
    width: 100% !important;
}
.tcoTable tr td{
    padding-left: 15px;
}
.trs{
    width: 100% !important;
}
.tcoTable td{
    border-bottom: 1px solid #7d8b99;
    width: 33.3%;
}
#dollarSigntd{
    padding-left: 5px;
}
#totalCostsBlock{
    position: relative;
    justify-content: right;
    right: 10px;
}
.nav-tabs{
    margin-top: 20px;
}
.small-font{
    font-size: 14px;
}
.resultInputs{
    width: 80px;
}
.enterInputs{
    width: 80px;
    text-align: right;
}
/*                                                    /LANDING                                                     */
/*====================================================================================================================*/




















#mid-navbar{
    z-index: 500;
    background-color: red;
    padding: 0;
}
#mid-navbar a{
    color: whitesmoke;
    padding: 10px 20px;
    margin-right: 0;
}
.sectional{
    padding-top: 20px;
    padding-bottom: 20px;
    text-align: center;
}
#section-one-text{
    color: #2c2a53;
}
.image-panels{
    width: 100%;
    height: 100%;
}
.tab-innards.container-fluid{
    padding: 0;
}
.tab-title{
    top: 0;
    padding-top: 10px;
    background-color: #2c2a53;
}
.tab-title h1{
    font-size: 100%;
    width: 100%;
}
.tab-text{
    bottom: 45px;
    width: 100%;
    color: black;
    font-size: 0.9vw;
}
.under-headers{
    color: #2c2a53;
}

.under-headers.even{
    color: whitesmoke;
}
#filtration-image{
    transition-duration: 500ms;
    width: 100%;
}
.panels{
    padding: 0;
}
@media screen and (max-width: 900px) {
    #mid-navbar{
        display: none;
    }
}
/*xs*/
@media screen and (min-width: 0px) {
    .tab-text{
        font-size: 3.5vw;
    }
}
@media screen and (min-width: 992px) {
    .tab-text{
        font-size: .9vw;
    }
}
@media screen and (min-width: 1200px) {
    .tab-text{
        font-size: 1.1vw;
    }
}

.modal{
    overflow-y: auto;
}

.gradient-bg-left{
    background: rgb(255,255,255);
    background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(219,219,236,1) 100%);
    padding-top: 10px;
    padding-bottom: 10px;
}
.gradient-bg-right {
    background: rgb(216,216,232);
    background: linear-gradient(90deg, rgba(216,216,232,1) 0%, rgba(255,255,255,1) 100%);
    padding-top: 10px;
    padding-bottom: 10px;
}
#aboveSectionOne, #aboveSectionTwo, #aboveSectionThree, #aboveSectionFour{
    position: relative;
    top: -150px;
}
#mainNavbarIndex{
    background: transparent;
    -webkit-transition: background-color .5s ease-in;
    -moz-transition: background-color .5s ease-in;
    -o-transition: background-color .5s ease-in;
    transition: background-color .5s ease-in;
}
/*                                                    /PRODUCTS                                                     */
/*====================================================================================================================*/
/*body{*/
/*    background-color: #000;*/
/*    position: relative;*/
/*    margin-top: 200px;*/
/*    padding-right: 0 !important;*/
/*    overflow-x: hidden;*/
/*}*/

/*=================.2===================*/
#header-panel{
    background: rgb(255,255,255);
    background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(88,88,121,1) 100%);
}
#header-image{
    width: 100%;
    opacity: .5;
}

#header-logo{
    padding: 0;
    width: 100%;
}

.bottom-middle{
    text-align: center;
    bottom: 1vw;
    font-size: 3vw;
    text-shadow: 4px 4px 4px black;
    cursor: pointer;
}
.bottom-middle h5{
    font-size: 1.5vw;
}

.icon-hover{
    color: #0f82ee;
    text-shadow: 3px 3px 2px #000;
    transition-duration: 500ms;
}
#mid-navbar{
    z-index: 500;
    background-color: #2c2a53;
    padding: 0;
}
#mid-navbar a{
    color: whitesmoke;
    padding: 10px 20px;
    margin-right: 0;
}
.mid-hover{
    background-color: #7d8b99;
    color: #2c2a53;
}
.sectional{
    padding-top: 20px;
    padding-bottom: 20px;
    text-align: center;
}
.card-text{
    margin-bottom: 0
}
.card.bg-dark.text-white{
    height: 300px;
}
#section-card{
    margin: 0;
}
.iconz{
    font-size:30px;
}

/*=======Mid-Navbar=============*/
#mid-navbar{
    z-index: 900;
    background-color: #2c2a53;
    padding: 0;
}
#mid-navbar a{
    color: whitesmoke;
    padding: 10px 20px;
    margin-right: 0;
}

/*=====Section Stuff====*/
.sectional{
    padding-top: 20px;
    padding-bottom: 20px;
}
/*=================CAROUSEL CSS STUFF===========================*/
.fa-chevron-left{

    position: absolute;
    z-index: 999;
    top: 3.5rem;
    font-size: 60px;
}
.fa-chevron-right{

    position: absolute;
    z-index: 999;
    top: 3.5rem;
    font-size: 60px;
}
.owl-item > div {
    cursor: pointer;
    margin: 6% 8%;
    transition: margin 0.4s ease;
}
#dan{
    margin: 0;
}
.owl-item.center > div {
    cursor: pointer;
    margin: 0;
    background-color: lavender;
}
.owl-item:not(.center) > div:hover {
    opacity: .75;
}
.car-items{
    height: 10rem;
}
.car-items img{
    max-width:100%;
    max-height:100%;
}
.owl-carousel .owl-stage {
    display: flex;
}

/**/
@media (min-width: 730px){
    .resizer li {
        margin-left : 2vw;
        margin-right : 2vw;
    }
}
@media (min-width: 1100px){
    .resizer li {
        margin-left : 3vw;
        margin-right : 3vw;
    }
    .resizer{
        margin-left: 9vw;
    }
}
@media (min-width: 1500px){
    .resizer li {
        margin-left : 3.5vw;
        margin-right : 3.5vw;
    }
}
.fa-caret-left{
    left: -25px;
    position: absolute;
    z-index: 999;
    top: 2vw;
    font-size: 60px;
    color: white;
}
.fa-caret-right{
    right: -25px;
    position: absolute;
    z-index: 999;
    top: 2vw;
    font-size: 60px;
    color: white;
}
#companyResponsive{
    top: .5vw;
}

.sectional{
    padding-top: 20px;
    padding-bottom: 20px;
    text-align: center;
}

.card.bg-dark.text-white{
    height: 300px;
}
#section-card{
    margin: 0;
}
/*==========================================*/
.owl-item.center > div {
    cursor: auto;
    margin: 0;
}
.owl-item.active.center{
    height:200px;
}
.owl-item:not(.center) > div:hover {
    opacity: .75;
}

/**/
/* Dropdown Button */
#main-nav-items > li.dropdown:hover > a,
#main-nav-items > li.dropdown:hover > a:hover,
#main-nav-items > li.dropdown:hover > a:focus {
    background-color: rgb(231, 231, 231);
    color: rgb(85, 85, 85);
}
li.dropdown:hover > .dropdown-menu {
    display: block;
}
.dropdown-item p{
    margin: 0;
    font-weight: bold;
}
/*===========footer===========*/
.button-group button{
    font-size: 10px;
    margin-bottom: 25px;
    margin-right: 0;
    margin-left: 0;
}
.efficiency{
    bottom: -55px;
    color: #0f82ff;
    right: 30px;
}
.efficiency h5{
    font-size: 12px;
}
.right-icon-one{
    font-size: 30px;
    cursor: pointer;
    margin-top: 300%;
}
.display-toggle{
    display: none;
}
.yabdee, .yabdee-f, .yabdee-h, .yabdee-bs, .yabdee-op, .yabdee-pf, .yabdee-g{
    color: #3b8cfc;
    cursor: pointer;
}
.yabdee-fh, .yabdee-dc{
    color: white;
    cursor: pointer;
}
#section-two{
    /*border-top: 1px solid black;*/
}
#filterSection{
    padding-bottom: 50px;
}
.imp-button, .imp-button-2, .imp-button-3, .imp-button-4, .imp-button-5{
    width:40px;
    height:40px;
    background-color:#2c2953;
    border-radius:50px;
    text-align:center;
    box-shadow: 2px 2px 3px black;
    bottom: 20px;
    cursor: pointer;
}
.linez{
    background-color: #2c2953;
    height: 2px;
}
.angle, .angle-two, .angle-three, .angle-four, .angle-five{
    font-size: 40px;
}
#locations, #services, #policies, #filtermanagement, #aboveSectionFive, #agencies, #iaq, #standards, #about, #affiliates, #airfiltration, #specialty, #belts, #instock{
    position: relative;
    top: -150px;
}

/*====================================================================*/
/*=================Nav Carousel Styles=====asdf===========================*/
/*====================================================================*/
.car-properties{
    height: 0;
    padding-top: 0;
    position: fixed;
    z-index: 999;
    transition-duration: 500ms;
    background: rgb(44,42,83);
    background: linear-gradient(90deg, rgba(44,42,83,1) 23%, rgba(52,58,64,1) 50%, rgba(44,42,83,1) 86%);
}
.car-nav-items{
    margin: 0;
    padding: 20px 50px;
}
#affCarNav,#servicesCarNav, #policiesCarNav, #managementCarNav, #leedCarNav,#iaqCarNav, #standardsCarNav, #energyCarNav, #materialsCarNav, #impactCarNav ,#locCarNav, #aboutCarNav, #afCarNav, #fhCarNav, #bsCarNav, #dcCarNav, #emCarNav, #lfCarNav, #afsCarNav, #uyaCarNav, #tocCarNav, #fmCarNav{
    padding: 15px 40px;
}
#affiliate-logo div div img{
    height: 160px;
    width: 160px;
    margin: auto
}
/*===========footer===========*/
footer a{
    color: white;
    text-decoration: none;
}
footer a:hover{
    color: white;
}
.footer-background{
    background: rgb(44,42,83);
    background: linear-gradient(90deg, rgba(44,42,83,1) 23%, rgba(61,58,113,1) 50%, rgba(44,42,83,1) 86%);
    padding-top: 2em;
    color: white;
}
/*====Refactors====*/
.whited{
    color: white;
}
.relative{
    position: relative;
}
.absolute{
    position: absolute;
}
/*Floating button*/
.daniel{
    position:fixed;
    width:60px;
    height:60px;
    bottom:40px;
    right:40px;
    background-color:#0f82ff;
    color:#FFF;
    border-radius:50px;
    text-align:center;
    box-shadow: 2px 2px 3px black;
    z-index: 999;
}
.daniel:hover{
    color: #2c2a53
}
.my-float{
    margin-top:15px;
    font-size: 30px;
}
.hidden{
    visibility: hidden;
}
.show{
    visibility: visible;
}


/*=======Navbar========*/
#navbarlogo{
    padding-left: 0;
    height: 60px;
    width: 225px;
}
a.nav-link.small{
    padding: 0;
    color: white;
}
.navbar-brand{
    cursor: pointer;
}
.cursor{
    cursor: pointer;
}
/**/
.bagok{
    background: rgb(217,217,231);
    background: linear-gradient(0deg, rgba(217,217,231,1) 0%, rgba(228,228,237,1) 24%, rgba(255,255,255,1) 80%, rgba(255,255,255,1) 100%);
}
.navbar-toggler{
    border: 0;
    outline: 0;
}
#main-navbar{
    padding-top: 30px;
    border: 0;
    outline: 0;
}
.underline{
    padding: 0;
    background-color: #e9ecef;
}

@supports (-webkit-overflow-scrolling: touch) {
    #main-navbar{
        padding-bottom: 20px;
    }
}
/*s*/
@media screen and (min-width: 576px) {
    #main-navbar{
        padding-bottom: 0;
    }
}
i {
    margin-right: 10px;
}
/*----------multi-level-accordian-menu------------*/
.navbar-logo{
    padding: 15px;
    color: #fff;
}
.navbar-mainbg{
    background-color: #2B2953;
    padding: 0;
    box-shadow: none;
    width: 100%;
    z-index: 99;
}
#navbarSupportedContent{
    overflow: hidden;
    position: relative;
}
#navbarSupportedContent ul{
    padding: 0;
    margin: 0;
}
#navbarSupportedContent ul li a i{
    margin-right: 10px;
}
#navbarSupportedContent li {
    list-style-type: none;
    float: left;
}
#navbarSupportedContent ul li a{
    color: white;
    text-decoration: none;
    font-size: 15px;
    display: block;
    padding: 20px 20px;
    transition-duration:0.6s;
    transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
    position: relative;
}
#navbarSupportedContent>ul>li.active>a{
    color: #2B2953;
    background-color: transparent;
    height: 60px;
    /*width: 100%;*/
    /*transition: all 0.4s;*/
}
#navbarSupportedContent a:not(:only-child):after {
    content: "\f105";
    position: absolute;
    right: 20px;
    top: 10px;
    font-size: 14px;
    font-family: "Hind Siliguri", sans-serif;
    display: inline-block;
    padding-right: 3px;
    vertical-align: middle;
    font-weight: 900;
    transition: 0.5s;
}
#navbarSupportedContent .active>a:not(:only-child):after {
    transform: rotate(90deg);
}
.hori-selector{
    display:inline-block;
    position:absolute;
    top: 0;
    left: 0;
    transition-duration:0.6s;
    transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
    background-color: #F8F9FA;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    margin-top: 10px;
}
.hori-selector .right,
.hori-selector .left{
    position: absolute;
    width: 25px;
    height: 25px;
    background-color: #F8F9FA;
    bottom: 10px;
}
.hori-selector .right{
    right: -25px;
}
.hori-selector .left{
    left: -25px;
}
.hori-selector .right:before,
.hori-selector .left:before{
    content: '';
    position: absolute;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #2B2953;
}
.hori-selector .right:before{
    bottom: 0;
    right: -25px;
}
.hori-selector .left:before{
    bottom: 0;
    left: -25px;
}


@media(min-width: 992px){
    .navbar-expand-custom {
        -ms-flex-flow: row nowrap;
        flex-flow: row nowrap;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }
    .navbar-expand-custom .navbar-nav {
        -ms-flex-direction: row;
        flex-direction: row;
    }
    .navbar-expand-custom .navbar-toggler {
        display: none;
    }
    .navbar-expand-custom .navbar-collapse {
        display: -ms-flexbox!important;
        display: flex!important;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
    }
}


@media (max-width: 991px){
    #navbarSupportedContent ul li a{
        padding: 12px 30px;
    }
    .hori-selector{
        margin-top: 0;
        margin-left: 10px;
        border-radius: 0;
        border-top-left-radius: 25px;
        border-bottom-left-radius: 25px;
    }
    .hori-selector .left,
    .hori-selector .right{
        right: 10px;
    }
    .hori-selector .left{
        top: -25px;
        left: auto;
    }
    .hori-selector .right{
        bottom: -25px;
    }
    .hori-selector .left:before{
        left: -25px;
        top: -25px;
    }
    .hori-selector .right:before{
        bottom: -25px;
        left: -25px;
    }
}
#midTitle2, #midTitle3, #midTitle4, #midTitle5, #midTitle6{
    transition-duration: 1.0s;
}
/* Iphone Resizing CSS */

#content-desktop {display: block;}
#content-mobile {display: none;}

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

    #content-desktop {display: none;}
    #content-mobile {display: block;}

}
#section-text{
    padding-left: 135px;
    padding-right: 135px;
}
.sectional-text{
    font-size: 28px
}
#midTitleMain{
    display: none;
}
.mobile-breaks{
    display: none;
}
.mervSections{width: 70%}
.mid-titles-mobile{display: none;}
#mainNavbar{display:block}
#mobileNavbar{display: none}
@media screen and (max-width: 991px) {
    #section-text{
        padding-left: 10px;
        padding-right: 10px;
    }
    #mobileNavbar{display: block}
    #mainNavbar {display: none;}
    #midTitleMain{
        display: block;
    }
    .sectional-text{
        font-size: 20px
    }
    .mid-titles{
        display: none;
    }
    .mid-titles-mobile{display: block}
    .locationBtn{
        font-size: 10px;
    }
    .product1Btn{
        font-size: 10px;
    }
    .product2Btn{
        font-size: 10px;
    }
    .selector-btn{
        padding: 0;
    }
    .selector-btn h6{
        margin: 0;
        font-size: 8px;
    }
    .efficiency h4{
        font-size: 10px;
    }
    .arrows{
        margin: 0;
        width: 100px
    }
    .merv-title{
        font-size: 30px;
    }
    .merv-text{
        font-size: 12px;
    }
    .mervSections{width:100%}
    .protocolsBtn{font-size: 10px}
    .serviceBtn{font-size: 10px}
    .qualityBtn{font-size: 10px}
    .policyBtn{font-size: 10px}
    #rensaProductLogo{width: 100%}
    .mobile-breaks{
        display: block;
    }
    .policySubBtn h6{
        font-size: 10px
    }
}
/*#mainNavbar{background: rgb(217,217,231);*/
/*    background: linear-gradient(0deg, rgba(217,217,231,1) 0%, rgba(228,228,237,1) 24%, rgba(255,255,255,1) 80%, rgba(255,255,255,1) 100%);*/
/*}*/

@media only screen and (max-width: 960px) {
    .mobile-title{
        padding-top:25px;
    }
}