/****************************************************************************/
/*Style Sheet *****************************************/
/***************************************************************************/

/*

Menu Background Green  #B4F458
Logo Dark Green #2D8B36

*/

div#LandingPageImageWidth
{
	margin:0 auto;
	max-width:980px;
/*	opacity:.5; */
}

div#LandingPageImageWidthInner, div#LandingPageImageWidthInnerEnter
{
	height:0;
	padding-bottom:43.42%;
	max-width:980px;
	width:100%;
}

div#LandingPageImageWidthInner
{
}

div#LandingPageImageWidthInnerEnter
{
	position:absolute;
}


div#LandingPageImageWidth > div#LandingPageImageWidthInnerEnter > a > img
{
	position:absolute;
	top:2%;
	left:34%;
	max-width:71px;
	width:8%;
	height:auto;
}
div#LandingPageImageWidth > div#LandingPageImageWidthInnerEnter > a > img:hover
{
	opacity:.5;
	margin-left:2px;
	margin-top:2px;
}

div#LandingPageImageWidth img, video
{
	width:100%;
	height:auto;
}

html > body > div#PageWrapperLayer01 > div > div#LandingPageImageWidth > a.navlink > div > video
{
}




@media screen and (max-width: 360px) 
{
	html > body > div#PageWrapperLayer01 > div > div#LandingPageImageWidth > div > a.navlink > video#BottomVideo
	{
		position:absolute;
		left:0;
		z-index:100;
		max-width:360px;
	}
}
@media screen and (min-width: 361px) 
{
	html > body > div#PageWrapperLayer01 > div > div#LandingPageImageWidth > a.navlink > video#BottomVideo
	{
		width:100%;
	}
}


Body 
{
    font-family: Georgia;
    font-family: Arial Black;
    font-family: Courier New;
    font-family: Times New Roman;
    font-family: Verdana;
	border-style:solid;
	border-width:0;
	background-color:#778877;	
}

#OverallContent
{
	border-style:solid;
	border-width:10px;
	border-color:#2D8B36;
	margin:0 auto; 
	max-width: 980px;
}


#Content
{
	border-style:solid;
	border-color:blue;
	float:left;
    width:100%;
}

.GenericWrapper
{
	border-style:solid;
	border-color:green;
	float:left;	
}

div#CookieInfo
{
    display:none;
}


.GenericWrapper, #Content, #OverallContent
{
	border-width:0;
}


Body ,#OverallContent, #Content, .GenericWrapper
{
}

body
{
    text-align:right;
    margin:0;
    padding:0;
    border:0;
    padding:0;
    overflow-x:hidden;
}

div#Inner-Wrapper
{
}

#OverallContent
{
    max-width:inherit;
    width:98%;
    padding:10px 1% 0 1%;
    text-align:left;
    float:left;
}    

#OverallContent img
{

    clear:both;
}    

.GenericWrapper
{
    color: black;
}

div#DemoMonitor1, div#DemoMonitor2, div#DemoMonitor3, div#DemoMonitor4
{
    margin-top:10px;
    margin-bottom:25px;
}
div#DemoMonitor1 img, div#DemoMonitor2 img, div#DemoMonitor3 img, div#DemoMonitor4 img
{
    margin:30px 30px 30px 30px;
}

div#DemoMonitor1, div#DemoMonitor2, div#DemoMonitor3, div#DemoMonitor4
{
    background:transparent url('/images/layout/DemoMonitor.png') top left no-repeat;
		background-size:100% 100%;
		-moz-background-size:100% 100%;
		-webkit-background-size:100% 100%;
}

/* This works by present a portal or window of the correct aspect ratio */

div#DemoMonitor1
{
    /* This is the same ratio as a 1920 1080 monitor */
    width:1260px; /*This includes the margin of 30px + 30px*/ /* 1200, 1200 hundred pixel is the size of the largest montitor */
    height:735px; /*This includes the margin of 30px + 30px*/ /* 675 */
    padding:0 0 0 0;
}

div#DemoMonitor2
{
    /* This is the same ratio as a 1366 768 monitor */
    width:914px; /*This includes the margin of 30px + 30px*/ /* 854, this is calcualted by 1366 x (1200/1920) */
    height:550px; /*This includes the margin of 30px + 30px*/ /* 480 , this is calcualted by 854 x (768/1366) */
    padding:0 0 0 0;
}

div#DemoMonitor3
{
    /* This is the same ratio as a 1280 800 monitor */
    width:860px; /*This includes the margin of 30px + 30px*/ /* 800, this is calcualted by 1280 x (1200/1920) */
    height:540px; /*This includes the margin of 30px + 30px*/ /* 533 , this is calcualted by 800 x (800/1200) */
    padding:0 0 0 0;
}


div#DemoMonitor4
{
    /* This is the same ratio as a 1024 768 monitor */
    width:700px; /*This includes the margin of 30px + 30px*/ /* 640, this is calcualted by 1024 x (1200/1920) */
    height:540px; /*This includes the margin of 30px + 30px*/ /* 480 , this is calcualted by 640 x (768/1024) */
    padding:0 0 0 0;
}




@media screen and (max-width: 640px) 
{
	div#LandingPageImageWidthInnerEnter
	{
		top:.5%;
	}
}

@media screen and (max-width: 360px) 
{
	div#LandingPageImageWidthInnerEnter
	{
		top:0;
	}
}