@import 'https://fonts.googleapis.com/css?family=Gochi+Hand';

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

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


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

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

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

@font-face {
  font-family: 'UniversLTStd-Light';
  src: url('../fonts/UniversLTStd-Light.eot?#iefix') format('embedded-opentype'),  url('../fonts/UniversLTStd-Light.otf')  format('opentype'),
	     url('../fonts/UniversLTStd-Light.woff') format('woff'), url('../fonts/UniversLTStd-Light.ttf')  format('truetype'), url('../fonts/UniversLTStd-Light.svg#UniversLTStd-Light') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'UniversLTStd-BlackEx';
  src: url('../fonts/UniversLTStd-BlackEx.eot?#iefix') format('embedded-opentype'),  url('../fonts/UniversLTStd-BlackEx.otf')  format('opentype'),
	     url('../fonts/UniversLTStd-BlackEx.woff') format('woff'), url('../fonts/UniversLTStd-BlackEx.ttf')  format('truetype'), url('../fonts/UniversLTStd-BlackEx.svg#UniversLTStd-BlackEx') format('svg');
  font-weight: normal;
  font-style: normal;
}




html, body {
	margin: 0;
	padding: 0;
	background-image: url('../img/background.png');
	background-position: 2218px 0px;
	background-position: center -87px;
	min-width: 1000px;
	background-repeat:no-repeat;

}
.wrap {
	width: 975px;
	margin: 0 auto;
}

/* ------------------------ MENU ------------------------ */

/* MENU DIV */
.menu {
	width: 220px;
	min-height: 250px;
	max-height:250px;
	background-image:url('../img/menu.png');
	opacity:0.85;
	padding-bottom: 250px;
	font-family: 'UniversLT-Black';
	float:left;
	position: absolute;
	z-index:10;
}

/* MENU LINKS */
.menu ul li a {
	color:#FFFFFF;
	margin-left:-20px;
	cursor:pointer;
	font-size: small;
	text-transform: uppercase;
	text-decoration:none;
	margin-left:0px;
	line-height: 36px;
}

.menu ul li {
	border-bottom:1px solid #4d88fe;
	line-height: 36px;
}

.menu ul {
	list-style-type: none;
	padding-left:0px;
	width:180px;
	margin-left:20px;
}

/* SUBMENU Voor wie */

.menu ul li ul a li p {
	background-color:#FFFFFF;
	color:#013194;
	font-size: 12.5px;
	cursor:pointer;
	text-decoration:none; 
	margin-left:10px;
	border:none;
	line-height: 36px;
	
}

.menu ul li ul li {
	background-color:#FFFFFF;
	margin-bottom: 0px;
}

.menu ul li ul li p {
	margin-top: 0px;
	margin-bottom: 0px;
	text-transform: none;
	line-height: 32px; 
	/* position: absolute;  */
	z-index: 2;

}

.menu ul li ul {
	padding-right:20px;
	padding-left:20px;
	width:100%;
	font-family: 'UniversCE-Medium';
	text-decoration:none;
	margin-left:-20px;

}

/* Menu hoek onderaan */
#menuslice {
	background-image:url('../img/menu-slice.png');
	width:220px;
	height:334px;
	margin-top:500px;
	opacity:0.85;
	position: absolute;
	float:left;
}

#menuslice input {
	font-family: 'UniversCE-Medium';
	margin-left:20px;
	background-color:rgba(0, 0, 0, 0);
    color:#FFFFFF;
    border: none;
    outline:none;
    border-bottom:1px solid #4d88fe;
    width:165px;
}

.zoek-icoon {
	height:25px;
	width:22,86px;
}

.kruisje {
	background-size: inherit;
	float: right;
	position: inherit;
	width: 20px;
	height: 20px;
	clear:both;
	cursor:pointer;
	margin-right:-10px;
}

.kruisje h1 {
	position: inherit;
	color:#FFFFFF;
	margin:0px;
	font-size: medium;
}

/* ------------------------ EIND MENU ------------------------ */

/* ------------------------ CONTACTINFO ------------------------ */

.contactinfo {
	position: absolute;
	margin-top: 870px;
}

.contactinfo h1 {
	font-size: small;
	color: #8b8d8e;
	font-family: 'UniversLT';
}

.contactinfo p {
	font-family: 'UniversLTStd-Light';
	font-size: small;
	color: #8b8d8e;
}

