@-ms-viewport{width: device-width;}

body, html {background-color: #fff; margin: 0px; font-family: Arial, Helvetica; font-size: 12px;}

h1 {width: 205px; text-align: center; margin: 20px auto 0 auto; padding: 2px; font-size: 20px; border-bottom: solid 3px #e33000; font-weight: bold;}
h2 {float: left; margin: 5px; font-weight: bold; font-size: 14px; text-decoration: underline;}
h3 {font-weight: bold; font-size: 14px; text-decoration: underline;}

.menuFull {display: block;}
.menuMobile {display: none;}

.mainHeader {clear: both; width: 100%; height: 85px; background-color: #241e1c;}
.insideContainer {max-width: 1200px; margin: 0px auto 0px auto;}
.mainLogo {float: left; margin: 8px 0 0 8px; width: 154px; height: 67px; background-image: url('../images/sprites_norep.png'); background-position: 0px 0px; cursor: auto;}
.mainLogo:hover {cursor: auto;}
.menuContainer {float: right; margin: 28px 5px 0 0; color: #fff; font-size: 14px;}
.menuItem {float: left; padding: 5px 0 5px 0; margin-right: 25px; border-bottom: solid 3px #241e1c; cursor: auto; -webkit-transition: all 250ms ease; moz-transition: all 250ms ease; ms-transition: all 250ms ease; o-transition: all 250ms ease; transition: all 250ms ease;}
.menuItem:hover {cursor: pointer; border-bottom: solid 3px #e33000;}
.menuIcon {float: right; width: 36px; height: 19px; margin: 3px 10px 0 0; background-image: url('../images/sprites_norep.png'); background-position: -164px 0px;}
.menuMobileCollapse {position: absolute; top: 85px; right: 0px; width: 200px; height: auto; background-color: #555; z-index: 999; display: none;}
.menuMobileItem {padding: 15px; color: #fff;}
.menuMobileItem:hover {color: #3e9992;}
.menuSubHeader {cursor: auto;}
.menuSubHeader:hover {cursor: pointer; color: #888;}
.subMenuDiv {clear: both; width: 200px; margin: 0 auto; text-align: center;}
.linkTop {clear: both; float: right; width: 30px; height: 30px; background-image: url('/images/icon_top.png'); cursor: auto; -webkit-transition: opacity 0.3s; transition: opacity 0.3s;}
.linkTop:hover {opacity: 0.5; filter: alpha(opacity=50); cursor: pointer; color: #241e1c;}
.googleMap {width: 800px; height: 350px;}
.picFrame {float: left; width: 290px; height: 193px; margin: 25px; border: solid 15px #fff; background-color: #fff; box-shadow: 0px 0px 15px #888888; background-size: contain; background-repeat: no-repeat;}
.picFrame2 {float: left; width: 290px; height: 193px; margin: 25px; border: solid 15px #fff; background-color: #fff; box-shadow: 0px 0px 15px #888888; background-size: contain; background-repeat: no-repeat;}
.pictureContainer {width: 1120px; margin: 0 auto;}

.lolaHolder {float: left; width: 300px;}
.pictureHolder {max-width: 1200px; margin: 0px auto 0px auto;}
.itemHolder {float: left; width: 260px; height: 310px; margin: 20px;}
.itemHolderExtra {position: relative; float: left; width: 260px; height: 330px; margin: 20px; background-color: #ddd;}
.itemHolderRestaurant {float: left; width: 260px; height: 380px; margin: 20px;}
.mainPicture {position: relative; width: 260px; height: 260px;}
.picPrice {position: absolute; top: 30px; left: 0px; width: 90px; height: 25px; padding-top: 6px; background-color: #241e1c; color: #ddd; text-align: center; font-size: 14px;}
.picDescription {width: 260px; height: 70px; background-color: #eee; color: #555;}
.picDescriptionRestaurant {width: 260px; height: 50px; background-color: #eee; color: #555;}
.fullscreenHome {float: left; width: 900px; margin: 0 auto;}
.fullscreenMenu {width: 1200px; margin: 0 auto;}

.subHeaderMenu {width: 390px; margin: 10px auto; text-align: center;}

.footerBuff {clear: both; width: 10px; height: 0px;}
.buff25 {clear: both; width: 10px; height: 25px;}

.footerSocialMedia {clear: both; width: 100%; height: 60px; background-color: #ededed;}
.footerCopyright {clear: both; width: 100%; height: 100px; background-color: #241e1c;}
.socialBar {width: 260px; margin: 0 auto;}
.iconTwitter {float: left; width: 42px; height: 42px; margin: 9px 5px 0; background-image: url('../images/sprites_norep.png'); background-position: 0px -74px; cursor: auto; opacity: 1.0; filter: alpha(opacity=100); -webkit-transition: all 250ms ease; moz-transition: all 250ms ease; ms-transition: all 250ms ease; o-transition: all 250ms ease; transition: all 250ms ease;}
.iconTwitter:hover {opacity: 0.7; filter: alpha(opacity=70); cursor: pointer;}
.iconFacebook {float: left; width: 42px; height: 42px; margin: 9px 5px 0; background-image: url('../images/sprites_norep.png'); background-position: -43px -74px; cursor: auto; opacity: 1.0; filter: alpha(opacity=100); -webkit-transition: all 250ms ease; moz-transition: all 250ms ease; ms-transition: all 250ms ease; o-transition: all 250ms ease; transition: all 250ms ease;}
.iconFacebook:hover {opacity: 0.7; filter: alpha(opacity=70); cursor: pointer;}
.iconGoogle {float: left; width: 42px; height: 42px; margin: 9px 5px 0; background-image: url('../images/sprites_norep.png'); background-position: -86px -74px; cursor: auto; opacity: 1.0; filter: alpha(opacity=100); -webkit-transition: all 250ms ease; moz-transition: all 250ms ease; ms-transition: all 250ms ease; o-transition: all 250ms ease; transition: all 250ms ease;}
.iconGoogle:hover {opacity: 0.7; filter: alpha(opacity=70); cursor: pointer;}
.iconYoutube {float: left; width: 42px; height: 42px; margin: 9px 5px 0; background-image: url('../images/sprites_norep.png'); background-position: -129px -74px; cursor: auto; opacity: 1.0; filter: alpha(opacity=100); -webkit-transition: all 250ms ease; moz-transition: all 250ms ease; ms-transition: all 250ms ease; o-transition: all 250ms ease; transition: all 250ms ease;}
.iconYoutube:hover {opacity: 0.7; filter: alpha(opacity=70); cursor: pointer;}
.iconInstagram {float: left; width: 42px; height: 42px; margin: 9px 5px 0; background-image: url('../images/sprites_norep.png'); background-position: -172px -74px; cursor: auto; opacity: 1.0; filter: alpha(opacity=100); -webkit-transition: all 250ms ease; moz-transition: all 250ms ease; ms-transition: all 250ms ease; o-transition: all 250ms ease; transition: all 250ms ease;}
.iconInstagram:hover {opacity: 0.7; filter: alpha(opacity=70); cursor: pointer;}
.copyright {width: 100%; padding-top: 42px; text-align: center; color: #ddd;}
.homeTitle {display: none;}
.mainContainerContact {width: 800px; margin: 0 auto;}
.contactContents {clear: both; max-width: 900px; margin: 0 auto; height: auto; font-size: 16px; line-height: 150%;}
.contactTextLeft {float: left; width: 50%;}
.contactTextRight {float: right; width: 50%; text-align: right;}

@media only screen and (max-width : 1220px) {
        .pictureHolder {width: 900px; margin: 0 auto;}
        .itemHolderExtra {display: none;}
        .lolaHolder {display: none;}
        .fullscreenHome {width: auto;}
        .fullscreenMenu {width: auto;}
        .footerBuff {clear: both; width: 10px; height: 25px;}
        .homeTitle {display: block;}
        .picFrame {float: left; border: solid 5px #fff; margin: 15px;}
        .picFrame2 {float: left; border: solid 5px #fff; margin: 15px;}
        .pictureContainer {width: 690px;}
}

@media only screen and (max-width : 906px) {
        .lolaHolder {display: none;}
        .pictureHolder {width: 600px; margin: 0 auto;}
        .itemHolderExtra {display: none;}
        .fullscreenHome {width: auto;}
        .fullscreenMenu {width: auto;}
        .footerBuff {clear: both; width: 10px; height: 25px;}
        .homeTitle {display: block;}
        .picFrame {float: left; border: solid 5px #fff; margin: 15px;}
        .picFrame2 {float: left; border: solid 5px #fff; margin: 15px;}
        .pictureContainer {width: 690px;}
        .contactContents {clear: both; width: 490px; margin: 0 auto;}
        .googleMap {width: 500px; height: 300px; margin: 0 auto;}
        .mainContainerContact {width: 500px; margin: 0 auto;}
        .contactTextLeft {float: left; width: 230px;}
        .contactTextRight {float: right; width: 230px; text-align: right;}
}

@media only screen and (max-width : 710px) {
        .menuFull {display: none;}
        .menuMobile {display: block;}
        .picFrame {clear: left; border: solid 5px #fff; margin: 20px 0 0 0;}
        .picFrame2 {clear: left; border: solid 5px #fff; margin: 20px 0 0 0;}
        .pictureContainer {width: 300px;}
        .contactContents {clear: both; width: 390px; margin: 0 auto;}
        .googleMap {width: 400px; height: 300px; margin: 0 auto;}
        .mainContainerContact {width: 400px; margin: 0 auto;}
        .contactTextLeft {clear: left; float: none;}
        .contactTextRight {clear: left; float: none; margin-top: 15px; text-align: left;}
}

@media only screen and (max-width : 612px) {
        .lolaHolder {display: none;}
        .pictureHolder {width: 310px; margin: 0 auto;}
        .itemHolderExtra {display: none;}
        .menuFull {display: none;}
        .menuMobile {display: block;}
        .fullscreenHome {width: auto;}
        .fullscreenMenu {width: auto;}
        .footerBuff {clear: both; width: 10px; height: 25px;}
        .homeTitle {display: block;}
        .picFrame {clear: left; border: solid 5px #fff; margin: 20px 0 0 0;}
        .picFrame2 {clear: left; border: solid 5px #fff; margin: 20px 0 0 0;}
        .pictureContainer {width: 300px;}
        .contactContents {clear: both; width: 290px; margin: 0 auto;}
        .googleMap {width: 300px; height: 200px; margin: 0 auto;}
        .mainContainerContact {width: 300px; margin: 0 auto;}
        .contactTextLeft {clear: left; float: none;}
        .contactTextRight {clear: left; float: none; margin-top: 15px; text-align: left;}
}

@media only screen and (max-width : 500px) {
        .lolaHolder {display: none;}
        .pictureHolder {width: 310px; margin: 0 auto;}
        .itemHolderExtra {display: none;}
        .menuFull {display: none;}
        .menuMobile {display: block;}
        .subHeaderMenu {width: 170px;}
        .fullscreenHome {width: auto;}
        .fullscreenMenu {width: auto;}
        .footerBuff {clear: both; width: 10px; height: 25px;}
        .homeTitle {display: block;}
        .picFrame {clear: left; border: solid 5px #fff; margin: 20px 0 0 0;}
        .picFrame2 {clear: left; border: solid 5px #fff; margin: 20px 0 0 0;}
        .pictureContainer {width: 300px;}
        .contactContents {clear: both; width: 290px; margin: 0 auto;}
        .googleMap {width: 300px; height: 200px; margin: 0 auto;}
        .mainContainerContact {width: 300px; margin: 0 auto;}
        .contactTextLeft {clear: left; width: 290px;}
        .contactTextRight {clear: left; width: 290px; margin-top: 15px; text-align: left;}
}