.navbar-brand img {width: 150px;}

.hero_imgs {gap: 20px;}

.bg_img_box {
  position: relative;
  width: 100%;
  height: 250px;

  border-radius: 20px;
}

.bg_img_box img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 20px;
  z-index: 20;
}

.bg_img_box .content {
  position: relative;
  z-index: 1;
}


#nav-icon1, #nav-icon2, #nav-icon3, #nav-icon4 {
  width: 30px;
  height: 23px;
  position: relative;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}

#nav-icon1 span, #nav-icon3 span, #nav-icon4 span {
  display: block;
  position: absolute;
  height: 3px;
  width: 100%;
  background: var(--gray);
  border-radius: 9px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

.navbar-toggler, .navbar-brand {
        z-index: 999;
    }

.preheader-moon img {width: 400px;}

.navbar-toggler #nav-icon4 span { background-color: #fff;
}

.navbar-toggler:focus {
  box-shadow: none !important;
  outline: none !important;
  border: 0px !important;
}

.navbar-toggler {
  box-shadow: none !important;
  outline: none !important;
  border: 0px !important;
}



.navbar-toggler #nav-icon4 span:nth-child(1) {
  top: 0px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

.navbar-toggler #nav-icon4 span:nth-child(2) {
  top: 10px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

.navbar-toggler #nav-icon4 span:nth-child(3) {
  top: 20px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
background: #FFF;
    width: 20px;
	margin-left: 10px;
}

.navbar-toggler #nav-icon4.open span:nth-child(1) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  top: -3px;
  left: 8px;
  width: 35px;
}

.navbar-toggler #nav-icon4.open span:nth-child(2) {
  width: 0%;
  opacity: 0;
}

.navbar-toggler #nav-icon4.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  top: 22px;
  left: 8px;
	    width: 35px;
    margin-left: 0px;
	  background:  #FFF;
}

