/**
 * J!Blank Template for Joomla by JBlank.pro (JBZoo.com)
 *
 * @package    JBlank
 * @author     SmetDenis <admin@jbzoo.com>
 * @copyright  Copyright (c) JBlank.pro
 * @license    http://www.gnu.org/licenses/gpl.html GNU/GPL
 * @link       http://jblank.pro/ JBlank project page
 */
/* just example of css import */

/* just for test repaltive paths
@import url('print.css');
@import url('reset.css');
*/

/****************************************** FRONTEND STYLES ***********************************************************/

/* classic clearfix */
.clearfix {
    display: block;
}

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

* html .clearfix {
    height: 1%;
}

/****************************************** custom ***********************************************************/

body {
	background:url(../images/bg.jpg) repeat;
	padding: 0;
    margin: 0;
	font: normal 15px/24px 'Open Sans';
}

.wrapper {
	width: 1100px;
    margin: 0 auto;
}

.fr {
	float: right;
}

.fl {
	float: left;
}

.tr {
	text-align: right;
}

.tl {
	text-align: left;
}

.clear {
	clear: both;
}

a {
	color: #ff4f12;
}

/****************************************** top ***********************************************************/

.top {
    height: 60px;
    background: #1b1b1c;
    color: #fff;
    border-bottom: 1px solid #ff4f12;
}
.top .cityname {
    font-weight: 600;
}
.address {
    background: url(../images/phone.png) 0% 50% no-repeat;
	font-weight: 300;
	color: #ff4f12;
	font-size: 18px;
    width: calc(33.33% - 44px);
    float: left;
	line-height: 58px;
	color: #ff4f12;
	/*color: #898989;*/
	padding-left: 44px;
}

.phone {
	background: url(../images/phone.png) 23% 50% no-repeat;
    text-align: right;
	font-weight: 300;
	color: #ff4f12;
	font-size: 18px;
	line-height: 58px;
	width: 33.33%;
    float: right;
}
.topcenter {
    width: 33.33%;
    float: left;
    line-height: 58px;
    text-align: center;
    font-size: 18px;
    text-transform: uppercase;
    color: #ff4f12; 
    font-weight: 600;
}

/****************************************** header ***********************************************************/

.header {

}

.logo {
    width: 300px;
    float: left;
    height: 112px;
}

.logo img {
    padding: 17px 0;
}

.top-menu {
    width: 800px;
    float: right;
    text-align: right;
}

.top-menu ul {
    margin: 0 -22px 0 0;
    padding: 0;
}

.top-menu ul li {
    list-style: none;
    display: inline-block;
}

.top-menu ul li a, .top-menu ul li span {
    padding: 45px 22px;
    color: #1b1b1c;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 400;
    text-decoration: none;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
	line-height: 112px;
}

.top-menu ul li a:hover, .top-menu ul li span:hover, .top-menu ul li.active a, .top-menu ul li.active a:hover, .top-menu ul li.active span, .top-menu ul li.active li.active a  {
    background: #ff4f12;
	color: #fff;
}

.top-menu ul li.active li a {
    background: transparent;
}

.top-menu ul ul {
    background: rgba(97,100,107,1);
	margin-top: 0;
	padding: 15px 0;
	display: none;
    width: 270px;
	position: absolute;
	border: none;
    height: auto;
	line-height: 20px;
    text-align: left;
    z-index: 10;
}

.top-menu ul li.deeper.parent:hover ul, .top-menu ul li.deeper.parent:hover ul li.deeper.parent:hover ul {
	display: block;
}

.top-menu ul li.deeper.parent:hover ul ul {
	display: none;
}

.top-menu ul ul li {
    line-height: 16px;
    width: 100%;
    padding: 4px 0;
}

.top-menu ul ul li a {
    padding: 0;
    border: none;
    text-transform: none;
    font-weight: 400;
    padding: 5px 20px;
    font-size: 14px;
    color: #fff;
    line-height: 14px;
    display: block;
}


/****************************************** modules main page ***********************************************************/
.main-services {
	margin: 73px 0 90px;
}

