﻿/* FONTS
-------------------------------------------------------
*/
@import url('https://fonts.googleapis.com/css?family=Dosis:200,300,400,500,600,700,800|PT+Sans:400,400i,700,700i');


/* Open Close Bug Styles
----------------------------------------------------------------------*/

.OpenCloseBug-area{
	display: inline-block;
	width: 150px;
	margin: 20px 0px 20px 0px;
	padding-left: 0 !important;
	border-left: none !important;
}
.OpenCloseBug{
	display: inline-block;
	width: 150px;
}
.openMsg {
	display: block;
	font-size: 14px;
	color: #76BC1B;
}
.closeMsg {
	display: block;
	font-size: 14px;
	color: #E1001A;
}

/* Paragraph Widgets */
.intro-paragraph {
	font-size: 20px;
	padding: 0px 115px 40px 115px;
	vertical-align: top;
	line-height: 1.5em;
}
.fullw-paragraph {
	padding: 0px 115px 0px 115px;
	vertical-align: top;
}


/* START PAGE-FEATURE WIDGET STYLES */

.pagefeature {
	display: table;
	padding: 40px 115px 40px 115px;
	width: 100%;
}
	.pagefeature > .feature-image {
		display: table-cell;
		width: 550px;
		min-height: 250px;
	}
		.pagefeature > .feature-image.left {
			display: table-cell;
			padding-right: 20px;
		}
		.pagefeature > .feature-image.right {
			display: table-cell;
			width: 550px;
			padding-left: 20px;
		}
		.pagefeature > .feature-image > img {
			width: 100%;
			height: auto;
			max-width: 100%;
			max-height: 100%;
		}
	.pagefeature > .feature-content {
		position: relative;
		display: table-cell;
		min-width: 300px;
		vertical-align: top;
		white-space: normal;
	}

        .pagefeature > .scroll-arrow {
            position: absolute;
            width: 100%;
            height: 40px;
            bottom: 0px;
            left: 0px;
            padding: 0px 115px;
        }

    .pagefeature > .scroll-arrow > .icon-chevron-down {
        position: absolute;
        right: 115px;
        font-size: 40px!important;
        cursor: pointer;
    }

		.pagefeature > .feature-content > h2 {
			font-family: 'Dosis', Arial, Helvetica, sans-serif;
			font-size: 26px;
			font-weight: bold;
			margin-bottom: 20px;
			margin-top: 0px;
		}
		.pagefeature > .feature-content > .bodytext {
			white-space: normal;
		}

		.pagefeature > .feature-content > .bodytext > h2 {
			margin-top: 0px;
		}

/* White Page Feature */
.pagefeature-default {
	background-color: #FFFFFF;
	color: #3C3C3C;
}

/* light gray page Feature */
.pagefeature-lightgray {
	background-color: #F6F6F6;
	color: #3C3C3C;
}

/* dark gray feature #3C3C3C */
.pagefeature-darkgray {
	background-color: #3C3C3C;
	color: #FFFFFF;
}
	.pagefeature-darkgray a {
		color: #FFFFFF!important;
	}
		.pagefeature-darkgray a:hover {
			color: #0070CD !important;
		}

/* Section Color feature Adapts to section */
.pagefeature-seccolor {
	background-color: #DA4D31;
	color: #FFFFFF;
}
	.pagefeature-seccolor a {
		color: #FFFFFF !important;
	}
		.pagefeature-seccolor a:hover {
			color: #0070CD !important;
		}

.maincontent.planyourvisit .pagefeature-seccolor {
	background-color: #E41491!important;
}
.maincontent.exhibitsevents .pagefeature-seccolor {
	background-color: #00ACBA!important;
}
.maincontent.computercollection .pagefeature-seccolor {
	background-color: #76BC1B!important;
}
.maincontent.education .pagefeature-seccolor {
	background-color: #0070CD!important;
}


/* LCML Pink feature #E41491 */
.pagefeature-pink {
	background-color: #E41491;
	color: #FFFFFF;
}
	.pagefeature-pink a {
		color: #FFFFFF!important;
	}
	.pagefeature-pink a:hover {
		color: #001489!important;
	}

