/*
* Стили связанные с модулем titleHTML
*/
/* Основные настройки */
#sp-top-1 { margin: 0px !important; }
.h300 .titlehtml .gradient {height: 300px; background:none;}
.h300 .titlehtml .bg_container {height: 300px;}
.h300 .titlehtml .hzcatalog_container { height: 300px;}
.h300 .titlehtml .hzcatalog_container_inner {
    height: 300px;
    margin: 20px 0;
}
.h300{margin-top:0; height: 300px;}



.h300 .titlehtml h1.title, .h300 .titlehtml h2.title, .h300 .titlehtml h3.title, .h300 .titlehtml span.title {
    line-height: 0.9;
    color: #333333;
    font-size: 50px;
	font-weight: 800;
    background: none;
	padding: 0;
}
.h300 .titlehtml h1.title, .h300 .titlehtml h2.title, .h300 .titlehtml h3.title, .h300 .titlehtml span.title {
    line-height: 1;
    font-weight: 200;
    margin-top: 0.5em;
}




.h300 ul.ul-title li {
    font-weight: 700;
    text-shadow: none;
    border-bottom: none;
    font-size: 18px;
    color: #555;
}



.h300 ul.ul-title i.fa { color: #555; }

.h300 .titlehtml a.red-button {
    height: 46px;
    line-height: 46px;
    text-align: center;
    color: #fff;
    text-transform: uppercase;
    border-radius: 3px;
    font-size: 20px;
    font-weight: 700;
    text-decoration: none;
    display: inline-block;
    vertical-align: top;
    padding: 0 13px;
    margin: 20px 0;
    background: #dc2f30;
    background: -moz-linear-gradient(top,#dc2f30 0%,#b72223 100%);
    background: -webkit-linear-gradient(top,#dc2f30 0%,#b72223 100%);
    background: linear-gradient(to bottom,#dc2f30 0%,#b72223 100%);
}



.h300 .titlehtml a.flate-button {
     text-align: center;
     color: #fff;
     text-transform: uppercase;
     font-size: 1.5em;
     font-weight: 700;
     text-decoration: none;
     display: inline-block;
     vertical-align: middle;
     padding: 0.75em 1.5em;
     margin: 20px 0;
     background: #afafaf;
     background: -moz-linear-gradient(top,#afafaf 0%, #9c9c9c 100%);
     background: -webkit-linear-gradient(top,#afafaf 0%,#9C9C9C 100%);
     background: linear-gradient(to bottom,#afafaf 0%,#9C9C9C 100%);
     text-shadow: 1px 1px 2px #6e6e6e;
     position: relative;
     z-index: 2;
 }

.h300 .titlehtml a.round-button {
    border-radius: 1.75em;
}

.h300 .titlehtml a.pink-flate-button {
    color: #fff;
    background: #ffa4a4;
    background: -moz-linear-gradient(top,#ffa4a4 0%,#f4a8a8 100%);
    background: -webkit-linear-gradient(top,#ffa4a4 0%,#f4a8a8 100%);
    background: linear-gradient(to bottom,#f4a8a8 0%,#ffa4a4 100%);
    text-shadow: 1px 1px 2px #6e6e6e;
}
.h300 .titlehtml a.red-flate-button {
    color: #fff;
    background: #c60000;
    background: -moz-linear-gradient(top,#c60000 0%, #900000 100%);
    background: -webkit-linear-gradient(top,#c60000 0%,#900000 100%);
    background: linear-gradient(to bottom,#900000 0%,#c60000 100%);
    text-shadow: 1px 1px 2px #6e6e6e;
}

.h300 .titlehtml a.brown-flate-button {
    color: #fff;
    background: #bf3207;
    background: -moz-linear-gradient(top,#f05200 0%,#bf3207 100%);
    background: -webkit-linear-gradient(top,#f05200 0%,#bf3207 100%);
    background: linear-gradient(to bottom,#f05200 0%,#bf3207 100%);
    text-shadow: 1px 1px 2px #762107;
}

.h300 .titlehtml a.gold-flate-button {
    color: #fff;
    background: #ffc40d;
    background: -moz-linear-gradient(top,#ffc40d 0%, #ffb211 100%);
    background: -webkit-linear-gradient(top,#ffc40d 0%,#ffb211 100%);
    background: linear-gradient(to bottom,#ffc40d 0%,#ffb211 100%);
    text-shadow: 1px 1px 2px #b37510;
}



.h300 .titlehtml .logo-bottom {
	position: absolute;
    bottom: 40px;
    z-index: 1;
}

.h300 .carousel-inner .item{
    padding: 0;
    border: none;
}
.h300 .carousel-inner .item:hover{
    padding: 0;
    border: none;
}
.h300 .carousel.slide{
    height: auto;
}

@media (max-width: 768px){
	.h300{height: 200px;}
	.h300 .titlehtml .gradient {height: 200px;}
.h300 .titlehtml .bg_container {height: 200px;}
.h300 .titlehtml .hzcatalog_container { height: 200px; padding: 0 15px;}
.h300 .titlehtml .hzcatalog_container_inner {    height: 200px;    margin: 10px 0;}
.h300 .titlehtml h1.title, .h300 .titlehtml h2.title, .h300 .titlehtml h3.title, .h300 .titlehtml span.title { font-size: 30px; }
.h300 .titlehtml h1.title, .h300 .titlehtml h2.title, .h300 .titlehtml h3.title, .h300 .titlehtml span.title { font-size: 2.25em; }
.h300 ul.ul-title li {  font-size: 12px; }
.h300.opora ul.ul-title li { font-size: 14px; }

/* Buttons */
.h300 .titlehtml a.red-button {
    height: 30px;
    line-height: 30px;
    font-size: 16px;
     margin: 10px 0;
}

.h300 .titlehtml a.flate-button {
    font-size: 1.25em;
    padding: 0.75em 1.5em;
    margin: 15px 0;
}
.h300 .titlehtml a.pink-flate-button {    font-size: 1.25em; margin: 10px 0; }


.h300 .titlehtml .logo-bottom {
    bottom: 20px;
}


}
@media (max-width: 480px){
.h300{height: 150px;}
.h300 .titlehtml .gradient {height: 150px;}
.h300 .titlehtml .bg_container {height: 150px;}
.h300 .titlehtml .hzcatalog_container { height: 150px;}
.h300 .titlehtml .hzcatalog_container_inner {    height: 150px;    margin: 10px 0;}
.h300 .titlehtml h1.title, .h300 .titlehtml h2.title, .h300 .titlehtml h3.title, .h300 .titlehtml span.title { font-size: 24px; font-weight: 400;}
.h300 .titlehtml h1.title, .h300 .titlehtml h2.title, .h300 .titlehtml h3.title, .h300 .titlehtml span.title { font-size: 1.4em; margin-top: 0;}
.h300 ul.ul-title {display:none;}
.h300.opora ul.ul-title{ display: inherit;
    width: 58%;
    line-height: 0.65;
    text-indent: -13px;
    margin-left: 24px; 
}
.h300 ul.ul-title li {   font-size: 12px; }

.h300 .titlehtml .logo-bottom {
	display:none;
}

/* Buttons */
.titlehtml a.red-button { margin-top: 20px; }
.titlehtml a.flate-button {
    font-size: 0.75em;
    margin: 10px 0;
    padding: 0.25em 1em;
}


/* смещение фона на мобильном */
.bg_10 .bg_container{
    background-position-x: 10% !important;
}
.bg_20 .bg_container{
    background-position-x: 20% !important;
}
.bg_30 .bg_container{
    background-position-x: 30% !important;
}
.bg_40 .bg_container{
    background-position-x: 40% !important;
}
.bg_50 .bg_container{
    background-position-x: 50% !important;
}
.bg_60 .bg_container{
    background-position-x: 60% !important;
}
.bg_70 .bg_container{
    background-position-x: 70% !important;
}
.bg_80 .bg_container{
    background-position-x: 80% !important;
}
.bg_90 .bg_container{
    background-position-x: 90% !important;
}




}


/* Gold style .gold_style */
.gold-style .hzcatalog_container_inner{
    margin: 0 !important;
}
.gold-style .gradient {
    background: linear-gradient(to right, rgba(254, 255, 235, 0.8) 0%, rgba(118, 33, 7, 0) 60%) !important;
}
.gold-style .title
{   display: block !important;
    background-color: #ffc40d !important;
    padding: 0.25em 0.5em !important;
}
.gold-style ul.ul-title i.fa, .gold-style ul.ul-title li {
    color: #404040;
    text-shadow: 1px 1px 5px #ffc40d;
}
.gold-style a.flate-button{
    padding: 0.25em 1em !important;
    margin: 10px 0 !important;
}

/* white shadow style .white_shadow */

.white_shadow .gradient {
    background: linear-gradient(to right, rgba(254, 255, 235, 0.8) 0%, rgba(118, 33, 7, 0) 60%) !important;
}
.white_shadow .title
{
    text-shadow: 2px 2px 2px white;
}
.white_shadow ul.ul-title i.fa, .white_shadow ul.ul-title li {
    color: #c60000;
    text-shadow: 2px 2px 2px white;
}