/*
CSS Credit: http://www.relaxujeme.eu/ - Magazín klubu PĚT FOREM
*/

	/* Hlavni definice tagů */


html {
	margin: 0px; 
	padding: 0px; 
	width: 100%; 
    	font-family: 'Candara', palatino linotype;
	width: 100%; 
	font-size: 14px;	
}

body {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;	
    	font-family: 'Candara', palatino linotype;
	width: 100%; 
	font-size: 15px;	
	scrollbar-face-color: #eeeeff; 
	scrollbar-highlight-color: #eeeeff; 
	scrollbar-shadow-color: #eeeeff; 
	scrollbar-3dlight-color: #66699cc; 
	scrollbar-arrow-color: #6699cc; 
	scrollbar-track-color: #eeeeff; 
	scrollbar-darkshadow-color: #6699cc; 
	text-color: #000000;
	color: #000000;
}

form {
	font-family: "Open Sans";
	font-size: 10px;
	font-weight: bold;
	color: #ffffff;
	font-color: #ffffff;
	padding: 0 0 0 0px;
	margin: 0 0 0 0px
}

option {
  	font-family: 'Montserrat', verdana;
	font-size: 10px;
	background: #eeeeee;
	background-color: #eeeeee;
	font-weight: bold;
	color: #696969;
	font-color: #696969;
	padding: 0 0 0 0px;
	margin: 0 0 0 0px
}

select {
  	font-family: 'Montserrat', verdana;
	background: #ffffff;
	background-color: #ffffff;
	font-size: 10px;
	font-weight: bold;
	color: #696969;
	font-color: #696969;
	padding: 0 0 0 0px;
	margin: 0 0 0 0px
}

div {
  	font-family: 'Montserrat', verdana;
	font-size: 13px;
	padding: 0px;
	margin: 0px;
}


blockquote {
  	font-family: 'Montserrat', verdana;
	font-size: 10pt; 
	color: #000000;
}


ul {
	padding-right: 0px; 
	padding-left: 0px; 
	list-style-image: url(i/arr_cont.gif); 
	padding-bottom: 0px; 
	margin: 0px 0px 0px 15px; 
	padding-top: 0px
}

li {
	padding-right: 0px; 
	padding-left: 0px; 
	padding-bottom: 2px; 
	margin: 0px; 
	padding-top: 0px
}

DIV.nagLink {
	CURSOR: pointer
}



hr {
	height: 1px;
	color: brown;
	line: 1;
	size: 1;
	width: 99%;
	align: center;
}


input {
	border: #fbd895 1px solid;
	background: #ffffff;
	font-family: Verdana;
	font-size: 12px;
	padding: 2px;
	margin: 1px;
	color: brown;
}

textarea {
	border: #fbd895 1px solid;
	background: #ffffff;
	font-family: "Open Sans";
	font-size: 12px;
	padding: 1px;
	margin: 1px;
	color: brown;
}

h1 {	
	color: brown;
	text-color: brown;
	}




	/* Hladiny a strofy, doprovodky, orientace */


@font-face { 
	font-family: relaxfont; 
	src: url(fonts/VasePismo.otf); }


  .player {
      display: flex;
      align-items: center;
      gap: 10px;
      font-family: courier new;
    }
    .play-btn {
      background: blue;
      color: white;
      border: none;
      padding: 10px 20px;
      font-size: 16px;
      border-radius: 8px;
      cursor: pointer;
    }
    .play-btn.paused {
      background: red;
    }
    .progress {
      flex: 1;
      height: 6px;
      background: #ccc;
      border-radius: 3px;
      position: relative;
    }
    .progress-bar {
      height: 100%;
      background: #2196F3;
      width: 0%;
      border-radius: 3px;
    }


	/* Odkazy, menu a doprovodné definice */

a {
	margin: 0px; 
	padding: 0px; 
	font-size: 14px;
	font-color: black;
	color: black;
  	font-family: 'Candara', verdana;
	text-decoration: none;
	text-variant: normal;
}

a:visited {
	margin: 0px; 
	padding: 0px; 
	font-size: 14px;
	font-color: black;
	color: black;
	text-decoration: none;
	text-variant: normal;
  	font-family: 'Candara', verdana;
}

