fbody, html {
  margin: 0;
  background: #fff;
}
body {
  font-family: 'Lato', sans-serif;
  font-size: 18px;
  padding: 0;
  text-align: center;
  position: relative;
  -webkit-font-smoothing: antialiased;
  color:#333;
  max-width: 1120px;
  margin: auto;
}
a {
  text-decoration: none;
  color: #fff;`
  opacity: 0.8;
  font-size: 16px;
  font-weight: 800;
  cursor: pointer;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
a:hover {
  opacity:1; 
}
h1 {
  width: 100%;
  float: left;
  margin-bottom: 5px;
  font-size: 50px;
  letter-spacing: -4px;
  font-weight: 300;
  margin-top: 0px;
}
p{
  font-size: 18px;
  max-width: 610px;
  margin: auto;
  margin-top: 20px;
  letter-spacing: 0px;
  font-weight: 500;
}

/* ****************************** */
/* NEW  2 */
/* ****************************** */

#frame{
  z-index: 11;
  position: fixed;
}
.frameBorder{
  position: fixed;
  z-index: 5;
  background-color: #fff;
}
.frameTop{
  width: 100%;
  height: 46px;
  top: 0;
  overflow: hidden;
  -webkit-transition: all 1.0s;
  transition: all 1.0s;
  max-width: 1120px;
  z-index: 12;
}
.frameLeft{
  height: 100%;
  width: 15px;
  left: 0;
}
.frameRight{
  height: 100%;
  width: 15px;
  right: 0;
}
.frameBottom{
  width: 100%;
  height: 15px;
  bottom: 0;
}
#content{
  min-height: 100%;
}
.sectionPosition{
  position: absolute;
  margin-top: -40px;
}