.header {
    font-family: 'Roboto', sans-serif;
	font-weight: 100;
	font-size: 80px;
    line-height: 80px;
	text-transform: uppercase;
	text-align: center;
	padding: 0 0 48px;
}

.header .span {
	font-weight: 500;
}

.homepage-slider {
    background: #f1f1f1 url(../images/shadow.png) 0 0 repeat-x;
}

@media (min-width: 1280px) {
    .homepage-slider .slick-dots {
        right: auto;
        left: calc(50% + 400px);
    }
}

.service-item {
    width: 50%;
    display: inline-block;
    float: left;
}

.serice-about {
    width: 350px;
}

.service-img {
    padding: 30px;
}

.service-img:hover img {
    transform: scale(0.9);
    -webkit-transform: scale(0.9);
    -o-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.service-title {
    font-size: 30px;
    text-transform: uppercase;
    font-weight: 600;
    padding-top: 58px;
    padding-bottom: 10px;
}

.service-title a {
	color: #000;
	text-decoration: none;
}

.service-title a:hover {
	color: #ff4f12;
}

.service-txt {
    text-transform: uppercase;
    line-height: 24px;
}

.service-button {
    width: 244px;
    margin: 0 auto;
    display: block;
    text-align: center;
	background: #1b1b1c;
	color: #fff;
	text-transform: uppercase;
	border-bottom: 3px solid #ff4f12;
	font-size: 24px;
	font-weight: 600;
	text-decoration: none;
    padding: 20px 0;
}

.service-button:hover {
	background: #313133;
}

.avtoservis {
	background: url(../images/grey-bg.png) repeat;
	color: #fff;
    padding: 80px 0 90px;
}

.avtoservis .header {
    padding: 0 0 40px;
}

.avtoservice-button {
    width: 244px;
    margin: 0 auto;
    display: block;
    text-align: center;
	background: #00b28c;
	color: #fff;
	text-transform: uppercase;
	border-bottom: 3px solid #007e63;
	font-size: 24px;
	font-weight: 600;
	text-decoration: none;
    padding: 20px 0;
}

.avtoservice-button:hover {
	background: #313133;
}

.recording .w {
    width: 50%;
    float: left;
}

.recording .img-block {
    background: url(../images/recording.jpg) 100% 0 / cover;
    height: 600px;
    float: right;
}

.recording .text-block {
    width: 500px;
    padding-right: 50px;
	float: right;
}

.recording .header {
    font-family: 'Roboto', sans-serif;
    font-size: 50px;
    line-height: 50px;
    text-align: left;
    padding: 75px 0 10px;
}

.recording .txt {
	font-size: 14px;
	line-height: 18px;
    padding-bottom: 44px;
}

.recording input[type="text"], .recording textarea {
    background: #f0f0f0;
    border: 0;
	color: #212123;
	font-size: 14px;
	line-height: 38px;
	margin-bottom: 25px;
	text-align: left;
	width: 205px;
    font-family: 'Open Sans';
    font-weight: 400;
    padding: 0 12px;
}

.recording textarea {
    width: 475px;
}

input::-webkit-input-placeholder {
	color: #212123;
}
input:-moz-placeholder {
	color: #212123;
}

textarea::-webkit-input-placeholder {
	color: #212123;
}
textarea:-moz-placeholder {
	color: #212123;
}

.recording input[type="submit"] {
    width: 210px;
    display: block;
    text-align: center;
	background: #ff4f12;
	color: #fff;
	text-transform: uppercase;
    border: 0;
	border-bottom: 3px solid #922d0a;
	font-family: 'Open Sans';
	font-size: 18px;
	font-weight: 600;
	text-decoration: none;
    padding: 15px 0;
    margin-top: 20px;
}

.recording input[type="submit"]:hover {
	background: #313133;
	cursor: pointer;
	border-bottom: 3px solid #ff4f12;
}

/****************************************** footer ***********************************************************/

.copyright {
    clear: both;
    height: 84px;
    line-height: 84px;
    background: #1b1b1c;
    font-size: 15px;
    color: #888888;
}

.footer {
    clear: both;
}

.menus {
    width: 714px;
    float: right;
}

.tt {
	background: #212123;
    width: 63%;
    float: left;
	height: 360px;
}

.tt .col-1, .tt .col-2 {
	width: 50%;
	float: left;
}

.footer .header {
	font-size: 24px;
	color: #fff;
	text-align: left;
	text-transform: uppercase;
	font-weight: 600;
	font-family: 'Open Sans';
	line-height: 28px;
	padding: 60px 0 20px;
}

.footer ul {
	padding: 0;
	margin: 0;
	list-style: none;
}

.footer ul li {
	line-height: 36px;
}

.footer ul li a {
	color: #888888;
	text-decoration: none;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.footer ul li a:hover {
	color: #ff4f12;
}

.ot {
	background: url(../images/footer-bg.png);
    width: 37%;
    float: left;
	height: 360px;
}

.col-3 {
    width: 300px;
    padding-left: 84px;
}

.contacts .address, .contacts .phone, .contacts .email {
	font-size: 15px;
	color: #fff;
    display: inline-block;
    width: 100%;
    text-align: left;
	background: none;
	line-height: 20px;
    padding: 2px 0 12px;
}

.contacts .email {
	color: #00b28c;
	border-bottom: 1px dotted;
	padding: 0;
    width: 158px;
}

/****************************************** content ***********************************************************/
.sheader {
    height: 112px;
}

.item-page, #jc, .blog  {
    background: #f1f1f1 url(../images/shadow.png) 0 0 repeat-x;
    padding: 60px 0 70px;
}

.page-header {
    display: none;
}

.item-page .header {
    font-size: 50px;
    line-height: 55px;
    padding: 0 0 30px;
}

.item-page img.img, .item-page img.img-r {
    margin-right: 25px;
    outline: 1px solid #ff4f12; 
	outline-offset: -12px;
}

.item-page img.img-r {
	margin: 0 0 0 25px;
}

.contacts {
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 15px;
    font-weight: bold;
    text-transform: uppercase;
}

.contacts .span {
    font-weight: normal;
    text-transform: none;
    margin-left: 15px;
}

.breadcrumb-bg { 
    background: #f5f5f5;	
}

ul.breadcrumb {
    background: #f5f5f5;
    color: #888888;
    font-size: 13px;
    list-style-type: none;
    margin: 0 auto;
    padding: 0;
    line-height: 51px;
    width: 1100px;
}

ul.breadcrumb li {
    display: inline;
}

.breadcrumb a {
    text-decoration: none;
    border-bottom: 1px dotted;
    color: #888;
}

/****************************************** footer ***********************************************************/

#jc h4 {
	font-family: 'Roboto', sans-serif;
    font-weight: 100;
    text-transform: uppercase;
    text-align: center;
    font-size: 50px;
    line-height: 55px;
    padding: 0 0 50px;
    margin: 0;
    border: 0;
}

