/* +----------------------------+ */
/* | Global styling for website | */
/* +----------------------------+ */
html, body { background-color:#000000; color:#ffffff; font-family: 'Dosis', sans-serif; font-size:1em; overflow-x:hidden;}
.mainpage     { margin-top:30px; }
.mainbanner {	background-image: url('../images/mainbanner.png'); background-size: contain; background-repeat: no-repeat; width:100%; padding-top:20%; display:none; }
.maincontent  { padding:20px; }
.introtext    { text-align:justify; margin-top:10px; }
.introimg     { display:none; }
.buttons      { text-align:center; }
.pagetitle    { text-align:center; line-height:50px; font-family: 'Playfair Display SC', serif;  font-size:26px; margin-top:-20px; }
.verhaaltitel { font-weight:bold; color:#ff8000; }
.opsomming a:link, .opsomming a:focus, .opsomming a:visited { color:#ff0080; }
.opsomming a:hover { color:#ffffff; }
.rightbuttons { margin-bottom:10px; }
.synopsis     { margin-top:10px; text-align:justify; }
.FacebookOnHome  { text-align:center; margin-top:10px; }
.divvorigvolgend { color:#ff00ff; font-size:1.3em; height:50px; line-height:50px; padding-top:5px; padding-bottom:5px; color:#47ff32; }
.divpersonages   { text-align:center; padding:5px;}
.divdossierimg   { text-align:center; }
.personagetitel  { color:#47ff32; font-weight:bold; font-size:1.2em; }
.dossiertitel    { font-size:1.2em; font-family: 'Ubuntu Condensed', sans-serif; letter-spacing:2px; }
.homefooter      { background-color:#8a0000; }
.da-image        { margin-left:10px; }
.linktitel       { font-family: 'Abel'; font-size:20px; font-weight:bold; } 
.greylabel       { color:#7A7A7A; }
.weekreeks       { color:#47ff32; font-size:1.4em; font-weight:bold; }
.weektitel       { color:#dd4300; font-size:1.2em; }
.albumlijst      { background-color:#000000; font-size:0.9em; }
.reeksinfo       { background-color:#000000; }

#auteurbio  { text-align:justify; }
#auteurnaam { font-size:1.3em; color:#47ff32; padding-bottom:5px; }

/* SPACERS */
.spacer10 { height:10px; }
.spacer20 { height:20px; }
.spacer30 { height:30px; }
.spacer40 { height:40px; }
.spacer50 { height:50px; }
.spacer60 { height:60px; }
.spacer70 { height:70px; }
.spacer80 { height:80px; }

/* +-------------------+ */
/* | Links and buttons | */
/* +-------------------+ */
.btn-home:link,
.btn-home:visited { background-color: #BB0004; color:#ffffff; border-radius:10px; }
.btn-home:hover { background-color: #7D0004; }
footer a:link, footer a:focus, footer a:visited { color:#ffffff; }
footer a:hover { text-decoration:underline; }
a.personagelink:link, a.personagelink:focus, a.personagelink:visited,
a.infolink:link, a.infolink:focus, a.infolink:visited,
a.auteurslink:link, a.auteurslink:focus, a.auteurslink:visited { color:#ff0080; } 
a.personagelink:hover, a.infolink:hover, a.auteurslink:hover { color:#FF8AC5; }
a.vorigvolgend:link, a.vorigvolgend:focus, a.vorigvolgend:visited { color:#47ff32; }
a.vorigvolgend.hover { color:#47ff32 }
a.dossierlist:link, a.dossierlist:focus, a.dossierlist:visited  { color: #ffffff; }
a.dossierlist:hover { color: #c0c0c0; }
a.linklink:link, a.linklink:focus, a.linklink:visited  { color: #c0c0c0; }
a.linklink:hover { color: #ffffff; }
a.updatelink:link, a.linklink:focus, a.updatelink:visited  { color: #00a82b; }
a.updatelink:hover { color: #ffffff; }
a.orangelink:link, a.orangelink:focus, a.orangelink:visited  { color: #dd4300; }
a.orangelink:hover { color: #ffffff; }
a.reflink:link, a.reflink:focus, a.reflink:visited  { color: #ff9900; }
a.reflink:hover { color: #ffffff; }
a.opgemerktlink:link, a.opgemerktlink:focus, a.opgemerktlink:visited  { color: #00ef60; }
a.opgemerktlink:hover { color: #ffffff; }
a.bio:link, a.bio:focus, a.bio:visited  { color: #9D9D9D; }
a.bio:hover { color: #c0c0c0; }

a.minilink:link, a.minilink:focus, a.minilink:visited  { color: #ffffff; text-decoration:underline; }
a.minilink:hover { color: #c0c0c0; text-decoration:none; }

/* +--------------------+ */
/* | Styling for modals | */
/* +--------------------+ */
.personagemodal {
  background-color: #000000;
  border: 1px solid #ffffff;
  width: 300px;
}  
.personagemodal .modal-header { border-bottom: 0 none; }
.personagemodal .perstitle  {	font-size: 1.1em; margin: 0 auto; }
.personagemodal .persbody   {	text-align:center; }
.personagemodal .modal-footer {	border-top: 0 none; }

.auteurmodal {
	background-color: #000000;
  border: 1px solid #ffffff;
}
.auteurmodal .modal-header { border-bottom: 0 none; }
.auteurmodal .authtitle  {	font-size: 1.2em; }
.auteurmodal .authbody   {	text-align:justify; }
.auteurmodal .modal-footer {	border-top: 0 none; }

.alertmodal { border:1px solid #c0c0c0; }
.alertmodal .modal-header { background-color:#ca3547; color:#ffffff; border:1px solid #c0c0c0; }
.alertmodal .alerttitle   {	font-size: 1.2em; font-weight:bold; }
.alertmodal .alertbody    {	color:#000000; }

.opgemerktmodal {
	background-color: #000000;
  border: 1px solid #00ef60;
  width:300px;
}
.opgemerktmodal .modal-header  { border-bottom: 0 none; background-color:#000000; }
.opgemerktmodal .opgemerkttit  { font-size: 1.1em; margin: 0 auto; color:#00ef60; }
.opgemerktmodal .opgemerktbody { text-align:center; background-color:#000000; }
.opgemerktmodal .modal-footer  { border-top: 0 none;  background-color:#000000; }
.opgemerktimg                  { border:1px solid #ffffff; }

.img_r { padding-left: 10px; float:right; border:0px; position:relative; }
.img_l { padding-right: 10px; float:left; border:0px; position:relative; }

.img_r span { visibility:hidden; position:absolute; left:10px; bottom:10px; background-color:#d3d3d3; color:#000000; padding:5px; font-weight:bold; opacity: 0.9; }
.img_r:hover span { visibility:visible; }

.img_l span { visibility:hidden; position:absolute; left:0px; bottom:10px; background-color:#d3d3d3; color:#000000; padding:5px; font-weight:bold; opacity: 0.9; }
.img_l:hover span { visibility:visible; }



/* +----------------------------+ */
/* | Styling for navigation bar | */
/* +----------------------------+ */
.navbar { background-color: #aa0000; border-color: #8a0000; }
.navbar .navbar-brand { color: #d7e2e9; }
.navbar .navbar-text { color: #ffffff; }
.navbar .navbar-nav > li > a { color: #ffffff; font-family: 'Ubuntu Condensed', sans-serif; letter-spacing:1px;}
.navbar .navbar-nav > li > a:hover, 
.navbar .navbar-nav > li > a:focus { color: #c0c0c0; }
.navbar .navbar-nav > .active > a,
.navbar .navbar-nav > .active > a:hover, 
.navbar .navbar-nav > .active > a:focus { color: #ffffff; background-color: #800000; }
.navbar .navbar-brand { font-family: 'Open Sans Condensed', sans-serif; color:#ffffff }
.navbar .navbar-brand .brandpart2 { color:#ffff00; }
.navbar .navbar-toggle { border-color: #ffffff; }
.navbar .navbar-toggle:hover, 
.navbar .navbar-toggle:focus { background-color: #425766; }
.navbar .navbar-toggle .icon-bar { background-color: #d7e2e9; }
.navbar .navbar-collapse, { border-color: #d7e2e9; }
.navbar .navbar-toggler { border-color: rgb(255,255,255); }
.navbar .navbar-toggler-icon { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E"); }
/*
.navbar-default .navbar-nav > li > .dropdown-menu { background-color: #69899f; }
.navbar-default .navbar-nav > li > .dropdown-menu > li > a { color: #ffffff; }
.navbar-default .navbar-nav > li > .dropdown-menu > li > a:hover,
.navbar-default .navbar-nav > li > .dropdown-menu > li > a:focus { color: #ffffff; background-color: #FF5353; }
.navbar-default .navbar-nav > li > .dropdown-menu > li > .divider { background-color: #FF5353; }
.navbar-default .navbar-nav > .open > a, 
.navbar-default .navbar-nav > .open > a:hover, 
.navbar-default .navbar-nav > .open > a:focus { color: #ffffff; background-color: #FF5353; }
.navbar-default .navbar-link { color: #ffffff; }
.navbar-default .navbar-link:hover {  color: #ffffff; }
*/

/* +------------------------------+ */
/* | Styling for albums accordeon | */
/* +------------------------------+ */
.card { margin-top:5px; border:0px; }
.card-header { color:#ffffff; padding-top:2px; padding-bottom:2px; background-color:#aa0000; } 
.card-body   { color:#ffffff; padding-top:0px; padding-bottom:0px; background-color:#000000; 
	             border-left:1px solid #404040; border-right:1px solid #404040; }
.lastdiv     { border-bottom:1px solid #404040; padding-bottom:2px; }	             
a.albumlink:link, a.albumlink:visited, a.albumlink:focus { color:#ffffff; }

.albumcover   { margin-top:20px; width:200px; }
.albuminfo    { margin-top:20px; padding-left:20px; }

ul.repertoire { font-size:12px; color:#aaaaaa; margin-left:-15px; }
.reptitel     { color:#00ef60; font-size:14px; }
.repdiv       { padding-top: 15px; }
a.auteurs:link, a.auteurs:focus, a.auteurs:visited { color:#ff8000; } 
a.auteurs:hover { color:#FFC184; }
a.goToPage:link, a.auteurs:focus, a.goToPage:visited { color:#ff8000; } 
a.goToPage:hover { color:#FFC184; }

@media (min-width: 100px) { 
	.weekreeks  { margin-top:400px; }
	.weektitel  { margin-top:440px; } }   
   
@media (min-width: 600px) { 
	.albuminfo  { padding-left:230px; margin-top:-250px; } }

@media (min-width: 850px) { 
  .navbar .navbar-nav .open .dropdown-menu > li > a { color: #d7e2e9; }
  .navbar .navbar-nav .open .dropdown-menu > li > a:hover, 
  .navbar .navbar-nav .open .dropdown-menu > li > a:focus { color: #e5dbdb; }
  .navbar .navbar-nav .open .dropdown-menu > .active > a, 
  .navbar .navbar-nav .open .dropdown-menu > .active > a:hover, 
  .navbar .navbar-nav .open .dropdown-menu > .active > a:focus { color: #e5dbdb; background-color: #425766; }
  .introimg     { display:block; }
  .introtext    { margin-top:0px; }
  .albumcover   { margin-top:0px; width:200px; }
  .modal-xl     { width: 90%; max-width:1200px; }  
  .albuminfo    { padding-left:100px; margin-top:-5px; } }

@media (min-width: 1350px) { 
  .albuminfo  { padding-left:75px; margin-top:-5px; }
	.mainbanner { display: block; } }

@media (min-width: 1800px) { 
	.albuminfo  { padding-left:20px; margin-top:0px; } }