﻿@import url(http://fonts.googleapis.com/css?family=Noto+Sans&subset=latin,latin-ext);
@import "responsive.css";

body {
	margin:0px;
	padding:0px;
	height:100%;
	width:100%;
  font-family: 'Noto Sans', sans-serif;
  background: url('img/body_bg2.png') repeat 0 0;
}

html {
	height:100%;
	width:100%;
}

.wrapper {
  background: url("img/body_bg2_s.png") repeat-x left top;
}

.TA_virtualsticker .container {
  margin-bottom: 10px;
}

.TA_virtualsticker .container div {
  margin: 0px auto !important;
}

p {
  margin: 0px;
  padding: 0px;
}

.cf:before,
.cf:after {
  content: " ";
  display: table;
}

.cf:after {
  clear: both;
}

.cf {
  *zoom: 1;
}

.inner {
  width: 1000px;
  margin: 0px auto;
}

.head {
  background-color: #000000;
  height: 39px;
  border-bottom: 1px solid #018592;
  min-width: 1000px;
}

.menu {
  list-style-type: none;
  margin: 0px;
  padding: 0px;
  display: inline-block;
}

.menu > li {
  height: 40px;
  display: inline-block;
  padding: 0px;
  margin: 0px;
  vertical-align: top;
  position: relative;
  white-space: nowrap;
  transition: all .2s linear;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -o-transition: all .2s linear;
  color: #ffffff;
  font-size: 12px;
  line-height: 40px;
}

.menu li ul {
  position: absolute;
  left: 0px;
  top: 40px;
  padding: 0px;
  margin: 0px;
  background-color: #000000;
  display: none;
  transition: all .2s linear;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -o-transition: all .2s linear;
}

.menu li ul li {
  display: block;
}

.menu li a {
  display: block;
  height: 40px;
  line-height: 40px;
  padding: 0px 25px;
  font-size: 12px;
  color: #ffffff;
  text-transform: uppercase;
  text-decoration: none;
  transition: all .2s linear;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -o-transition: all .2s linear;
}

.menu li:hover > a {
  background-color: #0199ae;
}

.menu li:hover > ul {
  display: block;
}

.menu li a.fb {
  background-image: url('img/head_fb_like.png');
  background-repeat: no-repeat;
  background-position: 5px 5px;
  padding-left: 42px;
  text-transform: none;
}

.menu.lng {
  position: absolute;
  right: 0px;
  top: 0px;
}

.menu.lng li {
  margin: 0px;
  padding: 0px;
}

.menu.lng li a {
  padding: 0px 12px;
}

#mainmenu {
  left: 50%;
  top: 0px;
  position: absolute;
  z-index: 900;
}

.menu.home {
  position: absolute;
  left: 0px;
  top: 0px;
}


.head .inner {
  position: relative;
}
/*
  ---------------------------------------------------------
  Headpics
  ---------------------------------------------------------
*/
.headpics {
  width: 100%;
  height: 563px;
  min-width: 1000px;
  background: url('img/headpics_bg.png') no-repeat center top;
}

.headpics .picsblock {
  width: 1000px;
  height: 563px;
  margin: 0px auto;
  position: relative;
  overflow: hidden;
}

.headpics .picsblock .block {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 1000px;
  height: 563px;
}

.headpics .picsblock .block.szigetkozbol {
  background: url('img/headpics/04.jpg') no-repeat 0 0;
}

.headpics .picsblock .block.kave {
  background: url('img/headpics/05.jpg') no-repeat 0 0;
}

.headpics .picsblock .block.tudatosan {
  background: url('img/headpics/06.jpg') no-repeat 0 0;
}

.headpics .picsblock .block.estenkent {
  background: url('img/headpics/07.jpg') no-repeat 0 0;
}

.headpics .picsblock .block.napkozben {
  background: url('img/headpics/08.jpg') no-repeat 0 0;
}

.headpics .picsblock .block.reggelente {
  background: url('img/headpics/09.jpg') no-repeat 0 0;
}

.headpics .picsblock .block.terkep {
  background: url('img/headpics/10.jpg') no-repeat 0 0;
}

.headpics .picsblock .block h1 {
  color: #0199ae;
  font-size: 35px;
  position: absolute;
  top: 300px;
  left: 20px;
}

.headpics .picsblock .block .infotxt {
  color: #ffffff;
  font-size: 13px;
  line-height: 25px;
  position: absolute;
  left: 20px;
  top: 370px;
  padding-right: 20px;
  text-align: justify;
}

