html,
body {
font-family: 'Open Sans', Arial, sans-serif !important;
}
.page .bro-ap-head {
font-size: 24px;
text-transform: none;
letter-spacing: 0px;
color: #676767;
text-align: left;
font-style: inherit;
font-weight: 400;
padding-top: 0px;
padding-bottom: 30px;
}
.page .bro-ap-head h3 {
font-size: 24px;
text-transform: none;
letter-spacing: 0px;
color: #676767;
text-align: left;
font-style: inherit;
font-weight: 400;
}
.mk-tweet-list.light li {
background-color: transparent;
border: none;
}
.mk-tweet-list.light li:first-child {
border-bottom: 1px solid rgba(255, 255, 255, 0.6);
}
#contact_info-2 ul li i {
color: #fff;
}
.mk-tweet-list.light li:after {
display: none;
}
.mk-tweet-list.light li:before {
background: transparent;
color: #fff !important;
-webkit-text-fill-color: inherit;
} .clear {float:none;clear:both;display:block;width:100%;}
#theme-page .theme-page-wrapper .theme-content {
padding: 0 0 !important;
}
.mk-single-content {
margin: 0 !important;
} 
@media only screen and (max-width: 992px)  {
#mk-breadcrumbs {display:none;}
}
.page-id-2276 #mk-page-id-2276 {display:block;} .bro-header-tools .style1 {display:inline-block; font-weight:bold; color:#002c5f;font-size:16px;}
.bro-header-tools .style2 {display:inline-block;padding: 0 10px;font-size:16px;}
.bro-header-tools .style3 {display:inline-block;padding: 0 10px;font-size:16px;}
.bro-header-tools .style4 {display:inline-block;float: right;font-weight:bold;color:#e63312;font-size:16px;}
@media only screen and (max-width: 992px)  {
.bro-header-tools .style1, 
.bro-header-tools .style2, 
.bro-header-tools .style3 {display:none !important;}
.bro-header-tools .style4 {float:none;}
} @media only screen and (max-width: 992px)  {
.header-logo img {margin-top:20px !important;}
}
@media only screen and (max-width: 768px)  {
.header-logo img {max-width: 410px !important;}
}
@media only screen and (max-width: 600px)  {
.header-logo img {max-width: 280px !important;}
} #bro-brands-right {position:absolute; top:20px;right:44px;z-index:1000;height:120px;max-width: 280px;overflow:hidden;}
.bro_header_brands_logo {display: block;float:left;width: 110px;height:auto;padding-top: 10px;}
.bro_header_brands_logo.hyundai {width: 136px;}
.bro_header_brands_logo a {display:inline-block;}
.bro_header_brands_logo img {height: 84px;display: inline-block;}
.bro_header_brands_sub {font-size: 8px;margin-top: -61px;line-height: 9px;display:block;text-align: center;color:#676767;}
#bro-brands-left {position:absolute; top:20px;left:20px;z-index:1000;height:120px;}
#bro-brands-left img {max-height:20px;margin-right: 20px;} @media only screen and (max-width: 992px)  {
#bro-brands-right,
#bro-brands-left {display:none;}
} .bro-intro p {font-size: 18px !important; line-height: 26px;}
.bro-small p,
.bro-small-left p {font-size: 12px;line-height:16px;}
.bro-content h3 {font-size: 18px; line-height:26px;}
.page-title {font-size: 36px;color: #002c5f;text-transform: none;font-weight: 400;letter-spacing: 0;text-align: center;} .bro-button1 .text {font-weight:normal !important;}
.theme-content .wpcf7 .wpcf7-submit,
.bro-newsletter-form .submit_container button,
.mk-button-container .mk-button,
.vc_btn3-container A {text-transform:none;color:#676767 !important;border-radius:5px;font-weight:normal;font-family:'Open Sans', Arial, sans-serif;background-color:#e6e6e6 !important;}
.bro-newsletter-form .submit_container button {border:none;margin-top: 20px;padding: 16px 25px;margin-bottom:20px;}
.theme-content .wpcf7 .wpcf7-submit:hover,
.bro-newsletter-form .submit_container button:hover,
.mk-button-container .mk-button:hover,
.vc_btn3-container A:hover {color:#000 !important;background-color:#b8b8b8 !important;}
.mk-main-wrapper .vc_cta3 .vc_cta3-actions .bro-button-cta a.vc_btn3 {background-color: #002c5f !important;border: 0 none !important;color: #fff !important; font-size: 14px !important;border-color: #002c5f !important;background-image: none !important;} .bro-icon-car1.mk-box-icon h4,
.bro-icon-car2.mk-box-icon h4,
.bro-icon-car3.mk-box-icon h4 {margin-bottom:5px !important;}
.bro-icon-car1.mk-box-icon .icon-box-readmore,
.bro-icon-car2.mk-box-icon .icon-box-readmore,
.bro-icon-car3.mk-box-icon .icon-box-readmore {float:left;margin:0 15px 30px 0;} .bro-openings .mk-fancy-table.table-style2 td {text-align:left !important;}
.bro-table .mk-fancy-table.table-style1 td,
.bro-table .mk-fancy-table.table-style2 td,
.bro-news-table .mk-fancy-table.table-style1 td,
.bro-news-table .mk-fancy-table.table-style2 td {text-align:left !important;}
.bro-table table td,
.bro-news-table table td {text-align:left !important;} .theme-content .mk-text-block ul li {font-family: 'Open Sans', Arial, sans-serif; margin-bottom:0.25em;margin-right:0.85em;} .bro-accordion p {} .mk-love-holder {display:none;}
.vc_grid-item .vc_gitem-zone-a {border-top:1px solid #E6E6E6;border-left:1px solid #E6E6E6;border-right:1px solid #E6E6E6;}
.page-subtitle {text-align:center; float:none; font-size:20px;color:#676767;width:auto;} #mk-footer,
#mkd-boxed-layout .bro-team,
#mkd-boxed-layout .bro-team .mk-grid,
.mk-main-navigation li.no-mega-menu ul.sub-menu,
.mk-main-navigation li.has-mega-menu > ul.sub-menu,
.mk-shopping-cart-box {
background-color: #e6ebf2;
background-color: #f6f2f3 !important;
}
.master-holder h3 {
color: #002c5f !important;
}
.master-holder strong {
color: #676767 !important;
} .mk-header {border-bottom: none !important;}
.mk-toolbar-responsive-icon {display:none !important;}  .bro-blog-carousel .mk-flex-slides .item-title {text-align:left;}
.bro-blog-carousel .mk-flex-slides  .item-excerpt {text-align:left;}
.bro-blog-carousel .mk-flex-slides .detail-holder {min-height:240px !important;}
.bro-blog-carousel h3 {background:none !important;}
.page-id-2276 #mk-page-id-2276 {display:none;} .mk-button--dimension-outline.skin-dark, 
.mk-button--dimension-savvy.skin-dark {border:none !important;}
.mk-tab-slider .mk-tab-slider-wrapper,
.mk-tab-slider .mk-tab-slider-wrapper .mk-tab-slider-item {height: auto !important;} .metaslider .caption {
padding: 10px !important;
line-height: 1.0em !important;
}
.metaslider .flexslider .slides p {
color: #fff;
line-height: 1.4em;
}
.metaslider .flexslider .slides .p1 {
font-size: 11px !important;
color: #676767;
}
.metaslider .flexslider .slides .p1,
.metaslider .flexslider .slides .p1 strong {
color: #676767;
}
.metaslider .flexslider .slides .bro-meta-emission {
font-size: 11px;
line-height: 1.0em !important;
}
@media only screen and (max-width: 600px) { .metaslider .flexslider .slides p,
.metaslider .flexslider .slides p strong {
margin: 0;
line-height: 1.4em; }
.metaslider .flexslider .slides .p1 {
font-size: 16px;
margin-bottom: 10px; }
.metaslider .flexslider .slides .bro-meta-emission {
font-size: 11px;
line-height: 1.0em !important; }
.metaslider .flexslider {
margin: 0 !important;
}
}
.metaslider .caption-wrap {
position: static !important;
background: #fff !important;
color: #676767 !important;
opacity: 1 !important;
} 
.metaslider .caption-wrap .caption {
color: #676767;
} 
.metaslider .flexslider .slides .p1 {
color: #676767;
} 
.metaslider.ms-theme-outline .flexslider {
background-color: #fff !important;
}
.metaslider .caption-wrap .caption,
.metaslider .caption-wrap .caption strong {
color: #fff !important;
} .bro_tag {
position: absolute;
top:10px;
right:13px;
background-color: #e63312;
color: #fff;
font-size: 10px;
padding: 0 10px;
font-weight: bold;
}
.bro_tag_slide {
position: absolute;
top:20px;
right:0px;
background-color: #e63312;
color: #fff;
font-size: 16px;
padding: 10px;
font-weight: bold;
}
@media only screen and (max-width: 600px) {
.bro_tag_slide {
font-size: 12px;
padding: 5px 10px 5px 15px;
top: -470px;
left: 0;
right: auto;
}
}
.bro_tag_post {
position:absolute;
top:10px;
right:15px;
padding:10px 15px !important;
font-weight: bold;
background-color: #e63312;
display:inline-block;
color: #fff !important;
}
@media only screen and (max-width: 600px) {
.bro_tag_post {
right: 0px !important;
top: 10px !important;
font-size: 12px !important;
padding: 3px 5px !important;
}
}
#mk-page-id-2276 .ls-v6 .ls-bottom-slidebuttons a {
border: 2px solid #ccc !important;
}
.home #mk-boxed-layout .vc_custom_1419240516480 {
background-color: #f6f2f3 !important;
}
.mk-blog-grid-item .the-title a {font-size: 19px;line-height: 1.3em;}
.blog-grid-holder .image-hover-overlay,
.blog-grid-holder .post-type-badge {display:none;}
.bro-action-box-h3 h3 {font-size: 24px !important;font-weight: 400 !important;}
.bro-start-action-image {border: 1px solid #f6f2f3;} .the-excerpt .bro-excerpt-small {
font-size: 11px !important;
line-height: 1.3em;
display: inline-block;
padding: 20px 0 0 0;
} #mk-boxed-layout .vc_custom_1685565934598 {
color: #fff !important;
}
.home #mk-boxed-layout .elektro-button a {
background-color: transparent !important;
color: #fff !important;
text-transform: uppercase !important;
border: 1px solid #fff !important;
}
.home #mk-boxed-layout .elektro-button a:hover,
.home #mk-boxed-layout .elektro-button a:focus {
background-color: transparent !important;
color: #000 !important;
text-transform: uppercase !important;
border: 1px solid #000 !important;
} .waschbox,
.waschbox h3 {color: #002c5f !important;}
.bro-3colsrow .vc_column_container>.vc_column-inner {width: auto !important;} @media only screen and (max-width: 768px) {
.bro-product {
margin-bottom: 20px !important;
}
}
.bro-product .bro-product-single {
background-color: #f6f2f3 !important;
padding: 0;
width: 31%;
margin: 0 1%;
}
.mk-grid .bro-product .bro-product-intro {
background-color: #fff !important;
padding: 0;
width: 62% !important;
margin: 0 1%;
}
@media only screen and (max-width: 768px) {
.bro-product .bro-product-single,
.bro-product .bro-product-intro {
width: 100%;
margin: 0;
}
}
.bro-product-single .bro-product-title {
padding: 30px 20px 0 20px;
margin: 0;
}
.bro-product-single .bro-product-desc {
padding: 10px 20px;
min-height: 140px;
}
@media only screen and (max-width: 768px) {
.bro-product-single .bro-product-desc {
min-height: auto;
}
}
.bro-product-single .bro-product-desc,
.bro-product-single .bro-product-desc p {
font-size: 14px !important;
}
.bro-product-single .bro-product-priceinfo {
padding: 10px 20px;
}
.bro-product-single .bro-product-priceinfo .bro-product-name {
display: block;
font-size: 14px;
font-weight: 700 !important;
} 
.bro-product-single .bro-product-priceinfo .bro-product-price {
text-align: right;
display: block;
font-size: 20px;
color: #002c5f !important;
font-weight: 700 !important;
}
.bro-product-single .bro-product-priceinfo .bro-product-price small,
.bro-product-note sup,
.bro-product-note small {
font-size: 75% !important;
} .page-id-447 .posts-carousel .detail-holder,
.page-id-4551 .posts-carousel .detail-holder {
min-height: 210px !important;
} .page-id-13 #theme-page .mk-ornamental-title h2.title {
font-size: 24px;
}
.page-id-13 #theme-page h3.mk-fancy-title,
.page-id-13 #theme-page h3.mk-fancy-title p {
font-size: 24px;
}
@media only screen and (max-width: 768px) {
.page-id-13 #theme-page .mk-ornamental-title h2.title {
font-size: 26px;
}
.page-id-13 #theme-page h3.mk-fancy-title,
.page-id-13 #theme-page h3.mk-fancy-title p {
font-size: 20px !important;
}
} .page-id-7 #theme-page .mk-ornamental-title h2.title {
font-size: 24px;
}
.page-id-7 #theme-page h3.mk-fancy-title,
.page-id-7 #theme-page h3.mk-fancy-title p {
font-size: 24px;
}
@media only screen and (max-width: 768px) {
.page-id-7 #theme-page .mk-ornamental-title h2.title {
font-size: 26px;
}
.page-id-7 #theme-page h3.mk-fancy-title,
.page-id-7 #theme-page h3.mk-fancy-title p {
font-size: 20px !important;
}
} .bro-masonry-grid-gk .vc_grid-item-mini {
border:1px solid #e3e3e3;
}
.bro-masonry-grid-gk .vc_grid-item .vc_gitem-zone {
background-color:#fff !important;
}
.bro-masonry-grid-gk .vc_grid-item .vc_gitem-zone img {
height: 250px;
}
.bro-masonry-grid-gk .vc_grid-item .vc_gitem-zone h4 {
margin-top: 5px;
text-transform: uppercase;
letter-spacing: 1px;
font-size: 14px;
line-height: 18px;
font-weight:600;
color: #003399 !important;
min-height:40px;
}
.bro-masonry-grid-gk .vc_grid-item .vc_gitem-post-data-source-post_excerpt {
min-height:120px;
}
.bro-masonry-grid-gk .vc_grid-item .vc_btn3-container.vc_btn3-left {
text-align:center;
} .bro-headline-hotline strong {color: #e82a19 !important;}
.bro-cols4 .wpb_column {
padding: 0 !important;
height: 380px !important;
}
.bro-cols4 .wpb_column {
padding: 0 !important;
width: 24% !important;
}
.bro-cols4 .wpb_column .wpb_single_image img {
height: 230px !important;
}
.bro-cols4 .wpb_column h3.mk-fancy-title,
.bro-cols4 .wpb_column .mk-text-block {
margin: 0 15px !important;
}
.bro-cols4 .wpb_column h3.mk-fancy-title {
font-size: 26px !important;
margin-bottom: 0px !important;
padding-bottom: 0px !important;
}
.bro-cols4 .wpb_column .mk-text-block p {
font-size: 24px !important;
font-weight: bold !important;
} .bottom-corner-btns {
display:none !important;
} .wpcf7 select,
.wpcf7 .wpcf7-text {
margin: 10px 14px 10px 0;
border: 1px solid #e3e3e3;
height: 50px;
width:100%;
font-family: inherit !important;
}
.wpcf7 .your-message textarea {
width:100%;
margin: 10px 14px 10px 0;
}
.wpcf7 .wpcf7-form-control-wrap textarea {
width:100%;
font-family: inherit !important;
}
.wpcf7 select {
margin-bottom: 0;
margin-top: 30px!important;
}
.wpcf7-submit {
background-color: #8cd0d3;
color: #fff;
border: none;
margin-top: 20px;
padding: 16px 25px;
border-radius: 0;
}
.wpcf7-submit:hover{
background-color: #72d5e7
}
.wpcf7-list-item-label {
margin-right:20px;
}
.wpcf7-response-output {
margin: 20px 0;
}
span.wpcf7-not-valid-tip {
position: static !important;
}
div.wpcf7-validation-errors {
display:inline-block;
} .mk-fullscreen-search-overlay {background-color: #676767;}
.search .master-holder h3 {text-transform: none;}
.search-results .master-holder h4 {text-transform:none;}
.search-result-item .the-excerpt .bro_tag {display: none !important;} .not-found-subtitle {
font-size: 130px !important;
} #fahrzeugangebot {height: 1500px;max-width:99%!important;}
.scroll-container {height: 1510px;width: 990px;max-width:99%!important;overflow: auto;-webkit-overflow-scrolling: touch;}
@media only screen and (max-width: 600px)  {
#fahrzeugangebot {width:380px !important;}
.scroll-container {width:380px;}
} #theme-page  .theme-content .bro-offer-highlight ul li {
font-family: 'Open Sans', Arial, sans-serif !important;
font-weight: 400 !important;
margin-left: 0px !important;
}
#bro-footer-logos .fachbetrieb img {
margin: 0 10px 22px 10px !important;
}
.page-subtitle {
font-weight: bold !important;
}
.post-template-default .single-social-section {
display: none !important;
}
.mk-blog-single .theme-content {
padding: 0 !important;
}
#theme-page .theme-page-wrapper {
margin: 0 auto;
}
.car-offer .wpb_single_image {
margin-bottom: 0 !important;
}
.mk-blog-single .car-offer-price p {
background-color: #f0f0f0 !important;
padding: 10px 15px 10px 15px;
color: #002c5f !important;
}
.mk-blog-single .car-offer-price p strong {
color: #002c5f !important;
}
.car-offer table {
margin-bottom: 20px;
}
.mk-fancy-table.table-style1 td {
text-align: left !important; 
border-left: 2px solid #fff;
}
.mk-blog-single .car-offer-table tr:first-child {
font-weight: bold; 
}
.car-offer small,
.car-offer p small {
font-size: 11px;
line-height: 13px !important;
display: inline-block;
}
#hyundai-garantie {
background-color: #002c5f !important;
padding: 30px;
color: #fff !important;
}
#hyundai-garantie h3,
#hyundai-garantie p,
#hyundai-garantie a {
color: #fff !important;
}
@media only screen and (max-width: 600px)  { 
.car-offer table td {
font-size: 12px;
padding: 5px;
}
.car-offer small,
.car-offer p small {
font-size: 9px;
line-height: 11px !important;
display: inline-block;
}
.car-offer sub,
.car-offer sup {
font-size: 7px !important;
line-height: 7px !important;
}
}
.car-offer h1.car-offer-title {
font-weight: 700 !important;
font-size: 1.1em !important; text-transform: none;
color: #002c5f !important;
margin-bottom: 18px;
padding: 30px 15px 0 15px !important;
line-height: 1.3em !important;
}
.car-offer h1.car-offer-title p {
font-weight: 700 !important;
font-size: 1.1em !important;
line-height: 1.3em !important;
} .page-id-283 .wpcs_plugin_credits {
display:none !important;
}
#theme-page .dxim_ff_order_bar .dxim_set_order {
color: #fff;
padding: 12px 15px;
background-color: #ccc;
display: inline-block;
margin-right: 10px;
}
#wpcs_vehicle_archive .wpcs_grid .button_wrapper a {
padding: 5px; 
background-color: #ccc;
}
article.vehicle-on-archive a.dxim_button:link, 
article.vehicle-on-archive a.dxim_button:visited {
padding: 5px !important;
font-size: 80% !important;
}
.wpcs_button_wrapper {
gap: 10px !important;
} @media only screen and (max-width: 600px)  {
max-width: auto;
}
.single .dxim_section:first-child {
border-top: 1px solid #ededed;
padding-top: 25px;
}
.single #wpcs_template_content {
padding-top: 20px;
max-width: auto;
width: auto;
}
.single .price_wrapper {
display: inline-block;
margin-right: 20px;
} 
.single .price_wrapper .price_big {
color: #fff;
background-color: #002c5f;
padding: 10px;
display: inline-block;
}
.single .price_wrapper .vat {
display:block;
font-size: 0.8em;
}
.single .dxim_section_header {
font-size: 1.3em;
font-weight: bold;
color: #002c5f;
}
.single .bro_cta {
background-color: #F6F3F2;
padding: 20px;
border-top: none;
margin-top: 40px;
}
@media only screen and (min-width: 600px) {
.single .wpcs_contact_form input[type=text], 
.single .wpcs_contact_form input[type=email], 
.single .wpcs_contact_form textarea {
width: 60%;
}
}
.single .kind_of_request label,
.single .context label {
font-weight: bold;
}
.single .submit_privacy_wrapper a {
display: inline-block;
}
#vehicle_single_nav_buttons #vehicle_single_images_prev_btn {
width: 20px;
display: block;
float: left;
background-color: #fff;
border: 0 none;
}
#vehicle_single_nav_buttons #vehicle_single_images_next_btn {
width: 20px;
display: block;
float: right;
background-color: #fff;
border: 0 none;
} @media only screen and (min-width: 600px)  {
.bro-openings .vc_col-sm-4 {
width: 33% !important;
float: left;
}
}
.bro-openings .vc_col-sm-4 .vc_column-inner {
padding-left: 15px;
padding-right: 15px;
}
.bro_au_elements {
padding: 40px 0;
}
.bro_au_elements .bro_au_btn {
margin-right: 15px;
display: inline-block;
}
.au-widget-car-rating {
display: inline-block;
}
.bro_au_tags,
#wpcs_vehicle_archive .wpcs_tag {
padding: 2px 6px;
font-size: 80%;
display: inline-block;
font-weight: 400;
margin: 0 10px 10px 0;
background-color: #f7f7f7;
border: 1px solid #ccc;
color: #000;
}
#wpcs_vehicle_archive .wpcs_tag {
margin: 0 10px 10px 10px;
}
.dxim_vehicle_feature_list li {
margin-left: 0 !important;
}
#wpcs_template_content .dxim_section .dxim_vehicle_buttons a {
padding: 8px 10px;
font-size: 14px;
font-weight: 400;
font-weight: normal;
}
@media only screen and (max-width: 600px) {
.au-widget-car-rating {
display: block;
float: right !important;
}    
.bro_au_buttons {
padding: 0;
margin-bottom: 20px;
}
#wpcs_template_content .bro_au_buttons .auws-button,
#wpcs_template_content .dxim_section .dxim_vehicle_buttons a {
padding: 0px 3px !important;
font-size: 10px !important;
background-color: #ccc !important;
color: #000 !important;
border: 0 none !important;
}
.bro_au_btn,
.dxim_vehicle_buttons a {
margin-right: 3px !important;
}
#wpcs_vehicle_features,
#wpcs_vehicle_features ul,
#wpcs_vehicle_features ul li,
.wpcs_emission_data,
.dxim_vehicle_post_content {
font-size: 13px;
line-height: 1.5em;
}
} .dxim_pagination {
font-size: 0.8em;
}
.wpcs_pd_row .wpcs_pd_col.last {float: right;}
#wpcs_template_content {
padding: 0 15px;
width: 95% !important;
}
.wpcs_filterform_sidebar .wpcs_filter_form_grid .dxim_filter {
margin-bottom: 15px !important;
}
.archive .dxim_ff_order_bar a,
.archive .dxim_archive_title h2,
.archive .dxim_archive_title h2 a,
.archive .dxim_pagination a,
.archive .dxim_archive_title h3,
.archive .dxim_archive_title h3 a {
color: #002c5f;
}
#wpcs_vehicle_archive .wpcs_pd_col .wpcs_button_wrapper a,
.dxim_filter_form_submit,
.vehicle-on-archive .wpcs_button_wrapper a {
padding: 8px 10px;
font-size: 14px;
font-weight: 400;
font-weight: normal;
background-color: #ccc !important;
color: #000 !important;
border-radius: 0;
}
.archive .wpcs_grid .vehicle-on-archive {
border: 1px solid #ccc;
}
@media only screen and (max-width: 600px) {
.archive .vehicle-on-archive {
margin: 20px 0;
}
.archive .dxim_ff_order_bar,
.archive .dxim_ff_order_bar a,
.archive .dxim_pagination,
.archive .dxim_pagination a {
font-size: 13px !important;
}
}
.archive .vehicle-on-archive .dxim_archive_title,
.archive .vehicle-on-archive .dxim_archive_specifics,
.archive .vehicle-on-archive .dxim_vehicle_emission,
.archive .vehicle-on-archive .price_wrapper,
.archive .vehicle-on-archive .price_rating {
padding: 0 10px;
}
.archive .vehicle-on-archive .wpcs_button_wrapper {
padding: 10px;
}
.archive .vehicle-on-archive .wpcs_tag {
margin: 0 10px;
}
.archive .dxim_vehicle_emission {
font-size: 80%;
line-height: 1.3em;
} #bro-benefits-wrapper #bro-benefits h4 {
text-transform: none !important;
font-weight: normal !important;
font-family: 'Open Sans', sans-serif !important;
font-size: 18px !important;
padding-top: 8px;
}
#bro-benefits-wrapper #bro-benefits .bro-benefit-icon {
padding: 10px 0 !important;
font-family: 'Open Sans', sans-serif !important;
display: inline-block;
}
#bro-benefits-wrapper #bro-benefits .bro-benefit-icon .evc-iwt-icon {
color: #fff !important;
}
#bro-benefits-wrapper #bro-benefits .bro-benefit-icon .evc-iwt-icon-holder {
vertical-align: middle;
height: 40px;
width: 60px;
text-align: center;
} #theme-page .vc_tta-container .bro-jobs-toggle .vc_tta-panel-heading,
#theme-page .vc_tta-color-blue.vc_tta-style-classic .vc_tta-panel .vc_tta-panel-heading {
background-color: #002c5f !important;
border-color: #002c5f !important;
border: 0 none !important;
}
.bro-jobs-toggle .vc_tta-panel-title {
text-transform: uppercase;
font-size: 16px;
line-height: 1.5em !important;
color: #fff !important;
}
.bro-jobs-toggle .vc_active .vc_tta-panel-title a,
.bro-jobs-toggle .vc_active .vc_tta-panel-title h2 a {
color: #fff !important;
}
.bro-jobs-toggle .vc_tta-color-blue.vc_tta-style-classic .vc_active .vc_tta-panel-heading .vc_tta-controls-icon::before {
color: #fff !important;
border-color: #fff !important;
}
.bro-jobs-toggle .vc_tta.vc_general .vc_tta-panel-body {
padding: 30px 20px;
background-color: #f6f2f3 !important;
}
.bro-jobs-toggle .vc_tta-panel-body h2 {
font-size: 28px;
line-height: 1.2em !important;
}
.bro-jobs-toggle h2 .bro-jobs-toggle-badge {
font-size: 14px !important;
text-transform: none !important;
font-weight: 400 !important;
line-height: 1.2em !important;
}
.bro-jobs-toggle .vc_tta-panel-body h3,
.bro-jobs-toggle .vc_tta-panel-body h3 p {
font-size: 20px !important;
}
#bewerbung-formular .wpcf7 .wpcf7-textarea,
#bewerbung-formular .wpcf7 .wpcf7-file {
margin: 10px 0px;
}
#bewerbung-formular .wpcf7 .wpcf7-submit {
background-color: #002c5f !important;
color: #fff !important;
font-weight: 700 !important;
margin: 20px 0 30px 0;
}
#bewerbung-formular .wpcf7 .wpcf7-form-control-wrap {
margin: 5px 0;
} .footer-wrapper .menu li {float:left;display:inline-block;}
.footer-wrapper .menu li a {padding: 3px 10px !important;display:inline-block;margin-left:5px;}
.footer-wrapper #text-54 {padding-top: 10px;} #bro-footer-logos {text-align:center;padding: 30px 0;}
#bro-footer-logos img {margin: 10px;}
#bro-footer-logos .fachbetrieb img {margin: 0 10px 10px 10px;}
#bro-footer-logos .hyundai img {margin: 10px 10px 20px 10px; height: 68px !important;}
hr.bro-line {border: 0;height: 0;border-top: 1px solid rgba(0, 0, 0, 0.1);border-bottom: 1px solid rgba(255, 255, 255, 0.3);}
#sub-footer {text-align:center;}
#mk-footer #social-1 a,
#mk-theme-container #social-networks-174 a i {color:#002c5f !important;}
.footer-wrapper .bro-partner-left,
.footer-wrapper .bro-partner-right {width:50%; float:left;}
#bro-footer-logos .footer-wrapper .bro-partner-right img {max-height: 20px; margin: 30px 15px 0;}
@media only screen and (max-width: 600px) {
.footer-wrapper .bro-partner-left,
.footer-wrapper .bro-partner-right {width: 100%; float: none;}
.footer-wrapper .bro-partner-left {padding: 40px 0;}
.footer-wrapper .bro-partner-right {margin: 30px 0 0 0 0;padding: 60px 0 40px 0; border-top: 1px solid #ccc;}
} 
.bro-footer-logo-1,
.bro-footer-logo-2 {display:inline-block;}
.bro-footer-logo-1 {margin: 20px !important;}
.bro-action-box-h3 h3 {font-size: 24px !important;font-weight: 400 !important;}
@media only screen and (max-width: 600px)  { 
.bro-footer-logos {display:block;width:99%;float:none;text-align:center;}
} #bro-footer-logos .footer-wrapper {
padding-top: 30px;
}
#bro-footer-logos .mk-fancy-table.table-style2 {
border-bottom: none;
}
#bro-footer-logos .table-style2 h3 {
margin-top: 10px;
text-transform: uppercase;
color: #002c5f;
} .mk-employees .mk-employee-item .team-info-wrapper .team-member-name{
text-transform:none;
}
.mk-employees .team-thumbnail {
padding: 0 !important;
text-align: center;
}
.mk-employee-item .team-thumbnail img,
.mk-employee-item .team-info-wrapper {
max-width: 175px !important;
margin: 0 auto;
}
.mk-employee-item .item-holder .team-info-wrapper {
float: none !important;
display: block !important;
width: 100% !important;
padding: 0 !important;
}
.bro-team {
background-color: #f6f2f3 !important;
}
.bro-team .team_hover {
display:none;
}
.page-id-381 .team-info-wrapper {
position: relative;
}
.page-id-381 .bro-team .team-info-wrapper:hover .team_hover {
font-size:14px;
display:block;
position:absolute;
padding:30px;
z-index:1000 !important;
background-color:#ffffff;
text-align:left;
border:1px solid #ffffff;
left:-50px;
top:180px;
width:340px;
}
.page-id-381 div.vc_row.mk-fullwidth-true {
overflow: visible !important;
}
.page-id-381 .bro-team .team-info-wrapper:hover .team_hover_schmand {
left:-50px;
top:200px;
}
.page-id-381 .bro-team .team-info-wrapper .hover_left {
font-weight:bold;
margin-right:10px;
display:inline-block;
} 
@media only screen and (max-width: 768px)  {
.page-id-381 .bro-team .team-info-wrapper:hover .team_hover {
display:none !important;
}
}
.team-member-position {
font-size: 15px !important;
line-height: 1.3em !important;
}
.team-member-desc {
line-height: 1.4em !important;
}
.team-member-desc p {
color: #111 !important;
}
.team-member-name {
font-size: 18px !important;
margin-bottom: 20px !important;
}
.car-offer .bro-team h3,
.car-offer .bro-team h3 span p {
font-family: 'Open Sans', Arial, sans-serif !important;
} .bro-newsletter-form label {width:100%;display:block;}
.bro-newsletter-form input,
.bro-newsletter-form select {margin: 10px 14px 10px 0;width:100%;}
.cr_site{margin:0;padding:75px 0 0 0;text-align:center;background-color:#eeeeee;}
.cr_page{margin:0 auto 10px auto;text-align:left;border-radius:4px;}
.cr_header{text-align:center;background: transparent !Important;}
.cr_body label{float:none;clear:both;display:block;width:auto;margin-top:8px;text-align:left;font-weight:bold;position:relative;}
.cr_button{display:inline-block;font-family:'Open Sans', Arial, sans-serif;width:auto;white-space:nowrap;height:32px;margin:5px 5px 0 0;padding:0 22px;text-decoration:none;text-align:center;font-weight:bold;font-style:normal;font-size:15px;line-height:32px;cursor:pointer;border:0;-moz-border-radius:4px;border-radius:4px;-webkit-border-radius:4px;vertical-align:top;}
.cr_button{background-color:#333;color:#ffffff;}
.cr_button:hover,.cr_button-small:hover{opacity:0.7;filter:alpha(opacity=70);}
.cr_ipe_item label{line-height:150%;font-size:14px;}
.cr_ipe_item textarea {background: none repeat scroll 0 0 #eeeeee;border: 1px solid #aaa;font-family: Helvetica;font-size: 16px;}
.cr_ipe_item input {background: none repeat scroll 0 0 #eeeeee;border: 1px solid #aaa;padding: 5px;font-family: Helvetica;font-size: 16px;}
.cr_ipe_item select {background: none repeat scroll 0 0 #eeeeee;border: 1px solid #aaa;display: block;margin: 0;padding: 5px;width: 100%;font-family: Helvetica;font-size: 16px;}
.cr_ipe_item input.cr_ipe_radio, input.cr_ipe_checkbox {-moz-binding: none;-moz-box-sizing: border-box;background-color: -moz-field !important;border: 2px inset threedface !important;color: -moz-fieldtext !important;cursor: default;height: 13px;padding: 0 !important;width: 13px;}
.cr_ipe_item input.cr_ipe_radio{-moz-appearance: radio;border-radius: 100% 100% 100% 100% !important;margin: 3px 3px 0 5px;}
.submit_container{text-align:center}
.cr_ipe_item{ padding:1px 10px; margin:1px 10px; }
.cr_ipe_item.inactive {display:none;}
.cr_captcha{padding-left:130px;}
.cr_error{font-size:1.1em;padding:10px;}
.clever_form_error{background-color:#f99; color:#000; border:1px solid #f22 !important}
.clever_form_note {margin:26px 0 0 3px;position:absolute;display:inline; padding: 2px 4px; font-weight:bold;background-color:#f2ecb5; color:#000; font-size:12px !important;  } .page-id-2308 #bro-footer-newsletter, 
.page-id-26377 #bro-footer-newsletter, 
.page-id-26385 #bro-footer-newsletter, 
.page-id-6391 #bro-footer-newsletter, 
.page-id-26388 #bro-footer-newsletter, 
.page-id-26409 #bro-footer-newsletter, 
.page-id-26396 #bro-footer-newsletter {
display:none;
}
#bro-footer-newsletter {
background-color: #aacae6 !important;
color: #002c5f !important;
padding: 60px 40px !important;
}
#bro-footer-newsletter h3 {
color: #002c5f !important;
}
#bro-footer-newsletter a {
color: #002c5f !important;
text-decoration: underline;
}
#bro-footer-newsletter .col1,
#bro-footer-newsletter .col2 {
float: left;
width: 50%;
text-align: left;
color: #002c5f !important;
}
#bro-footer-newsletter .col1 p {
color: #002c5f !important;
}
#bro-footer-newsletter .col1 p {
margin: 10px 15px 10px 15px;
}
#bro-footer-newsletter .cr_page {
width: auto;
max-width: auto;
background-color: transparent;
}
#bro-footer-newsletter .cr_page .formbox,
#bro-footer-newsletter .cr_page .cr_body {
font-family: 'Open Sans', Helvetica, sans-serif;
color: #002c5f !important;
font-size: 16px !important;
line-height: 1.66em !important;
}
@media only screen and (max-width: 768px) {
#bro-footer-newsletter [class*="col"] {
float: none;
width: 100%;
}
#bro-footer-newsletter .cr_page {
width: 300px !important;
max-width: 300px !important;
}
#bro-footer-newsletter .cr_ipe_item {
margin: 0 !important;
}
} .bro-footer-sub {
margin-top: 40px;
margin-left: 10%;
margin-right: 10%;
margin-bottom: 10px;
font-size:12px;
text-align:center;
line-height: 1.6em;
}
.bro-footer-copyright {
display:block;
width:100%;
text-align:center;
font-size:12px;
} #popmake-28561 {width: auto !important;}  #bro-start-cta.vc_row {
display: flex;
flex-wrap: wrap;
align-items: stretch;
} #bro-start-cta .wpb_column {
display: flex;
flex-direction: column;
height: auto;
} #bro-start-cta .wpb_single_image {
margin: 0;
}
#bro-start-cta .wpb_single_image .vc_single_image-wrapper,
#bro-start-cta .wpb_single_image figure.wpb_wrapper {
display: block;
height: 260px; overflow: hidden;
} #bro-start-cta .wpb_single_image img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
display: block;
} #bro-start-cta .vc_cta3-container {
flex: 1 1 auto;
display: flex;
}
#bro-start-cta .vc_cta3-container .vc_general.vc_cta3 {
display: flex;
flex-direction: column;
width: 100%;
} #bro-start-cta .vc_cta3-actions {
margin-top: auto;
} @media (max-width: 991px) {
#bro-start-cta .wpb_single_image .vc_single_image-wrapper,
#bro-start-cta .wpb_single_image figure.wpb_wrapper {
height: 220px;
}
}
@media (max-width: 767px) {
#bro-start-cta .wpb_column {
flex: 0 0 100%;
max-width: 100%;
width: 100%;
}
#bro-start-cta .wpb_single_image .vc_single_image-wrapper,
#bro-start-cta .wpb_single_image figure.wpb_wrapper {
height: 320px;
} #bro-start-cta .wpb_column,
#bro-start-cta .vc_column_container,
#bro-start-cta .wpb_wrapper {
padding-left: 0 !important;
padding-right: 0 !important;
}
#bro-start-cta .vc_cta3-container,
#bro-start-cta .vc_cta3-container .vc_general.vc_cta3 {
width: 100%;
margin-left: 0;
margin-right: 0;
} #bro-start-cta .vc_cta3_content-container,
#bro-start-cta .vc_cta3-content,
#bro-start-cta .vc_cta3-actions {
padding-left: 20px;
padding-right: 20px;
}
} .steps-box {
background-color: #aacae6;
border-radius: 12px;
padding: 48px 32px;
font-family: 'Open Sans', Arial, sans-serif;
}
.steps-box .steps-title {
color: #002c5f;
font-family: 'Open Sans', Arial, sans-serif;
font-size: 24px;
font-weight: 700;
text-align: center;
margin: 0 0 16px;
}
.steps-box .steps-intro {
color: #002c5f;
font-family: 'Open Sans', Arial, sans-serif;
font-size: 16px;
line-height: 1.5;
text-align: center;
max-width: 800px;
margin: 0 auto 40px;
}
.steps-wrapper {
display: flex;
align-items: stretch;
justify-content: center;
gap: 16px;
max-width: 1100px;
margin: 0 auto;
}
.step-card {
flex: 1 1 0;
text-align: center;
padding: 24px 16px;
}
.step-number {
width: 64px;
height: 64px;
margin: 0 auto 16px;
border: 2px solid #002c5f;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
color: #002c5f;
font-family: 'Open Sans', Arial, sans-serif;
font-size: 28px;
font-weight: 700;
}
.step-heading {
color: #002c5f;
font-family: 'Open Sans', Arial, sans-serif;
font-size: 20px;
font-weight: 700;
margin: 0 0 12px;
}
.step-text {
color: #676767;
font-family: 'Open Sans', Arial, sans-serif;
font-size: 16px;
line-height: 1.5;
margin: 0;
}
.step-arrow {
display: flex;
align-items: center;
justify-content: center;
color: #002c5f;
font-size: 28px;
flex: 0 0 auto;
}
@media (max-width: 768px) {
.steps-box {
padding: 32px 20px;
}
.steps-wrapper {
flex-direction: column;
gap: 24px;
}
.step-arrow {
display: none;
}
.step-card {
padding: 16px;
}
}
.steps-cta {
text-align: center;
margin-top: 40px;
}
.steps-button {
display: inline-block;
background-color: #002c5f;
color: #ffffff !important;
font-family: 'Open Sans', Arial, sans-serif;
font-size: 16px;
font-weight: 700;
text-decoration: none;
padding: 16px 36px;
border-radius: 6px;
transition: background-color 0.2s ease;
}
.steps-button:hover {
background-color: #001f42;
color: #ffffff !important;
} @media (max-width: 768px) {
.steps-wrapper {
flex-direction: column;
gap: 24px;
}
.step-arrow {
display: none;
}
.step-card {
padding: 16px;
}
} .page-id-30291 #bro-footer-logos {display: none;} #start_neuwagen.bro-blog-loop {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 20px;
margin: 40px 0;
} @media (min-width: 1025px) {
#start_neuwagen.bro-blog-loop {
padding: 0 20px;
}
}
@media (max-width: 1024px) {
#start_neuwagen.bro-blog-loop {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 600px) {
#start_neuwagen.bro-blog-loop {
grid-template-columns: 1fr;
}
}
#start_neuwagen .bro_loop_card_1 {
display: flex;
flex-direction: column;
background: #fff;
border: 1px solid #e3e6ea;
border-radius: 4px;
overflow: hidden;
transition: box-shadow .2s ease, transform .2s ease;
}
#start_neuwagen .bro_loop_card_1:hover {
box-shadow: 0 8px 24px rgba(0, 0, 0, .08);
transform: translateY(-2px);
}
#start_neuwagen .bro_loop_card_1 .bro-post-thumb-link {
display: block;
}
#start_neuwagen .bro_loop_card_1 .bro-post-thumb {
position: relative;
background: #c7cdd3;
}
#start_neuwagen .bro_loop_card_1 .bro-post-image,
#start_neuwagen .bro_loop_card_1 .bro-post-image--placeholder {
display: block;
width: 100%;
aspect-ratio: 4 / 3;
object-fit: cover;
}
#start_neuwagen .bro_loop_card_1 .bro-post-image--placeholder {
background: #c7cdd3;
} #start_neuwagen .bro_loop_card_1 .bro_tag {
position: absolute;
top: 0;
left: 0;
right: auto;
bottom: auto;
z-index: 2;
padding: 4px 14px;
font-size: 12px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
color: #fff;
white-space: nowrap;
}
#start_neuwagen .bro_loop_card_1 .bro_tag--leasing {
background: #007fa8; }
#start_neuwagen .bro_loop_card_1 .bro_tag--dark {
background: #10151b; }
#start_neuwagen .bro_loop_card_1 .bro-post-content {
display: flex;
flex-direction: column;
flex-grow: 1;
padding: 24px;
}
#start_neuwagen .bro_loop_card_1 .bro-post-eyebrow {
margin: 0 0 4px;
min-height: 15px;
font-size: 12px;
font-weight: 600;
letter-spacing: .04em;
text-transform: uppercase;
color: #767c83;
}
#start_neuwagen .bro_loop_card_1 .bro-eyebrow-dot {
vertical-align: super;
font-size: .6em;
margin: 0 3px;
} #start_neuwagen .bro_loop_card_1 .bro-post-title {
margin: 0 0 14px;
min-height: 56px;
font-size: 21px;
line-height: 1.3;
text-transform: none !important; }
#start_neuwagen .bro_loop_card_1 .bro-post-title a {
color: #10151b;
text-decoration: none;
cursor: pointer;
}
#start_neuwagen .bro_loop_card_1 .bro-post-title a:hover {
text-decoration: none;
}
#start_neuwagen .bro_loop_card_1 .bro-excerpt {
flex-grow: 1;
margin-bottom: 20px;
font-size: 15px;
line-height: 1.5;
color: #333;
} #start_neuwagen .bro_loop_card_1 .bro-excerpt p::first-line {
font-weight: 600;
} #start_neuwagen .bro_loop_card_1 .bro-excerpt strong {
display: inline-block;
margin-top: 4px;
margin-bottom: 10px;
font-size: 23px;
font-weight: 700;
color: #10456e;
} #start_neuwagen .bro_loop_card_1 .bro-price {
display: inline-block;
margin-top: 4px;
margin-bottom: 10px;
font-size: 26px;
font-weight: 800;
white-space: nowrap;
color: #10151b; }
#start_neuwagen .bro_loop_card_1 .bro-price-label {
font-size: 13px;
font-weight: 400;
white-space: nowrap;
color: #767c83;
margin-left: 4px;
} #start_neuwagen .bro_loop_card_1 .bro-excerpt-small {
display: block;
margin-top: 4px;
font-size: 13px !important;
line-height: 1.5;
color: #767c83;
}
#start_neuwagen .bro_loop_card_1 .bro-details-button {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 13px;
font-weight: 700;
letter-spacing: .04em;
text-transform: none;
color: #10456e;
text-decoration: none;
}
#start_neuwagen .bro_loop_card_1 .bro-details-button .bro-arrow {
transition: transform .2s ease;
}
#start_neuwagen .bro_loop_card_1 .bro-details-button:hover .bro-arrow {
transform: translateX(4px);
} .bro-loop-intro {
max-width: 1400px;
margin: 0 auto 40px;
padding: 0 20px;
}
.bro-loop-intro .bro-loop-intro__eyebrow {
margin: 0 0 8px;
font-size: 12px;
font-weight: 600;
letter-spacing: .04em;
text-transform: uppercase;
color: #007fa8;
}
.bro-loop-intro .bro-loop-intro__row {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 32px;
}
.bro-loop-intro .bro-loop-intro__text {
max-width: 720px;
}
.bro-loop-intro .bro-loop-intro__title {
margin: 0 0 12px;
font-size: clamp(28px, 3vw, 36px);
font-weight: 800;
line-height: 1.2;
color: #000000;
}
.bro-loop-intro .bro-loop-intro__desc {
margin: 0;
font-size: 15px;
line-height: 1.5;
color: #676767;
}
.bro-loop-intro .bro-loop-intro__button {
display: inline-flex;
flex-shrink: 0;
align-items: center;
gap: 6px;
padding: 12px 24px;
border: 2px solid #002c5f;
font-size: 13px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
color: #002c5f;
background: transparent;
text-decoration: none;
white-space: nowrap;
transition: background-color .2s ease, color .2s ease;
}
.bro-loop-intro .bro-loop-intro__button .bro-arrow {
transition: transform .2s ease;
}
.bro-loop-intro .bro-loop-intro__button:hover {
background: #002c5f;
color: #ffffff;
}
.bro-loop-intro .bro-loop-intro__button:hover .bro-arrow {
transform: translateX(4px);
} .bro-loop-intro .bro-loop-intro__button:focus-visible {
outline: 3px solid #002c5f;
outline-offset: 2px;
}
@media (max-width: 768px) {
.bro-loop-intro .bro-loop-intro__row {
flex-direction: column;
align-items: flex-start;
gap: 20px;
}
.bro-loop-intro .bro-loop-intro__button {
align-self: stretch;
justify-content: center;
}
} #start_themen.bro-blog-loop-2 {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 0 48px;
max-width: 1400px;
margin: 40px auto;
padding: 0 20px; }
@media (max-width: 700px) {
#start_themen.bro-blog-loop-2 {
grid-template-columns: 1fr;
gap: 0;
}
}
#start_themen .bro_loop_card_2 {
border-bottom: 1px solid #e4dcd3; }
#start_themen .bro_loop_card_2 .bro-loop-2-link {
position: relative;
display: block;
padding: 20px 44px 20px 0;
text-decoration: none;
color: inherit;
}
#start_themen .bro_loop_card_2 .bro-loop-2-title {
margin: 0 0 6px;
font-size: 17px;
font-weight: 700;
line-height: 1.35;
color: #000000; text-transform: none !important;
}
#start_themen .bro_loop_card_2 .bro-loop-2-excerpt {
margin: 0;
font-size: 14px;
line-height: 1.5;
color: #676767; }
#start_themen .bro_loop_card_2 .bro-loop-2-excerpt p {
margin: 0;
}
#start_themen .bro_loop_card_2 .bro-loop-2-arrow {
position: absolute;
right: 8px;
bottom: 14px;
display: flex;
align-items: center;
justify-content: center;
width: 26px;
height: 26px;
border-radius: 50%;
background: #002c5f; color: #ffffff;
transition: transform .2s ease, background-color .2s ease;
}
#start_themen .bro_loop_card_2 .bro-loop-2-arrow svg {
display: block;
}
#start_themen .bro_loop_card_2 .bro-loop-2-link:hover .bro-loop-2-arrow,
#start_themen .bro_loop_card_2 .bro-loop-2-link:focus-visible .bro-loop-2-arrow {
transform: translateX(4px);
background: #007fa8; }
#start_themen .bro_loop_card_2 .bro-loop-2-link:focus-visible {
outline: 3px solid #002c5f;
outline-offset: 2px;
} .bro-text-link {
color: #000000;
text-decoration: none;
}
.bro-text-link:hover,
.bro-text-link:focus-visible {
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: 2px;
}
.bro-text-link:focus-visible {
outline: 3px solid #002c5f;
outline-offset: 2px;
} .bro-btn {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 12px 24px;
font-size: 13px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
text-decoration: none;
white-space: nowrap;
border: 2px solid transparent; transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.bro-btn .bro-arrow {
transition: transform .2s ease;
}
.bro-btn:hover .bro-arrow {
transform: translateX(4px);
}
.bro-btn:focus-visible {
outline: 3px solid #002c5f;
outline-offset: 2px;
}
.bro-btn--solid {
background: #002c5f;
color: #ffffff;
}
.bro-btn--solid:hover {
background: #007fa8;
}
.bro-btn--outline {
background: transparent;
color: #002c5f;
border-color: #002c5f; }
.bro-btn--outline:hover {
background: #002c5f;
color: #ffffff;
}
.bro-btn--sand {
background: #e4dcd3; color: #002c5f;
}
.bro-btn--sand:hover {
background: #002c5f;
color: #ffffff;
} #start_about.bro-about {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 48px;
align-items: center;
max-width: 1400px;
margin: 60px auto;
padding: 0 20px;
}
#start_about .bro-about__media {
background: #cfd4d9;
aspect-ratio: 4 / 3;
display: flex;
align-items: center;
justify-content: center;
}
#start_about .bro-about__image {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
#start_about .bro-about__eyebrow {
margin: 0 0 8px;
font-size: 12px;
font-weight: 600;
letter-spacing: .04em;
text-transform: uppercase;
color: #007fa8;
}
#start_about .bro-about__title {
margin: 0 0 16px;
font-size: clamp(28px, 3vw, 36px);
font-weight: 800;
line-height: 1.2;
color: #000000;
}
#start_about .bro-about__desc {
margin: 0 0 16px;
font-size: 15px;
line-height: 1.6;
color: #676767;
max-width: 620px;
}
#start_about .bro-about__desc:last-of-type {
margin-bottom: 24px;
}
#start_about .bro-about__buttons {
display: flex;
flex-wrap: wrap;
gap: 16px;
}
@media (max-width: 768px) {
#start_about.bro-about {
grid-template-columns: 1fr;
}
} #start_benefits.bro-benefits {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 48px;
align-items: start; max-width: 1400px;
margin: 60px auto;
padding: 0 20px;
}
#start_benefits .bro-benefits__eyebrow {
margin: 0 0 10px;
font-size: 13px;
font-weight: 700;
letter-spacing: .03em;
text-transform: uppercase;
color: #007fa8; max-width: 480px;
}
#start_benefits .bro-benefits__title {
margin: 0 0 16px;
font-size: clamp(26px, 2.6vw, 32px);
font-weight: 800;
line-height: 1.2;
color: #000000;
}
#start_benefits .bro-benefits__desc {
margin: 0 0 16px;
font-size: 15px;
line-height: 1.6;
color: #676767;
max-width: 560px;
}
#start_benefits .bro-benefits__list {
list-style: none;
margin: 0 0 28px;
padding: 24px 0;
display: flex;
flex-direction: column;
gap: 18px;
}
#start_benefits .bro-benefits__list li {
position: relative;
padding-left: 32px;
font-size: 15px;
line-height: 1.4;
color: #000000;
}
#start_benefits .bro-benefits__list li::before {
content: "\2713";
position: absolute;
left: 0;
top: 0;
width: 22px;
height: 22px;
border-radius: 50%;
background: #002c5f;
color: #ffffff;
font-size: 12px;
line-height: 22px;
text-align: center;
}
#start_benefits .bro-benefits__media {
display: flex;
flex-direction: column; }
#start_benefits .bro-benefits__image {
display: block;
width: 100%;
height: auto;
aspect-ratio: 4 / 3;
object-fit: cover;
background: #eef1f4;
border: 1px solid #e4dcd3;
}
#start_benefits .bro-benefits__panorama {
display: block;
width: 100%;
height: auto;
aspect-ratio: 21 / 9;
object-fit: cover;
border: 1px solid #e4dcd3;
margin-top: 5px;
}
@media (max-width: 768px) {
#start_benefits.bro-benefits {
grid-template-columns: 1fr;
}
#start_benefits .bro-benefits__media {
order: -1;
}
} #start_service_2.bro-service-split {
display: grid;
grid-template-columns: 2fr 1fr;
gap: 20px;
max-width: 1400px;
margin: 60px auto;
padding: 0 20px;
}
#start_service_2 .bro-service-split__stack {
display: flex;
flex-direction: column;
gap: 20px;
}
@media (max-width: 900px) {
#start_service_2.bro-service-split {
grid-template-columns: 1fr;
}
}
#start_service_2 .bro-service-split__card,
#start_info .bro-service-split__card {
border: 1px solid #e3e6ea; border-radius: 4px;
background: #f6f3f2; display: flex;
flex-direction: column;
overflow: hidden; transition: box-shadow .2s ease, transform .2s ease;
}
#start_service_2 .bro-service-split__card:hover,
#start_info .bro-service-split__card:hover {
box-shadow: 0 8px 24px rgba(0, 0, 0, .08);
transform: translateY(-2px);
}
#start_service_2_jobs.bro-service-split__card {
background: #ffffff;
} #start_service_2 .bro-service-split__body,
#start_info .bro-service-split__body {
padding: 28px;
display: flex;
flex-direction: column;
flex: 1 1 auto;
}
#start_service_2 .bro-service-split__card--large .bro-service-split__body {
padding: 40px;
}
#start_service_2 .bro-service-split__media,
#start_info .bro-service-split__media {
display: block;
width: 100%;
aspect-ratio: 16 / 9;
object-fit: cover;
}
#start_service_2 .bro-service-split__eyebrow,
#start_info .bro-service-split__eyebrow {
margin: 0 0 8px;
font-size: 12px;
font-weight: 600;
letter-spacing: .04em;
text-transform: uppercase;
color: #007fa8;
}
#start_service_2 .bro-service-split__title,
#start_info .bro-service-split__title {
margin: 0 0 10px;
font-size: 19px;
font-weight: 700;
line-height: 1.3;
color: #000000;
text-transform: none !important;
}
#start_service_2_jobs .bro-service-split__title a {
color: #000000;
text-decoration: none;
}
#start_service_2 .bro-service-split__card--large .bro-service-split__title {
font-size: 26px;
}
#start_service_2 .bro-service-split__desc,
#start_info .bro-service-split__desc {
margin: 0 0 16px;
font-size: 14px;
line-height: 1.6;
color: #676767;
}
#start_service_2 .bro-service-split__card--large .bro-service-split__desc {
font-size: 15px;
max-width: 480px;
}
#start_service_2 .bro-service-split__link,
#start_info .bro-service-split__link {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 13px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
color: #002c5f;
text-decoration: none;
margin-top: auto;
}
#start_service_2 .bro-service-split__link .bro-arrow,
#start_info .bro-service-split__link .bro-arrow {
transition: transform .2s ease;
}
#start_service_2 .bro-service-split__link:hover .bro-arrow,
#start_service_2 .bro-service-split__link:focus-visible .bro-arrow,
#start_info .bro-service-split__link:hover .bro-arrow,
#start_info .bro-service-split__link:focus-visible .bro-arrow {
transform: translateX(4px);
}
#start_service_2 .bro-service-split__link:focus-visible,
#start_info .bro-service-split__link:focus-visible {
outline: 3px solid #002c5f;
outline-offset: 2px;
} #start_service_2_gewerbe.bro-service-split__card.bro-service-split__card--large {
position: relative;
background-image: url(https://www.autohaus-broehan.de/wp-content/uploads/2026/09/broehan-hero-fahrzeug-2000px.webp);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
border-color: #e3e6ea;
}
#start_service_2_gewerbe.bro-service-split__card .bro-service-split__eyebrow,
#start_service_2_gewerbe.bro-service-split__card .bro-service-split__title,
#start_service_2_gewerbe.bro-service-split__card .bro-service-split__desc,
#start_service_2_gewerbe.bro-service-split__card .bro-service-split__link {
color: #ffffff !important; } #start_service_2_gewerbe.bro-service-split__card {
position: relative;
}
#start_service_2_gewerbe .bro-service-split__cardlink {
color: inherit;
text-decoration: none;
}
#start_service_2_gewerbe .bro-service-split__cardlink::after {
content: "";
position: absolute;
inset: 0;
z-index: 1;
}
#start_service_2_gewerbe .bro-service-split__cardlink:focus-visible {
outline: 3px solid #ffffff;
outline-offset: 2px;
} #start_service_2_gewerbe .bro-service-split__ghostrow {
position: relative;
z-index: 2;
display: flex;
flex-wrap: wrap;
gap: 12px;
margin-top: auto;
}
#start_service_2_gewerbe .bro-service-split__ghostbtn {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 10px 20px;
border: 1px solid #ffffff;
border-radius: 0;
color: #ffffff;
font-size: 13px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
text-decoration: none;
transition: background-color .2s ease;
}
#start_service_2_gewerbe .bro-service-split__ghostbtn .bro-arrow {
transition: transform .2s ease;
}
#start_service_2_gewerbe .bro-service-split__ghostbtn:hover .bro-arrow,
#start_service_2_gewerbe .bro-service-split__ghostbtn:focus-visible .bro-arrow {
transform: translateX(4px);
}
#start_service_2_gewerbe .bro-service-split__ghostbtn:hover {
background: rgba(255, 255, 255, .15);
}
#start_service_2_gewerbe .bro-service-split__ghostbtn:focus-visible {
outline: 3px solid #ffffff;
outline-offset: 2px;
}
#start_service_2_gewerbe.bro-service-split__card .bro-service-split__link:focus-visible {
outline: 3px solid #ffffff;
outline-offset: 2px;
} #start_info.bro-info {
max-width: 1400px;
margin: 60px auto;
padding: 0 20px;
}
#start_info .bro-info__card {
border: 1px solid #e3e6ea;
border-radius: 4px;
background: #ffffff;
padding: 40px;
}
#start_info .bro-info__header {
display: flex;
flex-wrap: wrap;
align-items: flex-end;
justify-content: space-between;
gap: 12px;
margin: 0 0 32px;
}
#start_info .bro-info__eyebrow {
margin: 0 0 8px;
font-size: 12px;
font-weight: 600;
letter-spacing: .04em;
text-transform: uppercase;
color: #007fa8;
}
#start_info .bro-info__title {
margin: 0;
font-size: 28px;
font-weight: 800;
line-height: 1.25;
color: #000000;
text-transform: none !important;
}
#start_info .bro-info__note {
margin: 0 0 4px;
font-size: 14px;
color: #676767;
} #start_info .bro-info__hours {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 32px;
margin: 0 0 32px;
}
#start_info .bro-info__hours-title {
margin: 0 0 12px;
padding-bottom: 12px;
font-size: 19px;
font-weight: 700;
line-height: 1.3;
color: #000000;
text-transform: none !important;
border-bottom: 2px solid #002c5f;
}
#start_info .bro-info__hours-sub {
margin-left: 6px;
font-size: 12px;
font-weight: 600;
letter-spacing: .04em;
text-transform: uppercase;
color: #676767;
}
#start_info .bro-info__hours-list {
display: flex;
flex-direction: column;
}
#start_info .bro-info__hours-row {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 12px;
padding: 10px 0;
border-bottom: 1px solid #e3e6ea;
font-size: 15px;
}
#start_info .bro-info__hours-row:last-child {
border-bottom: none;
}
#start_info .bro-info__hours-day {
color: #676767;
}
#start_info .bro-info__hours-time {
font-weight: 700;
color: #000000;
text-align: right;
} #start_info .bro-info__charge {
display: flex;
align-items: flex-start;
gap: 20px;
background: #f6f3f2;
border-radius: 4px;
padding: 24px 28px;
margin: 0 0 32px;
}
#start_info .bro-info__charge-icon {
flex: 0 0 auto;
width: 28px;
height: 28px;
color: #1a7a42; }
#start_info .bro-info__charge-body {
min-width: 0;
}
#start_info .bro-info__charge-title {
margin: 0 0 6px;
font-size: 17px;
font-weight: 700;
line-height: 1.3;
color: #1a7a42; text-transform: none !important;
}
#start_info .bro-info__charge-desc {
margin: 0 0 12px;
font-size: 14px;
line-height: 1.6;
color: #000000;
}
#start_info .bro-info__charge-links {
margin: 0;
font-size: 13px;
}
#start_info .bro-info__charge-label {
font-weight: 600;
letter-spacing: .04em;
text-transform: uppercase;
color: #676767;
margin-right: 6px;
}
#start_info .bro-info__charge-links a {
color: #1a7a42; font-weight: 700;
text-decoration: underline;
margin-right: 16px;
}
#start_info .bro-info__charge-links a:last-child {
margin-right: 0;
} #start_info .bro-info__locations {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 40px;
}
#start_info .bro-info__location {
padding-left: 0;
}
#start_info .bro-info__location + .bro-info__location {
padding-left: 40px;
border-left: 1px solid #e3e6ea;
}
#start_info .bro-info__location-eyebrow {
margin: 0 0 6px;
font-size: 12px;
font-weight: 600;
letter-spacing: .04em;
text-transform: uppercase;
color: #007fa8;
}
#start_info .bro-info__location-name {
margin: 0 0 8px;
font-size: 18px;
font-weight: 700;
line-height: 1.3;
color: #000000;
text-transform: none !important;
}
#start_info .bro-info__location-address,
#start_info .bro-info__location-phone {
margin: 0 0 4px;
font-size: 14px;
line-height: 1.5;
color: #676767;
}
#start_info .bro-info__location-phone {
margin: 0 0 20px;
}
#start_info .bro-info__anfahrt-btn {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 12px 20px;
background: #002c5f;
color: #ffffff;
font-size: 13px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
text-decoration: none;
border-radius: 0;
transition: background-color .2s ease;
}
#start_info .bro-info__anfahrt-btn .bro-arrow {
transition: transform .2s ease;
}
#start_info .bro-info__anfahrt-btn:hover {
background: #001f42;
}
#start_info .bro-info__anfahrt-btn:hover .bro-arrow,
#start_info .bro-info__anfahrt-btn:focus-visible .bro-arrow {
transform: translateX(4px);
}
#start_info .bro-info__anfahrt-btn:focus-visible {
outline: 3px solid #002c5f;
outline-offset: 2px;
}
@media (max-width: 900px) {
#start_info .bro-info__hours {
grid-template-columns: 1fr;
gap: 24px;
}
#start_info .bro-info__locations {
grid-template-columns: 1fr;
gap: 24px;
}
#start_info .bro-info__location + .bro-info__location {
padding-left: 0;
border-left: none;
padding-top: 24px;
border-top: 1px solid #e3e6ea;
}
}
@media (max-width: 600px) {
#start_info .bro-info__card {
padding: 24px;
}
#start_info .bro-info__header {
flex-direction: column;
align-items: flex-start;
}
} #start_service.bro-service-teaser {
max-width: 1400px;
margin: 60px auto;
padding: 0 20px;
}
#start_service .bro-service-teaser__eyebrow {
margin: 0 0 8px;
font-size: 12px;
font-weight: 600;
letter-spacing: .04em;
text-transform: uppercase;
color: #007fa8;
}
#start_service .bro-service-teaser__header {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 32px;
margin-bottom: 32px;
}
#start_service .bro-service-teaser__text {
max-width: 720px;
}
#start_service .bro-service-teaser__title {
margin: 0 0 8px;
font-size: clamp(26px, 2.6vw, 32px);
font-weight: 800;
line-height: 1.2;
color: #000000;
}
#start_service .bro-service-teaser__desc {
margin: 0;
font-size: 15px;
line-height: 1.5;
color: #676767;
}
#start_service .bro-service-teaser__grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 20px;
}
@media (max-width: 1024px) {
#start_service .bro-service-teaser__grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 600px) {
#start_service .bro-service-teaser__grid {
grid-template-columns: 1fr;
}
#start_service .bro-service-teaser__header {
flex-direction: column;
align-items: flex-start;
gap: 16px;
}
}
#start_service .bro-service-teaser-card {
display: flex;
flex-direction: column;
}
#start_service .bro-service-teaser-card__media {
background: #c7cdd3;
aspect-ratio: 4 / 3;
}
#start_service .bro-service-teaser-card__image {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
#start_service .bro-service-teaser-card__body {
background: #f6f3f2; padding: 20px;
flex-grow: 1;
}
#start_service .bro-service-teaser-card__title {
margin: 0 0 8px;
font-size: 18px;
font-weight: 700;
line-height: 1.3;
color: #000000;
}
#start_service .bro-service-teaser-card__title a {
color: #002c5f; text-decoration: none;
}
#start_service .bro-service-teaser-card__title a:hover {
text-decoration: none;
}
#start_service .bro-service-teaser-card__title a:focus-visible {
outline: 3px solid #002c5f;
outline-offset: 2px;
}
#start_service .bro-service-teaser-card__desc {
margin: 0 0 14px;
font-size: 14px;
line-height: 1.5;
color: #676767;
}
#start_service .bro-service-teaser-card__link {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 13px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
color: #002c5f;
text-decoration: none;
}
#start_service .bro-service-teaser-card__link .bro-arrow {
transition: transform .2s ease;
}
#start_service .bro-service-teaser-card__link:hover .bro-arrow,
#start_service .bro-service-teaser-card__link:focus-visible .bro-arrow {
transform: translateX(4px);
}
#start_service .bro-service-teaser-card__link:focus-visible {
outline: 3px solid #002c5f;
outline-offset: 2px;
} #start_service_horizontal.bro-service-horizontal {
max-width: 1400px;
margin: 60px auto;
padding: 0 20px;
}
#start_service_horizontal .bro-service-horizontal__eyebrow {
margin: 0 0 8px;
font-size: 12px;
font-weight: 600;
letter-spacing: .04em;
text-transform: uppercase;
color: #007fa8; }
#start_service_horizontal .bro-service-horizontal__header {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 32px;
margin-bottom: 32px;
}
#start_service_horizontal .bro-service-horizontal__text {
max-width: 640px;
}
#start_service_horizontal .bro-service-horizontal__title {
margin: 0 0 8px;
font-size: clamp(24px, 2.4vw, 30px);
font-weight: 800;
line-height: 1.2;
color: #000000;
text-transform: none !important;
}
#start_service_horizontal .bro-service-horizontal__desc {
margin: 0;
font-size: 15px;
line-height: 1.6;
color: #676767;
} #start_service_horizontal .bro-service-horizontal__grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-auto-rows: auto;
gap: 20px;
}
#start_service_horizontal .bro-service-horizontal-card--highlight {
grid-column: 1;
grid-row: 1 / span 2;
}
@media (max-width: 900px) {
#start_service_horizontal .bro-service-horizontal__grid {
grid-template-columns: 1fr;
}
#start_service_horizontal .bro-service-horizontal-card--highlight {
grid-column: auto;
grid-row: auto;
}
#start_service_horizontal .bro-service-horizontal__header {
flex-direction: column;
align-items: flex-start;
}
}
#start_service_horizontal .bro-service-horizontal-card {
display: flex;
flex-direction: column;
} #start_service_horizontal .bro-service-horizontal-card {
background: #fff;
border: 1px solid #e3e6ea;
border-radius: 4px;
overflow: hidden;
transition: box-shadow .2s ease, transform .2s ease;
}
#start_service_horizontal .bro-service-horizontal-card:hover {
box-shadow: 0 8px 24px rgba(0, 0, 0, .08);
transform: translateY(-2px);
}
#start_service_horizontal .bro-service-horizontal-card__media {
flex: 0 0 auto;
width: 100%;
height: 300px;
background: #c7cdd3;
position: relative;
}
#start_service_horizontal .bro-service-horizontal-card__badge {
position: absolute;
top: 0;
left: 0;
z-index: 1;
background: #007fa8; color: #ffffff;
font-size: 12px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
padding: 8px 16px;
}
#start_service_horizontal .bro-service-horizontal-card__badge--dark {
background: #002c5f; }
#start_service_horizontal .bro-service-horizontal-card__media a {
display: block;
width: 100%;
height: 100%;
}
#start_service_horizontal .bro-service-horizontal-card__image {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top; }
#start_service_horizontal .bro-service-horizontal-card__body {
flex: 1 1 auto;
background: #ffffff;
padding: 24px;
display: flex;
flex-direction: column;
}
#start_service_horizontal .bro-service-horizontal-card__eyebrow {
margin: 0 0 6px;
font-size: 12px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
color: #676767; }
#start_service_horizontal .bro-service-horizontal-card__title {
margin: 0 0 8px;
font-size: 18px;
font-weight: 700;
line-height: 1.3;
color: #000000;
text-transform: none !important;
}
#start_service_horizontal .bro-service-horizontal-card__title a {
color: #002c5f; text-decoration: none;
}
#start_service_horizontal .bro-service-horizontal-card__title a:hover {
text-decoration: none;
}
#start_service_horizontal .bro-service-horizontal-card__title a:focus-visible {
outline: 3px solid #002c5f;
outline-offset: 2px;
}
#start_service_horizontal .bro-service-horizontal-card__desc {
margin: 0 0 14px;
font-size: 14px;
line-height: 1.5;
color: #676767;
}
#start_service_horizontal .bro-service-horizontal-card__pricetag {
margin: 0 0 14px;
font-size: 28px;
font-weight: 800;
color: #002c5f; }
#start_service_horizontal .bro-service-horizontal-card__link {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 13px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
color: #002c5f; text-decoration: none;
margin-top: auto;
}
#start_service_horizontal .bro-service-horizontal-card__link .bro-arrow {
transition: transform .2s ease;
}
#start_service_horizontal .bro-service-horizontal-card__link:hover .bro-arrow,
#start_service_horizontal .bro-service-horizontal-card__link:focus-visible .bro-arrow {
transform: translateX(4px);
}
#start_service_horizontal .bro-service-horizontal-card__link:focus-visible {
outline: 3px solid #002c5f;
outline-offset: 2px;
} #start_service_horizontal .bro-service-horizontal-card--highlight,
#start_service_horizontal .bro-service-horizontal-card--tip {
flex-direction: column;
}
#start_service_horizontal .bro-service-horizontal-card--highlight .bro-service-horizontal-card__body,
#start_service_horizontal .bro-service-horizontal-card--tip .bro-service-horizontal-card__body {
flex: 1 1 auto;
}
#start_service_horizontal .bro-service-horizontal-card--tip .bro-service-horizontal-card__body {
justify-content: center;
} #start_service_horizontal .bro-service-horizontal-card--highlight .bro-service-horizontal-card__body {
background: #002c5f; padding: 32px 28px;
}
#start_service_horizontal .bro-service-horizontal-card__kicker {
margin: 0 0 8px;
font-size: 12px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase; color: #4db8d9;
}
#start_service_horizontal .bro-service-horizontal-card--highlight .bro-service-horizontal-card__title {
color: #ffffff !important; font-size: 24px;
margin: 0 0 16px;
}
#start_service_horizontal .bro-service-horizontal-card__hr {
margin: 20px -28px 50px;
border: none;
border-top: 1px solid #4db8d9;
}
#start_service_horizontal .bro-service-horizontal-card__pricelist {
margin: 0 0 24px;
display: flex;
flex-direction: column;
gap: 20px;
}
#start_service_horizontal .bro-service-horizontal-card__pricerow {
display: flex;
flex-direction: row-reverse;
justify-content: flex-end;
align-items: flex-start;
gap: 46px;
} #start_service_horizontal .bro-service-horizontal-card__pricerow dt {
margin: 0;
font-size: 17px;
font-weight: 700;
line-height: 1.3;
color: #ffffff;
} #start_service_horizontal .bro-service-horizontal-card__pricesub {
display: block;
margin-top: 4px;
font-size: 13px;
font-weight: 400;
color: rgba(255, 255, 255, .7);
}
#start_service_horizontal .bro-service-horizontal-card__pricerow dd {
margin: 0;
flex: 0 0 auto;
min-width: 100px;
text-align: right;
}
#start_service_horizontal .bro-service-horizontal-card__price {
font-size: 34px;
font-weight: 800;
color: #ffffff;
white-space: nowrap;
} #start_service_horizontal .bro-service-horizontal-card__freebox {
background: rgba(255, 255, 255, .06);
border-radius: 8px;
padding: 20px 24px;
margin: 0 0 20px;
}
#start_service_horizontal .bro-service-horizontal-card__kicker--free {
margin-bottom: 12px;
}
#start_service_horizontal .bro-service-horizontal-card__freelist {
list-style: none !important;
margin: 0 !important;
padding: 0 !important;
display: flex;
flex-direction: column;
gap: 12px;
}
#start_service_horizontal .bro-service-horizontal-card__freelist li {
display: flex;
align-items: center;
gap: 10px;
margin: 0 !important;
padding: 0 !important;
font-size: 16px;
font-weight: 700;
color: #ffffff;
}
#start_service_horizontal .bro-service-horizontal-card__check {
flex: 0 0 auto;
width: 20px;
height: 20px;
color: #4db8d9;
}
#start_service_horizontal .bro-service-horizontal-card__fineprint {
margin: auto 0 20px;
font-size: 12px;
line-height: 1.5;
color: rgba(255, 255, 255, .6);
} #start_service_horizontal .bro-service-horizontal-card__cta {
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 14px 24px;
background: #007fa8; color: #ffffff;
font-size: 13px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
text-decoration: none;
border-radius: 4px;
transition: background-color .2s ease;
}
#start_service_horizontal .bro-service-horizontal-card__cta:hover {
background: #00688a;
}
#start_service_horizontal .bro-service-horizontal-card__cta:focus-visible {
outline: 3px solid #ffffff;
outline-offset: 2px;
}
#start_service_horizontal .bro-service-horizontal-card__cta .bro-arrow {
transition: transform .2s ease;
}
#start_service_horizontal .bro-service-horizontal-card__cta:hover .bro-arrow,
#start_service_horizontal .bro-service-horizontal-card__cta:focus-visible .bro-arrow {
transform: translateX(4px);
} #start_service_horizontal .bro-service-horizontal-card--tip .bro-service-horizontal-card__body {
background: #e4dcd3; padding: 28px 24px;
} #start_service_horizontal .bro-service-horizontal-card__kicker--tip {
color: #002c5f;
}
#start_service_horizontal .bro-service-horizontal-card--tip .bro-service-horizontal-card__title {
font-size: 22px;
line-height: 1.25;
}
#start_service_horizontal .bro-service-horizontal-card--tip .bro-service-horizontal-card__desc {
color: #000000; } #start_service_horizontal .bro-service-horizontal-card__tipgrid {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
gap: 20px;
margin: 12px 0 20px;
}
#start_service_horizontal .bro-service-horizontal-card__statbox {
flex: 0 0 auto;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
gap: 4px;
background: #002c5f; border-radius: 4px;
padding: 20px 24px;
min-width: 110px;
}
#start_service_horizontal .bro-service-horizontal-card__statnum {
font-size: 40px;
font-weight: 800;
line-height: 1;
color: #ffffff;
}
#start_service_horizontal .bro-service-horizontal-card__statlabel {
font-size: 12px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
color: #4db8d9;
}
#start_service_horizontal .bro-service-horizontal-card__tiptext {
flex: 1 1 200px;
min-width: 180px;
}
#start_service_horizontal .bro-service-horizontal-card__tiptext .bro-service-horizontal-card__title {
margin: 0 0 10px;
}
#start_service_horizontal .bro-service-horizontal-card__tiptext .bro-service-horizontal-card__desc {
margin: 0;
} #start_hero.bro-hero {
position: relative;
} #start_hero .bro-hero__media {
position: relative;
height: 560px;
overflow: hidden;
display: flex;
align-items: center;
}
@media (max-width: 600px) {
#start_hero .bro-hero__media {
height: 320px;
} #start_hero .bro-hero__badge {
font-size: 18px;
margin-bottom: 14px;
}
#start_hero .bro-hero__title {
font-size: 28px;
margin-bottom: 12px;
}
#start_hero .bro-hero__desc {
font-size: 16px;
}
}
#start_hero .bro-hero__image {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
background: #c7cdd3;
}
#start_hero .bro-hero__content {
position: relative;
z-index: 1;
max-width: 1400px;
margin: 0 auto;
padding: 0 20px;
width: 100%;
text-align: right;
}
#start_hero .bro-hero__badge {
display: inline-block;
margin: 0 0 24px;
color: #ffffff;
font-family: 'Hyundai Sans Head', sans-serif !important;
font-size: 30px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
}
#start_hero .bro-hero__title {
max-width: 780px;
margin: 0 0 20px auto;
font-family: 'Hyundai Sans Head', sans-serif !important;
font-size: 51px;
font-weight: 700;
line-height: 1.2;
color: #ffffff;
}
#start_hero .bro-hero__desc {
max-width: 560px;
margin: 0 0 0 auto;
font-family: 'Hyundai Sans Head', sans-serif !important;
font-size: 30px;
font-weight: 700;
line-height: 1.3;
color: #e4dcd3; } #start_hero .bro-hero__tiles {
position: relative;
z-index: 2;
margin: -70px auto 0;
max-width: 1200px;
padding: 0 20px;
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 24px;
}
#start_hero .bro-hero__tile {
position: relative;
aspect-ratio: 4 / 3;
background: #002c5f;
overflow: hidden;
text-decoration: none;
}
#start_hero .bro-hero__tile-image {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
transition: transform .3s ease;
} #start_hero .bro-hero__tile--hyundai .bro-hero__tile-image {
object-position: center 65%;
} #start_hero .bro-hero__tile--gebrauchtwagen .bro-hero__tile-image,
#start_hero .bro-hero__tile--probefahrt .bro-hero__tile-image {
object-position: center 85%;
}
#start_hero .bro-hero__tile:hover .bro-hero__tile-image {
transform: scale(1.05);
} #start_hero .bro-hero__tile-label {
position: absolute;
left: 50%;
bottom: 20px;
z-index: 1;
transform: translateX(-50%);
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
max-width: calc(100% - 32px);
padding: 10px 20px;
background: transparent;
border: 1px solid #ffffff;
color: #ffffff;
font-family: "Hyundai Sans Head", sans-serif;
font-size: 13px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
text-align: center;
transition: background-color .2s ease;
}
#start_hero .bro-hero__tile:hover .bro-hero__tile-label,
#start_hero .bro-hero__tile:focus-visible .bro-hero__tile-label {
background: rgba(255, 255, 255, .15);
}
#start_hero .bro-hero__tile-label .bro-arrow {
transition: transform .2s ease;
}
#start_hero .bro-hero__tile:hover .bro-hero__tile-label .bro-arrow,
#start_hero .bro-hero__tile:focus-visible .bro-hero__tile-label .bro-arrow {
transform: translateX(4px);
}
#start_hero .bro-hero__tile:focus-visible {
outline: 3px solid #ffffff;
outline-offset: -3px;
}
@media (max-width: 600px) {
#start_hero .bro-hero__content {
padding: 0 20px;
}
}
@media (max-width: 700px) {
#start_hero .bro-hero__tiles {
margin-top: -50px;
grid-template-columns: repeat(2, 1fr);
gap: 16px;
}
#start_hero .bro-hero__tile-label {
font-size: 12px;
padding: 8px 14px;
}
} #start_hero_2.bro-hero {
position: relative;
display: flex;
align-items: center;
min-height: 560px;
overflow: hidden;
}
#start_hero_2 .bro-hero__media {
position: absolute;
inset: 0;
}
#start_hero_2 .bro-hero__image {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
background: #c7cdd3;
} #start_hero_2 .bro-hero__overlay {
position: absolute;
inset: 0;
background: rgba(0, 44, 95, .84); }
#start_hero_2 .bro-hero__content {
position: relative;
z-index: 1;
max-width: 1400px;
margin: 0 auto;
padding: 80px 20px;
width: 100%;
}
#start_hero_2 .bro-hero__badge {
display: inline-block;
margin: 0 0 24px;
padding: 8px 16px;
background: #007fa8; color: #ffffff;
font-size: 13px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
}
#start_hero_2 .bro-hero__title {
max-width: 780px;
margin: 0 0 20px;
font-size: clamp(32px, 4.2vw, 52px);
font-weight: 800;
line-height: 1.2;
color: #ffffff;
}
#start_hero_2 .bro-hero__desc {
max-width: 560px;
margin: 0 0 32px;
font-size: 17px;
line-height: 1.6;
color: #e4dcd3; }
#start_hero_2 .bro-hero__buttons {
display: flex;
flex-wrap: wrap;
gap: 16px;
}
#start_hero_2 .bro-hero__btn {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 14px 28px;
font-size: 13px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
text-decoration: none;
white-space: nowrap;
border: 2px solid transparent;
transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
#start_hero_2 .bro-hero__btn .bro-arrow {
transition: transform .2s ease;
}
#start_hero_2 .bro-hero__btn:hover .bro-arrow {
transform: translateX(4px);
}
#start_hero_2 .bro-hero__btn:focus-visible {
outline: 3px solid #ffffff;
outline-offset: 2px;
}
#start_hero_2 .bro-hero__btn--solid {
background: #007fa8; color: #ffffff;
}
#start_hero_2 .bro-hero__btn--solid:hover {
background: #ffffff;
color: #002c5f;
}
#start_hero_2 .bro-hero__btn--outline {
background: transparent;
color: #ffffff;
border-color: #ffffff;
}
#start_hero_2 .bro-hero__btn--outline:hover {
background: #ffffff;
color: #002c5f;
}
@media (max-width: 600px) {
#start_hero_2.bro-hero {
min-height: 0;
}
#start_hero_2 .bro-hero__content {
padding: 56px 20px;
}
#start_hero_2 .bro-hero__buttons {
flex-direction: column;
align-items: stretch;
}
#start_hero_2 .bro-hero__btn {
justify-content: center;
}
}