*{
    font-family: century gothic, quicksand, 'Quicksand', sans-serif;
}

a{
    color: black;
}

.bar/*for smaller screens*/{
    background-color: rgb(255, 102, 168);
    width: 50%;
    height: 7%;
}

.colorBar/*for bigNav*/{
    background-color: rgb(255, 102, 168);
    width: 30%;
}

header{
    background-color: rgba(255, 102, 168, 0.45);
}

.bigNav{
    background-color: white;
    display: none;
}

/*.nav-link{
    font-family: pacifico, 'Pacifico', cursive;
}*/

h1{
    font-family: pacifico, 'Pacifico', cursive;
    text-align: center;
}

h3{
    font-family: pacifico, 'Pacifico', cursive;
    text-align: center;
}

h5{
    text-align: center;
}

footer{
  /*position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 1rem;*/
  background-color: rgb(255, 102, 168);
  text-align: center;
    height: 2em;
}

.logo{
    padding-top: 10px;
    font-size: 3em;
}

.navbar-light{
    background-color: rgb(255, 102, 168);
}

.navbar-toggler{
    background-color: rgba(255, 102, 168, 0.45);
}

.projectTitle{
    font-family: pacifico, 'Pacifico', cursive;
    font-size: 1em;
}

.screen{
    width: 80%;
    height: auto;
    margin: auto;
}

.label{
    width: 50%;
    height: auto;
}

.stickyFooter{
    position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
   
}

/*Tablet Screen*/
@media screen and (min-width:768px){
   
    
}

/*Laptop Screen*/
@media screen and (min-width:1024px){
    
    .bar{
    width: 100%;
    text-align: center;
    }
    
    .projectTitle{
        font-size: 24px;
    }
    
}

/*Big Desktop Screen*/
@media screen and (min-width:2560px){
    header{
        height: 300px;
    }
    
    li{
        font-size: 24px;
    }
    
    .logo{
        font-size: 100px;
        padding-top: 30px;
        padding-bottom: 10px;
    }
    .bar{
    width: 100%;
    height: 100px;
    font-size: 2em;
    }
    
}