* {
    outline: none;
    margin: 0;
    padding: 0;
}

html, body {
    height: 100%;
    overflow-x: hidden;
}
body {
    overflow: hidden;
    position: relative;
    width: 100%;
    height: 100%;
    min-width: 768px;
    min-height: 768px;
    font-family: 'HelveticaNeueLTStd-Lt', sans-serif;
    font-size: 15px;
    line-height: 26px;
    color: #231f20;
}

/* <editor-fold desc="GENERAL STYLE"> */
a {
    color: inherit;
    cursor: pointer;
}
a img {
    border: none;
}
b {
    font-family: 'HelveticaNeueLTStd-Bd', sans-serif;
    font-size: 13px;
    line-height: 26px;
}
.clearfix {
    clear: both;
}
#logo {
    display: block;
    float: left;
    position: relative;
    z-index: 1000;
    width: 187px;
    margin: 34px 0 0 43px;
}
#uiview {
    position: relative;
    width: 100%;
    height: 100%;
    min-width: 768px;
    min-height: 768px;
}
/* </editor-fold> */

/* <editor-fold desc="INTRO"> */
#intro-wrapper {
    position: absolute;
    z-index: 100;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-width: 768px;
    min-height: 768px;
    padding: 174px 43px 180px 43px;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#intro {
    position: relative;
    width: 100%;
    height: 100%;
}
#intro img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%)!important;
    max-width: 100%;
    max-height: 100%;
    opacity: 0;
}
/* </editor-fold> */

/* <editor-fold desc="PROJECT"> */
#project-wrapper {
    position: absolute;
    z-index: 100;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-width: 768px;
    min-height: 768px;
    padding: 174px 43px 245px 43px;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#large-image {
    position: relative;
    width: 100%;
    height: 100%;

    -webkit-opacity: 0;
    -moz-opacity: 0;
    -ms-opacity: 0;
    -o-opacity: 0;
    opacity: 0;

    -webkit-transition: opacity 0.3s ease;
    -moz-transition: opacity 0.3s ease;
    -ms-transition: opacity 0.3s ease;
    -o-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}
#large-image.loaded {
    -webkit-opacity: 1;
    -moz-opacity: 1;
    -ms-opacity: 1;
    -o-opacity: 1;
    opacity: 1;
}
#large-image img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    max-width: 100%;
    max-height: 100%;
}
#thumbnails-wrapper {
    position: absolute;
    bottom: 150px;
    left: 0;
    width: 100%;
    height: 59px;
    text-align: center;
    font-size: 0;
    line-height: 0;
    overflow: hidden;
}
#thumbnails {
    padding: 0 43px;

    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
#thumbnails a {
    display: inline-block;
    width: 59px;
    height: 59px;
    text-decoration: none;
    font-size: 0;
    margin-right: 2px;

    -webkit-opacity: 0;
    -moz-opacity: 0;
    -ms-opacity: 0;
    -o-opacity: 0;
    opacity: 0;

    -webkit-transition: opacity 0.3s ease;
    -moz-transition: opacity 0.3s ease;
    -ms-transition: opacity 0.3s ease;
    -o-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;

    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
#thumbnails a:last-child {
    margin-right: 0;
}
#thumbnails a.loaded {
    -webkit-opacity: 1;
    -moz-opacity: 1;
    -ms-opacity: 1;
    -o-opacity: 1;
    opacity: 1;
}
#thumbnails a.active {
    -webkit-opacity: 0.4;
    -moz-opacity: 0.4;
    -ms-opacity: 0.4;
    -o-opacity: 0.4;
    opacity: 0.4;
}
/* </editor-fold> */

/* <editor-fold desc="PROJECT VIEWER"> */
#viewer-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-width: 768px;
    min-height: 768px;
    z-index: 5000;
    padding: 50px 54px;
    background: rgba(35, 31, 32, 0.93);

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#viewer {
    position: relative;
    width: 100%;
    height: 100%;

    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
#viewer img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    max-width: 100%;
    max-height: 100%;
}
#viewer-close {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 39px;
    height: 39px;
    padding-left: 2px;
    padding-bottom: 2px;
    background: url('../images/04_close largeimage.svg') center center no-repeat;
}
#viewer-left {
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -74px;
    width: 43px;
    height: 147px;
    background: url('../images/05_left_arrow_largeimage.svg') center center no-repeat;
}
#viewer-right {
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -74px;
    width: 43px;
    height: 147px;
    background: url('../images/06_right_arrow_largeimage.svg') center center no-repeat;
}
#viewer-left.disabled, #viewer-right.disabled {
    pointer-events: none;

    -webkit-opacity: 0.2;
    -moz-opacity: 0.2;
    -ms-opacity: 0.2;
    -o-opacity: 0.2;
    opacity: 0.2;
}
/* </editor-fold> */

/* <editor-fold desc="COMPANY"> */
#company-wrapper {
    position: absolute;
    z-index: 100;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-width: 768px;
    min-height: 768px;
    padding: 192px 0 245px 0;
    overflow: hidden;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#company {
    position: relative;
    width: 100%;
    height: 100%;
    /*overflow-x: auto;*/
    overflow: hidden;
}
#company-inner {
    height: 100%;
    padding: 0 43px;
    position: relative;
}
#company .image {
    float: left;
    height: 9999px;
    max-height: 100%;
    padding-top: 8px;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#company .image img {
    float: left;
    max-height: 100%;
}
#company .text {

}
#company .text .column {
    margin-left: 65px;
}
/* </editor-fold> */

