*{
    font-family: 'Century Gothic';
    font-size: 12px;
   
}

header{
    background-color:#FAD702;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding:1.5rem 7%;
    border-bottom: var(--border);
    position: fixed;
    top:0; left: 0; right: 0;
    z-index: 1000;
}
.header .navbar a{
    margin:0 1rem;
    font-size: 1.6rem;
    color:black;
}

.header .navbar a:hover{
    color:var(--main-color);
    border-bottom: .1rem solid var(--main-color);
    padding-bottom: .5rem;
}

.header .icons div{
    color:black;
    cursor: pointer;
    font-size: 2.5rem;
    margin-left: 2rem;
}

.header .icons div:hover{
    color:var(--main-color);
}
.home{
    min-height: 100vh;
    margin-top: 5vh  ;
}



.home .content h3{
    font-size: 6rem;
    text-transform: uppercase;
    color:black;
    text-align: center;
}

.home .content p{
    font-size: 2rem;
    font-weight: lighter;
    line-height: 1.8;
    padding:1rem 0;
    color:black;
}



.home .content button{
    box-sizing: border-box;

/* Auto layout */

display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 15px 25px;
gap: 10px;
background-color: white;
position: absolute;
width: 155px;
height: 48px;
left: calc(50% - 155px/2 - 87.5px);
top: 469px;

border: 2px solid #FAD702;
filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.1));
border-radius: 35px;
}
.home .content button:hover{
    cursor: pointer;
}

.home .register button{
    display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 15px 25px;
gap: 10px;

position: absolute;
width: 155px;
height: 48px;
left: calc(50% - 155px/2 + 86.5px);
top: 469px;

background: #FAD702;
border-radius: 35px;
}
.home .register button:hover{
    cursor: pointer;
} 
.accordion {
  background-color: #FFFFFF;
  color: #000000;
  cursor: pointer;
  padding-top: 2vh;
  padding-bottom: 2vh;
  padding-left: 4vw;
  text-align: left;
  border: 2px solid #000000;
  box-shadow: 3px 3px 0px #000000;
  outline: none;
  font-size: 15px;
  transition: 0.4s;
  font-family: Century Gothic;
  font-weight: 700;
  margin-left: 5vw;
  width: 85vw;
  padding-right: 10vw ;
}

.active, .accordion:hover {
  background-color: #FFFFFF; 
}

.panel1{
  padding: 0 18px;
  display: none;
  background-color: white;
  overflow: hidden;
  font-family: Century Gothic;
  font-size: 15px;
  margin-left: 5vw;
  width: 77vw;
  text-align: justify;
  padding-left: 4vw;
}

.downarrow1{
  float: right;
  margin-top: 0.8vh;
  margin-right: -5vw;
}

.downarrow2{
  float: right;
  margin-top: 0vh;
  margin-right: -5vw;
}
#back{
    margin-top: 13vh;
    margin-left: 5vw;
}
#back img{
}