@charset "utf-8";
/* CSS Document */

body {
	background-color:#fff;
	font-family:Arial, Helvetica, sans-serif;
	color:#000;
	margin:0;
	padding:0;
}

#body {
	background-image:url("../images/background.png");
	background-repeat:repeat-x;
}
div, h1, h2, h3, h4, p, ul, li, form {
	margin:0;
	padding:0;
	font-weight:normal;
}
.clr {
	clear:both;
	height:0px;
	overflow: hidden;
}


img {
	outline:none;
	border:none;
	color:#0000;
	text-decoration:none;
}

/*wrapper*/
.wrapper{
	width:992px;
	margin:0 auto;
}

/*header*/
.header{
	border-bottom:2px solid #00aae5;
	padding-bottom:25px;
}

.header .headerTop{
	margin-bottom:50px;
}

.headerTop .headerTopLeft{
	background:url(../images/topLeft.png) no-repeat;
	height:38px;
	width:6px;
	float:left;
}

.headerTop .headerTopmid{
	background:url(../images/topMid.png) repeat-x;
	height:38px;
	width:980px;
	float:left;
	text-align:right;
}

.headerTopmid span{
	font-size:12px;
	color:#fff;
	padding:10px 30px 0 0;
	display:block;
}

.headerTop .headerTopRight{
	background:url(../images/topRight.png) no-repeat;
	height:38px;
	width:6px;
	float:right;
}

.header .logo{
	height:34px;
	width:144px;
	float:left;
	margin-left:23px;
}

.header .logo a{
	background:url(../images/petenict-logo.png) no-repeat;
	height:34px;
	width:144px;
	display:block;
	text-indent:-10000px;
}

.headerTopmid a {
	color: #FFF;
}

/*nav*/
.header .nav{
	width:595px;
	float:right;
	margin:15px 0 0 0;
}

.nav ul{
	height:14px;
}

.nav ul li{
	list-style:none;
	float:left;
	height:14px;
	margin-left:5px;
}

.nav ul li:first-child{
	margin-left:0px;
}

.nav ul li a{
	display:block;
	text-indent:-10000px;
}
/*home*/
.nav ul li.home a{
	background:url(../images/home.gif) center no-repeat;
	display:block;
	width:75px;
}

.nav ul li.home a:hover{
	border-left:1px solid #f58300;
	border-right:1px solid #f58300;
	width:73px;
}

.nav ul li.home a.active{
	border-left:1px solid #f58300;
	border-right:1px solid #f58300;
	width:73px;
}

/*over*/
.nav ul li.over a{
	background:url(../images/over.gif) center no-repeat;
	display:block;
	width:115px;
}

.nav ul li.over a:hover{
	border-left:1px solid #f58300;
	border-right:1px solid #f58300;
	width:113px;
}

.nav ul li.over a.active{
	border-left:1px solid #f58300;
	border-right:1px solid #f58300;
	width:113px;
}

a.navli {
    margin-right: 10px;
    text-decoration: none;
    font-family: Helvetica, Verdana, Arial;
    font-size: 18px;
    color: #000;
    padding: 0 10px;
    font-weight: bold;
}

a.navli:hover {
    border-left: 1px solid orange;
    border-right: 1px solid orange;
}


.over-ons {
	width: 500px;
	font-size: 12px;
	float: left;
        margin: 15px 0 0 0;
}

.location {
	width: 375px;
	float: right;
}

.mk {
	font-size:14px;
	color:#132630;
	padding:23px 10px 0 10px;
}

.social {
    float: left;
    padding: 0 25px 0 0;
}
.profiel {
	font-size:12px;
	color:#132630;
	padding:25px 10px 0 10px;
}

.technieken {
    padding: 10px 5px 0 0;
}

.me {
    float: left;
    padding: 0 20px 0 0;
}


