/****** UI CSS ******/
h1, h2 { margin-left: 15px; }
h1 { font-size: 24px; line-height: 30px; }
h2 { font-size: 14px; line-height: 20px; }

/****** COMMON STYLES ******/
.uiVisible { display: block !important; }
.uiVisibleInline { display: inline-block !important; }
.uiHidden { display: none; }

/****** FORM ******/
/* width: 760px;*/
.uiForm { background: #F2F2F2; border: 1px solid #CCC; font-family: "Lucida Grande", "Tahoma", "Sans-Serif"; font-size: 11px; margin: 10px; padding: 35px; }
.uiForm td { padding-bottom: 15px; }
.uiForm .dataRow {}
.uiForm .label { color: #555; font-weight: bold; padding-top: 3px; text-align: left; width: 140px; vertical-align: top;}
.uiForm .data {}
.uiForm .submit { padding-top: 15px;}

/****** SHARED TEXT INPUT STYLES ******/
.uiTextInputPlaceholder { color: #777;}
.uiTable { margin-bottom: 1em; }
.uiTable th, .uiTable td { text-align: left; vertical-align: baseline; }

/****** TEXT BOX ******/
.uiTextbox {
 border: 1px solid #bdc7d8;
 font-family: "Lucida Grande", "Tahoma", "Sans-Serif";
 font-size: 11px;
 padding: 4px 3px 3px 3px;
 vertical-align: baseline;
}

/****** TEXT AREA ******/
.uiTextarea {
 border: 1px solid #bdc7d8;
 font-family: "Lucida Grande", "Tahoma", "Sans-Serif";
 font-size: 11px;
 padding: 3px 3px 3px 3px;
 vertical-align: baseline;
}


/****** CHECKBOX ******/
.uiCheckbox {
 color: #555;
 cursor: pointer;
 font-family: "Lucida Grande", "Tahoma", "Sans-Serif";
 font-size: 11px;
 font-weight: bold;
 vertical-align: middle;
}

label.uiCheckbox {
 padding: 0 5px;
 vertical-align: middle;
}

/****** RADIO BUTTON ******/
.uiRadio {
 color: #555;
 cursor: pointer;
 font-family: "Lucida Grande", "Tahoma", "Sans-Serif";
 font-size: 11px;
 font-weight: bold;
 vertical-align: middle;
}

label.uiRadio {
 padding: 0 6px;
 vertical-align: middle;
}


/****** SHARED BUTTON STYLES ******/
.uiButton {
 background: url('button.png');
 background-repeat: no-repeat;
 box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 0px 0px;
 cursor: pointer;
 display: inline-block;
 font-family: "Lucida Grande", "Tahoma", "Sans-Serif";
 text-decoration: none;
}

.uiButton:hover { text-decoration: none;}

.uiButtonLarge {
 font-size: 13px !important;
 font-weight: bold !important;
 line-height: 13px !important;
 padding: 5px 7px 6px 6px !important;
}

/****** SUBMIT BUTTON (BLUE) ******/
.uiButtonSubmit {
 background-position:0px -48px;
 border: solid 1px #1a356e;
 color: #FFF !important;
 font-size: 13px;
 font-weight: bold;
 line-height: 13px;
 padding: 5px 7px 6px 6px;
}

.uiButtonSubmit:active { background-position:0px -71px;}

.uiButtonGreen {
 background-position:0px -96px;
 border: solid 1px #1a356e;
 color: #FFF;
 font-size: 13px;
 font-weight: bold;
 line-height: 13px;
 padding: 5px 7px 6px 6px;
}


/****** LOGIN BUTTON (BLUE) ******/
.uiButtonLogin {
 background-position:0px -385px;
 border: solid 1px #1a356e;
 color: #FFF;
 display: none;
 font-size: 11px;
 font-weight: bold;
 line-height: 11px;
 padding: 4px 7px 5px 27px;
}

.uiButtonLogin:active { background-position:0px -408px;}
.uiButtonLoggedIn { display: none;}


/****** NORMAL BUTTON (GRAY) ******/
.uiButtonNormal {
 background-position:0px 0px;
 border: solid 1px #888;
 color: #333 !important;
 font-size: 11px;
 font-weight: bold;
 line-height: 11px;
 padding: 4px 7px 5px 7px;
}

.uiButtonNormal:active { background-position:0px -24px;}
.uiButtonNormalImage { margin-left: -1px; padding-right: 3px;}

.uiButtonText, .uiButton input {
    background: none repeat scroll 0 0 transparent;
    border: 0 none;
    color: #333333;
    cursor: pointer;
    display: inline-block;
    font-family: 'Lucida Grande',Tahoma,Verdana,Arial,sans-serif;
    font-size: 11px;
    font-weight: bold;
    margin: 0;
    outline: medium none;
    padding: 1px 0 2px;
    white-space: nowrap;
}


/****** DROPDOWN SELECT ******/
/* Note this element has a js component */

.uiSelectHTML { display: none;}
.uiSelectContainer { position: relative;}

.uiButtonSelect {
 background-position:right -144px;
 border: solid 1px #888;
 color: #333;
 font-size: 11px;
 font-weight: bold;
 line-height: 11px;
 padding: 4px 23px 5px 7px;
}

.uiButtonSelect:active {
 background-color: #ddd;
 background-position:right -241px;
}

.uiButtonSelectPressed {
 color: #FFF;
 background-color: #5872a7;
 border-color: #1a356e;
 background-position:right -337px;
}

.uiButtonSelectPressed:active {
 color: #FFF !important;
 background-color: #5872a7 !important;
 background-position:right -337px !important;
}

.uiSelectContainer .dropdownContainer { 
 background: #FFF;
 border: 1px solid #777;
 border-bottom: 2px solid #1a356e;
 display: none;
 font-size: 11px;
 font-weight: normal;
 padding: 4px 0;
 width: 250px;
 min-height: 250px;
 position: absolute;
 top: 21px;
}

.uiSelectContainer .divider {
 border-bottom: 1px solid #ddd;
 height: 1px;
 font-size: 1px;
 line-height: 1px;
 margin: 4px 10px 4px 10px;
 padding: 0;
 width: 230px;
}

.uiSelectContainer .row:hover {
 background-color: #6d84b4;
 color: #FFF;
 border-top: 1px solid #3b5998;
 border-bottom: 1px solid #3b5998;
}

.uiSelectContainer .row {
 background-color: #FFF;
 border-top: 1px solid #FFF;
 border-bottom: 1px solid #FFF;
 color: #000;
 cursor: pointer;
 padding: 3px 20px 4px 20px;
}

.uiSelectContainer .selected {
 background-image: url('checkmark.png');
 background-repeat: no-repeat;
 background-position:0px 5px;
 font-weight: bold;
}

.uiSelectContainer .selected:hover {
 background-image: url('checkmark.png') !important;
 background-position:0px -11px;
 background-repeat: no-repeat;
}


/****** LIGHTBOX ******/
.uiLightbox {
 background-color: rgba(82, 82, 82, 0.7);
 border-bottom-left-radius: 8px;
 border-bottom-right-radius: 8px;
 border-top-left-radius: 8px;
 border-top-right-radius: 8px;
 color: #444;
 display: none;
 font-family: "Lucida Grande", "Tahoma", "Sans-Serif";
 left: 50%;
 margin-left: -250px;
 position: absolute;
 top: 70%;
 width: 518px;
 z-index: 100;
 font-size:11px;
}

.uiLightbox .contentContainer {
 background: #FFFFFF;
 border: 1px solid #1a356e;
 margin: 8px;
 min-height: 50px;
 width: auto;
}
/* width: 600px; */


.uiLightbox .contentContainer h2.title {
 -moz-border-bottom-colors: none;
 -moz-border-image: none;
 -moz-border-left-colors: none;
 -moz-border-right-colors: none;
 -moz-border-top-colors: none;
 background: none repeat scroll 0 0 #6D84B4;
 border-color: #3B5998 #3B5998;
 border-style: solid solid none;
 border-width: 1px 1px medium;
 color: #FFFFFF;
 font-size: 14px;
 font-weight: bold;
 margin: 0;
	padding: 5px 10px;
}
/*  border-color: #3B5998 #3B5998 -moz-use-text-color; */

.uiLightbox .contentContainer .body {
 border-bottom: 1px solid #CCCCCC;
 padding: 10px;
}

.uiLightbox .contentContainer .buttons {
 background: none repeat scroll 0 0 #F2F2F2;
 padding: 8px 10px;
 position: relative;
 text-align: right;
}

.uiLightbox .contentLoading { 
 font-size: 28px;
 padding: 10px;
}

.uiLightboxHTML {
}

.uiLightboxLoading {
 background: url('loading_ui.gif');
 width:16px;
 height:16px;
 border: 0;
 float: right;
 margin: 7px;
 vertical-align: middle;
}

.uiLightbox.narrow {
 margin-left: -240px;
 width: 478px;
}

.uiLightbox .contentContainer.narrow {
 width: 460px;
}

.uiLightboxBackdrop {
 background-color: #000;
 bottom: 0;
 display: none;
 filter: alpha(opacity=50);
 left: 0;
 opacity: 0.5;
 position: absolute;
 right: 0;
 top: 0;
 z-index: 99;
}

.uiButtonLarge + .uiButtonLarge {
 margin-left: 4px;
 margin-right: 4px;
}

/* fb lightbox */
.pop_content .dialog_content {
 -moz-border-bottom-colors: none;
 -moz-border-image: none;
 -moz-border-left-colors: none;
 -moz-border-right-colors: none;
 -moz-border-top-colors: none;
 background: none repeat scroll 0 0 #FFFFFF;
 border-color: #555555;
 border-right: 1px solid #555555;
 border-style: solid;
 border-width: 0 1px 1px;
}

.hidden_elem {
 display: none !important;
}

.uiList {
 list-style-type: none;
 margin: 0;
 padding: 0;
}

.uiList li { margin-bottom: 5px; }

.pop_content .dialog_body {
 border-bottom: 1px solid #CCCCCC;
 padding: 10px;
}

.pop_content .dialog_buttons_msg {
 float: left;
 line-height: 17px;
 padding-top: 4px;
}

.pop_content .dialog_buttons {
 background: none repeat scroll 0 0 #F2F2F2;
 padding: 8px 10px;
 position: relative;
 text-align: right;
}

.uiButtonLarge, .uiButtonLarge .uiButtonText, .uiButtonLarge input {
 font-size: 13px;
}

.uiButtonConfirm {
 background-color: #5B74A8;
 border-color: #29447E #29447E #1A356E;
	background-image:none;
}

.uiButtonConfirm input {
 color: #FFFFFF;
}

.uiButtonLarge {
 line-height: 16px;
}

.uiButton + .uiButton { margin-left: 4px; }

#report_form .reportReasonList .reasonType {
 margin: 0 6px 3px 0;
 vertical-align: middle;
}

.inputText {
 border: 1px solid #BDC7D8;
 font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
 font-size: 11px;
 margin: 0;
 padding: 3px;
}

.uiBoxYellow { background-color: #FFF9D7; border: 1px solid #E2C822; }
.uiBoxWhite { background-color: #FFFFFF; border: 1px solid #CCCCCC; }
.uiBoxRed { background-color: #FFEBE8; border: 1px solid #DD3C10; }

#report-options label { cursor:pointer; }

/* general rule */
.pas{padding:5px} .pam{padding:10px} .pal{padding:20px}
.pts{padding-top:5px} .ptm{padding-top:10px} .ptl{padding-top:20px}
.prs{padding-right:5px} .prm{padding-right:10px} .prl{padding-right:20px}
.pbs{padding-bottom:5px} .pbm{padding-bottom:10px} .pbl{padding-bottom:20px}
.pls{padding-left:5px} .plm{padding-left:10px} .pll{padding-left:20px}
.mas{margin:5px} .mam{margin:10px} .mal{margin:20px}
.mts{margin-top:5px} .mtm{margin-top:10px} .mtl{margin-top:20px}
.mrs{margin-right:5px} .mrm{margin-right:10px} .mrl{margin-right:20px}
.mbs{margin-bottom:5px} .mbm{margin-bottom:10px} .mbl{margin-bottom:20px}
.mls{margin-left:5px} .mlm{margin-left:10px} .mll{margin-left:20px}

.noborder { border: medium none !important; }
.floatL{float:left}
.floatR{float:right}
.clear-after { clear: both; height: 0; }

.txtCenter { text-align: center; }

.fcGray{color:gray !important;}
.fcRed {color:#F00 !important;}
.fcGreen {color:#0F0 !important;}

.uiInfoTable th { font-weight:bold; padding: 5px 0; }