/*This is the custom css sheet for Phelix - websites DD*/
/* (1) copy this file to the theme contents folder (2) edit theme.plist - add <string>custom.css</string> to the <key>RWCopyFiles</key> array (3) edit index.html - add <link rel="stylesheet" href="%pathto(custom.css)%"
type="text/css" media="all" /> above style variations but after all other css */
/* with an upgrade, copy this file over to the updated theme and repeat steps 2 & 3 */

/* add cufon & prociono to scripts file*/

/*cufon*/
.cufon-ready #specialfont h1 {font-size:24px;line-height:24px;}
.cufon-ready .specialfont h2 {font-size:24px;line-height:24px;}

/* Title & Logo Display */
#extraContainer3 {width: 1% !important;} /*don't use EC3 - online with title*/
#logoTitle {width: 94% !important;}
#logoTitle h1 {font-size: 32px;}

/*headers*/
#contentContainer h2 {border-bottom:1px solid #00ff00; font-size:18px;}
#contentContainer h3 {border-bottom:1px solid #00ff00; font-size:18px;}
#myExtraContent5 #specialfont {color:#ff3333;text-align:center;font-size:14px;line-height:23px;}
#myExtraContent5 .specialfont {color:#ff3333;text-align:center;font-size:14px;line-height:23px;}
#contentContainer #specialfont {color:#ff3333;text-align:center;font-size:20px;line-height:23px;}
#contentContainer .specialfont {color:#ff3333;text-align:center;font-size:20px;line-height:23px;}
article h1 {border-bottom:1px solid #00ff00; font-size:18px;}

#contentContainer a:visited {color: #669966;}
/*#contentContainer a:hover, a:active {color: #ff3333 !important;}*/

/*sidebar*/
.sidespan {border-bottom:1px solid #00ff00;}

/*tooltips - class="info"*/
a.info span {display:none;}
a.info:hover span {display: inline; position: absolute; margin-top:30px; margin-left:15px; width:205px;padding:5px;z-index: 100;color: #ffffff;background:#003300;text-align:left;text-decoration:none;}

/*shadowboxes */
.shadow { width: 100%; margin: 20px auto; position: relative;z-index: 1 !important;}

.shadowBox  {
	background: #E5EFE6 !important;
	-webkit-border-radius: 4px !important;
	-moz-border-radius: 4px !important;
	border-radius: 4px !important;
	padding: 1.5em !important;
	color: #000000 !important;
	line-height: 1.5 !important;
	display: block !important;
	z-index: 2 !important;
}

.shadowBox:before, .shadowBox:after{
    -webkit-box-shadow: 0 15px 10px rgba(0,0,0, .7) !important;
	-moz-box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7) !important;
	box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7) !important;
	position: absolute !important;
	bottom: 18px !important;
	z-index: -1 !important;
	width: 50% !important;
	height: 20% !important;
	content: "" !important;
	background: rgba(0, 0, 0, 0.3) !important;
}

.shadowBox:after {
	-webkit-transform: rotate(8deg) !important;
	-moz-transform: rotate(8deg) !important;
	-o-transform: rotate(8deg) !important;
	right: 15px !important;
	left: auto !important;
}

.shadowBox:before {
	-webkit-transform: rotate(-8deg) !important;
	-moz-transform: rotate(-9deg) !important;
	-o-transform: rotate(-8deg) !important;
	right: auto !important;
	left: 15px !important;
		}

.shadowBox h2 {text-align:center; border-bottom:1px solid #00ff00; font-size:18px;margin:2px; padding:5px;}
.shadowBox p {