/*diensten*/
.nav ul li.diensten a{
	background:url(../images/diensten.gif) center no-repeat;
	display:block;
	width:115px;
}

.nav ul li.diensten a:hover{
	border-left:1px solid #f58300;
	border-right:1px solid #f58300;
	width:113px;
}

.nav ul li.diensten a.active{
	border-left:1px solid #f58300;
	border-right:1px solid #f58300;
	width:113px;
}

.diensten {
	float: left;
}

.diensten .left-content {
	width: 600px;
	float: left;
}

.diensten .left-content h3 {
	padding: 15px 0 0 0;
}

.diensten img {
	float: left;
	margin: 0 15px 0 0;
}

.diensten p {
	font-size: 12px;

}

#slidingDiv {
    display: none;
	width: 600px;
	float: left;
	margin: 10px 0 15px 0;
	font-size: 12px;
}

#slidingDiv2 {
    display: none;
	width: 600px;
	float: left;
	margin: 10px 0 15px 0;
	font-size: 12px;
}

#slidingDiv3 {
    display: none;
	width: 600px;
	float: left;
	margin: 10px 0 15px 0;
	font-size: 12px;
}

#slidingDiv4 {
    display: none;
	width: 600px;
	float: left;
	margin: 10px 0 15px 0;
	font-size: 12px;
}

/*portpholio*/
.nav ul li.portpholio a{
	background:url(../images/portpholio.gif) center no-repeat;
	display:block;
	width:130px;
}

.nav ul li.portpholio a:hover{
	border-left:1px solid #f58300;
	border-right:1px solid #f58300;
	width:128px;
}

.nav ul li.portpholio a.active{
	border-left:1px solid #f58300;
	border-right:1px solid #f58300;
	width:128px;
}

.portfolio {
	float: left;
}
.portfolio p {
	width: 600px;
	font-size: 12px;
        margin: 15px 0 0 0;
}

.portfolio-pic p {
	font-size: 12px;
	text-align: center;
}


.portfolio-customer ul{
}

.portfolio-customer ul li{
	list-style:none;
	float:left;
	width:100px;
	margin-left:65px;
}

.portfolio-pic ul li:first-child{
	margin-left:0;
}

.palette {
	float: right;
}

.reveal-modal p {
    padding: 1.8em 0 0 0 !important;
    text-align: left;
}

.reveal-modal .logo {
    float: right;
    padding: 12px 0 0 12px;
    width: 100px;
    height: 100px;
}

.technique {
    float: left;
    margin: 15px;
    max-width: 125px;
}

/*contact*/
.nav ul li.contact a{
	background:url(../images/contact.gif) center no-repeat;
	display:block;
	width:110px;
}

.nav ul li.contact a:hover{
	border-left:1px solid #f58300;
	border-right:1px solid #f58300;
	width:108px;
}

.nav ul li.contact a.active{
	border-left:1px solid #f58300;
	border-right:1px solid #f58300;
	width:108px;
}

.contact-ons {
	float: left;
	width: 600px;
}

.contact-ons p {
	margin-top: 15px;
	font-size:12px;
}

.callcenter {
	float: right;
}

.adres img {
	float: left;
}

.adres p {
	margin: 20px 0 0 15px;
	float: left;
}

.telefoon {
	float: left;
}
.telefoon img {
	padding: 30px 0 0 0;
	float: left;
}

.telefoon p {
	margin: 50px 0 0 15px;
	float: left;
}

.email {
	float: left;
	margin: 0 0 0 100px;
}
.email img {
	padding: 30px 0 0 0;
	float: left;
}

.email p {
	margin: 50px 0 0 15px;
	float: left;
}

.contact-primair {
	width: 575px;
	float: left;
	font-size: 12px;
}

.name-field {
	width: 250px;
	float: left;
}

.email-field {
	margin-left: 50px;
	width: 250px;
	float: left;
}

.inputbox {
	margin: 0;
	width: 250px;	
}

