@charset "UTF-8";
/******************************************/
/*************** IMPORTS ******************/
/******************************************/
@import url("https://fonts.googleapis.com/css?family=Roboto:300,400,700&display=swap&subset=latin-ext");
/*********** reset ***********/
html {
color: #000000;
background: #fff;
}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, figure {
margin: 0;
padding: 0;
line-height: 100%;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
fieldset, img {
border: 0;
}
legend, .invisible {
display: none;
}
address, caption, cite, code, dfn, strong, th, var {
font-style: normal;
}
ol, ul {
list-style-type: none;
}
caption, th {
text-align: left;
}
q:before, q:after {
content: "";
}
abbr, acronym {
border: 0;
font-variant: normal;
}
input, textarea, select {
font-family: inherit;
font-size: inherit;
font-weight: inherit;
}
inputs, textarea, select {
font-size: 100%;
}
legend {
color: #000000;
}
del, ins {
text-decoration: none;
}
h1, h2, h3, h4, h5, h6 {
font-weight: normal;
}
.invisible {
display: none !important;
}
input {
background: none;
border: none;
}
/* Slider */
.slick-slider {
position: relative;
display: block;
box-sizing: border-box;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}
.slick-list {
position: relative;
overflow: hidden;
display: block;
margin: 0;
padding: 0;
}
.slick-list:focus {
outline: none;
}
.slick-list.dragging {
cursor: pointer;
cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list {
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.slick-track {
position: relative;
left: 0;
top: 0;
display: block;
margin-left: auto;
margin-right: auto;
}
.slick-track:before, .slick-track:after {
content: "";
display: table;
}
.slick-track:after {
clear: both;
}
.slick-loading .slick-track {
visibility: hidden;
}
.slick-slide {
float: left;
height: 100%;
min-height: 1px;
display: none;
}
[dir=rtl] .slick-slide {
float: right;
}
.slick-slide img {
display: block;
}
.slick-slide.slick-loading img {
display: none;
}
.slick-slide.dragging img {
pointer-events: none;
}
.slick-initialized .slick-slide {
display: block;
}
.slick-loading .slick-slide {
visibility: hidden;
}
.slick-vertical .slick-slide {
display: block;
height: auto;
border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
display: none;
}
/******************************************/
/***************** TEXTS ******************/
/******************************************/
/******************************************/
/***************** LAYOUT *****************/
/******************************************/
/******************************************/
/**************** COLORS ******************/
/******************************************/
/************** MAIN COLORS ***************/
/*
Kolory identyfikacji klienta i pozostałe zdefiniowane w projekcie. Potem używane w innych zmiennych czyli np. Kolor separatora = brand 1, color nagłówka = brand 2 itd., jasne tło = szary 1 itd.
*/
/*** brand ***/
/*** grays ***/
/*** others ***/
/************** BACKGROUNDS ***************/
/***************** TEXTS ******************/
/************* ICONS/POINTERS *************/
/******* BORDERS / SEPARATORS *******/
/************** LINKS ***************/
/************** BUTTONS ***************/
/************** TABLES ***************/
/*
$color-table-border: ''; //color obramowania
$color-table-bg: ''; //color tła
$color-table-text: ''; //color tekstu
$color-table-bg--even: ''; //color tła even
$color-table-bg--odd: ''; //color tła odd
$color-table-text--even: ''; //color tekstu even
$color-table-text--odd: ''; //color tekstu odd
$color-table-border--header: ''; //color obramowania nagłówka
$color-table-text--header: ''; //color tekstu nagłówka
$color-table-bg--header: ''; //color tła nagłówka
*/
/******************************************/
/***************** SPACES *****************/
/******************************************/
/*
try to use semantic version
if not possible then use multiplication version
eventualy use $space-size-baze with mathematical operation * / + -
*/
/******************************************/
/***************** OTHERS *****************/
/******************************************/
/******************************************/
/************* PROJECT RELATED ************/
/******************************************/
/*** rwd breakpoints ***/
/******************************************/
/***************** ICONS ******************/
/******************************************/
/*
https://css-tricks.com/creating-a-maintainable-icon-system-with-sass/
https://codepen.io/taupecat/pen/ZgazEb?editors=1100
*/
/*
page: /ikony
module: zestaw-icon
template: migoVendor/contao-migo-app-bundle/src/Resources/contao/templates/mod_html_icons.html5
*/
.ico-example {
margin: 20px;
border: 1px solid #ddd;
width: 64px;
height: 64px;
float: left;
}
.ico-example.ico-example--big {
width: 160px;
height: 160px;
}
.ico-example.arrow-up {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.arrow-right {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.arrow-down {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.arrow-left {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.chevron-up {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.chevron-right {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.chevron-down {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.chevron-left {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.search {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.check {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.plus {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.close {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.map-pointer {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.list {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.section-sign {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.compare {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.login {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.email {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.phone {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.phone-mail {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.facebook {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.twitter {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.skype {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.triangle-left {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.ico-example.triangle-right {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
/******************************************/
/***************** UTILS ******************/
/******************************************/
.u-hidden {
display: none;
}
.center, .u-center {
text-align: center;
}
.u-mask {
display: block;
z-index: 20;
cursor: pointer;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
text-indent: -999em;
overflow: hidden;
}
.ce_image:after,
.ce_text:after,
.ce_gallery:after, .u-clear-fix:after {
content: "";
clear: both;
display: table;
}
.l-top .mod_search .formbody, .c-widget.c-widget--search, .l-top-ui__lang .c-widget--lang, .c-top-mobile .c-top-mobile__search, .c-widget.c-widget--mobile-menu, .u-shadow-box, .slick-prev,
.slick-next, .c-link-ico.c-link-ico--circle {
/*
background-color: #fff;
-webkit-box-shadow: 0px 0px 15px 0px rgba(171,171,171,1);
-moz-box-shadow: 0px 0px 15px 0px rgba(171,171,171,1);
box-shadow: 0px 0px 15px 0px rgba(171,171,171,1);
*/
}
.mod_pagelist .categories-menu ul, .l-footer__menu .cl-grid.cl-grid--three .ce_text ul, .mod_navigation ul,
.l-top ul,
.l-footer ul, .ce_gallery ul,
#main .ce_gallery ul, .u-raw-list, #main .ce_downloads ul, .pagination ul, .c-pagination, .mod_breadcrumb ul, .c-breadcrumb {
padding-left: 0;
margin: 0;
}
.mod_pagelist .categories-menu ul li, .l-footer__menu .cl-grid.cl-grid--three .ce_text ul li, .mod_navigation ul li,
.l-top ul li,
.l-footer ul li, .ce_gallery ul li,
#main .ce_gallery ul li, .u-raw-list li, #main .ce_downloads ul li, .pagination ul li, .c-pagination li, .mod_breadcrumb ul li, .c-breadcrumb li {
padding-left: 0;
margin-bottom: 0;
overflow: inherit;
}
.mod_pagelist .categories-menu ul li:before, .l-footer__menu .cl-grid.cl-grid--three .ce_text ul li:before, .mod_navigation ul li:before,
.l-top ul li:before,
.l-footer ul li:before, .ce_gallery ul li:before,
#main .ce_gallery ul li:before, .u-raw-list li:before, #main .ce_downloads ul li:before, .pagination ul li:before, .c-pagination li:before, .mod_breadcrumb ul li:before, .c-breadcrumb li:before {
display: none;
}
/******************************************/
/************** LINKS / ICONS *************/
/******************************************/
.c-link, .more a, .more .c-link-ico,
a.more,
.more.c-link-ico, .c-link--more, .back a, .back .c-link-ico,
a.back,
.back.c-link-ico, .c-link--back {
cursor: pointer;
line-height: 120%;
color: #FDCA00;
text-decoration: none;
outline: none;
}
.c-link:hover, .more a:hover, .more .c-link-ico:hover,
a.more:hover,
.more.c-link-ico:hover, .c-link--more:hover, .back a:hover, .back .c-link-ico:hover,
a.back:hover,
.back.c-link-ico:hover, .c-link--back:hover {
color: #FDCA00;
text-decoration: underline;
}
/**************** MORE *****************/
.more a, .more .c-link-ico,
a.more,
.more.c-link-ico, .c-link--more, .back a, .back .c-link-ico,
a.back,
.back.c-link-ico, .c-link--back {
line-height: 120%;
color: #06081A;
text-transform: uppercase;
text-decoration: none;
font-weight: 700;
line-height: 20px;
padding-right: 20px;
background: url('data:image/svg+xml;utf-8,') center right no-repeat;
background-size: 15px 15px;
}
.more a:hover, .more .c-link-ico:hover,
a.more:hover,
.more.c-link-ico:hover, .c-link--more:hover, .back a:hover, .back .c-link-ico:hover,
a.back:hover,
.back.c-link-ico:hover, .c-link--back:hover {
color: #FDCA00;
text-decoration: underline;
}
.back a, .back .c-link-ico,
a.back,
.back.c-link-ico, .c-link--back {
background: url('data:image/svg+xml;utf-8,') center left no-repeat;
background-size: 15px 15px;
padding-right: 0;
padding-left: 20px;
}
/**************** ICO *****************/
.c-link-ico {
display: inline-block;
text-indent: -999em;
overflow: hidden;
height: 32px;
width: 32px;
border: none;
background-position: center;
background-repeat: no-repeat;
text-decoration: none;
}
.c-link-ico.c-link-ico--big {
height: 50px;
width: 50px;
}
.c-link-ico.c-link-ico--circle {
height: 64px;
width: 64px;
border-radius: 32px;
background-color: #fff;
}
/**** link OLD CODE *****/
/*
.c-link{
&.c-link--ico-text{
@include flex(flex-start, center, nowrap);
min-height: $icoSize;
padding-left: $icoSize + $size-space-half;
border: none;
background-color: transparent;
background-position: left;
background-repeat: no-repeat;
text-decoration: none;
&.c-link--ico-big{
min-height: $icoSizeBig;
padding-left: $icoSizeBig + $size-space-half;
font-size: $font-size-base + 2;
font-weight: 600;
}
}
&.c-link--text-ico{
@include flex(flex-start, center, nowrap);
min-height: $icoSize;
padding-right: $icoSize + $size-space-half;
background-color: transparent;
background-position: right;
background-repeat: no-repeat;
text-decoration: none;
&.c-link--ico-big{
min-height: $icoSizeBig;
padding-right: $icoSizeBig + $size-space-half;
}
}
}
*/
/******************************************/
/**************** BUTTONS *****************/
/******************************************/
/*** inline button ***/
#main .formbody .widget.widget-submit .submit,
#footer .formbody .widget.widget-submit .submit, .ce_hyperlink.cc-btn.c-btn--block > a, .ce_hyperlink.cc-btn.c-btn--block > .c-link-ico, .ce_hyperlink.cc-btn > a, .ce_hyperlink.cc-btn > .c-link-ico, .c-btn.c-btn--block, .c-btn {
position: relative;
display: inline-block;
box-sizing: border-box;
margin: 5px;
padding: 12px 50px;
line-height: 20px;
text-align: center;
text-decoration: none;
cursor: pointer;
border: 3px solid #FDCA00;
border-radius: 4px;
color: #000000;
background-color: #ffffff;
font-size: 14px;
font-weight: 700;
text-transform: uppercase;
}
#main .formbody .widget.widget-submit .submit:hover,
#footer .formbody .widget.widget-submit .submit:hover, .ce_hyperlink.cc-btn > a:hover, .ce_hyperlink.cc-btn > .c-link-ico:hover, .c-btn:hover, #main .formbody .widget.widget-submit .submit:active,
#footer .formbody .widget.widget-submit .submit:active, .ce_hyperlink.cc-btn > a:active, .ce_hyperlink.cc-btn > .c-link-ico:active, .c-btn:active, #main .formbody .widget.widget-submit .submit:focus,
#footer .formbody .widget.widget-submit .submit:focus, .ce_hyperlink.cc-btn > a:focus, .ce_hyperlink.cc-btn > .c-link-ico:focus, .c-btn:focus, #main .formbody .widget.widget-submit .active.submit,
#footer .formbody .widget.widget-submit .active.submit, .ce_hyperlink.cc-btn > a.active, .ce_hyperlink.cc-btn > .active.c-link-ico, .active.c-btn {
background-color: #FDCA00;
color: #000000;
text-decoration: none;
}
/*** block ****/
#main .formbody .widget.widget-submit .submit,
#footer .formbody .widget.widget-submit .submit, .ce_hyperlink.cc-btn.c-btn--block > a, .ce_hyperlink.cc-btn.c-btn--block > .c-link-ico, .c-btn.c-btn--block {
display: table;
margin: 30px 0;
}
@media all and (min-width: 0px) and (max-width: 575px) {
#main .formbody .widget.widget-submit .submit,
#footer .formbody .widget.widget-submit .submit, .ce_hyperlink.cc-btn.c-btn--block > a, .ce_hyperlink.cc-btn.c-btn--block > .c-link-ico, .c-btn.c-btn--block {
max-width: 100%;
}
}
/*** small ****/
.ce_hyperlink.cc-btn.c-btn--sm > a, .ce_hyperlink.cc-btn.c-btn--sm > .c-link-ico, .c-btn.c-btn--sm {
margin: 5px;
padding: 6px 20px;
line-height: 18px;
font-size: 14px;
}
.ce_hyperlink.cc-btn.c-btn--sm.c-btn--block > a, .ce_hyperlink.cc-btn.c-btn--sm.c-btn--block > .c-link-ico, .c-btn.c-btn--sm.c-btn--block {
margin: 20px 0;
}
.ce_hyperlink.cc-btn.c-btn--sm.c-btn--wrapped > a, .ce_hyperlink.cc-btn.c-btn--sm.c-btn--wrapped > .c-link-ico, .ce_hyperlink.cc-btn.c-btn--sm.c-btn--block.c-btn--wrapped > a, .c-btn.c-btn--sm.c-btn--wrapped, .c-btn.c-btn--sm.c-btn--block.c-btn--wrapped {
max-width: 200px;
}
.ce_hyperlink.cc-btn.c-btn--sm.c-btn--block > a, .ce_hyperlink.cc-btn.c-btn--sm.c-btn--block > .c-link-ico, .ce_hyperlink.cc-btn.c-btn--sm.c-btn--fixed > a, .ce_hyperlink.cc-btn.c-btn--sm.c-btn--fixed > .c-link-ico, .ce_hyperlink.cc-btn.c-btn--sm.c-btn--block.c-btn--fixed > a, .c-btn.c-btn--sm.c-btn--block, .c-btn.c-btn--sm.c-btn--fixed, .c-btn.c-btn--sm.c-btn--block.c-btn--fixed {
width: 200px;
}
/*** width behavior ****/
.ce_hyperlink.cc-btn.c-btn--block.c-btn--wrapped > a, .ce_hyperlink.cc-btn.c-btn--block.c-btn--wrapped > .c-link-ico, .ce_hyperlink.cc-btn.c-btn--wrapped > a, .ce_hyperlink.cc-btn.c-btn--wrapped > .c-link-ico, .c-btn.c-btn--block.c-btn--wrapped, .c-btn.c-btn--wrapped {
width: auto;
max-width: 300px;
}
.ce_hyperlink.cc-btn.c-btn--block > a, .ce_hyperlink.cc-btn.c-btn--block > .c-link-ico, .ce_hyperlink.cc-btn.c-btn--fixed > a, .ce_hyperlink.cc-btn.c-btn--fixed > .c-link-ico, .c-btn.c-btn--block, .c-btn.c-btn--fixed {
width: 300px;
max-width: none;
}
.ce_hyperlink.cc-btn.c-btn--block.c-btn--auto > a, .ce_hyperlink.cc-btn.c-btn--block.c-btn--auto > .c-link-ico, .ce_hyperlink.cc-btn > a, .ce_hyperlink.cc-btn > .c-link-ico, .c-btn.c-btn--block.c-btn--auto, .c-btn {
width: auto;
max-width: none;
}
.ce_hyperlink.cc-btn.c-btn--block.c-btn--w100 > a, .ce_hyperlink.cc-btn.c-btn--block.c-btn--w100 > .c-link-ico, .c-btn.c-btn--block.c-btn--w100 {
width: 100%;
max-width: none;
}
/******************************************/
/************* BASIC / TEXTS **************/
/******************************************/
/************* IMAGE / FIGURE *************/
.ce_image .image_container,
.ce_text .image_container,
.ce_gallery .image_container, .image, .c-image__container {
position: relative;
}
.ce_image .image_container img,
.ce_text .image_container img,
.ce_gallery .image_container img, .image img, .c-image__container .c-image {
display: block;
width: auto;
height: auto;
max-height: 100%;
max-width: 100%;
border-radius: 0;
}
/***************** LISTS ******************/
ul, ol {
padding-left: 0;
margin: 30px 0;
}
ul li, ol li {
position: relative;
padding-left: 30px;
margin-bottom: 20px;
overflow: hidden;
}
ul li:before, ol li:before {
content: "";
position: absolute;
left: 0;
/*** line ***/
top: 7px;
/*** icon ***/
top: 2px;
width: 14px;
height: 14px;
background: url('data:image/svg+xml;utf-8,') center no-repeat;
background-size: 14px 14px;
}
ul li ul, ol li ol {
padding-left: 10px;
}
/***************** LISTS ******************/
ol {
counter-reset: list;
}
ol li:before {
width: auto;
height: auto;
top: 0;
left: 0;
transform: none;
background: none;
counter-increment: list;
content: counter(list) ".";
color: #FDCA00;
}
/***************** TABLE *****************/
@media all and (min-width: 0px) and (max-width: 575px) {
.ce_table, .c-table__container {
overflow: scroll;
}
}
.l-table, table {
width: 100%;
}
@media all and (min-width: 992px) {
.l-table, table {
display: table;
}
}
.l-table .l-table__row {
display: table-row;
}
@media all and (min-width: 992px) {
.l-table .l-table__row {
display: table-row;
}
}
.l-table .l-table__row .l-table__cell, table tbody td,
table tfoot td,
table tbody th {
font-weight: 300;
padding: 20px 20px;
}
@media all and (min-width: 992px) {
.l-table .l-table__row .l-table__cell, table tbody td,
table tfoot td,
table tbody th {
display: table-cell;
}
}
table thead th {
padding: 20px 20px;
border-bottom: 3px solid #FDCA00;
font-size: 16px;
font-weight: 700;
text-transform: uppercase;
}
table tbody tr:nth-child(even) td,
table tbody tr:nth-child(even) th {
background-color: #ECEFF1;
}
table tbody tr:nth-child(odd) td,
table tbody tr:nth-child(odd) th {
background-color: #ffffff;
}
/******************************************/
/******* MODULES / CONTENT ELEMENT ********/
/******************************************/
/****************** MENU *****************/
/*** horizontal ***/
.cc-menu.cc-menu--horizontal ul, .c-menu.c-menu--horizontal {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
.cc-menu.cc-menu--horizontal li, .c-menu.c-menu--horizontal .c-menu__item {
margin-right: 30px;
}
.cc-menu.cc-menu--horizontal li:last-child, .c-menu.c-menu--horizontal .c-menu__item:last-child {
margin-right: 0;
}
/*** vertical ***/
.cc-menu.cc-menu--vertical li, .c-menu.c-menu--vertical .c-menu__item {
padding: 5px 0;
margin-bottom: 10px;
border-bottom: 1px solid #FDCA00;
}
.cc-menu.cc-menu--vertical li a, .cc-menu.cc-menu--vertical li .c-link-ico, .c-menu.c-menu--vertical .c-menu__item .c-link {
text-decoration: none;
}
/************** BREADCRUMBS ***************/
.mod_breadcrumb ul, .c-breadcrumb {
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
}
.mod_breadcrumb ul li, .c-breadcrumb .c-breadcrumb__item {
position: relative;
overflow: visible;
line-height: 120%;
margin-right: 25px;
margin-bottom: 10px;
}
.mod_breadcrumb ul li:after, .c-breadcrumb .c-breadcrumb__item:after {
content: "/";
position: absolute;
right: -15px;
}
.mod_breadcrumb ul li:first-child, .c-breadcrumb .c-breadcrumb__item:first-child {
margin-left: 0;
}
.mod_breadcrumb ul li:last-child, .c-breadcrumb .c-breadcrumb__item:last-child {
margin-right: 0;
}
.mod_breadcrumb ul li:last-child:after, .c-breadcrumb .c-breadcrumb__item:last-child:after {
display: none;
}
.mod_breadcrumb ul li a, .mod_breadcrumb ul li .c-link-ico, .c-breadcrumb .c-breadcrumb__item-link {
color: #06081A;
text-decoration: none;
}
.mod_breadcrumb ul li a:hover, .mod_breadcrumb ul li .c-link-ico:hover, .c-breadcrumb .c-breadcrumb__item-link:hover {
color: #FDCA00;
text-decoration: underline;
}
.mod_breadcrumb ul li.active, .c-breadcrumb .c-breadcrumb__item-link.active {
color: #FDCA00;
text-decoration: none;
}
/*************** PAGINATION ****************/
.pagination ul, .c-pagination {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: nowrap;
padding-top: 30px;
padding-bottom: 30px;
}
.pagination ul li > *, .c-pagination .c-pagination__item {
display: block;
width: 60px;
height: 60px;
line-height: 60px;
margin: 5px;
border: 3px solid #E5E5E5;
border-radius: 3px;
text-align: center;
text-decoration: none;
font-weight: 700;
color: #06081A;
}
.pagination ul li > .active, .pagination ul li > a:hover, .pagination ul li > .c-link-ico:hover, .c-pagination .c-pagination__item.is-active, .c-pagination .c-pagination__item:hover {
color: #FDCA00;
border-bottom-color: #FDCA00;
}
.pagination ul li.next > *, .c-pagination .c-pagination__item.c-pagination__item--next {
text-indent: -999em;
overflow: hidden;
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.pagination ul li.next > :hover, .c-pagination .c-pagination__item.c-pagination__item--next:hover {
background-image: url('data:image/svg+xml;utf-8,');
}
.pagination ul li.previous > *, .c-pagination .c-pagination__item.c-pagination__item--prev {
text-indent: -999em;
overflow: hidden;
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.pagination ul li.previous > :hover, .c-pagination .c-pagination__item.c-pagination__item--prev:hover {
background-image: url('data:image/svg+xml;utf-8,');
}
/*************** SLICK SLIDER **************/
.slick-prev,
.slick-next {
position: absolute;
top: calc(50% - 32px);
cursor: pointer;
text-indent: -999em;
z-index: 30;
border: none;
background-position: center;
background-repeat: no-repeat;
outline: none !important;
height: 64px;
width: 64px;
background-color: transparent;
}
.slick-prev {
background-image: url('data:image/svg+xml;utf-8,');
background-size: 64px 64px;
}
@media all and (max-width: 991px) {
.slick-prev {
left: 0;
}
}
@media all and (min-width: 992px) {
.slick-prev {
left: 10px;
}
}
.slick-next {
background-image: url('data:image/svg+xml;utf-8,');
background-size: 64px 64px;
}
@media all and (max-width: 991px) {
.slick-next {
right: 0;
}
}
@media all and (min-width: 992px) {
.slick-next {
right: 10px;
}
}
@media all and (max-width: 991px) {
.slick-list {
margin-left: 60px;
margin-right: 60px;
}
}
@media all and (min-width: 992px) {
.slick-list {
margin-left: 90px;
margin-right: 90px;
}
}
.slider--no-arrows .slick-list {
margin-left: 0;
margin-right: 0;
}
/*************** ACCORDION **************/
.ce_accordion .toggler {
position: relative;
padding: 20px 30px;
padding-right: 104px;
border: 1px solid #90A4AE;
border-radius: 4px;
background-color: #ffffff;
color: #06081A;
font-weight: 700;
text-transform: uppercase;
cursor: pointer;
outline: none;
}
@media all and (min-width: 0px) and (max-width: 575px) {
.ce_accordion .toggler {
padding: 10px 20px;
padding-right: 44px;
}
}
.ce_accordion .toggler:after {
content: "";
position: absolute;
top: calc(50% - 10px);
right: 30px;
width: 20px;
height: 20px;
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
@media all and (min-width: 0px) and (max-width: 575px) {
.ce_accordion .toggler:after {
right: 10px;
}
}
.ce_accordion .toggler.ui-accordion-header-active {
color: #FDCA00;
border-color: #FDCA00;
border-radius: 4px 4px 0 0;
}
.ce_accordion .toggler.ui-accordion-header-active:after {
background-image: url('data:image/svg+xml;utf-8,');
}
.ce_accordion .accordion {
border: 1px solid #FDCA00;
border-top: none;
border-radius: 0 0 4px 4px;
background-color: #ffffff;
padding: 20px 30px;
}
@media all and (min-width: 0px) and (max-width: 575px) {
.ce_accordion .accordion {
padding: 10px 20px;
}
}
/*************** DOWNLOADS ****************/
#main .ce_downloads ul {
margin-bottom: 20px;
}
#main .ce_downloads ul li {
margin-bottom: 10px;
}
#main .download-element a, #main .download-element .c-link-ico {
color: #000000;
text-decoration: none;
text-transform: uppercase;
font-weight: 700;
padding-left: 30px;
background: center left no-repeat;
background-size: 24px 24px;
background-image: url('data:image/svg+xml;utf-8,');
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: nowrap;
}
#main .download-element a > span, #main .download-element .c-link-ico > span {
display: inline-block;
line-height: 28px;
}
#main .download-element a span.size, #main .download-element .c-link-ico span.size {
padding-left: 5px;
color: #90A4AE;
font-size: 13px;
}
#main .download-element a:hover, #main .download-element .c-link-ico:hover {
color: #FDCA00;
}
#main .download-element a:hover span.size, #main .download-element .c-link-ico:hover span.size {
color: #90A4AE;
}
/************* VIDEO PLAYERS ****************/
.video_container--rwd > .inside {
position: relative;
height: 0;
overflow: hidden;
padding-bottom: 56% 0.25;
}
.video_container--rwd > .ratio-169.inside {
padding-bottom: 56.25%;
}
.video_container--rwd > .ratio-1610.inside {
padding-bottom: 62.5%;
}
.video_container--rwd > .ratio-219.inside {
padding-bottom: 42.8571%;
}
.video_container--rwd > .ratio-43.inside {
padding-bottom: 75%;
}
.video_container--rwd > .ratio-32.inside {
padding-bottom: 66.6666%;
}
.video_container--rwd > .inside iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: none;
}
/******************************************/
/***************** LAYOUT *****************/
/******************************************/
/***************** WRAPPERS ***************/
.c-slider.c-slider--main, .l-wrapper {
position: relative;
overflow: hidden;
max-width: 1660px;
width: 100%;
padding: 0;
margin: 0 auto;
box-sizing: border-box;
}
@media all and (max-width: 991px) {
.c-slider.c-slider--main, .l-wrapper {
padding: 0 20px;
}
}
@media all and (min-width: 0px) and (max-width: 575px) {
.c-slider.c-slider--main, .l-wrapper {
padding: 0 10px;
}
}
@media all and (min-width: 992px) {
.c-slider.c-slider--main, .l-wrapper {
padding: 0 30px;
}
}
.l-wrapper.l-wrapper--full {
max-width: none;
padding-left: 0;
padding-right: 0;
}
/******************* GRIDS ****************/
.l-header .l-header__container .mod_article.l-header--with-teaser > .inside, .l-article.cl-grid > .inside, .cl-grid:not(.l-article), .l-grid {
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
margin-left: -25px;
margin-right: -25px;
}
@media all and (min-width: 0px) and (max-width: 575px) {
.l-header .l-header__container .mod_article.l-header--with-teaser > .inside, .l-article.cl-grid > .inside, .cl-grid:not(.l-article), .l-grid {
display: block;
margin-left: 0;
margin-right: 0;
}
}
.l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .block, .l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .ce_headline, .l-article.cl-grid > .inside > .block, .cl-grid:not(.l-article) > .block, .l-grid .l-grid__box {
margin-left: 25px;
margin-right: 25px;
}
@media all and (min-width: 0px) and (max-width: 575px) {
.l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .block, .l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .ce_headline, .l-article.cl-grid > .inside > .block, .cl-grid:not(.l-article) > .block, .l-grid .l-grid__box {
margin-left: 0;
margin-right: 0;
width: 100%;
margin-bottom: 25px;
}
}
/*** list grid (multi rows) ***/
.l-article.cl-grid.cl-grid--list > .inside, .cl-grid:not(.l-article).cl-grid--list, .l-grid.l-grid--list {
justify-content: flex-start;
align-items: stretch;
}
.l-article.cl-grid.cl-grid--list > .inside > .inside > .block, .cl-grid:not(.l-article).cl-grid--list > .block, .l-grid.l-grid--list .l-grid__box {
margin-bottom: 25px;
}
/*** columns ***/
.l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .block, .l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .ce_headline, .l-article.cl-grid.cl-grid--two > .inside > .block, .cl-grid:not(.l-article).cl-grid--two > .block, .l-grid.l-grid--two > .l-grid__box {
width: calc(50% - 50px);
}
@media all and (min-width: 0px) and (max-width: 575px) {
.l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .block, .l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .ce_headline, .l-article.cl-grid.cl-grid--two > .inside > .block, .cl-grid:not(.l-article).cl-grid--two > .block, .l-grid.l-grid--two > .l-grid__box {
width: 100%;
}
}
.l-article.cl-grid.cl-grid--three > .inside > .block, .cl-grid:not(.l-article).cl-grid--three > .block, .l-grid.l-grid--three > .l-grid__box {
width: calc(33.3% - 50px);
}
@media all and (min-width: 0px) and (max-width: 575px) {
.l-article.cl-grid.cl-grid--three > .inside > .block, .cl-grid:not(.l-article).cl-grid--three > .block, .l-grid.l-grid--three > .l-grid__box {
width: 100%;
}
}
.l-article.cl-grid.cl-grid--four > .inside > .block, .cl-grid:not(.l-article).cl-grid--four > .block, .l-grid.l-grid--four > .l-grid__box {
width: calc(25% - 50px);
}
@media all and (min-width: 0px) and (max-width: 575px) {
.l-article.cl-grid.cl-grid--four > .inside > .block, .cl-grid:not(.l-article).cl-grid--four > .block, .l-grid.l-grid--four > .l-grid__box {
width: 100%;
}
}
.l-article.cl-grid.cl-grid--five > .inside > .block, .cl-grid:not(.l-article).cl-grid--five > .block, .l-grid.l-grid--five > .l-grid__box {
width: calc(20% - 50px);
}
@media all and (min-width: 0px) and (max-width: 575px) {
.l-article.cl-grid.cl-grid--five > .inside > .block, .cl-grid:not(.l-article).cl-grid--five > .block, .l-grid.l-grid--five > .l-grid__box {
width: 100%;
}
}
/******************* ARTICLES ****************/
.l-article.l-article--content-v-center .inside {
position: absolute;
top: 50%;
transform: translateY(-50%);
}
.l-article.l-article--content-h-center .inside {
position: absolute;
left: 50%;
transform: translateX(-50%);
}
.l-article.l-article--content-v-center.l-article--content-h-center .inside {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
/******************************************/
/***************** UTILS ******************/
/******************************************/
/******************************************/
/************** LINKS / ICONS *************/
/******************************************/
/******************************************/
/**************** BUTTONS *****************/
/******************************************/
/*** inline button ***/
/*** block button ***/
/*** small button ***/
/******************************************/
/************* BASIC / TEXTS **************/
/******************************************/
/************* IMAGE / FIGURE *************/
/***************** LISTS ******************/
/***************** LISTS ******************/
/***************** TABLE ******************/
/************ TABLE LIKE ****************/
/******************************************/
/******* MODULES / CONTENT ELEMENT ********/
/******************************************/
/****************** MENU *****************/
.c-menu {
/*** horizontal ***/
/*** vertical ***/
}
/************* BREADCRUMBS ****************/
/************* PAGINATION *****************/
.c-pagination .c-pagination__item {
/*** previous next ***/
}
/************* SLICK SLIDER ***************/
/* defined in contao */
/*************** ACCORDION ****************/
/* defined in contao */
/*************** DOWNLOADS ****************/
/* defined in contao */
/************ YOUTUBE PLAYER **************/
/* defined in contao */
/******************************************/
/***************** LAYOUT *****************/
/******************************************/
/***************** WRAPPERS ***************/
/******************* GRIDS ****************/
/************** ARTICLE ******************/
/*
added 'c' to prefix stands for contao, e.g. cc-, cl-
*/
/******************************************/
/***************** UTILS ******************/
/******************************************/
/***************** HIDDEN *****************/
/* defined in bem: .u-hidden */
.center.ce_image, .center.ce_text,
.u-center.ce_image,
.u-center.ce_text {
position: relative;
}
.center.ce_image > .image_container, .center.ce_text > .image_container,
.u-center.ce_image > .image_container,
.u-center.ce_text > .image_container {
display: inline-block;
}
.center.ce_youtube figure, .center.ce_player figure, .center.ce_vimeo figure,
.u-center.ce_youtube figure,
.u-center.ce_player figure,
.u-center.ce_vimeo figure {
margin-left: auto;
margin-right: auto;
}
.center.ce_download p,
.center.ce_download li, .center.ce_downloads p,
.center.ce_downloads li,
.u-center.ce_download p,
.u-center.ce_download li,
.u-center.ce_downloads p,
.u-center.ce_downloads li {
display: inline-block;
margin-left: auto;
margin-right: auto;
}
/***************** MASK ******************/
/* defined in bem: .u-mask */
/******************************************/
/************** LINKS / ICONS *************/
/******************************************/
/***************** MORE *******************/
/***************** BACK *******************/
/******************************************/
/**************** BUTTONS *****************/
/******************************************/
/*** inline button ***/
/*** block button ***/
/*** small button ***/
/******************************************/
/************* BASIC / TEXTS **************/
/******************************************/
/************* IMAGE / FIGURE *************/
/***************** TABLE ******************/
/* defined in bem */
/************ TABLE LIKE ****************/
/* defined in bem */
/******************************************/
/******* MODULES / CONTENT ELEMENT ********/
/******************************************/
/***************** MENU *******************/
/************* BREADCRUMBS ****************/
/************* PAGINATION *****************/
.pagination ul li {
/*** previous next ***/
}
/*************** SLICK SLIDER **************/
/************* ACCORDION ****************/
/************* DOWNLOADS ***************/
/************* YOUTUBE PLAYER ****************/
.video_container video {
max-width: 100%;
height: auto;
}
/******************************************/
/***************** LAYOUT *****************/
/******************************************/
/***************** WRAPPERS ***************/
/* defined in bem */
/******************* GRIDS ****************/
.l-article.cl-grid > .inside {
margin-left: auto;
margin-right: auto;
}
/******************* ARTICLES ****************/
/* defined in bem */
/*************** GALLERY ******************/
.ce_gallery .image_container figcaption,
#main .ce_gallery .image_container figcaption {
display: none;
}
.ce_gallery ul,
#main .ce_gallery ul {
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
}
.ce_gallery ul li,
#main .ce_gallery ul li {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
padding: 15px;
box-sizing: border-box;
}
.ce_gallery ul.cols_1 li,
#main .ce_gallery ul.cols_1 li {
width: 100%;
}
.ce_gallery ul.cols_2 li,
#main .ce_gallery ul.cols_2 li {
width: 50%;
}
.ce_gallery ul.cols_3 li,
#main .ce_gallery ul.cols_3 li {
width: 33.3333333333%;
}
.ce_gallery ul.cols_4 li,
#main .ce_gallery ul.cols_4 li {
width: 25%;
}
.ce_gallery ul.cols_5 li,
#main .ce_gallery ul.cols_5 li {
width: 20%;
}
.ce_gallery ul.cols_6 li,
#main .ce_gallery ul.cols_6 li {
width: 16.6666666667%;
}
.ce_gallery ul.cols_7 li,
#main .ce_gallery ul.cols_7 li {
width: 14.2857142857%;
}
.ce_gallery ul.cols_8 li,
#main .ce_gallery ul.cols_8 li {
width: 12.5%;
}
.ce_gallery ul.cols_9 li,
#main .ce_gallery ul.cols_9 li {
width: 11.1111111111%;
}
.ce_gallery ul.cols_10 li,
#main .ce_gallery ul.cols_10 li {
width: 10%;
}
.ce_gallery ul.cols_11 li,
#main .ce_gallery ul.cols_11 li {
width: 9.0909090909%;
}
.ce_gallery ul.cols_12 li,
#main .ce_gallery ul.cols_12 li {
width: 8.3333333333%;
}
/******* downloads *********/
/*
#main .ce_downloads ul{
//@extend %u-raw-list;
}
#main .download-element a{
display: block;
width: auto;
max-width: 500px;
box-sizing: border-box;
margin: $size-space-item 0;
font-size: $font-size-big;
color: $color-text;
text-decoration: none;
&:hover{
color: $color-project-brand-2;
.button{
color: $color-project-brand-2;
text-decoration: none;
}
}
.desc{
display: block;
margin-bottom: $size-space-item-small;
.name{
display: block;
}
}
.button{
display: block;
color: $color-project-brand;
text-transform: uppercase;
font-weight: $font-light;
font-size: $font-size-base;
text-decoration: underline;
}
}
*/
/******************************************/
/***************** TEXTS ******************/
/******************************************/
body {
font-family: "Roboto", sans-serif;
color: #06081A;
font-weight: 300;
font-size: 16px;
background-color: #fff;
}
h1,
h2,
h3,
h4,
h5,
h6,
li {
line-height: 120%;
position: relative;
color: #000000;
}
p {
position: relative;
margin-bottom: 20px;
line-height: 150%;
}
strong {
font-weight: 700;
}
em,
em strong {
font-style: italic;
}
a, .c-link-ico {
cursor: pointer;
color: #FDCA00;
text-decoration: none;
outline: none;
}
a:hover, .c-link-ico:hover {
color: #FDCA00;
text-decoration: underline;
}
/*** bigger font ***/
.l-text--big p {
font-size: 21px;
}
p.error {
color: #ff0000;
}
/******************************************/
/**************** HEADERS *****************/
/******************************************/
h1,
h2.like-h1,
.ce_text.like-h1 h2,
.ce_headline.like-h1 h2 {
font-size: 53px;
font-weight: 700;
line-height: 100%;
margin: 50px 0;
}
@media all and (max-width: 991px) {
h1,
h2.like-h1,
.ce_text.like-h1 h2,
.ce_headline.like-h1 h2 {
font-size: 38px;
}
}
/*** decor bottom ***/
h1,
h2.like-h1,
.ce_text.like-h1 h2,
.ce_headline.like-h1 h2 {
margin-bottom: 30px;
padding-bottom: 30px;
}
h1:before,
h2.like-h1:before,
.ce_text.like-h1 h2:before,
.ce_headline.like-h1 h2:before {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100px;
height: 3px;
background-color: #FDCA00;
}
h1.hero,
h2.like-hero,
.ce_text.hero h1,
.ce_headline.hero h1,
.ce_text.like-hero h2,
.ce_headline.like-hero h2 {
font-size: 85px;
font-weight: 700;
line-height: 100%;
margin: 50px 0;
padding-bottom: 0;
}
@media all and (max-width: 991px) {
h1.hero,
h2.like-hero,
.ce_text.hero h1,
.ce_headline.hero h1,
.ce_text.like-hero h2,
.ce_headline.like-hero h2 {
font-size: 48px;
}
}
h1.hero:before,
h2.like-hero:before,
.ce_text.hero h1:before,
.ce_headline.hero h1:before,
.ce_text.like-hero h2:before,
.ce_headline.like-hero h2:before {
display: none;
}
h2 {
font-size: 52px;
font-weight: 300;
margin: 50px 0;
}
@media all and (max-width: 991px) {
h2 {
font-size: 28px;
margin: 30px 0;
}
}
h3 {
font-size: 33px;
font-weight: 700;
margin: 30px 0;
}
h4 {
font-size: 33px;
font-weight: 300;
margin: 30px 0;
}
@media all and (max-width: 991px) {
h4 {
font-size: 22px;
margin: 20px 0;
}
}
h5 {
font-size: 21px;
font-weight: 700;
margin: 30px 0;
}
h6 {
font-size: 16px;
font-weight: 700;
margin: 30px 0;
color: #06081A;
}
/******************************************/
/************* BG MODIFIERS ***************/
/******************************************/
/**************** DARK BG *****************/
.l-bg--dark {
color: #ffffff;
}
.l-bg--dark h1,
.l-bg--dark h2,
.l-bg--dark h3,
.l-bg--dark h4,
.l-bg--dark h5,
.l-bg--dark h6 {
color: #ffffff;
}
.l-bg--dark a, .l-bg--dark .c-link-ico {
color: #FDCA00;
}
.l-bg--dark a:hover, .l-bg--dark .c-link-ico:hover {
color: #FDCA00;
}
.l-bg--dark .ce_hyperlink.cc-btn > a, .l-bg--dark .ce_hyperlink.cc-btn > .c-link-ico,
.l-bg--dark .c-btn {
color: #000000;
}
.l-bg--dark .ce_hyperlink.cc-btn > a:hover, .l-bg--dark .ce_hyperlink.cc-btn > .c-link-ico:hover,
.l-bg--dark .c-btn:hover {
color: #000000;
}
/**************** DARK BG-2 *****************/
.l-bg--dark-2 {
color: #ffffff;
}
.l-bg--dark-2 h1,
.l-bg--dark-2 h2,
.l-bg--dark-2 h3,
.l-bg--dark-2 h4,
.l-bg--dark-2 h5,
.l-bg--dark-2 h6 {
color: #ffffff;
}
.l-bg--dark-2 a, .l-bg--dark-2 .c-link-ico {
color: #FDCA00;
}
.l-bg--dark-2 a:hover, .l-bg--dark-2 .c-link-ico:hover {
color: #FDCA00;
}
.l-bg--dark-2 .ce_hyperlink.cc-btn > a, .l-bg--dark-2 .ce_hyperlink.cc-btn > .c-link-ico,
.l-bg--dark-2 .c-btn {
color: #000000;
}
.l-bg--dark-2 .ce_hyperlink.cc-btn > a:hover, .l-bg--dark-2 .ce_hyperlink.cc-btn > .c-link-ico:hover,
.l-bg--dark-2 .c-btn:hover {
color: #000000;
}
/******************************************/
/************** OLD CODE ******************/
/******************************************/
/*** FORM MAIN SETTINGS ***/
#main .formbody,
#footer .formbody {
padding-left: 2px;
padding-right: 2px;
}
#main .formbody .widget,
#footer .formbody .widget {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
margin-top: 10px;
margin-bottom: 10px;
}
#main .formbody .widget label,
#footer .formbody .widget label {
order: 0;
margin-bottom: 5px;
}
#main .formbody .widget span.captcha_text,
#footer .formbody .widget span.captcha_text {
order: 0;
display: block;
margin-bottom: 5px;
}
#main .formbody .widget input,
#footer .formbody .widget input {
order: 1;
}
#main .formbody .widget p.error,
#footer .formbody .widget p.error {
order: 2;
}
#main .formbody input.text,
#main .formbody input.captcha,
#main .formbody textarea,
#main .formbody input.submit,
#main .formbody select,
#footer .formbody input.text,
#footer .formbody input.captcha,
#footer .formbody textarea,
#footer .formbody input.submit,
#footer .formbody select {
display: block;
width: 100%;
height: 50px;
box-sizing: border-box;
padding: 0 20px;
border: 1px solid #90A4AE;
border-radius: 4px;
background-color: #fff;
text-decoration: none;
}
#main .formbody textarea,
#footer .formbody textarea {
height: auto;
min-height: 180px;
padding-top: 20px;
padding-bottom: 20px;
}
#main .formbody .option-container input,
#footer .formbody .option-container input {
margin-top: 2px;
}
#main .formbody .widget.widget-submit,
#footer .formbody .widget.widget-submit {
margin: 0;
}
/*** SINGLE CHECKBOX ***/
#main .formbody .widget.widget-checkbox--single {
position: relative;
}
#main .formbody .widget.widget-checkbox--single input {
display: block;
opacity: 0;
appearance: none;
position: absolute;
top: 0px;
left: 2px;
width: 20px;
height: 20px;
}
#main .formbody .widget.widget-checkbox--single .label {
display: inline-block;
margin-left: 40px;
}
#main .formbody .widget.widget-checkbox--single .label:before {
content: "";
z-index: 5;
position: absolute;
top: 0;
left: 2px;
width: 30px;
height: 30px;
cursor: pointer;
color: #FDCA00;
border: 1px solid #90A4AE;
border-radius: 4px;
background-color: #fff;
}
#main .formbody .widget.widget-checkbox--single .label .label-text p:last-child {
margin-bottom: 0;
}
#main .formbody .widget.widget-checkbox--single p.error {
margin-left: 40px;
}
#main .formbody .widget.widget-checkbox--single input[type=checkbox]:checked + label:before {
border-color: #FDCA00;
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
/*** ERROR ***/
#main .formbody .widget.error input,
#main .formbody .widget.error textarea,
#main .formbody .widget.error .label .label-field {
border: 1px solid #ff0000;
}
#main .formbody .widget.error p.error {
color: #ff0000;
margin-top: 5px;
margin-bottom: 10px;
}
/************* LAYOUTS ****************/
/*** disable labels ***/
#main .form--no-label .formbody .widget label {
display: none;
}
#main .form--w500 .formbody,
#footer .form--w500 .formbody {
width: 500px;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
#main .formbody .l-form-row.l-form-row--two-columns {
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
margin-top: 10px;
margin-bottom: 10px;
}
#main .formbody .l-form-row.l-form-row--two-columns .widget {
margin-top: 0;
margin-bottom: 0;
width: calc(50% - 5px);
}
#main .formbody .l-form-row.l-form-row--two-columns .widget:first-child {
margin-right: 5px;
}
#main .formbody .l-form-row.l-form-row--two-columns .widget:last-child {
margin-left: 5px;
}
@media all and (min-width: 0px) and (max-width: 575px) {
#main .formbody .l-form-row.l-form-row--two-columns .widget {
margin-top: 0;
margin-bottom: 0;
width: 100%;
}
#main .formbody .l-form-row.l-form-row--two-columns .widget:first-child {
margin-right: 0;
margin-bottom: 10px;
}
#main .formbody .l-form-row.l-form-row--two-columns .widget:last-child {
margin-left: 0;
}
}
/************* MESSAGE ****************/
.form-message.form-message-success {
padding: 20px;
padding-left: 60px;
background: url('data:image/svg+xml;utf-8,') 10px 15px no-repeat;
background-color: rgba(0, 255, 0, 0.05);
background-size: 40px 40px;
margin-bottom: 30px;
border: 1px solid #90A4AE;
}
.form-message.form-message-success h3 {
margin-bottom: 10px;
}
/* .formbody .radio_container span{
position: relative;
display: inline-block;
}
.formbody .radio_container span input{
position: absolute;
top: 3px;
left: 0;
}
.formbody .radio_container span label{
margin-left: 20px;
margin-right: 30px;
}
.formbody .radio_container span:last-child label{
margin-right: 0;
}
.formbody .row.two-cols{
display: flex;
justify-content: space-between;
}
.formbody .row.two-cols > div{
width: calc(50% - 10px);
} */
/*.formbody .radio_container input{display: block; float: left;}
.formbody .radio_container label{display: block; float: none; overflow: auto; margin-left: 20px; width: auto;}*/
/* inline field form (labelka obok, a nie nad polem) */
/* jesli wszystkie formularze maja miec labelki obok pol, a nie nad - usun ".inline " z ponizszych deklaracji css */
/*.inline .formbody label{display: block; float: left; width: 40%;}
.inline .formbody .field-container{float: left; width: 60%;}
.inline .formbody input.submit{margin-left: 40%;}
.inline .formbody .option-container label{width: auto;}*/
/* one-line form (caly formularz w jednej linii, np. logowanie, wyszukiwarka) */
/*
.oneline .formbody .input-container,
.oneline .formbody .submit_container,
.oneline .formbody > input{width: auto; float: left;}
.oneline .formbody .input-container{margin-right: 10px;}
.oneline.inline .submit_container,
.oneline.inline .submit_container input.submit,
.oneline.inline .submit-container,
.oneline.inline .submit-container input.submit,
.oneline.inline .input-container,
.oneline.inline .input-container label,
.oneline.inline .input-container .field-container,
.oneline.inline .input-container .field-container input{margin: 0; width: auto; float: none; display: inline-block;}
*/
/******************************************/
/**************** TOP UI ******************/
/******************************************/
/**************** LAYOUT ******************/
.l-top__container {
height: 81px;
overflow: visible;
border-bottom: 1px solid #90A4AE;
}
.l-top__container .l-top {
display: flex;
justify-content: flex-end;
align-items: center;
flex-wrap: wrap;
position: relative;
overflow: visible;
height: 100%;
/*** LOGO ***/
/*** TOP BAR WITH ALL ELEMENTS ***/
}
.l-top__container .l-top .l-top__logo {
position: absolute;
left: 30px;
}
.l-top__container .l-top .l-top__bar {
height: 100%;
}
/************ UI BAR LAYOUT ******************/
.l-top-ui {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
position: relative;
overflow: visible;
height: 100%;
}
.l-top-ui > div:not(:last-child) {
margin-right: 30px;
}
/************ RWD LAYOUT ******************/
@media all and (min-width: 0px) and (max-width: 575px) {
.l-top__container .l-top .l-top__logo {
left: 10px;
}
.l-top-ui__menu,
.l-top-ui__lang,
.l-top-ui__info,
.l-top-ui__buttons .ico--login,
.l-top-ui__buttons .ico--search,
.l-top-ui__buttons .ico--email {
display: none;
}
.l-top-ui > div.l-top-ui__buttons,
.l-top-ui > div.l-top-ui__buttons .ico--menu {
margin-right: 0;
}
}
@media all and (min-width: 576px) and (max-width: 768px) {
.l-top-ui__menu,
.l-top-ui__lang,
.l-top-ui__info,
.l-top-ui__buttons .ico--login,
.l-top-ui__buttons .ico--search,
.l-top-ui__buttons .ico--email {
display: none;
}
.l-top-ui > div.l-top-ui__buttons,
.l-top-ui > div.l-top-ui__buttons .ico--menu {
margin-right: 0;
}
}
@media all and (min-width: 769px) and (max-width: 991px) {
.l-top-ui__menu,
.l-top-ui__info {
display: none;
}
.l-top-ui > div.l-top-ui__lang {
margin-right: 0;
}
}
@media all and (min-width: 992px) and (max-width: 1365px) {
.l-top__container {
height: 161px;
}
.l-top {
padding-top: 80px;
}
.l-top__container .l-top .l-top__logo {
left: 30px;
top: 22px;
}
.l-top__container .l-top .l-top__bar {
width: 100%;
padding-left: 30px;
padding-right: 30px;
margin-left: -30px;
margin-right: -30px;
background-color: #F5F5F5;
}
.l-top__container .l-top-ui__menu {
width: 100%;
margin-left: auto !important;
margin-right: auto !important;
}
.l-top__container .l-top-ui__info {
position: absolute;
right: -30px;
top: -80px;
}
.l-top__container .l-top-ui__buttons {
position: absolute;
right: 290px;
top: -57px;
}
.l-top-ui > div.l-top-ui__lang {
position: absolute;
right: 230px;
top: -50px;
}
}
@media all and (min-width: 1366px) and (max-width: 1599px) {
.l-top__container {
height: 161px;
}
.l-top {
padding-top: 80px;
}
.l-top__container .l-top .l-top__logo {
left: 30px;
top: 22px;
}
.l-top__container .l-top .l-top__bar {
width: 100%;
padding-left: 30px;
padding-right: 30px;
margin-left: -30px;
margin-right: -30px;
background-color: #F5F5F5;
}
.l-top__container .l-top-ui__menu {
width: auto;
min-width: 70%;
margin-left: auto !important;
margin-right: auto !important;
}
.l-top__container .l-top-ui__info {
position: absolute;
right: -30px;
top: -80px;
}
.l-top__container .l-top-ui__buttons {
position: absolute;
right: 290px;
top: -57px;
}
.l-top-ui > div.l-top-ui__lang {
position: absolute;
right: 230px;
top: -50px;
}
}
/****************** LOGO ********************/
/*
.l-top__logo{
top: -10px;
overflow: hidden;
height: 155px;
width: 110px;
@include breakpoint(mobile) {
top: 0px;
height: 80px;
width: 85px;
}
a.logo{
@include breakpoint(mobile) {
display: block;
overflow: hidden;
height: 120px;
width: 85px;
margin-top: -20px;
}
}
}
*/
/**************** MENU *******************/
.l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_1 > li:not(:last-child) {
margin-right: 30px;
}
.l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_1 > li ul.level_2 {
display: none;
}
.l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_1 > li.show-submenu ul.level_2 {
display: block;
}
.l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_1 > li > a, .l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_1 > li > .c-link-ico, .l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_1 > li > strong {
display: block;
height: 80px;
line-height: 80px;
line-height: 80px;
color: #06081A;
font-weight: 700;
text-decoration: none;
text-transform: uppercase;
}
.l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_1 > li > a.submenu, .l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_1 > li > .submenu.c-link-ico, .l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_1 > li > strong.submenu {
padding-right: 25px;
background: url('data:image/svg+xml;utf-8,') right center no-repeat;
background-size: 16px 16px;
}
.l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_1 > li > a:hover, .l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_1 > li > .c-link-ico:hover, .l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_1 > li > .active, .l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_1 > li > .trail {
color: #FDCA00;
}
.l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_1 > li > a:hover.submenu, .l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_1 > li > .c-link-ico:hover.submenu, .l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_1 > li > .active.submenu, .l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_1 > li > .trail.submenu {
background-image: url('data:image/svg+xml;utf-8,');
}
.l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_2 {
z-index: 100;
position: absolute;
top: 80px;
left: -20px;
min-width: 160px;
background-color: #fff;
margin-right: 0;
padding: 0 20px 10px;
border: 1px solid #90A4AE;
border-top: none;
}
@media all and (min-width: 1366px) and (max-width: 1599px) {
.l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_2 {
background-color: #F5F5F5;
}
}
@media all and (min-width: 992px) and (max-width: 1365px) {
.l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_2 {
background-color: #F5F5F5;
}
}
.l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_2 li {
display: block;
width: 100%;
box-sizing: border-box;
padding-top: 10px;
padding-bottom: 10px;
margin-right: 0;
}
.l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_2 li:not(:last-child) {
border-bottom: 1px solid #90A4AE;
}
.l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_2 li > a, .l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_2 li > .c-link-ico, .l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_2 li > strong {
color: #06081A;
text-decoration: none;
}
.l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_2 li > a:hover, .l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_2 li > .c-link-ico:hover, .l-top-ui__menu > .cc-menu.cc-menu--horizontal ul.level_2 li > .active {
color: #FDCA00;
}
/**************** BUTTONS ******************/
.l-top .c-link-ico.ico--compare {
background-image: url('data:image/svg+xml;utf-8,');
}
.l-top .c-link-ico.ico--pdf-download {
background-image: url('data:image/svg+xml;utf-8,');
}
.l-top .c-link-ico.ico--section-sign {
background-image: url('data:image/svg+xml;utf-8,');
}
.l-top .c-link-ico.ico--email {
background-image: url('data:image/svg+xml;utf-8,');
}
.l-top .c-link-ico.ico--menu {
background-image: url('data:image/svg+xml;utf-8,');
}
.l-top .c-link-ico.ico--search {
background-image: url('data:image/svg+xml;utf-8,');
}
.l-top .l-top-ui__buttons .c-link-ico:not(:last-child) {
margin-right: 20px;
}
@media all and (min-width: 0px) and (max-width: 575px) {
.l-top .l-top-ui__buttons .c-link-ico:not(:last-child) {
margin-right: 10px;
}
}
@media all and (min-width: 992px) {
.l-top .l-top-ui__buttons .c-link-ico.ico--menu {
display: none;
}
}
/**************** CALL US *******************/
.c-call-us {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
height: 80px;
width: 220px;
background-color: #FDCA00;
padding-left: 20px;
padding-right: 20px;
}
.c-call-us .inside {
position: relative;
padding-left: 40px;
background: url('data:image/svg+xml;utf-8,') center left no-repeat;
}
.c-call-us .inside .c-call-us__label {
font-size: 13px;
margin-bottom: 0;
}
.c-call-us .inside .c-call-us__phone {
margin-bottom: 0;
font-size: 15px;
font-weight: 700;
}
/******************************************/
/************** STICKY TOP ****************/
/******************************************/
.l-top__container.is-sticked {
position: fixed;
top: 0;
z-index: 200;
background-color: #fff;
}
/******************************************/
/************* MOBILE BOX *****************/
/******************************************/
/************** WIDGET ********************/
.c-widget.c-widget--mobile-menu {
/*overflow fix*/
max-height: 100vh;
overflow: scroll;
/* widget look */
position: absolute;
top: 0;
max-width: 100%;
z-index: 50;
right: 0;
left: 0;
border: 1px solid #90A4AE;
border-radius: 0;
background: #fff;
/*** container ***/
}
@media all and (min-width: 992px) {
.c-widget.c-widget--mobile-menu {
display: none;
}
}
.c-widget.c-widget--mobile-menu .c-top-mobile {
position: relative;
padding-bottom: 20px;
}
@media all and (min-width: 769px) and (max-width: 991px) {
.c-widget.c-widget--mobile-menu .c-top-mobile .c-top-mobile__buttons,
.c-widget.c-widget--mobile-menu .c-top-mobile .c-top-mobile__search {
display: none;
}
.c-widget.c-widget--mobile-menu .c-top-mobile .c-top-mobile__menu {
margin-top: 20px;
}
}
/************** CLOSE ********************/
.c-top-mobile .c-link-ico.ico--close {
position: absolute;
top: 10px;
right: 14px;
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
/************** CALL US ********************/
.c-top-mobile .c-call-us {
height: 50px;
width: 200px;
padding-left: 0;
}
/*************** BUTTONS ******************/
.c-top-mobile .c-top-mobile__buttons {
padding-top: 20px;
padding-bottom: 20px;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
.c-top-mobile .c-top-mobile__buttons > .c-link-ico {
width: 25%;
}
.c-top-mobile .c-top-mobile__buttons > .c-top-mobile__lang {
width: 75%;
}
.c-top-mobile .c-top-mobile__buttons > .c-top-mobile__lang ul {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
.c-top-mobile .c-top-mobile__buttons > .c-top-mobile__lang li {
width: 33.3%;
text-align: center;
}
.c-top-mobile .c-top-mobile__buttons > .c-top-mobile__lang li a, .c-top-mobile .c-top-mobile__buttons > .c-top-mobile__lang li .c-link-ico {
font-size: 28px;
text-transform: uppercase;
font-weight: 300;
text-decoration: none;
}
/*************** SEARCH *******************/
.c-top-mobile .c-top-mobile__search {
border: 1px solid #90A4AE;
border-radius: 0;
background: #fff;
width: calc(100% - 40px);
margin: 0 auto;
margin-bottom: 10px;
}
/************* MOBILE MENU ****************/
.c-top-mobile .c-top-mobile__menu {
padding-left: 20px;
padding-right: 20px;
width: 100%;
box-sizing: border-box;
/* hide submenus */
/* show submenus */
/* show/hide ico style */
/* menu item */
/*menu subitem */
/*menu sub-subitem */
}
.c-top-mobile .c-top-mobile__menu .level_1 ul {
display: none;
}
.c-top-mobile .c-top-mobile__menu li.submenu.expanded > ul {
display: block;
}
.c-top-mobile .c-top-mobile__menu li {
position: relative;
}
.c-top-mobile .c-top-mobile__menu li > .trigger-submenu {
content: "";
position: absolute;
top: 7px;
right: 0px;
width: 20px;
height: 20px;
padding: 8px;
cursor: pointer;
color: #fff;
border-radius: 4px;
background: #FDCA00 url('data:image/svg+xml;utf-8,') center no-repeat;
}
.c-top-mobile .c-top-mobile__menu li > .trigger-submenu:hover {
background-color: #FDCA00;
}
.c-top-mobile .c-top-mobile__menu li > .trigger-submenu.expanded {
background-image: url('data:image/svg+xml;utf-8,');
}
.c-top-mobile .c-top-mobile__menu li,
.c-top-mobile .c-top-mobile__menu li a,
.c-top-mobile .c-top-mobile__menu li .c-link-ico,
.c-top-mobile .c-top-mobile__menu li .active,
.c-top-mobile .c-top-mobile__menu li svg {
-webkit-touch-callout: none; /* iOS Safari */
-webkit-user-select: none; /* Safari */
-khtml-user-select: none; /* Konqueror HTML */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* Internet Explorer/Edge */
user-select: none;
}
.c-top-mobile .c-top-mobile__menu li {
position: relative;
}
.c-top-mobile .c-top-mobile__menu li > .active, .c-top-mobile .c-top-mobile__menu li > a, .c-top-mobile .c-top-mobile__menu li > .c-link-ico {
display: block;
font-weight: 700;
color: #06081A;
padding-top: 15px;
padding-bottom: 15px;
line-height: 120%;
text-decoration: none;
border-bottom: 1px solid #90A4AE;
text-transform: uppercase;
}
.c-top-mobile .c-top-mobile__menu li.submenu.active > .active, .c-top-mobile .c-top-mobile__menu li.submenu.trail > a, .c-top-mobile .c-top-mobile__menu li.submenu.trail > .c-link-ico, .c-top-mobile .c-top-mobile__menu li > a:hover, .c-top-mobile .c-top-mobile__menu li > .c-link-ico:hover {
color: #FDCA00;
border-bottom: 1px solid #FDCA00;
}
.c-top-mobile .c-top-mobile__menu .level_2 > li > .active, .c-top-mobile .c-top-mobile__menu .level_2 > li > a, .c-top-mobile .c-top-mobile__menu .level_2 > li > .c-link-ico {
display: block;
font-weight: 300;
margin-left: 15px;
}
.c-top-mobile .c-top-mobile__menu .level_3 > li > .active, .c-top-mobile .c-top-mobile__menu .level_3 > li > a, .c-top-mobile .c-top-mobile__menu .level_3 > li > .c-link-ico {
display: block;
font-weight: 300;
fong-size: 14px;
text-transform: none;
margin-left: 25px;
}
/*************** LANGUAGE ******************/
.l-top-ui__lang {
position: relative;
}
.l-top-ui__lang .c-widget__trigger {
display: block;
cursor: pointer;
padding-right: 20px;
background: url('data:image/svg+xml;utf-8,') right center no-repeat;
background-size: 16px 16px;
font-weight: 700;
text-transform: uppercase;
color: #06081A;
text-decoration: none;
}
.l-top-ui__lang .c-widget--lang {
position: absolute;
top: 48px;
right: -30px;
z-index: 50;
width: auto;
border: 1px solid #90A4AE;
border-radius: 0;
background: #fff;
padding: 10px 20px;
}
@media all and (max-width: 991px) {
.l-top-ui__lang .c-widget--lang {
right: -20px;
}
}
@media all and (min-width: 992px) {
.l-top-ui__lang .c-widget--lang {
/* right: 30px;
width: 200px; */
}
}
.l-top-ui__lang .c-widget--lang .mod_changelanguage {
position: relative;
}
.l-top-ui__lang .c-widget--lang .mod_changelanguage li a, .l-top-ui__lang .c-widget--lang .mod_changelanguage li .c-link-ico,
.l-top-ui__lang .c-widget--lang .mod_changelanguage li strong {
display: block;
height: 30px;
line-height: 30px;
text-decoration: none;
font-weight: 700;
text-align: right;
text-transform: uppercase;
padding-left: 30px;
background-repeat: no-repeat;
background-position: left center;
background-size: 20px;
}
.l-top-ui__lang .c-widget--lang .mod_changelanguage li a.lang-en, .l-top-ui__lang .c-widget--lang .mod_changelanguage li .lang-en.c-link-ico,
.l-top-ui__lang .c-widget--lang .mod_changelanguage li strong.lang-en {
background-image: url("../../bundles/migocontaomigoapp/img/flag-en.png");
}
.l-top-ui__lang .c-widget--lang .mod_changelanguage li a.lang-pl, .l-top-ui__lang .c-widget--lang .mod_changelanguage li .lang-pl.c-link-ico,
.l-top-ui__lang .c-widget--lang .mod_changelanguage li strong.lang-pl {
background-image: url("../../bundles/migocontaomigoapp/img/flag-pl.png");
}
.l-top-ui__lang .c-widget--lang .mod_changelanguage li a.lang-hu, .l-top-ui__lang .c-widget--lang .mod_changelanguage li .lang-hu.c-link-ico,
.l-top-ui__lang .c-widget--lang .mod_changelanguage li strong.lang-hu {
background-image: url("../../bundles/migocontaomigoapp/img/flag-hu.png");
}
.l-top-ui__lang .c-widget--lang .mod_changelanguage li a.lang-sr, .l-top-ui__lang .c-widget--lang .mod_changelanguage li .lang-sr.c-link-ico,
.l-top-ui__lang .c-widget--lang .mod_changelanguage li strong.lang-sr {
background-image: url("../../bundles/migocontaomigoapp/img/flag-sr.svg");
}
/*************** SEARCH ******************/
.c-widget.c-widget--search {
position: absolute;
top: 80px;
max-width: 100%;
z-index: 50;
border: 1px solid #90A4AE;
border-radius: 0;
background: #fff;
}
@media all and (max-width: 991px) {
.c-widget.c-widget--search {
right: 0px;
left: 0px;
}
}
@media all and (min-width: 992px) {
.c-widget.c-widget--search {
right: 0px;
width: 400px;
}
}
@media all and (min-width: 1600px) {
.c-widget.c-widget--search {
right: 30px;
width: 400px;
}
}
.l-top .mod_search .formbody {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
height: 50px;
}
.l-top .mod_search .formbody .widget-text {
width: calc(100% - 50px);
height: 100%;
}
.l-top .mod_search .formbody .widget-text input {
display: block;
height: 100%;
width: 100%;
border: none;
background: none;
padding: 0 20px 0 20px;
box-sizing: border-box;
}
.l-top .mod_search .formbody .widget-submit button {
background: none;
border: none;
padding: 0;
width: 50px;
height: 50px;
cursor: pointer;
text-indent: -999em;
overflow: hidden;
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
.l-top .mod_search .formbody .widget-submit button:hover {
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
/******************************************/
/*************** HEADER *******************/
/******************************************/
/*************** CONTAINER ******************/
.l-header {
background-color: #F5F5F5;
}
.l-header .l-header__breadcrumbs {
z-index: 1;
display: flex;
justify-content: flex-end;
margin-top: 50px;
margin-bottom: 40px;
}
.l-header .l-header__breadcrumbs .mod_breadcrumb ul li a, .l-header .l-header__breadcrumbs .mod_breadcrumb ul li .c-link-ico {
color: #90A4AE;
}
.l-header .l-header__breadcrumbs .mod_breadcrumb ul li.active {
color: #90A4AE;
font-weight: 700;
}
.l-header .l-header__page-title h1 {
margin-top: 0;
margin-bottom: 130px;
}
.l-header .l-header__container .mod_article.l-header--with-teaser {
margin-top: 0;
margin-bottom: 80px;
}
.l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .block, .l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .ce_headline {
margin-top: 0;
margin-bottom: 0;
}
@media all and (min-width: 576px) and (max-width: 768px) {
.l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .block, .l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .ce_headline {
width: 100%;
}
}
@media all and (min-width: 769px) and (max-width: 991px) {
.l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .block:first-child, .l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .ce_headline:first-child {
width: calc(40% - 50px);
}
.l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .block:last-child, .l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .ce_headline:last-child {
width: calc(60% - 50px);
}
}
/******************************************/
/************** COLUMNS ******************/
/******************************************/
/*** main columns ***/
#container.with-left-column {
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: nowrap;
margin-bottom: 90px;
}
#container.with-left-column #left {
width: 400px;
order: 1;
margin-top: 90px;
}
#container.with-left-column #main {
width: calc(100% - 520px);
order: 2;
}
/******************************************/
/*************** MARGINS ******************/
/******************************************/
/***************** ARTICLE ****************/
@media all and (max-width: 991px) {
.mod_article {
margin-top: 30px;
margin-bottom: 30px;
}
}
@media all and (min-width: 992px) {
.mod_article {
margin-top: 110px;
margin-bottom: 110px;
}
}
@media all and (max-width: 991px) {
.mod_article.l-article--with-bg {
margin-top: 0;
margin-bottom: 0;
padding-top: 30px;
padding-bottom: 30px;
}
}
@media all and (min-width: 992px) {
.mod_article.l-article--with-bg {
margin-top: 0;
margin-bottom: 0;
padding-top: 110px;
padding-bottom: 110px;
}
}
/************** BLOCK ELEMENT *************/
/*** margins of article block elements ***/
.mod_article > .inside > .block:not(:first-child),
.mod_article .ce_group > .block:not(:first-child) {
margin-top: 50px;
}
.mod_article > .inside > .block:not(:last-child),
.mod_article .ce_group > .block:not(:last-child) {
margin-bottom: 50px;
}
/****** texts inside block element ******/
.mod_article .block > *:first-child {
margin-top: 0;
}
.mod_article .block > *:last-child {
margin-bottom: 0;
}
/******** blocks in grid article *******/
/*
//disable margins in first level block of grid article
.mod_article.cl-grid:not(.cl-grid--list):not(.l-grid--list) > .inside > .block,
.mod_article.l-grid:not(.cl-grid--list):not(.l-grid--list) > .inside > .block,
//disable margins in first level block of grid group (grid group in any level)
.mod_article .ce_group.cl-grid:not(.cl-grid--list):not(.l-grid--list) > .block,
.mod_article .ce_group.l-grid:not(.cl-grid--list):not(.l-grid--list) > .block{
margin-top: 0;
margin-bottom: 0;
}
*/
.mod_article.cl-grid > .inside > .block,
.mod_article.l-grid > .inside > .block,
.mod_article .ce_group.cl-grid > .block,
.mod_article .ce_group.l-grid > .block {
margin-top: 0;
margin-bottom: 0;
}
.mod_article.cl-grid.cl-grid--list > .inside > .block,
.mod_article.l-grid.l-grid--list > .inside > .block,
.mod_article .ce_group.cl-grid.cl-grid--list > .block,
.mod_article .ce_group.l-grid.l-grid--list > .block {
margin-top: 50px;
margin-bottom: 50px;
}
/**** sliders ****/
.mod_article .slick-slider .slick-slide {
margin-top: 0;
margin-bottom: 0;
}
/**** accordion ****/
#main .mod_article .ce_accordion {
margin-bottom: 20px;
margin-top: 20px;
}
/******************************************/
/*************** LEFT MENU ****************/
/******************************************/
#left .mod_navigation .level_1 > li {
position: relative;
}
#left .mod_navigation .level_1 > li > .active, #left .mod_navigation .level_1 > li > a, #left .mod_navigation .level_1 > li > .c-link-ico {
display: block;
font-weight: 700;
color: #FDCA00;
padding-top: 15px;
padding-bottom: 15px;
text-decoration: none;
border-bottom: 1px solid #F5F5F5;
text-transform: uppercase;
}
#left .mod_navigation .level_1 > li > .active > svg, #left .mod_navigation .level_1 > li > a > svg, #left .mod_navigation .level_1 > li > .c-link-ico > svg {
position: absolute;
top: 13px;
right: 0px;
}
#left .mod_navigation .level_1 > li.submenu.active > .active, #left .mod_navigation .level_1 > li.submenu.trail > a, #left .mod_navigation .level_1 > li.submenu.trail > .c-link-ico, #left .mod_navigation .level_1 > li > a:hover, #left .mod_navigation .level_1 > li > .c-link-ico:hover {
color: #FDCA00;
border-bottom: 1px solid #FDCA00;
}
#left .mod_navigation .level_2 > li > .active, #left .mod_navigation .level_2 > li > a, #left .mod_navigation .level_2 > li > .c-link-ico {
display: block;
font-weight: 300;
color: #06081A;
padding-top: 15px;
padding-bottom: 15px;
text-decoration: none;
margin-left: 30px;
}
#left .mod_navigation .level_2 > li > .active, #left .mod_navigation .level_2 > li > a:hover, #left .mod_navigation .level_2 > li > .c-link-ico:hover {
text-decoration: underline;
}
/******************************************/
/************* MISCELLANEOUS **************/
/******************************************/
/**************** RAW LISTS ***************/
/************ CONTENT ELEMENTS ************/
.ce_image .image_container.float_left,
.ce_text .image_container.float_left,
.ce_gallery .image_container.float_left {
float: left;
}
.ce_image .image_container.float_right,
.ce_text .image_container.float_right,
.ce_gallery .image_container.float_right {
float: right;
}
.l-footer {
padding-bottom: 50px;
}
@media all and (max-width: 991px) {
.l-footer {
padding-bottom: 100px;
}
}
@media all and (min-width: 769px) and (max-width: 991px) {
.l-footer {
padding-bottom: 60px;
}
}
.l-footer__columns-container {
padding-top: 80px;
padding-bottom: 80px;
background-color: #F5F5F5;
}
.l-footer__columns {
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
}
@media all and (max-width: 991px) {
.l-footer__columns .l-footer__fb {
width: calc(50% - 25px);
}
}
@media all and (min-width: 0px) and (max-width: 575px) {
.l-footer__columns .l-footer__fb {
width: 100%;
}
}
@media all and (min-width: 992px) {
.l-footer__columns .l-footer__fb {
width: 340px;
}
}
@media all and (min-width: 1600px) {
.l-footer__columns .l-footer__fb {
width: 600px;
}
}
@media all and (max-width: 991px) {
.l-footer__columns .l-footer__menu {
width: calc(50% - 25px);
}
}
@media all and (min-width: 0px) and (max-width: 575px) {
.l-footer__columns .l-footer__menu {
width: 100%;
}
}
@media all and (min-width: 992px) {
.l-footer__columns .l-footer__menu {
width: calc(100% - 400px);
}
}
@media all and (min-width: 1600px) {
.l-footer__columns .l-footer__menu {
width: calc(100% - 700px);
}
}
@media all and (max-width: 991px) {
.l-footer__menu .cl-grid.cl-grid--three .ce_text {
width: 100%;
margin-top: 0;
margin-bottom: 0;
}
}
.l-footer__menu .cl-grid.cl-grid--three .ce_text ul li {
margin-bottom: 20px;
}
@media all and (max-width: 991px) {
.l-footer__menu .cl-grid.cl-grid--three .ce_text ul li {
margin-top: 10px;
margin-bottom: 10px;
}
}
.l-footer__menu .cl-grid.cl-grid--three .ce_text a, .l-footer__menu .cl-grid.cl-grid--three .ce_text .c-link-ico {
color: #06081A;
text-decoration: none;
}
.l-footer__menu .cl-grid.cl-grid--three .ce_text a:hover, .l-footer__menu .cl-grid.cl-grid--three .ce_text .c-link-ico:hover {
text-decoration: underline;
}
/*
a.ico-fb{
display: inline-block;
width: 24px;
height: 24px;
background: get-icon('facebook') center no-repeat;
text-indent: -999em;
overflow: hidden;
margin-right: $size-space-item;
}
a.ico-tw{
display: inline-block;
width: 24px;
height: 24px;
background: get-icon('twitter') center no-repeat;
text-indent: -999em;
overflow: hidden;
}
*/
.l-footer__copy .inside {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
position: relative;
font-size: 12px;
}
@media all and (min-width: 769px) and (max-width: 991px) {
.l-footer__copy .inside {
margin-top: 30px;
margin-bottom: 30px;
}
.l-footer__copy .inside:after {
content: "";
position: absolute;
top: 50%;
height: 1px;
width: 100%;
background-color: #90A4AE;
z-index: 0;
}
}
@media all and (min-width: 992px) {
.l-footer__copy .inside {
margin-top: 30px;
margin-bottom: 30px;
}
.l-footer__copy .inside:after {
content: "";
position: absolute;
top: 50%;
height: 1px;
width: 100%;
background-color: #90A4AE;
z-index: 0;
}
}
.l-footer__copy .inside .l-footer__copy-right,
.l-footer__copy .inside .l-footer__copy-left {
z-index: 10;
background-color: #fff;
}
@media all and (min-width: 0px) and (max-width: 575px) {
.l-footer__copy .inside .l-footer__copy-right,
.l-footer__copy .inside .l-footer__copy-left {
width: 100%;
margin-top: 10px;
}
}
@media all and (min-width: 576px) and (max-width: 768px) {
.l-footer__copy .inside .l-footer__copy-right,
.l-footer__copy .inside .l-footer__copy-left {
width: 100%;
margin-top: 10px;
}
}
@media all and (min-width: 769px) and (max-width: 991px) {
.l-footer__copy .inside .l-footer__copy-right:first-child,
.l-footer__copy .inside .l-footer__copy-left:first-child {
padding-right: 20px;
}
.l-footer__copy .inside .l-footer__copy-right:last-child,
.l-footer__copy .inside .l-footer__copy-left:last-child {
padding-left: 20px;
}
}
@media all and (min-width: 992px) {
.l-footer__copy .inside .l-footer__copy-right:first-child,
.l-footer__copy .inside .l-footer__copy-left:first-child {
padding-right: 20px;
}
.l-footer__copy .inside .l-footer__copy-right:last-child,
.l-footer__copy .inside .l-footer__copy-left:last-child {
padding-left: 20px;
}
}
.l-footer__copy .inside .l-footer__copy-left p:first-child {
padding-right: 20px;
border-right: 1px solid #06081A;
}
.l-footer__copy .inside .l-footer__copy-left p:last-child {
padding-left: 20px;
}
@media all and (min-width: 0px) and (max-width: 575px) {
.l-footer__copy .inside .l-footer__copy-left p {
display: block;
width: 100%;
margin-top: 10px;
}
.l-footer__copy .inside .l-footer__copy-left p:first-child {
padding-right: 0;
border-right: none;
}
.l-footer__copy .inside .l-footer__copy-left p:last-child {
padding-left: 0;
}
}
.l-footer__copy p {
display: inline-block;
margin-bottom: 0;
}
.l-footer__copy a, .l-footer__copy .c-link-ico {
color: #06081A;
text-decoration: none;
}
.l-footer__copy a:hover, .l-footer__copy .c-link-ico:hover {
text-decoration: underline;
}
/*** cookie message ***/
.cookiebar .cookiebar__message {
margin-right: 0;
}
@media all and (max-width: 991px) {
.cookiebar .cookiebar__button {
margin-top: 10px;
}
}
/******************************************/
/************ MAIN SLIDER *****************/
/******************************************/
.c-slider.c-slider--main .inside {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
.c-slider.c-slider--main .c-slider__image {
width: 650px;
max-width: calc(50% - 110px);
}
@media all and (min-width: 0px) and (max-width: 575px) {
.c-slider.c-slider--main .c-slider__image {
width: 100%;
max-width: none;
}
}
@media all and (min-width: 576px) and (max-width: 768px) {
.c-slider.c-slider--main .c-slider__image {
width: 100%;
max-width: none;
}
}
.c-slider.c-slider--main .c-slider__text_container {
width: 50%;
}
@media all and (min-width: 0px) and (max-width: 575px) {
.c-slider.c-slider--main .c-slider__text_container {
width: 100%;
}
}
@media all and (min-width: 576px) and (max-width: 768px) {
.c-slider.c-slider--main .c-slider__text_container {
width: 100%;
}
}
@media all and (min-width: 0px) and (max-width: 575px) {
.c-slider.c-slider--main .c-slider__text_container h1 {
font-size: 32px;
margin-bottom: 20px;
}
}
@media all and (min-width: 992px) and (max-width: 1365px) {
.c-slider.c-slider--main .c-slider__text_container h1 {
font-size: 56px;
}
}
@media all and (min-width: 1366px) and (max-width: 1599px) {
.c-slider.c-slider--main .c-slider__text_container h1 {
font-size: 64px;
}
}
.c-slider.c-slider--main .c-slider__text_container .c-btn.c-btn--block {
margin-top: 50px;
}
/******************************************/
/******** TESTIMONIALS SLIDER *************/
/******************************************/
#slider_testimonials {
max-width: 1780px;
padding-left: 90px;
padding-right: 90px;
margin: 0 auto;
}
#slider_testimonials .slick-list {
margin-left: -15px;
margin-right: -15px;
}
#slider_testimonials .slick-track {
display: flex !important;
padding-bottom: 2px;
}
#slider_testimonials .slick-slide {
height: inherit !important;
margin: 0 15px;
box-sizing: border-box;
}
@media all and (min-width: 0px) and (max-width: 575px) {
#slider_testimonials {
padding-left: 10px;
padding-right: 10px;
}
#slider_testimonials .slick-list {
margin-left: 0;
margin-right: 0;
}
#slider_testimonials .slick-slide {
margin-left: 0;
margin-right: 0;
}
}
/******************************************/
/************* DOUBLE TEXT ****************/
/******************************************/
.c-double-text .c-double-text__content {
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
}
.c-double-text .c-double-text__text {
width: calc(50% - 25px);
}
@media all and (min-width: 0px) and (max-width: 575px) {
.c-double-text .c-double-text__text {
width: 100%;
margin-top: 50px;
margin-bottom: 50px;
}
}
.c-double-text .c-double-text__text h5 {
margin-top: 20px;
margin-bottom: 10px;
}
/******************************************/
/************** ICON + TEXT ***************/
/******************************************/
.ce_rsce_iconAndText {
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
margin-top: 0;
margin-bottom: 20px;
padding: 10px;
box-sizing: border-box;
}
@media all and (min-width: 0px) and (max-width: 575px) {
.ce_rsce_iconAndText {
width: 100%;
}
}
.ce_rsce_iconAndText .image {
margin: 0;
width: 60px;
}
.ce_rsce_iconAndText .headline {
display: none;
}
.ce_rsce_iconAndText .text h5 {
margin: 0;
margin-left: 20px;
}
/************* PRODUCT GALLERY ****************/
.c-product-gallery {
max-width: 800px;
margin-left: auto;
margin-right: auto;
position: relative;
box-sizing: border-box;
padding: 30px;
padding-left: 30px;
background-color: #fff;
}
.c-product-gallery .c-product-gallery__images {
margin-bottom: 30px;
}
.c-product-gallery .c-product-gallery__images .slick-track {
display: flex;
align-items: center;
}
.c-product-gallery .c-product-gallery__images .slick-list {
margin-left: 0;
margin-right: 0;
}
.c-product-gallery .c-product-gallery__images .c-image {
margin: 0 auto;
}
.c-product-gallery .c-product-gallery__thumbs .c-image__container .inside {
margin: 0 auto;
width: 90px;
height: 90px;
box-sizing: border-box;
border: 1px solid #90A4AE;
}
.c-product-gallery .c-product-gallery__thumbs .c-image {
margin: 0 auto;
cursor: pointer;
}
/*** PRODUCT GALLERY - RWD ***/
@media all and (min-width: 0px) and (max-width: 575px) {
.c-product-gallery {
padding-left: 10px;
padding-right: 10px;
}
.c-product-gallery .c-product-gallery__thumbs .slick-list {
margin-left: 40px;
margin-right: 40px;
}
.c-product-gallery .c-product-gallery__thumbs .slick-prev,
.c-product-gallery .c-product-gallery__thumbs .slick-next {
background-size: 32px 32px;
width: 32px;
height: 32px;
top: calc(50% - 16px);
}
}
/*** PRODUCT GALLERY - RWD ***/
/*.c-product-gallery{
@include breakpoint(mobile_small) {
padding: $size-space-item;
.c-product-gallery__poster{
order: 1;
width: 100%;
margin-bottom: $size-space-element;
}
.c-product-gallery__images{
order: 2;
width: 100%;
@include flex(space-around);
.c-product-gallery__image{
margin: $size-space-item-small / 2;
}
}
&.c-product-gallery--only-poster{
width: 100%;
}
}
}*/
/******************************************/
/************** TEXT DECORS ***************/
/******************************************/
/******** paragraph within quotes *********/
.l-text--quote > p:first-child:before, .c-testimonial .c-testimonial__text > p:first-child:before {
content: '"';
color: #FDCA00;
font-size: 30px;
font-weight: 700;
position: relative;
top: 5px;
padding-right: 5px;
}
.l-text--quote > p:last-child:after, .c-testimonial .c-testimonial__text > p:last-child:after {
content: '"';
color: #FDCA00;
font-size: 30px;
font-weight: 700;
position: relative;
top: 5px;
padding-left: 5px;
}
/**** paragraph with bottom triangle *****/
.l-text--bottom-triangle, .l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .block:last-child, .l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .ce_headline:last-child {
position: relative;
padding-bottom: 90px;
}
.l-text--bottom-triangle:after, .l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .block:last-child:after, .l-header .l-header__container .mod_article.l-header--with-teaser > .inside > .ce_headline:last-child:after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 50px;
height: 50px;
background: url('data:image/svg+xml;utf-8,') center no-repeat;
background-size: 50px 50px;
}
/******************************************/
/******* SPECIAL CONTENT ELEMENTS *********/
/******************************************/
/************* TESTIMONIALS ***************/
.c-testimonial {
position: relative;
width: 33.333%;
box-sizing: border-box;
padding-bottom: 86px;
background-color: #fff;
border: 1px solid #90A4AE;
}
.c-testimonial .inside {
padding: 30px;
}
.c-testimonial:after {
content: "";
position: absolute;
top: 30px;
right: 30px;
width: 40px;
height: 40px;
background: url('data:image/svg+xml;utf-8,') center no-repeat;
background-size: 40px 40px;
}
.c-testimonial .c-testimonial__label {
display: none;
/*
font-size: $font-size-big;
font-weight: $font-light;
color: $color-project-gray-2;
*/
}
.c-testimonial .c-testimonial__text {
margin-top: 20px;
font-size: 21;
font-style: italic;
font-weight: 400;
}
.c-testimonial .c-testimonial__text > p:last-child {
margin-bottom: 0;
}
.c-testimonial .c-testimonial__bottom {
position: absolute;
bottom: 30px;
left: 50px;
right: 50px;
}
.c-testimonial .c-testimonial__scan {
margin: 0;
}
.c-testimonial .c-testimonial__author-container {
margin-right: 50px;
/*
padding-left: 70px;
&:before{
content: '';
position: absolute;
top: 0px;
left: 0px;
width: 50px;
height: 50px;
border-radius: 25px;
background-color: $color-project-gray-3;
}
*/
}
.c-testimonial .c-testimonial__author-name {
display: none;
/*
display: block;
font-weight: $font-light;
*/
}
.c-testimonial .c-testimonial__author-company {
display: block;
font-weight: 700;
}
/************* DOUBLE HEADER **************/
/*
.ce_rsce_doubleHeaderText{
.before-headline{
display: block;
position: relative;
padding-left: 45px;
margin-bottom: $size-space-half;
text-transform: uppercase;
color: $color-project-brand-2;
font-weight: 700;
&:before{
@include transformCenter(false, true);
left: 0;
content: '';
height: 1px;
width: 30px;
background-color: $color-project-brand;
}
}
.headline{
margin-top: 0;
}
.text{
p{
line-height: 150%;
}
}
}
*/
/*** newsletter ***/
#main .mod_subscribe,
#main .mod_unsubscribe {
margin: 0 auto;
width: 800px;
max-width: 100%;
}
#main .mod_subscribe .formbody,
#main .mod_unsubscribe .formbody {
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
}
#main .mod_subscribe .formbody .widgets-group,
#main .mod_unsubscribe .formbody .widgets-group {
width: calc(100% - 230px);
}
#main .mod_subscribe .formbody .widgets-group .widget-text,
#main .mod_unsubscribe .formbody .widgets-group .widget-text {
margin-top: 0;
}
#main .mod_subscribe .formbody .widget-submit .submit,
#main .mod_unsubscribe .formbody .widget-submit .submit {
width: 200px;
margin: 0;
}
#main .mod_login.logout .login_info {
text-align: center;
}
#main .mod_login.logout .formbody .widget.widget-submit .submit {
margin-left: auto;
margin-right: auto;
}
#main .mod_search .formbody {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
margin: 0 auto;
width: 600px;
max-width: 100%;
}
#main .mod_search .formbody .widget-text {
padding-left: 0;
padding-right: 0;
width: calc(100% - 150px);
height: 100%;
}
#main .mod_search .formbody .widget-text input {
display: block;
padding: 0 20px;
}
#main .mod_search .formbody .widget-submit {
padding-left: 30px;
padding-right: 0;
}
#main .mod_search .formbody .widget-submit .submit {
padding-left: 0;
padding-right: 0;
min-width: 120px;
cursor: pointer;
}
#main .mod_search .search-result-list {
margin-top: 30px;
}
#main .mod_search .search-result-list > div {
margin-bottom: 30px;
}
#main .mod_search .search-result-list > div h4 {
margin-bottom: 10px;
}
#main .mod_search .search-result-list > div mark.highlight {
padding-left: 2px;
padding-right: 2px;
color: #ffffff;
background-color: rgba(253, 202, 0, 0.9);
}
.mod_newslist .inside {
display: flex;
justify-content: space-between;
align-items: stretch;
flex-wrap: wrap;
margin-left: -15px;
margin-right: -15px;
}
.mod_newslist .inside > .block {
width: calc(33.3% - 30px);
margin-left: 15px;
margin-right: 15px;
margin-bottom: 30px;
}
@media all and (min-width: 0px) and (max-width: 575px) {
.mod_newslist .inside > .block {
margin-left: 0;
margin-right: 0;
width: 100%;
}
}
@media all and (min-width: 576px) and (max-width: 768px) {
.mod_newslist .inside > .block {
margin-left: 0;
margin-right: 0;
width: calc(50% - 30px);
}
}
@media all and (min-width: 769px) and (max-width: 991px) {
.mod_newslist .inside > .block {
margin-left: 0;
margin-right: 0;
width: calc(50% - 30px);
}
}
.mod_newslist .layout_short {
position: relative;
border-bottom: 1px solid #90A4AE;
}
.mod_newslist .layout_short figure img {
max-width: 100%;
height: auto;
}
.mod_newslist .layout_short .news_desc {
padding: 15px 30px 85px;
box-sizing: border-box;
}
.mod_newslist .layout_short .news_desc h3 {
font-size: 33px;
font-weight: 300;
margin-top: 15px;
margin-bottom: 0;
}
@media all and (max-width: 991px) {
.mod_newslist .layout_short .news_desc h3 {
font-size: 26px;
}
}
.mod_newslist .layout_short .news_desc h3 a, .mod_newslist .layout_short .news_desc h3 .c-link-ico {
text-decoration: none;
color: #06081A;
}
.mod_newslist .layout_short .news_desc h3 a:hover, .mod_newslist .layout_short .news_desc h3 .c-link-ico:hover {
text-decoration: none;
}
.mod_newslist .layout_short .news_desc .info {
color: #90A4AE;
font-size: 15px;
font-weight: 300;
margin-bottom: 15px;
}
.mod_newslist .layout_short .news_desc p.more {
position: absolute;
right: 30px;
bottom: 30px;
margin-bottom: 0;
}
.mod_newsreader .info {
color: #90A4AE;
font-size: 15px;
font-weight: 300;
margin-bottom: 15px;
}
/******************************************/
/************ PAGE TEASERS ****************/
/******************************************/
/***** PAGE TEASER SIMPLE/PRODUCT *********/
.c-page-teaser.c-page-teaser--simple,
.c-page-teaser.c-page-teaser--product {
position: relative;
padding: 20px;
padding-bottom: 100px;
box-sizing: border-box;
background-color: #fff;
border-radius: 4px;
}
.c-page-teaser.c-page-teaser--simple .c-page-teaser__image,
.c-page-teaser.c-page-teaser--product .c-page-teaser__image {
position: relative;
width: 100%;
}
.c-page-teaser.c-page-teaser--simple .c-page-teaser__image .c-image__container,
.c-page-teaser.c-page-teaser--product .c-page-teaser__image .c-image__container {
height: 100%;
width: 100%;
}
.c-page-teaser.c-page-teaser--simple .c-page-teaser__image .c-image,
.c-page-teaser.c-page-teaser--product .c-page-teaser__image .c-image {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.c-page-teaser.c-page-teaser--simple .c-page-teaser__text,
.c-page-teaser.c-page-teaser--product .c-page-teaser__text {
position: absolute;
bottom: 20px;
left: 0;
right: 0;
padding-left: 20px;
padding-right: 20px;
}
.c-page-teaser.c-page-teaser--simple .c-page-teaser__headline,
.c-page-teaser.c-page-teaser--product .c-page-teaser__headline {
font-size: 21px;
font-weight: 700;
margin: 0;
text-align: center;
}
.c-page-teaser.c-page-teaser--simple .c-page-teaser__image {
height: 220px;
}
.c-page-teaser.c-page-teaser--product .c-page-teaser__image {
height: 200px;
}
/********** PAGE TEASER FULL *************/
.c-page-teaser.c-page-teaser--full {
position: relative;
height: auto;
width: 100%;
margin-top: 50px;
margin-bottom: 50px;
background-color: #F5F5F5;
}
.c-page-teaser.c-page-teaser--full .c-page-teaser__images {
position: relative;
}
.c-page-teaser.c-page-teaser--full .c-page-teaser__text {
box-sizing: border-box;
}
.c-page-teaser.c-page-teaser--full .c-page-teaser__text h3 {
margin-top: 0;
}
.c-page-teaser.c-page-teaser--full .c-page-teaser__image {
z-index: 40;
position: absolute;
left: 30px;
top: 30px;
background-color: #fff;
border-radius: 4px;
}
.c-page-teaser.c-page-teaser--full .c-page-teaser__image .c-image__container {
width: 100%;
height: 100%;
}
.c-page-teaser.c-page-teaser--full .c-page-teaser__image .c-image {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
max-width: calc(100% - 20px);
max-height: calc(100% - 20px);
}
.c-page-teaser.c-page-teaser--full .c-page-teaser__bg {
overflow: hidden;
position: relative;
}
@media all and (min-width: 992px) {
.c-page-teaser.c-page-teaser--full .c-page-teaser__bg .c-image {
max-height: none;
max-width: none;
}
}
@media all and (max-width: 991px) {
.c-page-teaser.c-page-teaser--full .c-page-teaser__text {
width: 100%;
height: auto;
padding: 30px 10px;
}
.c-page-teaser.c-page-teaser--full .c-page-teaser__image {
width: 120px;
height: 120px;
}
.c-page-teaser.c-page-teaser--full .c-page-teaser__bg {
height: auto;
}
.c-page-teaser.c-page-teaser--full .c-page-teaser__bg .ce_image {
height: auto;
width: 100%;
}
}
@media all and (min-width: 992px) {
.c-page-teaser.c-page-teaser--full {
display: flex;
justify-content: space-between;
align-items: stretch;
flex-wrap: wrap;
}
.c-page-teaser.c-page-teaser--full .c-page-teaser__images {
max-width: calc(100% - 540px);
height: 450px;
}
.c-page-teaser.c-page-teaser--full .c-page-teaser__text {
width: 540px;
padding: 60px;
}
.c-page-teaser.c-page-teaser--full .c-page-teaser__image {
left: 30px;
top: 30px;
width: 240px;
height: 240px;
}
.c-page-teaser.c-page-teaser--full .c-page-teaser__bg {
height: 450px;
}
.c-page-teaser.c-page-teaser--full .c-page-teaser__bg .ce_image {
height: 100%;
width: auto;
}
}
.ce_pageteaser.c-page-teaser--odd > .c-page-teaser.c-page-teaser--full .c-page-teaser__images {
order: 2;
}
.ce_pageteaser.c-page-teaser--odd > .c-page-teaser.c-page-teaser--full .c-page-teaser__text {
order: 1;
}
.ce_pageteaser.c-page-teaser--odd > .c-page-teaser.c-page-teaser--full .c-page-teaser__image {
left: auto;
right: 30px;
top: 30px;
}
/******* PAGE TEASER REALISATION **********/
.c-page-teaser.c-page-teaser--realisation {
position: relative;
width: 100%;
max-width: 512px;
border-radius: 4px;
overflow: hidden;
background-color: #90A4AE;
/*** hover ***/
}
.c-page-teaser.c-page-teaser--realisation:after {
z-index: 10;
content: "";
position: absolute;
top: 30px;
right: 30px;
width: 50px;
height: 50px;
background: url('data:image/svg+xml;utf-8,') center no-repeat;
background-size: 50px 50px;
}
.c-page-teaser.c-page-teaser--realisation .c-page-teaser__bg {
width: 100%;
height: 0;
padding-bottom: 92.375%;
}
.c-page-teaser.c-page-teaser--realisation .c-page-teaser__text {
z-index: 10;
position: absolute;
bottom: 50px;
left: 50px;
right: 50px;
}
.c-page-teaser.c-page-teaser--realisation .c-page-teaser__text h4 {
margin-bottom: 15px;
}
.c-page-teaser.c-page-teaser--realisation .c-page-teaser__mask-bg {
display: flex;
justify-content: center;
align-items: flex-start;
flex-wrap: wrap;
display: none;
position: absolute;
z-index: 5;
left: 0;
right: 30px;
top: 30px;
bottom: 0;
background-color: #FDCA00;
border-radius: 0 4px 0 4px;
padding-top: 50px;
box-sizing: border-box;
}
.c-page-teaser.c-page-teaser--realisation .c-page-teaser__mask-bg .c-link--more {
background-image: url('data:image/svg+xml;utf-8,');
}
.c-page-teaser.c-page-teaser--realisation.is-active:after {
top: auto;
right: auto;
bottom: 0;
left: 0;
background: url('data:image/svg+xml;utf-8,') center no-repeat;
transform: rotate(180deg);
}
.c-page-teaser.c-page-teaser--realisation.is-active .c-page-teaser__mask-bg {
display: flex;
}
/*** shrinked version ***/
/******************************************/
/*********** PAGE TEASER LISTS ************/
/******************************************/
/****** SLIDER REALISATIONS AND TESTIMOANIALS *********/
#slider_testimonials .ce_pageteaser {
position: relative;
width: 33%;
max-width: 520px;
}
/****** PAGE TEASER LIST - SIMPLE *********/
#main .mod_article .ce_group.l-page-teasers-simple {
margin-bottom: 0;
/* @include flex(space-around, flex-start, wrap);
margin-left: -$size-space-item / 2;
margin-right: -$size-space-item / 2;
@include breakpoint(mobile_small) {
margin-left: 0;
margin-right: 0;
width: 100%;
} */
}
#main .mod_article .ce_group.l-page-teasers-simple .ce_pageteaser {
width: calc(20% - 20px);
margin-top: 0;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 20px;
}
@media all and (min-width: 0px) and (max-width: 575px) {
#main .mod_article .ce_group.l-page-teasers-simple .ce_pageteaser {
margin-left: 0;
margin-right: 0;
width: 100%;
}
}
@media all and (min-width: 576px) and (max-width: 768px) {
#main .mod_article .ce_group.l-page-teasers-simple .ce_pageteaser {
width: calc(50% - 20px);
}
}
@media all and (min-width: 769px) and (max-width: 991px) {
#main .mod_article .ce_group.l-page-teasers-simple .ce_pageteaser {
width: calc(33.33% - 20px);
}
}
@media all and (min-width: 992px) and (max-width: 1365px) {
#main .mod_article .ce_group.l-page-teasers-simple .ce_pageteaser .c-page-teaser__image {
height: 160px;
}
#main .mod_article .ce_group.l-page-teasers-simple .ce_pageteaser .c-page-teaser__headline {
font-size: 18px;
}
}
/****** PAGE TEASER LIST - REALISATIONS *********/
.mod_article .ce_group.l-page-teasers-realisations {
display: flex;
justify-content: flex-start;
align-items: flex-start;
flex-wrap: wrap;
margin-left: -10px;
margin-right: -10px;
}
@media all and (min-width: 0px) and (max-width: 575px) {
.mod_article .ce_group.l-page-teasers-realisations {
margin-left: 0;
margin-right: 0;
width: 100%;
}
}
.mod_article .ce_group.l-page-teasers-realisations .ce_pageteaser {
width: calc(33.333% - 30px);
margin-top: 0;
margin-left: 15px;
margin-right: 15px;
margin-bottom: 30px;
}
@media all and (min-width: 0px) and (max-width: 575px) {
.mod_article .ce_group.l-page-teasers-realisations .ce_pageteaser {
margin-left: auto;
margin-right: auto;
width: 100%;
max-width: 512px;
}
}
@media all and (min-width: 576px) and (max-width: 768px) {
.mod_article .ce_group.l-page-teasers-realisations .ce_pageteaser {
margin-left: auto;
margin-right: auto;
width: 100%;
max-width: 512px;
}
}
@media all and (min-width: 769px) and (max-width: 991px) {
.mod_article .ce_group.l-page-teasers-realisations .ce_pageteaser {
width: calc(50% - 30px);
}
}
@media all and (min-width: 992px) and (max-width: 1365px) {
.mod_article .ce_group.l-page-teasers-realisations .ce_pageteaser:after {
right: 10px;
top: 10px;
}
.mod_article .ce_group.l-page-teasers-realisations .ce_pageteaser.is-active:after {
display: none;
}
.mod_article .ce_group.l-page-teasers-realisations .ce_pageteaser .c-page-teaser__mask-bg {
right: 10px;
top: 10px;
}
.mod_article .ce_group.l-page-teasers-realisations .ce_pageteaser .c-page-teaser__text {
right: 25px;
bottom: 30px;
left: 25px;
}
.mod_article .ce_group.l-page-teasers-realisations .ce_pageteaser .c-page-teaser__headline {
font-size: 22px;
}
}
.mod_pagelist .categories-menu {
margin-top: 50px;
margin-bottom: 25px;
}
.mod_pagelist .l-page-teasers-realisations {
padding-top: 25px;
}
.mod_pagelist .categories-menu ul {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
}
.mod_pagelist .categories-menu ul li {
margin: 10px;
border-radius: 4px;
background-color: #fff;
border: 1px solid #90A4AE;
}
.mod_pagelist .categories-menu ul li a, .mod_pagelist .categories-menu ul li .c-link-ico,
.mod_pagelist .categories-menu ul li span {
display: block;
height: 60px;
line-height: 60px;
padding-left: 20px;
padding-right: 20px;
font-size: 13px;
font-weight: 700;
text-transform: uppercase;
color: #06081A;
text-align: center;
}
.mod_pagelist .categories-menu ul li a:hover, .mod_pagelist .categories-menu ul li .c-link-ico:hover,
.mod_pagelist .categories-menu ul li span:hover {
color: #FDCA00;
text-decoration: none;
}
.mod_pagelist .categories-menu ul li.active span {
color: #FDCA00;
text-decoration: none;
}
@media all and (min-width: 0px) and (max-width: 575px) {
.mod_pagelist .categories-menu ul li {
margin-left: 0;
margin-right: 0;
width: 100%;
}
}
#main .mod_article.l-article-product-list .ce_pageteaser {
width: calc(33.33% - 30px);
margin-top: 0;
margin-left: 15px;
margin-right: 15px;
margin-bottom: 30px;
}
@media all and (min-width: 0px) and (max-width: 575px) {
#main .mod_article.l-article-product-list .ce_pageteaser {
margin-left: 0;
margin-right: 0;
width: 100%;
}
}
@media all and (min-width: 576px) and (max-width: 768px) {
#main .mod_article.l-article-product-list .ce_pageteaser {
width: calc(50% - 30px);
}
#main .mod_article.l-article-product-list .ce_pageteaser .c-page-teaser__image {
height: 120px;
}
}
@media all and (min-width: 769px) and (max-width: 991px) {
#main .mod_article.l-article-product-list .ce_pageteaser {
width: calc(50% - 30px);
}
#main .mod_article.l-article-product-list .ce_pageteaser .c-page-teaser__image {
height: 160px;
}
}
@media all and (min-width: 992px) and (max-width: 1365px) {
#main .mod_article.l-article-product-list .ce_pageteaser .c-page-teaser__image {
height: 160px;
}
}
#main .mod_article.l-article-product-list-large {
overflow: visible;
}
#main .mod_article.l-article-product-list-large > .inside {
overflow: visible;
}
#main .mod_article.l-article-product-list-large .ce_pageteaser {
width: calc(16.66% - 30px);
margin-top: 0;
margin-left: 15px;
margin-right: 15px;
margin-bottom: 30px;
transition: 300ms;
}
#main .mod_article.l-article-product-list-large .ce_pageteaser:hover, #main .mod_article.l-article-product-list-large .ce_pageteaser:focus-within {
transform: scale(1.05);
}
#main .mod_article.l-article-product-list-large .ce_pageteaser > .c-page-teaser {
padding-bottom: 140px;
}
#main .mod_article.l-article-product-list-large .ce_pageteaser > .c-page-teaser .c-page-teaser__image {
height: 160px;
}
@media all and (min-width: 0px) and (max-width: 575px) {
#main .mod_article.l-article-product-list-large .ce_pageteaser {
width: 100%;
}
}
@media all and (min-width: 576px) and (max-width: 768px) {
#main .mod_article.l-article-product-list-large .ce_pageteaser {
width: calc(50% - 30px);
}
#main .mod_article.l-article-product-list-large .ce_pageteaser .c-page-teaser__image {
height: 120px;
}
}
@media all and (min-width: 769px) and (max-width: 991px) {
#main .mod_article.l-article-product-list-large .ce_pageteaser {
width: calc(50% - 30px);
}
#main .mod_article.l-article-product-list-large .ce_pageteaser > .c-page-teaser {
padding-bottom: 140px;
}
#main .mod_article.l-article-product-list-large .ce_pageteaser > .c-page-teaser .c-page-teaser__image {
height: 160px;
}
}
@media all and (min-width: 992px) and (max-width: 1365px) {
#main .mod_article.l-article-product-list-large .ce_pageteaser {
width: calc(33.33% - 30px);
}
#main .mod_article.l-article-product-list-large .ce_pageteaser > .c-page-teaser {
padding-bottom: 140px;
}
#main .mod_article.l-article-product-list-large .ce_pageteaser > .c-page-teaser .c-page-teaser__image {
height: 160px;
}
}
@media all and (min-width: 1366px) and (max-width: 1599px) {
#main .mod_article.l-article-product-list-large .ce_pageteaser {
width: calc(25% - 30px);
}
#main .mod_article.l-article-product-list-large .ce_pageteaser > .c-page-teaser {
padding-bottom: 140px;
}
#main .mod_article.l-article-product-list-large .ce_pageteaser > .c-page-teaser .c-page-teaser__image {
height: 160px;
}
}
/******************************************/
/**************** PAGES *******************/
/******************************************/
/******************************************/
/****************** LIDER *****************/
/******************************************/
@media all and (min-width: 0px) and (max-width: 575px) {
.l-page-home #main .l-article-lider .ce_group > .ce_text {
margin-bottom: 50px;
}
}
/******** GOOGLE MAP ***********/
.l-page-contact .l-header {
padding-bottom: 0px;
}
#dlh_googlemap_1 {
width: 100%;
height: 350px;
padding-bottom: 0% !important;
/* @include breakpoint(mobile) {
padding-bottom: 50%!important;
}
@include breakpoint(mobile_small) {
padding-bottom: 80%!important;
}
@include breakpoint(desktop) {
padding-bottom: 30%!important;
}
@include breakpoint(desktop_full) {
padding-bottom: 25%!important;
} */
}
#dlh_googlemap_1 .gm-ui-hover-effect {
top: 5px !important;
right: 5px !important;
}
#dlh_googlemap_1 .c-gmap_infobox__content {
padding: 20px;
}
#dlh_googlemap_1 .c-gmap_infobox__content p {
font-size: 15px;
}
#dlh_googlemap_1 .c-gmap_infobox__content p:first-child {
margin-bottom: 10px;
}
/******** CONTACT DATA ***********/
.l-contact-data-boxes {
margin-left: auto;
margin-right: auto;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
@media all and (max-width: 991px) {
.l-contact-data-boxes {
justify-content: flex-start;
}
}
@media all and (min-width: 992px) {
.l-contact-data-boxes {
justify-content: center;
}
}
.l-contact-data-boxes .ce_text {
margin-top: 10px !important;
margin-bottom: 10px !important;
width: auto;
box-sizing: border-box;
margin: 0;
padding: 10px;
padding-left: 50px;
}
@media all and (min-width: 0px) and (max-width: 575px) {
.l-contact-data-boxes .ce_text {
width: 100%;
}
}
@media all and (min-width: 576px) and (max-width: 768px) {
.l-contact-data-boxes .ce_text {
width: 50%;
}
}
@media all and (min-width: 769px) and (max-width: 991px) {
.l-contact-data-boxes .ce_text {
width: 33.33%;
}
}
@media all and (min-width: 992px) {
.l-contact-data-boxes .ce_text {
justify-content: center;
margin-left: 30px;
margin-right: 30px;
}
}
.l-contact-data-boxes .ce_text h5 {
margin-bottom: 5px;
}
.l-contact-data-boxes .ce_text a, .l-contact-data-boxes .ce_text .c-link-ico {
color: #06081A;
text-decoration: none;
}
.l-contact-data-boxes .ce_text a:hover, .l-contact-data-boxes .ce_text .c-link-ico:hover {
color: #FDCA00;
text-decoration: underline;
}
.l-contact-data-boxes .ce_text.ico--phone {
background: url('data:image/svg+xml;utf-8,') 0 15px no-repeat;
}
.l-contact-data-boxes .ce_text.ico--phone-mail {
background: url('data:image/svg+xml;utf-8,') 0 15px no-repeat;
}
.l-contact-data-boxes .ce_text.ico--email {
background: url('data:image/svg+xml;utf-8,') 0 15px no-repeat;
}
.l-contact-data-boxes .ce_text.ico--skype {
background: url('data:image/svg+xml;utf-8,') 0 15px no-repeat;
}
.l-contact-data-boxes .ce_text.ico--messenger {
background: url('data:image/svg+xml;utf-8,') 0 15px no-repeat;
}
.l-contact-data-boxes .ce_text.ico--whatsapp {
background: url('data:image/svg+xml;utf-8,') 0 15px no-repeat;
}
/******** CONTACT FORM ***********/
#main #ask-us-article .ce_form {
max-width: 1100px;
margin-left: auto;
margin-right: auto;
}
/*
//different margins on contact page
.l-page-contact #main #ask-us-article{
margin-top: 0;
margin-bottom: 0;
padding-top: $size-space-article;
padding-bottom: $size-space-article;
@include breakpoint(mobile) {
padding-top: $size-space-block;
padding-bottom: $size-space-block;
}
}
*/
/******** WORLD ***********/
#main .mod_article.l-contact-world-article {
padding-top: 80px;
padding-bottom: 80px;
margin-top: 0px;
margin-bottom: 0px;
}
#main .mod_article.l-contact-world-article > .inside {
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
}
#main .mod_article.l-contact-world-article .inside > .block:first-child {
margin-bottom: 0;
margin-top: 0;
}
@media all and (max-width: 991px) {
#main .mod_article.l-contact-world-article .inside > .block:first-child {
width: 100%;
margin-bottom: 50px;
}
}
@media all and (min-width: 769px) and (max-width: 991px) {
#main .mod_article.l-contact-world-article .inside > .block:first-child {
width: calc(50% - 25px);
}
}
@media all and (min-width: 992px) {
#main .mod_article.l-contact-world-article .inside > .block:first-child {
width: 500px;
}
}
#main .mod_article.l-contact-world-article .inside > .block:last-child {
margin-bottom: 0;
margin-top: 0;
}
@media all and (max-width: 991px) {
#main .mod_article.l-contact-world-article .inside > .block:last-child {
width: 100%;
}
}
@media all and (min-width: 769px) and (max-width: 991px) {
#main .mod_article.l-contact-world-article .inside > .block:last-child {
width: calc(50% - 25px);
}
}
@media all and (min-width: 992px) {
#main .mod_article.l-contact-world-article .inside > .block:last-child {
width: calc(100% - 600px);
}
}
#main .mod_article.l-contact-world-article .ce_text .ico--phone {
display: inline-block;
height: 32px;
line-height: 32px;
padding-left: 40px;
background: url('data:image/svg+xml;utf-8,') 0 0 no-repeat;
color: #06081A;
}
#main .mod_article.l-contact-world-article .ce_text .ico--email {
display: inline-block;
height: 32px;
line-height: 32px;
padding-left: 40px;
background: url('data:image/svg+xml;utf-8,') 0 0 no-repeat;
color: #06081A;
}
.l-social-media {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
max-width: 1200px;
margin-left: auto;
margin-right: auto;
}
.l-social-media > .block {
margin-top: 20px !important;
margin-bottom: 20px !important;
margin-left: 20px;
margin-right: 20px;
}
.ce_accordion.head-pl .toggler {
background: #f5f5f5 url("../../bundles/migocontaomigoapp/img/flag-pl.png") no-repeat 20px center;
padding-left: 60px;
}
.ce_accordion.head-hu .toggler {
background: #f5f5f5 url("../../bundles/migocontaomigoapp/img/flag-hu.png") no-repeat 20px center;
padding-left: 60px;
}
.ce_accordion.head-sr .toggler {
background: #f5f5f5 url("../../bundles/migocontaomigoapp/img/flag-sr.svg") no-repeat 20px center;
background-size: 25px;
padding-left: 60px;
}
/******** VERY FUNNY BANNER ***********/
#main .l-o-firmie-baner-article {
/*** banner ***/
}
@media all and (max-width: 991px) {
#main .l-o-firmie-baner-article {
background-image: none !important;
}
}
#main .l-o-firmie-baner-article > .inside {
display: flex;
justify-content: flex-start;
align-items: flex-start;
flex-wrap: wrap;
}
#main .l-o-firmie-baner-article > .inside > .block {
margin-top: 0;
margin-bottom: 0;
}
#main .l-o-firmie-baner-article > .inside > .block.ce_text {
position: relative;
max-width: 1088px;
}
@media all and (max-width: 991px) {
#main .l-o-firmie-baner-article > .inside > .block.ce_text {
width: 100%;
}
}
@media all and (min-width: 992px) {
#main .l-o-firmie-baner-article > .inside > .block.ce_text {
width: calc(100% - 375px);
}
}
@media all and (min-width: 992px) and (max-width: 1365px) {
#main .l-o-firmie-baner-article > .inside > .block.ce_text {
width: calc(100% - 200px);
}
}
@media all and (min-width: 0px) and (max-width: 575px) {
#main .l-o-firmie-baner-article > .inside > .block.ce_image {
width: 80px;
position: absolute;
bottom: 10px;
right: 20px;
}
}
@media all and (min-width: 576px) and (max-width: 768px) {
#main .l-o-firmie-baner-article > .inside > .block.ce_image {
width: 120px;
position: absolute;
bottom: 10px;
right: 30px;
}
}
@media all and (min-width: 769px) and (max-width: 991px) {
#main .l-o-firmie-baner-article > .inside > .block.ce_image {
width: 180px;
position: absolute;
bottom: 10px;
right: 30px;
}
}
@media all and (min-width: 992px) and (max-width: 1365px) {
#main .l-o-firmie-baner-article > .inside > .block.ce_image {
width: 200px;
}
}
#main .l-o-firmie-baner-article .ce_text h3 {
display: block;
}
@media all and (max-width: 991px) {
#main .l-o-firmie-baner-article .ce_text h3 {
position: absolute;
bottom: auto;
left: 20px;
right: 20px;
top: 0;
}
}
@media all and (min-width: 0px) and (max-width: 575px) {
#main .l-o-firmie-baner-article .ce_text h3 {
font-size: 24px;
}
}
@media all and (min-width: 992px) {
#main .l-o-firmie-baner-article .ce_text h3 {
position: absolute;
bottom: 120px;
left: 120px;
}
}
#main .l-o-firmie-baner-article .ce_text .image_container:after {
content: "";
display: block;
position: absolute;
background: url('data:image/svg+xml;utf-8,') center no-repeat;
}
@media all and (min-width: 992px) {
#main .l-o-firmie-baner-article .ce_text .image_container:after {
width: 100px;
height: 100px;
background-size: 100px 100px;
top: 30px;
right: 30px;
}
}
@media all and (max-width: 991px) {
#main .l-o-firmie-baner-article .ce_text .image_container:after {
width: 50px;
height: 50px;
background-size: 50px 50px;
top: 10px;
right: 10px;
}
}
/******** CATEGORIES AND ICONS ***********/
#main .l-article-about-offer .l-plus-icon {
margin-top: 0;
margin-bottom: 0;
}
#main .l-article-about-offer .l-about-categories-icons {
display: flex;
justify-content: space-around;
align-items: center;
flex-wrap: wrap;
margin-top: 10px;
}
#main .l-article-about-offer .l-about-categories-icons > .block {
margin-top: 0;
margin-bottom: 0;
}
/******** VALUES ***********/
#main .l-article-about-values .ce_group {
display: flex;
justify-content: space-between;
align-items: stretch;
flex-wrap: wrap;
}
#main .l-article-about-values .ce_group > .block {
/* @include breakpoint(mobile_mid) {
width: 100%;
} */
min-height: 340px;
margin: 0;
}
@media all and (max-width: 991px) {
#main .l-article-about-values .ce_group > .block {
width: 50%;
}
}
@media all and (min-width: 0px) and (max-width: 575px) {
#main .l-article-about-values .ce_group > .block {
width: 100%;
}
}
@media all and (min-width: 992px) {
#main .l-article-about-values .ce_group > .block {
width: 33.3333%;
}
}
#main .l-article-about-values .ce_group > .ce_text {
padding: 30px 50px 20px;
box-sizing: border-box;
}
#main .l-article-about-values .ce_group > .ce_text h4 {
margin-bottom: 15px;
}
#main .l-article-about-values .ce_group > .ce_text ul > li {
margin-bottom: 12px;
}
#main .l-article-about-values .ce_group > .ce_image {
overflow: hidden;
position: relative;
}
#main .l-article-about-values .ce_group > .ce_image .image_container {
position: absolute;
left: 50%;
transform: translateX(-50%);
}
#main .l-article-about-values .ce_group > .ce_image .image_container img {
max-height: none;
max-width: none;
}
/******** MISSION ***********/
#main .l-article-about-mission .ce_text {
text-align: center;
}
#main .l-article-about-mission .ce_text h2 {
font-weight: 700;
font-size: 85px;
text-align: center;
color: #FDCA00;
}
@media all and (max-width: 991px) {
.l-page-services #main .l-article-services .ce_text h3 {
font-size: 24px;
margin-top: 15px;
margin-bottom: 15px;
}
}
@media all and (min-width: 576px) and (max-width: 768px) {
.l-page-services #main .l-article-services .ce_text {
width: calc(50% - 50px);
}
}
@media all and (min-width: 769px) and (max-width: 991px) {
.l-page-services #main .l-article-services .ce_text {
width: calc(50% - 50px);
}
}
/******************************************/
/********** MAIN CATEGORIES ***************/
/******************************************/
#main .l-article-products-icons {
display: flex;
justify-content: space-around;
align-items: center;
flex-wrap: wrap;
}
#main .l-article-products-icons > .block {
margin-top: 0;
margin-bottom: 0;
}
/******************************************/
/************ PRODUCT LIST ****************/
/******************************************/
/****** PAGE TEASER LIST - SIMPLE *********/
#main .mod_article.l-article-product-list > .inside {
display: flex;
justify-content: flex-start;
align-items: flex-start;
flex-wrap: wrap;
margin-left: auto;
margin-right: auto;
}
@media all and (min-width: 0px) and (max-width: 575px) {
#main .mod_article.l-article-product-list > .inside {
margin-left: 0;
margin-right: 0;
width: 100%;
}
}
/******************************************/
/************** PRODUCT *******************/
/******************************************/
/**************** HEAD ********************/
#main .mod_article.l-artice-product-head {
margin-top: -100px;
padding-bottom: 110px;
background-color: #F5F5F5;
}
#main .mod_article.l-artice-product-head > .inside {
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
}
#main .mod_article.l-artice-product-head > .inside > .block {
margin-top: 0;
}
@media all and (max-width: 991px) {
#main .mod_article.l-artice-product-head > .inside > .block:first-child {
width: 100%;
order: 2;
}
#main .mod_article.l-artice-product-head > .inside > .block:last-child {
width: 100%;
order: 1;
margin-bottom: 50px;
}
}
@media all and (min-width: 992px) {
#main .mod_article.l-artice-product-head > .inside > .block {
width: calc(50% - 25px);
}
}
@media all and (min-width: 992px) and (max-width: 1365px) {
#main .mod_article.l-artice-product-head > .inside > .block:first-child {
width: 100%;
order: 2;
}
#main .mod_article.l-artice-product-head > .inside > .block:last-child {
width: 100%;
order: 1;
margin-bottom: 50px;
}
}
@media all and (min-width: 1366px) and (max-width: 1599px) {
#main .mod_article.l-artice-product-head > .inside > .block:first-child {
width: 100%;
order: 2;
}
#main .mod_article.l-artice-product-head > .inside > .block:last-child {
width: 100%;
order: 1;
margin-bottom: 50px;
}
}
@media all and (min-width: 576px) and (max-width: 768px) {
#main .l-artice-product-desc > .inside > .block {
width: 100%;
margin-left: 0;
margin-right: 0;
margin-bottom: 25px;
}
}
.mod_newsreader p.back {
margin-top: 30px;
margin-bottom: 30px;
}
@media all and (min-width: 992px) and (max-width: 1365px) {
.l-top__container .l-top-ui__buttons {
right: 230px;
}
}
@media all and (min-width: 1366px) and (max-width: 1599px) {
.l-top__container .l-top-ui__buttons {
right: 230px;
}
}
/******************************************/
/************** MAIN SECTION **************/
/******************************************/
/************** SUB SECTION ****************/
/*** block ***/
/* element */
/*
long
text
comment
*/
/*
namespaces:
https://csswizardry.com/2015/03/more-transparent-ui-code-with-namespaces/
l- layout
cl - contao laout
c- component
cc - contao component
u- utility
js- javascript
is- / has- state
docelowo componenty powinny byc rozbite na:
o- object
c- component
*/
/*# sourceMappingURL=main.css.map */
#colorbox,#cboxOverlay,#cboxWrapper{position:absolute;top:0;left:0;z-index:9999;overflow:hidden;-webkit-transform:translate3d(0,0,0)}#cboxWrapper{max-width:none}#cboxOverlay{position:fixed;width:100%;height:100%}#cboxMiddleLeft,#cboxBottomLeft{clear:left}#cboxContent{position:relative}#cboxLoadedContent{overflow:auto;-webkit-overflow-scrolling:touch}#cboxTitle{margin:0}#cboxLoadingOverlay,#cboxLoadingGraphic{position:absolute;top:0;left:0;width:100%;height:100%}#cboxPrevious,#cboxNext,#cboxClose,#cboxSlideshow{cursor:pointer}.cboxPhoto{float:left;margin:auto;border:0;display:block;max-width:none;-ms-interpolation-mode:bicubic}.cboxIframe{width:100%;height:100%;display:block;border:0;padding:0;margin:0}#colorbox,#cboxContent,#cboxLoadedContent{box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box}#cboxOverlay{background:#000;opacity:.9;filter:alpha(opacity = 90)}#colorbox{outline:0}#cboxContent{margin-top:20px;background:#000}.cboxIframe{background:#fff}#cboxError{padding:50px;border:1px solid #ccc}#cboxLoadedContent{border:5px solid #000;background:#fff}#cboxTitle{position:absolute;top:-20px;left:0;color:#ccc}#cboxCurrent{position:absolute;top:-20px;right:0;color:#ccc}#cboxLoadingGraphic{background:url(../../assets/colorbox/images/loading.gif) no-repeat center center}#cboxPrevious,#cboxNext,#cboxSlideshow,#cboxClose{border:0;padding:0;margin:0;overflow:visible;width:auto;background:0 0}#cboxPrevious:active,#cboxNext:active,#cboxSlideshow:active,#cboxClose:active{outline:0}#cboxSlideshow{position:absolute;top:-20px;right:90px;color:#fff}#cboxPrevious{position:absolute;top:50%;left:5px;margin-top:-32px;background:url(../../assets/colorbox/images/controls.png) no-repeat top left;width:28px;height:65px;text-indent:-9999px}#cboxPrevious:hover{background-position:bottom left}#cboxNext{position:absolute;top:50%;right:5px;margin-top:-32px;background:url(../../assets/colorbox/images/controls.png) no-repeat top right;width:28px;height:65px;text-indent:-9999px}#cboxNext:hover{background-position:bottom right}#cboxClose{position:absolute;top:5px;right:5px;display:block;background:url(../../assets/colorbox/images/controls.png) no-repeat top center;width:38px;height:19px;text-indent:-9999px}#cboxClose:hover{background-position:bottom center}
table.sortable thead th{background-image:url(../../assets/tablesorter/images/default.svg);background-repeat:no-repeat;background-position:center right}table.sortable thead th.tablesorter-headerDesc{background-image:url(../../assets/tablesorter/images/asc.svg)}table.sortable thead th.tablesorter-headerAsc{background-image:url(../../assets/tablesorter/images/desc.svg)}