@import url(https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,400,300,600,700);
@import url(https://fonts.googleapis.com/css?family=Roboto);

/* resets */
body { 
  background: none repeat scroll 0 0 white; 
  line-height: 1; 
  font-family: 'Roboto';
  margin: 0;
  background: #F0F1F5;
  min-width: 1024px;
}

:focus { outline: 0 none; }

/* clearfix */
.clearfix:after, .clearfix:before {
  content: " ";
  display: table;
}

.clearfix:after {
  clear: both;
}

/* Base Styles */

ol, ul { margin:0 0 1em 0; padding: 0; }
ul li, ol li { line-height:1.3em; margin:0.25em 0; padding:0; }
table { border-collapse: separate; border-spacing: 0; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
input { font-family: inherit; font-size: 100%; font-style: inherit; font-weight: inherit; }
select { font-family: inherit; font-size: 100%; font-style: inherit; font-weight: inherit; }

/* elements */
h1, h2, h3, h4 { font-weight: normal; }
h1 { font-size: 28px; line-height: 1.3; margin-bottom: 5px; }
h2 { font-size: 22px; line-height: 1.3; margin-bottom: 5px; }
h3 { font-size: 18px; line-height: 1.3; margin-bottom: 5px; }
h4 { font-size: 16px; line-height: 20px; margin-bottom: 5px; }
a { color: #333333; text-decoration: none; }
a.hover:hover { text-decoration: underline; }
table td { vertical-align: middle; padding: 3px 10px; }
hr { opacity: 0.3; }

/* helpers */
.hide { display: none; }
.clear { clear: both; }
.left { float: left; }
.right { float: right; }
.aligncenter { text-align: center; }
.alignleft { text-align: left; }
.alignright { text-align: right; }
.center { margin: 0 auto; width: 960px; }
.bold { font-weight: bold; }
.todo { background-color: yellow; }
.highlight { background-color: yellow; }
.size12 { font-size: 12px; }
.size14 { font-size: 14px; }
.size16 { font-size: 16px; }
.size18 { font-size: 18px; }
.size20 { font-size: 20px; }
.size22 { font-size: 22px; }
.size24 { font-size: 24px; }
.size26 { font-size: 26px; }
.size28 { font-size: 28px; }
.oleo { font-family: 'Open Sans', sans-serif; }

/* structure */
.container { 
  width: 100%;
  max-width: 1024px; 
  margin: 0 auto; 
  position: relative; 
}
.content { 
  overflow: hidden;
}
.content ul li {
  list-style: none;
}
.content .cover { 
  height: 355px; 
  width: 100%; 
  margin: 0 auto; 
  background-size: 100%;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.content .cover .review-theme-container {
  float: right;
}
.content .cover-text {
  position: relative;
  top: 50px;
  width: 500px;
  font-size: 40px;
  font-weight: bold;
  text-align: right;
  float: right;
  color: #FFF;
  text-shadow: 0 1px 3px #1F1F1F;
}
.content .mid { padding: 30px; }
.content .bot { display: none; }

/* header */
.top {
  border-bottom: 1px solid #ddd;
  margin-bottom: 20px;
}
#map-canvas {
    height: 500px;
}
.logo { 
  top: -40px;
  background: #FFF;
  max-width: 175px;
  max-height: 175px;
  border-radius: 10%;
  overflow: hidden;
  position: absolute;
  border: 5px solid #fff;
  box-shadow: 0 1px 1px 0 rgba(0,0,0,0.4);
  -moz-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.4);
}
.logo img {
  border-radius: 5px;
}
.business-name { 
  font-weight: bold;
  position: relative;
  padding-left: 200px;
  margin: 10px;
  font-size: 21px;
  float: left;
  width: auto;
  display: block;
  color: #fff;
  text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.4);
}
.business-name.nologo { left: 25px; }

/* Tab bar */
.tab-bar {
  background: #fff;
  box-shadow: 0 0px 2px #7C7C7C;
}
.tab-bar .tabs {
  margin: 0;
  padding-left: 190px;
  list-style: none;
}
.tab-bar .tabs li {
  float: left;
  margin: 0 1px;
}
.tab-bar .tabs li a {
  padding: 15px;
  display: block;
  transition: .2s ease-in-out color, .4s ease-in-out box-shadow;
  font-size: 14px;
}
.tab-bar .tabs li a:hover {
  text-decoration: none;
  color: #333333;
  box-shadow: #333333 0px -3px 0px 0px inset;
}
.tab-bar .tabs li.active a {
  box-shadow: #333333 0px -3px 0px 0px inset;
  color: #333333;
}
/* Location Maps Wrapper */
.location-maps-wrapper {
    background: white;
    border-radius: 3px;
    border: 1px solid #E9E9E9;
    overflow: hidden;
}


/* Tab Content */
.tabs-content {
  float: left;
  width: 55% !important;
}
.tabs-content>.content {
  display: none;
}
.tabs-content>.active {
  display: block;
  border-radius: 3px;
}
.tabs-content .content {
  background: white;
  border-radius: 3px;
  border: 1px solid #E9E9E9;
  overflow: hidden;
  padding: 20px;
}
.tabs-content .content.no-background {
  background: unset;
  border: unset;
}
.tabs-content .content h2 {
  font-size: 26px;
  font-weight: 600;
  margin: 0;
  background: #2f7d7e;
  background: none;
  color: #333;
}
.header-info {
    float: left;
}
.address-head {
  font-size: 20px !important;
  color: #888 !important;
  /*margin: 0 !important;*/
  font-weight: 100 !important;
  margin-bottom: 10px !important;
  /*padding-bottom: 10px;*/
  /*border-bottom: 2px solid #F0F1F5;*/
}

.tabs-content .content h3 {
  margin: 0 0 10px;
  color: #808080;
  color: #515151;
  font-weight: 600;
}
.tab-pane-body {
}


.review-logo {
	max-width: 250px !important;
}
.payment-methods img {
    width: 45px;
}
.panel {
  margin-bottom: 25px;
  padding: 0 5px 10px 15px;
  border-bottom: 1px solid #DDD;
}
.panel.map-contain{
	padding: 10px 0 15px;
}
.panel.map-contain iframe{
	width: 100%;
}
.panel:last-child {
  border-bottom: none;
  margin-bottom: 0;
}
.panel * {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.panel:after, .panel:before {
  content: " ";
  display: table;
}
.panel:after {
  clear: both;
}
.address strong:first-child {
    font-size: 16px;
}
.panel p, .address, .hours {
  font-size: 14px;
  margin: 0 0 8px;
  color: #5E5E5E;
  line-height: 1.6;
  overflow: auto;
}
.social-media-links img {
    height: 25px;
}

.selected-location {
    background-color: #f3f3f3;
}

p.business-desc{
	margin: 5px 0 20px 0;
	border-left: 1px solid #DDD;
    padding-left: 10px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.25em;
    color: rgb(94, 94, 94);
}
.panel p:last-child {
  margin: 0;
}
.business-btn, .preview-btn {
  color: #FFF;
  display: block;
  font-size: 16px;
  text-align: center;
  padding: 10px;

}
.business-btn, .some-btn{
	background: #F98D2A;
	color: #FFF;
	display: block;
	float: left;
	margin: 0.25em auto 0.25em auto;
	font-size: 16px;
	width: 46%;
	text-align: center;
	padding: 10px;
}
.preview-btn, .some-btn{
	background: #27AE61;
}
.tour-btn{
	background: #4285F4;
	color: #FFF;
	display: block;
	float: left;
	margin: 21px 2% 0 0;
	font-size: 20px;
	text-align: center;
	padding: 18px 10px;
	width: 48%;

}
.blue-link {
    color: #4a8abf;
    text-decoration: underline;
    cursor: pointer;
}

/* About Info */
.address {
  width: 100%;
}
.address, .hours {
  margin: 15px 0;
  padding-left: 10px;
  padding-right: 10px;
  box-sizing: border-box;
  max-height: 310px;
}
.primary-location-info-panel {
  width: 100%;
  display: flex;
  flex-direction: row;
  margin-bottom: 1vh;
}
.business-information, .hours {
  width: 100%;
}
.business-information, .hours table {
  width: 100%;
}
.address .icon {
  height: 15px;
}
.happy-rank{
	width: 45px;
}
.happiness-rank-info p{
	display:inline-block;
	vertical-align:top;
}
.happy-score-title{
	padding-top: 12px;
}
.happiness-count{
	width:100px;
	display:inline-block;
	margin:0 10px;
}
.happiness-face{
	width: 100%;
}
.happy-count{
	font-size:30px;
}

/* home */
.home-container {
  margin-top: 40px;
  margin-top: 25px;
}
.home-signup-form { 
  margin-top: 10px;
}
.home-signup-form-top { 
  height: 78px;
  margin-left: -13px;
}
.home-signup-form-top span { color: #fff; position: relative; left: 15px; top: 28px; font-size: 24px; font-family: 'Oleo Script', cursive; }
.home-signup-form-bot { display: none; }
.home-share { 
  margin: 10px 0;
  float: right;
  height: auto;
}
.home-share img { 
  vertical-align: middle;
  height: 26px;
}
.home-share div {
  display: inline-block;
  margin: 0 5px 0 0;
  top: 1px;
  position: relative;
  font-size: 14px;
  color: #fff;
  text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.4);
}
.desktop-notice {
    position: relative;
    float: right;
    width: 43%;
    text-align: center;
    font-size: .9em;
	padding: 5px;
	text-align: center;
    clear: right;
}
.home-preview {
  background: url(/images/white-phone-preview.png) no-repeat center;
  height:701px;
  position: relative;
  float: right;
  width: 43%;
  clear: right;
}
.home-preview-wrap { 
  height: 500px;
  width: 318px;
  position: relative;
  top: 101px;
  float: none;
  margin: auto;
  overflow: hidden;
  -webkit-overflow-scrolling: touch;
  left: 0;
  right: 0;
  top: 90px;
  width: 297px;
  height: 524px;
}
.review-theme-container {
  height: 100%;
  padding: 0 40px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.review-theme-box {
  height: 300px;
  overflow: hidden;
  background-color: #fff;
  text-align: center;
}
.review-theme-box > div {
  height: 100px;
  overflow: hidden;
  box-sizing: border-box;
}
.review-theme-box img {
  object-fit: contain;
  max-height: 100%;
  max-width: 100%;
}
.review-theme-box .review-box-logo {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 0 20px;
}
.review-theme-box .review-box-grade {
  position: relative;
}
.review-theme-box .review-box-grade .upper-letter {
  position: absolute;
  top: 15px;
  left: 70px;
  font-size: 6rem;
}
.review-theme-box .review-box-footer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 20px 60px;
}
.review-theme-box .review-box-footer .see-reviews-btn {
  background-color: #4285F4;
  color: #fff;
  padding: 15px;
  display: block;
}
#vt-iframe iframe {
    width: 100%;
}
.happy-unhappy-logo {
    max-width: 225px;
    margin-bottom: 15px;
    text-align: center;
}
ul.review {
    list-style-type: none;
    font-size: 16px;
    color: #5E5E5E;
    margin-bottom: 0;
}
ul.review .reviewer {
    font-size: 14px;
    font-style: italic;
    font-size: 13px;
    font-style: italic;
    font-weight: 600;
    text-transform: capitalize;
    margin: 10px 0;
    padding: 0 0 5px 0;
    display: block;
}

#show-reviews-form input[type="submit"] {
    display: none;
}

