@charset "UTF-8";
/* CSS Document */
*{margin: 0; padding: 0;}

body {
	background-color:#707070;
	font-family: 'Raleway', Arial, Helvetica, sans-serif;
	color: white;
    font-size: 13px;
    line-height: 150%;
    }
    
/*divs-----------------------------------*/
    
#total {
display: flex;
justify-content: center;
background-color:#707070;
 }
 
 #inner { 
    margin: auto 0;
    text-align: center;
    padding: 30px 0 0 0;   
}
    

.hmenu, .hmenu-big {display: block; font-size: 15px; margin: 30px 0; }
.hmenu a, .hmenu-big a {color: #c8e5d5;}
.hmenu span, .hmenu2-big span {color: #1bffff; }

.center-center {display: flex; justify-content: center; align-items: center;}

.column { margin-bottom: 50px; padding: 0 50px;}

.video-holder {display: flex; justify-content: center; align-items: center; 
align-content: space-between; max-width: 900px; max-height: 506px; background-color:#707070;}
.video {display: flex; justify-content: center; align-items: center; }
.other-vids, .other-vids2 {display: flex; flex-wrap: wrap; justify-content: center; width: 100%; height: auto; max-width: 850px;}
.marginfive {margin:5px 8px 5px 8px;}
.nav2  {border-bottom: solid 1px #605F5F; margin: 40px 0; padding-bottom: 40px;}
.nav {margin: 40px 0; }


.eightlittlepics-surround {display: flex; flex-flow: row wrap;}





#indexgrid {width: 100%; height: auto;
	display: inline-flex;
	flex-wrap: nowrap;
	justify-content: space-between;
    align-items: center;}
#back2 {width: 20px; height: 100%;}
#back2 a {width: 100%; display: flex; justify-content: 
center; align-items: center;  color: #F96F25;}
#forward2 {width: 20px; height: 100%;}
#forward2 a {width: 100%; display: flex; justify-content: 
center; align-items: center;  color: #F96F25;}
#centerindex { margin: auto; text-align: center;}
.column {display: flex; flex-direction: column; justify-content: center;}
.scroll {margin-bottom: 50px; justify-content: center;}
    
/*text-----------------------------------*/
h1 {font-size: 30px; font-weight: 200; margin: 2px 0 4px 0;}
h2 {font-size: 15px; font-weight: 100;
    padding: 10px 0 ;}
h4 {color: #c8e9e9; font-weight: 300; line-height: 110%; margin: 10px 0 1px 0; text-align: left;}
h5 {color: #c8e9e9; font-weight: 600; line-height: 200%; margin-bottom: 20px;}
a {font-size: 15px; font-weight: 200; text-decoration: none; color: #1bffff; }
i {font-weight: 200; font-style: italic; color: #c8e5d5;}

.here a{color: orange; }
.vid-caption {margin: 10px 0 0 0; font-size: 13px; color: #c8e5d5;}

    
/*images-----------------------------------*/
img {vertical-align: top;}
.img1000 {width: 100%; height: auto; max-width: 1000px}

.img750 {width: 100%; max-width: 750px; height: auto;}
.imgcaption {margin: 10px 0 0 0; font-size: 13px; color: #c8e5d5;}
.photo {font-size: 11px;}

.splash { width: 500px; height: 660; align-content: center;}

/*review page-----------------------------------*/
.hold-four {display: flex; flex-wrap: nowrap; align-items: flex-start; justify-content: center;
width: 900px; height: auto; padding-top: 20px; border-top: 1px solid  #646464;}
.four {width: 25%; margin: 8px;  justify-content: center;}
.reviewtitle {font-size: 17px; text-align: left; margin-bottom: 3px; color: #D29700; font-weight: 600;}
.reviewtext {font-size: 12px; text-align: left; margin-bottom: 5px;}
.review-venue {font-size: 12px; text-align: left; margin-bottom: 5px; color:antiquewhite;}
.reviewer {font-size: 10px; text-align: left; margin-bottom: 25px; line-height: 110%; color:antiquewhite;}

.cv-text {font-size: 12px; text-align: left; margin-bottom: 5px; line-height: 130%;}




#slideshow { 
    margin: 50px auto; 
    position: relative; 
    width: 1000px; 
    height: 660px; 
 
}

#slideshow > div { 
    position: absolute; 
    top: 0px; 
    left: 10px; 
    right: 10px; 
    bottom: 10px; 
}

    
/*slide animation-----------------------------------*/
    * {box-sizing: border-box;}
    .mySlides {display: none;}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1s;
  animation-name: fade;
  animation-duration: 1s;
}

@-webkit-keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}


#viewerX
{text-align:center;
width: 1000px; height: auto;
}


#viewerX .-slideswrap
{
width:100%; height: auto;
text-align: center;
position: fixed;
	top: 200px;}

#viewerX .-output
{
border:0;
margin:0;
padding:0;
z-index:1;
font-family:'Raleway', Arial,sans-serif;
}

#viewerX .-output_2
{
font-size:16px;
color: #c8e5d5;
position: absolute; top: 700px; }




#viewerX .-dotswrap
{
position: center;
left:0px;
top:0px;
white-space:nowrap;
text-align:center;
z-index:2000;
border: 0; margin:0; padding:0; }

#viewerX .-dot
{
width:5px;
height:5px;
border-radius:2px;
padding:0;
margin:0 8px 0 0;
display:inline-block;
cursor:pointer !important;
border-color:#1bffff;background-color:#1bffff;}

#viewerX .-dot:hover { background-color:#cd0027; }

#viewerX .-dot.-on { background-color:#c8e5d5; }

#viewerX .-link {

border:19px black solid !important;
padding:0 !important;
overflow:hidden !important;
width:1000px !important;
height:660px !important;
position: absolute !important;
left:0;
top:0;
visibility:hidden; }

#viewerX .-slideimg {
border: 0px none !important;
padding:0 !important;
position: absolute !important;
height:300px; }


    
    /*divs-----------------------------------*/