/* Styles */
#place > div { position: relative; margin-bottom: 24px; }

#gallery {grid-area: gallery;}
#title {grid-area: title;}
#contacts {grid-area: contacts;}
#actions {grid-area: actions;}
#messages {grid-area: messages; display: none;}
#posts {grid-area: posts; display: none;}
#loyalty {grid-area: loyalty; display: none;}
#about {grid-area: about;}
#reviews {grid-area: reviews; display: none;}
#report {grid-area: report;}
#hotaction {grid-area: hotaction; display: none;}
#claim { grid-area: claim; display: none; }

#messages.active { display: block; margin-top: -16px; }
#posts.active { display: block; }
#reviews.active { display: block; }
#loyalty.active { display: block; }

#place {
	margin: 0 auto;
	display: grid;
	grid-template: 
		". gallery	title report"
		". contacts	actions ."
		". contacts	messages ."
		". contacts	posts ."
		". contacts	loyalty ."
		". contacts	about ."
		". contacts	reviews ."
		". hotaction claim ."
		;
	grid-template-areas: 
		". gallery	title report"
		". contacts	actions ."
		". contacts	messages ."
		". contacts	posts ."
		". contacts	loyalty ."
		". contacts	about ."
		". contacts	reviews ."
		". hotaction claim ."
		;
	grid-column-gap: 24px;
	grid-template-columns: auto 320px 616px auto;
	/*grid-template-rows: 135px auto;*/
	color: #3a3f51;
    font-size: 15px;
}

/* REPORT */
#report { color:white; position: relative; }
#report > .fa { cursor: pointer; }

/* GALLERY */
#gallery-wrapper { width: 100%; direction: ltr !important; height: 217.6px; overflow: hidden; border-radius: 4px;background: #ccc; position: absolute; background: url(https://www.mysmarty.io/media/merchant/0/title.jpg); background-size: 100%; z-index: 1;}
#gallery-wrapper .gallery-handler { text-align: center;position: absolute;left: 0px;bottom: 0px;height: 24px;background: rgba(1,1,1,0.1);width: 100%; line-height: 24px; }
#gallery-wrapper .gallery-handler .dot { cursor:pointer;display: inline-block;transition: background-color 0.6s ease;width: 8px;height: 8px;background-color: #c2ccd2;border: solid 1px #3a3f51;border-radius: 8px; margin: 0px 4px;}
#gallery-wrapper .gallery-handler .dot.active, #gallery-wrapper .gallery-handler .dot:hover { background-color: #ffffff; border: 1px solid white; }

/* TITLE */
#title h1 { grid-area: place-title; align-self: center;}
#title .score { grid-area: place-score; align-self: center; }
#title .categories { grid-area: place-categories; }

#title {height: 135px; position: relative;}
#title h1 {font-size: 30px;color: white;font-weight: bold;margin: 0px;padding: 0px;overflow: hidden;}
#title .score { color: #c2ccd2; font-size: 13px; text-align: right; margin-top: 24px;}
#title .score a { color: #c2ccd2; text-decoration: none; cursor: pointer;}
#title .score span { border-radius: 4px; color:white; font-weight: bold; font-size: 18px; padding: 4px 8px; }
#title .categories { font-size: 13px; color: #c2ccd2; overflow: hidden; }
#title .categories img { position: relative; top: 2px; height: 18px; }
#title .categories .item { text-decoration: none; border-radius: 4px;display: inline-flex;line-height: 22px;height: 22px; padding: 0px 8px; cursor: pointer; background-color: #f8f8f8; color: #3a3f51; transition: all .2s ease-out;}
#title .categories .item:hover { background: #e1e2e3; }

#place.no-score .section-review { display:none; }
#place.no-score .score { display:none; }