.price-tag {
    padding: 0 1px;
}
.panel.foursquare .review .rating, .panel.yelp .review .rating {
  width: 20%;
  float: left;
}
.panel.foursquare .review .rating img, .panel.yelp .review .rating img {
  padding: 5px;
  box-sizing: border-box;
  background: #FFF;
  border-radius: 4px;
  -moz-border-radius: 4px;
  box-shadow: 0 1px 2px #DDD;
  -moz-box-shadow: 0 1px 2px #DDD;
  max-width: 98%;
}
.panel.foursquare .review .message, .panel.yelp .review .message {
  width: 80%;
  float: left;
  font-size: 14px;
  margin: 0 0 12px;
  color: #5E5E5E;
  line-height: 1.6;
  padding: 0 10px;
}
.panel.foursquare .review .reviewer, .panel.yelp .review .reviewer {
  font-size: 13px;
  font-style: italic;
  font-weight: 600;
  text-transform: capitalize;
  margin: 10px 0;
  padding: 0 0 5px 0;
  display: block;
}
.panel.yelp .review .star-rating {
  display: block;
}

#gallery img {
    margin: 5px 0 0 5px;
    width: 240px;
    height: 200px;
}

#gallery-image {
  margin: 5px 0 0 5px;
  width: 240px;
  height: 200px;
  padding: 0 1px;
}

