@import url(https://fonts.googleapis.com/css?family=Roboto+Mono&subset=latin,cyrillic);
@import url(//fonts.googleapis.com/css?family=Roboto+Condensed:400,300&subset=latin,cyrillic-ext);
@import url(//weloveiconfonts.com/api/?family=fontawesome);
/* TRANSITION */
/* fontawesome */
[class*="fontawesome-"]:before {
  font-family: 'FontAwesome', sans-serif;
}

@font-face {
  font-family: 'gotham_proregular';
  src: url("../fonts/gothaproreg.eot");
  src: url("../fonts/gothaproreg.eot?#iefix") format("embedded-opentype"), url("../fonts/gothaproreg.woff2") format("woff2"), url("../fonts/gothaproreg.woff") format("woff"), url("../fonts/gothaproreg.ttf") format("truetype"), url("../fonts/gothaproreg.svg#gotham_proregular") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'gotham_promedium';
  src: url("../fonts/gothapromed.eot");
  src: url("../fonts/gothapromed.eot?#iefix") format("embedded-opentype"), url("../fonts/gothapromed.woff2") format("woff2"), url("../fonts/gothapromed.woff") format("woff"), url("../fonts/gothapromed.ttf") format("truetype"), url("../fonts/gothapromed.svg#gotham_promedium") format("svg");
  font-weight: normal;
  font-style: normal;
}

@-webkit-keyframes rotate {
  from {
    -webkit-transform: rotate(0deg);
    -webkit-transform-origin: 50% 50%;
  }

  to {
    -webkit-transform: rotate(360deg);
    -webkit-transform-origin: 50% 50%;
  }
}

@-moz-keyframes rotate {
  from {
    -moz-transform: rotate(0deg);
  }

  to {
    -moz-transform: rotate(360deg);
  }
}

@-o-keyframes rotate {
  from {
    -o-transform: rotate(0deg);
  }

  to {
    -o-transform: rotate(360deg);
  }
}

* {
  margin: 0;
  padding: 0;
  -webkit-text-size-adjust: none;
}

input:focus, textarea:focus {
  outline: none;
}

body {
  font-family: 'Roboto Condensed', sans-serif;
  font-family: "gotham_proregular", Arial, sans-serif;
  font-weight: normal;
  font-size: 62.5%;
  font-weight: 100;
  color: #3b3b3b;
  background: #eeeeee url("../i/bg-astronim.jpg") 50% 50% repeat;
  -webkit-background-size: cover;
  background-size: cover;
  -webkit-transition: background 0.6s ease-in-out;
  -moz-transition: background 0.6s ease-in-out;
  -ms-transition: background 0.6s ease-in-out;
  -o-transition: background 0.6s ease-in-out;
  transition: background 0.6s ease-in-out;
}

/*resets*/
a img, fieldset {
  border: none;
}

a {
  color: #000;
  text-decoration: underline;
}
a:hover {
  text-decoration: none;
}

b {
  font-weight: 400;
}

button::-moz-focus-inner {
  padding: 0;
  border: 0;
}

input[type="submit"]::-moz-focus-inner {
  padding: 0;
  border: 0;
}

header, footer, article, nav, section {
  display: block;
}

input[disabled="disabled"] {
  cursor: default;
}

ul, ol {
  list-style-position: outside;
}

h1 {
  font-size: 48px;
  line-height: 1;
  padding: 0.1em 0 3rem;
  text-transform: uppercase;
  /*font-family: 'gotham_promedium';*/
  font-family: 'Roboto Mono', Arial, sans-serif;
  font-weight: 400;
}

h2 {
  font-size: 38px;
  line-height: 1;
  padding-bottom: 0.5em;
  font-weight: 400;
}

h3 {
  font-size: 30px;
  line-height: 1;
  padding-bottom: 0.5em;
  font-weight: 400;
}

h4 {
  font-size: 24px;
  line-height: 1;
  padding-bottom: 0.5em;
  text-transform: uppercase;
  font-weight: 400;
}

h5 {
  font-size: 16px;
  line-height: 1;
  padding: 8px 0;
  text-transform: uppercase;
  font-weight: 400;
  font-family: "gotham_promedium";
}

p {
  font-size: 1.3em;
  padding-bottom: 0.7em;
  line-height: 1.5;
}
p b {
  font-family: "gotham_promedium";
  font-weight: 400;
}

hr {
  font: 0/0 a;
  text-shadow: none;
  color: transparent;
  height: 0;
  border-top: 2px dashed #82221a;
  margin-bottom: 20px;
}

.table {
  display: table;
}

.row {
  display: table-row;
}

.cell {
  display: table-cell;
}

.preload {
  display: none;
}

form.simple {
  border: 3px dashed #ededed;
  padding: 10px 50px;
  margin: 10px;
  background: #fff;
}
form.simple h1 {
  padding: 10px;
  font-size: 32px;
}
form.simple p {
  padding-bottom: 20px;
  font-size: 1.4em;
}
form.simple ul {
  list-style: none;
}
form.simple ul li {
  padding-bottom: 10px;
}
form.simple .table {
  width: 100%;
  table-layout: fixed;
}
form.simple .cell {
  padding: 0 10px;
}
form.simple .radioContainer {
  padding-right: 30px;
}
form.simple .checkboxContainer {
  font-size: 12px;
}
form.simple label span {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  vertical-align: top;
  overflow: hidden;
}

.success {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  display: none;
  padding-top: 150px;
}

input[type="text"],
input[type="password"],
input[type="search"],
textarea {
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  -webkit-box-shadow: inset -1px 1px 1px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: inset -1px 1px 1px rgba(0, 0, 0, 0.4);
  box-shadow: inset -1px 1px 1px rgba(0, 0, 0, 0.4);
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: #eee;
  padding: 0 10px;
  width: 100%;
  height: 32px;
  font-size: 16px;
  font-family: Arial, sans-serif;
  border-top: 1px solid #777;
  border-right: 1px solid #777;
  border-bottom: 1px solid #ccc;
  border-left: 1px solid #ccc;
}
input[type="text"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus {
  background: #f1f1f1;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  -webkit-box-shadow: inset 0 0 1px 1px #0a922f;
  -moz-box-shadow: inset 0 0 1px 1px #0a922f;
  box-shadow: inset 0 0 1px 1px #0a922f;
  border: 1px solid #0a922f;
}
input[type="text"].short,
input[type="password"].short,
input[type="search"].short,
textarea.short {
  width: 150px;
}

input[type="search"] {
  -webkit-appearance: textfield;
}

input[type="search"]::-ms-clear {
  display: none;
}

input[type="search"]::-webkit-search-cancel-button {
  display: none;
}

textarea {
  padding: 10px;
  height: 100px;
  resize: none;
}

.wrapper {
  width: 100%;
  -webkit-transition: left 0.25s ease-in-out;
  -moz-transition: left 0.25s ease-in-out;
  -ms-transition: left 0.25s ease-in-out;
  -o-transition: left 0.25s ease-in-out;
  transition: left 0.25s ease-in-out;
  position: absolute;
  left: 0;
  z-index: 50;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
}
.wrapper.hide {
  1left: 50%;
  1width: 50%;
}

.table {
  width: 50%;
}
.table.wide {
  width: 100%;
  margin: 0 auto;
  table-layout: fixed;
}
.table.wide .cell {
  width: 50%;
}
.table.wide90 {
  width: 90%;
  margin: 0 auto;
}
.table.wide90 .cell {
  width: 50%;
}
.table.middle {
  height: 100%;
}
.table.middle .cell {
  vertical-align: middle;
}
.table .center {
  text-align: center;
}
.table article {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  padding: 0 10%;
  max-width: 600px;
  margin: 0 auto;
  font-size: 16px;
  position: relative;
  -webkit-transform: rotateY(-90deg);
  -ms-transform: rotateY(-90deg);
  -o-transform: rotateY(-90deg);
  transform: rotateY(-90deg);
}
.table article p {
  line-height: 1.25;

}
.table article.wide {
  max-width: 100%;
}
.table article .bg-text {
  position: relative;
  padding: 0;
}
.table article .bg-text:before {
  display: none;
  position: absolute;
  content: "";
  width: 5px;
  height: 100%;
  left: -5px;
  top: 0;
  padding: 0;
  background: #fff;
  background: rgba(255, 255, 255, 0.75);
}
.table article .bg-text span {
  display: inline;
  background: #fff;
  background: rgba(255, 255, 255, 0.75);
  padding: 5px;
  margin: 0;
  line-height: 1.635em;
  -webkit-box-shadow: 10px 0 0 rgba(255, 255, 255, 0.75);
  -moz-box-shadow: 10px 0 0 rgba(255, 255, 255, 0.75);
  box-shadow: 10px 0 0 rgba(255, 255, 255, 0.75);
}
.table.fl {
  float: left;
}
.table.fr {
  float: right;
}
.table.fr article {
  padding: 0 20% 0 0;
}

.active article {
  -webkit-transition: transform 0.3s ease 0.3s;
  -moz-transition: transform 0.3s ease 0.3s;
  -ms-transition: transform 0.3s ease 0.3s;
  -o-transition: transform 0.3s ease 0.3s;
  transition: transform 0.3s ease 0.3s;
  -webkit-transform: rotateY(0deg);
  -ms-transform: rotateY(0deg);
  -o-transform: rotateY(0deg);
  transform: rotateY(0deg);
}

.img_box {
  position: absolute;
  width: 40%;
  height: 90%;
  top: 5%;
  left: 50%;
  overflow: hidden;
  -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
  -webkit-border-radius: 3px 0 0 3px;
  -moz-border-radius: 3px 0 0 3px;
  -ms-border-radius: 3px 0 0 3px;
  -o-border-radius: 3px 0 0 3px;
  border-radius: 3px 0 0 3px;
}
.img_box:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.img_box img {
  height: 100%;
}
.img_box li {
  height: 100%;
  float: left;
}
.img_box.relative {
  position: relative;
  left: 5%;
}

section.section {
  overflow: hidden;
  position: relative;
  z-index: 20;
}
section.section .table {
  position: relative;
  z-index: 20;
}

section.fixed {
  z-index: 5;
}

section.fixed.active {
  z-index: 10;
}

.section img {
  height: 100%;
}
.section img.origin {
  -moz-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transform: scale(1.3) translateZ(0);
  -moz-transform: scale(1.3) translateZ(0);
  -ms-transform: scale(1.3) translateZ(0);
  -o-transform: scale(1.3) translateZ(0);
  transform: scale(1.3) translateZ(0);
  height: auto;
  position: relative;
  width: 100%;
  max-width: 700px;
  min-width: 320px;
}
.section img.show {
  -webkit-transform: scale(1) translateZ(0);
  -moz-transform: scale(1) translateZ(0);
  -ms-transform: scale(1) translateZ(0);
  -o-transform: scale(1) translateZ(0);
  transform: scale(1) translateZ(0);
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}
.section img.shade {
  -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.3);
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.3);
}

.section i.img {
  display: block;
  margin: 20px auto;
  width: 100%;
  min-height: 50px;
  min-width: 320px;
  padding: 0;
  position: relative;
  max-width: 700px;
}
.section i.img img {
  min-width: 0;
  max-width: 2000;
}
.section i.img b {
  -moz-animatiom: rotate 1s linear 0s infinite normal none;
  -webkit-animation: rotate 1s linear 0s infinite normal none;
  -o-animation: rotate 1s linear 0s infinite normal none;
  animation: rotate 1s linear 0s infinite normal none;
  background: transparent url("../i/icons/ico-star.png") 0 0 no-repeat;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -16px;
  margin-top: -16px;
  width: 32px;
  height: 32px;
  display: block;
  content: " ";
}
.section i.img .opts {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -moz-transition: opacity 0.1s ease-in-out;
  -webkit-transition: opacity 0.1s ease-in-out;
  -o-transition: opacity 0.1s ease-in-out;
  -ms-transition: opacity 0.1s ease-in-out;
  transition: opacity 0.1s ease-in-out;
  display: none;
  position: absolute;
  top: 50%;
  margin-top: -13px;
  width: 100%;
  z-index: 20;
  text-align: center;
}
.section i.img .opts a {
  position: relative;
  -webkit-transform: translateY(25px);
  -ms-transform: translateY(25px);
  -o-transform: translateY(25px);
  transform: translateY(25px);
}
.section i.img:hover .opts {
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}
.section i.img:hover .opts a {
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  -webkit-transform: translateY(0px);
  -ms-transform: translateY(0px);
  -o-transform: translateY(0px);
  transform: translateY(0px);
}
.section i.img:hover .opts a:hover {
  -moz-transition: all 0s ease-in-out;
  -webkit-transition: all 0s ease-in-out;
  -o-transition: all 0s ease-in-out;
  -ms-transition: all 0s ease-in-out;
  transition: all 0s ease-in-out;
}
.section i.img u {
  -moz-transition: opacity 0.1s ease-in-out;
  -webkit-transition: opacity 0.1s ease-in-out;
  -o-transition: opacity 0.1s ease-in-out;
  -ms-transition: opacity 0.1s ease-in-out;
  transition: opacity 0.1s ease-in-out;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 10;
  display: none;
}
.section i.img:hover u {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.device .section i.img .opts {
  padding-top: 10px;
  display: block;
  top: auto;
  bottom: 0;
  opacity: 0;
  background-color: rgba(0,0,0,0.75);
  -webkit-transition: opacity 0.5s ease 0.5s;
  -o-transition: opacity 0.5s ease 0.5s;
  transition: opacity 0.5s ease 0.5s;
}

.device .section.active i.img .opts {
  opacity: 1;
}

.device .section i.img .opts a {
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0);
  transform: translateY(0);
}

.section .monitor {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  padding: 0;
  position: relative;
  width: 700px;
  height: 540px;
  background: transparent url("../i/fix-monitor.png") 0 0 no-repeat;
}
.section .monitor .in {
  width: 643px;
  height: 366px;
  margin: 27px 0 0 28px;
  overflow: auto;
}
.section .monitor .in img {
  width: 100%;
  height: auto;
  display: block;
}

.section .ipad {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  padding: 0;
  position: relative;
  width: 502px;
  height: 650px;
  background: transparent url("../i/ipad-frame-big.png") 0 0 no-repeat;
}
.section .ipad .in {
  width: 397px;
  height: 530px;
  margin: 59px 0 0 54px;
  overflow: auto;
}
.section .ipad .in img {
  width: 100%;
  height: auto;
  display: block;
}

.button_flat {
  margin: 0 5px 10px;
  padding: 10px 20px;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.3);
  font-size: 17px;
  color: #fff;
  font-style: normal;
  border: 2px solid #fff;
  text-decoration: none;
  text-transform: uppercase;
  background: transparent;
  cursor: pointer;
  font-family: "gotham_promedium";
  position: relative;
  z-index: 10;
}
.button_flat .ico-ext {
  vertical-align: top;
}
.button_flat.black {
  color: #000;
  border-color: #000;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
}
.button_flat:hover, .button_flat.black:hover {
  color: #fff;
  background: #0a922f;
  border-color: #0a922f;
}

.button_flat.black:hover .ico-ext {
  background: transparent url("../i/ico-ext.png") 0 0 no-repeat;
}


.button_flat.green {
  color: #16a563;
  border-color: #16a563;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
}
.button_flat:hover, .button_flat.green:hover {
  color: #fff;
  background: #16a563;
  border-color: #16a563;
}

.button_simple {
  background: -moz-linear-gradient(top, #fea300, #f25d01 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(10%, #fea300), color-stop(100%, #f25d01));
  background: -webkit-linear-gradient(top, #fea300, #f25d01 100%);
  background: -o-linear-gradient(top, #fea300, #f25d01 100%);
  background: -ms-linear-gradient(top, #fea300, #f25d01 100%);
  background: linear-gradient(top bottom, #fea300, #f25d01 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(StartColorStr='#fea300', EndColorStr='#f25d01',GradientType=0 );
  font-size: 20px;
  color: white !important;
  text-decoration: none;
  padding: 0 20px;
  height: 40px;
  line-height: 37px;
  display: inline-block;
  vertical-align: middle;
  zoom: 1;
  *display: inline;
  -o-border-radius: 8px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  border-radius: 8px;
  -o-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);
  cursor: pointer;
  font-style: normal;
  border: 0;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
}

.button_simple:hover {
  background: -moz-linear-gradient(top, #f25d01, #fea300 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(10%, #fea300), color-stop(100%, #fea300));
  background: -webkit-linear-gradient(top, #f25d01, #fea300 100%);
  background: -o-linear-gradient(top, #f25d01, #fea300 100%);
  background: -ms-linear-gradient(top, #f25d01, #fea300 100%);
  background: linear-gradient(top bottom, #f25d01, #fea300 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(StartColorStr='#f25d01', EndColorStr='#fea300',GradientType=0 );
}

.ico-ext,
.button_simple .ext {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  background: transparent url("../i/ico-ext.png") 0 0 no-repeat;
  width:  12px;
  height: 12px;
  -webkit-background-size: cover;
  background-size: cover;
  margin-left: 10px;
  display: none;
}

.black .ico-ext {
  background-image: url('../i/ico-ext-black.png');
}

.active .button_simple {
  -moz-transition: opacity 0.5s ease-in-out 1s;
  -webkit-transition: opacity 0.5s ease-in-out 1s;
  -o-transition: opacity 0.5s ease-in-out 1s;
  -ms-transition: opacity 0.5s ease-in-out 1s;
  transition: opacity 0.5s ease-in-out 1s;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.section .videobg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

.section .coverbg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=20);
  opacity: 0.2;
}

header.header {
  position: fixed;
  z-index: 100;
  top: 0;
  width: 100%;
  height: 50px;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
}
header.header .ico-star {
  margin: 10px;
  cursor: pointer;
}
header.header .ico-list {
  margin: 0 10px;
  cursor: pointer;
}
header.header.show {
  -moz-transition: all 1s ease-out 3.5s;
  -webkit-transition: all 1s ease-out 3.5s;
  -o-transition: all 1s ease-out 3.5s;
  -ms-transition: all 1s ease-out 3.5s;
  transition: all 1s ease-out 3.5s;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.list_show {
  -moz-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  position: fixed;
  top: 0;
  left: 0;
  cursor: pointer;
  z-index: 80;
  width: 48px;
  height: 48px;
  background: #199b4d;
  background: rgba(25, 155, 77, 0.8);
  text-align: center;
}
.list_show:hover {
  background: #199b4d;
}

.list_show i {
  display: block;
  width: 24px;
  height: 2px;
  background: #fff;
  -moz-transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  pointer-events: none;
  margin: 6px auto;
}
.list_show i:first-child {
  margin-top: 14px;
}
.list_show i:nth-child(2) {
  margin: 4px auto;
}

.list_show .hover {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  text-decoration: none;
  width: 48px;
  height: 48px;
  opacity: 0;
  -webkit-transition: opacity 0.25s;
  -o-transition: opacity 0.25s;
  transition: opacity 0.25s;
  opacity: 0;
  background: #199b4d;
}

.list_show .hover b {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  color: #fff;
  font-size: 28px;
  font-family: "gotham_promedium";
  font-weight: 400;
  text-align: center;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.3);
}

.list_show:hover .hover {
  opacity: 1;
}

.list_show .hover span {
  font-size: 9px;
  line-height: 16px;
  white-space: nowrap;
  top: 8px;
  left: 0;
  width: 100%;
  text-align: center;
  color: #fff;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
  border-top: 1px solid #fff;
}

.ico-star {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  width: 35px;
  height: 35px;
  background: transparent url("../i/icons/ico-star.png") 0 0 no-repeat;
}

.ico-list {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  width: 56px;
  height: 70px;
  background: transparent url("../i/icons/ico-list.png") 0 0 no-repeat;
}

#promo_text {
  -webkit-transition: all 0.5s ease 1.8s;
  -moz-transition: all 0.5s ease 1.8s;
  -ms-transition: all 0.5s ease 1.8s;
  -o-transition: all 0.5s ease 1.8s;
  transition: all 0.5s ease 1.8s;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  margin-top: 250px;
}
#promo_text.show {
  margin-top: 0;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}
#promo_text h1 {
  color: #16a563;
}

#scrollw {
  display: block;
  width: 85px;
  height: 85px;
  position: absolute;
  bottom: 20px;
  left: 50%;
  margin-left: -42px;
  background: transparent url("../i/icons/scrollw.png") 0 0 no-repeat;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -moz-transition: all 0.3s ease-out 3s;
  -webkit-transition: all 0.3s ease-out 3s;
  -o-transition: all 0.3s ease-out 3s;
  -ms-transition: all 0.3s ease-out 3s;
  transition: all 0.3s ease-out 3s;
  cursor: pointer;
  z-index: 100;
}
#scrollw.show {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=75);
  opacity: 0.75;
}
#scrollw b {
  display: block;
  position: absolute;
  background: transparent url("../i/icons/arrow-down.png") 0 0 no-repeat;
  width: 32px;
  height: 32px;
  bottom: -16px;
  left: 50%;
  margin-left: -16px;
  animation-duration: 1.5s;
  animation-delay: 4s;
  animation-iteration-count: infinite;
}

.promo_links .button_flat {
  font-size: 16px;
  padding: 16px;
  margin:  10px;
}

.tablet .promo_links .button_flat {
  font-size: 16px;
  padding: 16px;
  margin:  16px;
}

.mobile .promo_links .button_flat {
  font-size: 25px;
  padding: 18px;
  margin:  18px;
}


#readmore {
  position: absolute;
  bottom: 0;
  width: 100%;
  text-align: center;
  -moz-transition: all 0.7s ease-out 4s;
  -webkit-transition: all 0.7s ease-out 4s;
  -o-transition: all 0.7s ease-out 4s;
  -ms-transition: all 0.7s ease-out 4s;
  transition: all 0.7s ease-out 4s;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  z-index: 50;
}
#readmore.show {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
  bottom: 20px;
}


#fix-monitor {
  background: transparent url("../i/fix-monitor.png") 0 0 no-repeat;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 700px;
  height: 550px;
  margin-left: -350px;
  margin-top: 50%;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);

}
#fix-monitor i {
  display: block;
  width: 641px;
  height: 364px;
  position: relative;
  top: 28px;
  left: 29px;
  overflow: hidden;
}
#fix-monitor img {
  display: block;
  width: 100%;
  height: auto;
}
#fix-monitor.show {
  -webkit-transition: all .7s ease-in-out 0.3s;
  -moz-transition: all .7s ease-in-out 0.3s;
  -ms-transition: all .7s ease-in-out 0.3s;
  -o-transition: all .7s ease-in-out 0.3s;
  transition: all .7s ease-in-out 0.3s;
  margin-top: -275px;
}
#fix-monitor.right {
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  left: 100%;
  margin-left: -36%;
  margin-left: -46%;
}
#fix-monitor ul {
  margin: 27px 0 0 28px;
}
#fix-monitor li {
  width: 643px;
  height: 366px;
  list-style: none;
  float: left;
}

