@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,800&subset=cyrillic-ext');
@font-face {
	font-family:TOCent;
	src:url("../fonts/21Cent.otf") format("opentype");
}

body {background:#e6e7e6; overflow:hidden;}

.loader {position:absolute; z-index:9999; top:0; left:0; width:100%; height:100%; background:#fff url('../img/spinner.gif') no-repeat center center;}
.b {font-weight:600}

#page_header {width:100%; background:#fff; box-shadow:0 0 10px rgba(0,0,0,.3); position:relative; z-index:2}
	#page_header .sk_logo {background:url(../img/logo_skv.png) no-repeat center center /contain; height:80px; width:147px; display:inline-block; text-indent:-9999px; margin-right:2rem}
	#page_header .pravo_logo {background:url(../img/logo_pravo_bw.png) no-repeat center bottom /contain; height:69px; width:121px; display:inline-block; text-indent:-9999px;}
.social-likes_notext .social-likes__button {width:26px; height:26px;}
.social-likes__widget {border-radius:100%; background-color:#0d5c5e!important;}
.social-likes__widget .pdf {background:transparent url(../img/icon_pdf.svg) no-repeat center center /16px; display:block; width:26px; height:26px; border-radius:100%;}
.social-likes__icon_twitter {top:.23rem!important;}
.social-likes__icon_facebook {top:.15rem!important; left:.2rem!important;}
.social-likes__icon_vkontakte {top:.3rem!important; left:.22rem!important;}

.fold {min-height:100%; min-height:100vh; background:#fff; box-shadow:0 0 5px rgba(0,0,0,.3);}
.shadowed {background:linear-gradient(to right, rgba(0,0,0,.3) 0px, rgba(0,0,0,.15) 10px, rgba(0,0,0,.05) 23px, transparent 50px);}

.full {background:linear-gradient(to right, rgba(0,0,0,.3) 0px, rgba(0,0,0,.15) 10px, rgba(0,0,0,.05) 23px, transparent 50px), url(../img/intro_page2.jpg) no-repeat center center /cover}
.anch {position:absolute; bottom:80px; bottom:calc(80px + .9375rem); left:50%; width:36px; height:36px; margin-left:-18px; background-color:rgba(255,255,255,.2); background-repeat:no-repeat; background-position:center 9px; background-size:20px; border-radius:100%; -webkit-transition:background-color .3s .0s; -moz-transition:background-color .3s .0s; -ms-transition:background-color .3s .0s; -o-transition:background-color .3s .0s; transition:background-color .3s .0s;}
.anch:hover {cursor:pointer; background-color:rgba(255,255,255,.8)}
.anch.down {background-image:url('../img/icon_down_arr.svg')}
.anch.up {background-image:url('../img/icon_up_arr.svg')}

.intro {background:url(../img/intro_bg.jpg) no-repeat center center /cover; color:#fff; display:flex; flex-direction:column; justify-content:center; padding:80px 2rem;}
	.intro h2 {font-family:TOCent, Georgia, serif; font-size:3rem; letter-spacing:1px; line-height:1; position:relative; padding-top:3rem;}
		.intro h2:before {content:""; position:absolute; top:0; left:0; width:100%; border-bottom:1px dotted #fff; height:20px;}
		.intro h2:after {content:""; position:absolute; top:0; left:50%; width:40px; height:40px; background:#fff url(../img/icon_grad_hat.svg) no-repeat center center /32px; margin-left:-20px; border-radius:100%;}
	.intro h4 {font-family:Roboto, sans-serif; font-weight:300; letter-spacing:1px; position:relative; padding-bottom:2rem; margin-bottom:2rem;}
		.intro h4:before {content:""; position:absolute; bottom:0; left:0; width:100%; border-bottom:1px dotted #fff;}
	.intro p {font-family:TOCent, Georgia, serif;}
		.intro p {margin:0}
		.intro p:last-child {margin-bottom:2rem}
		.intro p:first-letter {padding-left:2rem;}
		.intro p:first-of-type::first-letter {float:left; font-size:5.5em; line-height:0.7em; margin-top:9px; padding-right:12px; padding-left:0;}

.intro.article {background:#fff; color:#000;}
.intro.article h2 {font-size:2.5rem; margin-bottom:2rem;}
.intro.article h2:before {content:""; position:absolute; top:0; left:5%; width:90%; border-bottom:1px dotted #000; height:20px;}
.intro.article h2:after {content:attr(data-case_n); position:absolute; top:0; left:50%; width:36px; height:36px; background:#000; margin-left:-18px; border-radius:100%; color:#fff; font-family:Roboto, sans-serif; letter-spacing:-1px; font-size:.8rem; line-height:37px;}
.intro.article .lead p {font-family:Roboto, sans-serif; text-align:center; font-weight:400; font-size:.9rem; color:#3F3F3F;}
.intro.article p:first-of-type::first-letter {float:none; font-size:1em; margin-top:0; padding-right:0; padding-left:0;}
.intro.article .lead p a {text-transform:uppercase; font-size:.9rem; margin-top:1.5rem; font-weight:800; color:#0d5c5e; display:inline-block; position:relative}
.intro.article .lead p a:after {position:absolute; content:""; width:100%; border-bottom:2px solid #0d5c5e; bottom:0; left:0;}

.content.article {-webkit-column-count:2; -moz-column-count:2; column-count:2; -webkit-column-gap:1.874rem; -moz-column-gap:1.874rem; column-gap:1.874rem; -webkit-column-fill:balance; -moz-column-fill:balance; column-fill:balance; position:relative; padding-top:1.2rem; padding-bottom:1.2rem;}
	.content.article:after {content:""; position:absolute; top:0; left:50%; height:100%; width:50%; pointer-events:none;background:linear-gradient(to right, rgba(0,0,0,.3) 0px, rgba(0,0,0,.15) 10px, rgba(0,0,0,.05) 23px, transparent 50px);}
	.content.article h2 {font-size:2rem; margin-bottom:2rem; font-family:TOCent, Georgia, serif; letter-spacing:1px; line-height:1; position:relative; padding-top:3rem;}
	.content.article h2:before {content:""; position:absolute; top:18px; left:0; width:100%; border-top:1px dotted #000; border-bottom:1px dotted #000; height:100%;}
	.content.article h2:after {content:attr(data-case_n); position:absolute; top:0; left:50%; width:36px; height:36px; background:#000; margin-left:-18px; border-radius:100%; color:#fff; font-family:Roboto, sans-serif; letter-spacing:-1px; font-size:.8rem; line-height:37px; font-weight:600;}
	.content.article div.paragraph,
	.content.article .participants {display:inline-block;}
	.content.article .participants .column {display:flex;}
	.content.article .participants .wrapper {background:#8cd3d5; position:relative; margin:20px 0; padding:40px 20px 20px; flex:1; font-size:.8rem;}
	.content.article .participants .wrapper:before {content:""; position:absolute; top:-18px; left:50%; margin-left:-18px; width:36px; height:36px; background:#fff url(../img/icon_participant.svg) no-repeat center center /16px; border-radius:100%;}
	.content.article .participants header {font-weight:600; font-size:1rem; margin-bottom:.5rem;}
	.content.article .full_text {font-family:Roboto, sans-serif; font-size:.85rem;}
	.content.article .full_text h3 {text-transform:uppercase; font-size:.9rem; margin-top:1.5rem; font-weight:800; color:#0d5c5e}

	.judicial_comment {font-size:.9rem; margin-top:1.5rem; font-weight:800; padding-left:80px; background:url(../img/icon_quotes.svg) no-repeat left top /40px; display:inline-block;}
	.case_btn a {position:fixed; z-index:2; top:25%; margin-left:-18px; width:36px; height:36px; font-size:.8rem; background:#fff; border-radius:100%; text-align:center; line-height:38px; box-shadow:0 0 5px rgba(0,0,0,.4); color:#000; font-family:Roboto, sans-serif; font-weight:600;}
	.case_btn.next_case a {margin-left:70.5rem; margin-left:calc(70.5rem - 18px);}

	.menu_toggler {max-width:100%; margin-left:17px;}
		.menu_toggler div {border-bottom:5px solid #000; position:relative; color:transparent; height:25px; width:35px; cursor:pointer; text-indent:-9999px;}
		.menu_toggler div:before {content:""; position:absolute; width:100%; left:0; top:0; height:0; border-bottom:5px solid #000;}
		.menu_toggler div:after {content:""; position:absolute; width:100%; left:0; bottom:5px; height:0; border-bottom:5px solid #000;}
		.menu_toggler div.cl {border-bottom:none;}
		.menu_toggler div.cl:after {transform:rotate(45deg); bottom:9px;}
		.menu_toggler div.cl:before {transform:rotate(-45deg); top:11px;}
		#page_header .home,
		.menu_toggler .home {display:block; width:36px; height:36px; margin-bottom:2rem; text-indent:-9999px; background:url(../img/icon_back.svg) no-repeat top center /36px;}
		#page_header .home {display:inline-block; margin-bottom:0; margin-right:.1rem; height:80px; background-position:left 33px; background-size:20px;}
		aside.sidebar {position:relative; width:23%; left:-23%; overflow:hidden; background:#e6e7e6}
			aside.sidebar .sidebar_wrapper {height:100%; overflow:hidden; overflow-y:auto; padding:0 .9375rem .9375rem}
				aside.sidebar ul {list-style:none; margin:0;}
					aside.sidebar li {border-top:1px solid #bbb;}
					aside.sidebar li:last-child {border-bottom:1px solid #bbb;}
					aside.sidebar li a {display:block; height:100%; padding:.9375rem 0; color:#000; font-family:Roboto, sans-serif; font-size:.8rem;}
						aside.sidebar li a span {display:block; font-weight:600;}

.tile_grid {padding-top:.9375rem;}
.tile {margin-bottom:.9375rem; min-height:110px; font-family:TOCent, Georgia, serif; font-weight:600; font-size:.8rem;}
	.tile.halves {font-size:.8rem; line-height:1.1;}
	.tile.top_title {font-size:1.2rem}
		.tile.top_title .text-center {padding-left:1rem!important; padding-right:1rem!important; line-height:1.2}
	.tile.halves_large {font-size:1.5rem}
		.tile.halves_large .text-center {line-height:1.4}
	.tile img {display:block; width:100%;}
	.tile .text-center {padding-left:.5rem!important; padding-right:.5rem!important; display:flex; flex-direction:column;}
		.tile .case_n {position:relative;}
		.tile .case_n span {display:block; background:#000; color:#fff; border-radius:100%; margin:.3rem auto; height:24px; line-height:24px; width:24px; letter-spacing:-1px; font-size:.55rem; position:relative; z-index:1; font-family:Roboto, sans-serif;}
		.tile .case_n:after {content:""; position:absolute; width:100%; height:0; top:17px; left:0; border-bottom:1px dotted #000;}
		.tile.top_title .case_n:after,
		.tile.halves_large .case_n:after {width:70%; left:15%;}
	.tile > a > .blue {background:#d1e6f6}
	.tile > a > .marine {background:#cbe9ec}
	.tile > a > .orange {background:#fde38c}
	.tile a {display:block; color:#000;}

.left_page .tile {padding-left:0;}
.right_page .tile {padding-right:0;}


@media screen and (max-width: 39.9375em) {
	#page_header .pravo_logo {float:right;}
	#page_header .sk_logo {margin-right:1rem;}

	.intro {padding:20px 1rem;}
		.intro h2 {font-size:2rem;}
		.intro h4 {font-size:1rem; padding-bottom:1rem;}
		.intro p {font-size:.9rem;}
		.intro p:first-letter {padding-left:1rem;}
		.intro p:first-of-type::first-letter {float:left; font-size:5.5em; line-height:0.7em; margin-top:9px; padding-right:7px; padding-left:0;}

	.shadowed {background:none;}

	.tile_grid {padding:0;}
	.tile {margin-bottom:.5rem;}
	.tile:last-child {margin-bottom:0;}
	.tile.halves_large .column:not(.text-center) {padding:0!important;}
	.tile.top_title .case_n:after, .tile.halves_large .case_n:after {width:100%; left:0;}
	.tile .text-center {padding-left:.9375rem!important; padding-right:.9375rem!important; line-height:1.4; align-self:center; font-size:.9rem;}
	.tile.top_title .text-center {padding-left:1.5rem!important; padding-right:.5rem!important;}
	.tile .column {height:auto!important;}
	.tile .small-order-1 {padding-left:1.8rem!important;}

	.intro.article h2 {font-size:2rem;}
	.intro.article .lead p {font-size:.8rem;}

	.content.article {-webkit-column-count:1; -moz-column-count:1; column-count:1;}
	.content.article:after {display:none;}
	.judicial_comment {padding-left:50px; background-size:30px;}
}

@media screen and (min-width: 40em) and (max-width: 63.9375em) {
	.intro {padding:20px 1rem;}
	.intro h2 {font-size:2rem;}
	.intro h4 {font-size:1rem; padding-bottom:1rem;}
	.intro p:first-letter {padding-left:1rem;}
	.intro p:first-of-type::first-letter {float:left; font-size:5.5em; line-height:0.7em; margin-top:9px; padding-right:7px; padding-left:0;}

	.tile_grid {padding:0;}
	.tile:last-child {margin-bottom:0;}
	.tile.halves_large .column:not(.text-center) {padding:0!important;}
	.tile.top_title .case_n:after, .tile.halves_large .case_n:after {width:100%; left:0;}
	.tile .text-center {padding-left:.9375rem!important; padding-right:.9375rem!important; line-height:1.4; align-self:center; font-size:1rem;}
	.tile.top_title .text-center {padding-left:.5rem!important; padding-right:.5rem!important;}
	.tile .column {height:auto!important;}

	.intro.article h2 {font-size:2rem;}
	.intro.article .lead p {font-size:.8rem;}
}

@media screen and (min-width: 64em) and (max-width: 74.9375em) {
	#page_header .large-collapse {padding:0 .9375rem;}
	.tile.top_title .text-center {height:122px!important; font-size:1rem;}
	.tile.halves {font-size:.75rem;}
}