/* NAV 1 */
#nav1{
  position: relative;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  -webkit-transition: all 1.0s;
  transition: all 1.0s;
}
#navlist1{
  margin: 10px 0px 10px 25px;
  padding: 0px;
  text-align: left;
  text-align:center;
  -webkit-transition: margin 1.0s;
  transition: margin 1.0s;
}
#navlist1 li{
  display: inline;
  list-style-type: none;
  padding-right: 25px;
  color: #555;
}
.navJoshLogo{
  position: absolute;
  left: 0px;
}
.navJoshLogo a{
  opacity: 1;
  border: none;
}
.navJoshLogo a:hover{
  opacity: 0.8;
}
.navJosh1{
  position: fixed;
  margin-top: 1px;
  height: 25px;
  width: 72px;
  background: url(https://s3.amazonaws.com/josh.ai/new2/nav-josh-logo-filled.png) no-repeat;
  background: url(https://s3.amazonaws.com/josh.ai/new2/nav-josh-logo-whole.png) no-repeat;
  -webkit-transition: background 0.5s;
  transition: background 0.5s;
}
.nav1text a{
  color: #88aac4;
  font-size: 12px;
  opacity: 1;
  -webkit-transition: all 0s;
  transition: all 0s;
}
.nav1text a:hover{
  color: #008cff;
}
.nav1textActive a{
  color: #008cff;
  cursor: default;
}
.nav1home{
  position: absolute;
  right: 0px;
  top: 0px;
}
.nav1home a{
  color: #88aac4;
  font-size: 12px;
}
.nav1home:hover a {
  color: #008cff;
}

.getJoshButton{
  display: none;
  position: absolute;
  right: 0px;
  top: 50px;
  height: 25px;
  width: 80px;
  background: url(https://s3.amazonaws.com/josh.ai/new2/nav-get-josh-button-outline.png) no-repeat;
  padding-top: 4px;
  -webkit-transition: background 1.5s;
  transition: background 1.5s;
}
.getJoshButton:hover{
  background: url(https://s3.amazonaws.com/josh.ai/new2/nav-get-josh-button-filled.png) no-repeat;
}
.getJoshButtonText{
  color: #008cff;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
}
.getJoshButton:hover >.getJoshButtonText{
  color: #fff;
}
.nav1homeicon{
  width: 20px;
  height: 20px;
  margin-top: -19px;
  position: absolute;
  margin-left: 36px;
  background: url(https://s3.amazonaws.com/josh.ai/new2/icons/home.png) no-repeat;
  background-position: 0px 0px;
}
.navhomeHover:hover > .nav1homeicon, .nav1home:hover > .nav1homeicon{
  background-position: 0px -24px;
}

/* NAV 2 */
#nav2{
  position: relative;
  top: 14px;
  left: 0;
  display: block;
  margin: 0px 112px 0px 112px;
  -webkit-transition: all 1.0s;
  transition: all 1.0s;
}
#navlist2{
  margin: 10px;
  padding: 0px;
  text-align: left;
  text-align:center;
  -webkit-transition: margin 1.0s;
  transition: margin 1.0s;
}
#navlist2 li{
  display: inline;
  list-style-type: none;
  padding-right: 40px;
}
#navlist2 a{
  font-size: 18px;
}
.nav2icon1{
  background: url(https://s3.amazonaws.com/josh.ai/new2/icons/icon1.png) no-repeat;
}
.nav2icon2{
  background: url(https://s3.amazonaws.com/josh.ai/new2/icons/icon2.png) no-repeat;
}
.nav2icon3{
  background: url(https://s3.amazonaws.com/josh.ai/new2/icons/icon5.png) no-repeat;
}
.nav2icon4{
  background: url(https://s3.amazonaws.com/josh.ai/new2/icons/icon4.png) no-repeat;
}
.nav2icon5{
  background: url(https://s3.amazonaws.com/josh.ai/new2/icons/icon3.png) no-repeat;
}
.nav2icon6{
  background: url(https://s3.amazonaws.com/josh.ai/new2/icons/icon6.png) no-repeat;
}
.nav2icon7{
  background: url(https://s3.amazonaws.com/josh.ai/new2/icons/icon7.png) no-repeat;
}
.nav2icon8{
  background: url(https://s3.amazonaws.com/josh.ai/new2/icons/icon8.png) no-repeat;
}
.nav2icon9{
  background: url(https://s3.amazonaws.com/josh.ai/new2/icons/icon9.png) no-repeat;
}
.nav2icon10{
  background: url(https://s3.amazonaws.com/josh.ai/new2/icons/icon10.png) no-repeat;
}
.nav2icon11{
  background: url(https://s3.amazonaws.com/josh.ai/new2/icons/icon11.png) no-repeat;
}
.nav2icon12{
  background: url(https://s3.amazonaws.com/josh.ai/new2/icons/icon12.png) no-repeat;
}
.nav2icon{
  background-position: 0px 0px; 
}
.nav2icon:hover{
  background-position: 0px -22px; 
}
#navlist2 a.active>.nav2icon{
  background-position: 0px -22px; 
}

/* BLOCKS */
#block1,#block2,#block3,#block4,#block5,#block6,#block7,#block8{
  border-bottom: 15px solid #fff;
  background-color: #fff;
}

/* BLOCK 1 - HOME */
#block1{
  background: linear-gradient(
    rgba(255, 255, 255, 0.6), 
    rgba(255, 255 ,255 , 0.6)
  ),url(https://s3.amazonaws.com/josh.ai/new2/cover-slide-bg-photo.jpg) no-repeat; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-position: center;
}
.tileContainer{
  width: 100%;
  height: 359px;
  overflow: hidden;
  -webkit-transition: all 1.0s;
  transition: all 1.0s;
}
.tileImage{
  -webkit-transition: all 0.5s;
  transition: all 0.5s; 
}
.tileImage:hover{
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}
.tile{
  position: absolute;
  -webkit-transition: all 1.0s;
  transition: all 1.0s;
}
.tile1{
  top: 55px;
  left: 50%;
  margin-left: -100px;
  opacity: 0;
}
.tile2{
  top: -49px;
  left: 50%;
  margin-left: 5px;
  opacity: 0;
}
.tile3{
  top: -49px;
  left: 50%;
  margin-left: -205px;
  opacity: 0;
}
.tile4{
  top: -153px;
  left: 50%;
  margin-left: 109px;
  opacity: 0;
}
.tile5{
  top: -153px;
  left: 50%;
  margin-left: -100px;
  opacity: 0;
}
.tile6{
  top: -153px;
  left: 50%;
  margin-left: -311px;
  opacity: 0;
}
.text1Container{
  height: 350px;
  width: 100%;
}
.section1text{
  font-size: 34px;
  text-align: center;
  font-weight: 300;
  opacity: 0;
  margin-top: 50px;
  -webkit-transition: all 2.0s;
  transition: all 2.0s;
}
.section1textSmall{
  font-size: 14px;
  text-align: center;
  font-weight: 300;
  opacity: 0;
  margin-top: 10px;
  -webkit-transition: all 2.0s;
  transition: all 2.0s;
}
.section1GetJoshButton{
  position: absolute;
  height: 40px;
  width: 112px;
  margin-top: 30px;
  margin-left: -56px;
  background: url(https://s3.amazonaws.com/josh.ai/new2/cover-slide-get-josh-button-outline.png) no-repeat;
  padding-top: 9px;
  opacity: 0;
  -webkit-transition: all 1.5s;
  transition: all 1.5s;
}
.section1GetJoshButton:hover{
  background: url(https://s3.amazonaws.com/josh.ai/new2/footer-get-josh-button.png) no-repeat;
}
.section1GetJoshButtonText{
  color: #008cff;
  font-size: 17px;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
}
.section1GetJoshButton:hover >.section1GetJoshButtonText{
  color: #fff;
}


/* NADER SECTION */
#block1{
  border-bottom: none;
}
.sectionNader{
  background: url(https://s3.amazonaws.com/josh.ai/new2/nader-iphone.jpg) no-repeat;
  width: 100%;
  height: 600px;
  background-size: cover;
}

.divider0, .divider1{
  background-color: #f9f9f9;
  text-align: center;
  padding: 30px 0px 40px 0px;
  color: #303c45;
  //margin-bottom: 15px;
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
}
.divider0{
  padding: 20px;
  padding-top:26px;
}
.divider0Cedia{
  position: absolute;
  margin-left: -197px;
  width: 185px;
  margin-top: 5px;
}
.divider0Text{
  position: absolute;
  font-size: 10px;
  color: #cdcdc5;
  text-transform: uppercase;
  margin-left: 20px;
  margin-top: 15px;
  font-weight: 800;
}
.worksWithLogo2{
  position: absolute;
  margin-top: -27px;
  margin-left: 40px;
  height: 40px;
  width: 161px;
  background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/lutron.png) no-repeat;
  -webkit-transition: all 1s;
  transition: all 1s;
}

.divider1_old{
  width: 100%;
  background-color: #303c45;
  text-align: center;
  padding:30px 0px 40px 0px;
  color: #fff;
  border-bottom: 15px solid #fff;
}
.sectionNaderTitle{
  font-size: 32px;
  font-weight: 300;
}
.sectionNaderText{
  font-size: 12px;
  margin-top: 5px;
}

/* VIDEO SECTION */
.dividerVideos{
  height: 199px;
  text-align: center;
  color: #fff;
  border-bottom: 15px solid #fff;
  overflow: hidden;
}
.mainVideo{
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 0px;
  height: 0; 
  overflow: hidden;
}
.mainVideoiFrame{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.dividerVideo1,.dividerVideo2,.dividerVideo3{
  float: left;
  width: calc( 33% - 3px);
  margin-right: 10px;
  margin-bottom: 10px;
}

/* BLOCK 2 - IMPESSIVE */

#block2{
  border-bottom: none;
}
#impressiveLeftcont{
  height: 700px;
  width: 50%;
  overflow: hidden;
  -webkit-transition: all 0.6s;
  transition: all 0.6s;
}
#impressiveLeft1{
  height: 100%;
  background: url(https://s3.amazonaws.com/josh.ai/new2/impressive/sonos.jpg);
  background-size: cover;
  margin-top: 0px;
  -webkit-transition: all 0.6s;
  transition: all 0.6s;
}
#impressiveLeft2{
  height: 100%;
  background: url(https://s3.amazonaws.com/josh.ai/new2/impressive/nest.jpg);
  background-size: cover;
  margin-top: 0px;
  -webkit-transition: all 0.6s;
  transition: all 0.6s;
}
#impressiveLeft3{
  height: 100%;
  background: url(https://s3.amazonaws.com/josh.ai/new2/impressive/lifx.jpg);
  background-size: cover;
  margin-top: 0px;
  -webkit-transition: all 0.6s;
  transition: all 0.6s;
}
#impressiveRightcont{
  float: right;
  margin-top: -700px;
  height: 700px;
  width: 50%;
  overflow: hidden;
  -webkit-transition: all 0.6s;
  transition: all 0.6s;
}
#impressiveRight1{
  height: 100%;
  background: linear-gradient(
    rgba(0, 0, 0, 0.6), 
    rgba(0, 0, 0, 0.6)
  ),url(https://s3.amazonaws.com/josh.ai/new2/impressive/sonos-room.jpg);  
  background-size: cover;
  margin-top: 0px;
  -webkit-transition: all 0.6s;
  transition: all 0.6s;
}
#impressiveRight2{
  height: 100%;
  background: linear-gradient(
    rgba(0, 0, 0, 0.6), 
    rgba(0, 0, 0, 0.6)
  ),url(https://s3.amazonaws.com/josh.ai/new2/impressive/nest-room.jpg);  background-size: cover;
  margin-top: -700px;
  -webkit-transition: all 0.6s;
  transition: all 0.6s;
}
#impressiveRight3{
  height: 100%;
  background: linear-gradient(
    rgba(0, 0, 0, 0.6), 
    rgba(0, 0, 0, 0.6)
  ),url(https://s3.amazonaws.com/josh.ai/new2/impressive/lifx-room.jpg);  background-size: cover;
  margin-top: -700px;
  -webkit-transition: all 0.6s;
  transition: all 0.6s;
}
.impressiveIcon{
  height: 50px;
  width: 50px;
  background: url(https://s3.amazonaws.com/josh.ai/new2/impressive/sectional-impressive-music-icon.png) no-repeat;
  position: absolute;
  left: calc(75% - 25px);
  margin-top: 225px;
  -webkit-transition: all 1.0s;
  transition: all 1.0s;
}
#impressiveTriangle{
  position: absolute;
  margin-top: -350px;
  height: 350px;
  width: 100%;
  background: url(https://s3.amazonaws.com/josh.ai/new2/impressive/sectional-impressive-white-triangle-bg.png) no-repeat center center;
  background-size:calc(100% - 30px) 100%;
}
#impressiveText{
  position: absolute;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
  margin-top: -250px;
}
.impressiveTextLarge{
  font-size: 40px;
  font-weight: 100;
}
.impressiveTextSmall{
  font-size: 12px;
  font-weight: 500;
  width: 300px;
  margin: auto;
  line-height: 1.7em;
  color: #555;
}
.impressiveTextWorksWith{
  color: #ccc;
  font-size: 12px;
  margin-top: 50px;
}
#impressiveWorksWith{
  background-color:#f9f9f9;
  padding: 25px;
  color:#cccdc7;
}
.impressiveWorksImage{
  height: 62px;
  width: 480px;
  background:url(https://s3.amazonaws.com/josh.ai/new2/impressive-sectional-trust-gfx-block.png) no-repeat;
  margin: auto;
  -webkit-transition: background 0.9s;
  transition: background 0.9s;
}
.impressiveWorksImage:hover{
  background:url(https://s3.amazonaws.com/josh.ai/new2/impressive-sectional-trust-gfx-block-onhover.png) no-repeat;
  cursor: pointer;
}

/* BLOCK 3 - RELIABLE */ 

#block3{
  height: 700px;
  width: 100%;
  background-color: #eee;
  border-bottom: none;
}

#reliable1{
  float: left;
  height: 50%;
  width: 50%;
  background: linear-gradient(
    rgba(0, 0, 0, 0.6), 
    rgba(0, 0, 0, 0.6)
  ),url(https://s3.amazonaws.com/josh.ai/new2/reliable/room1.jpg) no-repeat;
  background-size: 100% 100%;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
#reliable1:hover{
  background: linear-gradient(
    rgba(127,178,240, 0.6), 
    rgba(127,178,240, 0.6)
  ),url(https://s3.amazonaws.com/josh.ai/new2/reliable/room1.jpg) no-repeat;
  background-size: 105% 105%;
}
#reliable2{
  float: right;
  height: 50%;
  width: 50%;
  background: linear-gradient(
    rgba(0, 0, 0, 0.6), 
    rgba(0, 0, 0, 0.6)
  ),url(https://s3.amazonaws.com/josh.ai/new2/reliable/room2.jpg) no-repeat;
  background-size: 100% 100%;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
#reliable2:hover{
  background: linear-gradient(
    rgba(231,76,60, 0.6), 
    rgba(231,76,60, 0.6)
  ),url(https://s3.amazonaws.com/josh.ai/new2/reliable/room2.jpg) no-repeat;
  background-size: 105% 105%;
}

#reliable3{
  float: left;
  height: 50%;
  width: 50%;
  background: linear-gradient(
    rgba(0, 0, 0, 0.6), 
    rgba(0, 0, 0, 0.6)
  ),url(https://s3.amazonaws.com/josh.ai/new2/reliable/room3.jpg) no-repeat;
  background-size: 100% 100%;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
#reliable3:hover{
  background: linear-gradient(
    rgba(146,207,185, 0.6), 
    rgba(146,207,185, 0.6)
  ),url(https://s3.amazonaws.com/josh.ai/new2/reliable/room3.jpg) no-repeat;
  background-size: 105% 105%;
}

#reliable4{
  float: right;
  height: 50%;
  width: 50%;
  background: linear-gradient(
    rgba(0, 0, 0, 0.6), 
    rgba(0, 0, 0, 0.6)
  ),url(https://s3.amazonaws.com/josh.ai/new2/reliable/room4.jpg) no-repeat;
  background-size: 100% 100%;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
#reliable4:hover{
  background: linear-gradient(
    rgba(240,192,43, 0.6), 
    rgba(240,192,43, 0.6)
  ),url(https://s3.amazonaws.com/josh.ai/new2/reliable/room4.jpg) no-repeat;
  background-size: 105% 105%;
}

.reliable1icon{
  position: absolute;
  background: url(https://s3.amazonaws.com/josh.ai/new2/reliable/shades.png) no-repeat;
  background-position: 0px 0px; 
  height: 50px;
  width: 50px;
  left: 25%;
  margin-top: 150px;
  -webkit-transition: margin-top 0.5s;
  transition: margin-top 0.5s;
}
#reliable1:hover > .reliable1icon{
  background-position: 0px -52px; 
  margin-top: 200px;
}
.reliable2icon{
  position: absolute;
  background: url(https://s3.amazonaws.com/josh.ai/new2/reliable/locks.png) no-repeat;
  background-position: 0px 0px; 
  height: 50px;
  width: 50px;
  left: 75%;
  margin-top: 150px;
  -webkit-transition: margin-top 0.5s;
  transition: margin-top 0.5s;
}
#reliable2:hover > .reliable2icon{
  background-position: 0px -52px; 
  margin-top: 200px;
}
.reliable3icon{
  position: absolute;
  background: url(https://s3.amazonaws.com/josh.ai/new2/reliable/climate.png) no-repeat;
  background-position: 0px 0px; 
  height: 50px;
  width: 50px;
  left: 25%;
  margin-top: 150px;
  -webkit-transition: margin-top 0.5s;
  transition: margin-top 0.5s;
}
#reliable3:hover > .reliable3icon{
  background-position: 0px -52px; 
  margin-top: 100px;
}
.reliable4icon{
  position: absolute;
  background: url(https://s3.amazonaws.com/josh.ai/new2/reliable/lights.png) no-repeat;
  background-position: 0px 0px; 
  height: 50px;
  width: 50px;
  left: 75%;
  margin-top: 150px;
  -webkit-transition: margin-top 0.5s;
  transition: margin-top 0.5s;
}
#reliable4:hover > .reliable4icon{
  background-position: 0px -52px; 
  margin-top: 100px;
}

.section5quote{
  color: #188efa;
  background-color: #fff;
  padding: 10px;
  border-radius: 8px;
  width: 200px;
  font-style: italic;
  position: relative;
  opacity: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
.section5quote1, .section5quote2{
  margin-top: -20px;
}
#reliable1:hover > .section5quote1, #reliable2:hover > .section5quote2{
  margin-top: 115px;
  opacity: 1;
}
.section5quote3, .section5quote4{
  margin-top: 300px;
}
#reliable3:hover > .section5quote3, #reliable4:hover > .section5quote4{
  margin-top: 165px;
  opacity: 1;
}

#reliableDiamond{
  background-color: #fff;
  border-radius: 10px;
  height: 350px;
  width: 350px;
  position: absolute;
  left: 50%;
  margin-top: 175px;
  margin-left: -175px;
  -moz-transform: rotate(45deg);  /* FF3.5/3.6 */
  -o-transform: rotate(45deg);  /* Opera 10.5 */
  -webkit-transform: rotate(45deg);  /* Saf3.1+ */
  transform: rotate(45deg);  /* Newer browsers (incl IE9) */
}
#reliableText{
  position: absolute;
  width: 400px;
  left: 50%;
  margin-left: -200px;
  margin-top: 300px;
}
.reliableTextLarge{
  font-size: 40px;
  font-weight: 100;
}
.reliableTextSmall{
  font-size: 12px;
  font-weight: 500;
  width: 250px;
  margin: auto;
  line-height: 1.7em;
  color: #555;
  margin-top: 15px;
}
.reliableLine{
    margin-bottom: 15px;
}

/* BLOCK 4 - EFFORTLESS */
.section4rows{
  width: 100%;
  height: 350px;
  background-color: #f9f9f9;
}
.section4boxes{
  height: 350px;
  width: 33%;
  float: left;
}
.section4text{
  font-size: 11px;
  margin-top: 15px;
  color: #fff;
}
.section4boxes:hover > .section4text{
  opacity: 0;
}
.section4quote{
  color: #188efa;
  background-color: #fff;
  padding: 10px;
  border-radius: 8px;
  width: 200px;
  font-style: italic;
  position: relative;
  opacity: 0;
  margin-top: -72px;
  left: 0;
  right: 0;
  margin: 0 auto;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
.section4boxes:hover > .section4quote{
  margin-top: 135px;
  opacity: 1;
}

/* Top Left */
.section4topLeft{
   background: linear-gradient(
    rgba(0, 0, 0, 0.5), 
    rgba(0, 0, 0, 0.5)
  ),url(https://s3.amazonaws.com/josh.ai/new2/effortless/sectional1.jpg) no-repeat;
  background-size: cover;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  border-bottom: 2px solid #fff;
  border-right: 2px solid #fff;
}
.section4topLeft:hover{
  background: url(https://s3.amazonaws.com/josh.ai/new2/effortless/sectional1.jpg) no-repeat;
  background-size: cover;
}
.section4mic1{
  position: absolute;
  background: url(https://s3.amazonaws.com/josh.ai/new2/effortless/mic-button.png) no-repeat;
  background-position: 0px 0px; 
  height: 50px;
  width: 50px;
  left: calc(16.5% - 20px);
  margin-top: 105px;
  -webkit-transition: margin-top 0.5s;
  transition: margin-top 0.5s;
}
.section4topLeft:hover > .section4mic1{
  background-position: 0px -50px; 
  margin-top: 10px;
}

/* Top Middle */
.section4topMiddle{
  background-color: #fff; 
  border-bottom: 2px solid #fff;
  padding-top: 100px;
  height: 240px;
}

/* Top Right */
.section4topRight{
   background: linear-gradient(
    rgba(0, 0, 0, 0.5), 
    rgba(0, 0, 0, 0.5)
  ),url(https://s3.amazonaws.com/josh.ai/new2/effortless/sectional2.jpg) no-repeat;
  -webkit-transition: all 0.5s;
  transition: all 0.5s; 
  background-size: cover;
  border-bottom: 2px solid #fff;
  border-left: 2px solid #fff;
}
.section4topRight:hover{
  background: url(https://s3.amazonaws.com/josh.ai/new2/effortless/sectional2.jpg) no-repeat;
  background-size: cover;
}
.section4mic2{
  position: absolute;
  background: url(https://s3.amazonaws.com/josh.ai/new2/effortless/mic-button.png) no-repeat;
  background-position: 0px 0px; 
  height: 50px;
  width: 50px;
  left: calc(82.5% - 20px);
  margin-top: 105px;
  -webkit-transition: margin-top 0.5s;
  transition: margin-top 0.5s;
}
.section4mic1:hover,.section4mic2:hover,.section4mic3:hover,.section4mic4:hover,.section4mic5:hover{
  cursor: pointer;
}
.section4topRight:hover > .section4mic2{
  background-position: 0px -50px; 
  margin-top: 10px;
}

/* Bottom Left */
.section4bottomLeft{
   background: linear-gradient(
    rgba(0, 0, 0, 0.5), 
    rgba(0, 0, 0, 0.5)
  ),url(https://s3.amazonaws.com/josh.ai/new2/effortless/sectional5.jpg) no-repeat;
  -webkit-transition: all 0.5s;
  transition: all 0.5s; 
  background-size: cover;
  border-right: 2px solid #fff;
}
.section4bottomLeft:hover{
  background: url(https://s3.amazonaws.com/josh.ai/new2/effortless/sectional5.jpg) no-repeat;
  background-size: cover;
}
.section4mic3{
  position: absolute;
  background: url(https://s3.amazonaws.com/josh.ai/new2/effortless/mic-button.png) no-repeat;
  background-position: 0px 0px; 
  height: 50px;
  width: 50px;
  left: calc(16.5% - 20px);
  margin-top: 105px;
  -webkit-transition: margin-top 0.5s;
  transition: margin-top 0.5s;
}
.section4bottomLeft:hover > .section4mic3{
  background-position: 0px -50px; 
  margin-top: 10px;
}

/* Bottom Middle */
.section4bottomMiddle{
   background: linear-gradient(
    rgba(0, 0, 0, 0.5), 
    rgba(0, 0, 0, 0.5)
  ),url(https://s3.amazonaws.com/josh.ai/new2/effortless/sectional4.jpg) no-repeat;
  -webkit-transition: all 0.5s;
  transition: all 0.5s; 
  background-size: cover;
}
.section4bottomMiddle:hover{
  background: url(https://s3.amazonaws.com/josh.ai/new2/effortless/sectional4.jpg) no-repeat;
  background-size: cover;
}
.section4mic4{
  position: absolute;
  background: url(https://s3.amazonaws.com/josh.ai/new2/effortless/mic-button.png) no-repeat;
  background-position: 0px 0px; 
  height: 50px;
  width: 50px;
  left: calc(49.5% - 20px);
  margin-top: 105px;
  -webkit-transition: margin-top 0.5s;
  transition: margin-top 0.5s;
}
.section4bottomMiddle:hover > .section4mic4{
  background-position: 0px -50px;
  margin-top: 10px; 
}

/* Bottom Right */
.section4bottomRight{
   background: linear-gradient(
    rgba(0, 0, 0, 0.5), 
    rgba(0, 0, 0, 0.5)
  ),url(https://s3.amazonaws.com/josh.ai/new2/effortless/sectional3.jpg) no-repeat;
  -webkit-transition: all 0.5s;
  transition: all 0.5s; 
  background-size: cover;
  border-left: 2px solid #fff;
}
.section4bottomRight:hover{
  background: url(https://s3.amazonaws.com/josh.ai/new2/effortless/sectional3.jpg) no-repeat;
  background-size: cover;
}
.section4mic5{
  position: absolute;
  background: url(https://s3.amazonaws.com/josh.ai/new2/effortless/mic-button.png) no-repeat;
  background-position: 0px 0px; 
  height: 50px;
  width: 50px;
  left: calc(82.5% - 20px);
  margin-top: 105px;
  -webkit-transition: margin-top 0.5s;
  transition: margin-top 0.5s;
}
.section4bottomRight:hover > .section4mic5{
  background-position: 0px -50px; 
  margin-top: 10px;
}

/* DIVIDER 2 */
.divider2{
  height: 120px;
  width: 100%;
  background-color: #f9f9f9;
  padding-top: 30px;
}
.divider2text{
  font-size: 11px;
  margin-bottom: 20px;
  color: #555;
}
.divider2list{
  height: 86px;
}
.divider2icons{
  height: 50px;
  width: 50px;
  display: inline;
  list-style-type: none;
  padding-right: 80px;
  padding-bottom: 30px;
  -webkit-transition: padding 0.5s;
  transition: padding 0.5s;
}
  .divider2icons1{
    background: url(https://s3.amazonaws.com/josh.ai/new2/buffericons/josh-works-with-thermostat-stacked.png) no-repeat;
    background-position: 0px -50px; 
  }
  .divider2icons2{
  background: url(https://s3.amazonaws.com/josh.ai/new2/buffericons/josh-works-with-lights-stacked.png) no-repeat;
  background-position: 0px -50px; 
  }
  .divider2icons3{
    background: url(https://s3.amazonaws.com/josh.ai/new2/buffericons/josh-works-with-cameras-stacked.png) no-repeat;
    background-position: 0px -50px; 
  }
  .divider2icons4{
  background: url(https://s3.amazonaws.com/josh.ai/new2/buffericons/josh-works-with-music-stacked.png) no-repeat;
  background-position: 0px -50px; 
  }
  .divider2icons5{
    background: url(https://s3.amazonaws.com/josh.ai/new2/buffericons/josh-works-with-entertain-stacked.png) no-repeat;
    background-position: 0px -50px; 
  }
  .divider2icons6{
  background: url(https://s3.amazonaws.com/josh.ai/new2/buffericons/josh-works-with-security-stacked.png) no-repeat;
  background-position: 0px -50px; 
  }
  .divider2icons7{
    background: url(https://s3.amazonaws.com/josh.ai/new2/buffericons/josh-works-with-sensors-stacked.png) no-repeat;
    background-position: 0px -50px; 
  }
  .divider2icons8{
  background: url(https://s3.amazonaws.com/josh.ai/new2/buffericons/josh-works-with-outdoors-stacked.png) no-repeat;
  background-position: 0px -50px; 
  }
  .divider2icons9{
    background: url(https://s3.amazonaws.com/josh.ai/new2/buffericons/josh-works-with-switches-stacked.png) no-repeat;
    background-position: 0px -50px; 
  }
  .divider2icons10{
  background: url(https://s3.amazonaws.com/josh.ai/new2/buffericons/josh-works-with-shades-stacked.png) no-repeat;
  background-position: 0px -50px; 
  }
  .divider2icons11{
    background: url(https://s3.amazonaws.com/josh.ai/new2/buffericons/josh-works-with-garage-stacked.png) no-repeat;
    background-position: 0px -50px; 
  }

.divider2icons:hover{
  background-position: 0px 0px; 
}
.divider2listText{
  font-size: 11px;
  color:#555;
  position: absolute;
  margin-top: 62px;
  text-transform: uppercase;
  opacity: 0;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
.divider2icons:hover > .divider2listText{
  opacity: 1;
}

/* DIVIDER 3 */

.divider3{
  width: 100%;
  height: 70px;
  background-color: #fff;
  text-align: center;
  padding-top: 20px;
}

/* BLOCK 5 - LIBERATING */
#liberatingTop{
  height: 350px;
  width: 100%;
  background-color:#f9f9f9;
}
#liberatingBottom{
  height: 350px;
  width: 100%;
  background-color:#f9f9f9;
}
.liberatingTopRight{
  height: 100%;
  width: 50%;
  float: right;
  background: url(https://s3.amazonaws.com/josh.ai/new2/liberating/balloon1.jpg) no-repeat;
  background-size: cover;
  -webkit-transition: all 2.5s;
  transition: all 2.5s;
}
.liberatingBottomLeft{
  height: 100%;
  width: 75%;
  float: left;
  background: url(https://s3.amazonaws.com/josh.ai/new2/liberating/balloon2.jpg) no-repeat;
  background-size: cover;
  -webkit-transition: all 1.5s;
  transition: all 1.5s;

  animation-duration: 14.0s;
  animation-name: liberatezoom;
  animation-iteration-count: infinite;
}
@keyframes liberatezoom {
  0% {
    background-size: 100% 100%;
  }
  50% {
    background-size: 110% 110%;
  }
  100% {
    background-size: 100% 100%;
  }
}
.liberatingTextCont{
  position: absolute;
  width: 50%;
  float: left;
}
.liberatingLine{
  margin-top: 125px;
}
.liberatingText{
  font-size: 40px;
  font-weight: 100;
}
.liberatingTextSmall{
  font-size: 11px;
  font-weight: 500;
  width: 350px;
  margin: auto;
  line-height: 1.7em;
}
.liberatingTextArea2{
  position: absolute;
  width: 25%;
  right: 0px;
}
.liberatingLine2{
  margin-top: 110px;
  margin-bottom: 10px;
}
.liberatingText2{
  font-size: 15px;
  font-weight: 500;
}
.liberatingTextSmall2{
  font-size: 11px;
  font-weight: 500;
  width: calc(100% - 40px);
  margin: auto;
  line-height: 1.7em;
  padding-left: 20px;
  padding-right: 20px;
  padding-top:10px;
}
.liberatingHand{
  position: absolute;
  right: 25%;
  margin-top: 53px;
  height: 295px;
  width: 402px;
  background: url(https://s3.amazonaws.com/josh.ai/new2/liberating/liberating-iphone-1.png) no-repeat;
  background-size: cover;
  -webkit-transition: all 2.0s;
  transition: all 2.0s;
}

/* BLOCK 6 - COMFORTING */

#comfortingLeft{
  height: 700px;
  width: 50%;
  float: left;
  background-color: #c5d3cb;
  color: #6f857f;
}
.comfortingIcon{
  height: 50px;
  width: 50px;
  margin-left: 75px;
  margin-top: 75px;
  -webkit-transition: margin-top 0.5s;
  transition: margin-top 0.5s;
}
.comfortingIcon:hover{
  background-position: 0px -50px; 
  cursor: pointer;
}
.comfortingIcon1{
  background: url(https://s3.amazonaws.com/josh.ai/new2/comforting/comforting-icon1.png) no-repeat;
  background-position: 0px 0px; 
}
.comfortingIcon2{
  background: url(https://s3.amazonaws.com/josh.ai/new2/comforting/comforting-icon2.png) no-repeat;
  background-position: 0px 0px;  
}
.comfortingIcon3{
  background: url(https://s3.amazonaws.com/josh.ai/new2/comforting/comforting-icon3.png) no-repeat;
  background-position: 0px 0px;
}
.comfortingIcon4{
  background: url(https://s3.amazonaws.com/josh.ai/new2/comforting/comforting-icon5.png) no-repeat;
  background-position: 0px 0px;
}
.comfortingIcon5{
  background: url(https://s3.amazonaws.com/josh.ai/new2/comforting/comforting-icon4.png) no-repeat;
  background-position: 0px 0px;
}
.comfortingText{
  position: absolute;
  margin-left: 70px;
  margin-top: 15px;
  font-size: 14px;
  color: #6f857f;
  font-weight: 800;
  margin-top: 16px;
}
.comfortingText:hover, .comfortingIcon:hover > .comfortingText, .comfortingTextActive{
  color:#fff;
  cursor: pointer;
}
.comfortingIconActive{
  background-position: 0px -50px; 
}

#comfortingRight{
  height: 700px;
  width: 50%;
  float: right;
  background: url(https://s3.amazonaws.com/josh.ai/new2/comforting/comforting1.jpg) no-repeat;
  background-size: cover;
  -webkit-transition: all 1.5s;
  transition: all 1.5s;
}
#comfortingCircle{
  width: 350px;
  height: 350px;
  border-radius: 350px;
  background-color:#fff;
  position: absolute;
  left: 50%;
  margin-left: -175px;
  margin-top: 175px;
}
.comfortingLines{
  margin-top:60px;
}
.comfortingTextLarge{
  font-size: 40px;
  font-weight: 100;
  margin-bottom: 20px;
}

/* BLOCK 7 - MEET JOSH */

#block7{
  border-bottom: none;
}
#meetLeft{
  height: 715px;
  width: 50%;
  position: absolute;
  margin-top: 685px;
  background: url(https://s3.amazonaws.com/josh.ai/new2/meet/dog.jpg) no-repeat;
  background-size: cover;
  -webkit-clip-path: polygon(0 0, 100% 0, 86% 100%, 0% 100%);
  clip-path: polygon(0 0, 100% 0, 86% 100%, 0% 100%);
  z-index: 1;
  overflow: hidden;
}
#meetBlue{
  height: 700px;
  width: 100%;
  float: right;
  background-color: #f9f9f9;
  margin-top: 15px;
  border-bottom: 15px solid #fff;
}
#meetWhite{
  height: 350px;
  width: 100%;
  position: absolute;
  background-color: #303d45;
  margin-bottom: 15px;
  margin-top: 700px;
}
#meetRight{
  width: calc(50% + 15px);
  height: 700px;
  position: relative;
  float: right;
  margin-top: -730px;
  margin-right: 0px;
  border-top: 15px solid #fff;
  color: #fff;
}
.meetTextBig{
  position: absolute;
  height: 75px;
  width: 225px;
  font-size: 32px;
  font-weight: 300;
  padding-top: 16px;
  margin-left: calc(50% - 112.5px);
  margin-top: 100px;
}
.meetGlyph{
  position: absolute;
  margin-top: 169px;
  margin-left: -102px;
}
.meetTextSmall{
  font-size: 11px;
  font-weight: 500;
  width: 365px;
  line-height: 1.7em;
  margin-top: 200px;
  position: absolute;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
}
.meetJoshText{
  font-size: 32px;
  font-weight: 300;
  margin-top: 500px;
  color: #303d45;
  padding-right: 50px;
}

.typed-cursor{
  opacity: 1;
  color: #fff;
  font-size: 32px;
  font-weight: 300;
  -webkit-animation: blink 0.7s infinite;
  -moz-animation: blink 0.7s infinite;
  animation: blink 0.7s infinite;
}
@keyframes blink{
  0% { opacity:1; }
  50% { opacity:0; }
  100% { opacity:1; }
}
@-webkit-keyframes blink{
  0% { opacity:1; }
  50% { opacity:0; }
  100% { opacity:1; }
}
@-moz-keyframes blink{
  0% { opacity:1; }
  50% { opacity:0; }
  100% { opacity:1; }
}


/* BLOCK 8 - BOTTOM */
#block8{
  height: 600px;
  width: 100%;
  z-index: 100;
  margin-top: 1415px;
  margin-bottom: 180px;

  background: linear-gradient(
    rgba(0, 0, 0, 0.6), 
    rgba(0, 0, 0, 0.6)
  ),url(https://s3.amazonaws.com/josh.ai/new2/alex-house-back-outside.jpg) no-repeat;
  background-size: cover;
  background-position: bottom;
}
.bottomLogo{
  position: absolute;
  left: 50%;
  margin-left: -80px;
  margin-top: 150px;
}
.bottomText{
  font-size: 30px;
  color: #fff;
  font-weight: 300;
  position: absolute;
  left: 0;
  right: 0;
  margin: auto auto;
  margin-top: 350px;
}
.bottomButton{
  background: url(https://s3.amazonaws.com/josh.ai/new2/footer/sectional-footer-get-josh-button.png) no-repeat;
  height: 40px;
  width: 112px;
  font-size: 14px;
  color: #fff;
  padding-top: 12px;
  font-weight: 800;
  position: absolute;
  margin: auto;
  left: 0;
  right: 0;
  margin-top: 405px;
}
.bottomButton:hover{
  cursor: pointer;
  opacity: 0.9;
}

/* FOOTER */
.footer{
  background-color: #303c45;
  position: fixed;
  bottom: 0px;
  width: 100%;
  max-width: 1120px;
  height: 180px;
  z-index: 1;

}
#footerLinks{
  position: absolute;
  bottom: 20px;
  width: 100%;
  -webkit-transition: all 1.0s;
  transition: all 1.0s;
}
#footerList{
  margin: 10px 20px 10px 20px;
  padding: 0px;
  text-align:center;
}
#footerList li{
  display: inline;
  list-style-type: none;
  padding-right: 20px;
  color: #fff;
}
.footerText a{
  color: #fff;
  font-size: 12px;
  opacity: 1;
  -webkit-transition: all 0s;
  transition: all 0s;
}
.footerText a:hover{
  color: #ccc;
}
#emailform{
  background: url(https://s3.amazonaws.com/josh.ai/new2/sectional-footer-email-stack.png) no-repeat;
  height: 39px;
  width: 233px;
  padding-left: 23px;
  font-size: 14px;
  color: #88aac4;
  border: none;
  margin-top: 50px;
  padding-top: 0px;
  padding-right: 50px;
  background-position: 0px 0px;
}
#emailform:focus{
  outline-color: transparent;
  outline-style: none;
  color: #333;
  background-position: 0px -40px;
}
.submitForm{
  background: none;
  border: none;
  position: absolute;
  margin-left: -41px;
  margin-top: 59px;
  background: url(https://s3.amazonaws.com/josh.ai/new2/footer/sectional-footer-email-container-arrow.png) no-repeat;
  height: 20px;
  width:11px;
  cursor: pointer;
}
#emailform:focus > .submitForm, .submitForm:hover, .submitForm:active, .submitForm:focus{
  outline-color: transparent;
  outline-style: none;
  //background: url(https://s3.amazonaws.com/josh.ai/new2/footer/sectional-footer-email-container-arrow-white.png) no-repeat;
  margin-left: -40px;
}
::-webkit-input-placeholder {
   color: #88aac4;
}
:-moz-placeholder { /* Firefox 18- */
   color: #88aac4;
}
::-moz-placeholder {  /* Firefox 19+ */
   color: #88aac4;
}
:-ms-input-placeholder {  
   color: #88aac4;
}

/* ****************************** */
/* BASE */
/* ****************************** */

#newbase-content {
  position: relative;
  z-index: 10;
  min-height: 100px;
  background-color: #fff;
}
#newbase-bottom-margin {
    height: 1px;
    margin-top: 2014px;
    position: inherit;
    z-index: -1;
    margin-bottom: 180px;
}

.enterText {
  color: #fff;
  font-size: 11px;
}

/* ****************************** */
/* USER FORMS */
/* ****************************** */

#new-login-form {
  padding-top: 100px;
  height: 600px;
  width: 100%;
  background: url(https://s3.amazonaws.com/josh.ai/new2/login-page-body-background2.jpg) no-repeat;
  background-size: cover;
  margin-bottom: 180px;
  border-bottom: 15px solid #fff;
}
.loginCont{
  position: absolute;
  background-color: #fff;
  width: 300px;
  padding: 50px;
  top: 50%;
  margin-top: -230px;
  opacity: 0;
  left: 50%;
  margin-left: -200px;
  border-radius: 2px;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  
  -webkit-box-shadow: 0 0px 9px -4px rgba(0,0,0,0.44);
  -moz-box-shadow: 0 0px 9px -4px rgba(0,0,0,0.44);
  box-shadow: 0 0px 9px -4px rgba(0,0,0,0.44);
}
#loginTitle{
    margin: auto;
    opacity: 0;
    font-size: 35px;
    font-weight: 300;
    color: #555;
    letter-spacing: 0.02em;
    margin-bottom: 20px;
    -webkit-transition: opacity 2.0s;
    transition: opacity 2.0s;
}
#loginText{
    margin: auto;
    font-size: 13px;
    color: #666;
    line-height: 1.6;
}
.loginTextTop{
  opacity: 0;
  -webkit-transition: opacity 2.0s;
  transition: opacity 2.0s;
}
#loginForm{
  margin-top: 10px;
  opacity: 0;
  -webkit-transition: opacity 2.0s;
  transition: opacity 2.0s;
}
#loginForm input{
  background: url(https://s3.amazonaws.com/josh.ai/new2/sectional-footer-email-stack.png) no-repeat;
  width: 260px;
  height: 40px;
  background-position: 0px 0px;
  border: none;
  padding-left: 20px;
  padding-right: 20px;
  margin-top: 20px;
}
#loginForm input:active, #loginForm input:focus{
  outline-color: transparent;
  outline-style: none;
}
#loginForm input[type=submit] {
    background: url(https://s3.amazonaws.com/josh.ai/new2/contact/email-button-four-stack.png) no-repeat;
    background-position: 0px -40px;
    color: #fff;
    width: 121px;
    font-size: 18px;
    text-transform: uppercase;
    font-weight: 800;
    font-family: 'Lato', sans-serif;
    padding-top: 4px;
    margin-top: 40px;
}
#loginForm input[type=submit]:hover {
    background: url(https://s3.amazonaws.com/josh.ai/new2/contact/email-button-four-stack.png) no-repeat;
    background-position: 0px -80px;
    cursor: pointer;
}
#loginForm label, .text-right{
  display: none;
}

#forgotPasswordTitle{
    margin: auto;
    font-size: 35px;
    font-weight: 300;
    color: #555;
    letter-spacing: 0.02em;
    margin-bottom: 20px;
    -webkit-transition: opacity 2.0s;
    transition: opacity 2.0s;
}
#forgotPasswordText{
    margin: auto;
    font-size: 13px;
    color: #666;
    line-height: 1.6;
}
#forgotPasswordForm input {
    background: url(https://s3.amazonaws.com/josh.ai/new2/sectional-footer-email-stack.png) no-repeat;
    width: 260px;
    height: 40px;
    background-position: 0px 0px;
    border: none;
    padding-left: 20px;
    padding-right: 20px;
    margin-top: 20px;
    outline: none;
}
#forgotPasswordForm input[type=submit] {
    background: url(https://s3.amazonaws.com/josh.ai/new2/contact/email-button-four-stack.png) no-repeat;
    background-position: 0px -40px;
    color: #fff;
    width: 121px;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 800;
    font-family: 'Lato', sans-serif;
    padding-top: 4px;
    margin-top: 20px;
}
#forgotPasswordForm input[type=submit]:hover {
    background: url(https://s3.amazonaws.com/josh.ai/new2/contact/email-button-four-stack.png) no-repeat;
    background-position: 0px -80px;
    cursor: pointer;
}

#changePasswordForm input {
    background: url(https://s3.amazonaws.com/josh.ai/new2/sectional-footer-email-stack.png) no-repeat;
    width: 260px;
    height: 40px;
    background-position: 0px 0px;
    border: none;
    padding-left: 20px;
    padding-right: 20px;
    margin-top: 20px;
    outline: none;
}
#changePasswordForm input[type=submit] {
    background: url(https://s3.amazonaws.com/josh.ai/new2/contact/email-button-four-stack.png) no-repeat;
    background-position: 0px -40px;
    color: #fff;
    width: 121px;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 800;
    font-family: 'Lato', sans-serif;
    padding-top: 4px;
    margin-top: 20px;
}
#changePasswordForm input[type=submit]:hover {
    background: url(https://s3.amazonaws.com/josh.ai/new2/contact/email-button-four-stack.png) no-repeat;
    background-position: 0px -80px;
    cursor: pointer;
}


/* ****************************** */
/* ABOUT PAGE */
/* ****************************** */
#aboutTopSection{
  background: linear-gradient(
    rgba(255, 255, 255, 0.4), 
    rgba(2555, 255, 2555, 0.4)
  ),url(https://s3.amazonaws.com/josh.ai/team/about-header-background.jpg) no-repeat;
  background-size: cover;
  width: 100%;
  padding: 110px 0px 70px 0px;
  -webkit-transition: margin 1.0s;
  transition: margin 1.0s;
}
.aboutManifesto{
  width: 300px;
  height: 31px;
  background: url(https://s3.amazonaws.com/josh.ai/team/about-header-manifesto-button-stacked.png) no-repeat;
  background-position: 0px 0px;
  margin: auto;
  margin-top: 40px;
  padding-top: 9px;
  color: #fff;
  -webkit-transition: opacity 1.0s;
  transition: opacity 1.0s;
  opacity: 0;
}
.aboutManifesto:hover{
  background-position: 0px -40px;
  cursor: pointer;
}
#aboutBody{
  width: 100%;
  padding: 40px 0px 0px 0px;
  -webkit-transition: margin 1.0s;
  transition: margin 1.0s;
}
#aboutTitle{
  margin: auto;
  opacity: 0;
  font-size: 35px;
  font-weight: 300;
  color: #555;
  letter-spacing: 0.02em;
  margin-bottom: 20px;
  -webkit-transition: opacity 2.0s;
  transition: opacity 2.0s;
}
#aboutText{
  margin: auto;
  font-size: 12px;
  color: #888;
  line-height: 1.6;
}
.aboutTextTop{
  opacity: 0;
  -webkit-transition: opacity 2.0s;
  transition: opacity 2.0s;
}
.aboutLocations{
  height: 250px;
  width: 100%;
  text-transform: center;
}
.aboutLocationsLeft{
  width: 50%;
  float: left;
  padding-top: 65px;
}
.aboutLocationsRight{
  width: 50%;
  margin-left: 50%;
  padding-top: 65px;
}
.aboutLocationCity{
  font-size: 16px;
  color: #3ca4fc;
  margin-bottom: 20px;
  margin-top: 10px;
  font-weight: 800;
}
.aboutLocationAddress{
  font-size: 13px;
  color: #777;
}
.aboutLocationContact a{
  font-size: 11px;
  margin-top: 10px;
  color:#555;
}
.aboutLocationsDivider{
  position: absolute;
  margin-left: 50%;
  margin-top: 50px;
}
#teamBody{
  margin-top: 40px;
  width: 100%;
  padding: 0px;
  color: #fff;
  /*display: none;*/
}
.teamEmojis{
  margin-top: 5px;
  -webkit-transition: margin 1.0s;
  transition: margin 1.0s;
}
.teamEmojis a{
  opacity: 1;
}
#navTeam{
  padding: 0px;
  margin: 0px;
}
#navTeam li{
  display: inline;
  list-style-type: none;
  padding: 0px;
}
.teamSection{
  height: 300px;
  width: 100%;
  background-color:#f9f9f9;
  max-width: 1200px;
  margin: auto;
  margin-bottom: 15px;
}
.aboutLeftPhoto{
  height: 300px;
  width: 300px;
  float: left;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
.aboutRightPhoto{
  height: 300px;
  width: 300px;
  float: right;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
.aboutPhotoState{
  margin-top: 100px;
  margin-bottom: 20px;
  display:none;
}
.aboutPhotoText{
  font-size: 10px;
  margin-bottom: 5px;
  padding-left: 20px;
  padding-right: 20px;
  display:none;
}
.aboutPhotoText a{
  font-size: 10px;
  font-weight: 800;
}
.aboutLeftPhoto:hover > .aboutPhotoState, .aboutLeftPhoto:hover > .aboutPhotoText,
.aboutRightPhoto:hover > .aboutPhotoState, .aboutRightPhoto:hover > .aboutPhotoText{
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.aboutLeftText{
  padding: 50px;
  margin-right: 300px;
  margin-left: 15px;
}
.aboutRightText{
  padding: 50px;
  margin-left: 300px;
  margin-right: 15px;
  max-width: 900px;
}
.aboutTeamName{
  font-size: 39px;
  font-weight: 100;
  color: #333;
  margin-bottom: 25px;
  margin-top: 20px;
}
.aboutTeamText{
  font-size: 13px;
  color: #777;
  text-align: justify;
  line-height: 1.4;
}
.aboutTeamText a{
  color: #333;
  font-size: 13px;
}
    .teamPhotoAlex{
      background: url(https://s3.amazonaws.com/josh.ai/team/alex.jpg) no-repeat;
      background-size: cover;
    }
        .teamPhotoAlex:hover{
          background: url(https://s3.amazonaws.com/josh.ai/team/about-page-alex-hover.jpg) no-repeat;
          background-size: cover;
        }

    .teamPhotoTim{
      background: url(https://s3.amazonaws.com/josh.ai/team/tim.jpg) top left no-repeat;
      background-size: cover;
    }
        .teamPhotoTim:hover{
          background: url(https://s3.amazonaws.com/josh.ai/team/about-page-tim-hover.jpg) no-repeat;
          background-size: cover;
        }

    .teamPhotoJason{
      background: url(https://s3.amazonaws.com/josh.ai/team/jason.jpg) top left no-repeat;
      background-size: cover;
    }
        .teamPhotoJason:hover{
          background: url(https://s3.amazonaws.com/josh.ai/team/about-page-jason-hover.jpg.jpg) no-repeat;
          background-size: cover;
        }

    .teamPhotoPanthe{
      background: url(https://s3.amazonaws.com/josh.ai/team/panthe.jpg) top left no-repeat;
      background-size: cover;
    }
        .teamPhotoPanthe:hover{
          background: url(https://s3.amazonaws.com/josh.ai/team/about-page-panthe-hover.jpg) no-repeat;
          background-size: cover;
        }

    .teamPhotoMichael{
      background: url(https://s3.amazonaws.com/josh.ai/team/michael.jpg) top left no-repeat;
      background-size: cover;
    }
        .teamPhotoMichael:hover{
          background: url(https://s3.amazonaws.com/josh.ai/team/about-page-michael-hover.jpg) no-repeat;
          background-size: cover;
        }

    .teamPhotoNader{
      background: url(https://s3.amazonaws.com/josh.ai/team/about-page-nader.jpg) center left no-repeat;
      background-size: cover;
    }
        .teamPhotoNader:hover{
          background: url(https://s3.amazonaws.com/josh.ai/team/about-page-nader-hover.jpg) no-repeat;
          background-size: cover;
        }

    .teamPhotoNate{
      background: url(https://s3.amazonaws.com/josh.ai/team/about-page-nate.jpg) top left no-repeat;
      background-size: cover;
    }
        .teamPhotoNate:hover{
          background: url(https://s3.amazonaws.com/josh.ai/team/about-page-nate-hover.jpg) no-repeat;
          background-size: cover;
        }

    .teamPhotoMyers{
      background: url(https://s3.amazonaws.com/josh.ai/team/about-page-tmyers.jpg) center left no-repeat;
      background-size: cover;
    }
        .teamPhotoMyers:hover{
          background: url(https://s3.amazonaws.com/josh.ai/team/about-page-tmyers-hover.jpg) no-repeat;
          background-size: cover;
        }

    .teamPhotoAaron{
      background: url(https://s3.amazonaws.com/josh.ai/team/aaron.jpg) top left no-repeat;
      background-size: cover;
    }
        .teamPhotoAaron:hover{
          background: url(https://s3.amazonaws.com/josh.ai/team/about-page-aaron-hover.jpg) no-repeat;
          background-size: cover;
        }

    .teamPhotoMohammad{
      background: url(https://s3.amazonaws.com/josh.ai/team/mohammad.jpg) top left no-repeat;
      background-size: cover;
    }
        .teamPhotoMohammad:hover{
          background: url(https://s3.amazonaws.com/josh.ai/team/about-page-muhammad-hover.jpg) no-repeat;
          background-size: cover;
        }

    .teamPhotoSara{
      background: url(https://s3.amazonaws.com/josh.ai/team/sara.jpg) top left no-repeat;
      background-size: cover;
    }
        .teamPhotoSara:hover{
          background: url(https://s3.amazonaws.com/josh.ai/team/about-page-sara-hover.jpg) no-repeat;
          background-size: cover;
        }

    .teamPhotoKristen{
      background: url(https://s3.amazonaws.com/josh.ai/team/kristen.jpg) top left no-repeat;
      background-size: cover;
    }
        .teamPhotoKristen:hover{
          background: url(https://s3.amazonaws.com/josh.ai/team/about-page-kristen-hover.jpg) no-repeat;
          background-size: cover;
        }

    .teamPhotoAtticus{
      background: url(https://s3.amazonaws.com/josh.ai/team/atticus.jpg) top left no-repeat;
      background-size: cover;
    }
        .teamPhotoAtticus:hover{
          background: url(https://s3.amazonaws.com/josh.ai/team/about-page-atticus-hover.jpg) no-repeat;
          background-size: cover;
        }

#teamEmojis{
  padding: 0px;
  -webkit-transition: margin 1.0s;
  transition: margin 1.0s;
}
ul#teamEmojis li {
  display:inline;
}   
#teamEmojis a{
  opacity: 1; 
  -webkit-transition: none;
  transition: none; 
  margin-right: 5px;
}
#teamEmojis a:hover{
  opacity: 1;
  -ms-transform: rotate(14deg); /* IE 9 */
  -webkit-transform: rotate(14deg); /* Chrome, Safari, Opera */
  transform: rotate(14deg);
  display: inline-table;
}
#aboutFooter{
  color: #fff;
  background-color: #3ca4fc;
  width: 100%;
  height: 140px;
  margin-top: 0px;
  padding: 50px 0px 0px 0px;
  font-size: 14px;
  border-bottom: 15px solid #fff;
  max-width: 1200px;
  margin: auto;
  margin-bottom: 180px;
}
.aboutFooterButton{
  height: 32px;
  width: 120px;
  background:url(https://s3.amazonaws.com/josh.ai/team/other-sections-footer-email-button-stacked.png) no-repeat;
  background-position: 0px 0px;
  padding-top: 8px;
  margin: auto;
  margin-top: 20px;
}
.aboutFooterButton:hover{
  background-position: 0px -40px;
  cursor: pointer;
}
.recsFooterLink{
  color: #fff;
  font-size: 12px;
  margin-top: 11px;
}
.aboutFooterButton:hover .recsFooterLink{
  color: #3ca4fc;
  cursor: pointer;
}

/* ****************************** */
/* PRESS PAGE */
/* ****************************** */
#pressTopSection{
  background: linear-gradient(
    rgba(255, 255, 255, 0.4), 
    rgba(2555, 255, 2555, 0.4)
  ),url(https://s3.amazonaws.com/josh.ai/press-header-background.jpg) no-repeat;
  background-size: cover;
  width: 100%;
  padding: 80px 0px 50px 0px;
  -webkit-transition: margin 1.0s;
  transition: margin 1.0s;
}
#navPress{
  color: #333;
  padding: 0px;
  margin: 0px;
  opacity: 0;
  -webkit-transition: opacity 1.0s;
  transition: opacity 1.0s;
}
#pressBody{
  width: 100%;
  padding-top: 20px;
  -webkit-transition: margin 1.0s;
  transition: margin 1.0s;
}
#pressText{
  margin: auto;
  font-size: 15px;
  color: #888;
  line-height: 1.6;
  margin-bottom: 40px;
  padding-left: 13%;
  padding-right: 13%;
  margin-top: 20px;
}
.pressGridObject{
    width: calc(25% - 38px);
    height: 130px;
    background-color: #f9f9f9;
    float: left;
    margin-right: 10px;
    margin-bottom: 10px;
    color: #333;
    font-size: 12px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding: 10px;
    padding-left: 20px;
}
.pressGridObject a{
  color: #88aac4;
}
.pressGridObject a:hover{
  color: #3ca4fc;
}
.pressGrid2{
  margin-right: 10px;
}
.pressGrid3{
  margin-right: 10px;
}
.pressGrid4{
  margin-right: 0px;
}
.pressGridTitles{
  font-weight:500;
  opacity: 0.8;
  margin-top: 5px;
}
.pressGridDate{
  font-size: 9px;
  color: #fff;
  font-weight: 800;
  margin-top: 10px;
  text-transform: uppercase;
}
.pressImage{
  width: 60%;
  display: block;
  margin:auto;
  margin-bottom: 20px;
  border-radius: 4px;
  opacity: 0;
  -webkit-transition: opacity 1.0s;
  transition: opacity 1.0s;

  -webkit-box-shadow: 2px 3px 8px -4px rgba(0,0,0,0.74);
  -moz-box-shadow: 2px 3px 8px -4px rgba(0,0,0,0.74);
  box-shadow: 2px 3px 8px -4px rgba(0,0,0,0.74);
}
.presspcmag{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_pcmag.jpg) no-repeat;
}
.presssmashd{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_smashd.jpg) no-repeat;
}
.pressconnectedlifestyle{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_connectedlifestyle.jpg) no-repeat;
}
.presssmarthomeshow{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_smarthomeshow.jpg) no-repeat;
}
.presstwice{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_twice.jpg) no-repeat;
}
.presslatechwatch{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_latechwatch.jpg) no-repeat;
}
.pressbuiltinco{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_builtinco.jpg) no-repeat;
}
.pressproducthunt{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_producthunt.jpg) no-repeat;
}
.presspresidentialsystems{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_residentialsystems.jpg) no-repeat;
}
.presscepro{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_cepro.jpg) no-repeat;
}
.presspsfk{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_psfk.jpg) no-repeat;
}
.pressfashnerd{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_fashnerd.jpg) no-repeat;
}
.pressscenester{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_scenester.jpg) no-repeat;
}
.pressselectronichouse{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_electronichouse.jpg) no-repeat;
}
.presssiotpodcast{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_iotpodcast.jpg) no-repeat;
}
.pressyahoonews{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_yahoonews.jpg) no-repeat;
}
.presssdigitaltrends{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_digitaltrends.jpg) no-repeat;
}
.pressbgsmarthomewelt{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_smarthomewelt.jpg) no-repeat;
}
.pressbgtechomebuilder{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_techomebuilder.jpg) no-repeat;
}
.pressbgsdtimes{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_sdtimes.jpg) no-repeat;
}
.pressivanestrada{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_ivanestrada.jpg) no-repeat;
}
.pressphilharmonic{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_philharmonic.png) no-repeat;
}
.presshomealarmreport{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_homealarmreport.jpg) no-repeat;
}
.presshiddenwires{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_hiddenwires.jpg) no-repeat;
}
.pressgizmag{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_gizmag.jpg) no-repeat;
}
.pressyourconnectedfamily{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_yourconnectedfamily.jpg) no-repeat;
}
.presseverythingaboutdesing{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_everythingaboutdesign.jpg) no-repeat;
}
.pressworldiot{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_worldiot.jpg) no-repeat;
}
.presstechnologyintegrator{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_technologyintegrator.jpg) no-repeat;
}
.presscommunitec{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_communitec.jpg) no-repeat;
}
.pressmobilegeeks{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_mobilegeeks.jpg) no-repeat;
}
.presstechsmarthome{
  background: linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ),url(https://s3.amazonaws.com/josh.ai/press-bg/pressbg_techsmarthome.jpg) no-repeat;
}

.pressLinkPhotos{
  background-size: 100% 100%;
  -webkit-transition: background-size 0.6s;
  transition: background-size 0.6s;
}
.pressLinkPhotos:hover{
  background-size: 103% 103%;
}
.pressLinkPhotos a{
  color: #fff;
}
.pressLinkPhotos a:hover{
  color: #fff;
}


/* ****************************** */
/* RECOMMENDATIONS (RECS) PAGE */
/* ****************************** */

#recsTopSection{
  background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-header-background.jpg) no-repeat;
  background-size: cover;
  width: 100%;
  padding: 120px 0px 80px 0px;
  margin-bottom: 15px;
  -webkit-transition: margin 1.0s;
  transition: margin 1.0s;
}
#recsTitle{
    margin: auto;
    opacity: 0;
    font-size: 35px;
    font-weight: 300;
    color: #555;
    letter-spacing: 0.02em;
    margin-bottom: 20px;
    -webkit-transition: opacity 2.0s;
    transition: opacity 2.0s;
}
#recsText{
    margin: auto;
    font-size: 13px;
    color: #666;
    line-height: 1.6;
}
.recsTextTop{
  opacity: 0;
  -webkit-transition: opacity 2.0s;
  transition: opacity 2.0s;
}
.recsButton{
    background: url(https://s3.amazonaws.com/josh.ai/new2/contact/email-button-four-stack.png) no-repeat;
    background-position: 0px -40px;
    height: 29px;
    width: 120px;
    font-size: 11px;
    color: #fff;
    font-weight: 800;
    margin: auto;
    margin-top: 40px;
    padding-top: 11px;
    -webkit-transition: opacity 1.0s;
    transition: opacity 1.0s;
    opacity: 0;
}
.recsButton:hover{
    background-position: 0px -80px;
    cursor: pointer;
}
.recsContent{
  display: table;
  background-color: #f9f9f9;
  margin-bottom: 180px;
  border-bottom: 15px solid #fff;
}
.recsRevealTitle{
  font-weight: 100;
  font-size: 40px;
}
.recsRevealBodyText{
  margin-top: 30px;
  font-size: 14px;
  color: #888;
}
.recsDevicesRow{
  height: 250px;
  width: 100%;
  margin-top: 20px;
}
.recsDevicesRowSecond{
  height: 500px;
}
.recsDevicesRow1,.recsDevicesRow2,.recsDevicesRow3, .recsDevicesRow4, .recsDevicesRow5, .recsDevicesRow6{
  width: 33.3333%;
  height: 50%;
  float: left;
  text-align: center;
}
.recsDeviceRowPhoto{
  width: 130px;
  margin-top: 10px;
}
.recsDeviceRowPhotoSoon{
  opacity: 0.2;
}
.recsDeviceRowTitle{
  font-size: 12px;
  color: #444;
  margin-bottom: 10px;
}
.recsDeviceRowText{
  font-size: 14px;
  color: #888;
}
#recsThermostats,#recsLights,#recsCameras,#recsMusic,#recsEntertain,#recsSensors,#recsSecurity,#recsOutdoors,#recsSwitches,#recsShades,#recsGarage{
  display: none;
  margin-top: 40px;
  margin-bottom: 40px;
}
#recsThermostats a,#recsLights a,#recsCameras a,#recsMusic a,#recsEntertain a,#recsSensors a,#recsSecurity a,#recsOutdoors a,#recsSwitches a,#recsShades a,#recsGarage a{
  font-size:13px;
  color:#333;
  font-weight:400;
}

.recsGrid{
  padding: 0;
  margin-top: 0;
  list-style: none;
}
.recsGrid li {
  float: left;
  width: calc(25% - 12px);
  margin-right: 15px;
}
.recsGridLiRight{
  margin-right: 0px !important;
}
.recsGridLiRightSmall{
  margin-right: 15px;
} 
.recsContentSquareTop{
  margin-top: 0px;
}
.recsContentSquare{
  height: 268px;
  width: 100%;
  margin-right: 15px;
  margin-top: 15px;
  overflow: hidden;
  -webkit-transition: background-size 0.5s;
  transition: background-size 0.5s;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
    .recsContentSquareThermostat{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-thermostat-thumbnail.jpg) no-repeat;
      background-size: 100% 100%;
    }
    .recsContentSquareLights{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-lights-thumbnail.jpg) no-repeat;
      background-size: 100% 100%;
    }
    .recsContentSquareCameras{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-cameras-thumbnail.jpg) no-repeat;
      background-size: 100% 100%;
    }
    .recsContentSquareMusic{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-music-thumbnail.jpg) no-repeat;
      background-size: 100% 100%;
    }
    .recsContentSquareEntertain{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-entertain-thumbnail.jpg) no-repeat;
      background-size: 100% 100%;
    }
    .recsContentSquareSensors{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-sensors-thumbnail.jpg) no-repeat;
      background-size: 100% 100%;
    }
    .recsContentSquareSecurity{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-security-thumbnail.jpg) no-repeat;
      background-size: 100% 100%;
    }
    .recsContentSquareOutdoors{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-outdoor-thumbnail.jpg) no-repeat;
      background-size: 100% 100%;
    }
    .recsContentSquareSwitches{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-switches-thumbnail.jpg) no-repeat;
      background-size: 100% 100%;
    }
    .recsContentSquareShades{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-shades-thumbnail.jpg) no-repeat;
      background-size: 100% 100%;
    }
    .recsContentSquareGarage{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-garage-thumbnail.jpg) no-repeat;
      background-size: 100% 100%;
    }
    .recsContentSquareMore{
      height: 267px;
      width: calc(100% - 2px);
      border:1px solid #ccc;
    }

    .recsContentSquareThermostat:hover, .recsContentSquareLights:hover, .recsContentSquareCameras:hover, 
    .recsContentSquareMusic:hover, .recsContentSquareEntertain:hover, .recsContentSquareSensors:hover,
    .recsContentSquareSecurity:hover, .recsContentSquareOutdoors:hover, .recsContentSquareSwitches:hover,
    .recsContentSquareShades:hover, .recsContentSquareGarage:hover{
      background-size: 105% 105%;
      cursor: pointer;
    }

