/* Reset 
	Blue = 4374CD
	pale green = #96ceb4
	salmon = #ff6f69
	pale red = 	#d9534f
	bright green = #7bc043
	bright blue = #0392cf	
	*/
	
	:root {
	  --blue: #0392cf;
	  --white: #ffffff; 
	}
	
	
	/* Reset */

	html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
		margin: 0;
		padding: 0;
		border: 0;
		font-size: 100%;
		font: inherit;
		vertical-align: baseline;
	}

	html {
	 	box-sizing: border-box;
	}

	*, *:before, *:after {
	 	box-sizing: inherit;
	}

	article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
		display: block;
	}

	table {
		border-collapse: collapse;
		border-spacing: 0;
	}

	/* Common styling */

	body {
		-webkit-text-size-adjust: none;
		/*font-family: 'Lato', sans-serif;*/
		font-family: "museo-sans",sans-serif;
		font-size: 17px;
		line-height: 1.5;
		color: #444;
	}

	h1, h2, h3, h4 {
		/*font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;*/
		font-family: "museo", "Baskerville", "Garamond", "Times New Roman", times-roman, georgia, serif;
		font-weight: 700;
	    color: #444;
	}

	h1 {
		margin: 0em 0 0em 0;
		font-size: 3em;
		letter-spacing: -1pt;
		color: #fff;
	}

	h2 {
		margin: 0 0 1em 0;
		font-size: 2em;
		letter-spacing: -1pt;
	}

	h3 {
		font-size: 1.25em;
	}
	
	h4 {
		/* tagline */
		font-size: 1.25em;
		font-weight: 400;
		color: #fff;
		font-style: normal;
		
	}
	/* Links in header */
	h4 a:link {color:#fff;}
	h4 a:hover {color:#fff;}

	h5 {
		/* Journal Name */
		font-size: 1.25em;
		font-weight: 400;
		color: #444;
	}
	
	p {
		margin: 0.5em 0 1.5em 0;
	}

	p:last-child {
		margin-bottom: 0;
	}

	strong {
		font-weight: 700;
	}

	i {
			font-style: italic;
		}
	

	a {
		color: #0392cf;
		outline: none;
		-webkit-tap-highlight-color: rgba(0,0,0,0);
		text-decoration: none;
		cursor: pointer;
	}

	a:hover {
		text-decoration: underline;
	}

	h4 {
		 a{
		   color:#fff !important;
		   &:hover{ color:#fff !important;}
		 }
		} 

	small {
		font-size: 70%;
		color: #AEB0B7;
		font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
	}

	small a {
		color: #AEB0B7;
	}

	img,
	video,
	ul {
		vertical-align: top;
		display: block;
		list-style: disc outside none;
		margin: 1em 0;
		padding: 0 0 0 40px;
	}

	ul {
		margin: 0.5em 0 0.5em 0;
	}

	ul:before {
		content: "\2022";
		color:#0392cf;
		font-weight: bold; /* If you want it to be bold */
		display: inline-block; /* Needed to add space between the bullet and the text */ 
		width: 1em; /* Also needed for space (tweak if needed) */
		margin-left: -1em;} /* Also needed for space (tweak if needed) */


	p + ul {
		margin-top: 0;
	}

	pre {
		padding: 0 20px;
		font-family: Consolas, Menlo, Monaco, "Lucida Console", "Liberation Mono", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Courier New", monospace;
		background: #f4f3f0;
		overflow: auto;
	    color: #453f2f;
		font-size: 15px;
	}

	button {
		font-family: 'Lato', sans-serif;
	}

	.hidden {
		display: none;
	}

	.tright {
		text-align: right;
	}

	/* Layout */

	header {
		position: relative;
		padding: 0 50px;
		background-color: #0392cf;
	}

	header:before {
		content: '';
		position: absolute;
		left: 0;
		right: 0;
		top: 100%;
		height: 500px;
		background: #fff;
		-webkit-transform-origin: right;
		    -ms-transform-origin: right;
		       transform-origin: right;
		-webkit-transform: skewY(2deg);
		    -ms-transform: skewY(2deg);
		        transform: skewY(2deg);
	}

	section {
	    /*padding: 120px 50px;*/
	    padding: 60px 50px;
		background: #fff;
		position: relative;
	}
	

	section:nth-child(odd) {
		background: #e8f6fd; /*Old = #fdfdfd*/
		box-shadow: inset 0 1px 0 0 white;
	}

	section:not(:last-child) {
	 	border-bottom: 1px solid #dde0ee;
	}

	.content {
		margin: 0 auto;
		max-width: 1100px;
	}

	section .content:after {
	   content: ".";
	   visibility: hidden;
	   display: block;
	   height: 0;
	   clear: both;
	}

	footer {
		padding: 100px;
		color: #000;
		font-weight: 300;
		font-size: 80%;
		text-align: right;
		background-color: #0392cf;
	}
	
	footer .p, footer .H2{
		color:fff;
	}

	.cola {
		float: left;
		width: 28%;
	}
	
	.cola_archive {
		float: left;
		width: 8%;
	}
	
	.cola_pics {
		float: left;
		width: 18%;
	}

	.colb {
		float: right;
		width: 70%;
	}
	
	.colb_archive {
		float: right;
		width: 90%;
		border-bottom: 1px #0392cf dashed;
		padding:0 0 .75em 0;
		margin: 0 0 .75em 0;
	}
	
	.colb_pics {
		float: right;
		width: 80%;
	}

	.colc {
		display: inline-block;
		width: calc(50% - 20px);
		vertical-align: top;
	}

	.colc + .colc {
		margin-left: 30px;
	}

	
	#logo {
		float: left;
		width: 50px;
		height: 50px;
		position: relative;
		top: 15px;
		background: url(logo.png);
		background-repeat: no-repeat;
		background-size: 70%;
		background-position: center center;
		transform: scaleX(-1);
	}

	#logo:after {
	    content: '';
		position: absolute;
		top: 8px;
		left: 8px;
	    width: 4px;
	    height: 4px;
	    border-radius: 50%;
	    background-color: #fff;
	}

	/* Top navigation */

	.nav {
		margin: 0;
		padding: 0;
		list-style: none;
		text-align: right;
	}

	.nav li {
		display: inline-block;
		margin-right: 0em;
		margin-right: 0em;
		list-style: none;
	}

	.nav li a {
		font-size: 80%;
		line-height: 4.5em;
		color: #fff;
		text-decoration: none;
		font-family: 'Montserrat', sans-serif;
	}

	.nav li a:hover {
		border-bottom: 2px solid #fff;
	}

	.line {
			border-bottom: 2px solid 000;
		}
	
	#spacer {
		padding: 0vh 0 5vh 0;/*padding: 10vh 0 15vh 0; */
		position: relative;
		overflow: hidden;
	}

	#slogan {
		font-family: 'Montserrat', sans-serif;
		text-align: right;
		padding-top: 0em;
		padding-bottom: 2em;
		color: #fff;
		a: #fff;
	}

	.button {
		color: #fff;
		text-decoration: none;
		text-transform: uppercase;
		border: 2px solid #fff;
		border-radius: 100px;
		display: inline-block;
		font-weight: 700;
		position: relative;
		transition: all .2s ease-in-out;
		padding: 6px 20px;
		margin: 5px 5px 5px 0;
		line-height: 1.5;
		border-radius: 20px;
		font-size: 70%;
	}

	header a.button:hover {
		text-decoration: none;
		background: #fff;
		color: #0392cf;
	}

	header a.button:active {
		background: #fff;
		color: #0392cf;
	}

	.readmore {
		text-align: right;
	    color: currentColor;
	}


	.ImageGrid {
		display: -webkit-box;
	    display: -webkit-flex;
	    display: -ms-flexbox;
	    display: flex;
	    max-width: 1024px;
	    margin-right: auto;
	    margin-left: auto;
	    -webkit-flex-wrap: wrap;
	    -ms-flex-wrap: wrap;
	    flex-wrap: wrap;
		/*margin: -4px 0 6em -4px;*/
		margin: -4px 0 0em -4px;
	}

	.ImageGrid > a {
		padding: 4px;
	    -webkit-box-flex: 1;
	    -webkit-flex: 1 0 33.33%;
	    -ms-flex: 1 0 33.33%;
	    flex: 1 0 33.33%;
	}

	.ImageGrid > a img {
		width: 100%;
 		max-height: auto;

	}

	.imglist {
		overflow: hidden;
		font-size: 0;
		margin-bottom: 80px;
	}

	.imglist a {
		float: left;
		width: 33.33%;
	}

	.imglist a {
		overflow: hidden;
		-webkit-tap-highlight-color: transparent;
		outline: none;
		display: inline-block;
	}

	.imglist a img {
		width: 100%;
	}

	.imglist-small {
		font-size: 0;
		margin-bottom: 20px;
	}

	.imglist-small a {
		display: inline-block;
		margin: 0 5px 5px 0;
	}

	.btn {
		background: #0392cf;
		border: 2px solid #0392cf;
		color: #fff;
		padding: 6px 20px;
		line-height: 1.5;
		border-radius: 20px;
		text-decoration: none;
		text-transform: uppercase;
		font-size: 70%;
		font-weight: 700;
		margin: 5px 5px 5px 0;
		display: inline-block;
		/*cursor: pointer;*/
		/*outline: none;*/
		transition: all .2s ease-in-out;
		-webkit-user-select: none;
		   -moz-user-select: none;
		    -ms-user-select: none;
		        user-select: none;
	}

	.btn:hover {
		border: 2px solid #0392cf;
		background: #fff;
		color:#0392cf;
		text-decoration: none;

	}

	a + .btn {
		margin-left: 10px;
	}


	.card {
		padding: 3em 0;
		border-top: 1px solid #ddd;
	}

	.card:first-of-type {
		border-top-width: 0;
	}

	.card__actions {
		padding-top: 0em;
	}
	/* Old Color = #e8f6fd or #f4f3f0*/
	.card--price {
		margin-top: 3em;
		padding: 1em 1em;
		text-align: center;
		background: #ffffff;
		color: #6C6A6A;
	}

	.card--price h3 {
		padding-bottom: 1em;
		font-size: 1.25em;
		line-height: 1.2;
	}
	
	.card--price h5 {
		padding-bottom: 1em;
		font-size: 1em;
		line-height: 1.2;
		font-weight: bold;
	}

	.card--price .card__text p {
		line-height: 2;
		text-align: left;
		font-size: .9em;
		
	}

	.price-note {
		padding-top: 1em;
		color: #888;
		font-size: 80%;
		text-align: center;
	}

	.price-faq {
		margin-top: 6em;
		font-size: 90%;
	}

	.price-faq p {
		margin-bottom: 2em;
	}



	@media all and (max-width: 860px) {

		h1 {
			letter-spacing: -2pt;
		}

		.cola,
		.colb {
			float: none;
			width: 100%;
			
		}

		#spacer {
			padding-top: 0;
			padding-bottom:1em;
		}

		#slogan {
			padding-top: 0px;
			float: none;
			width: 100%;
			text-align: center;
		}

		.nav li {
			margin: 0 0.5em;
		}

		footer {
			text-align: center;
		}

		section,
		footer {
			/*padding: 100px 50px;*/
			padding: 50px 50px;

		}

	}

	@media all and (max-width: 600px) {

		header {
			padding: 0 10px;
		}

		section,
	    footer {
			padding: 50px 25px;
		}

		.imglist a {
			width: 50%;
		}

		.colc {
			width: 100%;
			margin-top: 1em;
		}

		.colc + .colc {
			margin-left: 0;
			border-left: 0;
		}

		.card {
			padding: 2em 0 2em 0;
		}

		#advanced .colc + .colc .card {
			border-top-width: 1px;
		}


		#photos {
		  -moz-column-count:    2;
		  -webkit-column-count: 2;
		  column-count:         2;
	  }

	}