/*////////////////////////////////////////////////////// Responsive CSS Structure //////////////////////////////////////////////////////*/


@media (min-width: 1400px) {
    .container { max-width: 1352px; }

    /*header*/
    .h-content { max-width: 915px; }
    /*header*/


    /* sortiment css */
    .big-button .btn { padding: 12px 46px;}
    /* sortiment css */

    /*product*/
    .products-slider-arrows .slick-next { right: 7px; } 
    .product-slide img{ margin: 0 auto; }
    .products-slider-arrows .slick-arrow svg { height: 19px; width: 24px; }
    /*product*/

    /* form css */
    .form-main .form-kg .form-group {width: 100%;max-width: 188px;}
    /* form css */


    /* ------ footer ------ */
    .footer-icon { margin: -25px 0 0 25px; }
    /* ------ footer ------ */

}

@media (min-width: 1300px) and (max-width: 1399px){
    /*header*/
    .h-content { max-width: 950px; }
    /*header*/

    /*product*/
    .products-slider-arrows .slick-prev { left: -22px; } 
    .products-slider-arrows .slick-next { right: -3px; } 
    /*product*/

}

@media (min-width: 1200px) and (max-width: 1399px){
    .main-title {font-size: 36px;}
    .block-title {font-size: 26px;}
    .reguler-details-roboto {font-size: 15px;}
    .reguler-details-glory {font-size: 15px;}
    .card-title {font-size: 32px;}
    .card-price {font-size: 24px;}

    /*header*/
    .navbar-brand img{ max-width: 200px; } 
    .header .navbar-brand { margin: -29px 0 -26px 0; }
    .h-content { max-width: 859px; }
    /*header*/

    /* ----- banner css ----- */
    .banner-wrapper {padding: 82px 0 47px 0;}
    /* ----- banner css ----- */
    
    /* ------ sortiment css ------ */
    .sortiment-card-box {flex-direction: row;gap: 30px;}
    .sortiment-card-box .sortiment-item-1 {max-width: 100%;}
    .sortiment-card-box .sortiment-item-2 {max-width: 100%;}
    .sortiment-card-box .sortiment-item-3 {max-width: 100%;}
    .sortiment-main .main-title {padding: 0 0 68px 0;}
    /* ------ sortiment css ------ */

    /*product*/
    .products-slider-arrows .slick-prev { left: -22px; } 
    .products-slider-arrows .slick-next { right: -3px; } 
    /*product*/

    /* section form css */
    .section-form-main .section-box {gap: 80px; }
    .section-left ol li {font-size: 22px;}
    /* section form css */
    .products-main { padding: 60px 0 40px 0; }
}