.recsContentSquareRight{
  margin-right: 0px;
}
.recsContentIcon{
  height: 50px;
  width: 50px;
  background-position: 0px 0px;
}
    .recsContentIconThermostat{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-thermostat-icon-stacked.png);
    }
    .recsContentIconLights{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-lights-icon-stacked.png);
    }
    .recsContentIconCameras{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-cameras-icon-stacked.png);
    }
    .recsContentIconMusic{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-music-icon-stacked.png);
    }
    .recsContentIconEntertain{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-entertain-icon-stacked.png);
    }
    .recsContentIconSensors{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-sensors-icon-stacked.png);
    }
    .recsContentIconSecurity{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-security-icon-stacked.png);
    }
    .recsContentIconOutdoors{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-outdoors-icon-stacked.png);
    }
    .recsContentIconSwitches{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-switches-icon-stacked.png);
    }
    .recsContentIconShades{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-shades-icon-stacked.png);
    }
    .recsContentIconGarage{
      background: url(https://s3.amazonaws.com/josh.ai/new2/works+with/works-with-page-garage-icon-stacked.png);
    }

.recsContentSquare:hover > .recsContentIcon{
  background-position: 0px -50px;
}
.recsContentName{
  color: #fff;
  font-weight: 800;
  text-transform: uppercase;
  margin-top: 15px;
  font-size: 15px;
}
.recsContentMore{
  color: #ccc;
  font-weight: 800;
  font-style: italic;
  font-size: 15px;
  line-height: 1.5em
}

.recsImage{
  box-shadow: inset 0 0 0 1000px rgba(0,0,0,.2);
  width: calc(100% - 100px);
  padding: 100px 50px 500px 50px;
  font-size: 2em;
  cursor: pointer;
}
  .recsThermostat{
    background: url(https://s3.amazonaws.com/josh.ai/products/nest.png) bottom left no-repeat;
    background-size: cover;
    margin-bottom: 120px;
  }
  .recsMusic{
    background: url(https://s3.amazonaws.com/josh.ai/products/sonos.png) bottom left no-repeat;
    background-size: cover;
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .recsLights{
    background: url(https://s3.amazonaws.com/josh.ai/products/lights.png) bottom left no-repeat;
    background-size: cover;
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .recsCameras{
    background: url(https://s3.amazonaws.com/josh.ai/products/nestcam.png) bottom left no-repeat;
    background-size: cover;
    margin-top: 120px;
    margin-bottom: 120px;
  }

.recsDesc{
  color: #333;
}
.recsDivider{
  width: 100%;
  margin-top:20px;
  border-top:1px solid #eee;
  margin-bottom:20px;
}
.recsRevealText{
  color: #3581E6;
  cursor: pointer;
  font-weight: 700;
}
#recsThermostatCollapse, #recsMusicCollapse, #recsLightsCollapse, #recsCamerasCollapse{
  display: none;
  position: static;
  
  border-top: 1px solid #eee;
  margin-top: 100px;
}
.recsThermHide, .recsMusicHide, .recsLightsHide, .recsCamerasHide{
  display: none;
}

/* ****************************** */
/* BLOG PAGE */
/* ****************************** */

#blogBody{
  width: 100%;
  padding:20px 0px 1px 0px;
  -webkit-transition: margin 1.0s;
  transition: margin 1.0s;
  font-size: 14px;
  margin-bottom: 180px;
  border-bottom: 15px solid #fff;
}
#blogTopSection{
  background: url(https://s3.amazonaws.com/josh.ai/new2/blog-page-header-background.jpg) no-repeat;
  background-size: cover;
  width: 100%;
  padding: 120px 0px 80px 0px;
  margin-bottom: 15px;
  -webkit-transition: margin 1.0s;
  transition: margin 1.0s;
}
#blogTitle{
    margin: auto;
    opacity: 0;
    font-size: 35px;
    font-weight: 300;
    color: #555;
    letter-spacing: 0.02em;
    margin-bottom: 20px;
    -webkit-transition: opacity 2.0s;
    transition: opacity 2.0s;
}
#blogText{
    margin: auto;
    font-size: 13px;
    color: #666;
    line-height: 1.6;
}
.blogTextTop{
  opacity: 0;
  -webkit-transition: opacity 2.0s;
  transition: opacity 2.0s;
}
.blogButton{
    background: url(https://s3.amazonaws.com/josh.ai/new2/contact/email-button-four-stack.png) no-repeat;
    background-position: 0px -40px;
    height: 29px;
    width: 120px;
    font-size: 11px;
    color: #fff;
    font-weight: 800;
    margin: auto;
    margin-top: 40px;
    padding-top: 11px;
    -webkit-transition: opacity 1.0s;
    transition: opacity 1.0s;
    opacity: 0;
}
.blogButton:hover{
    background-position: 0px -80px;
    cursor: pointer;
}
#blog-loading {
    position: absolute;
    left: 50%;
    margin-left: -40px;
    font-size: 20px;
    letter-spacing: 0.01em;
    margin-top: 150px;
    font-weight: 300;
}

/* ****************************** */
/* BUY PAGE */
/* ****************************** */

#buyCont{
  width: 100%;
  margin-bottom: 180px;
}
#buyBlock2Title, #buyBlock4Title, #buyBlock1Title, #buyBlock3Title{
  font-size: 40px;
  color: #666;
  font-weight: 100;
}
#buyBlock1Title{
  color: #fff;
  padding-top: 40px;
  padding-bottom: 20px;
}
#buyBlock3Title{
  margin-top: 100px;
}
.stripe-result-message{
  margin-top: 30px;
  margin-bottom: 45px;
  padding: 0px;
  color: green;
  font-size: 22px;
}

