/* Big tablet to 2560px (widths smaller than the 1140px row) */
@media all and (min-width: 1691px) and (max-width: 2561px) {
    #glu-screenshots{
    width: 60vw;
    margin: auto;
    background-color: #f7f7f7;
    }
    
    #glu-screenshots-content{
    width: 100%;
    padding-top:5%;
    padding-bottom: 5%;
    }
    
    #glu-clothingstore{
        width: 65%;
        height: 65vh;
        margin: auto;
        background-color: #ebebeb;
    }
    
    #glu-furniturestore{
        width: 65%;
        height: 65vh;
        margin: auto;
        background-color: #ebebeb;
    }
    
    #glu-header-circle{
    width: 200px;
    height: 200px;
    background-color: #000000;
    border-radius: 50%;
    padding-top: 23%;
     color: white;
    }
    
    #content-glu-download{
    margin-left: 27.5%;
    margin-right: 27.5%;
    width: 45%;
    }
    
    #content-nicki-phone{
    width: 100%;
    margin: auto;
    }
    
    #content-lowes-phone{
    width: 100%;
    margin: auto;
    }
    
    #content-process-lowes{
    width: 85%;
        margin: auto;
    }
    
    .mobile {
    display: none;
    }
    
    /* LOWES */
    #lowes-website{
    display: block;
    }
    
    #lowes-mobile{
    display: none;
    }
    
    #lowes-space {
    height: 70px;
    }
    
    /* GLU */
    #glu-website{
    display: block;
    }
    
    #glu-mobile{
    display: none;
    }
    
    
    /* EA */
    #ea-website {
    display: block;
    }
    
    #ea-website img{
     object-fit: contain;
    }
    
    #ea-mobile {
    display: none;
    }
    
    #content-zuma {
        width: 45%;
    }
    
    /* RIOTGAMES */
    #riotgames-website {
    display: block;
    
    }
    
    #riotgames-mobile {
    display: none;
    }
    
    .content-riotgames img {
        width: 55%;
        margin-left: 22.5%;
        margin-right: 22.5%;
    }
    
}

/* Big tablet to 1690px (widths smaller than the 1367px row) */
@media all and (min-width: 1367px) and (max-width: 1690px) {
    #glu-screenshots{
    width: 100vw;
    margin: auto;
    background-color: #f7f7f7;
    }
    
    #glu-screenshots-content{
    width: 70%;
    padding-top:5%;
    padding-bottom: 5%;
    }
    
    #glu-clothingstore{
        width: 100vw;
        margin: auto;
        background-color: #ebebeb;
    }
    
    #glu-furniturestore{
        width: 100vw;
        margin: auto;
        background-color: #ebebeb;
    }
    
    #glu-header-circle{
    width: 200px;
    height: 200px;
    background-color: #000000;
    border-radius: 50%;
    padding-top: 26%;
     color: white;
    }
    
    #content-glu-download{
    width: 100vw;
    }
    
    #content-nicki-phone{
    width: 65vw;
    margin: auto;
    }
    
    #content-lowes-phone{
    width: 65vw;
    margin: auto;
    }
    
    
    #content-process-lowes{
    width: 100%;
        margin: auto;
    }
    
    .mobile {
    display: none;
    }
    
    /* EXPEDIA */
    #expedia-website{
    display: block;
    }
    
    /* LOWES */
    #lowes-website{
    display: block;
    }
    
    #lowes-mobile{
    display: none;
    }
    
    #lowes-space {
    height: 65px;
    }
    
    
    /* GLU */
    #glu-website{
    display: block;
    }
    
    #glu-mobile{
    display: none;
    }
    
    #glu-space {
    height: 80px;
    }
    
    #glu-mobile-buttons img{
    width: 50%;
    float: left;
    }
    
    /* EA */
    #ea-website {
    display: block;
    }
    
    #ea-website img{
     object-fit: contain;
    }
    
    #ea-mobile {
    display: none;
    }
    
    
    /* RIOTGAMES */
    #riotgames-website {
    display: block;
    }
    
    #riotgames-mobile {
    display: none;
    }
    
}

/* Big tablet to 1690px (widths smaller than the 1366px row) */
@media all and (min-width: 1201px) and (max-width: 1366px) {
    #glu-screenshots{
    width: 100vw;
    margin: auto;
    background-color: #f7f7f7;
    }
    
    #glu-screenshots-content{
    width: 75%;
    padding-top:5%;
    padding-bottom: 5%;
    }
    
    #glu-clothingstore{
        width: 100vw;
        margin: auto;
        background-color: #ebebeb;
    }
    
    #glu-furniturestore{
        width: 100vw;
        margin: auto;
        background-color: #ebebeb;
    }
    
    #glu-header-circle{
    width: 200px;
    height: 200px;
    background-color: #000000;
    border-radius: 50%;
    padding-top: 26%;
     color: white;
    }
    
    #content-glu-download{
    width: 100vw;
    }
    
    #content-nicki-phone{
    width: 75vw;
    margin: auto;
    }
    
    #content-lowes-phone{
    width: 85vw;
    margin: auto;
    }
    
    
    #content-process-lowes{
    width: 100%;
        margin: auto;
    }
    
    .mobile {
    display: none;
    }
    
    /* LOWES */
    #lowes-website{
    display: block;
    }
    
    #lowes-mobile{
    display: none;
    }
    
    #lowes-space {
    height: 65px;
    }
    
    /* GLU */
    #glu-website{
    display: block;
    }
    
    #glu-mobile{
    display: none;
    }
    
    #glu-space {
    height: 80px;
    }
    
    #glu-mobile-buttons img{
    width: 50%;
    float: left;
    }
    
    /* EA */
    #ea-website {
    display: block;
    }
    
    #ea-website img{
     object-fit: contain;
    }
    
    #ea-mobile {
    display: none;
    }
    
    
    /* RIOTGAMES */
    #riotgames-website {
    display: block;
    }
    
    #riotgames-mobile {
    display: none;
    }
    
}

