/* Live on sleepshepherd.com !!  */


@font-face {
    font-family: avenir;
    src: url('https://sleepshepherd.com/css/fonts/AvenirNext-Regular.ttf');
}

@font-face {
    font-family: avenir;
    src: url('https://sleepshepherd.com/css/fonts/AvenirNext-Bold.ttf');
	font-weight: bold;
}

@font-face {
    font-family: avenir;
    src: url('https://sleepshepherd.com/css/fonts/AvenirNext-Heavy.ttf');
	font-weight: 900;
}

@font-face {
    font-family: avenir;
    src: url('https://sleepshepherd.com/css/fonts/AvenirNext-Medium.ttf');
	font-weight: 500;
}

@font-face {
    font-family: baruta;
    src: url('https://sleepshepherd.com/css/fonts/RNS-B.ttf');
}

.inner-slide header {
    display: none;
}



h1, h2, h3, h4, h5,  p , div, span{
	font-family: ;
	font-family: 'avenir', sans-serif !important;
}

.subscribe p{
	line-height: 25px;
}

section.white{
	background-color: #FFF !important;
}

section.blue{
	background-color: #03172a !important;
}

section.dark-blue{background: #03172a;}

header{
	background-color: #03172a !important;
}

.navbar-nav{
	background-color: transparent !important;
}

.align-right{
	text-align: right !important;
}

.align-left{
	text-align: left !important;
}

.align-center{
	text-align: center !important;
}

a {
	cursor: pointer;
}

.margin-vertical{
	margin-top: 50px !important;
	margin-bottom: 50px !important;
}

.vertAlignMiddle{
  display: inline-block;
  width: 0px;
  height: 100%;
  vertical-align: middle;
  background-color: yellow;
}

.roundBtn.dark{
	border-color: #03172a;
	color: #33495d;
}

.roundBtn.dark:hover{
	border-color: #03172a;
	background-color: #03172a;
	color: #FFF !important;
	cursor: pointer;
}

#press-panel img {
    width: 17%;
	margin: 1%;
}

section.darkgray{
	background: #3d3d3d;
}

#intro-new{
	background-image: url('https://sleepshepherd.com/wp-content/uploads/2016/09/Bg-DEsktop.png');
    height: 650px;
    background-position: center 65%;
	background-size: cover;
	margin-top: -20px; /* for covering up phantom section at top of page */
}

#intro-new .container{
	height: 100%;
	width: 100%;
	max-width: 100%;
}

#intro-new .word-container{
	display:inline-block;
	text-align:center;
	vertical-align: middle;
	margin: 0px;
	width: 50%;
}

#intro-new h1{
	color: #72bfe7;
	font-size: 40px !important;
	margin-top: 0 !important;
	margin-bottom: 25px !important;
}

#intro-new h1:after{
	height: 0;
}


#benefits img{
	height: 80px;
	margin: 40px;
}

#benefits img.medium{
	height: 90px;
	margin: 35px;
}

#benefits img.small{
	height: 50px;
	margin: 55px;
}

#benefits p{
	line-height: 18px;
}

#benefits .large{
	font-size: 18px;
}

.page-id-3363 section.no-padding{
	padding-top: 0;
	padding-bottom: 0;
}

#sleepimprovement{
	height: 400px;
}



#sleepimprovement p{
	color: #fbe372;
	text-transform: uppercase;
	font-size: 50px;
	font-weight: 900;
	line-height: 300px;
	text-align:right;
}

#sleepimprovement-main #video-container {
    width: 75%;
    margin: 0 auto;
}

#sleepimprovement-main p{
	font-weight: 600;
}

#sleepimprovement-main .highlight{
	font-weight: 900;
}

#sleepimprovement-main .blue{
	color: #72bfe7;
}

#sleepimprovement-main h1{
	font-size: 50px !important;
	line-height: 55px !important;
	margin-bottom: 10px !important;
	margin-top: 50px !important;
	color: #33495d;
	font-weight: 900;
}

#sleepimprovement-main h1:after{
	height: 0;
}

#sleepimprovement-main h2{
	font-size: 25px;
	line-height:30px;
	font-weight: 900;
	color: #72bfe7;
	text-transform: uppercase;
}

#sleepimprovement-main h3{
	font-size: 30px;
	line-height:50px;
	color: #72bfe7;
	text-transform: uppercase;
	margin-top: 0;
}

#sleepimprovement-main .quote{
	font-size: 30px;
	line-height: 30px;
	font-weight: 900;
	text-transform: uppercase;
}

#sleepimprovement-main .quote-author{
	font-size: 20px;
	font-weight:900;
	text-transform: uppercase;
}

#sleepimprovement-main .table{
	display: table;
}

#sleepimprovement-main .table-cell{
	display: inline-block;
}

#sleepimprovement-main .width-100{
	width: 100%;
}

#sleepimprovement-main .width-33{
	width: 33%;
}

#sleepimprovement-main .width-66{
	width: 66%;
}

#sleepimprovement-main .width-55{
	width: 55%;
}

#sleepimprovement-main .width-45{
	width: 45%;
}

#sleepimprovement-main .vert-middle{
	vertical-align: middle;
}

#sleepimprovement-main img{
	width: 60%;
}

#sleepimprovement-main a.buy:hover{
	border-color: #FF9232 !important;
}

#quote-title{
	padding: 25px;
	text-align: center;
}

#quote-title p{
	color: #33495d;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 50px;
    line-height: 60px;
    margin: 0;
}

#quote-title .blue{
	color: #72bfe7;
}

/* Say Hello Panel*/
#bg-main-5 .container{
	padding-top: 20px;
}
#bg-main-5 img{
	width: 100px;
	height: 100px;
	margin-left: 75px;
}
#bg-main-5 .store-logo-container{
	width: 50%;
	text-align:right;
}

#bg-main-5 img.store-logo{
	/* width: 200px;
	height: auto;   */
	height: 49.5px;
	width: auto;
	margin:20px;
}

#bg-main-5 a:nth-child(2) img.store-logo{
	height: 75px;
	margin-right: -13px;
	margin-left: 0;
}

#bg-main-5 .inline-block{
	font-size: 30px;
	font-weight: 900;
	color: #fbe372;
	text-transform: uppercase;
	vertical-align: top;
	line-height: 100px;
}

#bg-main-5 .word-container{
	margin-top: 150px;
	width: 50%;
	border-bottom: 8px solid #72bfe7;
	text-align:right;
}

#bg-main-5 .store-logo-container {
    width: 50%;
    text-align: right;
}

#bg-main-5 p{
	font-size: 25px;
	line-height: 30px;
	font-weight: 500;
	text-transform: none;
}

#bg-main-5 p.large{
	font-size: 65px;
	line-height:65px;
	text-transform: uppercase;
}

#bg-main-5 .yellow{
	color: #fbe372;
}

#bg-main-5 .blue{
	color: #72bfe7;
}

/* Train your Brain Panel */


#bg-main-6 img{
	width: 100px;
	/* margin-left: 50%; */
}

#bg-main-6 .inline-block{
	font-size: 28px;
	font-weight: 900;
	color: #fbe372;
	text-transform: uppercase;
	margin-left: 50%;
}

#bg-main-6 .word-container{
	display: inline-block;
	text-align: left;
	margin-left: 50%;
	margin-top: 220px;
	border-bottom: 0px solid #fbe372;
}

#bg-main-6 .roundBtn{
	color: #72bfe7;
	border: 2px solid #72bfe7;
	margin-top: 50px
}

#bg-main-6 p{
	font-size: 25px;
	line-height: 30px;
	color: white;
	margin-bottom: 40px;
}

#bg-main-6 .large{
	font-size: 60px;
	line-height: 60px;
	font-weight: 500;
	text-transform: uppercase;
	color: #fbe372;
}

#bg-main-6 .blue{
	color: #72bfe7;
}

#bg-main-6 .yellow{
	color: #fbe372;
}

/* Wake Up Smarter Panel */
#bg-main-4 .roundBtn{
	font-size: 20px;
	line-height: 20px;
	margin-left: 75px;
}

#bg-main-4 img{
	width: 100px;
	height: 100px;
	margin-bottom: 300px;
}
#bg-main-4 .word-container{
	border-left: 5px solid white;
	margin-left: 50px;
	padding-top: 350px;
	padding-left: 20px;
}

#bg-main-4 div.inline-block{
	font-size: 30px;
	font-weight: 900;
	color: #fbe372;
	text-transform: uppercase;
	vertical-align: top;
	line-height: 100px;
}

#bg-main-4 p{
	font-size: 50px;
	line-height: 50px;
	font-weight: 500;
	text-transform: uppercase;
}

#bg-main-4 .large{
	font-size: 60px;
	text-transform: uppercase;
}

#bg-main-4 .yellow{
	color: #fbe372;
}

#bg-main-4 p.small{
	font-size: 26px;
	line-height:32px;
	font-weight: 300;
	margin-bottom: 5px;
	margin-left: 75px;
	text-transform: none;
}


.roundBtn{
	text-decoration: none !important;
}

.roundBtn a:active{
	text-decoration:none !important;
	color: white !important;
}

a.roundBtn{
	text-decoration: none !important;
	font-weight: 900;
	color: white;
	text-transform: uppercase;
	display:inline-block;
}

a.roundBtn:active{
	text-decoration:none !important;
	color: white !important;
}

a.roundBtn:hover,a[rel~="wp-video-lightbox"]:hover,a[rel~="wp-video-lightbox"]:active,a[rel~="wp-video-lightbox"]:visited {
	text-decoration:none !important;
	color: black !important;
	background-color: white;
}

a[rel~="wp-video-lightbox"]{
	text-decoration: none !important;
	text-transform: uppercase;
	background-color: transparent;
    border-radius: 30px;
    border: 2px solid white;
    padding: 10px 30px;
    margin: 10px;
	color: white;
	font-weight: 900;
}

a#lightboxBtn{
	border: 0px;
	display:inline-block;
	padding: 0;
	margin-top: 15px;
	font-weight: 500;
    text-transform: none;
    font-size: 20px;
	text-decoration: none;
	color: white;
}

a#lightboxBtn:Hover{
	border: 0px;
	background: transparent;
	color: #FFF !important;
	opacity: 0.50;
	transition: 250ms;
}

a.buy.roundBtn {
    background: #fbe372;
    color: #FF9232;
    border: 2px solid #fbe372;
}

a.buy.roundBtn:hover {
    background: #FFF;
    border: 2px solid #FFF;
    color: #FF9232 !important;
}



#risk-free p{
	font-weight: 900;
	text-transform: uppercase;
}

#risk-free .blue{
	color: #72bfe7;
}

#risk-free .yellow{
	color: #fbe372;
}

#bg-main{
	margin-top:-20px;
}

#bg-main p{
	display: none;
}



.subscribe .result{
	color: #333 !important;
}

section#blah1{
	background-image: url('https://sleepshepherd.com/wp-content/uploads/2016/02/bedroom-416063.png');
}

section#hover-title{
	background: #a19fac;
}

section#hover-title h1{
	margin-bottom: -50px !important;
	color: white;
}

div.subscribe{
	background: white;
}
section#carouselContainer h1:after{
height: 0;
}

section#carouselContainer h1{
	color: white;
}

section#hover-title h1:after{
background: white;
}

.qe-toggle-title{
	font-size: 16px;
	line-height: 18px;
}

.intro-container .title-container h1:after {
    height: 0;
}

.navbar-nav > li > a:hover{
  color: #ffe56b  !important;
  color: #72bfe7   !important;
  border-bottom: 3px solid #ffe56b ;
  border-bottom: 3px solid #72bfe7 !important ;
}

#carouselContainer,
.section.blue{
    overflow: hidden;
}

section#comparison p {
	margin-bottom: 0 !important;
	line-height: 0 !important;
}

section#comparison table p {
	margin-bottom: 0 !important;
	line-height: 16px !important;
}




section#faq div, section#faq div{
	color: black;
}

section#faq div ol{
	color: white;
}

section#introduction{
	text-align: center;
}

section#introduction h1{
	color: #33495d !important;
}

section#introduction a{

	display: inline-block;
	margin-top: 30px;
	background-color: transparent;
	background-color: #FFF;
	background-color: #33495d;
	border: 0px solid #2BDE73;
	border-radius: 10px;
	padding: 18px;
	color: #2BDE73;
	color: white;
	font-size: 25px;
	line-height: 30px;
	text-decoration: none;
	transition: 300ms;
}

section#introduction a span{
	font-family: 'baruta' !important;
}

section#introduction h3 span{
	font-family: 'baruta', sans-serif !important;
	text-transform: uppercase;
	color:#2BDE73;
	font-size: 40px;
	text-shadow: 1px 1px #000;
}

section#introduction a:hover{
	background-color: #DDD;
	background-color: #3f5a73;
	border: 0px solid #1db95c;

}

div.metaslider-1849{
	padding:20px;
	background: rgba(255,255,255,0.5);
}

section  ol li{
	list-style: decimal;
	font-size: 16px !important;

}

section#contact-support #contact_map{
	display: none;
}
section.bg-image{
	min-height: 900px;
	height: 900px;
	padding: 0;
}

section.bg-image .container{
	height: 100%;
	max-width: 100%;
	width: 100%;
	background: rgba(0,0,0,0.0);
	padding: 0;
}

section.bg-image ul{
	list-style: disc;
	font-size: 25px;
	line-height: 35px;
}
section.bg-image ul li{
	margin-top: 30px;
}

section.bg-image h1:after{
	height: 0;
}
.navbar-nav li a{
  padding: 15px;
}

.testimonials{
  color:#333;
}

.testimonials h3{
  margin-top:0;
  color: #333;
}

.testimonials blockquote cite{
  color: #333;
}

.testimonials img{
  border-radius: 50%;
}

.bullets{
  margin-bottom: 0;
}

.team img{
  width: 90%;
  border-radius: 50%;
}



.navbar-header a.logo img{

  height: 50px;
}

.navbar-toggle {
	background-color: #3388cc  !important;
}

.navbar-nav li.current-menu-item:before{
	height: 0;
}

.navbar-nav li.menu-item a:hover{
	/* color: #ffe56b !important; */
	color: #fbe372  !important;
	color: #72bfe7   !important;
	background: none !important;

}

.navbar-nav li.current-menu-item a{
	color: #fbe372 !important;
	color: #72bfe7  !important;
	background: none !important;
	border-bottom: 3px solid #ffe56b;
	border-bottom: 3px solid #72bfe7 ;
}

.navbar-nav li.current-menu-item.active a:hover{
	color: #ffe56b !important;
	color: #72bfe7  !important;
	background: none !important;

}

.navbar-nav > li:last-child > a, .navbar-nav > li:last-child > a:focus{
	background: #fbe372;
	color: #FF9232;
    line-height: 20px;
    margin-top: 25px;
    padding: 5px 15px;
    height: auto;
    border-radius: 20px;
}

.navbar-nav > li:last-child > a:hover{
	background: white !important;
	color: #FF9232 !important;
	border: 0px !important;
}

/*------Contact Form stuff ---------*/
div.wpcf7-mail-sent-ok {
    border: 2px solid #72bfe7 !important;
}

div.wpcf7-validation-errors {
    border: 0px solid #f7e700;
    border: 2px solid #398f14 !important;
}

input[type="text"],
input[type="email"],
textarea
{
    background-color: #fff;
    color: #000;
    width: 100%;
}

input[type="submit"].wpcf7-submit{
	background: #72bfe7;
	color: white;
	font-weight: bold;
	border-width: 0px;
	padding: 5px 15px 5px 15px;

}


@media (min-width: 1200px){
  #background-image{
          background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Product-Shot-Compressed.jpg");
          background-repeat: no-repeat;
          background-position: 50% 0%;
          background-position: 165% 0%;
          background-size:1920px;
          background-size:1520px;
		  background-color: #a6a8aa;
          height: 800px;
  }

  #tooltip1{
          top:415px;
          left: 50%;
          margin-left: 150px;

  }

  .asset-about-us-image{
          max-width: 120%;
          position: relative;
          left: -10%;
          margin-bottom: -300px;
  }

  .asset-after-about-us{
          padding-top: 300px;
  }
}

@media (min-width: 800px)and (max-width: 1199px){
  #background-image{

          background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Product-Shot-Compressed.jpg");
          background-repeat: no-repeat;
          background-position: 55% center;
          background-size:1200px;
          height: 500px;
  }
  #tooltip1{
          top:300px;
          left: 50%;
          margin-left: 80px;

  }

  .asset-about-us-image{
          max-width: 110%;
          position: relative;
          left: -5%;
          margin-bottom: -220px;
  }

  .asset-after-about-us{
          padding-top: 220px;
  }
}

@media (min-width: 550px)and (max-width: 799px){
  #background-image{

          background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Product-Shot-Compressed.jpg");
          background-repeat: no-repeat;
          background-position: 55% center;
          background-size:900px;
          height: 350px;
  }

  .asset-about-us-image{
          max-width: 110%;
          position: relative;
          left: -5%;
          margin-bottom: -220px;
  }

  .asset-after-about-us{
          padding-top: 220px;
  }
}




section.black{
  background-color: black;
}

.asset-scalable .container img{
  width:25%;
}

.bottom-align{
  position:absolute;
  bottom:2%;
  left:0;
  width:100%;
}

.top-align{
  position:absolute;
  bottom:20%;
  width:100%;
}

.top-align h1, .top-align h3{
  color: #777;
  color: #33495d;
  margin-bottom: 0;
  text-align: left;
}

.top-align h1:after{
  background: none;
}

.top-align img{
	width: 30%;
}

#clients img{
  width:33%;
  padding: 15px;
}

.blue ul li{
  color: white;
}

#features li{
  float: left;
  width: 16.6%;
  text-align: center;
}



.tooltip{
  display: block;
  position: absolute;
  opacity: 0;
  background-color:blue;
  color:white;
  padding: 10px !important;
  font-size:14px;
  border-radius: 5px;
}

.tooltip-trigger:hover .tooltip{
  opacity: 1;
}

.tooltip.right:after {
bottom: 100%;
left: 50%;
border: solid transparent;
content: " ";
  height: 0;
width: 0;
position: absolute;
pointer-events: none;
border-color: rgba(0, 0, 255, 0);
border-bottom-color: #00F;
border-width: 10px;
margin-left: -10px;
}

.hover-container{
	padding-top: 50px;
	text-align: center;
}

.hover-container > *{
	vertical-align: top;
}

#img1{
	position: absolute;
	padding-top: 8%;
	width: 10%;
	z-index: 1;
	right: 65%;
}
#img2{
	position: absolute;
	padding-top: 5%;
	width: 12%;
	z-index: 2;
	right: 55%;
}
#img3{
	position: absolute;
	padding-top: 2%;
	width: 15%;
	left: 50%;
	margin-left: -7.5%;
	z-index: 3;

}

#img4{
	position: absolute;
	padding-top: 5%;
	width: 12%;
	left: 55%;
	z-index: 2;
}

#img5{
	position: absolute;
	padding-top: 8%;
	width: 10%;
	left: 65%;
	z-index: 1;
}

/* .hover-container img:hover{
	width: 18% !important;
	padding: 0 !important;
	transition: 300ms;
	z-index: 999 !important;
}

#img3:hover{
	width: 18% !important;
	margin-left: -9% !important;
}

#img1:hover{
	margin-right: -4.5%
}

#img2:hover{
	margin-right: -3%
}

#img5:hover{
	margin-left: -4.5%
}

#img4:hover{
	margin-left: -3%
} */

/* .hover-container h1{
	position: absolute;
	display: inline-block;
	top: 2%;
	opacity: 0;
	transition: opacity 300ms;
	width: 100%;
	text-align: center;
  margin-bottom: 0;
} */

/* .hover-container .solid{
	opacity: 1;
	transition: opacity 300ms;
} */

/* #head1{
	right: 70%;
	margin-right: -50%;
}

#head2{
	right: 61%;
	margin-right: -50%;
}

#head3{
	left: 50%;
	margin-left: -50%;
}

#head4{
	left: 61%;
	margin-left: -50%;
}

#head5{
	left: 70%;
	margin-left: -50%;
} */

/* .hover-container p{
	position: absolute;
	display: inline-block;
	width: 25%;
	bottom: 15%;
	bottom: 2.5%;
	margin-bottom: 20px;
	text-align: left;
	opacity: 0;
	transition: opacity 300ms;
} */

/* #p1{
	right: 70%;
  margin-right: -12.5%;
}
#p2{
	right: 61%;
  margin-right: -12.5%;
}
#p3{
	left: 50%;
	margin-left: -12.5%;
}
#p4{
	left: 61%;
  margin-left: -12.5%;
}
#p5{
	left: 70%;
  margin-left: -12.5%;
} */

#hover-img-container{
	height: 230px;
}

#carouselContainer{
	padding: 0;
}

#carouselContainer .container.compact{
	max-width: 100%;
	height:1000px;
	background-color: #bfc3c9;
}

div.slick-image-slide.slick-slide:focus{
	outline: 0px !important
}

section#alarm{
	background-image: url("https://sleepshepherd.com/wp-content/uploads/2016/02/bedroom-416063.jpg");
	background-repeat: no-repeat;
	background-position: 50% center;
	background-size:100%;
	height: 700px;
	margin-top: 100px;
}

section#alarm img{
	position: absolute;
	width: 30%;
	left: 50%;
	bottom: 0;
	margin-left: -15%;
}

div.services .arrow{
	opacity: 0;
}

.services .item .graphic{
	background: none !important;
}

.services .item h2{
	width: 150%;
	margin-left: -25%;
	font-size: 20px !important;
}

section.blue div{
	color: white;
}

section.blue ul li{
	list-style-type: disc;
}

#brainwaveLabel{
	position: absolute;
	display: inline-block;
	left: 52%;
	top: 30%;
	width: 10%;
}

#toneLabel{
	position: absolute;
	display: inline-block;
	left: 52%;
	top: 55%;
	width: 10%;
}

section#comparison table{
	width: 100%;
	font-size: 20px;
	color: #33495d;

}


section#comparison table tr th,section#comparison table tr td{
	padding: 1%;
	text-align: center;
}

section#comparison table tr th:nth-child(1),section#comparison table tr td:nth-child(1){
	text-align: left;
}

table td{
	border: 3px solid white;
}

table td:first-child{
	border-left: 0px;
}

table th{
	border-right: 3px solid white;
	border-left: 3px solid white;
}
table th:first-child{
	border-left: 0px;
}



h1 a, h1 a:hover{
	text-decoration: none;
	color: inherit;
}