.more-cats { font-size: 13px;color: #a3a7b7;text-decoration: none;cursor: pointer;position: relative;top: -3px; }

.grid-title {
	display: grid;
	grid-template-rows: 98px auto ;
	grid-template-areas:
		'place-title place-title place-score'
		'place-categories place-categories place-categories'
	;
}

/* POSTS */
#posts { height: 304px; overflow: hidden; position: relative; display: none; }
#posts .list-holder { height: 260px; overflow-x: scroll; overflow-y: hidden;padding-bottom: 18px; position: relative;-webkit-overflow-scrolling: touch; }
#posts .list-holder > div { margin: 0 -12px; }
#posts .list-holder img {width: 198px; height:137px;}
#posts .post { width: 198px;height: 242px;border-radius: 4px;background-color: #ffffff;border: solid 1px #e1e2e3;margin: 0 12px;padding: 16px 16px 0px 16px; overflow: hidden;}
#posts .post h4 { margin-top:0px; margin-bottom: 12px; height: 36px; overflow: hidden;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical; cursor: pointer;}
#posts .post h4:hover { text-decoration: underline; }
#posts .post img { cursor: pointer; }
#posts .button-holder { margin: 0 -16px;margin-top: 11px;border-top: 1px solid #e1e2e3; display: flex; height: 41px; }
#posts .button-holder button { outline: none; background: white; border: none; text-align: center; font-size: 13px; line-height: 32px; width: 45px; cursor: pointer; transition: all 0.1s ease-out; margin: 0px; }
#posts .button-holder button:first-child { width: 185px; border-right: 1px solid #e1e2e3; }
#posts .button-holder button.active { color: #23b7e5; }
#posts .handler { position: absolute; top: 146px; width: 30px;height: 50px;border-radius: 4px;background-color: #e1e2e3;line-height: 50px; text-align: center; margin:0px;opacity: 0.8; cursor: pointer; transition:  all 0.2s ease-out; z-index: 1; }
#posts .handler:hover { opacity: 1; box-shadow: 0 0 9.5px 0.5px rgba(0, 0, 0, 0.1);  }
#posts .handler.left { left:0px; }
#posts .handler.right { right: 0px; }
#posts h3 { padding: 0 24px;  }

/* HOTACTIONS */
#hotaction.fly {width: 100%;height: 70px;border-top: 1px solid #e2e3e4;border-bottom: 1px solid #e2e3e4;overflow: hidden;background: white;position: fixed;bottom: -1px;left: 0px;z-index: 1;box-shadow: 0 0 4.7px 0.4px rgba(5, 6, 6, 0.1);}
#hotaction a {width: calc( 33% - 3px );display: inline-block;text-align: center;line-height: 18px;color: #a3a7b7;text-decoration: none;}

/* CONTACTS */
#contacts .phones-format b { color: #3a3f51; }
#contacts .phones-format > div { margin-bottom: 8px; }
#contacts .phones-format > div:last-child { margin-bottom: 0px; }
#contacts .action > span { display: block; margin-bottom: 8px; }
#contacts .action > span:last-child { margin-bottom: 0px; }
#contacts .box-br { margin-top: 85px; }

/* Messsages */
#messages:after { content: ''; position: absolute; top: -4px; left: 8px; width: 11px; height: 5px; background: url(/img/nm/arrow.png); }
#messages .head { font-size: 13px; color: #bbbeca; margin-bottom: 16px; }
#messages .head .state { color: #3a3f51; }
#messages .message { background: #f8f8f8; padding: 16px; font-size: 13px; color: #bbbeca; margin-top:16px; margin-bottom: 16px;  }
#messages .message .body-text { color: #3a3f51; }
#messages .message a { text-decoration: none; color: #23b7e5; }
#messages textarea { border-radius: 4px; border: solid 1px #e1e2e3; width: calc( 100% - 32px ); height: 68px; padding: 16px; outline: none; resize: none; }
#messages button { border-radius: 4px;background: #f5f7fa;color: #3a3f51;padding: 8px 24px;border: 1px solid #dde6eb;font-weight: bold; margin:0 auto; display: block; margin-top: 12px; margin-bottom: -8px; outline: none; cursor: pointer; font-size: 15px; transition: background .5s ease-out;}
#messages button:hover { background: #edf1f2; }

/* loyalty */
#loyalty .cashback-program {}
#loyalty .cashback-program img { height: 40px; margin-bottom: 12px; }
#loyalty .cashback-program .info { border-top: 1px dashed #e1e2e3;  }
#loyalty .cashback-program .info .amount { width: 100px;height: 43px;background-color: #f8f8f8;text-align: center;font-size: 24px;color: #27c24c;font-weight: bold;line-height: 24px;padding: 12px 0px;position: relative;}
#loyalty .cashback-program .info .amount small {font-size: 13px;color: #cccccc;font-weight: normal;display: block;}
#loyalty .cashback-program .info .amount:after {content: "";width: 0;height: 0;border-style: solid;border-width: 10px 20px 0 20px;border-color: #f8f8f8 transparent transparent transparent;position: absolute;top: 67px;left: calc( 50% - 20px );}
#loyalty .cashback-program .info h4 {margin: 12px 16px;font-size: 15px;font-weight: normal;color: #3a3f51;width: calc( 100% - 132px );}
#loyalty .cashback-program .info h4 small {display: block;font-size: 13px;color: #cccccc;margin-top: 9px;}
#loyalty .cashback-program .description {color: #a3a7b7;font-size: 13px;margin: 16px 0px;}

/* ABOUT */
#about .place-about { overflow: hidden; max-height: 108px; transition: max-height 0.8s; }
#about .place-about.full { max-height: 999px; transition: max-height 2s; }

/* OTHER */
#place-about-full-text { white-space: pre-line; }
#place-about-full-text-handler { color: #c2ccd2;font-size: 13px; display: none; cursor: pointer; }
.showmoreless { color: #c2ccd2; font-size: 13px; cursor: pointer; }

/* REVIEWS */
#reviews .score { padding: 2px 8px;height: 42px;border-radius: 4px;font-weight: bold; color:white; font-size:36px; }
#reviews .score small { color: rgba(255, 255, 255, 0.5); font-size: 12px; }
#reviews .rating { margin: 0px 48px; color: #a3a7b7; font-size: 13px }
#reviews .rating b { font-size: 15px; color:#a3a7b7 }
#reviews .rating span { color: #a3a7b7; }
#reviews .rating .fa { color: #696d7b; line-height: 20px; }
#reviews .satisfaction { font-size: 13px; min-width: 120px; }
#reviews .satisfaction b { font-size: 15px; color:#a3a7b7; }
#reviews .satisfaction div { width: 25%; color: #a3a7b7; }
#reviews .satisfaction .fa { line-height: 20px; }
#reviews .separator { background: #e1e2e3; width: calc( 100% + 48px ); height: 1px;margin-left: -24px; margin-top: 16px; margin-bottom: 32px; }
#reviews .review small {color: #c2ccd2;}

/* POSTS DETAILS */
#posts-list {background: rgba(0,0,0,0.85); position: fixed; top:0px; left: 0px; width: 100%; height: 100%; z-index: 2000;overflow-y: scroll;padding: 0 12px; display: none;-webkit-overflow-scrolling: touch;-webkit-backface-visibility: hidden;}
#posts-list .fa-times {     cursor: pointer;
    width: 33px;
    height: 33px;
    position: fixed;
    top: 8px;
    right: 8px;
    color: white;
    font-size: 18px;
    background: black;
    border-radius: 4px;
    line-height: 33px;
    text-align: center;
-webkit-backface-visibility: hidden;}
#posts-list .holder { width: 90%;max-width: 688px;margin: 0 auto;overflow: hidden;min-height: 100%; padding-top:32px; }
#posts-list .item {border-radius: 4px;background-color: #ffffff;border: solid 1px #e1e2e3;padding: 24px;margin: 16px 0px; position: relative;}
#posts-list .item .place-meta { display: flex; }
#posts-list .item .place-meta .title { margin: 0 16px; flex: 1;}
#posts-list .item .place-meta > i.fa { font-size: 16px; color: #c2ccd2; cursor: pointer; padding: 0px 12px; margin: 0px -12px; }
#posts-list .item .place-meta h4 { margin: 3px 0px; font-size: 18px; font-weight: bold; color: #3a3f51; }
#posts-list .item .place-meta small { font-size: 15px; color: #3a3f51; }
#posts-list .item .place-meta .menu { display: none; position: absolute;width: 212px;top: 49px;right: 24px;border-radius: 4px;box-shadow: 0 0 7px 5px rgba(0, 0, 0, 0.05);background-color: #ffffff;border: solid 1px #e1e2e3;padding: 14px 0px}
#posts-list .item .place-meta .menu .menu-item { padding:2px 16px; cursor: pointer; }
#posts-list .item .place-meta .menu .menu-item:hover { background: #fafafa; }
#posts-list .item .place-meta .menu .menu-item .fa { margin-top: 4px; vertical-align: top;font-size: 15px; }
#posts-list .item .place-meta .menu .menu-item .txt { display: inline-block; width: calc( 100% - 24px ); color: #5f5f5f; font-size: 15px;}
#posts-list .item .place-meta .menu .menu-item .txt small { font-size: 13px; color: #c2ccd2; }
#posts-list .item > .title { font-size: 24px;font-weight: bold;color: #3a3f51; margin: 24px 0px;}
#posts-list .item .dates { height: 20px; line-height: 20px; color: #3a3f51; font-size: 15px; margin: 16px 0px; }
#posts-list .item .dates .fa { color: #a3a7b7; }
#posts-list .item .content {font-size: 15px;line-height: 1.33;color: #3a3f51; margin-top: 16px; }
#posts-list .item .content a { color: #23b7e5; }
#posts-list .item .content a:hover { text-decoration: underline; }
#posts-list .item .options { display: flex;margin: 0 -24px;margin-bottom: -24px; margin-top: 24px; height: 40px; border-top: 1px solid #e1e2e3;}
#posts-list .item .options button {flex: 1; outline: none;background: white;border: none;text-align: center;font-size: 13px;line-height: 32px;cursor: pointer;transition: all 0.1s ease-out;}
#posts-list .item .options button:first-child { border-right: 1px solid #e1e2e3; }
#posts-list .item .options button.active { color: #23b7e5; }

#header-bar {width:100%; height: 160px; background: #3a3f51; margin-bottom: -144px; margin-top:-20px; margin-bottom: -136px; }
#place-about-full-text { white-space: pre-line; }
#place-about-full-text-handler { color: #c2ccd2;font-size: 13px; display: none; cursor: pointer; }

#wh-handler { display:none; }
#wh-container { height: 24px; line-height: 24px; overflow: hidden; transition: height 0.3s ease-out; }
#wh-container .fa-caret-down { transform: rotateZ(0deg); transition: all 0.2s; }
#wh-container label .fa { cursor: pointer; }
#wh-handler:checked ~ #wh-container { height: 180px; }
#wh-handler:checked ~ #wh-container .fa-caret-down { transform: rotateZ(-180deg); }

.place-contacts div.icon {width: 18px;color: #a3a7b7;font-size: 15px; text-align: center;}
.place-contacts div.data, .place-contacts div.data-long {font-weight: bold;color: #3a3f51;font-size: 15px; /*margin: 0 5px;*/}
.place-contacts div.data span, .place-contacts div.data-long span {color: #a3a7b7;font-weight: normal;}
.place-contacts div.action {font-size: 13px;color: #c2ccd2;text-align: right; font-weight: normal;}
.place-contacts div.action a {text-decoration: none; color:#c2ccd2;}
.place-contacts .separator {width: calc( 100% + 48px );height: 1px;background: #e2e3e4;margin: 4.5px -24px; display:none;}
.external-links {margin: 24px 0;}
.social .title {margin: 16px 0px;font-weight: bold;color: #a3a7b7;font-size: 15px;}
.social .social-list a {text-decoration: none;color: #3a3f51;font-size :15px;}
.claim {color: #a3a7b7;font-size: 13px; line-height: 32px;}
.claim-button {text-decoration: none;border-radius: 4px;background-color: #f05050;color: white;padding: 4px 8px; transition: background .5s ease-out; display:  inline-block; line-height: 15px;}
.claim-button-own {text-decoration: none;border-radius: 4px;background-color: #23b7e5;color: white;padding: 4px 8px; transition: background .5s ease-out; display:  inline-block; line-height: 15px;}
.claim-button:hover { background: #ec2121; }
.button-action {display: inline-block;width: 136px; height: 32px;border-radius: 4px;background-color: #ffffff;border: solid 1px #e1e2e3;color: #3a3f51;text-align: center;line-height: 32px;font-size: 15px;cursor: pointer;transition: background .3s ease-out;}
.button-action.like { margin:0 16px; }
.button-action.like.active .fa { color:#F05050; }
.button-action.like:not(.active):hover .fa {animation: heart 1.25s ease-in-out infinite;}
.button-action.chat.active .fa { color:#27c24c; }
.button-action:hover { background-color: #e1e2e3; border-color: #ccc; }
.place-options { line-height: 28px; }
.place-options .item {border-radius: 4px;background-color: #f5f7fa;font-size: 13px;text-align: center;color: #929292;padding: 0px 8px; display: inline-block; margin-bottom: 4px;}
.place-address {background: #f8f8f8;height: 130px;}
.place-address .text a {text-decoration: none;font-size: 13px;color: #c2ccd2;}
.place-address .text {padding: 24px; width: calc( 100% - 325px ); }
.place-address .map {  }
h3 {font-size: 15px;color: #a3a7b7;margin: 0px;padding: 0px;margin-bottom: 24px;}
div.gap {height: 48px;}
.box-br {border-radius: 4px;background-color: #ffffff;border: solid 1px #e1e2e3;padding: 24px;}
.claim-button, .phone-mask, .mobile-mask { cursor: pointer;}
.gallery-item { position: absolute; top:0px; }
.gallery-item > div { position: absolute; top:0px; left:0px; width: 100%; height: 100%; background: rgba(0,0,0,0); }

.gallery-holder { transform: translateX(-0px); }
/* Update gallery in place view view.js */
.gallery-holder.animation { transition: all .3s ease-in-out; }
.gallery-holder:after { height: 100%; clear: both; }
.gallery-item-loop { float:left; position: relative; }
.gallery-item-loop > div { position: absolute; top:0px; left:0px; width: 100%; height: 100%; background: rgba(0,0,0,0); }

.place-overlay { position: fixed; top:0px; left:0px; width: 100%; height: 100%; background: rgba(0,0,0,0.85); z-index: 2001; display: none; }
.place-overlay-transparent { position: fixed; top:0px; left:0px; width: 100%; height: 100%; background: rgba(0,0,0,0); z-index: 998; display: none; }

.menu-handler {position: relative;z-index: /*1001*/ 999;}
.menu-report {display:none;position: absolute;left: -140px;top: 24px;min-width: 166px;border-radius: 4px;background-color: #ffffff;box-shadow: 0 0 4.7px 0.4px rgba(5, 6, 6, 0.2);border: solid 1px #e1e2e3;padding: 16px 16px;z-index: /*1001*/ 999;}
.menu-report > div {height: 32px;line-height: 32px;margin: 2px 0px;color: #5f5f5f;cursor: pointer;}
.menu-report > div:hover {color: #23b7e5;}
.menu-report > div span {display: inline-block;width: 20px;text-align: center;}

.gray-button { height: 22px;border-radius: 4px;background-color: #a3a7b7;line-height: 22px;padding: 0px 8px;color: white;font-size: 13px;cursor: pointer;text-decoration: none;margin-bottom: 4px;display: inline-block; transition: background .5s ease-out;}
.gray-button:hover {background-color: #696d7b;}
.underlineh:hover { text-decoration: underline !important; }
#phone-picker {display: none;width: calc( 90% - 48px );border-radius: 4px;padding: 0px 24px;background: white;border: 1px solid #e1e2e3;position: fixed;top: 90px;left: 5%;z-index: 2002;}
#phone-picker .head { font-size: 15px; color: #3A3F51; font-weight: bold; line-height: 60px; }
#phone-picker .separator { margin:0px -24px; width: calc( 100% + 48px ); height: 1px; background: #e1e2e3 }
#phone-picker .item { font-size: 15px; color: #3a3f51; display: block; margin: 8px 0px;padding: 0 30px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;position: relative;}
#phone-picker .item input {position: absolute;opacity: 0;cursor: pointer;}
#phone-picker .item .checkmark {position: absolute;top: 0;left: 0;height: 20px;width: 20px;background-color: #fff;border-radius: 50%;border: 1px solid #cfdbe2;}
#phone-picker .item input:checked ~ .checkmark {border: 1px solid #23b7e5;}
#phone-picker .item .checkmark:after {content: "";position: absolute;top: 6px;left: 6px;width: 8px;height: 8px;border-radius: 50%;background: #23b7e5;display:none;}
#phone-picker .item input:checked ~ .checkmark:after {display:block;}
#phone-picker .item .text { font-size: 12px; color: #93a1a9;}
#phone-picker-cancel { border-radius: 4px;background-color: #f5f7fa;outline: none;border: 1px solid #dde6eb;font-size: 15px;color: #3a3f51;font-weight: bold;padding: 9px 24px;margin: 24px 8px;text-decoration: none; display: inline-block;}
#phone-picker-call { border-radius: 4px;background-color: #23b7e5;font-size: 15px;color: white;font-weight: bold;padding: 9px 24px;margin: 24px 8px;display: inline-block; }

.newline { clear: both; margin: 16px 0px; }
::-webkit-input-placeholder {color: #c2ccd2;}
::-moz-placeholder {color: #c2ccd2;}
:-ms-input-placeholder {color: #c2ccd2;}
:-moz-placeholder {color: #c2ccd2;}

.sg0, .sg10 { background: #ec2121; }
.sg20 { background: #f05050; }
.sg30 { background: #f47c7c; }
.sg40 { background: #f3ca06; }
.sg50 { background: #fad732; }
.sg60 { background: #fbe165; }
.sg70 { background: #5dd179; }
.sg80 { background: #27c24c; }
.sg90, .sg100 { background: #1e983b; }

.alert-popup {  width: 100%;  max-width: 700px;  border-radius: 4px;  background-color: #ffffff;  border: solid 1px #dddddd; position: fixed; top:calc( 50% - 200px ); left:calc( 50% - 350px ); z-index:2002; display:none; }
.alert-popup .popup-close { cursor: pointer; }
.alert-popup .popup-head {  width: 100%;  height: 63px;  background: #f9f9f9; }
.alert-popup .popup-head h1 {  margin: 0px;  font-size: 16px;  font-weight: bold; color: #3a3f51; line-height: 63px; padding: 0px 24px;}
.alert-popup .popup-head a { float:right; margin-top: -2px; font-weight: bold; color: #a3a7b7; font-size: 15px; }
.alert-popup .popup-body { padding:24px 40px; }
.alert-popup .popup-body .offset { margin:0 64px; }
.alert-popup .popup-body .info-text { font-size: 24px; font-weight: 300;color: #3a3f51; margin: 16px 0px; }
.alert-popup .popup-body button {  border-radius: 4px;  background-color: #5bb550;  font-size: 15px;  font-weight: bold;  text-align: center;  color: #ffffff; border: 0px;  padding: 0px 16px;  line-height: 40px; cursor: pointer;}
.alert-popup .popup-body button.close { background-color: #f5f7fa;color: #3a3f51; }
.alert-popup .popup-body button.login { margin:0 16px; }

/** Sub grid templates **/

.grid-title {
	display: grid;
	grid-template-rows: 98px auto ;
	grid-template-areas:
		'place-title place-title place-score'
		'place-categories place-categories place-categories'
		;
}

#wh-container {
	display: grid;
	grid-template-columns: auto 1fr;
	grid-template-rows: auto;
	grid-gap: 2px;
}

.place-contacts .icon { grid-area: contact-icon; grid-column: 1; grid-row: auto; }
.place-contacts .data { grid-area: contact-data; grid-column: 2; grid-row: auto; }
.place-contacts .data-long { grid-area: contact-data; grid-column-start: 2; grid-column-end:4; grid-row: auto; }
.place-contacts .action { grid-area: contact-action; grid-column: 3; grid-row: auto; }
.place-contacts .separator { grid-area: contact-separator; grid-column-start: 1; grid-column-end:4; grid-row: auto; align-self: center; }
.place-contacts {display: grid;grid-template-columns: 16px auto 80px;grid-gap: 8px;grid-row-gap: 16px;}
.void { display:none; }
.notbold { font-weight: normal; }
.on-phone { display:none; }
.no-phone { display: initial; }

@media screen and ( min-width: 1024px ) {
	.mobile { display:none; }
        
        /*Hover only for desktop*/
        #posts .button-holder button:hover { background: #f8f8f8; color: #23b7e5; }
        #posts-list .item .options button:hover { background: #f8f8f8; color: #23b7e5; }
}

/* Mobile grid */
@media screen and ( max-width: 1023px ) {
	.desktop { display:none; }
	#header-bar { margin-top: /*-36px*/ -42px; }
	.place-contacts .separator { display: block; }
	#place > div { margin-bottom: 0px; }
	#messages.active { margin-top: 24px; }
	#contacts .box-br { margin-top: 0px; }
	#claim { display: block; }
	#place {
		grid-template-columns: auto;
		grid-gap: 0px;
		grid-template-rows: 0px auto auto 24px auto auto 24px auto 24px auto 24px auto auto auto 24px auto;
		grid-template-areas:
			'report'
			'gallery'
			'title'
			'.'
			'actions'
			'messages'
			'.'
			'claim'
			'.'
			'posts'
			'.'
			'loyalty'
			'contacts'
			'about'
			'.'
			'reviews'
			'hotaction';
	}

	#gallery { border-radius: 0px; }
	.box-br { border-radius: 0px; border-left:0px; border-right: 0px; margin-bottom: -1px; }
	#title { background: #3a3f51; padding: 0px 25px; }
	#actions { padding: 0px 24px; margin-bottom: 0px; }
	#messages .message .meta span { display: block;float: none !important; }
	.void { width: 24px; display: inline-block; }
	#report { z-index: 999; justify-self: right; height: 64px; line-height: 64px; }
	.menu-report { top: 52px; }
	#gallery { position: relative; }
	#gallery:before {content:'';position: absolute;top: 0px; left: 0px;width: 100%;height: 60px;z-index: 1;background: -webkit-linear-gradient(to top, transparent, rgba(0, 0, 0, 0.2)) !important;background: -moz-linear-gradient(to top, transparent, rgba(0, 0, 0, 0.2)) !important;background: linear-gradient(to top, transparent, rgba(0, 0, 0, 0.2)) !important;}
	#gallery { padding-bottom: 68%; height: 0px; }
	#hotaction { display: block; }
	/*.button-action.like { margin:0; }*/
	#message:after { left: 32px; }
	#footer { margin-bottom: 71px; }
	.newline.mobile { display: none; }
	#contacts .phones-format b { color: #3a3f51; }
	#contacts .phones-format > div { margin-bottom: 16px; }
	#contacts .phones-format > div:last-child { margin-bottom: 0px; }

	#contacts .action > span { display: block; margin-bottom: 16px; }
	#contacts .action > span:last-child { margin-bottom: 0px; }
	#posts .handler { display: none; }
	#posts-list {width: calc( 100% - 24px );}
}

/* Phones */
@media screen and ( max-width: 767px ) {
	#posts-list .item .content {word-wrap: break-word}
	.newline.mobile { display: block; }
	#hotaction.fly { bottom:-1px; }
	#header-bar {margin-top: -70px;}
	.grid-title {
		position: relative;
		display: grid;
		/*grid-template-rows: 38px auto 28px;*/
		grid-template-rows: 56px auto 56px;
		grid-template-areas: 'place-score' 'place-title' 'place-categories';
		height: 100%;
	}
	
	.no-score .grid-title {
		display: grid;
		grid-template-rows: /*5px auto 28px*/ 16px auto 56px;
		grid-template-areas: '.', 'place-title' 'place-categories';
		height: 100%;		
	}

	#title .score { text-align: left; margin-top:14px; }
	#title .score br { display:none; }
	#title .score a { margin:0 8px; }
	#title .categories {position: absolute;bottom: 0px;overflow-x: auto;overflow-y: hidden;line-break: strict;width: 100%;height: 38px;left: -24px;right: -24px;padding-left: 24px;padding-right: 24px;white-space: nowrap;}
	#title .categories .item:hover { background: #f8f8f8;  color: #3a3f51; }
	#title h1 { align-self: start; }
	#actions { padding: 0px 24px;  }
	.button-action { width: calc( 50% - 16px ); overflow: hidden; }
	#loyalty .cashback-program .info h4 { margin: 12px 0px; width: 100%}
	#title { height: auto; }
	.void { width: 16px; display: inline-block; }
	#report { z-index: 999; justify-self: right; height: 48px; line-height: 48px; }
	#hotaction div { width: calc( 50% - 2px ); }
	#review .rating { margin:0px; }
	#review .satisfaction { margin: 0px 32px; }
	.button-action.like { float: right; }
	.on-phone { display:initial; }
	.no-phone { display: none; }
	.alert-popup { width: calc( 100% - 32px );left: 16px;top: 16px; }
	.alert-popup .popup-body img { float: none !important; display: block; margin: 0 auto; }
	.alert-popup .popup-body .offset { margin:0px; text-align: center; }
	.alert-popup .popup-body button { margin: 8px 0px !important; }
	.button-action.like { margin:0; }
	#loyalty .cashback-program .info .amount { width: 100%; }
	#gallery-wrapper { border-radius: 0px; }
}

/* ANIMATIONS */
@keyframes heart {
 0% {
  transform:scale(1)
 }
 15% {
  transform:scale(1.2)
 }
 30% {
  transform:scale(1)
 }
 45% {
  transform:scale(1.2)
 }
 60% {
  transform:scale(1)
 }
 100% {
  transform:scale(1)
 }
}