/* Extra large devices (large desktops, 1800px and up) */
@media (max-width: 1800px) {

}
@media (max-width: 1300px){ 
.main-menu .navigation > li{margin: 0px 10px;}
.container, .container-lg, .container-md, .container-sm, .container-xl {

}  
.tp-parallax-wrap {
    transform-style: preserve-3d;
    padding-left: 5em;
}
}

/* Extra large devices (large desktops, 1800px and up) */
@media (max-width: 1500px) {

}
@media (max-width: 1024px){
	.tp-parallax-wrap {
    transform-style: preserve-3d;
    padding-left: 5em;
}
	.main-menu {
    display: none;
}
	.main-header .nav-outer .mobile-nav-toggler {
    display: block;
    top: 0.5em;
}
 .main-menu .navigation > li > ul, .main-menu .navigation > li > ul > li > ul {
        display: block !important;
        visibility: hidden;
        opacity: 0;
    }
.natrual-product-text {
    padding: 15px 50px 15px;
}

.natrual-product {
    padding: 20px 20px;
}
.testimonial-box {
    display: flex;
    padding: 0 300px;
}
.testimonial-milk-banner {
    position: absolute;
    top: 100px;
}
   .Welfare-Automated h3:after {
    content: "";
    width: 58px;
    height: 3px;
    background: #FCB900;
    position: absolute;
    right: -92px;
    top: 30px;
}
.Welfare-Automated span {
    position: absolute;
    right: -67px;
    top: -2px;
    padding: 5px 11px;
    background: #FCB900;
    border-radius: 85px;
    border: 1px solid;
    font-size: 1rem;
}
.Welfare h3:after {
    content: "";
    width: 58px;
    height: 3px;
    background: #FCB900;
    position: absolute;
    right: -91px;
    top: 20px;
}
.Welfare span {
    position: absolute;
    right: -65px;
    top: -12px;
    padding: 5px 11px;
    background: #FCB900;
    border-radius: 85px;
    border: 1px solid;
    font-size: 1rem;
}
.Welfare-Management h3:before {
    content: "";
    width: 58px;
    height: 3px;
    background: #FCB900;
    position: absolute;
    top: 20px;
    left: -91px;
}
.Welfare-Management span {
    position: absolute;
    left: -65px;
    top: -12px;
    padding: 5px 11px;
    background: #FCB900;
    border-radius: 85px;
    border: 1px solid;
    font-size: 1rem;
}
.Welfare-Preservation h3:before {
    content: "";
    width: 58px;
    height: 3px;
    background: #FCB900;
    position: absolute;
    top: 20px;
    left: -91px;
}
.Welfare-Preservation span {
    position: absolute;
    left: -65px;
    top: -12px;
    padding: 5px 11px;
    background: #FCB900;
    border-radius: 85px;
    border: 1px solid;
    font-size: 1rem;
}
.milk-bottle {
    padding: 75px 53px;
}
.brand {
    width: 20%;
    padding: 0px 50px;
}
.Optimization {
    padding: 0px 20px;
}
.Optimization-date {
    padding-bottom: 0px;
}
}



@media (max-width: 992px){
    .main-menu .navigation > li > ul, .main-menu .navigation > li > ul > li > ul {
        display: block !important;
        visibility: hidden;
        opacity: 0;
    }

    .main-header .nav-outer .mobile-nav-toggler {
        display: block;
        top: -2.5em;
    }
    .header {
    position: relative;
    display: none;
}
header.m-header {
    display: block;
}
.nav__links {
    display: block;
}


}

