/*
Theme Name: Lantao
Theme URI: http://BeanThemes.com
Author: BeanThemes
Author URI: http://BeanThemes.com
Description: This theme is onepage theme for your portfolio'site or your small business'site.
Version: 0.9.9
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: one-column, two-columns, featured-images
Text Domain: lantao
*/


@font-face {
  font-family: 'boon-web';
  src:url("vendor/fonts/boon/boon-400.eot");
  src:url("vendor/fonts/boon/boon-400.eot?#iefix") format("embedded-opentype"),
      url("vendor/fonts/boon/boon-400.woff") format("woff"),
      url("vendor/fonts/boon/boon-400.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
    font-family: 'maledpan';
    src: url('vendor/fonts/maledpan/maledpan-regular-webfont.eot');
    src: url('vendor/fonts/maledpan/maledpan-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('vendor/fonts/maledpan/maledpan-regular-webfont.woff2') format('woff2'),
         url('vendor/fonts/maledpan/maledpan-regular-webfont.woff') format('woff'),
         url('vendor/fonts/maledpan/maledpan-regular-webfont.ttf') format('truetype');
    font-style: normal;
    font-weight: 500;
}


body, pre, code{
	font-family: 'boon-web', sans-serif ;
}

h1, h2, h3, h4, h5, h6, .main-navigation{
	font-family: 'maledpan';
	font-weight: 500;
}

body{
	font-size: 16px;
	color: #444;
	line-height: 1.5428;
}

h1, h2, h3, h4, h5, h6{
	margin: 0 0 10px;
	color: #485F55;
}

h1{ font-size: 2em;   }
h2{ font-size: 1.6em; }
h3{ font-size: 1.4em; }
h4{ font-size: 1.2em; }
h5{ font-size: 1.1em; }
h6{ font-size: 1em;   }	

a{
	color: #485F55;
	cursor: pointer !important;
}

a:hover{
	color: #485F55;
	opacity: 0.8;
	text-decoration: none;
}

a:active{
	opacity: 0.7;
}

#masthead .container{
	position: relative;
}

.site-header{
	position: fixed;
	top: 0;
	z-index: 1000;
	width: 100%;
	height: 56px;
	padding: 10px 0 5px;
	background-color: #485F55;
	box-shadow: 0 0 8px rgba(0, 0, 0, 0.15);
}
	#site-branding{
		height: 36px;
		overflow: hidden; 
	}
		#site-branding:hover{
			opacity: 0.8;
		}
		#site-branding img{
			margin-right: 8px;
			height: 36px; 
			width: auto;
			cursor: pointer;
		}
		.site-logo{
			float: left;
		}	
		h1.site-title{
			display: inline-block;
			margin: 1px 0 0;
			color: #EFF0EF;
			cursor: pointer;
		}	
					
	#site-navigation{
		display: none;
	}
			
	#toggle-navigation{
		background-color: #485F55;
	}
		button.menu-toggle{
			position: absolute;
			top: 4px;
			right: 10px;
			color: #EFF0EF;
			border: none;
			background: transparent;
			box-shadow: none;
			outline: none;
		}
			button.menu-toggle i{
				font-size: 26px;
			}
		#togglenav{
			display: none;
			margin: 10px 0 0;
			padding: 8px 0 10px;
			font-size: 18px;
			background: rgba(255, 255, 255, .1);
			overflow: hidden;		
		}
			#togglenav li{
				padding:  5px 0;
				text-align: center;
				white-space: nowrap;
			}
				#togglenav li a{
					display: block;
					padding:  8px 0;
					color: #EFF0EF;	 
					text-shadow: 0 0 2px rgba(0, 0, 0, 0.25);   
				}
				#togglenav li.active a{
					background: rgba(255, 255, 255, .08);
				}
							
#content{
	padding-top: 56px;
}

#primary{
	
}
	#primary .section{
		position: relative;
		padding-top: 12%;
		padding-bottom: 12%;
		min-height: 250px;
		background-size: cover;
	}
		.section .edit-link a {
			position: absolute;
			bottom: 20px;
			left: 20px;
		}	
	
#colophon{
	padding: 12px 0 9px;
	font-size: 15px;
}
	.site-footer, .site-footer a{
		color: #fefefe;
	}
	.site-footer .site-credit{
		display: none;
	}
	.site-footer .site-info{
		text-align: center;
	}
			
/** parallax **/	
body .parallax-mirror{
	min-width: 1600px;
}

@media (min-width:784px) {

	.container{width:750px;}
	
	.site-footer .site-credit{
		display: block;
	}
	.site-footer .site-info{
		text-align: right;
	}
		
}

@media (min-width:992px){

	.container{width:970px;}
	
	.site-header{
		height: 64px;
		padding: 0;
		overflow: hidden;
	}	
		#site-branding{
			float: left;
			width: 25%;
			padding-top: 13px;
			height: 49px;
		}
		#site-navigation{
			display: block;
			float: right;
			width: 75%;
			font-size: 19px;
		}
			ul.mainnav{
				float: right;
				margin-bottom: 0;
			}
			#site-navigation li{
				float: left;
				list-style: none;
			}
				#site-navigation li a{
					display: block;
					padding: 19px 25px 16px;
					color: #EFF0EF;	    
				}
				#site-navigation li.active a{
					background: rgba(255, 255, 255, .08);
				}
			#toggle-navigation {
				display: none;
			}
			
	#content{
		padding-top: 64px;
	}	
	#primary .section{
		min-height: 460px;
	}
	
}

@media (min-width:1200px){

	.container{width:1170px;}	
	
	#primary .section{
		min-height: 540px;
	}	
		
}