/* Gerneral purpose */
HTML {margin: 0; padding: 0;}

BODY { font-family: "Open Sans", "sans-serif"; font-size: 14px; color: #393939; margin: 0; padding: 0; text-align: center; line-height: 18px}

.huge {font-size: 24px;}
.big {font-size: 18px;}
.medium-big {font-size: 16px;}
.medium {font-size: 14px;}
.small {font-size: 10px; font-weight: 400}

.bold {font-weight: 700}
.semibold {font-weight: 600}

.white { color: #EFEFEF }

A:link {color: #393939; text-decoration: underline; }
A:visited {color: #393939; text-decoration: underline; }
A:hover {color: #393939; text-decoration: none;}

A.tools:link {color: #393939; text-decoration: none; }
A.tools:visited {color: #393939; text-decoration: none; }
A.tools:hover {color: #393939; text-decoration: underline;}

A.white:link {color: #EFEFEF; text-decoration: underline; }
A.white:visited {color: #EFEFEF; text-decoration: underline; }
A.white:hover {color: #EFEFEF; text-decoration: none;}

IMG {border: 0}

SELECT, OPTION
{
  cursor: pointer;
  z-index: 10;
}

.hidden {
  display: none;
}

/* Menu Bar */

.mainbar {
  position: relative;
  text-align: left;
  height: 40px;
  color: #EFEFEF;
  margin: 0px;
  padding: 15px 15px 0px 15px;
  box-shadow: 0px 0px 3px #555555;
}

.menubg {
  display: none;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: #000000;
  opacity: 0.4;
  z-index: 999;
}

.menu {
  position: fixed;
  top: 0;
  right: 0;
  margin-right: -241px;
  width: 240px;
  height: 100%;
  background-color: #EBEBEB;
  border-left: 1px solid #CBCBCB;
  z-index: 1000;
  color: #393939;
}

.pointer {
  cursor: pointer;
}

DIV.tools:hover {
  margin: 9px;
  border-radius: 3px;
  border-color: #CBCBCB !important;
  cursor: pointer;
  text-decoration: underline;
  background-color: #DDDDDD;
}

DIV.tools_home:hover {
  margin: 9px;
  border-radius: 3px;
  border-color: #CBCBCB !important;
  cursor: pointer;
  text-decoration: underline;
  background-color: #EBEBEB;
}

/* For jQuery purpose */

.editable
{
  border: 1px solid #CBCBCB; 
}

DIV.editable:hover 
{
  border-color: #AAAAAA !important;
}

/* Buttons */

.btn_big 
{
  width: 32px;
  height: 32px;
  border-radius: 3px;
  border: 1px solid #CBCBCB;
  cursor: pointer;
}

.btn_big img 
{
  margin: 3px;
}

.btn_big:hover 
{
  border-color: #AAAAAA !important;
}

.btn_small 
{
  width: 24px;
  height: 24px;
  border-radius: 3px;
  border: 1px solid #CBCBCB;
  cursor: pointer;
}

.btn_small img 
{
  margin: 2px;
}

.btn_small:hover 
{
  border-color: #AAAAAA !important;
}

div.btn_highlight
{
  box-shadow: inset 0 0 30px rgba(0,0,0,0.2);
}

/* Webforms */

.webform label{
  display: block;
  font-weight: bold;
  text-align: right;
  width: 130px;
  float: left;
}
.webform .label_small{
  display: block;
  font-size: 11px;
  font-weight: normal;
  text-align: right;
  width: 130px;
}
.webform input, textarea, select 
{
  float: left;
  font-size: 14px;
  padding: 4px 2px;
  border: solid 1px #CFCFCF;
  margin: 2px 0 20px 10px;
}

.webform input[type=checkbox] 
{
  border: none;
  padding: 0px;
  cursor:pointer;
}

.webform input[type=radio] 
{
  border: none;
  padding: 0px;
  cursor:pointer;
}

.webform input.invalid, select.invalid{
  border: 2px solid #CC0000;
}

/* Tabs */

.tabs 
{
  width: 100%;
  display: inline-block;
}

.tab_links_content 
{
  position: relative;
  width: 100%;
  height: 40px;
  left: 5px;
  border-bottom: 1px solid #CBCBCB;
}

/* Clearfix */
.tab_links:after 
{
  display: block;
  clear: both;
  content: '';
}
 
.tab_links li 
{
  margin: 0px 5px;
  float: left;
  list-style: none;
}
 
.tab_links a 
{
  position: relative;
  top: 1px;
  display: inline-block;
  padding: 10px;
  border-radius: 3px 3px 0px 0px;
  border: 1px solid #CBCBCB;
  font-size: 18px;
  font-weight: 700;
  text-decoration: none;
  transition:all linear 0.15s;
}
 
.tab_links a:hover 
{
  text-decoration: none;
}
 
li.active a, li.active a:hover 
{
  border-bottom: 1px solid #FFFFFF;
}
 
.tab_content 
{
}
 
.tab 
{
  padding-top: 10px;
  display: none;
}
 
.tab.active 
{
  display: block;
}

/*
* List table rows/columns
*/

DIV.row-list-wrapper
{
  clear: both; 
  width: 890px; 
  margin-top: 10px; 
  padding: 0px 5px 0px 5px; 
  display: table;
}

DIV.row-list
{
  clear: both; 
  min-height: 28px; 
  padding: 5px 0px 5px 0px;
  border-top: 1px solid #CBCBCB; 
}

DIV.row-list-dark
{
  background-color: #EFEFEF;
  overflow: hidden;
}

DIV.row-list-bold
{
  font-weight: 700;
}


DIV.row-column 
{
  float: left; 
  text-align: left; 
  padding: 5px
}

DIV.row-column-btns
{
  float: left; 
  position: relative; 
  text-align: right; 
  padding: 0px 5px 0px 5px;
}

DIV.row-column-btn-wrapper
{
  position: absolute; 
  right: 5px;
}

DIV.row-column-btn-sm
{
  float: left; 
  margin-left: 10px;
}

/* Boxes and staus/msg bars */

DIV.text-box
{
  width: 888px; 
  margin-top: 10px; 
  border: 1px solid #CBCBCB; 
  padding: 5px; 
  text-align: left;
}

DIV.text-box-wrapper
{
  position: relative; 
  width: 100%; 
  margin-top: 10px;
}

IMG.img-text-box
{
  position: absolute; 
  top: 4px; 
  right: 4px;
  width: 20px;
  height: 20px;
}

TEXTAREA.text-box
{
  width: 98%; 
  font-family: "Open Sans" serif;
  resize: none;
}

textarea[data-autoresize]
{
  overflow: hidden;
}

#status_msg
{
  position: relative;
  top: 0px;
  width: 900px;
  margin-left: 0px auto;
  margin-right: 0px auto;
  z-index: 100;
}


INPUT.search
{
  width: 100%;
  padding: 3px 3px 3px 30px;
}

/*
* jQuery UI Style
*/
.ui-autocomplete 
{
z-index: 100;
}
ul.ui-autocomplete li.ui-menu-item
{
  text-align:left;
}
.ui-helper-hidden-accessible
{
 display: none;
}
.ui-autocomplete 
{
  max-height: 200px;
  overflow-y: auto;
  /* prevent horizontal scrollbar */
  overflow-x: hidden;
  border:1px solid #222;
  position:absolute;
  list-style: none;
  list-style-type: none;
  padding: 0 0 2px 0px ;
  margin: 0px;
}
ul.ui-menu
{
  border: 1px solid #CFCFCF;
  margin:0 auto;
}
li.ui-menu-item
{
  font-size: 14px;
  padding: 4px 2px;
  margin-left: 0px;
  cursor:pointer;
}

li.ui-menu-item:hover
{
  background-color: solid #EFEFEF;
  border: 0px;
  border-top: 1px solid #CBCBCB;
  border-bottom: 1px solid #CBCBCB;
}


/*
* Status classes
*/

.success 
{
  padding: 10px;
  border: 1px solid #4ad353;
  background-color: #aeffb4;
  text-align: center;
}

.failure 
{
  padding: 10px;
  border: 1px solid #FF0000;
  background-color: #FFCACA;
  text-align: center;
}

.warning 
{
  padding: 10px;
  border: 1px solid #FF9000;
  background-color: #FFC880;
  text-align: center;
}