@charset "utf-8";
/* CSS Document */
/*

                     `+@.                         +#:`                     
                   `###'                           `@@@'                   
                 ;@#@@.`                             +####`                
           `   '####@`                                :##@##.              
             .@####@                                   ,#@@###             
            +@#####                                     ;####@@.           
           #######.                                      @####@#,`         
          .#####@#                                        ######@          
          @######                                         ###@###.         
      `,  @######                                          ######'  @      
     `#: `######:                                          @#####@  @+     
     @#; ,######                                           @#####@  @#,    
    '##+ +####@#                                           +@#####  ##@    
    @##@ #######                                           :#####@ `####   
   ##### ######@                                           ;#####@ #####`  
   #####::@#####                                           #####@# ######  
  '#####@ @#####                                           @#####@.######  
  @#####@:@#####;                                          @#####,@######` 
  @#######:#####@                                         `@#####+#######: 
  ########@######                                         ######+########; 
  ###############+                                        ###############; 
  @##############@                                      `;@#####@#######@. 
  `##############;                                        @#############@  
`  #############@                                         .###########@@  `
:+  ############:                                        ` @###########+  #
+#: .#########@#                                         ` ##@########@` @#
###: '#########@  `                                      ; .##########  @@@
@##@;`#########@ `+                                    ` @ `#####@###` @###
##@##+ +#######@ ;@                                     +#  #######@`.@@###
;######,:@@####@ '#@                                   `##  ####@## +@#@###
`@@###@#@;'##### .##'        ;++@.                     #@@ '####+:#@######@
 #############@@; ###;         `;@@,      `           #### ###############+
 @@#############@`@###'            +####@@,:,        @@@#`'###############`
 `###############@`###@#           .#######@@.     .@@#@@`@##############@ 
` ###############@:;####@`          ######,  ,    '###@# @@#############@` 
   #@@#############.#@####'         #####;      .@####@.##############@#:  
    @@##############.+######'       #####+     ##@###@`###@############:   
     ;@##############;.@##@##+      ######    @###### ################`    
       `;@@############ @#####@    ,@####@   @##@@#,'#######@##@#@+,``     
      @#':..,;#@#########:@####@.  #######  @@##@#;##@#####@#+;,,,;+@.     
       #########################@+#########@#@######################,      
        +##########################################################. `     
         '######################@@@#############################@@`        
         `,###########@###############################@@########@          
            @#######@@###############################@#########;           
             :#####@# :@#############################``#######             
               +@#####  .#@@##################@@#@;```@###@@,              
                `##@###    '###################@,   ;#@@#@,                
                   :#@##,    :@##########@@##@`    ###@#`                  
                      :+@@     '#@##########.    ,@@;`                     
                          `     `@#########                                
                                ,########@@                                
                                @##########,                               
                               .@#@#######@#                               
                              `@############,                              
                              ,@############@                              
                              ##@###########@+                             
                             @#@+##########@##.                            
                            '@#@@##########`###`                           
                           +##@ ###########';@#@                           
                           :@#,.###@###@###@ @@@                           
                            #@ ###@'@######@` @@                           
                            @  ##@#,####'###+ ,:                           
                           `` ,##@# @##@,####  `                           
                           `  ###@@ ###@.####;                             
                             ;####@ @##+`#####                             
                            .###### ###: ######                            
                             #####+ @##, @####@                            
                             :####: @##. @##@@`                            
                              @###. +##  @@@#.                             
                               @##  '@#  @@#@                              
                               ,@#  :#@  @#@                               
                                ##  `#@  ;@`                               
                                 @   #@  .'                                
                                 .   @@  ``                               
                                                                                    
*/
/*css reset*/
*{
	margin:0;
	padding:0;
}


/***********background and overall font**************
*********************************************
**************************************/
body{
	color:#f0f0f0;
	font-size:100%;
		background-color:black;
background-image:
radial-gradient(white, rgba(255,255,255,.2) 2px, transparent 40px),
radial-gradient(white, rgba(255,255,255,.15) 1px, transparent 30px),
radial-gradient(white, rgba(255,255,255,.1) 2px, transparent 40px),
radial-gradient(rgba(255,255,255,.4), rgba(255,255,255,.1) 2px, transparent 30px);
background-size: 550px 550px, 350px 350px, 250px 250px, 150px 150px;
background-position: 0 0, 40px 60px, 130px 270px, 70px 100px;
}