.punch-card { 
    width: 280px; 
    height: 250px; 
    margin: 0 auto 15px; 
    padding: 10px 10px; 
    position: relative; 
    background-size: 300px;
}

.punch-card-previews-wrapper {
  display: flex;
  flex-direction: column;
}

#youtube-video {
    padding: 0 0 25px 0;
}

.pull-right { float: right; }

/* form styles */
form.cssform { padding: 0; margin-bottom: 1em; border: 0; }
form.cssform fieldset  { border: 1px solid #369; margin:  0 0 1.5em 0; padding: 10px 1em 15px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
form.cssform fieldset legend, fieldset legend {
    font-size: 16px;
    color: #384349;
    padding: 8px;
    font-weight: 600;
}
form.cssform p { margin-left:0;margin-right:0;}
/* form styles -> fieldcontainer */
form.cssform div.fc { margin: 0 0 5px 0; float: left; text-align: left; }
form.cssform div.fc div { margin: 0 0 4px 0; }
/* form styles -> width */
form.cssform div.fc.w100 { width: 100%; display: block; }
form.cssform div.fc.w90 { width: 88%; display: block; }
form.cssform div.fc.w75 { width: 73%; display: block; }
form.cssform div.fc.w50 { width: 48%; display: block; }
form.cssform div.fc.w25 { width: 23%; display: block; }
/* form styles -> input/select fields */
form.cssform input.field, form.cssform select.field, form.cssform textarea.field { 
  width: 100%;
  display: block;
  padding: 0 5px;
  border: 1px solid #ABB4C0;
  min-height: 40px;
  border-radius: 5px;
  font-weight: 400;
  margin-bottom: 10px;
  color: #5E5E5E;
  font-size: 14px;
  line-height: 40px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-shadow: 0 0 0 2px #EDEFF0;
  -moz-box-shadow: 0 0 0 2px #EDEFF0;
  -webkit-box-shadow: 0 0 0 2px #EDEFF0;
}
form.cssform label {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 3px;
  display: inline-block;
}
a.submit:link, a.submit:visited, a.submit:active, input.submit {
  box-shadow: none !important;
  -moz-box-shadow: none !important;
  -webkit-box-shadow: none !important;
  text-transform: capitalize !important;
  font-weight: 600 !important;
  padding: 10px 25px !important;
}
/* form styles -> checkboxes and radios */
form.cssform textarea.field { height: 50px; }
form.cssform input.select { display: block; float: left; margin: 0; color: #555555; }
form.cssform div.fc.wauto { width: auto; margin-right: 15px; margin-bottom: 10px; display: inline; }
form.cssform div.fc.wauto label { margin-left: 5px; }


/* alerts */
ul.alert.success, ul.alert.error { text-align: left; background-position: 14px 8px; background-repeat: no-repeat; border-radius: .6em;
	border-style: solid; border-width: 1px; font-size: 16px; font-weight: bold; list-style: none outside none; padding: 5px 6px 5px 58px; }
ul.alert.error { background-color: #FFFFDD; background-image: url(/images/icon-no.png); border-color: #E7E78A; color: #DD0000; }
ul.alert.success { background-color: #DDFFDD; background-image: url(/images/icon-yes.png); border-color: #99BB99; color: #339933; }			


/* footer */
.footer { 
  text-align: center; 
  margin-top: 40px; 
  padding: 40px 0;
  border-top: 1px solid #ddd;
  background: white;
}

#edit-request-closure-content {
  display: none;
}

#edit-request-closure-content.active {
  display: block;
}

#edit-request-closure-options {
  display: none;
}

#edit-request-closure-options.active {
  display: block;
}