/* BLOCK 1 */

#buyBlock1{
  position: relative;
  width: 100%;
  height: 560px;
  //background: url(https://s3.amazonaws.com/josh.ai/new2/getjosh/dog.jpg) no-repeat;
  background-size: cover;
  border-bottom: 15px solid #fff;
  padding-top: 46px;
  overflow: hidden;
}
#buyBlock1Vid{
  position: absolute;
  width: 100%;
  left: 0px;
  z-index: -1;
}
#buyBlock1Left{
  height: 100%;
  width: 50%;
  background-color: RGBA(0,0,0,0.4);
  color: #fff;
}
.buyList{
  line-height: 2.4;
  font-size: 16px;
  width: 300px;
  margin: auto;
  margin-top: 30px;
  text-align: left;
  font-style: italic;
}
.buyList a{
  color: #3ca4fc;
}

/* BLOCK 2 */

#buyBlock2{
  width: 100%;
  padding-top: 40px;
  padding-bottom: 80px;
  background-color: #f9f9f9;
  border-bottom: 15px solid #fff;
}
#buyBlock2Cont{
  width: 100%;
  height: 250px;
  margin-top: 40px;
}
.buyBlock2Photos{
  height: 250px;
  width: 22.3%;
  position: absolute;
  -webkit-transition: opacity 1.0s;
  transition: opacity 1.0s;
}
.buyBlock2Photos:hover{
  opacity: 0.8;
}
.buyBlock2PhotoText{
  font-size: 16px;
  font-style: italic;
  position: absolute;
  margin-top: 260px;
  width: 100%;
  color: #666;
}
.buyBlock2Arrows{
  height: 150px;
  width: 16.5%;
  position: absolute;
  padding-top: 100px;
}
#buyBlockPhoto1{
  background:url(https://s3.amazonaws.com/josh.ai/new2/getjosh/get-josh-page-setup-1.jpg) no-repeat;
  background-size: cover;
  margin-left: 50px;
}
#buyBlockPhoto2{
  background:url(https://s3.amazonaws.com/josh.ai/new2/getjosh/get-josh-page-setup-3.jpg) no-repeat;
  background-size: cover;  
  margin-left: 38.8%;
}
#buyBlockPhoto3{
  background:url(https://s3.amazonaws.com/josh.ai/new2/getjosh/get-josh-page-setup-2.jpg) no-repeat;
  background-size: cover;
  margin-left: 73%;
}
#buyBlockArrow1{
  margin-left: 25%;
}
#buyBlockArrow2{
  margin-left: 59.2%;
}

