@tailwind base;
@tailwind components;
@tailwind utilities;


body, div, span, h1, h2, h3, a, p, input, td, textarea, ol, ul, li, label, img, i, hr, select, header {margin: 0 ; padding: 0 ; font-size:100% }

*, ::before, ::after {
  box-sizing: border-box;
}

  /* Zajištění plné šířky a výšky stránky */
  #map {
    
    width: 100%;
}

.gm-style-iw {
background-color: yellow !important;
padding: 5px 0 !important;
border-radius: 5px !important;
}
.gm-style .gm-style-iw-tc::after {background-color: yellow !important;}

/* Skrytí zavíracího tlačítka */
.gm-ui-hover-effect, .gm-style-iw-chr {
display: none !important;
}

img,
video {
 max-width: none;
  height: none !important;
}


#map img {max-width: none !important;}

.barlow {font-family: 'Barlow Semi Condensed', sans-serif !important;}
.roboto {font-family: 'Roboto', sans-serif !important;}
.dancing {font-family: 'Dancing Script', cursive;} /* Psane */
.caveat {font-family: 'Caveat', cursive;} /* Psane */
.firacond {font-family: 'Fira Sans Condensed', sans-serif;}
.alegreya-sans {font-family: 'Alegreya Sans', sans-serif;}
.alegreya-serif {font-family: 'Alegreya', serif;}
.istok-web-regular {font-family: "Istok Web", sans-serif;}
.poppins {font-family: "Poppins", sans-serif;}
.cairo {font-family: "Cairo", sans-serif;}
.questrial-regular {
  font-family: "Questrial", sans-serif;
}

.lexend-deca {
  font-family: "Lexend Deca", sans-serif;
}

.petrona {
  font-family: "Petrona", serif;
  font-style: normal;
}

.oswald {
  font-family: "Oswald", sans-serif;
}
/* Použité */
.vollkorn{
  font-family: "Vollkorn", serif;
}