@media (max-width: 319px){
#instructions{
		display: none;
	}
  /* #background-image{
          background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2015/11/lambo_sesto_elemento_315-wallpaper-3840x2160.jpg" );
          background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/SS-Headband-USB-Iso-Full-View.png" );
          background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/SS-Headband-Flat-Front.png");
          background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/SS-Headband-Flat-Front-Zoom-Centered.png");
          background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Render.jpg");
          background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Render.png");
          background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Product-Shot-Compressed.jpg");
          background-repeat: no-repeat;
          background-position: 55% center;
          background-size:550px;
          height: 300px;
  } */

	#background-image{
		  background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Product-Shot-Compressed.jpg");
		  background-repeat: no-repeat;
		  background-position: 50% 190px;
		  background-size:500px;
		  background-color: #bdbcc5;
		  height: 450px;
	}

	div{
		font-size: 12px;
		line-height: 15px;
	}

	ul{
		line-height: 18px;
	}

	h1{
		font-size: 20px !important;
		line-height: 30px !important;
		text-align: center !important;
		height: 30px !important;
		margin-bottom: 20px !important;
	}

	.services .item h2{
		font-size: 18px !important;
	}

	.top-align{
		top: 10px;
		left: 0;
		text-align: center;
	}

	.top-align h1{
		margin-bottom: 0 !important;
	}

	.top-align img{
		width: 70%;
	}

	.services .item div.content{
		font-size: 12px;
	}

	.services .item .graphic,.services .item .graphic  > img{
		width: 150px !important;
		height: 150px !important;
	}

	.services .item .graphic {
		margin-bottom: 20px !important;
	}
	.services .item .graphic > .hover{
		background-size: 145px !important;
		background-position: 3px 1px !important;
	}

	div.services  .arrow{
		height: 0px;
	}

	.hover-container{
		padding-top: 0px;
		text-align: center;
	}

	.hover-container > *{
		vertical-align: top;
	}

	#img1{
		position: absolute;
		padding-top: 8%;
		width: 22%;
		z-index: 1;
		right: 68%;
	}
	#img2{
		position: absolute;
		padding-top: 5%;
		width: 25%;
		z-index: 2;
		right: 55%;
	}
	#img3{
		position: absolute;
		padding-top: 3%;
		width: 27%;
		left: 50%;
		margin-left: -13.5%;
		z-index: 3;

	}

	#img4{
		position: absolute;
		padding-top: 5%;
		width: 25%;
		left: 55%;
		z-index: 2;
	}

	#img5{
		position: absolute;
		padding-top: 8%;
		width: 22%;
		left: 68%;
		z-index: 1;
	}

	.hover-container img{
		transition: 300ms;

	}

	/* .hover-container img:hover{
		width: 30% !important;
		padding: 0 !important;
		transition: 300ms;
		z-index: 999 !important;
	}

	#img3:hover{
		width: 30% !important;
		margin-left: -15% !important;
	}

	#img1:hover{
		margin-right: -2.5%
	}

	#img2:hover{
		margin-right: -3%;
	}

	#img4:hover{
		margin-left: -3%;
	}

	#img5:hover{
		margin-left: -2.5%
	} */



	/* .hover-container h1{
		position: absolute;
		display: inline-block;
		top: 7%;
		opacity: 0;
		transition: opacity 300ms;
		width: 100%;
		text-align: center;
		margin-bottom: 0;
		font-size: 20px;
		line-height: 25px;
		height: 25px;
	} */

	.hover-container h1{
		position: relative;
		display: block;

		opacity: 1;
		transition: opacity 300ms;
		width: 100%;
		text-align: center;
		margin-bottom: 0;
		font-size: 20px;
		line-height: 25px;
		height: 25px;
	}

	.hover-container .solid{
		opacity: 1;
		transition: opacity 300ms;
	}

	 #head1{
		/* right: 70%;
		right: 50%;
		margin-right: -50%; */
		display: none;
	}

	#head2{
		/* right: 61%;
		right: 50%;
		margin-right: -50%; */
		display: none;
	}

	#head3{
		/* left: 50%;
		margin-left: -50%; */
		display: none;
	}

	#head4{
		/* left: 61%;
		left: 50%;
		margin-left: -50%; */
		display: none;
	}
/*
	#head5{
		left: 70%;
		left: 50%;
		margin-left: -50%;
	} */

	/* .hover-container p{
		position: absolute;
		display: inline-block;
		width: 100%;
		bottom: 15%;
		bottom: 0%;
		margin-bottom: 20px;
		text-align: center;
		opacity: 0;
		transition: opacity 300ms;
		font-size: 12px;

	} */

	.hover-container p{
		position: relative;
		display: block;
		width: 100%;
		margin-top: 0px;
		margin-bottom: 20px;
		text-align: left;
		opacity: 1;
		transition: opacity 300ms;
		font-size: 12px;

	}

	/* #p1{
		right: 70%;
		right: 50%;
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p2{
		right: 61%;
		right: 50%;
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p3{
		left: 50%;
		margin-left: -12.5%;
		margin-left: -50%;
	}
	#p4{
		left: 61%;
		left: 50%;
	  margin-left: -12.5%;
	  margin-left: -50%;
	}
	#p5{
		left: 70%;
		left: 50%;
	  margin-left: -12.5%;
	  margin-left: -50%;
	} */

	#carouselContainer{
		padding: 0;
	}

	#carouselContainer .container.compact{
		max-width: 100%;
		height:500px;
		background-color: #bfc3c9;
	}

	section#alarm{
		background-image: url("https://sleepshepherd.com/wp-content/uploads/2016/02/bedroom-416063.jpg");		background-repeat: no-repeat;
		background-position: 50% center;
		background-size:200%;
		background-size:711px 400px;
		height: 400px;
		margin-top:0;
	}

	section#alarm img{
		position: absolute;
		width: 100%;
		left: 50%;
		bottom: 0;
		bottom: -150px;
		margin-left: -45%;
	}

	section#how-it-works{

	}

	#brainwaveLabel{
		position: absolute;
		display: inline-block;
		left: 0%;
		top: 16%;
		width: 100%;
		text-align:center;
	}

	#toneLabel{
		position: absolute;
		display: inline-block;
		left: 0%;
		top: 53%;
		width: 100%;
		text-align:center;

	}

	section#how-it-works ul{
		margin-top: 0px;
	}

	section#how-it-works img{
		margin-top: 25px;
		margin-bottom: 25px;

	}

	section#comparison table{
	width: 100%;
	font-size: 20px;
	color: #33495d;

}

	section#comparison table tr th,section#comparison table tr td{
		padding: 1%;
		font-size: 12px;
	}

	section#comparison table img{
		width: 35%;
	}



}

@media (min-width: 0px) and (max-width: 374px){ /*-- iPhone 4/5 and smaller (was 320px min)--*/
	#intro-new .container{
		padding: 0;
	}

	#intro-new .row{
		margin-left: 0;
		margin-right: 0;
	}

	#intro-new h3{
		font-size: 18px;
		margin-bottom: 0;
	}
	img.retailer-logo{
		height: 40px;
		margin: 10px;
	}

	.benefit-description {
		width: 90% !important;
		font-size: 14px;
	}

	#benefits img{
		height: 60px;
		margin: 40px;
	}

	#benefits img.medium{
		height: 50px;
		margin: 45px;
	}

	#benefits img.small{
		height: 30px;
		margin: 55px;
	}

	#instructions{
		display: none;
	}

	#background-image{
		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Product-Shot-Compressed.jpg");
		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Solo-Headband-2-min-Compressed.png");

		background-repeat: no-repeat;
		background-position: 50% 210px;
		background-size:300px;
		background-color: #bdbcc5;
		height: 450px;
	}

	div{
		font-size: 11px;
		line-height: 13px;
	}

	ul{
		line-height: 18px;
	}

	h1{
		font-size: 20px !important;
		line-height: 30px !important;
		text-align: center !important;
		height: 30px !important;
		margin-bottom: 20px !important;
	}

	.services .item h2{
		font-size: 18px !important;
	}

	.top-align{
		top: 10px;
		left: 0;
		text-align: center;
	}

	.top-align h1{
		margin-bottom: 0 !important;
	}

	.top-align img{
		width: 70%;
	}

	.services .item div.content{
		font-size: 13px;
	}

	.services .item .graphic,.services .item .graphic  > img{
		width: 150px !important;
		height: 150px !important;
	}

	.services .item .graphic {
		margin-bottom: 20px !important;
	}
	.services .item .graphic > .hover{
		background-size: 145px !important;
		background-position: 3px 1px !important;
	}

	div.services  .arrow{
		height: 0px;
	}

	.hover-container{
		padding-top: 10px;
		text-align: center;
	}

	.hover-container > *{
		vertical-align: top;
	}

	#img1{
		position: absolute;
		padding-top:25px;
		width: 22%;
		width: 70px;
		z-index: 1;
		right: 68%;
		right: calc(50% + 80px);
	}
	#img2{
		position: absolute;
		padding-top: 16px;
		width: 16px;
		width: 80px;
		z-index: 2;
		right: 55%;
		right: calc(50% + 20px);
	}
	#img3{
		position: absolute;
		padding-top: 10px;
		width: 27%;
		width: 86px;
		left: 50%;
		margin-left: -43px;
		z-index: 3;

	}

	#img4{
		position: absolute;
		padding-top: 16px;
		width: 25%;
		width: 80px;
		left: 55%;
		left: calc(50% + 20px);
		z-index: 2;
	}

	#img5{
		position: absolute;
		padding-top: 25px;
		width: 22%;
		width: 70px;
		left: 68%;
		left: calc(50% + 80px);
		z-index: 1;
	}

	.hover-container img{
		transition: 300ms;

	}







/* 	.hover-container h1{
		position: absolute;
		display: inline-block;
		top: 7%;
		opacity: 0;
		transition: opacity 300ms;
		width: 100%;
		text-align: center;
		margin-bottom: 0;
		font-size: 20px;
		line-height: 25px;
		height: 25px;
	}

	.hover-container .solid{
		opacity: 1;
		transition: opacity 300ms;
	}

	#head1{
		right: 70%;
		right: 50%;
		margin-right: -50%;
	}

	#head2{
		right: 61%;
		right: 50%;
		margin-right: -50%;
	}

	#head3{
		left: 50%;
		margin-left: -50%;
	}

	#head4{
		left: 61%;
		left: 50%;
		margin-left: -50%;
	}

	#head5{
		left: 70%;
		left: 50%;
		margin-left: -50%;
	} */

	.hover-container h1{
		position: relative;
		display: block;

		opacity: 1;
		transition: opacity 300ms;
		width: 100%;
		text-align: center;
		margin-bottom: 0;
		font-size: 20px;
		line-height: 25px;
		height: 25px;
	}

	.hover-container .solid{
		opacity: 1;
		transition: opacity 300ms;
	}

	 #head1{
		/* right: 70%;
		right: 50%;
		margin-right: -50%; */
		display: none;
	}

	#head2{
		/* right: 61%;
		right: 50%;
		margin-right: -50%; */
		display: none;
	}

	#head3{
		/* left: 50%;
		margin-left: -50%; */
		display: none;
	}

	#head4{
		/* left: 61%;
		left: 50%;
		margin-left: -50%; */
		display: none;
	}

	#head5{

		display: none;
	}

	#head6{
		margin-top: 5px;
		margin-bottom: 0px !important;
	}


	/* .hover-container p{
		position: absolute;
		display: inline-block;
		width: 100%;
		bottom: 15%;
		bottom: -1%;
		margin-bottom: 20px;
		text-align: center;
		opacity: 0;
		transition: opacity 300ms;
		font-size: 13px;

	} */

	.hover-container p{

		margin-bottom: 5px;
		text-align: center;
		font-size: 12px;

	}
/*
	#p1{
		right: 70%;
		right: 50%;
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p2{
		right: 61%;
		right: 50%;
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p3{
		left: 50%;
		margin-left: -12.5%;
		margin-left: -50%;
	}
	#p4{
		left: 61%;
		left: 50%;
	  margin-left: -12.5%;
	  margin-left: -50%;
	}
	#p5{
		left: 70%;
		left: 50%;
	  margin-left: -12.5%;
	  margin-left: -50%;
	} */

	#carouselContainer{
		padding: 0;
	}

	#carouselContainer .container.compact{
		max-width: 100%;
		height:375px;
		background-color: #bfc3c9;
		padding-right: 5px;
		padding-left: 5px;
	}
	#hover-img-container{
		height: 200px;
	}

	section#alarm{
background-image: url("https://sleepshepherd.com/wp-content/uploads/2016/02/bedroom-416063.jpg");		background-repeat: no-repeat;
		background-position: 50% center;
		background-size:200%;
		background-size:711px 400px;
		height: 400px;
		margin-top:0;
	}

	section#alarm img{
		position: absolute;
		width: 100%;
		left: 50%;
		bottom: 0;
		bottom: -150px;
		margin-left: -45%;
	}

	section#how-it-works{
		text-align:center;
	}

	#brainwaveLabel2{
		width: 90%;
		text-align:center;
		margin: 0 auto;
		color: #5b99b9;
	}

	#toneLabel2{
		width: 90%;
		text-align:center;
		margin: 0 auto;
		margin-bottom: 10px;
		color: #5b99b9;
	}

	section#how-it-works ul{
		margin-top: 0px;
		text-align: left;
	}

	section#how-it-works img{
		margin-top: 5px;
		margin-bottom: 5px;
		width: 90%;
	}

	section#comparison .container{
		padding-right: 5px;
		padding-left: 5px;

	}

	section#comparison table{
		width: 100%;
		font-size: 20px;
		color: #33495d;
		table-layout: fixed;
	}

	section#comparison table tr th,section#comparison table tr td{
		padding: 1%;
		font-size: 10px;
	}

	section#comparison table img{

	}

	section#comparison table tr:first-child{
		vertical-align: bottom;
	}
	section#comparison table tr:first-child p{
		margin-bottom: 0;
	}

	section.bg-image{
		min-height: 400px ;
		height: 400px ;
	}

	section.bg-image div.container div:nth-child(2){
		width: calc(100% - 10px) !important;
		padding: 0 !important;
	}

	section.bg-image div.container div:nth-child(2) img{
		width: 100px !important;
	}

	section.bg-image div.container div:nth-child(2) ul{
		font-size: 12px !important;
		line-height: 15px;
	}

		/*-------------------------------------------------*/
	/* New Landing
	/*-------------------------------------------------*/
	#bg-main {
		min-height:200px;
		height: 200px;
	}
	.vertAlign{
	  display: inline-block;
	  width: 0px;
	  height: 100%;
	  vertical-align: bottom;
	  background-color: yellow;
	}
	#bg-main .bottomAlign{
	  display:inline-block;
	  vertical-align: bottom;
	  background-color: none;
	  margin-bottom: 5px;
	}

	#bg-main .bottomAlign h1{
	   font-size: 25px !important;
	   margin-bottom: 5px !important;
	   font-weight: 500;
	   text-transform: capitalize;
	   font-variant: small-caps;
	   color:#72bfe7;
	}

	#bg-main .bottomAlign h1.small{
	   font-size: 15px !important;
	   font-weight: 900 !important;
	   margin-bottom: 5px !important;
	}

	#bg-main .bottomAlign h4{
	   font-size: 12px !important;
	   font-weight: 600 !important;
	   text-transform: none !important;
	color: white;
	margin-bottom: 0 !important;
	margin-top: 10px !important;
	font-variant: small-caps;
	}

	#bg-main .leftPadding p{
		display:block !important;
		text-transform: uppercase;
		font-size: 6.8px;
		font-weight: 300;
		margin-bottom: 0;
	}

	#bg-main .bottomUnderline{
	  border-bottom: 3px solid white;
	display:inline-block;

	}

	#bg-main .bottomAlign .leftPadding{
	  padding-left: 5px !important;
	}

	#bg-main .bottomAlign .smallLeftPadding{
	  padding-left: 20px !important;
	  margin-top: 5px;
	}

	#bg-main .buttonContainer{
		margin-top: 10px;
		margin-bottom: 10px;
	}

	a[rel~="wp-video-lightbox"] {

		padding: 5px 20px;

	}

	.yellow{
	   color: #fbe372 !important;
	}

	.bold{
	   font-weight: bold !important;
	}

	h1.leftAlign{
		text-align: left !important;
	}

	#bg-main img.featuredInImg{
	width: 50px !important;
	}

	#bg-main div.container div:nth-child(2){
		width: auto !important;
	}


	.roundBtn{
		background-color: transparent;
		border-radius: 20px;
		border: 2px solid white;
		padding: 5px 20px;
		margin: 5px;

	}

	.roundBtn a{
		text-decoration: none;
		color: white;
		font-size: 10px;
		font-weight: bold;
	}

	.roundBtn:hover{
		background-color: white;
	}

	.roundBtn:hover a{
		color: black;
		text-decoration: none;
	}

	.roundBtn.blue {
		background-color: #72bfe7;
		border: 2px solid #72bfe7;
	}

	.roundBtn.blue:hover{
		background-color: white;
		border: 2px solid #fff;
	}

	.roundBtn.blue:hover a{
		color: black;
	}

	/*-------------------------------------------------*/
	/*-------------------------------------------------*/

	.padding{
		padding: 15px;
	}

	.inline-block{
		display: inline-block;
	}

	/*Sleep Solved Panel*/
	#bg-main-3{
		min-height: 400px;
		height: 400px;
	}

	#bg-main-3 #word-container{
		float: left;
		padding-right: 5px;
	}

	#bg-main-3 p{
		color: #72bfe7;
		font-weight: 800;
		font-size: 8.5px;
		line-height: 12px;
		text-transform: uppercase;
		margin-top: 10px;
	}

	#bg-main-3 p.large{
		font-size: 25px;
		margin-bottom: 5px;
	}

	#bg-main-3 p span.dark{
		color: #33495d;
	}

	#bg-main-3 a{
		font-size: 12px;
		font-weight: bold;
		text-decoration:none;
		padding: 8px 24px;
		color: #33495d;
		border: 2px solid #33495d;
		border-radius: 20px;
		text-transform: uppercase;
	}

	#bg-main-3 a:hover{
		background-color: #33495d;
		color: white;
	}

	#bg-main-3 div.line{
		width: auto !important;
		overflow:hidden;
		height: 4px;
		background-color: #72bfe7;
		margin-top: 71px;

	}

	/* Say Hello Panel*/
	#bg-main-5 .container{
		padding-top: 20px;
	}
	#bg-main-5 img{
		width:50px;
		margin-left: 5px;
	}

/* 	#bg-main-5 .store-logo-container{
		text-align: center;
	} */

	#bg-main-5 img.store-logo {
		height: 27px;
		width: auto;
		margin: 0 5px;
	}

	#bg-main-5 a:nth-child(2) img.store-logo {
		height: 40px;
		margin-right: -6px;
		margin-left: 0;
	}

	#bg-main-5 .inline-block{
		font-size: 14px;
		vertical-align: top;
		line-height:60px;
		width: auto !important;
	}


	#bg-main-5 .inline-block{
		font-size: 14px;
		vertical-align: top;
		line-height:50px;
		width: auto !important;
	}
	#bg-main-5{
		min-height: 350px;
		height:350px
	}

	#bg-main-5 .word-container{
		margin-top: 40px;
		width: 60% !important;
		border-bottom: 4px solid #72bfe7;
		text-align:right;
	}

	#bg-main-5 p{
		font-size: 8px;
		line-height: 12px;
		margin-bottom: 5px;
	}

	#bg-main-5 p.large{
		font-size: 15px;
		line-height:20px;
	}

	#bg-main-5 .store-logo-container {
		width: 100%;
		text-align: center;
	}

	/* Wake Up Smarter Panel */
	#bg-main-4{
		min-height: 300px;
		height: 300px;
	}

	#bg-main-4 .roundBtn{
		font-size: 10px;
		line-height: 15px;
		margin-left: 23px;
		padding: 5px 20px;
	}

	#bg-main-4 img{
		width: 50px;
		margin-bottom: 65px;
	}
	#bg-main-4 .word-container{
		border-left: 3px solid white;
		margin-left: 10px;
		padding-top: 100px;
		padding-left: 10px;
	}

	#bg-main-4 div.inline-block{
		width: auto !important;
		font-size: 14px;
		line-height: 50px;
	}

	#bg-main-4 p{
		font-size: 10px;
		line-height: 15px;
		font-weight: 900;
	}

	#bg-main-4 .large{
		font-size: 14px;
	}

	#bg-main-4 .yellow{
	}

	#bg-main-4 p.small{
		font-size: 11px;
		line-height:14px;
		margin-bottom: 5px;
		margin-left: 23px;
	}

	/* Quotes Panel */
	#bg-main-2{
		min-height: 600px;
		height: 600px;
	}

	#bg-main-2 .container{
		text-align: center;
	}
	#bg-main-2 img:nth-child(2){
		width: 60%;
		width: 170px;
		margin-top: 30px;
	}

	#bg-main-2 img:nth-child(3){
		width: 95%;
		width: 275px;
	}

	#bg-main-2 img:nth-child(5){
		width: 80%;
		width: 230px;
		margin-top: 15px;
	}

	#bg-main-2 img:nth-child(6){
		width: 70%;
		width: 200px;
	}

	#bg-main-2 img:nth-child(8){
		width: 80%;
		width: 230px;
		margin-top: 10px;
	}

	#bg-main-2 img:nth-child(9){
		width: 90%;
		width: 255px;
	}

	#bg-main-2 img:nth-child(11){
		width: 85%;
		width: 240px;
	}

	#bg-main-2 img:nth-child(12){
		width: 90%;
		width: 255px;
	}

	/* New Features mini-panel */
	#new-features{
		background-color: #03172a ;
		padding: 10px 0;
	}

	#new-features .feature-block{
		display: inline-block;
		width: 100%;
		text-align: center;
		vertical-align: top;
	}

	#new-features .feature-block p{
		font-weight: 900;
		text-transform: uppercase;
		color: white;
		margin-bottom: 5px;
	}

	#new-features .feature-block p.large{
		font-size: 12px;
		line-height: 12px;
		color: #fbe372;
	}

	#new-features img{
		width: 70px;
		margin: 5px;
	}

	/* Train your Brain Panel */

	#bg-main-6 .container img{
		width: 50px !important;
		margin-top:10px
	}

	#bg-main-6 .inline-block{
		font-size: 14px;
		width: 120px;
		vertical-align: middle;
		margin-left: 30%;
		margin-top: 10px;
	}

	#bg-main-6{
		min-height: 350px;
		height: 350px;
	}

	#bg-main-6 .word-container{
		margin-left: 37%;
		margin-top: 70px;
		border-bottom: 0px solid #fbe372;
	}

	#bg-main-6 .roundBtn {
		border: 2px solid #72bfe7;
		margin-top: 0px;
	}

	#bg-main-6 .roundBtn:hover {
		border: 2px solid white;
	}

	#bg-main-6 p{
		font-size: 10px;
		line-height: 15px;
		margin-bottom: 20px;
	}

	#bg-main-6 .large{
		font-size: 16px;
		line-height: 16px;
	}


	/* Risk Free Panel*/
	#risk-free{
		padding: 15px 0;
	}
	#risk-free p{
		font-size: 10px;
		line-height: 12px;
	}
	#risk-free p.large{
		font-size: 12px;
		line-height: 14px;
	}

	#risk-free a.btn{
		padding: 5px 20px;
		font-size: 13px;
		text-transform: uppercase;
		border-radius: 20px;
		text-decoration: none;
		color: #72bfe7;
		border: 2px solid #FFF;
		font-weight: 900;
	}

	#risk-free a.btn:hover{
		background-color: #fff;
	}

	a[rel~="wp-video-lightbox"] {
		border-radius: 20px;
		border: 2px solid white;
		padding: 5px 20px;
		margin: 10px;
	}

	/* What People Are Saying */
	#quote-title p{
		font-size: 18px;
		line-height: 25px;
		text-align: center;
	}

	/* Sleep Improvement page */
	#sleepimprovement{
		height: 200px;
	}

	#sleepimprovement p{
		line-height: 100px;
		font-size: 20px;
	}

	#sleepimprovement-main h1{
		font-size: 15px !important;
		line-height: 18px !important;
		height: 18px !important;
		margin-bottom: 0 !important;
		margin-top: 20px !important;
	}

	#sleepimprovement-main h2{
		font-size: 18px !important;
		line-height: 18px !important;
	}

	#sleepimprovement-main h3{
		font-size: 15px !important;
		line-height: 18px !important;
		margin-bottom: 0;
	}

	#sleepimprovement-main .margin-vertical{
		margin-top: 10px !important;
		margin-bottom: 10px !important;
	}

	#sleepimprovement-main .quote{
		font-size: 20px ;
		line-height: 20px;
	}

	#sleepimprovement-main .quote-author{
		font-size: 15px ;
	}

	#sleepimprovement-main img{
		width: 50%;
	}

	#sleepimprovement-main img.full{
		width:100%;
	}

	#sleepimprovement-main .width-33,
	#sleepimprovement-main .width-66,
	#sleepimprovement-main .width-45,
	#sleepimprovement-main .width-55{
		width: 100%;
	}

	#intro-new {
		background-image: url('https://sleepshepherd.com/wp-content/uploads/2016/09/mobile-BG.png');
		height: 675px;
		background-position: center bottom;
		background-size: cover;
		margin-top: -20px;
		/* text-align: center; */
	}

	#intro-new .container{
		text-align: center !important;
	}

	#intro-new .word-container {
		width: 99%;
	}

	#intro-new h1{
		font-size: 17px !important;
	}

	#intro-new p{
		font-size: 10.5px;
		line-height: 15px;
	}

	a#lightboxBtn{
		font-size: 16px;
	}

	a#lightboxBtn img{
		width: 40px;
	}

	.navbar-nav > li:last-child > a, .navbar-nav > li:last-child > a:focus{
		border-radius: 0 !important;
	}

	.vertAlignMiddle {
		vertical-align: top;
	}

}/*END 0 to 374px*/

