/* Sticky footer */
html,
body {
  height: 100%;
  width: 100%;
  font-size: 100%;
  font-size: 16px;
  color: #444;
  font-family: 'Open Sans', sans-serif;
}

h1,h2 {
font-family: 'Varela', sans-serif;
text-align: center;
font-size: 30px;
color: #444;
font-weight: 700;
line-height: 40px;
}

ul {
text-align: left;
}

li {
text-align: left;
line-height: 30px;
list-style-type: square;
}

p {
text-align: justify;
}

img {
 display: block;
 height: auto;
 max-width: 100%;
 }
 
 .container img {
  padding: 2px;
  border-radius: 10px;
}

 
 /* Wrapper for page content to push down footer */
#wrap {
  min-height: 100%;
  height: auto !important;
  height: 100%;
  /* Negative indent footer by its height */
  margin: 0 auto -60px;
  /* Pad bottom by footer height */
  padding: 0 0 60px;
}

/* ------- Navigation ------------ */
#navigation {
	background: #fff;
	z-index: 9999;
	width:100%;
    box-sizing:border-box;
	text-align: center;
	margin: 0 auto;
}

#menu .nav.navbar-bar {
	text-align: center;
	float: none;
	margin: 0 auto;
}

.navbar-default ul.nav {
	text-align: center;
	float: none;
	margin: 0 auto;
}

.navbar {
  margin-bottom: 0;
}

.navbar-brand img {
  height: 0px;
  width: auto;
}
.navbar-brand { padding: 5px 15px; font-size: 30px; }

.navbar-default {
 background-color: #fff;
 border-color: #fff;
}

.navbar-default ul.nav li {
	float: none;
	display: inline-block;
	text-align: center;
}

.navbar-nav > li > a {
  font-size: 18px;
  font-weight: 400;
  border-bottom: 2px solid transparent;
  padding: 10px 10px;
  margin: 5px 5px;
  transition: all 0.5s;
}

.navbar-default .navbar-nav > li > a.active,
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: #333;
  border-bottom: 4px solid #EE9572;
  background-color: #fff;
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
    color: #333;
    background-color: #fff;
	border-bottom: 4px solid #EE9572;
}

.navbar-default .navbar-toggle { border-color: transparent }
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus { background-color: transparent }
.navbar-default .navbar-toggle:hover>.navbar-default .navbar-toggle .icon-bar,
.navbar-default .navbar-toggle:focus>.navbar-default .navbar-toggle .icon-bar { color: #EE9572 }



#flags {
	background: #fff;
	box-sizing: content-box;
	width:100%;
	float: none;
	text-align: center;
	margin: 0 auto;
	padding-top: 20px;
}

.flags {
	float: none;
	text-align: center;
}

.flags li {
 list-style-type: none;
 	display: inline-block;
}

/* Fixed height of footer */
#footer {
  min-height: 80px;
  color: #333;
  margin-bottom: 0;
  padding-bottom: 0;
  margin-top: 10px;
  text-align: center;
  clear: both;
}

#footer a  {
color: #222;
}

#footer p {
text-align: center;
}

/* Custom page CSS */

#footer > .container {
  padding-top: 20px;
  color: #333;
}

.container {
max-width: 1260px;
margin: 0 auto;
padding: 0;
}

code {
  font-size: 80%;
}

/* Header */
header {
 text-align: center;
 background-color: #fff;
 color: #333;
}

.row {
width: 100%;
margin: 0;
padding: 0;
}

/* Thumbnails */
.thumbs {
margin: 2px;
float: none;
text-align: center;
}

.gray {
 width: 100%;
 background: #f8f8f8;
 margin: 0 auto;
 text-align: center;
}

/* Contact Google map */
 #map-container { height: 500px; width: auto; }
 
 
/* Contact Google map */
#carousel {
    margin-top: 50px;
}

.carousel {
    height: 500px;
    margin-bottom: 60px;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
    z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel .item {
    width: 100%;
    height: 500px;
    background-color: #fff;
}
.carousel-inner > .item > img {
    position: absolute;
    top: 0;
    left: 0;
    min-width: 100%;
    height: 500px;
}

@media(max-width:767px) {
    .carousel {
        height: 170px;
    }
	
	.carousel .item {
    width: 100%;
    height: 200px;
    background-color: #fff;
}
.carousel-inner > .item > img {
    position: absolute;
    top: 0;
    left: 0;
    min-width: 100%;
    height: 200px;
}
}

@media(max-width:480px) {
h1 {
  font-size: 22px;
 }
 
 li {
 line-height: 22px;
 }
}
