hr {border: 0; margin: 0; height: 1rem; clear: both}
hr.h05 {height: .5rem}
hr.h1 {height: 1rem}
hr.h2 {height: 2rem}
hr.h3 {height: 3rem}
hr.h4 {height: 4rem}
hr.h5 {height: 5rem}
hr.h6 {height: 6rem}
hr.h7 {height: 7rem}
hr.h8 {height: 8rem}
hr.h9 {height: 9rem}
hr.h10 {height: 10rem}
hr.h15 {height: 15rem}
hr.h20 {height: 20rem}
img {width: 100%; max-width: 100%; display: block}
ul {margin: 0; padding: 0 0 0 2rem; list-style: none}
li {position: relative; padding-bottom: .5rem}
li:last-child {padding-bottom: 0}
li:before {content: "—"; position: absolute; left: -2rem}
.container {width: 90%; max-width: 65.625rem; margin: 0 auto; /*background: rgba(200,100,50,.3)*/}
.img {background: #ddd no-repeat center; background-size: contain}
.cover {background-size: cover}
.left {text-align: left}
.right {text-align: right}
.center {text-align: center}
.table {display: table}
.td {display: table-cell}
.absolute {position: relative}
.relative {position: relative}
#monitor {position: fixed; background: #fff; padding: .5rem; z-index: 4; display: none}
.find {background: rgba(255,0,0,.2)}
.none {display: none}

/* grid */
.line, .noadapt-line {clear: both}
.line::after, .noadapt-line::after {content: "."; display: block; height: 0; overflow: hidden; clear: both}
[class^='col'] {margin: 0 1%; box-sizing: border-box; float: left}
[class^='col']:first-child {margin-left: 0; clear: both}
[class^='col']:last-child {margin-right: 0}
.col1 {width: 6.5%}
.col2 {width: 15%}
.col3 {width: 23.5%}
.col4 {width: 32%}
.col5 {width: 40.5%}
.col6 {width: 49%}
.col7 {width: 57.5%}
.col8 {width: 66%}
.col9 {width: 74.5%}
.col10 {width: 83%}
.col11 {width: 91.5%}
.col12 {width: 100%}
@media (max-width: 100rem) {.line > [class^='col'] {margin: 0 0 1rem 0; width: 100%; text-align: left; float: none}}

/* buttons */
.button {
	display: inline-block;
	border: .25rem solid #00b9e3;
	border-radius: 1.3125rem;
	padding: .375rem 3rem;
	margin: 0 .5rem;
	text-decoration: none !important;
	background: #00b9e3;
	color: #fff;
	text-align: center;
	cursor: pointer;
}
.button:first-child {margin-left: 0}
.button:last-child {margin-right: 0}
.button i {position: relative; left: -.5rem; color: #fff}
.button:hover {background: transparent; color: #00b9e3}
.cancel {background: #999}
.cancel:hover {background: #888}

/* menu */
#menu {margin-top: .625rem; display: inline-block; float: right}
#menu ul {list-style: none; margin: 0; padding: 0}
#menu li {display: inline-block; padding: .75rem 1.25rem; cursor: pointer}
#menu li:hover {background: #444}
#menu a {text-decoration: none; color: #fff; display: block}
#menu .close, #burger {display: none}

#menu.mobile {
	position: fixed;
	height: 100%;
	right: 0;
	margin-top: 0;
	background: #ddd;
	box-shadow: inset 0 0 .1875rem rgba(0,0,0,.3);
}
#menu.mobile ul {margin-top: 3rem}
#menu.mobile li {display: block; margin: 0; padding: 1.25rem 2rem}
#menu.mobile li:hover {border-bottom: 0; background: #eee}
#menu.mobile a {color: #333}
#menu.mobile .close {position: absolute; top: .5rem; right: .5rem; display: inline-block}
#menu.mobile .close:hover {color: #444; cursor: pointer}
#burger {float: right; margin-top: 1rem; color: #bbb}
#burger:hover {color: #eee; cursor: pointer}

/* slider */
.slider::after {content: "."; display: block; height: 0; overflow: hidden; clear: both}
.slide {position: absolute; width: 100%; display: none; float: left}
.slide:first-child {position: relative; display: block}

.controls {position: relative; display: block}
.prev, .next {
	position: absolute;
	width: 5rem;
	text-align: center;
	cursor: pointer;
	z-index: 1;
}
.prev img, .next img {position: relative; display: inline-block}
.prev:hover, .next:hover {opacity: 1}
.prev {left: 0}
.next {right: 0}

.red {color: #e53935}
.green {color: #43a047}
.orange {color: #f57c00}
.yellow {color: #afb42b}
.blue {color: #00b9e3}

/* custom */
.interview > div {display: table; max-width: 70%; clear: both; margin: 1.5rem 0}
.interview > div > div {display: table-cell; vertical-align: top}
.interview > div:nth-child(odd) {float: left}
.interview > div:nth-child(odd) > div:nth-child(1) {width: 4.125rem; padding: 0 1rem}
.interview > div:nth-child(odd) > div:nth-child(2) {position: relative; background: #f7f7f7; padding: 2rem 3rem; border-radius: .625rem}
.interview > div:nth-child(odd) > div:nth-child(2)::after {
  content: "";
  position: absolute;
  top: 1.5rem;
  right: 100%;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: .625rem .625rem .625rem 0;
  border-color: transparent #f7f7f7 transparent transparent;
}
.interview > div:nth-child(even) {float: right}
.interview > div:nth-child(even) > div:nth-child(2) {width: 4.125rem; padding: 0 1rem}
.interview > div:nth-child(even) > div:nth-child(1) {position: relative; background: #e6e6e6; padding: 2rem 3rem; border-radius: .625rem}
.interview > div:nth-child(even) > div:nth-child(1)::after {
  content: "";
  position: absolute;
  top: 1.5rem;
  left: 100%;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: .625rem 0 .625rem .625rem;
  border-color: transparent transparent transparent #e6e6e6;
}
.alles-header {position: relative; background: url(../images/identity/_alles/first.bg.jpg) no-repeat center; background-size: cover; color: #fff}
.alles-filter {position: absolute; width: 100%; height: 100%; background: url(../images/identity/_alles/first.pattern.png); opacity: .5}
.elki-header {background: url(../images/sites/elki_life/banner.jpg) no-repeat; background-size: cover; color: #fff}
.vlad-header {background: url(../images/sites/vlad_boykov/first.bg.jpg) no-repeat; background-size: cover; color: #fff}