@charset "utf-8";
/* CSS Document */

.header {
    background-color:#2B132A;
    color:white;
    width:100%;
    min-height: 50px;
    max-height:50px;
    position:sticky;
    top:0;
    font-family: "Noto Sans", serif;
}

.headerContainer{
    display:grid;
    grid-template-columns: 2fr 1fr;
    max-width:85em;
    min-width:29em;
    height:100%;
    margin: 0 auto;
}




a.hireList{
  color: black;
    text-decoration: none;
    border:none;

}

a.hireList:visited {
  color: black;
    text-decoration: none;
    border:none;
}


a.hireList:hover {
    text-decoration: none;
    border:none;
/*    background: #29DFBE;*/

}

a.hireList:active {
  color: black;
    border-bottom:3px solid #FC2F88;
        }

#copyEmail{
    display:none;
    z-index:-1;
}

a.hireMe{
    color:black;
    border:0;
    }

a.home{
    color:white;
    border:none;
    text-decoration: none;
}

a.home:visited {
    color:white;
    border:none;
    text-decoration: none;
}

a.home:hover {
    border-bottom:3px solid #FC2F88;   
}

.name {
    font-size: 2.5em;
    padding-top: 10px;
}

#nameScroll {
    opacity: 0; 
    pointer-events: none;
    transition: all 0.1s ease-in;
/*    float:left;*/
    font-size: 2.5em;
    padding-top: 10px;
    width:100%;
}
#nameScroll.is-visible {
    opacity: 1;
    pointer-events: auto;
}


.dropContainer {
    display:grid;
    align-items:center;
    justify-items:center;
        border:none;
    height:50px;
    margin:0 auto;
    width:100%;
}

.dropbtn {
    display:grid;
    align-items:center;
    justify-items:center;
    background-color:#03D5B1;
    font-weight: 700;
    font-size:1.5em;
    border:none;
    height:50px;
    margin:0 auto;
    width:100%;
}

.dropContainer:hover {
    background-color: #29DFBE;
}

.dropdown {
cursor: pointer;
width:100%;
}

.dropdown__window {
  
  position: relative;
  background: #03D5B1;
  border-radius:0 0 0.5em 0.5em;
  z-index: 12;
  display: none;
  visibility: hidden;
    width:100%;
    float:right;
}

.dropdown__window a{
    display:block;
    width:100%;
    
}

.dropdown__window a:hover{
    background-color: #29DFBE;
    
}

.dropdown__window--active {
  display: grid;
  visibility: visible;
/*    gap:2em;*/
    justify-content: center;
/*    padding-bottom:2em;*/
    width:100%;
}

.dropdown__window>* {
  
  font-size: 1.4em;
  cursor: pointer;
  font-weight: 400;
  color: black;

}


@media (max-width:55em) {
.dropdown__window {
  border-radius:0 0 0 0.5em;
    }

    .hireBtn {
    padding-right:2em;
}
   
    .dropdown {
padding-left:2em;
}
    
.name {
margin-left:0.5em;
}     

    #nameScroll{
        margin-left:0.5em;
    }
    
}

@media (max-width:32em) {
    #nameScroll {
    padding-top:15px;
    font-size: 1.8em;
}
    
}