/* Основные */
html, body {
margin: 0;
padding: 0;
}
body {
font-family:"Exo 2", sans-serif;
font-size: 14px;
color: #000;
}
.wrapper {
width: 1600px;
margin: auto;
}
h1, h2 {
font-size: 26px;
text-transform: uppercase;
}
a {
color: #000;
text-decoration: none;
}
/* Верх */
.head {
padding: 70px 0;
border-bottom: 1px solid #fbfbfb;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.head.scroll {
margin-top:288px;
}
.head .logo {
display: inline-block;
}
.head .menu {
display: inline-block;
text-align: justify;
text-align-last: justify;
width: calc(100% - 470px);
vertical-align: top;
margin-top: 13px;
margin-left: 60px;
}
.menu .dots {
display: inline-block;
margin-right: 10%
}
.head .buttons {
display: inline-block;
float: right;
margin-top: 10px;
}
.head .buttons .menu_b {
display: inline-block;
text-decoration: underline;
background: url("/images/menu.png") no-repeat left center;
padding: 8px 0 8px 35px;
font-size: 12px;
cursor: pointer;
vertical-align: top;
}
.head .buttons .menu_b.red {
color: #fe0000;
}
.head .buttons a.lk {
display: inline-block;
text-decoration: underline;
background: url("/images/lk.png") no-repeat left center;
font-size: 12px;
margin-left: 30px;
padding: 8px 0 8px 30px;
}
/* Картинка на главной */
.banner {
width: 100%;
height: 500px;
background: url("/images/background.jpg") center center;
background-size: cover
}
.banner h1 {
padding: 0;
margin:0;
font-size: 36px;
color: #fff;
padding-top: 20px;
}
/* Крошки */
.breadcrumbs {
font-size: 12px ;
margin: 20px 0;
}
.breadcrumbs a {
color: #5679d1;
text-decoration: underline
}
/* Пример */
.primer {
font-size: 0;
text-align: justify;
text-align-last: justify;
}
.primer .player {
margin-bottom: 30px;
}
.primer .left, .primer .middle, .primer .right {
display: inline-block;
vertical-align: top;
font-size: 14px;
text-align: left;
text-align-last: left;
margin: 0px 0;
line-height: 20px;
}
.primer .left {
font-size: 18px;
width: 95%;
font-family: Calibri Light, "Exo 2", sans-serif;
color: #000;
background: #fefefe;
padding-left: 20px;
border-radius: 5px;
line-height: 20px;
}
.primer .middle {
width: 95%;
color: #000;
font-weight: 400
}
.primer .right {
width: 95%;
color: #5679d1
}
.primer .banner_girl {
background: url("/images/girl.jpg") bottom right;
background-size: cover;
height: 430px;
width: calc(100% - 40px);
padding: 20px;
font-size: 16px;
text-transform: uppercase;
font-weight: bold;
position: relative
}
.primer .banner_girl .text {
position: absolute;
left: 20px;
bottom: 20px;
}
.primer .tezis {
color: #5679d1;
font-size: 30px;
text-transform: uppercase;
font-weight: bold;
text-align: center;
text-align-last: center;
line-height: 30px;
}
.primer .blueline {
padding: 20px 0;
color: #fff;
border-bottom: 3px solid #00247d;
background: #5679d1;
}
.primer .blueline .podpis {
color: #fff;
font-size: 18px;
display: inline-block;
text-align: left;
text-align-last: left;
}
.primer .blueline .podpis .arrow {
background: #5679d1;
width: 30px;
height: 30px;
position: absolute;
margin-top: -30px;
margin-left: -15px;
transform: rotate(45deg)
}
/* Таблицы */
table {
width: 100%!important;
border-collapse: collapse;
}
table tr td {
padding: 10px;
border: 1px dashed #efefef
}
/* Аудио */
.player {
}
.player audio {
width: 100%;
border-radius: 0px
}
/* Колонки */
.colonki {
}
.colonki .colonka {
font-size: 18px;
width: calc(100% - 40px);
font-family: Calibri Light, "Exo 2", sans-serif;
color: #000;
line-height: 20px;
padding: 0 20px;
display: inline-block;
vertical-align: top;
white-space: normal;
}
/* Статьи на главной */
.stati {
padding: 100px 0 40px 0;
}
.stati ul.info {
padding: 0;
margin: 0;
list-style: none;
text-align: justify;
text-align-last: justify
}
.stati ul.info li {
display: inline-block;
width: 28%;
text-align: left;
text-align-last: left;
vertical-align: top;
margin-bottom: 60px;
}
.stati ul.info li .image {
float: left;
height: 250px;
margin-right: 30px;
width: 65px;
text-align:center;
text-align-last: center
}
.stati ul.info li h2 {
font-size: 16px;
margin-top: 30px;
}
.stati ul.info li .text {
font-size: 12px;
color: #6f6f6f;
display: inline-block;
width: calc(100% - 95px)
}
.stati ul.info li a.readmore {
padding: 5px 10px;
color: #fff;
font-size: 12px;
font-weight: 400;
margin-top: 20px;
display: inline-block;
background: #5679d1;
margin-left: -10px;
}
/* Контент */
.blog, .item-page {
min-height: 350px;
}
.items-leading {
margin-bottom: 100px
}
.items-leading {
font-size: 0;
}
.items-leading article {
font-size: 14px;
color: #464646;
width: calc(25% - 41px);
display: inline-block;
padding: 0 20px;
vertical-align: top;
border-right: 1px solid #ededed;
border-bottom: 1px solid #ededed;
}
.items-leading article:nth-of-type(4n) {
border-right: none;
}
.items-leading .text {
font-size: 13px;
min-height: 120px;
}
.items-leading article:hover {
border-bottom-color: #fe0000
}
.items-leading .img-intro {
display: block;
width: 100%;
margin-bottom: 20px;
height: 150px;
position: relative
}
.items-leading .img-intro img {
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%) ;
max-height: 100%;
max-width: 100%;
}
.items-leading h2 a, .items-leading h2 {
font-size: 14px;
height: 50px;
}
.items-leading .readmore a {
background: #a8bae6;
padding: 5px 10px;
color: #fff;
font-size: 12px;
}
.items-leading .item-separator {
clear: both
}
.pagination {
}
.pagination ul {
list-style: none;
padding: 0;
margin: 0;
margin-bottom: 30px;
}
.pagination ul li {
display: inline-block;
vertical-align: top
}
.pagination ul li .pagenav {
margin-right: 10px;
padding: 5px 10px;
background: #fbfbfb;
}
.pagination ul li a.pagenav {
padding: 5px 10px;
background: #5679d1;
color: #fff
}
.pagination .counter {
font-size: 12px;
color: #717171
}
.tooltip {
display: none!important;
}
/* Главное меню */
.mainmenu {
padding: 30px 0;
background: #fbfbfb;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
top: -400px;
position: absolute;
width: 100%;
box-shadow: 0px 0px 10px 0 rgba(0,0,0,0.4);
}
.mainmenu.show {
top:0
}
.mainmenu ul {
list-style: none;
margin: 0;
padding: 0;
font-size: 0;
}
.mainmenu ul li {
display: inline-block;
vertical-align: top;
width: 25%;
line-height: 20px
}
.mainmenu ul li a {
font-size: 14px;
color: #5679d1;
}
.mainmenu .zagolovok {
font-weight: 600;
margin-bottom: 10px;
color: #00247d
}
.mainmenu .grphs {
margin-bottom: 10px;
}
.mainmenu .grphs a:hover {
color: #FE0000
}
/* Подвал */
.footer {
background: #fbfbfb;
padding: 40px 0;
font-size: 0
}
.footer .column {
display: inline-block;
width: 25%;
vertical-align: top;
font-size: 14px;
}
.footer .column:nth-of-type(3) {
width:35%;
}
.footer .column:nth-of-type(4) {
width: 15%;
}
.footer .column .zagolovok {
color: #000;
font-size: 16px;
font-weight: bold;
}
.footer .column .oplata {
font-size: 12px;
margin: 15px 0;
color: #000
}
.footer .column .oplata_ico img {
margin-bottom: 20px;
margin-right: 10px;
}
.footer .column .social {
margin-bottom: 15px;
color: #000;
font-size: 12px;
}
.footer .column .social_ico img {
margin-bottom: 20px;
margin-right: 10px;
}
.footer .line {
widows: 100%;
height: 1px;
background: #d6d6d6;
margin: 30px 0;
}
.footer .left {
float: left;
display: inline-block;
width: 25%;
vertical-align: top;
font-size: 12px;
color: #878787;
}
.footer .right {
display: inline-block;
vertical-align: top;
font-size: 12px;
color: #878787;
width: 74%
}
.footer ul.menu {
list-style: none;
padding: 0;
margin: 20px 0 0 0 ;
}
.footer ul.menu li {
line-height: 24px;
}
.footer ul.menu li a {
color: #363636;
font-size: 14px;
}
/* Копирайты */
.copyright {
padding: 40px 0;
font-size: 12px;
color: #878787;
}
.copyright .copy {
display: inline-block
}
.copyright .merbal {
text-align: right;
float: right;
display: inline-block
}
@media screen and (max-width: 1650px) {
.wrapper {
width: 1400px
}
}
@media screen and (max-width: 1450px) {
.wrapper {
width: 1200px
}
.primer .left, .primer .middle, .primer .right {
font-size: 12px;
text-align: left;
}
.primer .left {
font-size: 18px
}
}
@media screen and (max-width: 1250px) {
.wrapper {
width: 1000px
}
.primer .tezis {
font-size: 22px;
}
.stati ul.info li {
display: inline-block;
width: 31%;
text-align: left;
text-align-last: left;
vertical-align: top;
margin-bottom: 60px;
}
}
@media screen and (max-width: 600px) {
.wrapper {
width: calc(100% - 20px);
padding: 0 10px;
}
/* Верх */
.head {
padding: 30px 0;
}
.head.scroll {
margin-top:450px;
}
.head .logo {
display: inline-block;
}
.head .logo img {
width: 100px;
}
.head .menu {
display: none;
}
.menu .dots {
display: none;
}
.head .buttons {
margin-top: 0px;
}
.head .buttons .menu_b {
display: inline-block;
text-decoration: underline;
background: url("/images/menu.png") no-repeat left center;
padding: 5px 0 5px 35px;
font-size: 0;
height: 20px;
}
.head .buttons .menu_b.red {
color: #fe0000;
}
.head .buttons a.lk {
font-size: 0;
padding: 10px;
margin-left: 15px;
}
.primer .left, .primer .middle, .primer .right {
width: 90%;
padding: 0 5%;
}
/* Статьи на главной */
.stati {
padding: 30px 0 40px 0;
}
.stati ul.info li {
display: block;
width: 100%;
margin-bottom: 30px;
}
/* Подвал */
.footer .column {
display: block;
width: 100%;
text-align: center;
margin-bottom: 40px;
}
.footer .column:nth-of-type(3) {
width:100%;
}
.footer .column:nth-of-type(4) {
width: 100%;
}
.footer .left {
float: none;
display: block;
width: 100%;
text-align: center;
margin-bottom: 20px;
font-size: 10px;
}
.footer .right {
display: block;
vertical-align: top;
font-size: 10px;
text-align: center;
width: 100%
}
.footer ul.menu {
list-style: none;
padding: 0;
margin: 20px 0 0 0 ;
}
.footer ul.menu li {
line-height: 24px;
}
.footer ul.menu li a {
color: #363636;
font-size: 14px;
}
/* Копирайты */
.copyright .copy {
display: block;
text-align: center;
}
.copyright .merbal {
text-align: center;
float: none;
display: block
}
/* Главное меню */
.mainmenu {
padding: 30px 0;
background: #fbfbfb;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
top: -600px;
position: absolute;
width: 100%;
box-shadow: 0px 0px 10px 0 rgba(0,0,0,0.4);
}
.mainmenu.show {
top:0
}
.mainmenu ul {
list-style: none;
margin: 0;
padding: 0;
font-size: 0;
}
.mainmenu ul li {
display: inline-block;
vertical-align: top;
width: 50%;
line-height: 20px
}
.mainmenu ul li a {
font-size: 14px;
color: #5679d1;
}
.mainmenu .zagolovok {
font-weight: 600;
margin-bottom: 10px;
color: #00247d
}
.mainmenu .grphs {
margin-bottom: 10px;
}
.mainmenu .grphs a:hover {
color: #FE0000
}
.primer .blueline {
margin-top: 60px;
}
/* Контент */
.items-leading {
margin-bottom: 100px
}
.items-leading article {
font-size: 14px;
color: #464646;
width: calc(100% - 41px);
display: inline-block;
padding: 0 20px;
vertical-align: top;
border-right: none;
border-bottom: 1px solid #ededed;
}
.items-leading article:last-of-type {
border-bottom: none;
}
.items-leading .text {
font-size: 13px;
min-height: 120px;
}
.items-leading article:hover {
border-bottom-color: #fe0000
}
.items-leading .img-intro {
display: block;
width: 100%;
margin-bottom: 20px;
height: 150px;
position: relative
}
.items-leading .img-intro img {
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%) ;
max-height: 100%;
max-width: 100%;
}
.items-leading h2 a, .items-leading h2 {
font-size: 14px;
height: 50px;
}
.items-leading .readmore a {
background: #a8bae6;
padding: 5px 10px;
color: #fff;
font-size: 12px;
}
.items-leading .item-separator {
clear: both
}
}