.contactinfo p b {
	color: #5b5b5b;
	font-family: 'UniversLTStd-Light';
	font-size: small;
}

.contactinfo p a {
	text-decoration: none;
	font-size: small;
}

/*.logo-bg {
	width:auto;
	height:auto;
	position: relative;
	float:left;
}*/

/* ------------------------ EIND CONTACTINFO ------------------------ */

/* ------------------------ HEADER ------------------------ */

.taal-slice {
	background-image:url('../img/taal-slice.png');
	width:330px;
	height:39px;
	margin-left:645px;
	opacity:0.85;
	float:left;
	position: absolute;
	background-repeat: no-repeat;
}

.taal-icons {
	width: 134px;
    height: 20px;
    background-color: #013194;
    position: inherit;
    margin-left: 50px;
    margin-top: -5px;

}

.taal-slice p {
	font-family: 'UniversCE-Medium';
	color:#FFFFFF;
	margin-top:0px;
	margin-left:50px;
	margin-top:8px;
	font-size:x-small;
	cursor:pointer;
}

.taal-icons p {
	margin-left:23px;
}

.taal-icons p a {
	color:#FFFFFF;
	font-size:x-small;
	text-decoration: none;
	margin-left:10px;
}

.taal-icons p a img {
	margin-top:-5px;
}

.telefoon {
	font-family: 'UniversLTStd';
	float:left;
	margin-left:245px;
	margin-top:10px;
}

.telefoon p {
	color:#FFFFFF;
	margin-left:30px;
}

.telefoon-icoon {
	position:absolute;
	margin-top:17px;
}

.telefoon-icoon2 {
	background-image:url('../img/telefoon-icoon1.png');
	position:inherit;
	float:left;
	width:18px;
	height:18px;
	margin-left:-4px;
	padding-left:9px;
}

.qoute {
	margin-left:250px;
	position:absolute;
	margin-top:50px;
}

.qoute p {
	font-family: 'Gochi Hand', cursive;
	color:#FFFFFF;
	line-height:20px;
	font-size:25px;
}

/* ------------------------ EIND HEADER ------------------------ */

/* ------------------------ LOGO ------------------------ */

.logo_sanger {
	background-image:url('../img/logo_sanger.jpg');
	width:246px;
	height:60px;
	margin-left:700px;
	float:left;
	cursor:pointer;
}

/* ------------------------ EIND LOGO ------------------------ */

/* ------------------------ CONTENT ------------------------ */

.content {
	background-color:#FFFFFF;
	width:700px;
	/* min-height:1200px; */
	height:100%;
	float:left;
	margin-left:244px;
	margin-top:25px;
	/* border:1px solid #013ca4; */
	border-bottom:none;
}

.leesmeer {
	width:125px;
	height:50px;
	background-color:#01369d;
	position: inherit;
	margin-top: -25px;
	float:right;
	margin-right: 50px;
	cursor:pointer;
}

.leesmeer p {
	color:#FFFFFF;
	text-align:center !important;
	font-family: 'UniversLT-Black' !important;
	margin-top:13px !important;
	margin-bottom:0px !important;
	font-size: small;
	text-transform: uppercase;
}

#tekst-boven {
	width:610px;
	background-color:#FFFFFF;
	padding: 45px;
}

#tekst-boven img {
	width:100%;
}

#tekst-boven blockquote {
	font-family: 'UniversCE-Light';	
	font-style: italic;
}

#tekst-boven ul li {
	font-family: 'UniversCE-Light';	
	text-align: justify;
}

#tekst-boven h1 {
	font-family: 'UniversLT-Black';
	color:#013194;
	font-size:22px;
}

#tekst-boven h2 {
	font-family: 'UniversLT-Black';
	color:#013194;
	font-size:20px;
}

#tekst-boven h3 {
	font-family: 'UniversLT-Black';
	color:#013194;
	font-size:18px;
}

#tekst-boven h4 {
	font-family: 'UniversLT-Black';
	color:#013194;
	font-size:16px;
}

#tekst-boven p {
	font-family: 'UniversCE-Light';	
	text-align: justify;
}

#tekst-boven ol {
	font-family: 'UniversCE-Light';	
	text-align: justify;
}

#actuele-projecten {
	width: 700px;
	height: 60px;
	background-color: #e2e8f4;
}

#actuele-projecten h1 {
	font-family: 'UniversLT-Black';
	color:#013194;
	font-size:18px;
	margin-left:30px;
	margin-top:20px;
	position:absolute;
}

