@import url("//hello.myfonts.net/count/258efd");
@import url("//hello.myfonts.net/count/25d78f");

/* 
Proxima is het basisfont voor de website
 */
@font-face {font-family: 'ProximaNovaSoft-Medium';src: url('../../webfonts/258EFD_0_0.eot');src: url('../../webfonts/258EFD_0_0.eot?#iefix') format('embedded-opentype'),url('../../webfonts/258EFD_0_0.woff') format('woff'),url('../../webfonts/258EFD_0_0.ttf') format('truetype');}
 
  
@font-face {font-family: 'ProximaNovaSoft-Semibold';src: url('../../../webfonts/258EFD_1_0.eot');src: url('../../webfonts/258EFD_1_0.eot?#iefix') format('embedded-opentype'),url('../../webfonts/258EFD_1_0.woff') format('woff'),url('../../webfonts/258EFD_1_0.ttf') format('truetype');}
 
  
@font-face {font-family: 'ProximaNovaSoft-Bold';src: url('../../webfonts/258EFD_2_0.eot');src: url('../../webfonts/258EFD_2_0.eot?#iefix') format('embedded-opentype'),url('../../webfonts/258EFD_2_0.woff') format('woff'),url('../../webfonts/258EFD_2_0.ttf') format('truetype');}
 
  
@font-face {font-family: 'ProximaNovaSoft-Regular';src: url('../../webfonts/258EFD_3_0.eot');src: url('../../webfonts/258EFD_3_0.eot?#iefix') format('embedded-opentype'),url('../../webfonts/258EFD_3_0.woff') format('woff'),url('../../webfonts/258EFD_3_0.ttf') format('truetype');}

/* 
Artifika wordt gebruikt vor alle koppen.
 */
@font-face {
    font-family: 'ArtifikaMedium';
    src: url('../../webfonts/Artifika-Regular-webfont.eot');
    src: url('../../webfonts/Artifika-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../webfonts/Artifika-Regular-webfont.woff') format('woff'),
         url('../../webfonts/Artifika-Regular-webfont.ttf') format('truetype');
}

/* 
Onderstaand font wordt gebruikt voor alle cursieve teksten.
 */
@font-face {
    font-family: 'AurulentSansItalic';
    src: url('../../webfonts/AurulentSans-Italic-webfont.eot');
    src: url('../../webfonts/AurulentSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../webfonts/AurulentSans-Italic-webfont.woff') format('woff'),
         url('../../webfonts/AurulentSans-Italic-webfont.ttf') format('truetype'),
    font-weight: normal;
    font-style: normal;
}

.ProximaNovaSoft-Medium { font-family: ProximaNovaSoft-Medium; }
.ProximaNovaSoft-Semibold { font-family: ProximaNovaSoft-Semibold; }
.ProximaNovaSoft-Bold { font-family: ProximaNovaSoft-Bold; }
.ProximaNovaSoft-Regular { font-family: ProximaNovaSoft-Regular; }

.Proxima13 {font-family: ProximaNovaSoft-Medium; 
			font-size: 1.3em; }
.Proxima {font-family: ProximaNovaSoft-Medium;}


.Artifika { font-family: Artifika;}
.Artifika13 {	font-family: Artifika;
				font-size: 1.3em; }
.Artifika11 {	font-family: Artifika;
				font-size: 1.1em; }
				

body
{
	font-family: ProximaNovaSoft-Regular,Verdana,sans-serif;
	font-size: 1em;
	line-height: 1.4;
	background-color: #B33110;
	color: black;
	text-align: center;
}

/* 
Om het juiste font voor vet te krijgen.
 */
b
{
	font-family: ProximaNovaSoft-Bold,Verdana,sans-serif;
	color: #333;
}


/* 
Het juiste font voor cursief. De font-size is wat kleiner omdat anders de teksten wat te groot zijn 
 */
i
{
	font-family: AurulentSansItalic,Verdana,sans-serif;
	font-size: 0.9em;
}

#container
{
	margin: 0 auto;
	width: 950px;
	padding-top: 10px;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 10px;
	background-color: white;
	text-align: left;
	color: #666;
	border-color: #571F08;
	border-width: 2px;
	border-style: solid;
}

#fotocontainer
{
	margin: 0 auto;
	width: 800px;
	padding: 40px;
	border: maroon solid;
	background-color: black;
	text-align: left;
}

#kolleft510 {
	width: 505px;
	float: left;
	margin-left: 5px;
}
#kolright400 {
	width: 395px;
	float: right;
	margin-left: 5px;
}
.albumbody
{
	background-color: white;
}

p
{
	margin-top: 1em;
}

