@import url(https://fonts.googleapis.com/css?family=Rosario);
@import url('https://fonts.googleapis.com/css2?family=Tenali+Ramakrishna&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Architects+Daughter&display=swap');

/*! HTML5 Boilerplate v5.0.0 | MIT License | http://h5bp.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
   ========================================================================== */
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* start animation on scroll */

.start {
    animation: fade-in 1s ease-out;
}

.float-up {
    animation: float-up .6s ease-out;
}

/* hr{
    animation: fade-in-right .8s;
} */

.fade-in-element {
    animation: fade-in 1.8s;
  }

.title{
    color: white;
/*    background: black;*/
    animation: fade-in-right .8s ease-in-out;

}

/* Coloring */
.siamOrchidTheme {
	color: #A020F0; /* #800080 */
}

.gold{
    color: goldenrod;
}
.text-primary{
    color: #f7c08a;
}
.text-emphasis{
		font-weight: bold;
    color: purple;
}
.text-emphasis:hover {
/*	opacity: 0.9;*/
}

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

.sticky {
	position: sticky;
	top: 0px;
	background-color: purple; /*#732d85*/
	color: white;
	padding: 5px;
	margin: 0 1em 0 1em;
	z-index: 9;
}

.siteMenu {
	position: sticky;
	top: 125px;
	border: 1px solid lavender; 
/*	background-color: silver;*/
/*	background: url('../img/bg2.png') repeat fixed;*/
	color: white;
	padding: 0;
	margin: 0 1em 0 1em;
	z-index: 9;
}

.addrbar {

		font-family: 'Nunito Sans', sans-serif;
/*
		font-family: Rosario, Verdana, Arial, sans-serif;
*/		
    height: 25px;
  	width: 97.5%;
    display: inline;
    color: white;
/*  	background-color: purple;*/
    overflow: auto;
    flex-flow: column;   
    position: fixed;
/*
    border-top: 2px solid gray;
    border-bottom: 2px solid gray;
*/
  	top: 5px;
  	z-index: 9;
}


.addrbar a{
    margin: 5px 0px 5px 5px;
    text-decoration: none;
    font-size: 15px;
		color: lavender; /*#666;*/
}
.addrbar a:hover{
    text-decoration: none;
		color: gray;
}

/*
 * 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
   ========================================================================== */

@font-face {
  font-family: 'Zapfino';
  src: 
  	url('../fonts/zapfino/LinotypeZapfino-One.eot?#iefix') format('embedded-opentype'),
  	url('../fonts/zapfino/LinotypeZapfino-One.woff') format('woff'),
  	url('../fonts/zapfino/LinotypeZapfino-One.ttf')  format('truetype'),
  	url('../fonts/zapfino/LinotypeZapfino-One.svg#LinotypeZapfino-One') format('svg');
  font-weight: normal;
  font-style: normal;
}

/*
@font-face {
    font-family: "Zapfino Extra LT One";
    src: url("https://db.onlinewebfonts.com/t/364d63e1b223eac9c5125f5df3f24cc9.eot");
    src: url("https://db.onlinewebfonts.com/t/364d63e1b223eac9c5125f5df3f24cc9.eot?#iefix")format("embedded-opentype"),
    url("https://db.onlinewebfonts.com/t/364d63e1b223eac9c5125f5df3f24cc9.woff2")format("woff2"),
    url("https://db.onlinewebfonts.com/t/364d63e1b223eac9c5125f5df3f24cc9.woff")format("woff"),
    url("https://db.onlinewebfonts.com/t/364d63e1b223eac9c5125f5df3f24cc9.ttf")format("truetype"),
    url("https://db.onlinewebfonts.com/t/364d63e1b223eac9c5125f5df3f24cc9.svg#Zapfino Extra LT One")format("svg");
}
*/

html {
/*
	background-color: rgba(245, 240, 167, 0.5);
*/
/*	
	background: repeating-radial-gradient(circle, transparent, transparent 9.4px, #f2eded 9.4px, #f2eded 12.2px),
							repeating-radial-gradient(circle, transparent, transparent 9.4px, #f2eded 9.4px, #f2eded 12.2px), #eae7e7;
	background-size: 54px 54px;
	background-position: 0 0, 27px 27px, 54px 27px;
	background-color: #eae7e7;
*/
/*	
	background:
      radial-gradient(27% 29% at right, #0000 83%,#eae9e9 85% 99%,#0000 101%) calc(27px/2) 27px,
      radial-gradient(27% 29% at left, #0000 83%,#eae9e9 85% 99%,#0000 101%) calc(27px/-2) 27px,
      radial-gradient(29% 27% at top, #0000 83%,#eae9e9 85% 99%,#0000 101%) 0 calc(27px/2),
      radial-gradient(29% 27% at bottom, #0000 83%,#eae9e9 85% 99%,#0000 101%) 0 calc(27px/-2)
      #f3f3f3;
	background-size: 54px 54px;
*/
	background: url('../img/bg2.png') repeat fixed;
	background-color: white;
}

a{
    text-decoration: none;
/*    color: #333;*/
		color: black;
}
a:hover{
    text-decoration: none;
/*    color: #333;*/
		color: orange;
}

ai{
    text-decoration: none;
/*    color: #333;*/
		color: white;
}
ai:hover{
    text-decoration: none;
/*    color: #333;*/
		color: orange;
}


i{
    text-decoration: none;
/*    background: yellow;*/
/*		border: 1px solid black;*/
/*		outline: 1px solid red;*/
/*		font-weight: bold;*/
		font-weight: 500;/*1-1000*/
    color: black;
}


.logo {
		padding: 0px;
}

.logo img{
		margin: 25px 0px 5px 0px;
		height: 85px; /*10vh;*/
		width: auto;
}
.logo img:hover{
		opacity: 0.5
}

.logo img a{
    display: flex;
    justify-content: center;
}


.logo a2 {
		display: inline-block;
		vertical-align: middle;	
/*
		font-family: Zapfino;
		font-size: 8rem;
		line-height: 4rem;
*/
/*		font-family: Rosario, Verdana, Arial, sans-serif;*/	
    font-family: 'Architects Daughter', cursive;
    color: lavender; /*#FF7F50 orange */
		font-size: 70px;
/*    float: left;*/
  	margin: 10px 0px 0px 10px;
  	padding-top: 0px;
  	text-decoration: none;
  	text-shadow: 3px 4px gray; /*#FF7F50;*/
  	
}
.logo a2:hover {
	color: gray;
}

.mobile-only{
    display: none;
}

body {
	font-family: Rosario, Verdana, Arial, sans-serif;
/*	padding: 5px 1.5%;*/
	padding: 0px;
	font-size: 62.5%;
}

header {
/*
	padding: 15px 15px 0 6%;
*/
	padding: 15px 0px 0px 1%;
}

header:after {
	content: '';
	display: block;
	position: absolute;
	left: 0.5%;
	top: 1%;
	width: 8rem;
	height: 8rem;
	opacity: 1.0;
	margin: 5px 0 0 5px;
/*	
	background: url('../img/siamOrchidLogo.jpg') no-repeat;
*/
	background-size: 100%;
}

header .name {
/*
	font-family: Zapfino;
*/
	font-family: 'Architects Daughter', cursive;
	letter-spacing: -1px;
	font-size: 8rem;
	font-weight: normal;
	line-height: 4rem;
/*	color: #aa3234; */
	color: purple;
	display: inline-block;
	padding: 0 50px;
	margin: 2.4rem 0 0 0;
}

header .tagline {
/*
	font-family: Zapfino;
*/
	font-family: 'Architects Daughter', cursive;
	letter-spacing: -1px;
	font-size: 3.2rem;
	font-weight: normal;
	line-height: 1.6rem;
	color: #333;
	display: inline-block;
	margin-left: 4rem;
}


main {
/*
	margin: 20px 10%;
	width: 80%;
	margin: 0 auto;
	width: 95%;	
*/
	margin: 0 auto;
	width: 98%; /*95%;*/
	font-size: 1.7rem;
	margin-bottom: 20px;
	overflow: visible;
	position: relative;
}

.inlineLink {
	color: inherit;
}
.inlineLink:hover {
	border-bottom: 1px solid #ebbfdd;
}

/*
.schedule {
	margin: 20px 10%;
	width: 80%;
	margin-bottom: 20px;
	padding: 5px 30px;
	background-color: #ebbfdd;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	font-size: 1.2rem;
	text-align: center;
	box-sizing: border-box;
}		
*/
	
.schedule {
/*
	margin: 20px 0 0 0;	
	border-top: 2px solid #8a0303;
	color: #8a0303;
*/

	border-top: 2px solid #8a0303;
	border-bottom: 2px solid #8a0303;
	
	background-color: #ebbfee;
	background: url('../img/bg1.png') repeat fixed;
	margin: 20px 1%;
	padding: 0px;
	font-size: 1.4rem;
	line-height: 1.5;
	text-align: center;	
	color: maroon;
	clear: both;
}

.schedule span {
	white-space: nowrap;
}

a {
	text-decoration: none;
}

.index article {
	float: left;
	width: 45%;
}

.flexslider {
	max-width: 50%;
	float: right;
}

.slides img {
	-webkit-border-radius: 14px;
	-moz-border-radius: 14px;
	border-radius: 14px;
}

main.photos {
	width: 96%;
	margin-left: 2%;;
	box-sizing: border-box;
}

#photos {
	overflow: visible;
	position: relative;
	text-align: center;
	margin: auto;
}

