@media (min-width: 450px) {
    .left_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        left: 0px;
        top: 0px;
        height: 70px;
        width: 100%;
        padding: 20px;
        z-index: 2;
    }

    h1.title{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        display: inline-block;
        margin: -5px 10px;
        color:#262626;
    }

    .right_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        top: 55px;
        left: -25px;
        height: 150px;
        width: 89%;
        padding-top: -10px;
        padding-right: 10px;
        z-index: 2;
    }

    #button {
        background-color: #4472C4;
        border: none;
        color: white;
        padding: 15px 22px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        position: relative;
        left: 40px;
        cursor: pointer;
        border-radius: 12px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
    }

    .right_topbar a{
        text-decoration: none;
        color:black;
        position:relative;
        left: 40px;
        padding-left: 15px;
        font-family: Arial, Helvetica, sans-serif;
    }

    p.list {
        text-align: left;
        width: 100%;
        padding-right: 96px;
        padding-bottom: 10px;
        background-color: rgb(255, 255, 255);
    }

    .infographics {
        display: inline-block;
        margin-top: 0px;
        margin-left: 0px;
        padding: 15px 22px;
    }

    .social {
        display: inline-block;
        margin-top: 0px;
        margin-left: 0px;
        padding: 10px 22px;
    }

    .ux {
        display: inline-block;
        margin-top: 0px;
        margin-left: 0px;
        padding: 10px 22px;
    }

    #box2 {
        position: relative;
        top: 220px;
        left: 20px;
        display: flex;
        flex-direction: row; 
        background-color: #ffffff;
        border-radius: 10px;
        border-width: 5px;
        border-style: solid;
        border-color: #4472C4;
        width: 367px;
        height: 95px;  
    }

    #box2 h1{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        margin: 5px 20px;
        color: #262626;
        z-index: 1;
    }

    #menuthumbnails {
        display: flex;
        flex-direction: row; 
        justify-content: center;
        justify-content: space-around;
        align-items: center;
        flex-wrap: wrap;
        width: 363px;
        height: 1000px;
        position: relative;
        top: 240px;
        left: 22px;
        padding-left: 5px;
        padding-right: 5px;
        background-color: #DAE3F3;
        border-radius: 5px;
    }

    #menuthumbnails img{
        width: 330px;
        height: auto;
        background-color:#ffffff;
        padding: 10px;
        border-radius: 3px;
    }

    #photocredit {
        display: flex;
        flex-direction: row; 
        position:relative;
        top: 90px;
    }

    #photocreditleft {
        background-color: #ffffff;
        position: relative;
        top: 160px;
        width: 200px; 
        left: 25px;      
    }

    #photocreditleft p{
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #photocreditright {
        background-color: #ffffff;
        position: relative;
        top: 178px;
        width: 200px; 
        left: 22px;      
    }

    #photocreditright a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }

    #footer {
        background-color: #F2F2F2;;
        padding: 10px;
        position: relative;
        top: 293px;
        width: 101.5%; 
        left: -10px;      
    }

    #footer p{
        text-align: center;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #footer a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
}

@media (min-width: 495px) {
    .left_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        left: 0px;
        top: 0px;
        height: 70px;
        width: 100%;
        padding: 20px;
        z-index: 2;
    }

    h1.title{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        display: inline-block;
        margin: -5px 10px;
        color:#262626;
    }

    .right_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        top: 55px;
        left: -25px;
        height: 150px;
        width: 89%;
        padding-top: -10px;
        padding-right: 10px;
        z-index: 2;
    }

    #button {
        background-color: #4472C4;
        border: none;
        color: white;
        padding: 15px 22px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        position: relative;
        left: 40px;
        cursor: pointer;
        border-radius: 12px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
    }

    .right_topbar a{
        text-decoration: none;
        color:black;
        position:relative;
        left: 40px;
        padding-left: 15px;
        font-family: Arial, Helvetica, sans-serif;
    }

    p.list {
        text-align: left;
        width: 100%;
        padding-right: 96px;
        padding-bottom: 10px;
        background-color: rgb(255, 255, 255);
    }

    .infographics {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 15px 22px;
    }

    .social {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }

    .ux {
        display: inline-block;
        margin-top: 0px;
        margin-left: 0px;
        padding: 10px 22px;
    }

    #box2 {
        position: relative;
        top: 200px;
        left: 20px;
        display: flex;
        flex-direction: row; 
        background-color: #ffffff;
        border-radius: 10px;
        border-width: 5px;
        border-style: solid;
        border-color: #4472C4;
        width: 412px;
        height: 95px;  
    }

    #box2 h1{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        margin: 5px 20px;
        color: #262626;
        z-index: 1;
    }

    #menuthumbnails {
        display: flex;
        flex-direction: row; 
        justify-content: center;
        justify-content: space-around;
        align-items: center;
        flex-wrap: wrap;
        width: 415px;
        height: 1150px;
        position: relative;
        top: 220px;
        left: 22px;
        padding-left: 5px;
        padding-right: 5px;
        background-color: #DAE3F3;
        border-radius: 5px;
    }

    #menuthumbnails img{
        width: 380px;
        height: auto;
        background-color:#ffffff;
        padding: 10px;
        border-radius: 3px;
    }

    #photocredit {
        display: flex;
        flex-direction: row; 
        position:relative;
        top: 70px;
    }

    #photocreditleft {
        background-color: #ffffff;
        position: relative;
        top: 160px;
        width: 200px; 
        left: 25px;      
    }

    #photocreditleft p{
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #photocreditright {
        background-color: #ffffff;
        position: relative;
        top: 178px;
        width: 50%; 
        left: 22px;      
    }

    #photocreditright a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }

    #footer {
        background-color: #F2F2F2;;
        padding: 10px;
        position: relative;
        top: 273px;
        width: 101.5%; 
        left: -10px;      
    }

    #footer p{
        text-align: center;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #footer a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
}
    
