/*

Tech Layer Template

http://www.templatemo.com/preview/templatemo_375_tech_layer

*/

@font-face {font-family: "Corbel";
  src: url("fonts/corbel.eot"); /* IE9*/
  src: url("fonts/corbel.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
  url("fonts/corbel.woff2") format("woff2"), /* chrome、firefox */
  url("fonts/corbel.woff") format("woff"), /* chrome、firefox */
}
* {
	font-family: "Corbel", "Lucida Sans Unicode", "Lucida Grande", sans-serif }

body{
	margin: 0;
	padding: 0;
	color: #3c3b3b;
	font-size: 17px;
	line-height: 1.3em;
	background-color: #fff;
	background-position: center top;
	background-repeat: no-repeat
}

a, a:link, a:visited { color: #FFFFFF; font-weight: normal; text-decoration: none }

ul, li {
	padding:0;
	margin:0;
	list-style:none }

h1, h2, h3, h4, h5, h6 { color: #3c3b3b; font-weight: normal }
h1 { font-size: 36px; margin: 0 0 30px; padding: 5px 0 }
h2 { font-size: 24px; margin: 0 0 25px; padding: 5px 0 }
h3 { font-size: 20px; margin: 0 0 20px; padding: 0 }
h4 { font-size: 16px; margin: 0 0 15px; padding: 0 }
h5 { font-size: 14px; margin: 0 0 10px; padding: 0 }
h6 { font-size: 12px; margin: 0 0 5px; padding: 0; font-weight: 700 }

p { padding: 0; margin: 0 0 15px 0 }

p a, p a:link, p a:visited { color: #00CCFF; font-weight: normal; text-decoration: none }
p a:hover { color: #CC66FF; text-decoration: none }

.clear{ clear:left }

blockquote.testimonial_block { margin: 40px; background: url(images/icon_testimonial.png) left center no-repeat; padding-left: 120px }
cite { font-weight: bold; color:#fff }
cite a, cite a:link, cite a:visited { font-size: 12px; text-decoration: none; font-style: normal }
cite span { font-weight: 400; color: #ccc }

textarea,
.input_field {
	color: #b4c4e4;
	border: 1px solid #003399;
	background: #4066B2 }

.list_bullet { margin: 10px 0 10px 15px; padding: 0; list-style: none }
.list_bullet li { margin: 0 0 7px 0; padding: 0 0 0 20px; background: url(images/templatemo_list.png) no-repeat scroll 0 6px }
.list_bullet li a { color: #fff; font-weight: normal; text-decoration: none }
.list_bullet li a:hover { color: #fff }

.no_bullet { margin: 0; padding: 0; list-style: none }
.no_bullet li { margin: 0 0 20px 0; padding: 0 }
a.header { display: block; font-weight: 700 }

.half { width: 45% }

.h20 { height: 20px }
.h40 { height: 40px }

img { margin: 0; padding: 0; border: none }
.img_border { background: #4066B2; padding: 4px; border: 1px solid #003399 }
.img_nom { display: block; margin-bottom: 15px }
.img_fl { float: left; margin: 3px 15px 5px 0 }
.img_fr { float: left; margin: 3px 0 5px 15px }

.left { float: left }
.right { float: right }

#templatemo_header_wrapper {
	width: 100%;
	background: url(images/templatemo_header.png) center bottom no-repeat
}

#templatemo_header {
	width: 800px;
	margin: 0 auto;
	padding: 15px 20px 20px;
	background: url(images/templatemo-header-bg.png) no-repeat center
}

#templatemo_main_wrapper {
	width: 800px;
	height: 480px;
	margin: 0 auto;
	padding: 9px;
	background: url(images/templatemo_content_bg.png) no-repeat
}

#templatemo_main {
	width: 800px;
	height: 480px;
	overflow: hidden }

#templatemo_footer_wrapper {
	width: 100%;
	background: url(images/templatemo_footer.png) center top no-repeat
}

#templatemo_footer {
	width: 780px;
	margin: 0 auto;
	padding: 10px 20px;
	color: #333;
	text-align: center }

#templatemo_footer a {
	color: #003399 }

#templatemo_footer .attribute {
	margin: -15px 0 }

#templatemo_footer .attribute,
#templatemo_footer .attribute a {
	color: #ccc }

#templatemo_footer a:focus,
#templatemo_footer a:hover {
	color: #009933 }

#site_title { display: block; width: 300px; margin: 0 auto; text-align: center }
#site_title a { font-size: 28px; color: #003399; font-weight: 700 }

#content{
	overflow:hidden;
	width: 7000px;
	position:relative;
	height: 480px;
	background: #fff;
}

.section {
	position:relative;
	float:left;
	width: 800px;
	height: 480px;
	margin-right: 20px;
	background: #fff }

.section_with_padding {
	padding:40px;
	width: 720px;
	height: 400px }

.section a.home_btn {
	position: absolute;
	top: 20px;
	right: -1px;
	width: 52px;
	height: 45px;
	display: block;
	background: url(images/home_btn.png);
	transition: background 1s;
	text-indent: -10000px }

.section a.home_btn:hover {
	background: url(images/home_btn_hover.png) }

.section a.page_nav_btn {
	position: absolute;
	display: block;
	width: 77px;
	height: 27px;
	line-height: 27px;
	font-weight: 700;
	bottom: 20px;
	background: #4066B2;
	transition: background 0.8s;
	 border: 1px solid #003399;
	text-align: center }

.section a.page_nav_btn:focus,
.section a.page_nav_btn:hover {
	background: #009933 }

.section a.previous { left: 0; border-radius: 0 5px 5px 0; border-left: none }

.section a.next { right: 0; border-radius: 5px 0 0 5px; border-right: none }

.home_box { width: 400px; height: 480px }

.row1 { width: 400px; height: 120px }
.row2 { width: 400px; height: 360px }

#content .home_box h2 { color: #fff; font-size: 28px; margin-bottom: 10px }

.box1 { background: #003399 url(images/templatemo_01.png) scroll 20px 25px no-repeat }
.box1:hover { background-color: #fff; color: #3c3b3b }

.box2 { background: #009933 url(images/templatemo_02.png) scroll 20px 25px no-repeat }
.box2:hover { background-color: #fff; color: #3c3b3b }

.box3 { background: #4066B2 url(images/templatemo_03.png) scroll 20px 25px no-repeat }
.box3:hover { background-color: #fff; color: #3c3b3b }

.box4 { background: #40B266 url(images/templatemo_04.png) scroll 20px 25px no-repeat }
.box4:hover { background-color: #fff; color: #3c3b3b }

.box5 { background: #413959 url(images/twitter.png) scroll 18px 15px no-repeat }
.box5:hover { background-color: #fff; color: #3c3b3b }

#content .home_box .box1:hover h2,
#content .home_box .box2:hover h2,
#content .home_box .box3:hover h2,
#content .home_box .box4:hover h2 { color: #3c3b3b }

.home_box .box_with_padding { padding: 15px 15px 15px 140px }
#content .home_box h2 { color: #fff; font-size: 28px; margin-bottom: 10px }

#home_gallery {
	position: relative }

#mini_contact_form {
	padding: 15px; width: 370px }

	#mini_contact_form .input_field {
		display: block;
		margin-left: 5px;
		float: left;
		padding: 4px;
		height: 18px;
		font-size: 11px;
		margin-bottom: 5px }

	#mini_contact_form .input_field#email_small {
		width: 90% }

	#mini_contact_form .input_field#author_small {
		width: 60% }

	#mini_contact_form textarea {
		clear: both;
		width: 160px;
		height: 50px;
		padding: 5px 3%;
		font-size: 11px;
		margin: 0 3% 10px 0;
		width: 93% }

	#mini_contact_form .submit_btn {
		display: block;
		float: right;
		font-size: 11px;
		font-weight: bold;
		cursor: pointer;
		padding: 7px 5%;
		margin-right: 2% }

	#mini_contact_form .col_half { width: 185px }

.submit_btn {
	background: #003399;
	transition: background 0.8s;
	color: #fff;
	border: 1px solid #30333c }

#social_links li {
	width: auto;
	height: auto;
	padding: 0;
	background: none }
	#social_links li a {
		display: block;
		float: left;
		width: 100px;
		height: 48px;
		line-height: 48px;
		padding: 5px 0 5px 60px;
		margin-bottom: 20px;
		font-size: 14px;
		background-position: left;
		background-repeat: no-repeat
	}

	#social_links li a.facebook {
		background-image: url(images/facebook.png)
	}
	#social_links li a.flickr {
		background-image: url(images/flickr.png)
	}
	#social_links li a.skype {
		background-image: url(images/skype.png)
	}
	#social_links li a.twitter {
		background-image: url(images/twitter-2.png)
	}
	#social_links li a.vimeo {
		background-image: url(images/vimeo.png)
	}
	#social_links li a.youtube {
		background-image: url(images/youtube.png)
	}

#gallery li {
	width: auto;
	height: auto;
	float: left;
	width: 200px;
	height: 120px;
	padding: 0;
	background: none }

	#gallery li a {
		display: block }

#contact_form {
	padding: 0; width: 330px }

	#contact_form form { margin: 0px; padding: 0px }

		#contact_form form .input_field {
			color: #fff;
			width: 150px;
			padding: 4px;
			margin-bottom: 10px }

		#contact_form form label { display: block;font-size: 11px }

		#contact_form form textarea {
			color: #fff;
			clear: both;
			width: 320px;
			height: 100px;
			padding: 4px;
			margin-bottom: 10px }

		#contact_form form .submit_btn {
			font-size: 11px;
			font-weight: bold;
			cursor: pointer;
			padding: 5px 10px;
			margin: 0px;
			width: 100% }

		#mini_contact_form .submit_btn:focus,
		#mini_contact_form .submit_btn:hover,
		#contact_form form .submit_btn:focus,
		#contact_form form .submit_btn:hover {
		color: #fff;
		background: #009933 }