/* LCML lightblue page feature #00ACBA */
.pagefeature-lightblue {
	background-color: #00ACBA;
	color: #FFFFFF;
}
	.pagefeature-lightblue a {
		color: #FFFFFF !important;
	}
		.pagefeature-lightblue a:hover {
			color: #0070CD !important;
		}

/* LCML Green page feature #76BC1B */
.pagefeature-green {
	background-color: #76BC1B;
	color: #FFFFFF;
}
	.pagefeature-green a {
		color: #FFFFFF !important;
	}
		.pagefeature-green a:hover {
			color: #0070CD !important;
		}

/* LCML Dark Blue page feature #0070CD */
.pagefeature-darkblue {
	background-color: #0070CD;
	color: #FFFFFF;
}
	.pagefeature-darkblue a {
		color: #FFFFFF !important;
	}
		.pagefeature-darkblue a:hover {
			color: #0070CD !important;
		}

/* LCML Orange feature #DA4D31 */
.pagefeature-orange {
	background-color: #DA4D31;
	color: #FFFFFF;
}
	.pagefeature-orange a {
		color: #FFFFFF !important;
	}
		.pagefeature-orange a:hover {
			color: #0070CD !important;
		}

/* END PAGE-FEATURE WIDGET STYLES */




/* START IMAGE ROW WIDGET STYLES */

/* Common ImageRow styles */
.imagerow{
	display: table;
	table-layout: fixed;
	width: 100%;
	padding: 40px 115px;
}
	.imagerow a.imageblock {
		display: table-cell;
		padding-right: 15px;
		text-decoration: none !important;
		vertical-align: top;
	}
		.imagerow a.imageblock img {
			display: block;
			width: 100%;
			height: auto;
			margin-bottom: 10px;
		}
	.imagerow span.imageblock {
		display: table-cell;
		padding-right: 15px;
		text-decoration: none !important;
		vertical-align: top;
	}
		.imagerow span.imageblock img {
			display: block;
			width: 100%;
			height: auto;
			margin-bottom: 10px;
		}

/* white image row */
.imagerow-default {
	background-color: #FFFFFF;
	color: #000;
}
	.imagerow-default a.imageblock .caption{
		font-size: 14px;
		color: #000;
	}
		.imagerow-default a.imageblock .caption:hover {
			color: #000;
		}
		.imagerow-default span.imageblock .caption {
			font-size: 14px;
			color: #000;
		}
			.imagerow-default span.imageblock .caption:hover {
				color: #000;
			}


/* Light gray image row */
.imagerow-lightgray {
	background-color: #F6F6F6;
	color: #000;
}
		.imagerow-lightgray a.imageblock .caption {
			font-size: 14px;
			color: #000;
		}
			.imagerow-lightgray a.imageblock .caption:hover {
				color: #000;
			}
		.imagerow-lightgray span.imageblock .caption {
			font-size: 14px;
			color: #000;
		}
			.imagerow-lightgray span.imageblock .caption:hover {
				color: #000;
			}


/* Section Color image row */
.imagerow-darkgray {
	background-color: #3C3C3C;
	color: #FFFFFF;
}
		.imagerow-darkgray a.imageblock .caption {
			font-size: 14px;
			color: #FFFFFF;
		}
			.imagerow-darkgray a.imageblock .caption:hover {
				color: #FFFFFF;
			}
		.imagerow-darkgray span.imageblock .caption {
			font-size: 14px;
			color: #FFFFFF;
		}
			.imagerow-darkgray span.imageblock .caption:hover {
				color: #FFFFFF;
			}

/* Dark gray image row */
.imagerow-seccolor {
	background-color: #DA4D31;
	color: #FFFFFF;
}
	.imagerow-seccolor a.imageblock .caption {
		font-size: 14px;
		color: #FFFFFF;
	}
		.imagerow-seccolor a.imageblock .caption:hover {
			color: #FFFFFF;
		}
	.imagerow-seccolor span.imageblock .caption {
		font-size: 14px;
		color: #FFFFFF;
	}
		.imagerow-seccolor span.imageblock .caption:hover {
			color: #FFFFFF;
		}

.maincontent.planyourvisit .imagerow-seccolor {
	background-color: #E41491 !important;
}
.maincontent.exhibitsevents .imagerow-seccolor {
	background-color: #00ACBA !important;
}
.maincontent.computercollection .imagerow-seccolor {
	background-color: #76BC1B !important;
}
.maincontent.education .imagerow-seccolor {
	background-color: #0070CD !important;
}


