@charset "utf-8";

/*------------------------------------------------------



Theme Name: Studio 8 - version 1.0

Type: Core css



CSS overview: 



	1. Resets

	2. Backgorund

	3. Main Elements

		i.gobal wrapper

		ii.sidebar +content

	4. Menu

	5. Page elements

		i.cols

		ii.team list

		iii. portfolio

		iv.blog

		v.form

		vi.button

		vii.pagination

	6. Hover containers

	7. Footer

	8. Links

	9. Typography

		



---------------------------------------------------------*/



/*--------------------------------------------------------

	1.RESETS

--------------------------------------------------------*/



	*{margin:0px;padding:0px;}

	html, body, div, h1, h2, h3, ul, ol, li, dt, p, table, th, td ,img{ margin: 0; padding: 0;border:none }



/*--------------------------------------------------------

	2.BACKGROUND

--------------------------------------------------------*/





	html,body{width:100%;height:100%; overflow:hidden;}

	body{background:#000;}





/*--------------------------------------------------------

	3.MAIN ELEMENTS

--------------------------------------------------------*/



	/*i.---global wrapper*/

	#wrapper{width:100%; height:100%; overflow:auto;}

	

	/*ii.---sidebar + main content*/

	#sideBar{width:180px;height:auto;overflow:hidden; position:fixed; z-index:10;left:20px; top:0; margin-right:20px;}

	#sideBar #inner{width:180px; height:auto; overflow:hidden;}

	#sideBar #logo{width:130px; height:auto; margin:50px auto 0 auto;}

	#sideBar #close-but{width:180px; height:41px; margin:auto;text-align:center; padding-top:0px; cursor:pointer; position:relative;}

	#sideBar #close-but div{padding-top:4px;}

	#content-wrapper{ position:relative; width:560px; height:auto; overflow:hidden;left:220px; margin-top:40px;}

	.content{width:500px; height:auto; overflow:hidden; margin:30px auto 20px auto;}

	#launch-but{width:110px;height:110px;position:absolute; left:52.5px;top:0px;cursor:pointer;}

	#launch-but #circle{ position:absolute;width:80px; height:80px;top:50%;left:50%;margin:-40px 0 0 -40px;-webkit-border-radius: 80px;-moz-border-radius: 80px; border-radius: 80px;}

	#launch-but #circle-overlay{ position:absolute;width:0px; height:0px;top:50%;left:50%;-webkit-border-radius: 80px;-moz-border-radius: 80px; border-radius: 80px;}

	#launch-but #label{position:relative;line-height:110px;width:100%; z-index:5;}

	



/*--------------------------------------------------------

	4.MENU

--------------------------------------------------------*/



	#navContainer{width:130px; height:auto; overflow:hidden; margin:auto;padding-top:15px;}

	#nav{float:left; width:130px; height:auto; list-style:none;}

	#nav li{width:130px;position:relative;display:block; width:100%; margin-bottom:15px; text-align:center;}

	#nav li a{height:15px;display:block;background:none;}

	/*#nav li a:hover{}*/

	/*#nav li a.active {}*/





/*--------------------------------------------------------

	5.PAGE ELEMENTS

--------------------------------------------------------*/



	/*i.---cols*/

	.colFull{width:500px; height:auto; float:left;}

	.colHalf{width:230px; height:auto; float:left;}

	.colThird{width:140px; height:auto; float:left;}

	

	.colFull p {clear:both;margin-bottom:15px; color:#999999;}

	.colFull ul{font-family:Arial, Helvetica, sans-serif; font-size:14px; line-height:18px; text-align:left; color:#999999; list-style-type:default; list-style-position: inside; padding-left:15px; margin-bottom:10px; }



	/*ii.---team list*/

	ul.listStyle{width:500px; list-style:none; float:left;}

	ul.listStyle li{width:500px;padding-bottom:15px; margin-bottom:15px; float:left; }

	ul.listStyle li p img{float:left; margin-right:20px;}

	ul.listStyle li p{float:left;text-align:left;}

	ul.listStyle li p span.title{padding:5px;}

	

	/*iii.---portfolio*/

	.thumb_holder{width:160px; height:100px; float:left; cursor:pointer; margin-bottom:10px;background-color:#FFFFFF;}

	._logoThumb{width:160px; height:100px;position:absolute;border:none;z-index:3; background:url(../images/black/logo_hover.png) 0 -160px no-repeat;}

	._videoThumb{width:160px; height:100px; position:absolute;z-index:5;}

	._thumb-ind{width:40px; height:40px;position:absolute; z-index:4; margin:60px 0 0 120px;}

	

	/*iv.---blog*/

	.post{width:500px;padding-bottom:30px; margin-bottom:30px; float:left;}

	.post .entrySpec{width:auto; float:left; margin-bottom:15px;}

	.comment{width:500px; height:45px; background: url(../images/black/comments_blog.png) center center no-repeat; position:absolute; z-index:1; text-align:center;margin-top:155px;}

	.comment div{ margin-top:20px;}

	._div{width:500px; height:1px;margin:30px auto; float:left;}

	.blogImg_holder{width:500px; height:200px; float:left; cursor:pointer; margin-bottom:20px;}

	._logoBlog{width:500px; height:200px;position:absolute;border:none;z-index:3; background:url(../images/black/logo_hover2.png) 0 -160px no-repeat;}

	

	/*v.---form*/

	.field{width:233px; height:30px;border:none; padding:0 5px;margin:0 0 10px 0; }

	.field:focus{outline:none;border:none;}

	.tarea{width:233px; height:101px;border:none;  padding:8px 5px 5px 5px;float:left; text-align:justify; overflow:auto;}

	.tarea:focus{border:none; outline:none;}

	.formProgress{float:left;margin-top:25px;}

	

	/*vi.---buttons*/

	.sendForm{width:auto; height:auto; background:none;border:none; outline:none; cursor:pointer; margin-top:15px; float:right; text-align:right;padding:10px 25px;}

	.sendForm:hover{background:none;}

	.sendForm:active{outline:none;}

	

	/*vii.---pagination*/

	.ellipse{float: left;}

	.container{width:500px;float: left;margin:0px;padding:0px;}

	#folioContainer{padding-bottom:25px;}

	.page_navigation , .alt_page_navigation{ width: 500px; height:40px;   text-align: center; letter-spacing: 35px;  white-space: nowrap;  line-height: 12px;  overflow: hidden;padding-top:15px; position:absolute; bottom:45px;}

	.page_navigation a, .alt_page_navigation a{margin:2px; width:10px;height:10px;color:white;text-decoration:none;font-family: Tahoma;font-size: 12px; background:url(../images/black/page_sel.png) 0 0  no-repeat;display: inline-block; vertical-align: middle;  }

	.active_page{background:url(../images/black/page_sel.png) 0px -10px  no-repeat !important;text-decoration:none;}	

	ul.contentPaginate li{list-style:none;}



/*--------------------------------------------------------

	HOVER CONTAINERS

--------------------------------------------------------*/

	

	._rollover {position:absolute;border:none;z-index:2; opacity:0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter:alpha(opacity=0);} 

	._original{position:absolute;}



/*--------------------------------------------------------

	FOOTER

--------------------------------------------------------*/



	#footer{width:500px; height:50px; line-height:50px; border-top:1px solid #333333;margin:auto;}

	.icon_holder{width:16px; height:16px;float:right; margin-top:18px;}



/*--------------------------------------------------------

	LINKS

--------------------------------------------------------*/



	a,a:visited{text-decoration:none; outline:none; border:none;}

	a:hover{text-decoration:underline;}

	a.r-more,a:visited.r-more{text-decoration:none; outline:none; border:none; float:right;margin-top:15px;}

	a.r-more:hover{text-decoration:underline;}





/*--------------------------------------------------------

	TYPOGRAPHY

--------------------------------------------------------*/



	h1{font-family: "Bebas Neue"; font-size:130px;float:left;border-bottom:1px dotted #2f2f2f;line-height:130px; padding-top:13px; float:left;/*ie fix*/position:relative;z-index:10;width:500px;/**/}

	h2,h3,h4,h5,h6{color:#cccccc; width:100%; width:100%; font-family:Ubuntu; float:left;/*ie fix*/position:relative;z-index:11;width:500px;/**/  }

	h2{font-size:25px;margin:30px 0 30px 0;}

	h3{font-size:20px;margin:0px 0 30px 0;}

	h4{font-size:16px;font-weight:bold;margin:0px 0 5px 0;}

	p{font-family:Arial, Helvetica, sans-serif; font-size:14px; line-height:18px; float:left; text-align:left;overflow:auto;}

	p.slogan{ width:100%; font-family: Arial, Helvetica, sans-serif;  font-size:12px; margin:0px;text-transform:uppercase;text-align:center; letter-spacing:3.5px; margin-bottom:15px;}

	blockquote{width:420px;margin:30px 40px 0px 40px;background: url(../images/black/open_quote.png)0 0 no-repeat; clear: both;font-size: 15px;line-height: 20px;font-style: italic;float:left;}

	blockquote p {float:left;font-size:15px;color:#cccccc;margin-left:45px;padding-top:3px;}

	blockquote p.clientRef {float:left; font-size:11px;margin:8px 0 0 45px;}

	p.form{float:left; overflow:hidden;}


/* als */

body #controls-wrapper {
	bottom: 106px !important;
	right: 30px;
}

#social {
	position: absolute;
	bottom: 30px;
	right: 30px;
	z-index: 2;
}

#social a:hover {
	opacity: 0.8;
	filter: alpha(opacity=80);
}

h3{font-size: 24px;float:left;border-top:1px dotted #2f2f2f;line-height:130px; padding-top:30px; float:left;/*ie fix*/position:relative;z-index:10;width:500px;margin-top:15px; color:#555 !important; font-size: 20px; text-transform: uppercase; margin-bottom: 5px;/**/}

#slidecaption, #s_ind {
	-webkit-transition: all 0.15s ease-in-out;
	-moz-transition: all 0.15s ease-in-out;
	-o-transition: all 0.15s ease-in-out;
	transition: all 0.15s ease-in-out;
	cursor: pointer;
}

#slide-info:hover #slidecaption, #slide-info:hover #s_ind {
	background: #fb7118;
	color: #fff;
}

#slidecaption span {
	-webkit-transition: all 0.15s ease-in-out;
	-moz-transition: all 0.15s ease-in-out;
	-o-transition: all 0.15s ease-in-out;
	transition: all 0.15s ease-in-out;
}

#slidecaption:hover span {
	color: #fff !important;
}

#course-button-2015 {
	display: block;
	height: 200px;
	width: 200px;
	border-radius: 100px;
	position: absolute;
	top: 30px;
	right: 30px;
	color: #fff;
	background: #fb7118;
	text-align: center;
	font-size: 21.2px;
}

#course-button-2015 .shadow {
	-webkit-transition: all 0.15s ease-in-out;
	-moz-transition: all 0.15s ease-in-out;
	-o-transition: all 0.15s ease-in-out;
	transition: all 0.15s ease-in-out;
	box-shadow: 0 0 0 0 #fb7118;
	display: block;
	height: 156px;
	width: 196px;
	padding-top: 40px;
	position: absolute;
	left: 2px;
	top: 2px;
	border-radius: 98px;
}

#course-button-2015 .shadow:hover {
	box-shadow: 0 0 0 12px #fb7118, 0 0 0 2px #fb7118 inset;
}

#course-button-2015 span span {
	padding-bottom: 7px;
	display: inline-block;
	letter-spacing: -0.75px;
}

#course-button-2015 .black {
	color: #000;
	font-size: 34px;
	padding-top: 2px;
	letter-spacing: -1.5px;
}