a:active {
	margin: 0px; 
	padding: 0px; 
	color: #1d1d1d;
	font-size: 14px;
	font-color: brown;
	color: brown;
  	font-family: 'Candara', verdana;
	text-decoration: none;
	text-variant: normal;
}

a:hover {
	margin: 0px; 
	padding: 0px; 
	color: #1d1d1d;
	font-size: 14px;
	font-color: red;
	color: red;
  	font-family: 'Candara', verdana;
	text-decoration: none;
	text-variant: normal;
}


a.menu {
	margin: 0px; 
	padding: 0px; 
	font-size: 15px;
	color: yellow;
  	font-family: 'Candara', verdana;
	text-decoration: none;
}

a.menu:visited {
	margin: 0px; 
	padding: 0px; 
	font-size: 15px;
	color: yellow;
  	font-family: 'Candara', verdana;
	text-decoration: none;
}

a.menu:active {
	margin: 0px; 
	padding: 0px; 
	font-size: 15px;
	color: yellow;
  	font-family: 'Candara', verdana;
	text-decoration: none;
}

a.menu:hover {
	margin: 0px; 
	padding: 0px; 
	font-size: 16px;
	color: #ffffff;
  	font-family: 'Candara', verdana;
	text-decoration: none;
}



a.link {
	margin: 0px; 
	padding: 0px; 
	font-size: 17px;
	color: brown;
  	font-family: 'Candara', verdana;
	text-decoration: none;
}

a.link:visited {
	margin: 0px; 
	padding: 0px; 
	font-size: 17px;
	color: brown;
  	font-family: 'Candara', verdana;
	text-decoration: none;
}

a.link:active {
	margin: 0px; 
	padding: 0px; 
	font-size: 17px;
	color: brown;
  	font-family: 'Candara', verdana;
	text-decoration: none;
}

a.link:hover {
	margin: 0px; 
	padding: 0px; 
	font-size: 17px;
	color: green;
  	font-family: 'Candara', verdana;
	text-decoration: none;
}



a.zapati {
	margin: 0px; 
	padding: 0px; 
	font-size: 16px;
	color: blue;
  	font-family: 'Candara', verdana;
	text-decoration: none;
}

a.zapati:visited {
	margin: 0px; 
	padding: 0px; 
	font-size: 16px;
	color: wine;
  	font-family: 'Candara', verdana;
	text-decoration: none;
}

a.zapati:active {
	margin: 0px; 
	padding: 0px; 
	font-size: 16px;
	color: blue;
  	font-family: 'Candara', verdana;
	text-decoration: none;
}

a.zapati:hover {
	margin: 0px; 
	padding: 0px; 
	font-size: 16px;
	color: orange;
  	font-family: 'Candara', verdana;
	text-decoration: none;
	font-weight: bold;
}




a.popisek {
	margin: 0px; 
	padding: 0px; 
	font-size: 14px;
	color: wine;
  	font-family: 'Candara', verdana;
	text-decoration: none;
}

a.popisek:visited {
	margin: 0px; 
	padding: 0px; 
	font-size: 14px;
	color: wine;
  	font-family: 'Candara', verdana;
	text-decoration: none;
}

a.popisek:active {
	margin: 0px; 
	padding: 0px; 
	font-size: 14px;
	color: wine;
  	font-family: 'Candara', verdana;
	text-decoration: none;
}

a.popisek:hover {
	margin: 0px; 
	padding: 0px; 
	font-size: 14px;
	color: red;
  	font-family: 'Candara', verdana;
	text-decoration: none;
}




a.li {
	border: brown 1px solid; 
	padding: 5px; 
	margin: 1px; 
	display: block; 
	background: wheat no-repeat left center; 
	text-decoration: none; 
	font-weight: bold; 
	font-size: 13px;
	overflow: hidden; 
	color: brown;
	font-color: brown;
}

a.li:link {
	border: brown 1px solid; 
	padding: 5px; 
	margin: 1px; 
	display: block; 
	background: wheat no-repeat left center; 
	text-decoration: none;
	font-weight: bold; 
	font-size: 13px;
	overflow: hidden; 
	color: brown;
	font-color: brown;
}

a.li:active {
	border: brown 1px solid; 
	padding: 5px; 
	margin: 1px; 
	display: block; 
	background: wheat no-repeat left center; 
	text-decoration: none; 
	font-weight: bold; 
	font-size: 13px;
	overflow: hidden; 
	color: brown;
	font-color: brown;
}

