@import url("css/normalize.css");

:root {
 --textfont: Arial, Helvetica, sans-serif;
 --headingsfont: 'Dosis', Arial, Helvetica, sans-serif;

 --primarycolor: #da9601;
 --secondarycolor: #6b4a03;
 --lightgrey: #fcf8e1;
 --grey: #fcf8e1;
 --darkgrey: #666;

 --textcolor: #222;
 --bordercolor: #aaa;
 --headingscolor: var(--primarycolor);
 --linkcolor: var(--secondarycolor);
 --linkhovercolor: #805B15;
 --headercolor: transparent;
 --pagecontainerbackgroundcolor: #fff;
 --menubackground: var(--primarycolor);
 --formheaderback: #226765;
 --menulinkhoverback: #aaa;
 --menulinkactiveback: #ccc;
 --sidebarbackgroundcolor: #9c3b05;

}


@font-face {
  font-family: 'Dosis';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/dosis-v7-latin-regular.eot'); 
  src: local('Dosis Regular'), local('Dosis-Regular'),
       url('fonts/dosis-v7-latin-regular.eot?#iefix') format('embedded-opentype'), 
       url('fonts/dosis-v7-latin-regular.woff2') format('woff2'), 
       url('fonts/dosis-v7-latin-regular.woff') format('woff'), 
       url('fonts/dosis-v7-latin-regular.ttf') format('truetype'), 
       url('fonts/dosis-v7-latin-regular.svg#Dosis') format('svg'); 
}

@font-face {
  font-family: 'Dosis';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/dosis-v7-latin-700.eot'); 
  src: local('Dosis Bold'), local('Dosis-Bold'),
       url('fonts/dosis-v7-latin-700.eot?#iefix') format('embedded-opentype'), 
       url('fonts/dosis-v7-latin-700.woff2') format('woff2'), 
       url('fonts/dosis-v7-latin-700.woff') format('woff'), 
       url('fonts/dosis-v7-latin-700.ttf') format('truetype'), 
       url('fonts/dosis-v7-latin-700.svg#Dosis') format('svg'); 
}

body {
 font-family: var(--textfont);
 color: var(--textcolor);
 line-height: 1.5;
 background: #eee;
}

h1, h2, h3, h4, h5, h6 {
 font-family: var(--headingsfont);
 color: var(--headingscolor);
}

.container {
 max-width: 1120px;
 margin-left: auto;
 margin-right: auto;
}

.pageContainer {
 background: var(--pagecontainerbackgroundcolor);
 clear: both;
}

#page {
 padding: 15px;
 width: 100%;
 box-sizing: border-box;
}

#breadcrumb {
 font-size: 80%;
}

.breadcrumb-divider: before {
 content: ">";
 padding-left: 0;
 padding-right: 0;
}

#main {
 min-height: 100px;
 clear: both;
 padding-bottom: 1em;
}

#header{
 margin-top: 10px;
}

h1#pagename{
 margin: 0;
}

label {
 white-space: nowrap;
}



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

a:hover {
 text-decoration: underline;
 color: var(--linkhovercolor);
}

a:hover: not(.button) {
 opacity: 1;
}

a.otherlanguagelink {
 font-weight: bold;
 text-decoration: none;
 border-bottom: 1px dotted var(--grey);
}

a.nopagelink {
 text-decoration: none;
 border-bottom: 1px dotted var(--grey);
}





.navContainer {
 padding: 0;
}

.navContainer nav {
 padding: 0; }

.navContainer nav.main {
 padding-left: 10px;
 background-color: var(--menubackground);
}

.navContainer nav.main a {
 color: #FFFFFF;
 margin-right: 10px;
 text-decoration: none;
 padding: 8px;
 display: inline-block;
}

.navContainer nav.main a:hover {
 background: var(--menulinkhoverback);
}

.navContainer nav.main a.active {
 background: var(--menulinkactiveback);
}

.navContainer nav.main .menu-item {
 padding: 10px;
}

#hyphaCommands {
 text-align: right;
 width: 100%;
}

#hyphaCommands a {
 background:#ddd;
 padding: 5px 10px;
 display: inline-block;
 text-decoration: none;
}

#hyphaCommands a:hover {
 background: #aaa;
 color: #fff;
}

#hyphaCommands .menu-item {
 padding-right: 10px;
}





