/*
Version: 1.0.7.0-Universal CP
*/

/*************************************

This is a small subset, mainly just for making site-specific alterations easily and neatly. Thus, I have gotten rid of the sections structure in the name of speed and quick review. However, I have left the structure for the MEDIA QUERIES section in that same spirit of ease and speed.


Something silly and pedantic I want to document here: If you look at the main stylesheet (declared before this file IF this description you're reading is still up to date) it might appear that the reason for having site-specific subset stylesheets was so that I wouldn't have to write more unique site-specific variations of classes into the main stylesheet. But that wasn't the actual case. In fact, those unique classes are left over from before I decided to create a shared stylesheet to serve as the main. Back when I was trying to maintain two seperate stylesheets before v1.0.5, I often went back and created unique classes to try to keep the two stylesheets from diverging tooooo much... almost like merging them back together. Also to give myself clarity if I ever needed it, like "don't forget Vincent's is unique from Sono's". So you can see why this new main + site-specific system of dual stylesheets accomplishes those same goals more efficiently and neatly. And with better clues for future me since I'm not really one to write illustrative commentary on my work. This is kind of an exception.

Why are you even reading this? lol -Ford

1.0.7.0-Note: I'm leaving the Doc's stuff in for the template. I only need this to do stuff when I ask it to.

 ************************************/


 /*************************************

GENERAL SECTION

 ************************************/





.info-txt-left {
    letter-spacing: 0;
}


.Docs-Logo {
width: 75%;

}

.Joes-Top-Logo {
width: 64%;
}


.iiiintro-text {
    top:64%;
}

.iiiintro-text h1 {
    margin-top: 11%;
}

.iiiintro-text p {
    padding-bottom: 20px;
}

.iiiintro-text .view-more {
    margin-top: 0px;
}


/*************************************

MEDIA QUERIES

************************************/

@media (min-width: 767px) {
.Docs-Top-Logo{
    width:50%;
}
}

@media (min-width: 980px) {


.info-txt-left{
    font-size:19px;
}
}




@media (min-width: 1030px) {


.info-txt-left{
    font-size:20px;
}
}


@media (min-width: 1080px) {


.info-txt-left{
    font-size:21px;
}



}







@media (min-width: 1130px) {
.info-txt-left{
    font-size:22px;
}
}


@media (min-width: 1170px) {
.info-txt-left{
    font-size:23px;
}
}





@media (min-width: 1215px) {
.info-txt-left{
    font-size:24px;
}
}





@media (min-width: 1264px) {
.info-txt-left{
    font-size:25px;
}
}






@media (min-width: 1300px) {

.iiiintro-text h1 {
    margin-top: 11%;
}


}










@media (min-width: 1500px){
    .iiiintro-text h1 {
        mmmmmargin-top: 11%;
    }
}












@media (min-width: 1740px) {
    .iiiintro-text h1 {
    mmmmmmargin-top: 12.5%;
    }
    .info-txt-left {
    max-width: 94%;
    }
}











@media (min-width: 1800px) {
    .iiiintro-text h1 {
    mmmmmargin-top: 15%;
    }
}





@media (min-width: 1880px) {
    .info-txt-left {
    max-width: 80%;
    }
}









@media (max-height: 951px) {
.iiiintro-text {
    top:67%;
}
}

@media (max-height: 851px) {
.iiiintro-text {
    top:73%;
}
}

@media (max-height: 800px) {
.iiiintro-text {
    top:80%;
}
}


@media (max-height: 700px) {
.iiiintro-text {
    top:90%;
}
}

@media (max-height: 650px) and (min-width: 650px) {

.iiiintro-text {
    top: 77%;
}





.iiiintro-text h1 {
    font-size: 97px;

}


.Zest-Logo {
    max-height: 295px;
}


.footer-social {
    margin-top: 20px;
}


}





@media (max-height: 600px) and (min-width: 600px) {

.iiiintro-text h1 {
    display: none;
}


.iiiintro-text {
    top: 95%;
}



}






@media (min-width: 1200px) {

}











@media (min-width: 768px) and (max-width: 979px) {

}












@media (max-width: 767px) {


.Zest-Logo {
     max-height:215px;
 position: relative;
 left: 20px;

}

.nav-content-1 img {
    margin-left: auto;
}


.footer-logo img {
     left: 0px;

}



}











@media (max-width: 568px) {

.iiiintro-text .view-more {
    margin-top: 24px;
}


}











@media (max-width: 375px) {

}

@media (max-width: 376px) and (max-height: 628px) {

 .iiiintro-text h1 {
    margin-top: 25%;
    }


}