/*
Theme Name: Custom Eshop
Author: Brandideon | Michal Halaj
Author URI: https://brandideon.com/
Version: 1.1.0
*/


/* Global style*/

@import url('https://fonts.googleapis.com/css2?family=Rowdies:wght@300;400;700&display=swap');
  

:root {
    --primary-color:#F48021;
    --black-color: #272523;
    --contrast-color:#424242;
    --contrast-two: #F8F8F8;
    --border-radius: 7px;
    --big-size-pc: 3.5rem;
    --medium-size-pc: 2.6rem;
    --medium-size-text-pc: 2rem;
    --small-xl-size-pc: 1.6rem;
    --small-size-pc: 1.4rem;
    --text-size-pc: 1.1rem;
    --big-size-tablet: 3.2rem;
    --medium-size-tablet: 1.8rem;
    --medium-size-text-tablet: 1.8rem;
    --small-size-tablet: 1.6rem;
    --small-size-tablet: 1.4rem;
    --text-size-tablet: 1rem;
    --big-size-mobile: 2rem;
    --medium-size-mobile: 1.6rem;
    --medium-size-text-mobile: 1.6rem;
    --small-size-mobile: 1.2rem;
    --text-size-mobile: 1rem;
}


html,body {
    margin: 0;
    color: white;
    overflow-x: hidden;
    font-family: "Rowdies", sans-serif!important;
    font-weight: 300;
  font-optical-sizing: auto;
  background-color: var(--black-color);
}

* {
    box-sizing: border-box;
}
.relative {
    position: relative;
}

.wc-block-checkout__shipping-method-option {
	background:white!important;
	opacity:0.5!important;
}

.wc-block-checkout__shipping-method-option:hover {
	background:white!important;
	opacity:1!important;
}


.wc-block-components-form .wc-block-components-text-input label, .wc-block-components-text-input label {
    color: #646464!important;
}

.wc-block-checkout__shipping-method-option.wc-block-checkout__shipping-method-option--selected {
	opacity:1!important;
	background: white!important;
}

.absolute {
    position: absolute;
}

/* 
1. page wrap setting 
2. grid flex setting
3. padding margin setting
4. color setting
5. font setting
6. img setting
7. footer
8. ul setting
9. button setting

*/

/* page wrap setting */
.page-wrapper {
    max-width: 1550px;
    width: 100%;
    margin: auto;
}

.page-wrapper-s {
    max-width: 1050px;
    width: 100%;
    margin: auto;
}
/* end page wrap setting */

.pagination.section-padding a {
    background: white;
    padding: 0.3em 0.6em;
    margin-right: 0.5em;
	font-size:1rem!important;
}

.pagination.section-padding span {
	background: var(--primary-color);
    padding: 0.3em 0.6em;
    margin-right: 0.5em;
	    line-height: 1.5;
    margin-top: 0.6em;
    margin-bottom: 0.6em;
	font-size:1rem!important;
	display:inline-block;
}

/* grid flex setting */
.flex-4, .flex-2 {
    display: flex;
    gap: 0.8em;
    flex-wrap: wrap;
    justify-content: space-between;
}

.flex-4 article {
    width: 23%;
}

.grid-2 {
    display: grid;
    grid-template-columns: 50%50%;
}

.grid-2.gap {
    display: grid;
    grid-template-columns: 47%47%;
    gap: 1em;
}

.grid-3 {
    display: grid;
    grid-template-columns: 33%33%33%;
}

.grid-4 {
    display: grid;
    grid-template-columns: 25%25%25%25%;
}

.align-items-center {
    align-items: center;
}

.justify-items-center {
    justify-content: center;
}
/* end grid flex setting */

/* padding margin setting */
.p-s-t {
    padding-top: 160px;
    padding-bottom: 60px;
}

.p-s {
    padding-top: 3em;
    padding-bottom: 3em;
}

.m-1 {
    margin: 1em;
}

.mb-05 {
    margin-bottom: 0.5rem!important;
}

.section-padding {
    padding: 2em;
}

.section-padding-4 {
    padding: 4em;
}
/* end padding margin setting*/

/* color setting */
.bg-primary {
    background-color: var(--primary-color);
    color: white;
}

.bg-black {
    background-color: var(--black-color);
    color: var(--contrast-color);
}

.bg-contrast {
    background-color: var(--contrast-color);
    color: white;
}

.bg-primary-light {
    background-color: var(--primary-light);
}

.color-white {color: white;}


.color-primary {
    color: var(--primary-color);
}
/*end color setting*/

/* font setting */
strong {
    font-weight: bold;
}


.big-size {
    font-size: var(--big-size-pc);
    font-weight: 600;
	line-height: 1.05;
    margin-top: 0.4em;
    margin-bottom: 0.4em;
}

.medium-size {
    font-size: var(--medium-size-pc);
    font-weight: bold;
    margin-top: 0.4em;
    margin-bottom: 0.4em;
    line-height: 1.05;
}