/* 
Om dropcaps te maken.
Komt van http://code.stephenmorley.org/html-and-css/creating-drop-caps/
Afhankelijk van het gebruikte font en font-size, moeten ook de waarden voor margin proefondervinderlijk worden vastgesteld.
 */

.eersteletter{
		font-family: ArtifikaMedium,Verdana;
        float:left;
        font-size:5em;
        line-height:0.5;
        margin:0.12em 0.1em 0 -0.1em;
        color:#B33110;
        text-shadow:1px 1px 2px rgb(64,64,64);
      }

.eersteletter + span{
        margin-left:-0.6em;
      }

.aligntop
/*om paragrafen uit te lijnen met foto's*/
{
	margin-top: 2em;
}


.foto {
	margin-left: 1%;
	margin-right: 1%;
	text-align: center;
	font-size: 0.9em;
	color: maroon;
}

.fotocenter {
	margin: 1em auto;
	text-align: center;
	font-size: 0.9em;
	color: maroon;
}
.fotoalbum
{
	margin-top: 2em;
	margin-bottom: 2em;
	font-size: 120%;
	color: white;
}
.fotokop
{
	text-align: center;
	background-color: #092EFF;
	color: #FFFC7B;
	border-color: #FFF91A;
	border-width: 1px;
	border-style: solid;
}

.fotoleft {
	margin-top: 1em;
	margin-right: 1em;
	margin-bottom: 0.5em;
	font-size: 0.9em;
	float: left;
	color: maroon;
}

.fotoright
{
	margin-top: 1em;
	margin-left: 1em;
	margin-bottom: 0.5em;
	font-size: 0.9em;
	float: right;
	color: maroon;
}

blockquote
{
	color: #991;
	font-size: 0.9em;
	font-family: ProximaNovaSoft-Regular;
	margin-left: 3em;
	margin-right: 3em;
}

H1
{
	font-family: ProximaNovaSoft-Semibold,Verdana;
	font-size: 2.4em;
	margin-left: 0;
	margin-right: 0;
}

H2
{
	font-family: ProximaNovaSoft-Semibold, Verdana;
	font-size: 1.8em;
	margin-left: 0;
	margin-right: 0;
}

H3
{
	font-family: ProximaNovaSoft-Semibold,Verdana;
	font-size: 1.6em;
	margin-left: 0;
	margin-right: 0;
}

H4
{
	font-family: ProximaNovaSoft-Semibold,Verdana;
	font-size: 1.1em;
	margin-left: 0;
	margin-right: 0;
}

H5
{
	font-family: ProximaNovaSoft-Semibold,Verdana;
	font-size: .83em;
	margin-left: 0;
	margin-right: 0;
}

H6
{
	font-family: ProximaNovaSoft-Semibold,Verdana;
	font-size: .67em;
	margin-left: 0;
	margin-right: 0;
}

.titel
{
	font-family: ArtifikaMedium, Verdana;
	text-align: center;
	background-color: #B33110;
	color: #FFF638;
	border: 1px #000790 solid;
	letter-spacing: 1px;
	font-weight: normal;
	text-shadow:1px 1px 2px rgb(64,64,64);
}

.kop
{
	font-family: ArtifikaMedium, Verdana;
	text-align: center;
	background-color: rebeccapurple;
/* 
	Ter herinnering aan Rebecca, de 6 jarige dochter van Eric Meyer
	http://meyerweb.com/eric/thoughts/2014/06/09/in-memoriam-2/
	http://meyerweb.com/eric/thoughts/2014/06/19/rebeccapurple/
 */
	color: #FFF638;
	border-color: #003385;
	letter-spacing: 2px;
	border-width: 1px;
	border-style: solid;
	text-shadow: 1px 1px 2px rgb(0,0,0);
}


li
{
	font-family: ProximaNovaSoft-Regular,Verdana,sans-serif;
	font-size: 0.95em;
}

.leftcol
{
	width: 45%;
	float: left;
	border: 1px solid #B33110;
	padding: 3px;
	margin-left: 1em;
	background-color: #F3EC2F;
}

.rightcol
{
	width: 45%;
	float: right;
	border: 1px solid #B33110;
	padding: 3px;
	margin-right: 1em;
	background-color: #F3EC2F;
}

div.leftcol b {
	font-size: 1.1em;
}
div.rightcol b {
	font-size: 1.1em;
}

.halvekolomrechts {
	width: 47%;
	float: right;
	margin-left: 3%;
}

.halvekolomlinks {
	width: 47%;
	float: left;
	margin-right: 3%;
}

.lefttxt
{
	width: 45%;
	float: left;
	margin-left: 3%;
}

