/*
Theme Name: TopBase Landing
Theme URI: http://alex12060.ru/
Author: alex12060
Author URI: http://alex12060.ru/
Description: Theme for TopBase site
Version: 1.0
*/  

/* StyleSheet */

html,body {
	color: #fff;
	font: 13px/20px  Arial,Tahoma,Helvetica,sans-serif;
	color: #333;
}

body > html {
	min-width: 100%;
}

a {
	color: #1A6CC4;
}

textarea {
	overflow: hidden
}

a:visited, a:hover {
	color: #0B5CB3;
	text-decoration: underline;
}

p {
	margin-bottom: 10px;
    margin-top: 10px;
}

h1,h2,h3,h4,h5 {
	font-weight: bold;
	margin: 10px 0;
	line-height: 30px;
}

h1 {
	font-size: 40px;
}

h2 {
	font-size: 20px;
}

h3 {
	font-size: 20px;
}

h4,h5,h6 {
	font-size: 20px;
}

strong {
	 
	font-weight: bold;
}

.show {
	display: block;
}

.hide {
	display: none;
}

.big {
	font-size: 40px !important;
}

.medium {
	font-size: 22px !important;
}

.uppercase {
	text-transform: uppercase;
}

.clear {
	clear: both;
}

.fLeft {
	float: left;
}

.current_menu_item {
	color: #CFD60B;
}

.shadow {
	-webkit-box-shadow: 7px 7px 10px rgba(50, 50, 50, 0.6);
	  -moz-box-shadow:  7px 7px 10px rgba(50, 50, 50, 0.6);
	     box-shadow:    7px 7px 10px rgba(50, 50, 50, 0.6);
	     behavior: url('css/css3.htc');
}

.shadow-big {
	-webkit-box-shadow: 11px 11px 20px rgba(50, 50, 50, 0.75);
	 -moz-box-shadow:   11px 11px 20px rgba(50, 50, 50, 0.75);
	  box-shadow:       11px 11px 20px rgba(50, 50, 50, 0.75);
	  behavior: url('css/css3.htc');
}

.b-radius-5 {
	-webkit-border-radius: 5px;
	 -moz-border-radius:   5px;
	  border-radius:       5px;
	  behavior: url('border-radius.htc');
}

.b-radius-20 {
	-webkit-border-radius: 20px;
	 -moz-border-radius:   20px;
	  border-radius:       20px;
	  behavior: url('css/border-radius.htc');
}

.button {
	color: #fff;
	font-size: 20px;
	padding: 10px 15px;
	text-shadow: 0px -1px 2px rgba(30, 85, 85, 0.7);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	background: rgb(66, 193, 54);
	background: -moz-linear-gradient(90deg, rgb(66, 193, 54) 30%, rgb(66, 193, 54) 54%);
	background: -webkit-linear-gradient(90deg, rgb(66, 193, 54) 30%, rgb(66, 193, 54) 54%);
	background: -o-linear-gradient(90deg, rgb(66, 193, 54) 30%, rgb(66, 193, 54) 54%);
	background: -ms-linear-gradient(90deg, rgb(66, 193, 54) 30%, rgb(66, 193, 54) 54%);
	background: linear-gradient(0deg, rgb(66, 193, 54) 30%, rgb(66, 193, 54) 54%);
	-webkit-box-shadow: 1px 2px 2px rgba(50, 50, 50, 0.75);
	-moz-box-shadow:    1px 2px 2px rgba(50, 50, 50, 0.75);
	box-shadow:         1px 2px 2px rgba(50, 50, 50, 0.75);
	behavior: url('css/border-radius.htc');
}

.button:hover, .button:visited {
	color: #f3f3f3;
}

.pink {
	color: #ff6666;font-size: 40px;


}

.t-center {
	text-align:center;
}

.center {
	display: block;
       margin: 5px auto 5px auto;
}

.nav {
	width: 100%;
	background-color: #333;
	/*vertical-align: middle;
	z-index: 1;*/
	height: 40px;
	
}

.nav ul {
	width: 100%;
	margin: 0px auto;
	line-height: 1.4;
	list-style-type: none;
	text-align: center;
}

