* {
margin: 0;
padding: 0;
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

@viewport {
  zoom: 1;
  width: device-width;
}

html, body {
	height: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	font-size: 100% !important;
  color:#282320 !important;
	font-family: 'Noto Serif', serif !important;
	line-height: 1.5em !important;
  background-image:url('images/body.png') !important;
  background-repeat:repeat !important;
}

header,footer,article,section,hgroup,nav,figure {
	/* Giving a display value to the HTML5 rendered elements: */
	display:block;
}

h1 {
    font-size: 2em;
    margin: 0.67em 0;
}

h2 {
    font-size: 1.5em;
    margin: 0.83em 0;
    color: #824328;
}

h3 {
    font-size: 1.17em;
    margin: 1em 0;
    color: #824328;
}

h4 {
    font-size: 1em;
    margin: 1.33em 0;
}

h5 {
    font-size: 0.83em;
    margin: 1.67em 0;
}

h6 {
    font-size: 0.75em;
    margin: 2.33em 0;
}

/*verwijder geel highlight van google ghrome*/
input[type="text"], input[type="password"] input[type="textarea"] {
  outline: none;
}

a {
  color: #f06d06;
}

a:hover, a:visited, a:link, a:active {
   text-decoration: none;
}

/*-------------100% Width--------------*/
header,
.item--big,
.contenttop,
.contentmiddle,
.contentbottom,
.contentwelkom,
.reservation,
.anniversary,
.info-page .boxes img,
.foodpicker h2,
.caption,
footer,
.rslides,
ul.menu,
.contentwelkom,
.welkom,
.welkomcontact,
.item--big .img-caption,
.item img,
.item--big img,
.items--big,
.contentcontact-hotsnacks .contentcontact-coldsnacks img {

  width: 100% !important;
}



/*-------------HEADER--------------*/

header {
  margin: 0 auto;
  background-color: black;
  border-bottom: 5px solid #B4C47D;
  overflow:hidden;
}

header .bert {
  font-family: 'Gabriela', serif;
  font-weight: bold;
  font-size: 40px;
  color: #B4C47D;
  width: 100%;
  height: 1.300em;
  padding-top: 30px;
  text-align: center;
}

header .info1 {
  color:white;
  text-align: center;
  padding: 10px 0px 5px 0px;
  width: 100%;
}

header .info1 .yellow img {
  padding-top: 3px;
}

/*-------------MENU BUTTONS--------------*/

.menubuttons {
  height: 4.500em;
  padding-top: 1.600em;
}

/*BUTTONS*/
ul.menu {
  padding: 0;
  margin: 0 auto;
  list-style-type: none;
  text-align: center;
}

  ul.menu li {
    display: inline;
  }

    ul.menu li a {
      text-align: center;
      text-decoration: none;
      color: #596629;
      padding: 6px 10px;
      text-align: center;
      font-size: 30px;
    }

  ul.menu a:hover {
    opacity: .85;
    cursor: pointer;
    color: #596629;
    transition: all 0.15s ease-in;
    -moz-transition: all 0.15s ease-in 0;
    -o-transition: all 0.15s ease-in 0;
    -ms-transition: all 0.15s ease-in 0;
    -webkit-transition: all 0.15s ease-in 0;
  }

  ul.menu li.current a {
    border: 1px solid #777;
  }

.active  {  /*-------------MENU ACTIVE--------------*/
  color: red !important;
}

li.selected {
    color: #596629 !important;
}
li.selected a {
  color: #B4C47D !important;
}


/*BUTTONS*/
ul.menu2 {
  list-style-type: none;
}

  ul.menu2 li {
    display: block;
  }

    ul.menu2 li a {
      text-decoration: none;
      color: #6D6968;

    }
    ul.menu2 li a:visited {
      color:#848482;
    }

    ul.menu2 h3 {
      color: #824328;
    }

  ul.menu2 a:hover {
    opacity: .85;
    cursor: pointer;
    color: #596629;
    transition: all 0.15s ease-in;
    -moz-transition: all 0.15s ease-in 0;
    -o-transition: all 0.15s ease-in 0;
    -ms-transition: all 0.15s ease-in 0;
    -webkit-transition: all 0.15s ease-in 0;
  }


.guid{
   display: inline-block;
   margin: 0px 15px 35px 15px;
}
.guid img {
    border:solid 4px lightgray;
}

/*-------------CONTAINER--------------*/

.container {
  width: 62.500em;
  margin: 0 auto;
  display: block;
}

.container .contenttop,
.contentmiddle,
.contentbottom,
.contentwelkom,
.reservation,
.contentcontact,
.contentcontact-hotsnacks,
.contentcontact-coldsnacks {
  height: 30.000em;
  margin-bottom: 2.000em;
  display: inline-block;
  background:url(images/content_bottom.png) 50% top no-repeat;
}

.container .contenttop {
  border-bottom: 5px solid #B4C47D;
  height: 31.590em !important;
}

.container .anniversary {
  font-family: 'Yeseva One', cursive;
  font-size: 1.8em;
  color:#800000;
  text-align: center;
  margin-bottom: 10px;
}

.container .smaltext {
  text-align: center;
  padding: 8px 0px 10px
}

.container .tekst {
  font-family: 'Great Vibes', cursive;
  font-size: 1.200em;
  text-align: center;
}

.container .reservation {
  height: 3em !important;
  padding: 23px 5px 0px 5px !important;
  margin-bottom: 1em;
}

.container .reservation .call-uss {
  text-align: center;
}

.container .reservation .call-uss ul#click {
  width: 215px;
  margin-top: -24px;
  float: right !important;
  margin-right: 200px;
}

