/* ---------------------------- Nieuwe CSS ----------------------------*/


	/* Variabelen */
:root {
	--BackgroundColor: #272e43;
	--MainTextColor: #FDB714;
  	--SuccesBackground: #144210;
    --SuccesText: #B2ECAC;
  	--EditBackground: #0071E3;
  	--FailBackground: #A10702;
    --FailText: #FEC5C3;
	--AppleShadowClose: 0 5px 10px rgb(0 0 0 / 20%);
    --AppleShadowHover:  0 10px 18px rgb(0 0 0 / 30%);
    --AppleBorder: 1px solid rgba(0, 0, 0, 0.1);
    --GlobalBorderRadius: 10px;
    
}

/* Begin CSS van de grote lijnen */
div {
	color: var(--MainTextColor);
}

/* UI mobile login jump fix */

body.has-overlay {
    position: unset;
    max-width: 100%;
}

.container {
    width: 100%;
}

body {
    margin-left: 15%;
    margin-right: 15%;
	background-color: var(--BackgroundColor);
}

footer {
    padding-top: 20px;
	background-color: transparent;
}

header {
    padding: 2%;
    margin-top: 20px;
	margin-bottom: 20px;
    border-radius: var(--GlobalBorderRadius);
    box-shadow: var(--AppleShadowClose);
}


header:hover {
    box-shadow: var(--AppleShadowHover);
}

section#content .content-header h2{
	color: var(--MainTextColor);
}

a {
	color: var(--MainTextColor);
}

.btn-primary {
    font-weight: bold;
    color: var(--BackgroundColor);
    background-color: var(--MainTextColor);
    border-color:  var(--MainTextColor);
    border-radius: var(--GlobalBorderRadius);
}
.btn-primary:hover {
    box-shadow: var(--AppleShadowHover);
    color: var(--BackgroundColor);
    background-color: var(--MainTextColor);
    border-color:  var(--MainTextColor);
}

/* Extra button instellingen*/
.btn {
    padding: 10px 12px;
    font-weight: bold;
    transition: .25s ease-in;
}

.btn-link {
    background-color: var(--MainTextColor);
    color: var(--BackgroundColor);
    font-weight: bold;
    border-radius: var(--GlobalBorderRadius);
    padding: 6px 12px;
    box-shadow: var(--AppleShadowClose);
}

/* Hover over button*/
.btn-link:hover, .btn-link:focus {
    color: var(--BackgroundColor);
    text-decoration: underline;
    background-color:  #b88204;
    box-shadow: var(--AppleShadowHover);
}

/* Einde CSS in grote lijnen */


.sf-menu a {
	color: var(--MainTextColor);
}

section#copyright {
	background-color: var(--BackgroundColor);
}

section#content .content-header.content-header-background{
	height: 185px;
}

/* Begin CSS van de footer*/
footer a {
	color: var(--MainTextColor);
    opacity: 0.9
}

/* Footers padding, margin en shadow */
footer [class*='col'] {
    margin-bottom: 24px;
    padding: 2%;
    box-shadow: var(--AppleShadowClose);
    transition: ease .3s !important;
    border-radius: var(--GlobalBorderRadius);
}

footer [class*='col']:hover {
    box-shadow: var(--AppleShadowHover);
}

.col-sm-4 {
    width: 100%;
}

section#content>.container>.row {
    box-shadow: var(--AppleShadowClose);
    transition: ease .3s !important;
}
section#content>.container>.row:hover {
    box-shadow: var(--AppleShadowHover);
}

element.style {
    background-color: #272e43;
}

dl.headlines.headlines-footer dd a {
    color: var(--MainTextColor);
}

footer .text-muted {
    color: var(--MainTextColor);
}

/* Footer desktop CSS*/
@media (min-width: 768px)
.footer [class*='col'] {
    margin-bottom: 24px;
    margin-right: 3.33333333333%;
    padding: 2%;
    box-shadow: var(--AppleShadowClose);
    transition: ease .3s !important;
    border-radius: var(--GlobalBorderRadius);
}

/* Sponsor vak */
.sponsors li {
    padding: 0 15px;
    width: 100%;
}

@media (min-width: 768px)
.col-sm-4 {
    width: 30%;
}
/* Einde CSS van de footer*/

/* Begin CSS van de header*/


.top-mobile a {    
    background-color: #DFF8EB;
    color: var(--MainTextColor);
    padding: 10px;
    border-radius: 10px;
    font-weight: bold;
    font-size: 15px;
    font-family: "Open sans",sans-serif;
    text-align: center;
}

#carousel-homepage.carousel .carousel-inner {
	background-color: transparent;
}

#carousel-homepage.carousel--small {
    border-radius: 10px;
    box-shadow: var(--AppleShadowClose);
    transition: ease .3s !important;
}

#carousel-homepage.carousel--small:hover {
    box-shadow: var(--AppleShadowHover);
}

.top-mobile {
	border-top: none;
        border-top-width: initial;
        border-top-style: none;
        border-top-color: initial;
}

header .container .header-nav-top {
    margin-top: 20px;
}
/*
header.hide-navbar {
    transform: translateY(60%);
    box-shadow: var(--AppleShadowClose);
}

/* Scrollende 

header.scroll-navbar {
    transform: translateY(60%);
    box-shadow: var(--AppleShadowClose);
}
*/

/* Einde CSS van de header*/


