.firstColor{
    background-color: #0b0c10;
}

.secondColor{
    background-color: #1f2833;
}

.thirdColor{
    background-color: #c5c6c7;
}

.fourthColor{
    background-color: #66fcf1;
}

.fifthColor {
    background-color: #45a29e;
}

.firstText {
    color: #0b0c10;
}

.secondText {
    color: #1f2833;
}

.thirdText {
    color: #c5c6c7;
}

.fourthText {
    color: #66fcf1;
}

.fifthText {
    color: #45a29e;
}
    
.vibrantBorders{
    border-style: solid;
    border-color:#66fcf1;
    border-width: .15em;
    border-radius: .1em;
}

.semiVibrantBorders{
    border-style: solid;
    border-color:#a1a2a3;
    border-width: .2em;
    border-radius: .1em;
}

.btn-contact{
    color: #1f2833;
    background-color: #66fcf1;
    border-color: #66fcf1;
    margin-top: .3em;
    margin-bottom: .3em;
}

.btn-contact:hover{
    background-color: #66fcf1;
    border-color: #45a29e;
}

.card{
    margin: 0;
}

.navTitle{
    font-size: 2em;
    font-weight: 700;
}

body{
    /* The image used */
    background-image: url("../img/topographic_seamless_pattern_2.png");    

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: repeat;
    background-size: 500px 500px;
    /*background-color: rgba(69,162,158,0.2);*/
    background-color: rgba(34,79,77,0.8);
    
    
}

#email{
    padding-left: 3px;
    padding-right: 3px;
    background-color: #7F7D99;
    border: none;
    width: 92%;
}

body,html{margin:0;padding:0;}

html{
    scroll-behavior: smooth;    
}

h2{
    color: #45a29e;
}

h3{
    color: #66fcf1;
}

@media (min-width: 320px){
    img{
        padding-top: .5em;
        padding-bottom: .5em;
    }
}

@media (min-width: 1200px){
      .container {
        max-width: 1120px;
    }  
}

@media (min-width: 1500px){
      .container {
        max-width: 1400px;
    }  
}