html {
    position: relative;
    width: 100%;
    height: 100%;
    background: url(../images/body.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

body {
    background:#fff;
    float:left;
    font-family: MyriadPro;
}
#wrapper{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}

#pageContainer {
    position: relative;
    padding: 0;
    min-height: 100%;
    margin-top:-150px;/*SAME AS FOOTER*/
    padding-top:150px;/*SAME AS FOOTER*/
}

@font-face { font-family: MyriadPro; src: url(../fonts/MyriadPro-Regular.otf);}

/********************************/
/**************Divs**************/
/********************************/
header{
    float:left;
    width:100%;
    padding:50px 0;
}

.container{
    max-width:1400px;
    width:100%;
}

.contentItem{
    margin-bottom:30px;
}

.contentItemInner{
    background:#80a3b7;
    text-align:Center;
    position: relative;
    overflow:hidden;
    
	-moz-transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.contentItem:hover .contentItemInner{
    background:#ef3e34;
    /*-moz-transform: rotate(4deg);
	-webkit-transform: rotate(4deg);
	-o-transform:rotate(4deg);
	transform: rotate(4deg);*/
}

.contentItemInner:before{
    content:'';
    padding-top:100%; /* vertical value as  100% equals width */
    float:left;
}

footer {
    position: relative;
    float:left;
    bottom: 0;
    width: 100%;
    height: 150px;;
    padding-top:25px;
    width:100%;
}

/********************************/
/**************Heads*************/
/********************************/
.contentItemInner h2 {
    position: absolute;
    top: 50%;
    margin: 0;
    height: 32px;
    margin-top: -16px;
    padding: 0 10px;
    width: 100%;
    text-align: center;
    text-transform: uppercase;
    font-weight:bold;
    font-size:28px;
    word-break: break-all;
    color:#fff;
}

.contentBlock h2{
    color:#80a3b7;
    text-transform: uppercase;
}
/********************************/
/**************Images************/
/********************************/
a.logo img{
    max-width:100%;
}

#logo img{
    width:100%;
}

/********************************/
/************Paragraphs**********/
/********************************/
p{
    font-size:17px;
    line-height:25px;
    color:#555;
}

#footerInner p{
    color:#fff;
    width:auto;
    float:none;
    margin:0 auto;
    padding:5px 8px;
    background:#ef3e34;
    background:rgba(239,62,52,0.8);
    text-align: center;
    text-transform: uppercase;
}

#footerInner a{
    color:#fff;
}

/********************************/
/**************Links*************/
/********************************/



/********************************/
/********Mobiel portret**********/
/********************************/
@media only screen and (max-width: 479px) {
}


/********************************/
/******Mobiel landscape + portret*********/
/********************************/
@media only screen and (max-width : 767px) {
    .contentItemInner h2{font-size:24px;}
}


/********************************/
/************Tablet**************/
/********************************/
@media only screen and (min-width : 768px) and (max-width : 991px) {
}


/********************************/
/********Tablet Landscape********/
/********************************/
@media only screen and (min-width : 1024px) and (max-width : 1050px) {  
}


@media only screen and (min-width : 992px) and (max-width : 1199px) {
}

@media only screen and (min-width : 992px){
}
