﻿* {margin: 0;padding: 0;}
@font-face {font-family: top_font; src: url('a_DomInoRevObl.ttf'); }
@font-face {font-family: menu_font; src: url('a_RubricaXtCn.ttf'); }
html {background-image:url('bg.jpg'); background-attachment:fixed; background-repeat:no-repeat; background-size:cover;}

/* Header
-----------------------------------------------------------------------------*/
.header {height:70px;box-shadow: 0px 15px 20px #700000;	margin-bottom:20px; background-color:rgba(250,250,250,0.85)}
#topic {min-width: 300px;max-width: 1200px;margin: 0 auto;}
#topic img {width:22px; float:left; margin-right:10px}
#t-title {color:#aa0000; font-size:40px; font-weight:bold; line-height:44px; font-family:top_font}
#t-title a {color:#aa0000; text-decoration:none}
#t-last {color:#666; font-size:14px; line-height:20px; font-weight:bold; font-family:Arial, sans-serif;}
#left-topic {width:350px; float:left}
#top-menu {text-align:right;  font-size:26px; line-height:70px; font-family:menu_font;}
#top-menu a {color:#666; text-decoration:none; padding:0 8px; display:inline-block; transition: color 0.5s linear;transition: background-color 0.5s linear; border-right:1px #700000 dotted;}
#top-menu a:last-child {border:none}
#top-menu a:hover {color:#ffffff; background-color:#aa0000; transition: color 0.5s linear;transition: background-color 0.5s linear;}

/* Right Sidebar
-----------------------------------------------------------------------------*/
.right-sidebar {float:left;	width:250px;margin-left:-250px; position: relative; margin-top:200px}
.right-box {border:1px #700000 solid; border-radius:20px; padding:10px; box-shadow:1px 6px 4px #700000; margin-bottom:19px; margin-right:10px}
.r-dzen {text-align:center; font-family:Arial, sans-serif; font-size:15px; height:40px;}
.r-dzen a {text-decoration:none; color:black;}
.r-dzen img{float:left; padding-right:10px; padding-left:5px;}

.r-link a{display:block; color:#444444; font-family:Arial, Helvetica, sans-serif; font-size:15px; font-weight:bold; text-decoration:none; padding:3px 3px 8px 3px}
.r-link a:hover {color:white; background:#700000;}
.r-h {text-align:center; font-family:top_font; font-size:26px; color:#990000}
/* Footer
-----------------------------------------------------------------------------*/
.footer {height: 100px; border-top:1px red solid; margin-top:10px; padding-top:10px; font-family:Arial, Helvetica, sans-serif; font-size:14px}
.footer a {color:red}
.footer-block {width:33%; float:left; text-align:center;}
.footer-block:last-child {text-align:right}


/* Middle
-----------------------------------------------------------------------------*/
.wrapper {min-width: 300px; max-width: 1200px; margin: 0 auto;}
.middle {width: 100%; position: relative;}
.middle:after {display: table;clear: both; content: '';}
.container {width: 100%; float: left; overflow: hidden; background-color:rgba(250,250,250,0.85); margin-top:180px;border-radius:20px;box-shadow:1px 1px 7px 3px #900000;}
.content {padding: 5px 270px 5px 10px; font-family: Arial, Helvetica, sans-serif; }

/* Content style
-----------------------------------------------------------------------------*/
.content p {text-indent:20px;font-size:17px; line-height:26px; margin-top:12px;text-align: justify;}
.content a {color:red}
.content a:hover {text-decoration:none; color:#CC0000}
h1 {font-family:top_font; color:#700000; text-align:center; font-size:40px;}
h2 {font-family:top_font; color:#fff; font-size:27px; font-weight:bold; text-align:center; margin-top:15px; text-shadow:4px 4px 6px #600000, -4px -4px 5px #900000;}
h3 {font-family:Arial, Helvetica, sans-serif; color:#454545; font-size:23px; font-weight:bold; text-align:center; margin-top:15px;}
h4 {font-family:Arial, Helvetica, sans-serif; font-size:17px; border-bottom:1px red dotted; margin-top:10px;}
h5 {font-family:Arial, Helvetica, sans-serif; font-weight:normal; font-size:15px; border-top:1px red dotted; margin-left:35%; padding:5px}
h6 {font-family:Arial, Helvetica, sans-serif; font-size:15px; border-bottom:1px black dotted; margin-top:10px; color:red; margin-right:30%}

.flexing {display:flex; justify-content:center; margin-top:10px; font-family:menu_font; color:#700000; font-size:23px}
.flexing div {width:350px;height:500px; text-align:center;}
.flexing div img {width:200px;height:450px; border-radius:15px; box-shadow:4px 4px 6px -2px #700000;}




.article {font-family:Arial, Helvetica, sans-serif; font-weight:normal; border:1px #d5d6db solid; border-radius:20px; padding:10px; margin:10px 20px; box-shadow:0 8px 0 #d2d5e4; background:#eeeeee}
.article:before {content: '! '; color:red; font-family:top_font; font-size:40px; float:left}

.links {margin:10px 20px; border-left:1px red dotted;}
.links a {display:block; font-family:Arial, Helvetica, sans-serif; font-size:15px; color:red; font-weight:bold; padding:5px 5px 5px 10px; text-decoration:none;transition: color 0.2s linear;transition: background-color 0.2s linear;}
.links a:hover {background:red; color:white;transition: color 0.2s linear;transition: background-color 0.2s linear;}
.links h6 {color:black; margin-left:20px; padding-left:10px}

hr {width:60%; color:red; background:red; border:1px red solid; margin:10px auto;}

.top-img {text-align:center}
.top-img img {width:99%; border-radius:15px; box-shadow:5px 5px 5px #bbbbbb;}

.big-img {text-align:center;}
.big-img img {width:90%; border-radius:10px; margin-top:15px;}
.big-img a {text-decoration:none;}
.big-img p, .left-img p, .right-img p, .center-img p {font-size:14px;padding-top:0; margin-top:0; font-style:italic;}

.left-img {text-align:left; float:left;margin:5px 15px 5px 0;}
.right-img {text-align:right; float:right;margin:5px 0 5px 15px;}
.center-img {text-align:center;margin:5px auto;}

.table-1 {width:100%; font-family:Arial, Helvetica, sans-serif; border:0; border-collapse:collapse;font-size:17px; line-height:26px;}
.table-1 tr:nth-child(even) {background: #eee}
.table-1 td:nth-child(odd) {text-align:center}
.table-1 td:nth-child(even) {padding-left:12px;}
.table-1 td {padding:5px}
.table-1 img {margin:5px; width:70%;}
.table-1 th {padding:6px; border:3px white solid; background:#e3e3e3}
.table-1 p{text-indent:0px!important}

.table-2 {width:100%; font-family:Arial, Helvetica, sans-serif; font-size:17px; line-height:26px; border:1px gray solid}
.table-2 tr:nth-child(even) {background: #eee}
.table-2 td {padding:5px; border:1px black dotted}
.table-2 th {padding:6px; border:2px white solid; background:#e3e3e3}
.table-2 p{text-indent:0px!important}

/*///////////////////// CATALOG */

.catalog {text-align:center;}

.position {display: inline-block; margin:10px; border:1px #ffffff solid; }
.position img {width:100%;}
.position a {color:#ff1010; font-size:16px; text-decoration:none; line-height:20px}
.position:hover {border:1px #ff2020 solid; opacity:0.8;}



/*////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////*/
/* стили под маленькие мониторы */
@media only screen and (max-width: 1080px) and (min-width: 900px){
.header {height:60px;}
#topic img {width:19px;}
#t-title {color:red; font-size:35px;line-height:38px;}
#t-last {font-size:13px; line-height:18px;}
#left-topic {width:290px;}
#top-menu {font-size:22px; line-height:60px;}
}

/*////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////*/
/* стили под планшеты с альбомной ориентации */
@media only screen and (max-width: 899px) and (min-width: 700px){
.header {height:120px;}
#topic img {width:19px;}
#t-title {color:red; font-size:35px;line-height:38px; text-align:center}
#t-last {font-size:13px; line-height:18px; text-align:center}
#left-topic {width:100%;}
#top-menu {font-size:22px; line-height:60px; position:relative; text-align:center}
}

/*////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////*/
/* стили под планшеты книжной ориентации и телефоны */
@media only screen and (max-width: 699px) and (min-width: 299px){

.header {height: auto;}
#topic img {width:19px;}
#t-title {color:red; font-size:35px;line-height:38px; text-align:center}
#t-last {font-size:13px; line-height:18px; text-align:center}
#left-topic {width:100%; border-bottom:1px red dotted; position:relative; z-index:100; background:white}
#top-menu {font-size:22px; line-height:60px; text-align:center; width:100%;}
#top-menu a {font-size:22px; line-height:60px; text-align:center; display:block;}
/* Middle block mobile liner*/
.container {width: 100%; float: none;}
.content {padding: 5px 10px 5px 10px;}
.right-sidebar {float:none;	width:100%;margin-left:0px; position: relative;}
/* Footer*/
.footer {height:auto;}
.footer-block {width:100%; float:none; text-align:center; padding:5px 0}
.footer-block:last-child {text-align:center}

}