/***************main nav bar********
****************************************/
#logo{
	padding-top: 1vw;
	padding-left: 2vw;
}
nav{
	padding-top:.8vw;
	width:40vw;
	color: #333333;
	word-spacing: 6vw; 
	position:fixed;
	left:0px;
	transition:1s;
	-webkit-transition:1s;
	-o-transition:1s;
	-moz-transition:1s;
	-ms-transition:1s;
	transition-timing-function: linear;
	background: -moz-linear-gradient(left, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 3%, rgba(0,0,0,0.94) 26%, rgba(0,0,0,0.81) 52%, rgba(0,0,0,0.44) 98%, rgba(0,0,0,0.42) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(0,0,0,1) 0%,rgba(0,0,0,1) 3%,rgba(0,0,0,0.94) 26%,rgba(0,0,0,0.81) 52%,rgba(0,0,0,0.44) 98%,rgba(0,0,0,0.42) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(0,0,0,1) 0%,rgba(0,0,0,1) 3%,rgba(0,0,0,0.94) 26%,rgba(0,0,0,0.81) 52%,rgba(0,0,0,0.44) 98%,rgba(0,0,0,0.42) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#6b000000',GradientType=1 ); /* IE6-9 */ 	
}

.slide-the-drawer{
	left:-150vw;
}
li {
	word-spacing: normal;
	font-size: 1em;
	padding-bottom: 1.5vw;
	padding-left:1.75vw;
} 

ul {
	list-style-type: none;
	margin:0;
	padding-bottom:2vw;
	padding-top:2vw;
	margin-top:2vw;
}

.topnav{
	color:#f0f0f0;
	text-decoration: none;
	font-size:2.5em;
	font-family: agency-fb-extended, sans-serif;
	font-weight: 400;
	font-style: normal;
}
button{
	font-size: 3.5em;
	margin-left:75vw;
	margin-top:1.5vw;
	color:#f0f0f0;
	background-color:transparent;
	border:none;
	vertical-align:top;
	position:fixed;
}

button:hover{
	color:#d75027
}

button:active{
	color:#d6c385
}
/**************nav links********
****************************************/
a:link{
	color:#f0f0f0;
}

/*mouse over link*/
a:hover{
	color:#d6c385;
}

/*selected link*/
a:active{
	color:#d75027;
	scale:110%;
}

/**************footer nav********
****************************************/
footer{
	width:100%;
	float:left;
	height:4vh;
}


p{	font-family: agency-fb, sans-serif;
	font-weight: 250;
	font-style: normal;
	font-size:2em;
}
article{
	text-align: center;
	line-height: 1.75em;
	margin-left:8vw;
	margin-right: 8vw;
	background: -moz-linear-gradient(top, rgba(0,0,0,0.81) 0%, rgba(0,0,0,0.81) 94%, rgba(0,0,0,0) 99%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(0,0,0,0.81) 0%,rgba(0,0,0,0.81) 94%,rgba(0,0,0,0) 99%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(0,0,0,0.81) 0%,rgba(0,0,0,0.81) 94%,rgba(0,0,0,0) 99%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cf000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */}

#backward{position:relative;
	z-index:-1;
}

.align{display: inline-block;
	float:right;
	padding-right:1vw;
	font-size:1em;
	font-family: 'Caveat', cursive;}

/****mobile****/
@media screen and (max-width:512px){
	li.mobile-smaller-text{font-size: .75em;}
	nav{width:80vw;}
	button{
	font-size: 3.5em;
	margin-left:25vw;
		margin-top:1.5vw;}
	#hamburger-icon{display:initial;}
	.slide-the-drawer{display:initial;}
	.mobile-smaller-text{display:initial;
	display:block;}
	.topnav{diaplay:initial;}
	.desktop-nav{display:none;}
	.show-desktop{display:none;}
	
}

/************tablet***/
@media screen and (min-width:513px) and (max-width:1365px){
		li.mobile-smaller-text{font-size: .9em;}
	nav{width:80vw;}
	button{
	font-size: 3.5em;
	margin-left:50vw;
		margin-top:1.5vw;}
	#hamburger-icon{display:initial;}
	.slide-the-drawer{display:initial;}
	.mobile-smaller-text{display:initial;
		display:block;
	}
	.topnav{diaplay:initial;}
	.desktop-nav{display:none;}
	.show-desktop{display:none;}
}

/************laptop and desktop***/
@media screen and (min-width:1366px){
		#hamburger-icon{display:none;}
	.slide-the-drawer{display:none;}
	.mobile-smaller-text{display:none;}
	.topnav{diaplay:none;}
	.desktop-nav{display:initial;}
	.show-desktop{display:initial;}
	.show-desktop{width:100vw;
padding-top:0;
	background:none;}

	.desktop-nav{
		display:inline-block;
	float:left;
	list-style-type:none;
	text-decoration: none;
	padding-left: 3.5vw;
	color:#f0f0f0;
	font-size:1.5em;
	font-family: agency-fb-extended, sans-serif;
	font-weight: 400;
	font-style: normal;
}

	.show-desktop{
		transform:translate(20vw,-6vw);
		-o-transform:translate(20vw,-6vw);
		-moz-transform:translate(20vw,-6vw);
		-ms-transform:translate(20vw,-6vw);
		-webkit-transform:translate(20vw,-6vw);}
	
	.desktop-nav{
	      animation: rotate-scale-up linear .5s both;
			animation-delay:.2s;
	-moz-animation: rotate-scale-up linear .5s both;
			-moz-animation-delay:.2s;
	      -o-animation: rotate-scale-up linear .5s both;
			-o-animation-delay:.2s;
	     -ms-animation: rotate-scale-up linear .5s both;
			-ms-animation-delay:.2s;
	-webkit-animation: rotate-scale-up linear .5s both;
			-webkit-animation-delay:.2s;
}
}

@-webkit-keyframes rotate-scale-up{
  0% {     
	  transform: scale(1) rotate(0);
	 	-ms-transform: scale(1) rotate(0);
    	-webkit-transform: scale(1) rotate(0);
        -moz-transform: scale(1) rotate(0);
	     -o-transform: scale(1) rotate(0);
  }
  50% {
	  transform: scale(1.25) rotate(180deg);
    -moz-transform: scale(1.25) rotate(180deg);
    -o-transform: scale(1.25) rotate(180deg);
	-webkit-transform: scale(1.25) rotate(180deg);
	-ms-transform: scale(1.25) rotate(180deg);
	
  }
  100% {
	    transform: scale(1) rotate(360deg);
	   -moz-transform: scale(1) rotate(360deg);
	   -o-transform: scale(1) rotate(360deg);
	   -webkit-transform: scale(1) rotate(360deg);
	   -ms-transform: scale(1) rotate(360deg);
  }
}