/* BLOCK 3 */

#buyBlock3{
  width: 100%;
  height: 700px;
  background-color: #f9f9f9;
  border-bottom: 15px solid #fff;
}
#buyBlock3Top, #buyBlock3Bottom{
  height: 50%;
}
.buyBlocks{
  height: 350px;
  position: absolute;
  -webkit-transition: all 1.0s;
  transition: all 1.0s;
}
.buyBlocks:hover{
  opacity: 0.9;
}
.buyBlock3BlocksText{
  font-size: 28px;
  color: #fff;
  font-style: italic;
  margin-top: 150px;
  font-weight: 300;
}
#buyBlock3TopLeft{
  width: 33%;
  background: linear-gradient(
    rgba(0, 0, 0, 0.5), 
    rgba(0, 0, 0, 0.5)
  ),url(https://s3.amazonaws.com/josh.ai/new2/getjosh/get-josh-page-example-5.jpg) no-repeat;
  background-size: cover;
  background-position: center;
}
#buyBlock3TopMiddle{
  width: 34%;
  background-color: #f9f9f9;
  margin-left: 33%;
}
#buyBlock3TopRight{
  width: 33%;
  background: linear-gradient(
    rgba(0, 0, 0, 0.5), 
    rgba(0, 0, 0, 0.5)
  ),url(https://s3.amazonaws.com/josh.ai/new2/getjosh/get-josh-page-example-2.jpg) no-repeat;
  background-size: cover;  
  background-position: center;
  margin-left: 67%;
}
#buyBlock3BottomLeft{
  width: 33%;
  background: linear-gradient(
    rgba(0, 0, 0, 0.5), 
    rgba(0, 0, 0, 0.5)
  ),url(https://s3.amazonaws.com/josh.ai/new2/getjosh/get-josh-page-example-3.jpg) no-repeat;
  background-size: cover;
  background-position: center;
}
#buyBlock3BottomMiddle{
  width: 34%;
  background: linear-gradient(
    rgba(0, 0, 0, 0.5), 
    rgba(0, 0, 0, 0.5)
  ),url(https://s3.amazonaws.com/josh.ai/new2/getjosh/get-josh-page-example-4.jpg) no-repeat;
  background-size: cover;  
  margin-left: 33%;
  background-position: center;
}
#buyBlock3BottomRight{
  width: 33%;
  background: linear-gradient(
    rgba(0, 0, 0, 0.5), 
    rgba(0, 0, 0, 0.5)
  ),url(https://s3.amazonaws.com/josh.ai/new2/getjosh/get-josh-page-example-1.jpg) no-repeat;
  background-size: cover;  
  margin-left: 67%;
  background-position: center;
}

