html {
  position: relative;  /* nutné pro patičku dole */
  min-height: 100%;
}

body {margin-bottom: 150px;
	    margin-top: 0px!IMPORTANT
	    }

section {padding: 50px}

section.bot-line {border-bottom: 1px solid #D9D9D9}

/***************** general-text **********************************/

.general-text {color: #2C3E50;
				text-align: right;
				padding-top: 10em;
				font-family: 'Didact Gothic',sans-serif;}
							
.general-text h1 {font-size: 4.1em;
				  font-family: 'Didact Gothic',sans-serif;
				  text-shadow: 1px 2px 10px #8AD226;}

.general-text p {font-size: 170%;
				 line-height: 160%}		

/****************navbar*******************************************/
.navbar {margin-bottom: 0px !IMPORTANT}
.navbar {z-index: 999 !IMPORTANT}


.navbar a:hover {background: linear-gradient(#61DD45, #3CB521 50%, #36A41E) !IMPORTANT;
				 color: #FFFFFF !IMPORTANT;
				 transition: 0.6s;}

.navbar a.active {background: linear-gradient(#61DD45, #3CB521 50%, #36A41E) !IMPORTANT;
				 color: #FFFFFF !IMPORTANT;
				 transition: 0.6s;}

.bgimg-1, .bgimg-2, .bgimg-3 {
  position: relative;
  opacity: 0.95;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;

}
.bgimg-1 {
  background-image: url("../img-headline.jpg");
  min-height: 600px;
}

.bgimg-2 {
  background-image: url("../paralaxa1.jpg");
  min-height: 600px;
}

.bgimg-3 {
  background-image: url("../img_parallax3.jpg");
  min-height: 400px;
}


iframe {border-radius: 0.4em;
		border: 1px solid #D9D9D9;
		padding: 5px}

/********************* jumbotron ***************************************************/
.jumbotron {box-shadow: #7F7F7F 4px 4px 10px;
			margin-top: 2.0em}
			
.jumbotron h2 {color: #FF002C}


/***************** mobile-title ***************************************************/

.mobile-title {display: none}


/********************* Modal ********************************************************/
.modal-body p {line-height: 150%;
			   font-size: 1.2em}
			   
			   
/************************* Panel-body ***********************************************/


/**************** odkaz na mail klienta *********************************************/
a[href="mailto:info@masaze-hlucin.cz"] {color: #759C3F}

/************** drobečková navigace *************************************************/
.breadcrumb {background: #F0F0F0;
			 margin-top: 0.7em}

/******************** rámeček turniketu *********************************************/
#objednavky img {padding: 0.2em;
				border: 1px solid #797979;
				margin-right: 0.4em}

/***************************** telefon - kontakt ************************************/

#telefon-kontakt {width: 230px !IMPORTANT;
				  height: 110px !IMPORTANT;
				  position: fixed !IMPORTANT;
				  left: 40px;
				  top: 0px;
				  z-index: 9999 !IMPORTANT;
				  background-color: rgba(44,62,80,0.6); /* For browsers that do not support gradients */
			      border-radius: 0.5em;
				  border-radius: 0.5em;
				  text-align: center;
			    }
				  
				  
#telefon-kontakt .t-head {background-color: #8DBC4C;
						  color: #FFFFFF;
						  padding: 5px;
						  text-transform: uppercase;
						  border-top-left-radius: 0.5em;
				          border-top-right-radius: 0.5em;
				          position: relative;
				          letter-spacing: 4px;
				          }
				          
#zavrit {position: absolute;
		top: 5px;
		right: 10px;
		cursor: pointer}				          
				          
#telefon-kontakt .t-body {padding-top: 20px;
						  color: #FFFFFF;
						  font-size: 25px;
						  }				          
				          
.skryj {display: none}

/**************************** info-box *********************************************************/

.info-box {font-size: 120%;
		   border: 1px solid #D9D9D9;
		   margin-top: 1.8em;
		   margin-bottom: 1.8em;
		   padding: 0em 1.5em 0.8em 1.5em;
		   border-radius: 0.5em;
		   box-shadow: #7F7F7F 4px 4px 10px;}


/*************************** karty *************************************************************/

.sluzby {margin-top: 30px}

.karta {display: inline-block;
		background-color: #8DBC4C;
		vertical-align: top;
		box-sizing: border-box;
		transition: 0.5s;
		max-width: 250px;
		margin: 10px 10px 60px 10px;
		border-radius: 0.5em;
		box-shadow: #4D4D4D 3px 3px 15px;}
		


.karta .popis {
    padding: 2px 10px 10px;
    color: #FFFFFF;
    text-align: center;
    text-shadow: 1px 2px 3px #808080;
} 		

.karta img{width: 100%;}


/********************* certifikáty *****************************************************************/

.cert-box {display: inline-block;
			background-color: #EEEEEE;
			vertical-align: top;
			box-sizing: border-box;
			transition: 0.5s;
			max-width: 270px;
			margin: 10px 10px 10px 0px;
			border-radius: 0.5em;
			}

.cert-box .popis {
			    padding: 5px 5px 5px;
			    color: #2C3E50;
			    text-align: center;
				}
				
.cert-box img {width: 100%;
			   padding: 5px} 				   

/*********************** PANEL ********************************************************************/
.panel {
		background-color: #F3F3F3}


/************************ PATIČKA VŽDY DOLE	!!!! :-) ***********************************************/
section#footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 150px;
  background: linear-gradient(#4E84BF, #446E9B 50%, #1F548D);
  color: #F2F2F2;
  font-size: 80%;
  padding-top: 30px;
  border-top: 1px solid #3D7BBF;
}

#footer h4 {color: #F2F2F2}

#footer a {color: #00FF00}


/****************** .class ******************************************************************/
.blue {color: #446E9B}
.red {color: #FF002C}
.bold {font-weight: bold} 	  
	   
/************************ break points *******************************************************/
@media only screen and (max-width: 840px) {
			section#footer {position: relative;
								height: auto;
								width: 100%}
			body {margin-bottom: 0px !IMPORTANT}
			  
	   }

 @media only screen and (max-width: 768px) {
			h1 {font-size: 2.1em}
	   }

@media only screen and (max-width: 640px) {
		
		h1 {font-size: 1.8em}	
		h2 {font-size: 1.3em}
		h3 {font-size: 1.1em}	
		.bgimg-1 {display: none}
	   }

/***
modrá navbar: #2C3E50
* 
**/