@charset "UTF-8";

/* dark grey #6D6573 .. wrapper bck
   bright lavender #C88EF4 ... accen t
   light lavender #E5D4F2  ... content bck
   dark purple #5E4373 ... accent / shadow
   med light purple #B5A8BF
*/

body {
	background:black;
	font-family:Verdana, Geneva, Arial, sans-serif;
	margin:0px;
	padding:0px;
	text-align:center;
}

#wrapper {
	width:960px;
	height:800px;
	margin-left:auto;
	margin-right:auto;
/*	background:lightSlateGrey;*/
	background:#6D6573;
}

#rightCol {
	float:right;
	height:600px;
	width:600px;
	/* background:lightGrey; */
	background:#E5D4F2;

	/*border:5px double #5B73A8;
	padding: 2px;*/
	margin:auto;
	text-align:center;
	
}

#leftCol {
	float:left;
	width:360px;
	/*background:silver;*/
	height:600px;
	/*background:#B5A8BF; add gradient instead*/
	text-align:left;
	font-size:18px;   /* fix accessibility */
	font-weight:bold; /* fix accessibility */
	color:black;      /* fix accessibility */
	
	/* add linear gradient */
	background: #B5A8BF;
    background: -moz-linear-gradient(45deg, #E5D4F2 0%, #B5A8BF 100%); 
    background: -webkit-linear-gradient(45deg, #E5D4F2 0%, #B5A8BF 100%); 
    background: -o-linear-gradient(45deg, #E5D4F2 0%, #B5A8BF 100%); 
    background: -ms-linear-gradient(45deg, #E5D4F2 0%, #B5A8BF 100%); 
    background: linear-gradient(45deg,#E5D4F2 0%, #B5A8BF 100%);
}
#leftCol a {
	color:black;
}
#leftCol a:hover {
	background:#C88EF4;
	color:#5E4373;
}
#leftCol a:visited {
	color:#5E4373;
}

h1,h2,h3,h4,h5,h6,p,li {
	margin-left:15px;
}


#banner {
	height:120px;
	/*background:slateGray; replace w/ gradient */
	background: -moz-linear-gradient(top, #5E4373 0%, #B5A8BF 100%); 
    background: -webkit-linear-gradient(top, #5E4373 0%, #B5A8BF 100%); 
    background: -o-linear-gradient(top, #5E4373 0%, #B5A8BF 100%);
    background: -ms-linear-gradient(top, #5E4373 0%, #B5A8BF 100%);
    background: linear-gradient(to bottom, #5E4373 0%, #B5A8BF 100%);


	color:#E5D4F2;
	/*	font-family: 'Rubik Moonrocks', cursive; */
	/*font-family: 'Diplomata SC', cursive;*/
	/*font-family: 'Oleo Script Swash Caps', cursive;*/
	/*font-family: 'Splash', cursive;*/
	/*font-family: 'The Nautigal', cursive;*/
	font-family: 'Courgette', cursive;
}

h1 {	  
	margin: auto;
	font-size:62px;
}

.vTitle {
	margin:auto;
}

.box {
	height:150px;
	width:150px;
	float:left;
	/*background:tan;*/
	margin:15px;
	opacity:.5;
	background:#B5A8BF;
	
	border: 2px outset #C88EF4;
}

.box:hover {
	/*background:white;*/
	opacity:1;
	background:#B5A8BF; 
	color:white;
}

.vBox {
	/*height:150px;
	width:150px;*/
	float:left;
	height: 200px;
	width: 200px;
	/*background:tan;*/
	margin: 15px 25px 15px 25px;
	opacity:.5;
	background:#B5A8BF;
	
	border: 2px outset #C88EF4;
}


.vBox:hover {
	/*background:white;*/
	opacity:1;
	background:#B5A8BF; 
	color:white;
}

.clear {
	clear:both;
}


#validIMG {
	margin:5px;
}

footer {
	font-size:18px;
	color:white;
	height: 90px; /* was 80px;*/
	/* replace w/ gradient
	background:#6D6573;
	*/
    background: -moz-linear-gradient(top, #B5A8BF 0%, #5E4373 100%); 
    background: -webkit-linear-gradient(top, #B5A8BF 0%, #5E4373 100%); 
    background: -o-linear-gradient(top, #B5A8BF 0%, #5E4373 100%);
    background: -ms-linear-gradient(top, #B5A8BF 0%, #5E4373 100%);
    background: linear-gradient(to bottom, #B5A8BF 0%, #5E4373 100%);
}

.vid {
	position: relative; /*absolute; */
    right: 0; 
    bottom: 0;
    min-width: 100%; 
    min-height: 100%;
    /*width: auto; 
    height: auto; */
	width:100%;
	height:auto;
    /*z-index: -1;*/
    background-size: cover;
    overflow: hidden;
	margin-top:-20px;
}

.bigVid {
	position: relative;
    background-color:black;
	border: 2px white solid;
	box-shadow: 5px 5px;
	margin-top:50px;
	width: 600px;
padding: 15px;
/*box-shadow: 10px 10px 5px black;*/
}
#copy {
	padding:15px;
	margin-top: -10px;

}
#rad {
	font-size:32px;
	padding-top:10px;
	margin-left:100px;
	margin-right:100px;
	height:60px;
	border: 2px solid #B5A8BF;
	border-radius:80px;
	text-align:center;
			/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e5d4f2+66,b5a8bf+86 */
    background: #e5d4f2; /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover,  #e5d4f2 66%, #b5a8bf 86%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover,  #e5d4f2 66%,#b5a8bf 86%); /* Chrome10-25,Safari5.1-6 */
    background: radial-gradient(ellipse at center,  #e5d4f2 66%,#b5a8bf 86%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5d4f2', endColorstr='#b5a8bf',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}
img {
	width:25%;
	height:25%;
}
#boxA {
	 background: url('../img/berries.jpg'); 
	 background-size:contain;
}
#boxB {
	 background: url('../img/SnowyFlowers.jpg'); 
	 background-size:contain;	
}
#boxC {
     /*background: url('../img/Rosie2a.jpg'); */
	 background: url('../img/Flowers3.jpg');
	 background-size:contain;
}
#boxD {
     /*background: url('../img/Frogs.jpg'); */
	 background: url('../img/Flowers2_modB.jpg');
	 background-size:contain;
}
#boxE {
     background: url('../img/Flowers7.jpg'); 
	 background-size:contain;
}
#boxF{
     background: url('../img/Flowers4.jpg'); 
	 background-size:contain;	
}
h1 {
	font-size:72px;

}



#main {
	    border: 3px solid #C88EF4;
    border-radius:5px;
}
#mssg {
	background:#E5D4F2;
    font-size:48px;
    border: 3px solid #C88EF4;
    border-radius:5px;
	height:600px;
    
}

.BCK {
	font-size:18px;
	background:black;
	color:white;
	padding:5px;
	border: 1px solid #C88EF4;
	border-radius: 5px;
	box-shadow: 2px 2px #C88EF4;
	text-decoration: none;


}
a:hover {
	background:#C88EF4;
	color:#5E4373;
}

form {
	font-size:18px;
	position: relative;
    background-color:#6D6573;
	color:white;
	border: 2px white solid;
	box-shadow: 5px 5px black;

	width: 600px;
padding: 15px;
margin: auto;
	margin-top:50px;
    margin-bottom:100px;
	/*text-align:left;
/*box-shadow: 10px 10px 5px black;*/
}
input {
	padding:2px;
	margin: 0 15px 0 0;
	/*margin:5px;*/
}
.fT {
	font-size:24px;
}
.fBtn {
	background-color: black;/*#6D6573;*/
	color:white;
	padding:5px;
	border: 1px solid #C88EF4;
	border-radius: 5px;
	box-shadow: 1px 1px #C88EF4;
	margin:10px;
	font-size:18px;
}

.pBtn {
	background-color:#6D6573;
	color:white;
	padding:5px;
	border: 1px solid #C88EF4;
	border-radius: 5px;
	box-shadow: 1px 1px #C88EF4;
	/*margin:2px;*/
	position:-15px;
}

#tswfbform {
	text-align:left;
	margin: auto;/* 200px; */
	padding-left:40px;
	margin-top:50px;
	font-size: 14px;
}