/* Pink Image Row #E41491 */
.imagerow-pink {
	background-color: #001489;
	color: #FFFFFF;
}
	.imagerow-pink a.imageblock .caption {
			font-size: 14px;
			color: #FFFFFF;
		}
.imagerow-pink a.imageblock .caption:hover {
		color: #FFFFFF;
	}
.imagerow-pink span.imageblock .caption {
	font-size: 14px;
	color: #FFFFFF;
}
.imagerow-pink span.imageblock .caption:hover {
		color: #FFFFFF;
	}

/* Light Blue Image Row #00ACBA*/
.imagerow-lightblue {
	background-color: #F9423A;
	color: #FFFFFF;
}
	.imagerow-lightblue a.imageblock .caption {
		font-size: 14px;
		color: #FFFFFF;
	}
.imagerow-lightblue a.imageblock .caption:hover {
	color: #FFFFFF;
}
.imagerow-lightblue span.imageblock .caption {
	font-size: 14px;
	color: #FFFFFF;
}
.imagerow-lightblue span.imageblock .caption:hover {
	color: #FFFFFF;
}

/* Green Image Row #76BC1B */
.imagerow-green {
	background-color: #76BC1B;
	color: #FFFFFF;
}
	.imagerow-green a.imageblock .caption {
		font-size: 14px;
		color: #FFFFFF;
	}
.imagerow-green a.imageblock .caption:hover {
	color: #FFFFFF;
}
.imagerow-green span.imageblock .caption {
	font-size: 14px;
	color: #FFFFFF;
}
.imagerow-green span.imageblock .caption:hover {
	color: #FFFFFF;
}

/* Dark Blue Image Row #0070CD */
.imagerow-darkblue {
	background-color: #0070CD;
	color: #FFFFFF;
}
	.imagerow-darkblue a.imageblock .caption {
		font-size: 14px;
		color: #FFFFFF;
	}
.imagerow-darkblue a.imageblock .caption:hover {
	color: #FFFFFF;
}
.imagerow-darkblue span.imageblock .caption {
	font-size: 14px;
	color: #FFFFFF;
}
.imagerow-darkblue span.imageblock .caption:hover {
	color: #FFFFFF;
}

/* Orange Image Row #DA4D31 */
.imagerow-orange {
	background-color: #DA4D31;
	color: #FFFFFF;
}
	.imagerow-orange a.imageblock .caption {
		font-size: 14px;
		color: #FFFFFF;
	}
.imagerow-orange a.imageblock .caption:hover {
	color: #FFFFFF;
}
.imagerow-orange span.imageblock .caption {
	font-size: 14px;
	color: #FFFFFF;
}
.imagerow-orange span.imageblock .caption:hover {
	color: #FFFFFF;
}

/* END IMAGE ROW WIDGET STYLES */

.LCMLmap {
	width: 100%;
	height: 400px;
	margin: 40px 0px 40px 0px;
}


/* SPONSOR LOGOS REPEATER WIDGET */
.sponsorlogo-container.hor {
	margin-top: 30px;
	position: relative;
	background-color: #EEEEEE;
}

.sponsorlogo-container.vertical  {
	padding-right: 115px;
}

.sponsorlogo-container .socialPostArea {
	top: 42px;
	right: 20px;
}

.sponsorlogo-container .contentblock {
	padding-top: 10px;
	padding-bottom: 10px;
	
}

.sponsorlogo-container.vertical h3 {
	display: block;
	vertical-align: middle;
	float: none;
	margin-top: 5px;
	text-align: center;
}

.sponsorlogo-container.hor h3 {
	display: inline-block;
	vertical-align: middle;
	float: left;
	padding-top: 10px;
}

	.sponsorlogo-container.vertical .sponsor-gallery {
		display: block;
		width: 100%;
		background-color: #EEEEEE;
		padding: 20px 0;
	}

.sponsorlogo-container.hor .sponsor-gallery{
	display: inline-block;
	width: calc(100% - 150px);
	padding-left: 40px;
}

