/*
?v=2.6 2021-10-01
?v=2.5 2021-10-01
?v=2.4 2021-10-01
?v=2.3 2021-9-24
?v=2.2 2021-9-15 15:54
?v=2.1 2021-9-15 12:15
?v=2.0 2020-11-22 23:35
?v=1.9 2020-11-22 22:45
?v=1.8 2020-11-20 16:15
?v=1.7 2020-11-18 16:20
?v=1.6 2020-05-30 17:11
?v=1.5 2020-05-21 17:25
?v=1.4 2019-11-3 01:05
font-family: 'Playfair Display', serif;
font-family: 'Libre Baskerville', serif;
font-family: 'Unna', serif;
font-family: 'Source Sans Pro', sans-serif;
*/

.logo {
    font-weight: 600;
}

body{
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  background-color: rgba(8, 15, 34, 0.185);
}

nav li {
    letter-spacing: .9px;
}

nav, footer {
  opacity: 0;
  transition-property: opacity;
  transition-duration: 4s;
  transition-timing-function: ease-in-out;
  /* background-color: orangered; */
  background-color: #ff5d20;
}
.animate nav, .animate footer {
    opacity: 1;
    transition-delay: 2s;
}

.home-img img { 
    width: 100%;
    height: auto;
    transition-property: opacity;
    transition-duration: 4s;
    transition-timing-function: ease-in-out;
}
.animate .home-img img {
    opacity: 0.65;
    transition-delay: 2s;
}

.home-img h2, .home-img a {
    opacity: 0;
    transition-property: opacity;
    transition-duration: 4s;
    transition-timing-function: ease-in-out;
}
.animate .home-img h2, .animate .home-img a {
    opacity: 1;
    transition-delay: 2s;
}


/*setting position for motto and button for smaller screens*/
.home-img {
    position: relative;
   }
.motto {
    position: absolute;
    left: 15%;
    top: 38%;  
    font-weight: 500;
    font-size: 29px;   
    padding-right: 40px;
    line-height: 1.5em; 
    background-color: rgb(19, 42, 63);
    background-image: linear-gradient(305deg, #dc3545, #08233e);
    background-size: 100%;
    background-clip: text;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -webkit-text-fill-color: transparent;
    -moz-text-fill-color: transparent;   
}
.btn {
    position: absolute;
    left: 15%;
    top: 52%;  
    }


/*sticky-footer*/    
body {
    display: flex;
    flex-direction: column;
    height: 100vh; /* Avoid the IE 10-11 `min-height` bug. */
  }

.home-img {
    flex: 1 0 auto; /* Prevents Chrome, Opera, and Safari from letting these items shrink to smaller than their content's default minimum size. */
  } 
footer {
    flex-shrink: 0; /* Prevents Chrome, Opera, and Safari from letting these items shrink to smaller than their content's default minimum size. */
    text-align: center;
    padding-top: 8px;
    padding-bottom: 10px;
}  

footer p {
    font-size: 90%;
    font-weight: 500; 
    padding: 0 5px;  
    margin-bottom: 3px;    
}      
footer a {
    color: #d6d6d3;
    font-weight: 600;    
}
footer a:hover {
    color: #d6d6d3;    
}


/*setting position for motto and button for larger screens*/
@media screen and (min-width: 680px) {
    .motto {
        position: absolute;
        left: 15%;
        top: 40%;  
        font-size: 2.5em;        
    }
    .btn {
        position: absolute;
        left: 15%;
        top: 49%;  
    }    
}
    

@media screen and (min-width: 768px) {
    nav li {
        margin-left : 2em;        
    }
}


@media screen and (min-width: 992px){
    nav li {
        margin-right : 3em;
    }
}