.container .reservation .call-uss ul#click li a {
  padding: 6px 20px !important;
  font-weight: bold;
  font-family:  'droid sans', arial, serif;
}

.container .reservation .call-uss p {
  width: 390px;
  margin-left: 200px;
}

.container .contentwelkom {
  padding:20px 0px 20px;
  height: 100%;
}

.contentwelkom .welkom {
  height: 100%;
  background:url(images/page-title.png) repeat-x 0 20px;
  text-align: center;
  font-variant: small-caps;
  line-height:38px;
  margin-top: 15px;
}

.container .contentwelkom .welkom span {
  font-family: 'Gabriela', serif;
  font-weight: bold;
  width:323px;
  height:38px;
  font-size: 32px;
  color: #596629;
  background-image:url('images/body.png');
}
.container .contentwelkom .boxes {
  width: 33.3%;
  float:left;
  padding: 10px;
  line-height: 19px;
}

.container .contentwelkom .boxes h2 {
   color: #596629;
   font-weight: bold;
}

.container .info-page .boxes img {
  border-bottom: 5px solid #B4C47D;
}

.container .contentmiddle .contentbottom, h1 {
  padding-left: 25px;
  margin: 1.000em 0;
}

.container .contentmiddle, h2, h3 {
  color: black;
}

.container .boxtext {
  margin-top: 7px;
  padding: 5px;
}

.container .contentbottom {
  background-image: none !important;
}


/*-------------SIDE BAR FOOD MENU--------------*/

.side-bar-menu li a {
  text-decoration: none;
  font-weight: bold;
  color: #d3af80;
}

.side-bar-menu a:link {
  text-decoration: none !important;
}

.side-bar-menu li a:hover {
  color: #824328;
  -webkit-transition: All 0.5s ease;
  -moz-transition: All 0.5s ease;
  -o-transition: All 0.5s ease;
  -ms-transition: All 0.5s ease;
  transition: All 0.5s ease;
}

/*-------------PICK YOUR FOOD--------------*/

.foodpicker .beef, .chicken, .pork, .seafood, .pastry {
  width: 49.7%;
  display: inline-block;
  border:solid 1px black;
  position: relative;

}

.foodpicker img {
  height: 100%;
}

.foodpicker h2 {
  position: absolute;
  top: 150px;
  left: 0;
}

.foodpicker h2 span {
   color: white;
   font: bold 24px/45px Helvetica, Sans-Serif;
   letter-spacing: -1px;
   background: rgb(0, 0, 0); /* fallback color */
   background: rgba(0, 0, 0, 0.5);
   padding: 9px;
}

/*------------- Menu --------------*/
.kerstbox {
  width: 206px;
  /*height: 240px;*/
  margin: 0;
  display: inline-block;
  text-align: center;
}

.kerstbox b {
  color:red;
}

.kerstbox p {
  padding-left: 5px;
}

.devider {
  padding-top: 40px;
}

/*-------------HOT APPETOZERS--------------*/

.contactholder, .foodpicker {
  margin-bottom: 50px;
}

.contactholder .contentcontact-hotsnacks, .contentcontact-coldsnacks {
  width: 82%;
  height:100%;
  margin-bottom: 30px;
  background-image: none;
}

