/* Tangerine */
.color1 {
  background-color: #ff8100;
}
.color1.a70 {
  background-color: rgba(255, 129, 0, 0.7);
}
.color1.a40 {
  background-color: rgba(255, 129, 0, 0.4);
}
.color1.a15 {
  background-color: rgba(255, 129, 0, 0.15);
}
.hover-color1:hover {
  background-color: #ff8100;
}
.hover-color1.a70:hover {
  background-color: rgba(255, 129, 0, 0.7);
}
.hover-color1.a40:hover {
  background-color: rgba(255, 129, 0, 0.4);
}
.hover-color1.a15:hover {
  background-color: rgba(255, 129, 0, 0.15);
}
.txt_color1 {
  color: #ff8100;
}
/* Fushia */
.color2 {
  background-color: #ff008c;
}
.color2.a70 {
  background-color: rgba(255, 0, 140, 0.7);
}
.color2.a40 {
  background-color: rgba(255, 0, 140, 0.4);
}
.color2.a15 {
  background-color: rgba(255, 0, 140, 0.15);
}
.hover-color2:hover {
  background-color: #ff008c;
}
.hover-color2.a70:hover {
  background-color: rgba(255, 0, 140, 0.7);
}
.hover-color2.a40:hover {
  background-color: rgba(255, 0, 140, 0.4);
}
.hover-color2.a15:hover {
  background-color: rgba(255, 0, 140, 0.15);
}
.txt_color2 {
  color: #ff008c;
}
/* Peacock */
.color3 {
  background-color: #006a94;
}
.color3.a85 {
  background-color: rgba(0, 106, 148, 0.85);
}
.color3.a70 {
  background-color: rgba(0, 106, 148, 0.7);
}
.color3.a40 {
  background-color: rgba(0, 106, 148, 0.4);
}
.color3.a15 {
  background-color: rgba(0, 106, 148, 0.15);
}
.hover-color3:hover {
  background-color: #006a94;
}
.hover-color3.a70:hover {
  background-color: rgba(0, 106, 148, 0.7);
}
.hover-color3.a40:hover {
  background-color: rgba(0, 106, 148, 0.4);
}
.hover-color3.a15:hover {
  background-color: rgba(0, 106, 148, 0.15);
}
.txt_color3 {
  color: #006a94;
}
/* Anthracite */
.grey {
  background-color: #3c3c3c;
}
.grey.a70 {
  background-color: rgba(60, 60, 60, 0.7);
}
.grey.a40 {
  background-color: rgba(60, 60, 60, 0.4);
}
.grey.a15 {
  background-color: rgba(60, 60, 60, 0.15);
}
.hover-grey:hover {
  background-color: #3c3c3c;
}
.hover-grey.a70:hover {
  background-color: rgba(60, 60, 60, 0.7);
}
.hover-grey.a40:hover {
  background-color: rgba(60, 60, 60, 0.4);
}
.grey.hover-a15:hover {
  background-color: rgba(60, 60, 60, 0.15);
}
.txt_grey {
  color: #3c3c3c;
}
/* White */
.white {
  background-color: #ffffff;
}
.white.a70 {
  background-color: rgba(255, 255, 255, 0.7);
}
.white.a40 {
  background-color: rgba(255, 255, 255, 0.4);
}
.white.a15 {
  background-color: rgba(255, 255, 255, 0.15);
}
.hover-white:hover {
  background-color: #ffffff;
}
.hover-white.a70:hover {
  background-color: rgba(255, 255, 255, 0.7);
}
.hover-white.a40:hover {
  background-color: rgba(255, 255, 255, 0.4);
}
.hover-white.a15:hover {
  background-color: rgba(255, 255, 255, 0.15);
}
.txt_white {
  color: #ffffff;
}
/* Black */
.black {
  background-color: #000000;
}
.black.a70 {
  background-color: rgba(0, 0, 0, 0.7);
}
.black.a40 {
  background-color: rgba(0, 0, 0, 0.4);
}
.black.a15 {
  background-color: rgba(0, 0, 0, 0.15);
}
.hover-black:hover {
  background-color: #000000;
}
.hover-black.a70:hover {
  background-color: rgba(0, 0, 0, 0.7);
}
.hover-black.a40:hover {
  background-color: rgba(0, 0, 0, 0.4);
}
.hover-black.a15:hover {
  background-color: rgba(0, 0, 0, 0.15);
}
.txt_black {
  color: #000000;
}
/* facebook */
.fb {
  background-color: #3b5998;
}
.fb.a70 {
  background-color: rgba(59, 89, 152, 0.7);
}
.fb.a40 {
  background-color: rgba(59, 89, 152, 0.4);
}
.fb.a15 {
  background-color: rgba(59, 89, 152, 0.15);
}
.hover-fb:hover {
  background-color: #3b5998;
}
.hover-fb.a70:hover {
  background-color: rgba(59, 89, 152, 0.7);
}
.hover-fb.a40:hover {
  background-color: rgba(59, 89, 152, 0.4);
}
.hover-fb.a15:hover {
  background-color: rgba(59, 89, 152, 0.15);
}
.txt_fb {
  color: #3b5998;
}
/* twitter */
.twt {
  background-color: #4099ff;
}
.twt.a70 {
  background-color: rgba(64, 153, 255, 0.7);
}
.twt.a40 {
  background-color: rgba(64, 153, 255, 0.4);
}
.twt.a15 {
  background-color: rgba(64, 153, 255, 0.15);
}
.hover-twt:hover {
  background-color: #4099ff;
}
.hover-twt.a70:hover {
  background-color: rgba(64, 153, 255, 0.7);
}
.hover-twt.a40:hover {
  background-color: rgba(64, 153, 255, 0.4);
}
.hover-twt.a15:hover {
  background-color: rgba(64, 153, 255, 0.15);
}
.txt_twt {
  color: #4099ff;
}
/* instagram */
.instagram {
  background-color: #2e5e86;
}
.instagram.a70 {
  background-color: rgba(46, 94, 134, 0.7);
}
.instagram.a40 {
  background-color: rgba(46, 94, 134, 0.4);
}
.instagram.a15 {
  background-color: rgba(46, 94, 134, 0.15);
}
.hover-instagram:hover {
  background-color: #2e5e86;
}
.hover-instagram.a70:hover {
  background-color: rgba(46, 94, 134, 0.7);
}
.hover-instagram.a40:hover {
  background-color: rgba(46, 94, 134, 0.4);
}
.hover-instagram.a15:hover {
  background-color: rgba(46, 94, 134, 0.15);
}
.txt_instagram {
  color: #2e5e86;
}
@media screen and (max-width: 768px) {
  .m_color1 {
    background-color: #ff8100;
  }
  .m_color1.a70 {
    background-color: rgba(255, 129, 0, 0.7);
  }
  .m_color1.a40 {
    background-color: rgba(255, 129, 0, 0.4);
  }
  .m_color1.a15 {
    background-color: rgba(255, 129, 0, 0.15);
  }
  .m_color2 {
    background-color: #ff008c;
  }
  .m_color2.a70 {
    background-color: rgba(255, 0, 140, 0.7);
  }
  .m_color2.a40 {
    background-color: rgba(255, 0, 140, 0.4);
  }
  .m_color2.a15 {
    background-color: rgba(255, 0, 140, 0.15);
  }
  .m_color3 {
    background-color: #006a94;
  }
  .m_color3.a70 {
    background-color: rgba(0, 106, 148, 0.7);
  }
  .m_color3.a40 {
    background-color: rgba(0, 106, 148, 0.4);
  }
  .m_color3.a15 {
    background-color: rgba(0, 106, 148, 0.15);
  }
  .m_grey {
    background-color: #3c3c3c;
  }
  .m_grey.a70 {
    background-color: rgba(60, 60, 60, 0.7);
  }
  .m_grey.a40 {
    background-color: rgba(60, 60, 60, 0.4);
  }
  .m_grey.a15 {
    background-color: rgba(60, 60, 60, 0.15);
  }
}
/* STRUCTURE */
body {
  font-family: Lato, sans-serif;
  font-size: 16px;
  box-sizing: border-box;
  color: #fff;
}
body * {
  /* box-sizing: border-box; */
  /* transition: all .25s ease-out; */
  transition-duration: .25s;
  transition-property: margin, padding, left, top, right, bottom;
  transition-timing-function: ease-out;
  position: relative;
}
.txt_left {
  text-align: left ;
}
.txt_center {
  text-align: center;
}
.txt_right {
  text-align: right;
}
.txt_justify {
  text-align: justify;
}
label {
  cursor: pointer;
}
header {
  position: absolute;
  width: 100%;
  z-index: 4;
  height: 5rem;
}
aside {
  position: fixed;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
.ios,
.android {
  display: none;
}
html[class^="os_"] .ios,
html[class*=" os_"] .ios,
html[class^="os_"] .android,
html[class*=" os_"] .android {
  display: none;
}
html.os_iOS .ios,
html.os_AndroidOS .android,
html.os_otherOS .ios,
html.os_otherOS .android {
  display: inline-block;
}
/* html.iOS .android{display: none;}
html.AndroidOS .ios{display: none;}

html.os_iOS .ios{display: inline-block;}
html.AndroidOS .android{display: inline-block;}
 */
.table {
  display: table;
  width: 100%;
  height: 100%;
  table-layout: fixed;
}
a > .table {
  table-layout: auto;
}
.row {
  display: table-row;
  width: 100%;
}
.cell {
  display: table-cell;
  /* width: 100%; */
}
.cell.top {
  vertical-align: top;
}
.cell.middle {
  vertical-align: middle;
}
.cell.bottom {
  vertical-align: bottom;
}
.h100 {
  height: 100%;
}
.h50 {
  height: 50%;
}
.bbox {
  box-sizing: border-box;
}
.clear {
  display: block;
  clear: both;
}
#wrapper,
#press {
  background: #f8f8f8;
}
.center-column {
  max-width: 1280px;
  margin: auto;
  height: inherit;
  text-align: center;
}
.mobile-column {
  max-width: 768px;
}
.valign-middle {
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  max-width: inherit;
}
.txt_left {
  text-align: left ;
}
.txt_center {
  text-align: center;
}
.txt_right {
  text-align: right;
}
.txt_justify {
  text-align: justify;
}
/* /STRUCTURE/ */
/* FONTS */
section h3 {
  font-size: 1.2rem;
  text-transform: uppercase;
  margin: -1rem 1rem 0;
  padding: 1rem;
  display: inline-block;
}
section h4 {
  font-weight: normal;
  font-size: 1.1rem;
  line-height: 1.5rem;
}
/* /FONTS/ */
.logo-square {
  width: 30%;
  height: auto;
  /* max-width: 320px; */
  /* max-height: 320px; */
  min-width: 160px;
}
.logo-line {
  /* margin: auto; */
  max-width: 200px;
}
/* /LOGO/ */
/* ICONS */
.square-icon {
  display: inline-block;
  padding: 1rem;
  /* width: 8rem; */
  /* padding: 4rem 0; */
  /* border-radius: .5rem; */
  margin-bottom: 1rem;
  border-radius: 1rem;
  width: 5rem;
  height: 5rem;
  border: 2px solid #ff8100;
}
.square-icon i {
  display: block;
  font-size: 3rem;
  margin-bottom: .5rem;
  overflow-x: hidden;
  text-overflow: ellipsis;
}
/* /ICONS/ */
/* NAV */
.hide-input {
  display: none;
}
label.btn.menu {
  display: none;
  width: 2rem;
  height: 2rem;
  /* padding: 1px; */
  transition: all 0.25s ease-out;
  position: absolute;
  right: 1.5rem;
  top: 1.5rem;
  z-index: 2;
  border-radius: 0;
  /* background: rgba(0,0,0,.25); */
  cursor: pointer;
  transform: rotate(0deg);
  box-shadow: 0 0 0 1rem transparent;
  border: 1px solid rgba(0, 0, 0, 0);
  border-top: none;
}
label.btn.menu:before,
label.btn.menu:after,
label.btn.menu span {
  height: 2px;
  margin: 0 5px;
  display: block;
  background: #fff;
  transition: inherit;
}
label.btn.menu span {
  position: absolute;
  top: 50%;
  right: 0px;
  left: 0px;
}
label.btn.menu span:first-child {
  margin-top: -0.45rem;
}
label.btn.menu span:last-child {
  margin-top: .45rem;
}
#toggle-menu:checked + .labeled label.btn.menu span {
  background: none;
}
#toggle-menu:checked + .labeled label.btn.menu span:nth-child(odd) {
  margin-top: 0;
}
label.btn.menu:before,
label.btn.menu:after {
  content: ' ';
  margin: 0;
  position: absolute;
  right: 5px;
  left: 5px;
}
label.btn.menu:before,
label.btn.menu:after {
  top: 50%;
}
#toggle-menu:checked + .labeled label.btn.menu:before {
  transform: rotate(45deg);
}
#toggle-menu:checked + .labeled label.btn.menu:after {
  transform: rotate(-45deg);
}
header nav {
  text-transform: uppercase;
}
header nav ul {
  /* transform: translateX(100%); */
  top: 1rem;
  /* right: 0; */
  transition: all 0.25s ease-out;
  z-index: 1;
  /* max-width: 40%; */
  text-align: center;
  padding: 0 1rem;
}
header nav ul li {
  display: inline-block;
  padding: 0.5rem 0;
}
header nav ul li a {
  /*color: @col-anthracite;*/
  color: inherit;
  padding: 0.5rem 1rem;
  display: inline-block;
  position: relative;
}
header nav ul li a:after {
  content: ' ';
  height: 1px;
  display: block;
  width: 0;
  background: none;
  transition: all 0.25s ease-out;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
}
/* /NAV/ */
/* SIDE NAV */
aside ul li {
  font-size: 1em;
  line-height: 1.5em;
  height: 1.5em;
  text-align: right;
}
aside ul li a:after {
  content: '•';
  display: inline-block;
  padding: 5px;
  font-size: 1rem;
}
aside ul li a {
  transition: all 0.25s ease-out;
  font-size: 0em;
  line-height: 1.5rem;
  height: 1.5rem;
  vertical-align: middle;
}
aside ul li:hover a {
  font-size: 1em;
}
/* /SIDE NAV/ */
.download {
  text-align: center;
  padding-bottom: 3rem;
}
.download .download {
  padding-bottom: 0;
}
#intro {
  min-height: 650px;
  background: linear-gradient(rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0)), url('../img/backgrounds/yams_palais-tokyo_fhdw.jpg');
  background-position: center;
  background-size: cover;
}
#intro > div {
  padding: 11rem 0 3rem;
}
#intro .logo {
  display: inline-block;
  width: 60%;
}
#intro ul {
  height: 3rem;
}
#intro ul li {
  display: none;
}
#intro ul li.show {
  display: block;
}
#intro .download {
  padding-top: 4rem;
}
#social .download {
  margin: 3rem 0 0;
}
#social .description {
  margin-top: 3rem;
  margin-bottom: 3rem;
  padding: 1rem;
}
#social p {
  text-align: left;
  padding-bottom: 1rem;
  font-size: 1.2rem;
  line-height: 1.5rem;
}
#social p a {
  text-decoration: underline;
}
.badge {
  max-height: 90px;
  vertical-align: middle;
}
.badge img {
  display: block;
  max-height: inherit;
}
.badge.ios {
  margin: 0 15px;
}
.badge.ios img {
  height: 60px;
}
.badge.android img {
  height: 90px;
}
/* SECTIONS */
.fullview {
  /* width: 100vw; */
  /* height: 100vh; */
  /* height: 100%; */
}
section {
  background: #ffffff no-repeat center;
  background-size: cover;
  transition: all 0.25s ease-out;
  box-sizing: border-box;
  transition: none;
  clear: both;
}
section:target {
  /* background-color: #ccc; */
}
#app {
  /* padding: 0 0 3rem 0; */
}
#app h3 {
  padding-bottom: 1.5rem;
}
.press-logos ul {
  margin: 24px auto 48px auto;
  text-align: center;
  max-width: 1280px;
}
.press-logos li {
  display: inline-block;
  vertical-align: middle;
  padding: 8px 16px;
}
.press-logos li span,
.press-logos li a {
  filter: saturate(0.25);
  opacity: 0.7;
}
.press-logos li a:hover {
  filter: saturate(1);
  opacity: 1;
}
.press-logos li.darker span,
.press-logos li.darker a {
  opacity: 0.9;
}
#yamsers {
  background-image: url('../img/backgrounds/yams_cover-spring_fhdw.jpg');
  /* background-attachment: fixed; */
  background-position: center center;
  background-size: cover;
  background-position: top;
  padding-bottom: 3rem;
}
.holder-logo {
  height: 50%;
  text-align: center;
  position: relative;
  margin: 0px 20%;
}
.holder-logo img {
  max-width: 100%;
  display: inline-block;
}
.zone-text {
  max-width: 700px;
  margin: auto;
  text-align: center;
  padding: 1rem;
}
.zone-text h2 {
  font-size: 2rem;
  line-height: 2rem;
  font-weight: normal;
}
.zone-text > * {
  display: inline-block;
}
.zone-text li {
  display: none;
}
.phone-mockup {
  display: block;
  margin: 5% auto;
  max-width: 90%;
  position: relative;
  z-index: 1;
  display: none;
}
.screens-holder {
  display: inline-block;
  background: black;
  z-index: 2;
  /* white-space: nowrap; */
  font-size: 0;
  /* overflow:hidden; */
  outline: .5rem solid #252525;
  box-sizing: content-box;
  /* max-width: 250px; */
  height: 0;
  margin: 100px auto;
  padding-bottom: 120%;
  width: 75%;
}
.screens-holder .hide-overflow {
  overflow: hidden;
  padding-bottom: 171.5%;
}
.screens-holder:before,
.screens-holder:after {
  content: ' ';
  display: block;
  height: 2.5rem;
  width: 100%;
  background: #252525;
  position: absolute;
  border: 0.5rem solid #252525;
  margin: -0.5rem;
}
.screens-holder:before {
  bottom: 100%;
  border-radius: 25px 25px 0 0;
  height: 2rem;
  content: '• •';
  font-size: 2rem;
  line-height: 2rem;
  color: rgba(0, 0, 0, 0.4);
  margin-bottom: 0;
  word-spacing: 2rem;
  text-align: center;
  width: 100%;
}
.screens-holder:after {
  top: 100%;
  border-radius: 0 0 25px 25px;
  margin-top: 0;
  content: '●';
  font-size: 4rem;
  line-height: 1.6rem;
  color: #323232;
}
.screens-holder .all-corners {
  height: 100%;
  width: 400%;
  position: absolute;
  top: 0;
  left: 0;
  transition-property: margin;
}
input[type="radio"]#app_home:checked ~ .labeled .screens-holder .all-corners {
  top: 0;
  left: 0;
}
input[type="radio"]#app_here-now:checked ~ .labeled .screens-holder .all-corners {
  top: 0;
  left: -100%;
}
input[type="radio"]#app_browse:checked ~ .labeled .screens-holder .all-corners {
  top: 0;
  left: -200%;
}
input[type="radio"]#app_favs:checked ~ .labeled .screens-holder .all-corners {
  top: 0;
  left: -300%;
}
input[type="radio"]#app_home:checked ~ .labeled label.feature[for="app_home"] .cell div {
  border-right-color: #ff8100;
}
input[type="radio"]#app_browse:checked ~ .labeled label.feature[for="app_browse"] .cell div {
  border-right-color: #ff8100;
}
input[type="radio"]#app_here-now:checked ~ .labeled label.feature[for="app_here-now"] .cell div {
  border-left-color: #ff8100;
}
input[type="radio"]#app_favs:checked ~ .labeled label.feature[for="app_favs"] .cell div {
  border-left-color: #ff8100;
}
input[type="radio"]#app_home:checked ~ .labeled label.feature[for="app_home"] .square-icon,
input[type="radio"]#app_here-now:checked ~ .labeled label.feature[for="app_here-now"] .square-icon,
input[type="radio"]#app_browse:checked ~ .labeled label.feature[for="app_browse"] .square-icon,
input[type="radio"]#app_favs:checked ~ .labeled label.feature[for="app_favs"] .square-icon {
  /* box-shadow: inset 0 0 0 1px rgba(60,60,60,.05); */
  background: #ff8100;
  color: #fff;
}
input[type="radio"]#app_home:checked ~ .labeled label.feature[for="app_home"] .square-icon > *,
input[type="radio"]#app_here-now:checked ~ .labeled label.feature[for="app_here-now"] .square-icon > *,
input[type="radio"]#app_browse:checked ~ .labeled label.feature[for="app_browse"] .square-icon > *,
input[type="radio"]#app_favs:checked ~ .labeled label.feature[for="app_favs"] .square-icon > * {
  color: #fff;
}
.btns.labels {
  height: 8%;
  width: 100%;
  position: absolute;
  bottom: 6%;
  z-index: 2;
  /*border: 1px solid yellow;*/
}
.btns.labels label {
  height: 100%;
  width: 25%;
  display: block;
  float: left;
}
.screens-holder .corner {
  height: 100%;
  width: 25%;
  display: inline-block;
}
.screens-holder .corner .slide {
  height: 100%;
  display: inline-block;
}
.screens-holder img {
  width: 100%;
}
.app-menu {
  display: block;
  width: 66.4%;
  position: absolute;
  z-index: 2;
  right: 100%;
}
input[type="checkbox"]#app-menu:checked ~ .labeled .app-menu {
  right: 33%;
}
input[type="checkbox"]#app-menu:checked ~ .labeled .all-corners,
input[type="checkbox"]#app-menu:checked ~ .labeled .btns.labels {
  margin-left: 67%;
}
.app-menu .btn {
  display: block;
  position: absolute;
  /* background: rgba(0,0,0,.5); */
  top: 0;
  left: 100%;
  width: 19%;
  height: 7%;
}
.feature {
  padding: 1rem;
  display: block;
  border: solid transparent;
  background: #fff;
  margin: 1rem;
}
.feature.feature-here-now .square-icon,
.feature.feature-bookmarks .square-icon {
  font-size: 0.8rem;
}
.feature .cell > div {
  border: solid transparent;
  border-width: 0 .2rem;
  padding: 2rem 1rem;
}
.user-message {
  display: inline-block;
  border-radius: 1rem;
  margin: 1rem;
  padding: 1rem;
  color: #fff;
  float: left;
  clear: both;
  text-align: left;
  width: 50%;
  line-height: 1.5rem;
}
.user-message:nth-child(even) {
  float: right;
}
.user-message p {
  font-style: italic;
  margin-bottom: .5rem;
  display: inline-block;
}
.user-message p:before,
.user-message p:after {
  content: '"';
}
.user-message span a {
  color: inherit;
  font-weight: bold;
  text-decoration: underline;
}
.btn-social {
  display: inline-block;
  /* width: 5rem; */
  /* height: 5rem; */
  /* line-height: 5rem; */
  font-size: 1rem;
  text-align: center;
  /* border: 7px solid; */
  border-radius: 0.5rem;
  color: #fff;
  padding: 0.5rem;
  margin: .5rem;
}
.btn-social.contact {
  min-width: 0;
}
.btn-social i {
  font-size: 2rem;
  top: -1px;
  text-align: center;
  width: 2rem;
}
.mentions {
  margin-top: 2rem;
  font-size: 0.9rem;
  color: #3c3c3c;
}
/* /SECTIONS/ */
@media screen and (max-width: 1280px) {
  #intro {
    background: linear-gradient(rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0)), url('../img/backgrounds/yams_palais-tokyo_fhd.jpg');
    background-position: center;
    background-size: cover;
  }
  #intro .logo {
    width: 80%;
  }
}
@media screen and (max-width: 768px) {
  header nav {
    float: right;
    padding: 2.5rem;
    box-sizing: border-box;
    width: 50%;
    border-bottom: 1px solid transparent;
    /* width: 100%; */
    /* border-color: rgb(255,129,0); */
    position: fixed;
    right: 0;
  }
  .zone-text h1 {
    font-size: 1.4rem;
    line-height: 1.4rem;
  }
  label.btn.menu {
    display: block;
  }
  header nav ul {
    transform: translate(0, -100%);
    top: 0rem;
    padding: 1rem;
    /* width: 100%; */
    box-sizing: border-box;
    position: absolute;
    right: 0;
    text-align: right;
  }
  header #toggle-menu:checked + .labeled {
    /* width: 100%; */
    /* border-color: rgb(255,129,0); */
    /* background-color: rgba(0,106,148,.15); */
    /* border-radius: 0; */
  }
  header #toggle-menu:checked + .labeled ul {
    padding-top: 4rem;
    /* right: 4rem; */
    transform: translate(0%, 0%);
    /* padding: 0 1rem; */
  }
  header nav ul li {
    display: block;
  }
  header nav ul li a {
    padding: .5rem;
  }
  .m_fullview {
    /* height: 100vh; */
  }
  .holder-logo {
    margin: 0 auto;
    max-width: 40%;
    /* height: 30%; */
  }
  .min_h50 {
    height: auto;
    min-height: 50%;
  }
  .feature .cell > div {
    border: solid transparent;
  }
}
@media screen and (max-width: 768px) and (orientation: portrait) {
  .m_h100 {
    height: 100%;
  }
  .feature {
    display: none;
    padding: 0;
  }
  .cell.m_block {
    width: 45%;
  }
  .cell.m_block:nth-child(odd) {
    position: absolute;
    right: 0;
    height: 100%;
    pointer-events: none;
  }
  .cell.m_block:nth-child(even) {
    width: 60%;
    float: left;
  }
  input[type="radio"]#app_home:checked ~ .labeled label.feature[for="app_home"],
  input[type="radio"]#app_here-now:checked ~ .labeled label.feature[for="app_here-now"],
  input[type="radio"]#app_browse:checked ~ .labeled label.feature[for="app_browse"],
  input[type="radio"]#app_favs:checked ~ .labeled label.feature[for="app_favs"] {
    display: block;
    box-shadow: none;
  }
  input[type="radio"]#app_home:checked ~ .labeled label.feature[for="app_home"] .cell > div,
  input[type="radio"]#app_here-now:checked ~ .labeled label.feature[for="app_here-now"] .cell > div,
  input[type="radio"]#app_browse:checked ~ .labeled label.feature[for="app_browse"] .cell > div,
  input[type="radio"]#app_favs:checked ~ .labeled label.feature[for="app_favs"] .cell > div {
    border: solid transparent;
  }
}
@media screen and (max-width: 480px) {
  section h4 {
    font-size: 0.95rem;
  }
  .m_h100 {
    height: 100%;
  }
  .feature {
    display: none;
    padding: 0;
    margin-left: .5rem;
    /* font-size: .75rem; */
  }
  .cell.m_block {
    width: 45%;
  }
  .cell.m_block:nth-child(odd) {
    position: absolute;
    right: 0;
    height: 100%;
    pointer-events: none;
  }
  .cell.m_block:nth-child(even) {
    width: 60%;
    float: left;
  }
  input[type="radio"]#app_home:checked ~ .labeled label.feature[for="app_home"],
  input[type="radio"]#app_here-now:checked ~ .labeled label.feature[for="app_here-now"],
  input[type="radio"]#app_browse:checked ~ .labeled label.feature[for="app_browse"],
  input[type="radio"]#app_favs:checked ~ .labeled label.feature[for="app_favs"] {
    display: block;
    box-shadow: none;
  }
  input[type="radio"]#app_home:checked ~ .labeled label.feature[for="app_home"] .cell > div,
  input[type="radio"]#app_here-now:checked ~ .labeled label.feature[for="app_here-now"] .cell > div,
  input[type="radio"]#app_browse:checked ~ .labeled label.feature[for="app_browse"] .cell > div,
  input[type="radio"]#app_favs:checked ~ .labeled label.feature[for="app_favs"] .cell > div {
    border: solid transparent;
  }
  .holder-logo {
    height: 30%;
  }
  .cell.m_block {
    display: block;
  }
  .m_hgtauto {
    height: auto;
  }
  label.btn.menu {
    top: .5rem;
    right: 0.5rem;
    padding: 1px;
  }
  header nav {
    width: 100%;
  }
  header nav ul {
    width: 100%;
    text-align: center;
    padding: .5rem;
  }
  header #toggle-menu:checked + .labeled ul {
    padding-top: 0rem;
  }
  header nav ul li {
    padding: 0;
  }
  header nav ul li a {
    display: block;
    margin-top: .5rem;
  }
  header nav ul li:first-child a {
    margin-right: 2.7rem;
    text-indent: 2.7rem;
  }
  .user-message {
    font-size: .9rem;
  }
  .feature .cell > div {
    padding: 1rem 0;
  }
}