/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */

.container{
	padding:30px 0;
}


.block_head h1{
	font-size: 30px;
	font-weight: 300;
	color: #333;
	text-align: center;
	margin-bottom: 0;
}

.block_head hr{
	background: #333;
	width:60px;
	margin: 0 auto 20px auto;
	height:3px;	
}

.block_head.white h1{
	color:#fff;
}

.block_head.white hr{
	background:#fff;
}
header{
	background: #4d76b5;
	width:100%;
}

header .container{
	padding:20px 0;
}


header .menu{
	padding-top: 10px;
}

header .menu a{
	color:#fff;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	padding:10px;
}

header .menu a:hover {
color: #fff;
border-bottom: 3px solid #fff;
}

#intro{
	background: #557fbe;
	width:100%;
	padding:40px 0px 0px 0px;
}

#intro .intro_text h1{
	font-size: 36px;
	font-weight: 900;
	color:#fff;
}

#intro .intro_text h3{
	font-size: 18px;
	color:#fff;
}

#intro .bottom_bar{
	width:100%;
	background: #d8bb82;
	height:80px;
	margin-top: -85px;
}

#about_us{
	width:100%;
	background: #fff;
}

#about_us .intro_text{
	text-align: center;
	font-size: 16px;
}

#about_us .service{
	text-align: center;
	padding:6px;
}

#about_us .service h3{
	font-size: 18px;
	font-weight: 700;
	color:#333;
}





#selected_work_title{
	width:100%;
	background: #f8f8f8;
}

#selected_work.crtv{
	width:100%;
	background:#577db5;
}

#selected_work.crtv .container,
#selected_work.flapp .container
{
	padding: 50px 0 0;
}

#selected_work_title .container{
	padding: 10px 0 0 !important;
}

#selected_work .portfolio{
	text-align: left;
	color:#fff;
	padding-top: 20px;
}

#selected_work .portfolio h2{
	font-size: 32px;
	font-weight: 800;
	margin-bottom: 0;
	color:#fff;
}
#selected_work .portfolio h3{
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 0;
	color:#fff;
}
#selected_work .portfolio p{
	font-size: 16px;
	font-weight: 300;
	margin-bottom: 10px;
	color:#fff;
}
#selected_work .portfolio_image img{
	position: relative;
	bottom: -6px;
}

a.main{
	background-color:rgba(255,255,255,0.0);
	margin:0 0 25px 0;
	height:30px;
	width:100px;
	border:0;
	color:#fff;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	border:1px #fff solid;
		padding:5px 30px;
	text-decoration: none;
}

button,
input{
	cursor: pointer;
	-webkit-appearance: none;
}
a.main:hover{
	background: #fff;
	color:#333;
	transition-duration: 0.1s;
}
a.second{
	background-color:rgba(0,0,0,0.2);
	height:40px;
	width:140px;
	border:0;
	color:#fff;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding:10px 20px;
	text-decoration: none;
	}
a.second:hover{
	background-color:rgba(0,0,0,0.4);
}

#selected_work.flapp{
	background: #24282f;
}

#team{
	background: #f5f8f9;
}

#team .team-persoon{
position:relative;
text-align:center;
}

#team .team{
	text-align:center;	
}

#team .team-persoon h4{
font-size:18px;
font-weight:700;
}

#team .team-persoon h5{
font-size:16px;
font-weight:500;
margin-top:-10px;
font-style:italic;
}

#team .team-persoon img {
  text-align: center;
  -webkit-border-radius: 150px;
  -moz-border-radius: 150px;
  border-radius: 150px;
}

#team .team-persoon a{
	font-size: 18px;
	color:#666;
	padding: 0 2px;
}

#team .team-persoon a:hover{
	color:#333;
}


#testimonial{
	width:100%;
	background:#34495e;
	text-align: center;
	color:#fff;
	padding:20px 0;
}

#testimonial blockquote{
	color:#fff;
	font-size: 24px;
	border:none;
	font-style: inherit;
}

#testimonial blockquote i{
	font-size: 18px;
	padding: 5px;
}

#testimonial blockquote cite{
	color:#fff;
	font-size: 18px;
	font-weight: 700;
	padding-top: 10px;
	}
	
#clients{
	width:100%;
	background: #fff;
}

#clients .our_client{
	background:#333;
	text-align: center;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

#clients .our_client img{
	padding-top:8px;
}

#action{
	width:100%;
	background:#e67e22;
}

#action .text h2{
	color:#fff;
	font-size: 26px;
	margin-bottom: 0;
}

#action .action a{
	font-size: 14px;
	padding:10px 20px;
}

#action .action{
	margin-top: 10px;
}
#twitter{
	background: #00bcf5;
	width:100%;
}

#twitter .twitter-feed{
	font-size: 24px;
	color:#fff;
	text-align: center;
}

#twitter .twitter-feed h3{
	font-size: 18px;
}

#twitter .twitter-feed .timestamp{
	padding-top: 10px;
	font-size: 14px;
}

#twitter .twitter-feed a{
	text-decoration: none;
}


