/*! HTML5 Boilerplate v5.3.0 | MIT License | https://html5boilerplate.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html {
	color: #222;
	font-size: 1em;
	line-height: 1.4;
	height:100%;
	width:100%;
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
	background: #b3d4fc;
	text-shadow: none;
}

::selection {
	background: #b3d4fc;
	text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid #ccc;
	margin: 1em 0;
	padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio,
canvas,
iframe,
img,
svg,
video {
	vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
	border: 0;
	margin: 0;
	padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
	resize: vertical;
}

/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */

.browserupgrade {
	margin: 0.2em 0;
	background: #ccc;
	color: #000;
	padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

body {
	font: 100%/1.4 'Lato', Verdana, Arial, Helvetica, sans-serif;
	background-color: #4E5869;
	margin: 0;
	padding: 0;
	color: #000;
	height:100%;
	width:100%;
}

/* ~~ Element/tag selectors ~~ */
ul, ol, dl { /* Due to variations between browsers, it's best practices to zero padding and margin on lists. For consistency, you can either specify the amounts you want here, or on the list items (LI, DT, DD) they contain. Remember that what you do here will cascade to the .nav list unless you write a more specific selector. */
	padding: 0;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;	 /* removing the top margin gets around an issue where margins can escape from their containing div. The remaining bottom margin will hold it away from any elements that follow. */
	padding-right: 15px;
	padding-left: 15px; /* adding the padding to the sides of the elements within the divs, instead of the divs themselves, gets rid of any box model math. A nested div with side padding can also be used as an alternate method. */
}
a img { /* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */
	border: none;
}

/* ~~ Styling for your site's links must remain in this order - including the group of selectors that create the hover effect. ~~ */
a:link {
	color:#414958;
	text-decoration: underline; /* unless you style your links to look extremely unique, it's best to provide underlines for quick visual identification */
}
a:visited {
	color: #4E5869;
	text-decoration: underline;
}
a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
	text-decoration: none;
}

/* ~~ this container surrounds all other divs giving them their percentage-based width ~~ */
.containers {
	position:relative;
	width:auto;
	min-height: 100%;
	height: auto !important;
	height: 100%;
/*	max-width: 1170px; a max-width may be desirable to keep this layout from getting too wide on a large monitor. This keeps line length more readable. IE6 does not respect this declaration. */
	min-width: 350px;/* a min-width may be desirable to keep this layout from getting too narrow. This keeps line length more readable in the side columns. IE6 does not respect this declaration. */
	background-color: #FFF;
	margin: 0 auto; /* the auto value on the sides, coupled with the width, centers the layout. It is not needed if you set the .container's width to 100%. */
	padding-top: 150px;
}

/* ~~the header is not given a width. It will extend the full width of your layout. It contains an image placeholder that should be replaced with your own linked logo~~ */

.header {
	background-color: #6F7D94;
	width: 100%;
	height:10%;
}
#menu a#logolink {
	padding:1em 0.8em;
}
#menu a#logolink:hover {
  background-color:#fff;;
}
a#logolink, #logo {
	width:100%;
	max-width:347px;
	float: left;
}
#menu ul {
	margin: 0;
	padding: 0;
	float: right;
}

#menu .main-menu {
  display: none;
}

#tm:checked + .main-menu {
  display: block;
}

#menu input[type="checkbox"], 
#menu ul span.drop-icon {
  display: none;
}
/*
#menu li, 
#toggle-menu, 
#menu .sub-menu {
  border-style: solid;
  border-color: rgba(0, 0, 0, .05);
}
*/
#menu li, 
#toggle-menu {
  border-width: 0 0 1px;
}

#menu .sub-menu {
  background-color: #ececec;
  border-width: 1px 1px 0;
  margin: 0 1em;
  box-shadow: -5px 5px 8px #808080;
  border-radius: 5px;
}

#menu .sub-menu li.carrot { 
	background: #fff url("../img/common/nav-carrot.png") no-repeat 25% 50%;
	height: 7px;
	margin-top: -7px;
}
#menu .sub-menu li:last-child {
  border-width: 0;
}

#menu li, 
#toggle-menu, 
#menu a {
  position: relative;
  display: block;
  color: #666666;
  /* text-shadow: 1px 1px 0 rgba(0, 0, 0, .125); */
}

#menu, 
#toggle-menu {
	background-color: #fff;
}

#toggle-menu, 
#menu a {
  padding: 1.25em 0.9em;
}

#menu a {
  transition: all .125s ease-in-out;
  -webkit-transition: all .125s ease-in-out;
}

#menu a:link {
	text-decoration: none;
}
#menu a:hover {
  color:#0b3846;
}