/* Big tablet to 1200px (widths smaller than the 1140px row) */
@media only screen and (max-width: 1200px){
    .intro-mobile {
        display: none;
    }

    .intro-desktop {
        display: block;
    }
    
    .mobile {
    display: none;
    }
    
    .website {
    font-size: 90%;
    }
    
    #content-nicki-phone{
    width: 75vw;
    margin: auto;
    }
    
    #content-lowes-phone{
    width: 75vw;
    margin: auto;
    }
    
    /* LOWES */
    #lowes-website{
    display: block;
    }
    
    #lowes-mobile{
    display: none;
    }
    
    #lowes-space {
    height: 20px;
    }
    
    /* GLU */
    #glu-website{
    display: block;
    }
    
    #glu-mobile{
    display: none;
    }
    
    #glu-space {
    height: 30px;
    }
    
    #glu-screenshots-content{
    width: 80%;
    padding-top:5%;
    padding-bottom: 5%;
    }
    
    /* EA */
    #ea-website {
    display: block;
    }
    
    #ea-website img{
     object-fit: contain;
    }
    
    #ea-mobile {
    display: none;
    }
    
    /* RIOTGAMES */
    #riotgames-website {
    display: block;
    }
    
    #riotgames-mobile {
    display: none;
    }
    
}

/* Small tablet to big tablet: from 768px to 1023px */
@media only screen and (max-width: 1023px){
    .intro-mobile {
        display: none;
    }
    
    .intro {
        text-align: center;
        width:100%;
        padding-top: 18%; 
    }

    .intro-desktop {
        display: block;
    }
    
    .intro-desktop img{
        width: 80%;
        height: 80%;
    }
    
    .author {
        float: right;
        width: 55%;
        height: 100px;
        text-align: center;
        line-height: 32px;
        margin-top: -120px;
    }
    
    .profile-line {
        float: top;
        margin-left: 2%;
        margin-top: 2%;
        margin-bottom: 2%;
        height: 96vh;
        width: 96vw;
        border: solid 2px;
        border-color: #ebebeb;
        padding: 7% 5% 5% 5%;
    }
    
    /* INDEX */
    .mobile {
    display: none;
    }
    
    .website {
    font-size: 80%;
    }
    
    /* LOWES */
    #lowes-website{
    display: block;
    }
    
    #lowes-mobile{
    display: none;
    }
    
    #lowes-space {
    height: 0px;
    }
    
    /* GLU */
    #glu-website{
    display: block;
    }
    
    #glu-mobile{
    display: none;
    }
    
    #glu-space {
    height: 10px;
    }
    
    #glu-mobile-buttons img{
    width: 50%;
    float: left;
    }
    
    /* EA */
    #ea-website {
    display: block;
    }
    
    #ea-website img{
     object-fit: contain;
    }
    
    #ea-mobile {
    display: none;
    }
    
    /* RIOTGAMES */
    #riotgames-website {
    display: block;
    }
    
    #riotgames-mobile {
    display: none;
    }
    
    .content-riotgames img {
        width: 99%;
        margin-left: .5%;
        margin-right: .5%;
    }
    
    
}

