/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
    :root {
    font-size: 45%;
    } 
    
    div#mgh_kranz {
        display:none;
    }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
    :root {
    font-size: 50%;
    } 
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
  :root {
    font-size: 57.5%;
    } 
} 

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
  :root {
    font-size: 62.5%;
    } 
} 

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
  :root {
    font-size: 67.5%;
    } 
}


* {
  box-sizing: border-box;
}

html {
    height:100vh;
    max-height:100vh;
    width:100vw;
    max-width:100vw;
    }

body{
    font-family: "Arial", "Tahoma", "Verdana", "Helvetica", sans-serif; 
    font-size: 1.6rem;
    text-align:left;
    height:inherit;
    width:inherit;
    margin: 0;
    padding: 0;
    overflow: auto;
}

#wrapper{
    display:flex;
    flex-direction:column;
    height: inherit;
    width: inherit;
}

#header, #header_wotitle {
    display:flex;
    flex-direction:row;
    flex-shrink:0;
    width: inherit;
    max-width: 100vw;
    height: 12vh;
    top: 0;
    background-color: #555951;
    overflow: hidden;
    white-space: nowrap;
}

#header2 {
    display:flex;
    flex-direction:row;
    height: 8vh;
}

#header2_left {
    width:15vw;
    height:inherit;
}

#header2_header {
    width:84vw;
    height:inherit;
    text-align:center;
    line-height: 8vh;
    font-size: 2.4rem;
    font-weight: bold;
}

#header2_header a {
    color: #555951;
}

#content{
    display:flex;
    flex-direction:row;
    height: 74vh;
}

#footer {
   height: 6vh; 
   line-height: 6vh; 
   flex-shrink:0;
   text-align: center;
   font-size: 1.2rem;
   color: grey;
}


/* ab hier alles zum header */

/* Gesamthöhe header: 16vh*/
 
/* Logo mit Spruch */
/* viewBox="0 0 113.66 78.21"
/* Verhältnis x : y ~ 1,45 : 1 */
 
/* Logo ohne Spruch */
/* viewBox="0 0 113.7 45.9" */
/* Verhältnis x : y ~ 2,45 : 1 */

 
#mgh_logo{
    display: block;
    height: 8vh;
    width: 22.2vh;
    background: url("../img/MGH_Logo_weiss_ohne.svg");
    background-repeat: no-repeat;
    background-size: contain;
    float: left;
    margin-top: 2vh;
    margin-bottom: 2vh;
}

#header_middle {
    flex-grow:2;
    display:flex;
    flex-direction:column;
    padding: 4vh 4vw 2vh 4vw;
}


/* viewBox="0 0 225.71 219.35" */
#mgh_kranz{
    display: block;
    height: 35vh;
    width: 35vh;
    background: url("../img/Kranz_weiss_minus.svg");
    background-repeat: no-repeat;
    background-size: contain;
}


#header_margin_left,
#header_margin_right {
    width:1vw;
}

#mgh_logo a {
    display:block;
    width:inherit;
    height:inherit;
}


#header a {
    color:inherit;
    cursor:pointer;
    text-decoration:none;
}

#header a:hover {
    font-weight:normal;
}


/* links in footer */
#footer a {
    color:grey;
}

#footer a:hover {
    color:blue;
}

/* aber hier zu content */
/* 1. navbar */
div.navbar{
    width: 13vw;
    margin: 0 0 0 1vw;
    height: inherit;
    font-size: 1.2rem;
    overflow-y:auto;
}

#navbar a{
    cursor: pointer;
}

div.navbar_block#tools_ed,
div.navbar_block#goToEdIntro{
    margin-top: 3vh;
}

.navbar_entry{
    width: inherit;
    font-weight: bold;
    background-color: #555951;
    margin-bottom: 2px;
    padding: 5px 5px 5px 10px;
    /*border-radius: 5px;*/
    overflow:hidden;
}

.navbar_subentry{
    font-weight: bold;
    margin-left: 1vw;
    margin-bottom: 2px;
    padding: 2px 2px 2px 10px;
    background-color: white;
    /*border-radius: 5px;*/
    display: block;
    overflow:hidden;
}

#tools_ed .navbar_entry,
#goToEdIntro .navbar_entry,
#navbarEd2 .navbar_entry{
    background-color:#555951;
}

#tools_ed #tools_ed_head {
    color:white;
}

