@font-face {
    font-family:"VarelaRound";
    src: url("VarelaRound-Regular.ttf") /* TTF file for CSS3 browsers */
}

html, body
{
  min-height: 100%;
  height: 100%;
  margin: 0px;
  padding: 0px;
}

html 
{
}

body 
{
  background-color: #fee89e;
  font-family: VarelaRound, Verdana, Arial;
  font-size: 1.1em;
}

a 
{
  text-decoration: none;
  color: blue;
}

a:hover 
{
  text-decoration: underline;
  color: blue;
}

a.thumbnail img {
  padding-bottom: 0.2em;
}

img
{
  border: 0px;
}

h1
{
  font-family: VarelaRound, Verdana, Arial;
}

h2
{
  font-family: VarelaRound, Verdana, Arial;
}

p
{
  font-family: VarelaRound, Verdana, Arial;
}

span.highlight
{
  font-weight: bold;
}

.fullscreen
{
	min-height: 100%;
}

#master
{
  overflow: hidden;
	min-height: 100%;
  height: 100%;
}

#content 
{
  background-color: #fee89e;
  padding-bottom: 0.5em;
  overflow: visible;
}

#content div.high
{
  font-weight: bold;
}

#content div.odd
{
  background-color: rgba(255,255,255,0.3);
}

#content h1
{
  color: #444444;
  font-size: 1.5em;
  margin: 0.3em 0 0.8em 0;
  text-align: center;
}

#content h2
{
  color: #666666;
  font-size: 1.3em;
  margin: 0.7em 0 0.2em 0;
}

#content h2.high
{
  display: block;
  border-bottom: 1px solid #444444;
}

#content h3
{
  color: #666666;
  font-size: 1em;
  font-weight: bold;
  margin: 0.2em 0 0.1em 0;
}

#content p 
{
  color: #111111;
  font-size: 1em;
  line-height: 1.3em;
  margin-bottom: 0.6em;
  
}

#content p.reservationsbutton
{
  margin-top: 1em;
}

#content p.reservationsbutton a
{
  border-radius: 0.2em;
  padding: 0.1em 0.4em;
  background-color: blue;
  color: yellow;
}

#content p.reservationsbutton a:hover
{
  color: white;
  text-decoration: none;
}

#content ul.courses
{
}

#content ul.courses li
{
}

#content ul.courses li.new
{
  background-color: rgba(255,255,255,0.5);
  background-image: url("../images/new.png");
  background-repeat: no-repeat;
  background-position: right center;
  padding-right: 55px;
}

#content ul.courses li a
{
}

#content img.fit
{
  width: 100%;
}

#content div.space
{
  margin-bottom: 0.6em;
}

#content div.ambienteimages
{
  padding: 0 0.93rem;
}

#content div.ambienteimages div.columns 
{
  padding: 0;
}

#boxes
{
  padding-top: 0.8em;  
  background-color: #fee89e;		  
}

#boxes .tip
{
  border: 1px #777777 solid;
  margin: 0 0 0.8em 0;
  padding: 0;
}

#boxes .tip div:nth-child(odd) 
{
  background-color: rgba(255,255,255,0.5);
}

#boxes .tip h1
{
  margin: 0;
  padding: 0;
  font-size: 1.1em;
  background: blue;
  color: yellow;
  text-align: center;
}

#boxes .tip h2
{
  margin: 0;
  padding: 0.1em 0.2em;
  font-size: 0.8em;
  color: black;
}

#boxes .tip p
{
  padding: 0.2em;
  margin: 0 0 0.2em 0;
  font-size: 0.8em;
  line-height: 1.2em;
}

#boxes .tip a
{

}

#reservationForm h2
{
}

#reservationForm h3
{
}

#reservationForm div.row
{
}

#reservationForm input, #reservationForm select
{
  line-height: 110%;
  height: 1.9rem;
  padding: 0.2rem;
}

#reservationForm input.button
{
  border-radius: 0.2em;
  padding: 0.1em 0.4em;
  background-color: blue;
  color: yellow;
}

#reservationForm input.button:hover
{
  color: white;
  text-decoration: none;
}

#partnerForm input, #partnerForm select
{
  line-height: 110%;
  height: 1.9rem;
  padding: 0.2rem;
}

#partnerForm input.button
{
  border-radius: 0.2em;
  padding: 0.1em 0.4em;
  background-color: blue;
  color: yellow;
}

#partnerForm input.button:hover
{
  color: white;
  text-decoration: none;
}

#canvas {
  width: 200px;
  height: 60px;
  display: inline;
}

/* NOT MOBILE*/
@media only screen and (min-width: 40.063em)
{
  body 
  {
    background-color: #b2b2b2;
  }

  .fullscreen
  {
    height: auto !important;
  	height: 100%;
  	min-height: 100%;
  }
  
  #content 
  {
    padding-bottom: 32768px;
  	margin-bottom: -32768px;
  	min-height: 100%;
    height: 100%;
  }

  #boxes
  {
    border-top: 0px;
    padding-top: 3.8em;  
    padding-bottom: 32768px;
    margin-bottom: -32768px;
    min-height: 100%;
    height: 100%;
  }

}