@font-face {
  font-family: 'St Ryde';
  src: url('../fonts/st_ryde/StRyde-Regular.otf') format('otf');   /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
 
html{
  min-height:100%;/* make sure it is at least as tall as the viewport */
  position:relative;
}
.row.no-gutters {
  margin-right: 0;
  margin-left: 0;
}
.row.no-gutters [class^="col-"],
.row.no-gutters [class*=" col-"]{
  padding-right: 0;
  padding-left: 0;
}
.full-height{
  height:100%;
    min-height:100%;
}
 
.container-fluid{
  padding-left: 295px;
  padding-right: 16px;
}

.image-with-quote {
	position: relative;
}

.image-with-quote > a {
	position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
  left: 0;
  top: 0;
  display: flex;
  background: rgba(12, 12, 12, 0.40);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: #fff;
}

.img-fluid {
	width: 100%;
	aspect-ratio: 1.5;
  object-fit: cover;
  object-position: top;
}

.mobile-view {
  padding-top: 70px;
  display: none;
}

.mobile-view .title {
	text-align: center;
	margin-top: 16px;
	margin-bottom: 16px;
	font-weight: 600;
}

.mobile-view .title .main-title {
	font-size: 30px;
}

.mobile-view .title .sub-title {
	color: #62AAB1;
	font-size: 24px;
}

@media (max-width: 1180px) {
  .container-fluid{
    display: none;
  }
  .image-with-quote span.line1.small {
		color: #fff
	}
	
	a span.line2 {
		color: #fff;
	}

  .mobile-view {
    display: block;
    padding-top: 0;
    padding-left: 295px;
  }
}
@media (max-width: 820px) {
    .mobile-view {
        padding-top: 70px;
        padding-left: 0;
      }
}
 
img.bottom-left, img.top-right{
  position: absolute;
  top: 0px;
  left: 0px;
}
 
/* position the overlay for a given section */
.overlay{
  z-index: 1000;
  position: absolute;
  top: 0px;
  left: 0px;
  background: #fff;
  display: none;
  width: 101%;
  height: 100%;
  text-align: center;
}
 
.overlay a:hover {
  opacity: 0.5;
} 
.line1{
  font-family: arial;
  font-size: 16px;
  color: #4A4A4A;
}
 
/* set up browser support for the show link animation */
@-webkit-keyframes showLink {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@-moz-keyframes showLink {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@-o-keyframes showLink {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes showLink {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
 
/* fire the animation of fading in the overlay */
.img-wrapper:hover .overlay{
  display: table !important;
  -webkit-animation: showLink 0.3s;
  -moz-animation:    showLink 0.3s;
  -o-animation:      showLink 0.3s;
  animation:         showLink 0.3s;
}
 
 
.nav{
  text-align: center;
  list-style: none;
  text-decoration: none;
  text-transform: uppercase;
}
 
li {
  text-decoration: none;
  display: block;
}
 
.nav-menu-Be {
display:none
}
 
.nav-menu-Live {
display:none
}
 
.nav-menu-Get {
display:none
}
 
.look-quote{
  padding-top: 25%;
  margin: 0 auto;
  width: 100%
}
 
.home div.bkg section article a:hover {
  opacity:.5;
}
 
a span.line1 {
  font-family: arial;
  padding-bottom:7px;
  color:#4A4A4A;
  text-transform:uppercase;
}
@media (max-width: 768px) {
    a span.line1 {
        font-size: 12px;
    }
}
span.line1.small {
  font-family: arial;
  color:#4A4A4A
}
 
span.line2 {
  border-top:1px solid rgba(210,210,210,.8);
  display:inline-block;
  font-family:'St Ryde';
  padding: 10px 5px 0;
  color: #7F7F7F;
  text-transform: lowercase;
  font-size: 15px;
}

.look-quote a {
  text-decoration: none;
}

span.line2.small {
  font:400 .8em 'st ryde';
  color:#4A4A4A
}
 
span.line2:first-letter {
  text-transform:uppercase
}
 
span.line3 {
  font:400 .8em 'st ryde';
  padding:10px 5px 0;
  color:#d3d3d3;
  padding-left:60%
}
 
span.line3.small {
  font:400 .7em 'st ryde';
  color:#d3d3d3;
  padding-left:10%
}
 
 
#leto_quote.celeste{
  width: 565px !important;
}