﻿body { font-family: Arial; font-size: 12px; color: #141414; }
.header { font-size: 14px; height: 50px; }
#StoryBox { height: 300px; width: 100%; }
#StoryBoxSpacer { clear: both; height: 300px; }
#StoryBoxContents { }
.Box { float: left; border: 1px solid #0c46b9; border-bottom: none; cursor: pointer; font-size: 11px; color: White; text-align: left; }
#Report { float: left; }
.errorText { color: Red; }
textarea { overflow: auto; }
input { font-size: 1em; font-family: Arial; vertical-align: middle; }
input[type="radio"] { margin: 0px 3px 2px 3px; }
input[type="text"] { margin: 0px 0px 2px 2px; }
input[disabled] { color: GrayText !important; }

.link { color: #3366BB; text-decoration: underline; cursor: pointer; }
.link:hover { color: #3366BB; }
.link2 { color: #3366BB; text-decoration: underline; cursor: pointer; font-weight: bold; }
.link2:hover { color: #3366BB; font-weight: bold; }
.external { background: transparent url(../images/external.gif) no-repeat scroll right center; padding-right: 10px; margin-right: 3px; }
.line { border-bottom: 1px solid #C3D9FF; padding: 15px 0 0 0; }
.nowrap { white-space: nowrap; }
.newmessage{padding:4px ; font-size:9px; color:white;width:60px;background: transparent url(../images/newmessage.png) no-repeat center;}

.td_label { font-weight: bold; }
.inputs_settings_modal { border: solid #7f9db9 1px; margin: 5px 5px 5px 10px; }

#ReportIt { width: 500px; }
#ReportIt input[type="text"] { height: 30px; font-size: 16px; width: 400px; border: 2px solid #54575c; margin-top: 5px; }
#ReportIt input[type="submit"] { width: 75px; vertical-align: bottom; margin: 0 0 0 5px; height: 35px; padding: 0 2px 4px 2px; font-size: 15px; }
.storyBoxWrapper { vertical-align: bottom; padding: 0 5px 0 5px; }
.storyBoxTitle { color: #878787; text-align: left; font-size: 15px; padding-bottom: 3px; font-weight: bold; }

#ReportList { overflow: hidden; margin-top: 6px; }
#ReportList ul { list-style-type: none; padding: 0; margin: 0; }

.report_meta { float: left; }
.reportTextItem { clear: both; font-size: 14px; background: white; float: left; width: 500px; margin: 1px; padding: 1px; border-top: 1px dashed #999b9d; }
.reportUsername { cursor: pointer; float: left; font-size: 12px; color: #3399ff; font-weight: bold; padding-right: 5px; text-align: center; }
.reportText { padding-left: 5px; color: #424242; }
.reportPhoto { cursor: pointer; clear: both; float: left; }
.user_report_photo { width: 40px; height: 40px; }
.user_details_photo { border: 1px gray solid; }
.reportTime { color: Gray; clear: both; float: left; font-size: 13px; }

#middleBar { background: #eff3ff; height: 18px; padding: 2px 4px 2px 4px; font-size: 15px; }
#rightMiddleBarTitle { text-align: center; white-space: nowrap; }

.newsItem { background: #f3f6fa; padding: 3px; margin: 2px; font-size: 12px; width: 100%; }
.newsDate { color: Gray; }
#user_bar { border-radius: 5px; background: #eff3ff; padding: 8px; border: 1px solid #d5defb; }
#user_bar td { padding: 0 5px 0 5px; white-space:nowrap; }
#pages_placeholder { display: none; clear: both; background: #eff3ff; border: 1px solid #d5defb; border-bottom: none; }
.user_bar_item { color: #3399ff; font-weight: bold; cursor: pointer; white-space: nowrap; }
.user_sep { border-right: gray solid 1px; width: 1px; white-space: nowrap; }

#user_photo_wrap { width: 104px; height: 104px; border: solid 2px #C3D9FF; }
#user_photo_wrap:hover { border: solid 2px blue; cursor: pointer; }
#user_photo { background: url(../images/add_picture.png) no-repeat; }
#submit_photo_hack { visibility: hidden; width: 0px; }
#photo_preview_edit { width: 210px; height: 180px; padding-right: 30px; }
#attach_photo_modal { padding: 10px; }
#ifrPhoto { text-align: center; vertical-align: middle; border-style: none; margin: 0px; width: 100%; height: 20px; }
.profile_update input[type="text"], input[type="password"] { width: 150px; }

#data_placeholder { display: none; clear: both; background: white; border: 1px solid #d5defb; vertical-align: top; margin-top: 5px; }
.data_title { font-size: 14px; font-weight: bold; padding: 0 0 6px 6px; }
#data_placeholder ul { list-style-type: none; padding: 0; margin: 0; }
.data_links_menu { padding: 2px; vertical-align: top; }
.data_links_menu li { background: #eeeeee; color: #005cb8; white-space: nowrap; cursor: pointer; margin: 3px; padding: 4px 7px 4px 7px; }
.data_links_menu_selected { background: #878581 !important; cursor: default !important; font-weight: bold; color: white !important; }
.detailed_newsbox { vertical-align: top; }
.detailed_newsbox a { padding-right: 5px; }
.detailed_newsbox .j font { padding: 0px; margin: 0px; font-size: -1px !important; }
.detailed_newsbox .lh { font-size: 14px; font-family: Arial; }

#loaderMain { display: none; }
.userBarLoader { background: url(../images/loader.gif) no-repeat; width: 30px; display: none; }
.userMessageLoader { background: url(../images/loader.gif) no-repeat; width: 30px; display: none; }
#user_details_data {  width: 100%; }
.user_details_label { padding: 15px;font-weight: bold; white-space: nowrap; vertical-align: top; }
.google_image { margin: 5px; border: 1px solid gray; cursor: pointer; }
.google_image_full { max-height: 400px; max-width: 600px; }

/**
 * MODAL CONTAINER STYLES
 */
#popupMask { position: absolute; z-index: 200; top: 0px; left: 0px; height: 100%; opacity: .4; filter: alpha(opacity=40); /* this hack is so it works in IE 	 * I find setting the color in the css gives me more flexibility  	 * than the PNG solution. 	 */ /*background-color:transparent !important;*/ background-color: #333333; /* this hack is for opera support 	 * you can uncomment the background-image if you don't care about opera. 	 * this gives you the flexibility to use any bg color that you want, instead of the png 	 */ /*background-image: url("../images/maskBG.png") !important; /* For browsers Moz, Opera, etc.*/ background-image: none; background-repeat: repeat; display: none; }
#popborder { border: 1px solid #757575; }
#popupContainer { position: absolute; z-index: 203; top: 0px; left: 0px; display: none; padding: 0px; }
#popupInner { border: 3px solid #C3D9FF; background-color: white; }
#popupFrame { margin: 0px; height: 100%; position: relative; z-index: 202; vertical-align: top; }
#popupTitleBar { border: 2px solid white; background-color: #E0ECFF; color: #ffffff; font-weight: bold; height: 15px; padding: 5px; position: relative; z-index: 203; }
#ModalTitle { color: Black; width: 100%; }
#popupControls { float: right; cursor: pointer; }
#calendartable td { padding: 2px; }
#delete_confirmation_modal { color: #cc0000; }

/**
 * JCROP STYLES
 */

/* Fixes issue here http://code.google.com/p/jcrop/issues/detail?id=1 */
.jcrop-holder { text-align: left; }

.jcrop-vline, .jcrop-hline { font-size: 0; position: absolute; background: white url('Jcrop.gif') top left repeat; /* 	opacity: .5; 	*filter:alpha(opacity=50); 	*/ }
.jcrop-vline { height: 100%; width: 1px !important; }
.jcrop-hline { width: 100%; height: 1px !important; }
.jcrop-handle { font-size: 1px; width: 7px !important; height: 7px !important; border: 1px #eee solid; background-color: #333; *width:9px;
*height:9px;
}

.jcrop-tracker { *background-color:gray;
width:100%;height:100%;
}

.custom .jcrop-vline, .custom .jcrop-hline { background: yellow; }
.custom .jcrop-handle { border-color: black; background-color: #C7BB00; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
