/* 
================================
Skin styles for Karooba.com
================================
*/  
html{height:100%;}
body {background: #C4D0E8;font: 12px Verdana, Arial, Helvetica, sans-serif;}
table.ControlPanel{border:dotted 1px #cdcdcd;margin:2px auto;width:962px;}
#pagemaster
{
   width: 962px;
   margin: 0 auto -3em;
   background: #FFFFFF;
   min-height:100%;
   height: auto !important;
   height:100%;
}
#headerSite
{
   width: 953px;
   margin: auto;
   /*margin-top:5px;*/
   background:#B7C6E7 url(images/layout-header.jpg) no-repeat;
   height:160px;
}
#headerSite-no-arrow
{
   width: 953px;
   margin: auto;
   /*margin-top:5px;*/
   background:#B7C6E7 url(images/layout-header-no-arrow.jpg) no-repeat;
   height:160px;
}
#topLogo
{
    float:left;
    padding-left:5px;
    padding-top:5px;
}
#topLogin
{
    height:110px;
    float:right;
    width:750px;
    margin-top:5px;
}
.loginForm
{
    height:110px;
    width:440px;
    float:right;
    /*margin-right:5px;*/
}
#dnnCoreNav
{
    width:750px;
    float:right;
    text-align:left;
    margin-top:2px;
    height:40px;
}
#mainContent
{
    margin: 5px auto;
	width: 953px;
	overflow: hidden;
	display: block;
	clear: both;
}
.leftpane
{
    width:190px;
    vertical-align:top;
}
.rightpane
{
    vertical-align:top;
    width:320px;
    background-color:#365999;
    height:auto !important;
}
.altRightpane
{
    vertical-align:top;
    width:280px;
    background-color:#365999;
    height:auto !important;
}
.contentpane
{
    vertical-align:top;
}
.alternativePane
{
    width:420px;
    float:right;
}
.adminpane
{
    width:950px;
    margin:0 auto;
    text-align:left;
    padding:0px;
}
.push{height:3em;}
.editTriviapane
{
    margin:0 auto;
    min-width:962px;
    width: auto !important;
}
#footerSite
{
    clear:both;
    margin: 0 auto;
    width:962px;
    height:3em;
    background:url(images/layout-footer.jpg) no-repeat;
    clear:both;
    text-align:right;
    padding-top:6px;
    
}
#footerSite .copyright
{
    color: #fff;
}
#footerSite a{
	text-decoration: none;
	margin-right: 10px;
	color: #fff;
}
#footerSite a:hover{
	text-decoration: none;
	margin-right: 10px;
	color: #000;
}
/************************ Common style ***********************/
.Normal
{
    font-size: 12px;
     
	color: #335998;	
	line-height:130%;
} 

.NormalHighlight  
{ 
	color:#009900;	
	font-weight:bold; 
	font-size:12pt; 
}	

.NormalColor
{
    font-size: 12px;
     
	color: #CC6600;
	line-height:130%;
}
.NormalError
{
    font-size: 12px;
     
	color:Red;
	line-height:130%;
}
.NormalBig
{
	 font-size: 15px;
    
	color: #335998;	
	line-height:130%;
}
.NormalBigColor
{
	 font-size: 15px;
    
	color: #CC6600;
	line-height:130%;
}
.NormalVeryBig
{
	 font-size: 17px;
    
	color: #335998;	
	line-height:130%;
}
.NormalVeryBigColor
{
	 font-size: 17px;
    
	color: #CC6600;
	line-height:130%;
}
.normalcolor
{
	font-size: 15px;
	color: #CC6600;
}

.NormalSmall
{
	font-size: 11px;
	color: #330000;
}

.NormalSmallColor
{
	font-size: 11px;
	color: #CC6600;
}

.normalverysmall
{
	font-size: 9px;
	color: #330000;
}
.SkinObject {
    font-size: 12px;
    color: #003366;
    text-decoration: underline;
}

A.SkinObject:link {
    text-decoration: underline;
    color:#003366;
}

A.SkinObject:visited  {
    text-decoration:underline;
    color:#003366;
}

A.SkinObject:active   {
    text-decoration: underline;
    color:#003366;
}

A.SkinObject:hover    {
    text-decoration: none;
    color:#003366;
}

A:link  {
    text-decoration:    none;
    color: #CC6600;
}

A:visited   {
    text-decoration:    none;
    color:  #CC6600;
}