.opmerkingen textarea{
	height: 175px;
	width: 550px !important;
}

.contact-secundair {
	width: 350px;
	float: right;
	font-size: 12px;
}

.verzonden {
	float: left;
}

.verzonden p {
	font-size: 12px;
}

.algemene-voorwaarden {
	font-size: 12px;
	width: 600px;
}

/*jquery*/
#gallery {
	position:relative;
	height:250px;
	float: left;
}
#gallery a {
	float:left;
	position:absolute;
}
	
#gallery a img {
	border:none;
}
	
#gallery a.show {
	z-index:500;
}

#gallery .caption {
	z-index:600; 
	background-color:#000; 
	color:#ffffff; 
	height:100px; 
	width:100%; 
	position:absolute;
	bottom:0;
}

#gallery .caption .content {
	margin:5px
}

#gallery .caption .content h3 {
	margin:0;
	padding:0;
	color:#1DCCEF;
}

/*content*/
.content{
	padding:20px 0 0 20px;
        font-size: 13px;
        min-height: 400px;
}

.content .overzicht {
    border: 1px solid #e86a20;
    border-collapse: collapse;
}

.overzicht td {
    border: 1px solid #ffc623;
    
    padding: 5px;
}

.overzicht th {
    border: 1px solid #ffc623;
    border-bottom: 3px solid #ffc623;
    padding: 5px;
}

.content .last_login {
    color: #aaa;
}

/*contentLeft*/
.content .contentTop{
}

.contentTop .banner{
	float:left;
	width:631px;
	background:url(../images/banner.gif) no-repeat;
	height:250px;
	border:1px solid #007fab;
}

.banner .boxRight{
	width:210px;
	background:#fff;
	padding:5px 10px 18px 8px;
	border-bottom:1px solid #00aae5;
	border-left:1px solid #00aae5;
	float:right;
}

.boxRight h3{
	font-size:14px;
	color:#000;
	padding-right:10px;
}

.boxRight p{
	font-size:12px;
	color:#000;
	padding-top:15px;
}

.contentTop .rightBox{
	height:248px;
	width:320px;
	float:right;
	border:1px solid #0180ab;
}

.rightBox .box{
	border-bottom:8px solid #00aae5;
	padding:2px 8px 4px;
}

.rightBox .box2{
	border-bottom:8px solid #00aae5;
	padding:2px 25px 4px;
	height: 234px;
}

.rightBox .box2 .offer {
	margin: 0;
	padding: 0;
	font-size: 16px;
	font-weight: bold;
}

.box p{
	font-size:14px;
	color:#132630;
	padding:16px 10px 0 10px; 
}

.box2 p{
	font-size:14px;
	color:#132630;
	padding:16px 10px 0 10px; 
}

.contentTop .rightBox2 {
	margin: 10px 0 0 0;
	height:235px;
	width:320px;
	float:right;
	border:1px solid #0180ab;
}

.contentTop .rightBox2 h3 {
	margin: 15px 0 10px 10px;
}

.contentTop .rightBox2 p {
	margin: 0 0 0 10px;
	font-size: 12px;
}

.contentTop .rightBox3 {
	margin: 10px 0 0 0;
	height:275px;
	width:320px;
	float:right;
	border:1px solid #0180ab;
}

.contentTop .rightBox3 h3 {
	margin: 15px 0 10px 10px;
}

.contentTop .rightBox3 p {
	margin: 0 0 0 10px;
	font-size: 12px;
}

.contentTop .rightBox3 a{
	margin: 0 0 0 10px;
	font-size: 12px;
}

a.button{
	background:url(../images/button.gif) no-repeat;
	height:38px;
	width:241px;
	display:block;
	font-size:16px;
	color:#fff;
	text-decoration:none;
	text-align:center;
	line-height:2.3em;
	margin:34px 0 0 30px;
}

#navlist { 
	list-style-image: url(../images/pi-oke.jpg); 
}