@media (min-width: 375px) and (max-width: 414px){ /*-- iPhone 6/6 Plus --*/

	#intro-new .container{
		padding: 0;
	}

	#intro-new .row{
		margin-left: 0;
		margin-right: 0;
	}

	#intro-new h3{
		font-size: 18px;
		margin-bottom: 0;
	}
	img.retailer-logo{
		height: 60px;
		margin: 10px;
	}

	#intro-new .col-xs-6:nth-child(4) img.retailer-logo{
		width: calc(100% - 20px);
		height: auto;
	}


	.benefit-description {
		width: 80% !important;
		font-size: 16px;
	}

	#benefits img{
		height: 60px;
		margin: 40px;
	}

	#benefits img.medium{
		height: 50px;
		margin: 45px;
	}

	#benefits img.small{
		height: 30px;
		margin: 55px;
	}

	#instructions{
		display: none;
	}


  #background-image{
		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Product-Shot-Compressed.jpg");

		background-repeat: no-repeat;
		background-position: 50% 210px;
		background-size:500px;
		background-color: #bdbcc5;
		height: 530px;

		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Solo-Headband-min-Compressed.png");
		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Solo-Headband-2-min-Compressed.png");
		background-repeat: no-repeat;
		background-position: 50% 240px;
		background-size:350px;
		background-color: #bdbcc5;
	}

	div{
		font-size: 13px;
		line-height: 15px;
	}

	ul{
		line-height: 18px;
	}

	h1{
		font-size: 20px !important;
		line-height: 30px !important;
		text-align: center !important;
		height: 30px !important;
		margin-bottom: 20px !important;
	}

	.services .item h2{
		font-size: 18px !important;
	}

	.top-align{
		top: 10px;
		left: 0;
		text-align: center;
	}

	.top-align h1{
		margin-bottom: 0 !important;
	}

	.top-align img{
		width: 70%;
	}

	.services .item div.content{
		font-size: 13px;
	}

	.services .item .graphic,.services .item .graphic  > img{
		width: 150px !important;
		height: 150px !important;
	}

	.services .item .graphic {
		margin-bottom: 20px !important;
	}
	.services .item .graphic > .hover{
		background-size: 145px !important;
		background-position: 3px 1px !important;
	}

	div.services  .arrow{
		height: 0px;
	}

	.hover-container{
		padding-top: 10px;
		text-align: center;
	}

	.hover-container > *{
		vertical-align: top;
	}

	#img1{
		position: absolute;
		padding-top: 8%;
		padding-top: 30px;
		width: 22%;
		width: 82px;
		z-index: 1;
		right: 68%;
		right: calc(50% + 100px);
	}
	#img2{
		position: absolute;
		padding-top: 5%;
		padding-top: 19px;
		width: 25%;
		width: 93px;
		z-index: 2;
		right: 55%;
		right: calc(50% + 30px);
	}
	#img3{
		position: absolute;
		padding-top: 3%;
		padding-top: 11px;
		width: 27%;
		width: 100px;
		left: 50%;
		margin-left: -50px;
		z-index: 3;

	}

	#img4{
		position: absolute;
		padding-top: 5%;
		padding-top: 19px;
		width: 25%;
		width: 93px;
		left: 55%;
		left: calc(50% + 30px);
		z-index: 2;
	}

	#img5{
		position: absolute;
		padding-top: 8%;
		padding-top: 30px;
		width: 22%;
		width: 82px;
		left: 68%;
		left: calc(50% + 100px);
		z-index: 1;
	}

	.hover-container img{
		transition: 300ms;

	}

	/* .hover-container img:hover{
		width: 30% !important;
		padding: 0 !important;
		transition: 300ms;
		z-index: 999 !important;
	}

	#img3:hover{
		width: 30% !important;
		margin-left: -15% !important;
	}

	#img1:hover{
		margin-right: -2.5%
	}

	#img2:hover{
		margin-right: -3%;
	}

	#img4:hover{
		margin-left: -3%;
	}

	#img5:hover{
		margin-left: -2.5%
	} */



	.hover-container h1{

		opacity: 1;
		width: 100%;
		text-align: center;
		margin-top: 5px;
		margin-bottom: 0px !important;
	}

	.hover-container .solid{
		opacity: 1;
		transition: opacity 300ms;
	}

	#head1{
		right: 70%;
		right: 50%;
		margin-right: -50%;
		display:none;
	}

	#head2{
		right: 61%;
		right: 50%;
		margin-right: -50%;
		display:none;
	}

	#head3{
		left: 50%;
		margin-left: -50%;
		display:none;
	}

	#head4{
		left: 61%;
		left: 50%;
		margin-left: -50%;
		display:none;
	}

	#head5{
		left: 70%;
		left: 50%;
		margin-left: -50%;
		display:none;
	}

	.hover-container p{

		width: 100%;
		text-align: center;
		font-size: 13px;
		margin-bottom: 10px;

	}

	/* #p1{
		right: 70%;
		right: 50%;
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p2{
		right: 61%;
		right: 50%;
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p3{
		left: 50%;
		margin-left: -12.5%;
		margin-left: -50%;
	}
	#p4{
		left: 61%;
		left: 50%;
	  margin-left: -12.5%;
	  margin-left: -50%;
	}
	#p5{
		left: 70%;
		left: 50%;
	  margin-left: -12.5%;
	  margin-left: -50%;
	} */

	#carouselContainer{
		padding: 0;
	}

	#carouselContainer .container.compact{
		max-width: 100%;
		height:415px;
		background-color: #bfc3c9;
	}

	#hover-img-container{
		height: 230px;
	}

	section#alarm{
background-image: url("https://sleepshepherd.com/wp-content/uploads/2016/02/bedroom-416063.jpg");		background-repeat: no-repeat;
		background-position: 50% center;
		background-size:200%;
		background-size:711px 400px;
		height: 400px;
		margin-top:0;
	}

	section#alarm img{
		position: absolute;
		width: 50%;
		left: 50%;
		bottom: 0;
		margin-left: -45%;
	}

	section#how-it-works{
		text-align:center;
	}

	#brainwaveLabel2{

		width: 80%;
		margin: 0 auto;
		text-align:center;
		color: #5b99b9;
	}

	#toneLabel2{

		width: 80%;
		text-align:center;
		margin: 0 auto;
		margin-bottom: 15px;
		color: #5b99b9;
	}

	section#how-it-works ul{
		margin-top: 0px;
		text-align: left;
	}

	section#how-it-works img{
		margin-top: 5px;
		margin-bottom: 5px;
		width: 90%;

	}

	section#how-it-works p{
		font-size: 14px;

	}

	section#comparison .container{
		padding-right: 5px;
		padding-left: 5px;

	}

	section#comparison table{
		width: 100%;
		font-size: 20px;
		color: #33495d;
		table-layout: fixed;
	}

	section#comparison table tr th,section#comparison table tr td{
		padding: 1%;
		font-size: 10px;
	}

	section#comparison table img{

	}

	section#comparison table tr:first-child{
		vertical-align: bottom;
	}
	section#comparison table tr:first-child p{
		margin-bottom: 0;
	}

	section.bg-image{
		min-height: 400px ;
		height: 400px ;
	}

	section.bg-image div.container div:nth-child(2){
		width: calc(100% - 10px) !important;
		padding: 0 !important;
	}

	section.bg-image div.container div:nth-child(2) img{
		width: 100px !important;
	}

	section.bg-image div.container div:nth-child(2) ul{
		font-size: 12px !important;
		line-height: 15px;
	}

	/*-------------------------------------------------*/
	/* New Landing
	/*-------------------------------------------------*/
	#bg-main {
		min-height: 300px;
		height: 300px;
	}
	.vertAlign{
	  display: inline-block;
	  width: 0px;
	  height: 100%;
	  vertical-align: bottom;
	  background-color: yellow;
	}
	#bg-main .bottomAlign{
	  display:inline-block;
	  vertical-align: bottom;
	  background-color: none;
	  margin-bottom: 10px;
	}

	#bg-main .bottomAlign h1{
	   font-size: 25px !important;
	   font-weight: 500 !important;
	   margin-bottom: 0px !important;
	   margin-top: 0px;
	   text-transform: capitalize;
	   color: #72bfe7;
	   font-variant: small-caps;
	}

	#bg-main .bottomAlign h1.small{
	   font-size: 15px !important;
	   margin-bottom: 5px !important;
	}

	#bg-main .bottomAlign h4{
	   font-size: 12px !important;
	   font-weight: 600 !important;
	   text-transform: none !important;
	color: white;
	margin-bottom: 0 !important;
	margin-top: 10px !important;
	font-variant: small-caps;
	}

	#bg-main .leftPadding p{
		display:block !important;
		text-transform: uppercase;
		font-size: 7px;
		font-weight: 300;
		margin-bottom: 0;
	}

	#bg-main .bottomUnderline{
		border-bottom: 3px solid white;
		display:inline-block;
		padding-bottom: 5px;

	}

	#bg-main .bottomUnderline p{
		margin: 0;
	}

	#bg-main .bottomAlign .leftPadding{
	  padding-left: 30px !important;
	}

	#bg-main .bottomAlign .smallLeftPadding{
	  padding-left: 20px !important;
	  margin-top: 5px;
	}

	#bg-main .buttonContainer{
		margin-top: 20px;
		margin-bottom: 20px;
	}

	a[rel~="wp-video-lightbox"] {

		padding: 5px 20px;

	}

	.yellow{
	   color: #fbe372 !important;
	}

	.bold{
	   font-weight: bold !important;
	}

	h1.leftAlign{
		text-align: left !important;
	}

	#bg-main img.featuredInImg{
	width: 70px !important;
	margin: 5px !important;
	}

	#bg-main div.container div:nth-child(2){
		width: auto !important;
	}


	.roundBtn{
		background-color: transparent;
		border-radius: 20px;
		border: 2px solid white;
		padding: 5px 20px;
		margin: 5px;

	}

	.roundBtn a{
		text-decoration: none;
		color: white;
		font-size: 10px;
		font-weight: bold;
	}

	.roundBtn:hover{
		background-color: white;
	}

	.roundBtn:hover a{
		color: black;
		text-decoration: none;
	}

	.roundBtn.blue {
		background-color: #72bfe7;
		border: 2px solid #72bfe7;
	}

	.roundBtn.blue:hover{
		background-color: white;
		border: 2px solid #fff;
	}

	.roundBtn.blue:hover a{
		color: black;
	}

	/*-------------------------------------------------*/
	/*-------------------------------------------------*/

	.padding{
		padding: 15px;
	}

	.inline-block{
		display: inline-block;
	}

	/*Sleep Solved Panel*/
	#bg-main-3{
		min-height: 400px;
		height: 400px;
	}

	#bg-main-3 #word-container{
		float: left;
		padding-right: 5px;
	}

	#bg-main-3 p{
		color: #72bfe7;
		font-weight: 800;
		font-size: 11px;
		line-height: 16px;
		text-transform: uppercase;
		margin-top: 10px;
	}

	#bg-main-3 p.large{
		font-size: 25px;
		margin-bottom: 5px;
	}

	#bg-main-3 p span.dark{
		color: #33495d;
	}

	#bg-main-3 a{
		font-size: 12px;
		font-weight: bold;
		text-decoration:none;
		padding: 8px 24px;
		color: #33495d;
		border: 2px solid #33495d;
		border-radius: 20px;
		text-transform: uppercase;
	}

	#bg-main-3 a:hover{
		background-color: #33495d;
		color: white;
	}

	#bg-main-3 div.line{
		width: auto !important;
		overflow:hidden;
		height: 4px;
		background-color: #72bfe7;
		margin-top: 71px;

	}

	/* Say Hello Panel*/
	#bg-main-5 .container{
		padding-top: 20px;
	}
	#bg-main-5 img{
		width: 60px;
		height: 60px;
		margin-left: 23px;
	}

	#bg-main-5 .store-logo-container{
		width: 60%;
		text-align:right;
	}

	#bg-main-5 img.store-logo {
		height: 27px;
		width: auto;
		margin: 0 5px;
	}

	#bg-main-5 a:nth-child(2) img.store-logo {
		height: 40px;
		margin-right: -6px;
		margin-left: 0;
	}

	#bg-main-5 .inline-block{
		font-size: 14px;
		line-height:60px;
		width: auto !important;
	}

	#bg-main-5{
		min-height: 350px;
		height:350px
	}

	#bg-main-5 .word-container{
		margin-top: 25px;
		width: 60% !important;
		border-bottom: 4px solid #72bfe7;
		text-align:right;
	}

	#bg-main-5 p{
		font-size: 10px;
		line-height: 14px;
		margin-bottom: 5px;
	}

	#bg-main-5 p.large{
		font-size: 20px;
		line-height:25px;
	}


	/* Wake Up Smarter Panel */
	#bg-main-4{
		min-height: 350px;
		height: 350px;
	}

	#bg-main-4 .roundBtn{
		font-size: 10px;
		line-height: 15px;
		margin-left: 23px;
		padding: 5px 20px;
	}

	#bg-main-4 img{
		width: 60px;
		margin-bottom: 65px;
	}
	#bg-main-4 .word-container{
		border-left: 3px solid white;
		margin-left: 10px;
		padding-top: 120px;
		padding-left: 10px;
	}

	#bg-main-4 div.inline-block{
		width: auto !important;
		font-size: 14px;
		line-height: 60px;
	}

	#bg-main-4 p{
		font-size: 12px;
		line-height: 20px;
	}

	#bg-main-4 .large{
		font-size: 16px;
	}


	#bg-main-4 p.small{
		font-size: 14px;
		line-height:18px;
		margin-bottom: 5px;
		margin-left: 23px;
	}

	/* Quotes Panel */
	#bg-main-2{
		min-height: 700px;
		height: 700px;
	}

	#bg-main-2 .container{
		text-align: center;
	}
	#bg-main-2 img:nth-child(2){
		width: 60%;
		width: 215px;
		margin-top: 20px;
	}

	#bg-main-2 img:nth-child(3){
		width: 95%;
		width: 340px;
	}

	#bg-main-2 img:nth-child(5){
		width: 80%;
		width: 290px;
		margin-top: 15px;
	}

	#bg-main-2 img:nth-child(6){
		width: 70%;
		width: 250px;
	}

	#bg-main-2 img:nth-child(8){
		width: 80%;
		width: 290px;
		margin-top: 10px;
	}

	#bg-main-2 img:nth-child(9){
		width: 90%;
		width: 325px;
	}

	#bg-main-2 img:nth-child(11){
		width: 85%;
		width: 305px;
	}

	#bg-main-2 img:nth-child(12){
		width: 90%;
		width: 325px;
	}

	/* New Features mini-panel */
	#new-features{
		background-color: #03172a ;
		padding: 10px 0;
	}

	#new-features .feature-block{
		display: inline-block;
		width: 100%;
		text-align: center;
		vertical-align: top;
	}

	#new-features .feature-block p{
		font-weight: 900;
		text-transform: uppercase;
		color: white;
		margin-bottom: 10px;
	}

	#new-features .feature-block p.large{
		font-size: 15px;
		line-height: 15px;
		color: #fbe372;
	}

	#new-features img{
		width: 90px;
		margin: 10px;
	}

	/* Train your Brain Panel */
	#bg-main-6 .container img{
		width: 60px !important;

	}

	#bg-main-6 .inline-block{
		font-size: 14px;
		width: 150px;
		vertical-align: middle;
		margin-left: 40%;
	}
	#bg-main-6{
		min-height: 400px;
		height: 400px;
	}

	#bg-main-6 .word-container{
		margin-left: 40%;
		margin-top: 80px;
		border-bottom: 0px solid #fbe372;
	}

	#bg-main-6 .roundBtn {
		border: 2px solid #72bfe7;
		margin-top: 50px;
	}

	#bg-main-6 .roundBtn:hover {
		border: 2px solid white;
	}

	#bg-main-6 p{
		font-size: 10px;
		line-height: 15px;
		margin-bottom: 20px;
	}

	#bg-main-6 .large{
		font-size: 21px;
		line-height: 21px;
	}

	/* Risk Free Panel*/
	#risk-free{
		padding: 20px 0;
	}
	#risk-free p{
		font-size: 12px;
		line-height: 16px;
		font-weight: 600;
	}
	#risk-free p.large{
		font-size: 16px;
		line-height: 20px;
		font-weight: 900;
	}

	#risk-free a.btn{
		padding: 5px 20px;
		font-size: 13px;
		text-transform: uppercase;
		border-radius: 20px;
		text-decoration: none;
		color: #72bfe7;
		border: 2px solid #FFF;
		font-weight: 900;
	}

	#risk-free a.btn:hover{
		background-color: #fff;
	}

	a[rel~="wp-video-lightbox"] {
		border-radius: 20px;
		border: 2px solid white;
		padding: 5px 20px;
		margin: 10px;
	}

	/* What People Are Saying */
	#quote-title p{
		font-size: 20px;
		line-height: 30px;
		text-align: center;
	}

	/* Sleep Improvement */
	#sleepimprovement{
		height: 200px;
	}

	#sleepimprovement p{
		line-height: 100px;
		font-size: 20px;
	}

	#sleepimprovement-main h1{
		font-size: 20px !important;
		line-height: 25px !important;
		margin-top: 20px !important;
		margin-bottom: 0 !important;
	}

	#sleepimprovement-main h3{
		font-size: 15px !important;
		line-height: 20px !important;
	}

	#sleepimprovement-main .margin-vertical{
		margin-top: 20px !important;
		margin-bottom: 20px !important;
	}

	#sleepimprovement-main img{
		width: 100%;
	}

	#sleepimprovement-main .quote{
		font-size: 20px;
		line-height: 20px;
	}

	#sleepimprovement-main .quote-author{
		font-size: 15px;
	}

	#intro-new {
		background-image: url('https://sleepshepherd.com/wp-content/uploads/2016/09/mobile-BG.png');
		height: 730px;
		background-position: center bottom;
		background-size: cover;
		margin-top: -20px;
		/* text-align: center; */
	}

	#intro-new .container{
		text-align: center !important;
	}

	#intro-new .word-container {
		width: 99%;
	}

	#intro-new h1{
		font-size: 22px !important;
	}

	#intro-new p{
		font-size: 13px;
		line-height: 20px;
	}

	a#lightboxBtn{
		font-size: 16px;
	}

	a#lightboxBtn img{
		width: 40px;
	}

	.navbar-nav > li:last-child > a, .navbar-nav > li:last-child > a:focus{
		border-radius: 0 !important;
	}

	.vertAlignMiddle {
		vertical-align: top;
	}

}/* END 375 to 414px */