.headerContainer {
 background-color: var(--headercolor);
}

.headerContainer.flex {
 justify-content: flex-start;
}

.headerContainer.flex div {
 align-self: center;
 padding-bottom: 0;
 flex: 0 1 auto;
}

.headerContainer p {
 font-weight: bold;
 font-size: 24pt;
 color: #fff;
 margin: 0;
 padding: 15px;
}

.headerContainer .logo {
 padding-left: 0;
}



#login {
 float: right;
 text-align: right;
 margin: 0;
 padding: 0 0 0 10px;
 display: none;
}

.pageTopContainer {
 justify-content: space-between;
}

#pageCommands {
 //display: inline-block;
}

#loggedIn {
 color: #555;
 margin-left: 10px;
 padding: 5px;
 display: inline-block;
}


#langList {
 display: inline-block;
 text-align: right;
 float: right;
}

#langList .disabled {
 color: #8f8f8f;
}

#langList .selected {
 font-weight: bold;
}

.language: last-child{
 margin-right: 0px;
}

.language a{
 padding: 5px;
 text-decoration: none;
 margin: 0 5px;
 display: inline-block;
}

.language a:hover{
 background: #aaa;
 color: #FFFFFF;
}




.card header {
 color: #FFFFFF;
 background: var(--formheaderback);
}



.below-page{
    border-top: 1px dotted grey;
}

#tagList .prefix{
    margin-left: 10px;
    margin-bottom: 5px;
    font-size: 80%;
}

.selectedTags {
    display: flex;
}

.selectedTags .delete-tag {
    color: #8f0000;
    cursor: pointer;
}

.remainingTags {
    padding: 0;
    font-size: 80%;
}

div[class^='tagSel']{
    padding: 5px 10px;
    margin-bottom: 5px;
    background: var(--secondarycolor);
    background: lightyellow;
    margin-right: 10px;
    color: white;
    color: grey;
    font-weight: bold;
    font-size: 80%;
    border-radius: 6px;
}


#footerContainer {
 padding-bottom: 2em;
 background: #eee;
}

#versionList {
 clear: both;
 float: right;
 margin: 30px 0 10px;
 padding-top: 5px;
 font-size: 80%;
}

#footer {
 padding-top: 5px;
 margin-top: 5px;
 width: 100%;
 clear: both;
 margin: 0.5em 0 0 0;
 text-align: right;
 margin-bottom: 45px;
 font-size:90%;
}



#popup {
 position: absolute;
 top: 50px;
 background: #FFFFE0;
 margin-right: auto;
 z-index: 1;
}

#popup table {
 margin: 5px;
}

button, .button{
 min-height: 40px;
 margin-right: 10px;
 padding-right: 20px;
 padding-left: 20px;
 font-weight: bold;
 font-size: 16px;
 background: #999;
 color: #FFFFFF;
 border: none;
 border-radius: 5px;
}

button:hover, .button:hover{
 background: #ddd;
 color: #000000;
}

button: last-of-type{
 margin-right: 0;
}

.login-wrapper{
 padding:15px;
 background-color: #eeeeff;
 border: 1px solid grey;
}

.login-wrapper label{
 font-weight: bold;
}

.login-wrapper label.username,
.login-wrapper label.password{
 width: 150px;
 display: inline-block;
}


.login-wrapper button,
.login-wrapper [type="submit"],
.login-wrapper [type="button"],
.login-wrapper [type="reset"],
.login-wrapper [type="cancel"]{
 -webkit-appearance: none;
 -moz-appearance: none;
 appearance: none;
 border: none;
 background:transparent;
 color: inherit;
}

.login-wrapper .button{
 display: inline-block;
 padding-top: 7px;
 box-sizing: border-box;
}

.login-wrapper .button input{
 margin-bottom: 0;
}

.login-wrapper .forgot-password{
 font-size: 80%;
 margin-top: 10px;
}

.click {
 cursor: pointer;
}

.option {
 color: #888;
}

.divider {
 clear: left;
 height: 10px;
 margin-top: 10px;
 margin-bottom: 10px;
 background-color: #d2691e;
}

#trail {
 clear: left;
 float: left;
 text-align: left;
}

#log {
 margin: 0;
 float: left;
}

#log div {
 clear: left;
 padding: 5px 9px;
}

.edit-button {
 margin: 0 0 0 10px;
}

