/* app.css - for Foundation Version 6.2.4 */


/** Define general page layout **/

body {
	background: rgb(38, 175, 43);
	/* background: red;  /* Uncomment to check for color leaks */
}

.row {
	max-width: none;
}

/** Specify an initial height for the sticky menu until it is calculated by javascript.   **/ 
/** This initialization minimizes the vertical jumping of the page contents when the page **/ 
/** is first loaded.  These values may need to be tweated whenever a menu change is made. **/

@media only screen and (max-width: 639px) {                           /* Small size screen */
	#menu-container.sticky-container {height: 63px;}
}

@media only screen and (min-width: 640px) and (max-width: 1023px) {   /* Medium size screen */
	#menu-container.sticky-container {height: 53px;}
}

@media only screen and (min-width: 1024px) {                          /* Large size screen */
	#menu-container.sticky-container {height: 55px;}
}


/** Define image-logo layout **/

.image-logo {
	background-size: 100%;
	background-attachment: fixed;
	padding: 0 0;
	margin-bottom: 0px;
	background-repeat: no-repeat;
}

.image-logo h1 {
	color: #000;
	text-align: center;
	margin-bottom: 15px;
	font-size: 3em;
	/* text-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); */
}

@media only screen and (max-width: 800px) {
	.image-logo {
		margin-bottom: 0;
		padding: 0;
	}
	.image-logo h1 {
		font-size: 1.8em;
	}
}

@media only screen and (max-width: 480px) {
	.image-logo h1 {
		font-size: 1.0em;
	}
}

@media only screen and (max-width: 360px) {
	.image-logo h1 {
		font-size: .6em;
	}
}


/** Define sections layouts **/

#top-image {
	background-color: #D4F3C9;
}

#intro {
	background-color: #D4F3C9;
}

#about {
	background: #FFFFB5;
}

#services {
	background-color: #B7DBFF;
}

#portfolio {
	background-color: #FFA575;
}

#specials {
	background-color: #A9B35D;
}

#contact {
	background: #FFFF99;
	padding-bottom: 30px;
}

#portfolio img, #about img {
	display: block;
	margin: 0 auto;
}

footer {
	background: #26AF2B;
	padding: 10px 0;
}


/** Define the color break division between sections */

section {
	padding-top: 40px;
	padding-bottom: 40px;
}


/** Define menu layout **/

#menu-container {
	background: transparent;
}

.title-bar {
	background: rgba(38, 175, 43, .95);
}

.title-bar-title, .title-bar-left, .title-bar-right {
	color: red;
	background: transparent;
}

.title-bar-title {
	color: white;
	line-height: 1.0;
	padding: 0.4rem 0 0.7rem 2rem;
}

.title-bar-right {
	padding-right: 0rem;
	padding-left: 0rem;
}

.show-for-large .menu>li>a {
	padding: 0.7rem 1.5rem;
}

.show-for-medium .menu>li>a {
	padding: 0.7rem 0.5rem;
}

.show-for-small .menu>li>a {
	padding: 0.6rem 0.5rem 0.4rem;
}

@media only screen and (max-width: 359px) {
	.show-for-small .menu>li>a {
		padding-left: 0.25rem; padding-right: 0.25rem;
	}
}

a:focus {
	color: black;
	text-decoration: underline;
}

a:hover {
	color: white;
}


/** Define misc items **/

a {
	color: blue;
}

h1, h2, h3, h4 {
	color: green;
}

h5, h6 {
	color: black;
}

h2 {
	font-weight: bold;
	font-size: 1.75rem;
	text-align: center;
	margin-bottom: 1.5rem;
}

ul, ol, dl {
	list-style: none;
}

ul.bulletlist {
	padding: 0px 10px 0px 30px; 
	margin: 0px;
}

ul.bulletlist li {
	margin-top: 6px;
	margin-bottom: 12px;
	line-height: 1.4;
}

#contact li>ul>li {
	padding: 5px 0;
}

.thumb {
	border: none;
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0);
	border-radius: 150px;
}

footer p {
	font-size: 0.8rem;
	color: white;
	margin-bottom: 0;
}


/**  Fix to Orbit heights not changing on resize as described in entry by ooksanen  **/
/**  on Jul 22 2016 in https://github.com/zurb/foundation-sites/issues/7815         **/

ul.orbit-container {
	height: auto !important;
}
li.orbit-slide {
	max-height: none !important;
}