#fix-ipad {
  background: transparent url("../i/fix-ipad.png") 0 0 no-repeat;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 200px;
  height: 260px;
  margin-left: 160px;
  margin-top: 50%;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
}
#fix-ipad i {
  display: block;
  width: 158px;
  height: 211px;
  position: relative;
  top: 24px;
  left: 22px;
  overflow: hidden;
}
#fix-ipad img {
  display: block;
  width: 100%;
  height: auto;
}
#fix-ipad.show {
  -webkit-transition: all .7s ease-in-out .5s;
  -moz-transition: all .7s ease-in-out .5s;
  -ms-transition: all .7s ease-in-out .5s;
  -o-transition: all .7s ease-in-out .5s;
  transition: all .7s ease-in-out .5s;
  margin-top: 30px;
}
#fix-ipad.right {
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  left: 100%;
  margin-left: -38%;
  margin-left: -48%;
  margin-top: 0;
}
#fix-ipad ul {
  margin: 23px 0 0 22px;
}
#fix-ipad li {
  width: 158px;
  height: 211px;
  list-style: none;
  float: left;
}

#fix-iphone {
  background: transparent url("../i/fix-iphone.png") 0 0 no-repeat;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 61px;
  height: 126px;
  margin-left: 270px;
  margin-top: 50%;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
}
#fix-iphone i {
  display: block;
  width: 51px;
  height: 76px;
  position: relative;
  top: 25px;
  left: 6px;
  overflow: hidden;
}
#fix-iphone img {
  display: block;
  width: 100%;
  height: auto;
}
#fix-iphone.show {
  -webkit-transition: all .7s ease-in-out .7s;
  -moz-transition: all .7s ease-in-out .7s;
  -ms-transition: all .7s ease-in-out .7s;
  -o-transition: all .7s ease-in-out .7s;
  transition: all .7s ease-in-out .7s;
  margin-top: 193px;
}
#fix-iphone.right {
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  left: 100%;
  margin-left: -40%;
  margin-left: -50%;
  margin-top: 150px;
}
#fix-iphone ul {
  margin: 24px 0 0 5px;
}
#fix-iphone li {
  width: 52px;
  height: 78px;
  list-style: none;
  float: left;
}

.bg-blue1 {
  background: #3598db;
  color: #fff;
}

.bg-blue2 {
  background: #00a3fe;
  color: #fff;
}

.bg-red1 {
  background: #e22d38;
  color: #fff;
}