@media (min-width: 992px) and  (max-width: 1199px){
    .main-title {font-size: 34px;}
    .block-title {font-size: 24px;}
    .reguler-details-roboto {font-size: 14px;}
    .reguler-details-glory {font-size: 14px;}
    .card-title {font-size: 28px;}
    .card-price {font-size: 22px;}


    /* ----- header -----*/
    header .navbar-nav .nav-item { padding: 0 16px; margin: 0; }
    .header .navbar-nav .nav-item .nav-link { padding: 18px 0; }
    .navbar-brand img{ max-width: 100px; } 
    .header .navbar-brand { margin: -10px 0 -8px 0; } 
    .h-content { padding: 19px 0;     max-width: 781px; }
    /* ----- header -----*/


    /* ----- banner css ----- */
    .banner-wrapper {padding: 76px 0 47px 0;}
    .banner-box .banner-left {max-width: 500px;gap: 16px;}
    /* ----- banner css ----- */

    /* ------ sortiment css ------ */
    .sortiment-card-box {flex-direction: row;gap: 30px;}
    .sortiment-card-box .sortiment-item-1 {max-width: 100%;}
    .sortiment-card-box .sortiment-item-2 {max-width: 100%;}
    .sortiment-card-box .sortiment-item-3 {max-width: 100%;}
    .sortiment-main .main-title {padding: 0 0 52px 0;}
    /* ------ sortiment css ------ */

   /*products*/
   .products-main { padding: 70px 0 10px 0; } 
   .product-name .block-title { margin-bottom: 22px; } 
   .products-slider-arrows .slick-prev { left: -11px; } 
   .products-slider-arrows .slick-next { right: -3px; } 
   .products-slider-arrows .slick-arrow svg { height: 19px; width: 19px; } 
   .product-details .reguler-details-roboto { padding: 24px 0 22px;        font-size: 15px; } 
   .product-details { border-radius: 14px; padding: 18px 18px; }
   .product-name .reguler-details-glory { font-size: 15px; }
   /*products*/

    /* section form css */
    .section-form-main .section-box {gap: 60px; }
    .section-box .section-left { max-width: 400px; }
    .section-left ol li {font-size: 18px;}
    .form-main .inquiry-box {gap: 14px;max-width: 100%;}
    .form-main .inquiry-box .form-group {flex-basis: 220px;}
    .form-main .form-babyname {gap: 20px;}
    .form-main { margin: 20px 0 0 0; }
    .form-main .form-opctions { margin: 28px 0 0 0; }
    .form-main .form-babyname { margin: 20px 0 0 0;}
    .form-main .form-textarea { margin: 20px 0 0 0; }
    .form-main .form-kg { margin: 20px 0 0 0; }
    /* section form css */

   /* ----- footer css ----- */
   .footer-content{margin: 0 0 0 15px;}
   .footer-icon{margin: 0 0 0 15px;}
   .footer-right-content{ margin: 0; }
   /* ----- footer css ----- */

}

@media (max-width: 991px) {

    /* ----- banner css ----- */
    .banner-wrapper {padding: 68px 0 47px 0;}
    .banner-main .main-title {text-align: center;}
    .banner-main .banner-box {flex-direction: column-reverse;}
    .banner-box  {text-align: center;}
    .banner-box .banner-right {width: 100%;max-width: 100%; margin: 0 auto;}
    .banner-box .banner-left {max-width:100%;gap: 16px;}
    /* ----- banner css ----- */

    /* ------- sortiment css ------- */
    .sortiment-card-box {flex-wrap: wrap; flex-direction:column; align-items: center; gap: 20px;}
    .big-button .btn { font-size: 24px;}
    .sortiment-main .big-button {margin: 36px 0 0 0;}
    .sortiment-main .main-title {text-align: center;padding: 0 0 38px 0;}
    /* ------- sortiment css ------- */
    
    
    /* section form css */
    .section-form {padding: 50px 0 40px 0;}
    .section-form-main .section-box {gap: 40px;flex-direction: column; }
    .section-box .section-left { max-width: 100%; }
    .section-left ol { margin: 20px 0 0 0; }
    .section-left ol li {font-size: 15px;margin: 14px 0 0 0;}
    .section-box .section-right {max-width: 100%;}
    .form-main .inquiry-box {gap: 14px;max-width: 100%;}
    .form-main .inquiry-box .form-group {flex-basis: 48%;}
    .form-opctions .babyname-specific { width: 100%; max-width: 100%; }
    .form-main { margin: 20px 0 0 0; }
    .form-main .form-opctions { margin: 20px 0 0 0; }
    .form-main .form-babyname { margin: 20px 0 0 0;gap: 16px; flex-direction: column;}
    .form-main .form-textarea { margin: 20px 0 0 0; }
    .form-main .form-kg { margin: 20px 0 0 0; }
    /* section form css */


    /* ----- footer ----- */
    .footer-right { justify-content: center;        margin: 15px auto 0 auto;}
    /* ----- footer ----- */


}