/* Small phones to small tablets: from 481px to 767px */
@media only screen and (max-width: 767px){
    .intro {
        text-align: center;
        width:100%;
        padding-top: 18%; 
}
    
    .intro-desktop img{
        width: 90%;
        height: 90%;
    }
    
    .author {
        float: right;
        width: 47%;
        height: 100px;
        text-align: center;
        line-height: 32px;
        margin-top: -130px;
    }
    
    .profile-desktop {
    display: none;
    }
    
.profile-mobile {
    height: 100vh;
    width: 100%;
    margin-left: 0px;
    display: block;
    padding: 10%;
    text-align: left;
    }
    
    
.profile-mobile h1{
    font-size: 180%;
    line-height: 1;
    }
    
.profile-img {
    height: 35%;
    -o-object-fit: contain;
    object-fit: contain;
    float: center;
    }
    
    /* INDEX */
    
    .website{
    display: none;
    }
    
    #mobile-general{
    width: 80vw;
    margin: auto;
    }
    
    #mobile-general img{
    width: 80vw;
    
    }
    
    .mobile {
    display: block;
    width: 100vw;
    height: 100%;
    font-size: 78%;
    color: white; 
    }
    
    .mobile h2{
    color: white;
    line-height: .4;
    }
    
    #mobile-about{
    height: 27vh;
    width: 100%;
    padding-top: 8%;
    color: black; 
    }
    
    #mobile-about h3{
    line-height: .8;
    margin-top: 10px;
    }
    
    #mobile-about img{
    height: 8vh;
    }
    
    #mobile-nav1{
    color: white;
    height: 28vh;
    width: 45%;
    margin-left: 4%;
    margin-top: 1%;
    margin-right: 1%;
    margin-bottom: 1%;
    float: left;
    background-image: url(../images/lowes_mobile_bg.svg);
    background-size: cover;
    padding: 3%;
    padding-top: 25%;
    -webkit-animation-duration: .3s;
    -webkit-animation-delay: .3s;
    }
    
    #mobile-nav2{
    color: white;
    height: 28vh;
    width: 45%;
    margin-left: 1%;
    margin-top: 1%;
    margin-right: 4%;
    margin-bottom: 1%;
    float: left;
    background-image: url(../images/glu_mobile_bg.svg);
    background-size: cover;
    padding: 3%;
    padding-top: 25%;
    -webkit-animation-duration: .4s;
    -webkit-animation-delay: .4s;
    }
    
    #mobile-nav3{
    color: white;
    height: 28vh;
    width: 45%;
    margin-left: 4%;
    margin-top: 1%;
    margin-right: 1%;
    margin-bottom: 1%;
    float: left;
    background-image: url(../images/riotgames_mobile_bg.svg);
    background-size: cover;
    padding: 3%;
    padding-top: 25%;
    -webkit-animation-duration: .5s;
    -webkit-animation-delay: .5s;
    }
    
    #mobile-nav4{
    color: white;
    height: 28vh;
    width: 45%;
    margin-left: 1%;
    margin-top: 1%;
    margin-right: 4%;
    margin-bottom: 1%;
    float: left;
    background-image: url(../images/ea_mobile_bg.svg);
    background-size: cover;
    padding: 3%;
    padding-top: 25%;
    -webkit-animation-duration: .6s;
    -webkit-animation-delay: .6s;
    }
    
    #hero-header-lowes img{
    height: 10vh;
    }
    
    /* LOWES */
    #lowes-website{
    display: none;
    }
    
    #lowes-mobile{
    display: block;
    }
    
    #lowes-mobile h6{
    color: #b7c5df;
    }
    
    #lowes-circle{
        margin-bottom: 10px;
    }
    
    /* GLU */
    #glu-website{
    display: none;
    }
    
    #glu-mobile{
    display: block;
    }
    
    #glu-mobile h6{
    color: #e0278f;
    }
    
    #glu-mobile-images-sm img{
        width: 60vw;
    }
    
    #glu-mobile-images-space img{
       margin-bottom: 10px;
    }
    
    
    #glu-circle{
        margin-bottom: 10px;
    }
    
    #glu-mobile-buttons img{
    width: 50%;
    float: left;
    }
    
    /* EA */
    #ea-website {
    display: none;
    }
    
    #ea-mobile {
    display: block;
    }
    
    #ea-mobile h6 {
    color: ##5eda69;
    }
    
    /* RIOTGAMES */
    #riotgames-website {
    display: none;
    }
    
    #riotgames-mobile {
    display: block;
    }
    
    #riotgames-mobile h6 {
    color: #006acd;
    }
    
    #hero-header-riotgames img{
    width: 80vw;
    object-fit: contain;
    }
    
    #riotgames-mobile-images-sm img{
        width: 60vw;
    }
    
}
    
/* Small phones: from 0 to 480px */
@media only screen and (max-width: 480px){
    
    .topnav a:not(:first-child) {display: none;}
    .topnav a.icon {
        float: right;
        display: block;
    }

    .topnav.responsive {
        position: fixed; 
        z-index: 100;
        margin-top: 0px;
    }
  
    .topnav.responsive a.icon {
        position: absolute;
        right: 0;
        top: 0;
    }
    
    .topnav.responsive a {
        display: block;
        text-align: left;
    }
    
    .intro {
        padding-top: 30%;
        padding-bottom: 40%;
    }
    
    .topnav a:not(:first-child) {display: none;}
    
    .topnav a.icon {
        float: right;
        display: block;
    }


    .topnav.responsive {position: relative;}
    .topnav.responsive .icon {
        position: absolute;
        right: 0;
        top: 0;
    }
    
    .topnav.responsive a {
        float: none;
        display: block;
        text-align: left;
    }

    .intro-mobile {
        display: inline;
    }

    .intro-desktop {
        display: none;
    }
    
    .intro-mobile {
        display: inline;
    }

    .intro-desktop {
    display: none;
    }
    
    .intro {
        text-align: center;
        width:100%;
        padding-top: 30%; 
}
    
    .intro-mobile img{
        width: 80%;
        height: 80%;
    }
    
    .author {
        float: right;
        width: 95%;
        height: 100px;
        text-align: center;
        line-height: 32px;
        margin-top: 5px;
    }
    
    
    
}