a.li:visited {
	border: brown 1px solid; 
	padding: 5px; 
	margin: 1px; 
	display: block; 
	background: wheat no-repeat left center; 
	text-decoration: none; 
	font-weight: bold; 
	font-size: 13px;
	overflow: hidden; 
	color: brown;
	font-color: brown;
 }

a.li:hover {
	border: wheat 1px solid; 
	padding: 5px; 
	margin: 1px; 
	display: block; 
	background: brown no-repeat right center; 
	text-decoration: none; 
	font-weight: bold; 
	font-size: 13px;
	overflow: hidden; 
	color: wheat;
	font-color: wheat;
}





	/* Styly, hladiny, jednotlive kaskady, fotmatovani */



.titulek {
	margin: 0px; 
	padding: 0px; 
	width: 100%; 
    	font-family: 'Candara', palatino linotype;
	color: brown;
	text-color: brown;
	width: 100%; 
	font-size: 20px;	
	font-wieght: bold;
}


.popistitul {
	margin: 0px; 
	padding: 0px; 
	width: 100%; 
    	font-family: 'Candara', palatino linotype;
	color: chocolate;
	text-color: chocolate;
	width: 100%; 
	font-size: 15px;	
	font-wieght: bold;
}

.bg {
	color: #1d1d1d
}

.form {
	font-family: "Open Sans";
	font-size: 11px; 
	font-weight: bold;
	color: #999999;
	padding: 0px;
	margin: 0px
}

.font {
	font-family: "Open Sans";
	color: #eeeeee; 
	font-size: 13px; 
	margin: 2px; 
	padding: 20px;
	text-align: justify;
	align: justify;
}

.g {color: #999999;}

.style3 {
	font-size: 10px;
	color: #000000;
	font-family: Arial, Helvetica, sans-serif
}

.norder {
	margin: 0 0 0 0px;
	padding: 0 0 0 0px;
	border: 0px solid #eeeeee;
	background: #8dcaf3;
	font-family: Verdana;
	font-size: 8pt;
	font-weight: bold;
	color: #ffffff;
}

.norder2 {
	margin: 0 0 0 0px;
	padding: 0 0 0 0px;
	border: 0px solid #eeeeee;
	background: #8dcaf3;
	font-family: Verdana;
	font-size: 8pt;
	font-weight: bold;
	color: #ffffff;
}

.megadiv {
	background: #696969;
	font-family: Verdana;
	font-size: 11px;
	font-weight: bold;
	color: #ffffcc;
	padding: 1px;
	margin: 1px;
}

.big {
	color: #999999;
	font-family: Verdana, 
	Helvetica, Arial, sans; font-size: 15pt; 
	font-weight: bold; 
	text-decoration: none;
}







	/* Kalendar a cas */


.zahlavi {
	background-color: #1a1a1a;
	color: #999999;
	font-weight: bold;
	text-align: center;
}

.kal {
	border: 1px solid #696969;
	padding: 1px;
	margin: 1px;
	color: #ffffff;
	font-weight: bold;
	font-size: 10px;
	text-align: center;
}




	/* Formatovani textu, prostor */


.block {
	padding: 3px; 
	margin: 3px; 
	border: #696969 1px solid; 
	background: #1a1a1a;
	width: 100%;
	color: #eeeeee;
	text-color: #eeeeee;
	font-size: 13px;
	text-align: justify;
	align: justify;
}

.blockp {
	padding: 5px; 
	margin: 5px; 
	border: #696969 0px solid; 
	background: #1a1a1a;
	width: 100%;
	color: #eeeeee;
	text-color: #eeeeee;
	font-size: 13px;
	text-align: justify;
	align: justify;
}

.block2 {
	padding: 6px; 
	margin: 0px; 
	border: #696969 1px solid; 
	background: #1f1f1f;
	width: 99%;
	color: #eeeeee;
	text-color: #eeeeee;
	font-size: 13px;
	text-align: justfiy;
	align: justify;
}

.head {
	padding: 10px; 
	margin: 0px; 
	border: #6699cc 1px solid; 
	background: #eeeeff;
	width: 99%;
	color: #224477;
	text-color: #224477;
	font-size: 13px;
	text-align: justify;
	align: justify;
}

.head2 {
	padding: 8px; 
	margin: 0px; 
	border: #c1d2ec 1px solid; 
	background: #333435;
	width: 99%;
	color: #c1d2ec;
	text-color: #c1d2ec;
	font-size: 13px;
	text-align: justify;
	align: justify;
}

.head3 {
	padding: 8px; 
	margin: 0px; 
	border: #c6bc92 1px solid; 
	background: #00000a;
	width: 99%;
	color: #c6bc92;
	text-color: #c6bc92;
	font-size: 13px;
	text-align: justify;
	align: justify;
}

.head4 {
	padding: 8px; 
	margin: 0px; 
	border: #999999 1px solid; 
	background: #696969;
	width: 99%;
	color: #1a1a1a;
	text-color: #1a1a1a;
	font-size: 13px;
	text-align: justify;
	align: justify;
}



.note {
	font-size: 11px; 
	color: lime; 
	text-decoration: none; 
}

.y {
	font-size: 13px; 
	color: #ffff00; 
	text-decoration: none; 
}

.contact {
	font-size: 11px; 
	font-weight: bold; 
	color: #3eb73e;
	text-decoration: none;
}




	/* Formulare */

.inputsearch {
	border: #808080 1px solid; 
	background: #ecd451; 
	color: #1a1a1a; 
	height: 22px; 
	margin: 1px; 
	padding: 3px; 
	font-size: 11px;
}

.inputselect {
	border: #808080 0px solid; 
	background: #999999; 
	color: #1a1a1a; 
	height: 20px; 
	margin: 0px; 
	padding: 2px; 
	font-size: 12px;
}



	/* Zalozky */


.pic IMG {}
#helper {
	VISIBILITY: hidden; 
	POSITION: absolute;
}

