/*
Theme Name: Literatuurtheorie
Theme URI: http://www.edufax.nl
Description: Edufax Literatuurtheorie Theme

Author: Edufax
Author URI: http://www.edufax.nl
Version: 1.0.1
Tags: light, three-columns, right-sidebar, flexible-width, custom-colors, custom-header, custom-background, custom-menu, theme-options, threaded-comments, sticky-post, translation-ready

License: GNU/GPL Version 2 or later
License URI: http://www.gnu.org/licenses/gpl.html
*/

* { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-transition: 1.0s; -moz-transition: 1.0s; -o-transition: 1.0s; -ms-transition: 1.0s; transition: 1.0s; margin: 0; padding: 0;}

html, body { height: 100%; }

body {
    color: #333;
    font-family: "Raleway",Helvetica,Arial;
    font-size: 16px;
    line-height: 30px;
    font-weight: 400;
    letter-spacing: 1px;
	margin: 0;
	padding: 0;
	background-repeat: no-repeat; background-attachment: fixed; background-position: center; background-size: cover;
}

#titleheader { color: #ffffff; margin-bottom: 20px; text-shadow: 1px 2px rgba(0,0,0,0.5);}
#titleheader h1 { margin-top: 0px; }
#titleheader p { font-style: italic; }

#ib-logo { width: 270px; height: 75px; position: absolute; left: 10px; top: 10px; background-image: url(afbeeldingen/ib-logo.png); background-size: auto 100%;
 background-repeat: no-repeat; }
#edufax-logo { width: 120px; height: 60px; position: absolute; right: 10px; bottom: 10px; background-image: url(afbeeldingen/Edufax_wit.png); }

