/* 
    Created on : 14-mei-2019
    Author     : WebandPC.be
    all rights included
*/



/* fonts */

/* marmelad-regular - latin */
@font-face {
    font-family: 'Marmelad';
    font-style: normal;
    font-weight: 400;
    src: url('../../../assets/fonts/marmelad-v8-latin-regular.eot'); /* IE9 Compat Modes */
    src: local('Marmelad'), local('Marmelad-Regular'),
        url('../../../assets/fonts/marmelad-v8-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../../../assets/fonts/marmelad-v8-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
        url('../../../assets/fonts/marmelad-v8-latin-regular.woff') format('woff'), /* Modern Browsers */
        url('../../../assets/fonts/marmelad-v8-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../../../assets/fonts/marmelad-v8-latin-regular.svg#Marmelad') format('svg'); /* Legacy iOS */
}

/* dosis-regular - latin */
@font-face {
    font-family: 'Dosis';
    font-style: normal;
    font-weight: 400;
    src: url('../../../assets/fonts/dosis-v8-latin-regular.eot'); /* IE9 Compat Modes */
    src: local('Dosis Regular'), local('Dosis-Regular'),
        url('../../../assets/fonts/dosis-v8-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../../../assets/fonts/dosis-v8-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
        url('../../../assets/fonts/dosis-v8-latin-regular.woff') format('woff'), /* Modern Browsers */
        url('../../../assets/fonts/dosis-v8-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../../../assets/fonts/dosis-v8-latin-regular.svg#Dosis') format('svg'); /* Legacy iOS */
}


/* centers the content of the items inside a row */
.col-sm{
    text-align: center;
}

/* navigation */
.leftsidenavbar{
    position: fixed;
    border-radius: 10px 10px 10px 10px;
    -moz-border-radius: 10px 10px 10px 10px;
    -webkit-border-radius: 10px 10px 10px 10px;
    border: 0px none #000000;
    padding: 1em;
    background-color: #fff;
    margin-left: 5%;
    max-width: 15%;
}
.leftsidenavbar a {
    color: black;
}
.leftsidenavbar ul {
    margin-top: 1em;
}

.selectedcategory{
    font-size: large;
    margin-left: -20%;
    margin-right: 20%;
    padding: 0 10px;
}
.selectedcategory a {
    margin-left: 20px;
    min-width: 110px;
}

#logoleftnav{
    width: 150px;
}

.summary{
    padding-top: 2em;
    text-align: justify;
}
.yellowlink{
    color: black;
    font-size: large;
    font-family: 'Marmelad';        
}
ul > li > ul{
    margin-left: 25px;
}

article{
    background-color: #fff;
    margin: 0 auto;
    margin-bottom: 2em;
    padding: 1em;
    border-radius: 10px 10px 10px 10px;
    -moz-border-radius: 10px 10px 10px 10px;
    -webkit-border-radius: 10px 10px 10px 10px;
    border: 0px none #000000;
    color: black;
}

#topofblog{
    margin-top: 3em;
    margin-bottom: 1em;
    margin-left: auto;
    margin-right: auto;
}
.articletitle{
    margin-top: 0.75em; 
    border-radius: 10px 0px 0px 10px;
    -moz-border-radius: 10px 0px 0px 10px;
    -webkit-border-radius: 10px 0px 0px 10px;
    border: 0px solid #000000;
    margin-left: 8%;
}
.row{
    margin-left: auto;
    margin-right: auto;
}

.articleimage{
    height: 100%;
    width: 100%;
    max-height: 300px;
    max-width: 300px;
}

footer{
    border-radius: 10px 10px 10px 10px;
    -moz-border-radius: 10px 10px 10px 10px;
    -webkit-border-radius: 10px 10px 10px 10px;
    color: black;
    background-color: #FCD612;
    line-height: 40px;
}
footer a {
    color: black;
}


@media only screen and (max-width: 1650px) {
    .leftsidenavbar {
        visibility: hidden;
    }
}

@media only screen and (max-width: 600px) {
    .leftsidenavbar {
        visibility: hidden;
    }
    img{
        max-width: 100%;
        height: 100%;
    }
    .articletitle{
        margin: 0 auto;  
        margin-top: 5px;
        border-radius: 10px 10px 10px 10px;
        -moz-border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        text-align: center;
    }
}


/* temp. under construction TODO remove */ 
#underconstruction {
    border-radius: 20px 20px 20px 20px;
    -moz-border-radius: 20px 20px 20px 20px;
    -webkit-border-radius: 20px 20px 20px 20px;
    border: 0px solid #000000;
}