@font-face {
	font-family: 'XO_Oriel_Bu';
	src: url(../fonts/XO_Oriel_Nu.ttf);
}

@font-face {
	font-family: 'XO_Oriel_Bu_h';
	src: url(../fonts/XO_Oriel_Bu.ttf);
}


body{
  font-family:XO_Oriel_Bu;
  background:#000;
  background-image: url('../img/bg.jpg');
  margin:0;
  background-attachment: fixed;
  background-size: cover;
  background-position: 50% 50%;
}

.block1{
  width:1200px;
  margin:80px auto 0 auto;
  padding:20px 0;
  position:relative;
}

.head {
width:100%;
height:70px;
position:fixed;
top:0;
left:0;
z-index:999999;
}

#header{
  width:1100px;
  height:70px;
  margin: 0 auto;
  background:#000;
  border-radius: 0 0 40px 40px;
  -webkit-box-shadow: 0px 13px 30px -2px rgba(0, 0, 0, 0.59);
  -moz-box-shadow: 0px 13px 30px -2px rgba(0, 0, 0, 0.59);
  box-shadow: 0px 13px 30px -2px rgba(0, 0, 0, 0.59);
  position:relative;
}

.logo{
  display:block;
  position:absolute;
  margin:5px 20px 0 40px;
  height:70px;
}

.logo2 {
  display:block;
  position:absolute;
  right:40px;
  top:3px;
  height:60px;
}


#header h1{
  color:#cd2020;
  display:block;
  position:absolute;
  margin:20px 0 0 90px;
}

#header span{
  color:#cd2020;
  display:block;
  position:absolute;
  margin:20px 0 0 90px;
  font-size: 2em;
  font-weight: bold;
}


.item img {
  width:380px;
  transition:.5s;
}



.item {
  width:250px;
  background:rgba(0,0,0,.85);
  float:left;
  margin:0 20px 20px 0;
  height:380px;
  overflow:hidden;
  position:relative;
  cursor:pointer;
  border-radius:20px;
  transition:1s;
  -webkit-box-shadow: 0px 0px 20px 0px rgba(2, 2, 2, 0.73);
  -moz-box-shadow: 0px 0px 20px 0px rgba(2, 2, 2, 0.73);
  box-shadow: 0px 0px 20px 0px rgba(2, 2, 2, 0.73);
}





.item p {
  display:block;
  font-weight:100;
  font-size:14px;
  color:#333;
}

.item a h1 {
  color:#333;
}

.block3_1 img {
  width:250px;
  overflow:hidden;
  border-radius:20px;
  display:block;
  position:fixed;
  -webkit-box-shadow: 0px 0px 25px 0px rgba(2, 2, 2, 0.73);
  -moz-box-shadow: 0px 0px 25px 0px rgba(2, 2, 2, 0.73);
  box-shadow: 0px 0px 25px 0px rgba(2, 2, 2, 0.73);
}

.block3_1 {
  width:250px;
  float:left;
  right:0;
  position:absolute;
  padding:20px 50px 0 0;
}

.block3_2  {
  overflow:hidden;
  width:840px;
  float:left;
  padding:20px 0 0 50px;
}



.calendar {
  position:absolute;
  bottom:20px;
  left:20px;
  font-size:12px;
}

.calendar svg{
  margin-top:-3px;
  margin-right:5px;
  display:block;
  float:left;
}

.search {
  position:absolute;
  border-radius:20px;
  overflow:hidden;
  background:#ccc;
  width:350px;
  height:35px;
  margin:19px 0 0 450px;
  background: #282a2e;
  background: linear-gradient(317deg,rgba(40, 42, 46, 1) 0%, rgba(62, 72, 79, 1) 50%, rgba(39, 42, 46, 1) 100%);
}

.search .btn{
  display:block;
  position:absolute;
  right:0px;
  top:0px;
  height:100%;
  width:45px;
  cursor:pointer;
  transition:.5s;
}

.search .btn:hover{
     background:#666C73;
}

.search .btn svg{
     display:block;
     position:absolute;
     top:6px;
     left:12px;
}


.search input{
  display:block;
  height:100%;
  width: 380px;
  margin-left:20px;
  border:none;
  padding:0 10px;
  outline:none;
  background:none;
  font-size:14px;
  color:#ddd;
}

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #AFBBC4;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #AFBBC4;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #AFBBC4;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #AFBBC4;
}
::-ms-input-placeholder { /* Microsoft Edge */
   color:    #AFBBC4;
}
::placeholder { /* Most modern browsers support this now. */
   color:    #AFBBC4;
}



.item.main {
  width:820px;
  height:auto;
  padding:0 0 100px 0;
  border:none;
  overflow:hidden;
}

.item.main h2,.item.main p{
  position:relative;
  top:auto;
	color:#AFBBC4;
	margin: 0 0 0 40px;
}