@media (min-width: 576px) {
    body{
        background-color:rgb(255, 255, 255);
    }

    .left_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        left: 0px;
        top: 0px;
        height: 131px;
        width: 100%;
        padding: 20px;
        z-index: 2;
    }

    h1.title{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        display: inline-block;
        margin: -5px 10px;
        color:#262626;
    }

    .right_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        top: 55px;
        left: -25px;
        height: 110px;
        width: 97%;
        padding-top: -10px;
        padding-right: 10px;
        z-index: 2;
    }

    #button {
        background-color: #4472C4;
        border: none;
        color: white;
        padding: 15px 22px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        position: relative;
        left: 40px;
        cursor: pointer;
        border-radius: 12px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
    }

    .right_topbar a{
        text-decoration: none;
        color:black;
        position:relative;
        left: 40px;
        padding-left: 15px;
        font-family: Arial, Helvetica, sans-serif;
    }

    p.list {
        text-align: left;
    }

    .infographics {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 15px 22px;
    }

    .social {
        display: inline-block;
        margin-top: 0px;
        margin-left: 0px;
        padding: 10px 22px;
    }

    .ux {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }

    #box2 {
        position: relative;
        top: 200px;
        left: 20px;
        display: flex;
        flex-direction: row; 
        background-color: #ffffff;
        border-radius: 10px;
        border-width: 5px;
        border-style: solid;
        border-color: #4472C4;
        width: 412px;
        height: 95px;
    }
    
    #box2 h1{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        margin: 5px 20px;
        color: #262626;
        z-index: 1;
    }
    
    #menuthumbnails {
        display: flex;
        flex-direction: row; 
        justify-content: center;
        justify-content: space-around;
        align-items: center;
        width: 490px;
        height: 1350px;
        position: relative;
        top: 220px;
        left: 22px;
        padding-left: 5px;
        padding-right: 5px;
        background-color: #DAE3F3;
        border-radius: 5px;
    }
    
    #menuthumbnails img{
        width: 450px;
        height: auto;
        background-color:#ffffff;
        padding: 10px;
        border-radius: 3px;
    }

    #photocredit {
        display: flex;
        flex-direction: row; 
        position:relative;
        top: 70px; 
    }

    #photocreditleft {
        background-color: #ffffff;
        position: relative;
        top: 160px;
        width: 220px; 
        left: 22px;      
    }

    #photocreditleft p{
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #photocreditright {
        background-color: #ffffff;
        position: relative;
        top: 178px;
        width: 300px; 
        left: 1px;    
    }

    #photocreditright a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
    
    #footer {
        background-color: #F2F2F2;
        padding: 10px;
        position: relative;
        top: 275px;
        width: 101.5%; 
        left:-14px;      
    }

    #footer p{
        text-align: center;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #footer a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
}

@media (min-width: 672px) {
    body{
        background-color:rgb(255, 255, 255);
    }

    .left_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        left: 0px;
        top: 0px;
        height: 131px;
        width: 100%;
        padding: 20px;
        z-index: 2;
    }

    h1.title{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        display: inline-block;
        margin: -5px 10px;
        color:#262626;
    }

    .right_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        top: 55px;
        left: -25px;
        height: 110px;
        width: 97%;
        padding-top: -10px;
        padding-right: 10px;
        z-index: 2;
    }

    #button {
        background-color: #4472C4;
        border: none;
        color: white;
        padding: 15px 22px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        position: relative;
        left: 40px;
        cursor: pointer;
        border-radius: 12px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
    }

    .right_topbar a{
        text-decoration: none;
        color:black;
        position:relative;
        left: 40px;
        padding-left: 15px;
        font-family: Arial, Helvetica, sans-serif;
    }

    p.list {
        text-align: left;
    }

    .infographics {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 15px 22px;
    }

    .social {
        display: inline-block;
        margin-top: 0px;
        margin-left: 0px;
        padding: 10px 22px;
    }

    .ux {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }

    #box2 {
        position: relative;
        top: 170px;
        left: 20px;
        display: flex;
        flex-direction: row; 
        background-color: #ffffff;
        border-radius: 10px;
        border-width: 5px;
        border-style: solid;
        border-color: #4472C4;
        width: 412px;
        height: 95px;
    }
    
    #box2 h1{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        margin: 5px 20px;
        color: #262626;
        z-index: 1;
    }
    
    #menuthumbnails {
        display: flex;
        flex-direction: row; 
        justify-content: center;
        justify-content: space-around;
        align-items: center;
        width: 587px;
        height: 1550px;
        position: relative;
        top: 190px;
        left: 22px;
        padding-top: 5px;
        padding-left: 5px;
        padding-right: 5px;
        background-color: #DAE3F3;
        border-radius: 5px;
    }
    
    #menuthumbnails img{
        width: 550px;
        height: auto;
        background-color:#ffffff;
        padding: 10px;
        border-radius: 3px;
    }

    #photocredit {
        display: flex;
        flex-direction: row; 
        position:relative;
        top: 45px; 
    }

    #photocreditleft {
        background-color: #ffffff;
        position: relative;
        top: 160px;
        width: 220px; 
        left: 22px;      
    }

    #photocreditleft p{
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #photocreditright {
        background-color: #ffffff;
        position: relative;
        top: 178px;
        width: 400px; 
        left: -1px;    
    }

    #photocreditright a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
    
    #footer {
        background-color: #F2F2F2;
        padding: 10px;
        position: relative;
        top: 253px;
        width: 101.5%; 
        left:-14px;      
    }

    #footer p{
        text-align: center;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #footer a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
}

