/* ********* RESET ********* */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video{margin:0; padding:0; border:0; font:inherit; vertical-align:baseline;}
html{font-size:62.5%;}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section{display:block;}
body{line-height:1;}
ol, ul{list-style:none;}
blockquote, q{quotes:none;}
blockquote:before, blockquote:after,
q:before, q:after{content:''; content:none;}
table{border-collapse:collapse; border-spacing:0;}

img {vertical-align:bottom;} /* fix extra padding on (inline) images */

body{background:#fff; /* font-family:"Helvetica Neue", "HelveticaNeue", Helvetica, Arial, "Lucida Grande", sans-serif; */ font-family:Varela Round,arial,sans-serif; font-size:14px; line-height:20px; color:#777777; position:relative; -webkit-font-smoothing:antialiased;}


/* ********* STRUCTURE ********* */

#main-box{margin:80px; border:3px solid #ddd;}

#header{height:auto; position:relative; max-width:980px; margin:0 auto;}
	#logo{position:relative; text-align:center; margin-bottom:20px;}
		#logo img{margin-top:-74px;}
	#top-info{position:relative; color:#dddddd; text-transform:uppercase; letter-spacing:2px; font-size:12px; margin-bottom:30px;}
		#top-info .left{text-align:left;} #top-info .middle{text-align:center;} #top-info .right{text-align:right;}
	#main-nav{background:url(images/nav-line.png) top center repeat-x; position:relative; height:50px; margin-bottom:20px; z-index:99;}
		.sf-menu{margin:0; position:relative; float:right; right:50%; z-index:2;}
			.sf-menu li{list-style:none; float:left; left:50%; margin:0; padding:0; border:none; position:relative;}
			.sf-menu a{background:#fff; display:block; padding:0 25px; height:50px; line-height:50px; text-decoration:none; font-size:12px; color:#999; letter-spacing:2px; text-transform:uppercase;} /* 1st level links */
			.sf-menu a:hover{background:#f9f9f9; text-decoration:none;}
			.sf-menu li:first-child a{border-left:none;}
			.sf-sub-indicator{background:url(images/droparrow.png) top center no-repeat; display:block; width:5px; height:4px; position:absolute; right:15px; top:48%; text-indent:-999em; overflow:hidden;} /* arrow */
			a.sf-with-ul{padding-right:25px;} /* extra padding for arrow */
				.sf-menu li ul{width:330px; display:none; position:absolute; left:0; top:100%; margin:0;} /* 2nd level */
				/* .sf-menu li:hover > ul{display:block;} */
				.sf-menu li ul li{float:none; margin:0; padding:0; position:relative; left:0;}
				.sf-menu li ul li a{background:#444; border-top:thin dotted #555; border-left:none; width:300px; height:auto; display:block; float:none; color:#ccc; padding:15px 15px; font-size:13px; line-height:normal;} /* 2nd level links */
				.sf-menu li li:first-child a{border-top:none;}
				.sf-menu li ul li a:hover{background:#555;}

#featured{height:auto; position:relative; padding:20px 0;}
	/* slider */
	#main-slider{width:100% !important; max-width:940px; height:auto; margin:0 auto;}
		#main-slider img{width:100%;}
		.carousel-control{display:none;}
	
#content{padding:30px 0 60px; /* font-family:Georgia, "Times New Roman", Times, serif; */}
	/* wide */
	.wide{position:relative;}
	/* main */
	.main{position:relative; overflow:hidden;}
	/* sidebar */
	.sidebar{position:relative; padding:0 0 20px 20px; border-left:thin dotted #ccc; border-bottom:thin dotted #ccc;}
		#sidebar-buttons{}
			#sidebar-buttons a{margin-bottom:20px;}
		#sidebar-contact{padding:0 20px;}
			#sidebar-contact p{font-size:13px; line-height:24px;}
	
#footer-container{}
	#footer{position:relative; margin-bottom:40px; padding:20px 0; border-top:thin solid #ccc; border-bottom:thin solid #ccc;}
		#footer-nav{height:40px;}
			#footer-nav li{float:left;}
			#footer-nav a{display:block; padding:0 15px; height:40px; line-height:40px; text-decoration:none; font-size:12px; color:#999; letter-spacing:2px; text-transform:uppercase;}
			#footer-nav a:hover{color:#666;}
		#footer-icons{text-align:right; height:40px; margin:0;}
			#footer-icons img{padding:4px;}
			#footer-icons img:hover{opacity:.7;}
	#very-bottom{text-align:center; font-size:11px; color:#999; text-transform:uppercase; letter-spacing:2px; margin-bottom:80px;}
			#very-bottom span{display:inline-block; padding:0 10px; color:#ccc;}
	
/* ********* CUSTOM LAYOUTS ********* */

#home{margin:30px 0 60px;}

#about{}
	#about .inner{padding:0 20px;}
	#about .span6:first-child{/* border-right:thin solid #e4e4e4; */}
	.bio-photo{width:250px; display:block; margin:0 auto; margin-bottom:30px;}
	#about h4{margin-bottom:60px;}


/* ********* UI ********* */

/* 2 column */
.portfolio-detail, .col2 {
-webkit-columns: 300px 2;
-moz-columns: 300px 2;
columns: 300px 2;
}



/* portoflio listing */
.portfolio-list{}
.portfolio-list .inner{height:300px; text-align:center; margin-bottom:30px; position:relative; border-radius:8px; overflow:hidden; background:#eee;}
.portfolio-list .title{background:url(images/black80.png) repeat; display:block; text-align:center; color:#fff; font-size:18px; padding:15px 0; position:absolute; bottom:0; width:100%;}
.portfolio-list a{position:absolute; top:0; left:0; width:100%; height:100%; background:#2595ff; opacity:0;}
.portfolio-list a:hover{opacity:.4;}

/* portoflio detail */	
.portfolio-detail{}
.portfolio-detail a img{padding:5px; border:thin solid #ddd;}
.portfolio-detail a:hover img{border:thin solid #2595ff;}
.portfolio-sidebar{border:none; padding-left:0; padding-bottom:0; width:280px;}
.portfolio-sidebar.affix{position:fixed; top:60px;}




/* galleria */
#galleria, #galleria2{width:100%; max-width:100%; height:700px; margin:0 auto;}
.galleria-container{/* background:#fff; */ background:none !important; /* border:thin solid #d6d1c6; */ border:none !important; overflow:hidden;}
.galleria-stage{background:none !important;}
.galleria-thumb-nav-right:hover, .galleria-thumb-nav-left:hover{background-color:#eee !important;}
.galleria-bar{background:none !important; border:none !important;}
.galleria-play, .galleria-fullscreen{border:none !important;}

/* forms */
/* .webform{font-size:11px; margin-top:10px; width:100%;}
.webform input[type="text"] {width:100%;}
.webform label{display:inline;}
.webform input[type="radio"], input[type="checkbox"] {cursor:pointer; margin:3px 6px 3px 0;}
.webform td{border-top:thin dotted #d5d7d4;}
.webform input[type="submit"] {background:#eee; border:none; padding:20px 60px; line-height:20px;  border-radius:12px 0 12px; display:block; text-align:center; color:#444; font-size:12px; font-family:Varela Round,arial,sans-serif; letter-spacing:2px; text-transform:uppercase; display:inline-block;}
.webform input[type="submit"]:hover {background:#999; color:#fff;}
	.webform input[type="text"], .webform textarea {padding-left:0; padding-right:0;}
*/

/* forms */
.webform{margin-top:10px; width:100%; position: relative;}
.webform .inner{position:relative;}
.webform label{display:inline;}
.webform input[type="radio"], input[type="checkbox"] {cursor:pointer; margin:3px 6px 3px 0;}
.webform td{}
.webform input[type="submit"] {background:#444; display:block; width:200px; font-weight:bold; padding:20px 0; text-align:center; color:#fff; border-radius:4px; border:none; margin-top:10px;}
.webform input[type="submit"]:hover {background:#eee; color:#444;}

.webform input[type="text"], .webform textarea, .webform input[type="email"], .webform input[type="password"] {width:100%; padding:10px; background:#f5f5f5; border:thin solid #eee; border-radius:8px; color:#111;}
.webform textarea{min-height:200px;}

.webform input, .webform textarea, .webform iframe{margin-bottom:15px;}

.checkbox-list,
.radio-list{
margin: 0 0 20px;
padding: 0;
list-style: none;
}
form.webform{
margin: 0 0 40px;
}
.webform label{
font-size: 12px;
font-weight: normal;
}
.webform input[type="text"]{
display: block;
margin: 0 0 10px;
}
.webform h4{
text-align: center;
border-bottom: 2px solid #eee;
padding-bottom: 15px;
}
.webform h5{
border-top:thin dotted #ddd;
font-size: 15px;
font-weight: bold;
}
.webform select{
display: block;
width: 100%;
padding: 10px;
border: none;
background: #f5f5f5;
border-radius: 8px;
margin: 0 0 10px;
}

/* buttons */
.btn{background:#eee; border:none; padding:20px 60px; line-height:20px;  border-radius:12px 0 12px; display:block; text-align:center; color:#444; font-size:12px; font-family:Varela Round,arial,sans-serif; letter-spacing:2px; text-transform:uppercase; display:inline-block;}
	.btn:hover{background:#999; color:#fff; text-decoration:none;
	-webkit-transition: all .15s ease-in-out; -moz-transition: all .15s ease-in-out; -o-transition: all .15s ease-in-out; transition: all .15s ease-in-out;}

.btn.full, .btn.big.full, .btn.huge.full{width:100%; padding-left:0; padding-right:0;}

/* lists */
.main ul, .wide ul{list-style:circle outside; margin-bottom:18px; margin-left:30px;}
	.main li, .wide li{margin-bottom:12px;}
.main ul ul, .wide ul ul{margin:4px 0 5px 30px;}
	
/* dividers */
hr{background:#e4e4e4; border:none; display:block; height:1px; margin:40px 0 40px; padding:0; clear:both;}
.divider{background:url(images/divider-line.png) top center repeat-x, url(images/symbol.png) top center no-repeat; height:59px; max-width:940px; display:block; clear:both; margin:20px 0;}
.spacer{height:40px; display:block; clear:both;}

/* borders */
.border-top{border-top:thin dotted #ccc; padding-top:20px;}
.border-right{border-right:thin dotted #ccc; padding-right:20px;}
.border-left{border-left:thin dotted #ccc; padding-left:20px;}
.border-bottom{border-bottom:thin dotted #ccc; padding-bottom:20px;}

		
/* ********* MISC ********* */

.round-image{border-radius:999px;}

.center{text-align:center;}

.carousel-control{top:50%;}

.cufon-loading #nav a, .cufon-loading h1, .cufon-loading .font{visibility:hidden;} /* fix Cufon FUOC */

.valign {display:table; width:100%;}
.valign > div, .valign > article{display:table-cell; vertical-align:middle;}​

.full{width:100%;}

img, object, embed{max-width:100%; height:auto;}
img{-ms-interpolation-mode:bicubic;}
#map_canvas img, .map_canvas img{max-width:none !important;}

.left, .columns.left{float:left;}
.right, .columns.right{float:right;}

.aligncenter{margin-left:auto; margin-right:auto; text-align:center;}
.alignleft{margin-bottom:15px; margin-right:15px; float:left;}
.alignright{margin-bottom:15px; margin-left:15px; float:right;}

img.border{border:6px solid #e4e4e4; position:relative; left:-3px; overflow:hidden;}

.shadow{box-shadow:0 1px 3px rgba(0, 0, 0, .2);}
.rounded{border-radius:8;}

/* animate */

/* -webkit-transition: all .15s ease-in-out;
-moz-transition: all .15s ease-in-out;
-o-transition: all .15s ease-in-out;
transition: all .15s ease-in-out; */

.hide, .hidden{display:none;}
.highlight{background:#ff0;}
.disabled{cursor:auto;}

p{font-size:14px; line-height:1.6; margin:0 0 18px;}
  	
a{color:#4f478d; text-decoration:none; outline:0; line-height:inherit;}
a:hover{color:#333;}

h1, h2, h3, h4, h5, h6{color:#ddd; font-weight:normal; font-family:Varela Round,arial,sans-serif; text-transform:uppercase; letter-spacing:2px; line-height:1.6;}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a{font-weight:inherit;}

h1{font-size:16px; margin-bottom:20px;}
h2{font-size:16px;color:#707070; margin-bottom:20px;}
h3{font-size:16px; margin-bottom:20px;}
h4{font-size:12px; font-weight:normal; margin-bottom:10px;}
h5{font-size:12px; font-weight:normal; margin-bottom:10px; color:#707070;}
h6{font-size:8px; font-weight:normal;}

.subhead{color:#777; font-weight:normal; margin-bottom:20px;}

em{font-style:italic; line-height:inherit;}
strong{font-weight:bold; line-height:inherit;}
small{font-size:60%; line-height:inherit;}

abbr, acronym{text-transform:uppercase; font-size:90%; color:#222; border-bottom:1px solid #ddd; cursor:help;}
abbr{text-transform:none;}


/* ********* COLUMNS ********* */

.one-half{width:48%;}
.one-third{width:31.3%;}
.two-third{width:62.6%;}
.one-fourth{width:23%;}
.three-fourth{width:69%;}
.one-half, .one-third, .two-third, .three-fourth, .one-fourth{position:relative; margin:0 1%; float:left;}
	 
	 
/* ********* MOBILE ********* */

/* 1200px */
@media only screen and (max-width:1200px) {
	
	#main-box{margin:80px 10px; border:3px solid #ddd;}
	
	}
	
/* 980px */
@media only screen and (max-width:980px) {

	#header{height:auto; position:relative; max-width:980px; margin:0 auto;}
		#logo{position:relative; text-align:center; top:auto; left:auto; margin-top:20px;}
		#main-nav{position:relative; top:auto; right:auto;}
		#start-bar a{margin-top:20px;}
	.main{padding:0; border:none; min-height:0;}
	
	}
	
/* 767px */
@media only screen and (max-width:767px) {
	
	#header{height:auto !important; position:relative; max-width:980px; margin:0 auto;}
		#logo{position:relative; text-align:center; top:auto; left:auto; margin-top:20px;}
		#top-info{margin:0;}
			#top-info .left, #top-info .right{text-align:center;}
		#main-nav{position:relative; width:auto; padding:20px; margin:0; height:auto; top:auto; right:auto; background:none;}
		.sf-menu{float:none; right:auto;}
			.sf-menu li{float:none; left:auto; display:block;}
			.sf-menu a{background:none; border-bottom:thin dotted #ccc;}
			.sf-menu li:last-child a{border:none;}
			.sf-menu a:hover{color:#333;}
			.sf-sub-indicator{display:none;}
				.sf-menu ul ul{display:block; height:0; width:0; overflow:hidden;}
				
			.main, .wide, .sidebar{padding:0 20px;}
			
			#home{padding:0 40px;}
			
			#footer{padding:0 0 30px;}
			#footer-nav{display:none;}
			#footer-icons{text-align:center;}
			
			#very-bottom{font-size:10px;}
				
	}