@media (min-width: 768px) and (max-width: 991px){
    .main-title {font-size: 32px;}
    .block-title {font-size: 22px;}
    .reguler-details-roboto {font-size: 14px;}
    .reguler-details-glory {font-size: 14px;}
    .card-title {font-size: 26px;}
    .card-price {font-size: 22px;}

    /* ----- header ----- */
        header .navbar-nav .nav-item { padding: 0 16px; margin: 0; }
    .navbar-brand img{ max-width: 100px; } 
    .header .navbar-brand { margin: -10px 0 -8px 0; } 
    .h-content { padding: 19px 0; }
    /* .navbar-nav .dropdown .dropdown-menu { top: 34px; } */
    /* ----- header ----- */

    /* ----- banner css ----- */
    .banner-wrapper {padding: 60px 0 47px 0;}
    .banner-box {gap: 48px;}
    .banner-main .main-title {margin: 0 0 48px 0;}
    /* ----- banner css ----- */

    /* ------ sortiment css ------ */
    .sortiment-card-box .sortiment-item-1 {max-width: 100%;}
    .sortiment-card-box .sortiment-item-2 {max-width: 100%;}
    .sortiment-card-box .sortiment-item-3 {max-width: 100%;}
    /* ------ sortiment css ------ */

    /* ---- babys css ---- */
    .babys-main{padding: 34px 0;}
    .babys-content {padding: 0 0 0 40px;}
    .babys-content .reguler-details-glory {margin: 17px 0 0 0;}
    .babys-btn {margin: 22px 0 0 0;}
    /* ---- babys css ---- */

     /*products*/
     .products-main { padding: 70px 0 0 0; } 
     .product-name .block-title { margin-bottom: 22px; } 
     .products-slider-arrows .slick-prev { left: -11px; } 
     .products-slider-arrows .slick-next { right: -3px; } 
     .products-slider-arrows .slick-arrow svg { height: 19px; width: 19px; } 
     .product-details .reguler-details-roboto { padding: 24px 0 22px;        font-size: 15px; } 
     .product-details ul li { font-size: 15px; } 
     .product-details ul{ padding-left: 25px; } 
     .product-details { border-radius: 14px; padding: 18px 18px; }
     .product-name .reguler-details-glory { font-size: 15px; }
     .product-name .main-title { margin: 13px 0 18px; font-size: 27px; }
     /*products*/


    /* ---- footer css ---- */
    .footer-left{  margin: 0 auto; }
    .footer-content{width: 100%; max-width: 111px; margin: 0 0 0 15px;}
    .footer-content br{display: none;}
    .footer-icon{margin: 0 0 0 15px;}
    .footer-right{ margin: auto auto 0 auto; }
    .footer-right-content{margin: 0;}
    .footer-right-content .reguler-details-roboto { padding: 0 10px 0 12px; }
    /* ---- footer css ---- */

   
}

@media (min-width:768px){
    /* ----- header ----- */
    .navbar-nav .dropdown > .dropdown-toggle:hover:after,
    .navbar-nav .dropdown:hover > .dropdown-toggle:after { transform: rotate(-180deg); -webkit-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -ms-transform: rotate(-180deg); -o-transform: rotate(-180deg); }
    .navbar-nav .dropstart.show,
    .navbar-nav .dropend.show,
    .navbar-nav .dropdown-menu.show { display: none; }
    .navbar-nav li.dropstart .dropdown-toggle:before { position: absolute; left: 5px; border: none; transform: rotate(90deg); -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); }
    .navbar-nav li.dropend .dropdown-toggle:after { position: absolute; right: 5px; border: none; transform: rotate(-90deg); -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); }
    .navbar-nav .dropdown-menu { display: block; visibility: hidden; opacity: 0; left: 0; min-width: inherit; transition: 0.7s; -webkit-transition: 0.7s; -moz-transition: 0.7s; -ms-transition: 0.7s; -o-transition: 0.7s; }
    .navbar-nav li.dropstart > .dropdown-menu { right: 100%; top: -5px; }
    .navbar-nav li.dropend > .dropdown-menu { left: 100%; top: -5px; transform: none; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; }
    .navbar-nav li.dropstart:hover > .dropdown-menu,
    .navbar-nav li.dropend:hover > .dropdown-menu,
    .navbar-nav li.dropdown:hover > .dropdown-menu { display: block; visibility: visible; opacity: 1; z-index: 99999;}
    .navbar-nav li.dropstart .dropdown-menu { left: auto; right: 100%; top: 0; }
    .navbar-nav li.dropend .dropdown-menu { left: 100%; top: 0; }
    .navbar-nav li.dropstart:hover .dropdown-toggle,
    .navbar-nav li.dropend:hover .dropdown-toggle { color: #0a4557 !important; background: #ffffff !important; }
    /* ----- header ----- */
}

