*{
 padding:0;
 margin:0;
 }

body{
padding-top:100px;
}
 
 /*###############################
 ########## NAVIGATION ###########
 ###############################*/
 
 .logo{
 width:25%;
 }
 
 #nav_container{
 width: 100%;
 padding: 20px 0;
 position:fixed;
margin-top:-100px;
 }
 
 #nav_links{
 width: 100%;
 text-align:center;
 padding-top:5px;
 font-family:'Raleway', sans-serif;
 font-size: 20pt;
 letter-spacing: 2px;
 }
 
 ul#navlist{
 list-style-type: none;
 }
 
 ul#navlist li{
 display:inline;
 margin-right:30px;
 }
 
 ul#navlist a{
 margin-right:30px; }
 
 ul#navlist li:last-child{
 margin-right:0px;}
 
 /*###############################
 ########### SPOTLIGHT ###########
 ###############################*/
 
 #spotlight{
 width:100%;
 /*height:100vh;*/
 background-image:url("../images/portfolio/spotlight.jpg");
 background-size:100%;
 background-position: -25px 20px;
 background-attachment:fixed;
 }
 
 /*###############################
 ############ ABOUT ##############
 ###############################*/
 
 #about{
 width:100%;
  }
  
 #about img{
 width:100%;
 }
 
 /*###############################
 ############ GALLERY ############
 ###############################*/
 
 #gallery{
 width:100%;
 }
 
 #gallery img{
 width:100%; 
 margin-bottom:-30px;
 }
 
 /*###############################
 ########### CATEGORIES ##########
 ###############################*/
 
 #categories{
 width:100%;
 }
 
 #categories img{
 width:100%;
 margin-bottom:50px;
 }
 
 /*###############################
 ############ CONTACT ############
 ###############################*/
 
 #contact{
 width:100%;
 } 
 
 input:first-child{
 margin-top:100px;
}

 input, .input{
 font-family: 'Montserrat', sans-serif;
 font-size: 34pt;
 color: #333;
 padding: 10px 10px;
 margin-bottom: 15px;
 background-color: #efefef;
 border:0;
 border-bottom: 2px solid #ccc;
 width: 90%;
 }
 
 .button{
 border:5px solid #ccc;
 background-color:#999;
 }
 
 .button:HOVER{
 background-color:#fff;
 color:#000;
 cursor:pointer;
 }
 
 input:focus, .input:focus{
 outline:0;
 }
  
 /*###############################
 ############# FOOTER ############ 
 ###############################*/
 
 #footer{
 width: 100%;
 padding: 10px 0;
 }
  
 /*###############################
 ############# FONTS #############
 ###############################*/
 
 h1{
 font-family: 'Raleway', sans-serif;
 font-size: 32pt;
 letter-spacing: 3px;
 font-weight:lighter;
 margin-bottom: 40px;
 }

h2{
  font-family: 'Montserrat', sans-serif;
  font-size: 34pt;
  font-weight: lighter;
  }
 
 p1{
 font-family: 'Montserrat', sans-serif;
 font-size: 30pt;
 font-weight:lighter;
 line-height:3em;
 }
 
 p2{
 font-family: 'Montserrat', sans-serif;
 font-size:8pt;
 font-weight:lighter;
 color: #999;
 }
 
 .sm-text p1{
 font-size:10pt;
 line-height:2em;
 }
 
 /*###############################
 ############ FORMAT #############
 ###############################*/
 
 .clearfix{
 clear:both;
 }
 
 .pad-md{
 padding: 100px 0;
 }
 
 .no-pad-btm{
 padding-bottom:0;
 }
 
/*
 .extra-pad-top{
 padding-top: 200px;
 }
*/

 .mobile-pad{
 padding:0 30px;
 width:100%;
 }
 
 .container{
 width: 100%;
 margin: 0 auto;
 }
 
 #gallery .container{
 overflow:hidden;
 }
 
 .col18{
 width: 40%;
 padding-right:5%;
 padding-left:5%;
 float:left;
 text-align:center;
 }

.col18:last-child{
 padding-right:0;
 }
 
 .col30{
 width:100%;
 float:left;
 }
 
 .col33{
 width:100%;
 float:left;
 }
 
 .col40{
 width:100%;
 float:left;
 }
 
 .col50{
 width:100%;
 float:left;
 }
 
 .col60{
 width:100%;
 float:left;
 }
 
 .col70{
 width:100%;
 float:left;
 }
  
 /*###############################
 ############ THEMES #############
 ###############################*/
 
 .blackbg{
 background-color: #000;
 }
 
 .darkgraybg{
 background-color:#F2F2F2;
 }
 
 .whitebg{
 background-color: #fff;
 }
 
 .whitetxt{
 color: #fff;
 }
 
 .blackbg a{
 text-decoration:none;
 color: #ccc;
 }
 
 .darkgraybg a{
 text-decoration: none;
 color: #333;
 font-size: 10pt;
 }
 
 .blackbg a:HOVER{
 color:#fff;
 }
 
 .darkgraybg a:HOVER{
 text-decoration:underline;
 }