.text-cyan-purple {
  background: #06B6D4;
  background: linear-gradient(to left, #06B6D4 0%, #6B21A8 63%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.bg-cyan-purple {background: #06B6D4;
  background: linear-gradient(to right, #06B6D4 0%, #6B21A8 100%);}

   /*-------------------------------------------------------------------------------------*/

/*Apple */
a[x-apple-data-detectors] {
  color: inherit !important;
  text-decoration: none !important;
  font-size: inherit !important;
  font-family: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
}


label {margin-bottom: 7px; display: block;}

#adminmenu a:hover , #clientmenu a:hover { color: yellow;}

.radiolist label {display: inline !important;}
#adminmenu a:hover, #clientmenu a:hover {
  color: yellow !important; text-decoration: none;
}


body input[type=required] {border:2px red solid;}
body input[type=checkbox], body input[type=radio] { margin-right: 7px;}
body #Admin input[type=checkbox], body #Admin  input[type=radio] {width: auto; margin-right: 7px;}



@media screen and (-webkit-min-device-pixel-ratio:0) {
    select {
        -webkit-appearance: menulist-button !important;
        line-height:25px !important;
    }
}



/* --------------------------------------------*/
/* Classic Form */
form tr th {text-align: right; padding: 3px 0px 3px 7px;}
form table {width: 100%;}
form tr td {padding: 10px 0px;}


form input {width:100%;  box-sizing: border-box;}
form input.button {width: auto; background-color: #0291cf; color: #fff; line-height: 50px; display: inline-block;  padding: 0 10px 0 10px; border-radius: 1px; border:0;}
#Admin form input[required=""] { border:1px red solid !important}

.input-none {display: none;}

select {
  padding: 0px 3% !important; 
  border-radius: 6px;
  width: 100%;
  box-sizing: border-box;
  height: 45px;
  border: 1px #ccc solid;
  background-color: transparent;
}




ul li {list-style: none; }


/*#adminmenu .seo, #adminmenu .newsletters, #adminmenu  .manufactures, #adminmenu .parameters {display: none !important;}*/

.text ul, .text ol { padding-left: 35px; margin: 15px 0;  }
.text ul li {list-style: none; font-size: 1em; margin: 7px 0;}
.text ol li {margin-bottom: 7px; font-size: 1em; font-weight: 600;}
.text a {color: #b3642aed;}

.text li::before {
  content: "\f058"; /* Unicode character for the desired Font Awesome icon */
  font-family: "Font Awesome 5 Free"; /* Font family used by Font Awesome */
  margin-right: 10px; /* Adjust the spacing between the icon and text */
  color:#42AD5C;
margin-left: -30px;
}



.text h2 {font-family: "Poppins", sans-serif; color: #78716c; font-size: 1.4em; line-height: 40px; text-align: center; margin: 20px 0px;  font-weight: 500;}
.text img {padding:2%;}
.text p {margin-bottom: 7px;}
  

.unsuccess {text-align: center; line-height: 60px; font-size: 1.4em; color: #fff; background-color: red;}
.success {text-align: center; line-height: 50px; font-size: 1.3em; color: #fff; background-color: #759d27;}


/* The Modal (background) */
.modal {
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
  background-color: #fff;
  margin: auto;
  width: 80%;
  position: relative;
}

/* The Close Button */
.close {
  
  line-height: 50px !important; 
  height: 50px;
  width: 50px;
  text-align: center !important;
  padding: 0  !important;
  float: right;
  font-size: 28px;
  font-weight: bold;
  opacity: 1 !important;
  
  text-shadow: none !important;
}

.close:hover,
.close:focus {
  color: #fff !important;
  background-color: #333 !important;
  text-decoration: none;
  cursor: pointer;
  opacity: 1;
}

/*Loader before load web page*/




  /* Customize the label (the container) */
  .cont {
    display: block;
    position: relative;
    padding-left: 30px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default checkbox */
.cont input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

/* Create a custom checkbox */
.checkmark {
    position: absolute;
    top: 6px;
    left: 0;
    height: 17px;
    width: 17px;
    border:1px #111 solid; 
    background-color: #fff;
    border-radius: 4px;
}

/* On mouse-over, add a grey background color */
.cont:hover input.violet ~ .checkmark {
    background-color: #9400c9;
}

/* When the checkbox is checked, add a blue background */
.cont input.violet:checked ~ .checkmark {
    background-color: #9400c9;
}

/* On mouse-over, add a grey background color */
.cont:hover input.blue ~ .checkmark {
    background-color: #1971c2;
}


/* When the checkbox is checked, add a blue background */
.cont input.blue:checked ~ .checkmark {
    background-color: #1971c2;
}

/* On mouse-over, add a grey background color */
.cont:hover input.tyrkis ~ .checkmark {
    background-color: #cfbfa0;
}


/* When the checkbox is checked, add a blue background */
.cont input.tyrkis:checked ~ .checkmark {
    background-color: #cfbfa0; border:1px #cfbfa0 solid;
}

/* On mouse-over, add a grey background color */
.cont:hover input.green ~ .checkmark {
    background-color: orange;
    border: 1px orange solid;
    border-radius: 2px;
}

/* When the checkbox is checked, add a blue background */
.cont input.green:checked ~ .checkmark {
    background-color: #73ad02;
    border: 1px #fff solid;
}


/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.cont input:checked ~ .checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
.cont .checkmark:after {
    left: 6px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
/* Quantity*/

.number-input {
  border: 2px solid #ddd;
  display: inline-flex;
  border-radius: 4px;
}

.number-input,
.number-input * {
  box-sizing: border-box;
}

.number-input .button {
  outline:none;
  background-color: transparent;
  border: none;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  cursor: pointer;
  margin: 0;
  position: relative;
}

.number-input .button:after {
  display: inline-block;
  position: absolute;
  font-family: "Font Awesome 5 Free"; 
  font-weight: 900;
  content: '\f077';
  transform: translate(-50%, -50%) rotate(180deg);
}
.number-input .plus:after {
  transform: translate(-50%, -50%) rotate(0deg);
}

.number-input input[type=number] {
  font-family: sans-serif;
  max-width: 5rem;
  padding: .5rem;
  border: solid #ddd;
  border-width: 0 2px;
  font-size: 1.2rem;
  height: 51px;
  font-weight: bold;
  text-align: center;
}