Привет форумчане , столкнулся с такой проблемой не прошу за меня сделать , а просто прошу обяснить в коком месте править сие чудо? просмотрел css оба от дизайна видел там menu менял размеры но нечего не помогло..
1. первая проблема меню с верху по бокам и с верху не в плотную стоит где в css это меняется?
2. с низу сайта в футере в самом низу желтая поолоска видна в самом низу , если прокрутить её в правую сторону то дизайн сьежает в парво , в коком месте в css это поправить?
скрины нижу:
сss:
1. первая проблема меню с верху по бокам и с верху не в плотную стоит где в css это меняется?
2. с низу сайта в футере в самом низу желтая поолоска видна в самом низу , если прокрутить её в правую сторону то дизайн сьежает в парво , в коком месте в css это поправить?
скрины нижу:
сss:
/*L2Banners.ru - Верстка сайтов на заказ
Email: l2banners@mail.ru
*/
/* Используемые шрифты:
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
*/
@import url(reset.css);
body {
background: url(../images/bg/bg__header.jpg) no-repeat center top, rgb(105, 84, 53);;
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-size: 14px;
color: #fff4ca;
}
::-webkit-scrollbar{
width: 8px;
height: 2px;
background: url(../images/nav_bg.jpg); #132131;;
}
::-webkit-scrollbar-thumb{
background-color: #ffc197;
}
::-webkit-scrollbar-thumb:hover{
background-color: #ce491b;
}
.anounce{
width: 1170px;
height: 300px;
margin: 0 auto;
position: relative;
z-index: 2;
margin-top: 60px;
background: url(../images/anons_bg.png) no-repeat;
}
.anounce_title{
position: relative;
padding-top: 30px;
margin-left: 35px;
width: 770px;
color: #fdf0ce;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 38px;
font-weight: bold;
text-shadow: 0 1px 3px #864c24, 0 1px 3px #00000061;
}
.anounce_text{
position: relative;
padding-top: 10px;
margin-left: 35px;
width: 770px;
color: #fffda2;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 28px;
font-weight: bold;
text-shadow: 0 1px 3px #864c24, 0 1px 3px #000000ba;
}
.anounce_btn{
margin-left: 35px;
margin-top: 25px;
}
/* preload */
.preload {
background: rgba(41, 24, 8, 0.9) url(../images/logo-min.png) no-repeat center center;
/* background-size: contain; */
position: fixed;
z-index: 999999;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 1;
visibility: visible;
-webkit-transition: all 0.5s cubic-bezier(.64, .14, .34, 1.32);
transition: all 0.5s cubic-bezier(.64, .14, .34, 1.32);
}
.preload.fade {
opacity: 0;
visibility: hidden;
-webkit-transform: scale(2);
transform: scale(2);
}
/* Общее */
.main {
max-width: 100%;
min-height: 100vh;
position: relative;
}
a {
color: #ffe993;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: opacity, color, background-color, background;
transition-property: opacity, color, background-color, background;
}
a:hover {
text-decoration: none;
}
img {
max-width: 100%;
}
input,
select {
width: 100%;
width: 299px;
height: 49px;
line-height: 49px;
border: 0;
background: url(../images/input_bg.png) no-repeat;
padding: 0 10px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: .3s all;
transition: .3s all;
color: #f9f59b;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 22px;
text-align-last: center;
text-align: center;
}
input::-webkit-input-placeholder {
color: rgba(249, 244, 155, 0.6);
-webkit-transition: .3s all;
transition: .3s all;
}
input:-ms-input-placeholder {
color: rgba(249, 244, 155, 0.6);
-webkit-transition: .3s all;
transition: .3s all;
}
input:laceholder {
color: rgba(249, 244, 155, 0.6);
-webkit-transition: .3s all;
transition: .3s all;
}
input:focus::-webkit-input-placeholder {
opacity: 0;
-webkit-transform: scale(1.2);
transform: scale(1.2);
-webkit-transition: .3s all;
transition: .3s all;
}
input:focus:-ms-input-placeholder {
opacity: 0;
transform: scale(1.2);
-webkit-transition: .3s all;
transition: .3s all;
}
input:focus:laceholder {
opacity: 0;
-webkit-transform: scale(1.2);
transform: scale(1.2);
-webkit-transition: .3s all;
transition: .3s all;
}
input:focus {
/* box-shadow: 0px 0px 4px rgb(74, 144, 224); */
}
.trRowA{
background: rgba(72, 44, 28, 0.21);
}
.input_long {
background: url(../images/input_long.png) no-repeat;
width: 341px;
height: 49px;
}
.input_wrapper {
position: relative;
min-height: 20px;
width: 100%;
max-width: 250px;
margin-bottom: 20px;
}
.input_wrapper span {
margin-bottom: 10px;
display: inline-block;
}
.inp-wrp {
position: relative;
max-width: 100%;
}
.inp-wrp_b {
margin-bottom: 6px;
}
.inp-desc {
color: #6b3921;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 22px;
display: inline-block;
margin-bottom: 6px;
}
.inp-wrp>span {
margin-bottom: 6px;
display: inline-block;
}
.select-short {
background: url(../images/ipn-short.png) no-repeat;
width: 107px;
height: 49px;
position: absolute;
left: -110px;
top: 0;
color: #6b3921;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 22px;
text-align-last: center;
text-align: center;
}
option {
color: #6b3921;
}
/* Дополнительно */
.animation {}
.hidden {
opacity: 0;
}
.visible {
opacity: 1;
}
.old_ie {
background-color: #000;
font-size: 30px;
padding: 120px 0 20px 0;
text-align: center;
z-index: 999999;
width: 100%;
color: #fff;
}
.old_ie a {
color: #D53939;
}
/* btns */
.btn-to {
display: inline-block;
-webkit-box-sizing: border-box;
box-sizing: border-box;
text-decoration: none;
color: #fff;
text-align: center;
background: url(../images/btn__to.png) no-repeat;
width: 267px;
height: 70px;
line-height: 70px;
cursor: pointer;
-webkit-transition: .3s all;
transition: .3s all;
position: relative;
color: #fffda2;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 20px;
font-weight: bold;
text-shadow: 0 1px 3px #000, 0 1px 3px #000;
text-transform: uppercase;
}
.btn-to_big {
background: url(../images/btn__big.png) no-repeat;
width: 311px;
height: 91px;
font-size: 27px;
line-height: 91px;
}
.btn-to_long {
background: url(../images/btn__long.png) no-repeat center center;
width: 360px;
height: 68px;
font-size: 26px;
line-height: 26px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding: 0 35px;
}
.btn-to_long3 {
background: url(../images/news_bg.png) no-repeat center center;
width: 222px;
height: 42px;
font-size: 18px;
line-height: 26px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding: 0 35px;
z-index: 5;
margin-left: calc( 50% - 111px );
margin-bottom: 15px;
}
@media (max-width: 360px) {
.btn-to_long {
width: 100%;
}
}
.btn-to_play {
-webkit-box-ordinal-group: 4;
-ms-flex-order: 3;
order: 3;
pointer-events: auto;
}
.btn-to_to-login {
margin: 0 auto;
}
.btn-to:hover {
-webkit-filter: brightness(120%);
filter: brightness(120%);
}
/* Header */
.header {
height: 650px;
position: relative;
z-index: 3;
}
.main__header {
/* outline: 1px solid #fff; */
}
/* logo */
.logo {
display: block;
text-decoration: none;
/* background: url(../images/logo__saintage.png) no-repeat; */
width: 358px;
height: 100px;
position: absolute;
left: 50%;
top: 383px;
margin-left: -630px;
z-index: 1;
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-perspective: 700px;
perspective: 700px;
}
.logo_saintage {
display: block;
text-decoration: none;
background: url(../images/logo__saintage.png) no-repeat;
width: 358px;
height: 100px;
position: absolute;
left: 0;
top: 0;
z-index: 2;
-webkit-transition: .3s all;
transition: .3s all;
}
.logo:hover .logo_saintage {
-webkit-filter: brightness(120%);
filter: brightness(120%);
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
.logo__cross {
display: block;
text-decoration: none;
background: url(../images/logo__cross.png) no-repeat;
width: 317px;
height: 451px;
position: absolute;
left: 50%;
top: -225px;
margin-left: -156px;
z-index: 1;
pointer-events: none;
-webkit-transition: .3s all;
transition: .3s all;
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
}
.logo:hover .logo__cross {
-webkit-transform: rotateX(25deg);
transform: rotateX(25deg)
}
/* Статистика серверов */
.servers {
position: relative;
z-index: 5;
margin-top: -430px;
pointer-events: none;
padding-bottom: 70px;
}
.serv_wrp {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.server {
position: relative;
width: 152px;
height: 152px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border-radius: 50%;
background: url(../images/server__bg.png) no-repeat;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
text-align: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
cursor: default;
box-sizing: border-box;
padding: 25px;
margin: 15px;
}
.server_none {
opacity: 0;
-webkit-box-ordinal-group: 5;
-ms-flex-order: 4;
order: 4;
}
.server.first {
-webkit-box-ordinal-group: 3;
-ms-flex-order: 2;
order: 2;
}
.server.second {
-webkit-box-ordinal-group: 5;
-ms-flex-order: 4;
order: 4;
}
.server__online {
color: #fffda1;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 36px;
font-weight: bold;
}
.server__name {
color: #ffe23d;
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-size: 16px;
}
.server__name a {
text-decoration: none;
color: #ffe23d;
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-size: 16px;
}
.server .circle {
position: absolute;
top: 2px;
left: 4px;
}
/* Заголовки */
.h-title {
text-align: center;
color: #fffda2;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 36px;
font-weight: bold;
text-shadow: 0 1px 3px #000, 0 1px 3px #000;
position: relative;
z-index: 5;
}
.h-title_pad {
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 10px 0;
}
.h-title_stream {
padding-top: 60px;
text-transform: uppercase;
}
.h-title__news {
padding-top: 60px;
text-transform: uppercase;
}
.h-title_forum {
padding-top: 60px;
text-transform: uppercase;
}
.h-title_modal {
padding: 40px 0;
}
/* login */
.login-wrp {
max-width: 333px;
width: 100%;
position: absolute;
left: 50%;
margin-left: -630px;
/* top: 220px; */
top: 180px;
z-index: 5;
text-align: center;
}
.login-title {
color: #6b3822;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 22px;
font-weight: bold;
background: url(../images/title__bg_cp.png) no-repeat center center;
max-width: 333px;
height: 49px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-bottom: 6px;
}
.code-wrp {
position: absolute;
left: 40px;
top: 14px;
}
.input-cap {
padding-left: 50px;
}
.sup-link {
text-decoration: none;
opacity: 0.5;
}
.sup-link:hover {
opacity: 1;
}
.cp-wrp {
text-shadow: 0 1px 2px #000;
padding-top: 7px;
}
.m-link_cp {
text-shadow: 0 1px 2px #000;
}
.m-link_cp:hover {
color: rgb(240, 198, 134);
}
/* profil */
.enter-profil-wrp {
max-width: 299px;
margin: 0 auto;
text-align: center;
}
/* reg-wrp */
.reg-wrp {
text-align: center;
max-width: 360px;
margin: 0 auto;
}
/* stream */
.stream-container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
position: relative;
z-index: 5;
}
.stream-item {
width: 400px;
height: 220px;
border: 7px solid #d2aa7a;
border-radius: 6px;
margin: 5px;
position: relative;
}
.stream-item:after {
content: 'Место для стрима';
display: block;
position: absolute;
-webkit-transition: .3s all;
transition: .3s all;
left: 50%;
top: 50%;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
color: rgb(255, 253, 161);
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 30px;
text-align: center;
z-index: -1;
pointer-events: none
}
/* content */
.content-wrp {
min-height: 600px;
position: relative;
z-index: 1;
}
.content-container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
max-width: 1240px;
margin: 0 auto;
}
/* news */
/*
.news {
max-width: 550px;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
border-radius: 10px;
margin: 10px;
}
*/
.news__title {
color: #fdf0ce;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 32px;
font-weight: bold;
text-shadow: 0 1px 3px #864c24, 0 1px 3px #00000061;
margin: 15px;
}
.news__date {
color: #fdf0ce;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 28px;
font-weight: bold;
text-shadow: 0 1px 3px #864c24, 0 1px 3px #00000061;
margin-left: 0px;
background: url(../images/date_bg.png) no-repeat right;
width: 256px;
padding: 10px;
padding-left: 15px;
}
.news__content {
background: #d2ab7b;
color: #6b3921;
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-size: 16px;
border-radius: 10px;
overflow: hidden;
}
.news__img {
height: 144px;
background: url(../images/news__img_def.jpg) no-repeat;
background-size: cover;
width: 100%;
}
.news__text {
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 0px 15px;
background: #d2ab7b;
color: #6b3921;
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-size: 16px;
line-height: 20px;
width: 100%;
height: 57px;
overflow: hidden;
border-bottom: 15px solid #d2ab7b;
}
.news__btn {
margin-top: auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding-bottom: 10px;
position: relative;
z-index: 3;
}
.news__link {
display: block;
/* background: url(../images/btn__read.png) no-repeat center center; */
max-width: 584px;
height: 65px;
text-align: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
color: #fffda1;
font-family: "MasonSerifCyrillic", serif;
font-size: 24px;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
position: relative;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
.news__link:after {
content: '';
display: block;
background: url(../images/btn__read.png) no-repeat center center;
height: 100px;
position: absolute;
left: 0;
right: 0;
top: -12px;
-webkit-transition: .3s all;
transition: .3s all;
z-index: -1;
transition: .3s all;
-webkit-transform: scale(1);
transform: scale(1);
pointer-events: none;
}
.news__link:hover:after {
-webkit-transform: scale(.9);
transform: scale(.9);
}
.news__link-content {
position: relative;
z-index: 5;
}
/* forum */
.foum-wrp {
position: relative;
z-index: 1;
}
.forum-container {
max-width: 1240px;
margin: 0 auto;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.theme {
display: block;
background: url(../images/forum__bg.png) no-repeat center center;
max-width: 540px;
height: 85px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 10px 0 10px 80px;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
text-decoration: none;
-webkit-transition: .3s all;
transition: .3s all;
-webkit-perspective: 700px;
perspective: 700px;
margin-bottom: 20px;
margin: 10px 10px 10px 55px;
-ms-flex-negative: 0;
flex-shrink: 0;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
width: 100%;
}
.theme:hover {
-webkit-filter: brightness(110%);
filter: brightness(110%);
}
.theme__img {
display: block;
width: 112px;
height: 102px;
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
position: absolute;
left: -45px;
top: -5px;
background-image: url(../images/forum__ava.png);
border-radius: 15px;
-webkit-transition: .3s all;
transition: .3s all;
-webkit-transform-origin: right center;
transform-origin: right center;
pointer-events: none
}
.theme:hover .theme__img {
-webkit-transform: rotateY(40deg);
transform: rotateY(40deg);
}
.theme__title {
color: #6b3921;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 24px;
}
.theme__title a {
color: #6b3921;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 24px;
text-decoration: none;
max-width: 390px;
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.theme__info {
color: #6b3921;
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-size: 16px;
}
.theme__info a {
color: #1083b8;
text-decoration: none;
}
.theme__info a:hover {
color: #6b3921;
}
.forum__link {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background: url(../images/btn__forum.png) no-repeat center center;
max-width: 438px;
width: 100%;
height: 55px;
color: #fff;
font-size: 24px;
text-shadow: 0 1px 15px rgba(11, 28, 79, .9), 0 1px 25px rgba(11, 28, 79, .9), 0 1px 25px rgba(11, 28, 79, .9);
text-decoration: none;
-webkit-transition: .3s all;
transition: .3s all;
}
.forum__link:hover {
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
.theme>a {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
display: block;
z-index: 6;
font-size: 0;
opacity: 0;
}
/* Кнопки группы */
.btn-group {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-sizing: border-box;
box-sizing: border-box;
text-decoration: none;
text-align: center;
background: url(../images/btn__x1.png) no-repeat;
width: 296px;
height: 83px;
cursor: pointer;
-webkit-transition: .3s all;
transition: .3s all;
position: relative;
color: hsla(180, 75%, 81%, 0.9);
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 24px;
line-height: 30px;
text-shadow: 0 1px 4px #234d68, 0 1px 4px #234d68;
}
.btn-group_x2 {
background: url(../images/btn__x2.png) no-repeat;
color: rgba(170, 228, 242, 0.9);
font-size: 24px;
text-shadow: 0 1px 4px #234d68, 0 1px 4px #234d68;
}
.btn-group:hover {
-webkit-filter: brightness(120%);
filter: brightness(120%);
}
.media-content__btn-group {
margin-top: 15px;
}
/* footer */
.footer {
max-width: 1200px;
margin: 0 auto;
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: relative;
z-index: 0;
border-top: 1px solid #9a8662;
padding: 10px 0 20px 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.main__footer {
margin-top: 60px;
}
.footer-left {
max-width: 450px;
}
.bnr-container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.bnr {
margin: 10px;
opacity: 0.5;
-webkit-transition: .3s all;
transition: .3s all;
-ms-flex-negative: 0;
flex-shrink: 0;
}
.bnr:hover {
opacity: 1;
}
.copy {
font-family: 'Candara', Arial, Tahoma, sans-serif;
color: #ccb997;
font-size: 16px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
line-height: 20px;
}
.footer-right {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.footer-item {
margin-left: 60px;
}
.footer__nav-link {
color: #fffda1;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 20px;
text-decoration: none;
margin-bottom: 10px;
display: inline-block;
position: relative;
}
.footer__nav-link:after {
content: '';
display: block;
height: 1px;
background-color: #fffda1;
position: absolute;
left: 0;
right: 100%;
bottom: -1px;
-webkit-transition: .3s all;
transition: .3s all;
}
.footer__nav-link:hover:after {
right: 0%;
}
.f-title {
display: block;
color: #fffda1;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 24px;
margin-bottom: 6px;
display: block;
}
.m-link {
color: #e1a059;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 18px;
text-decoration: underline;
margin-bottom: 13px;
display: inline-block;
text-decoration: none;
position: relative;
}
.m-link:after {
content: '';
display: block;
height: 1px;
background-color: #e1a059;
position: absolute;
left: 0;
right: 0;
bottom: -1px;
-webkit-transition: .3s all;
transition: .3s all;
}
.m-link:hover:after {
left: 50%;
}
/* menu */
.menu_wrp {
background: url(../images/menu_bg.png) no-repeat center top;
height: 95px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding-top: 15px;
position: absolute;
left: 0;
right: 0;
z-index: 4;
}
.menu_container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.active_menu .menu_container {
-webkit-animation: menu_container 1s ease 1;
animation: menu_container 1s ease 1;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
@-webkit-keyframes menu_container {
0% {
opacity: 0;
-webkit-transform: scale(0) translateY(-400px);
transform: scale(0) translateY(-400px);
}
100% {
opacity: 1;
-webkit-transform: scale(1) translateY(0);
transform: scale(1) translateY(0);
}
}
@keyframes menu_container {
0% {
opacity: 0;
-webkit-transform: scale(0) translateY(-400px);
transform: scale(0) translateY(-400px);
}
100% {
opacity: 1;
-webkit-transform: scale(1) translateY(0);
transform: scale(1) translateY(0);
}
}
.menu_container a {
display: inline-block;
height: 79px;
padding: 0 20px 11px 20px;
text-align: center;
color: #f6ecb6;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 18px;
font-weight: bold;
text-shadow: 0 1px 9px #251303, 0 1px 9px #80634a;
text-decoration: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: .3s all;
transition: .3s all;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.menu_container span {
display: inline-block;
height: 79px;
padding: 0 20px 11px 20px;
text-align: center;
color: #f6ecb6;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 18px;
font-weight: bold;
text-shadow: 0 1px 9px #251303, 0 1px 9px #80634a;
text-decoration: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: .3s all;
transition: .3s all;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.menu_container a:nth-child(7), .menu_container a:nth-child(8){
display: inline-block;
height: 79px;
padding: 0 20px 11px 20px;
text-align: center;
color: #fff;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 18px;
font-weight: bold;
text-shadow: 0 1px 9px #251303, 0 1px 9px #251303;
text-decoration: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: .3s all;
transition: .3s all;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.menu_container a:nth-child(1):after,
.menu_container a:nth-child(2):after,
.menu_container a:nth-child(3):after,
.menu_container a:nth-child(4):after,
.menu_container a:nth-child(5):after {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
right: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border.png) no-repeat;
z-index: -1;
}
.menu_container span:nth-child(1):after{
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
right: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border.png) no-repeat;
z-index: -1;
}
.menu_container a:nth-child(6):after {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
right: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border2.png) no-repeat;
z-index: 2;
}
.menu_container a:nth-child(7):after {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
right: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border3.png) no-repeat;
z-index: 2;
}
.menu_container a:nth-child(8):after {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
right: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border4.png) no-repeat;
z-index: 2;
}
.menu_container a:nth-child(1):before {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
left: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border.png) no-repeat;
z-index: -1;
}
.menu_container a:nth-child(3):before {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
left: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border.png) no-repeat;
z-index: -1;
}
.menu_container span:before {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
left: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border.png) no-repeat;
z-index: -1;
}
.reg_link{
display: inline-block;
height: 79px;
padding: 0 20px 11px 20px;
text-align: center;
color: #ffffff;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 18px;
font-weight: bold;
text-shadow: 0 1px 9px #251303, 0 1px 9px #251303;
text-decoration: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: .3s all;
transition: .3s all;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
background: url(../images/reg_bg.png) no-repeat;
z-index: 1;
}
.reg_link:hover {
filter: brightness(110%);
}
.log_link{
display: inline-block;
height: 79px;
padding: 0 20px 11px 20px;
text-align: center;
color: #ffffff;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 18px;
font-weight: bold;
text-shadow: 0 1px 9px #251303, 0 1px 9px #251303;
text-decoration: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: .3s all;
transition: .3s all;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
background: url(../images/log_bg.png) no-repeat;
z-index: 1;
}
.log_link:hover {
filter: brightness(110%);
}
.menu_container .log_link:after {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
right: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border4.png) no-repeat;
z-index: -1;
}
.reg_link:before {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
left: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border2.png) no-repeat;
z-index: -1;
}
.log_link:before {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
left: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border3.png) no-repeat;
z-index: -1;
}
.menu_container a:hover {
background-color: rgba(246, 101, 0, 0.2);
}
.menu_container p {
margin: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.menu_wrp.active_menu {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
/* Кнопка меню */
.act_btn {
position: fixed;
right: 10px;
top: 10px;
z-index: 88;
}
.menu_btn {
background-color: #000;
height: 26px;
width: 30px;
border: 7px solid #000;
border-radius: 3px;
position: relative;
display: table-cell;
vertical-align: middle;
cursor: pointer;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
.menu_btn:after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 4px;
background-color: #fff;
border-radius: 3px;
-webkit-transition: .3s all;
transition: .3s all;
}
.menu_btn:before {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 4px;
background-color: #fff;
border-radius: 3px;
-webkit-transition: .3s all;
transition: .3s all;
}
.menu_line {
height: 4px;
background-color: #fff;
border-radius: 3px;
-webkit-transition: .3s all;
transition: .3s all;
}
.menu_btn_active .menu_line {
opacity: 0;
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
.menu_btn_active:after {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
left: 3px;
}
.menu_btn_active:before {
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-transform-origin: left top;
transform-origin: left top;
left: 3px;
}
@media (min-width: 1200px) {
/* меню */
.adpt_nav {
display: block;
}
.act_btn {
display: none;
}
}
@media (max-width: 1200px) {
/* меню */
.menu_wrp {
display: none;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 86;
height: auto;
overflow-y: auto;
background-color: rgba(0, 0, 0, 0.4);
background-image: none;
}
.menu_container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.menu_container p {
margin: 0;
padding: 0;
}
.menu_container .reg_link p {
margin: 0;
padding: 0;
}
.menu_container a {
padding: 6px 0;
margin: 0;
height: auto;
}
.menu_container span {
padding: 6px 0;
margin: 0;
height: auto;
}
.menu_container a:nth-child(7), .menu_container a:nth-child(8){
padding: 6px 0;
margin: 0;
height: auto;
background: none;
}
.reg_link, .log_link{
padding: 6px 0;
margin: 0;
height: auto;
background: none;
}
.menu_container a:after,
.menu_container a:before
{
display: none !important;
}
.menu_container span.menu_ico {
display: none;
}
.menu_container span:after,
.menu_container span:before
{
display: none !important;
}
.logo {
display: block;
text-decoration: none;
/* background: url(../images/logo__saintage.png) no-repeat; */
width: 358px;
height: 100px;
position: absolute;
left: 50%;
top: 383px;
margin-left: -179px;
z-index: 1;
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-perspective: 700px;
perspective: 700px;
}
.servers {
position: relative;
z-index: 5;
margin-top: auto;
}
.anounce{
width: 100%;
height: auto;
margin: 0 auto;
position: relative;
z-index: 2;
margin-top: 60px;
background: none;
margin-top: -20px;
}
.anounce_title{
position: relative;
padding-top: 0px;
margin-left: 5px;
width: 80%;
color: #fdf0ce;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 38px;
font-weight: bold;
text-shadow: 0 1px 3px #864c24, 0 1px 3px #00000061;
text-align: center;
margin: 0 auto;
}
.anounce_text{
position: relative;
padding-top: 0px;
margin-left: 5px;
width: 80%;
color: #fffda2;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 28px;
font-weight: bold;
text-shadow: 0 1px 3px #864c24, 0 1px 3px #000000ba;
text-align: center;
margin: 0 auto;
}
.anounce_btn{
margin-left: 0px;
margin: 0 auto;
margin-top: 25px;
}
}
/* popup */
/* Фон для модалки */
.l2b-popup-wrp {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
overflow-y: auto;
background-color: rgba(0, 0, 0, 0.49);
z-index: 199;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
display: none;
-webkit-transition: 1s all;
transition: 1s all;
-webkit-transform: scale(1);
transform: scale(1);
-webkit-filter: blur(0);
filter: blur(0);
}
.l2b-popup-wrp_start {
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
.l2b-popup-wrp_flex {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.l2b-popup-wrp_hide {
opacity: 0;
-webkit-transform: scale(1.4);
transform: scale(1.4);
}
.l2b-popup-wrp_visible {
-webkit-transition: 1s all;
transition: 1s all;
opacity: 1;
}
/* Модальное окно */
.l2b-popup {
background: url(../images/modal_bg.png) no-repeat center center;
background-size: cover;
max-width: 849px;
min-height: 620px;
height: auto;
padding: 40px;
color: #6b3921;
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-size: 16px;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
-ms-flex-negative: 0;
flex-shrink: 0;
position: relative;
}
.l2b-popup-content {
display: none;
position: relative;
}
.l2b-popup__txt {
/* color: #6b3921;
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-size: 16px; */
}
.l2b-popup__btn-wrp {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-pack: distribute;
justify-content: space-around;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.l2-modal-close {
background: url(../images/close.png) no-repeat;
width: 26px;
height: 27px;
position: absolute;
right: 30px;
top: 30px;
display: block;
z-index: 5;
cursor: pointer;
-webkit-transition: .3s all;
transition: .3s all;
}
.l2-modal-close:hover {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
/* scene */
/* scene-girl */
.scene-girl {
/* background: url(../images/girl.png) no-repeat; */
width: 1175px;
height: 1020px;
position: absolute;
top: 67px;
left: 50%;
margin-left: -255px;
z-index: 4;
pointer-events: none;
-webkit-animation: girl 34s ease infinite;
animation: girl 34s ease infinite;
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
}
@-webkit-keyframes girl {
0% {
-webkit-transform: scale() rotate(0deg);
transform: scale() rotate(0deg);
}
50% {
-webkit-transform: scale(1.03) rotate(2deg);
transform: scale(1.03) rotate(2deg);
}
100% {
-webkit-transform: scale(1) rotate(0deg);
transform: scale(1) rotate(0deg);
}
}
@keyframes girl {
0% {
-webkit-transform: scale() rotate(0deg);
transform: scale() rotate(0deg);
}
50% {
-webkit-transform: scale(1.03) rotate(2deg);
transform: scale(1.03) rotate(2deg);
}
100% {
-webkit-transform: scale(1) rotate(0deg);
transform: scale(1) rotate(0deg);
}
}
.scene-girl__blade {
background: url(../images/girl__blade.png) no-repeat;
width: 621px;
height: 253px;
position: absolute;
left: 0;
top: 397px;
z-index: 1;
-webkit-animation: blade 34s ease infinite;
animation: blade 34s ease infinite;
-webkit-transform-origin: right top;
transform-origin: right top;
}
@-webkit-keyframes blade {
0% {
-webkit-transform: rotate(0deg) translateX(0px);
transform: rotate(0deg) translateX(0px);
}
50% {
-webkit-transform: rotate(5deg) translateX(10px);
transform: rotate(5deg) translateX(10px);
}
100% {
-webkit-transform: rotate(0deg) translateX(0px);
transform: rotate(0deg) translateX(0px);
}
}
@keyframes blade {
0% {
-webkit-transform: rotate(0deg) translateX(0px);
transform: rotate(0deg) translateX(0px);
}
50% {
-webkit-transform: rotate(5deg) translateX(10px);
transform: rotate(5deg) translateX(10px);
}
100% {
-webkit-transform: rotate(0deg) translateX(0px);
transform: rotate(0deg) translateX(0px);
}
}
.scene-girl__body {
background: url(../images/girl__body2.png) no-repeat;
width: 1187px;
height: 686px;
position: absolute;
left: 160px;
top: 0;
z-index: 3;
}
/* scene-dragon */
.scene-dragon {
background: url(../images/bg/bg__dragon-min.png) no-repeat;
width: 1109px;
height: 865px;
position: absolute;
bottom: 72px;
left: 50%;
margin-left: -960px;
z-index: 0;
pointer-events: none;
}
.news_wnd{
width: 849px;
height: 620px;
position: fixed;
left: calc( 50% - 424.5px );
background: url(../images/modal_bg.png) no-repeat;
z-index: 20;
margin-top: calc( 50vh - 320px );
transform: scale(0,0);
transition: all 0.5s ease;
}
.news_wnd_bg{
width: 100vw;
height: 100vh;
position: fixed;
z-index: 19;
background: rgba(0,0,0,0.5);
transform: scale(0,0);
}
#news_window_content{
width: 90%;
height: 80%;
margin: 0 auto;
margin-top: 5%;
overflow-y: scroll;
}
#news_window_content .btn-to_long2{
display: none;
}
#news_window_content .news__text {
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 0px 15px;
background: none;
color: #6b3921;
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-size: 16px;
line-height: 20px;
width: 100%;
height: auto;
overflow: hidden;
border-bottom: 0px solid #d2ab7b;
}
Email: l2banners@mail.ru
*/
/* Используемые шрифты:
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
*/
@import url(reset.css);
body {
background: url(../images/bg/bg__header.jpg) no-repeat center top, rgb(105, 84, 53);;
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-size: 14px;
color: #fff4ca;
}
::-webkit-scrollbar{
width: 8px;
height: 2px;
background: url(../images/nav_bg.jpg); #132131;;
}
::-webkit-scrollbar-thumb{
background-color: #ffc197;
}
::-webkit-scrollbar-thumb:hover{
background-color: #ce491b;
}
.anounce{
width: 1170px;
height: 300px;
margin: 0 auto;
position: relative;
z-index: 2;
margin-top: 60px;
background: url(../images/anons_bg.png) no-repeat;
}
.anounce_title{
position: relative;
padding-top: 30px;
margin-left: 35px;
width: 770px;
color: #fdf0ce;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 38px;
font-weight: bold;
text-shadow: 0 1px 3px #864c24, 0 1px 3px #00000061;
}
.anounce_text{
position: relative;
padding-top: 10px;
margin-left: 35px;
width: 770px;
color: #fffda2;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 28px;
font-weight: bold;
text-shadow: 0 1px 3px #864c24, 0 1px 3px #000000ba;
}
.anounce_btn{
margin-left: 35px;
margin-top: 25px;
}
/* preload */
.preload {
background: rgba(41, 24, 8, 0.9) url(../images/logo-min.png) no-repeat center center;
/* background-size: contain; */
position: fixed;
z-index: 999999;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 1;
visibility: visible;
-webkit-transition: all 0.5s cubic-bezier(.64, .14, .34, 1.32);
transition: all 0.5s cubic-bezier(.64, .14, .34, 1.32);
}
.preload.fade {
opacity: 0;
visibility: hidden;
-webkit-transform: scale(2);
transform: scale(2);
}
/* Общее */
.main {
max-width: 100%;
min-height: 100vh;
position: relative;
}
a {
color: #ffe993;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-property: opacity, color, background-color, background;
transition-property: opacity, color, background-color, background;
}
a:hover {
text-decoration: none;
}
img {
max-width: 100%;
}
input,
select {
width: 100%;
width: 299px;
height: 49px;
line-height: 49px;
border: 0;
background: url(../images/input_bg.png) no-repeat;
padding: 0 10px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: .3s all;
transition: .3s all;
color: #f9f59b;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 22px;
text-align-last: center;
text-align: center;
}
input::-webkit-input-placeholder {
color: rgba(249, 244, 155, 0.6);
-webkit-transition: .3s all;
transition: .3s all;
}
input:-ms-input-placeholder {
color: rgba(249, 244, 155, 0.6);
-webkit-transition: .3s all;
transition: .3s all;
}
input:laceholder {
color: rgba(249, 244, 155, 0.6);
-webkit-transition: .3s all;
transition: .3s all;
}
input:focus::-webkit-input-placeholder {
opacity: 0;
-webkit-transform: scale(1.2);
transform: scale(1.2);
-webkit-transition: .3s all;
transition: .3s all;
}
input:focus:-ms-input-placeholder {
opacity: 0;
transform: scale(1.2);
-webkit-transition: .3s all;
transition: .3s all;
}
input:focus:laceholder {
opacity: 0;
-webkit-transform: scale(1.2);
transform: scale(1.2);
-webkit-transition: .3s all;
transition: .3s all;
}
input:focus {
/* box-shadow: 0px 0px 4px rgb(74, 144, 224); */
}
.trRowA{
background: rgba(72, 44, 28, 0.21);
}
.input_long {
background: url(../images/input_long.png) no-repeat;
width: 341px;
height: 49px;
}
.input_wrapper {
position: relative;
min-height: 20px;
width: 100%;
max-width: 250px;
margin-bottom: 20px;
}
.input_wrapper span {
margin-bottom: 10px;
display: inline-block;
}
.inp-wrp {
position: relative;
max-width: 100%;
}
.inp-wrp_b {
margin-bottom: 6px;
}
.inp-desc {
color: #6b3921;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 22px;
display: inline-block;
margin-bottom: 6px;
}
.inp-wrp>span {
margin-bottom: 6px;
display: inline-block;
}
.select-short {
background: url(../images/ipn-short.png) no-repeat;
width: 107px;
height: 49px;
position: absolute;
left: -110px;
top: 0;
color: #6b3921;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 22px;
text-align-last: center;
text-align: center;
}
option {
color: #6b3921;
}
/* Дополнительно */
.animation {}
.hidden {
opacity: 0;
}
.visible {
opacity: 1;
}
.old_ie {
background-color: #000;
font-size: 30px;
padding: 120px 0 20px 0;
text-align: center;
z-index: 999999;
width: 100%;
color: #fff;
}
.old_ie a {
color: #D53939;
}
/* btns */
.btn-to {
display: inline-block;
-webkit-box-sizing: border-box;
box-sizing: border-box;
text-decoration: none;
color: #fff;
text-align: center;
background: url(../images/btn__to.png) no-repeat;
width: 267px;
height: 70px;
line-height: 70px;
cursor: pointer;
-webkit-transition: .3s all;
transition: .3s all;
position: relative;
color: #fffda2;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 20px;
font-weight: bold;
text-shadow: 0 1px 3px #000, 0 1px 3px #000;
text-transform: uppercase;
}
.btn-to_big {
background: url(../images/btn__big.png) no-repeat;
width: 311px;
height: 91px;
font-size: 27px;
line-height: 91px;
}
.btn-to_long {
background: url(../images/btn__long.png) no-repeat center center;
width: 360px;
height: 68px;
font-size: 26px;
line-height: 26px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding: 0 35px;
}
.btn-to_long3 {
background: url(../images/news_bg.png) no-repeat center center;
width: 222px;
height: 42px;
font-size: 18px;
line-height: 26px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding: 0 35px;
z-index: 5;
margin-left: calc( 50% - 111px );
margin-bottom: 15px;
}
@media (max-width: 360px) {
.btn-to_long {
width: 100%;
}
}
.btn-to_play {
-webkit-box-ordinal-group: 4;
-ms-flex-order: 3;
order: 3;
pointer-events: auto;
}
.btn-to_to-login {
margin: 0 auto;
}
.btn-to:hover {
-webkit-filter: brightness(120%);
filter: brightness(120%);
}
/* Header */
.header {
height: 650px;
position: relative;
z-index: 3;
}
.main__header {
/* outline: 1px solid #fff; */
}
/* logo */
.logo {
display: block;
text-decoration: none;
/* background: url(../images/logo__saintage.png) no-repeat; */
width: 358px;
height: 100px;
position: absolute;
left: 50%;
top: 383px;
margin-left: -630px;
z-index: 1;
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-perspective: 700px;
perspective: 700px;
}
.logo_saintage {
display: block;
text-decoration: none;
background: url(../images/logo__saintage.png) no-repeat;
width: 358px;
height: 100px;
position: absolute;
left: 0;
top: 0;
z-index: 2;
-webkit-transition: .3s all;
transition: .3s all;
}
.logo:hover .logo_saintage {
-webkit-filter: brightness(120%);
filter: brightness(120%);
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
.logo__cross {
display: block;
text-decoration: none;
background: url(../images/logo__cross.png) no-repeat;
width: 317px;
height: 451px;
position: absolute;
left: 50%;
top: -225px;
margin-left: -156px;
z-index: 1;
pointer-events: none;
-webkit-transition: .3s all;
transition: .3s all;
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
}
.logo:hover .logo__cross {
-webkit-transform: rotateX(25deg);
transform: rotateX(25deg)
}
/* Статистика серверов */
.servers {
position: relative;
z-index: 5;
margin-top: -430px;
pointer-events: none;
padding-bottom: 70px;
}
.serv_wrp {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.server {
position: relative;
width: 152px;
height: 152px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border-radius: 50%;
background: url(../images/server__bg.png) no-repeat;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
text-align: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
cursor: default;
box-sizing: border-box;
padding: 25px;
margin: 15px;
}
.server_none {
opacity: 0;
-webkit-box-ordinal-group: 5;
-ms-flex-order: 4;
order: 4;
}
.server.first {
-webkit-box-ordinal-group: 3;
-ms-flex-order: 2;
order: 2;
}
.server.second {
-webkit-box-ordinal-group: 5;
-ms-flex-order: 4;
order: 4;
}
.server__online {
color: #fffda1;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 36px;
font-weight: bold;
}
.server__name {
color: #ffe23d;
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-size: 16px;
}
.server__name a {
text-decoration: none;
color: #ffe23d;
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-size: 16px;
}
.server .circle {
position: absolute;
top: 2px;
left: 4px;
}
/* Заголовки */
.h-title {
text-align: center;
color: #fffda2;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 36px;
font-weight: bold;
text-shadow: 0 1px 3px #000, 0 1px 3px #000;
position: relative;
z-index: 5;
}
.h-title_pad {
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 10px 0;
}
.h-title_stream {
padding-top: 60px;
text-transform: uppercase;
}
.h-title__news {
padding-top: 60px;
text-transform: uppercase;
}
.h-title_forum {
padding-top: 60px;
text-transform: uppercase;
}
.h-title_modal {
padding: 40px 0;
}
/* login */
.login-wrp {
max-width: 333px;
width: 100%;
position: absolute;
left: 50%;
margin-left: -630px;
/* top: 220px; */
top: 180px;
z-index: 5;
text-align: center;
}
.login-title {
color: #6b3822;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 22px;
font-weight: bold;
background: url(../images/title__bg_cp.png) no-repeat center center;
max-width: 333px;
height: 49px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-bottom: 6px;
}
.code-wrp {
position: absolute;
left: 40px;
top: 14px;
}
.input-cap {
padding-left: 50px;
}
.sup-link {
text-decoration: none;
opacity: 0.5;
}
.sup-link:hover {
opacity: 1;
}
.cp-wrp {
text-shadow: 0 1px 2px #000;
padding-top: 7px;
}
.m-link_cp {
text-shadow: 0 1px 2px #000;
}
.m-link_cp:hover {
color: rgb(240, 198, 134);
}
/* profil */
.enter-profil-wrp {
max-width: 299px;
margin: 0 auto;
text-align: center;
}
/* reg-wrp */
.reg-wrp {
text-align: center;
max-width: 360px;
margin: 0 auto;
}
/* stream */
.stream-container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
position: relative;
z-index: 5;
}
.stream-item {
width: 400px;
height: 220px;
border: 7px solid #d2aa7a;
border-radius: 6px;
margin: 5px;
position: relative;
}
.stream-item:after {
content: 'Место для стрима';
display: block;
position: absolute;
-webkit-transition: .3s all;
transition: .3s all;
left: 50%;
top: 50%;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
color: rgb(255, 253, 161);
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 30px;
text-align: center;
z-index: -1;
pointer-events: none
}
/* content */
.content-wrp {
min-height: 600px;
position: relative;
z-index: 1;
}
.content-container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
max-width: 1240px;
margin: 0 auto;
}
/* news */
/*
.news {
max-width: 550px;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
border-radius: 10px;
margin: 10px;
}
*/
.news__title {
color: #fdf0ce;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 32px;
font-weight: bold;
text-shadow: 0 1px 3px #864c24, 0 1px 3px #00000061;
margin: 15px;
}
.news__date {
color: #fdf0ce;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 28px;
font-weight: bold;
text-shadow: 0 1px 3px #864c24, 0 1px 3px #00000061;
margin-left: 0px;
background: url(../images/date_bg.png) no-repeat right;
width: 256px;
padding: 10px;
padding-left: 15px;
}
.news__content {
background: #d2ab7b;
color: #6b3921;
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-size: 16px;
border-radius: 10px;
overflow: hidden;
}
.news__img {
height: 144px;
background: url(../images/news__img_def.jpg) no-repeat;
background-size: cover;
width: 100%;
}
.news__text {
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 0px 15px;
background: #d2ab7b;
color: #6b3921;
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-size: 16px;
line-height: 20px;
width: 100%;
height: 57px;
overflow: hidden;
border-bottom: 15px solid #d2ab7b;
}
.news__btn {
margin-top: auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding-bottom: 10px;
position: relative;
z-index: 3;
}
.news__link {
display: block;
/* background: url(../images/btn__read.png) no-repeat center center; */
max-width: 584px;
height: 65px;
text-align: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
color: #fffda1;
font-family: "MasonSerifCyrillic", serif;
font-size: 24px;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
position: relative;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
.news__link:after {
content: '';
display: block;
background: url(../images/btn__read.png) no-repeat center center;
height: 100px;
position: absolute;
left: 0;
right: 0;
top: -12px;
-webkit-transition: .3s all;
transition: .3s all;
z-index: -1;
transition: .3s all;
-webkit-transform: scale(1);
transform: scale(1);
pointer-events: none;
}
.news__link:hover:after {
-webkit-transform: scale(.9);
transform: scale(.9);
}
.news__link-content {
position: relative;
z-index: 5;
}
/* forum */
.foum-wrp {
position: relative;
z-index: 1;
}
.forum-container {
max-width: 1240px;
margin: 0 auto;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.theme {
display: block;
background: url(../images/forum__bg.png) no-repeat center center;
max-width: 540px;
height: 85px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 10px 0 10px 80px;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
text-decoration: none;
-webkit-transition: .3s all;
transition: .3s all;
-webkit-perspective: 700px;
perspective: 700px;
margin-bottom: 20px;
margin: 10px 10px 10px 55px;
-ms-flex-negative: 0;
flex-shrink: 0;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
width: 100%;
}
.theme:hover {
-webkit-filter: brightness(110%);
filter: brightness(110%);
}
.theme__img {
display: block;
width: 112px;
height: 102px;
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
position: absolute;
left: -45px;
top: -5px;
background-image: url(../images/forum__ava.png);
border-radius: 15px;
-webkit-transition: .3s all;
transition: .3s all;
-webkit-transform-origin: right center;
transform-origin: right center;
pointer-events: none
}
.theme:hover .theme__img {
-webkit-transform: rotateY(40deg);
transform: rotateY(40deg);
}
.theme__title {
color: #6b3921;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 24px;
}
.theme__title a {
color: #6b3921;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 24px;
text-decoration: none;
max-width: 390px;
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.theme__info {
color: #6b3921;
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-size: 16px;
}
.theme__info a {
color: #1083b8;
text-decoration: none;
}
.theme__info a:hover {
color: #6b3921;
}
.forum__link {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background: url(../images/btn__forum.png) no-repeat center center;
max-width: 438px;
width: 100%;
height: 55px;
color: #fff;
font-size: 24px;
text-shadow: 0 1px 15px rgba(11, 28, 79, .9), 0 1px 25px rgba(11, 28, 79, .9), 0 1px 25px rgba(11, 28, 79, .9);
text-decoration: none;
-webkit-transition: .3s all;
transition: .3s all;
}
.forum__link:hover {
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
.theme>a {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
display: block;
z-index: 6;
font-size: 0;
opacity: 0;
}
/* Кнопки группы */
.btn-group {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-sizing: border-box;
box-sizing: border-box;
text-decoration: none;
text-align: center;
background: url(../images/btn__x1.png) no-repeat;
width: 296px;
height: 83px;
cursor: pointer;
-webkit-transition: .3s all;
transition: .3s all;
position: relative;
color: hsla(180, 75%, 81%, 0.9);
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 24px;
line-height: 30px;
text-shadow: 0 1px 4px #234d68, 0 1px 4px #234d68;
}
.btn-group_x2 {
background: url(../images/btn__x2.png) no-repeat;
color: rgba(170, 228, 242, 0.9);
font-size: 24px;
text-shadow: 0 1px 4px #234d68, 0 1px 4px #234d68;
}
.btn-group:hover {
-webkit-filter: brightness(120%);
filter: brightness(120%);
}
.media-content__btn-group {
margin-top: 15px;
}
/* footer */
.footer {
max-width: 1200px;
margin: 0 auto;
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: relative;
z-index: 0;
border-top: 1px solid #9a8662;
padding: 10px 0 20px 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.main__footer {
margin-top: 60px;
}
.footer-left {
max-width: 450px;
}
.bnr-container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.bnr {
margin: 10px;
opacity: 0.5;
-webkit-transition: .3s all;
transition: .3s all;
-ms-flex-negative: 0;
flex-shrink: 0;
}
.bnr:hover {
opacity: 1;
}
.copy {
font-family: 'Candara', Arial, Tahoma, sans-serif;
color: #ccb997;
font-size: 16px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
line-height: 20px;
}
.footer-right {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.footer-item {
margin-left: 60px;
}
.footer__nav-link {
color: #fffda1;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 20px;
text-decoration: none;
margin-bottom: 10px;
display: inline-block;
position: relative;
}
.footer__nav-link:after {
content: '';
display: block;
height: 1px;
background-color: #fffda1;
position: absolute;
left: 0;
right: 100%;
bottom: -1px;
-webkit-transition: .3s all;
transition: .3s all;
}
.footer__nav-link:hover:after {
right: 0%;
}
.f-title {
display: block;
color: #fffda1;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 24px;
margin-bottom: 6px;
display: block;
}
.m-link {
color: #e1a059;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 18px;
text-decoration: underline;
margin-bottom: 13px;
display: inline-block;
text-decoration: none;
position: relative;
}
.m-link:after {
content: '';
display: block;
height: 1px;
background-color: #e1a059;
position: absolute;
left: 0;
right: 0;
bottom: -1px;
-webkit-transition: .3s all;
transition: .3s all;
}
.m-link:hover:after {
left: 50%;
}
/* menu */
.menu_wrp {
background: url(../images/menu_bg.png) no-repeat center top;
height: 95px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding-top: 15px;
position: absolute;
left: 0;
right: 0;
z-index: 4;
}
.menu_container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.active_menu .menu_container {
-webkit-animation: menu_container 1s ease 1;
animation: menu_container 1s ease 1;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
@-webkit-keyframes menu_container {
0% {
opacity: 0;
-webkit-transform: scale(0) translateY(-400px);
transform: scale(0) translateY(-400px);
}
100% {
opacity: 1;
-webkit-transform: scale(1) translateY(0);
transform: scale(1) translateY(0);
}
}
@keyframes menu_container {
0% {
opacity: 0;
-webkit-transform: scale(0) translateY(-400px);
transform: scale(0) translateY(-400px);
}
100% {
opacity: 1;
-webkit-transform: scale(1) translateY(0);
transform: scale(1) translateY(0);
}
}
.menu_container a {
display: inline-block;
height: 79px;
padding: 0 20px 11px 20px;
text-align: center;
color: #f6ecb6;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 18px;
font-weight: bold;
text-shadow: 0 1px 9px #251303, 0 1px 9px #80634a;
text-decoration: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: .3s all;
transition: .3s all;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.menu_container span {
display: inline-block;
height: 79px;
padding: 0 20px 11px 20px;
text-align: center;
color: #f6ecb6;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 18px;
font-weight: bold;
text-shadow: 0 1px 9px #251303, 0 1px 9px #80634a;
text-decoration: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: .3s all;
transition: .3s all;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.menu_container a:nth-child(7), .menu_container a:nth-child(8){
display: inline-block;
height: 79px;
padding: 0 20px 11px 20px;
text-align: center;
color: #fff;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 18px;
font-weight: bold;
text-shadow: 0 1px 9px #251303, 0 1px 9px #251303;
text-decoration: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: .3s all;
transition: .3s all;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.menu_container a:nth-child(1):after,
.menu_container a:nth-child(2):after,
.menu_container a:nth-child(3):after,
.menu_container a:nth-child(4):after,
.menu_container a:nth-child(5):after {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
right: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border.png) no-repeat;
z-index: -1;
}
.menu_container span:nth-child(1):after{
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
right: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border.png) no-repeat;
z-index: -1;
}
.menu_container a:nth-child(6):after {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
right: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border2.png) no-repeat;
z-index: 2;
}
.menu_container a:nth-child(7):after {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
right: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border3.png) no-repeat;
z-index: 2;
}
.menu_container a:nth-child(8):after {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
right: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border4.png) no-repeat;
z-index: 2;
}
.menu_container a:nth-child(1):before {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
left: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border.png) no-repeat;
z-index: -1;
}
.menu_container a:nth-child(3):before {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
left: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border.png) no-repeat;
z-index: -1;
}
.menu_container span:before {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
left: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border.png) no-repeat;
z-index: -1;
}
.reg_link{
display: inline-block;
height: 79px;
padding: 0 20px 11px 20px;
text-align: center;
color: #ffffff;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 18px;
font-weight: bold;
text-shadow: 0 1px 9px #251303, 0 1px 9px #251303;
text-decoration: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: .3s all;
transition: .3s all;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
background: url(../images/reg_bg.png) no-repeat;
z-index: 1;
}
.reg_link:hover {
filter: brightness(110%);
}
.log_link{
display: inline-block;
height: 79px;
padding: 0 20px 11px 20px;
text-align: center;
color: #ffffff;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 18px;
font-weight: bold;
text-shadow: 0 1px 9px #251303, 0 1px 9px #251303;
text-decoration: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: .3s all;
transition: .3s all;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
background: url(../images/log_bg.png) no-repeat;
z-index: 1;
}
.log_link:hover {
filter: brightness(110%);
}
.menu_container .log_link:after {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
right: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border4.png) no-repeat;
z-index: -1;
}
.reg_link:before {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
left: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border2.png) no-repeat;
z-index: -1;
}
.log_link:before {
content: '';
display: block;
width: 32px;
height: 79px;
position: absolute;
top: 0;
left: -16px;
-webkit-transition: .3s all;
transition: .3s all;
background: url(../images/menu__border3.png) no-repeat;
z-index: -1;
}
.menu_container a:hover {
background-color: rgba(246, 101, 0, 0.2);
}
.menu_container p {
margin: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.menu_wrp.active_menu {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
/* Кнопка меню */
.act_btn {
position: fixed;
right: 10px;
top: 10px;
z-index: 88;
}
.menu_btn {
background-color: #000;
height: 26px;
width: 30px;
border: 7px solid #000;
border-radius: 3px;
position: relative;
display: table-cell;
vertical-align: middle;
cursor: pointer;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
.menu_btn:after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 4px;
background-color: #fff;
border-radius: 3px;
-webkit-transition: .3s all;
transition: .3s all;
}
.menu_btn:before {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 4px;
background-color: #fff;
border-radius: 3px;
-webkit-transition: .3s all;
transition: .3s all;
}
.menu_line {
height: 4px;
background-color: #fff;
border-radius: 3px;
-webkit-transition: .3s all;
transition: .3s all;
}
.menu_btn_active .menu_line {
opacity: 0;
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
.menu_btn_active:after {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
left: 3px;
}
.menu_btn_active:before {
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-transform-origin: left top;
transform-origin: left top;
left: 3px;
}
@media (min-width: 1200px) {
/* меню */
.adpt_nav {
display: block;
}
.act_btn {
display: none;
}
}
@media (max-width: 1200px) {
/* меню */
.menu_wrp {
display: none;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 86;
height: auto;
overflow-y: auto;
background-color: rgba(0, 0, 0, 0.4);
background-image: none;
}
.menu_container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.menu_container p {
margin: 0;
padding: 0;
}
.menu_container .reg_link p {
margin: 0;
padding: 0;
}
.menu_container a {
padding: 6px 0;
margin: 0;
height: auto;
}
.menu_container span {
padding: 6px 0;
margin: 0;
height: auto;
}
.menu_container a:nth-child(7), .menu_container a:nth-child(8){
padding: 6px 0;
margin: 0;
height: auto;
background: none;
}
.reg_link, .log_link{
padding: 6px 0;
margin: 0;
height: auto;
background: none;
}
.menu_container a:after,
.menu_container a:before
{
display: none !important;
}
.menu_container span.menu_ico {
display: none;
}
.menu_container span:after,
.menu_container span:before
{
display: none !important;
}
.logo {
display: block;
text-decoration: none;
/* background: url(../images/logo__saintage.png) no-repeat; */
width: 358px;
height: 100px;
position: absolute;
left: 50%;
top: 383px;
margin-left: -179px;
z-index: 1;
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-perspective: 700px;
perspective: 700px;
}
.servers {
position: relative;
z-index: 5;
margin-top: auto;
}
.anounce{
width: 100%;
height: auto;
margin: 0 auto;
position: relative;
z-index: 2;
margin-top: 60px;
background: none;
margin-top: -20px;
}
.anounce_title{
position: relative;
padding-top: 0px;
margin-left: 5px;
width: 80%;
color: #fdf0ce;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 38px;
font-weight: bold;
text-shadow: 0 1px 3px #864c24, 0 1px 3px #00000061;
text-align: center;
margin: 0 auto;
}
.anounce_text{
position: relative;
padding-top: 0px;
margin-left: 5px;
width: 80%;
color: #fffda2;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-size: 28px;
font-weight: bold;
text-shadow: 0 1px 3px #864c24, 0 1px 3px #000000ba;
text-align: center;
margin: 0 auto;
}
.anounce_btn{
margin-left: 0px;
margin: 0 auto;
margin-top: 25px;
}
}
/* popup */
/* Фон для модалки */
.l2b-popup-wrp {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
overflow-y: auto;
background-color: rgba(0, 0, 0, 0.49);
z-index: 199;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
display: none;
-webkit-transition: 1s all;
transition: 1s all;
-webkit-transform: scale(1);
transform: scale(1);
-webkit-filter: blur(0);
filter: blur(0);
}
.l2b-popup-wrp_start {
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
.l2b-popup-wrp_flex {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.l2b-popup-wrp_hide {
opacity: 0;
-webkit-transform: scale(1.4);
transform: scale(1.4);
}
.l2b-popup-wrp_visible {
-webkit-transition: 1s all;
transition: 1s all;
opacity: 1;
}
/* Модальное окно */
.l2b-popup {
background: url(../images/modal_bg.png) no-repeat center center;
background-size: cover;
max-width: 849px;
min-height: 620px;
height: auto;
padding: 40px;
color: #6b3921;
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-size: 16px;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
-ms-flex-negative: 0;
flex-shrink: 0;
position: relative;
}
.l2b-popup-content {
display: none;
position: relative;
}
.l2b-popup__txt {
/* color: #6b3921;
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-size: 16px; */
}
.l2b-popup__btn-wrp {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-pack: distribute;
justify-content: space-around;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.l2-modal-close {
background: url(../images/close.png) no-repeat;
width: 26px;
height: 27px;
position: absolute;
right: 30px;
top: 30px;
display: block;
z-index: 5;
cursor: pointer;
-webkit-transition: .3s all;
transition: .3s all;
}
.l2-modal-close:hover {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
/* scene */
/* scene-girl */
.scene-girl {
/* background: url(../images/girl.png) no-repeat; */
width: 1175px;
height: 1020px;
position: absolute;
top: 67px;
left: 50%;
margin-left: -255px;
z-index: 4;
pointer-events: none;
-webkit-animation: girl 34s ease infinite;
animation: girl 34s ease infinite;
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
}
@-webkit-keyframes girl {
0% {
-webkit-transform: scale() rotate(0deg);
transform: scale() rotate(0deg);
}
50% {
-webkit-transform: scale(1.03) rotate(2deg);
transform: scale(1.03) rotate(2deg);
}
100% {
-webkit-transform: scale(1) rotate(0deg);
transform: scale(1) rotate(0deg);
}
}
@keyframes girl {
0% {
-webkit-transform: scale() rotate(0deg);
transform: scale() rotate(0deg);
}
50% {
-webkit-transform: scale(1.03) rotate(2deg);
transform: scale(1.03) rotate(2deg);
}
100% {
-webkit-transform: scale(1) rotate(0deg);
transform: scale(1) rotate(0deg);
}
}
.scene-girl__blade {
background: url(../images/girl__blade.png) no-repeat;
width: 621px;
height: 253px;
position: absolute;
left: 0;
top: 397px;
z-index: 1;
-webkit-animation: blade 34s ease infinite;
animation: blade 34s ease infinite;
-webkit-transform-origin: right top;
transform-origin: right top;
}
@-webkit-keyframes blade {
0% {
-webkit-transform: rotate(0deg) translateX(0px);
transform: rotate(0deg) translateX(0px);
}
50% {
-webkit-transform: rotate(5deg) translateX(10px);
transform: rotate(5deg) translateX(10px);
}
100% {
-webkit-transform: rotate(0deg) translateX(0px);
transform: rotate(0deg) translateX(0px);
}
}
@keyframes blade {
0% {
-webkit-transform: rotate(0deg) translateX(0px);
transform: rotate(0deg) translateX(0px);
}
50% {
-webkit-transform: rotate(5deg) translateX(10px);
transform: rotate(5deg) translateX(10px);
}
100% {
-webkit-transform: rotate(0deg) translateX(0px);
transform: rotate(0deg) translateX(0px);
}
}
.scene-girl__body {
background: url(../images/girl__body2.png) no-repeat;
width: 1187px;
height: 686px;
position: absolute;
left: 160px;
top: 0;
z-index: 3;
}
/* scene-dragon */
.scene-dragon {
background: url(../images/bg/bg__dragon-min.png) no-repeat;
width: 1109px;
height: 865px;
position: absolute;
bottom: 72px;
left: 50%;
margin-left: -960px;
z-index: 0;
pointer-events: none;
}
.news_wnd{
width: 849px;
height: 620px;
position: fixed;
left: calc( 50% - 424.5px );
background: url(../images/modal_bg.png) no-repeat;
z-index: 20;
margin-top: calc( 50vh - 320px );
transform: scale(0,0);
transition: all 0.5s ease;
}
.news_wnd_bg{
width: 100vw;
height: 100vh;
position: fixed;
z-index: 19;
background: rgba(0,0,0,0.5);
transform: scale(0,0);
}
#news_window_content{
width: 90%;
height: 80%;
margin: 0 auto;
margin-top: 5%;
overflow-y: scroll;
}
#news_window_content .btn-to_long2{
display: none;
}
#news_window_content .news__text {
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 0px 15px;
background: none;
color: #6b3921;
font-family: 'Candara', Arial, Tahoma, sans-serif;
font-size: 16px;
line-height: 20px;
width: 100%;
height: auto;
overflow: hidden;
border-bottom: 0px solid #d2ab7b;
}
/* ----------------------------- */
/* --------- Контент ----------- */
/* ----------------------------- */
.content{
max-width: 1350px;
padding-left: 30px;
padding-right: 30px;
margin: 0 auto;
position: relative;
z-index: 4;
overflow: hidden;
padding-top: 30px;
}
/* ---------- Слайды ----------- */
#slider_block{
width: calc( 70% - 30px );
height: 200px;
background: rgba(51, 34, 24, 0.25);
border-radius: 8px;
overflow: hidden;
float: left;
position: relative;
}
.slide{
width: 100%;
height: 100%;
position: absolute;
left: 100%;
top: 0px;
opacity: 0;
z-index: 1;
transition: all 1s ease;
}
.showing {
opacity: 1;
z-index: 2;
left: 0px;
}
.slide:nth-of-type(1){
background: url(../images/slide_bg5.png) top right;
right: 0px;
}
.slide:nth-of-type(2){
background: url(../images/slide_bg6.png) top right;
right: 0px;
}
.slide:nth-of-type(3){
background: url(../images/slide_bg1.png) top right;
right: 0px;
}
.slide:nth-of-type(4){
background: url(../images/slide_bg2.png) top right;
right: 0px;
}
.slide:nth-of-type(5){
background: url(../images/slide_bg3.png) top right;
right: 0px;
}
.slide:nth-of-type(6){
background: url(../images/slide_bg4.png) top right;
right: 0px;
}
.slide a{
display: block;
width: 100%;
height: 100%;
padding-top: 35px;
}
.controls{
font-size: 28px;
border: none;
background: none;
color: #ffdb5e;
margin: 5px;
cursor: pointer;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
}
.controls:focus{
background: none;
color: none;
}
.controls:hover{
background: none;
color: #f6ff00;
}
.container{
position: relative;
}
.slider_buttons{
position: absolute;
left: calc( 50% - 51px );
bottom: 10px;
z-index: 10;
font-size: 0px;
display: none;
}
.slide .flag{
padding-top: 8px;
padding-bottom: 8px;
background: #f44336;
width: 140px;
text-align: center;
margin-left: 30px;
border-radius: 5px;
}
.slide .slide_title{
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
margin-left: 30px;
color: #ffdb5e;
font-size: 28px;
margin-top: 5px;
}
.slide .desc{
margin-left: 30px;
color: #fff;
font-size: 18px;
margin-top: 5px;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
}
.slide .time{
margin-left: 30px;
color: #ffdb5e;
font-size: 16px;
margin-top: 5px;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
}
.slide .button{
margin: 0 auto;
width: 200px;
padding-top: 12px;
padding-bottom: 12px;
text-align: center;
font-size: 18px;
background: url(../images/news_bg.png) no-repeat;
background-size: 100% 100%;
border-radius: 5px;
transition: all 0.3s ease;
z-index: 9975;
position: absolute;
top: 84px;
right: 30px;
text-shadow: 0 1px 3px #000, 0 1px 3px #000;
color: #fffda2;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
display: none;
}
.slide .button:hover{
-webkit-filter: brightness(120%);
filter: brightness(120%);
}
/* ---------- Магазин ----------- */
.shop_block{
width: 30%;
height: 200px;
background: url(../images/shop_bg.png) center center;
background-size: 100% 100%;
border-radius: 8px;
transition: all 0.3s ease;
float: right;
overflow: hidden;
filter: brightness(100%);
}
.shop_block_a{
width: 100%;
height: 100%;
display: block;
}
.shop_block:hover{
background-size: 110% 110%;
filter: brightness(110%);
}
.shop_block:hover .shop_unit{
filter: brightness(130%);
transform: scale(-1.1,1.1);
}
.shop_block .shop_title1{
margin: 0 auto;
width: 100%;
text-align: center;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
text-shadow: 0 12px 20px #9e5656, 0 2px 3px #000;
font-size: 30px;
color: #fff4cf;
margin-top: 40px;
z-index: 9975;
cursor: default;
pointer-events: none;
}
.shop_block .shop_title2{
margin: 0 auto;
width: 100%;
text-align: center;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
text-shadow: 0 12px 20px #9e5656, 0 2px 3px #000;
font-size: 40px;
color: #fff4cf;
margin-top: -5px;
z-index: 9975;
cursor: default;
pointer-events: none;
}
.shop_block .button{
margin: 0 auto;
width: 200px;
padding-top: 12px;
padding-bottom: 12px;
text-align: center;
font-size: 18px;
background: url(../images/shop_button.png) no-repeat;
background-size: 100% 100%;
border-radius: 5px;
margin-left: 15px;
margin-top: 15px;
transition: all 0.3s ease;
z-index: 9975;
position: relative;
text-shadow: 0 1px 3px #000, 0 1px 3px #000;
color: #fff;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
}
a{
text-decoration: none;
text-transform: none;
}
.shop_block .button:hover{
-webkit-filter: brightness(120%);
filter: brightness(120%);
}
.shop_unit{
width: 200px;
height: 200px;
background: url(../images/unit_1.png);
background-size: 100% 100%;
margin-top: -180px;
transform: scale(-1,1);
left: calc( 100% - 166px );
position: relative;
z-index: 9974;
display: block;
filter: brightness(100%);
transition: all 0.5s ease;
}
/* ---------- Новости ----------- */
.news_block{
width: calc( 70% - 30px );
margin-top: 30px;
height: 530px;
border-radius: 8px;
overflow: hidden;
float: left;
position: relative;
}
.news:nth-of-type(1){
width: calc( 60% - 30px );
background: url(../images/full_news_bg.png) #dabba0 center center;
background-size: 110% 100%;
height: 500px;
border-radius: 8px;
float: left;
position: relative;
overflow: hidden;
transition: all 0.5s ease;
}
.news:nth-of-type(1):hover{
background: url(../images/full_news_bg.png) #dabba0 center center;
background-size: 120% 110%;
}
.news:nth-of-type(1) .date{
margin-top: 15px;
margin-left: 15px;
font-size: 28px;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
}
.news:nth-of-type(1) .news_content{
width: calc( 100% - 60px );
margin-left: 30px;
position: absolute;
bottom: 60px;
background: none;
padding: 0px;
}
.news:nth-of-type(1) .news_content .avatar{
width: 97px;
height: 138px;
background: url(../images/news_avatar1.png);
float: left;
display: block;
}
.news:nth-of-type(1) .news_content .info{
width: calc( 100% - 100px - 20px );
float: right;
font-size: 12px;
color: #715e54;
height: 119px;
overflow: hidden;
}
.news:nth-of-type(1) .news_content .news_title{
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
color: #4a3429;
font-size: 16px;
text-transform: uppercase;
}
.news a{
color: #795548;
font-weight: bold;
}
.news:nth-of-type(1) .read_more{
cursor: pointer;
margin: 0 auto;
text-align: center;
font-size: 16px;
background-size: 100% 100%;
border-radius: 5px;
transition: all 0.3s ease;
z-index: 9975;
position: relative;
text-shadow: 0 1px 3px #cc9898, 0 1px 3px #000;
color: #ffeadd;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
position: absolute;
top: auto;
bottom: 30px;
right: -50%;
transition: all 0.5s ease;
}
.news:nth-of-type(1) .read_more:hover{
color: #ffdb5e;
}
.news:nth-of-type(1):hover .read_more{
right: 30px;
}
.news:nth-of-type(1) .all_news{
position: absolute;
top: 35px;
right: 30px;
font-family: PT Sans Bold;
border: 1px solid #fff;
border-radius: 5px;
padding: 5px;
transition: all 0.5s ease;
display: block;
background: #fff;
color: #c76c33;
cursor: pointer;
z-index: 1;
display: none;
}
.news:nth-of-type(1) .all_news:hover{
color: #c76c33;
border: 1px solid #c76c33;
}
.news:nth-of-type(2){
background: url(../images/full_news_bg2.png) #dabba0 top center;
background-size: 100% auto;
}
.news:nth-of-type(3){
background: url(../images/full_news_bg3.png) #dabba0 top center;
background-size: 100% auto;
}
.news:nth-child(n+4){
width: calc( 50% - 15px );
height: 235px;
border-radius: 8px;
float: left;
margin-bottom: 30px;
position: relative;
overflow: hidden;
transition: all 0.5s ease;
background: url(../images/full_news_bg3.png) #dabba0 top center;
background-size: 100% auto;
}
.news:nth-child(n+4):nth-child(even){
margin-right: 30px;
}
.all_news_button{
width: 37%;
background: rgba(51, 34, 24, 0.25);
padding: 12px;
float: right;
position: absolute;
right: 0px;
bottom: 30px;
text-align: center;
cursor: pointer;
border-radius: 8px;
transition: all 0.5s ease;
}
.all_news_button:hover{
background: #dabba0;
color: #000;
}
.news{
width: 40%;
height: 200px;
background: #dabba0;
border-radius: 8px;
float: right;
margin-bottom: 30px;
position: relative;
overflow: hidden;
transition: all 0.5s ease;
position: relative;
}
.news:hover{
background-size: 110% auto;
}
.news .date{
margin-top: 15px;
margin-left: 15px;
font-size: 16px;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
z-index: 4;
}
.news .news_content{
width: calc( 100% );
padding: 15px;
position: absolute;
bottom: 0px;
background: #c6aa91;
}
.news .news_content .avatar{
width: 97px;
height: 138px;
background: url(../images/news_avatar1.png);
float: left;
display: none;
}
.news .news_content .info{
width: calc( 100% );
float: right;
font-size: 12px;
color: #715e54;
line-height: 1.4;
height: 87px;
overflow: hidden;
}
.news .news_content .news_title{
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
color: #4a3429;
font-size: 14px;
text-transform: uppercase;
margin-top: 0px;
}
.news .read_more{
position: absolute;
top: 15px;
right: -100%;
font-family: PT Sans Bold;
transition: all 0.5s ease;
cursor: pointer;
z-index: 1;
}
.news .read_more:hover{
color: #ffdb5e;
}
.news:hover .read_more{
right: 15px;
}
.news .all_news{
position: absolute;
top: 35px;
right: 30px;
font-family: PT Sans Bold;
border: 1px solid #fff;
border-radius: 5px;
padding: 5px;
transition: all 0.5s ease;
display: none;
}
.news .all_news:hover{
color: #ffdb5e;
border: 1px solid #ffdb5e;
}
.news_wnd .news_images{
display: none;
}
.news_wnd .date{
font-size: 28px;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
float: left;
width: 30%;
text-align: left;
margin-bottom: 20px;
position: absolute;
}
.news_wnd .news_title{
width: 100%;
font-size: 28px;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
float: left;
margin-bottom: 20px;
color: #ffe28d;
}
.news_wnd .info{
width: 100%;
font-size: 16px;
color: #5f4238;
float: left;
margin-bottom: 20px;
width: 100%;
}
.news_wnd .all_news{
display: none;
}
/* -------- Темы с форума ------ */
.forum_block{
width: 27%;
height: 460px;
margin-top: 30px;
border-radius: 8px;
float: right;
margin-bottom: 30px;
background: rgba(51, 34, 24, 0.25);
padding: 20px;
}
.forum_them{
width: 100%;
height: 63px;
position: relative;
display: block;
margin-bottom: 16px;
float: left;
}
.forum_them_icon{
width: 63px;
height: 63px;
background: url(../images/forum_icon.png);
background-size: 100% 100%;
float: left;
transition: all 0.5s ease;
}
.forum_them_content{
width: calc( 100% - 70px - 10px);
float: right;
}
.forum_them_title{
width: 100%;
font-size: 18px;
margin-top: 8px;
position: relative;
}
.forum_them_title a{
font-size: 18px;
transition: all 0.3s ease;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
font-weight: bold;
}
.forum_them_title a:hover{
color: #fff6d3;
font-size: 18px;
}
.forum_them:hover .forum_them_icon{
transform: rotate(360deg);
}
.forum_them_desc{
width: 100%;
margin-top: 10px;
}
.forum_them_desc .author{
float: left;
color: #ffd7be;
font-size: 12px;
cursor: default;
}
.forum_them_desc .date{
float: right;
color: #ffd7be;
font-size: 12px;
cursor: default;
}
/* ---------- Статьи ----------- */
.articles{
width: 100%;
}
.article{
width: calc( 25% - 30px + 7.5px );
height: 230px;
border-radius: 8px;
float: left;
margin-right: 30px;
position: relative;
background: #000;
transition: all 0.5s ease;
overflow: hidden;
}
.article:nth-of-type(1) {
background: url(../images/article_bg1.png) #ecc0a4 top center;
background-size: 100% auto;
}
.article:nth-of-type(2) {
background: url(../images/article_bg2.png) #ecc0a4 top center;
background-size: 100% auto;
}
.article:nth-of-type(3) {
background: url(../images/article_bg3.png) #ecc0a4 top center;
background-size: 100% auto;
}
.article:nth-of-type(4) {
background: url(../images/article_bg4.png) #ecc0a4 top center;
background-size: 100% auto;
}
.article:hover{
background-size: 120% auto;
}
.article_last{
margin-right: 0px;
}
.article .flag {
padding-top: 6px;
padding-bottom: 6px;
padding-left: 10px;
padding-right: 10px;
background: #f44336;
margin-left: 20px;
border-radius: 5px;
margin-top: 20px;
max-width: 100%;
float: left;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
}
.article .article_content{
width: calc( 100% );
padding: 20px;
position: absolute;
background: rgba(198, 170, 145, 0.73);
bottom: -54px;
color: #5f3e2e;
transition: all 0.3s ease;
cursor: default;
}
.article:hover .article_content{
bottom: 0px;
}
.article .article_content .title{
color: #4a3429;
font-size: 18px;
text-transform: uppercase;
text-align: left;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
}
.article .article_content .button {
margin: 0 auto;
width: 100%;
padding-top: 8px;
padding-bottom: 8px;
text-align: center;
font-size: 18px;
color: #ecc0a4;
background: rgba(84, 18, 13, 0.13);
border-radius: 5px;
transition: all 0.3s ease;
z-index: 4;
margin-top: 20px;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
font-weight: bold;
}
.article .article_content .button:hover{
background: rgb(234, 126, 63);
letter-spacing: 1px;
box-shadow: 0 1px 3px #9e5656, 0 1px 3px #dcdcdc;
}
#l2top td:nth-of-type(1){
font-size: 28px;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
font-weight: bold;
}
#l2top td{
font-size: 14px;
padding: 10px;
font-weight: 400;
}
.menu_container span:hover {
cursor: pointer;
}
.menu_container span:hover .drop_box_info{
height: 110px;
}
.drop_box_info{
width: 200px;
height: 0px;
position: absolute;
left: 0px;
top: 78px;
background: rgba(45, 20, 9, 0.33);
overflow: hidden;
transition: all 0.3s ease;
}
.menu_container .drop_box_info .info_link:nth-of-type(1){
width: 100%;
height: auto;
padding: 20px 20px 20px 20px;
font-size: 14px;
border-bottom: 1px solid #988470;
}
.menu_container .drop_box_info .info_link{
width: 100%;
height: auto;
padding: 20px 20px 20px 20px;
font-size: 14px;
}
.menu_container .drop_box_info a:before{
display: none;
}
.menu_container .drop_box_info a:after{
display: none;
}
@media (max-width: 1200px) {
.drop_box_info{
width: 200px;
height: 0px;
position: absolute;
left: 0px;
top: 30px;
background: rgba(45, 20, 9, 0.8);
overflow: hidden;
transition: all 0.3s ease;
z-index: 4;
}
}
.server__name{
padding: 2px 5px;
background: #f44336;
border-radius: 2px;
color: #fff;
}
.server__name a{
color: #fff;
}
.server:nth-of-type(2) {
animation: l2banners_tada 3s infinite;
}
@keyframes l2banners_tada {
0% {
-webkit-transform:scale3d(1,1,1);
transform:scale3d(1,1,1)
}
25% {
-webkit-transform:scale3d(1,1,1);
transform:scale3d(1,1,1)
}
38%, 41% {
-webkit-transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);
transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)
}
44%,50%,56%,62% {
-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);
transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)
}
47%,53%,59% {
-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);
transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)
}
70% {
-webkit-transform:scale3d(1,1,1);
transform:scale3d(1,1,1)
}
}
/* --------- Контент ----------- */
/* ----------------------------- */
.content{
max-width: 1350px;
padding-left: 30px;
padding-right: 30px;
margin: 0 auto;
position: relative;
z-index: 4;
overflow: hidden;
padding-top: 30px;
}
/* ---------- Слайды ----------- */
#slider_block{
width: calc( 70% - 30px );
height: 200px;
background: rgba(51, 34, 24, 0.25);
border-radius: 8px;
overflow: hidden;
float: left;
position: relative;
}
.slide{
width: 100%;
height: 100%;
position: absolute;
left: 100%;
top: 0px;
opacity: 0;
z-index: 1;
transition: all 1s ease;
}
.showing {
opacity: 1;
z-index: 2;
left: 0px;
}
.slide:nth-of-type(1){
background: url(../images/slide_bg5.png) top right;
right: 0px;
}
.slide:nth-of-type(2){
background: url(../images/slide_bg6.png) top right;
right: 0px;
}
.slide:nth-of-type(3){
background: url(../images/slide_bg1.png) top right;
right: 0px;
}
.slide:nth-of-type(4){
background: url(../images/slide_bg2.png) top right;
right: 0px;
}
.slide:nth-of-type(5){
background: url(../images/slide_bg3.png) top right;
right: 0px;
}
.slide:nth-of-type(6){
background: url(../images/slide_bg4.png) top right;
right: 0px;
}
.slide a{
display: block;
width: 100%;
height: 100%;
padding-top: 35px;
}
.controls{
font-size: 28px;
border: none;
background: none;
color: #ffdb5e;
margin: 5px;
cursor: pointer;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
}
.controls:focus{
background: none;
color: none;
}
.controls:hover{
background: none;
color: #f6ff00;
}
.container{
position: relative;
}
.slider_buttons{
position: absolute;
left: calc( 50% - 51px );
bottom: 10px;
z-index: 10;
font-size: 0px;
display: none;
}
.slide .flag{
padding-top: 8px;
padding-bottom: 8px;
background: #f44336;
width: 140px;
text-align: center;
margin-left: 30px;
border-radius: 5px;
}
.slide .slide_title{
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
margin-left: 30px;
color: #ffdb5e;
font-size: 28px;
margin-top: 5px;
}
.slide .desc{
margin-left: 30px;
color: #fff;
font-size: 18px;
margin-top: 5px;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
}
.slide .time{
margin-left: 30px;
color: #ffdb5e;
font-size: 16px;
margin-top: 5px;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
}
.slide .button{
margin: 0 auto;
width: 200px;
padding-top: 12px;
padding-bottom: 12px;
text-align: center;
font-size: 18px;
background: url(../images/news_bg.png) no-repeat;
background-size: 100% 100%;
border-radius: 5px;
transition: all 0.3s ease;
z-index: 9975;
position: absolute;
top: 84px;
right: 30px;
text-shadow: 0 1px 3px #000, 0 1px 3px #000;
color: #fffda2;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
display: none;
}
.slide .button:hover{
-webkit-filter: brightness(120%);
filter: brightness(120%);
}
/* ---------- Магазин ----------- */
.shop_block{
width: 30%;
height: 200px;
background: url(../images/shop_bg.png) center center;
background-size: 100% 100%;
border-radius: 8px;
transition: all 0.3s ease;
float: right;
overflow: hidden;
filter: brightness(100%);
}
.shop_block_a{
width: 100%;
height: 100%;
display: block;
}
.shop_block:hover{
background-size: 110% 110%;
filter: brightness(110%);
}
.shop_block:hover .shop_unit{
filter: brightness(130%);
transform: scale(-1.1,1.1);
}
.shop_block .shop_title1{
margin: 0 auto;
width: 100%;
text-align: center;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
text-shadow: 0 12px 20px #9e5656, 0 2px 3px #000;
font-size: 30px;
color: #fff4cf;
margin-top: 40px;
z-index: 9975;
cursor: default;
pointer-events: none;
}
.shop_block .shop_title2{
margin: 0 auto;
width: 100%;
text-align: center;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
text-shadow: 0 12px 20px #9e5656, 0 2px 3px #000;
font-size: 40px;
color: #fff4cf;
margin-top: -5px;
z-index: 9975;
cursor: default;
pointer-events: none;
}
.shop_block .button{
margin: 0 auto;
width: 200px;
padding-top: 12px;
padding-bottom: 12px;
text-align: center;
font-size: 18px;
background: url(../images/shop_button.png) no-repeat;
background-size: 100% 100%;
border-radius: 5px;
margin-left: 15px;
margin-top: 15px;
transition: all 0.3s ease;
z-index: 9975;
position: relative;
text-shadow: 0 1px 3px #000, 0 1px 3px #000;
color: #fff;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
}
a{
text-decoration: none;
text-transform: none;
}
.shop_block .button:hover{
-webkit-filter: brightness(120%);
filter: brightness(120%);
}
.shop_unit{
width: 200px;
height: 200px;
background: url(../images/unit_1.png);
background-size: 100% 100%;
margin-top: -180px;
transform: scale(-1,1);
left: calc( 100% - 166px );
position: relative;
z-index: 9974;
display: block;
filter: brightness(100%);
transition: all 0.5s ease;
}
/* ---------- Новости ----------- */
.news_block{
width: calc( 70% - 30px );
margin-top: 30px;
height: 530px;
border-radius: 8px;
overflow: hidden;
float: left;
position: relative;
}
.news:nth-of-type(1){
width: calc( 60% - 30px );
background: url(../images/full_news_bg.png) #dabba0 center center;
background-size: 110% 100%;
height: 500px;
border-radius: 8px;
float: left;
position: relative;
overflow: hidden;
transition: all 0.5s ease;
}
.news:nth-of-type(1):hover{
background: url(../images/full_news_bg.png) #dabba0 center center;
background-size: 120% 110%;
}
.news:nth-of-type(1) .date{
margin-top: 15px;
margin-left: 15px;
font-size: 28px;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
}
.news:nth-of-type(1) .news_content{
width: calc( 100% - 60px );
margin-left: 30px;
position: absolute;
bottom: 60px;
background: none;
padding: 0px;
}
.news:nth-of-type(1) .news_content .avatar{
width: 97px;
height: 138px;
background: url(../images/news_avatar1.png);
float: left;
display: block;
}
.news:nth-of-type(1) .news_content .info{
width: calc( 100% - 100px - 20px );
float: right;
font-size: 12px;
color: #715e54;
height: 119px;
overflow: hidden;
}
.news:nth-of-type(1) .news_content .news_title{
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
color: #4a3429;
font-size: 16px;
text-transform: uppercase;
}
.news a{
color: #795548;
font-weight: bold;
}
.news:nth-of-type(1) .read_more{
cursor: pointer;
margin: 0 auto;
text-align: center;
font-size: 16px;
background-size: 100% 100%;
border-radius: 5px;
transition: all 0.3s ease;
z-index: 9975;
position: relative;
text-shadow: 0 1px 3px #cc9898, 0 1px 3px #000;
color: #ffeadd;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
position: absolute;
top: auto;
bottom: 30px;
right: -50%;
transition: all 0.5s ease;
}
.news:nth-of-type(1) .read_more:hover{
color: #ffdb5e;
}
.news:nth-of-type(1):hover .read_more{
right: 30px;
}
.news:nth-of-type(1) .all_news{
position: absolute;
top: 35px;
right: 30px;
font-family: PT Sans Bold;
border: 1px solid #fff;
border-radius: 5px;
padding: 5px;
transition: all 0.5s ease;
display: block;
background: #fff;
color: #c76c33;
cursor: pointer;
z-index: 1;
display: none;
}
.news:nth-of-type(1) .all_news:hover{
color: #c76c33;
border: 1px solid #c76c33;
}
.news:nth-of-type(2){
background: url(../images/full_news_bg2.png) #dabba0 top center;
background-size: 100% auto;
}
.news:nth-of-type(3){
background: url(../images/full_news_bg3.png) #dabba0 top center;
background-size: 100% auto;
}
.news:nth-child(n+4){
width: calc( 50% - 15px );
height: 235px;
border-radius: 8px;
float: left;
margin-bottom: 30px;
position: relative;
overflow: hidden;
transition: all 0.5s ease;
background: url(../images/full_news_bg3.png) #dabba0 top center;
background-size: 100% auto;
}
.news:nth-child(n+4):nth-child(even){
margin-right: 30px;
}
.all_news_button{
width: 37%;
background: rgba(51, 34, 24, 0.25);
padding: 12px;
float: right;
position: absolute;
right: 0px;
bottom: 30px;
text-align: center;
cursor: pointer;
border-radius: 8px;
transition: all 0.5s ease;
}
.all_news_button:hover{
background: #dabba0;
color: #000;
}
.news{
width: 40%;
height: 200px;
background: #dabba0;
border-radius: 8px;
float: right;
margin-bottom: 30px;
position: relative;
overflow: hidden;
transition: all 0.5s ease;
position: relative;
}
.news:hover{
background-size: 110% auto;
}
.news .date{
margin-top: 15px;
margin-left: 15px;
font-size: 16px;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
z-index: 4;
}
.news .news_content{
width: calc( 100% );
padding: 15px;
position: absolute;
bottom: 0px;
background: #c6aa91;
}
.news .news_content .avatar{
width: 97px;
height: 138px;
background: url(../images/news_avatar1.png);
float: left;
display: none;
}
.news .news_content .info{
width: calc( 100% );
float: right;
font-size: 12px;
color: #715e54;
line-height: 1.4;
height: 87px;
overflow: hidden;
}
.news .news_content .news_title{
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
color: #4a3429;
font-size: 14px;
text-transform: uppercase;
margin-top: 0px;
}
.news .read_more{
position: absolute;
top: 15px;
right: -100%;
font-family: PT Sans Bold;
transition: all 0.5s ease;
cursor: pointer;
z-index: 1;
}
.news .read_more:hover{
color: #ffdb5e;
}
.news:hover .read_more{
right: 15px;
}
.news .all_news{
position: absolute;
top: 35px;
right: 30px;
font-family: PT Sans Bold;
border: 1px solid #fff;
border-radius: 5px;
padding: 5px;
transition: all 0.5s ease;
display: none;
}
.news .all_news:hover{
color: #ffdb5e;
border: 1px solid #ffdb5e;
}
.news_wnd .news_images{
display: none;
}
.news_wnd .date{
font-size: 28px;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
float: left;
width: 30%;
text-align: left;
margin-bottom: 20px;
position: absolute;
}
.news_wnd .news_title{
width: 100%;
font-size: 28px;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
float: left;
margin-bottom: 20px;
color: #ffe28d;
}
.news_wnd .info{
width: 100%;
font-size: 16px;
color: #5f4238;
float: left;
margin-bottom: 20px;
width: 100%;
}
.news_wnd .all_news{
display: none;
}
/* -------- Темы с форума ------ */
.forum_block{
width: 27%;
height: 460px;
margin-top: 30px;
border-radius: 8px;
float: right;
margin-bottom: 30px;
background: rgba(51, 34, 24, 0.25);
padding: 20px;
}
.forum_them{
width: 100%;
height: 63px;
position: relative;
display: block;
margin-bottom: 16px;
float: left;
}
.forum_them_icon{
width: 63px;
height: 63px;
background: url(../images/forum_icon.png);
background-size: 100% 100%;
float: left;
transition: all 0.5s ease;
}
.forum_them_content{
width: calc( 100% - 70px - 10px);
float: right;
}
.forum_them_title{
width: 100%;
font-size: 18px;
margin-top: 8px;
position: relative;
}
.forum_them_title a{
font-size: 18px;
transition: all 0.3s ease;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
font-weight: bold;
}
.forum_them_title a:hover{
color: #fff6d3;
font-size: 18px;
}
.forum_them:hover .forum_them_icon{
transform: rotate(360deg);
}
.forum_them_desc{
width: 100%;
margin-top: 10px;
}
.forum_them_desc .author{
float: left;
color: #ffd7be;
font-size: 12px;
cursor: default;
}
.forum_them_desc .date{
float: right;
color: #ffd7be;
font-size: 12px;
cursor: default;
}
/* ---------- Статьи ----------- */
.articles{
width: 100%;
}
.article{
width: calc( 25% - 30px + 7.5px );
height: 230px;
border-radius: 8px;
float: left;
margin-right: 30px;
position: relative;
background: #000;
transition: all 0.5s ease;
overflow: hidden;
}
.article:nth-of-type(1) {
background: url(../images/article_bg1.png) #ecc0a4 top center;
background-size: 100% auto;
}
.article:nth-of-type(2) {
background: url(../images/article_bg2.png) #ecc0a4 top center;
background-size: 100% auto;
}
.article:nth-of-type(3) {
background: url(../images/article_bg3.png) #ecc0a4 top center;
background-size: 100% auto;
}
.article:nth-of-type(4) {
background: url(../images/article_bg4.png) #ecc0a4 top center;
background-size: 100% auto;
}
.article:hover{
background-size: 120% auto;
}
.article_last{
margin-right: 0px;
}
.article .flag {
padding-top: 6px;
padding-bottom: 6px;
padding-left: 10px;
padding-right: 10px;
background: #f44336;
margin-left: 20px;
border-radius: 5px;
margin-top: 20px;
max-width: 100%;
float: left;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
}
.article .article_content{
width: calc( 100% );
padding: 20px;
position: absolute;
background: rgba(198, 170, 145, 0.73);
bottom: -54px;
color: #5f3e2e;
transition: all 0.3s ease;
cursor: default;
}
.article:hover .article_content{
bottom: 0px;
}
.article .article_content .title{
color: #4a3429;
font-size: 18px;
text-transform: uppercase;
text-align: left;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
font-weight: bold;
}
.article .article_content .button {
margin: 0 auto;
width: 100%;
padding-top: 8px;
padding-bottom: 8px;
text-align: center;
font-size: 18px;
color: #ecc0a4;
background: rgba(84, 18, 13, 0.13);
border-radius: 5px;
transition: all 0.3s ease;
z-index: 4;
margin-top: 20px;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
font-weight: bold;
}
.article .article_content .button:hover{
background: rgb(234, 126, 63);
letter-spacing: 1px;
box-shadow: 0 1px 3px #9e5656, 0 1px 3px #dcdcdc;
}
#l2top td:nth-of-type(1){
font-size: 28px;
font-family: 'Mason Chronicles', 'Times New Roman', Times, serif;
text-shadow: 0 1px 3px #9e5656, 0 1px 3px #000;
font-weight: bold;
}
#l2top td{
font-size: 14px;
padding: 10px;
font-weight: 400;
}
.menu_container span:hover {
cursor: pointer;
}
.menu_container span:hover .drop_box_info{
height: 110px;
}
.drop_box_info{
width: 200px;
height: 0px;
position: absolute;
left: 0px;
top: 78px;
background: rgba(45, 20, 9, 0.33);
overflow: hidden;
transition: all 0.3s ease;
}
.menu_container .drop_box_info .info_link:nth-of-type(1){
width: 100%;
height: auto;
padding: 20px 20px 20px 20px;
font-size: 14px;
border-bottom: 1px solid #988470;
}
.menu_container .drop_box_info .info_link{
width: 100%;
height: auto;
padding: 20px 20px 20px 20px;
font-size: 14px;
}
.menu_container .drop_box_info a:before{
display: none;
}
.menu_container .drop_box_info a:after{
display: none;
}
@media (max-width: 1200px) {
.drop_box_info{
width: 200px;
height: 0px;
position: absolute;
left: 0px;
top: 30px;
background: rgba(45, 20, 9, 0.8);
overflow: hidden;
transition: all 0.3s ease;
z-index: 4;
}
}
.server__name{
padding: 2px 5px;
background: #f44336;
border-radius: 2px;
color: #fff;
}
.server__name a{
color: #fff;
}
.server:nth-of-type(2) {
animation: l2banners_tada 3s infinite;
}
@keyframes l2banners_tada {
0% {
-webkit-transform:scale3d(1,1,1);
transform:scale3d(1,1,1)
}
25% {
-webkit-transform:scale3d(1,1,1);
transform:scale3d(1,1,1)
}
38%, 41% {
-webkit-transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);
transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)
}
44%,50%,56%,62% {
-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);
transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)
}
47%,53%,59% {
-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);
transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)
}
70% {
-webkit-transform:scale3d(1,1,1);
transform:scale3d(1,1,1)
}
}