.righttxt {
	width: 45%;
	margin-right: 3%;
	float: right;
}

.centertext {
	margin-bottom: 1em;
	margin-left: 20%;
	margin-right: 20%;
	background-color: #F3EC2F;
	padding: 1em;
	border: 1px solid #B33110;
}

.coltopalign
/*om paragrafen uit te lijnen met foto's in de hierboven gedefinieerde tekstkolommen*/
{
	margin-top: 0.5em;
}


.lefttxtsmall
{
	width: 32%;
	float: left;
	margin-left: 1%;
	margin-right: 2%;
}

.righttxtsmall
{
	width: 32%;
	float: right;
	margin-left: 2%;
	margin-right: 1%;
}

.lefttxtbreed
{
	width: 62%;
	float: left;
	margin-left: 1%;
	margin-right: 2%;
}
.righttxt80
{
	width: 74%;
	float: right;
	margin-left: 4%;
	margin-right: 1%;
}

.righttxt75
{
	width: 70%;
	float: right;
	margin-left: 4%;
	margin-right: 1%;
}

.lefttxt80
{
	width: 74%;
	float: left;
	margin-left: 1%;
	margin-right: 4%;
}

.lefttxt75
{
	width: 70%;
	float: left;
	margin-left: 1%;
	margin-right: 4%;
}

.lefttxt25
{
	width: 28%;
	float: left;
	margin-left: 1%;
	margin-right: 1%;
}

.lefttxt30
{
	width: 28%;
	float: left;
	margin-left: 1%;
	margin-right: 1%;
}

.lefttxt40
{
	width: 37%;
	float: left;
	margin-left: 1%;
	margin-right: 1%;
}

.lefttxt510
{
	width: 502px;
	float: left;
	margin-left: 2px;
	margin-right: 0px;
}

.righttxt400
{
	width: 402px;
	float: right;
	margin-left: 0px;
	margin-right:2px;
} 

.righttxtbreed
{
	width: 62%;
	float: right;
	margin-left: 2%;
	margin-right: 1%;
}

.righttxt50
{
	width: 50%;
	float: right;
	margin-left: 0%;
	margin-right: 1%;
} 

.righttxt30
{
	width: 26%;
	float: right;
	margin-left: 2%;
	margin-right: 1%;
}

.centerblok
{
	margin-left: 10%;
	margin-right: 10%;
}

.inspringen
{
	margin-left: 5%;
	margin-right: 5%;
}

a:link {
	color: #0080FF;
	text-decoration: none;
}

a:visited
{
	color: #0080FF;
	text-decoration: none;
}

a:hover {
	color: #0080FF;
	text-decoration: none;
	border-bottom: 2px solid rgb(255,0,0)
}

a:active
{
	color: #0080FF;
	text-decoration: none;
	border-bottom: 2px solid rgb(255,0,0)
}

H3 a
{
	color: #0080FF;
}

p a:hover a:active
{
	color: #0080FF;
	border-bottom: 2px solid rgb(255,0,0);
	text-decoration: none;
}

li a:link
{
	color: #0080FF;
	text-decoration: none;
}

li a:visited
{
	color: #0080FF;
	text-decoration: none;
}

li a:hover
{
	color: #0080FF;
	text-decoration: none;
	border-bottom: 2px solid rgb(255,0,0)
}

li a:active
{
	color: #0080FF;
	text-decoration: none;
	border-bottom: 2px solid rgb(255,0,0)
}


.lijn
{
	border-top: 1px solid #003385;
}

.lijnen {
	border-top: 1px solid #003385;
	border-bottom: 1px solid #003385;
}

table {
	font-size: 0.9em;
	line-height: 1.6em;
}

a.speciaal:link
{
	color: red;
}
a.speciaal:visited
{
	color: red;
}

p.kleiner {
font-size: 0.9em
}

p.ipadtekst {
	display: none;
}

p.ipadonly {
	display: none;
}

.markeer {
	color: red;
	font-weight: bold;
}

.indexterug
{
	padding: 6px;
	font-size: 0.9em;
	border: 2px #800040 solid;
	background-color: #F6F7E1;
	text-align: center;
}

.indexterug a
{
	text-decoration: none;
	color: #1F5BE9;
}	
.leesverhaal
{
	/* om de link naar het verhaal te markeren die onder iedere korte beschrijving staat in de hoofdindex*/
	padding: 6px;
	font-size: 0.9em;
	font-family: ArtifikaMedium, Verdana, sans-serif;
	border: 2px #571F08 solid;
	color: white;
	text-align: center;
	background-color: teal;
}

.leesverhaal a {
	text-decoration: none;
	color: white;
}
@import url(ipad.css) screen, handheld;