#menu .sub-menu {
  display: none;
}
#menu .sub-menu a {
	color:#0b3846;
}
#menu input[type="checkbox"]:checked + .sub-menu {
  display: block;
}

#menu .sub-menu a:link, #menu .sub-menu a:hover {
  color: #0b3846;
}
#menu .sub-menu a:hover {
	background-color: #d0d0d0;
	border-radius: 5px;
}
#toggle-menu .drop-icon, 
#menu li label.drop-icon {
  position: absolute;
  right: 1.5em;
  top: 1.25em;
}

#menu label.drop-icon, #toggle-menu span.drop-icon {
  border-radius: 50%;
  width: 1em;
  height: 1em;
  text-align: center;
  background-color: rgba(0, 0, 0, .125);
  text-shadow: 0 0 0 transparent;
  color: rgba(255, 255, 255, .75);
}

#menu .drop-icon {
  line-height: 1;
}

#subnav {
	/*background:rgba(255,255,255,0.5);*/
	background: url("../img/common/sub-nav-bg.png") repeat-x;
}
#subnav p {
	padding:0;
	margin:0;
}
#subnav p span {
	background: #338379;
	padding:12px 24px;
	color:#ffffff;
}
a#topphone {
	display: none;
}
a#contactbtn:link, a#contactbtn:visited {
	background: #0b3846;
	padding:12px 24px;
	color:#ffffff;
	text-decoration: none;
}
a#contactbtn:hover, a#contactbtn:active {
	background: #333333;
}
a#apmtbtn:link, a#apmtbtn:visited {
	background: #338379;
	padding:12px 24px;
	color:#ffffff;
	text-decoration: none;
}
a#apmtbtn:hover, a#apmtbtn:active {
	background: #333333;
}

/* ~~ This is the layout information. ~~ 

1) Padding is only placed on the top and/or bottom of the div. The elements within this div have padding on their sides. This saves you from any "box model math". Keep in mind, if you add any side padding or border to the div itself, it will be added to the width you define to create the *total* width. You may also choose to remove the padding on the element in the div and place a second div within it with no width and the padding necessary for your design.

*/
.content {
	margin:0 auto;
	padding:0;
	min-height: 100%;
	height: auto !important;
	height: 100%;
	width:100%;
	padding-bottom:1187px;
}
.contained {
	margin:0 auto;
	padding: 10px 0;
	width:auto;
	max-width: 1170px;
}

/* ~~ This grouped selector gives the lists in the .content area space ~~ */
.content ul, .content ol { 
	padding: 0 15px 15px 40px; /* this padding mirrors the right padding in the headings and paragraph rule above. Padding was placed on the bottom for space between other elements on the lists and on the left to create the indention. These may be adjusted as you wish. */
}

