/*
Theme Name: EmmaK
*/

@font-face {
    font-family: 'archiaregular';
    src: url('assets/fonts/archia-regular-webfont.eot');
    src: url('assets/fonts/archia-regular-webfont.eot?#iefix') format('embedded-opentype'),
    url('assets/fonts/archia-regular-webfont.woff2') format('woff2'),
    url('assets/fonts/archia-regular-webfont.woff') format('woff'),
    url('assets/fonts/archia-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

html {
    scroll-behavior: smooth;
    margin-top: 32px;
}
body {
    background-color: #050517;
    color: #050517;
    scroll-behavior: smooth;
    font-family: "archiaregular", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}
h1, h2 {
    font-family: "archiaregular", serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-color: #FBF5EE;
}
.grid-info {
    font-family: "space mono", serif;
    font-optical-sizing: auto;
    font-weight: 300;
    font-size: 75%;
    font-style: normal;
    font-color: #FBF5EE;
}

.grid div {
    overflow: hidden
}

#introduction {
    margin-top: 0;
    margin-bottom: 0;
}

article:first-child {
    margin-top: 2em;
    margin-bottom: 1em;
}

#sidebar, #main {
    text-align: left;
    padding: 0 2em;
}
#main {
    background-color: #FFFCF9;
    border-radius: 20px;
    margin-right: 2em;
    padding-bottom: 2em; 
}
#sidebar .navigation {
    padding-top: 6em;
    text-transform: uppercase;

}
#sidebar .fixed-top {
    /* border: 1px solid red; */
    width: 25%;
}
#sidebar ul li.category {
    font-weight: 400;

}
#introduction .ehead {
}
#sidebar h2 {
    color: #FCF8F3;
    padding-left: 1em;

}
#sidebar ul {
    color: #FCF8F3;
    list-style-type: none;
    padding: 0;
    margin: 0;
    padding-left: 2em;
}
#sidebar ul ul { 
    font-weight: 400;
    font-size: 100%;
}
#sidebar ul li {
    font-size: 100%;
}
#sidebar ul a {
    text-decoration: none;
    color: #FCF8F3;
}
#sidebar ul a:hover {
    text-decoration: underline;
    text-decoration-color: #FCF8F3;
}
video, img {
    border-radius: 20px; 
}
#footer {
    text-align: center;
    margin: 2em;
}
article {
    margin: 2em 0;
    padding: 0 1em;
}
p.backtotop {
    text-align:right;
}
#main .circle {
    text-align: right;
}
.circle {
    display: inline-block;
    line-height: 0px;
    border-radius: 50%;
    font-size: 200%;
    background-color: #050517;
    color: white;
}

.circle span {
    display: inline-block;
    padding-top: 50%;
    padding-bottom: 50%;
    margin-left: 16px;
    margin-right: 16px;
    color: white;
} 
.circle span a {
    color: white;
    text-decoration: none;
}
p.etext {
    margin: 0;
    font-size: 150%;
    line-height: 1.25;
}
p.ehead {
    padding: 0;
    margin: 0;
    margin-top: 2em;

}
p.etitle {
    padding: 0;
    margin: 0;
    font-size: 200%
    
}
p.esub {
    padding: 0;
    margin: 0;
}
.layout-margins-1 {
    margin-left: 4em;
}
.layout-margins-2 {
    margin-right: 4em;
}
.portrait {
    text-align: right;
    margin-left: 4em;
}
a {
    color: #050517;
}
hr {
    margin: 2em 0;
}
.assets-formaat-2 {
    width: 100%
}
.entries {
    text-align: right;
}
#footer {
    color: #FBF5EE;
}


@media only screen and (max-width: 1180px) and (orientation: portrait)  {
    body {
	font-size: 85%;
    }
    #sidebar ul ul { 
	font-size: 85%;
    }
    #sidebar ul li {
	font-size: 85%;
    }
}

@media only screen and (max-width: 800px) {
    html {
	margin-top: 0;
    }
    [class*="col-"] {
	width: 100%;
    }
    .layout-margins-1 {
	margin-left: 0;
    }
    body {
	background-color: #FFFCF9;
	font-size: 75%;
    }
    #sidebar {
	display: none;
    }
    .portrait {
	margin: 0;
	text-align: left;
    }
    #footer {
	color: #050517;
    }
    .entries {
	display: none;
	text-align: left;
    }
}