.headpics .picsblock .block .infotxt a {
  color: #ffffff;
  text-decoration: none;
}

.headpics .picsblock .block .infotxt a:hover {
  text-decoration: underline;
}

.headpics .picsblock .block.terkep .infotxt {
  position: relative;
  left: 0px;
  top: 460px;
  padding: 0px;
  text-align: center;
}

.headpics .picsblock .block .bigicon {
  background: url('img/big_icon_bg.png') no-repeat 0 0;
  width: 146px;
  height: 146px;
  padding: 5px;
  position: absolute;
  left: 50%;
  top: 205px;
  margin-left: -78px;
}

.headpics .picsblock .block .bigicon .icon {
  background-image: url('img/big_icons.png');
  background-repeat: no-repeat;
  width: 146px;
  height: 146px;
}

.headpics .picsblock .block .bigicon .icon.globe {
  background-position: 0px 0px;
}

.headpics .picsblock .block .bigicon .icon.coffee {
  background-position: 0px -146px;
}

.headpics .picsblock .block .bigicon .icon.bulb {
  background-position: 0px -292px;
}

.headpics .picsblock .block .bigicon .icon.night {
  background-position: 0px -438px;
}

.headpics .picsblock .block .bigicon .icon.sun {
  background-position: 0px -584px;
}

.headpics .picsblock .block .bigicon .icon.morning {
  background-position: 0px -730px;
}

.headpics .picsblock .nav {
  position: absolute;
  left: 0px;
  top: 0px;
  height: 40px;
  z-index: 900;
}

.headpics .picsblock .nav > ul {
  list-style-type: none;
  margin: 0px;
  padding: 0px;
}

.headpics .picsblock .nav > ul > li {
  height: 40px;
  display: inline-block;
  padding: 0px;
  margin: 0px;
  vertical-align: top;
}

.headpics .picsblock .nav > ul > li a {
  width: 40px;
  height: 40px;
  padding: 0px;
  margin: 0px;
  background-image: url('img/nav_arrows.png');
  background-repeat: no-repeat;
  outline: 0px;
  display: block;
  transition: all .2s linear;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -o-transition: all .2s linear;
}

.headpics .picsblock .nav > ul > li.up a {
  background-position: 0px 0px;
}

.headpics .picsblock .nav > ul > li.down a {
  background-position: -40px 0px;
}

.headpics .picsblock .nav > ul > li.pause a {
  background-position: -80px 0px;
}

.headpics .picsblock .nav > ul > li.play a {
  background-position: -80px 0px;
}

.headpics .picsblock .nav > ul > li:hover > a {
  background-color: #0199ae;
}

/*
  ---------------------------------------------------------
  Content
  ---------------------------------------------------------
*/
.content {
  width: 1000px;
  margin: 0px auto;
  padding: 0px 0px 0px 0px;
}

.content .left {
  width: 250px;
  float: left;
}

.content .right {
  width: 750px;
  float: right;
}

.facebook {
  width: 235px;
  background-color: #ffffff;
  margin: 0px 0px 10px 0px;
}

.google-map {
  width: 100%;
  height: 463px;
  margin-top: 15px;
}

.kutyabarat {
  max-width: 100%;
  margin-bottom: 10px;
  border: 0px;
}

/*
  ---------------------------------------------------------
  Opening line
  ---------------------------------------------------------
*/

