html, body {
    height: 100%;
    font-family: 'Oldenburg', cursive;
}
.container {
    max-height: 100%;
}
.menu-wrapper {
    position: fixed; width: 100%; z-index:9999;
}

.hide-page {
    transition: all 0.5s !important; -webkit-transition: all 0.5s !important; -moz-transition: all 0.5s !important; -o-transition: all 0.5s !important;
    transform: scale(0) !important; -webkit-transform: scale(0) !important; -moz-transform: scale(0) !important; -o-transform: scale(0) !important;
}
.menu-wrapper-height {
    height: 25px;
}
.menu-slider {
    cursor: pointer; position: absolute; top: 0; left: 0; width: 2%; margin: 1%;
    transition: all 0.2s; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s;
}
.menu-slider-rotated {
    transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg);
}
.menu-slider:hover {
    bottom: 3%;
}
.menu {
    text-align: center;
    padding: 5% 0 0 0;
    background-color: white;
    -webkit-box-shadow: 0 9px 137px 0 rgba(0,0,0,0.75);
    -moz-box-shadow: 0 9px 137px 0 rgba(0,0,0,0.75);
    box-shadow: 0 9px 137px 0 rgba(0,0,0,0.75);
    display: none;
}
.menu img {
    padding: 1%;
    width: 6%;
    cursor: pointer;
    border: 0 !important;
    transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s;
}

.menu img:hover {
    margin-top: -2%;
}

.menu-img-active {
    margin-top: -2%;
}

.main-wrapper {
    min-width: 100%;
    min-height: 100%;
    top: 0; left: 0; right: 0; bottom: 0;
    position: absolute;
    transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s;
}

div {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

.intro {
    height: 100vh;
}

.center, .center-40 {
    position: relative;
    top: 50%;
    transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%);
}
.center-40 {
    top: 40%;
}

.full-height {
    height: 100vh;
}

.intro > div {
    position: relative;
    top: 50%;
    transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%);
}
.social img, .facts img {
    position: relative;
    max-width: 100%; max-height: 90%; padding: 15%;
    top: 50%;
    transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%);
}

.facts img {
    padding: 0;
}

.social img:not(:first-child), .facts img:not(:first-child), .records > div:not(:first-child),  .future div:not(:first-child),
.sub-records > div:not(:first-child)
 {
    display: none;
}

.arrows {
    position: absolute; height: 100%; width:100%;
}
.arrows > img {
    position: absolute; top: 50%;
    margin: 5px; cursor: pointer;
    width: 60px;
}
.arrows img:first-child {
    position: relative; cursor: pointer;
}
.arrows img:nth-child(2), .rotated-arrow {
    right: 0;
    transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg); 
}
.tooltip-inner {
    max-width: 400px;
    width: 400px;
    font-size: 14px;
}


.image {
    max-width: 125px;
    max-height: 100%;
    margin-top: 30px;
}

.line {
    background-image: url(../images/wardrobe/line-for-hanger.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
    padding: 2%;
    height: 310px;
}

.wardrobe {
    margin-top: -10%;
    position: absolute;
    width: 50%;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
}

.wardrobe-images > img:not(:first-child) {
    margin-top: 30px;
}

/*
    span
*/
.span-black {
    background-color: black;
    color: white;
    padding: 1px;
    font-weight: bold;
    font-size: 20px;
}

.span-gray {
    background-color: #666666;
    color: #B7B7B7;
    padding: 1px;
    font-weight: bold;
    font-size: 20px;
}

.span-white {
    background-color: #666666;
    color: white;
    padding: 1px;
    font-weight: bold;
    font-size: 20px;
}


.about img {
    width: 100%;
    padding: 10%;
    transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s;
}

.about img:hover {
    padding: 5%;
    cursor: pointer;
}

.about > div {
    display: inline;
}