html{
font-family: 'Lato', sans-serif;
font-weight:900;
background-color:black;
}

h1{

font-size:600%;
}
.fadeIn1 {
margin-top:20%;
-webkit-animation: fadein 3s; /* Safari, Chrome and Opera > 12.1 */
-moz-animation: fadein 3s; /* Firefox < 16 */
-ms-animation: fadein 3s; /* Internet Explorer */
-o-animation: fadein 3s; /* Opera < 12.1 */
animation: fadein 3s;
}


.fadeIn2 {
-webkit-animation: fadein 8s; /* Safari, Chrome and Opera > 12.1 */
-moz-animation: fadein 8s; /* Firefox < 16 */
-ms-animation: fadein 8s; /* Internet Explorer */
-o-animation: fadein 8s; /* Opera < 12.1 */
animation: fadein 8s;
}

.fadeIn3 {
-webkit-animation: fadein 10s; /* Safari, Chrome and Opera > 12.1 */
-moz-animation: fadein 10s; /* Firefox < 16 */
-ms-animation: fadein 10s; /* Internet Explorer */
-o-animation: fadein 10s; /* Opera < 12.1 */
animation: fadein 10s;
}

.landingInt{
display: flex;
justify-content: center;
min-height: 93vh;
max-height: 93vh;

}
.tMainCont{
color:white;
font-color:white;
display: none;
justify-content: center;
min-height: 93vh;
max-height: 93vh;


}

.landT{
font-weight:bold;
}

ul{
list-style-type: disc;
-webkit-margin-before: 0em;
-webkit-margin-after: 0em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
-webkit-padding-start: 0px;

}
.bText{
color:white;
}
.ftr{
position: absolute;
right:0;
bottom:0;
left:0;
right:0;
padding:1rem;
color:white;
text-align:center;
font-weight: normal !important;
}
body{
font-color: white !important;
background-image: none;

}
.bBox{

margin-top:15%;
}
.iBtn{

width: 50vw;
height: 10vh;
background: transparent;
font-size:200%;
color: #ddd0a1;
border:none;
}

.iBtn:hover, .iBtn:active, .iBtn:focus{
border: none;
outline:none;
cursor: pointer;
}



/***popover***/


a {
text-decoration: none;
}

.popover_trans {
text-align: center;
}

.popover_content {
visibility: hidden;
opacity: 0;

transition: visibility 0s, opacity 0.5s linear;
background-color: #BFBFBF;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
width: auto;
}
.popover_content:before {
position: absolute;
z-index: -1;
content: '';
right: calc(50% - 10px);
top: -8px;
border-style: solid;
border-width: 0 10px 10px 10px;
border-color: transparent transparent #BFBFBF transparent;
transition-duration: 0.3s;
transition-property: transform;
}
.popover_wrapper:hover .popover_content {
opacity: 1;
z-index: 10;

visibility: visible;
transform: translate(0,-20px);
transition: all 0.5s cubic-bezier(0.75, -0.02, 0.2, 0.97);
position: relative;
margin: 0 auto;
left:0;
right:0;
width: 60%;
}
.popover_message {
text-align: center;
}


.hcapt{
display:table;
}


/*Typewriter*/


.intName h5 {
width: 25%;
font-size: 300%;
overflow: hidden; /* Ensures the content is not revealed until the animation */
border-right: .15em solid orange; /* The typwriter cursor */
white-space: nowrap; /* Keeps the content on a single line */
margin: 0 auto; /* Gives that scrolling effect as the typing happens */
letter-spacing: .05em; /* Adjust as needed */
animation: 
typingName 1.5s steps(20, end),
blink-caret .75s step-end infinite;
}

.intWelc h5 {
font-size: 300%;
width: 56%;
overflow: hidden; /* Ensures the content is not revealed until the animation */
border-right: .15em solid orange; /* The typwriter cursor */
white-space: nowrap; /* Keeps the content on a single line */
margin: 0 auto; /* Gives that scrolling effect as the typing happens */
letter-spacing: .05em; /* Adjust as needed */
animation: 
typing 3.5s steps(40, end),

typingClose 3.5s steps(40, end) 3.5s,
blink-caret .75s step-end infinite;

animation-fill-mode: forwards;

}

/* The typing effect */
@keyframes typingClose {
from { width: 56 }
to { width: 0% }
}
/* The typing effect */
@keyframes typingName {
from { width: 0 }
to { width: 25% }
}

/* The typing effect */
@keyframes typing {
from { width: 0 }
to { width: 56% }
}

/* The typewriter cursor effect */
@keyframes blink-caret {
from, to { border-color: transparent }
50% { border-color: orange; }
}