﻿/*
*  Modal Dialog code and styling adapted from:
*  http://www.queness.com/post/1696/create-a-beautiful-looking-custom-dialog-box-with-jquery-and-css3
*/

.happenings #Form1 #dialog-overlay 
{
    /* hide it by default */
	display:none;

	/* set it to fill the whil screen */
	width:100%; 
	height:100%;
	
	/* transparency for different browsers */
	filter:alpha(opacity=70); 
	-moz-opacity:0.7; 
	-khtml-opacity: 0.7; 
	opacity: 0.7; 
	background:#000;	

	/* make sure it appear behind the dialog box but above everything else */
	position:absolute; 
	top:0; 
	left:0; 
	z-index:3000; 
}

.happenings #Form1 #dialog-box 
{
    /* hide it by default */
	display:none;
	background: #fff url(../images/ICRectangle.jpg) 0 0 no-repeat;
	border: 5px solid #8A8E64;
		
	/* css3 drop shadow */
	-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
	
	/* css3 border radius */
	-moz-border-radius: 5px;
    -webkit-border-radius: 5px;
	
	/* Width of background image is 308px */
	width:308px;
	overflow:auto;
	
	/* make sure it has the highest z-index */
	position:absolute; 
	z-index:5000; 
}

.happenings #Form1 #dialog-box .dialog-content {
	text-align:left; 
	padding:5px; 
	margin:80px 7px 7px 7px;
	color: #000;
	font-family:arial;
	font-size:14px; 
}

.happenings #Form1 a.button {
	margin:10px auto 0 auto;
	text-align:center;
	display: block;
	width:50px;
	padding: 5px 10px 6px;
	color: #fff;
	text-decoration: none;
	font-weight: bold;
	line-height: 1;
	font-size:11px; 
	
	/* button color */
	background-color:#8A8E64; 
	
	/* css3 implementation :) */
	/* rounded corner */
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	
	/* drop shadow */
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	
	/* text shaow */
	text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
	border-bottom: 1px solid rgba(0,0,0,0.25);
	position: relative;
	cursor: pointer;
}

.happenings #Form1 a.button:hover {
	background-color: #8F602C; /* Brown */	
}

/* extra styling */
.happenings #Form1 #dialog-box .dialog-content p {
	font-weight:700; 
	margin:0;
}

.happenings #Form1 #dialog-box .dialog-content ul {
	margin:10px 0 10px 20px; 
	padding:0; 
	height:50px;
}
