/*  Default Styles
 ----------------------------------------*/
html {
    height: 100%;
    font-size: 62.5%;
}

body {
    margin: 0;
    padding: 0;
    background-color: #6C0000;
    font-family: 'Open Sans';
}

ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

header {
    position: fixed;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 8rem;
    top: 0;
    left: 0;
}

h1 {
    font-size: 2.4rem;
    letter-spacing: .07em;
    color: #F2F2F2;
}

#logo {
    margin-left: 7rem;
}

#logo a:link,
.hd-name {    
    color: #FFFFFF;
    font-size: 3rem !important;
    font-weight: 300;
    letter-spacing: .1em !important;
    text-shadow:0px 0px 0 rgb(224,224,224),1px 0px 0 rgb(203,203,203),2px 0px 0 rgb(183,183,183), 3px 0px 0 rgb(163,163,163),4px 0px 3px rgba(0,0,0,0.05),4px 0px 1px rgba(0,0,0,0.5),0px 0px 3px rgba(0,0,0,.2);
}

.hd-name {
    position: absolute;
    top: 2rem;
    left: 7rem;
}

header a:link,
#menu-lang a:link {
    display: inline-block;
    text-decoration: none;
    color: #FFFFFF;
}

header a:visited,
#menu-lang a:visited {
    text-decoration: none;
    color: #FFFFFF;
}

header a:hover:after,
#menu-lang a:hover:after {
    text-decoration: none;
    width: 100%;
    background: #E0E0E0;
}

header a:active,
#menu-lang a:active {
    text-decoration: none;
}

header a:after,
#menu-lang a:after {
    content: '';
    display: block;
    margin: auto;
    height: .1rem;
    width: 0;
    background: transparent;
    transition: width .3s ease-out, background-color .3s ease-out;
}

header nav {
    margin-right: 5rem;
}

header nav > ul > li {
    display: inline-block;
}

header nav a:link {
    margin-left: 1.5rem;
    font-size: 1.4rem;
    letter-spacing: .07em;
    font-weight: 400;
}

header nav a:visited {
    color: #FFFFFF;
}

.menu-item {
    position: relative;
}

.menu-sub {
    position: absolute;
    visibility: hidden;
    opacity: 0;
    top: 100%;
    left: 0;
    min-width: 15rem;
    padding-top: 1em;
    transform: translateY(-1em);
    z-index: -1;
    transition: all 0.3s ease-out 0s;
}

.menu-item:hover .menu-sub {
    visibility: visible;
    opacity: 1;
    z-index: 1;
    transform: translateY(0%);
    transition-delay: 0s, 0s, 0.3s; /* this removes the transition delay so the menu will be visible while the other styles transition */
}


#menu-lang {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 7rem;
    margin: auto;
    height: 10em;
}

#menu-lang a:link {
    margin-bottom: 1em;    
    font-size: 1.7rem;
    font-weight: 400;
}

.page-wrap {
    overflow: auto;
    box-sizing: border-box;
    width: 80%;
    max-width: 120rem;
    margin-top: 12rem;
    margin-right: auto;
    margin-bottom: 5rem;
    margin-left: auto;
}

.page-wrap div {
    font-size: 1.4rem;
    color: #F2F2F2;
    letter-spacing: .02em;
}








#img-home {
    position: absolute;
    top: 12rem;
    left: 0;
    right: 0;
    margin: auto;
    max-width: 50rem;
    height: auto;
    max-height: calc(100vh - 120px);
}



/*  News
 ----------------------------------------*/

#news-list li {
    overflow: hidden;
    margin-bottom: 3rem;
}

#news-list img {
    width: 20%;
    height: auto;
    float: left;
    margin-right: 1rem;
    margin-bottom: 1rem;
}

#news-list h2 {
    margin: 0;
    font-weight: normal;
    font-size: 2.2rem;
    letter-spacing: .02em;
    color: #FFFFFF;
    
}

#news-list .item-date {
    margin-bottom: 1.5rem;
}

#news-list .item-descr {
    text-align: justify;
    font-size: 1.3rem;
    line-height: 1.3em;
}