@font-face {
font-family: 'Lobster', cursive, 'Gudea', sans-serif;
font-family: 'Arial', serif;
}

@media screen and (min-width: 100px){
ul{position: relative; font-size: 13px; font-family:"Arial"; line-height: 25px; list-style-type: none; margin: 5px 0px 0px 40px; color: #333;}
/*typografie*/
p{position: relative; font-size: 15px; font-family:"Arial"; line-height: 18px; padding: 10px 20px 10px 20px;}
a{position: relative; font-size: 15px; font-family:"Arial"; line-height: 18px;}
h1{position: relative; font-size: 20px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;;}
h2{position: relative; font-size: 20px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;;}
h3{position: relative; font-size: 18px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;;}
h4{position: relative; font-size: 14px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;;}
#sitenaam{font-size: 35px}
.quote{position: relative; margin: 20% 20% 0% 20%; color: #fcfcfc; text-shadow: 2px 2px #555; font-size: 30px; text-align: center;}
.squote{position: relative; width: auto; margin: 5% 20% 0% 10%; color: #fcfcfc; text-shadow: 2px 2px #555;  font-size: 30px; text-align: center;}
/*iconen naast headers*/
.h4-icoon{position: relative; float: left; margin: 15px 10px 0px 10px; width: 14px; height: 14px;}
.h2-icoon{position: relative; float: left; margin: 15px 10px 0px 10px; width: 20px; height: 20px;}
.h1-icoon{position: relative; float: left; margin: 17px 10px 0px 10px; width: 22px; height: 22px;}
#menuhuls2 a{font-size: 18px;}
}

/*media query voor: Ei-pads*/
@media screen and (min-width: 768px) {
ul{position: relative; font-size: 14px; font-family:"Arial"; line-height: 25px; list-style-type: none; margin: 5px 0px 0px 40px; color: #333;}
/*typografie*/
p{position: relative; font-size: 14px; font-family:"Arial"; line-height: 21px; padding: 10px 20px 10px 20px;}
a{position: relative; font-size: 14px; font-family:"Arial"; line-height: 21px;}
h1{position: relative; font-size: 22px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;;}
h2{position: relative; font-size: 20px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;;}
h3{position: relative; font-size: 18px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;;}
h4{position: relative; font-size: 16px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;;}
#sitenaam{font-size: 62px}
.quote{position: relative; margin: 20% 20% 0% 20%; color: #fcfcfc; text-shadow: 2px 2px #555; font-size: 42px; text-align: center;}
.squote{position: relative; width: auto; margin: 5% 20% 0% 10%; color: #fcfcfc; text-shadow: 2px 2px #555;  font-size: 42px; text-align: center;}
/*iconen naast headers*/
.h4-icoon{position: relative; float: left; margin: 15px 10px 0px 20px; width: 16px; height: 16px;}
.h2-icoon{position: relative; float: left; margin: 15px 10px 0px 20px; width: 20px; height: 20px;}
.h1-icoon{position: relative; float: left; margin: 17px 10px 0px 20px; width: 22px; height: 22px;}
#menuhuls2 a{font-size: 18px;}
}

/*media query voor: kleine schermen*/
@media screen and (min-width: 1024px) {
ul{position: relative; font-size: 16px; font-family:"Arial"; line-height: 25px; list-style-type: none; margin: 5px 0px 0px 40px; color: #333;}
/*typografie*/
p{position: relative; font-size: 16px; font-family:"Arial"; line-height: 23px; padding: 10px 20px 10px 20px;}
a{position: relative; font-size: 16px; font-family:"Arial"; line-height: 23px;}
h1{position: relative; font-size: 28px; font-family:"Delius Swash Caps"; padding: 0px 0px 5px 20px;}
h2{position: relative; font-size: 24px; font-family:"Delius Swash Caps"; padding: 0px 0px 5px 20px;}
h3{position: relative; font-size: 21px; font-family:"Delius Swash Caps"; padding: 0px 0px 5px 20px;}
h4{position: relative; font-size: 18px; font-family:"Delius Swash Caps"; padding: 0px 0px 5px 20px;}
#sitenaam{font-size: 68px}
.quote{position: relative; margin: 20% 20% 0% 20%; color: #fcfcfc; text-shadow: 2px 2px #555; font-size: 48px; text-align: center;}
.squote{position: relative; width: auto; margin: 5% 20% 0% 10%; color: #fcfcfc; text-shadow: 2px 2px #555;  font-size: 48px; text-align: center;}
/*iconen naast headers*/
.h4-icoon{position: relative; float: left; margin: 5px 10px 0px 20px; width: 18px; height: 18px;}
.h2-icoon{position: relative; float: left; margin: 7px 10px 0px 20px; width: 25px; height: 25px;}
.h1-icoon{position: relative; float: left; margin: 8px 10px 0px 20px; width: 30px; height: 30px;}
#menuhuls2 a{font-size: 21px;}
}

/*media query voor: 1200px''*/
@media screen and (min-width: 1200px) {
ul{position: relative; font-size: 16px; font-family:"Arial"; line-height: 25px; list-style-type: none; margin: 5px 0px 0px 40px; color: #333;}
/*typografie*/
p{position: relative; font-size: 16px; font-family:"Arial"; line-height: 25px; padding: 10px 20px 10px 20px;}
a{position: relative; font-size: 16px; font-family:"Arial"; line-height: 25px;}
h1{position: relative; font-size: 30px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;; }
h2{position: relative; font-size: 25px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;;}
h3{position: relative; font-size: 21px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;;}
h4{position: relative; font-size: 19px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;;}
#sitenaam{font-size: 70px}
.quote{position: relative; margin: 20% 20% 0% 20%; color: #fcfcfc; text-shadow: 2px 2px #555; font-size: 50px; text-align: center;}
.squote{position: relative; width: auto; margin: 5% 20% 0% 10%; color: #fcfcfc; text-shadow: 2px 2px #555;  font-size: 50px; text-align: center;}
/*iconen naast headers*/
.h4-icoon{position: relative; float: left; margin: 16px 10px 0px 20px; width: 20px; height: 20px;}
.h2-icoon{position: relative; float: left; margin: 17px 10px 0px 20px; width: 25px; height: 25px;}
.h1-icoon{position: relative; float: left; margin: 20px 10px 0px 20px; width: 30px; height: 30px;}
#menuhuls2 a{font-size: 21px;}
}

/*media query voor: tussen maten''*/
@media screen and (min-width: 1600px) {
ul{position: relative; font-size: 16px; font-family:"Arial"; line-height: 25px; list-style-type: none; margin: 5px 0px 0px 40px; color: #333;}
/*typografie*/
p{position: relative; font-size: 16px; font-family:"Arial"; line-height: 25px; padding: 10px 20px 10px 20px;}
a{position: relative; font-size: 16px; font-family:"Arial"; line-height: 25px;}
h1{position: relative; font-size: 32px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;;}
h2{position: relative; font-size: 27px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;;}
h3{position: relative; font-size: 22px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;;}
h4{position: relative; font-size: 21px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;;}
#sitenaam{font-size: 72px}
.quote{position: relative; margin: 20% 20% 0% 20%; color: #fcfcfc; text-shadow: 2px 2px #555; font-size: 52px; text-align: center;}
.squote{position: relative; width: auto; margin: 5% 20% 0% 10%; color: #fcfcfc; text-shadow: 2px 2px #555;  font-size: 52px; text-align: center;}
/*iconen naast headers*/
.h4-icoon{position: relative; float: left; margin: 15px 10px 0px 20px; width: 25px; height: 25px;}
.h2-icoon{position: relative; float: left; margin: 20px 10px 0px 20px; width: 27px; height: 27px;}
.h1-icoon{position: relative; float: left; margin: 20px 10px 0px 20px; width: 32px; height: 32px;}
#menuhuls2 a{font-size: 22px;}
}

/*media query voor: 22''*/
@media screen and (min-width: 1900px) {
ul{position: relative; font-size: 16px; font-family:"Arial"; line-height: 25px; list-style-type: none; margin: 5px 0px 0px 40px; color: #333;}
/*typografie*/
p{position: relative; font-size: 16px; font-family:"Arial"; line-height: 25px; padding: 10px 20px 10px 20px;}
a{position: relative; font-size: 16px; font-family:"Arial"; line-height: 25px;}
h1{position: relative; font-size: 35px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;}
h2{position: relative; font-size: 30px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;}
h3{position: relative; font-size: 25px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;}
h4{position: relative; font-size: 21px; font-family:"Delius Swash Caps"; padding: 10px 0px 5px 20px;}
#sitenaam{font-size: 75px}
.quote{position: relative; margin: 20% 20% 0% 20%; color: #fcfcfc; text-shadow: 2px 2px #555;  font-size: 55px; text-align: center;}
.squote{position: relative; width: auto; margin: 5% 20% 0% 10%; color: #fcfcfc; text-shadow: 2px 2px #555;  font-size: 55px; text-align: center;}
/*iconen naast headers*/
.h4-icoon{position: relative; float: left; margin: 15px 10px 0px 20px; width: 25px; height: 25px;}
.h2-icoon{position: relative; float: left; margin: 20px 10px 0px 20px; width: 30px; height: 30px;}
.h1-icoon{position: relative; float: left; margin: 20px 10px 0px 20px; width: 35px; height: 35px;}
#menuhuls2 a{font-size: 25px;}
}

/*HOOFD KLEUREN CSS VOOR SITE TYPOGRAFIE*/
a{color: #d90202; text-decoration: none;}

.h-icoon img{position: relative; max-width: 100%;}

/*blauwe H's in tegeltjes*/
.bgwit h1 ,h2 , h3, h4{color:#800020;}

/*contact forms*/

input[type="text"]{position: relative; width: 90%; margin: 0px 10px 10px 20px; height: 45px; padding: 0px 0px 0px 10px; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; transition: all 1s ease-in-out; }
input:hover[type="text"]{position: relative; width: 90%; margin: 0px 10px 10px 20px; height: 45px; border: 2px solid #8c8d7c;}

#mce-EMAIL, #mce-LNAME , #mce-FNAME{position: relative; width: 70%; margin: 0px 10px 10px 20px; height: 45px; padding: 0px 0px 0px 10px; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; transition: all 1s ease-in-out; }

/*footer*/

#footer h2{color: #FFD700;}