.medium-size-text, h2.woocommerce-Reviews-title {
    font-size: var(--medium-size-text-pc);
    font-weight: 400;
    margin-top: 0.4em;
    margin-bottom: 0.4em;
    line-height: 1.05;
}

.small-xl-size {
    font-size: var(--small-xl-size-pc);
    font-weight: bold;
    line-height: 1.3;
    margin-top: 0.4em;
    margin-bottom: 0.4em;
}

.small-size {
    font-size: var(--small-size-pc);
    font-weight: bold;
    line-height: 1.3;
    margin-top: 0.4em;
    margin-bottom: 0.4em;
}

p, a, button, label, .small-size-text, html body .price.wrapper span.woocommerce-Price-amount.amount, input::placeholder, textarea::placeholder {
    font-size: var(--text-size-pc);
    line-height: 1.5;
    margin-top: 0.6em;
    margin-bottom: 0.6em;
}

.pointer {
	cursor:pointer;
}

a {
 text-decoration: none;
 cursor: pointer;
 display: inline-block;
 color: var(--black-color);
}

.center-text {
    text-align: center;
}

.center-right {
	text-align:right;
}
/* end font setting */

/* img setting */
img {
    width: 100%;
    height: auto;
}

.thumb {
    position: relative;
    height: 450px;
}

.thumb img {
    position: absolute;
    height: 100%;
    width: 100%;
    object-fit: cover;
    z-index: 0;
}
/* end img setting */

.kategorie-item {
    position: relative;
    height: 350px;
    text-align: right;
}

.kategorie-item * {
    position: relative;
    z-index: 2;
}

.kategorie-item .gradient {
  background: #424242;
background: -webkit-linear-gradient(270deg, rgba(66, 66, 66, 1) 30%, rgba(66, 66, 66, 0) 76%);
background: -moz-linear-gradient(270deg, rgba(66, 66, 66, 1) 30%, rgba(66, 66, 66, 0) 76%);
background: linear-gradient(270deg, rgba(66, 66, 66, 1) 30%, rgba(66, 66, 66, 0) 76%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#424242", endColorstr="#424242", GradientType=0);
z-index: 1;
top: 0;
left: 0;
height: 100%;
width: 100%;
position: absolute;
}

.kategorie-item img.thumb-cat {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    object-fit: cover;
    z-index: 0;
}

.kategorie-item a {
    position: absolute;
    bottom: 1em;
    right: 2em;
    z-index: 2;
}

/* footer*/

.section-padding.center-text.copyright
 {
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}

  footer a {
    color: white!important;
  }

  footer {
    color: white!important;
  }

footer img {
    max-width: 160px !important;
	min-width: 140px !important;
    height: auto !important;
    width: 100% !important;
}

footer .copyright a {
    color: var(--primary-color)!important;
}

footer .page-wrapper.flex {
    display: flex;
    justify-content: space-between;
    gap: 1em;
}

footer .page-wrapper div.logo-footer, footer .page-wrapper article {
    width: 30%;
}
/* end footer*/


/* ul setting*/
ul {
    padding: 0;
    margin: 0;
}


ul li {
    margin: 0;
    list-style: none;
}
/* end ul setting*/


/* button setting*/
a.button-primary, .button-primary, .woocommerce #review_form #respond .form-submit input, form input[type="sumbit"],html body button.single_add_to_cart_button, a.wc-block-components-button.wp-element-button.wc-block-cart__submit-button.contained, button.wc-block-components-button.wp-element-button.wc-block-components-checkout-place-order-button.contained, input.wpcf7-form-control.wpcf7-submit {
    background-color: var(--primary-color)!important;
    color: white!important;
    padding: 0.8em;
	border:1px solid var(--primary-color);
    font-weight: 700;
    padding-left: 1.4em;
    padding-right: 1.4em;
    border-radius: var(--border-radius);
    width: max-content;
    display: inline-block;
    text-transform: uppercase;
}

.button-primary-search {
    background-color: var(--primary-color)!important;
    color: var(--black-color)!important;
    padding: 1em;
	border:1px solid var(--primary-color);
    font-weight: 500;
    border-radius: var(--border-radius);
    width: max-content;
    display: inline-block;
    font-size: var(--text-size-pc);
}

a.button-primary:hover, .button-primary:hover, .woocommerce #review_form #respond .form-submit input:hover,html body button.single_add_to_cart_button:hover, a.wc-block-components-button.wp-element-button.wc-block-cart__submit-button.contained:hover, button.wc-block-components-button.wp-element-button.wc-block-components-checkout-place-order-button.contained:hover, input.wpcf7-form-control.wpcf7-submit:hover {
	background-color: var(--primary-light)!important;
    color: var(--primary-color)!important;
}