@media (min-width: 415px) and (max-width: 570px){

	#intro-new .container{
		padding: 0;
	}

	#intro-new .row{
		margin-left: 0;
		margin-right: 0;
	}

	#intro-new h3{
		font-size: 25px;
		margin-bottom: 0;
	}
	img.retailer-logo{
		height: 60px;
		margin: 10px;
	}


	.benefit-description {
		width: 80% !important;
	}

	#benefits img{
		height: 60px;
		margin: 40px;
	}

	#benefits img.medium{
		height: 50px;
		margin: 45px;
	}

	#benefits img.small{
		height: 30px;
		margin: 55px;
	}


	.benefit-description{
		font-size: 16px;
	}

	#instructions{
		display: none;
	}
	#background-image{
		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Product-Shot-Compressed.jpg");

		background-repeat: no-repeat;
		background-position: 50% 210px;
		background-size:500px;
		background-color: #bdbcc5;
		height: 560px;

		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Solo-Headband-min-Compressed.png");
		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Solo-Headband-2-min-Compressed.png");
		background-repeat: no-repeat;
		background-position: 50% 270px;
		background-size:350px;
		background-color: #bdbcc5;
	}

	div{
		font-size: 13px;
		line-height: 15px;
	}

	ul{
		line-height: 18px;
	}

	h1{
		font-size: 25px !important;
		line-height: 30px !important;
		text-align: center !important;
		height: 30px !important;
		margin-bottom: 20px !important;
	}

	.services .item h2{
		font-size: 18px !important;
	}

	.top-align{
		top: 10px;
		left: 0;
		text-align: center;
	}

	.top-align h1{
		margin-bottom: 0 !important;
	}

	.top-align img{
		width: 70%;
	}

	.services .item div.content{
		font-size: 13px;
	}

	.services .item .graphic,.services .item .graphic  > img{
		width: 150px !important;
		height: 150px !important;
	}

	.services .item .graphic {
		margin-bottom: 20px !important;
	}
	.services .item .graphic > .hover{
		background-size: 145px !important;
		background-position: 3px 1px !important;
	}

	div.services  .arrow{
		height: 0px;
	}

	/* .hover-container{
		padding-top: 10px;
		text-align: center;
	}

	.hover-container > *{
		vertical-align: top;
	}

	#img1{
		position: absolute;
		padding-top: 8%;
		width: 22%;
		z-index: 1;
		right: 68%;
	}
	#img2{
		position: absolute;
		padding-top: 5%;
		width: 25%;
		z-index: 2;
		right: 55%;
	}
	#img3{
		position: absolute;
		padding-top: 3%;
		width: 27%;
		left: 50%;
		margin-left: -13.5%;
		z-index: 3;

	}

	#img4{
		position: absolute;
		padding-top: 5%;
		width: 25%;
		left: 55%;
		z-index: 2;
	}

	#img5{
		position: absolute;
		padding-top: 8%;
		width: 22%;
		left: 68%;
		z-index: 1;
	}

	.hover-container img{
		transition: 300ms;

	}

	.hover-container img:hover{
		width: 30% !important;
		padding: 0 !important;
		transition: 300ms;
		z-index: 999 !important;
	}

	#img3:hover{
		width: 30% !important;
		margin-left: -15% !important;
	}

	#img1:hover{
		margin-right: -2.5%
	}

	#img2:hover{
		margin-right: -3%;
	}

	#img4:hover{
		margin-left: -3%;
	}

	#img5:hover{
		margin-left: -2.5%
	}



	.hover-container h1{
		position: absolute;
		display: inline-block;
		top: 7%;
		opacity: 0;
		transition: opacity 300ms;
		width: 100%;
		text-align: center;
		margin-bottom: 0;
		font-size: 20px;
		line-height: 25px;
		height: 25px;
	}

	.hover-container .solid{
		opacity: 1;
		transition: opacity 300ms;
	}

	#head1{
		right: 70%;
		right: 50%;
		margin-right: -50%;
	}

	#head2{
		right: 61%;
		right: 50%;
		margin-right: -50%;
	}

	#head3{
		left: 50%;
		margin-left: -50%;
	}

	#head4{
		left: 61%;
		left: 50%;
		margin-left: -50%;
	}

	#head5{
		left: 70%;
		left: 50%;
		margin-left: -50%;
	}

	.hover-container p{
		position: absolute;
		display: inline-block;
		width: 100%;
		bottom: 15%;
		bottom: -1%;
		margin-bottom: 20px;
		text-align: center;
		opacity: 0;
		transition: opacity 300ms;
		font-size: 13px;

	}

	#p1{
		right: 70%;
		right: 50%;
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p2{
		right: 61%;
		right: 50%;
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p3{
		left: 50%;
		margin-left: -12.5%;
		margin-left: -50%;
	}
	#p4{
		left: 61%;
		left: 50%;
	  margin-left: -12.5%;
	  margin-left: -50%;
	}
	#p5{
		left: 70%;
		left: 50%;
	  margin-left: -12.5%;
	  margin-left: -50%;
	}

	#carouselContainer{
		padding: 0;
	}

	#carouselContainer .container.compact{
		max-width: 100%;
		height:350px;
		background-color: #bfc3c9;
	} */

	.hover-container{
		padding-top: 10px;
		text-align: center;
	}

	.hover-container > *{
		vertical-align: top;
	}

	#img1{
		position: absolute;
		padding-top: 8%;
		padding-top: 60px;
		width: 22%;
		width:85px;
		z-index: 1;
		right: 68%;
		right: calc(50% + 105px);
	}
	#img2{
		position: absolute;
		padding-top: 5%;
		padding-top: 40px;
		width: 25%;
		width: 100px;
		z-index: 2;
		right: 55%;
		right: calc(50% + 35px);
	}
	#img3{
		position: absolute;
		padding-top: 3%;
		padding-top: 20px;
		width: 27%;
		width: 120px;
		left: 50%;
		margin-left: -60px;
		z-index: 3;

	}

	#img4{
		position: absolute;
		padding-top: 5%;
		padding-top: 40px;
		width: 25%;
		width: 100px;
		left: 55%;
		left: calc(50% + 35px);
		z-index: 2;
	}

	#img5{
		position: absolute;
		padding-top: 8%;
		padding-top: 60px;
		width: 22%;
		width: 85px;
		left: 68%;
		left: calc(50% + 105px);
		z-index: 1;
	}

	.hover-container img{
		transition: 300ms;

	}


	#img3:hover{
		/* margin-left: -85px !important; */
	}

	#img1:hover{
		/* margin-right: -32.5px */
	}

	#img2:hover{
		/* margin-right: -25px; */
	}

	#img4:hover{
		/* margin-left: -25px; */
	}

	#img5:hover{
		/* margin-left: -32.5px */
	}

	#hover-img-container{
		height: 285px;
	}

	.hover-container h1{

		width: 100%;
		text-align: center;

	}

	/* .hover-container .solid{
		opacity: 1;
		transition: opacity 300ms;
	} */


	#head1{
		margin-top: 0px !important;
		margin-bottom: 0 !important;
		display:none;
	}

	#head2{
		right: 61%;
		right: 50%;
		margin-right: -50%;
		display:none;
	}

	#head3{
		left: 50%;
		margin-left: -50%;
		display:none;
	}

	#head4{
		left: 61%;
		left: 50%;
		margin-left: -50%;
		display:none;
	}

	#head5{
		left: 70%;
		left: 50%;
		margin-left: -50%;
		display:none;
	}

	#head6{
		margin-top: 5px;
		margin-bottom: 0px !important;
	}

	.hover-container p{

		width: 100%;

		text-align: center;

		font-size: 13px;

	}

	/* #p1{
		right: 70%;
		right: 50%;
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p2{
		right: 61%;
		right: 50%;
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p3{
		left: 50%;
		margin-left: -12.5%;
		margin-left: -50%;
	}
	#p4{
		left: 61%;
		left: 50%;
	  margin-left: -12.5%;
	  margin-left: -50%;
	}
	#p5{
		left: 70%;
		left: 50%;
	  margin-left: -12.5%;
	  margin-left: -50%;
	} */

	#carouselContainer{
		padding: 0;
	}

	#carouselContainer .container.compact{
		max-width: 100%;
		height:530px;
		background-color: #bfc3c9;
	}

	section#alarm{
background-image: url("https://sleepshepherd.com/wp-content/uploads/2016/02/bedroom-416063.jpg");
		background-repeat: no-repeat;
		background-position: 50% center;
		background-size:200%;
		background-size:711px 400px;
		height: 400px;
		margin-top:0;
	}

	section#alarm img{
		position: absolute;
		width: 50%;
		left: 50%;
		bottom: 0;
		margin-left: -45%;
	}

	section#how-it-works{
		text-align:center;
	}

	#brainwaveLabel2{

		width: 90%;
		margin: 0 auto;
		text-align:center;
		color: #5b99b9;
	}

	#toneLabel2{

		width: 90%;
		text-align:center;
		margin: 0 auto;
		margin-bottom: 15px;
		color: #5b99b9;
	}

	section#how-it-works ul{
		margin-top: 0px;
		text-align: left;
	}

	section#how-it-works img{
		margin-top: 5px;
		margin-bottom: 5px;
		width: 90%;

	}

	section#how-it-works p{
		font-size: 14px;

	}

	section#comparison .container{
		padding-right: 5px;
		padding-left: 5px;

	}

	section#comparison table{
		width: 100%;
		font-size: 20px;
		color: #33495d;
		table-layout: fixed;
	}

	section#comparison table tr th,section#comparison table tr td{
		padding: 1%;
		font-size: 10px;
	}

	section#comparison table img{

	}

	section#comparison table tr:first-child{
		vertical-align: bottom;
	}
	section#comparison table tr:first-child p{
		margin-bottom: 0;
	}

	section.bg-image{
		min-height: 400px ;
		height: 400px ;
	}

	section.bg-image div.container div:nth-child(2){
		width: calc(100% - 10px) !important;
		padding: 0 !important;
	}

	section.bg-image div.container div:nth-child(2) img{
		width: 100px !important;
	}

	section.bg-image div.container div:nth-child(2) ul{
		font-size: 12px !important;
		line-height: 15px;
		width: 350px;
		margin: 0 auto;
	}

	/*-------------------------------------------------*/
	/* New Landing
	/*-------------------------------------------------*/
	#bg-main {
		min-height: 250px;
		height: 250px;
	}
	.vertAlign{
	  display: inline-block;
	  width: 0px;
	  height: 100%;
	  vertical-align: bottom;
	  background-color: yellow;
	}
	#bg-main .bottomAlign{
	  display:inline-block;
	  vertical-align: bottom;
	  background-color: none;
	  margin-bottom: 10px;
	}

	#bg-main .bottomAlign h1{
		font-size: 30px !important;
		height: 30px;
		font-weight: 500 !important;
		margin-top: 0;
		margin-bottom: 0px !important;
		text-transform: capitalize;
		color: #72bfe7;
		font-variant: small-caps;
	}

	#bg-main .bottomAlign h1.small{
		font-size: 20px !important;
		margin-bottom: 5px !important;
	}

	#bg-main .bottomAlign h4{
		font-size: 12px !important;
		font-weight: 600 !important;
		text-transform: none !important;
		color: white;
		margin-bottom: 0 !important;
		margin-top: 15px !important;
		font-variant: small-caps;
	}

	#bg-main .leftPadding p{
		display:block !important;
		text-transform: uppercase;
		font-size: 8px;
		font-weight: 500;
	}

	#bg-main .bottomUnderline{
	  border-bottom: 1.5px solid white;
	display:inline-block;
	padding-bottom: 5px;
	}

	#bg-main .bottomUnderline p{
		margin: 0;
	}

	#bg-main .bottomAlign .leftPadding{
	  padding-left: 30px !important;
	}

	#bg-main .bottomAlign .smallLeftPadding{
	  padding-left: 20px !important;
	  margin-top: 5px;
	}

	#bg-main .buttonContainer{
		margin-top: 20px;
		margin-bottom: 20px;
	}

	a[rel~="wp-video-lightbox"] {

		padding: 5px 20px;

	}

	.yellow{
	   color: #fbe372 !important;
	}

	.bold{
	   font-weight: bold !important;
	}

	h1.leftAlign{
		text-align: left !important;
	}

	#bg-main img.featuredInImg{
	width: 70px !important;
	margin: 5px !important;
	}

	#bg-main div.container div:nth-child(2){
		width: auto !important;
	}


	.roundBtn{
		background-color: transparent;
		border-radius: 20px;
		border: 2px solid white;
		padding: 5px 20px;
		margin: 5px;

	}

	.roundBtn a{
		text-decoration: none;
		color: white;
		font-size: 10px;
		font-weight: bold;
	}

	.roundBtn:hover{
		background-color: white;

	}

	.roundBtn:hover a{
		color: black;
		text-decoration: none;
	}

	.roundBtn.blue {
		background-color: #72bfe7;
		border: 2px solid #72bfe7;
	}

	.roundBtn.blue:hover{
		background-color: white;
		border: 2px solid white;
	}

	.roundBtn.blue:hover a{
		color: black;
	}

	/*-------------------------------------------------*/
	/*-------------------------------------------------*/

	.padding{
		padding: 15px;
	}

	.inline-block{
		display: inline-block;
	}

	/*Sleep Solved Panel*/
	#bg-main-3{
		min-height: 400px;
		height: 400px;
	}

	#bg-main-3 #word-container{
		float: left;
		padding-right: 5px;
	}

	#bg-main-3 p{
		color: #72bfe7;
		font-weight: 800;
		font-size: 12px;
		line-height: 18px;
		text-transform: uppercase;
		margin-top: 10px;
	}

	#bg-main-3 p.large{
		font-size: 25px;
		margin-bottom: 5px;
	}

	#bg-main-3 p span.dark{
		color: #33495d;
	}

	#bg-main-3 a{
		font-size: 12px;
		font-weight: bold;
		text-decoration:none;
		padding: 8px 24px;
		color: #33495d;
		border: 2px solid #33495d;
		border-radius: 20px;
		text-transform: uppercase;
	}

	#bg-main-3 a:hover{
		background-color: #33495d;
		color: white;
	}

	#bg-main-3 div.line{
		width: auto !important;
		overflow:hidden;
		height: 4px;
		background-color: #72bfe7;
		margin-top: 71px;

	}

	/* Say Hello Panel*/
	#bg-main-5 .container{
		padding-top: 20px;
	}
	#bg-main-5 img{
		width: 60px;
		height: 60px;
		margin-left: 23px;
	}

	#bg-main-5 .store-logo-container{
		width: 60%;
		text-align:right;
	}

	#bg-main-5 img.store-logo {
		height: 27px;
		width: auto;
		margin: 0 5px;
	}

	#bg-main-5 a:nth-child(2) img.store-logo {
		height: 40px;
		margin-right: -6px;
		margin-left: 0;
	}

	#bg-main-5 .inline-block{
		font-size: 14px;
		line-height:60px;
		width: auto !important;
	}

	#bg-main-5{
		min-height: 400px;
		height:400px
	}

	#bg-main-5 .word-container{
		margin-top: 20px;
		width: 60% !important;
		border-bottom: 4px solid #72bfe7;
		text-align:right;
	}

	#bg-main-5 p{
		font-size: 11px;
		line-height: 15px;
		margin-bottom: 5px;
	}

	#bg-main-5 p.large{
		font-size: 25px;
		line-height:30px;
	}


	/* Wake Up Smarter Panel */
	#bg-main-4{
		min-height: 350px;
		height: 350px;
	}

	#bg-main-4 .roundBtn{
		font-size: 10px;
		line-height: 15px;
		margin-left: 23px;
		padding: 5px 20px;
	}

	#bg-main-4 img{
		width: 60px;
		height: 60px;
		margin-bottom: 75px;
	}
	#bg-main-4 .word-container{
		border-left: 3px solid white;
		margin-left: 10px;
		padding-top: 130px;
		padding-left: 10px;
	}

	#bg-main-4 div.inline-block{
		width: auto !important;
		font-size: 14px;
		line-height: 60px;
	}

	#bg-main-4 p{
		font-size: 15px;
		line-height: 20px;
		font-weight: 900;
	}

	#bg-main-4 .large{
		font-size: 20px;
	}

	#bg-main-4 p.small{
		font-size: 15px;
		line-height:21px;
		margin-bottom: 5px;
		margin-left: 23px;
	}

	/* Quotes Panel */
	#bg-main-2{
		min-height: 700px;
		height: 700px;
	}

	#bg-main-2 .container{
		text-align: center;
	}
	#bg-main-2 img:nth-child(2){
		width: 60%;
		width: 240px;
	}

	#bg-main-2 img:nth-child(3){
		width: 95%;
		width: 380px;
	}

	#bg-main-2 img:nth-child(5){
		width: 80%;
		width: 320px;
		margin-top: 5px;
	}

	#bg-main-2 img:nth-child(6){
		width: 70%;
		width: 280px;
	}

	#bg-main-2 img:nth-child(8){
		width: 80%;
		width: 320px;
		margin-top: 5px;
	}

	#bg-main-2 img:nth-child(9){
		width: 90%;
		width: 360px;
	}

	#bg-main-2 img:nth-child(11){
		width: 85%;
		width: 340px;
	}

	#bg-main-2 img:nth-child(12){
		width: 90%;
		width: 360px;
	}

	/* New Features mini-panel */
	#new-features{
		background-color: #03172a ;
		padding: 10px 0;
	}

	#new-features .feature-block{
		display: inline-block;
		width: 100%;
		text-align: center;
		vertical-align: top;
	}

	#new-features .feature-block p{
		font-weight: 900;
		text-transform: uppercase;
		color: white;
		margin-bottom: 10px;
	}

	#new-features .feature-block p.large{
		font-size: 15px;
		line-height: 15px;
		color: #fbe372;
	}

	#new-features img{
		width: 90px;
		margin: 10px;
	}

	/* Train your Brain Panel */
	#bg-main-6 .container img{
		width: 60px !important;

	}

	#bg-main-6 .inline-block{
		font-size: 14px;
		width: 150px;
		vertical-align: middle;
		margin-left: 40%;
	}
	#bg-main-6{
		min-height: 400px;
		height: 400px;
	}

	#bg-main-6 .word-container{
		margin-left: 45%;
		margin-top: 80px;
		border-bottom: 0px solid #fbe372;
	}

	#bg-main-6 .roundBtn {
		border: 2px solid #72bfe7;
		margin-top: 50px;
	}

	#bg-main-6 .roundBtn:hover {
		border: 2px solid white;
	}

	#bg-main-6 p{
		font-size: 10px;
		line-height: 15px;
		margin-bottom: 20px;
	}

	#bg-main-6 .large{
		font-size: 23px;
		line-height: 23px;
	}

	/* Risk Free Panel*/
	#risk-free{
		padding: 20px 0;
	}

	#risk-free p{
		font-size: 14px;
		line-height: 18px;
		font-weight: 600;
	}
	#risk-free p.large{
		font-size: 18px;
		line-height: 22px;
		font-weight: 900;
	}

	#risk-free a.btn{
		padding: 5px 20px;
		font-size: 13px;
		text-transform: uppercase;
		border-radius: 20px;
		text-decoration: none;
		color: #72bfe7;
		border: 2px solid #FFF;
		font-weight: 900;
	}

	#risk-free a.btn:hover{
		background-color: #fff;
	}

	a[rel~="wp-video-lightbox"] {
		border-radius: 20px;
		border: 2px solid white;
		padding: 5px 20px;
		margin: 10px;
	}

	/* What People Are Saying */
	#quote-title p{
		font-size: 25px;
		line-height: 30px;
		text-align: center;
	}

	/* Sleep Improvement */
	#sleepimprovement{
		height: 300px;
	}

	#sleepimprovement p{
		line-height: 200px;
		font-size: 30px;
	}

	#sleepimprovement-main h1{
		font-size: 20px !important;
		line-height: 25px !important;
		margin-top: 20px !important;
		margin-bottom: 0 !important;
	}

	#sleepimprovement-main h3{
		font-size: 15px !important;
		line-height: 20px !important;
	}

	#sleepimprovement-main .margin-vertical{
		margin-top: 20px !important;
		margin-bottom: 20px !important;
	}

	#sleepimprovement-main img{
		width: 100%;
	}

	#sleepimprovement-main .quote{
		font-size: 20px;
		line-height: 20px;
	}

	#sleepimprovement-main .quote-author{
		font-size: 15px;
	}

	#intro-new {
		background-image: url('https://sleepshepherd.com/wp-content/uploads/2016/09/mobile-BG.png');
		height: 750px;
		background-position: center bottom;
		background-size: cover;
		margin-top: -20px;
		/* text-align: center; */
	}

	#intro-new .container{
		text-align: center !important;
	}

	#intro-new .word-container {
		width: 99%;
	}

	#intro-new h1{
		font-size: 25px !important;
	}

	#intro-new p{
		font-size: 14px;
		line-height: 20px;
	}

	.navbar-nav > li:last-child > a, .navbar-nav > li:last-child > a:focus{
		border-radius: 0 !important;
	}

	.vertAlignMiddle {
		vertical-align: top;
	}

}/* END 415 to 570px*/