/* BLOCK 4 */

#buyBlock4{
  width: 100%;
  background-color: #f9f9f9;
  border-bottom: 15px solid #fff;
  padding-top: 40px;
  padding-bottom: 40px;
}
#buyBlock4Text{
  font-size: 11px;
  color: #666;
  margin-top: 10px;
  line-height: 1.8em;
}
.buyBlock4BottomStyle a{
  color: #000;
  font-size: 15px; 
  font-weight: 800;
}
.buyBlock4BottomStyle a:hover{
  color: #555;
}

#buyBlock4Bottom{
  width: 100%;
  height: 200px;
  margin-top: 20px;
}
.buyBlock4BottomStyle{
  font-size: 16px;
  font-style: italic;
  position: absolute;
  color: #666;
  margin-top: 60px;
  width: 33%;
}
#buyBlock4BottomLeft{
}
#buyBlock4BottomMiddle{
  width: 34%;  
  margin-left: 33%;
}
#buyBlock4BottomRight{
  margin-left: 67%;
}
.buyBlock4BottomCheck{
  margin-top: 40px;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;

}
.buyBlock4BottomCheck:hover{
  -ms-transform: rotate(-14deg); /* IE 9 */
    -webkit-transform: rotate(-14deg); /* Chrome, Safari, Opera */
      transform: rotate(-14deg);
}