#navlist li { 
	margin: 10px 0 0 25px;
	font-size: 12px;
} 


/*contentBott*/
.contentBott{
	padding:10px 0 0 0;
}

.contentBott ul{
}

.contentBott ul li{
	list-style:none;
	float:left;
	width:260px;
	margin-left:65px;
	display: inline;
	* margin:0 63px 0 0;
}

.contentBott ul li:first-child{
	margin-left:0;
}

.contentBott ul li div h2{
}

.contentBott ul li div p{
	color:#000;
	font-size:12px;
	padding:12px 0 24px 0;
	line-height:1.4em;
}

.contentBott ul li div h3{
	color:#000;
	font-size:14px;
	font-weight: bold;
	padding:15px 0 0 0;
}

.contentBott h2 {
        padding: 0 0 10px 0;
}


/*contentBott2*/
.contentBott2{
	padding:175px 0 0 0;
}

.contentBott2 p {
    font-size: 12px;
}

.contentBott2 ul{
}

.contentBott2 ul li{
	list-style:none;
	float:left;
	width:260px;
	margin-left:65px;
	display: inline;
	* margin:0 63px 0 0;
}

.contentBott2 ul li:first-child{
	margin-left:0;
}

.contentBott2 ul li div h2{
}

.contentBott2 ul li div p{
	color:#000;
	font-size:12px;
	padding:12px 0 24px 0;
	line-height:1.4em;
}

.contentBott2 ul li div h3{
	color:#000;
	font-size:14px;
	font-weight: bold;
	padding:15px 0 0 0;
}

.contentBott2 h2 {
        padding: 0 0 10px 0;
}

a.textLink{
	display:block;
	text-align:right;
	font-size:12px;
	padding:20px 0 0 0;
}

a:hover.textLink{
	text-decoration:underline;
}

.BottomText {
	margin: 45px 0 0 27px;
	font-size: 12px;
	width: 585px;
	float: left;
}

.BottomImage {
	float: left;
	margin: 5px 0 0 0;
}

/*footer*/
.footer{
	background:#007fab url(../images/footer-bg.png) repeat-x;
	position:relative;
	width:980px;
	margin-top:130px;
	padding-bottom:25px;
}

.footerTopimage{
	position:absolute;
	top:-90px;
	right:-6px;
}

.footer ul{
	padding:24px 0 0 25px;
	padding-bottom:22px;
}

.footer ul li{
	list-style:none;
	display:inline;
	font-size:12px;
	color:#fff;
}

.footer ul li a{
	font-size:12px;
	color:#fff;
	text-decoration:none;
}

.footer ul li a:hover{
	text-decoration:underline;
}

.footer .footerLeft{
	width:115px;
	float:left;
	margin:0 0 0 25px;
}

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

.footerLeft p{
	color:#fff;
	padding-top:13px;
	font-size:12px;
}

.footer .footerRight{
	width:290px;
	float:right;
	margin:0 25px 0 0
}

.footerRight h3{
	font-size:18px;
	color:#fff;
	margin-left:3px;
}

.textInput{
	color:#000;
	font-size:12px;
	background:url(../images/textinputbg.gif) no-repeat;
	height:27px;
	width:186px;
	padding:0 8px 0 8px;
	border:none;
	font-family:Arial, Helvetica, sans-serif;
	margin-top:5px;
}


.adrInput {
        display: none;
}


.textarea{
	background:url(../images/textAreabg.gif) no-repeat;
	height:89px;
	width:262px;
	border:none;
	margin-top:10px;
	padding:6px 8px;	
}

.textareabox{
	height:82px;
	width:262px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#000;
	border:none;
	background:none;
}

.submitBott{
	background:url(../images/submitbutton.gif) no-repeat;
	height:27px;
	width:152px;
	border:none;
	cursor:pointer;
	margin-top:10px;
}



