html.development{
    background-image: url(../mockup/whatsNext/landscape.jpg);
}
.development body {
    padding: 0;
}
.site__title{
    top: 3.4%;
    width: 100%;
    height: 4%;
    margin: 0;
}
.site__title img{
    width: auto;
    height: 100%;
    margin: 0 auto;
}
#site__body > .whats-next__content{
    max-width: 91.4%;
    max-height: 16%;
    bottom: auto;
    top: 11.3%;
    right: 0;
    margin: 0 auto;
}
#site__body > .globe{
    max-width: 73.6%;
    max-height: 69.4%;
    bottom: auto;
    top: 30.2%;
    right: 0;
    margin: 0 auto;
}
#site__footer {
    position: fixed;
    height: 0;
    background: none;
}
.site__navigation.home{
    position: fixed;
    bottom: 3.2%;
    right: 6.2%;
    height: 2.4%;
}
.site__navigation.home a,
.site__navigation.home a img{
    display: block;
    width: auto;
    height: 100%;
}
html.portrait.development{
    background-image: url(../mockup/whatsNext/portrait.jpg);
}
.portrait .site__title{
    top: 3.4%;
    width: 100%;
    height: 2.84%;
    margin: 0;
}
.portrait #site__body > .whats-next__content {
    top: 9.5%;
    right: 0;
    width: auto;
    max-width: 83.4%;
    max-height: 40%;
    margin: 0 auto;
}
.portrait #site__body > .globe {
    max-width: 100%;
    max-height: 42.4%;
    top: 50.1%;
}
.portrait #site__footer .site__navigation__container > li.home{
    bottom: 1.5%;
    left: 0;
    right: 0;
    width: auto;
    height: 2.8%;
    text-align: center;
}
.portrait #site__footer .site__navigation__container > li > a {
    display: inline-block;
}
.portrait #site__footer .site__navigation__container > li > a > img{
    display: inline-block;
    width: auto;
    height: 100%;
}