@media (min-width: 571px) and (max-width: 767px){

	#intro-new .container{
		padding: 0;
	}

	#intro-new .row{
		margin-left: 0;
		margin-right: 0;
	}

	#intro-new h3{
		font-size: 25px;
		margin-bottom: 0;
	}
	img.retailer-logo{
		height: 70px;
		margin: 10px;
	}

	.benefit-description{
		font-size: 16px;
	}

	#instructions{
		font-size: 16px;
		margin-bottom: 10px;
	}

	section#introduction a{
		margin-top: 60px
	}
	#background-image{
		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Product-Shot-Compressed.jpg");

		background-repeat: no-repeat;
		background-position: 50% 210px;
		background-size:500px;
		background-color: #bdbcc5;
		height: 300px;

		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Solo-Headband-min-Compressed.png");
		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Solo-Headband-2-min-Compressed.png");
		background-repeat: no-repeat;
		background-position: 100% 50%;
		background-size:300px;
		background-size:50%;
		background-color: #bdbcc5;
	}

	div{
		font-size: 13px;
		line-height: 15px;
	}

	ul{
		line-height: 18px;
	}

	h1{
		font-size: 30px !important;
		line-height: 30px !important;
		text-align: center !important;
		height: 30px !important;
		margin-bottom: 20px !important;
	}

	#introduction h1{
		font-size: 25px !important;
	}

	.services .item h2{
		font-size: 25px !important;
	}

	.top-align{
		top: 60px;
		top: 10%;
		left: 0;
		text-align: center;
		width: 50%;
	}

	.top-align h1{
		margin-bottom: 0 !important;
	}

	.top-align img{
		width: 80%;
	}

	.services .item div.content{
		font-size: 20px;
		line-height: 25px;
	}

	.services .item .graphic,.services .item .graphic  > img{
		width: 150px !important;
		height: 150px !important;
	}

	.services .item .graphic {
		margin-bottom: 20px !important;
	}
	.services .item .graphic > .hover{
		background-size: 145px !important;
		background-position: 3px 1px !important;
	}

	div.services  .arrow{
		height: 0px;
	}

	.hover-container{
		padding-top: 10px;
		text-align: center;
	}

	.hover-container > *{
		vertical-align: top;
	}

	#img1{
		position: absolute;
		padding-top: 8%;
		padding-top: 50px;
		width: 22%;
		width:105px;
		z-index: 1;
		right: 68%;
		right: calc(50% + 135px);
	}
	#img2{
		position: absolute;
		padding-top: 5%;
		padding-top: 30px;
		width: 25%;
		width: 120px;
		z-index: 2;
		right: 55%;
		right: calc(50% + 35px);
	}
	#img3{
		position: absolute;
		padding-top: 3%;
		padding-top: 10px;
		width: 27%;
		width: 140px;
		left: 50%;
		margin-left: -70px;
		z-index: 3;

	}

	#img4{
		position: absolute;
		padding-top: 5%;
		padding-top: 30px;
		width: 25%;
		width: 120px;
		left: 55%;
		left: calc(50% + 35px);
		z-index: 2;
	}

	#img5{
		position: absolute;
		padding-top: 8%;
		padding-top: 50px;
		width: 22%;
		width: 105px;
		left: 68%;
		left: calc(50% + 135px);
		z-index: 1;
	}

	.hover-container img{
		transition: 300ms;

	}

	.hover-container img:hover{
		width: 170px !important;
		padding-top: 0px !important;
		transition: 300ms;
		z-index: 999 !important;
	}

	#img3:hover{
		margin-left: -85px !important;
	}

	#img1:hover{
		margin-right: -32.5px
	}

	#img2:hover{
		margin-right: -25px;
	}

	#img4:hover{
		margin-left: -25px;
	}

	#img5:hover{
		margin-left: -32.5px
	}



	.hover-container h1{
		position: absolute;
		display: inline-block;
		top: 7%;
		opacity: 0;
		transition: opacity 300ms;
		width: 100%;
		text-align: center;
		margin-bottom: 0 !important;
		font-size: 20px;
		line-height: 25px;
		height: 25px;
	}

	.hover-container .solid{
		opacity: 1;
		transition: opacity 300ms;
	}

	#head1{
		right: 70%;
		right: 50%;
		margin-right: -50%;
	}

	#head2{
		right: 61%;
		right: 50%;
		margin-right: -50%;
	}

	#head3{
		left: 50%;
		margin-left: -50%;
	}

	#head4{
		left: 61%;
		left: 50%;
		margin-left: -50%;
	}

	#head5{
		left: 70%;
		left: 50%;
		margin-left: -50%;
	}

	.hover-container p{
		position: absolute;
		display: inline-block;
		width: 100%;
		bottom: 15%;
		bottom: -1%;
		margin-bottom: 10px;
		text-align: center;
		opacity: 0;
		transition: opacity 300ms;
		font-size: 16px;

	}

	#p1{
		right: 70%;
		right: 50%;
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p2{
		right: 61%;
		right: 50%;
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p3{
		left: 50%;
		margin-left: -12.5%;
		margin-left: -50%;
	}
	#p4{
		left: 61%;
		left: 50%;
	  margin-left: -12.5%;
	  margin-left: -50%;
	}
	#p5{
		left: 70%;
		left: 50%;
	  margin-left: -12.5%;
	  margin-left: -50%;
	}

	#carouselContainer{
		padding: 0;
	}

	#carouselContainer .container.compact{
		max-width: 100%;
		height:450px;
		background-color: #bfc3c9;
	}

	section#alarm{
		background-image: url("https://sleepshepherd.com/wp-content/uploads/2016/02/bedroom-416063.jpg");
		background-repeat: no-repeat;
		background-position: 50% center;
		background-size:200%;
		background-size:711px 400px;
		height: 400px;
		margin-top:0;
	}

	section#alarm img{
		position: absolute;
		width: 50%;
		left: 50%;
		bottom: 0;
		margin-left: -45%;
	}

	section#how-it-works{
		text-align:left;
	}

	#brainwaveLabel2{
		position: absolute;
		display: inline-block;
		left: 576px;
		left: 79%;
		top: 83px;
		top: 17%;
		width: 20%;
		/* width: 150px; */
		text-align:center;
	}

	#toneLabel2{
		position: absolute;
		display: inline-block;
		left: 576px;
		left: 79%;
		top: 230px;
		top: 40%;
		width: 20%;
		/* width: 150px; */
		text-align:center;

	}

	section#how-it-works ul{
		margin-top: 0px;
		text-align: left;
		font-size: 16px;
	}

	section#how-it-works img{

		margin-top: 5px;
		margin-bottom: 5px;
		width: 80%;
		/* width: 375px; */

	}

	section#how-it-works p{
		font-size: 16px;
	}

	section#comparison .container{
		padding-right: 5px;
		padding-left: 5px;

	}

	section#comparison table{
		width: 100%;
		font-size: 20px;
		color: #33495d;
		table-layout: fixed;
	}

	section#comparison table tr th,section#comparison table tr td{
		padding: 1%;
		font-size: 10px;
	}

	section#comparison table img{

	}

	section#comparison table tr:first-child{
		vertical-align: bottom;
	}
	section#comparison table tr:first-child p{
		margin-bottom: 0;
	}

	section.bg-image{
		min-height: 600px ;
		height: 600px ;
	}

	section.bg-image div.container div:nth-child(2){
		width: calc(100% - 10px) !important;
		padding: 0 !important;
	}

	section.bg-image div.container div:nth-child(2) img{
		width: 200px !important;
	}

	section.bg-image div.container div:nth-child(2) ul{
		font-size: 20px !important;
		line-height: 25px;
		width: 350px;
		margin: 0 auto;
	}

	#introduction .title-container img{
		margin-top: -30px;
	}

				/*-------------------------------------------------*/
	/* New Landing
	/*-------------------------------------------------*/
	#bg-main {
		min-height: 350px;
		height: 350px;
	}
	.vertAlign{
	  display: inline-block;
	  width: 0px;
	  height: 100%;
	  vertical-align: bottom;
	  background-color: yellow;
	}
	#bg-main .bottomAlign{
	  display:inline-block;
	  vertical-align: bottom;
	  background-color: none;
	  margin-bottom: 0px;
	}

	#bg-main .bottomAlign h1{
		font-size: 35px !important;
		font-weight: 500 !important;
		margin-top: 0px !important;
		margin-bottom: 00px !important;
		font-variant: small-caps;
		color: #72bfe7;
		text-transform: capitalize;
	}

	#bg-main .bottomAlign h1.small{
		font-size: 25px !important;
		line-height: 25px !important;
		height: 25px !important;
		margin-bottom: 0px !important;
	}

	#bg-main .bottomAlign h4{
		font-size: 14px !important;
		font-weight: 600 !important;
		text-transform: none !important;
		color: white;
		margin-bottom: 0 !important;
		margin-top: 15px !important;
		font-variant: small-caps;
	}

	#bg-main .leftPadding p{
		display:block !important;
		text-transform: uppercase;
		font-size: 10px;
		font-weight: 500;
	}

	#bg-main .bottomUnderline{
	  border-bottom: 3px solid white;
	display:inline-block;

	}

	#bg-main .bottomAlign .leftPadding{
	  padding-left: 30px !important;
	}

	#bg-main .bottomAlign .smallLeftPadding{
	  padding-left: 20px !important;
	  margin-top: 5px;
	}

	#bg-main .buttonContainer{
		margin-top: 20px;
		margin-bottom: 20px;
	}

	.yellow{
	   color: #fbe372 !important;
	}

	.bold{
	   font-weight: bold !important;
	}

	h1.leftAlign{
		text-align: left !important;
	}

	#bg-main img.featuredInImg{
	width: 70px !important;
	margin: 5px !important;
	}

	#bg-main div.container div:nth-child(2){
		width: auto !important;
	}


	.roundBtn{
		background-color: transparent;
		border-radius: 20px;
		border: 2px solid white;
		padding: 8px 25px;
		margin: 10px;

	}

	.roundBtn a{
		text-decoration: none;
		color: white;
		font-size: 12px;
		font-weight: bold;
	}

	.roundBtn:hover{
		background-color: white;
	}

	.roundBtn:hover a{
		color: black;
		text-decoration: none;
	}

	.roundBtn.blue {
		background-color: #72bfe7;
		border: 2px solid #72bfe7;
	}

	.roundBtn.blue:hover{
		background-color: white;
		border: 2px solid #fff;
	}

	.roundBtn.blue:hover a{
		color: black;
	}

	/*-------------------------------------------------*/
	/*-------------------------------------------------*/

	.padding{
		padding: 30px;
	}

	.inline-block{
		display: inline-block;
	}

	/*Sleep Solved Panel*/
	#bg-main-3{
		min-height: 500px;
		height: 500px;
	}

	#bg-main-3 #word-container{
		float: left;
		padding-right: 5px;
	}

	#bg-main-3 p{
		color: #72bfe7;
		font-weight: 800;
		font-size: 16px;
		line-height: 22px;
		text-transform: uppercase;
		margin-top: 10px;
	}

	#bg-main-3 p.large{
		font-size: 35px;
		margin-bottom: 5px;
	}

	#bg-main-3 p span.dark{
		color: #33495d;
	}

	#bg-main-3 a{
		font-size: 12px;
		font-weight: bold;
		text-decoration:none;
		padding: 8px 24px;
		color: #33495d;
		border: 2px solid #33495d;
		border-radius: 20px;
		text-transform: uppercase;
	}

	#bg-main-3 a:hover{
		background-color: #33495d;
		color: white;
	}

	#bg-main-3 div.line{
		width: auto !important;
		overflow:hidden;
		height: 7px;
		background-color: #72bfe7;
		margin-top: 111px;

	}

	/* Say Hello Panel*/
	#bg-main-5 .container{
		padding-top: 20px;
	}
	#bg-main-5 img{
		width: 60px;
		margin-left: 40px;
	}

	#bg-main-5 .store-logo-container{
		width: 50%;
		text-align:right;
	}

	#bg-main-5 img.store-logo {
		height: 30px;
		width: auto;
		margin: 15px;
	}

	#bg-main-5 a:nth-child(2) img.store-logo {
		height: 45px;
		margin-right: -10px;
		margin-left: 0;
	}

	#bg-main-5 .inline-block{
		font-size: 14px;
		line-height: 60px;
		width: auto !important;
	}

	#bg-main-5{
		min-height: 450px;
		height:450px
	}

	#bg-main-5 .word-container{
		margin-top: 20px;
		width: 50% !important;
		border-bottom: 4px solid #72bfe7;
		text-align:right;
	}

	#bg-main-5 p{
		font-size: 13px;
		line-height: 16px;
		margin-bottom: 10px;
	}

	#bg-main-5 p.large{
		font-size: 25px;
		line-height:30px;
	}

	/* Wake Up Smarter Panel */
	#bg-main-4{
		min-height: 500px;
		height: 500px;
	}

	#bg-main-4 .roundBtn{
		font-size: 14px;
		line-height: 18px;
		margin-left: 45px;
	}

	#bg-main-4 img{
		width: 60px;
		margin-bottom: 125px;
	}
	#bg-main-4 .word-container{
		border-left: 5px solid white;
		margin-left: 20px;
		padding-top: 180px;
		padding-left: 15px;
	}

	#bg-main-4 div.inline-block{
		width: auto !important;
		font-size: 14px;
		line-height: 60px;
	}

	#bg-main-4 p{
		font-size: 20px;
		line-height: 30px;
	}

	#bg-main-4 .large{
		font-size: 30px;
	}

	#bg-main-4 p.small{
		font-size: 11px;
		line-height:14px;
		margin-bottom: 5px;
		margin-left: 45px;
	}

	/* Quotes panel */
	#bg-main-2{
		min-height: 400px;
		height: 400px;
	}
	#bg-main-2 .container{
		text-align:center;
	}
	#bg-main-2 img:nth-child(2){
		width: 250px;
		margin-top: 20px;
	}

	#bg-main-2 img:nth-child(3){
		width: 300px;
		margin-top: 0px;
	}

	#bg-main-2 img:nth-child(5){
		width: 300px;
		margin-top: 0px;
		margin-left: 0px;
	}

	#bg-main-2 img:nth-child(6){
		width: 250px;
		margin-top: -40px;
		margin-left: 0px;
	}

	#bg-main-2 img:nth-child(8){
		width: 270px;
	}

	#bg-main-2 img:nth-child(9){
		width: 280px;
		margin-top: 0px;
		margin-left: 0px;
	}

	#bg-main-2 img:nth-child(11){
		width: 285px;
	}

	#bg-main-2 img:nth-child(12){
		width: 270px;
		margin-top: 0px;
		margin-left: 0px;
	}

	/* New Features mini-panel */
	#new-features{
		background-color: #03172a ;
		padding: 20px 0;
	}

	#new-features .feature-block{
		display: inline-block;
		width: 32%;
		text-align: center;
		vertical-align: top;
		/* cursor: pointer; */
		border-radius: 0px;
	}

	#new-features .feature-block:hover{
		//background-color: rgba(114,191,231,0.1);
		//border-left: 1px solid rgba(255,255,255,0.5);
		//border-top: 1px solid rgba(255,255,255,0.5);
		transition: 300ms;
	}

	#new-features .feature-block p{
		font-weight: 900;
		font-size: 12px;
		text-transform: uppercase;
		color: white;
	}

	#new-features .feature-block p.large{
		font-size: 14px;
		line-height: 20px;
		color: #fbe372;
	}

	#new-features img{
		width: 90px;
		margin: 15px;
	}

	#new-features .feature-block:hover img{
		width: 105px;
		margin-top: 0px;
		margin-bottom: 15px;
		transition: 300ms;
	}

	/* Train your Brain Panel */
	#bg-main-6 .container img{
		width: 60px !important;

	}

	#bg-main-6 .inline-block{
		font-size: 14px;
		text-transform: uppercase;
		margin-left: 40%;
	}
	#bg-main-6{
		min-height: 500px;
		height: 500px;
	}

	#bg-main-6 .word-container{
		margin-right: 20px;
		margin-top: 110px;
		border-bottom: 0px solid #fbe372;
	}

	#bg-main-6 .roundBtn {
		border: 2px solid #72bfe7;
		margin-top: 50px;
	}

	#bg-main-6 .roundBtn:hover {
		border: 2px solid white !important;
	}

	#bg-main-6 p{
		font-size: 14px;
		line-height: 18px;
		margin-bottom: 30px
	}

	#bg-main-6 .large{
		font-size: 30px;
		line-height: 30px;
	}


	/* Risk Free Panel*/
	#risk-free{
		padding: 20px 0;
	}

	#risk-free p{
		font-size: 18px;
		line-height: 23px;
		font-weight: 600;
	}
	#risk-free p.large{
		font-size: 25px;
		line-height: 30px;
		font-weight: 900;
	}

	#risk-free a.btn{
		padding: 8px 25px;
		font-size: 13px;
		text-transform: uppercase;
		border-radius: 20px;
		text-decoration: none;
		color: #72bfe7;
		border: 2px solid #FFF;
		font-weight: 900;
	}

	#risk-free a.btn:hover{
		background-color: #fff;
	}

	a[rel~="wp-video-lightbox"] {
		border-radius: 20px;
		border: 2px solid white;
		padding: 8px 25px;
		margin: 10px;
	}

	/* What People Are Saying */
	#quote-title p{
		font-size: 30px;
		line-height: 40px;
	}

	/* Sleep Improvement */
	#sleepimprovement{
		height: 300px;
	}

	#sleepimprovement p{
		line-height: 200px;
		font-size: 30px;
	}

	#sleepimprovement-main h1{
		font-size: 30px !important;
		line-height: 35px !important;
		margin-top: 20px !important;
		margin-bottom: 0 !important;
	}

	#sleepimprovement-main h3{
		font-size: 19px !important;
		line-height: 24px !important;
	}

	#sleepimprovement-main p{
		font-size: 14px !important;
		line-height: 18px !important;
	}

	#sleepimprovement-main .quote{
		font-size: 30px !important;
		line-height: 30px !important;
	}

	#sleepimprovement-main .quote-author{
		font-size: 20px !important;
	}

	#intro-new {
		background-image: url('https://sleepshepherd.com/wp-content/uploads/2016/09/mobile-BG.png');
		height: 800px;
		background-position: center bottom;
		background-size: cover;
		margin-top: -20px;
		/* text-align: center; */
	}

	#intro-new .container{
		text-align: center !important;
	}

	#intro-new .word-container {
		width: 99%;
	}

	#intro-new h1{
		font-size: 33px !important;
	}

	#intro-new p{
		font-size: 16px;
		line-height: 25px;
	}

	.navbar-nav > li:last-child > a, .navbar-nav > li:last-child > a:focus{
		border-radius: 0 !important;
	}

	.vertAlignMiddle {
		vertical-align: top;
	}


}/* END 571 to 767px */

@media (min-width: 768px) and (max-width: 1000px){

	#intro-new .row{
		margin-left: 0;
		margin-right: 0;
	}

	#intro-new h3{
		font-size: 25px;
		margin-bottom: 0;
	}
	img.retailer-logo{
		height: 70px;
		margin: 10px;
	}

	#intro-new .col-sm-3:nth-child(4) img.retailer-logo{
		width: calc(100% - 20px);
		height: auto;
	}

	#buy-button-collapse{
		display:none;
	}

	section.blue .services {
		background: url('../img/services-line-small.png') 0 257px no-repeat;
	}

	.services .item h2 {
		width: 124%;
		margin-left: -12%;
	}


	#background-image{
		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Product-Shot-Compressed.jpg");

		background-repeat: no-repeat;
		background-position: 50% 210px;
		background-size:500px;
		background-color: #bdbcc5;
		height: 450px;

		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Solo-Headband-min-Compressed.png");
		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Solo-Headband-2-min-Compressed.png");
		background-repeat: no-repeat;
		background-position: 100% 50%;
		background-size:400px;
		background-size:55%;
		background-color: #bdbcc5;
	}

	div{
		font-size: 13px;
		line-height: 15px;
	}

	ul{
		line-height: 18px;
	}

	h1{
		font-size: 25px !important;
		line-height: 35px !important;
		text-align: center !important;
		height: 35px !important;
		margin-bottom: 20px !important;
	}

	.services .item h2{
		font-size: 25px !important;
	}

	.top-align{
		top: 60px;
		top: 20%;
		left: 0;
		text-align: center;
		width: 40%;
	}

	.top-align h1{
		margin-bottom: 0 !important;
	}

	.top-align img{
		width: 90%;
	}

	.services .item div.content{
		font-size: 16px;
	}

	.services .item .graphic,.services .item .graphic  > img{
		width: 150px !important;
		height: 150px !important;
	}

	.services .item .graphic {
		margin-bottom: 20px !important;
	}
	.services .item .graphic > .hover{
		background-size: 145px !important;
		background-position: 3px 1px !important;
	}

	div.services  .arrow{
		height: 0px;
	}

	/* .hover-container{
		padding-top: 10px;
		text-align: center;
	}

	.hover-container > *{
		vertical-align: top;
	}

	#img1{
		position: absolute;
		padding-top: 8%;
		width: 22%;
		z-index: 1;
		right: 68%;
	}
	#img2{
		position: absolute;
		padding-top: 5%;
		width: 25%;
		z-index: 2;
		right: 55%;
	}
	#img3{
		position: absolute;
		padding-top: 3%;
		width: 27%;
		left: 50%;
		margin-left: -13.5%;
		z-index: 3;

	}

	#img4{
		position: absolute;
		padding-top: 5%;
		width: 25%;
		left: 55%;
		z-index: 2;
	}

	#img5{
		position: absolute;
		padding-top: 8%;
		width: 22%;
		left: 68%;
		z-index: 1;
	}

	.hover-container img{
		transition: 300ms;

	}

	.hover-container img:hover{
		width: 30% !important;
		padding: 0 !important;
		transition: 300ms;
		z-index: 999 !important;
	}

	#img3:hover{
		width: 30% !important;
		margin-left: -15% !important;
	}

	#img1:hover{
		margin-right: -2.5%
	}

	#img2:hover{
		margin-right: -3%;
	}

	#img4:hover{
		margin-left: -3%;
	}

	#img5:hover{
		margin-left: -2.5%
	}



	.hover-container h1{
		position: absolute;
		display: inline-block;
		top: 7%;
		opacity: 0;
		transition: opacity 300ms;
		width: 100%;
		text-align: center;
		margin-bottom: 0;
		font-size: 20px;
		line-height: 25px;
		height: 25px;
	}

	.hover-container .solid{
		opacity: 1;
		transition: opacity 300ms;
	}

	#head1{
		right: 70%;
		right: 50%;
		margin-right: -50%;
	}

	#head2{
		right: 61%;
		right: 50%;
		margin-right: -50%;
	}

	#head3{
		left: 50%;
		margin-left: -50%;
	}

	#head4{
		left: 61%;
		left: 50%;
		margin-left: -50%;
	}

	#head5{
		left: 70%;
		left: 50%;
		margin-left: -50%;
	}

	.hover-container p{
		position: absolute;
		display: inline-block;
		width: 100%;
		bottom: 15%;
		bottom: -1%;
		margin-bottom: 20px;
		text-align: center;
		opacity: 0;
		transition: opacity 300ms;
		font-size: 13px;

	}

	#p1{
		right: 70%;
		right: 50%;
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p2{
		right: 61%;
		right: 50%;
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p3{
		left: 50%;
		margin-left: -12.5%;
		margin-left: -50%;
	}
	#p4{
		left: 61%;
		left: 50%;
	  margin-left: -12.5%;
	  margin-left: -50%;
	}
	#p5{
		left: 70%;
		left: 50%;
	  margin-left: -12.5%;
	  margin-left: -50%;
	}

	#carouselContainer{
		padding: 0;
	}

	#carouselContainer .container.compact{
		max-width: 100%;
		height:350px;
		background-color: #bfc3c9;
	} */

	/* -- Hover Container Beginning -- */
	.hover-container{
		padding-top: 10px;
		text-align: center;
	}

	.hover-container > *{
		vertical-align: top;
	}

	#img1{
		position: absolute;
		padding-top: 15%;
		padding-top: 152.6px ;
		width: 10%;
		width: 110px;
		z-index: 1;
		right: 63%;
		right: calc(50% + 187px);
	}
	#img2{
		position: absolute;
		padding-top: 13%;
		padding-top: 120px ;
		width: 12%;
		width: 136px;
		z-index: 2;
		right: 55%;
		right: calc(50% + 60px);
	}
	#img3{
		position: absolute;
		padding-top: 10%;
		padding-top: 75.8px ;
		width: 15%;
		width: 175px;
		left: 50%;
		margin-left: -7.5%;
		margin-left: -87.5px;
		z-index: 3;

	}

	#img4{
		position: absolute;
		padding-top: 13%;
		padding-top: 120px ;
		width: 12%;
		width: 136px;
		left: 55%;
		left: calc(50% + 60px);
		z-index: 2;
	}

	#img5{
		position: absolute;
		padding-top: 15%;
		padding-top: 152.6px ;
		width: 10%;
		width: 110px;
		left: 63%;
		left: calc(50% + 187px);
		z-index: 1;
	}

	.hover-container img{
		transition: 300ms;

	}

	.hover-container img:hover{
		width: 18% !important;
		width: 234px !important;
		padding-top: 7% !important;
		padding-top: 40px !important;
		transition: 300ms;
		z-index: 999 !important;
	}

	#img3:hover{
		margin-left: -117px;
	}

	#img1:hover{
		margin-right: -52px;
	}

	#img2:hover{
		margin-right: -39px;
	}

	#img4:hover{
		margin-left: -39px;
	}

	#img5:hover{
		margin-left: -52px;
	}



	.hover-container h1{
		position: absolute;
		display: inline-block;
		top: 7%;
		opacity: 0;
		transition: opacity 300ms;
		width: 100%;
		text-align: center;
		margin-bottom: 0;
		font-size: 20px;
		line-height: 25px;
		height: 25px;
	}

	.hover-container .solid{
		opacity: 1;
		transition: opacity 300ms;
	}

	#head1{
		right: 70%;
		right: calc(50% + 187px + 55px);
		/* right: 50%; */
		margin-right: -50%;
	}

	#head2{
		right: 61%;
		right:calc(50% + 60px + 78px);
		/* right: 50%; */
		margin-right: -50%;
	}

	#head3{
		left: 50%;
		margin-left: -50%;
	}

	#head4{
		left: 61%;
		left:calc(50% + 60px + 78px);
		/* left: 50%; */
		margin-left: -50%;
	}

	#head5{
		left: 70%;
		left: calc(50% + 187px + 65px);
		/* left: 50%; */
		margin-left: -50%;
	}

	.hover-container p{
		position: absolute;
		display: inline-block;
		width: 100%;
		bottom: 15%;
		bottom: -1%;
		margin-bottom: 20px;
		text-align: center;
		opacity: 0;
		transition: opacity 300ms;
		font-size: 16px;

	}

	#p1{
		right: 70%;
		right: calc(50% + 187px + 25px);
		/* right: 50%; */
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p2{
		right: 61%;
		right:calc(50% + 60px + 78px);
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p3{
		left: 50%;
		margin-left: -12.5%;
		margin-left: -50%;
	}
	#p4{
		left: 61%;
		left:calc(50% + 60px + 78px);
		margin-left: -12.5%;
		margin-left: -50%;
	}
	#p5{
		left: 70%;
		left: calc(50% + 187px - 25px);
		/* left: 50%; */
		margin-left: -12.5%;
		margin-left: -50%;
	}

	#carouselContainer{
		padding: 0;
	}

	#carouselContainer .container.compact{
		max-width: 100%;
		height:650px;
		background-color: #bfc3c9;
	}

	/* -- Hover Container End -- */

	section#alarm{
		background-image: url("https://sleepshepherd.com/wp-content/uploads/2016/02/bedroom-416063.jpg");
		background-repeat: no-repeat;
		background-position: 50% center;
		background-size:200%;
		background-size:711px 400px;
		height: 400px;
		margin-top:0;
	}

	section#alarm img{
		position: absolute;
		width: 50%;
		left: 50%;
		bottom: 0;
		margin-left: -45%;
	}

	section#how-it-works{
		text-align:left;
	}

	#brainwaveLabel2{
		position: absolute;
		display: inline-block;
		left: 576px;
		left: 79%;
		left: calc(60% + 150px);
		top: 83px;
		top: 17%;
		width: 20%;
		/* width: 150px; */
		text-align:center;
		font-size: 16px;
	}

	#toneLabel2{
		position: absolute;
		display: inline-block;
		left: 576px;
		left: 79%;
		left: calc(60% + 150px);
		top: 230px;
		top: 45%;
		width: 20%;
		/* width: 150px; */
		text-align:center;
		font-size: 16px;
	}

	section#how-it-works ul{
		margin-top: 0px;
		text-align: left;
		font-size: 16px;
	}

	section#how-it-works img{

		margin-top: 25px;
		margin-bottom: 25px;
		width: 80%;
		/* width: 375px; */

	}

	section#how-it-works p{
		font-size: 16px;
	}

	section#comparison .container{
		padding-right: 5px;
		padding-left: 5px;

	}

	section#comparison table{
		width: 100%;
		font-size: 20px;
		color: #33495d;
		table-layout: fixed;

	}

	section#comparison table tr th,section#comparison table tr td{
		padding: 1%;
		font-size: 16px;
	}

	section#comparison table img{

	}

	section#comparison table tr:first-child{
		vertical-align: bottom;
	}
	section#comparison table tr:first-child p{
		margin-bottom: 0;
	}

	section.bg-image{
		min-height: 700px ;
		height: 700px ;
	}

	section.bg-image div.container div:nth-child(2){
		width: calc(100% - 10px) !important;
		padding: 0 !important;
	}

	section.bg-image div.container div:nth-child(2) img{
		width: 200px !important;
	}

	section.bg-image div.container div:nth-child(2) ul{
		font-size: 20px !important;
		line-height: 25px;
		width: 400px;
		margin: 0 auto;
	}

	#introduction .title-container img{
		margin-top: -35px;
	}

			/*-------------------------------------------------*/
	/* New Landing
	/*-------------------------------------------------*/

	.vertAlign{
  display: inline-block;
  width: 0px;
  height: 100%;
  vertical-align: bottom;
  background-color: yellow;
}
#bg-main{
	min-height:550px;
	height: 550px;
}