@media (max-width: 767px) {
    .main-title {font-size: 32px;}
    .block-title {font-size: 22px;}
    .reguler-details-roboto {font-size: 13px;}
    .reguler-details-glory {font-size: 13px;}
    .card-title {font-size: 24px;}
    .card-price {font-size: 20px;}

    /* ----- header ------ */
    .header .navbar-nav .nav-item { padding: 10px 0; text-align: left; margin: 0; width: 100%;}
       /* .dropdown-menu li{
        width: 100%;
    } */
    .navbar-nav .dropdown .dropdown-menu li .dropdown-item { text-align: left; }
    .header .navbar-nav .nav-item .nav-link {display: inline-block;}
    .header .social-media {padding: 3px 10px; margin: 0 0 0 15px; max-width: 158px; width: 100%; margin: 20px auto 0;}
    .social-media ul {justify-content: center;}
    .social-media ul li {padding: 0 10px 0 0;}
    .header .navbar-toggler { padding: 0; border: none; box-shadow: none; position: relative; z-index: 9999; }
    .header .navbar-toggler span { width: 25px; height: 2px; background-color: #fff; margin-bottom: 6px; display: block; position: relative; transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; }
    .header .navbar-toggler span:last-child { margin-bottom: 0; }
    .header .navbar-toggler.open span:first-child { top: 8px; transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); }
    .header .navbar-toggler.open span:nth-child(2) {opacity: 0;}
    .header .navbar-toggler.open span:last-child { top: -8px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); }
    .header .navbar-collapse { position: fixed; text-align: center;   z-index: 999;  background-color: var(--light-purple); top: 0; bottom: 0; right: -100%; max-width: 100%; width: 100%; height: 100%; overflow: auto; padding: 60px 40px 40px; transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; }
    .header .navbar-collapse.show {right: 0; height: auto;}
    .header .navbar-collapse::after { content: ""; position: fixed; z-index: 999;   background-color: var(--light-purple); top: 0; right: -100%; max-width: 100%; width: 100%; height: 60px; transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; }
    .header .navbar-collapse.show::after {right: 0;}

    /*drop down*/
    .header .navbar-nav .nav-item .nav-link {
           padding: 0 0 10px 0;
    
    }
    .navbar-nav .dropstart .dropdown-toggle,
    .navbar-nav .dropend .dropdown-toggle { padding-right: 35px !important; }
    .navbar-nav .dropstart .dropdown-toggle:before,
    .navbar-nav .dropend .dropdown-toggle:after { position: absolute; right: 15px; transition: 0.4s; -webkit-transition: 0.4s; -moz-transition: 0.4s; -ms-transition: 0.4s; -o-transition: 0.4s; }
    .navbar-nav .dropstart > .dropdown-toggle,
    .navbar-nav .dropend > .dropdown-toggle,
    .navbar-nav .dropdown > .dropdown-toggle { background: transparent !important; }
    .header .navbar .login-contain ul{flex-direction: column;}
    .navbar-nav .dropstart .dropdown-toggle.show:before,
    .navbar-nav .dropend .dropdown-toggle.show:after,
    .navbar-nav .dropdown > .dropdown-toggle.show:after { transform: rotate(-180deg); -webkit-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -ms-transform: rotate(-180deg); -o-transform: rotate(-180deg); }
    .navbar-brand img{ max-width: 100px; } 
    .header .navbar-brand { margin: -5px 0; } 
    .navbar-expand-md .navbar-nav { margin: 70px 0 0 0; align-items: flex-start; } 
    .h-content{ display: none; }
    /* ----- header ------ */


    /* ----- banner css ----- */
    .banner-wrapper {padding: 48px 0 47px 0;}
    .banner-main .main-title {margin: 0 0 48px 0;}
    .banner-box {gap: 40px;}
    /* ----- banner css ----- */

    /* -----babys css----- */
    .babys-img {width: 100%;max-width: 80%;margin: 0 auto;}
    /* -----babys css----- */

    /*products*/
    .products-main { padding: 30px 0; } 
    .product-name .block-title { margin-bottom: 22px; } 
    .products-slider-arrows .slick-prev { left: -11px; } 
    .products-slider-arrows .slick-next { right: -3px; } 
    .products-slider-arrows .slick-arrow svg { height: 19px; width: 19px; } 
    .product-details .reguler-details-roboto { padding: 24px 0 22px;        font-size: 15px; } 
    .product-details ul li { font-size: 16px; } 
    .product-details ul{ padding-left: 25px; } 
    .product-details { border-radius: 14px; padding: 18px 18px; }
    .product-name .reguler-details-glory { font-size: 15px; }
    /*products*/

    /* section form css */
    .form-main .inquiry-box .form-group { flex-basis: 100%; }
    /* section form css */

}

