/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

html {
    font-size: 1em;
    line-height: 1.4;
}

/* Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design. */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/* A better looking default horizontal rule */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/* Remove the gap between images, videos, audio and canvas and the bottom of their containers: h5bp.com/i/440 */

audio,
canvas,
img,
video {
    vertical-align: middle;
}

/* Remove default fieldset styles. */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/* Allow only vertical resizing of textareas. */

textarea {
    resize: vertical;
}


/* ==========================================================================
   Helper classes
   ========================================================================== */

/* Image replacement */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/* Hide from both screenreaders and browsers: h5bp.com/u */

.hidden {
    display: none;
}

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/* Hide visually and from screenreaders, but maintain layout */

.invisible {
    visibility: hidden;
}

/* Clearfix: contain floats */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/* For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats. */

.clearfix {
    *zoom: 1;
}


/* ==========================================================================
   Fonts
   ========================================================================== */

@font-face {
    font-family: 'gotham_prolight';
    src: url('fonts/gothaprolig-webfont.eot');
    src: url('fonts/gothaprolig-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/gothaprolig-webfont.woff') format('woff'),
         url('fonts/gothaprolig-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'gotham_promedium';
    src: url('fonts/gothapromed-webfont.eot');
    src: url('fonts/gothapromed-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/gothapromed-webfont.woff') format('woff'),
         url('fonts/gothapromed-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}


/* ==========================================================================
   Custom styles
   ========================================================================== */

.content {
    position: relative;

    min-height:720px;
    width:100%;
    min-width:1000px;

    overflow:hidden;
}

.preloader {
    position:absolute;
    left:0;
    top:0;
    right:0;
    bottom:0;
    z-index: 400;

    background-color:#000;
}

.background {
    position:absolute;
    left:50%;
    top:50%;
    z-index: 200;

    margin:-560px 0 0 -960px;
}

.background__1 {
    margin:-560px 0 0 -960px;
    z-index:300;
}

.background__2 {
    margin:-750px 0 0 -596px;
}

.background__3 {
    margin:-755px 0 0 -628px;
}

.background__4 {
    margin:-756px 0 0 -601px;
}

.background__5 {
    margin:-757px 0 0 -600px;
}

.title_header,
.title_menu {
    position:absolute;
    left:50%;
    right:0;
    top:6px;
    z-index: 500;

    width:692px;
    margin:0 0 0 -346px;

    font-family: gotham_promedium;
    font-size:12px;
    color:#fff;
    text-align:center;
    text-transform:uppercase;
    letter-spacing:2px;
}

.lang {
    position: absolute;
    right:20px;
    top:4px;
    z-index: 500;

    font-family: gotham_promedium;
    font-size:12px;
    color:#fff;
    text-align:right;
    letter-spacing:1px;
}

.lang a {
    color:#fff;
    text-decoration:none;
}

.lang a:hover {
    text-decoration:underline;
}

.title_menu {
    top:auto;
    bottom:6px;
}

.title_menu a {
    color:#fff;
    text-decoration:none;
}

.title_menu a:hover {
    text-decoration:underline;
}

.title_name {
    position:absolute;
    right:-572px;
    /*bottom:80px;*/
    top:50%;
    left:auto;
    z-index:500;

    width:600px;
    height:600px;
    margin-top:-300px;

    font-family: 'gotham_prolight';
    font-size:13px;
    color:#fff;
    letter-spacing:1px;
    text-align:center;

    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}

.title_copyright {
    position:absolute;
    right:33px;
    bottom:6px;
    z-index: 500;

    font-family: 'gotham_prolight';
    font-size:12px;
    color:#fff;
    text-align:right;
    letter-spacing:1px;
}

.menu {
    position:absolute;
    top:64px;
    left:53px;
    left:50%;
    top:50%;
    z-index: 500;

    width:163px;
    margin:-296px 0 0 -580px;
}

.menu_logo {
    display:block;
    width:140px;
    height:138px;
    margin:0 0 31px 12px;

    background:url(/img/logo1.png) 50% 0 no-repeat;
}

.menu_link {
    display:block;
    margin-bottom:18px;
    padding:5px 0 5px 0;

    font-family: 'gotham_promedium';
    font-size:16px;
    color:#fff;
    text-align:center;
    text-decoration:none;
    letter-spacing:1px;

    border:2px solid #fff;
    outline: none;
}

.menu_link__active {
    padding-left:5px;

    border-right:7px solid #fff;
}

.menu_link:hover {
    text-decoration:underline;
}

.text {
    position: absolute;
    left:50%;
    top:50%;
    z-index: 500;

    width:512px;
    height:644px;
    margin:-334px 0 0 -346px;
    padding:23px 90px 0 90px;

    background:url(/img/z2.png) 0 0 repeat;
}

.text__services {
    width:582px;
    height:270px;
    margin:-169px 0 0 -346px;
    padding:67px 55px 0 55px;
}

.text__artists {
    width:612px;
    height:591px;
    padding:76px 40px 0 40px;
}

.text__contacts {
    width:692px;
    height:370px;
    margin:-200px 0 0 -269px;
    padding: 50px 0 0 0;

    text-align:center;
}

.text__catalog {
    width:692px;
    height:193px;
    margin:-150px 0 0 -269px;
    padding: 107px 0 0 0;

    text-align:center;
}

.text p {
    margin-bottom:1px;

    font-family:'gotham_prolight';
    font-size:16px;
    line-height:200%;
}

.text__about p {
    /*text-indent:35px;*/
}

.text__services p {
    letter-spacing:1px;
}

.text__contacts p {
    margin-bottom: 15px;
}

.text__contacts p a {
    color:#000;
}

.text__artists p {
    margin-bottom:0;
    cursor:pointer;
}

.text_sign {
    float: right;

    width:112px;
    height:35px;
    margin:63px -10px 0 0;

    background:url(/img/sign.png) 0 0 no-repeat;
}

.text_photo {
    width:300px;
    height:59px;
    margin:0 auto;
    padding-top:139px;

    text-align:center;

    background:url(/img/img1.png) 50% 0 no-repeat;
}

.text_photo p {
    margin:0;

    text-indent:0;
    line-height: 100%;
}

.text_photo p i {
    font-size:12px;
    font-style:italic;
}

.text_interview {
    margin-top:65px;

    text-align:center;
}

.text_interview a {
    padding-left:102px;

    font-family:'gotham_prolight';
    font-size:16px;
    color:#000;
    text-decoration:underline
}

.text_cataloglinks {
    width: 376px;
    margin: 0 auto;
}

.text_cataloglink {
    display:block;
    width:110px;
    padding-top:67px;

    font-family: 'gotham_promedium';
    font-size:16px;
    text-align: center;
    color:#000;
}

.text_cataloglink__view {
    float:left;

    margin-left:4px;

    background:url(/img/ico_view.png) 50% 8px no-repeat;
}

.text_cataloglink__download {
    float:right;

    margin-right:-4px;

    background:url(/img/ico_download.png) 50% 0 no-repeat;
}

.text_cataloglink:hover {
    opacity:0.6;
}

.close {
    position:absolute;
    right:32px;
    top:31px;

    width:11px;
    height:12px;

    background:url(/img/ico_close.png) 0 0 no-repeat;

    cursor: pointer;
}

.close:hover {
    opacity:0.6;
}

.text_list__left {
    float:left;
    width:200px;
    text-align:left;
}

.text_list__right {
    float:right;
    width:200px;
    text-align:right;
}

.text_artistimg {
    position:absolute;
    left:50%;
    top:300px;
    z-index:700;

    width:180px;
    height:auto;
    margin:0 0 0 -90px;

    display: none;
}

.issuuembed span,
.issuuembed div div:last-child {
    display: none;
}

.catalog_view_wrapper {
    width:650px;
    height:325px;
}

.social {
    height:32px;
    width:100px;
    margin:30px auto 0 auto;

    text-align:center;
}

.social_link {
    width:32px;
    height:32px;
    margin:0 5px;
    display:inline-block;
}

.social_link__fb {
    background:url(/img/icon_fb_32px.png) 0 0 no-repeat;
}

.social_link__in {
    background:url(/img/icon_inst_32px.png) 0 0 no-repeat;
}


/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (min-device-width: 200px) and (max-device-width: 700px) {

    .content {
        min-width: 0;
        padding-bottom:30px;
        /*overflow:visible;*/
    }

    .title_header {
        position:relative;
        width:100%;
        margin:40px 0 0 0;
        left: auto;
    }

    .title_menu {
        position:relative;
        display: none;
        width:auto;
        left: auto;
    }

    .menu {
        position: relative;
        margin:40px auto 20px auto;
        left: auto;
    }

    .text {
        position: relative;
        left:auto !important;
        top: auto !important;
        width:80% !important;
        margin:30px auto !important;
        padding-left:20px;
        padding-right:20px;
        height: auto !important;
    }

    .text_sign {
        margin:20px auto 0 auto;
    }

    .text_interview {
        clear: both;
        display: block;
        width:100%;
        text-align: right;
        padding-bottom:20px;
    }

    .text_interview a {
        display: inline;
        font-size:12px;
        padding:0;
    }

    .text__contacts {
        padding:50px 20px 30px 20px;
    }

    .text__services {
        padding-bottom:20px;
    }

    .text__catalog {
        padding:40px 20px 30px 20px;
    }

    .text__artists {
        padding:50px 20px 30px 20px;
    }

    .title_name {
        top:40%;
        text-align: right;
    }

    .text_cataloglinks {
        width: 100%;
    }

    .text_cataloglink {
        float: none !important;
        margin:20px auto;
    }

    .text_cataloglink__download {
        margin-top:60px;
    }

    .text_list {
        float: none;
        width:100%;
        text-align: center !important;
    }

}

@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {

    .menu_logo {
        background:url(/img/logo1@2x.png) 50% 0 no-repeat;
        background-size:138px 136px;
    }

    .close {
        background:url(/img/ico_close@2x.png) 0 0 no-repeat;
        background-size:11px 11px;
    }

    .text_cataloglink__view {
        background:url(/img/ico_view.png) 50% 8px no-repeat;
        background-size:46px 25px;
    }

    .text_cataloglink__download {
        background:url(/img/ico_download.png) 50% 0 no-repeat;
        background-size:44px 41px;
    }
}


/* ==========================================================================
   Print styles. Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /* Don't show links for images, or javascript/internal links */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}