@charset "utf-8";
/* CSS Document */

@media (max-width:768px) { /* Mobile (and larger) */
    .nonMobile{display:none;}
	.mobile{display: block;}
    h1, .h1{text-align: center;margin: 70px 0 30px 0; font-size: 50px;}
    h2{margin: 0 0 20px 0;}
	.h2{font-size: 46px; margin: 0;}
    .break{font-size: 40px; word-wrap: break-word;}
    .headerBehind{height: 60px;}

    header{height: 60px;}
    #dog{margin: 30px 0;}
    #cat{margin-bottom: 30px;}

    .toggleMenu{display:block;}
	.mainNav{display:none; position: fixed; width: 100%; background: #fff; z-index: 6; flex: none; max-width: none; padding: 50px 0; height: 100vh; overflow-y: scroll; left: 0;}
	.mainNav>li{float:none; display:block !important; margin:0 0 20px 0;}
	.mainNav>li i{margin:0; padding: 6px 10px; position: absolute;}
	.mainNav .dropdown{position:relative; visibility:visible; opacity:1; transform:none; display:none; transition:none; text-align: center;}
	.mainNav .dropdown>li>a{white-space:normal;}
	.mainNav>.homeNav{display: none !important;}
	header .headerLogo{margin:0; padding: 5px; max-width: none; width: 25%;}

    header .headerLogo img {width: 100%; margin: 0;}
    .mobile.mainTitle {color: #00318c; font-weight: 800; font-size: 20px; text-align: center; width: 50%; display: inline-block; }
    a.mobile.mainTitle span {color: #d01d0c;}

    .banner .title-holder{display: none;}
    .banner .banner-text-holder{top: 90%; left: 18%;}
    
    #dog .box-dog .undertitle{max-width: 100%;}

    #adopted .box-program-adopted:nth-child(odd){margin-right: 0;}
    #adopted .box-program-adopted:nth-child(even){margin-left: 0;}
    #adopted .box-program-adopted {width: calc(calc(100% - 10px)/2);}
    #adopted h2{margin-bottom: 20px;}
    .advices-text{padding:0;}
    .advices-text:nth-child(even) {padding-left: 0;}
    #support .box-program-support .division-program-support{width: 100%;}
    #support .box-program-support .division-program-support:last-child{margin-left:0}

    .happy-link, .exp-cel-link{width: 100%;}
    #home-contact .info-holder{width: 100%; float: none; position: relative; bottom: 100px;}

    #home-contact .image-holder img{position: absolute; width: inherit; bottom: 0;}

    .advices-visible>h2 {font-size: 18px;margin: 0;}
    .advices-visible>i {font-size: 22px;}
    .advices-content{flex-wrap: wrap;}
    .advices-img{width: 100%;}

    .adopt-link, .happy-link, .exp-link, .exp-cel-link {flex: 50% 0; margin: 0;}
    .advices-link{width: 100%}

    .footer-img {display: flex;flex-direction: column;align-items: center;}
    .footer-social div:nth-child(3n) {padding: 0;margin: 0 auto;float: none;}

    .header-behind{padding: 0;}
    .banner{width:100%;background-repeat:no-repeat;background-size:100%;height:37vh;position:relative;}
    .banner-button-holder{bottom:30%;left:5%;}
    .first-banner-button{padding: 10px;}
    .main-image{transform:none;width:50%;}
    #dog .section-side-image{width: 100%;}
    #dog .section-main-image{width: 50%;float: left;}
    #cat .section-side-images{width: 100%}
    #cat .section-main-image{width: 50%;float: right;}
    #dog .main-image, #cat .main-image{transform:none; float: none;}
    #cat .desktop-display{display:none;}
    #cat .dog-q:first-of-type{float:none;clear:both;}
    #cat h2{padding: 0;}
    .left, .right{float:none;width:100%;clear:none;overflow: auto;}
    #support .box-program-support{display:block;}
    .division-program-support{width:100%;}
    #support .program-suport-button{position:relative; font-size: 12px;}
    .division-program-support{padding:0;}
    .division-program-support:nth-child(2){padding:0;}
    .img-footer{width:50%;float:none;margin:0 auto;}
    .get-in-touch{width:50%;}
    .appointments{width:50%;}
    .footer-social div {width: 50%;float: left;padding: 0 10px 0;}
    section{
        padding: 0;
    }

    #contactForm{width: 100%;float:none; margin:50px 0 0 0;}
    .contact-holder{width: 100%;}

}
@media (min-width:768px) {
    #cat .mobile-display{
        display: none;
    }
    #cat .desktop-display{
        display: inline;
    }
}


@media (min-width:768px) and (max-width:991px) { /* Tablet-portrait (and larger) */
}

@media (min-width:992px) and (max-width:1199px) { /* Tablet-landscape (and larger) */
}

@media (max-width:1440px) {
}