.editor {
 height: 600px;
 padding-top: 5px;
 clear: left;
}

.clear {
 clear: both;
}

#trail {
 font-size: 8pt;
}

#login {
 font-size: 8pt;
}

#loginForgotPassword {
 font-size: 8pt;
}

#log {
 font-size: 10pt;
 letter-spacing: 0.1em;
}

#log .error {
 color: #b00;
}

#log .success {
 color: #0b0;
}

iframe {
 border: #c0c0c0 solid 1px;
}

iframe.registratie, iframe.gastenboek {
 border: none;
}

code {
 color: #825500;
}
 

img {
 border: 0px;
}

#main img {
 margin: 1.1em 0 0.7em;
 max-width: 100%;
 height: auto;
}

#main img.left {
 float: left;
 margin: 0 13px 10px 0;
}

#main img.right {
 float: right;
 margin: 0 0 10px 13px;
}

#main img.center {
 float: none;
 margin: 0 0 10px 0;
}

#main .group {
 margin: 10px 0 10px 0;
 clear: both;
}
 

.writely-comment {
 border: 1px dashed #C0C0C0;
 font-size: 9pt;
 line-height: 1.4;
 padding: 1px;
 background-color: #D7FFD7;
}

input {
 margin-bottom: 15px;
}

@media (max-width: 959px) {
 #commandForm {
 width: 100%; }

 #navContainer {
 width: 100%; }

 #page {
 //width: 100%; }

 #pagename {
 width: auto; }

 #main {
 width: 100%; }

 h1 {
 //font-size: 2em; }

 #header {
 width: 100%;
 padding: 5px 0;
 }

 #bottomContainer {
 width: 100%; }

 .editor {
 width: 100%; }

 img {
 max-width: 100%; }


 #langList .prefix {
 display: none; }

 #langList .language {
 display: inline-block;
 margin-right: 5px; }
}

.wym_box .wym_area_main .wym_iframe iframe {
 resize: vertical;
 height: 250px;
}

.buttongroup {
 margin-top: 10px;
 margin-bottom: 10px;
}

.right {
 text-align: right;
}

.flex-container-row {
 display: flex;
 flex-flow: row wrap;
}

.space-around {
 justify-content: space-around;
}

.flex-container-column {
 display: flex;
 flex-flow: column wrap;
}

#settingsIntervalDays,
#settingsIntervalHours,
#settingsIntervalMinutes {
 width: 50px;
 display: inline;
}

.memberlist button.edit: before, .memberlist button.delete: before {
 font-family: "fontello";
}

.memberlist button.edit {
 background: #800080;
}

.memberlist button.edit: before {
 content: "\e805";
}

.memberlist button.edit span {
 display: none;
}

.memberlist button.delete {
 background: #FF0000;
}

.memberlist button.delete: before {
 content: "\f2d3";
}

.memberlist button.delete span {
 display: none;
}

.method,
.sources,
.review-comments-wrapper {
 border-top: 1px solid var(--bordercolor);
}

.new-comment label {
 display: block;
}
.new-comment label[for="commenter_name"] {
 display: inline;
}
.new-comment .label_suffix {
 display: inline;
}
.new-comment input[name="commenter_name"] {
 display: block;
}

.type_peer_reviewed_article .published_at .time:before {
 content: '\00a0';
}

.review-comment-wrapper {
 background: #FFFFE0;
 border-bottom: 3px solid var(--bordercolor);
 padding-left: 15px;
 padding-right: 15px;
 margin-bottom: 30px;
}

.review-comment-wrapper ul {
 padding: 0;
}

.review-comment-wrapper li {
 list-style: none;
 padding-top: 10px;
 padding-bottom: 10px;
 padding-left: 30px;
 border-bottom: 1px solid var(--bordercolor);
}

.review-comment-wrapper li.first-comment {
 padding-left: 0;
}

.review-comment-wrapper li p {
 margin: 0;
}
.public-comment-wrapper {
 background: #FFFFE0;
 border-bottom: 3px solid var(--bordercolor);
 padding-left: 15px;
 padding-right: 15px;
 margin-bottom: 30px;
}

.public-comment-wrapper ul {
 padding: 0;
}

.public-comment-wrapper li {
 list-style: none;
 padding-top: 10px;
 padding-bottom: 10px;
 padding-left: 30px;
 border-bottom: 1px solid var(--bordercolor);
}