.contactholder .eventmenu-hotsnacks {
  width: 18%;
  height:100%;
  float: left;
}

.christmassmenu {
  /*height:1010px;*/
  margin-bottom: 60px;
}

.christmassmenu img {
  width: 200px;
  margin-bottom: ;
  border: solid seashell 5px; 
  margin: 2px;
}

.contentcontact-hotsnacks .contentcontact-coldsnacks,
.chilbert-product-info-1,
.chilbert-product-info-2,
.chilbert-product-info-3,
.chilbert-product-info-4,
.chilbert-product-info-5,
.chilbert-product-info-6,
.chilbert-product-info-7,
.chilbert-product-info-8,
.chilbert-product-info-9,
.chilbert-product-info-10,
.chilbert-product-info-11,
.chilbert-product-info-12,
.chilbert-product-info-13,
.chilbert-product-info-14,
.chilbert-product-info-15,
.chilbert-product-info-16,
.chilbert-product-info-17,
.chilbert-product-info-18,
.chilbert-product-info-19,
.chilbert-product-info-20,
.chilbert-product-info-21,
.chilbert-product-info-22,
.chilbert-product-info-23,
.chilbert-product-info-24,
.chilbert-product-info-25,
.chilbert-product-info-26,
.chilbert-product-info-27,
.chilbert-product-info-28,
.chilbert-product-info-29,
.chilbert-product-info-30,
.chilbert-product-info-31,
.chilbert-product-info-32,
.chilbert-product-info-33,
.chilbert-product-info-34,
.chilbert-product-info-35,
.chilbert-product-info-36,
.chilbert-product-info-37,
.chilbert-product-info-38,
.chilbert-product-info-39,
.chilbert-product-info-40,
.chilbert-product-info-41,
.chilbert-product-info-42,
.chilbert-product-info-43,
.chilbert-product-info-44,
.chilbert-product-info-45,
.chilbert-product-info-46,
.chilbert-product-info-47,
.chilbert-product-info-48,
.chilbert-product-info-49,
.chilbert-product-info-50 {
  width: 24.8%;
  height:225px;
  display: inline-block;
  padding: 10px;
  border: 1px solid transparent;
  margin: -1px !important;
  margin-bottom: 5px !important;
  border-radius: 3px;
}

.chilbert-prijs-1 span,
.chilbert-prijs-2 span,
.chilbert-prijs-3 span,
.chilbert-prijs-4 span,
.chilbert-prijs-5 span,
.chilbert-prijs-6 span,
.chilbert-prijs-7 span,
.chilbert-prijs-8 span,
.chilbert-prijs-9 span,
.chilbert-prijs-10 span,
.chilbert-prijs-11 span,
.chilbert-prijs-12 span,
.chilbert-prijs-13 span,
.chilbert-prijs-14 span,
.chilbert-prijs-15 span,
.chilbert-prijs-16 span,
.chilbert-prijs-17 span,
.chilbert-prijs-18 span,
.chilbert-prijs-19 span,
.chilbert-prijs-20 span,
.chilbert-prijs-21 span,
.chilbert-prijs-22 span,
.chilbert-prijs-23 span,
.chilbert-prijs-24 span,
.chilbert-prijs-25 span,
.chilbert-prijs-26 span,
.chilbert-prijs-27 span,
.chilbert-prijs-28 span,
.chilbert-prijs-29 span,
.chilbert-prijs-30 span,
.chilbert-prijs-31 span,
.chilbert-prijs-32 span,
.chilbert-prijs-33 span,
.chilbert-prijs-34 span,
.chilbert-prijs-35 span,
.chilbert-prijs-36 span,
.chilbert-prijs-37 span,
.chilbert-prijs-38 span,
.chilbert-prijs-39 span,
.chilbert-prijs-40 span,
.chilbert-prijs-41 span,
.chilbert-prijs-42 span,
.chilbert-prijs-43 span,
.chilbert-prijs-44 span,
.chilbert-prijs-45 span,
.chilbert-prijs-46 span,
.chilbert-prijs-47 span,
.chilbert-prijs-48 span,
.chilbert-prijs-49 span,
.chilbert-prijs-50 span {
  width: 60px;
  display: block;
  background-color: #B4C47D;
  color: #fff;
  text-align: center;
  float:right;
  font-size: 16px;
  line-height: 26px;
  border-radius: 1px;
}

.chilbert-product-info .chilbert-prijs {
  height: 28px;
  top: -13px;
  float: right;
  position:relative;
}

