@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Roboto:300&subset=latin,cyrillic);

html,body { margin: 0; padding: 0; height: 100%;}
body { font: 300 16px/24px Roboto, HelveticaNeue, 'Helvetica Neue', Helvetica, Arial, sans-serif; color: #fff; background: #000;}
a { color: #0067da; padding-top: 5px; text-decoration: underline; cursor: pointer; outline: none; transition: color .2s, background .2s, border-color .2s;}
a:focus { outline: none;}
a:hover { color: #da0000; text-decoration: underline; transition: none;}
/*a:focus { outline: none; color: #da0000;}*/
.pseudo-link { color: #0067da; text-decoration: underline; border-bottom: #0067da 1px dotted; cursor: pointer;}
.pseudo-link:hover { color: #da0000; text-decoration: underline; border-bottom-color: #da0000; border-bottom-style: solid;}
a img { border: none;}
p { margin: 0 0 20px 0; padding: 0;}
.spacer { height: 0; overflow: hidden; clear: both; display: block;}

*, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
img { -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box;}

.hidden { display:none }

.cf:before,
.cf:after { content:""; display:table; }
.cf:after { clear:both; }
.cf { zoom:1; }

.noselect {
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-khtml-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
}

article, aside, figure, footer, header, hgroup, menu, nav, section { display: block; }

hr { margin: 35px 0; padding: 0; overflow: hidden; height: 1px; border: none; color: #e2e2e2; background: #e2e2e2; clear: both;}

ul { margin: 0 0 10px 0; padding: 0; list-style: none }
ul li { margin: 0 0 10px 0; padding: 0;}

ol { margin: 0 0 10px 0; padding: 0; list-style: none }
ol li { margin: 0 0 10px 0; padding: 0;}

h1, .heading1 { margin: 0 0 40px 0; padding: 0; font: 300 48px/54px Roboto, HelveticaNeue, 'Helvetica Neue', Helvetica, Arial, sans-serif;}
h2, .heading2 { margin: 0 0 30px 0; padding: 0; font: 300 38px/46px Roboto, HelveticaNeue, 'Helvetica Neue', Helvetica, Arial, sans-serif;}
h3, .heading3 { margin: 0 0 30px 0; padding: 0; font: 300 20px/28px Roboto, HelveticaNeue, 'Helvetica Neue', Helvetica, Arial, sans-serif;}
h4, .heading4 { margin: 0 0 12px 0; padding: 0; font: 300 14px/20px Roboto, HelveticaNeue, 'Helvetica Neue', Helvetica, Arial, sans-serif;}

.ta-r { text-align: right;}

.heading-black span { display: inline-block; padding: 3px 10px 4px 10px; color: #000; background: #fff;}

.mw { overflow: hidden;}
.w { max-width: 1360px; margin: 0 auto; padding: 0 30px;}

.r { margin-left: -30px; margin-right: -30px;}
.r-item { float: left; width: 25%; padding: 0 30px;}
.r-item-2 { float: left; width: 50%; padding: 0 30px;}
.r-item-3 { float: left; width: 75%; padding: 0 30px;}

.background-grey { margin: 35px 0; padding: 35px 0; background: #f5f6f7;}

.header-item { margin-bottom: 35px; padding: 231px 0 50px 0; position: relative; color: #fff; background-position: center top; background-repeat: no-repeat;
	-webkit-background-size: cover;
	background-size: cover;
}
.header-item:before { display: block; content: ''; width: 100%; height: 100%; background: #000; opacity: 0.5; filter: alpha(opacity=50); position: absolute; top: 0; left: 0;}
.header-item a { color: #fff; text-decoration: none; border-bottom: rgba(255,255,255,0.5) 1px solid;}
.header-item a:hover { color: #fff; text-decoration: none; border-bottom-color: rgba(255,255,255,1);}
.header-item .w { position: relative;}
.header-item .heading { margin: 0 0 5px 0; font-size: 48px; line-height: 54px;}
.header-item .tagline { float: left; width: 60%; margin: 0 0 10px 0; font-size: 20px; line-height: 30px;}
.header-item nav { float: right; width: 40%; font-size: 20px; line-height: 30px; text-align: right;}
.header-item nav ul { margin: 0; padding: 0; list-style: none;}
.header-item nav ul li { display: inline-block; margin: 0 0 10px 60px; padding: 0;}
.header-item nav ul li:first-child { margin-left: 20px;}
.header-item nav ul li:after { display: none;}

.covers-list { margin-bottom: 45px;}
.covers-list .cl-item { margin-bottom: 55px;}
.covers-list .cl-item:nth-child(4n+1) { clear: left;}
.covers-list .cl-item img { display: block; width: 100%;}
.background-grey .covers-list:last-child { margin-bottom: 0;}

.promo-cover { margin: 0 0 25px 0;}
.promo-cover img { display: block; width: 100%;}
.promo-cover-tagline { margin: 0 0 50px 0;}

.footer { margin: 0; padding: 50px 0 100px 0;}
.footer p { margin: 0;}

.page-cover { width: 100%; min-height: 100%; padding-top: 120px; padding-bottom: 100px; text-align: center; color: #fff; background-position: center center; background-repeat: no-repeat; position: relative;
	-webkit-background-size: cover;
	background-size: cover;
}
.page-cover:before { display: block; content: ''; width: 100%; height: 100%; background: #000; opacity: 0.5; filter: alpha(opacity=50); position: absolute; top: 0; left: 0;}
.page-cover a { color: #fff; text-decoration: none; border-bottom: rgba(255,255,255,0.5) 1px solid;}
.page-cover a:hover { color: #fff; text-decoration: none; border-bottom-color: rgba(255,255,255,1);}

.pc-inner { display: inline-block; max-width: 500px; margin: 0 auto; position: relative; text-align: center;}
.pc-inner .pc-photo { margin: 0 0 40px 0;}
.pc-inner .pc-photo img { display: block; margin: 0 auto;}
.pc-inner nav { font-size: 20px; line-height: 30px;}
.pc-inner nav ul li { margin: 0 0 10px 0;}

@media (max-width: 1360px) {
	.r-item { width: 33.333%;}
	.r-item-2 { width: 66.666%;}
	.r-item-3 { width: 66.666%;}

	.covers-list .cl-item:nth-child(4n+1) { clear: none;}
	.covers-list .cl-item:nth-child(3n+1) { clear: left;}
}
@media (max-width: 800px) {
	.r-item { width: 50%;}
	.r-item-2 { width: 50%;}
	.r-item-3 { width: 50%;}

	.covers-list .cl-item:nth-child(3n+1) { clear: none;}
	.covers-list .cl-item:nth-child(2n+1) { clear: left;}
}
@media (max-width: 500px) {
	.r-item { float: none; width: auto;}
	.r-item-2 { float: none; width: auto;}
	.r-item-3 { float: none; width: auto;}

	.ta-r { text-align: left;}

	.header-item { padding-top: 90px;}
	.header-item .heading { font-size: 32px; line-height: 38px;}
	.header-item .tagline { float: none; width: auto; margin-bottom: 8px;}
	.header-item nav { float: none; width: auto; text-align: left;}
	.header-item nav ul li { margin-left: 0 !important;}

	.covers-list .cl-item:nth-child(2n+1) { clear: none;}

	/*.promo-cover { margin-left: -300px; margin-right: -300px;}*/
	.promo-cover { margin-left: -30px; margin-right: -30px;}
	
	.page-cover { padding: 80px 0;}
	.pc-inner { display: block; max-width: 100%; padding: 0 30px;}
}