@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:wght@600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,300;0,400;0,600;1,400;1,600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Audiowide&display=swap');

body {
    background-color: #211e3f;
}
p {
    font-family: 'Work Sans', sans-serif;
    overflow: auto;
}

img {
    max-width: 100%;
    height: auto;
}

.bounding {
    width: 90%;
    max-width: 1860px;
    height: auto;
    min-height: 1000px;
    border: #465FEA 2px solid;
    margin: auto;
    background: rgb(0,6,54);
    background: linear-gradient(180deg, rgba(0,6,54,1) 0%, rgba(9,9,121,1) 65%, rgba(83,75,221,1) 100%);
}

.helper {
    width: 95%;
    height: 400px;
    margin: auto;
}

.navbarTop {
    width: 100%;
    height: 100px;
    background: rgb(146,176,255);
    background: linear-gradient(0deg, rgba(146,176,255,1) 0%, rgba(44,44,162,1) 35%, rgba(121,113,255,1) 100%);
    color: white;
    font-family: 'Titillium Web';
    font-size: 30pt;
}

a.navbarTop:visited {
    color:white;
}

.navButton {
    width: 200px;
    height: 80px;
    margin-left: 2%;
    margin-right: 2%;
    padding-top: 20px;
    text-decoration: none;
    color: #465FEA;
    background-color: #1F2966;
    text-align: center;
    float: right;
    transform: skew(-20deg);
}

.navButton:hover {
    color: white;
}

.container {
    width: 95%;
    height: auto;
    min-height: 500px;
    margin: auto;
}

.flexContainer {
    width: auto;
    height: auto;
    display: flex;
    flex-flow: row;
    flex-wrap: wrap;
}

.titleBar {
    width: 100%;
    height: 50px;
    background: rgb(146,176,255);
    background: linear-gradient(0deg, rgba(146,176,255,1) 0%, rgba(44,44,162,1) 35%, rgba(121,113,255,1) 100%);
    color: white;
}

.containerSmall {
    width: 48%;
    height: 300px;
    border: #465FEA 3px solid;
    border-bottom-right-radius: 50px;
    margin-left: 1%;
    float: left;
    color: white;
    background: rgb(0,6,54);
    background: linear-gradient(0deg, rgba(0,6,54,1) 0%, rgba(9,9,121,1) 35%, rgba(83,75,221,1) 100%);
}

.containerMedium {
    width: 48%;
    height: auto;
    border: #465FEA 3px solid;
    border-bottom-right-radius: 50px;
    margin-left: 1%;
    color: white;
    background: rgb(0,6,54);
    background: linear-gradient(0deg, rgba(0,6,54,1) 0%, rgba(9,9,121,1) 35%, rgba(83,75,221,1) 100%);
}

.holdLeft {
    width: 42%;
    height: 492px;
    border: 3px solid #465FEA;
    border-top-left-radius: 125px;
    float: left;
}

.interior {
    padding-left: 4%;
    padding-right: 2%;
    overflow: auto;
    color: white;
    text-shadow: 0px 5px 10px rgb(49, 49, 49);

}

.holdRight {
    float: right;
    width: 725px;
    height: 500px;
    background: rgb(24,63,166);
    background: linear-gradient(0deg, rgba(24,63,166,1) 0%, rgba(45,32,255,1) 100%);
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
}

.gridHold {
    width: 27%;
    height: 30%;
    padding: 1%;
    padding-right: 1%;
    display: flex;
    flex-flow: column wrap;
    float: right;

}

.navBox {
    width: 150px;
    height: 150px;
    background-color: white;
    margin: auto;
    border-radius: 20px;
    font-family: 'Audiowide';
    font-size: 12pt;
    text-align: center;
    color: #465FEA;
    float: left;
}

.videoContain {
    width: 600px;
    height: auto;
    margin: auto;

}
a.navBox:visited {
    color: #465FEA;
}

.navBox:hover {
    background-color: #1F2966;
    color: white;
}

h1 {
    font-family: 'Audiowide';
    font-size: 48pt;
    padding-left: 50px;
    color: white;
    text-shadow: 0px 5px 10px rgb(49, 49, 49);
}

h2 {
    padding-left: 10px;
    margin: 0px;
    font-family: 'Titillium Web';
    font-size: 36px;
    float: left;
}

.clear {
    clear:left;
}

a:visited {
    color: #465FEA;
}

noLine {
 text-decoration: none; 
}