@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200&display=swap');

body{
    margin:0;
    background-color: rgb(20,20,20);
}
.navbar{
    position: absolute;
    width: 100%;
    display:flex;
}
.logo a {
    margin-left: 40;
    margin-top: 5.5vh;
    font-size: 5.5vh;
    font-weight: 900;
    font-family: 'Montserrat', sans-serif;
    color: white;
    flex: 1;
    text-decoration-line: none;
}
.navtabs{
    flex:1;
    margin-top: -3vh;
}
.navtabs ul {
    list-style-type: none;
    color: aliceblue;
    font-size: 2.7vw;
    margin-top: 9vh;
    float: right;
    display: flex;
    font-family: 'Montserrat', sans-serif;
    font-weight: 200;
}
.navtabs ul li a:hover{
    text-decoration-line: underline;
}
.navtabs ul li{
    margin-right: 30px;
}
.navtabs ul li a{
    text-decoration-line: none;
    color:white
}
.hometext {
    width: 34vw;
    margin-top: 32vh;
    margin-left: 6vw;
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    position: absolute;
    color: white;
    font-size: 4.8vh;
    background-color: rgb(20,20,20);
}
h1{
    margin:50;
    font-family: 'Montserrat', sans-serif;
}
.homeimg{
    object-fit: cover;
    width: 100%;
    height: 100%;
}
.cropped {
    object-fit: fill;
    margin: 0;
    height: 100%;
}
.lowerpage {
    width: 90%;
    height: 40%;
    margin: auto;
    display: flex;
}
.lowHeader {
    margin: 20;
    margin-left: 5%;
    margin-top: 50px;
    font-family: 'Montserrat', sans-serif;
    color: white;
    font-size: 40;
    font-weight: 200;
}
.lowimg {
    width: 65%;
    height: 100%;
    overflow: hidden;
    flex: 2;
}
.lowBox {
    background-color: rgb(60,60,60);
    flex: 1;
    margin-left: 25;
    color: white;
}
.lowText {
    margin: 30px;
    font-family: 'Montserrat', sans-serif;
    font-size: 27;
    font-weight: 200;
}
.homeFooter {
    background-color: black;
    color: grey;
    margin-top: 12vh;
    text-align: center;
    padding: 10;
}
.lowerPage{
    display: flex
}
.lowerProjects{
    flex:1;
    margin-right: 5vw;
}
.lowerProjects h1 {
    font-family: 'Montserrat', sans-serif;
    margin-left: 0;
    color: white;
    font-size: 5vh;
}
.projimg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 40px;

}
.projimg img:hover {
    opacity:0.3
}
.projimg {
    object-fit: fill;
    margin-bottom: 6vw;
    height: 36vh;
    width: 73.6vh;
    border-radius: 40px;
    background-color: #455271;
}
.lowerAbtContact {
    flex: 1;
    margin-top: 2.2vh;
}
.lowerAbtContact h1 {
    font-family: 'Montserrat', sans-serif;
    position: absolute;
    font-size: 5vh;
    margin-left: 1vw;
    margin-top: 1vh;
}
.contactHome {
    width: 73.6vh;
    height: 60vh;
    object-fit: cover;
    margin-bottom: 6vw;
    margin-top: 3.3vh;
    background-color: #455271;
    border-radius: 40px;
}
.aboutHome{
    width: 73.6vh;
    height: 60vh;
    object-fit: cover;
    margin-bottom: 6vw;
    margin-top: 3.3vh;
    border-radius: 40px;
    background-color: white;
}
.contactHome img{width: 100%;height: 100%;object-fit: cover;border-radius: 40px;}
.aboutHome img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 40px;
}
.abouthome img:hover{
    opacity:0.3;
}
.contactHome img:hover{
    opacity:0.3
}
.navbarblue {
    display: flex;
    background-image: linear-gradient(70deg, #5180BB, #8EB1D1);
}

.contact {
    display: flex;
}

.contactleft {
    flex: 1;
}

.contactright {
    flex: 1;
    background-color: white;
    margin-top: 7vh;
    border-radius: 40px;
    margin-right: 3vw;
}

.contactleft h1 {
    color: white;
    font-size: 6vh;
}

.contacttable {
    background-color: white;
    margin: auto;
    width: 90%;
    border-radius: 40px;
    height: 50vh;
    font-family: 'Montserrat', sans-serif;
}

.contacttable table {
    width: 90%;
    margin: auto;
    height: 100%;
}

.contacttable table th, td {
    font-size: 3vh;
}

.contactright form {
    margin-left: 2vw;
    margin-top: 2vw;
}

.contactright form input {
    font-family: 'Montserrat', sans-serif;
    width: 95%;
    height: 12.7%;
    border-width: 0 0 3px;
    font-size: 3vh;
}
.abouttop {
    margin-top: 10vh;
    display: flex;
}

.aboutphoto {
    flex: 1;
    margin-left: 8vh;
}

.aboutmain {
    flex: 2;
    background-color: white;
    margin-right: 8vh;
    margin-left: 8vh;
    border-radius: 40px;
}

.aboutphoto img {
    object-fit: cover;
    width: 100%;
    border-radius: 40px;
    height: 100%;
}
.aboutmain p {
    font-family: 'Montserrat', sans-serif;
    font-size: 3vh;
    margin: 4vh;
}
.homeFooter ul {
    list-style-type: none;
    color: aliceblue;
    font-size: 2.7vw;
    display: flex;
    font-family: 'Montserrat', sans-serif;
    font-weight: 200;
    margin: auto;
    margin-left: 10.8vw;
    margin-bottom: 3vh;
    margin-top: 3vh;
}
.homeFooter ul li a {
    color: white;
    padding: 30;
    text-decoration-line: none;
}
.homeFooter ul li a:hover{
    text-decoration-line: underline;
}
.widget iframe {
    border-radius: 40px;
    margin-left: 4.5vw;
    margin-top: 4.5vw;
    color: black;
    filter: invert(100%);
}
.aboutbottom {
    display: flex;
}

.widget {
    flex: 1;
}

.qualifications {
    flex: 1;
    background-color: white;
    margin-top: 8vh;
    border-radius: 40px;
    margin-right: 5vw;
    font-size: 2.2vh;
}

h2 {
    font-family: 'Montserrat', sans-serif;
}

p {
    font-family: 'Montserrat', sans-serif;
}

.qualifications h2,p {
    margin-left: 3.3vw;
    margin-right: 3.3vw;
}

.qualifications h1 {
    text-align: center;
}
.projimg h2 {
    position: absolute;
    color: white;
    font-weight: 200;
    margin-left: 2vw;
    margin-top: 17vw;
}
.allproj {
    width: 90vw;
    margin: auto;
    margin-top: 8vh;
}

.allproj h2 {
    position: absolute;
    margin-left: 2vw;
    margin-top: 4vh;
    color: white;
    font-size: 6vh;
}

.allproj img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    border-radius: 40px;
}
h1.projecttitle {
    position: absolute;
    margin-top: -24vh;
    margin-left: 2vw;
    color: white;
    font-size: 8vh;
}

.abouthome p {
    font-size: 3.7vh;
    padding-top: 11vh;
}
.projimg iframe {
    width: 100%;
    height: 100%;
    border-radius: 40px;
}