@media (min-width: 768px) { 
    body{
        background-color:rgb(255, 255, 255);
    }

    .left_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        left: -0px;
        top: 0px;
        height: 131px;
        width: 100%;
        padding: 20px;
        z-index: 2;
    }

    h1.title{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        display: inline-block;
        margin: -5px 10px;
        color:#262626;
    }

    .right_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        top: 55px;
        left: -25px;
        height: 110px;
        width: 97%;
        padding-top: -10px;
        padding-right: 10px;
        z-index: 2;
    }

    #button {
        background-color: #4472C4;
        border: none;
        color: white;
        padding: 15px 22px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        position: relative;
        left: 40px;
        cursor: pointer;
        border-radius: 12px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
    }

    .right_topbar a{
        text-decoration: none;
        color:black;
        position:relative;
        left: 40px;
        padding-left: 15px;
        font-family: Arial, Helvetica, sans-serif;
    }

    p.list {
        text-align: left;
    }

    .infographics {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 15px 22px;
    }

    .social {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }

    .ux {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }

    #box2 {
        position: relative;
        top: 170px;
        left: 20px;
        display: flex;
        flex-direction: row; 
        background-color: #ffffff;
        border-radius: 10px;
        border-width: 5px;
        border-style: solid;
        border-color: #4472C4;
        width: 650px;
        height: 50px;  
    }
    
    #box2 h1{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        margin: 5px 20px;
        color: #262626;
        z-index: 1;
    }
    
    #menuthumbnails {
        display: flex;
        flex-direction: row; 
        justify-content: center;
        justify-content: space-around;
        align-items: center;
        width: 683px;
        height: 1900px;
        position: relative;
        top: 190px;
        left: 22px;
        padding-left: 5px;
        padding-right: 5px;
        background-color: #DAE3F3;
        border-radius: 5px;
    }
    
    #menuthumbnails img{
        width: 614px;
        height: 388px;
        background-color:#ffffff;
        padding: 10px;
        border-radius: 3px;
    }

    #photocredit {
        display: flex;
        flex-direction: row; 
        position:relative;
        top:50px;
    }

    #photocreditleft {
        background-color: #ffffff;
        position: relative;
        top: 160px;
        width: 200px; 
        left: 22px;      
    }

    #photocreditleft p{
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #photocreditright {
        background-color: #ffffff;
        position: relative;
        top: 178px;
        width: 500px; 
        left: 22px;      
    }

    #photocreditright a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }

    #footer {
        background-color: #F2F2F2;;
        padding: 10px;
        position: relative;
        top: 263px;
        width: 101.5%; 
        left:-10px;      
    }

    #footer p{
        text-align: center;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #footer a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
}

@media (min-width: 880px) { 
    body{
        background-color:rgb(255, 255, 255);
    }

    .left_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        left: 0px;
        top: 0px;
        height: 70px;
        width: 200px;
        padding: 20px;
        z-index: 3;
    }

    h1.title{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        display: inline-block;
        margin: -5px 10px;
        color:#262626;
    }

    .right_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        top: 0px;
        left: 140px;
        height: 94px;
        width: 700px;
        padding-top: 16px;
        padding-right: 40px;
        z-index: 2;
    }

    #button {
        background-color: #4472C4;
        border: none;
        color: white;
        padding: 15px 22px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        margin: -7px;
        cursor: pointer;
        border-radius: 12px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
    }

    .right_topbar a{
        text-decoration: none;
        color:black;
        padding: 0px 15px;
        font-family: Arial, Helvetica, sans-serif;
    }

    p.list {
        text-align: right;
    }

    .infographics {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 15px 22px;
    }

    .social {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }

    .ux {
        display: inline-block;
        margin-top: 22px;
        margin-left: 10px;
        padding: 10px 22px;
    }

    #box2 {
        position: relative;
        top: 110px;
        left: 20px;
        display: flex;
        flex-direction: row; 
        background-color: #ffffff;
        border-radius: 10px;
        border-width: 5px;
        border-style: solid;
        border-color: #4472C4;
        width: 650px;
        height: 50px;  
    }
    
    #box2 h1{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        margin: 5px 20px;
        color: #262626;
        z-index: 1;
    }
    
    #menuthumbnails {
        display: flex;
        flex-direction: row; 
        justify-content: center;
        justify-content: space-around;
        align-items: center;
        width: 795px;
        height: 1900px;
        position: relative;
        top: 130px;
        left: 22px;
        padding-left: 5px;
        padding-right: 5px;
        background-color: #DAE3F3;
        border-radius: 5px;
    }
    
    #menuthumbnails img{
        width: 614px;
        height: 388px;
        background-color:#ffffff;
        padding: 10px;
        border-radius: 3px;
    }

    #photocredit {
        display: flex;
        flex-direction: row; 
        position:relative;
        top: 0px;
    }

    #photocreditleft {
        background-color: #ffffff;
        position: relative;
        top: 160px;
        width: 250px; 
        left: 22px;      
    }

    #photocreditleft p{
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #photocreditright {
        background-color: #ffffff;
        position: relative;
        top: 178px;
        width: 700px; 
        left: -5px;      
    }

    #photocreditright a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }

    #footer {
        background-color: #F2F2F2;;
        padding: 10px;
        position: relative;
        top: 223px;
        width: 101.5%; 
        left:-10px;      
    }

    #footer p{
        text-align: center;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #footer a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
}

