@charset "UTF-8";


/* Global Styles */


html{
  background: #444 url('../img/bg.jpg');
  min-height:100%;
  height:auto;
}


article {
  font-size:11px; 
  font-family: 'IBM Plex Mono', serif;
  font-style: italic;
  font-weight: 300;
  padding:0;
  color:#fff;
  text-align: left;
  margin:130px auto 300px;
  max-width:500px;
}

b {
  font-weight: 700;
  font-style: italic;
}


p {
  padding:0;
  font-size: 20px;
  line-height: 30px;
}

/* Custom Things */

.previewanchor {
  background:rgba(240, 34, 101,.9);
  width:100%;
  height:238px;
  left:0;
  bottom:-50px;
  position: fixed;
  text-align: center;
  z-index: 100;
  border-top: solid 1px #f43873;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;  
  opacity: 0;
  backdrop-filter: blur(5px);
}

.previewanchor.show {
  bottom:0;
  opacity: 1
}

.floatlogo {
  width:200px;
  height:200px;
  margin:20px auto;
}

.circletext {
  width:200px;
  height:200px;
  position: absolute;
  background: url('../img/circletext.png') no-repeat center center;
  background-size: 100%;
}

.toledo {
  width:200px;
  height:200px;
  position: absolute;
  background: url('../img/toledo_x2.png') no-repeat center center;
  background-size: 77%;
}

.preview {
  width: 152px;
  height: 152px;
  position: absolute;
  border-radius: 100%;
  margin:24px;
}


.preview.career {
  background: url('../img/career.gif') no-repeat center center;  
  background-size: 106%;
}

.preview.invisible {
  background: url('../img/invisible.gif') no-repeat center center;  
  background-size: 106%;
}

.preview.living {
  background: url('../img/living.gif') no-repeat center center;  
  background-size: 106%;
}

.preview.people {
  background: url('../img/people.gif') no-repeat center center;  
  background-size: 106%;
}

.preview.process {
  background: url('../img/process.gif') no-repeat center center;  
  background-size: 106%;
}

.preview.kiddos {
  background: url('../img/kiddos.gif') no-repeat center center;  
  background-size: 106%;
}

.preview.designy {
  background: url('../img/designy.gif') no-repeat center center;  
  background-size: 106%;
}

p.seekwindow {
    text-align: center;
}

p.seekwindow img {
  border-radius: 100%;
  width:30%;
  margin:20px auto;
}

.tooltip {
  width: 178px;
    background: url('../img/arrow.png') no-repeat top center;
    background-size: 7%;
    padding: 35px 0 20px;
    position: fixed;
    text-align: left;
    font-size: 12px;
    left: 150px;
    top: 410px;
    transition-timing-function: ease-out;
    transition: 0.2s;
    opacity: 0;
}

.tooltip.on {
  transition: 0.25s;
  top: 394px;
  transition-timing-function: ease-in;
  opacity: 1;  
}


.timeline {
  background: url('../img/timeline.png') no-repeat left -12px;
  background-size: 5%;
  width: 100%;
  margin-bottom: 55px;
  padding: 28px 0 0 50px;
}

.timeline p {
  font-size: 16px;
  line-height: 24px;
  margin: 20px 0 51px;
}

.timeline p b {
  font-size: 20px;
}

.madeatl {
    font-size: 10px;
}