a.button-black, .button-black {
    background-color: var(--black-color)!important;
    color: white!important;
	border:1px solid var(--black-color);
    padding: 0.8em!important;
    font-weight: 500;
    padding-left: 1.4em!important;
    padding-right: 1.4em!important;
    border-radius: var(--border-radius);
    width: max-content;
    display: inline-block;
    text-transform: uppercase;
}

a.button-black:hover, .button-black:hover {
	border:1px solid white;
	background-color: #363636!important;
}

.border {
	border-radius: var(--border-radius);
}

a.button-black-border, .button-black-border {
    background-color:0;
    color: var(--black-color)!important;
    padding: 1em;
    border: 1px solid var(--black-color)!important;
    font-weight: 500;
    padding-left: 1.4em;
    padding-right: 1.4em;
    font-size: 0.8rem;
    border-radius: 3em;
    letter-spacing: 2px;
    width: max-content;
    display: inline-block;
    text-transform: uppercase;
}

a.button-white-border, .button-white-border {
    background-color:0;
    color: white!important;
    padding: 1em;
    border: 1px solid white!important;
    font-weight: 500;
    padding-left: 1.4em;
    padding-right: 1.4em;
    font-size: 0.8rem;
    border-radius: 3em;
    border-radius: 15px;
    letter-spacing: 2px;
    width: max-content;
    display: inline-block;
}

a.button-white-full, .button-white-full, a.button-white, .button-white {
    background-color:white;
    color: var(--primary-color)!important;
    border: 1px solid white!important;
    padding: 0.8em;
    font-weight: 500!important;
    padding-left: 1.4em;
    font-family: "Rowdies", sans-serif!important;
    padding-right: 1.4em;
    border-radius: var(--border-radius);
    width: max-content;
    display: inline-block;
    text-transform: uppercase;
}
/* end button setting*/

hr {
    border: 0;
    background-color: var(--primary-color);
    height: 3px;
	margin:0;
}

video {width: 100%;
height: auto;}


div#back-to-top {
    height: 40px;
    width: 40px;
    background: var(--primary-color);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    color: white;
    position: fixed;
    bottom: 1em;
    right: 1em;
	z-index:5;
}
      
      
      .reveal.this {
      transform: translateY(150px);
      opacity: 0;
      animation: fadeInText 2s ease forwards;
  }
  
          .reveal.active {
      transform: translateY(0);
      opacity: 1;
  }
  .reveal {
      position: relative;
      transform: translateY(150px);
      opacity: 0;
      transition: 1s all ease;
  }
  /* koniec textu animacie */

 iframe {
    width: 100%;
    height: 350px;
  }

  .wpcf7-spinner {
    display: none;
  }

@media only screen and (max-width: 1450px) {
    .big-size {
        font-size: var(--big-size-tablet);
    }
    
    .medium-size {
        font-size: var(--medium-size-tablet);
    }
    
    .medium-size-text, h2.woocommerce-Reviews-title {
        font-size: var(--medium-size-text-tablet);
    }
    
    .small-size{
        font-size: var(--small-size-tablet);
    }

    p, a, button, label, .small-size-text, html body .price.wrapper span.woocommerce-Price-amount.amount, input::placeholder, textarea::placeholder {
        font-size: var(--text-size-tablet);
    }

    .kategoria-hodiniek article img {
        width: 60%;
    }


   
}


@media only screen and (max-width: 991px) {


    .section-padding {
        padding-top: 1em;
        padding-bottom: 1em;
    }

    .kategorie-item {
    margin-left: 2em;
    margin-right: 2em;
}
	
	footer .page-wrapper div.logo-footer, footer .page-wrapper article {
    width: 100%;
}

    .p-s-t {
        padding-top: 9em;
        padding-bottom: 1.5em;
    }

    .p-s {
        padding-top: 1.5em;
        padding-bottom: 1.5em;
    }
   
    .section-padding-4 {
        padding: 2em;
    }

    .img-thumb img {
        position: relative;
        height: auto;
    }

    .grid-2, .grid-3 {
        grid-template-columns: 100%!important;
    }

     .grid-4 {
        grid-template-columns: 50%50%!important;
    }

    footer * {
        text-align: center!important;
    }

    .big-size {
        font-size: var(--big-size-mobile);
    }
    
    .medium-size {
        font-size: var(--medium-size-mobile);
    }
    
    .medium-size-text, h2.woocommerce-Reviews-title {
        font-size: var(--medium-size-text-mobile);
    }
    
    .small-size, span.woocommerce-Price-amount.amount {
        font-size: var(--small-size-mobile);
    }

    p, a, button, label, .small-size-text, html body .price.wrapper span.woocommerce-Price-amount.amount, input::placeholder, textarea::placeholder {
        font-size: var(--text-size-mobile);
    }
	
	footer .page-wrapper.flex
 {
    display: flex;
    justify-content: space-between;
    gap: 1em;
    align-items: center;
    flex-direction: column;
}
}

@media only screen and (max-width: 651px) {
.grid-4 {
    grid-template-columns: 100%!important;
}
}