.opening {
/*  background: url('img/content_head_separator.png') repeat-x 0 0;*/
  height: 60px;
  width: 100%;
  min-width: 1000px;
  border-top: 1px solid #018b9e;
  border-bottom: 1px solid #01626f;
  background: #1099a8;
  background: -moz-linear-gradient(top, #1099a8 0%, #0199ae 2%, #0194a9 15%, #017383 78%, #016c7a 98%, #0f6e77 100%);
  background: -webkit-linear-gradient(top, #1099a8 0%,#0199ae 2%,#0194a9 15%,#017383 78%,#016c7a 98%,#0f6e77 100%);
  background: linear-gradient(to bottom, #1099a8 0%,#0199ae 2%,#0194a9 15%,#017383 78%,#016c7a 98%,#0f6e77 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1099a8', endColorstr='#0f6e77',GradientType=0 );
}

.opening .inner {
  width: 1000px;
  height: 60px;
  margin: 0px auto;
}

.opening .inner ul {
  list-style-type: none;
  margin: 0px;
  padding: 9px 0px 0px 0px;
  text-align: center;
}

.opening .inner ul li {
  display: inline-block;
  margin: 0px -2px;
  font-size: 12px;
  color: #ffffff;
  line-height: 20px;
  text-transform: uppercase;
  padding: 0px 55px 0px 0px;
  font-weight: bold;
}

.opening .inner ul li span.day {
  font-weight: 300;
}

.opening .inner ul li span {
  display: block;
}

.opening .inner ul li:last-child {
  padding-right: 0px;
}

/*
  ---------------------------------------------------------
  Address
  ---------------------------------------------------------
*/
.address {
  height: 30px;
  line-height: 30px;
  border-top: 1px solid #0199ae;
  border-bottom: 1px solid #0199ae;
  text-align: center;
  color: #030303;
  font-size: 14px;
  font-weight: bold;
  margin: 0px 0px 15px 0px;
}

.address span {
  color: #0199ae;
}

/*
  ---------------------------------------------------------
  Iconmenu
  ---------------------------------------------------------
*/
.icons {
  overflow: auto;
}

.iconmenu {
  height: 70px;
  width: 142.85714px;
  padding: 10px 0px 0px 0px;
  text-decoration: none;
  float: left;
  transition: all .2s linear;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -o-transition: all .2s linear;
  text-align: center;
}

.iconmenu .iconholder {
  width: 40px;
  height: 40px;
  background: url('img/icon_holder_bg.png') no-repeat 0px -40px;
  margin: 0px auto 6px auto;
  transition: all .2s linear;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -o-transition: all .2s linear;
  position: relative;
}

.iconmenu .iconholder .icon {
  width: 34px;
  height: 34px;
  position: absolute;
  left: 3px;
  top: 3px;
  background-image: url('img/menu_icons.png');
  background-repeat: no-repeat;
  background-position: 0px 0px;
}

.iconmenu .iconholder .icon.sun {
  background-position: 0px -34px;
}

.iconmenu .iconholder .icon.night {
  background-position: 0px -170px;
}

.iconmenu .iconholder .icon.bulb {
  background-position: 0px -68px;
}

.iconmenu .iconholder .icon.coffee {
  background-position: 0px -102px;
}

.iconmenu .iconholder .icon.globe {
  background-position: 0px -136px;
}

.iconmenu .iconholder .icon.cake {
  background-position: 0px -204px;
}

.iconmenu .iconholder .icon.wine {
  background-position: 0px -238px;
}

.iconmenu .iconholder .icon.cherry {
  background-position: 0px -272px;
}

.iconmenu:hover {
  background-color: #0199ae;
}

.iconmenu .text {
  color: #ffffff;
  text-decoration: none;
  font-size: 11px;
}

/*
  ---------------------------------------------------------
  Popup
  ---------------------------------------------------------
*/
.popup {
  background-color: #efe9dd;
  position: absolute;
  padding: 5px;
  display: none;
  left: 50%;
  top: 50%;
  z-index: 3;
  outline: 0;
}

.overlayer {
  width: 100%;
  height: 100%;
  position: fixed;
  left: 0px;
  top: 0px;
  display: none;
  background-color: #000000;
  z-index: 2;
}

.popup .xbtn {
  padding: 5px;
  display: block;
  background-color: #0199ae;
  color: #ffffff;
  text-decoration: none;
  position: absolute;
  right: 0px;
  top: 0px;
  font-size: 11px;
  font-weight: normal;
  text-align: center;
}

#borlap, #itallap {
  display: block;
  left: -5000px;
}

/*
  ---------------------------------------------------------
  Menü popup
  ---------------------------------------------------------
*/
.menupopup {
  width: 815px;
  height: 827px;
  background: url('img/menu_popup_bg.png') no-repeat left bottom;
  position: absolute;
  left: 50%;
  top: 0px;
  margin: 0px 0px 0px -407px;
  z-index: 1000;
  display: none;
}

.menupopup .icon {
  width: 157px;
  height: 158px;
  background: url('img/menu_popup_icon_bg.png') no-repeat 0 0;
  margin: 0px auto;
  position: relative;
}

.menupopup .icon .inner {
  width: 147px;
  height: 148px;
  background: url('img/menu_popup_icons.png') no-repeat 0 0;
  position: absolute;
  left: 5px;
  top: 5px;
}

.menupopup .icon .inner.coffee {
  background-position: 0px -148px;
}

.menupopup .icon .inner.wine {
  background-position: 0px -296px;
}

.menupopup .icon .inner.cherry {
  background-position: 0px -444px;
}

.menupopup .icon .inner.morning {
  background-position: 0px -592px;
}

.menupopup .icon .inner.day {
  background-position: 0px -740px;
}

.menupopup .icon .inner.night {
  background-position: 0px -888px;
}

.menupopup h2 {
  padding: 0px;
  font-size: 40px;
  color: #0199ae;
  margin: 0px auto;
  text-align: center;
}

.menupopup .txt {
  font-size: 13px;
  color: #000000;
  line-height: 25px;
  width: 675px;
  margin: 0px auto;
  text-align: justify;
  padding: 5px 0px 0px 0px;
}

.menupopup .txt a {
  color: #0199ae;
  text-decoration: none;
}

.menupopup .txt a:hover {
  color: #000000;
}

.menupopup .picture {
  position: absolute;
  left: 70px;
  bottom: 70px;
}

.menupopup .xbtn {
  background: url('img/menu_popup_x.png') no-repeat 0 0;
  width: 40px;
  height: 40px;
  position: absolute;
  left: 50%;
  bottom: 60px;
  margin: 0px 0px 0px -20px;
  text-decoration: none;
  display: block;
}

/*
  ---------------------------------------------------------
  Program popup
  ---------------------------------------------------------
*/
.program_popup {
  display: block;
  position: absolute;
  left: 50%;
  top: 0px;
  z-index: 1000;
  display: none;
  -webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.9);
  -moz-box-shadow:    0px 0px 15px 0px rgba(0, 0, 0, 0.9);
  box-shadow:         0px 0px 15px 0px rgba(0, 0, 0, 0.9);
}

.program_popup .xbtn {
  background: url('img/menu_popup_x.png') no-repeat 0 0;
  width: 40px;
  height: 40px;
  position: absolute;
  left: 50%;
  bottom: 0px;
  margin: 0px 0px -20px -20px;
  text-decoration: none;
  display: block;
}

/*
  ---------------------------------------------------------
  Mobil menu overlayer
  ---------------------------------------------------------
*/

.mobile-menu-overlayer {
  background-color: rgba(0, 0, 0, .8);
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  min-height: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 999;
  flex-wrap: wrap;
  flex-direction: column;
  padding: 20px 0px;
  -moz-transform: translateX(-100%);
  -webkit-transform: translateX(-100%);
  -o-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  transform: translateX(-100%);
}

.mobile-menu-overlayer.active {
  -moz-transform: translateX(0%);
  -webkit-transform: translateX(0%);
  -o-transform: translateX(0%);
  -ms-transform: translateX(0%);
  transform: translateX(0%);
}

.mobile-menu {
  list-style-type: none;
  margin: 0px;
  padding: 0px;
}

.mobile-menu ul {
  padding: 10px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
}

.mobile-menu ul li:last-child {
  padding-bottom: 15px;
}

.mobile-menu li {
  padding-bottom: 10px;
  text-align: center;
}

.mobile-menu li > a {
  font-size: 20px;
  line-height: 20px;
  color: #fff;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  text-transform: uppercase;
  text-decoration: none;
}

.mobile-menu ul li a {
  font-size: 16px;
  line-height: 20px;
  color: #fff;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  text-transform: uppercase;
  text-decoration: none;
}

.mobile-facebook {
  padding-top: 30px;
  padding-bottom: 30px;
  display: flex;
  align-items: center;
  font-size: 12px;
  line-height: 12px;
  color: #fff;
  text-decoration: none;
}

.mobile-facebook img {
  padding-right: 10px;
  vertical-align: top;
}

.mobile-visitors {
  font-size: 12px;
  line-height: 12px;
  color: #fff;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
}

.mobile-language {
  display: flex;
  justify-content: center;
  padding-top: 30px;
}

.mobile-language a {
  font-size: 16px;
  line-height: 16px;
  color: #fff;
  margin: 0px 10px 0px 10px;
  text-transform: uppercase;
  text-decoration: none;
}

.mobile-language a:hover {
  text-decoration: underline;
}

.mobile-menu-x {
  position: absolute;
  right: 20px;
  top: 20px;
  font-size: 20px;
  line-height: 20px;
  color: #fff;
  text-decoration: none;
}

.mobile-menu-toggle {
  margin-right: 10px;
}

.mobile-menu-toggle img {
  vertical-align: top;
  width: 20px;
  height: auto;
}