/*---------- Small Mobile , IPhone Start ----------*/

/*=== Screen Size = 240, 320, 360, 480, 568 ===*/
@media (min-width: 576px) and (max-width: 767px){
    /*----  babys css ----*/
    .babys-main{padding: 32px 0px;}
    .babys-content{padding: 20px 0 0 0; text-align: center;}
    .babys-img img {width: 100%;max-width: 95%;}
    /*----  babys css ----*/

    /* ---- footer css ---- */
    .footer-main{ flex-direction: column; }
    .footer-left{  margin: 0 auto; }
    /* ---- footer css ---- */

}

@media (min-width: 240px) and (max-width: 575px){
    /*----  babys css ----*/
    .babys-content{ padding: 10px 0 0 0; text-align: center; }
    .babys-content .reguler-details-glory { margin: 17px 0 0 0; } 
    .babys-btn{margin: 22px 0 0 0;}
    /*----  babys css ----*/

    /*products*/
    .products-main { padding: 30px  0; } 
    .product-name .block-title { margin-bottom: 22px; } 
    .products-slider-arrows .slick-prev { left: -11px; } 
    .products-slider-arrows .slick-next { right: -3px; } 
    .products-slider-arrows .slick-arrow svg { height: 19px; width: 19px; } 
    .product-details .reguler-details-roboto { padding: 24px 0 22px; } 
    .product-details ul li { font-size: 14px; } 
    .product-details ul{ padding-left: 25px; } 
    .product-details { border-radius: 14px; padding: 18px 18px; }
    /*products*/

    /* ---- footer css ---- */
    .footer-main{ flex-direction: column; }
    .footer-left{ flex-direction: column; margin: 0 auto; text-align: center;}
    .footer-content{margin: 20px 0 0 0;}
    .footer-icon ul li{ margin: 14px 0 0 0;}
    .footer-media-icon ul{justify-content: center;}
    .footer-icon{margin: 20px 0 0 0 ;}
    .footer-icon ul{margin: 0 ;}
    .footer-right{ margin: 12px auto 0 auto; justify-content: center;}
    .footer-right-content{justify-content: center; margin: 0;}
    .footer-right-content .reguler-details-roboto{margin: 0;}
    .footer-right-content .add:nth-child(even)::after{ display: none; }
    /* ---- footer css ---- */
}

@media (max-width: 389px) {
    /* ----- banner css ----- */
    .banner-main .main-title {margin: 0 0 38px 0;}
    .banner-box {gap: 32px;}
    /* ----- banner css ----- */


    /* ----- bilder ----- */
    .grid-item { margin: 15px 0;}
    .grid-item--width1 {width:100%; max-width: 100%;}
    .grid-item--width2 {width:100%; max-width: 100%;}
    .grid-item--width3 {width:100%; max-width: 100%;}
    .grid-item--width4 {width:100%; max-width: 100%;}
    .grid-item--width5 {width:100%; max-width: 100%;}
    .grid-item--width6 {width:100%; max-width: 100%;}
    .grid-item--width7 {width:100%; max-width: 100%;}
    .grid-item--width8 {width:100%; max-width: 100%;}
    /* ----- bilder ----- */



}