/*custom fonts*/
@font-face{
    font-family:'heavydata';
    src: url('../fonts/heavy_data-webfont.woff');
}

@font-face {
    font-family: 'spin';
    src: url('../fonts/spincycle_ot-webfont.woff'); 
}

@font-face {
    font-family: 'spin3d';
    src: url('../fonts/spincycle_3d_ot-webfont.woff');
}


@font-face {
    font-family: 'caviar';
    src: url('../fonts/CaviarDreams-webfont.woff');
}

@font-face {
    font-family: 'silkscreen';
    src: url('../fonts/slkscre-webfont.woff');
}


/*styling for main HTML tag sections. Organized in the order they appear on the HTML page (header to footer)*/
body {
  
background-color: #d7d7d7;
/*
background-image: linear-gradient(90deg, rgba(255,255,255,.07) 50%, transparent 50%),
linear-gradient(90deg, rgba(255,255,255,.13) 50%, transparent 50%),
linear-gradient(90deg, transparent 50%, rgba(255,255,255,.17) 50%),
linear-gradient(90deg, transparent 50%, rgba(255,255,255,.19) 50%);
background-size: 13px, 29px, 37px, 53px;



background-attachment: fixed;*/

font-family:Verdana, Tahoma,  Geneva,  sans-serif;

}

header {
    width: 99.7%;
    height: 400px;
    padding-left: 5px;
    background-image:url("../images/headerbg.jpg");
    filter:opacity(85%);
    background-size:cover;
    background-position:right;
    background-repeat:no-repeat;
    background-color:#282828;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    overflow-y:hidden;
    
}


/*

header p {
     font-family:caviar;
    font-size:1.5em;
    margin-left:10px;
}

*/

nav {
    position:sticky;
    top:0px;
    border-bottom: solid 2px #624933;
    background-color:#41201d;
    margin-bottom:40px;
    text-align:center;
    padding-bottom:3px;
    font-size:1.2em;
    font-weight:bolder;
    vertical-align:middle;
    color:#bb9c5d;
    width:99.95%;
    z-index: 10;
}

nav a {
    
    font-family:silkscreen;
    font-weight:bolder;
    padding-left: 3px;
    padding-right: 3px;
    padding-bottom: 4px;
    color:#bb9c5d;
   
}

nav a:hover {
    text-decoration:none;
     color:#827357;
}

