body{
    background:#FFFFFF;
    color: black;
    font-family: 'Unica One', cursive;
    width: 100%;
}

li{
    list-style: none;
}

a{
    color:#000;
    text-decoration: none;
}

a:hover{
    color: saddlebrown;
    text-decoration: none;
}

#logo{
    display:inline-block;
}

nav{
    font-size: 32px;
    font-weight: bold;
    display: flex;
    flex-direction: row; 
}

nav ul {
    display: flex;
    flex-direction: row; 
    flex-wrap: wrap;
}


nav ul li {
    list-style: none;
    margin:15px;
    display: block;
}


.mainnavhide{
    
}

.hamburger{
    height:23px;
    width:26px;
	margin-top:100px;
    border: #000000 2px solid;
    border-radius: 5px;
    padding: 2px;
    display: none;
}

.hamburger div{
    width: 16px;
    height: 0px;
    border: #000000 1px solid;
    margin:4px;
    
}

.hamburger:hover,
.hamburger:hover div
{
    border-color: saddlebrown;
}



#content {
    margin: 0 auto;
    width:100%;
}

#slideshow {
    position:relative; 
}

#slides {
    overflow:hidden; 
    position:relative; 
    width:100%; 
    height:100%;
    object-fit: cover;
}

#slides img { 
    position:absolute; 
    animation:slides 20s infinite;
    object-fit: cover;
    opacity:0; 
    width: 100%; 
    height: auto;
  
    object-fit: cover;
}

@keyframes slides {
    25%{opacity:1;} 
    40%{opacity:0;}
} 
#slides img:nth-child(4){animation-delay:0s;}
#slides img:nth-child(3){animation-delay:5s;}
#slides img:nth-child(2){animation-delay:10s;}
#slides img:nth-child(1){animation-delay:15s;}

#hometext {
    width: 500px;
    height:100%;
    background: #FFFFFF;
    position: absolute;
    top:0px;
    opacity: 0.75;
    padding:15px;
}


.videoupdate{

}



.videoupdate{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    height: 500px;
    margin-bottom:80px;
}

.videoupdate .left {
    border: 3px solid #000;
    border-radius: 10px;
    width:48%;
    float: left;
}

.videoupdate .left h2{
    margin-left:10px;
}

.videoupdate .right {
  
    width:48%;
    float: left;
    margin-left:20px;
    display: flex;
    flex-direction: column;
    font-size: 20px;

}

.videoupdate .left img{
    max-width: 100%;
    max-height: 100%;
}

.videoupdate .right .images{
    width: 100%;
    height: 80%;
    margin: 5px;
}

.videoupdate .right .images a{
    display: flex;
    flex-direction: row;
    border: 3px solid #000;
    border-radius: 10px;
    width:180px;
    height: 140px;
    overflow:hidden;
    margin-right:15px;
    margin-bottom:15px;
    flex-wrap: wrap;
    float: left;
}

.sitecontent {
    display: flex;
    flex-direction: column;
}

#disclaimer {
    background: none repeat scroll 0 0 rgba(255, 255, 255, 0.69);
    border: 1px solid #000;
    color: #000;
    height: 50%;
    margin: 0 auto;
    position: relative;
    margin-bottom: 35px;
    overflow-y: scroll;
    max-width: 500px;
}

#enterexit{
	display:flex;
	flex-direction:row;
	font-size: 48px;
	margin-top:15px;
	width:100%;
	font-weight:bold;
}

#enterexit a{
	margin-right:50px;
	
}

.hometext{
	font-size:18px;
}

.hometext a{
	font-size:20px;
	font-weight:bold;
	border-color: saddlebrown;
}


@media only screen and (max-width: 600px) {

    .hamburger{
        display: block;
    }

    @keyframes showNav {
        from{ height:0px;opacity:0} 
        to{height:410px;opacity:1}
    } 

    @keyframes hideNav {
        to{ height:0px;opacity:0} 
        from{height:410px;opacity:1}
    } 
    
    
    .mainnavshow{
        display: block;
        animation-name: showNav;
        animation-duration: 1s;
        position: relative;
        top:110px;
        left:-250px;
        height: 400px;
      
    }

    #hometext {
        width: 220px;
        height:100%;
        background: #FFFFFF;
        position: absolute;
        top:0px;
        opacity: 0.75;
        padding:15px;
        
    }

    .mainnavhide{
        display: none;
        height: 0px;
        animation-name: hideNav;
        animation-duration: 1s;
    }

    .videoupdate .left,
    .videoupdate .right {
    width:99%;
    }

    .videoupdate{
        height: 800px;
    }

}