A:hover {
    text-decoration:    underline;
    color:  #ff0000;
}

A:active    {
    text-decoration:    none;
    color:  #CC6600;
}

.NormalTextBox
{}

/* style of item titles on edit and admin pages */
.SubHead{
    font-size:  12px;
    font-weight: bold;
    color: #345A98;
}
.SubHeadOrange{
    font-size:  12px;
    font-weight: bold;
    color: #CC6600;
}
.SubHeadNoColor    {
    font-size:  15px;
    font-weight: bold;
    color: #003366;  
}

/* module title style used instead of Head for compact rendering by QuickLinks and Signin modules */
.SubSubHead {
    font-size:  14px;
    font-weight:bold;
    color: black;
}
.SubHeadColor{color: #F84934;/*color: #CC6600; */font-size: 12px;font-weight: bold;}
.StandardButton {
  background: #7994cb none; 
  color: #ffffff;
  font-family: verdana, sans-serif; 
  font-size: 13px;
  font-weight:bold;
}
/* Nav  dnnMenu*/
.main_dnnmenu_container {background-color: transparent; }
.main_dnnmenu_bar {
	cursor: pointer; 
	cursor: hand;
	height:16px;
	background-color: Transparent;
}
.main_dnnmenu_item td { /*TD if menu option for using tables is on*/
	cursor: pointer; 
	cursor: hand; 
	color: #333; 
	font-size: 10pt; 
	font-weight: bold; 
	text-transform:uppercase;
	font-style: normal; 
	background-color: Transparent;
	font-family: Tahoma, Arial, Helvetica; 
    white-space: nowrap;  /*Word wrapping menu item now optional*/
    padding: 1px 5px 3px 1px;	
}
.main_dnnmenu_rootitem  { /*TD if menu option for using tables is on*/
	cursor: pointer; 
	cursor: hand; 
    color: #345A98;
	font: 18px Arial;
	text-decoration: none;
	font-weight: bold;
	text-transform: uppercase;
	background-color: Transparent;
    white-space: nowrap;  /*Word wrapping menu item now optional*/	    
    padding: 0px 12px 0px 5px;   /*explicitly set padding for root menu items*/
    margin-left:10px;
    border-right: 2px solid #fff;
}
.main_dnnmenu_itemhover {color: #9FC0FF; }
.main_dnnmenu_itemactive {color: #CC0000; }
.main_dnnmenu_itemhover td {color: #FFF;background-color: #CC0000;}
.main_dnnmenu_icon {
	cursor: pointer; 
	cursor: hand; 
	text-align: center; 
	width: 15px; 
	height: 100%;
}
.main_dnnmenu_submenu 
{
	margin-top:10px;
	background-color: #E7E7E7;  
	z-index: 1000; 
	cursor: pointer; 
	cursor: hand; 
	filter:progid:DXImageTransform.Microsoft.Shadow(color='#696969', Direction=135, Strength=3); 
	padding: 1px 1px 1px 1px;   /*explicitly set padding for sub-menus */
}
.main_dnnmenu_break {
	height: 1px;
	font-size: 1px;
}
.main_dnnmenu_arrow {
	border-right: #cad5ea 1px solid; 
	border-bottom: #cad5ea 1px solid; 
	border-top: #cad5ea 0px solid;
	font-family: webdings; 
	font-size: 10pt; 
	cursor: pointer; 
	cursor: hand; 
}
.main_dnnmenu_rootmenuarrow {
	font-family: webdings; 
	font-size: 10pt; 
	cursor: pointer; 
	cursor: hand;
}

button { border:0; cursor:pointer; font-weight:bold; padding:0 9px 0 0; text-align:center; float: left; width: auto; }
button span { position:relative; display:block; white-space:nowrap; padding:11px 0 0 9px; }
/*redtheme buttons*/
button.btn_redtheme { background:url(images/btn_red_right.gif) right no-repeat; font-size:16px; font-weight: bold; }
button.btn_redtheme span { height:40px; line-height:25px;background:url(images/btn_red_left.gif) left no-repeat;color:#fff; }
/*alphatheme buttons
button.btn_Alphatheme { margin-left:30px;margin-top:-7px; background:Transparent url(images/btn_alpha_right.gif) right no-repeat; font-size:15px;font-weight:bold;font-family:Candara;}
button.btn_Alphatheme span { height:27px; background:Transparent url(images/btn_alpha_left.gif) left no-repeat;color:#fff;}
*/
#sidebar  {
	float: left;
	padding:0;
	margin:0;
    overflow: hidden;
    line-height:300%;
}
#sidebar h3.title
{
    text-align:left;
	color: #FDE82B;
	font-size: 32px;
	font-weight: bold;
	margin: 10px 0 0 0px;
	padding: 10px 0 15px 20px;
}
#sidebar h3.title_small
{
    text-align:left;
	color: #FDE82B;
	font-size: 26px;
	font-weight: bold;
	margin: 10px 0 0 0px;
	padding: 10px 0 15px 20px;
}
#sidebar h4.question
{
    text-align:left;
	color: #fff;
	font-size: 15px;
	font-weight: bold;
	text-transform: uppercase;
	margin: 10px 0 10px 15px;
}
#sidebar .step{width:26px;line-height:150%;}
#sidebar .step td
{
    padding-left:5px;
	color:#FFF;
	font-size: 15px;
	font-weight:bold;
	text-align:left;
	height:52px;
}

/* text style for buttons and link buttons used in the portal admin pages */
.CommandButton     {
    font-family: verdana,arial,helvetica,sans-serif;
    font-size: 12px;
	color: #335998;
    font-weight: normal;
}
    
/* hyperlink style for buttons and link buttons used in the portal admin pages */
A.CommandButton:link {
    text-decoration:    underline;
    color: #335998;
}

A.CommandButton:visited  {
    text-decoration:    underline;
    color: #335998;
}

A.CommandButton:hover    {
    text-decoration:    underline;
    color: #ff0000;
}

A.CommandButton:active   {
    text-decoration:    underline;
    color: #003366;
}


/* ModalDialog Css Style Sheet */
.modalBackground
{
    background-color: Gray;
	filter: alpha(opacity=70);
	opacity: 0.7;
}
.modalpopup
{
    font-family:Tahoma,helvetica,Arial;
    padding: 2px 3px;
    display: block;
    text-align:left;
    position: relative;
    margin:0 auto;
}
#wrapperPop
{
    text-align:left;
    /*position:absolute;*/
    width: 360px;
    background-color:#fff;
    height:240px;
    border:solid 1px #cdcdcd; 
    margin:0 auto;
} 
#wrapperPop .header
{
    height:33px;
    background:#365999 url(images/head-bg.gif) repeat-x;
    font-weight: bold;
    color:#FFF;
    padding-left:10px;
    background-color:#365999; 
} 
#wrapperPop .body
{
    padding: 5px 0px 0px 10px;
    text-align:center; 
} 
#wrapperPop .SearchBody
{
    padding: 5px 0px 0px 10px;
    text-align:left; 
    color:#333;
    font-size:14px;
} 
#wrapperPop .footer
{
    float:right;
    margin-top:15px;
    padding-bottom: 8px;
    padding-right: 10px;
}
#wrapperPop .tooltip
{
    width: 350px;
    float:left;
    padding:5px;
}
.btn_karoobatheme
{
   background-color:#fff;
   border:solid 1px #cdcdcd;
   margin-right:10px;
   padding:3px 5px 3px 5px; 
}
.logoutStyle
{
    padding-top:2px;
    background:transparent url(images/UserLogout.gif) no-repeat left top;
    padding-left:20px;
    font-family: verdana,arial,helvetica,sans-serif;
    font-size: 12px;
	color: #335998;
    font-weight: normal;
}

A.logoutStyle:link {
    text-decoration:    underline;
    color: #335998;
}

A.logoutStyle:visited  {
    text-decoration:    underline;
    color: #335998;
}

A.logoutStyle:hover    {
    text-decoration:    underline;
    color: #ff0000;
}

A.logoutStyle:active   {
    text-decoration:    underline;
    color: #003366;
}



.OpenkarobactorStyle{font-weight:bold;font-family:Calibri;font-style:italic;font-size:15px;}
A.OpenkarobactorStyle:link,A.OpenkarobactorStyle:visited,A.OpenkarobactorStyle:active{text-decoration: underline;color: #CC0000;}
A.OpenkarobactorStyle:hover{text-decoration: none;color: #335998;}

/*
div#SubNav{font-weight:bold;height:20px;background-color:#F94836;padding:5px 0px 2px 20px;}
*/
div#SubNav{font-weight:bold;height:20px;background-color:#E47911;padding:0px 0px 0px 0px;}

#SubNav A {margin-left:5px;margin-right:5px;color:#FFF;font-size:14px;}
#SubNav A:link,#SubNav A:visited,#SubNav A:active{color:#FFF;}
#SubNav A:hover{color:#000;}

/* ModalDialog Css Style Sheet */
.modalpopup #wrapperPopAge
{
    width: 360px;
    background:url(images/Popup_bg.gif) no-repeat left top;
    background-color:#fff;
    height:120px;
}
#wrapperPopAge .header
{
    height:40px;
    font-weight: bold;
    color:#fff;
    padding-top:10px;
    padding-left:10px;
} 
#wrapperPopAge .body
{
    padding: 2px 0px 2px 10px;
} 
#wrapperPopAge .footer
{
    font-size:12px;
    float:right;
    padding-bottom: 8px;
    padding-right: 10px;
}
#wrapperPopAge .errorMessage
{
    position:absolute;
    top:120px;
    left:10px;
    background:url(images/warning_sign.gif) no-repeat 10px 2px;
    padding-left:40px;
    padding-top:5px;
    padding-bottom:5px;
    padding-right:10px;
    border:solid 1px #CC0000;
    background-color:#FFFACD;
}
.errorMessage UL
{
    margin:0px;
    padding-left:20px;
}
#btnClose {
	RIGHT: 6px; WIDTH: 122px; POSITION: absolute; TOP: 8px; HEIGHT: 29px
}
#btnClose A:link {
	DISPLAY: block; FONT-SIZE: 13px; BACKGROUND: url(images/btn_close.gif) no-repeat right top; WIDTH: 122px; COLOR: #fff; PADDING-TOP: 6px; HEIGHT: 23px; TEXT-DECORATION: none
}
#btnClose A:visited {
	DISPLAY: block; FONT-SIZE: 13px; BACKGROUND: url(images/btn_close.gif) no-repeat right top; WIDTH: 122px; COLOR: #fff; PADDING-TOP: 6px; HEIGHT: 23px; TEXT-DECORATION: none
}
#btnClose A:active {
	DISPLAY: block; FONT-SIZE: 13px; BACKGROUND: url(images/btn_close.gif) no-repeat right top; WIDTH: 122px; COLOR: #fff; PADDING-TOP: 6px; HEIGHT: 23px; TEXT-DECORATION: none
}
#btnClose A:hover {
	BACKGROUND-POSITION: right bottom; TEXT-DECORATION: underline
}
.modalPopupTextBox
{
    border:solid 1px #cdcdcd;
}
.highlight
{
    background-color:#FFFACD;
}
#wrapperPopAge button { border:0; cursor:pointer; font-weight:bold; padding:0 9px 0 0; text-align:center; float: left; width: auto; }
#wrapperPopAge button span { position:relative; display:block; white-space:nowrap; padding:0 0 0 9px; }
/*greentheme buttons*/
#wrapperPopAge button.btn_greentheme { background:url(images/btn_green_right.gif) right no-repeat; font-size:1em; font-weight: bold; }
#wrapperPopAge button.btn_greentheme span { height:25px; line-height:25px;background:url(images/btn_green_left.gif) left no-repeat;color:#fff; }

.StandardLoginButton{background:url(images/stanard_login.gif) no-repeat left top;width:103px;height:27px;border:none;font-size:16px;color:#FFF;font-weight: bold;}
.StandardRegisterButton{background:url(images/stanard_login.gif) no-repeat left top;width:103px;height:27px;border:none;font-size:16px;color:#FFF;font-weight: bold;}

#UserReference {margin-top:5px;}
#UserReference .CommandButton input{vertical-align:bottom;}

.HeaderShowYouKnow a {
	display: block;
	background: url(images/show_you_know.gif);
	width: 212px;
	height: 29px;
	margin-top:55px;
	margin-left:5px;
	padding:12px 0 0 0;
	font-size:1.5em;
	color:white;
	text-decoration: none;
	letter-spacing:-.03em;
	text-align:center;
	font-weight: bolder;
	/*border:solid 1px #000;*/
	float:left;
}
.HeaderShowYouKnow A:link,.HeaderShowYouKnow A:visited,.HeaderShowYouKnow A:active{color:#FFF;font-size:14px;font-weight:bold;}
.HeaderShowYouKnow A:hover{text-decoration:none;color:#EEE;}
.btnBlueTheme{background:url(images/blueTheme.gif) no-repeat;width:87px;height:30px;color:#FFF;border:none;font-weight:bold;vertical-align:middle;}


/************************************************ ************************************************/
/* The following are from the UI re-design at January 2009 */
/*************************************************************************************************/
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #345A98;
	background-color: #c4d0e8;
	margin: 0px;
	padding:5px;
}

form, h1, h2, h3, h4, h5, h6 { margin:0px;}
.mtw {
	width: 961px;
	height:100%;
	background-color:#FFFFFF;
	}
#tn1 {
	font-size: 18px;
	color: #FFFFFF;
	text-transform: uppercase;
}
#tn1 a {
	color: #345A98;
	padding:0 10px 0 10px;
	text-decoration:none;
	font-weight:bold;
}
#tn1 a:hover {
	color: #cc0000;
}
#tn1 .select {color: #cc0000;}
.button1 {
	font-size: 16px;
	color: #FFFFFF;
	height: 27px;
	width: 103px;
	border:none;
	background:url(../images/stanard_login.gif) transparent  no-repeat;
	font-weight:bold;
}
.button2 {
	font-size: 12px;
	color: #FFFFFF;
	height: 27px;
	width: 103px;
	border:none;
	background:url(../images/stanard_login.gif) transparent  no-repeat;
	font-weight:bold;
}
.button3 {
	font-size: 12px;
	color: #FFFFFF;
	height: 27px;
	width: 165px;
	border:none;
	background:url(../images/button1.gif) transparent  no-repeat;
	font-weight:bold;
}
.t13 {
	font-family: tahoma;
	font-size: 13px;
}
.csm15 {
	font-family: "comic Sans MS", arial;
	font-size: 15px;
}
.w283 { width:283px; background:#365999;}
.w4 { width:4px;}
.pad_top4px { padding-top:4px;}

#fotter{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	background-color: #fc7500;
	padding: 5px;
}
#fotter a {
	color: #FFFFFF;
	text-decoration:none;
	padding-left:10px;
}
#fotter a:hover {
	color: #000000;

}

