*{
    margin: 0px;
    padding: 0px;
}
body.home{
    padding: 0;
    margin: 0;
    height:100%;
    /* background-color: rgb(226, 231, 255); */
    background-image: url('sky.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}
body{
    font-family: 'Poppins', sans-serif;
}
/*navigation bar*/
.logo{
    padding: 10px;
    width: auto;
    float: left;
}
.logo img{
    height: 55px;
}
.homelink{
    display: flex;
    align-items: left;
    gap:10px;
    text-decoration: none;
}
.sitetitle{
    font-size:24px;
    font-weight:700;
    margin-bottom: 0px;
    color:rgb(6, 6, 61);
}
.navbar{
    background-color: cornflowerblue;
    overflow: hidden;
}
.navbar a{
    float: right;
    color:aliceblue;
    text-align:center;
    margin-top: 10px;
    padding: 15px 25px;
    text-decoration: none;
    font-size: 25px;
}
.navbar a:hover{
    background-color:rgb(223, 193, 255);
    color:aliceblue;
}
.navbar a:active{
    background-color:rgb(162, 109, 212);
    color:rgb(192, 70, 211);
}

/*HOME PAGE*/
.photo{
    margin-top:50px;
    float:left;
    max-width: 400px;
    height: auto;
}
.name{
    font-size:30px;
    font-weight:700;
    align-items:right;
    color:rgb(60, 103, 234);
}
.introduction{
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 40px;
}
.introduction .text{
    background-color:rgb(232, 240, 255);
    border: 6px solid rgb(173, 184, 252);
    border-radius: 15px;
    padding:25px; /*Internal spacing*/
}
.intro{
   font-size:18px;
   font-weight: 400;
   line-height:20px;
}

/*HOME - about*/
.aboutsection{
    display:flex;
    gap: 20px;
    align-items: center;
    margin: 40px;

    background-color:rgb(240, 246, 255);
    border: 3px solid rgb(157, 194, 247);
    border-radius: 15px;
    padding:15px; /*Internal spacing*/
}
.abouthead{
    color:rgb(4, 12, 29);
    font-size:50px;
    align-content: top;
}
.aboutme{
    color:rgb(2, 2, 26);
    margin:20px;
}

/*HOME - buttons*/
.button_nav{
    display: flex;
    align-content: center;
    margin-top: -60px;
    margin-left:600px;
    margin-bottom: 160px;
    gap: 45px;
}
.button_qual{
    display: inline-block;
    text-decoration: none;
    padding: 20px 10px 25px 10px;
    border: 1px outset buttonborder;
    border-radius:3px;
    font-size:20px;
    flex-direction: row;
    align-self: center;
    font-family: 'Poppins', sans-serif;
    color:rgb(21, 21, 108);
    background-color: rgb(215, 229, 255);
}
.button_qual:hover{
    /* color:rgb(108, 18, 126); */
    background-color:rgb(237, 185, 248);
}
.button_port{
    display: inline-block;
    text-decoration: none;
    padding: 20px 60px 25px 60px;
    border: 1px outset buttonborder;
    border-radius:3px;
    font-size:20px;
    flex-direction: row;
    align-self: center;
    font-family: 'Poppins', sans-serif;
    color:rgb(21, 21, 108);
    background-color: rgb(215, 229, 255);
}
.button_port:hover{
    background-color:rgb(237, 185, 248);
}
.button_serv{
    display: inline-block;
    text-decoration: none;
    padding: 20px 60px 25px 60px;
    border: 1px outset buttonborder;
    border-radius:3px;
    font-size:20px;
    flex-direction: row;
    align-self: center;
    font-family: 'Poppins', sans-serif;
    color:rgb(21, 21, 108);
    background-color: rgb(215, 229, 255);
}
.button_serv:hover{
    background-color:rgb(237, 185, 248);
}
.button_ai{
    display: inline-block;
    text-decoration: none;
    padding: 20px 75px 25px 75px; /*top right bottom left */
    border: 1px outset buttonborder;
    border-radius:3px;
    font-size:20px;
    flex-direction: row;
    align-self: center;
    font-family: 'Poppins', sans-serif;
    color:rgb(21, 21, 108);
    background-color: rgb(215, 229, 255);
}
.button_ai:hover{
    background-color:rgb(237, 185, 248);
}

/*HOME - contact*/
.contact{
    display: flex;
    align-items: flex-start;
    gap: 20px;
    margin-top: 100px;
    margin-bottom: 25px;
    font-family: 'Poppins', sans-serif;
}
.contacthead{
    float: left;
    margin-left: 50px;
    align-self: center;
    font-size: 30px;
}
.links{
    display:flex;
    margin-left: auto;
    margin-right: 200px;
    gap: 50px
}
.linkedin{
    display:flex;
    flex-direction:row;
    gap: 10px;
}
.linkedin .img{
    height: auto;
    max-width: 50px;
}
.linkedin .link{
    font-size: 15px;
}
.github{
    display:flex;
    flex-direction:row;
    gap: 10px;
}
.github .link{
    font-size: 15px;
}
.github .img{
    height: auto;
    max-width: 50px;
}
.email{
    display:flex;
    flex-direction:row;
    gap: 10px;
}
.email .img{
    height: auto;
    max-width: 50px;
}
.email .link{
    font-size: 15px;
}

/* Service */
.titleserv{
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:55px;
    margin-top: 40px;

}
body.service{
    min-height:100vh;
    /* background-color: rgb(226, 231, 255); */
    font-family: 'Poppins', sans-serif;
    
     background-image: url('https://i.pinimg.com/1200x/9d/88/f3/9d88f306b28d7ba656b6e473e385ccc0.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}
.txsef{
    display: flex;
    align-items: center;
    font-family: 'Poppins', sans-serif;
    margin:40px;

    background-color:rgb(199, 240, 255);
    border: 3px solid rgb(189, 205, 255);
    border-radius: 12px;
}
.txsef .text{
    display:flex;
    flex-direction: column;
    margin-left: 20px;
}
.tx_img{
    margin-top:50px;
    margin-left:20px;
    margin-bottom:20px;
    float:left;
    max-width: 400px;
    height: auto;
    border-radius: 12px;
}

.gis{
    display: flex;
    align-items: center;
    font-family: 'Poppins', sans-serif;
    margin:40px;

    background-color:rgb(166, 217, 255);
    border: 3px solid rgb(180, 200, 255);
    border-radius: 12px;
}
.gis .text{
    display:flex;
    flex-direction: column;
    margin-left: 20px;
}
.gisheader, .txheader, .bigeventheader{
    font-family: 'Poppins', sans-serif; 
    margin: 10px;
    font-size: 28px;
    align-items: center;
}
.gis_img{
    margin-top:50px;
    margin-left:20px;
    margin-bottom:20px;
    float:left;
    max-width: 400px;
    height: auto;
}

.bigevent{
    display: flex;
    align-items: center;
    font-family: 'Poppins', sans-serif;
    margin:40px;

    background-color:rgb(133, 223, 255);
    border: 3px solid rgb(154, 178, 255);
    border-radius: 12px;
}
.bigevent .text{
    display:flex;
    flex-direction: column;
    margin-left: 20px;
}
.beimg{
    margin-top:50px;
    margin-left:20px;
    margin-bottom:20px;
    float:left;
    max-width: 400px;
    height: auto;
}


/* Portfolio */
body.portfolio{
    padding: 0;
    margin: 0;
    height:100%;
    background-color: rgb(226, 231, 255);

    font-family: 'Poppins', sans-serif;
}


/* .cpu{
    display: flex;
    align-items: center;
    font-family: 'Poppins', sans-serif;
    margin:40px;
} */
 /*PORTFOLIO*/
.titleport{
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:55px;
    margin-top: 40px;
    margin-bottom:none;
}
/*Research Section*/
.research{
    display: flex;
    align-items: flex-start;
    font-family: 'Poppins', sans-serif;
    margin:40px;
    gap: 10px;

    background-color:rgb(202, 193, 255);
    border: 3px solid rgb(160, 165, 253);
    border-radius: 12px;
    padding:10px;
}
.researchhead{
    display:flex;
    align-items:left;
    justify-content:left;
    margin:20px;
    font-size:35px;
}
.research .images{
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 40px;
}
.aggiephoto1{
    margin-top:25px;
    margin-left:30px;
    float:left;
    max-width: 600px;
    height: auto;
}
.research .text{
    display: flex; 
    flex-direction:column;
    margin: 60px;
}
.aggielabhead{
    font-family: 'Poppins', sans-serif; 
    margin: 10px;
    font-size: 28px;
}
.aggielabinfo{
    font-family: 'Poppins', sans-serif; 
    margin: 10px;
    font-size: 20px;
}

/*Hardware*/
.hardwarehead{
    display:flex;
    align-items:left;
    justify-content:left;
    margin:20px;
    font-size:35px;
}

/*hack plant section*/
.hackplant{ /*default flex direction is row*/
    display:flex; /*allows to style in row/col*/
    align-items:flex-start; /*aligns items to the top*/
    margin: 40px; /*creates space between other sections*/
    gap: 10px; /*space between rows/cols inside*/
    font-family: 'Poppins', sans-serif;

    background-color:rgb(184, 171, 241);
    border: 3px solid rgb(157, 157, 232);
    border-radius: 12px;
    padding:10px;
}
.hackplant .text{
    display: flex; /*every time you have a parent container, need for children*/
    flex-direction:column; /*allows for col format*/
    margin: 60px;
}
.hackplant .images{
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 40px;
}
.hack1{
    margin-top:25px;
    margin-left:30px;
    float:left;
    max-width: 600px;
    height: auto;
}
.hack2{
    margin-top:50px;
    margin-left:30px;
    float:left;
    max-width: 400px;
    height: auto;
}
.hackplant .hackplanthead{
    margin-bottom: 10px;
    font-size:28px;
}
.hackplant .hackinfo{
    font-size: 20px;
}

/*CPU*/
.cpu{
    display: flex;
    align-items: flex-start;
    font-family: 'Poppins', sans-serif;
    margin:40px;
    gap: 10px;

    background-color:rgb(157, 157, 232);
    border: 3px solid rgb(141, 141, 218);
    border-radius: 12px;
    padding:10px;
}
.cpu .images{
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 40px;
}
.pipeline1{
    margin-top:25px;
    margin-left:30px;
    float:left;
    max-width: 600px;
    height: auto;
}
.cpu .text{
    display: flex; 
    flex-direction:column;
    margin: 60px;
    border:15px rgb(178, 173, 237);
}
.cpuhead{
    font-family: 'Poppins', sans-serif; 
    margin: 10px;
    font-size: 28px;
}
.cpuinfo{
    font-family: 'Poppins', sans-serif; 
    margin: 10px;
    font-size: 20px;
}

/*Software*/
.softwarehead{
    display:flex;
    align-items:left;
    justify-content:left;
    margin:20px;
    font-size:35px;
}

/*VEXU*/
.vex{
    display: flex;
    align-items: flex-start;
    font-family: 'Poppins', sans-serif;
    margin:40px;
    gap: 10px;

    background-color:rgb(141, 141, 218);
    border: 3px solid rgb(127, 113, 200);
    border-radius: 12px;
    padding:10px;
}
/* .cpu .images{
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 40px;
} */
/* .pipeline1{
    margin-top:25px;
    margin-left:30px;
    float:left;
    max-width: 600px;
    height: auto;
} */
.vex .text{
    display: flex; 
    flex-direction:column;
    margin: 60px;
}
.vexhead{
    font-family: 'Poppins', sans-serif; 
    margin: 10px;
    font-size: 28px;
}
.vexinfo{
    font-family: 'Poppins', sans-serif; 
    margin: 10px;
    font-size: 20px;
}



/* Qualifications */
.titleq{
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:55px;
    margin-top: 40px;
    margin-bottom:none;
}
body.qualification{
    padding: 0;
    margin: 0;
    height:100%;
    background-color: rgb(226, 231, 255);
    font-family: 'Poppins', sans-serif;
}
.info{
    margin: 10%;
    gap: 20%;
    display: flex;
}
.s{
    display: flex;
    align-items: center;
    flex-direction:column;
    justify-content: center;

    background-color:rgb(137, 199, 244);
    border: 2px solid rgb(141, 176, 218);
    border-radius: 20px;
    width: 290px;
    height: 320px;
    padding-left:25px;
}
.skillshead{
    font-size: 35px;
    padding-right: 25px;
}
.skills{
    font-size: 30px;
    list-style-type: disc;
    display: block;
    gap: 50px;
}
.i{
    display: flex;
    align-items: center;
    flex-direction:column;
    justify-content: center;
    margin-top: 75px;

    background-color:rgb(137, 199, 244);
    border: 2px solid rgb(141, 176, 218);
    border-radius: 20px;
    width: 500px;
    height: 55%;
    padding-left:30px;
    padding-bottom: 30px;
}
.interesthead{
    margin-top: 50px;
    font-size: 35px;
}
.interests{
    font-size: 30px;
    list-style-type: disc;
    display: block;
}
.resume{
    width: 100%;
    height: 700px;;
    border:2px rgb(37, 46, 127);
}

/*FOOTER*/
.contact{
    display:flex;
    justify-content: center;
    align-items:center;
    min-height: 80px;

    background-color: rgb(36, 155, 223);
    overflow: hidden;
}
.linkedin .link, .github .link, .email .link{
    margin-top: 10px;
    font-weight: bold;
    color:rgb(29, 15, 108);
}