@charset "utf-8";


@media screen and (max-width: 390px) {  
   .intro {
      font-size: 1em;
   }
	
}


@media screen and (min-width: 400px) {  
	.overlay {
		top:20%;
}
	.overlay p {
		font-size:.8em;
	}
	
	#service .flex2 p {
		font-size:1.25em;
	}
	
}


@media screen and (min-width: 500px) {  

	img.right {
		float: right;
		display: inline;
		margin: 1em 2em 1em 1.5em;
		width:  40%;   /* So will stay proportional to the paragraph its inside */
		max-width:250px;
	}
	
	img.left {
		float: left;
		display: inline;
		margin: 1em 1.5em 1em 0;
		/* width:  40%;   /* So will stay proportional to the paragraph its inside */
		/* min-width: 200px;  /* So won't be too small on small screens  */
		max-width: 250px;
	}
	
	img.ashlyn {
		margin-bottom: 3em;
	}
	
	img.right.m200, img.left.m200 {
		max-width: 200px;
	}
	
	img.right.m150, img.left.m150 {
		max-width: 150px;
	}
	
	
	.right {
		float: right;
		clear: none;
	}
	
	.left {
		float: left;
		clear: none;
	}
	
	.overlay p {
		font-size:1em;
	}
	
	.intro img.right {
		margin-bottom: 2em;
		margin-top:0em;
	}

}


@media screen and (min-width: 600px) {  
	
.form-wrapper {
	width: 60%;
}
	
.bioPic {
   float:left; 
   margin-right: 15px; 
   max-width: 250px;
	margin-left: 0;
}

	
}


@media screen and (min-width: 700px) {
	
   header {
	   display: flex;
	   display: -webkit-flex;
	   display: ms-flexbox;
	   flex-wrap:nowrap;
	    -webkit-flex-wrap: nowrap; 
	    -ms-flex-wrap: nowrap;
	   justify-content:  space-between;          /*    flex-start, center, space-between, space-around, flex-end    */
		 -webkit-justify-content: space-between;
		 -ms-flex-pack: justify;                  /*    start, end, center, justify  */

	   align-items: stretch;                  /*    stretch, flex-start, flex-end, center, baseline    */
		-webkit-align-items: stretch;
		-ms-flex-align: stretch;
   }
   
	#hdr-left {
		flex: 1 1 34%;
		text-align: left;
		margin-right: 1em;
		margin-top: .5em;
	}

	#hdr-center {
		flex: 1 1 34%;
		align-self: center;
	}
	
	#hdr-center p {
      font-size: 1.15em;
		line-height: 1.25em;
      margin-bottom: 0;
   }

	#hdr-right {
		flex: 1 1 25%;
		
	}
	
	.bg-image {
		background-image: url("../images/planet-bg800.jpg");
	}
	
	.overlay {
		top:20%;
	}
	.overlay p {
		font-size:1.2em;
	}
	
	.bottom {
		text-align:right;
		margin-top:0;
}
	
	dt {
		font-size:1em;
		line-height:2em;
	}
	
	img.bio {
		margin: 0 2em 3em 0;
	}

   header .btn-book {
      width: 200px;
   }
	
	.staff img.left {
       max-width: 225px;
   }
	
	
	
	/*  -----------  CONTENT FOR SIDEBAR PAGE  ------------  */
	
	  .wrapper {
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
		  flex-wrap: nowrap;
    }
	
	
	
/*  ------------- SIDEBAR & MAIN CONTENT SECTIONS ------------------------------  */
	
	#main-content {
		order: 2;
		-webkit-order: 2;
		-ms-flex-order: 2;  
		margin-right:0em;
		margin-left: 1em;
	}
	
	
	#sidebar, .sidebar-left {
		order: 1;
		-webkit-order: 1;
		-ms-flex-order: 1;
		
		flex: 0 0 25%;   /* sidebar won't grow or shrink & will always stay at 12ems  */
		-webkit-flex: 0 0 25%;
		-ms-flex: 0 0 25%;
	}
	
	#sidebar > div, #right-sidebar > div {
	margin: .75em 0 1.5em;
}

	#sidebar > div.last, #right-sidebar > div.last {
		margin: .75em 0 1em;
	}
	
	#right-sidebar {
		order: 3;
		-webkit-order: 3;
		-ms-flex-order: 3;
		
		flex: 0 0 12em;   /* sidebar won't grow or shrink & will always stay at 12ems  */
		-webkit-flex: 0 0 12em;
		-ms-flex: 0 0 12em;
		
	}
	
	#content li {
		line-height: 1.75em;
	}
	

	
	

	
