﻿/***
 * Created by: Mienard Lumaad
 * Date: May 15, 2012
 * Website: http://themepixels.com/
***/

@import url('../fonts/roboto.css');
@import url('plugins/jquery.alerts.css');
@import url('plugins/uniform.tp.css');
@import url('plugins/jquery.ui.css');
@import url('plugins/jquery.ui.autocomplete.css');
@import url('plugins/fullcalendar.css');
@import url('plugins/colorbox.css');
@import url('plugins/colorpicker.css');
@import url('plugins/jquery.jgrowl.css');
@import url('plugins/jquery.tagsinput.css');
@import url('plugins/ui.spinner.css');


/***** 1. RESET STYLE *****/
/******************************/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font,  ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
 form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;
	
}

body { font-size: 12px;  font-family: Arial,Helvetica,sans-serif; color:black; line-height: 21px; 
 }
input, select, textarea, button { font-size: 12px; font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; outline: none; margin: 0; }
a { text-decoration: none; color: #666; outline: none; }
button { outline: none; }
a img { border: 0; }
h1,h2,h3,h4,h5, span.h3 { font-family: 'RobotoBoldCondensed', Arial, Helvetica, sans-serif; font-weight: normal; }
small { font-size: 11px; }
h1 { font-size: 32px; }
h2 { font-size: 28px; }
h3 { font-size: 24px; }
h4 { font-size: 16px; margin: 0px 5px; }
h5 { font-size: 14px; }

span.h3 { font-size: 24px; display: block; }

body.withvernav { background: #fff url(../images/line.ccc.png) repeat-y 195px 0; } /* with left menu*/
body.withmenucoll { background-position: 55px 0; } /* with menu style 1 in collapsed mode */
body.withmenucoll2 { background-position: 35px 0; } /* with menu style 2 in collapsed mode */

 
 

/***** 4. LOGIN PAGE *****/
/*************************/

.loginpage { background: #0a78c3 url(../images/patternbg.png); }
.loginbox { 
	width: 355px; padding: 5px; background: #fff; margin: 7% auto auto auto; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px; -moz-box-shadow: 0 0 2px rgba(0,0,0,0.3); -webkit-box-shadow: 0 0 2px rgba(0,0,0,0.3); 
	box-shadow: 0 0 2px rgba(0,0,0,0.3);
}
.loginboxinner { 
	padding: 10px; background: #d4145c url(../images/patternbg.png); -moz-border-radius: 0 2px 2px 0; 
	-webkit-border-radius: 0 0 2px 2px; border-radius: 0 0 2px 2px;
}
.loginbox .logo { text-align: center; }
.loginbox .logo h1 { 
	font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-size: 32px; color: #000000; border-bottom: 1px solid #56647d; 
	line-height: normal; margin-bottom: 5px;
}
.loginbox .logo h1 span { color: #000000; }
.loginbox .logo p { font-weight: bold; color: #eee; font-style: italic; }

.loginbox form { display: block; margin-top: 20px; border:none; }
.loginbox .username { 
	background: #eee url(../images/icons/username.png) no-repeat 13px center; -moz-border-radius: 2px; -webkit-border-radius: 2px; 
	border-radius: 2px; -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.4); -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.4); 
	box-shadow: 0 1px 2px rgba(0,0,0,0.4); margin: 20px 0; overflow: hidden;
}
.loginbox .usernameinner { margin-left: 45px; border-left: 1px solid #ddd; background: #fff; }
.loginbox .username input { 
	padding: 8px 10px; border: 0; font-size: 14px; width: 325px; box-shadow: none; color: #666; 
	font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif;
}
.loginbox .password { 
	background: #eee url(../images/icons/password.png) no-repeat 13px center; -moz-border-radius: 2px; -webkit-border-radius: 2px; 
	border-radius: 2px; -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.4); -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.4); 
	box-shadow: 0 1px 2px rgba(0,0,0,0.4); margin: 20px 0; overflow: hidden;
}
.loginbox .passwordinner { margin-left: 45px; border-left: 1px solid #ddd; background: #fff; }
.loginbox .password input { 
	padding: 8px 10px; border: 0; font-size: 14px; width: 325px; box-shadow: none; color: #666; 
	font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif;
}

.loginbox button { 
	background: #f0801d url(../images/btngrad.png) repeat-x top left; border: 0; padding: 10px 0; text-align: center; 
	font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-size: 14px; font-weight: normal; text-transform: uppercase;  
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.4); 
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.4); box-shadow: 0 1px 2px rgba(0,0,0,0.4);
}
.loginbox button:hover { background-color: #f0721e; }
.loginbox .keep { margin-top: 20px; font-weight: bold; color: #FFFFFF; font-size: 11px; }
.loginbox .loginmsg { 
	background: #fffccc; color: #333; margin-bottom: 10px; padding: 5px; text-align: center; font-size: 11px; 
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
}
.loginf { 
	padding: 10px; background: #2e3e59; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; 
	-moz-box-shadow: inset 0 1px 1px #23324b; -webkit-box-shadow: inset 0 1px 1px #23324b; box-shadow: inset 0 1px 1px #23324b;
	border-bottom: 1px solid #475875;
}

.loginpage .nousername, .loginpage .nopassword { display: none; }
.loginpage .nopassword { color: #fff; }
.loginpage .nopassword .thumb { 
	padding: 5px; background: #fff; display: inline-block; vertical-align: top; 
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
}
.loginpage .nopassword .userlogged { display: inline-block; margin-left: 10px; font-weight: bold; }
.loginpage .nopassword .userlogged h4 { font-size: 14px; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; }
.loginpage .nopassword .userlogged a { color: #f0801d; font-style: italic; }
.loginpage .nopassword .userlogged a:hover { text-decoration: underline; }
.loginpage .notibar { border: 0; }


/***** 6. USER INFORMATION DROP STYLES *****/
/*******************************************/


.userinfo { 
	padding: 6px 18px 6px 6px; background: #32415a url(../images/default/userinfoarrow.png) no-repeat right center; -moz-border-radius: 2px; 
	-webkit-border-radius: 2px; border-radius: 2px; -moz-box-shadow: inset 1px 1px 2px #2b384e; float: left; border-bottom: 1px solid #445775;
	-webkit-box-shadow: inset 1px 1px 2px #2b384e; box-shadow: inset 1px 1px 2px #2b384e; cursor: pointer;
}
.userinfo:hover { background-color: #2d3b53; }
.userinfo img { border: 1px solid #b9c1ce; vertical-align: middle; }
.userinfo span { color: #b9c2cf; display: inline-block; padding: 0 5px; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; }

/***** 5. TOP HEADER STYLES *****/
/********************************/



.topheader { background: #34445e url(../images/default/topheaderbg.png); padding: 8px 10px; position: relative; border-bottom: 1px solid #303f59; }
.topheader .left h1.logo { 
	font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-weight: normal; color: #fb9337;
	float: left; font-size: 30px; margin: 10px 0;
}.topheader .left h1.logo a { color: #fb9337; }
.topheader .left h1.logo span { color: #fff; }
.topheader .left .slogan { 
	font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; float: left; padding: 8px 10px; 
	border-left: 1px solid #606d84; color: #6a778d; font-style: italic; margin: 2px 10px; 
}
 

.topheader .right { position: absolute; top: 10px; right: 10px; }


/***** 7. HEADER STYLES *****/
/****************************/

.header { 
	background: #485b79 url(../images/default/headerbg.png); min-height: 50px; overflow: hidden; border-bottom: 5px solid #fb9337; 
	-moz-box-shadow: inset 0 1px 0 #50627f; -webkit-box-shadow: inset 0 1px 0 #50627f; box-shadow: inset 0 1px 0 #50627f;
	position: relative;
}
.headermenu { overflow: hidden; list-style: none; border-right: 1px solid #576a85; display: inline-block; }
.headermenu li { float: left; display: inline-block; border-left: 1px solid #576a85; border-right: 1px solid #394962; }
.headermenu li:first-child { border-left: 0; }
.headermenu li a { 
	display: block; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; color: #fff; text-transform: uppercase; 
	padding: 17px 10px;
}
.headermenu li a { min-width: 80px; text-align: center; }
.headermenu li a span { opacity: 0.5; }
.headermenu li a span.icon { height: 30px; display: block; margin-bottom: 10px; }

.headermenu li a span.icon-flatscreen { background: url(../images/icons/flatscreen.white.png) no-repeat center center; }
.headermenu li a span.icon-pencil { background: url(../images/icons/pencil.white.png) no-repeat center center; }
.headermenu li a span.icon-speech { background: url(../images/icons/speech.white.png) no-repeat center center; }
.headermenu li a span.icon-message { background: url(../images/icons/message.white.png) no-repeat center center; }
.headermenu li a span.icon-chart { background: url(../images/icons/chart.white.png) no-repeat center center; }
.headermenu li a span.icon-wallet { background: url(../images/icons/wallet.white.png) no-repeat center center; }
.headermenu li a span.icon-hr { background: url(../images/icons/hr.white.png) no-repeat center center; }
.headermenu li a span.icon-admin { background: url(../images/icons/admin.white.png) no-repeat center center; }

.headermenu li a:hover { 
	background: url(../images/default/bghover.png) no-repeat center bottom; -moz-box-shadow: inset 0 1px 0 #4f627e; 
	-webkit-box-shadow: inset 0 1px 0 #4f627e; box-shadow: inset 0 1px 0 #4f627e;
}

.headermenu li.current { border-left: 0; border-right: 1px solid #394962;  }
.headermenu li.current a { 
	background: url(../images/default/arrow-active.png) no-repeat center bottom; -moz-box-shadow: inset 0 1px 0 #4f627e; 
	-webkit-box-shadow: inset 0 1px 0 #4f627e; box-shadow: inset 0 1px 0 #4f627e; }
.headermenu li.current a span { opacity: 1; } 

 
/***** 10. VERTICAL NAVIGATION STYLES *****/
/******************************************/


.vernav2 { width: 230px; position: absolute; left: 0; top: 159px; }

  
/***** 11. CENTER CONTENT STYLES *****/
/*************************************/


.centercontent { margin-left: 198px; position: relative;
            
}
.centercontent .pagetitle { margin: 0 20px 10px 20px; }
.centercontent .pagedesc { margin: 0 20px; }
.centercontent .hornav { padding: 0 20px; }

.withmenucoll .centercontent { margin-left: 56px; }
.withmenucoll2 .centercontent { margin-left: 36px; }

 

/***** 20. STANDARD FORM STYLES *****/
/************************************/
form {
    
     border: solid 2px #999;
     color: black;
     /*background: url(pattern_grey.jpg);*/
     
     font-family: Arial,Helvetica,sans-serif;
     font-size: 12px;
     
}
form input[type=text],textarea {
    border: 1px solid #999999;
    float: left;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 12px;
    margin: 3px 5px 0 0;
    padding: 2px;
    
    }

form input[type=radio], .stdform input[type=checkbox] { width: auto; margin: 0; vertical-align: middle; }
form input[type=submit] { 
	margin: 0; font-weight: bold; color: #eee; background: #FB9337; border: 1px solid #F0882C; padding: 5px 5px; 
	-moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; cursor: pointer; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px;
}
form input[type=submit]:hover { background: #485B79; border: 1px solid #3f526f; }

form input[type=reset] {
	width: auto; margin: 0; font-weight: bold; color: #666; border: 1px solid #ccc; background: #eee; padding: 7px 10px;	
	-moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; margin-left: 5px; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px;
}
 

    form td {
           font-family: Arial,Helvetica,sans-serif;
    font-size: 12px; 
    }

form button { border: 1px solid #f0882c; background: #fb9337; color: #fff; cursor: pointer; padding: 7px 10px; font-weight: bold; }
form button.submit:hover { background: #485B79; border: 1px solid #3f526f; color: #fff; }
form button.submit:hover { background: #485B79; border: 1px solid #3f526f; color: #fff; }
form button:active { 
	-moz-box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.3); -webkit-box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.3); 
	box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.3);
}

form input.smallinput, form textarea.smallinput { width: 40%; }
form input.mediuminput, form textarea.mediuminput { width: 60%; }
form input.longinput, form textarea.longinput { width: 85%; }
form input.error { border: 1px solid #f00; }
form textarea.error { border: 1px solid #f00; }
form textarea.error { border: 1px solid #f00; }
form select.error { border: 1px solid #f00; }
form label.error { float: none; color: #f00; font-size: 11px; display: block; text-align: left; font-weight: bold; }
 
/***** 26. BREADCRUMBS STYLE *****/
/*********************************/


.breadcrumbs { 
	display: block; list-style: none; border: 1px solid #ccc; background: url(../images/titlebg.png) repeat-x top left; 
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
}
.breadcrumbs li { display: inline-block; background: url(../images/separator.png) no-repeat right center; margin-right: 5px; font-size: 11px; }
.breadcrumbs li:last-child { background: none; color: #333; }
.breadcrumbs li a { display: block; padding: 5px 20px 5px 5px; }
.breadcrumbs li:first-child a { padding-left: 10px; }

.breadcrumbs2 { background: none; }


  
fieldset {border-top:1px solid #ccc;
  border-left:0;
  border-bottom:0;
  border-right:0;
  padding:1px;
  margin:0px 30px 0px 0px; }

legend {
  text-align:left;
  color:#FB9337;
  font-size:12px;
  padding:0px 2px 0px 2px;
  margin-left:20px;
  }
/*Gridview*/
.mGrid { width: 100%; background-color: #fff; margin: 5px 0 10px 0; border: solid 1px #525252; border-collapse:collapse; }
    .mGrid td {font: 12px Tahoma; padding: 2px; border: solid 1px #c1c1c1; color: #717171; }
    .mGrid th {font: 11px Tahoma; font-weight:bold; padding: 4px 2px; color: #fff; background: #424242 url(grd_head.png) repeat-x top; border-left: solid 1px #525252; }
.mGrid .alt { background: #fcfcfc url(grd_alt.png) repeat-x top; }
.mGrid .pgr {background: #424242 url(grd_pgr.png) repeat-x top; }
    .mGrid .pgr table { margin: 5px 0; }
    .mGrid .pgr td { border-width: 0; padding: 0 6px; border-left: solid 1px #666; font-weight: bold; color: #fff; line-height: 12px; }   
    .mGrid .pgr a { color: #666; text-decoration: none; }
    .mGrid .pgr a:hover { color: #000; text-decoration: none; }

.urbangreymenu{
width: 190px; /*width of menu*/
margin-left:2px;
display: block;
background: #3D4E68;
color: white;
	/*Some cool shadow and glow effect*/


}

 .urbangreymenu img{
	margin: 0 5px -12px -3px;
	position: relative;
	top:-2px;

 }

.urbangreymenu .headerbar{
font-size: 12px;
line-height: 26px;
padding: 0 10px;
cursor: pointer;
/*fallback for browsers not supporting gradients*/
background: #485b79 url(../images/default/headerbg.png);
padding-bottom: 2px;	 
border-bottom: 1px solid white;
}



.urbangreymenu .headerbar a{
text-decoration: none;
color: white;
display: block;
display: block;
 
	
}

.urbangreymenu ul{
list-style-type: none;
margin: 0;
padding: 0;
margin-bottom: 0; /*bottom spacing between each UL and rest of content*/

}

.urbangreymenu ul li{
padding-bottom: 1px; /*bottom spacing between menu items*/
}

.urbangreymenu ul li a{
font: normal 11px Arial;
color: black;
background: #E9E9E9;
display: block;
padding: 5px 0;
line-height: 15px;
padding-left: 8px; /*link text is indented 8px*/
text-decoration: none;
}

.urbangreymenu ul li a:visited{
color: black;
 
}

.urbangreymenu ul li a:hover{ /*hover state CSS*/
color: white;
background: #000000;
	border-left: 5px solid #FB9A44;
}
    .urbangreymenu span.documents { background: url(../images/default/arrow-active.png) no-repeat 6px center;
    }