.nav ul li {
    border: 0 none;
    display: inline-block;
    height: 20px;
    list-style: none outside none;
    margin-top: 8px;
    width: 130px;
}

.nav ul ul {
	background-color: #333333;
    border: 0 none;
    display: none;
    left: 0;
    list-style-type: disc !important;
    position: absolute;
    top: 20px;
    vertical-align: middle;
    width: 230px;
}

.nav ul ul:after {
    clear: both;
    display: block;
    font: 1px/0px serif;
    content: ".";
    height: 0;
    visibility: hidden;
    list-style-type: disc;
}


.nav ul ul li {
    width: 205px;
    padding-left: 10px;
    float: left;
    cursor: pointer;
}


.nav ul li a {
display:inline-block;
	color: #ffffff;
	text-decoration: underline;
}

.nav ul li a:hover,
.nav ul li:hover a  {
	color: #e6e6e6;
}

.nav ul ul li:hover li a {
    float: none;
    color: #b0b0b0;
}

.nav ul li:hover li a:hover,
.nav ul li:hover li:hover a {
    color:#e6e6e6;
}

.nav ul ul ul {
    display: none;
    position: absolute;
    top: 0;
    left: 170px;
}

.nav ul li:hover ul ul,
.nav ul li.iehover ul ul {
        display: none;
}

.nav ul li:hover ul,
.nav ul ul li:hover ul,
.nav ul li.iehover ul,
.nav ul ul li.iehover ul {
        display: block;
} 

#wrapper {
	width: 100%;
	margin: 0px;
	padding: 0px;
}

#container {
	width: 980px;
	margin: 0 auto;
	min-height: 700px;
}

#top-info {
	width: 100%;
	height: 40px;
}

#top-slogan {
	width: 45%;
	height: 100%;
	border: 1px solid rgb(243, 135, 111);
	background-color: rgb(239, 91, 58);
	margin-top: -2px;
	margin-left: -10px;
}

#top-slogan p {
	font-family: "Arial Regular",Arial;
	text-align: center;
	margin-top: 10px;
	color: rgb(255, 255, 255);
	vertical-align: middle;
	letter-spacing: -1px;
	font-size: 20px;
}

#top-contacts {
	width: 55%;
	height: 40px;
	vertical-align: middle;
}

#top-contacts span {
	margin-top: 15px;
	position: relative;
	top: 85%;
	right: 55%;
}

#top-contacts ul {
	width: 100%;
	float: left;
	list-style-type: none;
	margin-left: 15px;
}

#top-contacts ul li {
	display: inline-block;
    height: 30px;
    line-height: 30px;
    vertical-align: middle;
    width: 170px;
}

#slogan {
	width: 530px;
	font-family: "Arial Regular",Arial;
	border: 1px solid rgb(243, 135, 111);
	background-color: rgb(239, 91, 58);
	position: relative;
	left: 45%;
	color: #fff;
	font-weight: bold;
	/*top: -120px;*/
	padding-left: 10px;

	position: absolute;
	bottom: 60px;
}

#slogan h2 {
	font-size: 20px;
	line-height: 25px;
	margin: 5px 0px;
}

.img small {
	width: 100%;
	text-align: center;
	font-size: 12px;
}

#top-contacts ul li p {

}

#content {
	width: 100%;
}

.site {}

#content p {
	font-size: 15px;
}

#content div {}

.in-eyes {
	display: block;
	margin-bottom: 10px;
	position: relative;
	top: 50px;
}

.img {
	margin: 90px 0 50px 0;
}

#box {
	border: 7px #e5e5e5 solid;
	padding: 15px;
}

#box .caption {
	background-color: #3EBA16;
    color: #FFFFFF;
    font-size: 18px;
    font-weight: bold;
    left: 75px;
    padding: 10px;
    position: relative;
    top: -40px;
    width: 80%;
}

#q-box {
	background: url(images/q-area_1.png) #fff no-repeat left center;
	width: 100%;
	margin: 50px 0 0 7%;
	height: 210px;
}

#q-box p {
	float: left;
    font-size: 22px;
    font-weight: bold;
    height: 100px;
    left: 35px;
    line-height: 30px;
    position: relative;
    text-align: center;
    top: 70px;
    width: 320px;
}