/* BLOCK 5 */

#buyBlock5{
  width: 100%;
  height: 600px;
  background: url(https://s3.amazonaws.com/josh.ai/new2/getjosh/get-josh-page-bottom-background.jpg) no-repeat;
  background-size: cover;
  border-bottom: 15px solid #fff;
}

video#bgvid { 
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background: url(polina.jpg) no-repeat;
    background-size: cover; 
    margin-bottom: 180px;
    border-bottom: 15px solid #fff;
}

#buyBody{
  width: 100%;
  padding:40px 0px 0px 0px;
  -webkit-transition: margin 1.0s;
  transition: margin 1.0s;
  font-size: 14px;
  color: #303131;
}
.buyHeader{
  background: url(https://s3.amazonaws.com/josh.ai/preorderhouse.jpg) center left no-repeat;
  background-size: cover;
  box-shadow: inset 0 0 0 1000px rgba(0,0,0,.4);
  width: calc(100% - 200px);
  height: 200px;
  color: #fff;
  text-align: center;
  font-size: 30px;
  padding: 100px;
}
.buyJoshHead{
  opacity: 0;
  width: 200px;
  margin-top: 60px;
  -webkit-transition: all 4.5s;
  transition: all 4.5s;
}
.buyCont{
  width: 100%;
  margin-bottom: 100px;
  text-align: left;
  min-height: 350px;
}
.buyLeft{
  width: 50%;
  padding: 15px;
  color: #f9f9f9;
  text-align: left;
}
.buyLeftTransBlack{
  position: absolute;
  margin-top: -1px;
  height: 100%;
  width: 50%;
  background-color: rgba(0,0,0,0.3);
  z-index: -1;
}
.buyRight{
  float: right;
  width: calc(40% - 40px);
  background-color:#303131;
  color: #fff;
  padding: 10px 10px 0px 10px;
  margin-right:15px;
  text-align: center;
  padding: 0px 30px 0x 30x;
}
.buySmallText{
  font-size: 12px;
  color: #eee;
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid #555;
}
.buySaleBlockCont{
  position: absolute;
  background-color: rgba(0, 140, 255, 0.9);
  color: #fff;
  width: 200px;
  padding: 20px;
  text-align: left;
  height: 200px;
  opacity: 0;
  margin-left: 65%;
  margin-top: 120px;

  -webkit-transition: all 0.5s;
  transition: all 0.5s;

  -ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
        transform: rotate(45deg); 
}
.buySaleBlock{
  position: absolute;
  color: #fff;
  width: 200px;
  padding: 20px;
  text-align: left;
  height: 200px;
  margin-left: 65%;
  margin-top: 120px;
  opacity: 0;

  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
.buySaleBlockLogo{
  width: 68px;
  margin-left: 65px;
  margin-bottom: 5px;
}
.buySaleBlockNumber{
  font-size: 50px;
  font-weight: 300;
  text-align: center;
}
.buySaleBlocTopText{
  font-size: 13px;
  text-align: center;
}
.buySaleBlockSmallText, .buySaleBlockSmallText a{
  font-size: 11px;
  text-align: center;
  margin-top: 40px;
}
.buySaleBlockOrder, .buySaleBlockContact{
  float: right;
  background: url(https://s3.amazonaws.com/josh.ai/new2/getjosh/get-josh-page-reserve-button-stacked.png) no-repeat;
  width: 200px;
  height: 31px;
  background-position: 0px 0px;
  font-weight: 700;
  color: #008cff;
  padding-top: 9px;
  text-align: center;
  text-transform: uppercase;
  margin-top: 10px;
  margin-bottom: 10px;
}
.buySaleBlockOrder:hover, .buySaleBlockContact:hover{
  background-position: 0px -40px;
  cursor: pointer;
  color: #fff;
}
.buyReserveText{
  font-size: 16px;
  font-weight: 800;
  text-align: center;
  margin-top: 50px;
  margin-bottom: 20px;
}
.buyLeft a{
  font-size: 12px;
  color:#fff;
}
#buyBlockHidden{
  display: none;
}

/* ****************************** */
/* FAQ PAGE */
/* ****************************** */

#faqsBody{
  width: 100%;
  padding:20px 0px 1px 0px;
  font-size: 18px;
  color: #303131;
  margin-bottom: 180px;
}
#faqsTopSection{
  background: url(https://s3.amazonaws.com/josh.ai/new2/faq-page-header-background.jpg) no-repeat;
  background-size: cover;
  width: 100%;
  padding: 120px 0px 80px 0px;
  margin-bottom: 15px;
  -webkit-transition: margin 1.0s;
  transition: margin 1.0s;
}
#faqsTitle{
    margin: auto;
    opacity: 0;
    font-size: 35px;
    font-weight: 300;
    color: #555;
    letter-spacing: 0.02em;
    margin-bottom: 20px;
    -webkit-transition: opacity 2.0s;
    transition: opacity 2.0s;
}
#faqsText{
    margin: auto;
    font-size: 13px;
    color: #666;
    line-height: 1.6;
}
.faqsTextTop{
  opacity: 0;
  -webkit-transition: opacity 2.0s;
  transition: opacity 2.0s;
}
.faqsButton{
    background: url(https://s3.amazonaws.com/josh.ai/new2/contact/email-button-four-stack.png) no-repeat;
    background-position: 0px -40px;
    height: 29px;
    width: 120px;
    font-size: 11px;
    color: #fff;
    font-weight: 800;
    margin: auto;
    margin-top: 40px;
    padding-top: 11px;
    -webkit-transition: opacity 1.0s;
    transition: opacity 1.0s;
    opacity: 0;
}
.faqsButton:hover{
    background-position: 0px -80px;
    cursor: pointer;
}
.faqsContent{
  width: 100%;
}
.faqsContentLeft{
  width: calc(50% - 7.5px);
  min-height: 200px;
  height: auto;
  margin-bottom: 30px;
}
.faqsContentRight{
  width: calc(50% - 7.5px);
  margin-left: calc(50% + 7.5px);
  position: absolute;
}
.faqsContentBox{
  width: calc(100% - 50px);
  padding: 25px;
  background-color: #f9f9f9;
  margin-bottom: 15px;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
.faqsContentBox:hover{
  background-color: #6388b9;
}
.faqsContentBoxTitle{
  text-transform: uppercase;
  margin-bottom: 15px;
  font-weight: 800;
  color: #555;
  font-size: 16px;
}
.faqsContentBoxText{
  text-align: left;
  font-size: 14px;
  color: #888;
  line-height: 1.5em;
}
.faqsContentBoxText a{
  font-size: 13px;
  color:#3581E6;
  -webkit-transition: all 0s;
  transition: all 0s;
}
.faqsContentBox:hover > .faqsContentBoxTitle,.faqsContentBox:hover > .faqsContentBoxText a{
  color: #fff;
}
.faqsContentBox:hover > .faqsContentBoxText{
  color: #c7ddfa;
}
/* ****************************** */
/* CONTACT PAGE */
/* ****************************** */

#contactTopSection{
  background: url(https://s3.amazonaws.com/josh.ai/new2/contact/contact-page-header-background.jpg) no-repeat;
  background-size: cover;
  width: 100%;
  padding: 120px 0px 80px 0px;
  -webkit-transition: margin 1.0s;
  transition: margin 1.0s;
}
#contactTitle{
    margin: auto;
    opacity: 0;
    font-size: 35px;
    font-weight: 300;
    color: #555;
    letter-spacing: 0.02em;
    margin-bottom: 20px;
    -webkit-transition: opacity 2.0s;
    transition: opacity 2.0s;
}
#contactText{
    margin: auto;
    font-size: 13px;
    color: #666;
    line-height: 1.6;
}
.contactTextTop{
  opacity: 0;
  -webkit-transition: opacity 2.0s;
  transition: opacity 2.0s;
}
.contactButton{
    background: url(https://s3.amazonaws.com/josh.ai/new2/contact/email-button-four-stack.png) no-repeat;
    background-position: 0px -40px;
    height: 29px;
    width: 120px;
    font-size: 11px;
    color: #fff;
    font-weight: 800;
    margin: auto;
    margin-top: 40px;
    padding-top: 11px;
    -webkit-transition: opacity 1.0s;
    transition: opacity 1.0s;
    opacity: 0;
}
.contactButton:hover{
    background-position: 0px -80px;
    cursor: pointer;
}
.contactTopLeft{
    height: 50%;
    width: 50%;
    background-color:red;
}
.contactSection{
  height: 530px;
  padding:15px 0px 0px 0px;
  margin-bottom: 180px;
}
.contactTopLeft{
  float: left;
  width: calc(50% - 7.5px);
  background: url(https://s3.amazonaws.com/josh.ai/new2/contact/contact-page-jobs-section-background.jpg) no-repeat;
  background-size: 100% 100%;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
.contactTopLeft:hover{
  background:url(https://s3.amazonaws.com/josh.ai/new2/contact/contact-page-jobs-section-background.jpg) no-repeat;
  background-size: 105% 105%;
}
.contactTopRight{
  float: right;
  width: calc(50% - 7.5px);
  background: url(https://s3.amazonaws.com/josh.ai/new2/contact/contact-page-press-section-background.jpg) no-repeat;
  background-size: 100% 100%;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
.contactTopRight:hover{
  background: url(https://s3.amazonaws.com/josh.ai/new2/contact/contact-page-press-section-background.jpg) no-repeat;
  background-size: 105% 105%;
}
.contactBottomLeft{
  float: left;
  margin-top: 15px;
  width: calc(50% - 7.5px);
  background: url(https://s3.amazonaws.com/josh.ai/new2/contact/contact-page-support-section-background.jpg) no-repeat;
  background-size: 100% 100%;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
.contactBottomLeft:hover{
  background: url(https://s3.amazonaws.com/josh.ai/new2/contact/contact-page-support-section-background.jpg) no-repeat;
  background-size: 105% 105%;
}
.contactBottomRight{
  float: right;
  margin-top: 15px;
  width: calc(50% - 7.5px);
  background: url(https://s3.amazonaws.com/josh.ai/new2/contact/contact-page-sales-section-background.jpg) no-repeat;
  background-size: 100% 100%;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
.contactBottomRight:hover{
  background: url(https://s3.amazonaws.com/josh.ai/new2/contact/contact-page-sales-section-background.jpg) no-repeat;
  background-size: 105% 105%;
}
.contactSquaresText{
  height: 180px;
  padding-top: 70px;
  color: #fff;
  font-size: 40px;
  font-weight: 100;
}
.contactSquaresButton{
  background: url(https://s3.amazonaws.com/josh.ai/new2/contact/email-button-four-stack.png) no-repeat;
  background-position: 0px 0px;
  height: 28px;
  width: 120px;
  font-size: 11px;
  color: #fff;
  font-weight: 800;
  margin: auto;
  margin-top: 10px;
  padding-top: 12px;
}
.contactSquaresButton:hover{
  background-position: 0px -120px;
  cursor: pointer;
  color: #555;
}
.contactSquaresButton a{
  -webkit-transition: opacity 0.01s;
  transition: opacity 0.01s;
  font-size: 11px;
}
.contactSquaresButton:hover a{
  color: #555;
}

/* ****************************** */
/* GUIDE PAGE */
/* ****************************** */

#guideTopSection{
  background: url(https://s3.amazonaws.com/josh.ai/guide/guide-page-header-background.jpg) no-repeat;
  background-size: cover;
  width: 100%;
  padding: 120px 0px 80px 0px;
  -webkit-transition: margin 1.0s;
  transition: margin 1.0s;
}
#guideTitle{
    margin: auto;
    opacity: 0;
    font-size: 35px;
    font-weight: 300;
    color: #555;
    letter-spacing: 0.02em;
    margin-bottom: 20px;
    -webkit-transition: opacity 2.0s;
    transition: opacity 2.0s;
}
#guideText{
    margin: auto;
    font-size: 13px;
    color: #666;
    line-height: 1.6;
}
.guideTextTop{
  opacity: 0;
  -webkit-transition: opacity 2.0s;
  transition: opacity 2.0s;
}
.guideTextTop a, .guideTextBottom a{
  font-size: 13px; 
  color: #008cff;
}
.guideTextTop a:hover, .guideTextBottom a:hover{
  color: #008cff;
  text-decoration: underline;
  cursor: pointer;
}
.guideListLink a{
  color: #0069BF;
  font-size: 18px;
  font-weight: 500;
}
.guideListLink a:hover{
  color: #008CFF;
}
.guideSection{
  padding:30px 0px 30px 0px;
  margin-bottom: 180px;
  background-color: #fff;
}
.guideListTitle{
  text-align: left;
  margin-left: calc(50% - 90px);
  font-size: 20px;
  line-height: 3.5em;
  color: #0069BF;
  font-weight: 300;
  -webkit-transition: color 1.0s;
  transition: color 1.0s;
}
.guideListTitle:hover{
  cursor: pointer;
  color: #008CFF;
}
.guideListIcon{
  width: 40px;
  position: absolute;
  margin-left: -50px;
  margin-top: 15px;
}
.guideListTitle:hover > .guideListIcon{
  width: 38px;
  position: absolute;
  margin-left: -48px;
  margin-top: 17px;
}
.guideList1, .guideList2, .guideList3, .guideList4, .guideList5, .guideList6, .guideList7, .guideList8, .guideList9{
  display: none;
  border-top: 1px solid #eee;
  border-bottom: 1px solid #eee;
  padding: 15px;
  max-width: 500px;
  margin: auto;
  text-align: left;
}
.guideListClose{
  font-size: 11px;
  color: #0069BF;
  text-transform: uppercase;
  -webkit-transition: color 1.0s;
  transition: color 1.0s;
  text-align: center;
  margin-top: 20px;
}
.guideListClose:hover{
  cursor: pointer;
  color: #008CFF;
}
.guideList2Item{
  margin-bottom: 15px;
  margin-top: 30px;
}
.guideList2Note{
  font-size: 14px;
  font-style: italic;
  color: #B33427;
  margin-bottom: 15px;
}
.guideList2Note a{
  font-size: 14px;
  font-style: italic;
  color: #B33427;  
}
.guideList2Note a:hover{
  color: #E74C3C;  
}
.guideList2ItemImage{
  opacity: 0.9;
  padding-bottom: 15px;
  border-bottom: 1px solid #eee;
  -webkit-transition: all 1.0s;
  transition: all 1.0s;
}
.guideList2ItemImage:hover{
  opacity: 1;
  cursor: pointer;
}
.guideCommandsList, .guideDeviceList, .guideAdvancedList{
  list-style-type: circle;
 }
.guideCommandsList li{
  font-style: italic;
}
.guideList4Icon{
  width: 30px;
  vertical-align: middle;
  margin-right: 10px;
  margin-top: -4px;
}
.guideAdvancedList1, .guideAdvancedList2, .guideAdvancedList3, .guideAdvancedList4, .guideAdvancedList5, .guideAdvancedList6{
  display: none;
  border-top: 1px solid #eee;
  padding-top: 15px;
  margin-top: 15px;
  margin-bottom:15px;
  padding-bottom: 15px;
  border-bottom: 1px solid #eee;
}
.guideAdvancedList li{
  color: #0069BF;
  font-weight: 300;
  -webkit-transition: color 1.0s;
  transition: color 1.0s;
}
.guideAdvancedList li:hover{
  cursor: pointer;
  color: #008CFF;
}
#guideLocalizationList li, #guideLocalizationList2 li{
  color: #000;
  font-weight: 500;
  cursor: auto;
  margin-bottom: 10px;
}
#guideLocalizationList2{
  list-style-type: lower-latin;
  margin-top: 10px;
  margin-bottom: 10px;
}

/* ****************************** */
/* PACKAGING PAGE */
/* ****************************** */

#packagingTopSection{
  background: url(https://s3.amazonaws.com/josh.ai/packaging/packaging-page-header-background.jpg) no-repeat;
  background-size: cover;
  width: 100%;
  padding: 120px 0px 80px 0px;
  -webkit-transition: margin 1.0s;
  transition: margin 1.0s;
}
#packagingTitle{
    margin: auto;
    opacity: 0;
    font-size: 35px;
    font-weight: 300;
    color: #555;
    letter-spacing: 0.02em;
    margin-bottom: 20px;
    -webkit-transition: opacity 2.0s;
    transition: opacity 2.0s;
}
#packagingText{
    margin: auto;
    font-size: 13px;
    color: #666;
    line-height: 1.6;
}
.packagingTextTop{
  opacity: 0;
  -webkit-transition: opacity 2.0s;
  transition: opacity 2.0s;
}
.packagingTextTop a, .packagingTextBottom a{
  font-size: 13px; 
  //color: #88aac4;
  color: #008cff;
}
.packagingTextTop a:hover, .packagingTextBottom a:hover{
  color: #008cff;
  text-decoration: underline;
  cursor: pointer;
}
.packagingSection{
  height: 530px;
  padding:15px 0px 0px 0px;
  margin-bottom: 180px;
  background-color: #fff;
}
.packagingTextBottom{
  font-size: 13px;
  margin: auto;
  color: #666;
  margin-bottom: 177px;
  position: static;
  padding-bottom: 25px;
  opacity: 0;
  -webkit-transition: opacity 2.0s;
  transition: opacity 2.0s;
}

/* ****************************** */
/* MANIFESTO PAGE */
/* ****************************** */

.docRightCont{
  text-align: left;
  padding:40px 50px 0px 50px;
  background-color: #f9f9f9;
}
#manifesto-cont {
  margin-bottom: 180px;
}
.sectionHeaders{
  font-style: italic;
  font-size: 1.17em;
  font-weight: bold;
  border-top: 1px solid #ccc;
  padding-top: 50px;
  margin-top: 50px;
  color: #00467f;
}
.decagon{
  width: 40%;
  display: block;
  margin: auto;
}
.sectionHeader{
  padding-top: 40px;
  color: #00467f;
}
.divider{
  height: 50px;
  border-top: 1px solid #aaa;
  width: 100%;
  margin-top: 50px;
}
.manifestoParagraph{
  font-size: 18px;
  margin: auto;
  margin-top: 20px;
  letter-spacing: 0px;
  font-weight: 500;
  width: 100%;
}

/* ****************************** */
/* PORTAL PAGE */
/* ****************************** */

#testTop{
  height: 80px;
  position: fixed;
  background-color: #f9f9f9;
  width: 100%;
  top: 0px;
  border-bottom: 1px solid #000;
}
#testMiddle{
  position: static;
  height: calc( 100% - 40px);
  width: 100%;
  background-color:#fff;
  margin-top: 80px;
  color: black;
  font-size: 40px;
}
#testBottom{
  height: 80px;
  position: fixed;
  bottom: 0px;
  width: 100%;
  background-color: #f9f9f9;
  border-top: 1px solid #000;
}
#testMiddleLeft{
  width: calc( 30% - 41px);
  height: 100%;
  float: left;
  padding: 20px;
  border-right: 1px solid #000;
}
#testMiddleRight{
  width: calc( 70% - 40px)%;
  height: 100%;
  margin-left: 30%;
  padding: 20px;
}


#portal-content{
  height: 100%;
  width: 100%;
  background-color: yellow;
}

#portal-content-left {
  width: 20%;
  float: left;
  margin-top: 100px;
  height: 100%;
}
#portal-content-right {
  width: 80%;
  float: right;
  margin-top: 100px;
  height: 100%;
}