/* <editor-fold desc="CONTACT"> */
#contact-wrapper {
    position: absolute;
    z-index: 100;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-width: 768px;
    min-height: 768px;
    padding: 192px 0 245px 0;
    overflow: hidden;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#contact {
    position: relative;
    width: 100%;
    height: 100%;
    /*overflow-x: auto;*/
    overflow: hidden;
}
#contact-inner {
    height: 100%;
    padding: 0 43px;
    position: relative;
}
#contact .text {
    height: 100%;
}
#contact .text .column {
    margin-left: 50px;
}
#contact .text .column.first {
    margin-left: 0;
}
/* </editor-fold> */

/* <editor-fold desc="MENU"> */
#menu-wrapper {
    overflow: hidden;
    position: absolute;
    bottom: 38px;
    left: 0;
    z-index: 150;
    width: 100%;
}
#menu {
    position: relative;
    padding: 0 43px;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#menu .menu-column {
    float: left;
    margin-right: 38px;
}
#menu .menu-column a {
    display: block;
    width: 100%;
    font-family: 'HelveticaNeueLTStd-Th', sans-serif;
    font-size: 12px;
    line-height: 19px;
    text-decoration: none;
    letter-spacing: 1px;
}
#menu .menu-column a.active {
    color: #7e7e7e;
}
#menu .menu-column:last-child {
    margin-right: 0;
}
#menu .menu-column.menu-primary {
    margin-right: 76px;
}
#menu-scroll {
    position: absolute;
    bottom: 14px;
    left: 50%;
    z-index: 200;
    margin-left: -160px;
    visibility: hidden;
}
#menu-scroll.visible {
    visibility: visible;
}
#menu-scroll #menu-left {
    display: block;
    float: left;
    width: 10px;
    height: 17px;
    margin-right: 170px;
    background: url('../images/02_left_arrow.svg') center center no-repeat;
}
#menu-scroll #menu-right {
    display: block;
    float: left;
    width: 10px;
    height: 17px;
    margin-left: 170px;
    background: url('../images/03_right_arrow.svg') center center no-repeat;
}
#menu-scroll #menu-left.disabled, #menu-scroll #menu-right.disabled {
    pointer-events: none;

    -webkit-opacity: 0.2;
    -moz-opacity: 0.2;
    -ms-opacity: 0.2;
    -o-opacity: 0.2;
    opacity: 0.2;
}
#menu-subitems {
    visibility: hidden;
}
#menu-subitems.visible {
    visibility: visible;
}
/* </editor-fold> */

.content-scroll {
    position: relative;
    bottom: -46px;
    left: 50%;
    margin-left: -160px;
}
.content-scroll .content-left {
    display: block;
    float: left;
    width: 10px;
    height: 17px;
    margin-right: 170px;
    background: url('../images/02_left_arrow.svg') center center no-repeat;
}
.content-scroll .content-right {
    display: block;
    float: left;
    width: 10px;
    height: 17px;
    margin-left: 170px;
    background: url('../images/03_right_arrow.svg') center center no-repeat;
}
.content-scroll .content-left.disabled, .content-scroll .content-right.disabled {
    pointer-events: none;

    -webkit-opacity: 0.2;
    -moz-opacity: 0.2;
    -ms-opacity: 0.2;
    -o-opacity: 0.2;
    opacity: 0.2;
}

@media (max-width: 768px) {
    html {
        overflow-x: auto;
    }
}

@font-face {
    font-family: 'HelveticaNeueLTStd-Bd';
    src: url('../fonts/HelveticaNeueLTStd-Bd.eot?#iefix') format('embedded-opentype'),
         url('../fonts/HelveticaNeueLTStd-Bd.otf')  format('opentype'),
         url('../fonts/HelveticaNeueLTStd-Bd.woff') format('woff'),
         url('../fonts/HelveticaNeueLTStd-Bd.ttf')  format('truetype'),
         url('../fonts/HelveticaNeueLTStd-Bd.svg#HelveticaNeueLTStd-Bd') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'HelveticaNeueLTStd-Lt';
    src: url('../fonts/HelveticaNeueLTStd-Lt.eot?#iefix') format('embedded-opentype'),
         url('../fonts/HelveticaNeueLTStd-Lt.otf')  format('opentype'),
         url('../fonts/HelveticaNeueLTStd-Lt.woff') format('woff'),
         url('../fonts/HelveticaNeueLTStd-Lt.ttf')  format('truetype'),
         url('../fonts/HelveticaNeueLTStd-Lt.svg#HelveticaNeueLTStd-Lt') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'HelveticaNeueLTStd-Th';
    src: url('../fonts/HelveticaNeueLTStd-Th.eot?#iefix') format('embedded-opentype'),
         url('../fonts/HelveticaNeueLTStd-Th.otf')  format('opentype'),
         url('../fonts/HelveticaNeueLTStd-Th.woff') format('woff'),
         url('../fonts/HelveticaNeueLTStd-Th.ttf')  format('truetype'),
         url('../fonts/HelveticaNeueLTStd-Th.svg#HelveticaNeueLTStd-Th') format('svg');
    font-weight: normal;
    font-style: normal;
}