#q-box span {
	display: block;
    float: left;
    margin-top: 35px;
    width: 550px;
}

#q-box span ul {
	list-style-type: disc;
	margin-left: 125px;
}

#q-box span ul li {
	font-size: 18px;
    font-weight: bold;
    line-height: 20px;
    padding: 5px;
    vertical-align: top;
}

#complect {
	border: 7px #33cc00 solid;
	padding: 15px;
	margin-top: 70px;
}

#complect .slogan {
	background-color: #FFF;
	color: #000;
    display: block;
    font-family: Arial;
    font-size: 22px;
    font-style: italic;
    font-weight: bold;
    padding: 7px;
    position: relative;
    top: -40px;
    width: 35%;
}

#complect p strong {
	text-transform: uppercase;
}

#complect h2 {
	font-size: 18px;
	margin-top: 10px;
}

#color-block {
	padding: 50px 0;
}

span.color {
	display: block;
	position: absolute;
	left: 0;
	right: 0px;
	width: 100%;
	background: url('images/color-horisontal-line.jpg') repeat-x 0 0 #fff;
	height: 11px;
}

span.color-small {
	display: block;
	width: 90%;
	background: url('images/color-horisontal-line.jpg') repeat-x 0 0 #fff;
	height: 11px;
}

#color-block label {
	width: 100%;
	font-size: 18px;
	text-align: left !important;
	margin-left: 55px;
	display: inline-block;
}

#price {
	width: 80%;
	margin-top: 20px;
}

#price div {
	width: 100%;
	background-color: #33cc33;
	color: #fff;
}

#price div p {
	display: inline-block;
	width: 60%;
	font-size: 20px;
	margin-left: 30px;
	font-weight: bold;
}

#price div span {
	display: inline-block;
    font-weight: bold;
    text-align: right;
    vertical-align: text-bottom;
    width: 30%;
}

#buy {
	left: 80%;
	margin-top: -42px;
	position: relative;
	width: 200px;
}

#feedback {
	float: left;
	width: 100%;
	margin-top: 50px;
}

#feedback .right, .left {
	width: 45%;
	float: left;
}

#feedback .right {
	margin-left: 5%;
}

#feedback h2 {
	font: 20px/24px Arial;
	font-weight: bold;
	font-style: italic;
}

#feedback img {
	padding: 10px;
}

#feedback p {
	padding-left: 10px;
	text-align: justify;
}

.garant {
	margin-top: 50px;
}

.garant img {
	float: right;
    margin-top: -100px;
    width: 25%;
}

.garant p {
	font-size: 20px;
    margin-left: 120px;
    width: 160px;
}

#feed {
	background-color: #e8dabf;
	border: 1px #ddd2be solid;
	padding: 15px 10px;
	width: 70%;
	margin: 0 auto;
}

#feed form {
	width: 70%;
}

#feed form input[type=text], input[type=email] {
	width: 100%;
	height: 16px;
	color: #666;
	padding: 10px 5px;
	border: 1px #ccc solid;
}

#feed form textarea {
	width: 100%;
	height: 200px;
	color: #666;
	padding: 10px 5px;
	border: 1px #ccc solid;
}

#feed form input[type=button], input[type=submit] {
	width: 180px;
	margin: 0 auto;
	padding: 3px;
	border: 1px #837d71 solid;
	background-color: #b2a487;
	color: #fff;
	font-size: 16px;
	text-align: center;
	font-weight: bold;
	cursor: pointer;
}

#subscribe {
	width: 100%;
	background-color: rgb(239, 91, 58);
	padding: 20px;
	color: #fff;
}

#subscribe .top {
	height: 30px;
    margin-top: 25px;
    width: 100%;
}

#subscribe .top p {
	width: 80%;
	margin: 0 auto;
	line-height: 23px;
	color: #fff;
	font-size: 24px;
	vertical-align: middle
}

#subscribe .top span {
	bottom: 40px;
    color: #FFFFFF;
    display: block;
    float: right;
    font-family: Arial;
    font-size: 100px;
    font-weight: bold;
    position: relative;
    right: 20px;
}