@media (min-width: 992px) { 
    body{
        background-color:rgb(255, 255, 255);
    }

    .left_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        left: 0px;
        top: 0px;
        height: 70px;
        width: 25%;
        padding: 20px;
        z-index: 3;
    }

    h1.title{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        display: inline-block;
        margin: -5px 10px;
        color:#262626;
    }

    .right_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        top: 0px;
        left: 160px;
        height: 94px;
        width: 80%;
        padding-top: 16px;
        padding-right: 40px;
        z-index: 2;
    }

    #button {
        background-color: #4472C4;
        border: none;
        color: white;
        padding: 15px 22px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        margin: -7px;
        cursor: pointer;
        border-radius: 12px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
    }

    .right_topbar a{
        text-decoration: none;
        color:black;
        padding: 0px 15px;
        font-family: Arial, Helvetica, sans-serif;
    }

    p.list {
        text-align: right;
    }

    .infographics {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 15px 22px;
    }

    .social {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }

    .ux {
        display: inline-block;
        margin-top: 22px;
        margin-left: 10px;
        padding: 10px 22px;
    }

    #box2 {
        position: relative;
        top: 110px;
        left: 20px;
        display: flex;
        flex-direction: row; 
        background-color: #ffffff;
        border-radius: 10px;
        border-width: 5px;
        border-style: solid;
        border-color: #4472C4;
        width: 650px;
        height: 50px;  
    }
    
    #box2 h1{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        margin: 5px 20px;
        color: #262626;
        z-index: 1;
    }

    #menuthumbnails {
        display: flex;
        flex-direction: row; 
        justify-content: center;
        justify-content: space-around;
        align-items: center;
        width: 908px;
        height: 1900px;
        position: relative;
        top: 130px;
        left: 22px;
        padding-left: 5px;
        padding-right: 5px;
        background-color: #DAE3F3;
        border-radius: 5px;
    }
    
    #menuthumbnails img{
        width: 614px;
        height: 388px;
        background-color:#ffffff;
        padding: 10px;
        border-radius: 3px;
    }

    #photocredit {
        display: flex;
        flex-direction: row; 
        display: relative;
        top: -10px;
    }

    #photocreditleft {
        background-color: #ffffff;
        position: relative;
        top: 160px;
        width: 200px; 
        left: 22px;      
    }

    #photocreditleft p{
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #photocreditright {
        background-color: #ffffff;
        position: relative;
        top: 178px;
        width: 75%; 
        left: 22px;      
    }

    #photocreditright a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
    
    #footer {
        background-color: #F2F2F2;
        padding: 10px;
        position: relative;
        top: 203px;
        width: 101.5%; 
        left:-10px;      
    }

    #footer p{
        text-align: center;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #footer a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
}

@media (min-width: 1096px) { 
    body{
        background-color:rgb(255, 255, 255);
    }

    .left_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        left: 0px;
        top: 0px;
        height: 40px;
        width: 25%;
        padding: 20px;
        z-index: 3;
    }

    h1.title{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 16pt;
        display: inline-block;
        margin: 0px 10px;
        color:#262626;
    }

    .right_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        top: -20px;
        left: 165px;
        height: 62px;
        width: 870px;
        padding-top: 18px;
        padding-right: 50px;
        z-index: 2;
    }

    #button {
        background-color: #4472C4;
        border: none;
        color: white;
        padding: 15px 22px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        margin: -7px;
        cursor: pointer;
        border-radius: 12px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
    }

    .right_topbar a{
        text-decoration: none;
        color:black;
        padding: 5px 15px;
        font-family: Arial, Helvetica, sans-serif;
    }

    p.list {
        text-align: right;
    }

    .infographics {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 15px 22px;
    }

    .social {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }

    .ux {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }

    #box2 {
        position: relative;
        top: 80px;
        left: 20px;
        display: flex;
        flex-direction: row; 
        background-color: #ffffff;
        border-radius: 10px;
        border-width: 5px;
        border-style: solid;
        border-color: #4472C4;
        width: 650px;
        height: 50px;  
    }
    
    #box2 h1{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        margin: 5px 20px;
        color: #262626;
        z-index: 1;
    }

    #menuthumbnails {
        display: flex;
        flex-direction: row; 
        justify-content: center;
        justify-content: space-around;
        align-items: center;
        width: 1015px;
        height: 1900px;
        position: relative;
        top: 95px;
        left: 20px;
        padding-left: 5px;
        padding-right: 5px;
        background-color: #DAE3F3;
        border-radius: 5px;
    }
    
    #menuthumbnails img{
        width: 614px;
        height: 388px;
        background-color:#ffffff;
        padding: 10px;
        border-radius: 3px;
        margin: 27px;
    }

    #photocredit {
        display: flex;
        flex-direction: row; 
        display: relative;
        top: -40px;
    }

    #photocreditleft {
        background-color: #ffffff;
        position: relative;
        top: 160px;
        width: 200px; 
        left: 22px;      
    }

    #photocreditleft p{
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #photocreditright {
        background-color: #ffffff;
        position: relative;
        top: 178px;
        width: 75%; 
        left: 22px;      
    }

    #photocreditright a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
    
    #footer {
        background-color: #F2F2F2;
        padding: 10px;
        position: relative;
        top: 180px;
        width: 101.5%; 
        left: -10px;      
    }

    #footer p{
        text-align: center;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #footer a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
}