#photos .photo {
	display: inline-block;
	margin-bottom: 10px;
	margin-right: 10px;
	border: 3px solid #333;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

.menuWarning {
	font-size: 15px;
	margin-top: 30px;
	text-align: center;
}

.menuCat {
	clear: both;
	float: left;
	width: 100%;
}

.menuCat h1 {
/*
	font-family: Zapfino;
	letter-spacing: -1px;
	font-size: 5rem;
	line-height: 3rem;
*/
	font-family: 'Architects Daughter', cursive;
	letter-spacing: -1px;
	font-size: 3rem;
	line-height: 3rem;
/*	text-shadow: 2px 2px orange;*/
		
	font-weight: normal;
	color: purple; /*#aa3234;*/
	display: block;
	width: 100%;
	border-bottom: 4px solid purple; /*#aa3234;*/
	margin: 0.6em 0 0.2em 0;
}

.menuSubCat a {
	font-family: 'Architects Daughter', cursive;
	letter-spacing: -1px;
	font-size: 1.6rem;
	line-height: 2rem;
/*	text-shadow: 2px 2px orange;*/		
	font-weight: normal;
	color: maroon; /*#aa3234;*/
	display: block;
	width: 100%;
	margin-top: 1.0em;
}

.menuCatImg {
	float: right;
	width: 35%;
	margin: auto 1.2% 2% 2%;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}
