/*1st home page*/
.home-page{
    height: 100vh;
    background: url("homepage-3.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position-y:70%;
    overflow:auto;
}
.home-page::before{
    content:"";
    position: absolute;
    width: 100%;
    height: 100vh;
    background:inherit;
    background-position: ;
    filter:brightness(0.5) blur(2px);
}

/*TechNet text*/
.home-page-text{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
h1{
    margin-top: 30vh;
    font-size: 6rem;
    color: #d6eaf8;
    position:relative;
}
.learn-more{
    position: relative;
    padding: 0.8rem;
    border-radius: 7px;
    border: none;
}
.learn-more a{
    text-decoration: none;
    font-family: Poppins;
    font-size: 1.5rem;
    color: inherit;
    font-weight: 500;
}

.learn-more:hover{
    background-color: #d6eaf8;
    cursor:pointer;
}
/*Text formatting*/
.center-text{
    margin:0;
    padding: 1rem;
    text-align: center;
    font-size: 3rem;
}
.bold{
    font-weight: 700; 
}

/*About Us Section*/

.about-us{
    height: ; /*value?*/
    overflow: auto;
    padding-top: 3rem;
    background: linear-gradient(60deg, #d6eaf8, #135480);
}
.about-us-para{
    text-align: left;
    padding: 0 20vw 0; 
    
}
.text-and-logos{
    
}
/*logo*/
.technet_sa{
    width: 15rem;
    height: 15rem;
    padding: 2rem;
}
.uni_ade{
    width: 15rem;
    height: 15rem;
    padding: 2rem;
}
.unisa{
    width: 14rem;
    height: 11.5rem;
    padding: 2rem;
}

.flinders{
    width: 13rem;
    height: 12rem;
    padding: 2rem;
}
.logos{
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 0;
}

/*Events Section*/
.events{
    height: 100vh;
    padding-top: 3rem;
}
.events-years{
    display: flex;
    flex-direction: row;
    flex-wrap:wrap;
    align-items: center;
    overflow:clip;
}
.year-box{
    height: 70vh;
    width: 33.3vw;
    position: relative;
}
/*Campus pictures*/
.events-campus{
    width: 100%;
    height: 100%;
    object-fit: cover;  
}
#year-1, #year-2, #year-3{
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   margin: 50% auto;
   text-align: center;
   color: #fff;
   font-size: clamp(3.5rem, 2.5rem + 1.25vw, 4rem);
   font-weight: 600;
}
.year-box:hover img{
    transition: transform 0.5s ease;
    transform: scale(1.25);
    filter: blur(0.5px);
    margin: 0;
    object-fit: cover;
}
.year-box:hover{
    overflow: hidden;
    cursor:pointer;
}


/*Useful Links Section*/
.links{
    height: 100vh;
}
.links-wrapper{
    display: flex;
    flex-direction: row;
    flex-wrap:wrap;
    justify-content: space-around;
    justify-self: center;
    row-gap: 2vh;
}
.links-wrapper a{
    text-decoration: none;
}
.links-grid:hover{
    transform:translateY(-5px);
}

.links-grid{
    height: 25vh;
    width: 40vw;
    border-radius: 10px;
    font-size:2rem;
    color: #fff;
    font-weight:600;
    padding: 0.8rem;
    display: grid;
    align-items: end;  /*for text to be at the bottom*/
}

#links-grid-1{
    background: linear-gradient(90deg,#a93226, #e6b0aa);
}
#links-grid-2{
    background: linear-gradient(90deg,#7d3c98, #d2b4de);
}
#links-grid-3{
    background: linear-gradient(90deg,#2e86c1, #aed6f1);
}
#links-grid-4{
    background: linear-gradient(90deg,#229954, #a9dfbf);
}
#links-grid-5{
    background: linear-gradient(90deg,#d4ac0d, #f9e79f);
}
#links-grid-6{
    background: linear-gradient(90deg,#ba4a00, #edbb99);
}