@media only screen and (min-width: 768px) and (max-width: 991px){
    .main-menu .navigation > li > ul, .main-menu .navigation > li > ul > li > ul {
        display: block !important;
        visibility: hidden;
        opacity: 0;
    }
    .main-menu{ display:none;}
    .main-header .nav-outer .mobile-nav-toggler {
        display: block;
        top: 0.5em;
    }
    .milk-banner {
    z-index: 1;
    position: absolute;
    top: 228px;
}
.farm {
    background: url(../img/Rectangle3.png);
    
}
.pt-90 {
    padding-top: 40px;
}
.natrual-product {
    padding: 6px 20px;
}
.natrual-product h3 {
    font-size: 1.6rem;
    font-weight: 600;
    margin-bottom: 10px;
}
.natrual-product p {
    font-size: 1rem;
    font-weight: 500;
    margin-bottom: 10px;
}
.play {
    position: absolute;
    top: 11%;
    left: 40%;
}
.milk-bottle {
    padding: 100px 0px;
}
.milk {
    padding: 50px 0px;
}
.testimonial-box {
    display: flex;
    padding: 0 160px;
}
.Welfare span {
    position: absolute;
    right: -46px;
    top: -12px;
    padding: 5px 11px;
    background: #FCB900;
    border-radius: 85px;
    border: 1px solid;
    font-size: 1rem;
}
.Welfare h3:after {
    content: "";
    width: 58px;
    height: 3px;
    background: #FCB900;
    position: absolute;
    right: -71px;
    top: 20px;
}
.Welfare-Automated h3:after {
    content: "";
    width: 58px;
    height: 3px;
    background: #FCB900;
    position: absolute;
    right: -70px;
    top: 30px;
}
.Welfare-Automated span {
    position: absolute;
    right: -50px;
    top: -2px;
    padding: 5px 11px;
    background: #FCB900;
    border-radius: 85px;
    border: 1px solid;
    font-size: 1rem;
}
.Welfare-Management h3:before {
    content: "";
    width: 58px;
    height: 3px;
    background: #FCB900;
    position: absolute;
    top: 20px;
    left: -70px;
}
.Welfare-Management span {
    position: absolute;
    left: -44px;
    top: -12px;
    padding: 5px 11px;
    background: #FCB900;
    border-radius: 85px;
    border: 1px solid;
    font-size: 1rem;
}
.Welfare-Preservation h3:before {
    content: "";
    width: 58px;
    height: 3px;
    background: #FCB900;
    position: absolute;
    top: 20px;
    left: -70px;
}
.Welfare-Preservation span {
    position: absolute;
    left: -45px;
    top: -12px;
    padding: 5px 11px;
    background: #FCB900;
    border-radius: 85px;
    border: 1px solid;
    font-size: 1rem;
}
.brand {
    width: 20%;
    padding: 0px 40px;
}
.Dairy-Nutrition {
    display: block;
    margin-bottom: 30px;
}
.Optimization {
    padding: 20px 0px;
}
.contact-milk-banner {
    position: absolute;
    top: 160px;
    width: 100%;
}
}
@media only screen and (min-width: 375px) and (max-width: 768px) {
.play {
    position: absolute;
    top: 23%;
    left: 21%;
}
}
/* Small devices (landscape phones, 576px and up) */
@media only screen and (min-width: 375px) and (max-width: 767px) {
    .main-header .nav-outer .mobile-nav-toggler {
        top: -2.5em;
    }
    .main-header .nav-outer {
        height: 1px;
    }
    .btn-style-one {
        width: 59px;
        height: 59px;
    }

    .top-bar {
        display: none
    }
 .milk-banner {
    z-index: 1;
    position: absolute;
    top: 386px;
}
    .our-dairy {
        margin: 0 0 30px 0;
    }
.our-farm {
    padding-left: 10px;
    padding-right: 10px;
}
.pt-90 {
    padding-top: 40px;
}
.products {
    padding-left: 10px;
    padding-right: 10px;
}
.our-farmer{
    padding-left: 10px;
    padding-right: 10px;
}
.capable{
    padding-left: 10px;
    padding-right: 10px;
}
.farm {
    background: url(../img/Rectangle3.png);
    
}
.play {
    position: absolute;
    top: 12%;
    left: 40%;
}
.milk {
    padding: 0px 20px;
}
.milk-bottle {
  padding: 0 20px; 
}
.testimonial-box {
    display: flex;
    padding: 0 20px;
} 
.testimonial-right-box {
    padding: 0 10px;
}
.testimonial-milk-banner {
    position: absolute;
    top: 250px;
}
.Welfare span {
    display: none;
}
.Welfare h3:after {
    display: none;
}
.Welfare-Automated h3:after {
    display: none;
}
.Welfare-Automated span {
   display: none;
}
.Welfare-Management h3:before {
    display: none;
}
.Welfare-Management span {
    display: none;
}
.Welfare-Preservation h3:before {
   display: none;
}
.Welfare-Preservation span {
    display: none;
}
.line {
    display: none;
    text-align: center;
}
.Welfare-Management {
     margin-top: 0px; 
}
.Welfare-Preservation {
    margin-top: 20px;
}
.Welfare-Automated {
    margin-top: 20px;
}

.brand {
    width: 50%;
    padding: 0 50px;
}
.Dairy-Nutrition {
     display: block;
    margin-bottom: 30px;
}
.contact-milk-banner {
    position: absolute;
    top: 49rem;
}
.Optimization {
    padding: 20px 0px;
}
.blog {
    padding-bottom: 30px;
}

}