.menuCatDesc {
	font-size: 20px;
	margin: 10px 10px 20px 30px;
	display: inline-block;
}
body[admin="true"] .menuCatImg {
	display: none;
}


.menuItem {
	display: list-item;
	list-style: none;
	margin: 0;
	padding: 0 0 5px 0;
}

body[admin="true"] .menuName {
	display: inline-block;
}
body[admin="true"] .menuDesc {
	display: block;
}
ul.menuPriceOptions {
	margin: 0;
	padding: 0 20px;
	list-style-type: none;
	line-height: 1;
}
body[admin="true"] .menuPriceOption .menuDesc {
	display: inline-block;
}
/*
.addPrice, .menuPrice.menuInput {
	display: none;
}
*/
.menuName {
	font-size: 1.4rem;
	font-weight: 500;
	margin-top: 1.4rem;
	margin-bottom: 0.2rem;
	color: maroon;
}
.menuPrice {
	font-size: 1.3rem;
	font-weight: 500;
	color: maroon;
}
.menuDesc {
	font-size: 1.2rem;
	font-weight: normal;
	color: gray;
}

.menuDesc p {
	display: inline;
	line-height: 1.1;
	margin: 0;
	padding: 0;
}

.menuDesc {
	
}

.menuPrice {
	
}

.downloadMenu {
	display: inline-block;
	margin-left: 3em;
	font-size: 1.2rem;
}

.downloadMenu a {
	color: #aa3234;
	text-decoration: none;
}

#map, #mapDirections {
	width: 100%;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	border: 1px solid #333;
}
#map {
	height: 800px;
	margin-bottom: 20px;
}
#mapDirections {
	display: none;
	overflow: hidden;
	padding: 5px 10px;
	margin-top: 20px;
}

.topbar {
	font-family: Rosario, Verdana, Arial, sans-serif;
	font-size: 16pt;
	color: maroon;
	text-align: center;
	width: 98%;
	margin: 10px 1%;
/*	padding: 5px 0px 0px 0px;*/
	clear: both;	
}

.topbar {
/*	background-color: white; 
	background-color: rgba(245, 240, 167, 0.3); */
	border-top: 2px solid silver;
	border-bottom: 2px solid silver;
}

.topbar span {
	white-space: nowrap;
}

.topbar a {
	white-space: nowrap;
	color: inherit;
	text-decoration: none;
}

.topbar a:hover {
	color: #ebbfdd;
	text-decoration: none;
}

.menuContent {
	width: 98%;
	margin: 10px 1%;
	clear: both;	
}

footer {
/*	background: url('../img/bg1.png') repeat fixed;*/
	background-color: purple;
	font-family: Rosario, Verdana, Arial, sans-serif;
	font-size: 18pt;
	color: white; /* maroon;*/
	text-align: center;
	border-top: 4px solid maroon;
	border-bottom: 4px solid maroon;
	margin: 20px 1%;
	padding: 10px;
	clear: both;
}