.bg-red2 {
  background: #db2d20;
  color: #fff;
}

.bg-green1 {
  background: #4db24a;
  color: #fff;
}

.bg-green2 {
  background: #07854f;
  color: #fff;
}

.bg-violet {
  background: #9988ff;
  color: #fff;
}

.bg-pink {
  background: #e9305a;
  color: #fff;
}

.bg-yellow {
  background: #fdd63b;
  color: #fff;
  color: #4ed000;
}

.case {
  width: 100%;
  height: 100%;
  table-layout: fixed;
}
.case .cell {
  vertical-align: top;
  text-align: center;
}

.controlArrow.prev, .controlArrow.next {
  width: 44px;
  height: 44px;
  margin-top: -22px;
}
.controlArrow.prev {
  background: transparent url("../i/slider-nav.png") 0 0 no-repeat;
  border: 0;
}
.controlArrow.next {
  background: transparent url("../i/slider-nav.png") -44px 0 no-repeat;
  border: 0;
  right: 50px;
}

.slider-green .controlArrow.prev {
  background: transparent url("../case/alfa/slider-nav.png") 0 0 no-repeat;
}
.slider-green .controlArrow.next {
  background: transparent url("../case/alfa/slider-nav.png") -44px 0 no-repeat;
}

.slider-red .controlArrow.prev, .slider-red .controlArrow.next {
  width: 46px;
  height: 46px;
  margin-top: -23px;
}
.slider-red .controlArrow.prev {
  background: transparent url("../case/ita/slider-nav.png") 0 0 no-repeat;
}
.slider-red .controlArrow.next {
  background: transparent url("../case/ita/slider-nav.png") -46px 0 no-repeat;
}

.loaderContainer {
  position: fixed;
  width: 100%;
  height: 100%;
  background: #ccc;
  color: #555;
  z-index: 100;
  top: 0;
  left: 0;
}

.loader {
  position: absolute;
  top: 50%;
  width: 100%;
  text-align: center;
}
.loader div {
  font-family: 'Roboto Condensed';
  font-size: 36px;
  text-shadow: 0 0 1px #fff;
  font-weight: 100;
}
.loader span {
  display: block;
}

#progress {
  position: absllute;
  top: 0;
  width: 100%;
  height: 3px;
  z-index: 100;
}
#progress b {
  -moz-transition: all 0.7s ease-in-out;
  -webkit-transition: all 0.7s ease-in-out;
  -o-transition: all 0.7s ease-in-out;
  -ms-transition: all 0.7s ease-in-out;
  transition: all 0.7s ease-in-out;
  position: absolute;
  display: block;
  width: 0;
  height: 3px;
  font-size: 0;
  left: 0;
  top: 0;
  background: #b12317;
  width: 0%;
}

span[class*="l-"] {
  height: 4px;
  width: 4px;
  background: #000;
  display: inline-block;
  margin: 12px 2px;
  border-radius: 100%;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  -webkit-animation: loader 4s infinite;
  -webkit-animation-timing-function: cubic-bezier(0.03, 0.615, 0.995, 0.415);
  -webkit-animation-fill-mode: both;
  -moz-animation: loader 4s infinite;
  -moz-animation-timing-function: cubic-bezier(0.03, 0.615, 0.995, 0.415);
  -moz-animation-fill-mode: both;
  -ms-animation: loader 4s infinite;
  -ms-animation-timing-function: cubic-bezier(0.03, 0.615, 0.995, 0.415);
  -ms-animation-fill-mode: both;
  animation: loader 4s infinite;
  animation-timing-function: cubic-bezier(0.03, 0.615, 0.995, 0.415);
  animation-fill-mode: both;
}

span.l-1 {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
  -ms-animation-delay: 1s;
  -moz-animation-delay: 1s;
}

span.l-2 {
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
  -ms-animation-delay: 0.8s;
  -moz-animation-delay: 0.8s;
}

span.l-3 {
  -webkit-animation-delay: 0.6s;
  animation-delay: 0.6s;
  -ms-animation-delay: 0.6s;
  -moz-animation-delay: 0.6s;
}

span.l-4 {
  -webkit-animation-delay: 0.4s;
  animation-delay: 0.4s;
  -ms-animation-delay: 0.4s;
  -moz-animation-delay: 0.4s;
}

span.l-5 {
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
  -ms-animation-delay: 0.2s;
  -moz-animation-delay: 0.2s;
}

span.l-6 {
  -webkit-animation-delay: 0;
  animation-delay: 0;
  -ms-animation-delay: 0;
  -moz-animation-delay: 0;
}

