*{
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

a:hover{
    color: rgb(0, 255, 110);
}

/*Mobile Portrait*/

@media (max-width:600px) and (orientation:portrait){
    body{
        background-color: skyblue;
        margin: 0;
        display: flex;
        flex-direction: column;
        min-height: 100vh;
        overflow-x: hidden;
    }
    .office1{
        width: 100%;
        height: 220px;
    }
    .nav{
        background-color: white;
        border: 2px solid black;
        border-top: none;
        height: 6em;
        font-size: 1em;
        margin-top: -4px;
        width: 100%;
        height: 10%;
        padding: 1em;
        list-style-type: none;
    }
    .nav1{
      float: left;
      margin-left: 5%; 
      padding: 14px 1px;
      font-size: 1.2em;
      font-weight: 600;
    }
    .nav2{
      float: right;
      margin-right: 2%; 
      padding: 14px 1px;
      font-size: 1.2em;
      font-weight: 600;
    }
    .nav3{
      float: right;
      margin-right: 15%; 
      padding: 14px 1px;
      font-size: 1.2em;
      font-weight: 600;
    }
    .sign{
        font-size: 2em;
        background-color: white;
        padding: 1%;
        width: 24%;
        border: 4px solid black;
    }
    a{
        color: black;
        text-decoration: none;
    }
    .download{
        font-size: 1.2em;
        background-color: white;
        border: 4px solid black;
        width: 80%;
        height: 145%;
        position: relative;
        margin: auto;
        top: 250%;
        padding: 2em;
        border-radius: 2em;
    }
    .t1{
        text-align: center;
        font-size: 2em;
    }
    .google{
        width: 200px;
        margin-left: -6%;
        margin-top: 4%;
    }
    .apple{
        width: 200px;
        margin-left: -6%;
    }
    .who{
        font-size: 1.2em;
        background-color: white;
        border: 4px solid black;
        width: 80%;
        margin: auto;
        margin-top: 100px;
        padding: 2em;
        border-radius: 2em;
    }
    .location{
        font-size: 1.2em;
        background-color: white;
        border: 4px solid black;
        width: 80%;
        margin: auto;
        padding: 4em;
        border-radius: 2em;
        text-align: center;
    }
    .where{
        text-align: center;
        text-decoration: 3px solid underline black;
        font-size: 1.5em;
    }
    .office{
        font-size: 1.1em;
        list-style-type: none;
    }                                       
    .bottom{
        position: fixed;
        bottom: 0%;
        left: 0;
        width: 100%;
        background-color: white;
        border-top: 4px solid black;
        text-align: center;
    }
}

/*Tablet Portrait*/

@media (min-width:600px) and (orientation:portrait){
    body{
        background-color: skyblue;
        margin: 0;
        display: flex;
        flex-direction: column;
        min-height: 100vh;
        overflow-x: hidden;
    }
    .office1{
        width: 100%;
        height: 220px;
    }
    .nav{
        background-color: white;
        border: 2px solid black;
        border-top: none;
        height: 6em;
        font-size: 1em;
        margin-top: -4px;
        width: 100%;
        height: 10%;
        padding: 1em;
        list-style-type: none;
    }
    .nav1{
      float: left;
      margin-left: 10%; 
      padding: 14px 1px;
      font-size: 1.2em;
      font-weight: 600;
    }
    .nav2{
      float: right;
      margin-right: 10%; 
      padding: 14px 1px;
      font-size: 1.2em;
      font-weight: 600;
    }
    .nav3{
      float: right;
      margin-right: 22%; 
      padding: 14px 1px;
      font-size: 1.2em;
      font-weight: 600;
    }
    .sign{
        font-size: 2em;
        background-color: white;
        padding: 1%;
        width: 14%;
        border: 4px solid black;
    }
    a{
        color: black;
        text-decoration: none;
    }
    .download{
        font-size: 1.2em;
        background-color: white;
        border: 4px solid black;
        width: 80%;
        height: 145%;
        position: relative;
        margin: auto;
        top: 250%;
        padding: 2em;
        border-radius: 2em;
    }
    .t1{
        text-align: center;
        font-size: 2em;
    }
    .google{
        width: 200px;
        margin: auto;
        margin-top: 4%;
    }
    .apple{
        width: 200px;
        margin: auto;
    }
    .who{
        font-size: 1.2em;
        background-color: white;
        border: 4px solid black;
        width: 80%;
        margin: auto;
        margin-top: 100px;
        padding: 2em;
        border-radius: 2em;
    }
    .location{
        font-size: 1.2em;
        background-color: white;
        border: 4px solid black;
        width: 80%;
        margin: auto;
        padding: 4em;
        border-radius: 2em;
        text-align: center;
    }
    .where{
        text-align: center;
        text-decoration: 3px solid underline black;
        font-size: 1.5em;
    }
    .office{
        font-size: 1.1em;
        list-style-type: none;
    }                                       
    .bottom{
        position: fixed;
        bottom: 0%;
        left: 0;
        width: 100%;
        background-color: white;
        border-top: 4px solid black;
        text-align: center;
    }
}

/*Mobile Landscape*/

@media (min-width:667px) and (orientation:landscape){
    body{
        background-color: skyblue;
        margin: 0;
        display: flex;
        flex-direction: column;
        min-height: 100vh;
        overflow-x: hidden;
    }
    .office1{
        width: 100%;
        height: 220px;
    }
    .nav{
        background-color: white;
        border: 2px solid black;
        border-top: none;
        height: 6em;
        font-size: 1em;
        margin-top: -4px;
        width: 100%;
        height: 10%;
        padding: 1em;
        list-style-type: none;
    }
    .nav1{
      float: left;
      margin-left: 10%; 
      padding: 14px 1px;
      font-size: 1.2em;
      font-weight: 600;
    }
    .nav2{
      float: right;
      margin-right: 10%; 
      padding: 14px 1px;
      font-size: 1.2em;
      font-weight: 600;
    }
    .nav3{
      float: right;
      margin-right: 25%; 
      padding: 14px 1px;
      font-size: 1.2em;
      font-weight: 600;
    }
    .sign{
        font-size: 2em;
        background-color: white;
        padding: 1%;
        width: 13%;
        border: 4px solid black;
    }
    a{
        color: black;
        text-decoration: none;
    }
    .download{
        font-size: 1.2em;
        background-color: white;
        border: 4px solid black;
        width: 80%;
        height: 145%;
        position: relative;
        margin: auto;
        top: 250%;
        padding: 2em;
        border-radius: 2em;
    }
    .t1{
        text-align: center;
        font-size: 2em;
    }
    .google{
        width: 200px;
        margin-left: -6%;
        margin-top: 4%;
    }
    .apple{
        width: 200px;
        margin-left: -6%;
    }
    .who{
        font-size: 1.2em;
        background-color: white;
        border: 4px solid black;
        width: 80%;
        margin: auto;
        margin-top: 100px;
        padding: 2em;
        border-radius: 2em;
    }
    .location{
        font-size: 1.2em;
        background-color: white;
        border: 4px solid black;
        width: 80%;
        margin: auto;
        padding: 4em;
        border-radius: 2em;
        text-align: center;
    }
    .where{
        text-align: center;
        text-decoration: 3px solid underline black;
        font-size: 1.5em;
    }
    .office{
        font-size: 1.1em;
        list-style-type: none;
    }                                       
    .bottom{
        position: fixed;
        bottom: 0%;
        left: 0;
        width: 100%;
        background-color: white;
        border-top: 4px solid black;
        text-align: center;
    }
}

/*Tablet Landscape*/

@media (min-width:960px) and (orientation:landscape){
    body{
        background-color: skyblue;
        margin: 0;
        display: flex;
        flex-direction: column;
        min-height: 100vh;
        overflow-x: hidden;
    }
    .office1{
        width: 100%;
        height: 220px;
    }
    .nav{
        background-color: white;
        border: 2px solid black;
        border-top: none;
        height: 6em;
        font-size: 1em;
        margin-top: -4px;
        width: 100%;
        height: 10%;
        padding: 1em;
        list-style-type: none;
    }
    .nav1{
      float: left;
      margin-left: 15%; 
      padding: 14px 1px;
      font-size: 1.2em;
      font-weight: 600;
    }
    .nav2{
      float: right;
      margin-right: 15%; 
      padding: 14px 1px;
      font-size: 1.2em;
      font-weight: 600;
    }
    .nav3{
      float: right;
      margin-right: 25%; 
      padding: 14px 1px;
      font-size: 1.2em;
      font-weight: 600;
    }
    .sign{
        font-size: 2em;
        background-color: white;
        padding: 1%;
        width: 11%;
        border: 4px solid black;
    }
    a{
        color: black;
        text-decoration: none;
    }
    .download{
        font-size: 1.2em;
        background-color: white;
        border: 4px solid black;
        width: 80%;
        height: 145%;
        position: relative;
        margin: auto;
        top: 250%;
        padding: 2em;
        border-radius: 2em;
    }
    .t1{
        text-align: center;
        font-size: 2em;
    }
    .google{
        width: 200px;
        margin-left: -6%;
        margin-top: 4%;
    }
    .apple{
        width: 200px;
        margin-left: -6%;
    }
    .who{
        font-size: 1.2em;
        background-color: white;
        border: 4px solid black;
        width: 80%;
        margin: auto;
        margin-top: 100px;
        padding: 2em;
        border-radius: 2em;
    }
    .location{
        font-size: 1.2em;
        background-color: white;
        border: 4px solid black;
        width: 80%;
        margin: auto;
        padding: 4em;
        border-radius: 2em;
        text-align: center;
    }
    .where{
        text-align: center;
        text-decoration: 3px solid underline black;
        font-size: 1.5em;
    }
    .office{
        font-size: 1.1em;
        list-style-type: none;
    }                                       
    .bottom{
        position: fixed;
        bottom: 0%;
        left: 0;
        width: 100%;
        background-color: white;
        border-top: 4px solid black;
        text-align: center;
    }
}

/*Laptop/PC*/

@media (min-width:1280px) and (orientation:landscape){
    body{
        background-color: skyblue;
        margin: 0;
        display: flex;
        flex-direction: column;
        min-height: 100vh;
        overflow-x: hidden;
    }
    .office1{
        width: 100%;
        height: 220px;
    }
    .nav{
        background-color: white;
        border: 2px solid black;
        border-top: none;
        height: 6em;
        font-size: 1em;
        margin-top: -4px;
        width: 100%;
        height: 10%;
        padding: 1em;
        list-style-type: none;
    }
    .nav1{
      float: left;
      margin-left: 15%; 
      padding: 14px 1px;
      font-size: 1.2em;
      font-weight: 600;
    }
    .nav2{
      float: right;
      margin-right: 15%; 
      padding: 14px 1px;
      font-size: 1.2em;
      font-weight: 600;
    }
    .nav3{
      float: right;
      margin-right: 26%; 
      padding: 14px 1px;
      font-size: 1.2em;
      font-weight: 600;
    }
    a{
        color: black;
        text-decoration: none;
    }
    .sign{
        font-size: 2em;
        background-color: white;
        padding: 1%;
        width: 7%;
        border: 4px solid black;
    }
    .download{
        font-size: 1.2em;
        background-color: white;
        border: 4px solid black;
        width: 80%;
        height: 145%;
        position: relative;
        margin: auto;
        top: 250%;
        padding: 2em;
        border-radius: 2em;
    }
    .t1{
        text-align: center;
        font-size: 2em;
    }
    .google{
        width: 200px;
        margin: auto;
    }
    .apple{
        width: 200px;
        margin: auto;
    }
    .who{
        font-size: 1.2em;
        background-color: white;
        border: 4px solid black;
        width: 80%;
        margin: auto;
        margin-top: 100px;
        padding: 2em;
        border-radius: 2em;
    }
    .location{
        font-size: 1.2em;
        background-color: white;
        border: 4px solid black;
        width: 80%;
        margin: auto;
        padding: 4em;
        border-radius: 2em;
        text-align: center;
    }
    .where{
        text-align: center;
        text-decoration: 3px solid underline black;
        font-size: 1.5em;
    }
    .office{
        font-size: 1.1em;
        list-style-type: none;
    }                                       
    .bottom{
        position: fixed;
        bottom: 0%;
        left: 0;
        width: 100%;
        background-color: white;
        border-top: 4px solid black;
        text-align: center;
    }
}