@import url(css/Default.css);

.Skin{width:960px;margin:0 auto;}
.ControlPanel{border: none;border-radius: 0 0 10px 10px; box-shadow: 0 0 3px #aaa;}

header, #Middle, footer{clear:both;padding:10px 0;}
#Content{clear:both;padding:10px;min-height:300px; margin-bottom:8px;}

header{position:relative; min-height:50px;}
header #Logo img{padding:5px 10px;}

#HeaderRight{clear:both;float:right;position:absolute; bottom:15px;right:10px;}
#Date{text-align:right; color:#888;padding-top:3px;}

/* Skin */
#Body{background:#fff;}

#Language{float:right; padding-right:8px;}
#Language .Language{margin:0;}
#Language span{padding-left:5px;}
#Language img{border:none;opacity:0.3;}
#Language .selected img, #Language img:hover{opacity:1;}


#MenuToggle{display:none;}

/*HorMenu */
.FFUlMenu{position:relative;}
.FFUlMenu, .FFUlMenu ul {padding: 0; margin: 0; list-style: none; line-height: 1;}
.FFUlMenu li {float: left; list-style-type:none;position:relative;}
.FFUlMenu a, .FFUlMenu li>span  {display:block;}
.FFUlMenu a:hover{text-decoration:none;}


/* Styling & Width*/
.FFUlMenu a, .FFUlMenu li>span{padding:0.5em;}
.FFUlMenu li, .FFUlMenu li ul{width: 226px;}
.FFUlMenu img{padding-right:5px;}

.FFUlMenu li.Level0, .FFUlMenu a.Level0{width:auto;}

/* Main Menu */
.MainMenu, footer{height:36px;border-radius:6px 6px 6px 6px;padding:0 10px;
background: #e8e8e8; /* Old browsers */
background: -moz-linear-gradient(top,  #eeeeee 0%, #dddddd 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#dddddd)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #eeeeee 0%,#dddddd 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #eeeeee 0%,#dddddd 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #eeeeee 0%,#dddddd 100%); /* IE10+ */
background: linear-gradient(to bottom,  #eeeeee 0%,#dddddd 100%); /* W3C */
}

.MainMenu{position:relative;z-index:1000;}
.MainMenu li.Level0{text-shadow:1px 1px 1px #fff;}
.MainMenu li.Level0.Active, .MainMenu li.Level0.ActiveParent{margin-top:5px;}

.MainMenu a.Level0, .MainMenu span.Level0{display:block; line-height:36px; padding:0 18px; }
.MainMenu a:link, .MainMenu a:visited{color:#000;}
.MainMenu a:hover{color:#888;text-decoration:none;}
.MainMenu li>span{color:#888;}

.MainMenu li.Level0>a.Active, .MainMenu li.Level0>a.ActiveParent, .MainMenu li.Level0>span.Active, .MainMenu li.Level0>span.ActiveParent{color:#F00 !important; border-radius: 6px 6px 0 0; box-shadow:0 0 5px #aaa; background:#fff; border-bottom:none;}
.MainMenu #TabMask{display:block; height:8px; background:#fff; margin-top:-2px; padding:0; width:120%; margin-left:-10px; box-shadow:0 0 3px #fff; position:absolute; padding:0;}


/* Show & Hide levels */
.MainMenu  li ul {position:absolute;left:-999em; z-index:1001}
.MainMenu  li ul{
        opacity:0;  
        -webkit-transition: opacity 0.3s linear;  
        -moz-transition: opacity 0.3s linear;  
        -o-transition: opacity 0.3s linear;  
        -ms-transition: opacity 0.3s linear;  
        transition: opacity 0.3s linear; 
		}

.MainMenu li{position:relative;}
.MainMenu li ul ul {margin: 0 0 0 226px;}
.MainMenu  li ul ul {top:0;}
.MainMenu  li:hover>ul{left: 0; opacity:1; }
.MainMenu  li.Level0:hover>ul{left: 10px;}
/* Remove to also have a dropdown on the active root item 
.MainMenu  li.Level0.Active:hover>ul, .MainMenu  li.Level0.ActiveParent:hover>ul{left:-999em;}
*/

.MainMenu li.Level0 ul{background:#fff;border-radius:6px; box-shadow:0 0 3px #888;}

.MainMenu li.Level0 a{color:#000;}
.MainMenu li.Level0 a.Active, .MainMenu li.Level0 a.ActiveParent, .MainMenu li.Level0 a:hover{color:#F00 !important;}

/* Sub Menu */
.SubMenu{background:#fff; position:relative; clear:both; min-height:7px;}
.SubMenu {padding:0 22px 0; border-bottom:dotted 1px #ccc;}
.SubMenu li a, .SubMenu li>span{color:#000;padding:8px 20px 10px 6px;}
.SubMenu li a.Active, .SubMenu li a.ActiveParent, .SubMenu li a:hover{color:#F00 !important;}

.SubMenu .TabMask{display:none;}


.FloatRight{float:right;}

.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */


#BC{padding:0 10px;border-bottom:dotted 1px #ccc; line-height:30px;}
#BC a:link, #BC a:visited{color:#444;}
#BC a:hover{color:#f00;}
#Search{float:right;}
#Search input{border:solid 1px #ddd;}
/* Footer */

footer{margin-bottom:40px;text-shadow:1px 1px 1px #fff;}
footer a:link, footer a:visited{color:#222;display:inline-block;}
footer a:hover{color:#666;}
footer, footer a{line-height:36px;}

ul.ModuleOptionsMenu li.sfhover a { color: #444;text-decoration:none;}

/* Panes */
.Pane{margin:0 0 20px;}
.ContentPane{position:relative;}

.HeaderRight{position:absolute; bottom:15px;right:10px;}
.HeaderPane .Normal{text-align:right;}
.HeaderPane h1, .HeaderPane h1 a:link, .HeaderPane h1 a:visited {font-size: 12px; font-weight: normal; margin:0;}

/* 3 cols variations */
.Cols3 .paneOutline{background:#FFF7F7;}
.Cols3 .C12{float:left;width:620px;}
.Cols3 .C23{float:right;width:620px;}
.Cols3 .C1{float:left; width:300px;}
.Cols3 .C2{float:left; width:300px; margin-left:20px;}
.Cols3 .C3{float:right; width:300px;}


/* 4 cols variations */
.Col4{clear:both;}
.Cols4 .paneOutline{background:#EFF5FF;}
.Cols4 .C123{float:left; width:700px;}
.Cols4 .C234{float:right; width:700px;}

.Cols4 .C50-50L{float:left;width:460px;}
.Cols4 .C50-50R{float:right;width:460px;}

.Cols4 .C1{width:220px; float:left;}
.Cols4 .C2{width:220px; float:right;}
.Cols4 .C3{width:220px; float:left;}
.Cols4 .C23{width:460px; float:left;margin-left:20px;}
.Cols4 .C4{width:220px; float:right;}

.Cols4 .C75-25 .C1{clear:left;}
.Cols4 .C75-25 .C1, .Cols4 .C75-25 .C2, .Cols4 .C75-25 .C3{float:left; margin-right:20px;}
.Cols4 .C25-75 .C2, .Cols4 .C25-75 .C3, .Cols4 .C25-75 .C4{float:right; margin-left:20px;}

.paneOutline{border:0 none !important;background:#eee;}
.DNNEmptyPane{display:none;}

/* DNN 7 */
.dnnEditState .DnnModule {opacity: 1.0;} 
.dnnCPHeader li{line-height:35px;}
form .actionMenu ul{z-index:auto !important;}

.Pane{max-width:100%;}

/* All smaller then base grid */
@media screen and (max-width: 959px) {
img{max-width:100%; height:auto !important;}
iframe{max-width:100%;}
.Pane, .PaneWrap{max-width:100%;}

/* Main Menu */
.MainMenu, footer{min-height:36px;height:auto;}
.MainMenu li.Level0.Active a, .MainMenu li.Level0.ActiveParent a{margin-top:0;}
.MainMenu li.Level0.Active > a, .MainMenu li.Level0.ActiveParent > a{line-height:30px;  }
.MainMenu li.Level0 a.Active, .MainMenu li.Level0 a.ActiveParent, .MainMenu li.Level0>span.Active, .MainMenu li.Level0>span.ActiveParent{border-radius:6px;}
.MainMenu #TabMask{display:none;}
}

/* Tablet Portrait */
@media screen and (min-width: 768px) and (max-width: 959px) {
	.Skin{width:720px;}
	/* Panes  3Cols */
	/* 3 cols variations */
	.Cols3 .C12{float:left;width:460px;}
	.Cols3 .C23{float:right;width:460px;}
	.Cols3 .C1{float:left; width:220px;}
	.Cols3 .C2{float:left; width:220px; margin-left:20px;}
	.Cols3 .C3{float:right; width:220px;}

	/* Panes  4 cols*/
	.Cols4 .C1 , .Cols4 .C2, .Cols4 .C3, .Cols4 .C4{width:160px;}
	.Cols4 .C50-50L, .Cols4 .C50-50R{width:340px;}
	.Cols4 .C23 {width:340px;}
	}

/* All Mobile */
@media screen and (max-width: 767px) {
	/* Main Menu */
	.MainMenu{}
	.MainMenu > ul{display:none; border-top:solid 1px #ccc;}
	.MainMenu ul, .MainMenu li{float:none; left:0 !important; position:relative !important; box-shadow: none !important; margin:0 !important; background:transparent !important;opacity:1 !important;line-height:auto;}
	.MainMenu li a{line-height:25px !important; padding:0 !important;}
	.MainMenu ul ul{padding-left:15px;}
	.MainMenu li.Level0 a.Active, .MainMenu li.Level0 a.ActiveParent, .MainMenu li.Level0 > span.Active, .MainMenu li.Level0 > span.ActiveParent {
	background:transparent; border-radius:0; box-shadow:none;
	}
	a#MenuToggle{display:block; color:#000;line-height:36px; background:url(Img/MenuToggle.png) no-repeat right center;}
	.SubMenu{display:none;}
}

/* Mobile Landscape */
@media screen and (min-width: 480px) and (max-width: 767px) {
	.Skin{width:470px; padding:0 5px;}
	/* panes 4 cols */
	.Cols4 .C75-25 .C3{margin-right:0;}
	.Cols4 .C25-75 .C2{margin-left:0;}
	.Cols4 .C23{margin-left:0;}
	.Cols3 .Pane{width:100%; margin-left:0; margin-right:0;}
}

/* Mobile Portrait */
@media screen and (max-width: 479px) {
	.Skin{width:310px; padding:0 5px;}
	.Cols3 .Pane, .Cols4 .Pane{width:100%; margin-left:0; margin-right:0;}
	footer{padding: 5px 10px;}
	footer, footer a{line-height:20px;}
	footer .FloatRight{float:none; display:block;}
}