@-webkit-keyframes loader {
  0% {
    -webkit-transform: translateX(-30px);
    opacity: 0;
  }

  25% {
    opacity: 1;
  }

  50% {
    -webkit-transform: translateX(30px);
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

@-moz-keyframes loader {
  0% {
    -moz-transform: translateX(-30px);
    opacity: 0;
  }

  25% {
    opacity: 1;
  }

  50% {
    -moz-transform: translateX(30px);
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

@-keyframes loader {
  0% {
    -transform: translateX(-30px);
    opacity: 0;
  }

  25% {
    opacity: 1;
  }

  50% {
    -transform: translateX(30px);
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

@-ms-keyframes loader {
  0% {
    -ms-transform: translateX(-30px);
    opacity: 0;
  }

  25% {
    opacity: 1;
  }

  50% {
    -ms-transform: translateX(30px);
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

.details {
  -moz-transition: all 0.1s linear 0.3s;
  -webkit-transition: all 0.1s linear 0.3s;
  -o-transition: all 0.1s linear 0.3s;
  -ms-transition: all 0.1s linear 0.3s;
  transition: all 0.1s linear 0.3s;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  width: 100px;
  height: 200px;
  position: relative;
  padding-right: 20%;
  -webkit-transform: rotateX(0deg) rotateZ(0deg);
  transform: rotateX(0deg) rotateZ(0deg);
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}
.details .item {
  -webkit-box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
  -moz-transition: all 0.1s linear 0.3s;
  -webkit-transition: all 0.1s linear 0.3s;
  -o-transition: all 0.1s linear 0.3s;
  -ms-transition: all 0.1s linear 0.3s;
  transition: all 0.1s linear 0.3s;
  width: 200px;
  height: 200px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}
.details .item:first-child {
  z-index: 1;
  left: 0;
}
.details .item:last-child {
  z-index: 1;
  left: 0;
}
.details .item img {
  width: 100%;
  height: 100%;
}

.active .details {
  -moz-transition: all 0.5s ease-in-out 0.5s;
  -webkit-transition: all 0.5s ease-in-out 0.5s;
  -o-transition: all 0.5s ease-in-out 0.5s;
  -ms-transition: all 0.5s ease-in-out 0.5s;
  transition: all 0.5s ease-in-out 0.5s;
  -webkit-transform: rotateX(45deg) rotateZ(-30deg);
  transform: rotateX(45deg) rotateZ(-30deg);
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}
.active .details .item {
  -moz-transition: all 0.5s ease-in-out 1.5s;
  -webkit-transition: all 0.5s ease-in-out 1.5s;
  -o-transition: all 0.5s ease-in-out 1.5s;
  -ms-transition: all 0.5s ease-in-out 1.5s;
  transition: all 0.5s ease-in-out 1.5s;
  -webkit-box-shadow: -3px 3px 1px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: -3px 3px 1px rgba(0, 0, 0, 0.3);
  box-shadow: -3px 3px 1px rgba(0, 0, 0, 0.3);
}
.active .details .item:first-child {
  z-index: 1;
  left: -220px;
  top: -40px;
}
.active .details .item:last-child {
  z-index: 1;
  left: 220px;
  top: 40px;
}

.grid {
  width: 1060px;
  width: 100%;
  text-align: center;
  position: relative;
  left: 0;
  margin: 0 auto;
  transition: all 0.2s linear;
}

.grid div {
  display: inline-block;
  height: 225px;
  width: 225px;
  margin: 10px;
  list-style-type: none;
  background-size: 0, cover;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  transition: all 0.2s linear;
}

.grid div a {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 10;
}

.ita-item1 {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/ita/detail-1.png");
}

.ita-item2 {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/ita/detail-2.png");
}

.ita-item3 {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/ita/detail-3.png");
}

.ita-item4 {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/screens/maxler_700.jpg");
}

.alfa-item1 {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/alfa/detail-1.jpg");
}

.alfa-item2 {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/alfa/detail-2.jpg");
}

.alfa-item3 {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/alfa/detail-3.jpg");
}

.alfa-item4 {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/alfa/detail-4.jpg");
}

.item9 {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/screens/orlov-musical_700.jpg");
}

.item10 {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/screens/perehvat_700.jpg");
}

.item11 {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/screens/pizzatempo_700.jpg");
}

.item12 {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/screens/skvirel_700.jpg");
}

.item13 {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/screens/snegoviki2_700.jpg");
}

.item14 {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/screens/soyuz_700.jpg");
}

.item15 {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/screens/srs-electro_700.jpg");
}

.item16 {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/screens/svitland_700.jpg");
}

.item17 {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/screens/yo-auto_700.jpg");
}

.item18 {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/screens/belarusbank_700.png");
}

.item19 {
  background: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/screens/porto-porto_700.png");
}

.slide {
  position: relative;
  width: 100%;
  height: 100%;
}

.controlArrow {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=90);
  opacity: 0.9;
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.controlArrow:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.case-promo {

}

.case-ita {
  background: #eeeeee url("../case/ita/bg-pattern.png") 50% 50% fixed repeat;
}
.case-ita .grid .item1 {
  background-image: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/ita/detail-1.png");
}
.case-ita .grid .item2 {
  background-image: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/ita/detail-2.png");
}
.case-ita .grid .item3 {
  background-image: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/ita/detail-3.png");
}
.case-ita h1 {
  color: #862822;
}

.case-ics {
  background: #152d78 url('../case/ics/bg.jpg') 50% 50% no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  color: #fff;
}

.case-ics #ics-elem1 {
  -webkit-transition: transform 1.4s ease-out;
  -moz-transition: transform 1.4s ease-out;
  -ms-transition: transform 1.4s ease-out;
  -o-transition: transform 1.4s ease-out;
  transition: transform 1.4s ease-out;
  -webkit-transform: translateZ(0) translateY(400px);
  -ms-transform: translateZ(0) translateY(400px);
  -o-transform: translateZ(0) translateY(400px);
  transform: translateZ(0) translateY(400px);
  position: absolute;
  bottom: -60px;
  left: 50px;
  height: auto;
  max-width: 47%;
}

.case-ics.active #ics-elem1 {
  -webkit-transform: translateZ(0) translateY(0px);
  -ms-transform: translateZ(0) translateY(0px);
  -o-transform: translateZ(0) translateY(0px);
  transform: translateZ(0) translateY(0px);
}

.case-ics #ics-elem2 {
  -webkit-transition: transform 0.6s ease-out 0.7s;
  -moz-transition: transform 0.6s ease-out 0.7s;
  -ms-transition: transform 0.6s ease-out 0.7s;
  -o-transition: transform 0.6s ease-out 0.7s;
  transition: transform 0.6s ease-out 0.7s;
  -webkit-transform: translateZ(0) translateY(-400px);
  -ms-transform: translateZ(0) translateY(-400px);
  -o-transform: translateZ(0) translateY(-400px);
  transform: translateZ(0) translateY(-400px);
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -100px;
  height: auto;
}

.case-ics.active #ics-elem2 {
  -webkit-transform: translateZ(0) translateY(0px);
  -ms-transform: translateZ(0) translateY(0px);
  -o-transform: translateZ(0) translateY(0px);
  transform: translateZ(0) translateY(0px);
}

.case-alfa {
  background: #467e58;
  background: -webkit-gradient(linear, top left, bottom left, from(#539467), to(#335c40));
  background: -webkit-linear-gradient(#539467, #335c40);
  background: linear-gradient(#539467, #335c40);
  color: #fff;
}
.case-alfa a {
  color: #fff;
}
.case-alfa #alfa-elem1 {
  -moz-transition: all 0.3s linear;
  -webkit-transition: all 0.3s linear;
  -o-transition: all 0.3s linear;
  -ms-transition: all 0.3s linear;
  transition: all 0.3s linear;
  position: absolute;
  top: 0;
  right: 0;
  height: auto;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
}
.case-alfa #alfa-elem2 {
  -moz-transition: all 3s linear;
  -webkit-transition: all 3s linear;
  -o-transition: all 3s linear;
  -ms-transition: all 3s linear;
  transition: all 3s linear;
  position: absolute;
  top: -320px;
  right: 325px;
  height: auto;
}
.case-alfa #alfa-elem3 {
  -moz-transition: all 3s linear;
  -webkit-transition: all 3s linear;
  -o-transition: all 3s linear;
  -ms-transition: all 3s linear;
  transition: all 3s linear;
  position: absolute;
  top: 0;
  right: 0;
  height: auto;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
}
.case-alfa.active #alfa-elem1 {
  -moz-transition: all 1s ease-out 1s;
  -webkit-transition: all 1s ease-out 1s;
  -o-transition: all 1s ease-out 1s;
  -ms-transition: all 1s ease-out 1s;
  transition: all 1s ease-out 1s;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}
.case-alfa.active #alfa-elem2 {
  -moz-transition: all 1s ease-out 2s;
  -webkit-transition: all 1s ease-out 2s;
  -o-transition: all 1s ease-out 2s;
  -ms-transition: all 1s ease-out 2s;
  transition: all 1s ease-out 2s;
  top: -30px;
}
.case-alfa.active #alfa-elem3 {
  -moz-transition: all 1s ease-out 1s;
  -webkit-transition: all 1s ease-out 1s;
  -o-transition: all 1s ease-out 1s;
  -ms-transition: all 1s ease-out 1s;
  transition: all 1s ease-out 1s;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.case-azbuka {
  background: #d7eabd;
  color: #405f11;
}
.case-azbuka h1 {
  color: #264700;
}

.case-atributika {
  background: #333;
  background: #333 url('../case/atributika/bg.jpg') 0 0 no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  color: #fff;
}

.case-belarusbank {
  background: #2f9959;
  color: #fff;
}

/*.case-bagoria {
  background: transparent url('../case/bagoria/bg.jpg') 0 0 no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  color: #fff;
}

.case-bagoria h1 {
  color: #ffbf14;
}*/




.case-dvemz {
  background: transparent url('../case/dvemz/bg-dvemz.jpg') 0 0 no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  color: #fff;
}

.case-dvemz h1 {
  color: #ffbf14;
}

.case-dvemz .button_flat {
  color: #ffbf14;
  border: 2px solid #ffbf14;
}

.case-dvemz .button_flat:hover {
  color: #fff;
  border: 2px solid #2f9959;
}





.case-belarusbank h1 {
  background: #fff;
  background: rgba(255, 255, 255, 0.5);
  color: #107b47;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  padding-left: 20px;
  padding-right: 20px;
  margin-bottom: 10px;
}
.case-belarusbank a {
  color: #fff;
}

.case-bveb {
  background: #083f5e url("../case/bveb/line.png") 0% 50% fixed no-repeat;
  color: #e0f1ff;
  -webkit-background-size: 50% 50%;
  background-size: 50% 50%;
}
.case-bveb.active {
  -moz-transition: all 0.3s ease-out 1s;
  -webkit-transition: all 0.3s ease-out 1s;
  -o-transition: all 0.3s ease-out 1s;
  -ms-transition: all 0.3s ease-out 1s;
  transition: all 0.3s ease-out 1s;
  -webkit-background-size: 75% 75%;
  background-size: 75% 75%;
  background-position: -25% 50%;
}
.case-bveb h1 {
  color: #ee7f36;
}
.case-bveb a {
  color: #fff;
}

.case-domik {
  background: #f2f2f2 url("../case/domik/bg.png") 0 0 repeat;
  color: #000;
}
.case-domik h1 {
  color: #000;
}

.case-domik p {
  text-shadow: 0 1px 0 rgba(255,255,255,0.5);
}

.case-euroopt {
  color: #333;
  background: #f0f7ff url("../case/euroopt/pattern.jpg") 0 0 repeat;
}
.case-euroopt h1 {
  color: #f78314;
}
.case-euroopt p {
  text-shadow: 0 1px 1px #fff;
}

.case-extreme {
  background: #f0f7ff url("../case/extreme/bg.jpg") 0 0 repeat;
  color: #fff;
}
.case-extreme h1 {
  color: #fff;
}

.case-argument {
  background: #f3f3f3;
  color: #000;
}

.case-argument h1 {
  color: #000;
}

.case-ipark {
  background: #f3f3f3;
  color: #000;
}

.case-ipark h1 {
  color: #3498db;
}

/*.case-karandash {
  background: #f2f2f2 url("../case/karandash/bg.jpg") 50% 0% fixed no-repeat;
  color: #000;
}
.case-karandash.active {
  -moz-transition: all 0.3s ease-out 1s;
  -webkit-transition: all 0.3s ease-out 1s;
  -o-transition: all 0.3s ease-out 1s;
  -ms-transition: all 0.3s ease-out 1s;
  transition: all 0.3s ease-out 1s;
  background-position: 50% 100%;
}
.case-karandash h1 {
  color: #000;
}

.case-karandash p {
  text-shadow: 0 1px 0 rgba(255,255,255,0.5);
}*/



.case-az {
  background: #0594CD;
  color: #fff;
}

.case-az h1 {
  color: #fff;
}
.case-az h1 .color-1 {
  color: #ec1b24;
}
.case-az h1 .color-2 {
  color: #f8a62a;
}

.case-az .button_flat.black{
  color: white;
  border-color: #f8a62a;
  background-color: #f8a62a;
}

.case-az .button_flat.black:hover {
  color: #fff;
  border: 2px solid #2f9959;
  background-color: #2f9959;
}

.case-az a {
  color: #fff;
}

.color-tape-horizontal {
  position: relative;
  width: 100%;
  height: 8px;
  background-color: #ec1b24;
  background-image: -moz-linear-gradient(left, #ec1b24 0%, #ec1b24 8%, #f25c19 8%, #f25c19 17%, #f8a62a 17%, #f8a62a 25%, #cce20f 25%, #cce20f 33%, #71bf44 33%, #71bf44 42%, #3871c1 42%, #3871c1 50%, #00acef 50%, #00acef 58%, #f8a62a 58%, #f8a62a 67%, #fcd105 67%, #fcd105 75%, #00abc7 75%, #00abc7 83%, #54c7d9 83%, #54c7d9 92%, #3871c1 92%, #3871c1 100%);
  background-image: -webkit-linear-gradient(left, #ec1b24 0%, #ec1b24 8%, #f25c19 8%, #f25c19 17%, #f8a62a 17%, #f8a62a 25%, #cce20f 25%, #cce20f 33%, #71bf44 33%, #71bf44 42%, #3871c1 42%, #3871c1 50%, #00acef 50%, #00acef 58%, #f8a62a 58%, #f8a62a 67%, #fcd105 67%, #fcd105 75%, #00abc7 75%, #00abc7 83%, #54c7d9 83%, #54c7d9 92%, #3871c1 92%, #3871c1 100%);
  background-image: linear-gradient(to right, #ec1b24 0%, #ec1b24 8%, #f25c19 8%, #f25c19 17%, #f8a62a 17%, #f8a62a 25%, #cce20f 25%, #cce20f 33%, #71bf44 33%, #71bf44 42%, #3871c1 42%, #3871c1 50%, #00acef 50%, #00acef 58%, #f8a62a 58%, #f8a62a 67%, #fcd105 67%, #fcd105 75%, #00abc7 75%, #00abc7 83%, #54c7d9 83%, #54c7d9 92%, #3871c1 92%, #3871c1 100%);
  -webkit-background-size: 50% 100%;
  background-size: 50% 100%;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
}





.case-nero {
  background: #5a5a59;
  color: white;
}

#bgvid-nero{
  position: absolute;
  left: 0;
  top: 0;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: 0;
}

.video-mask-nero {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.35);
  z-index: 1;
}

.case-nero h1, .case-nero small {
  color: white;
}

.case-nero a {
  color: #000;
}

.case-nero .button_flat {
  color: #C3143C;
  border-color: #C3143C;
}

.case-nero .button_flat:hover {
  color: #fff;
  border: 2px solid #2f9959;
}



/*.case-lapino {
  background: #6bb9ea;
  background-image: url("../case/lapino/fonLeft.png"), url("../case/lapino/fonRight.png");
  background-repeat: no-repeat, no-repeat;
  background-position: -50% 0, 150% 0;
  background-attachment: fixed, fixed;
  color: #fff;
}

.case-lapino.active {
  -moz-transition: all 1s ease-out 1s;
  -webkit-transition: all 1s ease-out 1s;
  -o-transition: all 1s ease-out 1s;
  -ms-transition: all 1s ease-out 1s;
  transition: all 1s ease-out 1s;
  background-position: 0 0, 100% 0;
}

.case-lapino a {
  color: #fff;
}*/

.case-grante {
  background: #fff;
  color: #000;
}
.case-grante h1 {
  color: #ab7100;
  color: #fff;
}
.case-grante small {
  color: #fff;
}
.case-grante a {
  color: #0f2a40;
}
.case-grante p {
  text-shadow: 0 1px 1px rgba(255,255,255,0.3);
}
.case-grante #grante-elem1 {
  -moz-transition: all 0.3s linear;
  -webkit-transition: all 0.3s linear;
  -o-transition: all 0.3s linear;
  -ms-transition: all 0.3s linear;
  transition: all 0.3s linear;
  position: absolute;
  top: 0;
  left: 50%;
  height: auto;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  margin-left: -480px;
}
.case-grante #grante-elem2 {
  -moz-transition: all 3s linear;
  -webkit-transition: all 3s linear;
  -o-transition: all 3s linear;
  -ms-transition: all 3s linear;
  transition: all 3s linear;
  position: absolute;
  top: -320px;
  left: 50%;
  margin-left: 220px;
  height: auto;
  display: block;
  width: 300px;
  height: 300px;
}
.case-grante.active #grante-elem1 {
  -moz-transition: all 1s ease-out 2s;
  -webkit-transition: all 1s ease-out 2s;
  -o-transition: all 1s ease-out 2s;
  -ms-transition: all 1s ease-out 2s;
  transition: all 1s ease-out 2s;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 0.75;
}
.case-grante.active #grante-elem2 {
  -moz-transition: all 1s ease-out 1s;
  -webkit-transition: all 1s ease-out 1s;
  -o-transition: all 1s ease-out 1s;
  -ms-transition: all 1s ease-out 1s;
  transition: all 1s ease-out 1s;
  top: 90px;
}

.case-svitanok {
  background: #fff;
}

.case-svitanok .crane {
  position: absolute;
  width: 100%;
  top: 20px;
  right: 0;
}

.case-svitanok .crane .bg {
  background: transparent url('../case/gpo/bg.png') 0 0 repeat;
  width: 100%;
  height: 134px;
  position: absolute;
  top: 53px;
  left: 0;
}

.case-svitanok .crane .mov {
  background: transparent url('../case/gpo/mov.png') 0 0 repeat;
  width: 220px;
  height: 111px;
  position: absolute;
  top: 0;
  left: -220px;
}

.case-svitanok .crane .cab {
  background: transparent url('../case/gpo/cab.png') 0 0 repeat;
  width: 138px;
  height: 152px;
  position: absolute;
  top: 140px;
  right: 10%;
}

.case-svitanok.active .mov {
  left: 10%;
  -webkit-transition: all 1.5s ease-out 1.15s;
  -o-transition: all 1.5s ease-out 1.15s;
  transition: all 1.5s ease-out 1.15s;
}

/*.case-gpo {
  background: #fff;
}
*/
/*.case-gpo .crane {
  position: absolute;
  width: 100%;
  top: 20px;
  right: 0;
}

.case-gpo .crane .bg {
  background: transparent url('../case/gpo/bg.png') 0 0 repeat;
  width: 100%;
  height: 134px;
  position: absolute;
  top: 53px;
  left: 0;
}

.case-gpo .crane .mov {
  background: transparent url('../case/gpo/mov.png') 0 0 repeat;
  width: 220px;
  height: 111px;
  position: absolute;
  top: 0;
  left: -220px;
}

.case-gpo .crane .cab {
  background: transparent url('../case/gpo/cab.png') 0 0 repeat;
  width: 138px;
  height: 152px;
  position: absolute;
  top: 140px;
  right: 10%;
}

.case-gpo.active .mov {
  left: 10%;
  -webkit-transition: all 1.5s ease-out 1.15s;
  -o-transition: all 1.5s ease-out 1.15s;
  transition: all 1.5s ease-out 1.15s;
}*/


.case-gpo h1 {
  padding-top: 180px;
}


.case-maxler {
  background: #252525 url("../case/maxler/bg.jpg") 50% 50% fixed no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  color: #eee;
}
.case-maxler h1 {
  color: #f8c717;
}

.case-maxler a {
  color: #fff;
}

.case-marko {
  background: #f9f4d6;
}
.case-marko h1 {
  color: #ec1b21;
}