@media (min-width: 1200px) {
    body{
        background-color:rgb(255, 255, 255);
    }

    .left_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        left: 0px;
        top: 0px;
        height: 40px;
        width: 25%;
        padding: 20px;
        z-index: 2;
    }

    h1.title{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 16pt;
        display: inline-block;
        margin: 0px 10px;
        color:#262626;
    }

    .right_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        top: -20px;
        left: 270px;
        height: 62px;
        width: 870px;
        padding-top: 18px;
        padding-right: 50px;
        z-index: 2;
    }

    #button {
        background-color: #4472C4;
        border: none;
        color: white;
        padding: 15px 22px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        margin: -7px;
        cursor: pointer;
        border-radius: 12px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
    }

    .right_topbar a{
        text-decoration: none;
        color:black;
        padding: 5px 15px;
        font-family: Arial, Helvetica, sans-serif;
    }

    p.list {
        text-align: right;
    }

    .infographics {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 15px 22px;
    }

    .social {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }

    .ux {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }
    
    #box2 {
        position: relative;
        top: 80px;
        left: 20px;
        display: flex;
        flex-direction: row; 
        background-color: #ffffff;
        border-radius: 10px;
        border-width: 5px;
        border-style: solid;
        border-color: #4472C4;
        width: 650px;
        height: 50px;  
    }

    #box2 h1{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        margin: 5px 20px;
        color: #262626;
        z-index: 1;
    }
    
    #menuthumbnails {
        display: flex;
        flex-direction: row; 
        justify-content: center;
        justify-content: space-around;
        align-items: center;
        width: 1119px;
        height: 1860px;
        position: relative;
        top: 95px;
        left: 20px;
        padding-left: 5px;
        padding-right: 5px;
        background-color: #DAE3F3;
        border-radius: 5px;
    }
    
    #menuthumbnails img{
        width: 614px;
        height: 388px;
        background-color:#ffffff;
        padding: 10px;
        border-radius: 3px;
        margin: 27px;
    }

    #photocredit {
        display: flex;
        flex-direction: row;
        display: relative;
        top: 10px; 
    }

    #photocreditleft {
        background-color: #ffffff;
        position: relative;
        top: 100px;
        width: 200px; 
        left: 22px;      
    }

    #photocreditleft p{
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #photocreditright {
        background-color: #ffffff;
        position: relative;
        top: 115px;
        width: 80%; 
        left: 22px;      
    }

    #photocreditright a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }

    #footer {
        background-color: #F2F2F2;;
        padding: 10px;
        position: relative;
        top: 143px;
        width: 101.5%; 
        left: -10px;      
    }

    #footer p{
        text-align: center;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #footer a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
}

@media (min-width: 1366px) {
    body{
        background-color:rgb(255, 255, 255);
    }

    .left_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        left: 0px;
        top: 0px;
        height: 40px;
        width: 25%;
        padding: 20px;
        z-index: 2;
    }

    h1.title{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 1.6vw;
        display: inline-block;
        margin: -5px 10px;
        color:#262626;
    }

    .right_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        top: -20px;
        left: 290px;
        height: 62px;
        width: 75%;
        padding-top: 18px;
        padding-right: 50px;
        z-index: 2;
    }

    #button {
        background-color: #4472C4;
        border: none;
        color: white;
        padding: 15px 22px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        margin: -7px;
        cursor: pointer;
        border-radius: 12px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
    }

    .right_topbar a{
        text-decoration: none;
        color:black;
        padding: 5px 15px;
        font-family: Arial, Helvetica, sans-serif;
    }

    p.list {
        text-align: right;
    }

    .infographics {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 15px 22px;
    }

    .social {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }

    .ux {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }
    
    #box2 {
        position: relative;
        top: 80px;
        left: 20px;
        display: flex;
        flex-direction: row; 
        background-color: #ffffff;
        border-radius: 10px;
        border-width: 5px;
        border-style: solid;
        border-color: #4472C4;
        width: 650px;
        height: 50px;  
    }

    #box2 h1{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        margin: 5px 20px;
        color: #262626;
        z-index: 1;
    }
    
    #menuthumbnails {
        display: flex;
        flex-direction: row; 
        justify-content: center;
        justify-content: space-around;
        align-items: center;
        width: 1285px;
        height: 1900px;
        position: relative;
        top: 95px;
        left: 20px;
        padding-left: 5px;
        padding-right: 5px;
        background-color: #DAE3F3;
        border-radius: 5px;
    }
    
    #menuthumbnails img{
        width: 614px;
        height: 388px;
        background-color:#ffffff;
        padding: 10px;
        border-radius: 3px;
        margin: 27px;
    }

    #photocredit {
        display: flex;
        flex-direction: row;
        display: relative;
        top: 6px; 
    }

    #photocreditleft {
        background-color: #ffffff;
        position: relative;
        top: 100px;
        width: 200px; 
        left: 22px;      
    }

    #photocreditleft p{
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #photocreditright {
        background-color: #ffffff;
        position: relative;
        top: 115px;
        width: 85%; 
        left: 22px;      
    }

    #photocreditright a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }

    #footer {
        background-color: #F2F2F2;;
        padding: 10px;
        position: relative;
        top: 133px;
        width: 101.5%; 
        left: -10px;      
    }

    #footer p{
        text-align: center;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #footer a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
}

