@font-face {
    font-family: 'Roboto';
    src: url(../font/Roboto.ttf);
    font-weight: normal;
    font-style: normal;
}

body{
    width: 915px;
    height: 1283px;
    margin: 0;
    padding: 0;
    color: white;
    font: 15px 'Roboto', 'Arial', 'Tahoma';
    background: #1c1a1f url(../img/bg.jpg) no-repeat center top;
}

.mobile body{background-position: 0 0;}

/* Общее */

.ws-link{color: white; text-decoration: underline;}
.ws-link:hover{text-decoration: none;}

.ws-sep{
    width: 404px;
    height: 2px;
    margin: 5px auto;
    background: url(../img/atlas.png) -9px -1316px no-repeat;
}
.ws-fB{font-weight: bold;}

.ws-paragraph{min-height: 1px; margin: 15px 0;}

.ws-list{display: inline-block; margin: 0; text-align: left;}

/* Иконки */

.ws-contactIcon{
    display: inline-block;
    width: 26px;
    height: 26px;
    vertical-align: middle;
    background: url(../img/atlas.png) no-repeat;
}
    .ws-contactIcon.-type-steam{vertical-align: -8px; background-position: -359px -1138px;}
        .ws-contactIcon.-type-steam + a + span{padding: 0 10px;}
    .ws-contactIcon.-type-fb{height: 27px; background-position: -323px -1138px;}
    .ws-contactIcon.-type-vk{background-position: -395px -1138px;}
    .ws-contactIcon.-type-discord{width: 103px; height: 28px; background-position: -323px -1100px;}
    .ws-contactIcon.-type-mail{width: 34px; background: url(../img/10-mbox.png) no-repeat;}
    .ws-contactIcon.-type-empty{width: 34px; background: none;}
    
.ws-bg-view{
    position: fixed; 
    top: -60px; 
    left: 50%;  
    margin-left: -960px; 
    width: 1920px; 
    height: 1080px;
}
.ws-bg-view.-type-fullShow{top: 0; left: 0; margin-left: 0; width: 100%; height: 100%;}
    .ws-bg-view.-type-fullShow #player{width: 100%; height: 100%;}
    
    .ws-bg-view:after{
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        z-index: 10;
        width: 100%;
        height: 100%;
        opacity: 1;
        background: #1b191f;
        transition: 1s ease-out;
    }
    .ws-bg-view.-type-show:after{opacity: 0;}
    .ws-bg-view.-type-show.-flag-onFirstShow{transition: 10s ease-out};
    
    .ws-backImg{position: absolute; left: 0; top: 0; opacity: 1; width: 1920px; height: 1080px;}


.ws-cont-wrp{
    position: absolute;
    left: 0;
    right: 0;
    width: 915px;
    min-height: 1081px;
    margin: 0 auto;
}
.ws-cont{
    position: relative;
    z-index: 1;
    width: 481px;
    min-height: 1081px;
    margin: 0 auto;
    padding: 10px;
    background: #1b191f;
    box-shadow: 0px 0px 15px 5px #1b191f;
}
    .ws-cont:before{
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        z-index: -1;
        width: 100%;
        height: 1081px;
        background: url(../img/atlas.png) -9px -9px no-repeat;
    }
    