.public-comment-wrapper li.first-comment {
 padding-left: 0;
}

.public-comment-wrapper li p {
 margin: 0;
}

nav.main{
 z-index: 1;
}

nav.tabs{
 z-index: 1;
}

nav{
 position: relative;
}

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

.logo{
 padding-bottom: 10px;
}

#hyphaNotify{
 position: fixed;
 z-index:999;
 top: 0px;
 right: 0px;
 border: 1px solid var(--primarycolor);
 background: #FFC0CB;
}

#hyphaNotify:empty{
	visibility: hidden;
}

.success {
 padding: 10px;
 background: #00FFCB;
}

table{
 width: 100%;
}

th{
 text-align: left;
}

#sidebar{
 box-sizing: border-box;
 width: 20%;
 min-width: 150px;
 background-color: var(--sidebarbackgroundcolor);
 padding: 15px;
 display: none;
}

.is_home #sidebar{
 display: block;
}

.flex{
 display: flex;
}

.flex.between{
 justify-content: space-between;
}

.reverse{
 flex-direction: row-reverse;
}

textarea{
	font-family: monospace;
	font-size: initial;
}


.festivalTimetable, .festivalTimetable a {
	color: white;
}
.festivalTimetable .timeGridOdd {
	text-align:left;
	vertical-align:top;
}
.festivalTimetable .timeGridOdd {
	text-align:left;
	vertical-align:top;
	background-color:#ddd;
}
.festivalTimetable .tableRowOdd {
	background-color:#fff;
}
.festivalTimetable .tableRowEven {
	background-color:#ddd;
}
.festivalTimetable .tableAct {
	text-align:center;
}
.festivalTimetable .tableRowOddAct {
	background-color:#c63;
	color:#fff;
	font-weight:bold;
}
.festivalTimetable .tableRowEvenAct {
	background-color:#36c;
	color:#fff;
	font-weight:bold;
}
.festivalTimetable .tableRowHeading {
	text-align:left;
	font-weight:bold;
	padding:5px;
}
.festivalTimetable .tableRowHeadingOdd {
	background-color:#ddd;
}
.festivalTimetable .tableRowHeadingEven {
	background-color:#bbb;
}
body.type_peer_reviewed_article .input-wrapper.field_type_editor:not(.field_name_text) .wym_iframe iframe {
	height: 150px;
}

.notelo {
    visibility: visible;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    position: absolute;
    margin-left: -60px;
    opacity: 1;
    z-index: 12;
}
.notelo.up::after {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 50%;
    margin-left: -5px;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #555;
}
.notelo.down::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;

    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #555;
}
.notelo.left::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0%;
    margin-top: -10px;
    margin-left: -10px;

    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-right: 10px solid #555;
}
.notelo.right::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 100%;
    margin-top: -10px;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 10px solid #555;
}
.closebutton {
    position: absolute;
    top: -10px;
    background-color: #ff0000;
    z-index: 15;
}
.closebutton:hover {
    background-color: #ffffff;
}
.closebutton:focus {
    background-color: #ffffff;
    top: -5px;
}
.hyphaInfoButton {
    background-color: #00f;
    border: 2px solid #00f;
    color: #FFF;
    cursor: pointer;
    display: inline-block;
    font-family: arial;
    font-weight: bold;
    top: -15px;
    right: -15px;
    font-size: 15px;
    line-height: 15px;
    width: 15px;
    height: 15px;
    margin-left: 3px;
    margin-right: 3px;
    border-radius: 50%;
    text-align: center;
}
.hyphaInfoButton:hover {
    background-color: #fff;
    color: #00f;
}
.hyphaInfoButton.clicked {
    background-color: yellow;
}
.hyphaInfoButton:before {
    content: 'i';
}

.new-comment textarea{
	width: 100%;
	height: 100px;
}

.share-links{
    width: 116px;
    display: flex;
    justify-content: space-between;
}

.share-links div{
    width: 32px;
    height: 32px;
    display: block;
}

.share-links .email-link{
    background-image: url(images/shareEmail.png);
}

.share-links .twitter-link{
    background-image: url(images/shareTwitter.png);
}

.share-links .facebook-link{
    background-image: url(images/shareFacebook.png);
}
.index-item.is-private:after {
    content: " *";
    color: #b90;
}