html,
body{
    padding: 0;
    margin: 0;
    border: 0;
}
html.development,
html.portrait.development{
    background: no-repeat center top;
    background-size: cover;
}
html.portrait {
    background: none;
}
body{
    overflow: hidden;
    background-color: #000;
}
.development body{
    opacity: 0.5;
    padding: 0 0 50%;
}
input[type=text].invalid,
textarea.invalid{
    background-color: #fcc;
    box-shadow: 0px 0px 0px 2px #f00 inset;
}

.landscape .responsive--portrait{
    display: none !important;
}
.portrait .responsive--landscape{
    display: none !important;
}
.portrait .responsive--portrait{
    display: block !important;
}

.site__title{
    position: absolute;
    z-index: 3;
    top: 3.4%;
    left: 0;
    width: 100%;
    height: 4.8%;
    margin: 0;
    
font-family: Arial, Helvetica, sans-serif;
text-align: center;
color: #fff;
}
.site__title img{
    display: block;
    width: auto;
    height: 100%;
    margin: 0 auto;
}
#site__body{
    position: relative;
    margin: 0;
    overflow: hidden;
}
#site__body > * {
    position: absolute;
    z-index: 2;
    left: 0;
    right: 0;
    margin: 0 auto;
}
#site__body > .background {
    height: 100%;
}
.main-content__title img,
.main-content__article img{
    display: block;
    height: 100%;
    margin: 0 auto;
}
#site__footer{
    position: fixed;
    z-index: 4;
    bottom: 0;
    left: 0;
    width: 100%;
    overflow: visible;
    background: none;
    background-color: #000;
}
.site__navigation.left{
    float: left;
}
.site__navigation.right{
    float: right;
}
.site__navigation.home{
    margin: 0 auto;
}
.site__navigation.home.right{
    margin-right: 3.6%;
}
.site__navigation a{
    display: block;
}
.site__navigation__container{
    padding: 0;
    margin: 0;
    list-style: none;
}
.site__navigation__container > li > a > img{
    margin: 0 auto;
}
#site__footer.size--by-height{
    height: 4.55%;
}
#site__footer.size--by-height .site__navigation__container{
    position: absolute;
    top: 12%;
    top: 19%;
    left: 0;
    width: 100%;
    height: 76%;
    height: 57%;
    padding: 0;
}
#site__footer.size--by-height .site__navigation__container li,
#site__footer.size--by-height .site__navigation__container li a,
#site__footer.size--by-height .site__navigation__container li img{
    display: block;
    max-width: none;
    width: auto;
    height: 100%;
}

.portrait body{
    overflow: auto;
}
.portrait .site__title{
    top: 3.2%;
    width: 100%;
    height: 4.3%;
    margin: 0;
}
.portrait .site__title.main-content__title{
    position: static;
    height: auto;
    margin: 0 auto;
    padding-top: 6.4%;
}
.portrait .site__title.main-content__title img{
    width: 100%;
    height: auto;
}
.portrait #site__body > .main-content__title,
.portrait #site__body > .main-content__article{
    position: static;
}
.portrait #site__body > .main-content__title{
    height: auto;
    padding-top: 6.4%;
}
.portrait #site__body > .main-content__title img{
    width: 100%;
    height: auto;
}
.portrait #site__body > .main-content__article{
    margin-top: 1.6%;
}
.portrait .main-content__article{
    width: 77%;
    height: auto;
}
.portrait .main-content__article img{
    width: 100%;
    height: auto;
}
.portrait .main-content__article.last{
    padding-bottom: 11%;
}
.portrait #site__footer{
    position: fixed;
    margin: 0;
    background: none;
    background-color: #000;
}
.portrait #site__footer.size--by-height .site__navigation__container li,
.portrait #site__footer.size--by-height .site__navigation__container li a,
.portrait #site__footer.size--by-height .site__navigation__container li a img,
.portrait #site__footer.size--by-height .site__navigation__container > li > a > img /* this is to overwrite*/{
    width: auto;
    height: 100%;
}
.portrait #site__footer.size--by-height .site__navigation__container{
    height: 65%;
}
.portrait #site__footer .site__navigation__container > li{
    margin: 0 auto;
}

.ui-dialog{
    font-size: 12px;
}