.case-mf {
  background: #f7f7f7 url("../case/mf/bg.png") -25% 50% fixed no-repeat;
  -webkit-background-size: 75% 75%;
  background-size: 75% 75%;
}
.case-mf #mf_girl {
  -moz-transition: all 0.1s ease-in-out 0;
  -webkit-transition: all 0.1s ease-in-out 0;
  -o-transition: all 0.1s ease-in-out 0;
  -ms-transition: all 0.1s ease-in-out 0;
  transition: all 0.1s ease-in-out 0;
  position: absolute;
  right: 10%;
  height: auto;
  width: auto;
  width: 300px;
  bottom: -300px;
}
.case-mf.active #mf_girl {
  -moz-transition: all 0.2s ease-in-out 1s;
  -webkit-transition: all 0.2s ease-in-out 1s;
  -o-transition: all 0.2s ease-in-out 1s;
  -ms-transition: all 0.2s ease-in-out 1s;
  transition: all 0.2s ease-in-out 1s;
  bottom: -100px;
}
.case-mf p {
  text-shadow: 0 1px 1px #fff;
}

.case-nbrb {
  background: #751430;
  background-image: url("../case/nbrb/bgb.png"), url("../case/nbrb/bgt.png"), url("../case/nbrb/bg.png");
  background-repeat: repeat-x, repeat-x, repeat;
  background-position: 0 100%, 0 0, 0 0;
  background-attachment: fixed, fixed, fixed;
  color: #fff;
}
.case-nbrb h1 {
  color: #c7a76f;
}

.case-nbrb a {
  color: #fff;
}

/*.case-onega {
  background: #f7f7f7 url("../case/onega/bg.jpg") 50% 50% fixed no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
}
.case-onega #onega-elem1 {
  -moz-transition: all 1s ease-out;
  -webkit-transition: all 1s ease-out;
  -o-transition: all 1s ease-out;
  -ms-transition: all 1s ease-out;
  transition: all 1s ease-out;
  position: absolute;
  top: 50%;
  left: 50%;
  height: auto;
}
.case-onega #onega-elem2 {
  -moz-transition: all 1s ease-out;
  -webkit-transition: all 1s ease-out;
  -o-transition: all 1s ease-out;
  -ms-transition: all 1s ease-out;
  transition: all 1s ease-out;
  position: absolute;
  bottom: 50%;
  right: 50%;
  height: auto;
}
.case-onega #onega-elem3 {
  -moz-transition: all 1s ease-out;
  -webkit-transition: all 1s ease-out;
  -o-transition: all 1s ease-out;
  -ms-transition: all 1s ease-out;
  transition: all 1s ease-out;
  position: absolute;
  left: -50%;
  bottom: -50%;
  height: auto;
}
.case-onega.active #onega-elem1 {
  top: -10%;
  left: -10%;
}
.case-onega.active #onega-elem2 {
  bottom: -12%;
  right: -12%;
}
.case-onega.active #onega-elem3 {
  bottom: 45%;
  left: 45%;
  margin-left: -350px;
  margin-bottom: -250px;
}*/



.case-esp {
  background: #424D54;
  color: #fff;
}

#bgvid-esp {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: 0;
}

.video-mask-esp {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
  background: transparent url(../case/esp/video_pattern-2.png) 0 0 repeat;
}

.case-esp mark{
  color: #69ba2e;
  background: none;
}





.case-orlov {
  background: #171624 url("../case/orlov/bg.jpg") 50% 50% fixed no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  color: #fff;
}
.case-orlov h1 {
  color: #d2bd9c;
}

.case-orlov a {
  color: #fff;
}

.case-orimi {
  background: transparent url('../case/orimi/bg.jpg') 0 0 no-repeat;
  background: #b9a15d;
  -webkit-background-size: cover;
  background-size: cover;
  color: #fff;
  text-shadow: 0 2px 2px rgba(0,0,0,0.5);
}

.case-orimi a {
  color: #fff;
}

.case-orimi #orimi-elem1 {
  -webkit-transition: all 1.5s ease-out 0.5s;
  -moz-transition: all 1.5s ease-out 0.5s;
  -ms-transition: all 1.5s ease-out 0.5s;
  -o-transition: all 1.5s ease-out 0.5s;
  transition: all 1.5s ease-out 0.5s;
  position: absolute;
  bottom: 0;
  left: 0;
  height: auto;
  margin-bottom: -400px;
  margin-left: -100px;
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='3');
  -webkit-filter: blur(3px);
  -o-filter: blur(3px);
  filter: blur(3px);
  z-index: 20;
  width: 400px;
}
.case-orimi.active #orimi-elem1 {
  -webkit-transform: rotate(5deg);
  -ms-transform: rotate(5deg);
  -o-transform: rotate(5deg);
  transform: rotate(5deg);
  margin-bottom: -250px;
  margin-left: 0px;
  bottom: 0;
  left: 0;
  margin-left: -30px;
}
.case-orimi #orimi-elem1:hover {
  -webkit-transition: all 0.5s ease-out 0s;
  -moz-transition: all 0.5s ease-out 0s;
  -ms-transition: all 0.5s ease-out 0s;
  -o-transition: all 0.5s ease-out 0s;
  transition: all 0.5s ease-out 0s;
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='3');
  -webkit-filter: blur(0px);
  -o-filter: blur(0px);
  filter: blur(0px);
}

.case-orimi #orimi-elem2 {
  -webkit-transition: all 1.5s ease-out 0.5s;
  -moz-transition: all 1.5s ease-out 0.5s;
  -ms-transition: all 1.5s ease-out 0.5s;
  -o-transition: all 1.5s ease-out 0.5s;
  transition: all 1.5s ease-out 0.5s;
  position: absolute;
  bottom: 0;
  right: 0;
  margin-bottom: -400px;
  height: auto;
  -webkit-transform: rotate(-5deg);
  -ms-transform: rotate(-5deg);
  -o-transform: rotate(-5deg);
  transform: rotate(-5deg);
}
.case-orimi.active #orimi-elem2 {
  bottom: 0;
  right: 10%;
  margin-bottom: -130px;
}

.case-orimi #orimi-elem3 {
  -webkit-transition: all 1.5s ease-out 0.5s;
  -moz-transition: all 1.5s ease-out 0.5s;
  -ms-transition: all 1.5s ease-out 0.5s;
  -o-transition: all 1.5s ease-out 0.5s;
  transition: all 1.5s ease-out 0.5s;
  position: absolute;
  right: 10%;
  top: 0;
  height: auto;
  margin-top: -600px;
  -webkit-transform: rotate(170deg);
  -ms-transform: rotate(170deg);
  -o-transform: rotate(170deg);
  transform: rotate(170deg);
}
.case-orimi.active #orimi-elem3 {
  margin-top: -200px;
  -webkit-transform: rotate(188deg);
  -ms-transform: rotate(188deg);
  -o-transform: rotate(188deg);
  transform: rotate(188deg);
}

.case-orimi #orimi-elem4 {
  -webkit-transition: all 1.5s ease-out 0.5s;
  -moz-transition: all 1.5s ease-out 0.5s;
  -ms-transition: all 1.5s ease-out 0.5s;
  -o-transition: all 1.5s ease-out 0.5s;
  transition: all 1.5s ease-out 0.5s;
  position: absolute;
  left: 10%;
  top: 0;
  height: auto;
  margin-top: -600px;
  -webkit-transform: rotate(-170deg);
  -ms-transform: rotate(-170deg);
  -o-transform: rotate(-170deg);
  transform: rotate(-170deg);
  filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='2');
  -webkit-filter: blur(2px);
  -o-filter: blur(2px);
  filter: blur(2px);
}
.case-orimi.active #orimi-elem4 {
  margin-top: -200px;
  -webkit-transform: rotate(-188deg);
  -ms-transform: rotate(-188deg);
  -o-transform: rotate(-188deg);
  transform: rotate(-188deg);
}

.case-orimi #orimi-elem5 {
  -webkit-transition: all 1.5s ease-out 0.5s;
  -moz-transition: all 1.5s ease-out 0.5s;
  -ms-transition: all 1.5s ease-out 0.5s;
  -o-transition: all 1.5s ease-out 0.5s;
  transition: all 1.5s ease-out 0.5s;
  position: absolute;
  left: 50%;
  bottom: 0;
  margin-bottom: -400px;
  margin-left: -100px;
  height: auto;
  -webkit-transform: rotate(4deg);
  -ms-transform: rotate(4deg);
  -o-transform: rotate(4deg);
  transform: rotate(4deg);
  opacity: 0;
  z-index: 20;
}
.case-orimi.active #orimi-elem5 {
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  opacity: 0.85;
  margin-bottom: -120px;
}

.case-orimi.active #orimi-elem5:hover {
  -webkit-transition: all 0.5s ease-out 0s;
  -moz-transition: all 0.5s ease-out 0s;
  -ms-transition: all 0.5s ease-out 0s;
  -o-transition: all 0.5s ease-out 0s;
  transition: all 0.5s ease-out 0s;
  -webkit-transform: rotate(2deg);
  -ms-transform: rotate(2deg);
  -o-transform: rotate(2deg);
  transform: rotate(2deg);
  opacity: 1;
  margin-bottom: -70px;
}



.case-peleng {
  background: #c8c8c8 url("../case/peleng/bg.png") 0 0 repeat;
  color: #000;
}
.case-peleng h1 {
  color: #000;
}

.case-peleng p {
  text-shadow: 0 1px 0 rgba(255,255,255,0.5);
}


.case-soyuz {
  background: #fff url('../case/soyuz/bg-top-green.jpg') 50% 120% no-repeat;
  -webkit-background-size: 100% 50%;
  background-size: 100% 50%;
}
.case-soyuz h1 {
  color: #003b1d;
}
.case-soyuz #pers {
  -moz-transition: all 0.1s ease-in-out 0;
  -webkit-transition: all 0.1s ease-in-out 0;
  -o-transition: all 0.1s ease-in-out 0;
  -ms-transition: all 0.1s ease-in-out 0;
  transition: all 0.1s ease-in-out 0;
  position: absolute;
  left: 10%;
  height: auto;
  width: auto;
  bottom: -210px;
}
.case-soyuz.active #pers {
  -moz-transition: all 0.2s ease-in-out 1s;
  -webkit-transition: all 0.2s ease-in-out 1s;
  -o-transition: all 0.2s ease-in-out 1s;
  -ms-transition: all 0.2s ease-in-out 1s;
  transition: all 0.2s ease-in-out 1s;
  bottom: 0;
}

.case-perehvat {
  background: #bdc7d1;
}
.case-perehvat h1 {
  color: #f52f3e;
}
.case-perehvat p {
  text-shadow: 0 1px 1px #bdc7d1;
}
.case-perehvat #perehvat-elem1 {
  -moz-transition: all 0.3s ease-in-out 1s;
  -webkit-transition: all 0.3s ease-in-out 1s;
  -o-transition: all 0.3s ease-in-out 1s;
  -ms-transition: all 0.3s ease-in-out 1s;
  transition: all 0.3s ease-in-out 1s;
  position: absolute;
  top: -200px;
  left: 50%;
  height: auto;
  margin-left: -491px;
}
.case-perehvat.active #perehvat-elem1 {
  top: 0;
}
.case-perehvat #cop {
  -moz-transition: all 0.1s ease-in-out 0;
  -webkit-transition: all 0.1s ease-in-out 0;
  -o-transition: all 0.1s ease-in-out 0;
  -ms-transition: all 0.1s ease-in-out 0;
  transition: all 0.1s ease-in-out 0;
  position: absolute;
  right: 33%;
  height: auto;
  width: auto;
  bottom: -250px;
  width: 250px;
}
.case-perehvat.active #cop {
  -moz-transition: all 0.2s ease-in-out 1s;
  -webkit-transition: all 0.2s ease-in-out 1s;
  -o-transition: all 0.2s ease-in-out 1s;
  -ms-transition: all 0.2s ease-in-out 1s;
  transition: all 0.2s ease-in-out 1s;
  bottom: 0;
}