footer span, footer a {
	white-space: nowrap;
}

footer a {
	color: inherit;
	text-decoration: none;
}

footer a:hover {
	color: #ebbfdd;
	text-decoration: none;
}

#adminHeader {
	font-size: 1rem;
}

#loginForm {
	font-size: 1rem;
}
.schedule .region {
	display: inline-block;
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide visually and from screen readers:
 * http://juicystudio.com/article/screen-readers-display-none.php
 */

.hidden {
	display: none !important;
	visibility: hidden;
}

/*
 * 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;
}

.nobr {
	white-space: nowrap;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */
@media only screen and (max-width: 1200px) {
	main {
/*		margin: 20px 5%;*/
		width: 97%;
	}
	.addrbar {
  	width: 97%;
  }
  .topbar {
  	margin: 10px 1.5%;
		width: 97%;
	}
}


@media only screen and (max-width: 1100px) {
	header:after {
		width: 7rem;
		height: 7rem;
	}
	
	header .name {
		font-size: 7rem;
	}
	
	header .tagline {
		font-size: 2.8rem;
	}
}

@media only screen and (max-width: 900px) {
	header {
	/*
		padding-left: 8%;
	*/
	}
	
	header:after {
		width: 6rem;
		height: 6rem;
	}
	
	header .name {
		font-size: 5.0rem;
		line-height: 3rem;
		margin-top: 1.4rem;
	}
	
	header .tagline {
		font-size: 2.5rem;
		line-height: 1.2rem;
		margin-left: 3rem;
	}

	main {
		font-size: 1.4rem;
		width: 96%;
	}
	.addrbar {
  	width: 96%;
  }
  .topbar {
		width: 96%;
	}
}

@media only screen and (max-width: 750px) {
	main {
		width: 95%;
	}
	.addrbar {
  	width: 95%;
  }
  .topbar {
		width: 95%;
	}
	
	header .name {
		font-size: 4.5rem;
		line-height: 2.8rem;
		margin: 1.2rem 0 0 0;
	}
	
	header .tagline {
		font-size: 2.5rem;
		line-height: 1.4rem;
		margin-left: 2rem;
	}

	.index article {
		width: 100%;
		float: none;
	}
	
	.flexslider {
		max-width: 90%;
		float: none;
		text-align: center;
		margin-left: auto;
		margin-right: auto;
	}
	
}

@media only screen and (max-width: 750px) {
	header:after {
		width: 5rem;
		height: 5rem;
	}
	
	header .name {
		font-size: 5rem;
		line-height: 2.8rem;
		margin: 1.4rem 0 0 1.5rem;
	}
	
	header .tagline {
		display: none;
	}	
}

@media only screen and (max-width: 500px) {
	.schedule span {
		display: block;
		width: 100%;
		font-size: 1.3rem;
	}
	
	.schedule span.bull {
		/* display: none; */
	}
	
	.addrbar {
  	width: 94%;
  }
  .topbar {
		width: 94%;
	}
}

@media only screen and (max-width: 430px) {
	.schedule span {
		display: block;
		width: 100%;
		font-size: 0.9rem;
	}
	
	.schedule span.bull {
		/* display: none; */
	}
	
	.addrbar {
  	width: 92%;
  }
}



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

@media print {
	*,
	*:before,
	*:after {
		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;
	}
}

.button-container {
  display: inline-block;
  padding: 10px;
	text-align: center;
}
.menu_btn {
    justify-content: center;
    text-align: center;
    font-family: 'Architects Daughter';    
    font-size: 20px;
    font-weight: bold;
    color: maroon;
    background: silver; /*gray; /*lightgreen;*/
    margin: 5px 5px 5px 5px;
    padding: 0 5px 0 5px;
    border: 4px double green;
    cursor: pointer;
    border-radius: 6px;
/*    float: right;*/
}

.menu_active {
    justify-content: center;
    text-align: center;
    font-family: 'Architects Daughter';    
    font-size: 20px;
    font-weight: bold;
    color: orange;
    background: green;
    margin: 0px 5px 5px 5px;
    padding: 0px 5px 0px 5px;
    border: 4px solid green;
    cursor: pointer;
    border-radius: 16px;
    float: right;
}

.menu_btn:hover,
.menu_active:hover {
   background: #004;
   color: white; /*#fff;*/
}

.menu_btn:focus,
.menu_btn:active,
.menu_active:focus,
.menu_active:active {
   background: green;
   color: goldenrod; /*#fff;*/
}

#showcase {
 /*
    background: url(../img/Screen\ Shot\ 2021-05-27\ at\ 8.42.34\ PM.png) no-repeat center center/cover;
 */
    background: url(../img/ScreenShot.png) no-repeat center center/cover; 
    height: auto;
}