.ID-info-call {
  color:  #824328;
  float:right;
  font-weight: bolder;
}

.chilbert-product-info .caption text p {
  font-size: 14px;
  color: #909090;
}

.caption {
  display: inline-block;
}

.caption .caption-ID {
  color:#FF6666;
  width: 60px;
  position:relative;
  top: 27px;
  padding: 1px 2px;
  border: solid 1px #ff6666;
  border-radius: 2px;
  float: left;
  background-color:   #FFF0F0;
  cursor:help;
}

.container .contentcontact {
  width: 70%;
  height:100%;
  margin-bottom: 0px;
  background-image: none;
}

.container .eventmenu {
  width: 30%;
  height:100%;
  float: left;
}

.container .eventmenu .event {
  width:260px;
  padding:5px;
}

.eventmenu .event iframe {
  height: 280px;
  width: 235px;
  border:none;
}

.eventmenu .event a {
  padding-left:5px;
  font-size: 16px;
}

.eventmenu .event a:visited {color:#7A8554;}
.eventmenu .event a:hover   {color:#68b12f;}
.eventmenu .event a:active  {color:black;}

.container .googlemap {
  padding: 5px;
  margin-top: 1em;
  border:1px solid lightgray;
}

.container .contentcontact .contact {
  margin-top: 2em;
  background-image: none;
}

.container .eventmenu .event img {
  padding: 7px;
  border:1px solid lightgray;
  border-radius: 2px;
}

.eventmenu a img:hover {
  background-color: #B4C47D;
  -webkit-transition: All 0.5s ease;
  -moz-transition: All 0.5s ease;
  -o-transition: All 0.5s ease;
  -ms-transition: All 0.5s ease;
  transition: All 0.5s ease;
}

.container .eventmenu h3 {
  color:#824328;
}

.container .eventmenu .event p {
  color:#d3af80;
  padding: 5px 0px 5px 0px;
  font-weight: bold;
}

.container .event .eventtext {
  display: inline-block;
  width:100px;
  line-height: 20px;
  font-size: 15px;
  padding:5px;
  color: #909090;
}

.article-date {
  float: left;
  width: 65px;
  height: 65px;
  padding: 7px 3px;
  margin-top: 22px;
  border: 4px double #b99586;
  text-align: center;
  color: #824328;
  font-size: 14px;
  line-height: 24px;
  border-radius: 100%;
  -moz-border-radius: 100%;
  -webkit-border-radius: 100%;
}

.eventbox .post-content {
  float: right;
  width: 480px;
  padding: 5px 0 0px;
  margin-bottom: 5px;
}

.article-date span {
  display: block;
  font-size: 18px;
  line-height: 10px;
  padding: 7px;
}

.eventbox h3.post-title {
  margin-bottom: 10px;
  line-height: 20px;
  font-size: 16px;
  color: #824328;
  text-transform: none;
}

.eventbox small {
  color: #d3af80;
  font-size: 14px;
  line-height: 16px;
  font-weight: bold;
}

.eventbox img {
  border:1px solid lightgray ;
  padding: 7px;
}

.eventbox a img:hover {
  background-color: #B4C47D;
  -webkit-transition: All 0.5s ease;
  -moz-transition: All 0.5s ease;
  -o-transition: All 0.5s ease;
  -ms-transition: All 0.5s ease;
  transition: All 0.5s ease;
}

.eventbox small span {
  color: #514032;
}

.eventbox .event-thumb {
  float: left;
  margin: 0 15px 15px 0;
}

.eventbox .post-content p {
  margin-bottom: 15px;
  color:#909090;
}

.eventbox {
  width: 65%;
  padding: 5px;
  display: inline-block;
}

.double-prijs-1   {
  width: 85px !important;
  margin-left: 97px;
  margin-bottom: 1px;
  position: relative;
  top: -21px;
  border-radius: 2px;
}

.gallery-container {
  width: 23.5%;
  height: 165px;
  border: 1px solid gray;
  display: inline-block;
  margin: 5px;
  position: relative;
  border-radius: 2px;
}

.gallery-container h2 span {
   color: white;
   font: bold 24px/45px Helvetica, Sans-Serif;
   letter-spacing: -1px;
   background: rgb(0, 0, 0); /* fallback color */
   background: rgba(0, 0, 0, 0.5);
   padding: 9px;
}

.gallery-container h2 {
  position: absolute;
   top: 85px;
   left: 0;
}

.gallery-container img {
  width: 100%;
  height: 100%;
}

.gallery-container img {
  opacity:0.5;
  filter:alpha(opacity=50); /* For IE8 and earlier */
}

.gallery-container img:hover {
  opacity:1.0;
  filter:alpha(opacity=100); /* For IE8 and earlier */
  -webkit-transition: All 0.5s ease;
  -moz-transition: All 0.5s ease;
  -o-transition: All 0.5s ease;
  -ms-transition: All 0.5s ease;
  transition: All 0.5s ease;
}

/*-------------End Events--------------*/


.container .contentcontact .contact {
  height: 150px;
  border-left: 5px solid #ebd09b;
  padding: 10px;
  margin-top: 2em;
}

.welkomcontact {
  background:url(images/page-title.png) repeat-x 0 20px;
  text-align: center;
  font-variant: small-caps;
  line-height:38px;
  border:none;
  font-family:  'Gabriela', serif;
  font-size: 32px;
  color: #596629;
  margin: 1em 0;
}

.welkomcontact span {
  font-family: 'Gabriela', serif;
  font-weight: bold;
  width:323px;
  height:38px;
  font-size: 32px;
  color: #596629;
  background-image:url('images/body.png');
}

.container .routebeschrijving {
  height: 325px;
  padding: 5px;
}
.container .routebeschrijving text {
  float: right;
  color:gray;
}

.shadow-bar {
  background:url(images/content_bottom.png) 50% top no-repeat;
  padding: 20px;
  margin: 25px 0px 0px 0px;
}


/*-------------POP HOVERS--------------*/

.box {
  padding: 2em;
  display: block;
  width: 50%;
  height: 380px;
  float: left;
  margin: -1px 0 0 -1px;
  color: black !important;
  background: linear-gradient(
  transparent , #B4C47D 75%, #333 50%, #333 );
  background-size: 100% 202%;
  transition: all 0.2s ease;
  animation: down-bump 0.4s ease;
}

.box h2 {
  font-weight: 400;
  letter-spacing: -1.5px;
  line-height: 1.2;
  z-index: 999;
}

.box h3 {
  font: 0.8em "Lucida Grande", serif;
  z-index: 999;
}

.box:hover {
  background-position: 100% 100%;
  animation: up-bump 0.4s ease;
}

.box:hover h2 {
  color: #48ad26;
}

.box:hover h2 span {
  color: white;
}

.box:hover h3 {
  color: #999;
}

@keyframes up-bump {
  0% { padding-top: 2em; }
  50% { padding-top: 1.5em; }
  100% { padding-top: 2em; }
}

@keyframes down-bump {
  0% { padding-top: 2em; }
  50% { padding-top: 2.5em; }
  100% { padding-top: 2em; }
}
@import url(http://fonts.googleapis.com/css?family=Merriweather);

/*-------------CLICK--------------*/

ul#click {
  margin-top:19px;
  list-style-type: none;
  text-align: center;
}

  ul#click li {
    display: inline;
  }

    ul#click li a {
      color: white;
      text-align: center;
      font-size: 12px;
      font-family:  'droid sans', arial, serif;
      font-weight: bold;
      padding: 6px 50px;
      text-decoration: none;
      -webkit-border-radius: 3px;
      -moz-border-radius: 3px;
      -ms-border-radius: 3px;
      -o-border-radius: 3px;
      border-radius: 3px;
      -webkit-box-shadow: 0 1px 0 0 gray inset;
      -moz-box-shadow: 0 1px 0 0 gray inset;
      -ms-box-shadow: 0 1px 0 0 gray inset;
      -o-box-shadow: 0 1px 0 0 gray inset;
      box-shadow: inset 0 1px 0 0 gray;
      -webkit-text-shadow: 0 -1px 0 #596629;
      -moz-text-shadow: 0 -1px 0 #596629;
      -ms-text-shadow: 0 -1px 0 #596629;
      -o-text-shadow: 0 -1px 0 #596629;
      text-shadow: 0 -1px 0 #596629;
      background-color: #596629;
      background: -webkit-gradient(linear, left top, left bottom, from(#B4C47D), to(#596629));
      background: -webkit-linear-gradient(top, #B4C47D, #596629);
      background: -moz-linear-gradient(top, #B4C47D, #596629);
      background: -ms-linear-gradient(top, #B4C47D, #596629);
      background: -o-linear-gradient(top, #B4C47D, #596629);
      background: linear-gradient(top, #B4C47D, #596629);
    }

  ul#click a:hover {
    opacity: .85;
    cursor: pointer;
  }

  ul#click li.current a {
    border: 1px solid #596629;
  }

  ul#click li:active a {
    border: 1px solid gray;
    -webkit-box-shadow: 0 0 10px 5px #596629 inset;
    -moz-box-shadow: 0 0 10px 5px #596629 inset;
    -ms-box-shadow: 0 0 10px 5px #596629 inset;
    -o-box-shadow: 0 0 10px 5px #596629 inset;
    box-shadow: 0 0 10px 5px #596629 inset;
  }

/*-------------FOOTER--------------*/

footer {
  height: 23em;
  text-align: center;
  border-top: 1px solid lightgray;
  overflow:hidden;
  display: inline-block;
  background:#e3e0d9;
}

footer .boxes {
  float: left;
  width: 32.8%;
  height: 14.000em;
  margin:0px 5px 0px 0px;
  text-align: center;
  padding:10px;
  -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset;
  -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset;
  background-image:url('images/body.png') !important;
}

footer .contact {
  width: 18.000em;
  height: 2.100em;
  color:#7A8554;
  font-weight: bold;
  margin:5px 5px 15px 5px ;
  padding: 5px;
  font-family: 'Gabriela', serif;
  text-align: center;
}

footer .opendaily {
  height: 34px;
  color:#7A8554;
  font-weight: bold;
  padding: 5px;
  font-size: 23px;
  font-family: 'Poller One', cursive;
  text-align: center;
}

footer ul.menu li a {
  font-size: 22px !important;
  padding: 5px;
}

footer ul.menu {
  padding:20px 0px 20px 0px;
}

/*-------------FOOTER ADRES--------------*/

footer .adres strong {
  color:#B4C47D;
}

footer .adres {
text-align: left;
padding:5px;
}

footer .adres text {
  color:gray;
}

footer .adres ul#click {
  margin-top: 35px;
}

/*-------------FOOTER TIME--------------*/

footer #time {
  width: 235px;
  height: 180px;
  padding: 5px;
  margin: 0 auto;
  font-family:'Droid Serif', serif;
  list-style: none;
  text-decoration: none;

}
  footer .time ul#click {
    margin-top:95px ;
  }

footer .time p {
text-align: center;
font-family:  'droid Serif', georgia;
color:gray !important;
}

footer .copyright {
font-size: 0.7em;
text-align: center;
color: #596629;
margin-top: 50px;
width: 100%;
display: inline-block;
 }

footer .date-day {
width: 48.5%;
font-size: 16px;
float: left;
text-align: left;
font-weight: bold;
line-height: 1.2;
color: #7A8554;
}

footer .hour-date {
width: 51%;
float: right;
font-size: 13px;
text-align: right;
line-height: 1.2;
font-style: italic;
}

footer #time li {
  padding: 3px;
  height: 1.5em;
}
/*-------------BACK TO TOP HOVER--------------*/

    footer .back-to-top {
      position: fixed;
      bottom: 2em;
      right: 0px;
      text-decoration: none;
      color: #000000;
      font-size: 12px;
      padding: 5px;
      display: none;
      padding-right:30px;
    }

    footer .back-to-top:hover {
      background-color: rgba(135, 135, 135, 0.50);
    }


/*-------------CONTACT FORM--------------*/


/* === Remove input autofocus webkit === */
*:focus {outline: none;}

/* === Form Typography === */
.contact_form h2, .contact_form label {font-family:Georgia, Times, "Times New Roman", serif;}
.form_hint, .required_notification {font-size: 11px;}

/* === List Styles === */
.contact_form ul {
    width:700px;
    list-style-type:none;
  list-style-position:outside;
  margin:0px;
  padding:0px;
}
.contact_form li{
  padding:12px;
  border-bottom:1px solid #eee;
  position:relative;
}
.contact_form li:first-child, .contact_form li:last-child {
  /*border-bottom:1px solid #777;*/
}

/* === Form Header === */
.contact_form h2 {
  margin:0;
  display: inline;
}
.required_notification {
  color:#d45252;
  margin:5px 0 0 0;
  display:inline;
  float:right;
}

/* === Form Elements === */
.contact_form label {
  width:200px;
  margin-top: 3px;
  display:inline-block;
  float:left;
  padding:3px;
}
.contact_form input {
  height:30px;
  width:220px;
  padding:5px 8px;
}
.contact_form textarea {padding:8px; width:300px;}
.contact_form button {margin-left:200px;}

  /* form element visual styles */
  .contact_form input, .contact_form textarea {
    border:1px solid #aaa;
    box-shadow: 0px 0px 3px #ccc, 0 10px 15px #eee inset;
    border-radius:2px;
    padding-right:30px;
    -moz-transition: padding .25s;
    -webkit-transition: padding .25s;
    -o-transition: padding .25s;
    transition: padding .25s;
  }
  .contact_form input:focus, .contact_form textarea:focus {
    background: #fff;
    border:1px solid #555;
    box-shadow: 0 0 3px #aaa;
    padding-right:70px;
  }

/* === HTML5 validation styles === */
.contact_form input:required, .contact_form textarea:required {
  background: #fff url(images/red_asterisk.png) no-repeat 98% center;
}
.contact_form input:required:valid, .contact_form textarea:required:valid {
  background: #fff url(images/valid.png) no-repeat 98% center;
  box-shadow: 0 0 5px #5cd053;
  border-color: #28921f;
}
.contact_form input:focus:invalid, .contact_form textarea:focus:invalid {
  background: #fff url(images/invalid.png) no-repeat 98% center;
  box-shadow: 0 0 5px #d45252;
  border-color: #b03535
}

/* === Form hints === */
.form_hint {
  background: #d45252;
  border-radius: 3px 3px 3px 3px;
  color: white;
  margin-left:8px;
  padding: 1px 6px;
  z-index: 999; /* hints stay above all other elements */
  position: absolute; /* allows proper formatting if hint is two lines */
  display: none;
}
.form_hint::before {
  content: "\25C0";
  color:#d45252;
  position: absolute;
  top:1px;
  left:-6px;
}
.contact_form input:focus + .form_hint {display: inline;}
.contact_form input:required:valid + .form_hint {background: #28921f;}
.contact_form input:required:valid + .form_hint::before {color:#28921f;}

/* === Button Style === */
button.submit {
  background-color: #68b12f;
  background: -webkit-gradient(linear, left top, left bottom, from(#68b12f), to(#50911e));
  background: -webkit-linear-gradient(top, #68b12f, #50911e);
  background: -moz-linear-gradient(top, #68b12f, #50911e);
  background: -ms-linear-gradient(top, #68b12f, #50911e);
  background: -o-linear-gradient(top, #68b12f, #50911e);
  background: linear-gradient(top, #68b12f, #50911e);
  border: 1px solid #509111;
  border-bottom: 1px solid #5b992b;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  box-shadow: inset 0 1px 0 0 #9fd574;
  -webkit-box-shadow: 0 1px 0 0 #9fd574 inset ;
  -moz-box-shadow: 0 1px 0 0 #9fd574 inset;
  -ms-box-shadow: 0 1px 0 0 #9fd574 inset;
  -o-box-shadow: 0 1px 0 0 #9fd574 inset;
  color: white;
  font-weight: bold;
  padding: 6px 20px;
  text-align: center;
  text-shadow: 0 -1px 0 #396715;
}
button.submit:hover {
  opacity:.85;
  cursor: pointer;
}
button.submit:active {
  border: 1px solid #20911e;
  box-shadow: 0 0 10px 5px #356b0b inset;
  -webkit-box-shadow:0 0 10px 5px #356b0b inset ;
  -moz-box-shadow: 0 0 10px 5px #356b0b inset;
  -ms-box-shadow: 0 0 10px 5px #356b0b inset;
  -o-box-shadow: 0 0 10px 5px #356b0b inset;

}











/*-------------GALLERY--------------*/





#gallery-container {
  font-size: 20px;
  margin: auto;
  position: relative;
  max-width: 50em;
  text-align: center;
  overflow: hidden;
  padding-top: 1em
}

#gallery-container:full-screen {
  max-width: 100% !important;
  width: 100%;
  height: 100% !important;
  background-color: #111
}

#gallery-container:-webkit-full-screen {
  max-width: 100% !important;
  width: 100%;
  height: 100% !important;
  background-color: #111
}

#gallery-container:-moz-full-screen {
  max-width: 100% !important;
  width: 100%;
  height: 100% !important;
  background-color: #111
}

.controls {
  text-align: center;
  font-size: 1em;
  opacity: 0;
  pointer-events: none;
  -webkit-transition: opacity .3s ease;
  transition: opacity .3s ease;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0
}

.control,
.grid,
.fs-toggle {
  width: .66em;
  height: .66em;
  text-align: center;
  line-height: .5em;
  cursor: pointer;
  display: inline-block;
  margin-right: 10px
}

.showControls {
  opacity: 1;
  pointer-events: auto;
  -webkit-transition: opacity .6s 1s ease;
  transition: opacity .6s 1s ease
}

.hideControls {
  opacity: 0;
  pointer-events: none
}

.icon-grid,
.icon-arrow-left,
.icon-arrow-right,
.icon-fullscreen-exit,
.icon-fullscreen {
  display:inline-block;
  width: 35px;
  height: 37px;
  background-image: url(images/controls-light3.png);
  background-repeat: no-repeat
}

.icon-grid {
  background-position: 0 0
}

.icon-arrow-left {
  background-position: -40px 0
}

.icon-arrow-right {
  background-position: -80px 0
}

.icon-fullscreen-exit {
  background-position: -120px 0
}

.icon-fullscreen {
  background-position: -160px 0
}
.fs-toggle {
  display: none;
}

.item {
  display: inline-block;
  cursor: pointer;
  width: 24%;
  height: auto;
  margin-right: .5%
}

.item img,
.item--big img {
  display:block;
}

.items--big {
  position: absolute;
  top: 0;
  left: 0
  right:0;
  height: 100%;
  pointer-events: none
}

.item--big {
  position: absolute;
  height: auto;
  top: 0em;
  opacity: 0;
  -webkit-transform: scale(.8);
  transform: scale(.8)
}
.item--big .img-caption {
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  background-color: rgba(0,0,0,0.6);
  color:white;
  padding:10px;
  font-size:.8em;
  text-align:center;
}
.fadeInScaleUp {
  -webkit-animation: fadeInScaleUp .5s ease-out .6s forwards;
  animation: fadeInScaleUp .5s ease-out .6s forwards;
  z-index: 3
}

.fadeOut {
  -webkit-animation: fadeOut .4s ease-out forwards;
  animation: fadeOut .4s ease-out forwards;
  z-index: 1
}

@keyframes fadeOut {
  from {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }

  to {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
}

@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }

  to {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
}

@keyframes fadeInScaleUp {
  from {
    opacity: 0;
    -webkit-transform: scale(.8);
    transform: scale(.8)
  }

  to {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
}

@-webkit-keyframes fadeInScaleUp {
  from {
    opacity: 0;
    -webkit-transform: scale(.8);
    transform: scale(.8)
  }

  to {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
}

.scaleDownFadeOut {
  -webkit-animation: scaleDownFadeOut .4s ease-in forwards;
  animation: scaleDownFadeOut .4s ease-in forwards;
  pointer-events: none
}

@keyframes scaleDownFadeOut {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }

  99% {
    opacity: 0;
    -webkit-transform: scale(.5);
    transform: scale(.5)
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
}

@-webkit-keyframes scaleDownFadeOut {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }

  99% {
    opacity: 0;
    -webkit-transform: scale(.5);
    transform: scale(.5)
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
}

.scaleUpFadeIn {
  opacity: 0;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-animation: scaleUpFadeIn ease-in-out .4s forwards;
  animation: scaleUpFadeIn ease-in-out .4s forwards;
  -webkit-animation-duration: .4s;
  animation-duration: .4s
}

@keyframes scaleUpFadeIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1)
  }

  1% {
    opacity: 0;
    -webkit-transform: scale(.5);
    transform: scale(.5)
  }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
}

@-webkit-keyframes scaleUpFadeIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1)
  }

  1% {
    opacity: 0;
    -webkit-transform: scale(.5);
    transform: scale(.5)
  }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
}

.showLastSecond {
  opacity: 0;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-animation: showLastSecond ease-in-out .4s forwards;
  animation: showLastSecond ease-in-out .4s forwards;
  -webkit-animation-duration: .4s;
  animation-duration: .4s
}

@keyframes showLastSecond {
  0% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1)
  }

  1% {
    opacity: 0;
    -webkit-transform: scale(.5);
    transform: scale(.5)
  }

  99% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1)
  }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
}

@-webkit-keyframes showLastSecond {
  0% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1)
  }

  1% {
    opacity: 0;
    -webkit-transform: scale(.5);
    transform: scale(.5)
  }

  99% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1)
  }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
}

@media screen and (max-width: 30em) {
  .item--big {
    width: 80%;
    right: 10%;
    left: 10%
  }
}

/*! http://responsiveslides.com v1.54 */
.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }