.no-gutters {
    margin-right: 0;
    margin-left: 0;
}

.no-gutters .col,
.no-gutters [class*="col-"] {
    padding-right: 0;
    padding-left: 0;
}

@media (max-width: 420px) {

    h1, .h1 {
        font-size: 3.0rem; }
}

@media (max-width: 374px) {

    h1, .h1 {
        font-size: 2.5rem; }
    h2, .h2 {
        font-size: 2.0rem;
        line-height: 1.5em; }
}

.header-filter::before {
    background: rgba(0, 0, 0, 0.5);
}

#catalog  div.card-body.text-center > h4{
    min-height: 54px;
}

#testimonials  div.card-body > h5 > p{
    min-height: 160px;
}

@media (max-width: 320px){
    .btn{
        white-space: normal;
    }
}

.background_gray{
    background: #98AAAC;

}

.header_contact{
    padding: 0.4rem;
}

.header_contact .icon .material-icons{
    margin-top: -7px;
    top: 6px;
    position: relative;
}

a.navbar-brand  {
    background: url("/templates/behair_material/assets/img/logo-behair-109.png");
    width: 109px;
    height: 50px;
}


.page-header.header-small {
    height: 50vh;
    min-height: 50vh;
}

.navbar .navbar-nav .nav-item .nav-link{
    padding: 1.2rem;
}

.navbar .navbar-nav .nav-item .nav-link{
    font-weight: 700;
    font-size: 0.81rem;
}

.mobile_menu li.dropdown .dropdown-menu{
    display: initial;
}

.navbar-expand-lg .navbar-nav .dropdown-menu{
    display: none;
}

@media (max-width: 991px){
    .navbar .dropdown.show .dropdown-menu, .navbar .dropdown .dropdown-menu {
        display: block;
    }

    .navbar .dropdown.show .dropdown-menu, .navbar .dropdown .dropdown-menu:hover {
        display: block;
    }

    .navbar-collapse .navbar-nav .dropdown.nav-item .nav-link{
        padding-bottom: 0;
        margin-bottom: 0;
    }

    .dropdown-menu .dropdown-item, .dropdown-menu li > a {
        padding: 0.625rem 1.25rem;
    }

    .navbar .navbar-nav .nav-item .nav-link{
        padding: 0.625rem;
    }


    .navbar .navbar-toggler{
        position: absolute;
    }
}


.bg-grey{
    background-color: #e2e8e3 !important;
}

.header_basket a{
    color: #555;
}

.cart_amount{
    margin-left: -5px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    background-color: #99cc33;
    color: white;
    padding: 0.2rem 0.45rem;
    font-size: 0.625rem;
}

.header-login a span{
    font-size: 0.725rem;
}

.modal-footer.register-forget{
    margin-left: 55px;
}

.navbar{
    margin-bottom: 0;
}

.hair-price{
    margin-top: 12rem;

}

.hair-price .object{
    border-bottom: #0a001f 1px solid;
    height: 2.4rem;
    color: #3C4858;
}

.hair-price .object > a{
padding-top: 1rem;
}

.hair-price .title {
    margin: 0;
    min-height: 1rem;
}

@media (max-width: 1024px) {
    .hair-price {

        margin-top: 10.5rem;

    }

    .hair-price .object {
        height: 2.0rem;
    }
    .hair-price .object > a {
        padding-top: 0.7rem;
    }
}





@media (max-width: 768px){
    .hair-price{
        position: absolute;
        z-index: 10;
        margin-top: 13rem;

    }
    .hair-price .object{
        height: 2.6rem;
    }
    .hair-texture{
        z-index: 1;
    }
}

@media (max-width: 425px){
    .hair-price{
        position: absolute;
        z-index: 10;
        margin-top: 13.5rem;

    }
    .hair-price .object{
        height: 3.0rem;
    }
    .hair-texture{
        z-index: 1;
    }
    .hair-price .object > a {
        padding-top: 1.5rem;
    }
}


@media (max-width: 375px){
    .hair-price{
        position: absolute;
        z-index: 10;
        margin-top: 11.5rem;

    }
    .hair-price .object{
        height: 2.6rem;
    }
    .hair-texture{
        z-index: 1;
    }
    .hair-price .object > a {
        padding-top: 1.3rem;
    }
}


@media (max-width: 320px){
    .hair-price{
        position: absolute;
        z-index: 10;
        margin-top:11rem;

    }
    .hair-price .object{
        height: 2.2rem;
    }
    .hair-texture{
        z-index: 1;
    }
    .hair-price .object > a {
        padding-top: 0.9rem;
    }
}


.card-options-photo .card-avatar {
    max-width: 130px;
    max-height: 130px;
    margin: -50px auto 0;
    border-radius: 50%;
    overflow: hidden;
    padding: 0;
    -webkit-box-shadow: 0 16px 38px -12px rgba(0, 0, 0, 0.56), 0 4px 25px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 16px 38px -12px rgba(0, 0, 0, 0.56), 0 4px 25px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2); }


.color-selector{
    margin-left: 7px;
    margin-right: 7px;
}

.color-selector input{
    margin:0;padding:0;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    background-size: cover;
}

.form-choice-selector {
    display: inline-block;
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
    -webkit-tap-highlight-color: transparent;
    position: absolute;
    top: 3px;
    left: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}

.form-choice-selector.rounded~.form-choice-selector-label {
    border-radius: 4px;
}
.form-choice-selector:checked~.form-choice-selector-label {
    border-color: #99cc33;
    position: relative;
    border-width: 2px;
}
.form-choice-selector~.form-choice-selector-label {
    height: auto;
}
.form-choice-selector~.form-choice-selector-label {
    display: table;
    width: 100%;
    height: 130px;
    text-align: center;
    border: 1px solid #d6d6d6;
    cursor: pointer;
    box-sizing: border-box;
    border-spacing: 0;
    font-size: 16px;
}

.color-selector-description{


}

.form-choice-selector~.form-choice-selector-label .form-label {
    position: relative;
    margin-top: 0;
    margin-bottom: 0;
    color: #666;
    text-indent: 0;
    display: table-cell;
    vertical-align: middle;
    top: 0;
    padding-left: 15px;
    padding-right: 15px;
}

.form-choice-selector:hover~.form-choice-selector-label .form-label, .form-choice-selector:hover~.form-choice-selector-label {
    color: #333
}

.form-choice-selector:focus~.form-choice-selector-label, .form-choice-selector:active~.form-choice-selector-label, .form-choice-selector.focused~.form-choice-selector-label {
    border-color: #99cc33;
    border-width: 2px;
    box-shadow: 0 0 0 3px rgba(153, 204, 51, 0.28);
}
.form-choice-selector:hover:checked~.form-choice-selector-label {
    border-color: #99cc33;
}
.form-choice-selector:hover~.form-choice-selector-label {
    border-color: #888;
}





.color-selector input:active +.color-card{opacity: .9;}

.color-selector input:checked label +.color-card{
    -webkit-filter: none;
    -moz-filter: none;
    filter: none;
    transform:  scale(1.05);
}
.color-card{
    position: relative;
    border-radius: 50%;
    overflow: hidden;
    padding: 0;
    -webkit-box-shadow: 0 16px 38px -12px rgba(0, 0, 0, 0.56), 0 4px 25px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 16px 38px -12px rgba(0, 0, 0, 0.56), 0 4px 25px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
    cursor:pointer;
    background-size:contain;
    display:inline-block;
    width:75px;height:75px;
    -webkit-transition: all 100ms ease-in;
    -moz-transition: all 100ms ease-in;
    transition: all 100ms ease-in;
    -webkit-filter: brightness(1.01) grayscale(0.5) opacity(.9);
    -moz-filter: brightness(1.01) grayscale(0.5) opacity(.9);
    filter: brightness(1.01) grayscale(0.5) opacity(.9);
    transition: 0.25s linear;
}
.color-card:hover, input:checked +.color-card{
    -webkit-filter: brightness(1) grayscale(0) opacity(1);
    -moz-filter: brightness(1) grayscale(0) opacity(1);
    filter: brightness(1) grayscale(0) opacity(1);
    -webkit-transform: scale(3);
    transform:  scale(3);
    z-index: 9999;
}

.color-selector h5, .color-selector h6{
    text-align: center;
    margin: 0;
    min-height: 10px;
}


#instafeed{
    height: 160px;
}
#instagram  .gallery-feed a {
    margin-right: 5px;
    margin-bottom: 5px;
    float: left;
}



#instagram .nbs-flexisel-nav-right, #instagram .nbs-flexisel-nav-left{
    position: absolute;
    top: 0;
    bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 15%;
    color: #fff;
    text-align: center;
    opacity: .9;
}

#instagram .nbs-flexisel-nav-left{

    left: 0;
}

#instagram .nbs-flexisel-nav-right{

    right: 0;
}

#instagram .nbs-flexisel-nav-left .material-icons, #instagram .nbs-flexisel-nav-right .material-icons{
    z-index: 5;
    display: inline-block;
    font-size: 50px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 50px;
    margin: auto;
}

.ecommerce  div.card-header.card-header-image > a > img{
    height: auto;
}

.carousel-item{
    max-height: 400px;
    overflow: hidden;
}


.carousel-item img.w-auto{
    width: auto;
    height: auto;
    max-height: 400px;
    position: relative;
}

.blog_items .carousel-control-prev, .carousel-control-next {
    color: #0a001f;
    opacity: 0.5;
}

.blog_items .carousel-control-prev{
    left: -25px;
}

.blog_items .carousel-control-next{
    right: -25px;
}

.blog_items .carousel-control-prev:hover, .blog_items .carousel-control-prev:focus, .blog_items .carousel-control-next:hover, .blog_items .carousel-control-next:focus {
    color: #0a001f;
}