#subnav{
	color: #FFFFFF;
	background-color: #f7a539;
	font-size: 14px;
}
#subnav a {
	color: #CC0000;
	text-decoration:none;
	padding:10px;
	}
#subnav a:hover {
	color: #FFFFFF;

}
#subnav .select {
	color: #FFFFFF;
}

.gpbox1{ background:url(../images/gg1.jpg) no-repeat; width:224px; height:215px; padding-top:75px;}
.gpbox2{ background:url(../images/gg2.jpg) no-repeat; width:224px; height:215px; padding-top:75px;}
.gpbox3{ background:url(../images/gg3.jpg) no-repeat; width:224px; height:215px; padding-top:75px;}
.bot_dot{ border-bottom:dotted 1px #1067af;}
h6 {
	font-family: tahoma;
	font-size: 18px;
	font-weight: bold;
	color: #FFFFFF;
}

.t15w{
	font-family: tahoma;
	font-size: 15px;
	font-weight: bold;
	color: #FDEA2B;
}
.t15w a {
	color: #ffffff; text-decoration:none;
}
.t15w a:hover { text-decoration:underline;}

#tabler1 {
	font-size: 15px;
	color: #000000;
}
#tabler1 th  {
	font-size: 12px;
	color: #FFFFFF;
	background-color:#4169e1;
}

.popup1{
	background-image: url(../images/popup.gif);
	height: 278px;
	width: 641px;
}

.table22{
	font-size: 17px;
	color: #000000;
}
.table22 td { border-bottom: solid 1px #d9d9d9;
}
.create_new_quiz {
	background: url(images/create_new_quiz.jpg) no-repeat left top;
	padding-top:40px;
}
.create_find_it_game {
	background:url(images/create_find_it_game.jpg) no-repeat left top;
	padding-top:40px;
}
h1 {
	font-size: 24px;
	font-weight: normal;
}
.text_area {
	border: 1px solid #eca23e;
	background-color: #fff7e5;
}
.gray_text {
	color: #4f4f4f;
}
.a11{
	font-size: 11px;
}

.rate_bg{
	background:url(../images/star_bg.jpg) no-repeat center center;
	height: 88px;
	width: 191px;
}

.slider_rail_age {    
position: relative;    
height: 52px;    
width: 495px;     
background:url(images/slider_custom_rail.PNG) transparent  no-repeat;
}
  
.slider_handle {    
position: absolute;
height: 36px;    
width: 36px;
padding: 0 0 0 6px;
}