#bg-main .bottomAlign{
  display:inline-block;
  vertical-align: bottom;
  background-color: none;
  margin-bottom: 0px;
}

#bg-main .bottomAlign h1{
       font-size: 50px !important;
    line-height: 50px !important;
    height: 50px !important;
    font-weight: 500 !important;
    margin-top: 0;
    margin-bottom: 0px !important;
	text-transform: capitalize;
	font-variant: small-caps;
	color: #72bfe7;
}

#bg-main .bottomAlign h1.small{
       font-size: 35px !important;
    line-height: 35px !important;
    height: 35px !important;
    margin-bottom: 0 !important;
}

#bg-main .bottomAlign h4{
   font-size: 20px !important;
   font-weight: 600 !important;
   text-transform: none !important;
color: white;
font-variant: small-caps;
margin-top: 20px;
margin-bottom: 5px;
}

#bg-main .leftPadding p{
	display:block !important;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 500;
}


#bg-main .bottomUnderline{
  border-bottom: 3px solid white;
display:inline-block;

}

#bg-main .bottomAlign .leftPadding{
  padding-left: 60px !important;
}

#bg-main .bottomAlign .smallLeftPadding{
  padding-left: 30px !important;
  margin-top: 15px;
}

#bg-main .buttonContainer{
	margin-top: 30px;
	margin-bottom: 30px;
}

.yellow{
   color: #fbe372 !important;
}

.bold{
   font-weight: bold !important;
}

h1.leftAlign{
    text-align: left !important;
}

#bg-main img.featuredInImg{
width: 100px !important;
margin: 8px !important;
}


.roundBtn{
	background-color: transparent;
	border-radius: 20px;
	border: 2px solid white;
	padding: 8px 25px;
	margin: 10px;

}

.roundBtn a{
	text-decoration: none;
	color: white;
	font-size: 12px;
	font-weight: bold;
}

.roundBtn:hover{
	background-color: white;
}

.roundBtn:hover a{
	color: black;
	text-decoration: none;
}

.roundBtn.blue {
	background-color: #72bfe7;
	border: 2px solid #72bfe7;
}

.roundBtn.blue:hover{
	background-color: white;
	border: 2px solid #fff;
}

.roundBtn.blue:hover a{
	color: black;
}

	/*-------------------------------------------------*/
	/*-------------------------------------------------*/


.padding{
	padding: 30px;
}

.inline-block{
	display: inline-block;
}

/*Sleep Solved Panel*/
#bg-main-3{
	min-height: 650px;
	height: 650px;
}

#bg-main-3 #word-container{
	float: left;
	padding-right: 5px;
}

#bg-main-3 p{
	color: #72bfe7;
	font-weight: 800;
	font-size: 59px;
	font-size: 23px;
	line-height: 30px;
	text-transform: uppercase;
}

#bg-main-3 p.large{
	font-size: 45px;
	margin-bottom: 10px;
}

#bg-main-3 p span.dark{
	color: #33495d;
}

#bg-main-3 a{
	font-size: 15px;
	font-weight: bold;
	text-decoration:none;
	padding: 10px 30px;
	color: #33495d;
	border: 2px solid #33495d;
	border-radius: 20px;
	text-transform: uppercase;
}

#bg-main-3 a:hover{
	background-color: #33495d;
	color: white;
}

#bg-main-3 div.line{
	width: auto !important;
	overflow:hidden;
	height: 10px;
    background-color: #72bfe7;
    margin-top: 128px;

}

	/* Say Hello Panel*/
	#bg-main-5 .container{
		padding-top: 20px;
	}
	#bg-main-5 img{
		width: 100px;
		height: 100px;
		margin-left: 55px;
	}

	#bg-main-5 .store-logo-container{
		width: 50%;
		text-align:right;
	}

	#bg-main-5 img.store-logo {
		height: 37px;
		width: auto;
		margin: 15px;
	}

	#bg-main-5 a:nth-child(2) img.store-logo {
		height: 55px;
		margin-right: -10px;
		margin-left: 0;
	}

	#bg-main-5 .inline-block{
		font-size: 18px;
		line-height: 100px;
		width: auto !important;
	}

	#bg-main-5{
		min-height: 600px;
		height: 600px
	}

	#bg-main-5 .word-container{
		margin-top: 80px;
		width: 50% !important;
		border-bottom: 8px solid #72bfe7;
		text-align:right;
	}

	#bg-main-5 p{
		font-size: 15px;
		line-height: 20px;
	}

	#bg-main-5 p.large{
		font-size: 35px;
		line-height:40px;
	}

	/* Wake Up Smarter Panel */


	#bg-main-4{
		min-height: 600px;
		height: 600px;
	}

	#bg-main-4 .roundBtn{
		margin-left: 55px;
	}

	#bg-main-4 img{
		width: 100px;
		height: 100px;
		margin-bottom: 150px;
	}
	#bg-main-4 .word-container{
		border-left: 5px solid white;
		margin-left: 30px;
		padding-top: 220px;
		padding-left: 20px;
	}

	#bg-main-4 div.inline-block{
		width: auto !important;
		font-size: 18px;
		line-height: 100px;
	}

	#bg-main-4 p{
		font-size: 25px;
		line-height: 30px;
	}

	#bg-main-4 .large{
		font-size: 35px;
	}

	#bg-main-4 p.small{
		font-size: 15px;
		line-height:20px;
		margin-bottom: 5px;
		margin-left: 55px;
	}

	/* Quotes panel */
	#bg-main-2{
		min-height: 500px;
		height: 500px;
	}
	#bg-main-2 .container{
		text-align:center;
	}
	#bg-main-2 img:nth-child(2){
		width: 300px;
		margin-top: 20px;
	}

	#bg-main-2 img:nth-child(3){
		width: 450px;
		margin-top: -50px;
	}

	#bg-main-2 img:nth-child(5){
		width: 350px;
		margin-top: 0px;
		margin-left: 0px;
	}

	#bg-main-2 img:nth-child(6){
		width: 380px;
		margin-top: -40px;
		margin-left: 20px;
	}

	#bg-main-2 img:nth-child(8){
		width: 300px;
	}

	#bg-main-2 img:nth-child(9){
		width: 365px;
		margin-top: 30px;
		margin-left: 0px;
	}

	#bg-main-2 img:nth-child(11){
		width: 385px;
	}

	#bg-main-2 img:nth-child(12){
		width: 300px;
		margin-top: 30px;
		margin-left: 40px;
	}

	/* New Features mini-panel */
	#new-features{
		background-color: #03172a ;
		padding: 20px 0;
	}

	#new-features .feature-block{
		display: inline-block;
		width: 32%;
		text-align: center;
		vertical-align: top;
		/* cursor: pointer; */
		border-radius: 0px;
	}

	#new-features .feature-block:hover{
		//background-color: rgba(114,191,231,0.1);
		//border-left: 1px solid rgba(255,255,255,0.5);
		//border-top: 1px solid rgba(255,255,255,0.5);
		transition: 300ms;
	}

	#new-features .feature-block p{
		font-weight: 900;
		font-size: 12px;
		text-transform: uppercase;
		color: white;
	}

	#new-features .feature-block p.large{
		font-size: 20px;
		line-height: 20px;
		color: #fbe372;
	}

	#new-features img{
		width: 115px;
		margin: 15px;
	}

	#new-features .feature-block:hover img{
		width: 130px;
		margin-top: 0px;
		margin-bottom: 15px;
		transition: 300ms;
	}

	/* Train your Brain Panel */
	#bg-main-6 .container img{
		width: 100px !important;
	}

	#bg-main-6 .inline-block{
		font-size: 18px;
		text-transform: uppercase;
		margin-left: 40%;
	}

	#bg-main-6 .word-container{
		margin-right: 40px;
		margin-top: 180px;
		border-bottom: 0px solid #fbe372;
	}

	#bg-main-6 .roundBtn {
		border: 2px solid #72bfe7;
		margin-top: 50px;
	}

	#bg-main-6 .roundBtn:hover {
		border: 2px solid white;
	}

	#bg-main-6 p{
		font-size: 18px;
		line-height: 22px;
		margin-bottom: 40px;
	}



	#bg-main-6 .large{
		font-size: 40px;
		line-height: 40px;
	}

	/* Risk Free Panel*/
	#risk-free p{
		font-size: 22px;
		line-height: 25px;
		font-weight:600;
	}
	#risk-free p.large{
		font-size: 35px;
		line-height: 40px;
		font-weight:900;
	}

	#risk-free {
		background-image: url('https://sleepshepherd.com/wp-content/uploads/2016/08/moon-cloudlogo-1.png');
		background-position: calc(50% + 360px);
		background-size: 350px;
		background-repeat: no-repeat;
		padding: 20px;
	}

	#risk-free a.btn{
		padding: 8px 25px;
		font-size: 13px;
		text-transform: uppercase;
		border-radius: 20px;
		text-decoration: none;
		color: #72bfe7;
		border: 2px solid #FFF;
		font-weight: 900;
	}

	#risk-free a.btn:hover{
		background-color: #fff;
	}

	a[rel~="wp-video-lightbox"] {
		border-radius: 20px;
		border: 2px solid white;
		padding: 8px 25px;
		margin: 10px;
	}

	/* What People Are Saying */
	#quote-title p{
		font-size: 40px;
		line-height: 50px;
	}

	/* Sleep Improvement */
	#sleepimprovement-main h1{
		font-size: 40px !important;
		line-height: 45px !important;
		margin-top: 20px !important;
		margin-bottom: 0 !important;
	}

	#sleepimprovement-main h3{
		font-size: 25px !important;
		line-height: 30px !important;
	}

	#sleepimprovement-main .quote{
		font-size: 30px !important;
		line-height: 30px !important;
	}

	#sleepimprovement-main .quote-author{
		font-size: 20px !important;
	}

	#intro-new {
		background-image: url('https://sleepshepherd.com/wp-content/uploads/2016/09/mobile-BG.png');
		height: 750px;
		background-position: center bottom;
		background-size: cover;
		margin-top: -20px;
		/* text-align: center; */
	}

	#intro-new .container{
		text-align: center !important;
	}

	#intro-new .word-container {
		width: 99%;
	}

	.vertAlignMiddle {
		vertical-align: top;
	}

}/*END 768 to 1000px*/

@media (min-width: 1001px) and (max-width: 1200px){

	#intro-new .row{
		margin-left: 0;
		margin-right: 0;
	}

	#intro-new h3{
		font-size: 25px;
		margin-bottom: 0;
	}
	img.retailer-logo{
		height: 50px;
		margin: 10px;
	}

	#intro-new .col-sm-3:nth-child(4) img.retailer-logo{
		width: calc(100% - 0px);
		height: auto;
	}

	#intro-new .col-sm-3:nth-child(4) p{
		font-size: 12px;
	}

	#buy-button-collapse{
		display:none;
	}

	.services .item h2 {
		width: 124%;
		margin-left: -10%;
		font-size: 20px !important;
	}
	 section.blue .services {
		background: url('../img/services-line-big.png') 0 226px no-repeat;
	}

	#background-image{
		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Product-Shot-Compressed.jpg");

		background-repeat: no-repeat;
		background-position: 50% 210px;
		background-size:500px;
		background-color: #bdbcc5;
		height: 450px;

		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Solo-Headband-min-Compressed.png");
		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Solo-Headband-2-min-Compressed.png");
		background-repeat: no-repeat;
		background-position: 100% 15%;
		background-size:400px;
		background-size:550px;
		background-color: #bdbcc5;
	}

	div{
		font-size: 20px;
		line-height: 25px;
	}

	ul{
		line-height: 18px;
	}

	h1{
		font-size: 30px !important;
		line-height: 35px !important;
		text-align: center !important;
		height: 35px !important;
		margin-bottom: 20px !important;
	}

	/* .services .item h2{
		font-size: 25px !important;
	} */

	.top-align{
		top: 60px;
		top: 10%;
		right: 55%;
		text-align: center;
		width: 40%;
		width: 400px;
	}

	.top-align h1{
		margin-bottom: 0 !important;
		margin-top: 0;
	}

	.top-align img{
		width: 90%;
	}

	.services .item div.content{
		font-size: 20px;
	}

	.services .item .graphic,.services .item .graphic  > img{
		width: 150px !important;
		height: 150px !important;
	}

	.services .item .graphic {
		margin-bottom: 20px !important;
	}
	.services .item .graphic > .hover{
		background-size: 145px !important;
		background-position: 3px 1px !important;
	}

	div.services  .arrow{
		height: 0px;
	}

	/* .hover-container{
		padding-top: 10px;
		text-align: center;
	}

	.hover-container > *{
		vertical-align: top;
	}

	#img1{
		position: absolute;
		padding-top: 8%;
		width: 22%;
		z-index: 1;
		right: 68%;
	}
	#img2{
		position: absolute;
		padding-top: 5%;
		width: 25%;
		z-index: 2;
		right: 55%;
	}
	#img3{
		position: absolute;
		padding-top: 3%;
		width: 27%;
		left: 50%;
		margin-left: -13.5%;
		z-index: 3;

	}

	#img4{
		position: absolute;
		padding-top: 5%;
		width: 25%;
		left: 55%;
		z-index: 2;
	}

	#img5{
		position: absolute;
		padding-top: 8%;
		width: 22%;
		left: 68%;
		z-index: 1;
	}

	.hover-container img{
		transition: 300ms;

	}

	.hover-container img:hover{
		width: 30% !important;
		padding: 0 !important;
		transition: 300ms;
		z-index: 999 !important;
	}

	#img3:hover{
		width: 30% !important;
		margin-left: -15% !important;
	}

	#img1:hover{
		margin-right: -2.5%
	}

	#img2:hover{
		margin-right: -3%;
	}

	#img4:hover{
		margin-left: -3%;
	}

	#img5:hover{
		margin-left: -2.5%
	}



	.hover-container h1{
		position: absolute;
		display: inline-block;
		top: 7%;
		opacity: 0;
		transition: opacity 300ms;
		width: 100%;
		text-align: center;
		margin-bottom: 0;
		font-size: 20px;
		line-height: 25px;
		height: 25px;
	}

	.hover-container .solid{
		opacity: 1;
		transition: opacity 300ms;
	}

	#head1{
		right: 70%;
		right: 50%;
		margin-right: -50%;
	}

	#head2{
		right: 61%;
		right: 50%;
		margin-right: -50%;
	}

	#head3{
		left: 50%;
		margin-left: -50%;
	}

	#head4{
		left: 61%;
		left: 50%;
		margin-left: -50%;
	}

	#head5{
		left: 70%;
		left: 50%;
		margin-left: -50%;
	}

	.hover-container p{
		position: absolute;
		display: inline-block;
		width: 100%;
		bottom: 15%;
		bottom: -1%;
		margin-bottom: 20px;
		text-align: center;
		opacity: 0;
		transition: opacity 300ms;
		font-size: 13px;

	}

	#p1{
		right: 70%;
		right: 50%;
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p2{
		right: 61%;
		right: 50%;
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p3{
		left: 50%;
		margin-left: -12.5%;
		margin-left: -50%;
	}
	#p4{
		left: 61%;
		left: 50%;
	  margin-left: -12.5%;
	  margin-left: -50%;
	}
	#p5{
		left: 70%;
		left: 50%;
	  margin-left: -12.5%;
	  margin-left: -50%;
	}

	#carouselContainer{
		padding: 0;
	}

	#carouselContainer .container.compact{
		max-width: 100%;
		height:350px;
		background-color: #bfc3c9;
	} */

	/* -- Hover Container Beginning -- */
	.hover-container{
		padding-top: 10px;
		text-align: center;
	}

	.hover-container > *{
		vertical-align: top;
	}

	#img1{
		position: absolute;
		padding-top: 15%;
		padding-top: 152.6px ;
		width: 10%;
		width: 130px;
		z-index: 1;
		right: 63%;
		right: calc(50% + 197px);
	}
	#img2{
		position: absolute;
		padding-top: 13%;
		padding-top: 120px ;
		width: 12%;
		width: 156px;
		z-index: 2;
		right: 55%;
		right: calc(50% + 70px);
	}
	#img3{
		position: absolute;
		padding-top: 10%;
		padding-top: 75.8px ;
		width: 15%;
		width: 195px;
		left: 50%;
		margin-left: -7.5%;
		margin-left: -97.5px;
		z-index: 3;

	}

	#img4{
		position: absolute;
		padding-top: 13%;
		padding-top: 120px ;
		width: 12%;
		width: 156px;
		left: 55%;
		left: calc(50% + 70px);
		z-index: 2;
	}

	#img5{
		position: absolute;
		padding-top: 15%;
		padding-top: 152.6px ;
		width: 10%;
		width: 130px;
		left: 63%;
		left: calc(50% + 197px);
		z-index: 1;
	}

	.hover-container img{
		transition: 300ms;

	}

	.hover-container img:hover{
		width: 18% !important;
		width: 234px !important;
		padding-top: 7% !important;
		padding-top: 40px !important;
		transition: 300ms;
		z-index: 999 !important;
	}

	#img3:hover{
		margin-left: -117px;
	}

	#img1:hover{
		margin-right: -52px;
	}

	#img2:hover{
		margin-right: -39px;
	}

	#img4:hover{
		margin-left: -39px;
	}

	#img5:hover{
		margin-left: -52px;
	}



	.hover-container h1{
		position: absolute;
		display: inline-block;
		top: 7%;
		opacity: 0;
		transition: opacity 300ms;
		width: 100%;
		text-align: center;
		margin-bottom: 0;
		font-size: 20px;
		line-height: 25px;
		height: 25px;
	}

	.hover-container .solid{
		opacity: 1;
		transition: opacity 300ms;
	}

	#head1{
		right: 70%;
		right: calc(50% + 197px + 65px);
		/* right: 50%; */
		margin-right: -50%;
	}

	#head2{
		right: 61%;
		right:calc(50% + 70px + 78px);
		/* right: 50%; */
		margin-right: -50%;
	}

	#head3{
		left: 50%;
		margin-left: -50%;
	}

	#head4{
		left: 61%;
		left:calc(50% + 70px + 78px);
		/* left: 50%; */
		margin-left: -50%;
	}

	#head5{
		left: 70%;
		left: calc(50% + 197px + 65px);
		/* left: 50%; */
		margin-left: -50%;
	}

	.hover-container p{
		position: absolute;
		display: inline-block;
		width: 100%;
		bottom: 15%;
		bottom: -1%;
		margin-bottom: 20px;
		text-align: center;
		opacity: 0;
		transition: opacity 300ms;
		font-size: 16px;

	}

	#p1{
		right: 70%;
		right: calc(50% + 197px + 65px);
		/* right: 50%; */
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p2{
		right: 61%;
		right:calc(50% + 70px + 78px);
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p3{
		left: 50%;
		margin-left: -12.5%;
		margin-left: -50%;
	}
	#p4{
		left: 61%;
		left:calc(50% + 70px + 78px);
		margin-left: -12.5%;
		margin-left: -50%;
	}
	#p5{
		left: 70%;
		left: calc(50% + 197px + 65px);
		/* left: 50%; */
		margin-left: -12.5%;
		margin-left: -50%;
	}

	#carouselContainer{
		padding: 0;
	}

	#carouselContainer .container.compact{
		max-width: 100%;
		height:650px;
		background-color: #bfc3c9;
	}

	/* -- Hover Container End -- */


	section#alarm{
		background-image: url("https://sleepshepherd.com/wp-content/uploads/2016/02/bedroom-416063.jpg");
		background-repeat: no-repeat;
		background-position: 50% center;
		background-size:100%;
		background-size:711px 400px;
		background-size:50%;
		height: 400px;
		margin-top:0;
	}

	section#alarm img{
		position: absolute;
		width: 20%;
		left: 50%;
		bottom: 0;
		margin-left: -45%;
	}

	section#how-it-works{
		text-align:left;
	}

	#brainwaveLabel2{
		position: absolute;
		display: inline-block;
		left: 576px;
		left: 79%;
		left: calc(60% + 180px);
		top: 83px;
		top: 17%;
		width: 20%;
		/* width: 150px; */
		text-align:center;
		font-size: 16px;
	}

	#toneLabel2{
		position: absolute;
		display: inline-block;
		left: 576px;
		left: 79%;
		left: calc(60% + 180px);
		top: 230px;
		top: 48%;
		width: 20%;
		/* width: 150px; */
		text-align:center;
		font-size: 16px;
	}

	section#how-it-works ul{
		margin-top: 0px;
		text-align: left;
		font-size: 20px;
		line-height:25px;
	}

	section#how-it-works img{

		margin-top: 35px;
		margin-bottom: 35px;
		width: 80%;
		/* width: 375px; */

	}

	section#how-it-works p{
		font-size: 20px;
	}

	section#comparison .container{
		padding-right: 5px;
		padding-left: 5px;

	}

	section#comparison table{
		width: 100%;
		font-size: 20px;
		color: #33495d;
		table-layout: fixed;

	}

	section#comparison table tr th,section#comparison table tr td{
		padding: 1%;
		font-size: 16px;
	}

	section#comparison table img{

	}

	section#comparison table tr:first-child{
		vertical-align: bottom;
	}
	section#comparison table tr:first-child p{
		margin-bottom: 0;
	}

	section.bg-image{
		min-height: 700px ;
		height: 700px ;
	}

	section.bg-image div.container div:nth-child(2){
		width: calc(100% - 10px) !important;
		padding: 0 !important;
	}

	section.bg-image div.container div:nth-child(2) img{
		width: 200px !important;
	}

	section.bg-image div.container div:nth-child(2) ul{
		font-size: 25px !important;
		line-height: 30px;
		width: 300px;
		margin: 0 auto;
	}

	#introduction .title-container img{
		margin-top: -35px;
	}

	/*-------------------------------------------------*/
	/* New Landing
	/*-------------------------------------------------*/

	.vertAlign{
  display: inline-block;
  width: 0px;
  height: 100%;
  vertical-align: bottom;
  background-color: yellow;
}

#bg-main{
	min-height:550px;
	height: 550px;
}

#bg-main .bottomAlign{
  display:inline-block;
  vertical-align: bottom;
  background-color: none;
  margin-bottom: 0px;
}

#bg-main .bottomAlign h1{
       font-size: 60px !important;
    line-height: 60px !important;
    height: 60px !important;
    font-weight: 500 !important;
    margin-top: 0 !important;
    margin-bottom: 0px !important;
	font-variant: small-caps;
	text-transform: capitalize;
	color: #72bfe7;
}

#bg-main .bottomAlign h1.small{
       font-size: 40px !important;
    line-height: 40px !important;
    height: 40px !important;
    margin-bottom: 0px !important;
}