/* ~~ The footer ~~ */
.footer {
	padding:0;
	background-color: #e9e9e9;
	width:100%;
	height:1187px;
	position:absolute;
	bottom:0;
	color:#666666;
}
.whitebg {
	background-color:#ffffff;
	width: 100%;
	padding:35px 0 25px;
}
.carecred {
	text-align: center;
}
#credlink {
	margin-top: 10px
}
#credinfo {
	width: 75%; 
	margin: 125px auto 0;
}
.tealbg {
	background-color:#003846;
	width: 100%;
	text-align: center;
	padding:35px 0 25px;
	color:#ffffff;
}
.tealbg h2 {
	margin:25px 0 0;
}
.tealbg p {
	padding:25px 0 0;
}
.footernav {
	text-align: left;
	margin:25px 0 0;
}
.footernav li {
	list-style: none;
	line-height: 1.75em;
}
.footernav li h4 {
	margin:0;
	padding:0;
}
li#reviews {
	height: 550px;
	overflow: scroll;
}
p#ramhorn {
	margin:23px 0 0;
	padding: 0;
}
p#copyright {
	margin:15px 0 0;
	padding: 0;
}
div#footlogo {
	margin:30px 0 20px;
}
p.phoneicon {
	background:url("../img/common/phone-icon.png") top left no-repeat;
	margin:10px 15px 0 0;
	padding:0px 0 0 30px;
}
p.locationicon {
	background:url("../img/common/location-icon.png") top left no-repeat;
	margin:10px 15px 0 0;
	padding:0px 0 0 30px;
}
p.mapicon {
	background:url("../img/common/map-icon.png") top left no-repeat;
	margin:0 15px 0 0;
	padding:0px 0 0 30px;
}
div.social {
	padding-right:15px;
}
/* ~~ miscellaneous float/clear classes ~~ */
.fltrt {  /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page. The floated element must precede the element it should be next to on the page. */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* this class can be placed on a <br /> or empty div as the final element following the last floated div (within the #container) if the #footer is removed or taken out of the #container */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}
.disclaimer {
    font-size:8pt;
    line-height: 1em;
}
.underline {
    text-decoration:underline;
}
.center	{
    width:100%;
    text-align:center;
}
.content ul.nobull, .content ol.nobull {
	list-style: none;
	padding-left: 15px;
}
/* ==========================================================================
   Helper classes
   ========================================================================== */

#landingbg {
	background-image: url("../img/landingpage/mill-creek.jpg");
	width: 100%;
	background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    background-attachment: fixed;
	margin: 0;
	padding:0;
}
.herocontent {
	background-image: url("../img/landingpage/hero-cover2.png");
	width: 100%;
	background-size: cover;
    background-position: bottom;
    background-repeat: no-repeat;
	margin:0 0;
	padding:0;
	position: absolute;
	top:150px;
	z-index:1000;
}
#herotext {
	width:50%;
	padding:0;
}
#herotext h1 {
	color:#0b3745;
	padding-top:25px;
	font-size: 30pt;
	font-weight: normal;
}
#herotext h1 span {
	color:#338379;
}
#herotext p {
	margin-top:50px;
	padding-bottom:150px;
	font-size: 16pt;
	line-height: 1em;
}
#homeintro {
	padding-top:0;
}
.secondhero {
	width:100%;
}
.secondhero2 {
	display: none;
}
.content h1 {
	font-size:3em;
}
.content h1, .content h2, .content h3 {
	color:#003846;
}
.content h4, .content h5, .content p, .content ul li, .content ol li {
	color:#666666;
}
.content p, .content ul, .content ol {
	line-height: 1.5em;
	margin:25px 0;
	padding-top: 0;
	padding-bottom: 0;
}
.content ul li, .content ol li {
	margin-bottom: 10px;
}
.roundcolumn {
	width: 48%;
	border: 1px #666666 solid;
	border-radius: 25px;
	padding:20px;
	margin-bottom: 35px;
}
.roundcolumn h3, .roundedge h3 {
	font-weight:bold;
}
.roundedge {
	width: 100%;
	border: 1px #666666 solid;
	border-radius: 25px;
	padding:20px;
	margin-bottom: 35px;
}
a.button:link, a.button:visited {
	border-radius: 25px;
	background: #338379;
	padding:12px 24px;
	color:#ffffff;
	text-decoration: none;
}
a.button:hover, a.button:active {
	background: #0b3846;
}
a#homebutton:link, a#homebutton:visited {
	border-radius: 25px;
	background: #0b3846;
	/*border: 2px solid #338379;*/
	padding:12px 24px;
	color:#ffffff;
	text-decoration: none;
}
a#homebutton:hover, a#homebutton:active {
	background: #338379;
	color: #ffffff;
}
a.tealbutton:link, a.tealbutton:visited {
	border-radius: 25px;
	background: #0b3846;
	padding:12px 24px;
	color:#ffffff;
	text-decoration: none;
}
a.tealbutton:hover, a.tealbutton:active {
	background: #338379;
}
.greybg {
	background-color:#f2f2f2;
	width: 100%;
	padding:25px 0;
}
/*eef0f3*/
#breadcrumbs {
	font-style:italic;
}
#plus-pattern {
	position:absolute;
	right:0;
	z-index:10000;
	margin-top:-125px;
}
#quote {
	width: 97%;
	text-align: right;
}
.half, .quarter, .threequarters, .third, .twothirds, .fifth, .twofifths {
	margin:0 auto;
	padding: 0;
	float: left;
}
.half {
	width:50%;
}
.third {
	width:33%;
}
.twothirds {
	width:67%;
}
.quarter {
	width:25%;
}
.threequarters {
	width:75%;
}
.fifth {
	width:20%;
	float: left;
}
.twofifths {
	width:40%;
}
.fifthwithpad {
	width:18%;
	float: left;
	padding: 0 2%;
}
ul#dental-logos {
	margin:0 auto;
	width: 100%;
	max-width: 1022px;
	padding: 20px 0 0;
}
ul#dental-logos li {
	list-style: none;
	float: left;
}
#halfwidth {
	font-size: 1.5em;
	width:600px;
	padding: 25px 0;
	margin: 0 auto;
}
#leftlink {
	text-align: right;
}
#rightlink {
	text-align: left;
}
#leftlink a:link, #leftlink a:visited {
	background: #a4d7cd;
	padding:12px 20% 12px 0;
	color:#ffffff;
	text-decoration: none;
	width: 100%;
	font-size: 2em;
	display: block;
}
#rightlink a:link, #rightlink a:visited {
	background: #34867c;
	padding:12px 0 12px 20%;
	color:#ffffff;
	text-decoration: none;
	width: 100%;
	font-size: 2em;
	display: block;
}
#rightlink a:hover, #rightlink a:active, #leftlink a:hover, #leftlink a:active {
	background: #333333;
}
#office, #contact, #map {
	float:left;
}
#office {
	width:20%
}
#contact, #map {
	width:40%
}
#map {
	position: relative;
	height: 100%
}
.resp-container {
    position: relative;
    overflow: hidden;
    padding-top: 75%;
}
.resp-iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}
div#video {
	position: relative;
	width: 50%;
	margin: 0 auto;
}
.resp-container2 {
    position: relative;
    overflow: hidden;
    padding-top: 56%;
	width: 100%;
    height: 100%;
}
.resp-iframe2 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}
#form {
    position:relative;
	width:auto !important;
    max-width:1121px;
	height: auto !important;
	height: 100%;
	min-width: 330px;
	margin: 20px auto;
    text-align: center;
}
#form li {
    width: 64%;
    min-width: 279px;
    margin-bottom: 5px;
	list-style:none;
}
#form li.title {
    color:#0b3846;
	text-align: right;
    padding-top: 5px;
    max-width: 118px;
    min-width: 118px;
	font-weight: bold;
}
#form input, #form select, #form textarea {
	background:#ffffff;
	background-image: -moz-linear-gradient(center top , #ffffff , #898989);
	border-color: #666666;
	border-radius: 8px 8px 8px 8px;
	border-style: solid;
	border-width: 1px;
	color: #000000;
	font-size: 12pt;
	margin:0;
    padding: 4px 6px;
    width: 100%;
	height:31px;
}
#form input#submit {
	background: #338379;
	padding:0 24px;
	color:#ffffff;
	text-decoration: none;
	margin-bottom: 25px;
}
#form input#submit:hover {
	background: #0b3846;
}
#form textarea {
    height:100px;
}
#homespan1 {
	font-size: 35pt;
	text-transform: uppercase;
	font-weight:bold;
}
/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide visually and from screen readers
 */