.infoText {
	font-size: 11px; 
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 
	color: #eeeeee;
	font-color: #eeeeee;	
	font-weight: normal;
	border: #eeeeee 1px solid; 
	padding: 5px; width: 210px; 
	background-color: #a00000; 
	background: #a00000; 
	text-align: justify;
}

.infoText2 {
	font-size: 10px; 
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 
	color: #224477;
	font-color: #224477;	
	border: #a2d6fa 1px solid; 
	padding: 5px; width: 150px; 
	background-color: #eeeeff; 
	background: #eeeeff; 
	text-align: left;
}

.infoText3 {
	font-size: 10px; 
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 
	color: #224477;
	font-color: #224477;	
	border: #a2d6fa 1px solid; 
	padding: 3px; 
	background-color: #eff6fb; 
	text-align: left;
}


.border {
	color: #ffffff;
	border: #ffffff 1px solid;
	padding: 0px;
	margin: 1px;
}




.sdeleni {
	font-family: Verdana, sans; 
	font-size: 13px; color: #ffffff; 
	text-align: justify; 
	align: justify;
	width: 750px;
 	padding: 5px; 
	spacing: 2px; 
	margin: 2px;
}





	/* Grafika a formatovani pro specificky styl RELAXUJEME.EU */


.ram {
	border: chocolate 1px dotted; 
	font-size: 16px;
	font-family: Verdana, sans;
	font-color: black;
	color: black;
	text-decoraion: none;
	padding: 10px;
	margin: 3px;
	background: #ffffcc;
	font-weight: none;
	text-align: justify;
	align: justify;
} 

.ram2 {
	border: brown 1px dotted; 
	font-size: 16px;
	font-family: Verdana, sans;
	font-color: #690000;
	color: #690000;
	text-decoraion: none;
	padding: 10px;
	margin: 3px;
	background: wheat;
	font-weight: none;
	text-align: justify;
	align: justify;
} 

.ram3 {
	border: #336699 1px solid; 
	font-size: 16px;
	font-family: Candara, sans;
	font-color: #224477;
	color: #224477;
	text-decoraion: none;
	padding: 8px;
	margin: 0px;
	background: #ffffcc;
	font-weight: none;
	text-align: justify;
	align: justify;
} 

.ram4 {
	border: chocolate 1px dotted; 
	font-size: 16px;
	font-family: Candara, sans;
	font-color: black;
	color: black;
	text-decoraion: none;
	width: 99%;
	padding: 10px;
	margin: 3px;
	background: wheat;
	font-weight: none;
	text-align: justify;
	align: justify;
}



