/* typography */

h1 {
    text-transform: uppercase;
}

button.btn, a.btn, a.sparky_button {
    background: var(--sparkycolor4);
    border: 0;
    color: #fff;
    padding: 13px 25px;
}

button.btn:hover, a.btn:hover, button.btn:active, a.btn:active, a.sparky_button:hover, a.sparky_button:active {
    background: var(--sparkycolor3) !important;
    border: 0;
    color: #fff;
}

button.btn.active, a.btn.active {
    background: var(--sparkycolor2);
}

button.btn.btn-secondary, a.btn.btn-secondary {
    background: transparent;
    color: var(--sparkycolor4);
    border: 1px solid var(--sparkycolor4);
}

button.btn.btn-secondary:hover, a.btn.btn-secondary:hover, button.btn.btn-secondary:active, a.btn.btn-secondary:active {
    background: transparent !important;
    color: #333;
    border: 1px solid #333;
}

.form-group {
    padding-bottom: 15px;
}

.form-control {
    border-radius: 0;
    padding: 11px;
}

.input-group button.btn {
    padding: 7px 15px 6px;
}

span.warning {
    background: transparent;
    border: 0;
}

.sparky_social_icons a:hover {
    color: var(--sparkycolor4);
}

figure img.rounded {
    border-radius: 50% !important;
}

/* header row */

.header_row {
    position: relative;
    z-index: 1;
    background: #707070 url(../images/header_bg.png) top center no-repeat;
    background-size: cover;
}

.header_row::after {
    content: " ";
    display: block;
    width: 100%;
    height: 1px;
    background: url(../images/header_line.png) top center no-repeat;
}

.header_row > .sparky_container {
    display: flex;
}

.header_row .mp_top1 {
    display: flex;
    flex-direction: column;
    padding-top: 0;
    padding-bottom: 0;
    padding-right: 0;
}

.header_row .mp_top1 .moduletable:last-child {
    margin-top: auto;
}

.header_row .mp_top1 .moduletable > nav {
    top: 1px;
}

.header_row .input-group {
    justify-content: flex-end;
}

.header_row button.btn {
    background: #666;
    border-radius: 0 0 5px 5px;
    padding: 5px 10px;
}

.header_row button.btn:focus {
    color: #fff;
}

.header_row .form-control {
    border: 0;
    background: rgba(255,255,255,0.3);
    color: #fff;
}

.header_row .form-control:focus {
    box-shadow: none;
    background: rgba(0,0,0,1);
}

.header_row ul.menu li {
    border-radius: 5px 5px 0 0;
}

/* carousel row */

.carousel_row {
    background: #3E4041 url(../images/header_line.png) no-repeat center top;
}

.carousel_row::after {
    content: " ";
    display: block;
    width: 100%;
    height: 1px;
    background: url(../images/header_line.png) top center no-repeat;
}

.carousel_row > .sparky_container {
    background: url(../images/body_shadow.png) center repeat-y;
}

.carousel_row > .sparky_container > .sparky_cell {
    box-shadow: 0 0 50px #000;
    padding: 0;
}

.carousel_row .hot_swipe_carousel_slides img {
    max-width: 721px;
}

.carousel_row .flickity-prev-next-button {
    background: none !important;
}

.carousel_row .flickity-prev-next-button .arrow {
    fill: #fff !important;
}

/* content row */

.content_row {
    position: relative;
    background: #3E4041 url(../images/content_bg.png) repeat-x;
}

.content_row > .sparky_container {
    display: flex;
    background: #fff;
    box-shadow: 0 0 50px #000;
}

.sparky_home .content_row main.sparky_cell {
    padding: 0;
}

.sparky_cell.mp_right,
.sparky_cell.mp_left {
    background: #41494b url(../images/column_noise.png);
    padding-left: 0;
    padding-right: 0;
}

.sparky_cell.mp_right div.moduletable,
.sparky_cell.mp_left div.moduletable {
    background: url(../images/module_h3_dots.png) no-repeat;
    color: var(--sparkycolor3);
    font-size: 14px;
    margin-bottom: 30px;
}

.sparky_cell.mp_right div.moduletable > *,
.sparky_cell.mp_left div.moduletable > * {
    padding-left: 15px;
    padding-right: 15px;
}

.sparky_cell.mp_right h3,
.sparky_cell.mp_left h3 {
    color: var(--sparkycolor1);
    text-transform: uppercase;
    padding-bottom: 50px;
}

aside.abovecontent {
    margin: -15px -15px 0 -15px;
}

.mod-randomimage img {
    width: 100% !important;
}

aside.belowcontent {
    margin: 0 -15px -15px -15px;
}

div#system-message-container joomla-alert {
    margin-bottom: 30px;
}

/* home menus row */

.home_menus_row {
    background: #353A44 url(../images/texture_clouds.png) no-repeat top left;
    padding: 30px 0;
}

.home_menus_row > .sparky_container {
    max-width: 840px;
}

.home_menus_row ul.menu li {
    background: url(../images/menu_line.png) bottom left no-repeat;
    text-transform: uppercase;
}

.home_menus_row ul.menu li a {
    display: block;
}

.home_menus_row ul.menu li a:hover {
    background: url(../images/menu_arrow.png) no-repeat right;
}

/* blog */

.items-leading .item-image img {
    width: 100%;
}

.blog-items .blog-item {
    margin-bottom: 30px;
}

.blog-items.columns-2 .blog-item {
    width: calc(50% - 15px);
}

/* faq */

.accordion-button {
    font-weight: 700;
}

.accordion-button:not(.collapsed) {
    background-color: var(--sparkycolor5);
    color: var(--sparkycolor4);
}

.accordion-button:focus {
    box-shadow: none;
}