/*  ----------- FLEX  ------------------------------------------  */
  

    .flex-container {
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
            -ms-flex-wrap: wrap;
                flex-wrap: wrap;
        -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
                justify-content: space-between;
    }
	
	.flex-container.around {
		-webkit-justify-content: space-around;
            -ms-flex-pack: justify;
                justify-content: space-around;
		margin-bottom: 1.5em;
	}
	
	.narrow {
		width: 80%;
		margin: 3em auto 0;
	}

    .flex2 {
        -webkit-flex: 0 0 calc(50% - 1em);
            -ms-flex: 0 0 calc(50% - 1em);
                flex: 0 0 calc(50% - 1em);
        margin-bottom: 0;
    }
	
	 .flex60 {
        -webkit-flex: 0 0 50%;
            -ms-flex: 0 0 50%;
                flex: 0 0 50%;
        margin-bottom: 0;
    }
	
	.flex25 {
		 -webkit-flex: 0 0 calc(50% - 5em);
            -ms-flex: 0 0 calc(50% - 5em);
                flex: 0 0 calc(50% - 5em);
        margin-bottom: 0;
	}
	
	.flex48 {
		 -webkit-flex: 0 0 50%;
            -ms-flex: 0 0 50%;
                flex: 0 0 50%;
        margin-bottom: 2em;
		  margin-top: 0;
		  min-width: 50%;
		  margin-right: 1.5em;
		
	}
	
	
	.flex3 {
        -webkit-flex: 0 0 calc(40% - 1em);
            -ms-flex: 0 0 calc(40% - 1em);
                flex: 0 0 calc(40% - 1em);
        margin-bottom: 1em;
    }
	
	.flex4 {
        -webkit-flex: 0 0 calc(25% - 1em);
            -ms-flex: 0 0 calc(25% - 1em);
                flex: 0 0 calc(25% - 1em);
        margin-bottom: 1em;
    }
	
	
	
	 .flex-x {
        -webkit-flex: 0 0 200px;
            -ms-flex: 0 0 200px;
                flex: 0 0 200px;
        margin-bottom: 1em;
		 margin-right: 2em;
    }
	
	 .flex-y {
        -webkit-flex: 1 0 calc(60% - 1em);
            -ms-flex: 1 0 calc(60% - 1em);
                flex: 1 0 calc(60% - 1em);
        margin-bottom: 1em;
    }
	
	ul.flex-y {
		margin-left: 1.25em !important;
	}
	
	#sub-footer {
		font-size: .9em;
	}
	
	
	#sub-footer .flex60 p {
		font-style: italic;
      font-size: .9em;
      text-align: center;
      line-height: 1.4em;
		padding-top: .15em;
		margin-top:0;
   }
	
	
	
	#content ul, ol {
       margin-left: 0;
	}
	
	
	#content ol.adjust {
		margin: 2em 5em;
	}
	
	#content ol.adjust li {
		line-height: 1.15em;
		margin-bottom: 1em;
		margin-top:.5em;
	}
	
	div.flex3.n6em > img.frame {
       max-width: 275px;
   }
	
	#closeup {
    display: inlne;
    float: left;
    clear: none;
    width: 30%;
    margin-right: 1em;
    margin-bottom: 2em;
}
	
	img.left.s400 {
    margin: .5em 3em 1em 0;
    max-width: 300px;
   }
	
	
	.form-wrapper {
       width: 80%;
   }


	
}