.navbar_entry a,
#versions,
#konks {
    color: white;
    text-decoration: none;
}

.navbar_entry a:hover{
    color:blue;
}

.navbar_subentry a{
    color: #555951;
    text-decoration: none;
}

.navbar_subentry a:hover{
    color: blue;
}

#synch_scroll_up,
#synch_scroll_down {
font-size: 0.8rem;
}

#nav_all_col,
#search_ed{
    width: 6vw;
    font-size: 1.2rem;
}

input {
    font-family: "Arial", "Tahoma", "Verdana", "Helvetica", sans-serif; 
}

.navbar input {
    height: 1.4rem;
    font-size: 1.2rem;
}


/* remove margin-bottom from form elements */
form {
    margin-bottom:0;
}

#navbarEd2 {
    height: inherit;
    overflow-y:hidden;
}

#navbarEd2Wrapper {
    display:flex;
    flex-direction:column;
    height:inherit;
}

#navbarEd2 #back2navbar {
    background-color: #555951;
}

#navbarEd2 .navbarEd2Entry {
    flex-shrink:0;
}

#navbarEd2 #nav_reg {
    overflow-y:auto;
    font-weight:normal;
    background-color: #E3E3E3;
    margin-bottom: 2px;
    padding: 5px 5px 5px 10px;
    /*border-radius: 5px;*/
}


div.table_reg {
    padding-top:1.5em;
    padding-bottom:3em;
    color:black;
}

div.table_regHead {
    font-weight:bold;
    color:black;
}

div.tr_reg {
    margin-bottom:0.2em;
}

span.tr_lemma {
}

span.tr_ref a,
span.tr_ref a:hover{
    color:blue;
}

/* 2. inner content bzw. ed_content*/
#inner_content{
    display:flex;
    flex-direction:column;
    height:74vh;
    width: 84vw;
    margin-left: 1vw;
}

#ed_content {
    display:flex;
    flex-direction:row;
    height:74vh;
    width: 84vw;
    margin-left: 1vw;
}

.col{
    display:flex;
    flex-direction:column;
    height: inherit;
    width: 28vw;
    background-color: white;
}

.col_header{
    width: inherit;
    height: 8vh;
    background-color: white;
    color: #555951;
    overflow:hidden;
    border-top: solid 0.25vh #555951;
    border-bottom: solid 0.25vh #555951;
}

.col_head{
    display:block;
    width:inherit;
    height:4.5vh;
    line-height:4.5vh;
    font-size: 1.8rem;
    text-align:center;
    font-weight: bold;
    overflow: hidden;
    white-space:nowrap;
}

.col_nav{
    display:block;
    width:inherit;
    height:3vh;
    line-height:3vh;
    text-align:center;
    overflow: hidden;
}

.col_nav input {
    height: 2vh;
    font-size: 1.2rem;
}

#col1,
#col2,
#col3{
    width: 10vw;
    text-align:center;
    background-color: white;
    color:black;
    border: solid 1px #555951;
}

.col_text{
    padding: 15px;
    overflow-y: scroll;
    height: 66vh;
}


/* für indexpage */
div#index_content {
    position:relative;
    height:inherit;
    width:84vw;
    margin-left:1vw;
}

div#index_title
{
    position:absolute;
    left:2rem;
    bottom:2rem;
    display:inline-flex;
    flex-direction:column;
    border:none;
    padding:1.5vw;
    text-align: left;
    background-color: rgba(255, 255, 255, 0.8);
    color: #555951;
    font-weight:bold;
    z-index:10;
    overflow:hidden;
}



#index_title p {
    margin:0;
}

#index_author {
    font-size: 2.2rem;
}

#index_ed_title {
    font-size: 2.2rem;
}

#index_editor {
    padding-top:1vw;
}

#index_edition_type {
    
}

#index_publication_date {
    padding-top:0vh;
}

div#index_image {
    width: inherit;
    height: inherit;
    position:absolute;
    }
    
div#papststurz {
    width:inherit;
    height:inherit;
    background-image: url("../img/papststurz.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    border:none;
}

div#index_image_rights {
    position:absolute;
    right:3px;
    top:3px;
    font-size: 1.2rem;
    z-index:5;
    
}

div#index_image_rights p {
    margin-top:0px;
    margin-right:0px;
}

div#index_image_rights a {
    color:white;
    font-weight:bold;
}

div#index_image_rights a:hover {
    color:blue;
    font-weight:bold;
}