#edit-request-closure-comment {
  display: none;
  margin: 15px;
}

#edit-request-closure-comment.active {
  display: block;
}

.popup-selection.active {
  display: flex;
  height: 50px;
  cursor: pointer;
}

.popup-selection {
  display: none;
}

.popup-selection:hover {
  background-color: #c2cccd3d;
}

.popup-selection svg {
  height: 24px;
  width: 24px;
  margin: 15px;
}

.popup-selection-description {
  margin: auto 15px;
  padding-right: 15px;
}

#popup-selection-comment {
  display: none;
  margin: 15px;
  padding: 15px;
}

#popup-selection-comment.active {
  display: block;
}

.popup-selection-description p, #popup-selection-comment p {
  margin: auto;
  font-size: 1em;
}

.popup-selection-description p.subtext {
  font-size: .7em;
}

#business-image {
  display: none;
}

/* we get js errors without this for for foundation tabs */
meta.foundation-data-attribute-namespace {
  font-family: false; }

.home-desktop-message {
    width: 45%;
    float: right;
    padding-left: 40px;
    box-sizing: border-box;
}

#edit-request-popup {
  display: none;
}
#edit-request-popup.active {
  display: inherit;
}

.home-desktop-message #send-edit-request {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: fit-content;
  height: fit-content;
  margin: auto;
  background-color: #ffff;
  border: 1px solid #ccc;
  background: #e4e3e3;
  border-radius: 5px;
}