section {
    border:1px solid;
    border-radius:10px;
    /*background-color: #bab49d;  background-color:#112226;*/
   
    width:100%;
    margin-bottom:40px;
    vertical-align:middle;
    text-align:center;

background:
linear-gradient(27deg, #151515 5px, transparent 5px) 0 5px,
linear-gradient(207deg, #151515 5px, transparent 5px) 10px 0px,
linear-gradient(27deg, #222 5px, transparent 5px) 0px 10px,
linear-gradient(207deg, #222 5px, transparent 5px) 10px 5px,
linear-gradient(90deg, #1b1b1b 10px, transparent 10px),
linear-gradient(#1d1d1d 25%, #1a1a1a 25%, #1a1a1a 50%, transparent 50%, transparent 75%, #242424 75%, #242424);
background-color: #131313;
background-size: 20px 20px;
}



.sectionmain1 {
    height:400px;
     
}


h1 {
    /*color:#6f3568;
        text-shadow: 5px 2px 5px #777777;
    */
    font-family:heavydata;
    -webkit-text-stroke: 1px #41201d;
   color:#ffffff;
   font-size:4.5em;
   
   
}

h2 {
    font-family:heavydata;
    -webkit-text-stroke: 1px #41201d;
    font-size:3.5em;
    color:#888888;
}

footer {
    background-color:#808089;
    color: #d4d4d4;
    text-align:center;
    border: 1px solid rgba(132, 108, 91, 0.80);
    border-radius:10px; 
}

/*styling for custom sections (with associated support styles). Grouped by 
    section; alphabetized groups
*/


/*multiple assign font color*/
header p, .bounded, .overlay, .wrcontain {
    color:#6d8268;
    /*color:#b0a196; */
}

p {
    font-family:spin;
    font-size:1.2em;
}






.sectionmain2 {    
    height:550px;
    /*
    background-color: #bab49d;
    background-image:url("../images/bgimg04.png");
    background-repeat:no-repeat;
    background-position:center center;*/
}

/*styling for grid of play buttons in sectionmain2*/
.colcontain {
    width:80%;
    margin:auto;
    
}


/*creates the 3 column format*/
 [class*="colgrid"] {
    float:left;
    color:#ffffff;
    -webkit-text-stroke: 1px #523e30;
    /*font-family:gasparbold;
    font-size:2.5em;*/
    
}

.colgrid {
    width:33%;
    height:150px;
    font-size:2.5em;
    
    
}

.colgrid2 {
    vertical-align:top;
    width:49.6%;
    height:110px;
    font-size:2em;
    
}

.colgrid2a {
    vertical-align:top;
    width:99.3%;
    height:110px;
    font-size:2em;
    
}

.colgrid3 {
    
    width:33%;
    height:75px;
    font-size:1.5em;
    background-size:cover;
    
}

/*applies code to all of the playbg boxes that the share*/
[class*="colbg"] {
    background-repeat:no-repeat;
    background-position:center;
    
    text-align:center;
    background-size:cover;
    margin-right:2px;
    margin-bottom:2px;
}

a [class*="colbg"]:hover {
    background-color:#41201d;
    filter:grayscale(0%);
    
}

[class*="colbg"] {
    background-color:#ffffff;
    filter:grayscale(100%);
    
    
}

/*individual button backgrounds*/
.colbg01 {
    
    background-image:url("../images/bgimg01.jpg");
   
}

.colbg02 {
     
     background-image:url("../images/bgimg02.jpg");
     background-repeat:repeat;
     background-size:cover;
}

.colbg03 {
     
     background-image:url("../images/bgimg03.jpg");
     background-size:cover;
}

.colbg04 {
    background-image:url("../images/bgimg04.jpg");
   
}

.colbg05 {
    background-image:url("../images/bgimg05.jpg");
    background-size:cover;
}

.colbg06 {
    background-image:url("../images/bgimg06.jpg");
    background-position-y:top;
   
}

.colbg07 {
    background-image:url("../images/bgimg07.jpg");
}

.colbg08 {
    background-image:url("../images/bgimg08.jpg");
    background-size:cover;
    background-position:left;
}

.colbg09 {
    background-image:url("../images/bgimg09.jpg");
}

.colbg10 {
    background-image:url("../images/bgimg10.jpg");
    background-size:cover;
}

.colbg11 {
    background-image:url("../images/bgimg11.jpg");
    background-size:cover;
}

.colbg12 {
    background-image:url("../images/bgimg12.jpg");
    background-size:cover;
}

.colbg13 {
    background-image:url("../images/bgimg13.jpg");
    background-size:cover;
}

.colbg14 {
    background-image:url("../images/bgimg14.jpg");
}

.colbg15 {
    background-image:url("../images/bgimg15.jpg");
}

.colbg16 {
    background-image:url("../images/bgimg16.jpg");
}

.colbg17 {
    background-image:url("../images/bgimg17.jpg");
}


.sectionmain3 {
    height: 600px;
    
    
}



/*styling for button that navigates to the top of the page*/
.topnav {
    display:inline-block;
    position:fixed; /*keep the button on the page all the time*/
    bottom:10px;
    right:10px;
    color:rgba(156, 153, 141, 0.82); /*last number is the transparency index*/
    text-align:center;
    z-index: 10;
}

.topnav:hover {
    color:#5e4e3e;
}
/*add space at the bottom of the page for nav scrollilng if needed*/
.endsection:after {
    display: block; 
  content: " "; 
  height: 800px; 
  visibility: hidden; 
}

/*adaptive design code*/
/* On screens that are 992px wide or less, go from three columns to two columns*/
@media screen and (max-width: 992px) {
  .colgrid, .colgrid2, .colgrid3 {
    width: 100%;
  }
  
  .sectionmain1 {
      height:750px;
  }

  .sectionmain2 {
      height:900px;
  }

  .sectionmain3 {
      height:1400px;
  }

  .wrcontain {
      width: 100%;
  }

  
  
}



/* On screens that are 600px wide or less, make the columns stack on top of each other instead of next to each other 
@media screen and (max-width: 600px) {
  .colgrid, .colgrid2, .colgrid3 {
    width: 100%;
  }
  
  .sectionmain1 {
      height:800px;
  }

   .wrcontain {
      width: 100%;
  }
    }
    */