.title {
	font-weight: bold; 
	font-size: 13px; 
	color: #224477;
}

.normativ {
	font-family: Verdana; 
	font-size: 13px; 
	font-color: chocolate; 
	color: chocolate; 
	text-align: justify; 
	align: justify;
}

.text {
	border: 0px solid #000;
	background: #eee; 
	font-family: Candara; 
	font-size: 17px;
	font-weight: normal; 
	color: #000;
}


.ram_start {
	border-top: #bd5f04 1px solid; 
	border-left: #bd5f04 1px solid; 
	border-bottom: #bd5f04 1px solid; 
	text-decoration: none; 
	padding: 10px; 
	margin: 0px; 
	font-family: Verdana, sans;
	font-size: 13px;
	text-align: justify;
	align: justify;
}

.ram_left {
	border-left: #bd5f04 1px solid; 
	border-bottom: #bd5f04 1px solid; 
	text-decoration: none; 
	padding: 10px; 
	margin: 0px; 
	font-family: Verdana, sans;
	font-size: 13px;
	text-align: justify;
	align: justify;
}

.ram_right {
	border-right: #bd5f04 1px solid; 
	border-bottom: #bd5f04 1px solid; 
	text-decoration: none; 
	padding: 10px; 
	margin: 0px; 
	font-family: Verdana, sans;
	font-size: 13px;
	text-align: justify;
	align: justify;
}

.headtable {
	border: orange 2px solid; 
	font-size: 13px;
	font-family: Verdana, sans;
	font-color: brown;
	color: brown;
	text-decoraion: none;
	padding: 7px;
	margin: 0px;
	background: #ffffcc;
	font-weight: bold;
	text-align: justify;
	align: justify;
} 

.vizitka {
	border: #6699ff 1px solid; 
	font-size: 13px;
	font-family: Verdana, sans;
	font-color: #6699ff;
	color: #336699;
	text-decoraion: none;
	padding: 8px;
	margin: 0px;
	background: #eeffee;
	font-weight: none;
	text-align: justify;
	align: justify;
} 


.promote {
	border: #6699ff 1px solid; 
	font-size: 13px;
	font-family: Verdana, sans;
	font-color: #224477;
	color: #224477;
	text-decoraion: none;
	padding: 7px;
	margin: 0px;
	background: #eeeeff;
	font-weight: none;
	text-align: justify;
	align: justify;
} 


.ram_end {}

.h {
	font-family: Verdana, sans;
	text-decoration: none;
	font-size: 15px;
	text-size: 15px;
	font-weight: bold;
}


.down {
	border: #ffffcc 2px solid; 
	font-size: 13px;
	font-family: Verdana, sans;
	font-color: #696969;
	color: brown;
	text-decoraion: none;
	padding: 7px;
	margin: 0px;
	background: bisque;
	font-weight: none;
	text-align: justify;
	align: justify;
}


.black {
	color: #000000;
	font-color: #000000;
}



   /* Styl tlačítka */
    #scrollToTopBtn {

	position: fixed;
      	bottom: 40px;
      	right: 40px;
      	z-index: 9999;
      	background-color: #fff;
      	color: chocolate;
      	font-color: chocolate;
      	border: chocolate 2px solid;
	border-radius: 50%;  
	padding: 0;          
	font-size: 24px;    
	text-align: center; 
	line-height: 50px;   
	width: 50px;       
  	height: 50px;      
	cursor: pointer;
	display: none; 
      	transition: opacity 0.3s;

   }

    #scrollToTopBtn:hover {
      background-color: wheat;
    }

    /* Pro demo, aby stránka byla dlouhá */
    .content {
      height: 2000px;
      background: linear-gradient(to bottom, #f0f0f0, #ccc);
      padding: 20px;
      font-family: sans-serif;
    }


#share-bar {
  position: fixed;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  z-index: 9999;
}

.share-icon {
  display: block;
  margin: 5px;
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  color: white;
  background-color: #333;
  text-decoration: none;
  border-radius: 4px;
  transition: background-color 0.3s;
}

.share-icon:hover {
  background-color: #555;
}

/* různé barvy podle sítě */

.share-icon.facebook { background-color: #3b5998; }
.share-icon.twitter { background-color: #1da1f2; }
.share-icon.whatsapp { background-color: #25d366; }