.case-belenergo {
  background-color: #242b53;
  color: white;
}
.case-belenergo.theme-on {
  background-color: white;
  color: #242b53;
}
.case-belenergo-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.case-belenergo-bg::before,
.case-belenergo-bg::after{
  content: "";
  display: block;
  position: absolute;
  width: 50%;
  height: 100%;
  top: 0;
  -webkit-transition: background-color 0.35s;
  transition: background-color 0.35s;
}
.case-belenergo-bg::before {
  left: 0;
  background-color: #fff;
}
.theme-on .case-belenergo-bg::before {
  background-color: #242b53;
}
.case-belenergo-bg::after {
  left: 50%;
  background-color: #242b53;
}
.theme-on .case-belenergo-bg::after {
  background-color: #fff;
}
.case-belenergo h1 {
  color: #E2AC3F;
}
.case-belenergo .button_flat,
.case-belenergo .button_flat.black{
  color: #d3ab48;
  background-color: transparent;
  border-color: currentColor;
}
.case-belenergo .button_flat:hover,
.case-belenergo .button_flat.black:hover{
  color: #fff;
  background: #0a922f;
  border-color: #0a922f;
}
.theme-on .button_flat,
.theme-on .button_flat.black{
  color: #d3ab48;
  background-color: transparent;
  border-color: currentColor;
}
.theme-on .button_flat:hover,
.theme-on .button_flat.black:hover{
  color: #fff;
  background: #0a922f;
  border-color: #0a922f;
}
/*
.theme-on .next.black {
  filter: contrast(1) invert(1);
}
*/
.case-belenergo .next{
  background: none;
}
.case-belenergo .next::before,
.case-belenergo .next::after{
  content: "";
  display: block;
  position: absolute;
  height: 100%;
  width: 50%;
  top: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
}
.case-belenergo .next::before{
  left: 0;
  background-image: url('../i/icons/ico-next-black.png');
  background-position: 0 0;
}
.case-belenergo.theme-on .next::before{
  background-image: url('../i/icons/ico-next.png');
}
.case-belenergo .next::after{
  left: 50%;
  background-image: url('../i/icons/ico-next.png');
  background-position: 100% 0;
}
.case-belenergo.theme-on .next::after{
  background-image: url('../i/icons/ico-next-black.png');
}

.theme-toggle{
  height: 60px;
  width: 120px;
  position: absolute;
  left: 50%;
  top: 0;
  margin-left: -60px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
  box-sizing: border-box;
  font-family: 'Roboto Mono', Arial, sans-serif;
  font-weight: 400;
  font-size: 1.1em;
  cursor: pointer;
  color: white;
  text-decoration: none;
  z-index: 25;
}
.theme-toggle::before,
.theme-toggle::after{
  content: "";
  display: block;
  position: absolute;
  height: 100%;
  width: 50%;
  z-index: -1;
  -webkit-transition: background-color 0.35s;
  transition: background-color 0.35s;
}
.theme-toggle::before{
  left: 0;
  background-color: #242b53;
}
.theme-toggle.theme-on::before{
  background-color: #fff;
}
.theme-toggle::after{
  left: 50%;
  background-color: #fff;
}
.theme-toggle.theme-on::after{
  background-color: #242b53;
}

.theme-toggle svg{
  position: absolute;
  top: 50%;
  display: block;
}
.theme-toggle .svg-theme--light{
  height: 34px;
  width: 34px;
  left: 25%;
  margin: -17px 0 0 -17px;
  color: #fff;
}
.theme-toggle.theme-on .svg-theme--light{
  color: #242b53;
}
.theme-toggle .svg-theme--dark{
  width: 20px;
  height: 20px;
  left: 75%;
  margin: -10px 0 0 -10px;
  color: #242b53;
}
.theme-toggle.theme-on .svg-theme--dark{
  color: #fff;
}
.theme-toggle svg path{
  fill: currentColor;
}



.case-tempo {
  background: #facf2d url("../case/tempo/bg.jpg") 50% 50% no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
}
.case-tempo h1 {
  color: #f11d29;
}

.case-polomarathon {
  background: #f1f1f1   url("../case/polomarathon/bg.jpg") 50% 50% repeat;
  -webkit-background-size: cover;
  background-size: cover;
  color: #333;
}

.case-polomarathon #polomarathon-elem1 {
  -webkit-transition: all 0.5s ease-out 0.5s;
  -moz-transition: all 0.5s ease-out 0.5s;
  -ms-transition: all 0.5s ease-out 0.5s;
  -o-transition: all 0.5s ease-out 0.5s;
  transition: all 0.5s ease-out 0.5s;
  position: absolute;
  top: -500px;
  left: 50px;
  height: auto;
}
.case-polomarathon.active #polomarathon-elem1 {
  top: 0;
}

.case-porto {
  background: #2c2c2c url("../case/porto/bg.png") 50% 50% repeat;
  color: #ccc;
}
.case-porto h1 {
  color: #fff;
}

.case-porto a {
  color: #ccc;
}

.case-skvirel {
  background: #f1f1f1 url("../case/skvirel/bg.jpg") 50% 50% no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  color: #fff;
  text-shadow: 0 2px 2px #000;
  text-shadow: 0 2px 2px rgba(0,0,0,0.75);
}
.case-skvirel h1 {
  color: #fed926;
  display: inline;
  margin: 0;
  line-height: 1.6em;
}

.case-skvirel a {
  color: #fff;
}

.case-sneg {
  background: #74ddfd;
}
.case-sneg h2 {
  color: #005ecf;
  display: inline;
  background: #fff;
  background: rgba(255, 255, 255, 0.75);
  padding: 0 5px;
  margin: 0;
  line-height: 1.6em;
  outline: 5px solid #fff;
  outline: 5px solid rgba(255, 255, 255, 0.75);
}

.case-srs {
  background: white url("../case/srs/bg.png") 50% 0 fixed repeat-x;
}
.case-srs h1 {
  color: #1f559b;
}

.case-svitland {
  background: #1583ff url("../case/svitland/sky.jpg") 50% 50% fixed repeat;
  -webkit-background-size: cover;
  background-size: cover;
  color: #fff;
  text-shadow: 0 1px 0 rgba(0,0,0,0.5);
}
.case-svitland a {
  color: #fff;
}
.case-svitland .coverbg {
  background: transparent url("../case/svitland/bg.png") 50% 50% fixed repeat;
}
.case-svitland .videobg {
  display: none;
}
.case-svitland.active .videobg {
  display: block;
}

.case-yo {
  background: white url("../case/yo/bg.png") 50% 50% fixed repeat;
}
.case-yo h1 {
  color: #551e62;
}

#yo_car {
  background: transparent url("../case/yo/car.png") 0 0 no-repeat;
  width: 490px;
  height: 237px;
  position: absolute;
  bottom: -18px;
  right: 30%;
  -moz-transition: all 3s ease-in 2s;
  -webkit-transition: all 3s ease-in 2s;
  -o-transition: all 3s ease-in 2s;
  -ms-transition: all 3s ease-in 2s;
  transition: all 3s ease-in 2s;
}
#yo_car i {
  background: transparent url("../case/yo/wheel.png") 0 0 no-repeat;
  width: 65px;
  height: 65px;
  position: absolute;
}
#yo_car .back {
  bottom: 20px;
  left: 75px;
}
#yo_car .front {
  bottom: 24px;
  right: 37px;
}

.case-tdi {
  background: #f1f1f1;
  1background: #f1f1f1 url("../case/tdi/tdi-config.png") 0 0 no-repeat fixed;
}
.case-tdi h1 {
  color: #414141;
}

.case-tdi article p {
  background: rgba(241,241,241,0.75);
  text-shadow: -2px 2px 0 rgba(255,255,255,0.75);
}

.case-tdi #tdi-elem1 {
  -webkit-transition: all 1.5s ease-out 0.5s;
  -moz-transition: all 1.5s ease-out 0.5s;
  -ms-transition: all 1.5s ease-out 0.5s;
  -o-transition: all 1.5s ease-out 0.5s;
  transition: all 1.5s ease-out 0.5s;
  position: absolute;
  height: auto;
  left: 25%;
  top: 50%;
  margin-left: -300px;
  margin-top: -250px;
}
.case-tdi.active #tdi-elem1 {
  left: 30%;
}

.case-tdi #tdi-elem2 {
  -webkit-transition: all 1.5s ease-out 1s;
  -moz-transition: all 1.5s ease-out 1s;
  -ms-transition: all 1.5s ease-out 1s;
  -o-transition: all 1.5s ease-out 1s;
  transition: all 1.5s ease-out 1s;
  position: absolute;
  left: 35%;
  top: 50%;
  margin-top: -175px;
  height: auto;
}
.case-tdi.active #tdi-elem2 {
  left: 30%;
}

.case-tdi #tdi-elem3 {
  -webkit-transition: all 2s ease-out;
  -moz-transition: all 2s ease-out;
  -ms-transition: all 2s ease-out;
  -o-transition: all 2s ease-out;
  transition: all 2s ease-out;
  -webkit-transform: perspective(1500px) rotateX(15deg);
  -ms-transform: perspective(1500px) rotateX(15deg);
  -o-transform: perspective(1500px) rotateX(15deg);
  transform: perspective(1500px) rotateX(15deg);
  position: absolute;
  top: 0;
  left: 0;
  height: auto;
  height: 130%;
  width: 50%;
  max-width: 800px;
}

.case-tdi.active #tdi-elem3 {
  -webkit-transform: perspective(1500px) rotateX(35deg);
  -ms-transform: perspective(1500px) rotateX(35deg);
  -o-transform: perspective(1500px) rotateX(35deg);
  transform: perspective(1500px) rotateX(35deg);
  top: -20%;
}







.background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}

.background img {
  image-rendering: optimizespeed;
  position: absolute;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -moz-transition: opacity 0.6s ease-in-out;
  -webkit-transition: opacity 0.6s ease-in-out;
  -o-transition: opacity 0.6s ease-in-out;
  -ms-transition: opacity 0.6s ease-in-out;
  transition: opacity 0.6s ease-in-out;
}
.background img.show {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
  -moz-transition: opacity 0.6s ease-out;
  -webkit-transition: opacity 0.6s ease-out;
  -o-transition: opacity 0.6s ease-out;
  -ms-transition: opacity 0.6s ease-out;
  transition: opacity 0.6s ease-out;
}

.foreground {
  height: 100%;
  left: 0;
  overflow: hidden;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 25;
  display: none;
}

section.active #yo_car {
  right: -490px;
}
section.active #yo_car i {
  -webkit-animation: rotate 0.6s linear infinite;
  -moz-animation: rotate 0.6s linear infinite;
  animation: rotate 0.6s linear infinite;
  -webkit-animation-delay: 2s;
  -moz-animation-delay: 2s;
  -o-animation-delay: 2s;
  animation-delay: 2s;
}

.list_visible .list_show {
  top: -64px;
}

.textblock {
  text-align: center;
}



/* Frame */
.frame ul {
  list-style: none;
  margin: 0;
  padding: 0;
  height: 100%;
}

.frame ul li {
  -moz-transition: width 0.1s ease-in-out;
  -webkit-transition: width 0.1s ease-in-out;
  -o-transition: width 0.1s ease-in-out;
  -ms-transition: width 0.1s ease-in-out;
  transition: width 0.1s ease-in-out;
  float: left;
  height: 100%;
  margin: 0 0 0 0;
  padding: 0;
  background: #333;
  color: #ddd;
  text-align: center;
  cursor: pointer;
  overflow: hidden;
}
.frame ul li img {
  display: block;
  height: 100%;
}

.frame ul li.active {
  color: #fff;
  background: #a03232;
}

/* Scrollbar */
.scrollbar {
  margin: 1em 0;
  height: 5px;
  background: #ccc;
  line-height: 0;
}

.scrollbar .handle {
  width: 100px;
  height: 100%;
  background: #292a33;
  cursor: pointer;
}

.scrollbar .handle .mousearea {
  position: absolute;
  top: -9px;
  left: 0;
  width: 100%;
  height: 20px;
}

.fotorama {
  overflow: visible !important;
}

.fotorama__wrap {
  margin: 0 auto;
}

.fotorama__stage {
  background: #fff;
  background: rgba(255, 255, 255, 0.15);
  -webkit-box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.3);
  -moz-box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.3);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.3);
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  margin: 0 auto;
}

.fotorama__dot {
  border-color: #222;
}

.fotorama__active .fotorama__dot {
  background-color: #222;
}

.astroman {
  -moz-transition: all 0.3s ease-in-out 0;
  -webkit-transition: all 0.3s ease-in-out 0;
  -o-transition: all 0.3s ease-in-out 0;
  -ms-transition: all 0.3s ease-in-out 0;
  transition: all 0.3s ease-in-out 0;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  background: transparent url("../i/astro_man-top.png") 50% 0 no-repeat;
  position: absolute;
  top: 0;
  left: 50%;
  width: 750px;
  margin-left: -375px;
  margin-top: -100%;
  z-index: 50;
}
.astroman .in-block {
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
  background: white url("../i/lines.png") 0 0 repeat;
  margin-top: 178px;
  min-height: 400px;
}

.active .astroman {
  -moz-transition: all 0.3s ease-in-out 0.3s;
  -webkit-transition: all 0.3s ease-in-out 0.3s;
  -o-transition: all 0.3s ease-in-out 0.3s;
  -ms-transition: all 0.3s ease-in-out 0.3s;
  transition: all 0.3s ease-in-out 0.3s;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
  top: 0;
  margin-top: -50px;
}