.edufaxtext { background-color: rgba(51,102,153,0.8); padding: 34px 38px; border-top-right-radius: 30px; color: #ffffff;  }
.edufaxtext a { color: #ffffff; text-decoration: underline; }
.edufaxtext a:hover { color: #ffffff; text-decoration: none; }
.edufaxtext table { border-color: #ffffff !important; }
.edufaxtext table tr { border-color: #ffffff !important; }

.profilepress-reg-status { background-color: green !important; }

.tml { margin: 30px auto; width: 100%; }
.tml a { color: #ffffff; text-decoration: underline !important; }
.tml a:hover { color: #ffffff; text-decoration: none; }
.tml input[type=text] { color: #000000;}
.tml input[type=password] { color: #000000;}
ul.tml-links { list-style-type: none; clear: both; float: left; }
.tml .tml-rememberme-wrap { float: left; }
.tml .tml-submit-wrap { float: right; }

.white-bg { color: grey; padding: 34px 38px; border-top-left-radius: 30px; background-color: rgba(255,255,255,0.8); display: inline-block; width: 100%; }
.white-bg a { color: rgb(51,102,153); text-decoration: none !important; }
.white-bg a:hover { color: rgb(51,102,153); text-decoration: underline !important;} 
.blue-bg { color: #ffffff; padding: 34px 38px; border-top-left-radius: 30px; background-color: rgba(51,102,153,0.75); display: inline-block; width: 100%; }
.blue-bg a { color: #ffffff; text-decoration: underline; }
.blue-bg a:hover { color: #ffffff; text-decoration: none; }
.quoteText { font-style: italic; font-size: 22px; padding: 40px 0px; border-top: solid 1px #ffffff; border-bottom: solid 1px #ffffff; margin: 40px 0px;}
.quoteSpeaker { font-size: 18px; text-align: right; }
.quoteSpeaker .age { font-size: 14px; }
.white-bg a.btn { color: #ffffff; text-decoration: none !important; }
.white-bg a:hover { color: #ffffff; text-decoration: underline !important;} 

.woocommerce .cart-collaterals .cart_totals { width: 70% !important; }
.woocommerce .cart-collaterals .cart_totals h2 { display: none; }
.woocommerce .cart-collaterals .cart_totals .wc-proceed-to-checkout { float: right; }
.woocommerce-billing-fields input { border: none; padding: 10px; border-radius: 5px; color: rgb(51,102,153);}
.woocommerce-billing-fields select { border: none; padding: 10px; border-radius: 5px; color: rgb(51,102,153);}
.select2-container--default .select2-selection--single { border: none !important; border-radius: 5px !important; color: rgb(51,102,153) !important;}
.woocommerce form .form-row.woocommerce-validated .select2-container {  }
.woocommerce-checkout #payment { background: transparent !important; }

.tml-lostpassword .message { display: none; }
.tml-register .message { display: none; }
.tml-resetpass .message { display: none; }

.login-form { background-color: transparent; padding: 0; margin-top: 20px;}

.alert { margin-top: 15px; }

ul li#my-account { margin-top: 20px; }

.login-form input[type=submit] {
    background-color: #336699 !important;
    border-color: #2e6da4;
    color: #fff;
    -moz-user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857;
    margin-bottom: 0;
    padding: 10px 12px;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
}

.tml-submit-wrap input[type=submit]:hover{
	background-color: #2a5b8c;
    border-color: #204d74;
}

.woocommerce .wc-proceed-to-checkout a.button.alt { background-color: #336699;
    border-color: #2e6da4;
    color: #fff;
}

.woocommerce .wc-proceed-to-checkout a.button.alt:hover{
	background-color: #2a5b8c;
    border-color: #204d74;
}

.crumbpath { margin-bottom: 20px; padding: 20px; border-bottom: solid 1px #ccc; background-color: #ffffff; }

#begrippenlijst td { padding: 5px 15px; vertical-align: top; }

table { margin-bottom: 20px; }

.anim-delay-250ms   { animation-delay: 0.25s }
.anim-delay-500ms   { animation-delay: 0.5s }
.anim-delay-750ms   { animation-delay: 0.75s }
.anim-delay-1000ms  { animation-delay: 1s }
.anim-delay-1250ms  { animation-delay: 1.25s }
.anim-delay-1500ms  { animation-delay: 1.5s }
.anim-delay-1750ms  { animation-delay: 1.75s }
.anim-delay-2000ms  { animation-delay: 2s }
.anim-delay-2250ms  { animation-delay: 2.25s }
.anim-delay-2500ms  { animation-delay: 2.5s }

/*home page*/
section.sectionContainer { height: 50%; background-color: #cccccc; background-repeat: no-repeat; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; overflow:hidden; padding: 0px;}
section .sectionInnerContainer { width: 100%; height: 100%; position: relative; padding: 0px; background-color: rgba(51,102,153,0.8); }
section#literatuuranalyse .sectionInnerContainer { background-color: rgba(151, 192, 232,0.8);}
section#schrijven-en-spreken .sectionInnerContainer { background-color: rgba(67, 126, 185,0.8);}
section#begrippenlijst .sectionInnerContainer { background-color: rgba(13, 56, 99, 0.8);}
section .sectionInnerContainer a { width: 100%; height: 100%; position: relative; display: inline-block;}
section .sectionInnerContainer span.sectionLogo { position: absolute; height: 40%; top: 20%; width: 100%; text-align: center; }
section .sectionInnerContainer span.sectionLogo img { height: 100%; width: auto; }
section .sectionInnerContainer span.sectionTitle { width: 100%; bottom: 0; padding: 20px 0 20px 30px; position: absolute; font-size: 43px; color: #ffffff; word-wrap: break-word; }
section:hover .sectionInnerContainer span.sectionTitle { padding-bottom: 100px; position: absolute; font-size: 43px; word-wrap: break-word;  }
section:hover .sectionInnerContainer span.sectionTitle { background-color: rgba(51,102,153,0.5);  }
section:hover .sectionInnerContainer {  background-color: transparent !important; }
section:hover .sectionInnerContainer span.sectionLogo img { opacity: 0; }

section.selected { -webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s; transition: 0.5s; }
#literatuurgeschiedenis.selected { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 100; }
#literatuuranalyse.selected { position: absolute; right: 0; top: 0; width: 100%; height: 100%; z-index: 100; }
#schrijven-en-spreken.selected { position: absolute; left: 0; bottom: 0; width: 100%; height: 100%; z-index: 100; }
#begrippenlijst.selected { position: absolute; right: 0; bottom: 0; width: 100%; height: 100%; z-index: 100; }
section .sectionLoadContainer { clear: both; float: right; width: 85%; display:none; opacity: 0; height: 100%; }

/*category page*/
.link-item { height: 300px; text-align: center; margin: 15px 0px; }
.inner-link-item { width: 100%; height: 100%; background-repeat: no-repeat; background-position: center; background-repeat: no-repeat; background-size: cover; font-size: 24px; display: table; line-height: 32px; background-color: #b0dbfb; }
.inner-link-item a { width: 100%; height: 100%; text-decoration: none; color: #ffffff; font-weight: bold;  display: table-cell; vertical-align: middle; }
.link-item:hover .inner-link-item a{ opacity:1; background-color: rgba(51,102,153,0.9);  }
.inner-link-item span { width: 100%; height: 100%; text-decoration: none; color: #ffffff; font-weight: bold;  display: table-cell; opacity:1; background-color: rgb(51,102,153); vertical-align: middle;  }

/*navigation*/
#navigation { background-color: rgba(0,0,0,0.9);
    bottom: 0;
    height: 100%;
    left: 0;
    opacity: 0;
    overflow: auto;
    position: fixed;
    right: 0;
    top: 0;
    transition: opacity 0.75s ease 0s, z-index 0s ease 1s;
    width: 100%;
    z-index: -1;}
/*#navigation ul ul { display: block; }*/
#navigation ul { padding-left: 20px; list-style-type: none; position: relative; }
#navigation li.menu-item-has-children::after { 
    font-family: 'Glyphicons Halflings';
    content: "+";
	position: absolute;
	right: 0px;
	top: 3px;
	color: #cc0033;
}
#navigation li.current-menu-ancestor.menu-item-has-children::after { 
    font-family: 'Glyphicons Halflings';
    content: "-";
	position: absolute;
	right: 0px;
	top: 3px;
	color: #cc0033;
	font-size: 40px; line-height: 0px
}
#navigation li.visible::after { 
    font-family: 'Glyphicons Halflings';
    content: "-";
	position: absolute;
	right: 0px;
	top: 3px;
	color: #cc0033;
	font-size: 40px; line-height: 0px
}

#navigation .current-menu-ancestor>ul { display: block; }
#navigation .current-menu-item>ul { display: block; }
#navigation>ul:first-of-type { margin-top: 90px; float: left; width: 500px;}
#navigation>ul:first-of-type span.glyphicon-plus { color: #ffffff; cursor: pointer; position: absolute; right: -25px; top: 6px; }
#navigation>ul:first-of-type .current-menu-parent>span.glyphicon-plus::before { content: "-"; font-size: 40px; line-height: 0px }
#navigation ul li { line-height: 24px; position: relative; cursor: pointer;}
#navigation ul li a { color: #ffffff; font-size: 16px; line-height: 30px; text-decoration: none;}
#navigation ul li a:hover { color: #cc0033; }
#navigation .current-menu-item>a { color: #cc0033; }
#navigation .current-menu-item::before {
    font-family: 'Glyphicons Halflings';
    content: "\e080";
	position: absolute;
	left: -20px;
	top: 3px;
	color: #cc0033;
}
#menuButton { width: 100%; height: 70px; background-color: #336699; color: #ffffff; position: fixed; left: 0px; top: 0px; z-index: 501; }
#home { width: 70px; height: 70px; position: absolute; left: 0; top: 0; background-color: #336699; cursor: pointer; text-align: center; line-height: 75px; font-size: 34px;}
#home a { color: #ffffff; }
.container { padding-top: 90px; padding-left: 0px; padding-right: 0px; min-height: 100%; overflow: hidden; margin-bottom: 50px;}

#navigation .has-children { font-size: 40px; font-weight: bold; position: absolute; right: 5px; top: 3px; color: #ffffff; display: inline-block;}
#navigation .has-children .plus { display: block; }
#navigation .has-children .min { display: none; }
#navigation .has-children.collapsed .plus { display: none; }
#navigation .has-children.collapsed .min { display: block; }
#navigation ul { display: none; }
#navigation ul.collapsed { display: block; }

#toggleMenu { width: 70px; height: 70px; position: absolute; left: 70px; top: 0; background-color: #cc0033; cursor: pointer; text-align: center; line-height: 75px; font-size: 34px;}
#openMenu { display: block; }
#closeMenu { display: none; }
#menuTitle { position: absolute; left: 150px; padding-left: 10px; font-size: 30px; line-height: 70px; top: 0;}
#menuTitle a { color: #ffffff; text-decoration: none; }
#menuSearch { width: 70px; height: 70px; position: absolute; right: 140px; top: 0; background-color: #336699; cursor: pointer; text-align: center; line-height: 75px; font-size: 34px;}
#menuSearchMobile { width: 70px; height: 70px; position: absolute; left: 140px; top: 0; background-color: #336699; cursor: pointer; text-align: center; line-height: 75px; font-size: 34px;}
#menuLogo { width: 140px; height: 70px; padding: 5px; position: absolute; right: 0; top: 0; text-align: center; }

#searchContainer { width: 100%; height: 70px; background-color: #336699; color: #ffffff; position: fixed; left: 0px; top: 0px; z-index: 500; display: block;}
#searchContainer.visible { top: 70px; }
#searchContainer .container { position: relative; }
#searchContainer form { position: absolute; left: 0px; top: 0px; width: 100%; }
#searchContainer form label { display: none; }
#searchContainer form input[type=text] { border: solid 1px #ffffff; height: 50px; margin: 10px; width: 70%; border-radius: 5px; background-color: #336699; color: #ffffff; font-size: 24px; padding-left: 10px;  }
#searchContainer form input[type=submit] { background-color: #cc0033; height: 50px; margin: 10px; width: 15%; float: right; border: none; font-size: 24px;}

#searchResults { padding-top: 160px; }

article { height: 100%; min-height: 100%; float: left; padding: 0px 15px;}

.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

.alignright {
    float:right;
    margin: 5px 0 20px 20px;
}

.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

a img.alignnone {
    margin: 5px 20px 20px 0;
}

a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.wp-caption {
    background: #fff;
    border: 1px solid #f0f0f0;
    max-width: 96%; /* Image does not overflow the content area */
    padding: 5px 3px 10px;
    text-align: center;
}

.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
    margin: 5px 0 20px 20px;
}

.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

.wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0 4px 5px;
}

/* Text meant only for screen readers. */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
        white-space: nowrap;
	height: 1px;
	width: 1px;
	overflow: hidden;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar. */
}

blockquote p { padding-left: 30px !important; padding-right: 30px !important; }

.slideContainer { position: relative; }
.slideButton { width: 50px; height: 50px; text-align: center; line-height :50px; font-size: 24px; position: fixed; cursor: pointer; z-index: 100;}
.slideLeft { top: 50%; margin-top: -25px; left: 50px; background-image: url(afbeeldingen/pijl-links.png);background-repeat: no-repeat; }
.slideRight { top: 50%; margin-top: -25px; right: 50px; background-image: url(afbeeldingen/pijl-rechts.png);background-repeat: no-repeat; }
.slideLeft.disabled { background-image: url(afbeeldingen/pijl-links-disabled.png); }
.slideRight.disabled { background-image: url(afbeeldingen/pijl-rechts-disabled.png); }

.dotContainer { position: fixed; bottom: 0; left: 50%; background-color: #ffffff; border-radius: 10px 10px 0px 0px; }
.dot { width: 20px; height: 20px; border-radius: 10px; border: solid 1px grey; background-color: #ffffff; margin: 20px 10px; float: left; cursor: pointer;}
.currentDot { background-color: grey; }


/*#menuBar { width: 100%; height: 50px; background-color: #000000; color: #ffffff; position: fixed; left: 0px; top: 0px; z-index: 501; }
#toggleMenu { width: 50px; height: 50px; position: absolute; left: 0; top: 0; background-color: #cc0033; cursor: pointer; text-align: center; line-height: 55px; font-size: 24px;}
#openMenu { display: block; }
#closeMenu { display: none; }
#menuTitle { position: absolute; left: 50px; padding-left: 10px; font-size: 30px; line-height: 50px; top: 0;}
#menuTitle a { color: #ffffff; text-decoration: none; }*/

/*.category-page .container { margin-top: 50px; }*/

/* old css*/
/* content */
div.lestitel {height:520px; text-align:center;}
div.lestitel h1 { padding:30px 10px; }
div.lestitel ul {margin:0 auto; padding:0; list-style:none; display:block; width:570px; text-align:left; }
div.lestitel ul li { display:block; }
div.lestitel ul li a, visited { display:block; padding: 10px 4px; text-decoration:none; color: #336799; border-bottom: 2px solid #FFF; } 
div.lestitel ul li a:hover { border-bottom: 2px solid #336799; }
div.lestitel ul li a:hover::after {content: "\00bb"; padding-left:20px; }

article {text-align:left;}

aside {float:right; width: 300px; border-width:3px; border-style:solid; border-color:#32659A; border-radius:13px; padding:8px; margin-left:15px; margin-bottom: 15px;}
aside p {font-size:14px; font-weight:normal; line-height:1.75em; padding: 0 5px; margin-top:0;}
aside p strong {color:#336799;}

p.bookmark {height:10px; position: relative;}
p.bookmark a { position: absolute; bottom: -10px; }

article {line-height:1.25em; height: 100%; }
article h1 {background-color:#32659A;color:white;font-size:1.375em;padding:15px 5px;}
article h2, aside h2 {font-size:16px; color:#336799; padding:0 5px; margin:10px 0px 20px 0px;}
/*article p:first-letter {font-weight:bold; font-size:1em; color:#336799;}*/
article p, article ul, article ol {font-size: 16px; line-height: 30px; font-weight:normal; padding: 0 5px; margin-top:0; margin-bottom: 20px;}
article p a, audio a, figure figcaption a {color:#cf1010; text-decoration:none; }
article p a img {border:none;}
article ul li {padding: 0 0 5px 4px; margin-left:20px;list-style-image:url(../img/list-bullet.png); list-style-position:outside}
article ol li {padding: 0 0 5px 4px; margin-left:20px;list-style-position:outside;}
article ul.nobullets li {list-style:none;}
article p.letop {padding:8px; margin: 4px 100px 4px 8px; border: 1px dashed #336799;}
article p.letop strong {color:#336799; font-size:1.125em;}

/*div omdat ik mezelf klem gezet heb met de p:firstletter */
div.overig {line-height:1.25em; font-size:0.875em; font-weight:normal; padding: 5px; margin-top:0;}

blockquote {background-color:#f1f1f1; padding:10px; margin:5px 15px 20px 15px; font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif; color:#818181; font-size:1.125em; text-align:center;}

figure {padding: 0 5px;}
figcaption {font-size:0.75em;}

/* figure.gedicht */
figure.gedicht blockquote {text-align:left; line-height:1.375em;}
figure.gedicht figcaption {margin-top:10px; font-size: 0.875em}
figure.gedicht table tr td {background-color:#f1f1f1; padding:10px; margin:5px 15px; font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif; color:#818181; font-size:1em; text-align:left;line-height:1.375em; border-right:20px solid white}
figure.gedicht table tr th {background-color:#FFF; font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif; color:#171717; font-size:0.875em; border-right:20px solid white; padding:10px; margin:5px 15px; text-align:left; font-weight:normal; vertical-align:top;}

/* figure.toelichting */
figure.toelichting {font-size: 0.875em;	padding: 0 8px;}
figure.toelichting p {font-variant:small-caps; padding:0; margin:0; font-size:1em;}
figure.toelichting p:first-letter {font-weight:normal;}
figure.toelichting table td {border-bottom: 1px solid #171717; padding:6px;}

/* figure fragment */
figure.fragment {font-size: 0.9em; padding: 0 8px; background-color:#f1f1f1;}
figure.fragment p {margin: 4px;}
figure.fragment p:first-letter {font-weight:normal; color:#171717;}


/* ontleden van een gedicht */
/*
table.ontleding {margin:auto;}
*/
table.ontleding {margin: 22px 0px 16px 40px; }
table.ontleding tfoot tr td {border: none; font-size: smaller; font-style: italic; }
table.ontleding tr th {color:#0080c7;font-size:1.125em; padding:0 4px 8px 4px; font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;}
table.ontleding tr th.subhead {color: #171717; font-size:1em; font-weight:bold; padding-bottom:4px;}
table.ontleding tr td {border:1px dashed #0080c7; padding:4px 6px; font-size:0.875em;}
table.ontleding tr td.vmid {vertical-align:middle;}


table.voorbeeld {margin:auto;font-size:0.875em; font-weight:normal; padding: 0 5px;}
table.voorbeeld tr th {color:#0080c7;font-size:1em; padding: 4px; border-left:4px white solid;}
table.voorbeeld tr td {padding:4px 4px 13px 4px; border-left: 4px white solid;}

br.clearLeft {clear: left;}

img,video {max-width:100%}
audio, video {padding:5px;}

.rechts {float:right; margin: 10px 0 10px 10px; width:150px;}
.links {float:left; margin: 10px 10px 10px 0; width:150px;}
.grijs {background-color:#f1f1f1;}
.lichtblauw {color:#0080C7;}
.inspringen {margin-left:20px;}
.onderstreept {text-decoration:underline;}

/* mouseover content*/
span.definitie {border:1px dashed #0080C7; margin: 5px; padding: 5px; display:none; font-size:0.875em;}
span.kader {color:#0080c7; border-bottom: 1px dashed #0080c7; cursor:pointer;}

figure table td { vertical-align: top; }

.tml .tml-action-links li { line-height: 24px !important; }

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
	#navigation>ul:first-of-type { width: 100%;}
}