@media screen and (min-width: 60em) {   /* 960px  */
	
   h1.page-title {
      font-size: 2.5em;
   }
	
   h2 {
      font-size: 1.9em;
   }

   h3 {
      font-size: 1.6em;
   }
	
	header .contact {
	display:block;
	margin-top: .5em;
	margin-bottom: .5em;
	font-size: 1.25em;
}
	
	header .contact img {
    width: 32px;
    height: 32px;
    margin-right: 5px;
}
	
	header .contact p {
		font-size:1em;
		font-weight: bold;
		margin-bottom:.25em;
	}
	
	header .call {
		display:none;
	}
	
	#hdr-center p {
      font-size: 1.75em;
		line-height:1.25em;
		margin: 30px auto 0;
		max-width: 300px;
		width: auto;
   }
  
	#hdr-left {
	   flex: 1 1 34%;
	    -webkit-flex: 0 1 calc(33% - 1em);
        -ms-flex: 0 1 calc(33% - 1em);
	   min-width: 250px;  /*  Actual width of logo */
   }
	
	#hdr-left img {
		margin-left: 4px;
	}

   header .contact p {
	 font-size: 1.25em; 
   }
	
	header #contact-btns {
		width: 80%;
	} 
	
	.nav-container {
		min-height: 54px;
	}
	
   #service {
      margin: 3em 0 3em;
   }

	
	p.large {
		margin-bottom:1.5em;
}
	
	#egoscue {
		width: 65%;
		margin-left:0;
		margin-right:0;
	}

	#sub-footer p.ftr-social {
		text-align: right;
	}
	
	.sidebar {
		float: right;
		margin: 1em auto 2em;
		text-align: center;
		max-width: 30%;
}
	
	.sessionbox {
		padding:10px 1.5em;
		margin:1em 2em 1em 1em;
		float: right;
		max-width: none;
}
	
	.flex-container-sidebar {
    	padding-right:0;
		margin-top: .25em;
		margin-bottom: 0;
}
	
	
   header .btn-book {
      /*  width: 90%; */
       width: 60%;
       font-size: 1.2em;
       line-height: 3em;
   }

      header .fa {
      margin-right: 1em;
   }


   #featured {
      margin-bottom: .5em;
   }
	
   #main-content {
		order: 2;
		-webkit-order: 2;
		-ms-flex-order: 2;  
		margin-right:1em;
		margin-left: 0;
	}
	
	#hours-container {
		width: 235px;
		padding: 1em .5em 0 .5em;
		margin-left: 1em;
	}
	
   #eyetip {
      background-image: url(../images/box-bg3.png);
      background-repeat: no-repeat;
      background-size: auto;
      height: 210px;
      width: 250px;
      padding: 1em 0 0 1em;
      margin-left: 1em;
   }
	
	.tiptitle {
       font-size: 1.5em;
       font-style: italic;
       font-weight: bold;
       color: #4aa101;
       padding-left: 35px;
   }
	
	.daily {
       font-size: 14px;
       font-style: italic;
       width: 217px;
       margin-top: 100px;
       line-height: 18px;
		color: #336699;
   }
	
	#feed, #emergency {
		margin: 1em auto 1em 1em;
	}
	
   #emergency {
      width: 232px;
   }
	
	#emergency h2 {
      font-size: 1.7em;
   }
	
	.sidebar-left #eyetip {
		margin-top: 0;
	}
	
	#content .lm5 {
		margin-left: 5em;
	}
	
	#content img.tm0 {
		margin-top: 0;
	}
	
	#content img.tm3 {
		margin-top: 3em;
	}
	
	.n6em {
		margin-top: -6em;
	}
	
   div.flex3.n6em > img.frame {
       max-width: 100%;
   }
	
	img.right.s400 {
       margin: 2em 1em 1em 1.5em;
       max-width: 400px;
   }
	
	img.left.s400 {
       margin: .5em 4em 1.5em 5em;
       max-width: 350px;
   }
	
	#content ul.flex2, #content ul.flex2 {
      margin-top: 1em;
      margin-left: 3em;
   }
	
	#content ul.expht {
		margin-bottom: 2em;
	}
	
	#content .expht li {
		line-height: 2em;
	}
	
	.cta {
      font-size:1.75em;
		line-height: 2em;
	}
	
	#closeup {
		display: inlne;
		float:left; 
		clear: none; 
		width: 30%;
		margin-right: 1em;
		margin-bottom:2em;
	}
	
	#hours {
		margin-bottom: 0
	}
	
	
		.flex3 {
        -webkit-flex: 0 0 calc(33% - 1em);
            -ms-flex: 0 0 calc(33% - 1em);
                flex: 0 0 calc(33% - 1em);
        margin-bottom: 1em;
    }
	
		.flex4 {
        -webkit-flex: 0 0 calc(20% - 1em);
            -ms-flex: 0 0 calc(20% - 1em);
                flex: 0 0 calc(20% - 1em);
        margin-bottom: 1em;
    }
	
		
	.flex48 {
		 -webkit-flex: 0 0 calc(48% - 1em);
            -ms-flex: 0 0 calc(48% - 1em);
                flex: 0 0 calc(48% - 1em);
		  margin: 0 auto 2em auto;
		  min-width: 47%;
	}
	
		 .flex60 {
        -webkit-flex: 0 0 55%;
            -ms-flex: 0 0 55%;
                flex: 0 0 55%;
        margin-bottom: 0;
    }
	
		
	 .flex-x {
        -webkit-flex: 0 0 250px;
            -ms-flex: 0 0 250px;
                flex: 0 0 250px;
        margin-bottom: 1em;
		 margin-right: 2em;
    }
	
	 .flex-y {
        -webkit-flex: 1 0 calc(75% - 1em);
            -ms-flex: 1 0 calc(75% - 1em);
                flex: 1 0 calc(75% - 1em);
        margin-bottom: 1em;
    }
	
	ul.flex-y {
		margin-left: 2em !important;
	}
	
	
	
	.staff img.left {
    max-width: 250px;
}
	
	
}


@media screen and (min-width: 64em) {   /* 1024px  */
	
}

@media screen and (max-height: 767px){
#rc-imageselect, .g-recaptcha 
 {
   transform:scale(0.77);
   -webkit-transform:scale(0.77);
   transform-origin:0 0;
   -webkit-transform-origin:0 0;
  }
}


@media screen and (min-width: 1260px) {   

	header .btn-book {
		font-size: 1.3em;

	}
	
	
@media screen and (min-width: 1400px) { 
	
	
	body {
       background-image: url("../images/bodybg.jpg");
   }
    
}
   
}