@import url(https://fonts.googleapis.com/css?family=Ubuntu:400,300,500);
@import url(/style/shared/fontawesome.css);
* {
    box-sizing: border-box;
}

body {
    font-family: 'Ubuntu', sans-serif;
    font-size: 16px;
    line-height: 22px;
    background-color: #35a9e0;
    margin: 0;
    padding: 0;
    background-image: url('/img/eco/2018/body-bg5.png');
}

a, a:link, a:focus, a:active, a:visited {
    color: #00b7f3;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

.banner.wrapper {
    margin: 0 auto;
    margin-top: 20px;
    max-width: 960px;
    width: 100%;
    background-color: #fff;
    -webkit-border-radius: 7px 7px 0px 0px;
    -moz-border-radius: 7px 7px 0px 0px;
    border-radius: 7px 7px 0px 0px;
}

.logo {
    padding: 30px 35px 3px;
}



/*==================================
=            Navigation            =
==================================*/

.nav.wrapper {
    margin: 0 auto;
    max-width: 960px;
    width: 100%;
    background-color: #fff;
    text-align: right;
}

.clientNavigation ul {
    margin:  0;
    margin-right: 55px;
    padding: 0;
    list-style-type: none;
}


.clientNavigation ul li {
    display: inline-block;
    /* display: inline-block; */
    padding: 6px 12px;
    margin-right: 6px;
    font-weight: 600;
    text-align: left;
    border-radius: 2px;
    position: relative;
    border: 2px solid #35A9E0;
    transition:all 0.3s ease;
}


.clientNavigation ul li:hover > ul.submenu {
    display: block !important;
    position: absolute;
    width: 15em;
    padding: 0;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;
    text-align: left;
    margin-left: -15px;
    margin-right: 0;
    padding-top: 20px;
}
.clientNavigation ul li:hover > ul.submenu > li {
    display: list-item;
    padding: 8px 0px 8px 2em;
    width: 11em;
    background-color: #fff;
    margin-bottom: 5px;
    border-radius: 2px;
}
.clientNavigation ul li a {
    font-size: 17px;
    font-weight: 600;
    color: #4E4E4E;
    text-decoration: none;
    font-weight: bold;
    display: block;
    font-family:'Ubuntu', Arial, sans-serif !important;
}
.clientNavigation ul li:hover, .clientNavigation ul li:hover > ul.submenu > li:hover {
    background-color: #FFA02F;
    color: #4E4E4E;
    border-radius: 7px;
    outline: 2px #FFA02F;
}

/*=====  End of Navigation  ======*/

.content {
margin: 0 auto;
max-width: 960px;
width: 100%;
background-color: #fff;
padding: 1em;
}

.clientNavigation ul li:hover ul.submenu {
    display: block;
}

.leftcolumn, .rightcolumn {
    display: inline-block;
    float: left;
    width: 50%;
}

.columnheader a {
    font-size: 1.2em;
    color: #999;
    text-decoration: none;
   
}
.columnheader {
 border-bottom: 1px solid  #DDD;
    width: 90%;
    margin: 0 0 .5em 0;
}

.datetime {
    background-color: #22C0F1;
    padding: .5em .25em;
    color: #FFF;
    border-radius: 4px;
    font-size: 1.2em;
}
.datetime i {
    margin: 0 .25em;
}

.persongroup {
    margin: .5em 0;
    font-weight: bold;
}
.persongroup .group, .persongroup .people {
    display: inline;
}

.persongroup .people {
    font-weight: normal;
    font-style: italic;
}

.details {
    background: none repeat scroll 0 0 #E8EDFF; border: 1px solid #9BAFD9; margin: 25px auto; padding: 5px;
}

.item, .paper {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: horizontal;
    -ms-flex-direction: row;
    flex-direction: row;
    margin: 1em 0 0 1em;
}

.papertime {
    max-width: 4em;
    width: 100%;
}

.papertitle {
    max-width: 38em;
    width: 100%;
}
.itemnumber, .papernumber {
    width: 100px;
    margin: 0 .5em;
}
.itemnumber {
    font-weight: bold;
}

.papernumber {
    max-width: 4em;
    width: 100%;
}
.papernumber a {
    width: 100%;
    display: block;
    background-color: #22C0F1;
    color: #FFF;
    padding:.5em .25em;
    border-radius: 4px;
}

h3.time {
    border-bottom: 1px solid #DDD;
}
.footer {
    padding: 1em;
    border-top:1px solid #ececec;
    text-align: center;

}
.footer h3 {
    margin: 0;
    font-weight: lighter;
    font-size: 20px;
}
.footer p {
    color: #929292;
}
.footer a {
    color: #000;
}
.mobileOnly {
    display: none;
}

#mobileMenu {
    display: none;
}
label.mobileOnly {
    cursor: pointer;
    background-color: #F9F9F9;
    padding: .25em;
    color: #5D5D5D;
    fill: #5D5D5D;
}
label.mobileOnly .close {
    display: none;
}
#mobileMenu:checked ~ label .close {
    display: block;
}
#mobileMenu:checked ~ label .open {
    display: none;
}
@media only screen and (max-width: 780px) {
    .mobileOnly {
        display: block;
    }
    .clientNavigation ul {
        display: none;
    }
    .clientNavigation #mobileMenu:checked ~ ul {
        display: block;
    }
    .nav.wrapper {
        text-align: left;
    }
    .clientNavigation ul li {
        display: list-item;
        border: none;
        border-bottom: 1px solid #DDD;
    }
    .clientNavigation ul ul {
        display: none !important;
    }
    .logo {
        padding: 30px 0;
        text-align: center;
    }
}

@media only screen and (max-width: 640px) {
    .leftcolumn, .rightcolumn { 
        width: 100%;
    }
}
footer {
   border-top: 1px solid #648C3C !important;
}
footer h3 {
    font-weight:normal;
}
footer li {
    list-style-type: none;
    font-size: 40px;
}

footer ul.social {
     display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
-ms-flex-wrap: wrap;
    flex-wrap: wrap;
width: 30%;
}

footer ul.social li {

    margin-right: .5em;
}
footer ul.esa {
    width:30%;
}
footer ul.esa li {
    width: 100%;
    text-align: center;
}
footer ul.esa li img {
    margin-left: -1em;
}
.fa-facebook-official {
    color: #3B5998;
}

.fa-twitter-square {
   color: #00aced ;
}
.fa-google-plus-square {
    color: #dd4b39;
}
.fa-linkedin-square {
    color: #007bb6;
}
.fa-youtube-square {
    color: #bb0000;
}
.fa-flickr {
    color: #ff0084;
}
.fa-tumblr-square {
    color: #32506d;
}

.fa-vimeo {
    color: #1EB8EB;
}