#s-form {
	width: 400px;
	background-color: #ece9e9;
	padding: 15px 10px;
	margin-top: 30px;
}

#s-form p {
	margin-bottom: 20px;
}

#s-form input[type=text], input[type=email] {
	width: 250px;
	border: 1px #c1c1c1 solid;
	color: #666;
	padding: 5px;
}

#s-form input[type=button], input[type=submit] {
	background-color: #73bb15;
	border: 1px #68ac0e solid;
	width: 150px;
	color: #333;
	font-weight: bold;
	font-family: Arial;
	cursor: pointer;
	padding: 5px;
}

#social {
	width: 50%;
	margin: 50px auto;
}

#contacts {
	width: 100%;
	margin-top: 40px;
	font-style: italic;
}

#contacts :last-of-type:after {
	content: "";
}

#contacts p {
	display: inline;
	width: 150px;
	color: #000;
	line-height: 18px;
	font-size: 18px;
	margin-left: 40px;
}

#contacts p:after {
	content: " / ";
	margin-left: 40px;
}

.post {
	width: 80%;
	margin-bottom: 20px;
	padding: 5px;
}

.post h2 {
	font-weight: bold;
	color: #222;
	font-family: Arial, Tahoma;
}

.post h1 {
	font-size: 26px;
}

.post h2 a {
	color: #222;
	text-decoration: underline;
}

.post h2 a:hover {
	color: #666;
}

.post .post-content {
	text-align: justify;
}

.post .post-date {
	color: #bbb;
	margin-bottom: -5px;
}

.post .post-date > * {
	font-style: italic !important;
}

#opinions-horisontal ul {
	list-style-type: none;
	margin-top: 25px;
    max-height: 220px;
    min-height: 220px;
}

#opinions-horisontal > a {
	text-decoration: underline;
}

#opinions-horisontal ul li {
	width: 295px;
    max-height: 220px;
    min-height: 220px;
	display: inline-block;
	overflow: none;
	text-align: justify;
	font-size: 12px;
	margin: 0 13px 0 13px;
}

#opinion-nav {
	width: 100%;
	margin-top: 20px;
	height: 24px;
}

#opinion-nav div {
	width: 90px;
	margin: 0 auto;
}

#opinion-nav div span {
	background-color: #F9F9F9;
    border: 1px solid #AAAAAA;
    cursor: pointer;
    display: inline-block;
    height: 12px;
    margin-left: 6px;
    width: 12px;
}

#opinion-nav div span.current {
	background-color: #666;
}

#opinion-nav div span:hover {
	background-color: #666;
}

#comment-form {
	width: 100%;
	margin-top: 50px;
}

#respond {

}

#reply-title {
	font-size: 22px;
	font-weight: bold;
}

#respond .logged-in-as {
	font-size: 13px;
	font-family: "Times New Roman", Verdana, Tahoma, Arial;
	text-decoration: italic;
}

#respond .comment-form-comment {
	width: 100%;
}

#respond .comment-form-comment label {
	font-size: 14px;
	font-weight: bold;
	display: block;
}

#respond .comment-form-comment textarea {
	width: 700px;
	height: 250px;
	border: 1px #ccc solid;
	padding: 5px;
	color: #666;
}

.form-allowed-tags {
	width: 700px;
	font-size: 12px !important;
	font-family: Verdana;
	letter-spacing: 1.2;
}

.form-submit input {
	width: 220px;
}