@media only screen and (min-width: 320px) and (max-width: 374px) {
   
    .milk-banner {
    z-index: 1;
    position: absolute;
    top: 408px;
}
    .our-dairy {
        margin: 0 0 30px 0;
    }
.milk {
    padding: 0px;
}
.milk-bottle {
     padding: 0px; 
}
.our-farm {
    padding-left: 10px;
    padding-right: 10px;
}
.products {
    padding-left: 10px;
    padding-right: 10px;
}
.our-farmer{
    padding-left: 10px;
    padding-right: 10px;
}

.pt-90 {
    padding-top: 40px;
}
.farm {
    background: url(../img/Rectangle3.png);
     
}
.play {
    position: absolute;
    top: 12%;
    left: 40%;
}
.our-farm {
    text-align: center;
    width: 100%;
    padding: 0 10px;
}
.testimonial-box {
    display: flex;
    padding: 0 20px;
} 
.testimonial-right-box {
    padding: 0 10px;
}
.testimonial-milk-banner {
    position: absolute;
    top: 348px;
}
.Welfare span {
    display: none;
}
.Welfare h3:after {
    display: none;
}
.Welfare-Automated h3:after {
    display: none;
}
.Welfare-Automated span {
   display: none;
}
.Welfare-Management h3:before {
    display: none;
}
.Welfare-Management span {
    display: none;
}
.Welfare-Preservation h3:before {
   display: none;
}
.Welfare-Preservation span {
    display: none;
}
.line {
    display: none;
    text-align: center;
}
.Welfare-Management {
     margin-top: 0px; 
}
.Welfare-Preservation {
    margin-top: 20px;
}
.Welfare-Automated {
    margin-top: 20px;
}
.brand {
    width: 50%;
    padding: 0 40px;
}


.Dairy-Nutrition {
     display: block;
    margin-bottom: 30px;
}
.contact-milk-banner {
    position: absolute;
    top: 48rem;
}
.blog {
    padding-bottom: 30px;
}

}

@media only screen and (min-width: 280px) and (max-width:319px) {
  .milk-banner {
    z-index: 1;
    position: absolute;
    top: 425px;
}
    .our-dairy {
        margin: 0 0 30px 0;
    }
.pt-90 {
    padding-top: 40px;
}
    .our-dairy {
        margin: 0 0 30px 0;
    }
.our-farm {
    padding-left: 10px;
    padding-right: 10px;
}
.products {
    padding-left: 10px;
    padding-right: 10px;
}
.our-farmer{
    padding-left: 10px;
    padding-right: 10px;
}
.our-client{
    padding-left: 10px;
    padding-right: 10px;
}
.capable {
    padding-left: 10px;
    padding-right: 10px;
}
.farm {
    background: url(../img/Rectangle3.png);
    
}
.play {
    position: absolute;
    top: 7%;
    left: 36%;
}
.both-brand {
     display: block; 
    padding: 30px 10px;
} 
.testimonial-box {
    display: flex;
    padding: 0 20px;
} 
.testimonial-right-box {
    padding: 0 10px;
}
.testimonial-milk-banner {
    position: absolute;
    top: 400px;
}
.Optimization {
    padding: 20px 0px;
}
.Nutrition-content h3 {
    font-size: .6rem;
    margin: 0;
    font-weight: 600;
}
.Nutrition-content span {
    font-size: 0.4rem;
    font-weight: 600;
    color: #828282;
}
.Welfare span {
    display: none;
}
.Welfare h3:after {
    display: none;
}
.Welfare-Automated h3:after {
    display: none;
}
.Welfare-Automated span {
   display: none;
}
.Welfare-Management h3:before {
    display: none;
}
.Welfare-Management span {
    display: none;
}
.Welfare-Preservation h3:before {
   display: none;
}
.Welfare-Preservation span {
    display: none;
}
.line {
    display: none;
    text-align: center;
}
.Welfare-Management {
     margin-top: 0px; 
}
.Welfare-Preservation {
    margin-top: 20px;
}
.Welfare-Automated {
    margin-top: 20px;
}
.brand {
    width: 33%;
    padding: 0px 20px;
}
.milk {
    padding: 50px 0px;
}
.milk-bottle {
    padding: 0px 30px;
}
.Dairy-Nutrition {
     display: block;
    margin-bottom: 30px;
}
.contact-milk-banner {
    position: absolute;
    top: 88%;
    width: 100%;
}
.blog {
    padding-bottom: 30px;
}

}
@media only screen and (min-width: 820px) and (max-width: 1180px){
.play {
    position: absolute;
    top: 22%;
    left: 22%;
}}
@media only screen and (min-width: 320px) and (max-width: 767px){
    .play {
        position: absolute;
        top: 12%;
        left: 38%;}  
}