body {
	margin:0;
	padding:0;
}

.container {
	width:100%;
	font-family:Helvetica;
}

#content, div.errors {
	margin-top:10%;
}

#content ol {
	display:inline;
	float:left;
	max-width:500px;
}

#content ol li {
	margin-right:30px;
	margin-bottom:30px;
	float:left;
}

#results {
	clear:both;
}

nav {
	width:100%;
	background-color:#000;
	position:fixed;
	font-size:1.4em;
	z-index: 100;
	top:0%;
}
nav ul {
	margin-left:15%;
}

nav ul li.admin a {
	color:#00ff00;
}

nav ul li {
	display:inline;
	margin-left:2em;
	color:#fff;
}

nav ul li a {
	color:#fff;
	text-decoration: none;
}
#header {
	width:100%;
	height:92.5%;
	padding:0;
	background-image:url('../images/css/bg-2.jpg');
	background-size: 100%;
	background-repeat: no-repeat;
	z-index: 10;
}
#headerIntro {
	margin-left:22%;
	width:35%;
	margin-top:12%;
	padding:3em;
	color:#fff;
	position:absolute;
	background-color:#0d0d0d;
	opacity:0.65;
}
#message {
	position:absolute;
	margin-top:100px;
	margin-left:50px;
	width:200px;
	padding:10px;
	border:5px dashed red;
}
#headerIntro p {
	font-size:1.3em;
}
#headerIntro h1 {
	font-size:2.5em;
}
#homeContent {
	width:50%;
	left:25%;
	position:relative;
	top:100%;
}
#homeContent p {
	font-size:1.2em;
}
.adminContent, .login, #content, #bewerkenContent, .confirm {
	width:50%;
	margin-left:25%;
	margin-top:8%;
}
#footer {
	background-color:#000;
	height:50px;
	clear:both;
}
#footer span {
	float:right;
	color:#fff;
	margin-right:3%;
}
#footer a {
	color:#fff;
}
#collectieContent {
	width:94%;
	position:relative;
	margin-top:8%;
	left:3%;
}

.art-container {
	height: 5000px;
}

.schilderij, .beeld {
	float:left;
	display: inline-block;
	width: 375px;
	margin-bottom: 15px;
}

.schilderij img {
	width: 100%;
}

#filters {
	margin-top:1.5%;
	margin-bottom:1.5%;
}
#schilderijStaand, #schilderijLiggend {
	width:100%;
	position:absolute;
	top:10%;
	left:0%;
}
#schilderijStaand #schilderijBlok {
	width:75%;
	left:12.5%;
	position:relative;
}

#schilderijLiggend #schilderijBlok {
	width:50%;
	left:25%;
	position:relative;
}

#schilderijStaand #schilderijKenmerken {
	width:49%;
	left:45%;
	position:absolute;
	top:5%;
	margin-top:7%;
}
#schilderijLiggend #schilderijKenmerken {
	width:100%;
	left:12.5%;
	top:5%;
	margin-top:2%;
}
p.terug {
	float:right;
}
strong#kenmerk {
	margin-right:5%;
}
#schilderijStaand #gerelateerd {
	position:relative;
	left:12.5%;
	width:75%;
}
#schilderijLiggend #gerelateerd {
	position:relative;
	left:25%;
	width:50%;
}

#content p
{
	font-size:1.3em;
}


hr {
	width:100%;
	clear:both;
	height:5px;
	background-color:#000;
}

button {
	cursor:pointer;
	border-radius:0px;
	background-color:#000;
	color:#fff;
}
button:active {
	background-color:#ff0000;
}
form {
	line-height: 2;
}
.error {
	background-color:#ff0000;
	color:#fff;
}
.succes {
	margin-top:200px;
	background-color:#00ff00;
	color:#fff;
}

#paginering {
	float:right;
}


#menuboven #menu-icon {display: none;}

@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
	#header {
	width:100%;
	padding:0;
	position:relative;
	z-index: 10;
	background-size:initial;
}

nav ul {
	margin-left:0%;
}
}

@media screen and (max-width: 795px)
{

.container {
	width:100%;
	overflow:hidden;
}

body {
	margin:0;
}

nav {
	width:100%;
	font-size:1em;
	padding:0;
}

nav ul {
	margin-left:0;
	padding:0;
}

nav ul li {
	margin-left:1em;
}

#header {
	width:100%;
	padding:0;
	position:relative;
	z-index: 10;
	background-size:cover;
}

#headerIntro {
	margin:0;
	width:100%;
	margin-top:0%;
	padding:6em 0 2em 0;
	color:#fff;
	background-color:#000;
	opacity:0.75;
	position:relative;

}

#headerIntro p, #headerIntro h1, #headerIntro button {
	margin-left:5%;
}
#headerIntro p {
	width:90%;
}

.schilderij img {
	width:100%;
}

#collectieContent, #content {
	margin-top:20%;
}

#schilderijStaand #schilderijBlok {
	position:relative;
}

#schilderijStaand #schilderijBlok img {
	width:100%;
	clear:both;
}

#schilderijStaand #schilderijKenmerken {
	float:left;
	width:100%;
	position:relative;
	left:0%;
	margin-left:0%;
}

#schilderijStaand #gerelateerd, #schilderijLiggend #gerelateerd {
	float:left;
	position:relative;
	width:80%;
	margin-top:10%;
	top:0%;
	left:10%;
}

#schilderijLiggend #schilderijBlok {
	width:80%;
	left:10%;
	position:relative;
}

.adminContent, .login, #content, #bewerkenContent, .confirm {
	width:90%;
	margin-left:5%;
	margin-top:8%;
}

}
}
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
	#header {
	width:100%;
	padding:0;
	position:relative;
	z-index: 10;
	background-size:initial;
}
 }