@media (min-width: 1449px) {
    body{
        background-color:rgb(255, 255, 255);
    }

    .left_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        left: 0px;
        top: 0px;
        height: 40px;
        width: 25%;
        padding: 20px;
        z-index: 2;
    }

    h1.title{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 1.6vw;
        display: inline-block;
        margin: -5px 10px;
        color:#262626;
    }

    .right_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        top: -20px;
        left: 23%;
        height: 62px;
        width: 75%;
        padding-top: 18px;
        padding-right: 50px;
        z-index: 2;
    }

    #button {
        background-color: #4472C4;
        border: none;
        color: white;
        padding: 15px 22px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        margin: -7px;
        cursor: pointer;
        border-radius: 12px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
    }

    .right_topbar a{
        text-decoration: none;
        color:black;
        padding: 5px 15px;
        font-family: Arial, Helvetica, sans-serif;
    }

    p.list {
        text-align: right;
    }

    .infographics {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 15px 22px;
    }

    .social {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }

    .ux {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }
    
    #box2 {
        position: relative;
        top: 80px;
        left: 20px;
        display: flex;
        flex-direction: row; 
        background-color: #ffffff;
        border-radius: 10px;
        border-width: 5px;
        border-style: solid;
        border-color: #4472C4;
        width: 650px;
        height: 50px;  
    }

    #box2 h1{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        margin: 5px 20px;
        color: #262626;
        z-index: 1;
    }
    
    #menuthumbnails {
        display: flex;
        flex-direction: row; 
        justify-content: center;
        justify-content: space-around;
        align-items: center;
        width: 1368px;
        height: 1900px;
        position: relative;
        top: 95px;
        left: 20px;
        padding-left: 5px;
        padding-right: 5px;
        background-color: #DAE3F3;
        border-radius: 5px;
    }
    
    #menuthumbnails img{
        width: 614px;
        height: 388px;
        background-color:#ffffff;
        padding: 10px;
        border-radius: 3px;
        margin: 27px;
    }

    #photocredit {
        display: flex;
        flex-direction: row;
        display: relative;
        top: 6px; 
    }

    #photocreditleft {
        background-color: #ffffff;
        position: relative;
        top: 100px;
        width: 200px; 
        left: 22px;      
    }

    #photocreditleft p{
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #photocreditright {
        background-color: #ffffff;
        position: relative;
        top: 115px;
        width: 85%; 
        left: 22px;      
    }

    #photocreditright a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }

    #footer {
        background-color: #F2F2F2;;
        padding: 10px;
        position: relative;
        top: 133px;
        width: 101.5%; 
        left: -10px;      
    }

    #footer p{
        text-align: center;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #footer a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
}

@media (min-width: 1532px) {
    body{
        background-color:rgb(255, 255, 255);
    }

    .left_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        left: 0px;
        top: 0px;
        height: 40px;
        width: 25%;
        padding: 20px;
        z-index: 2;
    }

    h1.title{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 1.6vw;
        display: inline-block;
        margin: -5px 10px;
        color:#262626;
    }

    .right_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        top: -15px;
        left: 23%;
        height: 62px;
        width: 75%;
        padding-top: 18px;
        padding-right: 50px;
        z-index: 2;
    }

    #button {
        background-color: #4472C4;
        border: none;
        color: white;
        padding: 15px 22px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        margin: -7px;
        cursor: pointer;
        border-radius: 12px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
    }

    .right_topbar a{
        text-decoration: none;
        color:black;
        padding: 0px 15px;
        font-family: Arial, Helvetica, sans-serif;
    }

    p.list {
        text-align: right;
    }

    .infographics {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 15px 22px;
    }

    .social {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }

    .ux {
        display: inline-block;
        margin-top: 15px;
        margin-left: 10px;
        padding: 10px 22px;
    }
    
    #box2 {
        position: relative;
        top: 80px;
        left: 20px;
        display: flex;
        flex-direction: row; 
        background-color: #ffffff;
        border-radius: 10px;
        border-width: 5px;
        border-style: solid;
        border-color: #4472C4;
        width: 650px;
        height: 50px;  
    }

    #box2 h1{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        margin: 5px 20px;
        color: #262626;
        z-index: 1;
    }
    
    #menuthumbnails {
        display: flex;
        flex-direction: row; 
        justify-content: center;
        justify-content: space-around;
        align-items: center;
        width: 1450px;
        height: 930px;
        position: relative;
        top: 95px;
        left: 20px;
        padding-left: 5px;
        padding-right: 5px;
        background-color: #DAE3F3;
        border-radius: 5px;
    }
    
    #menuthumbnails img{
        width: 614px;
        height: 388px;
        background-color:#ffffff;
        padding: 10px;
        border-radius: 3px;
        margin: 27px;
    }

    #photocredit {
        display: flex;
        flex-direction: row;
        display: relative;
        top: 6px; 
    }

    #photocreditleft {
        background-color: #ffffff;
        position: relative;
        top: 100px;
        width: 200px; 
        left: 22px;      
    }

    #photocreditleft p{
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #photocreditright {
        background-color: #ffffff;
        position: relative;
        top: 115px;
        width: 85%; 
        left: 22px;      
    }

    #photocreditright a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }

    #footer {
        background-color: #F2F2F2;;
        padding: 10px;
        position: relative;
        top: 132px;
        width: 101.5%; 
        left: -10px;      
    }

    #footer p{
        text-align: center;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #footer a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
}