.ws-gradient{
    width: 481px;
    height: 150px;
    margin: auto;
    padding: 0 10px;
    background-image: linear-gradient(to top, transparent, #1b191f);
}
    .ws-ears{
        display: inline-block; 
        position: absolute;
        top: 0;
        width: 201px;
        
    }
    .ws-ears.-type-left{left: -205px;}
    .ws-ears.-type-right{right: -205px;}
        .ws-ear{display: inline-block; margin-bottom: 20px; }
            .ws-ear img{
                border: 1px solid #999999;
                border-radius: 5px;
                box-shadow: 0px 0px 10px 2px black;
            }

    .ws-lang-select{
        position: absolute;
        top: 1px;
        right: 6px;
        min-width: 80px;
        padding-right: 15px;
        cursor: pointer;
        background-color: black;
	}
        .ws-lang-select:after{
            content: '';
            width: 12px;
            height: 6px;
            background: url(../img/flags_ru_en_de-s.png) 0 -15px;
            position: absolute;
            right: 2px;
            top: 10px;
        }
            .ws-lang-select:hover:after{background-position: -12px -15px;}
            
    .ws-lang{margin: 2px; background: black;}
        .ws-lang:before{
            content: '';
            display: inline-block;
            width: 20px;
            height: 15px;
            vertical-align: -2px;
            background: url(../img/flags_ru_en_de-s.png);
            margin-right: 5px;
        }
        .ws-lang.-ru:before{background-position: 0 0;}
        .ws-lang.-en:before{background-position: -20px 0;}
        .ws-lang.-de:before{background-position: -40px 0;}
    .ws-lang-list{display: none;}
    .ws-lang-select:hover .ws-lang-list{display: block;}
    
    .ws-logo-offset{height: 100px;}
    
    .ws-contacts{margin: 20px 20px 10px; text-align: left;}
        .ws-contacts-block{display: inline-block; width: 216px; vertical-align: top;}
            .ws-contact{margin: 5px 0; white-space: nowrap;}
            .ws-contacts-block.-type-right .ws-contact{margin-left: 40px;}
    
    .ws-steam-widget-wrp{margin-bottom: 20px; text-align: center;}
        .ws-steam-button-wrp{
            position: relative;
            width: 304px;
            height: 62px;
            margin: auto;
            vertical-align: top;
            overflow: hidden;
            background: url(../img/atlas.png) -9px -1100px no-repeat;
        }
        .ws-steam-button-wrp:hover{background-position: -9px -1172px;}
        .ws-steam-button-wrp:active{background-position: -9px -1244px;}
            .ws-steam-button{
                height: 52px;
                line-height: 52px;
                font-size: 22px;
                text-align: center;
                color: #ffffff;
            }
            .ws-steam-realButton{
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                overflow: hidden;
                opacity: 0.001;
            }
                .ws-steam-realButton iframe{
                    position: absolute; 
                    width: 1500px; 
                    height: 200px;
                    top: -750px;
                    right: 6280px;
                    transform: scale(10);
                    -webkit-transform: scale(10);
                    -ms-transform: scale(10);
                    -o-transform: scale(10);
                }
        
    .ws-title{
        margin: 30px 10px;
        text-align: center;
        font-weight: normal;
        font-size: 36px;
    }
    
    .ws-video-wrp{position: relative; width: 400px; height: 200px; margin: 30px auto 0;}
        .ws-video-toLeft,
        .ws-video-toRight{
            position: absolute;
            top: 0;
            width: 40px;
            height: 100%;
            cursor: pointer;
            transition: opacity 0.5s;
        }
        .ws-video-toLeft.-type-inactive,
        .ws-video-toRight.-type-inactive{opacity: 0.4;}
        .ws-video-toLeft{left: -40px;}
        .ws-video-toRight{right: -40px;}
            .ws-video-toLeft:before,
            .ws-video-toRight:before{
                content: '';
                position: absolute;
                top: 0;
                bottom: 0;
                left: 0;
                right: 0;
                width: 10px;
                height: 10px;
                margin: auto;
                border-radius: 100%;
                background: white;
            }
        .ws-video-cont{
            width: 400px;
            height: 200px;
            overflow: hidden;
            white-space: nowrap;
            font-size: 0;
        }
            .ws-video{display: inline-block; width: 400px; height: 200px;}
                .ws-video iframe{width: 100%; height: 100%;}
	
    .ws-description{margin: 20px 30px 30px; text-align: left;}
    
        .ws-info{}
    
    .ws-footer{text-align: center;}
        .ws-copyrightLogo{
            width: 83px;
            height: 44px;
            margin: 40px auto;
            background: url(../img/atlas.png) -436px -1128px no-repeat;
        }
        

/* colorbox */
#colorbox,#cboxOverlay,#cboxWrapper {
	left: 0;
	overflow: hidden;
	position: absolute;
	top: 0;
	z-index: 9999;
}
#cboxWrapper{max-width: none;}
#cboxOverlay {
	background: #000;
	height: 100%;
	position: fixed;
	width: 100%;
}
#cboxMiddleLeft, #cboxBottomLeft{clear: left;}
#cboxContent{
	overflow: visible;
	position: relative;
	background: #b0b2be url(../img/cbox/reg_bg.png);
}
#cboxLoadedContent{
	overflow: auto;
    overflow-x: hidden!important;
	webkit-overflow-scrolling: touch;
}
#cboxTitle{
	bottom: -24px;
	color: #fff;
	left: 0;
	margin: 0;
	position: absolute;
	text-align: center;
	width: 100%;
	overflow: hidden;
}
#cboxLoadingOverlay, #cboxLoadingGraphic{
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}
#cboxPrevious,#cboxNext,#cboxClose{cursor: pointer;}
.cboxPhoto{
	border: 0;
	display: block;
	float: left;
	margin: auto;
	max-width: none;
	ms-interpolation-mode: bicubic;
}
.cboxIframe{
	background: #fff;
	border: 0;
	display: block;
	height: 100%;
	margin: 0;
	padding: 0;
	width: 100%;
}
#colorbox,#cboxContent,#cboxLoadedContent{
	box-sizing: content-box;
	moz-box-sizing: content-box;
	webkit-box-sizing: content-box;
}