#send-edit-request .popup-header{
  display: flex;
  height: 40px;
  padding: 0 15px;
  border-bottom: 1px solid #b5b5b5;
  margin-bottom: 15px;
}

#send-edit-request #popup-content{
  padding-bottom: 15px;
}

#send-edit-request .exit-button {
  text-align: right;
  flex-grow: 1;
  cursor: pointer;
}

#send-edit-request h2 {
  margin: auto 0;
  font-size: 21px;
}

.home-desktop-message #send-edit-request label {
  font-weight: bold;
}

.home-desktop-message #send-edit-request label small span {
  color: red;
}

.home-desktop-message #send-edit-request input, .home-desktop-message #send-edit-request select {
  width: 100%;
  padding: 8px;
  border-radius: 5px;
  border: 1px solid #ccc;
  margin: 10px 0;
  background-color: #fff;
  box-sizing: border-box;
}

.home-desktop-message #send-edit-request input[type="submit"] {
  font-weight: bold;
  width: initial;
  padding: 12px 50px;
  background-color: #c44027;
  color: #fff;
}

.home-desktop-message #send-app {
    border: 1px solid #ccc;
    background: #e4e3e3;
    padding: 20px;
    margin-bottom: 60px;
    border-radius: 5px;
}

.home-desktop-message h2 {
    font-size: 26px;
    text-align: center;
}

.home-desktop-message #send-app label {
    font-weight: bold;
}

.home-desktop-message #send-app label small span {
    color: red;
}

.home-desktop-message #send-app input, .home-desktop-message #send-app select {
    width: 100%;
    padding: 8px;
    border-radius: 5px;
    border: 1px solid #ccc;
    margin: 10px 0;
    background-color: #fff;
    box-sizing: border-box;
}

.home-desktop-message #send-app input[type="submit"] {
    font-weight: bold;
    width: initial;
    padding: 12px 50px;
    background-color: #c44027;
    color: #fff;
}

#reviews.content .grade-box {
    margin: 10px;
}
#reviews.content .grade-box img {
    max-width: 75%;
}


input[type="submit"] {
    cursor: pointer;
}
input[type="submit"].submit {
    background: #4285F4;
    color: #FFF;
    display: block;
    margin: 0 auto;
    font-size: 16px;
    width: 48%;
    text-align: center;
    padding: 10px;
    border: unset;
}

.flex {
  display: flex;
}

.flex.aligncenter {
    display: flex;
    flex-direction: column;
}
.flex.aligncenter > div.fc {
    margin-left: auto;
    margin-right: auto;
}

#mobile-business-location-and-hours .location-container {
  display: flex;
}

#street-view img {
  width: 100%;
  height: 60%;
}

#home h2 {
  font-size: 18px;
  font-weight: 700;
  line-height: 16px;
  margin-bottom: 1rem;
  width: fit-content;
}

#home .details-row {
  display: flex;
  margin-bottom: 1rem;
}

#home .details-row h2 {
    font-size: 16px;
    font-weight: 700;
    line-height: 16px;
    margin-right: .5rem;
    margin-bottom: 0;
}

#home .details-row span, #home .details-row p.description {
    color: rgb(94, 94, 94);
    font-size: 14px;
    font-weight: 400;
}

#location-details {
    font-weight: 400;
    font-size: 14px;
    color: rgb(94, 94, 94);
}