.item.main img{
  position:relative;
  width:740px;
  margin:40px;

}


.item.main:hover img{

}

.item.main p {
  margin:10px 0 0 40px;

  width:86%;
}

.item.main h1,.item.main h3 {
  margin:20px auto;
  display:block;
  width:590px;
  font-weight:100;
  color:#000;
}

.download{
  margin: 20px 0 0 50px;
  display:block;

}

.download {
  color:#AFBBC4;
}

.download:hover {
  text-decoration:none;
  color:#fff;
}

.item.main h1 {
  font-weight:bold;
}

.item.main {
  cursor:auto;
}

.item.left{
  margin-left:0;
}

.item.right{
  margin-right:0;
}


.item.small p{
  width:220px;
  height:60px;
  color:#AFBBC4;
  margin:0 0 0 20px;
  font-size:14px;
}

.item.big p{
  width:195px;
  height:60px;
  color:#AFBBC4;
  margin:0 0 0 180px;
  font-size:13px;
}


.item.small {
  width:260px;
  height:320px;
}

.item.small img {
  display:block;
  width:220px;
  height:130px;
  position:absolute;
  z-index:0;

}


.item.small .img_v {
  width:220px;
  height:130px;
  z-index:9;
  opacity:0.7;
  background-size: cover;
  background-position: 50% 50%;
  margin:20px 20px 0 20px;
-webkit-box-shadow: 0px 0px 25px 10px rgba(2, 2, 2, 0.73) inset;
-moz-box-shadow: 0px 0px 25px 10px rgba(2, 2, 2, 0.73) inset;
box-shadow: 0px 0px 25px 10px rgba(2, 2, 2, 0.73) inset;
transition:.5s;
}

.item.small:hover .img_v {
  opacity:1;
}


.item.big .img_v {
  width:150px;
  height:200px;
  z-index:9;
  opacity:0.7;
  background-size: cover;
  background-position: 25% 0;
  margin:20px 20px 0 20px;
  float:left;
-webkit-box-shadow: 0px 0px 25px 10px rgba(2, 2, 2, 0.73) inset;
-moz-box-shadow: 0px 0px 25px 10px rgba(2, 2, 2, 0.73) inset;
box-shadow: 0px 0px 25px 10px rgba(2, 2, 2, 0.73) inset;
transition:.5s;
}

.item.big:hover .img_v {
  opacity:1;
}




.item.big{
  width:400px;
  height:240px;
}

.item.small h2 {
  display:block;
  width:210px;
  height:40px;
  font-weight:bold;
  font-size:15px;
  color:#eee;
  margin:20px 0 10px 20px;
	font-family: 'XO_Oriel_Bu_h';
  color: transparent;
	-webkit-background-clip: text;
	background-clip: text;
	background-image: linear-gradient(to right, #daaaaf, #aaa);
  text-shadow: #ff5050 -5px 0px 50px;
}


.item.big h2 {
  	font-family: 'XO_Oriel_Bu_h';
  display:block;
  width:185px;
  height:40px;
  font-weight:bold;
  font-size:15px;
  color:#eee;
  margin:20px 0 10px 190px;
  color: transparent;
	-webkit-background-clip: text;
	background-clip: text;
	background-image: linear-gradient(to right, #daaaaf, #aaa);
  text-shadow: #ff5050 -5px 4px 50px;
}


body::-webkit-scrollbar {
  width: 2px;               /* ширина scrollbar */
}
body::-webkit-scrollbar-track {
  background: #000;        /* цвет дорожки */
}
body::-webkit-scrollbar-thumb {
  background-color: #cd2020;    /* цвет плашки */
  border-radius: 20px;       /* закругления плашки */
  border: none;  /* padding вокруг плашки */
}



.item.main h1 {
    display: block;
    width: 80%;
    height: 60px;
    font-weight: bold;
    font-size: 25px;
    color: #eee;
    margin: 40px 0 10px 40px;
    font-family: 'XO_Oriel_Bu_h';
    color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    background-image: linear-gradient(to right, #daaaaf, #aaa);
    text-shadow: #ff5050 -5px 0px 50px;
}


#landscape_alert{
  position:fixed;
  width:100vw;
  height:100vh;
  background:#000;
  top:0;
  left:0;
  z-index:99999999;
  display:none;
}

.rotated{
  display:block;
  position:absolute;
  width:150px;
  color:#aaa;
  height:48px;
  top:52%;
  left:50%;
  margin-left:-75px;
  margin-top:-50px;
  text-align:center;
  font-size:12px;
}

.rotated svg{
  position: absolute;
  margin-left:-30px;
  margin-top:-40px;
}

.img_sm{
	width:43% !important;
	float:left;
	margin:40px 0px 0 40px!important;
}