.navbar-toggler {width: 60px; height: 60px; background-color: #FF9F00; border-radius: 50%; display:flex; justify-content: center; align-items: center;}


.navbar {padding-top: 20px; padding-bottom: 20px;}


.nav-link {padding: 15px 0;}

.navbar-nav {text-align: center;}

.navbar-nav a {color: #fff; font-size: 1rem; font-weight: 400; letter-spacing: 0.4px;}

.hero_additional {background-color: #009EDC; padding: 20px; border-radius: 20px; color: #fff;     margin-left: -50px;
    padding-left: 50px;}

.hero_additional {padding-top: 70px; margin-top: -50px;}

.atut_box {display: flex; flex-wrap: wrap; margin-top: 50px; gap: 20px;}
.atut_item {width: calc(50% - 10px);}

.about_yellow_sep {background-color: #FF9F00; height: 10px; width: 90%; border-radius: 10px; margin-left: -50px;}

.social-icons img {width: 36px; margin-right: 8px;}

.social-icons {flex: 1;}
.address {flex: 2;}
.hero_imgs {margin-top: 50px;}
.hero_section {margin-top: 30px;}


#o_nas {margin-top: 50px;}
#foteliki {margin-top: 75px;}
.hor_separator {margin-top: 20px; margin-bottom: 20px;}

.atut_item {margin-bottom: 20px;}

.atut_item img {width: 100px; margin-bottom: 10px;}


.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    width: 100%;
    padding-right: var(--bs-gutter-x, 1.5rem);
    padding-left: var(--bs-gutter-x, 1.5rem);
}

.foteliki_circ1 {width: 200px; height: 200px; position: absolute; right: 20px; bottom: -30px; border: 8px solid #9CCA1E; border-radius: 50%; z-index: 1;}

.foteliki_circ2 {width: 150px; height: 150px; position: absolute; left: -20px; top: -20px; background-color: #9CCA1E; border-radius: 50%; z-index: 1;}

.foteliki_img {margin-top: 50px; height: 250px;}

.hero_img_2 {    margin-right: -50px;
    width: calc(100% + 50px);}
    
#foteliki .btn-primary {border-radius: 50px; padding: 10px 20px;}

.wozki_img {
    margin-top: 50px;
    height: 250px;
}

.wozki_circ1 {
    width: 200px;
    height: 200px;
    position: absolute;
    left: -10px;
    bottom: -30px;
    border: 8px solid #E42585;
    border-radius: 50%;
    z-index: 1;
}


.wozki_circ2 {
    width: 150px;
    height: 150px;
    position: absolute;
    right: 40px;
    top: -20px;
    background-color: #E42585;
    border-radius: 50%;
    z-index: 1;
}

.stroller_test_img {
    background-image: url(/img/onas_1.webp);
    border-radius: 30px;
    background-size: cover;
    background-position: center;
    height: 100%;
    min-height: 400px;
    width: calc(100% + 56px); margin-top: -100px !important;
    z-index: -1;
}

main {overflow: hidden; max-width: 100%;}

.stroller_text_bg_white {background-color: #fff; padding: 50px 30px; border-radius: 30px; z-index:1; position: relative; margin-left: -30px;}

.cta_contact {text-decoration: none; font-weight: 500; background-color: #EF7A0D; color: #fff; padding: 8px 12px; border-radius: 50px;}

.footer_container {background-color: #0075AA;}

#foteliki h2 {position: relative;}

#foteliki h2:after {content: ""; background-image: url(/img/foteliki_icon.svg); width: 100px; height: 100px; background-size: contain; position: absolute; right: 0; top: -30px; background-repeat: no-repeat;}

.producer-box {margin-top: 50px;}

.separator {opacity: 0.3;}

.carseat_measure_img {margin-top: 70px;}

#wozki {margin-top: 70px;}


#wozki h2 {position: relative; padding-right: 150px;}

#wozki h2:after {content: ""; background-image: url(/img/wozki_icon.svg); width: 100px; height: 100px; background-size: contain; position: absolute; right: 0; top: -30px; background-repeat: no-repeat;}

.footer_container {padding-top: 50px; padding-bottom: 110px; color: #fff; margin-top: 75px; position: relative;}

.footer_container a {color: #fff; text-decoration: none;}

.footer_contact {display: flex; font-size: 90%;}

.footer_contact a {font-size: 110%;}

.footer_social-icons img {width: 36px; margin-left: 10px;}

.footer_top {display: flex; justify-content: space-between; padding-bottom: 40px; border-bottom: 1px solid #fff;}

.footer_contact_item:first-child {margin-right: 30px;}

.footer_contact_item a {font-weight: 700;}

footer ul {list-style-type: none; padding-left: 0;}

footer ul li a {padding: 6px 0; display: block;}

footer ul li:first-child a {padding-top: 0px;}

.footer_circles {background-image: url(/img/circles_footer.svg); width: 100%; height: 200px; background-repeat: no-repeat; margin-top: -60px; margin-left: 20px; margin-right: 20px; width: calc(100% - 40px); position: relative; z-index: 1; margin-bottom: 20px;}

.footer_container h4 {font-weight: 700; font-size: 18px; margin-bottom: 25px; margin-top: 50px;}

b, strong {
    font-weight: 600;
}

.footer_container:before {content: ""; background-color: #0075AA; left: -105px; height: 100%; width: calc(100% + 200px); top: 0; z-index: -1; position: absolute; border-radius: 25px;}

.footer_bottom p {font-size: 80%; opacity: 0.6;}


@media (min-width: 576px) {
    
.atut_box {gap: 50px;}
.atut_item {width: calc(50% - 25px);}

#foteliki h2 {padding-right: 100px;}

.foteliki_img {
    margin-top: 50px;
    height: 320px;
}

.footer_container {position: relative; z-index: 1;}


.footer_circles {height: 260px;}

.footer_container {border-radius: 30px;}

.footer_contact_item:first-child {margin-right: 50px;}

.footer_contact a {font-size: 120%;}

.footer_social-icons img {margin-left: 20px;}


}

@media(min-width: 768px) {

    .footer_contact a {
        font-size: 160%;
    }
 
 .navbar-collapse {background-color: #fff;}  
 
 header .navbar-nav a {color: #26353B;}
 
 .hero_img_2 {
    margin-right: 0px;
    width: 100%;
}

.navbar-brand img {
    width: 170px;
}

.hero_additional {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
width: calc(100% + 300px);
padding-right: 250px !important;
}

.navbar-nav a {
    font-size: 1rem;
}

.hero_additional {
    padding: 40px;
    padding-left: 50px;
    padding-top: 80px;
    margin-top: -40px;
}
    

.atut_item {
 
    text-align: center;
    margin-bottom: 0px;
            width: calc(50% - 10px);
}

.bg_img_box_onas {height: 100%;         width: calc(100% + 100px);
        margin-left: -100px;}

.atut_box {
    display: flex;
    flex-wrap: wrap;
    margin-top: 50px;
    gap: 20px;
}

.about_yellow_sep {
    height: 30px;
    border-radius: 30px;
}

#foteliki {margin-top: 100px;}

#wozki {margin-top: 100px;}

#foteliki h2:after {
    left: -40px;
    top: -95px;
}

.foteliki_img {
    margin-top: 0px;
    height: 100%;
    }
    
h2 {line-height: 1.1; margin-bottom: 50px;}

.foteliki_circ2 {width: 200px; height: 200px; left: -40px;}

p, body {font-weight: 300;
    line-height: 1.6;}
    
#foteliki .cta_contact {    background-color: #9CCA1E;}

#wozki .cta_contact {    background-color: #E42585;
}

.carseat_measure_img {
    margin-top: 0px;
    width: calc(100% + 100px);
}

.wozki_img {margin-top: 0px; height: 100%;}

.stroller_test_img {    width: calc(100% + 100px); margin-left: 100px;}

#wozki h2:after {top: -100px; left: -50px;}

#o_nas {margin-top: 85px;}

.foteliki_circ2 {top: -50px;}

.cta_contact {padding: 10px 23px;}

.container, .container-md, .container-sm {
        max-width: 100%;
    }

}


@media(min-width: 992px) {

.hero_additional {

    padding-top: 80px;
    width: calc(100% + 300px);
    padding-right: 220px;
    margin-top: -40px;
}

.hero_sep {width: 20px; display: block;}

.address {flex: inherit;}

.atut_item {text-align: start;}

.about_yellow_sep {margin-left: -150px;}

    .bg_img_box_onas {
width: 100%; margin-left: 0px;}

.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    width: 100%;
    padding-right: var(--bs-gutter-x, 2.5rem);
    padding-left: var(--bs-gutter-x, 2.5rem);
}

    p, body {
        font-weight: 300;
        line-height: 2;
    }
    
    .foteliki_circ2 {
        width: 300px;
        height: 300px;
        left: -80px;
        top: 50px;
    }
    
    #foteliki {margin-top: 150px;}
    
    #o_nas {margin-top: 150px;}
    
    #foteliki h2:after {
        left: -50px;
        top: -120px;
        width: 120px;
        height: 120px;
    }
    
    .atut_box {
        gap: 50px;
    }
    
    .atut_item {
        margin-bottom: 0px;
        width: calc(50% - 25px);
    }
    
    .producer-box {margin-top: 0px; height: 100%;
        display: flex; margin-left: -100px;  padding: 100px 50px; padding-left: 100px;  width: calc(100% + 100px);}
        
    .bg-testimonials {
        margin-top: 150px;
    }
    
.border-lg-radius {border-radius: 50px !important;}

.wozki_circ2 {
    width: 300px;
    height: 300px;
    left: -80px;
    top: 20px;
}

.wozki_circ1 {
    width: 200px;
    height: 200px;
    left: auto;
    right: 50px;
    bottom: -60px;
}

    #wozki h2:after {
        left: -50px;
        top: -150px;
        width: 120px;
        height: 120px;
    }
    
    #wozki {margin-top: 150px;}
    
    .stroller_test {margin-top: 75px;}
    
.stroller_test_img {
        width: calc(100% + 200px);
        margin-left: -200px; margin-top: 80px !important;}
        
.stroller_text_bg_white {padding: 50px; margin-left: 0; padding-left: 0;}



.footer_container:before { width: calc(100% + 250px); border-radius: 50px;
    }
    
footer {
    display: flex;
    align-items: center;
    margin-top: 180px;
}

.footer_circles {
    flex:1;
    background-image: url(/img/circles_footer_vert.svg);
    background-size: contain;
    width: 100%;
    height: 100%;
  margin-top: 0;
margin-left: 0;
    width: calc(100% + 140px);
    margin-left: -140px;
    position: relative;
    z-index: 1;
    margin-bottom: 0px;
    background-position: center right;
}

.footer_container {margin-top: 0px;}

.hero_additional {border-top-right-radius: 50px; border-bottom-right-radius: 50px;}


}

@media(min-width: 1200px) {
    
    .footer_container:before {
        width: calc(100% + 400px);
        border-radius: 50px;;
    }
    
    .carseat_measure_img {
        margin-top: 0px;
        width: calc(100% + 120px);
    }
    
    .footer_circles {height: 90%;margin-right: 0}
    
    .footer_container {padding-bottom: 50px;}
    
    .stroller_text_bg_white {padding-right: 100px;}
    

    
    
}

@media(min-width: 1300px) {
    .container, .container-md, .container-sm {
        max-width: 1300px;
    }

    .hero_additional {
        border-top-left-radius: 50px;
        border-bottom-left-radius: 50px;
    }
    
    h1 {font-size: 50px; padding: 50px 0;}
    h1 span {font-size: 60px;}
    
    h2 {font-size: 50px;}
    h2 span {font-size: 60px;}
    
    p, body {
        font-size: 18px;
        line-height: 1.8;
    }
    
    .bg_img_box img {border-radius: 50px;}
    
    .navbar-brand img {
        width: 200px;
    }
    
    .navbar {padding-top: 50px;}
    

    
}


@media(min-width: 1500px) {
    
    #foteliki h2:after {
        left: -180px;
        top: -120px;
        width: 170px;
        height: 170px;
    }
    
    #wozki h2:after {
        left: -180px;
        top: -120px;
        width: 170px;
        height: 170px;
    }
    
    .producer-box {
        height: 70%;
        margin-left: -100px;
        padding: 50px 50px;
        padding-left: 50px;
        width: calc(100% + 100px);
        position: relative;
    }
    
    .producer-box:before {content: ""; background-color: #9CCA1E; left: -105px; height: 200px; width: 200px; bottom: -50px; z-index: -1; position: absolute; border-radius: 50%;}
    
    #wozki .producer-box:before {content: ""; background-color: #E42585; left: -105px; height: 200px; width: 200px; bottom: -50px; z-index: -1; position: absolute; border-radius: 50%;}
    
    .grupy_wagowe {position: relative;}
    
    .grupy_wagowe_circ1 {
    width: 400px;
    height: 400px;
    position: absolute;
    right: -450px;
    bottom: -30px;
    border: 8px solid #9CCA1E;
    border-radius: 50%;
    z-index: 1;
}

    .footer_circles {background-image: url(/img/circles_footer.svg); margin-left: 0;
    margin-right: -100px;
    }
    
    .bg-testimonials {
    background-color: #F7F8FA;
    padding: 60px 0px;
    max-width: 1500px; margin-left: auto !important; margin-right: auto !important; border-radius: 50px; margin-top: 100px;
}

    .carseat_measure_img {
        width: 100%;
    }


    
}



@media (min-width: 992px) {
    
.hero_img_2 {margin-right: 0px; width: 100%;}

}



.advert_hero {margin-top: 50px;}
.advert_hero img {border-radius: 25px;}

.navbar-nav {
    text-align: center;
    background-color: #0075AA;
    border-radius: 25px;
    margin-top: 25px;
    padding: 30px;
}

.carseat_age {
    margin-top: 10px;
}

#o_nas .bg_img_box {margin-top: 30px;}

#foteliki .bg_img_box {margin-top: 60px;}

.grupy_wagowe {margin-top: 70px;}

#foteliki {margin-bottom: 150px;}

.cta_contact:hover {color: #fff;}
#foteliki .cta_contact:hover {background-color: #E42585;}

#wozki .cta_contact:hover {background-color: #9CCA1E;}

.footer_contact_item a, .footer_social-icons a, .social-icons a {transition: 200ms ease-in-out !important;
    -moz-transition: 200ms ease-in-out !important;
    -ms-transition: 200ms ease-in-out !important;
    -o-transition: 200ms ease-in-out !important;}
    
    .footer_contact_item a:hover {opacity: 0.6;}
    
    .footer_social-icons a:hover {opacity: 0.6;}
    
    .social-icons a:hover {opacity: 0.6;}



.cta_contact {transition: 200ms ease-in-out !important;
    -moz-transition: 200ms ease-in-out !important;
    -ms-transition: 200ms ease-in-out !important;
    -o-transition: 200ms ease-in-out !important;}



@media (min-width: 768px) {
    
    .advert_hero {margin-top: 0px;}
    
    .navbar-nav {
    text-align: center;
    background-color: rgba(255,255,255,0);
    border-radius: 0px;
    margin-top: 0px;
    padding: 0px;
}

#o_nas .bg_img_box {margin-top: 0px;}

#foteliki .bg_img_box {margin-top: 0px;}

.grupy_wagowe {margin-top: 100px;}
    
    .navbar-collapse {
        background-color: rgba(255, 255, 255, 0);
    }
    
    header, .navbar {background-color: rgba(255, 255, 255, 0);}
    
    header {position: relative; z-index: 99;}
    
    .navbar-nav {margin-left: 30px;}


    
}


@media (min-width: 992px) {
    
    .advert_hero img {border-radius: 0px;}
    
.hero_img_2 {margin-right: 0px; width: 100%;}

.advert_hero {margin-top: -160px;
    width: calc(100% + 50px);
}

.advert_hero img {border-bottom-right-radius: 0px; border-bottom-left-radius: 50px;
}

.advert_hero {position: relative;
    width: calc(100% + 50px);
    height: calc(100% + 110px);
    border-radius: 50px;}
    
.advert_hero img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 1;
}



}

@media (min-width: 1200px) {
    
.hero_section h1 {margin-top: 50px; margin-bottom: 50px;}


}


@media (min-width: 1300px) {
    
.advert_hero img {border-bottom-right-radius: 50px; border-bottom-left-radius: 50px;
}

.social-icons img {width: 50px; margin-right: 20px;}

.footer_social-icons img {
    width: 44px;
}

}