/* Begin body content*/
section#content>.container>.row {
    border-radius: var(--GlobalBorderRadius);
    box-shadow: var(--AppleShadowClose);
    transition: ease .3s !important;
}


section#content .content-header.content-header-background {
    border-radius: var(--GlobalBorderRadius);
    box-shadow: var(--AppleShadowClose);
    transition: ease .3s !important;
    margin-bottom: 20px;
}

section#content .content-header.content-header-background:after {
    background: transparent;
}


section#content .content-header.content-header-background:hover {
    box-shadow: var(--AppleShadowHover);
}

/* News line transparent*/
hr {
    border-top: transparent; */
}

/* News plaatje ronde borders*/
.publication-item .embed-responsive .embed-responsive-img {
    border-radius: var(--GlobalBorderRadius);
}

/* Content navigation hover*/
.aside ul#submenu li a:hover, .aside ul.submenu li a:hover, .aside ul#submenu li a:focus, .aside ul.submenu li a:focus {
    background-color: #171A27;
}


/* Aanmelden tag*/
.meta-list .meta-tag {
	border-radius: var(--GlobalBorderRadius);
    font-weight: bold;
}

/* Aanmelden mogelijk*/
.meta-list .meta-tag.is-success {
    background: var(--SuccesBackground);
    color: var(--SuccesText);
}

/* Aanmelden keuze blauwe achtergrond*/
.table-striped>tbody>tr:nth-of-type(odd) {
    background-color: transparent;
}

/* Aanmelden keuze witte streep weghalen */
.table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th, .table>thead>tr>td, .table>tbody>tr>td, .table>tfoot>tr>td {
    border-top: transparent;
}

/* Aanmelden ticket beschikbaar*/
.label-success {
    background-color: var(--SuccesText);
    color: var(--SuccesBackground);
    font-size: 14px;
}

/* Kies knop*/
.btn.btn-default {
    color: var(--BackgroundColor);
    font-size: 14px;
    padding: .2em .6em .3em;
    padding-top: 0.4em;
    padding-right: 0.6em;
    padding-bottom: 0.4em;
    padding-left: 0.6em;
    background-color: var(--MainTextColor);
    border-radius: var(--GlobalBorderRadius);
    border-color: transparent;
}

/* Deelname*/
/* Deelname bewerken knop*/
a.btn.btn-default.btn-block.btn-condensed {
    background-color: var(--EditBackground);
    color: white;
}

/* Deelname annuleren knop*/
a.btn.btn-primary.btn-block {
    background-color: var(--FailBackground);
    color: var(--FailText);
    border-color: transparent;
    font-size: 14px;
}


/* Einde body content*/


/* Begin CSS van het Submenu*/
header .sf-menu .has-submenu.is-active>ul {
    background: var(--BackgroundColor);
    box-shadow: none;
}

#submenu a {
    color: var(--MainTextColor);
    font-weight: normal;
}

.aside ul#submenu li.active>a, .aside ul.submenu li.active>a {
    background-color: var(--BackgroundColor);
    font-weight: bolder;
    color: var(--MainTextColor);
}

/* De onhover van het menu */
.sf-menu ul li {
    background-color: var(--BackgroundColor);
    border-bottom: 1px solid transparent;
}

/* De onderste border terwijl onhover van het menu */
.sf-menu>li>ul {
    border-top: 2px solid transparent;
    border-bottom: 2px solid transparent;
}

/* De onderste border terwijl onhover van het menu */
.sf-menu ul li:hover, .sf-menu ul li:focus{
    background: #171A27;
}

/* De borders van het zijmenu */
.aside ul#submenu li a, .aside ul.submenu li a {
    border-bottom: 1px solid #171A27;
}
/* Einde CSS van het submenu*/

/* Begin CSS voor de account aanmaken module */
.help-block {
    display: block;
    margin-bottom: 10px;
    color: var(--MainTextColor);
    opacity: 0.9;
}

legend {
    font-size: 20px;
    color: var(--MainTextColor);
    padding-bottom: 10px;
}


/* Einde CSS voor de account aanmaken module */


/*Begin copyright*/
section#copyright {
    width: 100%;
    padding: 20px;
    border-top: none;
    border-radius: var(--GlobalBorderRadius);
    box-shadow: var(--AppleShadowClose);
    transition: ease .3s !important;
}

section#copyright:hover {
    box-shadow: var(--AppleShadowHover);
}
/*Einde copyright*/

/* CSS van huidige site*/
/* Inloggen knop */
header .container .header-nav-top .login p a {
    background-color: var(--EditBackground);
    color: white;
    padding: 10px;
    border-radius: 10px;
    font-weight: bold;
    margin-top: 10px;
}

header .container .header-nav-top .login p a:not(:first-child) {
    background-color: var(--FailBackground);
    color: var(--FailText);
    padding: 10px;
}

header .container .header-nav-top .login p a:not(:last-child) {
    padding: 10px;
}

header .container .header-nav-top .login p {
    color: transparent;
} 

.container {
    width: 100%;
    margin-top: 20px;
}

.top-mobile a {
    margin-bottom: 12px;
    font-size: 15px;
    background-color: #0275d8;
    color: white;
    padding: 10px;
    border-radius: 10px;
    font-weight: bold;
    margin-top: 10px;
}

.top-mobile a:not(:first-child){
    background-color: #d9534f;
}

/* Begin kalender */


/* Einde kalender */