#price{
	width:100%;
	background: #f8f8f8;
}

#price .price_table{
	background: #fff;
	text-align: center;
	padding-bottom: 20px;
}

#price .price_table h2{
	background: #eee;
	font-size: 24px;
	margin-bottom: 0;
}

#price .price_table h3{
	background:#63d724;
	color:#fff;
}
#price .price_table a{
	margin-bottom:10px;
	background: #e67e22;
	padding:10px 30px;
}

#price .price_table a:hover{
	background: #d16e16;
}

#price .price_table.show{
	background: #eee;
}

#price .price_table.show h2{
	background:#557fbe;
	color:#fff;
}

#facebook{
	width:100%;
	background: #3B5998;
}

#facebook .fb{
	background: #fff;
}


#contact_info{
	background: #4d76b5;
	width:100%;
	text-align: center;
}

#contact_info h3 a{
	color:#fff;
	font-size: 16px;
	text-decoration: none;
}

#contact_info h3{
		line-height: 16px;
	margin-bottom: 0px;
}

/* CONTACT */

#contact-header{
	height:450px;
	background: #F6AE00 center top no-repeat;
    margin:0;
}

#contact-header .locatie{
    text-align:center;
    margin-top:0px;
    margin-left:30px;
}

#contact-header .intro{
    text-align:center;
}

#contact .intro h1{
    font-weight:700;
    font-size:34px;
    color:#fff;
}

#contact-header .intro h3{
    font-weight:300;
    font-size:16px;
    color:#fff;
    margin-top:-10px;
}
#contact{
    text-align:center;
    background:#557fbe;
}

#contact h3,
#contact_form h3{
    color:#fff;
	font-size:16px;
	font-weight:700;
}
#contact_form input, #contact textarea,
#contact_form textarea {
	padding: 15px;
	width: 90%;
	color: #999999;
    border:none;
    margin:10px;
	font-size:12px;

}
#contact_form textarea{
	height: 122px;
}

#contact-info{
	height:80px;
	color:#666666;
	background-color:#fff;
	text-align:center;
}

.split-line{
	color:#ccc;
}

.contact-informatie{
	margin:30px 0 0 0;
}

.contact-informatie li{
	display:inline;
    margin: 0 20px;
}

#contact_form{
	background:#4d76b5;
}

#contact_form .right-form input{
	background:#e67e22;
	color:#fff;
	font-size:14px;
	padding:12px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	float:right;
	width:200px;
}


#contact_form .right-form input:hover{
	background:#d16e16;

}

footer{
	background: #333;
	color:#fff;
	text-align: center;
}

footer .container{
	padding:10px;
}

footer p{
	margin-bottom: 0;
}

/* ============================
	Responsive menu
	=========================== */
	
	#res-header{ width:100%; height:3em; background: none; position: absolute; top:0; left:0; display: none;}
	#res-menu{ width:100%; height:4em; background: none; position: absolute; top:105px; left:0; display: none; z-index: 1;}
	.menu-icon{ width: 35px; height: 35px; margin: 25px; float:right; position: relative;z-index: 999;}
	.menu-icon img{width:2.4em; height:2.4em;}
	#res-menu ul{margin:0; padding:0;}
	#res-menu li{width:100%; list-style:none; height:40px; text-align: center; margin-top:-20px;}
	#res-menu a{text-decoration: none; color:#fff;}
	#res-menu p{text-align: center; color:#fff; font-family: "EdmondSans-Bold", "HelvaticaNeue", serif; padding-top:5px;}
	#res-menu li:nth-child(even){background:#537ebf;}
	#res-menu li:nth-child(odd){background:#658fcf;}
	#res-content{position: absolute; top:4em;}
	#res-content h1{font-family: Arial; font-size: 3em; text-align: center; z-index:0;}

/* #Page Styles
================================================== */

/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {
		#res-header{display:inherit;}
		header .container .menu{display: none;}
	}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {
		#selected_work .portfolio_image{
			position: absolute;
			bottom: 0px;
		}
		
		#action .text h2{
			font-size: 23px;
		}
		
		#selected_work .portfolio{
			float: right;
		}
		.container .three.columns {
				width: 120px;
				}
		#selected_work .portfolio_image img {
			width: 100%;
		}
		
		#intro .intro_text h1{
			font-size: 24px;
			line-height: 26px;
		}
		
		#intro .intro_text h3{
			font-size: 18px;
			line-height: 24px;
		}
		#intro .intro_image img{
			width: 100%;
		}
	}
		
	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
		body{
			text-align: center;
		}
		
		#intro .intro_image img{
			width: 80%;
			margin-top: 25px;
		}
		#selected_work .portfolio{
			text-align: center;
		}
		#selected_work .portfolio_image img {
			width: 90%;
		}
		#clients .our_client{
			margin-top: 10px;
		}
		#price .price_table{
			margin-top:10px;
		}
		#contact_form input, #contact textarea, #contact_form textarea{
			width:80%;
		}
		#contact_form .right-form input{
			text-align: center;
			float: center;
		}
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
	header{
		text-align: left;
	}

	}


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/