.hidden {
	display: none !important;
}

/*
 * Hide only visually, but have it available for screen readers:
 * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 */

.visuallyhidden {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
	clip: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	position: static;
	width: auto;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */

.invisible {
	visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *	`contenteditable` attribute is included anywhere else in the document.
 *	Otherwise it causes space to appear at the top and bottom of elements
 *	that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *	`:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
	content: " "; /* 1 */
	display: table; /* 2 */
}

.clearfix:after {
	clear: both;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
	/* Style adjustments for viewports that meet the condition */
}

@media print,
	   (-webkit-min-device-pixel-ratio: 1.25),
	   (min-resolution: 1.25dppx),
	   (min-resolution: 120dpi) {
	/* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   http://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
	*,
	*:before,
	*:after,
	*:first-letter,
	*:first-line {
		background: transparent !important;
		color: #000 !important; /* Black prints faster:
								   http://www.sanbeiji.com/archives/953 */
		box-shadow: none !important;
		text-shadow: none !important;
	}

	a,
	a:visited {
		text-decoration: underline;
	}

	a[href]:after {
		content: " (" attr(href) ")";
	}

	abbr[title]:after {
		content: " (" attr(title) ")";
	}

	/*
	 * Don't show links that are fragment identifiers,
	 * or use the `javascript:` pseudo protocol
	 */

	a[href^="#"]:after,
	a[href^="javascript:"]:after {
		content: "";
	}

	pre,
	blockquote {
		border: 1px solid #999;
		page-break-inside: avoid;
	}

	/*
	 * Printing Tables:
	 * http://css-discuss.incutio.com/wiki/Printing_Tables
	 */

	thead {
		display: table-header-group;
	}

	tr,
	img {
		page-break-inside: avoid;
	}

	img {
		max-width: 100% !important;
	}

	p,
	h2,
	h3 {
		orphans: 3;
		widows: 3;
	}

	h2,
	h3 {
		page-break-after: avoid;
	}
}
@media only screen and (max-width: 64em) and (min-width: 52.01em) {
  #menu li {
    width: 33.333%;
  }

  #menu .sub-menu li {
    width: auto;
  }
}

@media only screen and (min-width: 1075px) {
  #menu .main-menu {
    display: block;
  }

  #toggle-menu, 
  #menu label.drop-icon {
    display: none;
  }

  #menu ul span.drop-icon {
    display: inline-block;
  }

  #menu li {
    float: left;
    border-width: 0 1px 0 0;
  }

  #menu .sub-menu li {
    float: none;
  }

  #menu .sub-menu {
    border-width: 0;
    margin: 0;
    position: absolute;
    top: 100%;
    left: 0;
    width: 208px;
    z-index: 3000;
  }

  #menu .sub-menu, 
  #menu input[type="checkbox"]:checked + .sub-menu {
    display: none;
  }

  #menu .sub-menu li {
    border-width: 0 0 1px;
  }

  #menu .sub-menu .sub-menu {
    top: 0;
    left: 100%;
  }

  #menu li:hover > input[type="checkbox"] + .sub-menu {
    display: block;
  }
}
@media only screen and (max-width: 1610px) {
	#plus-pattern {
		display: none;
	}
}
@media only screen and (max-width: 1200px) {
	#herotext h1 {
		padding-top:10px;
		font-size: 25pt;
	}
}
@media only screen and (max-width: 1074px) {
	#herotext {
		padding-top: 50px;
		padding-left: 10px;
	}
	#herotext h1 {
		padding-top:10px;
		font-size: 18pt;
	}
	#herotext p {
    	margin-top: 25px;
	}
	#tm:checked + .main-menu {
		width: 100%;
		text-align: center;
  }
  a#logolink, #logo {
	float: none;
	text-align: center;
  }
  #menu ul.sub-menu {
    float:none;
	}
  #menu .sub-menu {
    border-width: 1px 1px 0;
    margin: 0 1em;
	box-shadow: 0 0 0 0 #ffffff;
  }
	#menu ul.sub-menu li.carrot {
		display: none;
	}
  .contained {
    max-width:100%;
  }	
}
@media only screen and (max-width: 975px) {
	.herocontent {
		position:relative;
		top:0;
	}
	#herotext {
		width: 100%;
		padding:0 5%;
		text-align: center;
	}
	#herotext h1 {
		font-size: 22pt;
	}
	#herotext p {
		margin-top: 50px;
		padding-bottom: 0;
	}
}
@media only screen and (max-width: 800px) {
	#sliderwrap {
		margin-top:84px;
	}
	#landingbg {
		background-attachment:inherit;
	}
	.secondhero {
		display: none;
	}
	.secondhero2 {
		display: block;
		width: 100%
	}
	#toggle-menu {
		padding: 0 0.9em;
	}
	a#topphone:link, a#topphone:visited {
		display:inline;
		background: #0b3846;
		padding:12px 24px;
		color:#ffffff;
		text-decoration: none;
	}
	a#topphone:hover, a#topphone:active {
		background: #333333;
	}
	#contactbtn {
		display: none;
	}
	#form, #form li {
        min-width: 280px;
    }
    #form li.title {
        text-align:center;
        max-height: 480px;
        min-width: 280px;
    }
    #service {
        max-width: 213px;
        margin-bottom: 15px;
    }
	.half, .quarter, .threequarters, .third, .twothirds, .fifth, .fifthwithpad, .twofifths, #office, #map, #contact {
		width:100%;
		margin:0 auto;
		padding: 0 2%;
		float: none;
	}
	.fltrt, .fltlft {
		margin:0;
		padding: 0;
		float: none;
	}
	#subnav {
		width: 100%;
		text-align: right;
	}
	#subnav p span {
    	background:none;
		padding: 0 0 0 10px;
	}
	#subnav .contained {
		padding:2px 0 0;
	}
	#footlogo img {
		width: 90%;
		max-width: 425px;
	}
	.roundcolumn, .roundedge {
		width: 96%;
		margin: 0 auto 25px;
	}
	#plus-pattern {
		display: none;
	}
	.contained img {
		max-width: 90%;
	}
	#leftlink, #rightlink {
    	text-align: center;
	}
	#leftlink a:link, #leftlink a:visited, #rightlink a:link, #rightlink a:visited {
		font-size: 1.5em;
		padding:12px;
		margin-bottom: 25px;
		border-radius: 25px;
	}
	.content {
		padding-bottom:1993px;
	}
	.footer {
		text-align: center;
		height: 1993px;
	}
	.footernav {
    	text-align: center;
	}
	#credlink {
	    margin: 10px 0 25px
    }
	#credinfo {
		width: 100%; 
		margin: 75px auto 0;
	}
	div#video {
		width: 90%;
	}
	p#ramhorn, p#copyright {
		width:90%;
		margin:23px auto 0;
	}
}
@media only screen and (max-width: 400px) {
	#subnav .contained {
		padding:5px 0 0;
	}
	#sliderwrap {
		margin-top:99px;
	}
}