#project {
	width:660px;
	height:300px;
	overflow: hidden;
	position: relative;
	margin-left:20px;
	margin-top:20px;
}

#project-oogkliniek {
	background-image:url('../img/Project-Oogkliniek.jpg');
	background-position: 50 -70px;
	width:700px;
	height:300px;
	position:absolute;
	margin-top:340px;
}

.project-slice {
	background-image:url('../img/project-slice.png');
	width:700px;
	height:50px;
	bottom:0px;
	position: absolute;

}

.project-slice p {
	color:#FFFFFF;
	font-family: 'UniversCE-Medium';
	text-align: center;
	margin-top: 12px;
	font-size: large;
}

.fotos {
	width:226px;
	height:100%;
	overflow:hidden;
	position:relative;
	clear:both;
	float:right;
	margin-right:-45px;
	margin-left:45px;
	margin-top:10px;
	margin-right:-25px;
}

.show_all {
	font-family: 'UniversLT-Black';
	font-size:22px;
	text-align: center;
	margin-top:20px;
	text-transform: uppercase;
}

.show_all p {
	cursor: pointer;
	/*color:#FFFFFF;*/
}

/* ------------------------ EIND CONTENT ------------------------ */

/* ------------------------ FOOTER ------------------------ */

.footer {
	width:700px;
	height:100%;
}

.footer-slogan {
	background-image: url('../img/footer_slogan.png');
	width: 500px;
	height: 50px;
	margin-left:100px; 
	padding-bottom:35px;
	background-repeat: no-repeat;
}

.footer-content ul {
    display:inline;
    float:left;
	list-style-type:none;
	width:600px;
	text-align: center;
	padding-left:0px;
	border-top:solid 1px #dddddd;
	padding-top:20px;
	padding-bottom:20px;
	margin-left:50px;
}

.footer-content ul li {
	display: inline-block;
	margin-right:20px;
	color:#8d8e8e;
	font-family: 'UniversLTStd-Light';
	font-size:small;
}

.footer-content ul li a {
	font-size:small;
	color:#8d8e8e;
	text-decoration: none;
}

.footer-content ul li a:hover {
	font-size:small;
	color:#000000;
	text-decoration: none;
}

form {
	height:300px;
}


/* ------------------------ EIND FOOTER ------------------------ */

/* ------------------------ Basis Stijl Elementen ------------------------ */

.clearBoth 					{ clear:both; }
img 							{ border: 0px; }

h1, h2, h3, h4, h5			{ color: #000000; }
h1							{ font-size: 26px; }
h2							{ font-size: 24px; }
h3							{ font-size: 22px; }
h4							{ font-size: 20px; }

p, ul, li, tr, td, li, ol, a, label		{ color: #000000; font-size: 16px; line-height: 26px; font-weight: normal; font-style: normal; }
strong 						{ font-weight: bold; }



a 							{ text-decoration: underline; color: #000000; }
a:active 					{ text-decoration: underline; color: #000000; }
a:link 						{ text-decoration: underline; color: #000000; }
a:visited 					{ text-decoration: underline; color: #000000; }
a:hover 						{ text-decoration: underline; cursor: pointer;  }


/* contactform */
.contact_fout 				{ color: red; }
.contact_row				{ margin-bottom: 10px; margin-top:10px; font-family: 'UniversCE-Light'; width:100%;}
.contact_row input, 
.contact_row textarea 			{ font-family: Arial, Helvetica; float:right;}
.contact_row input[type=text]	{ width: 220px; }
.contact_row textarea 			{ width: 218px; height: 150px; }


.submitknop {
	width:125px;
	height:50px;
	background-color:#01369d;
	position: inherit;
	float:left;
	cursor:pointer;
	margin-top:70px;
}

.submitknop p {
	color:#FFFFFF;
	text-align:center !important;
	font-family: 'UniversLT-Black' !important;
	margin-top:13px !important;
	margin-bottom:0px !important;
	font-size: small;
	text-transform: uppercase;
}

/* -------------------------------- COPYRIGHT ALL-IN-MEDIA 2013 --------------------------------- */


.social-icons {
	margin-top:20px;
}
.social-icons i {
	font-size:40px;
	margin: 0 5px;
}

.social-icons a{
	text-decoration: none;
}

@media screen and (min-width: 800px){
	.social-icons i{
		color: white; 
	}
}