#colorbox input,
#colorbox button{outline: none;}

#colorbox, #cboxWrapper {
	padding: 2px 3px 3px 2px;
}

#cboxTopLeft, #cboxTopRight, #cboxBottomLeft, #cboxBottomRight {
	position: relative;
	z-index: 1;
	width: 11px;
}

#cboxTopLeft, #cboxTopRight {
	height: 11px;
}
#cboxTopCenter {
	background: url(../img/cbox/reg_bord-s.png) 0 -135px repeat-x;
	height: 11px;
}
#cboxBottomLeft, #cboxBottomRight {height: 28px}
#cboxBottomCenter {
	background: url(../img/cbox/reg_bord-s.png) 0 -103px repeat-x;
	height: 28px;
}


#cboxTopLeft:after,
#cboxTopRight:after,
#cboxBottomLeft:after,
#cboxBottomRight:after {
	content: '';
	position: absolute;
	width: 43px;
	background: url(../img/cbox/reg_bord-s.png) no-repeat;
}

#cboxTopLeft:after,
#cboxTopRight:after {
	height: 41px;
}
#cboxTopLeft:after {
	left: -2px;
	top: -6px;
	background-position: -3px -1px;
}
#cboxTopRight:after {
	top: -3px;
	right: -3px;
	background-position: -46px -4px;
}

#cboxBottomLeft:after,
#cboxBottomRight:after {
	height: 47px;
}
#cboxBottomLeft:after {
	bottom: -4px;
	left: -3px;
	background-position: -3px -45px;
}
#cboxBottomRight:after {
	bottom: -4px;
	right: -6px;
	background-position: -46px -45px;
}

#cboxMiddleLeft, #cboxMiddleRight {
	width: 11px;
	background: url(../img/cbox/reg_bord_46-s.png) repeat-y;
}

#cboxMiddleRight {
	background-position: -13px 0;
}
#cboxError{border: 1px solid #ccc; padding: 50px;}
#cboxLoadingGraphic {
	background: url(../img/cbox/loader.gif) 50% 50% no-repeat;
}
#cboxCurrent {
	display: none !important;
}
#cboxPrevious,#cboxNext,#cboxClose {
	text-indent: -9999px;
	overflow: visible;
	position: absolute;
	margin: 0;
	padding: 0;
	border: 0;
	background: url(../img/cbox/reg_bord-s.png) no-repeat 0 0;
}
#cboxPrevious,#cboxNext {
	bottom: -26px;
	width: 14px;
	height: 19px;
}
#cboxPrevious {
	background-position: -179px -11px;
	left: 40px;
}
#cboxPrevious:hover {background-position: -193px -11px}
#cboxPrevious:active {background-position: -207px -11px}
#cboxNext {
	background-position: -179px -34px;
	right: 36px;
}
#cboxNext:hover {background-position: -192px -34px}
#cboxNext:active {background-position: -206px -34px}
#cboxClose {
	top: -2px;
	right: -2px;
	z-index: 2;
	width: 26px;
	height: 26px;
	background-position: -92px -8px;
}
#cboxClose:hover {
	background-position: -120px -8px;
}
#cboxClose:active {
	background-position: -148px -8px;
}
#cboxSlideshow {display: none}
#colorbox,#cboxPrevious:active,#cboxNext:active,#cboxClose:active {
	outline: 0;
}

.buttonMute{
    display: none;
    position: absolute;
    bottom: 20px;
    z-index: 20;
    left: 10px;
	width: 43px;
	height: 43px;
    cursor: pointer;
	background: url(/img/button_sound_onoff-s.png) 0 -43px;
} 
.-type-fullShow .buttonMute{display: inline-block;}
.buttonMute:hover{background-position: -44px -43px;}
.buttonMute:active{background-position: -86px -43px;}

.buttonMute.-active{background-position: 0 0;}
.buttonMute.-active:hover{background-position: -44px 0;}
.buttonMute.-active:active{background-position: -86px 0;}