#comments {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
	background: none repeat scroll 0 0 #F2F2F2;
    border: 1px solid #CCCCCC;
    list-style: none outside none;
    margin: 25px 10px 0 0;
    padding: 10px;
}
#comments li {
    margin: 0;
    overflow: hidden;
    padding-bottom: 10px;
    border-bottom: 1px #444 dotted;
}
#comments li:last-child {
    padding: 0;
    border: none;
}
#comments .avatar {
    border: 1px solid #CCCCCC;
    float: left;
    margin: 0 5px 10px 0;
    padding: 1px;
}
#comments cite {
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
}
#comments p {
    clear: left;
    line-height: 1.8em;
}
#comments .reply {
    float: right;
}
#comments .children {
    clear: right;
    list-style: none outside none;
    margin: 5px 0 0;
    padding: 0;
}
#comments .children li {
    border-bottom: medium none;
    border-left: 1px solid #BBBBBB;
    padding: 0 0 0 10px;
}
#comments #respond {
    border-top: 1px solid #CCCCCC;
    clear: both;
    padding: 10px 0 0;
}
#comments #respond .module-title {
    background: url("images/feed-title-blue.jpg") repeat-x scroll center top transparent;
    border: 1px solid #0052A3;
    color: #FFFFFF;
    margin: 0;
}
#comments #respond #commentsform {
    margin: 0;
}
#comments .comment-author {
    padding: 10px 0 0 10px;
}
#comments .comment-content {
    font-size: 14px;
    padding: 0 10px;
}
#comments .comment-node {
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #EEEEEE;
}
#comments .comment-meta {
    color: #999999;
    font-size: 12px;
    text-decoration: none;
}
#comments .comment-controls {
    background: none repeat scroll 0 0 #FFFFFF;
    display: none;
    float: right;
    font-weight: 700;
    padding: 10px;
}
#comments .comment-node:hover .comment-controls {
    display: block;
}
#comments .comment-controls a:link, #comments .comment-controls a:visited {
    background: url("images/feed-title-white.jpg") repeat-x scroll center top #EFEFEF;
    border: 1px solid #CCCCCC;
    color: #000000;
    display: inline-block;
    font-weight: 700;
    margin: 0;
    padding: 5px 10px;
    text-decoration: none;
}
#comments .comment-controls a:hover {
    background: none repeat scroll 0 0 #313428;
    color: #FFFFFF;
}
#comments .reply a, .comments-navigation a, .read-more, .navigation a {
    background: url("images/feed-title-white.jpg") repeat-x scroll center top #EFEFEF;
    border: 1px solid #CCCCCC;
    color: #000000;
    display: inline-block;
    font-weight: 700;
    margin: 0;
    padding: 5px 10px;
    text-decoration: none;
}
#comments .reply a:hover, .comments-navigation a:hover, .navigation a:hover, .read-more:hover {
    background: none repeat scroll 0 0 #313428;
    color: #FFFFFF;
}
.comments-navigation {
    clear: both;
    margin: 0 20px 10px 10px;
}
.comments-navigation a {
    border-top: 0 none;
}
.nocomments {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: none repeat scroll 0 0 #FFFFFF;
    border-color: #CCCCCC;
    border-image: none;
    border-style: solid;
    border-width: 0 1px 1px;
    font-size: 14px;
    margin: 0 10px 10px 0;
    padding: 15px 10px;
}
#commentsform {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: none repeat scroll 0 0 #FFFFFF;
    border-color: #CCCCCC;
    border-image: none;
    border-style: solid;
    border-width: 0 1px 1px;
    margin: 0 10px 10px 0;
    overflow: hidden;
    padding: 10px;
}
#commentsform textarea {
    font: 14px 'Lucida Grande',Arial,Helvetica,sans-serif;
    height: 150px;
    padding: 5px;
    width: 98%;
}
#commentsform .error {
    display: block;
    padding: 5px;
}
#cancel-comment-reply-link {
    font-size: 11px;
    padding: 0 10px;
}

#page-navi {
	margin: 15px 0 20px 0;
}

/* Блок новостей */
.news { margin: 90px 0 50px 0; }
ul.news-posts { margin-bottom: 10px; }
ul.news-posts li { font-size: 18px; color: #000; margin-bottom: 5px; }
ul.news-posts li span.date { padding-right:10px; }

/* Блок соцсетей */ 
.social-network { margin: 90px 0 50px 0; overflow: hidden; }
.social-network h2 { margin-bottom: 20px; }
.social-network .left, .social-network .center, .social-network .right { width:300px; float: left; margin-right: 40px; }
.social-network div:last-child { margin-right: 0; }

/* Хлебные крошки */
.breadcrumbs { margin-bottom: 20px; }

/* Меню */ 
.nav ul li { width:auto; margin-left: 2%; margin-right: 2%; }

@media only screen and (max-width : 1020px) { 
	.nav ul li { margin-left: 1%; margin-right: 1%; }
}