#bg-main .bottomAlign h4{
	font-size: 20px !important;
	font-weight: 600 !important;
	text-transform: none !important;
	color: white;
	font-variant: small-caps;
}

#bg-main .leftPadding p{
	display:block !important;
	text-transform: uppercase;
	font-size: 16px;
	font-weight: 500;
}

#bg-main .bottomUnderline{
  border-bottom: 3px solid white;
display:inline-block;

}

#bg-main .bottomAlign .leftPadding{
  padding-left: 80px !important;
}

#bg-main .bottomAlign .smallLeftPadding{
  padding-left: 40px !important;
  margin-top: 20px;
}

#bg-main .buttonContainer{
	margin-top: 30px;
	margin-bottom: 30px;
}

.yellow{
   color: #fbe372 !important;
}

.bold{
   font-weight: 900 !important;
}

h1.leftAlign{
    text-align: left !important;
}

#bg-main img.featuredInImg{
width: 120px !important;
margin: 10px !important;
}


.roundBtn{
	background-color: transparent;
	border-radius: 25px;
	border: 2px solid white;
	padding: 10px 30px;
	margin: 10px;

}

.roundBtn a{
	text-decoration: none;
	color: white;
	font-size: 14px;
	font-weight: bold;
}

.roundBtn:hover{
	background-color: white;
}

.roundBtn:hover a{
	color: black;
	text-decoration: none;
}

.roundBtn.blue {
	background-color: #72bfe7;
	border: 2px solid #72bfe7;
}

.roundBtn.blue:hover{
	background-color: white;
	border: 2px solid #FFF;
}

.roundBtn.blue:hover a{
	color: black;
}

	/*-------------------------------------------------*/
	/*-------------------------------------------------*/

	.padding{
	padding: 50px;
}

.inline-block{
	display: inline-block;
}

/*Sleep Solved Panel*/
#bg-main-3{
	min-height: 700px;
	height: 700px;
}

#bg-main-3 #word-container{
	float: left;
	padding-right: 5px;
}

#bg-main-3 p{
	color: #72bfe7;
	font-weight: 800;
	font-size: 59px;
	font-size: 30px;
	line-height: 35px;
	text-transform: uppercase;
}

#bg-main-3 p.large{
	font-size: 45px;
	margin-bottom: 10px;
}

#bg-main-3 p span.dark{
	color: #33495d;
}

#bg-main-3 a{
	font-size: 15px;
	font-weight: bold;
	text-decoration:none;
	padding: 10px 30px;
	color: #33495d;
	border: 2px solid #33495d;
	border-radius: 20px;
	text-transform: uppercase;
}

#bg-main-3 a:hover{
	background-color: #33495d;
	color: white;
}

#bg-main-3 div.line{
	width: auto !important;
	overflow:hidden;
	height: 10px;
    background-color: #72bfe7;
    margin-top: 148px;

}

	/* Say Hello Panel*/
	#bg-main-5 .container{
		padding-top: 20px;
	}
	#bg-main-5 img{
		width: 100px;
		height: 100px;
		margin-left: 75px;
	}

	#bg-main-5 .store-logo-container{
		width: 50%;
		text-align:right;
	}

	#bg-main-5 img.store-logo {
		height: 37px;
		width: auto;
		margin: 15px;
	}

	#bg-main-5 a:nth-child(2) img.store-logo {
		height: 55px;
		margin-right: -10px;
		margin-left: 0;
	}

	#bg-main-5 .inline-block{
		font-size: 25px;
		line-height: 100px;
		width: auto !important;
	}

	#bg-main-5 .word-container{
		margin-top: 120px;
		width: 50% !important;
		border-bottom: 8px solid #72bfe7;
		text-align:right;
	}

	#bg-main-5 p{
		font-size: 20px;
		line-height: 25px;
	}

	#bg-main-5 p.large{
		font-size: 45px;
		line-height:50px;
	}

	/* Wake Up Smarter Panel */
	#bg-main-4 img{
		width: 100px;
		height: 100px;
		margin-bottom: 200px;
	}
	#bg-main-4 .word-container{
		border-left: 5px solid white;
		margin-left: 50px;
		padding-top: 260px;
		padding-left: 20px;
	}

	#bg-main-4 div.inline-block{
		width: auto !important;
		font-size: 25px;
		line-height: 100px;
	}

	#bg-main-4 p{
		font-size: 30px;
		line-height: 40px;
	}

	#bg-main-4 .large{
		font-size: 40px;
	}

	#bg-main-4 p.small{
		font-size: 20px;
		line-height:25px;
		margin-bottom: 5px;
		margin-left: 75px;
	}

	/* Quotes panel */
	#bg-main-2 .container{
		text-align:center;
	}
	#bg-main-2 img:nth-child(2){
		width: 350px;
		margin-top: 50px;
	}

	#bg-main-2 img:nth-child(3){
		width: 450px;
		margin-top: -50px;
	}

	#bg-main-2 img:nth-child(5){
		width: 400px;
		margin-top: 0px;
		margin-left: 0px;
	}

	#bg-main-2 img:nth-child(6){
		width: 450px;
		margin-top: -40px;
		margin-left: 120px;
	}

	#bg-main-2 img:nth-child(8){
		width: 400px;
	}

	#bg-main-2 img:nth-child(9){
		width: 465px;
		margin-top: 60px;
		margin-left: 0px;
	}

	#bg-main-2 img:nth-child(11){
		width: 485px;
	}

	#bg-main-2 img:nth-child(12){
		width: 400px;
		margin-top: 50px;
		margin-left: 60px;
	}

	/* New Features mini-panel */
	#new-features{
		background-color: #03172a ;
		padding: 20px 0;
	}

	#new-features .feature-block{
		display: inline-block;
		width: 32%;
		text-align: center;
		vertical-align: top;
		/* cursor: pointer; */
		border-radius: 0px;
	}

	#new-features .feature-block:hover{
		//background-color: rgba(114,191,231,0.1);
		//border-left: 1px solid rgba(255,255,255,0.5);
		//border-top: 1px solid rgba(255,255,255,0.5);
		transition: 300ms;
	}

	#new-features .feature-block p{
		font-weight: 900;
		text-transform: uppercase;
		color: white;
	}

	#new-features .feature-block p.large{
		font-size: 20px;
		line-height: 20px;
		color: #fbe372;
	}

	#new-features img{
		width: 115px;
		margin: 15px;
	}

	#new-features .feature-block:hover img{
		width: 130px;
		margin-top: 0px;
		margin-bottom: 15px;
		transition: 300ms;
	}

	/* Train your Brain Panel */
	#bg-main-6 .container img{
		width: 100px !important;

	}

	#bg-main-6 .inline-block{
		font-size: 25px;
		font-weight: 900;
		margin-left: 40%;
	}
	#bg-main-6 .word-container{
		margin-right: 40px;
		margin-top: 150px;
		border-bottom: 0px solid #fbe372;
	}

	#bg-main-6 .roundBtn {
		border: 2px solid #72bfe7;
		margin-top: 50px;
	}

	#bg-main-6 p{
		font-size: 20px;
		line-height: 25px;
		margin-bottom: 30px;
	}

	#bg-main-6 .large{
		font-size: 45px;
		line-height: 45px;
	}

	/* Risk Free Panel*/
	#risk-free p{
		font-size: 27px;
		line-height: 35px;
	}
	#risk-free p.large{
		font-size: 45px;
		line-height: 50px;
	}

	#risk-free {
		background-image: url('https://sleepshepherd.com/wp-content/uploads/2016/08/moon-cloudlogo-1.png');
		background-position: calc(50% + 420px);
		background-size: 470px;
		background-repeat: no-repeat;
	}

	#risk-free a.btn{
		padding: 10px 30px;
		font-size: 20px;
		text-transform: uppercase;
		border-radius: 25px;
		text-decoration: none;
		color: #72bfe7;
		border: 2px solid #FFF;
		font-weight: 900;
	}

	#risk-free a.btn:hover{
		background-color: #fff;
	}

	#intro-new h1{
		font-size: 33px !important;
	}

}/* END 1001 to 1200px*/

@media (min-width: 1201px) and (max-width: 1300px){

	#intro-new .row{
		margin-left: 0;
		margin-right: 0;
	}

	#intro-new h3{
		font-size: 25px;
		margin-bottom: 0;
	}
	img.retailer-logo{
		height: 50px;
		margin: 10px;
	}

	#intro-new .col-sm-3:nth-child(4) img.retailer-logo{
		width: calc(100% - 0px);
		height: auto;
	}

	#intro-new .col-sm-3:nth-child(4) p{
		font-size: 12px;
	}

	#buy-button-collapse{
		display:none;
	}

	section.blue .services {
		background: url('../img/services-line-big.png') 0 226px no-repeat;
	}

	#background-image{
		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Product-Shot-Compressed.jpg");

		background-repeat: no-repeat;
		background-position: 50% 210px;
		background-size:500px;
		background-color: #bdbcc5;
		height: 450px;

		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Solo-Headband-min-Compressed.png");
		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Solo-Headband-2-min-Compressed.png");
		background-repeat: no-repeat;
		background-position: 85% 15%;
		background-size:400px;
		background-size:550px;
		background-color: #bdbcc5;
	}

	div{
		font-size: 20px;
		line-height: 25px;
	}

	ul{
		line-height: 18px;
	}

	h1{
		font-size: 30px !important;
		line-height: 35px !important;
		text-align: center !important;
		height: 35px !important;
		margin-bottom: 20px !important;
	}

	/* .services .item h2{
		font-size: 25px !important;
	} */

	.top-align{
		top: 60px;
		top: 10%;
		right: 55%;
		text-align: center;
		width: 40%;
		width: 400px;
	}

	.top-align h1{
		margin-bottom: 0 !important;
		margin-top: 0;
	}

	.top-align img{
		width: 90%;
	}

	.services .item div.content{
		font-size: 20px;
	}

	.services .item .graphic,.services .item .graphic  > img{
		width: 150px !important;
		height: 150px !important;
	}

	.services .item .graphic {
		margin-bottom: 20px !important;
	}
	.services .item .graphic > .hover{
		background-size: 145px !important;
		background-position: 3px 1px !important;
	}

	div.services  .arrow{
		height: 0px;
	}

	/* .hover-container{
		padding-top: 10px;
		text-align: center;
	}

	.hover-container > *{
		vertical-align: top;
	}

	#img1{
		position: absolute;
		padding-top: 8%;
		width: 22%;
		z-index: 1;
		right: 68%;
	}
	#img2{
		position: absolute;
		padding-top: 5%;
		width: 25%;
		z-index: 2;
		right: 55%;
	}
	#img3{
		position: absolute;
		padding-top: 3%;
		width: 27%;
		left: 50%;
		margin-left: -13.5%;
		z-index: 3;

	}

	#img4{
		position: absolute;
		padding-top: 5%;
		width: 25%;
		left: 55%;
		z-index: 2;
	}

	#img5{
		position: absolute;
		padding-top: 8%;
		width: 22%;
		left: 68%;
		z-index: 1;
	}

	.hover-container img{
		transition: 300ms;

	}

	.hover-container img:hover{
		width: 30% !important;
		padding: 0 !important;
		transition: 300ms;
		z-index: 999 !important;
	}

	#img3:hover{
		width: 30% !important;
		margin-left: -15% !important;
	}

	#img1:hover{
		margin-right: -2.5%
	}

	#img2:hover{
		margin-right: -3%;
	}

	#img4:hover{
		margin-left: -3%;
	}

	#img5:hover{
		margin-left: -2.5%
	}



	.hover-container h1{
		position: absolute;
		display: inline-block;
		top: 7%;
		opacity: 0;
		transition: opacity 300ms;
		width: 100%;
		text-align: center;
		margin-bottom: 0;
		font-size: 20px;
		line-height: 25px;
		height: 25px;
	}

	.hover-container .solid{
		opacity: 1;
		transition: opacity 300ms;
	}

	#head1{
		right: 70%;
		right: 50%;
		margin-right: -50%;
	}

	#head2{
		right: 61%;
		right: 50%;
		margin-right: -50%;
	}

	#head3{
		left: 50%;
		margin-left: -50%;
	}

	#head4{
		left: 61%;
		left: 50%;
		margin-left: -50%;
	}

	#head5{
		left: 70%;
		left: 50%;
		margin-left: -50%;
	}

	.hover-container p{
		position: absolute;
		display: inline-block;
		width: 100%;
		bottom: 15%;
		bottom: -1%;
		margin-bottom: 20px;
		text-align: center;
		opacity: 0;
		transition: opacity 300ms;
		font-size: 13px;

	}

	#p1{
		right: 70%;
		right: 50%;
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p2{
		right: 61%;
		right: 50%;
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p3{
		left: 50%;
		margin-left: -12.5%;
		margin-left: -50%;
	}
	#p4{
		left: 61%;
		left: 50%;
	  margin-left: -12.5%;
	  margin-left: -50%;
	}
	#p5{
		left: 70%;
		left: 50%;
	  margin-left: -12.5%;
	  margin-left: -50%;
	}

	#carouselContainer{
		padding: 0;
	}

	#carouselContainer .container.compact{
		max-width: 100%;
		height:350px;
		background-color: #bfc3c9;
	} */




	/* -- Hover Container Beginning -- */
	.hover-container{
		padding-top: 10px;
		text-align: center;
	}

	.hover-container > *{
		vertical-align: top;
	}

	#img1{
		position: absolute;
		padding-top: 15%;
		padding-top: 152.6px ;
		width: 10%;
		width: 130px;
		z-index: 1;
		right: 63%;
		right: calc(50% + 197px);
	}
	#img2{
		position: absolute;
		padding-top: 13%;
		padding-top: 120px ;
		width: 12%;
		width: 156px;
		z-index: 2;
		right: 55%;
		right: calc(50% + 70px);
	}
	#img3{
		position: absolute;
		padding-top: 10%;
		padding-top: 75.8px ;
		width: 15%;
		width: 195px;
		left: 50%;
		margin-left: -7.5%;
		margin-left: -97.5px;
		z-index: 3;

	}

	#img4{
		position: absolute;
		padding-top: 13%;
		padding-top: 120px ;
		width: 12%;
		width: 156px;
		left: 55%;
		left: calc(50% + 70px);
		z-index: 2;
	}

	#img5{
		position: absolute;
		padding-top: 15%;
		padding-top: 152.6px ;
		width: 10%;
		width: 130px;
		left: 63%;
		left: calc(50% + 197px);
		z-index: 1;
	}

	.hover-container img{
		transition: 300ms;

	}

	.hover-container img:hover{
		width: 18% !important;
		width: 234px !important;
		padding-top: 7% !important;
		padding-top: 40px !important;
		transition: 300ms;
		z-index: 999 !important;
	}

	#img3:hover{
		margin-left: -117px;
	}

	#img1:hover{
		margin-right: -52px;
	}

	#img2:hover{
		margin-right: -39px;
	}

	#img4:hover{
		margin-left: -39px;
	}

	#img5:hover{
		margin-left: -52px;
	}



	.hover-container h1{
		position: absolute;
		display: inline-block;
		top: 7%;
		opacity: 0;
		transition: opacity 300ms;
		width: 100%;
		text-align: center;
		margin-bottom: 0;
		font-size: 20px;
		line-height: 25px;
		height: 25px;
	}

	.hover-container .solid{
		opacity: 1;
		transition: opacity 300ms;
	}

	#head1{
		right: 70%;
		right: calc(50% + 197px + 65px);
		/* right: 50%; */
		margin-right: -50%;
	}

	#head2{
		right: 61%;
		right:calc(50% + 70px + 78px);
		/* right: 50%; */
		margin-right: -50%;
	}

	#head3{
		left: 50%;
		margin-left: -50%;
	}

	#head4{
		left: 61%;
		left:calc(50% + 70px + 78px);
		/* left: 50%; */
		margin-left: -50%;
	}

	#head5{
		left: 70%;
		left: calc(50% + 197px + 65px);
		/* left: 50%; */
		margin-left: -50%;
	}

	.hover-container p{
		position: absolute;
		display: inline-block;
		width: 100%;
		bottom: 15%;
		bottom: -1%;
		margin-bottom: 20px;
		text-align: center;
		opacity: 0;
		transition: opacity 300ms;
		font-size: 16px;

	}

	#p1{
		right: 70%;
		right: calc(50% + 197px + 65px);
		/* right: 50%; */
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p2{
		right: 61%;
		right:calc(50% + 70px + 78px);
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p3{
		left: 50%;
		margin-left: -12.5%;
		margin-left: -50%;
	}
	#p4{
		left: 61%;
		left:calc(50% + 70px + 78px);
		margin-left: -12.5%;
		margin-left: -50%;
	}
	#p5{
		left: 70%;
		left: calc(50% + 197px + 65px);
		/* left: 50%; */
		margin-left: -12.5%;
		margin-left: -50%;
	}

	#carouselContainer{
		padding: 0;
	}

	#carouselContainer .container.compact{
		max-width: 100%;
		height:650px;
		background-color: #bfc3c9;
	}

	/* -- Hover Container End -- */

	section#alarm{
		background-image: url("https://sleepshepherd.com/wp-content/uploads/2016/02/bedroom-416063.jpg");
		background-repeat: no-repeat;
		background-position: 50% center;
		background-size:100%;
		background-size:711px 400px;
		background-size:50%;
		height: 400px;
		margin-top:0;
	}

	section#alarm img{
		position: absolute;
		width: 20%;
		left: 50%;
		bottom: 0;
		margin-left: -45%;
	}

	section#how-it-works{
		text-align:left;
	}

	#brainwaveLabel2{
		position: absolute;
		display: inline-block;
		left: 576px;
		left: 79%;
		left: calc(60% + 170px);
		top: 83px;
		top: 17%;
		width: 20%;
		/* width: 150px; */
		text-align:center;
		font-size: 20px;
	}

	#toneLabel2{
		position: absolute;
		display: inline-block;
		left: 576px;
		left: 79%;
		left: calc(60% + 170px);
		top: 230px;
		top: 48%;
		width: 20%;
		/* width: 150px; */
		text-align:center;
		font-size: 20px;

	}

	section#how-it-works ul{
		margin-top: 0px;
		text-align: left;
		font-size: 20px;
		line-height: 25px;
	}

	section#how-it-works img{

		margin-top: 45px;
		margin-bottom: 45px;
		width: 80%;
		/* width: 375px; */

	}

	section#how-it-works p{
		font-size: 20px;
	}

	section#comparison .container{
		padding-right: 5px;
		padding-left: 5px;

	}

	section#comparison table{
		width: 100%;
		font-size: 20px;
		color: #33495d;
		table-layout: fixed;

	}

	section#comparison table tr th,section#comparison table tr td{
		padding: 1%;
		font-size: 16px;
	}

	section#comparison table  th img{
		width: 80px;
	}

	section#comparison table tr:first-child td:nth-child(2) img{
		width: 60px;
	}

	section#comparison table tr:first-child{
		vertical-align: bottom;
	}
	section#comparison table tr:first-child p{
		margin-bottom: 0;
	}

	section.bg-image{
		min-height: 700px ;
		height: 700px ;
	}

	section.bg-image div.container div:nth-child(2){
		/* width: calc(100% - 10px) !important;
		width: 400px !important; */
		padding: 0 !important;
	}

	section.bg-image div.container div:nth-child(2) img{
		width: 200px !important;
	}

	section.bg-image div.container div:nth-child(2) ul{
		font-size: 25px !important;
		line-height: 30px;
		width: 400px;
		/* margin: 0 auto; */
	}

	#introduction .title-container img{
		margin-top: -35px;
	}

	/*-------------------------------------------------*/
	/* New Landing
	/*-------------------------------------------------*/

	.vertAlign{
  display: inline-block;
  width: 0px;
  height: 100%;
  vertical-align: bottom;
  background-color: yellow;
}
#bg-main .bottomAlign{
  display:inline-block;
  vertical-align: bottom;
  background-color: none;
  margin-bottom: 0px;
  width: auto !important;
}

#bg-main .bottomAlign h1{
  font-size: 70px !important;
    line-height: 75px !important;
    height: 75px !important;
    font-weight: 500 !important;
    margin-bottom: 0px !important;
	font-variant: small-caps;
	text-transform: capitalize;
	color: #72bfe7;
}

#bg-main .bottomAlign h1.small{
   font-size: 50px !important;
    line-height: 50px !important;
    height: 50px !important;
    font-weight: 900 !important;
}

#bg-main .bottomAlign h4{
	font-size: 25px !important;
	font-weight: 600;
	text-transform: uppercase !important;
	color: white;
	font-variant: small-caps;
	text-transform: none !important;
	margin-top: 15px;
}

#bg-main .bottomUnderline{
  border-bottom: 3px solid white;
display:inline-block;
padding-bottom: 0px;

}

#bg-main .bottomAlign .leftPadding{
  padding-left: 80px !important;
  width: auto !important;
}

#bg-main .leftPadding p{
	display:block !important;
	text-transform: uppercase;
	font-size: 16px;
	font-weight: 500;
}

#bg-main .bottomAlign .smallLeftPadding{
  padding-left: 40px !important;
  margin-top: 40px;
}

#bg-main .bottomAlign .smallLeftPadding div{
	width: auto !important;
}

#bg-main .buttonContainer{
	margin-top: 30px;
	margin-bottom: 30px;
}

.yellow{
   color: #fbe372 !important;
}

.bold{
   font-weight: 900 !important;
}

h1.leftAlign{
    text-align: left !important;
}

#bg-main img.featuredInImg{
width: 120px !important;
margin: 10px !important;
}


.roundBtn{
	background-color: transparent;
	border-radius: 25px;
	border: 2px solid white;
	padding: 10px 30px;
	margin: 10px;

}

.roundBtn a{
	text-decoration: none;
	color: white;
	font-size: 14px;
	font-weight: bold;
}

.roundBtn:hover{
	background-color: white;
	border: 2px solid white !important;
}

.roundBtn:hover a{
	color: black;
	text-decoration: none;
}

.roundBtn.blue {
	background-color: #72bfe7;
	border: 2px solid #72bfe7;
}

.roundBtn.blue:hover{
	background-color: white;
}

.roundBtn.blue:hover a{
	color: black;
}

	/*-------------------------------------------------*/
	/*-------------------------------------------------*/

.padding{
	padding: 50px;
}

.inline-block{
	display: inline-block;
}

/*Sleep Solved Panel*/
#bg-main-3{
	min-height: 700px;
	height: 700px;
}

#bg-main-3 #word-container{
	float: left;
	padding-right: 5px;
}

#bg-main-3 p{
	color: #72bfe7;
	font-weight: 800;
	font-size: 59px;
	font-size: 35px;
	line-height: 45px;
	text-transform: uppercase;
}

#bg-main-3 p.large{
	font-size: 55px;
	margin-bottom: 10px;
}

#bg-main-3 p span.dark{
	color: #33495d;
}

#bg-main-3 a{
	font-size: 20px;
	font-weight: bold;
	text-decoration:none;
	padding: 10px 30px;
	color: #33495d;
	border: 2px solid #33495d;
	border-radius: 20px;
	text-transform: uppercase;
}

#bg-main-3 a:hover{
	background-color: #33495d;
	color: white;
}