#prj_list {
  position: fixed;
  width: 50%;
  height: 100%;
  background: #eeeeee url("../case/lapino/fonLeft.png") 0 0 no-repeat;
  top: 0;
  left: -50%;
  z-index: 70;
  overflow: hidden;
  -webkit-transition: left 0.25s ease;
  -o-transition: left 0.25s ease;
  transition: left 0.25s ease;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
}
#prj_list:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
#prj_list h3 {
  color: #16a563;
  padding: 0 30px 15px 55px;
  text-shadow: 0 1px 1 rgba(0, 0, 0, 0.5);
}
#prj_list .table {
  height: 100%;
  width: 100%;
}
#prj_list .table .cell {
  padding-top: 20px;
  vertical-align: top;
}
#prj_list.show {
  left: 0;
  -webkit-transition: left 0.25s ease;
  -o-transition: left 0.25s ease;
  transition: left 0.25s ease;
}
#prj_list.show {
  display: block;
}
#prj_list .ico-close {
  background: transparent url("../i/icons/ico-close.png") 0 0 no-repeat;
  position: absolute;
  width: 24px;
  height: 24px;
  top: 23px;
  right: 10px;
  cursor: pointer;
  z-index: 20;
}
#prj_list .ico-close:hover {
  -moz-animatiom: rotate 0.3s linear 0s infinite normal none;
  -webkit-animation: rotate 0.3s linear 0s infinite normal none;
  -o-animation: rotate 0.3s linear 0s infinite normal none;
  animation: rotate 0.3s linear 0s infinite normal none;
}
#prj_list .effects {
  -webkit-perspective: 10000px;
  -ms-perspective: 10000px;
  perspective: 10000px;
  -webkit-perspective-origin: 50% 50%;
  -ms-perspective-origin: 50% 50%;
  perspective-origin: 50% 50%;
}
#prj_list .item {
  display: block;
  width: 18.8%;
  /*height: 13%;*/
  margin: 1% 0 0 1%;
  float: left;
  position: relative;
}
#prj_list .item::before{
  content: "";
  display: block;
  padding-top: 85%;
}
#prj_list .item:hover {
  -webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  -ms-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}
#prj_list .item.active {
  -webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  -ms-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
  -webkit-box-shadow: 0 0 0 3px #16a563;
  -moz-box-shadow: 0 0 0 3px #16a563;
  box-shadow: 0 0 0 3px #16a563;
}
#prj_list .item.active h5 {
  color: #16a563;
}
#prj_list .item p {
  line-height: 1.2;
  font-size: 12px;
  padding: 5px;
}
#prj_list .item .img {
  background-position: 50% 28px;
  -webkit-background-size: cover;
  background-size: cover;
  /*-webkit-background-size: auto calc(100% - 28px);*/
  /*background-size: auto calc(100% - 28px);*/
  background-repeat: no-repeat;
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  /*image-rendering: optimizeSpeed;*/
  /*image-rendering: -o-crisp-edges;*/
  /*image-rendering: -webkit-optimize-contrast;*/
  /*image-rendering: optimize-contrast;*/
  /*-ms-interpolation-mode: nearest-neighbor;*/
}
#prj_list .img h5 {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 10;
}
#prj_list h5 {
  font-size: 12px;
  font-weight: 400;
  background: #fff;
  box-sizing: border-box;
}
#prj_list .descr {
  cursor: default;
  /*position: relative;*/
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #fff;
  background: rgba(255, 255, 255, 0.8);
  background: white url("../i/icons/ico-star.png") 50% 90% no-repeat;
  -webkit-background-size: 0 0;
  background-size: 0 0;
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  -webkit-transform: rotateY(-180deg);
  -moz-transform: rotateY(-180deg);
  -ms-transform: rotateY(-180deg);
  -o-transform: rotateY(-180deg);
  transform: rotateY(-180deg);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
#prj_list .item:hover,
#prj_list .item.active {
  cursor: pointer;
}
#prj_list .item:hover .img,
#prj_list .item.active .img {
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  transform: rotateY(180deg);
  cursor: pointer;
}
#prj_list .item:hover .descr,
#prj_list .item.active .descr {
  -webkit-transform: rotateY(0);
  -moz-transform: rotateY(0);
  -ms-transform: rotateY(0);
  -o-transform: rotateY(0);
  transform: rotateY(0);
  cursor: pointer;
}
#prj_list .item.active .descr {
  -webkit-background-size: 16px 16px;
  background-size: 16px 16px;
}
#prj_list footer {
  1-webkit-box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.2);
  1-moz-box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.2);
  1box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.2);
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  bottom: 0;
  padding: 20px;
  position: absolute;
  text-align: center;
  width: 100%;
  background: rgba(0, 0, 0, 0.1);
}

.fullPage-tooltip {
  -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.3);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.3);
  color: #fff;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.3);
  white-space: nowrap;
  padding: 2px 7px;
}

#fullPage-nav {
  z-index: 85;
  -moz-transition: opacity 0.2s ease-in-out;
  -webkit-transition: opacity 0.2s ease-in-out;
  -o-transition: opacity 0.2s ease-in-out;
  -ms-transition: opacity 0.2s ease-in-out;
  transition: opacity 0.2s ease-in-out;
}

#fullPage-nav ul {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  border-radius: 10px;
  padding: 3px 0;
  background: rgba(0, 0, 0, 0.6);
}

#fullPage-nav.left {
  left: 5px;
}

#fullPage-nav.right {
  right: -100px;
}

#fullPage-nav li {
  margin: 5px 0;
}
#fullPage-nav li div {
  background: rgba(255, 255, 255, 0.75);
  background: rgba(22, 165, 99, 0.9);
  padding: 2px 5px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  border-radius: 10px;
}
#fullPage-nav li li {
  width: auto !important;
}
#fullPage-nav li a {
  display: block;
  text-align: center;
  width: 24px;
  outline: 0;
}
#fullPage-nav li span {
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  border: 0;
  width: 10px;
  height: 10px;
  background: #fff;
  text-align: center;
  position: static !important;
  left: 0;
  top: 0;
}
#fullPage-nav li .active span {
  background: #168750;
}
#fullPage-nav li:first-child {
  width: auto;
  height: 16px;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}
#fullPage-nav li:first-child span {
  background: transparent url("../i/icons/ico-home.png") 0 0 no-repeat;
  width: 16px;
  height: 16px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
}
#fullPage-nav li:first-child .active span {
  background: transparent url("../i/icons/ico-home-active.png") 0 0 no-repeat;
}
#fullPage-nav li:last-child {
  width: auto;
  height: 16px;
  margin-top: 8px;
  padding-top: 6px;
  border-top: 1px solid rgba(255, 255, 255, 0.5);
}
#fullPage-nav li:last-child span {
  background: transparent url("../i/icons/ico-mail.png") 0 0 no-repeat;
  width: 16px;
  height: 16px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
}
#fullPage-nav li:last-child .active span {
  background: transparent url("../i/icons/ico-mail-active.png") 0 0 no-repeat;
}

#astronim_walk {
  position: fixed;
  bottom: -50px;
  right: 5%;
  z-index: 50;
  cursor: pointer;
  -moz-transition: all 0.15s ease-in-out;
  -webkit-transition: all 0.15s ease-in-out;
  -o-transition: all 0.15s ease-in-out;
  -ms-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
}
#astronim_walk:hover {
  bottom: -40px;
}

#astronim_logo {
  background: transparent url("../i/astronim.png") 0 0 no-repeat;
  position: fixed;
  bottom: 20px;
  right: 56px;
  z-index: 90;
  cursor: pointer;
  width: 100px;
  height: 28px;
}

#socials {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 50;
}

#socials a {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  width: 48px;
  height: 48px;
  -webkit-background-size: cover;
  background-size: cover;
}

#socials .social-fb {
  background-image: url('../i/icons/social-fb.png');
}

#socials .social-tw {
  background-image: url('../i/icons/social-tw.png');
}

#socials .phone {
  background-image: url('../i/icons/phone.png');
}

#custom_nav {
  -moz-transition: all 0.125s ease-in-out;
  -webkit-transition: all 0.125s ease-in-out;
  -o-transition: all 0.125s ease-in-out;
  -ms-transition: all 0.125s ease-in-out;
  transition: all 0.125s ease-in-out;
  position: fixed;
  top: 0;
  right: 0;
  background: rgba(25, 155, 77, 0.8);
  width: 36px;
  height: 100%;
  z-index: 70;
  display: table;
}
#custom_nav > div {
  display: table-cell;
  vertical-align: middle;
}
#custom_nav:hover {
  background: #199b4d;
}
#custom_nav a {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  width: 100%;
  text-decoration: none;
  position: relative;
  padding: 7px 0;
  text-align: center;
}
#custom_nav a:first-child, #custom_nav a:last-child {
  padding: 0;
}
#custom_nav b {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  border-radius: 50%;
  -moz-transition: all 0.25s ease-in-out;
  -webkit-transition: all 0.25s ease-in-out;
  -o-transition: all 0.25s ease-in-out;
  -ms-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
  display: block;
  width: 8px;
  height: 8px;
  background: #fff;
  font-size: 0;
  line-height: 0;
  margin: 0 auto;
}
#custom_nav i {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  -moz-transition: all 0.125s ease-in-out;
  -webkit-transition: all 0.125s ease-in-out;
  -o-transition: all 0.125s ease-in-out;
  -ms-transition: all 0.125s ease-in-out;
  transition: all 0.125s ease-in-out;
  font-size: 20px;
  color: #fff;
  font-style: normal;
}
#custom_nav span {
  -moz-transition: all 0.125s ease-in-out;
  -webkit-transition: all 0.125s ease-in-out;
  -o-transition: all 0.125s ease-in-out;
  -ms-transition: all 0.125s ease-in-out;
  transition: all 0.125s ease-in-out;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  position: absolute;
  padding: 6px 10px;
  background: #000;
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
  font-size: 13px;
  right: 36px;
  top: 0px;
  line-height: 1;
  min-width: 120px;
}
#custom_nav span img {
  display: block;
  width: 100%;
  margin-top: 6px;
  margin-bottom: 4px;
}
#custom_nav a:hover b {
  -moz-transition: all 0.125s ease-in-out;
  -webkit-transition: all 0.125s ease-in-out;
  -o-transition: all 0.125s ease-in-out;
  -ms-transition: all 0.125s ease-in-out;
  transition: all 0.125s ease-in-out;
  background: #000;
}
#custom_nav a:hover i {
  color: #000;
}
#custom_nav a:hover span {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}
#custom_nav a:active b {
  -moz-transition: all 0s ease-in-out;
  -webkit-transition: all 0s ease-in-out;
  -o-transition: all 0s ease-in-out;
  -ms-transition: all 0s ease-in-out;
  transition: all 0s ease-in-out;
  background: #444;
}
#custom_nav a.active b {
  background: #000;
  width: 12px;
  height: 12px;
  margin-top: -2px;
  margin-bottom: -2px;
}
#custom_nav a.active i {
  color: #000;
}

#grante-elem2 img {
  animation: animationFrames ease-in-out 8s;
  animation-iteration-count: 1000;
  transform-origin: 50% 50%;
  -webkit-animation: animationFrames ease-in-out 8s;
  -webkit-animation-iteration-count: 1000;
  -webkit-transform-origin: 50% 50%;
  -moz-animation: animationFrames ease-in-out 8s;
  -moz-animation-iteration-count: 1000;
  -moz-transform-origin: 50% 50%;
  -o-animation: animationFrames ease-in-out 8s;
  -o-animation-iteration-count: 1000;
  -o-transform-origin: 50% 50%;
  -ms-animation: animationFrames ease-in-out 8s;
  -ms-animation-iteration-count: 1000;
  -ms-transform-origin: 50% 50%;
  position: relative;
}



.fotorama__wrap {
  margin: 0 auto;
}

.fotorama__arr.fotorama__arr--next,
.fotorama__arr.fotorama__arr--prev {
  width: 40px;
  height: 40px;
  background: #b12317;
  -webkit-transition: background-color 0.125s;
  -o-transition: background-color 0.125s;
  transition: background-color 0.125s;
}

.fotorama__arr.fotorama__arr--prev {
  left: 0;
}

.fotorama__arr.fotorama__arr--next {
  right: 0;
}

.fotorama__arr.fotorama__arr--next:after,
.fotorama__arr.fotorama__arr--prev:after {
  content: '';
  position: absolute;
  top: 50%;
  margin-top: -12px;
  left: 50%;
  margin-left: -7px;
  width: 13px;
  height: 23px;
  background: url('../i/fotorama-sprite.png') no-repeat -64px -104px;
}
.fotorama__arr.fotorama__arr--next:after {
  background-position: -80px  -104px;
}

.fotorama__arr.fotorama__arr--next:hover,
.fotorama__arr.fotorama__arr--prev:hover {
  background: #fff;
}

.fotorama__arr.fotorama__arr--next:hover:after,
.fotorama__arr.fotorama__arr--prev:hover:after {
  background-position: 0 -104px;
}