.sponsorlogo-container.vertical .sponsorlogo-block {
	display: block;
	width: 250px;
	height: 75px;
	position: relative;
	margin: auto;
	
	max-width: 90%;
}

.sponsorlogo-container.hor .sponsorlogo-block {
	display: inline-block;
	width: 250px;
	height: 100px;
	position: relative;
}

	.sponsorlogo-container .sponsorlogo-block img {
		display: block;
		max-width: 100%;
		position: absolute;
		top: 0;
		bottom: 0;
		margin: auto;
	}

/* END SPONSOR LOGOS REPEATER WIDGET STYLES*/


/* 2 Column 60-40 layout */
.bigContainer {
	display: inline-block;
	float: left;
	width: 70%;
	padding-right: 40px;
}

.smallContainer {
	display: inline-block;
	float: left;
	width: 30%;
}

.two-col {
	display: block;
	overflow: hidden;
	padding: 20px 0;
}


/*---------------------------------------------------------
    Video Module
-----------------------------------------------------------*/
.video-module {
	margin: 40px auto;
	display: table;
	position: relative;
}


	.video-module .video-module-title {
		text-transform: uppercase;
		color: #fff;
		position: absolute;
		top: 39px;
		left: 97px;
		font-weight: bold;
		text-shadow: 0 2px 3px #000;
		font-family: 'Dosis', Arial, Helvetica, sans-serif;
		font-size: 28px;
	}

	.video-module img {
		margin: auto;
		display: block;
		max-width: 100%;
	}

.impact-intro {
	max-width: 1100px;
	margin: auto;
}


.video-module .box {
	position: absolute;
	bottom: 60px;
	right: 140px;
	height: 40px;
	width: 40px;
	background: url(/UI/Images/ButtonPlayOff.png) no-repeat;
	background-size: 100%;
	top: 40px;
	left: 40px;
}

.video-module .box:hover {
	position: absolute;
	bottom: 60px;
	right: 140px;
	height: 40px;
	width: 40px;
	background: url(/UI/Images/ButtonPlayRoll.png) no-repeat;
	background-size: 100%;
	top: 40px;
	left: 40px;
}

/*.video-module .play {
	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAcCAYAAACUJBTQAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAvNJREFUeNq0Vl9oUlEYP17unHPTIfowc5JLsBd9GypYTFyKLwNF82Ev9dxL9NpjbbBiRAXVXkYThmQvPexBRChD1JWOJWGBbug2toEbThBdczr7vgvGIpfXP/vgcu/h3nt+53y/3/c7H2dra+tNKpVyHxwcrNZqNVIsFgkGh8Nhrnq9TiiKImdnZ8wYn4+Pj5kxn89n3uMzTdME/8dv8F4qlcjAwADhcrmEkkqljsnJyZBWq301NDR0tVKpMD/1MqhqtVoEdFqpVN6zWq1xvV7/ENCFCIar7AkIbr0RPB5PotPpZl0u11e1Wn0HQKjT09PuQZqtdnh4+LrJZFqy2WxBhUJxC4Fgx52D/O8l8HVzamoqAGn0SiQSNaYQSW0bBNlvFcCXy+l0fjEajc8GBwelJycnbYmDQumxCfiOr9FoHjgcjjgo8X5fXx+frTiodrcOtXFlYmLi+fT09KpKpbqNIK3EQXVKplgs1lgslvfAmV8ul9/AXV0kDqpbeY6Ojlrsdvtns9n8ViQSqZoVM9WroobU3YX6ihkMhhmoNzGKo8EXp1wub4LHXOuljYD/ZaPR6NN0Or0IwwpBkPolRT6f/+73+20UucQAfmoghhqNuUNL7nG6NgOBwFw8Hl+SyWRVuhObuChgwUeJROJlMpl8sbGxcYRzQ9ESuheTg2SrMPESAMwdHh5ugrpIf3//Hyl3DZLJZHyhUOjx3t5eVCAQMJPj6fmXJXV6MGWz2W/hcPjR/v7+hwav6IPNjJPGnLUT0AvseDyeJ7D6xbGxsV9AbEtHptlYPQbUU9Hn8y14vd757e3t3MjICJ6kTOPQ0sHZAIBSPMvLyzPBYPAn5hwajn/y3jHI7u7ux1gsNgOkfsrlckwL1Gh52ommICDDH+A9s0CuB8e4eraHW1OQ8+oqFAq5lZWVeWj4XkM6SkKhsKvJzxMvhO1XIpHIgtvtngdJ7oyPjxMEYEMqKxAg9d36+rp7bW0tDvIk0Ci0RSqb+C3AAPxNzdyx9CecAAAAAElFTkSuQmCC");
	background-repeat: no-repeat;
	background-size: 20px 25px;
	position: absolute;
	width: 42px;
	height: 42px;
	left: 4px;
	top: 4px;
	
	border: 1px solid #fff;
	background-position-x: 10px;
	background-position-y: 5px;
}*/

