/* This script should be used for elements used on almost all pages or classes that are universally used. */

*{
    margin:0;
    padding:0;
    font-family:arial;
}

@keyframes fade-in {
    0% { opacity: 0; }
    100% { opacity: 1; }
  }

body{
    background-color:#1f2831;
    background-image:url(../Images/background.png);
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    background-attachment:fixed;
    min-height:100%;
    width:100%;
    animation:fade-in 3s;
}

.mainTxtCol{
    color:white;
    text-decoration:none;
}

#topSection{
    min-height:200px;
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-around;
    flex-direction:column;
    margin-bottom:50px;
}

#topTitle{
    font-size:350%;
}

#topTitle img{
    max-height:200px;
    padding:10px;
}

#mainNav{
    display:flex;
    flex-direction:row;
    justify-content:center;
    align-items:center;
    border-bottom:2px solid #4ab7ff;
    flex-wrap:wrap;
}

#mainNav a{
    height:50px;
    width:250px;
    text-align:center;
    display:flex;
    justify-content:center;
    align-items:center;
    text-decoration:none;
}

#mainNav a:hover{
    background-color:rgba(0, 0, 0, 0.2);
}

.navOption{
    text-align:center;

}

footer{
    margin-top:50px;
    height:150px;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    align-items:center;
    text-align:center;
    background-color:black;
}

#footerTxt{
    padding:10px;
}