#jc .rbox {
    padding: 10px 20px;
    border-radius: 0;
}

#jc .rbox div {
    text-align: left;
    margin: 10px 0 0;
    font-size: 14px;
    color: #4d5255;
    line-height: 20px;
}

#comments-form-link .showform {
	color: #00b28c;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 14px;
}

#comments-form-link .showform:hover {
	text-decoration: none;
}

#comments .comments-list {
    margin-left: 0;
}

.blog h2 {
	font-family: 'Roboto', sans-serif;
    font-weight: 100;
    text-transform: uppercase;
    text-align: center;
    font-size: 50px;
    line-height: 55px;
    padding: 0 0 50px;
    margin: 0;
}

.blog .header {
    font-size: 24px;
    line-height: 24px;
    padding: 0;
	text-align: left;
}


.slide-1 .homeslider-description, .slide-2 .homeslider-description, .slide-3 .homeslider-description {
    width: 1100px;
	margin: 0 auto;
	position: relative;
}

.slide-1 .bold-text, .slide-2 .bold-text, .slide-3 .bold-text {
    font-size: 50px;
    font-weight: 600;
    color: #fff;
    text-transform: uppercase;
    left: 0;
    bottom: 0;
    position: absolute;
    z-index: 2;
	width: 457px;
	height: 190px;
	background: url(../images/white-bg2.png) repeat;
	text-shadow: 0 3px 5px rgba(0,0,0,0.3);
    padding: 40px 0 0 55px;
    line-height: 50px;
}

