/*
Developed by Victor Moreno
*/

/*//////////////////////
///GLOBAL MOBILE CSS///
////////////////////*/

/* Smartphones (portrait and landscape)*/
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {
 /*///////////////
 ////MAIN PAGE///
 //////////////*/
 #bg {
  width: 350vw;
 }
 .pfp {
     margin: -25px;
 }
 #webLogo, #subLogo {
  display: inline-block;
 }
 .quoteContainer {
  position: fixed;
    top: 50vw;
    left: 50vw;
    margin-top: -200px;
    margin-left: -200px;
 }
 .logoContainer {
     margin: -25px 50px;
 }

 .bigtxt {
    font-size: 15vw;
    max-width: 100vw;
 }

 .crop-img {
    margin: 5vw 0vw;
    width: 100%;
    height: 50vw;
 }

/*/////END/////*/
}

/* Smartphones (landscape) ----------- */
@media only screen
and (min-width : 321px) {
/* Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen
and (max-width : 320px) {
/* Styles */
}

/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
/* Styles */
}

/* iPads (landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
/* Styles */
}

/* iPads (portrait) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
/* Styles */
}

/* Desktops and laptops ----------- */
@media only screen
and (min-width : 1224px) {
/* Styles */
}

/* Large screens ----------- */
@media only screen
and (min-width : 1824px) {
/* Styles */
}

/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* Styles */
}

/* Responsive layout - makes a one column-layout instead of a two-column layout */
@media (max-width: 800px) {
    .flex-item-right, .flex-item-left {
        flex: 100%;
    }
}