/* OTHER */

#preload{ 
  display: none;
}

/* ****************************** */
/* MEDIA QUERIES */
/* ****************************** */
@media screen and (max-width: 1150px) {
  .navJoshLogo{
    position: absolute;
    left: 15px;
  }
  .nav1home{
    position: absolute;
    right:15px;
  }
  .getJoshButton{
    position: absolute;
    right: 15px;
  }
  .recsContentSquareTop{
    margin-top: 15px;
  }
  .recsContentSquareRight{
    margin-right: 15px;
  }
  .recsContent{
    padding-left: 15px;
  }
  .dividerVideo1,.dividerVideo2,.dividerVideo3{
    width: calc( 33% - 6px);
  }
  .recsContentSquareMore {
    width: calc(100% - 14px);
  }
@media screen and (max-width: 960px) {
  #reliableDiamond{
    height: 250px;
    width: 250px;
    margin-top: 225px;
    margin-left: -125px;
  }
  .reliableTextLarge{
    margin-bottom: 0px;
  }
  .reliableLine{
    display: none;
  }  
@media screen and (max-width: 820px) {
  #navlist1 li{
    padding-right: 20px;
  }
  .pressGridObject{
    width: calc(33% - 38px);
  }
  .pressGrid3{
    margin-right:0px;
    display: none;
  }
  #aboutFooter{
    margin-bottom: 0px;
  }
  .pressGrid4{
    margin-right:10px;
  }
 }
@media screen and (max-width: 740px) {
  #navlist1 li{
    padding-right: 15px;
  }
@media screen and (max-width: 720px) {
  #section1Cont, .disappear, .sectionNaderText, .tile2, .tile3, .tile4, .tile5, .tile6, .section1textSmall, .footer, .impressiveTextWorksWith, .impressiveWorksImage, .section4quote, .meetTextSmall, .liberatingTextArea2, #impressiveWorksWith, .section5quote{
    display: none;
  }

  #block3, .divider0, .divider2, #block4, .divider3, #block5, #block6, #block7, .bottomLogo, .buyBlock2Arrows, #buyBlock3, #buyBlock4, #buyBlock1Vid, #buyBlock5{
    display: none;
  }
  #block8{
    margin-top: 0px;
    height: 275px;
  }
  .bottomText{
    margin-top: 50px;
    padding: 20px;
  }
  .bottomButton{
    margin-top: 160px;
  }
  .tile1{
    opacity: 1;
    top: 60px;
  }
  .section1text{
    margin-top: -100px;
    font-size: 30px;
    padding-left: 20px;
    padding-right: 20px;
    opacity: 1;
    padding-bottom: 10px;
  }
  .text1Container{
    height: auto;
  }
  #block1{
    background:linear-gradient( rgba(255, 255, 255, 0.8), rgba(255, 255 ,255 , 0.8) ),url(https://s3.amazonaws.com/josh.ai/new2/cover-slide-bg-photo.jpg) no-repeat;
    background-size: cover;
  }
  .sectionNader{
    height: 250px;
    margin-top: 60px;
  }
  .section1GetJoshButton{
    opacity: 1;
    margin-top: 18px;
  }
  #impressiveLeftcont{
    height: 233px;
  }
  #impressiveRightcont{
    height: 233px;
    margin-top: -233px;
  }
  #impressiveRight3{
    margin-top: 0px;
  }
  #impressiveTriangle{
    position: static;
    margin-top: 0px;
    background: none;
    height: 250px;
  }
  .impressiveIcon{
    margin-top: 100px;
  }
  #impressiveText{
    margin-top: -212px;
  }
  #block8{
    margin-bottom: 0px;
  }

  #buyBlock1{
    height: 440px;
    margin-top: -70px;
  }
  #buyBlock1Left{
    display: none;
    width: 100%;
    margin-top: 440px;
  }
  .buySaleBlockCont, .buySaleBlock{
    margin-left: calc(50% - 115px);
    opacity: 1;
  }
  .buyBlock2Photos{
    height: 100px;
    width: 33%;
  }
  #buyBlockPhoto1{
    margin-left: 0px;
  }
  #buyBlockPhoto2{
    margin-left: 34%;
  }
  #buyBlockPhoto3{
    margin-left: 68%;
  }
  .buyBlock2PhotoText{
    margin-top: 108px;
  }
  #buyBlock2Cont{
    height: 85px;
  }
  #buyCont{
    margin-bottom: 0px;
  }
  #buyBlockHidden{
    display: block;
    margin-bottom: 20px;
  }
  #buyBlockHiddenTitle {
    font-size: 40px;
    font-weight: 100;
    color: #222;
    padding-top: 20px;
  }
  .recsContent{
    margin-bottom: 0px;
  }
}
@media screen and (max-width: 600px) {
  .pressGridObject{
    width: calc(50% - 40px);
  }
  .pressGrid2{
    margin-right:10px;
  }
  .pressGrid3{
    margin-right:10px;
    display: block;
  }
  #aboutFooter{
    margin-bottom: 0px;
  }
  #pressText{
    display: none;
  }
  .recsGrid li{
    width: calc(50% - 12px);
  }
  .recsGridLiRightSmall{
    margin-right: 0px !important;
  }
}
@media screen and (max-width: 460px) {
  #reliableDiamond{
    height: 200px;
    width: 200px;
    margin-top: 250px;
    margin-left: -100px;
  }
  .reliableTextLarge{
    margin-top: 25px;
  }
  .reliableTextSmall{
    display: none;
  }
  #guideTopSection{
    background: none;
    padding: 50px 20px 0px 20px;
    width: calc(100% - 40px);
  }
  .guideSection{
    padding-top: 0px;
    margin-bottom: 0px;
    padding-bottom: 0px;
  }
  #guideText{
    display: none;
  }
  .guideListTitle{
    text-align: left;
    margin-left: 75px;
  }
}