.slide-1 .bold-text .span, .slide-2 .bold-text .span, .slide-3 .bold-text .span {
	font-size: 70px;
}
.slide-1 .bold-text .span2, .slide-2 .bold-text .span2, .slide-3 .bold-text .span2 {
	font-size: 40px;
}

.slide-1 .sm-text, .slide-2 .sm-text, .slide-3 .sm-text {
    font-size: 25px;
    font-weight: 300;
    color: #fff;
    text-transform: uppercase;
	margin-top: -5px;
    display: block;
    position: relative;
    z-index: 2;
	text-shadow: 0 3px 5px rgba(0,0,0,0.3);
}

.slide-1 .button, .slide-2 .button, .slide-3 .button {
    width: 95px;
	height: 95px;
	background: url(../images/arrow.png) no-repeat;
    position: absolute;
    bottom: 0;
    left: 490px;
    z-index: 10;
}

.slide-1 .button a, .slide-2 .button a, .slide-3 .button a {
    width: 95px;
	height: 95px;
    display: block;
    opacity: 0;
}

.map iframe {
    width: 100%;
    border: none!important;
    margin-bottom: -6px;
}




.contactForm input[type="text"].contactus-fields, .contactForm input[type="email"].contactus-fields, 
.contactForm input[type="date"].contactus-fields, .contactForm input[type="time"].contactus-fields, 
.contactForm input[type="tel"].contactus-fields, .contactForm textarea.contactus-textarea {
    background: #f0f0f0;
    border: 0;
    color: #212123;
    font-size: 14px;
    line-height: 38px;
    margin-bottom: 10px;
    text-align: left;
    font-family: 'Open Sans';
    font-weight: 400;
    padding: 0 12px;
}

.contactForm .contactus-form div.joomly-contactus-div:first-child,
.contactForm .contactus-form div.joomly-contactus-div:nth-child(2) {
    width: 205px;
    display: inline-block;
}
.contactForm .contactus-form div.joomly-contactus-div:first-child {
    margin-right: 20px;
}
body .contactForm label.contactus-checkbox-label {
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    align-items: baseline;
    margin-bottom: 10px;
    text-align: left;
}
body .contactForm .contactus-checkbox-label input[type="checkbox"] {
    width: auto;
    margin: 0 5px 0 0;
}

body .contactForm div.contactus-form button[type="submit"].contactus-button {
    width: 210px;
    display: block;
    text-align: center;
    background: #ff4f12;
    color: #fff;
    text-transform: uppercase;
    border: 0;
    border-bottom: 3px solid #922d0a;
    font-family: 'Open Sans';
    font-size: 18px;
    font-weight: 600;
    text-decoration: none;
    padding: 15px 0;
    margin-top: 20px;
    opacity: 1;
    transition: 0.3s all;
}
body .contactForm div.contactus-form button[type="submit"].contactus-button:hover {
    background: #313133 !important;
    cursor: pointer;
    border-bottom: 3px solid #ff4f12;
    opacity: 1;
}


/* cookies */
body .notice_div_ribbin {
    left: 20px;
    bottom: 20px;
    padding: 15px 20px;
    max-width: calc(60% - 20px * 2 - 40px);
    border-radius: 4px;
    box-shadow: 0 6px 6px rgb(0 0 0 / 25%);
}
body .notice_div_ribbin .inner1 {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
body .notice_div_ribbin .inner3 p {
    line-height: 18px;
}
body .notice_div_ribbin .inner3 a {
    color: #fff;
    opacity: 0.5;
    font-weight: 400;
}
body .notice_div_ribbin .button_cookie {
    font-family: "Open Sans", sans-serif;
}