/*.glow-button:before, .glow-button:after {
	position: absolute;
	content: '';
	height: 100%;
	width: 100%;
	top: 0%;
	left: 0%;
	border-radius: 50%;
	box-shadow: 0 0 15px #fff;
	-webkit-animation: glow-grow 3s ease-out infinite;
	-moz-animation: glow-grow 3s ease-out infinite;
	-o-animation: glow-grow 3s ease-out infinite;
	animation: glow-grow 3s ease-out infinite;
}

.video-module .glow-button:after {
	animation-delay: .66s;
}*/


@media screen and (min-width: 0px) and (max-width: 1039px) {
	.intro-paragraph {
		font-size: 20px;
		padding: 0px 20px 40px 20px;
		vertical-align: top;
		line-height: 1.5em;
	}
	.fullw-paragraph {
		padding: 0px 20px 40px 20px;
		vertical-align: top;
	}

	.pagefeature {
		padding: 40px 10px 40px 10px;
	}
    .pagefeature > .scroll-arrow > .icon-chevron-down{
        right: 10px!important;
    }


    .PrivateEvent > .RoomInfo > .RoomImage {
        width: auto;
        display: block !important;
        margin-right: 0 !important;
    }

    .imagerow {
        padding: 40px 40px 40px 40px;
    }

	.bigContainer, .smallContainer {
		width: auto;
		display: block;
		float: none !important;
		padding-right: 0 !important;
		margin-bottom: 20px;
	}

	.sponsorlogo-container.vertical {
		padding: 0 20px;
	}
}

@media screen and (min-width: 0px) and (max-width: 700px) {

	.pagefeature > .feature-image {
		display: block;
		width: 100%;
		height: auto;
	}
		.pagefeature > .feature-image.left {
			display: block;
			width: 100%;
			height: auto;
			padding-right: initial;
			padding-bottom: 20px;
		}
		.pagefeature > .feature-image.right {
			display: block;
			width: 100%;
			height: auto;
			padding-left: initial;
			padding-bottom: 20px;
		}
		.pagefeature > .feature-image > img {
			width: 100%;
			height: auto;
		}
	.pagefeature > .feature-content {
		display: block;
	}


	.imagerow {
		display: block;
		table-layout: auto;
	}
		.imagerow a.imageblock {
			display: block;
			padding-right: 0px;
			text-decoration: none !important;
			vertical-align: top;
			margin-bottom: 40px;
		}
		.imagerow span.imageblock {
			display: block;
			padding-right: 0px;
			text-decoration: none !important;
			vertical-align: top;
			margin-bottom: 40px;
		}
}

@media screen and (min-width: 0px) and (max-width: 760px) {

	.sponsorlogo-container.vertical {
		margin-top: 0;
	}

	.sponsorlogo-container.hor {
		margin-top: 0;
		background: none;
	}

	.sponsorlogo-container .socialPostArea {
		 top: 15px;
		 right: 0;
	}

	.sponsorlogo-container.hor .sponsorlogo-block {
		display: block;
		margin: auto;
	}

	.sponsorlogo-container.hor .contentblock, .sponsorlogo-container.vertical .contentblock {
		background: none;
	}

	.sponsorlogo-container.hor .sponsor-gallery, .sponsorlogo-container.vertical .sponsor-gallery {
		background: #eee;
	}

	.sponsorlogo-container.hor h3 {
		display: block;
		float: none;
		padding-top: 0px;
	}

	.sponsorlogo-container.hor .sponsor-gallery {
		display: block;
		width: 100%;
		padding-left: 0px;
	}


}