@media (min-width: 1698px) {
    body{
        background-color:rgb(255, 255, 255);
    }

    .left_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        left: 0px;
        top: 0px;
        height: 40px;
        width: 25%;
        padding: 20px;
        z-index: 2;
    }

    h1.title{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 1.6vw;
        display: inline-block;
        margin: -5px 10px;
        color:#262626;
    }

    .right_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        top: 0px;
        left: 23%;
        height: 62px;
        width: 75%;
        padding-top: 18px;
        padding-right: 50px;
        z-index: 2;
    }

    #button {
        background-color: #4472C4;
        border: none;
        color: white;
        padding: 15px 22px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        margin: -7px;
        cursor: pointer;
        border-radius: 12px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
    }

    .right_topbar a{
        text-decoration: none;
        color:black;
        padding: 0px 15px;
        font-family: Arial, Helvetica, sans-serif;
    }

    p.list {
        text-align: right;
    }

    .infographics {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 15px 22px;
    }

    .social {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }

    .ux {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }
    
    #box2 {
        position: relative;
        top: 80px;
        left: 20px;
        display: flex;
        flex-direction: row; 
        background-color: #ffffff;
        border-radius: 10px;
        border-width: 5px;
        border-style: solid;
        border-color: #4472C4;
        width: 650px;
        height: 50px;  
    }

    #box2 h1{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        margin: 5px 20px;
        color: #262626;
        z-index: 1;
    }
    
    #menuthumbnails {
        display: flex;
        flex-direction: row; 
        justify-content: center;
        justify-content: space-around;
        align-items: center;
        width: 1618px;
        height: 930px;
        position: relative;
        top: 95px;
        left: 20px;
        padding-left: 5px;
        padding-right: 5px;
        background-color: #DAE3F3;
        border-radius: 5px;
    }
    
    #menuthumbnails img{
        width: 614px;
        height: 388px;
        background-color:#ffffff;
        padding: 10px;
        border-radius: 3px;
        margin: 27px;
    }

    #photocredit {
        display: flex;
        flex-direction: row;
        display: relative;
        top: 6px; 
    }

    #photocreditleft {
        background-color: #ffffff;
        position: relative;
        top: 100px;
        width: 200px; 
        left: 22px;      
    }

    #photocreditleft p{
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #photocreditright {
        background-color: #ffffff;
        position: relative;
        top: 115px;
        width: 85%; 
        left: 22px;      
    }

    #photocreditright a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }

    #footer {
        background-color: #F2F2F2;;
        padding: 10px;
        position: relative;
        top: 132px;
        width: 101.5%; 
        left: -10px;      
    }

    #footer p{
        text-align: center;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #footer a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
}

@media (min-width: 1781px) {
    body{
        background-color:rgb(255, 255, 255);
    }

    .left_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        left: 0px;
        top: 0px;
        height: 40px;
        width: 25%;
        padding: 20px;
        z-index: 2;
    }

    h1.title{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 1.6vw;
        display: inline-block;
        margin: -5px 10px;
        color:#262626;
    }

    .right_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        top: 0px;
        left: 23%;
        height: 62px;
        width: 75%;
        padding-top: 18px;
        padding-right: 50px;
        z-index: 2;
    }

    #button {
        background-color: #4472C4;
        border: none;
        color: white;
        padding: 15px 22px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        margin: -7px;
        cursor: pointer;
        border-radius: 12px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
    }

    .right_topbar a{
        text-decoration: none;
        color:black;
        padding: 0px 15px;
        font-family: Arial, Helvetica, sans-serif;
    }

    p.list {
        text-align: right;
    }

    .infographics {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 15px 22px;
    }

    .social {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }

    .ux {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }
    
    #box2 {
        position: relative;
        top: 80px;
        left: 20px;
        display: flex;
        flex-direction: row; 
        background-color: #ffffff;
        border-radius: 10px;
        border-width: 5px;
        border-style: solid;
        border-color: #4472C4;
        width: 650px;
        height: 50px;  
    }

    #box2 h1{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        margin: 5px 20px;
        color: #262626;
        z-index: 1;
    }
    
    #menuthumbnails {
        display: flex;
        flex-direction: row; 
        justify-content: center;
        justify-content: space-around;
        align-items: center;
        width: 1699px;
        height: 930px;
        position: relative;
        top: 95px;
        left: 20px;
        padding-left: 5px;
        padding-right: 5px;
        background-color: #DAE3F3;
        border-radius: 5px;
    }
    
    #menuthumbnails img{
        width: 614px;
        height: 388px;
        background-color:#ffffff;
        padding: 10px;
        border-radius: 3px;
        margin: 27px;
    }

    #photocredit {
        display: flex;
        flex-direction: row;
        display: relative;
        top: 6px; 
    }

    #photocreditleft {
        background-color: #ffffff;
        position: relative;
        top: 100px;
        width: 200px; 
        left: 22px;      
    }

    #photocreditleft p{
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #photocreditright {
        background-color: #ffffff;
        position: relative;
        top: 115px;
        width: 80%; 
        left: 22px;      
    }

    #photocreditright a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }

    #footer {
        background-color: #F2F2F2;;
        padding: 10px;
        position: relative;
        top: 132px;
        width: 101.5%; 
        left: -10px;      
    }

    #footer p{
        text-align: center;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #footer a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
}