#gallery {
    background: url(../img/cooking1.jpg) no-repeat center center/cover; 
    opacity: 0.95;
    height: auto;
}

#showcase .showcase-content {

    color: rgb(255, 255, 255);
    text-align: center;
    padding-top: 80px;		
    height: 600px;
    background-color: rgba(75, 75, 85, 0.075);
    /* animation */
    animation: moveInLeft 1.2s ease-in-out;
 
}

#gallery .showcase-content {
    color: rgb(255, 255, 255);
    text-align: center;
    padding-top: 10px;		
    height: 600px;
    background-color: rgba(75, 75, 85, 0.075);
    /* animation */
    animation: moveInLeft 1.2s ease-in-out;
 
}



#showcase .showcase-content h1 {
		margin: 20px 0px 0px 0px;
		padding-bottom: 0px;
    font-size: 50px;
    line-height: 1.2em;
    text-shadow: 5px 5px #004;
}

#gallery .showcase-content h1{
		margin: 20px 0px 0px 0px;
    font-size: 40px;
    line-height: 1.2em;
    text-shadow: 4px 4px #004;
}


#showcase .showcase-content h2,
#gallery .showcase-content h2 {
		padding-bottom: 0px;
    font-size: 30px;
    line-height: 1.2em;
    text-shadow: 5px 5px #004;
}

#gallery .showcase-content h3 {
		padding-bottom: 0px;
    font-size: 1.0em;
    line-height: 1.3em;
    text-shadow: 2px 2px #004;
}

#showcase .showcase-content p,
#gallery .showcase-content p {
    padding: 20px;
    line-height: 1.7em;
}

#showcase-btn {
   border-radius: 15px;
}

.info-content .btn{
    border-radius: 20px;
}

#showcase .btn:hover {
    background-color: #333;
    color: white;
}

.btn-light {
   background: #f4f4f4;
   color: #333;
}

.bg-dark {		
    background: purple; /*purple; #732d85;*/
    color: #fff;
}

.bg-light {
/*    background: #f4f4f4;*/
/*		background: rgba(128, 0, 128, .8);*/
    background: rgba(245, 240, 167, .7);
    color: #333;
}
.b
g-primary {
/*    color: #333;*/
/*  background: #f7c08a;*/
		color: white;
/*    background: rgba(212, 203, 127, .4);*/
    background-image: linear-gradient(rgba(248, 230, 169, 0.7), rgb(245, 240, 167) );
}

.bg-none {
    color: #fff;
}

.clr{
    clear: both;
}

.center {
    text-align: center;
}
p .lead{
    margin-bottom: 20px;
}

a .btn{
	/* margin-top: 20px; */
}

/* home info  */


#home-info {
    height: 400px;
}

#home-info a{
    color: orange;
}
#home-info a:hover{
    color: gray;
}

#home-info .info-img {
    float: left;
    width: 50%;
    opacity: 1.0;
 		background-color: gray;
/*		background: url(../img/SiamOrchid5_mod.jpg) no-repeat center center/cover;*/
/*		background: url(../img/SiamOrchidMonks.jpeg) no-repeat  center center/cover;*/
		background-image: url(../img/SiamOrchid5_mod.jpg);
		backgroud-repeat: no-repeat;
		background-position: center;
		backgroud-size: center/cover;
 		background-blend-mode: mutiply; /* overlay luminosity darken lighten mutiply saturation;*/
    min-height: 100%;
 }


#home-info .info-content{
		font-size: 16px;
		color: purple;
    float: right;
    width: 50%;
    height: 100%;
    text-align: center;
    padding: 10px 30px;
    overflow: hidden;
/*    background: url(../img/SiamOrchid5_mod.jpg) no-repeat center center/cover;*/
/*		background: url(../img/appertisersampler.jpg) no-repeat center center/cover;*/
}

#about-info .info-right, #about-info .info-left { 
    float: none;
    width: 100%;
}

#about-info .info-right {
    margin-top: 30px;
    width: 100%;
}


.info-content{
    display: flex;
    flex-flow: column;
    justify-content: space-evenly;

}
.info-content p{
    margin: 20px;
}


/* location */


/* padding */

.py-1 {padding: 10px 0;}
.py-2 {padding: 20px 0;}
.py-3 {padding: 30px 0;}