#bg-main-3 div.line{
	width: auto !important;
	overflow:hidden;
	height: 10px;
    background-color: #72bfe7;
    margin-top: 175px;

}

	/* Say Hello Panel*/
	#bg-main-5 .container{
		padding-top: 20px;
	}
	#bg-main-5 img{
		width: 100px;
		height: 100px;
		margin-left: 75px;
	}

	#bg-main-5 .store-logo-container{
		width: 50%;
		text-align:right;
	}

	#bg-main-5 img.store-logo{
		height: 49.5px;
		width: auto;
		margin:20px;
	}

	#bg-main-5 a:nth-child(2) img.store-logo{
		height: 75px;
		margin-right: -13px;
		margin-left: 0;
	}

	#bg-main-5 .inline-block{
		font-size: 25px;
		line-height: 100px;
		width: auto !important;
	}


	#bg-main-5 .word-container{
		margin-top: 80px;
		width: 50% !important;
		border-bottom: 8px solid #72bfe7;
		text-align:right;
	}

	#bg-main-5 p{
		font-size: 25px;
		line-height: 30px;
	}

	#bg-main-5 p.large{
		font-size: 55px;
		line-height:55px;
	}

	/* Wake Up Smarter Panel */
	#bg-main-4 img{
		width: 100px;
		height: 100px;
		margin-bottom: 200px;
	}
	#bg-main-4 .word-container{
		border-left: 5px solid white;
		margin-left: 50px;
		padding-top: 260px;
		padding-left: 20px;
	}

	#bg-main-4 div.inline-block{
		font-size: 25px;
		line-height: 100px;
	}

	#bg-main-4 p{
		font-size: 40px;
		line-height: 40px;
	}

	#bg-main-4 .large{
		font-size: 50px;
	}

	#bg-main-4 p.small{
		font-size: 24px;
		line-height:30px;
		margin-bottom: 5px;
		margin-left: 75px;
	}

	/* Quotes panel */
	#bg-main-2 .container{
		text-align:center;
	}
	#bg-main-2 img:nth-child(2){
		width: 390px;
		margin-top: 0px;
	}

	#bg-main-2 img:nth-child(3){
		width: 650px;
		margin-top: -50px;
	}

	#bg-main-2 img:nth-child(5){
		width: 500px;
		margin-top: 0px;
		margin-left: -50px;
	}

	#bg-main-2 img:nth-child(6){
		width: 550px;
		margin-top: -40px;
		margin-left: 50px;
	}

	#bg-main-2 img:nth-child(8){
		width: 500px;
	}

	#bg-main-2 img:nth-child(9){
		width: 565px;
		margin-top: 60px;
		margin-left: 40px;
	}

	#bg-main-2 img:nth-child(11){
		width: 585px;
	}

	#bg-main-2 img:nth-child(12){
		width: 500px;
		margin-top: 50px;
		margin-left: 60px;
	}

	/* New Features mini-panel */
	#new-features{
		background-color: #03172a ;
		padding: 20px 0;
	}

	#new-features .feature-block{
		display: inline-block;
		width: 32%;
		text-align: center;
		vertical-align: top;
		/* cursor: pointer; */
		border-radius: 0px;
	}

	#new-features .feature-block:hover{
		//background-color: rgba(114,191,231,0.1);
		//border-left: 1px solid rgba(255,255,255,0.5);
		//border-top: 1px solid rgba(255,255,255,0.5);
		transition: 300ms;
	}

	#new-features .feature-block p{
		font-weight: 900;
		text-transform: uppercase;
		color: white;
	}

	#new-features .feature-block p.large{
		font-size: 20px;
		line-height: 20px;
		color: #fbe372;
	}

	#new-features img{
		width: 115px;
		margin: 15px;
	}

	#new-features .feature-block:hover img{
		width: 130px;
		margin-top: 0px;
		margin-bottom: 15px;
		transition: 300ms;
	}

	/* Train your Brain Panel */
	#bg-main-6 .container img{
		width: 100px !important;
		/* margin-left: 50%; */
	}

	#bg-main-6 .inline-block{
		font-size: 25px;
		margin-left: 50%;
	}

	#bg-main-6  .word-container{
		margin-right: 50px;
		margin-top: 135px;
		border-bottom: 0px solid #fbe372;
	}

	#bg-main-6 .roundBtn{
		border: 2px solid #72bfe7;
		margin-top: 50px
	}

	#bg-main-6 p{
		font-size: 20px;
		line-height: 25px;
		margin-bottom: 40px;
	}

	#bg-main-6 .large{
		font-size: 55px;
		line-height: 55px;
	}

	/* Risk Free Panel*/
	#risk-free p{
		font-size: 27px;
		line-height: 35px;
	}
	#risk-free p.large{
		font-size: 45px;
		line-height: 50px;
	}

	#risk-free {
		background-image: url('https://sleepshepherd.com/wp-content/uploads/2016/08/moon-cloudlogo-1.png');
		background-position: calc(50% + 450px);
		background-size: 470px;
		background-repeat: no-repeat;
	}

	#risk-free a.btn{
		padding: 10px 30px;
		font-size: 20px;
		text-transform: uppercase;
		border-radius: 25px;
		text-decoration: none;
		color: #72bfe7;
		border: 2px solid #FFF;
		font-weight: 900;
	}

	#risk-free a.btn:hover{
		background-color: #fff;
	}

} /* END 1201px - 1300px*/

@media (min-width: 1301px) {

	#intro-new .row{
		margin-left: 0;
		margin-right: 0;
	}

	#intro-new h3{
		font-size: 25px;
		margin-bottom: 0;
	}

	#intro-new .row{
		width: 80%;
		margin-left: 10%;
	}

	img.retailer-logo{
		height: 50px;
		margin: 10px;
	}

	#intro-new .col-sm-3:nth-child(1) img.retailer-logo{
		height: 60px;
	}

	#intro-new .col-sm-3:nth-child(4) img.retailer-logo{
		width: calc(100% - 0px);
		height: auto;
	}

	#intro-new .col-sm-3:nth-child(4) p{
		font-size: 12px;
	}

	#press-panel .container.compact{
		max-width: 1300px;
	}

	#press-panel img {
		width: 14%;
		margin: 1% 2.5%;
	}

	#buy-button-collapse{
		display:none;
	}

	 section.blue .services {
		background: url('../img/services-line-big.png') 0 226px no-repeat;
	}

	#background-image{
		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Product-Shot-Compressed.jpg");

		background-repeat: no-repeat;
		background-position: 50% 210px;
		background-size:500px;
		background-color: #bdbcc5;
		height: 475px;

		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Solo-Headband-min-Compressed.png");
		background-image: url("http://localhost/projects/www/wordpress/wp-content/uploads/2016/01/Solo-Headband-2-min-Compressed.png");
		background-repeat: no-repeat;
		background-position: 110% 15%;
		background-size:400px;
		background-size:600px;
		background-color: #bdbcc5;
	}

	div{
		font-size: 20px;
		line-height: 25px;
	}

	ul{
		line-height: 25px;
	}

	h1{
		font-size: 30px !important;
		line-height: 35px !important;
		text-align: center !important;
		height: 35px !important;
		margin-bottom: 20px !important;
	}

	/* .services .item h2{
		font-size: 25px !important;
	} */

	.top-align{
		top: 60px;
		top: 25%;
		left: 25%;
		text-align: left;
		width: 40%;
		width: 800px;
	}

	.top-align h1{
		margin-bottom: 0 !important;
		margin-top: 0;
		text-align: left !important;
	}

	.top-align img{
		width: 50%;
	}

	.services .item div.content{
		font-size: 20px;
	}

	.services .item .graphic,.services .item .graphic  > img{
		width: 150px !important;
		height: 150px !important;
	}

	.services .item .graphic {
		margin-bottom: 20px !important;
	}
	.services .item .graphic > .hover{
		background-size: 145px !important;
		background-position: 3px 1px !important;
	}

	div.services  .arrow{
		height: 0px;
	}

	/* -- Hover Container Beginning -- */
	.hover-container{
		padding-top: 10px;
		text-align: center;
	}

	.hover-container > *{
		vertical-align: top;
	}

	#img1{
		position: absolute;
		padding-top: 15%;
		padding-top: 192.6px ;
		padding-top: 132.6px ;
		width: 10%;
		width: 130px;
		z-index: 1;
		right: 63%;
		right: calc(50% + 197px);
	}
	#img2{
		position: absolute;
		padding-top: 13%;
		padding-top: 160px ;
		padding-top: 100px ;
		width: 12%;
		width: 156px;
		z-index: 2;
		right: 55%;
		right: calc(50% + 70px);
	}
	#img3{
		position: absolute;
		padding-top: 10%;
		padding-top: 115.8px ;
		padding-top: 55.8px ;
		width: 15%;
		width: 195px;
		left: 50%;
		margin-left: -7.5%;
		margin-left: -97.5px;
		z-index: 3;

	}

	#img4{
		position: absolute;
		padding-top: 13%;
		padding-top: 160px ;
		padding-top: 100px ;
		width: 12%;
		width: 156px;
		left: 55%;
		left: calc(50% + 70px);
		z-index: 2;
	}

	#img5{
		position: absolute;
		padding-top: 15%;
		padding-top: 192.6px ;
		padding-top: 132.6px ;
		width: 10%;
		width: 130px;
		left: 63%;
		left: calc(50% + 197px);
		z-index: 1;
	}

	.hover-container img{
		transition: 300ms;

	}

	.hover-container img:hover{
		width: 18% !important;
		width: 234px !important;
		padding-top: 7% !important;
		padding-top: 40px !important;
		transition: 300ms;
		z-index: 999 !important;
	}

	#img3:hover{
		margin-left: -117px;
	}

	#img1:hover{
		margin-right: -52px;
	}

	#img2:hover{
		margin-right: -39px;
	}

	#img4:hover{
		margin-left: -39px;
	}

	#img5:hover{
		margin-left: -52px;
	}



	.hover-container h1{
		position: absolute;
		display: inline-block;
		top: 7%;
		opacity: 0;
		transition: opacity 300ms;
		width: 100%;
		text-align: center;
		margin-bottom: 0;
		font-size: 20px;
		line-height: 25px;
		height: 25px;
	}

	.hover-container .solid{
		opacity: 1;
		transition: opacity 300ms;
	}

	#head1{
		right: 70%;
		right: calc(50% + 197px + 65px);
		/* right: 50%; */
		margin-right: -50%;
	}

	#head2{
		right: 61%;
		right:calc(50% + 70px + 78px);
		/* right: 50%; */
		margin-right: -50%;
	}

	#head3{
		left: 50%;
		margin-left: -50%;
	}

	#head4{
		left: 61%;
		left:calc(50% + 70px + 78px);
		/* left: 50%; */
		margin-left: -50%;
	}

	#head5{
		left: 70%;
		left: calc(50% + 197px + 65px);
		/* left: 50%; */
		margin-left: -50%;
	}

	.hover-container p{
		position: absolute;
		display: inline-block;
		width: 100%;
		bottom: 15%;
		bottom: -1%;
		margin-bottom: 20px;
		text-align: center;
		opacity: 0;
		transition: opacity 300ms;
		font-size: 16px;

	}

	#p1{
		right: 70%;
		right: calc(50% + 197px + 65px);
		/* right: 50%; */
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p2{
		right: 61%;
		right:calc(50% + 70px + 78px);
	  margin-right: -12.5%;
	  margin-right: -50%;
	}
	#p3{
		left: 50%;
		margin-left: -12.5%;
		margin-left: -50%;
	}
	#p4{
		left: 61%;
		left:calc(50% + 70px + 78px);
		margin-left: -12.5%;
		margin-left: -50%;
	}
	#p5{
		left: 70%;
		left: calc(50% + 197px + 65px);
		/* left: 50%; */
		margin-left: -12.5%;
		margin-left: -50%;
	}

	#carouselContainer{
		padding: 0;
	}

	#carouselContainer .container.compact{
		max-width: 100%;
		height:650px;
		background-color: #bfc3c9;
	}

	/* -- Hover Container End -- */

	section#alarm{
		background-image: url("https://sleepshepherd.com/wp-content/uploads/2016/02/bedroom-416063.jpg");
		background-repeat: no-repeat;
		background-position: 50% center;
		background-size:100%;
		background-size:711px 400px;
		background-size:50%;
		height: 400px;
		margin-top:0;
	}

	section#alarm img{
		position: absolute;
		width: 20%;
		left: 50%;
		bottom: 0;
		margin-left: -45%;
	}

	section#how-it-works{
		text-align:left;
	}

	#brainwaveLabel2{
		position: absolute;
		display: inline-block;
		left: 576px;
		left: 79%;
		left: calc(60% + 160px);
		top: 83px;
		top: 17%;
		width: 10%;
		/* width: 150px; */
		text-align:center;
	}

	#toneLabel2{
		position: absolute;
		display: inline-block;
		left: 576px;
		left: 79%;
		left: calc(60% + 160px);
		top: 230px;
		top: 48%;
		width: 10%;
		/* width: 150px; */
		text-align:center;

	}

	section#how-it-works ul{
		margin-top: 0px;
		text-align: left;
	}

	section#how-it-works img{

		margin-top: 45px;
		margin-bottom: 45px;
		width: 80%;
		/* width: 375px; */

	}

	section#how-it-works p{
		font-size: 20px;
	}

	section#comparison table{
	width: 100%;
	font-size: 20px;
	color: #33495d;
	table-layout: fixed;

}

	section#comparison table tr th,section#comparison table tr td{
		padding: 1%;
		font-size: 16px;
	}

	section#comparison table td img{
		width: 40px;
	}

	section#comparison table th img{
		width: 80px;
	}

	section#comparison table th p{
		margin: 0px;
	}

	section#comparison table tr:first-child{
		vertical-align:bottom;
	}

	#introduction .title-container img{
		margin-top: -35px;
	}


.roundBtn{
	background-color: transparent;
	border-radius: 30px;
	border: 2px solid white;
	padding: 10px 30px;
	margin: 10px;

}

.roundBtn a{
	text-decoration: none;
	color: white;
	font-size: 20px;
	font-weight: bold;
}

.roundBtn:hover{
	background-color: white;
	border: 2px solid white !important;
}

.roundBtn:hover a{
	color: black;
	text-decoration: none;
}

.roundBtn.blue {
	background-color: #72bfe7;
	border: 2px solid #72bfe7;
}

.roundBtn.blue:hover{
	background-color: white;
}

.roundBtn.blue:hover a{
	color: black;
}


	/*-------------------------------------------------*/
	/* New Landing
	/*-------------------------------------------------*/

.vertAlign{
  display: inline-block;
  width: 0px;
  height: 100%;
  vertical-align: bottom;
  background-color: yellow;
}

#bg-main{
	min-height:720px;
	height: 720px;
}

#bg-main .bottomAlign{
  display:inline-block;
  vertical-align: bottom;
  background-color: none;
  margin-bottom: 0px;
}

#bg-main .bottomAlign h1{
	font-size: 70px !important;
    font-weight: 500 !important;
    margin-top: 0;
	margin-bottom: 0 !important;
    line-height: 70px !important;
    height: auto !important;
	color: #72bfe7;
	text-transform: none !important;
	font-variant: small-caps;
}

#bg-main .bottomAlign h1.small{
	font-size: 50px !important;
    margin-bottom: 0px !important;
    line-height: 50px !important
}

#bg-main .bottomAlign h4{
   font-size: 25px !important;
   font-weight: 600 !important;
   text-transform: none !important;
	color: white;
	font-variant: small-caps;
}

#bg-main .leftPadding p{
	display:block !important;
	text-transform: uppercase;
	font-size: 16px;
	font-weight: 500;
}



#bg-main .bottomUnderline{
  border-bottom: 3px solid white;
display:inline-block;
margin-bottom: 20px;
padding-bottom: 20px;
}

#bg-main .bottomAlign .leftPadding{
  padding-left: 100px !important;
}

#bg-main .bottomAlign .smallLeftPadding{
  padding-left: 50px !important;
  margin-top: 20px;
}

#bg-main .buttonContainer{
	margin-top: 40px;
	margin-bottom: 40px;
}

.yellow{
   color: #fbe372 !important;
}

.bold{
   font-weight: bold !important;
}

h1.leftAlign{
    text-align: left !important;
}

#bg-main img.featuredInImg{
width: 150px !important;
margin: 20px !important;
}
	/*-------------------------------------------------*/
	/*-------------------------------------------------*/

.padding{
	padding: 50px;
}

.inline-block{
	display: inline-block;
}

/*Sleep Solved Panel*/
#bg-main-3{
	min-height: 900px;
	height: 900px;
}

#bg-main-3 #word-container{
	float: left;
	padding-right: 5px;
}

#bg-main-3 p{
	color: #72bfe7;
	font-weight: 900;
	font-size: 59px;
	font-size: 35px;
	line-height: 45px;
	text-transform: uppercase;
	margin-bottom: 50px;
}

#bg-main-3 p.large{
	font-size: 85px;
	margin-bottom: 30px;
	margin-top: 50px;
}

#bg-main-3 p span.dark{
	color: #33495d;
}

#bg-main-3 a{
	font-size: 30px;
	font-weight: bold;
	text-decoration:none;
	padding: 10px 30px;
	color: #33495d;
	border: 4px solid #33495d;
	border-radius: 30px;
	text-transform: uppercase;
	margin-top: 20px;
}

#bg-main-3 a:hover{
	background-color: #33495d;
	color: white;
}

#bg-main-3 div.line{
	overflow:hidden;
	height: 10px;
    background-color: #72bfe7;
    margin-top: 175px;

}


	/* Say Hello Panel*/
	/* #bg-main-5 .container{
		padding-top: 20px;
	}
	#bg-main-5 img{
		width: 100px;
		height: 100px;
		margin-left: 75px;
	}
	#bg-main-5 .store-logo-container{
		width: 50%;
		text-align:right;
	}

	#bg-main-5 img.store-logo{
		height: 49.5px;
		width: auto;
		margin:20px;
	}

	#bg-main-5 a:nth-child(2) img.store-logo{
		height: 75px;
		margin-right: -13px;
		margin-left: 0;
	}

	#bg-main-5 .inline-block{
		font-size: 30px;
		font-weight: 900;
		color: #fbe372;
		text-transform: uppercase;
		vertical-align: top;
		line-height: 100px;
	}

	#bg-main-5 .word-container{
		margin-top: 150px;
		width: 50%;
		border-bottom: 8px solid #72bfe7;
		text-align:right;
	}

	#bg-main-5 p{
		font-size: 25px;
		line-height: 30px;
		font-weight: 900;
		text-transform: uppercase;
	}

	#bg-main-5 p.large{
		font-size: 65px;
		line-height:65px;
	}

	#bg-main-5 .yellow{
		color: #fbe372;
	}

	#bg-main-5 .blue{
		color: #72bfe7;
	} */




	/* Quotes panel */
	#bg-main-2 .container{
		text-align:center;
	}
	#bg-main-2 img:nth-child(2){
		width: 390px;
		margin-top: 100px;
	}

	#bg-main-2 img:nth-child(3){
		width: 650px;
		margin-top: -50px;
	}

	#bg-main-2 img:nth-child(5){
		width: 500px;
		margin-top: 60px;
		margin-left: -50px;
	}

	#bg-main-2 img:nth-child(6){
		width: 600px;
		margin-top: -40px;
		margin-left: 80px;
	}

	#bg-main-2 img:nth-child(8){
		width: 600px;
	}

	#bg-main-2 img:nth-child(9){
		width: 565px;
		margin-top: 60px;
		margin-left: 80px;
	}

	#bg-main-2 img:nth-child(11){
		width: 585px;
	}

	#bg-main-2 img:nth-child(12){
		width: 500px;
		margin-top: 50px;
		margin-left: 60px;
	}

	/* New Features mini-panel */
	#new-features{
		background-color: #03172a ;
		padding: 20px 0;
	}

	#new-features .feature-block{
		display: inline-block;
		width: 32%;
		text-align: center;
		vertical-align: top;
		/* cursor: pointer; */
		border-radius: 0px;
	}

	#new-features .feature-block:hover{
		//background-color: rgba(114,191,231,0.1);
		//border-left: 1px solid rgba(255,255,255,0.5);
		//border-top: 1px solid rgba(255,255,255,0.5);
		transition: 300ms;
	}

	#new-features .feature-block p{
		font-weight: 900;
		text-transform: uppercase;
		color: white;
	}

	#new-features .feature-block p.large{
		font-size: 20px;
		line-height: 20px;
		color: #fbe372;
	}

	#new-features img{
		width: 115px;
		margin: 15px;
	}

	#new-features .feature-block:hover img{
		width: 130px;
		margin-top: 0px;
		margin-bottom: 15px;
		transition: 300ms;
	}

	/* Risk Free Panel*/
	#risk-free p{
		font-size: 27px;
		line-height: 35px;
	}
	#risk-free p.large{
		font-size: 35px;
		line-height: 50px;
	}

	#risk-free {
		background-image: url('https://sleepshepherd.com/wp-content/uploads/2016/08/moon-cloudlogo-1.png');
		background-position: calc(50% + 450px);
		background-size: 500px;
		background-repeat: no-repeat;
	}

	#risk-free a.btn{
		padding: 10px 30px;
		font-size: 20px;
		text-transform: uppercase;
		border-radius: 25px;
		text-decoration: none;
		color: #72bfe7;
		border: 2px solid #FFF;
		font-weight: 900;
	}

	#risk-free a.btn:hover{
		background-color: #fff;
	}

}/* END 1301+ px*/

/* --- Media specific styling for introduction section --- */
@media (max-width:599px) and (min-width: 0px) {
	section#introduction{
		background-color: #bdbcc5;
		background: linear-gradient(to bottom left,  #a19fac, #bdbcc5, #bdbcc5, #ddd);
		background: linear-gradient(to bottom,  #a19fac, #bdbcc5, #bdbcc5, #ddd);
		background: linear-gradient(to bottom,  #a19fac, #bdbcc5,#ccc,#bdbcc5,#a19fac);

		/* background-color: #ddd; */
	}

	#carouselContainer .container.compact{
		background: linear-gradient(to bottom,  #a19fac, #bdbcc5,#ccc,#bdbcc5,#a19fac);
	}

	section#introduction{
		background-color: #bdbcc5;
	}

	.intro-container > *{
		vertical-align: middle;
	}

	.intro-container .title-container{
		width: 100%;
		display: inline-block;
		text-align:center;
	}

	.intro-container .title-container img{
		width: 90%;
	}

	.intro-container .title-container h1{
	}


	.image-container{
		display: inline-block;
		width: 100%;
	}
	.intro-container .image-container img {
		width: 100%;
		margin-top: 30px;
	}

}

@media (min-width:600px) {

	section#introduction{
		background-color: #bdbcc5;
		background: linear-gradient(to bottom left,  #a19fac, #bdbcc5, #bdbcc5, #ddd);
		background: linear-gradient(to bottom,  #a19fac, #bdbcc5, #bdbcc5, #ddd);
		background: linear-gradient(to bottom,  #a19fac, #bdbcc5,#ccc,#bdbcc5,#a19fac);

		/* background-color: #ddd; */
	}

	#carouselContainer .container.compact{
		background: linear-gradient(to bottom,  #a19fac, #bdbcc5,#ccc,#bdbcc5,#a19fac);
	}

	.intro-container > *{
		vertical-align: middle;
	}

	.intro-container .title-container{
		width: 50%;
		display: inline-block;
	}

	.intro-container .title-container img{
		width: 90%;
	}

	.intro-container .title-container h1:after{
		height: 0;
		color:
	}


	.image-container{
		display: inline-block;
		width: 49%;
	}
	.intro-container .image-container img {
		width: 100%;

	}

}

@media (max-width: 991px){
	.benefit-description{
		width: 50%;
		margin: 0 auto;
	}


}