/* bottom row */

.bottom_row {
    position: relative;
    background: var(--sparkycolor2) url(../images/footer_bg.png) no-repeat top center;
    border-top: 1px solid var(--sparkycolor1);
}

.bottom_row > .sparky_container {
    display: flex;
}

.bottom_row > .sparky_container > .sparky_cell {
    border-left: 2px dotted var(--sparkycolor3);
    padding: 50px;
}

.bottom_row > .sparky_container > .sparky_cell:last-child {
    border-right: 2px dotted var(--sparkycolor3);
}

.bottom_row > .sparky_container > .sparky_cell:hover {
    background: var(--sparkycolor5);
}

/* footer row */

.footer_row {
    background: var(--sparkycolor5);
    border-top: 2px dotted var(--sparkycolor3);
}

.footer_row p {
    font-size: 14px;
    color: var(--sparkycolor1);
    padding: 0;
    margin: 0;
    text-align: right;
}

/* phoca cart */

.ph-pagination-top .btn span {
    color: #fff;
}

.ph-top a.btn.btn-secondary {
    padding: 5px 10px;
}

.ph-item-bottom-box ul.nav-tabs,
.ph-item-bottom-box ul.nav-tabs li {
    margin: 0;
}

.nav-tabs .nav-link {
    color: var(--sparkycolor4);
}

.ph-item-bottom-box .tab-content {
    padding: 15px 0;
}

.ph-item-bottom-box .tab-content .row {
    padding: 7px 15px;
}

.ph-small {
    font-size: 13px;
}

/* phoca cart category */

.ph-category-header {
    text-align: center;
}

.ph-category-price-box {
    text-align: center;
}

.ph-category-price-box .ph-price-txt,
.ph-category-price-box .ph-price-brutto,
.ph-category-price-box .ph-price-original {
    float: none;
}

.ph-button-add-to-cart-box,
.ph-button-choose-variant-box {
    float: none;
    text-align: center;
}

/* phoca cart product */

.ph-item-image-add-box {
    margin-top: 15px;
}

/* phoca cart cart */

.ph-cart-module-box {
    text-align: right;
}

.ph-cart-module-box .ph-cart-count-sup {
    top: 0;
    font-size: 16px;
}

.ph-cart-link-checkout a {
    background: var(--sparkycolor4);
    color: #fff;
    width: 100%;
    display: block;
    text-align: center;
    padding: 7px;
}

.ph-cart-link-checkout {
    text-decoration: none;
}

.ph-cart-link-checkout a:hover {
    background: var(--sparkycolor3);
}

.ph-checkout-cart-row-item button.btn.btn-danger {
    background: red;
    padding: 0 5px;
}

.ph-checkout-cart-row-item button.btn.btn-danger:hover {
    background: #333 !important;
}

/* responsive */

.nav-toggle {
    background: url(../images/tinynav_white.png);
    background-size: 42px 84px;
    margin-right: 15px;
    margin-bottom: 15px;
}

@media (max-width: 1169px) {

    .hot_swipe_carousel_slides .contents {
        left: 67% !important;
        background: rgba(0,0,0,0.5) !important;
    }

}

@media (max-width: 991px) {

    .header_row nav:not(.opened) ul.menu {
        display: none;
    }

    .carousel_row .hot_swipe_carousel_slides img {
        max-width: 100%;
    }

    .hot_swipe_carousel_slides .contents {
        left: 50% !important;
        width: 40% !important;
    }

    .bottom_row > .sparky_container > .sparky_cell {
        padding: 30px;
    }

    form#phItemTopBoxForm {
        display: none;
    }

}

@media (max-width: 700px) {

    .hot_swipe_carousel_slides .contents {
        left: 0 !important;
        background: transparent !important;
        top: 0 !important;
    }

    .home_menus_row {
        background: #353A44 url(../images/texture_clouds.png) no-repeat top left;
        background-size: cover;
    }

    .content_row > .sparky_container {
        flex-direction: column-reverse;
    }

    .blog-items.columns-2 .blog-item {
        width: 100%;
    }

    .bottom_row > .sparky_container {
        display: block;
    }

    .bottom_row {
        background: var(--sparkycolor2) url(../images/footer_bg.png) no-repeat top center;
        background-size: cover;
    }

    .bottom_row > .sparky_container > .sparky_cell {
        padding: 15px 30px;
    }

    .footer_row ul.menu, p.copyright {
        text-align: center;
    }

}

@media (max-width: 500px) {

    .flickity-prev-next-button {
        display: none;
    }

    .header_row button.btn {
        padding: 5px 10px;
    }

}


/* For DEMO purposes only. Can be safely deleted */

.sparky_settings {
    position: fixed;
    z-index: 9999;
    top:70%;
    padding: 5px;
    background: #eceded;
    cursor: pointer;
    line-height: 1.4;
}

.sparky_settings:hover {
    background: #eceded;
}

.settings_content {
    display: none;
    float: left;
    padding-right: 15px;
    height: 28px;
}

.settings_content span {
    display: inline-block;
    width: 28px;
    height: 28px;
    border:3px solid #999;
    border-radius: 19px;
}

.settings_content span:hover {
    border:3px solid #000;
}

.settings_content span.style1 {
    background: #f59a4b;
}

.settings_content span.style2 {
    background: #95bb58;
}

.settings_content span.style3 {
    background: #32a5a0;
}

.settings_content span.style4 {
    background: #ba58bb;
}

.settings_content span.style5 {
    background: #000;
}

.settings_content a {
    text-decoration: none;
}

.settings_cog {
    float: left;
    width: 30px;
    height: 28px;
}

.sparky_settings i {
    font-size: 28px;
    color: #333;
}