@media (min-width: 1865px) {
    body{
        background-color:rgb(255, 255, 255);
    }

    .left_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        left: 0px;
        top: 0px;
        height: 40px;
        width: 25%;
        padding: 20px;
        z-index: 2;
    }

    h1.title{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 1.6vw;
        display: inline-block;
        margin: -5px 10px;
        color:#262626;
    }

    .right_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        top: 0px;
        left: 23%;
        height: 62px;
        width: 75%;
        padding-top: 18px;
        padding-right: 50px;
        z-index: 2;
    }

    #button {
        background-color: #4472C4;
        border: none;
        color: white;
        padding: 15px 22px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        margin: -7px;
        cursor: pointer;
        border-radius: 12px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
    }

    .right_topbar a{
        text-decoration: none;
        color:black;
        padding: 0px 15px;
        font-family: Arial, Helvetica, sans-serif;
    }

    p.list {
        text-align: right;
    }

    .infographics {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 15px 22px;
    }

    .social {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }

    .ux {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }
    
    #box2 {
        position: relative;
        top: 80px;
        left: 20px;
        display: flex;
        flex-direction: row; 
        background-color: #ffffff;
        border-radius: 10px;
        border-width: 5px;
        border-style: solid;
        border-color: #4472C4;
        width: 650px;
        height: 50px;  
    }

    #box2 h1{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        margin: 5px 20px;
        color: #262626;
        z-index: 1;
    }
    
    #menuthumbnails {
        display: flex;
        flex-direction: row; 
        justify-content: center;
        justify-content: space-around;
        align-items: center;
        width: 1792px;
        height: 930px;
        position: relative;
        top: 95px;
        left: 20px;
        padding-left: 5px;
        padding-right: 5px;
        background-color: #DAE3F3;
        border-radius: 5px;
    }
    
    #menuthumbnails img{
        width: 614px;
        height: 388px;
        background-color:#ffffff;
        padding: 10px;
        border-radius: 3px;
    }

    #photocredit {
        display: flex;
        flex-direction: row;
        display: relative;
        top: 6px; 
    }

    #photocreditleft {
        background-color: #ffffff;
        position: relative;
        top: 100px;
        width: 200px; 
        left: 22px;      
    }

    #photocreditleft p{
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #photocreditright {
        background-color: #ffffff;
        position: relative;
        top: 115px;
        width: 80%; 
        left: 22px;      
    }

    #photocreditright a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }

    #footer {
        background-color: #F2F2F2;;
        padding: 10px;
        position: relative;
        top: 132px;
        width: 101.5%; 
        left: -10px;      
    }

    #footer p{
        text-align: center;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #footer a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
}

@media (min-width: 1920px) {
    body{
        background-color:rgb(255, 255, 255);
    }

    .left_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        left: 0px;
        top: 0px;
        height: 40px;
        width: 25%;
        padding: 20px;
        z-index: 2;
    }

    h1.title{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 1.6vw;
        display: inline-block;
        margin: -5px 10px;
        color:#262626;
    }

    .right_topbar{
        position: fixed;
        background-color: rgb(255, 255, 255);
        top: 0px;
        left: 23%;
        height: 62px;
        width: 75%;
        padding-top: 18px;
        padding-right: 50px;
        z-index: 2;
    }

    #button {
        background-color: #4472C4;
        border: none;
        color: white;
        padding: 15px 22px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        margin: -7px;
        cursor: pointer;
        border-radius: 12px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
    }

    .right_topbar a{
        text-decoration: none;
        color:black;
        padding: 0px 15px;
        font-family: Arial, Helvetica, sans-serif;
    }

    p.list {
        text-align: right;
    }

    .infographics {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 15px 22px;
    }

    .social {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }

    .ux {
        display: inline-block;
        margin-top: 0px;
        margin-left: 10px;
        padding: 10px 22px;
    }
    
    #box2 {
        position: relative;
        top: 80px;
        left: 20px;
        display: flex;
        flex-direction: row; 
        background-color: #ffffff;
        border-radius: 10px;
        border-width: 5px;
        border-style: solid;
        border-color: #4472C4;
        width: 650px;
        height: 50px;  
    }

    #box2 h1{
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 900;
        font-size: 22pt;
        margin: 5px 20px;
        color: #262626;
        z-index: 1;
    }
    
    #menuthumbnails {
        display: flex;
        flex-direction: row; 
        justify-content: center;
        justify-content: space-around;
        align-items: center;
        width: 1836px;
        height: 930px;
        position: relative;
        top: 95px;
        left: 20px;
        padding-left: 5px;
        padding-right: 5px;
        background-color: #DAE3F3;
        border-radius: 5px;
    }
    
    #menuthumbnails img{
        width: 614px;
        height: 388px;
        background-color:#ffffff;
        padding: 10px;
        border-radius: 3px;
    }

    #photocredit {
        display: flex;
        flex-direction: row;
        display: relative;
        top: 11px; 
    }

    #photocreditleft {
        background-color: #ffffff;
        position: relative;
        top: 100px;
        width: 200px; 
        left: 22px;      
    }

    #photocreditleft p{
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #photocreditright {
        background-color: #ffffff;
        position: relative;
        top: 115px;
        width: 80%; 
        left: 22px;      
    }

    #photocreditright a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }

    #footer {
        background-color: #F2F2F2;;
        padding: 10px;
        position: relative;
        top: 143px;
        width: 101.5%; 
        left: -10px;      
    }

    #footer p{
        text-align: center;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        color:#262626;
    }

    #footer a{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12pt;
        padding: 0px;
    }
}