.fotorama__arr.fotorama__arr--next:hover:after {
  background-position: -16px -104px;
}


.next {
  position: absolute;
  width: 48px;
  height: 48px;
  background: transparent url('../i/icons/ico-next.png') 0 0 no-repeat;
  bottom: -50px;
  left: 50%;
  margin-left: -24px;
  cursor: pointer;
  -webkit-background-size: cover;
  background-size: cover;
  z-index: 50;
  opacity: 0.8;
  -webkit-transition: bottom 0.3s ease 2s;
  -o-transition: bottom 0.3s ease 2s;
  transition: bottom 0.35s ease 2s;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=75);
  opacity: 0.75;
}

.next.black {
  background-image: url('../i/icons/ico-next-black.png');
}

.next:hover {
  opacity: 1;
}

.active .next {
  bottom: 10px;
}


@keyframes animationFrames {
  0% {
    left: 0px;
    top: 0px;
    opacity: 1;
    transform: rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg);
  }

  10% {
    left: -17px;
    top: 8px;
  }

  19% {
    left: -2px;
    top: -2px;
  }

  26% {
    left: -17px;
    top: 3px;
  }

  34% {
    left: -7px;
    top: 0px;
  }

  42% {
    left: -18px;
    top: 3px;
  }

  52% {
    left: -6px;
    top: 1px;
  }

  62% {
    left: -14px;
    top: 3px;
  }

  69% {
    left: 2px;
    top: 0px;
  }

  81% {
    left: -6px;
    top: 1px;
  }

  91% {
    left: 4px;
    top: 3px;
  }

  100% {
    left: 0px;
    top: 0px;
    opacity: 1;
    transform: rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg);
  }
}

@-moz-keyframes animationFrames {
  0% {
    left: 0px;
    top: 0px;
    opacity: 1;
    -moz-transform: rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg);
  }

  10% {
    left: -17px;
    top: 8px;
  }

  19% {
    left: -2px;
    top: -2px;
  }

  26% {
    left: -17px;
    top: 3px;
  }

  34% {
    left: -7px;
    top: 0px;
  }

  42% {
    left: -18px;
    top: 3px;
  }

  52% {
    left: -6px;
    top: 1px;
  }

  62% {
    left: -14px;
    top: 3px;
  }

  69% {
    left: 2px;
    top: 0px;
  }

  81% {
    left: -6px;
    top: 1px;
  }

  91% {
    left: 4px;
    top: 3px;
  }

  100% {
    left: 0px;
    top: 0px;
    opacity: 1;
    -moz-transform: rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg);
  }
}

@-webkit-keyframes animationFrames {
  0% {
    left: 0px;
    top: 0px;
    opacity: 1;
    -webkit-transform: rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg);
  }

  10% {
    left: -17px;
    top: 8px;
  }

  19% {
    left: -2px;
    top: -2px;
  }

  26% {
    left: -17px;
    top: 3px;
  }

  34% {
    left: -7px;
    top: 0px;
  }

  42% {
    left: -18px;
    top: 3px;
  }

  52% {
    left: -6px;
    top: 1px;
  }

  62% {
    left: -14px;
    top: 3px;
  }

  69% {
    left: 2px;
    top: 0px;
  }

  81% {
    left: -6px;
    top: 1px;
  }

  91% {
    left: 4px;
    top: 3px;
  }

  100% {
    left: 0px;
    top: 0px;
    opacity: 1;
    -webkit-transform: rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg);
  }
}

@-o-keyframes animationFrames {
  0% {
    left: 0px;
    top: 0px;
    opacity: 1;
    -o-transform: rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg);
  }

  10% {
    left: -17px;
    top: 8px;
  }

  19% {
    left: -2px;
    top: -2px;
  }

  26% {
    left: -17px;
    top: 3px;
  }

  34% {
    left: -7px;
    top: 0px;
  }

  42% {
    left: -18px;
    top: 3px;
  }

  52% {
    left: -6px;
    top: 1px;
  }

  62% {
    left: -14px;
    top: 3px;
  }

  69% {
    left: 2px;
    top: 0px;
  }

  81% {
    left: -6px;
    top: 1px;
  }

  91% {
    left: 4px;
    top: 3px;
  }

  100% {
    left: 0px;
    top: 0px;
    opacity: 1;
    -o-transform: rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg);
  }
}

@-ms-keyframes animationFrames {
  0% {
    left: 0px;
    top: 0px;
    opacity: 1;
    -ms-transform: rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg);
  }

  10% {
    left: -17px;
    top: 8px;
  }

  19% {
    left: -2px;
    top: -2px;
  }

  26% {
    left: -17px;
    top: 3px;
  }

  34% {
    left: -7px;
    top: 0px;
  }

  42% {
    left: -18px;
    top: 3px;
  }

  52% {
    left: -6px;
    top: 1px;
  }

  62% {
    left: -14px;
    top: 3px;
  }

  69% {
    left: 2px;
    top: 0px;
  }

  81% {
    left: -6px;
    top: 1px;
  }

  91% {
    left: 4px;
    top: 3px;
  }

  100% {
    left: 0px;
    top: 0px;
    opacity: 1;
    -ms-transform: rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg);
  }
}


/* TRANSITION */
.hide-desktop {
  display: none;
}

.table article.show-iphone {
  padding-bottom: 100px;
}

@media screen and (max-width: 1280px) {
  h1 {
    font-size: 3em;
  }
  p {
    font-size: 1.4em;
  }
  .button_flat {
    font-size: 1.6em;
  }
}

@media screen and (max-width: 980px) {
  #prj_list.show .item {
    height: 30px;
    width: 48%;
  }
  #prj_list.show .item img {
    display: none;
  }
  #prj_list.show .item .descr p {
    display: none;
  }
  .details {
    display: none;
    border: 1px solid #000;
  }
}
@media screen and (max-width: 800px) {
  body {
    min-width: 500px;
    background: white url(../i/bg-astronim.jpg) 50% 50% repeat;
  }

  .active #fix-monitor,
  .active #fix-ipad,
  .active #fix-iphone {
    display: none;
  }

  .show-iphone {
    display: block;
  }

  .hide-iphone {
    display: none;
  }

  #fullPage-nav {
    display: none;
  }

  .controlArrow.prev {
    left: 5px;
  }
  .controlArrow.next {
    right: 5px;
  }

  .table.middle {
    width: 100%;
  }
 /* .table.middle .cell.textblock {
    display: none;
  }*/

  .table article p {
    line-height: 1.2em;
  }

  #custom_nav {
    display: none;
  }

  #astronim_logo {
    right: 0;
    bottom: 0;
  }

  .button_flat {
    font-size: 12px;
  }

  .case-grante.active #grante-elem2 {
    top: 0;
  }
  .case-grante h1 {
    padding-top: 100px;
  }

  #prj_list.show {
    width: 90%;
  }

  #promo_text {
    -webkit-transition: all 0.5s ease .3s;
    -moz-transition: all 0.5s ease .3s;
    -ms-transition: all 0.5s ease .3s;
    -o-transition: all 0.5s ease .3s;
    transition: all 0.5s ease .3s;
  }

  section.section .table {
    margin-bottom: 40px;
  }

  .table article {
    -webkit-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    transform: rotateY(0deg);
  }

  .background {
    display: none;
  }


  #tdi-elem2,
  #tdi-elem3 {
    display: none;
  }

   .case-tdi #tdi-elem1 {
    left: 50%;
    margin-left: -200px;
    margin-top: -20px;
    -webkit-transition: all 0.3s ease 0.3s;
    -o-transition: all 0.3s ease 0.3s;
    transition: all 0.3s ease 0.3s;
  }

  .case-tdi.active #tdi-elem1 {
    left: 50%;
    margin-left: -200px;
    margin-top: -100px;
  }

}


@media screen and (max-width: 800px) and (orientation: portrait) {

  #fix-monitor,
  #fix-ipad,
  #fix-iphone {
    display: none;
  }

  .table.wide90 {
    display: block;
    width: 90%;
    margin: 0 auto;
  }

  .table.wide90 .cell {
    display: block;
    width: auto;
  }

  .table.wide90 .cell:first-child {
    padding-top: 50px;
  }
  .table article {
    padding: 0;
  }
  .case-grante h1 {
    padding-top: 30px;
    color: #000;
  }
}



@media screen and (max-device-width: 800px) {
  #promo_text {
    color: #000;
    font-size: 2em;
  }
}

@media screen and (max-device-width: 800px) and (orientation: landscape) {
  #promo_text {
    padding-top: 1em;
  }
}


@media screen and (max-height: 800px) {
  h1 {
    font-size: 36px;
  }
  p {
    font-size: 1em;
  }
  .button_flat {
    font-size: 14px;
  }
  .case-grante.active #grante-elem2 {
    top: 0;
  }
  .case-grante h1 {
    padding-top: 100px;
  }
}




/*@media screen and (min-device-width: 500px) {
  .case-ita {
    background: #eeeeee url("../case/ita/bg-pattern.png") 50% 50% fixed repeat;
  }
  .case-ita .grid .item1 {
    background-image: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/ita/detail-1.png");
  }
  .case-ita .grid .item2 {
    background-image: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/ita/detail-2.png");
  }
  .case-ita .grid .item3 {
    background-image: linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("../case/ita/detail-3.png");
  }

  .case-bagoria {
    background: transparent url('../case/bagoria/bg.jpg') 0 0 no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
  }

  .case-bveb {
    background: #083f5e url("../case/bveb/line.png") 0% 50% fixed no-repeat;
  }

  .case-euroopt {
    background: #f0f7ff url("../case/euroopt/pattern.jpg") 0 0 repeat;
  }

  .case-extreme {
    background: #f0f7ff url("../case/extreme/bg.jpg") 0 0 repeat;
  }


  .case-karandash {
    background: #f2f2f2 url("../case/karandash/bg.jpg") 50% 0% fixed no-repeat;
  }

  .case-lapino {
    background: #6bb9ea;
    background-image: url("../case/lapino/fonLeft.png"), url("../case/lapino/fonRight.png");
    background-repeat: no-repeat, no-repeat;
    background-position: -50% 0, 150% 0;
    background-attachment: fixed, fixed;
  }

  .case-gpo .crane .bg {
    background: transparent url('../case/gpo/bg.png') 0 0 repeat;
  }

  .case-gpo .crane .mov {
    background: transparent url('../case/gpo/mov.png') 0 0 repeat;
  }

  .case-gpo .crane .cab {
    background: transparent url('../case/gpo/cab.png') 0 0 repeat;
  }

  .case-maxler {
    background: #252525 url("../case/maxler/bg.jpg") 50% 50% fixed no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
  }

  .case-mf {
    background: #f7f7f7 url("../case/mf/bg.png") -25% 50% fixed no-repeat;
  }

  .case-nbrb {
    background: #751430;
    background-image: url("../case/nbrb/bgb.png"), url("../case/nbrb/bgt.png"), url("../case/nbrb/bg.png");
    background-repeat: repeat-x, repeat-x, repeat;
    background-position: 0 100%, 0 0, 0 0;
    background-attachment: fixed, fixed, fixed;
  }

  .case-onega {
    background: #f7f7f7 url("../case/onega/bg.jpg") 50% 50% fixed no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
  }

  .case-orlov {
    background: #171624 url("../case/orlov/bg.jpg") 50% 50% fixed no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
  }

  .case-orimi {
    background: transparent url('../case/orimi/bg.jpg') 0 0 no-repeat;
  }

  .case-soyuz {
    background: #fff url('../case/soyuz/bg-top-green.jpg') 50% 120% no-repeat;
  }

  .case-tempo {
    background: #facf2d url("../case/tempo/bg.jpg") 50% 50% fixed no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
  }

  .case-porto {
    background: #2c2c2c url("../case/porto/bg.png") 50% 50% fixed repeat;
  }

  .case-skvirel {
    background: #f1f1f1 url("../case/skvirel/bg.jpg") 50% 50% fixed no-repeat;
  }

  .case-srs {
    background: white url("../case/srs/bg.png") 50% 0 fixed repeat-x;
  }

  .case-svitland {
    background: #1583ff url("../case/svitland/sky.jpg") 50% 50% fixed repeat;
    -webkit-background-size: cover;
    background-size: cover;
  }
  .case-svitland .coverbg {
    background: transparent url("../case/svitland/bg.png") 50% 50% fixed repeat;
    -webkit-background-size: cover;
    background-size: cover;
  }
  .case-svitland.active .videobg {
    display: block;
  }

  .case-yo {
    background: white url("../case/yo/bg.png") 50% 50% fixed repeat;
  }

  #yo_car {
    background: transparent url("../case/yo/car.png") 0 0 no-repeat;
  }
  #yo_car i {
    background: transparent url("../case/yo/wheel.png") 0 0 no-repeat;
  }
}
*/