/*theme.less is defined using less css framework library. To understand more about less please visit http://lesscss.org/
less compiler to css is available in https://github.com/cloudhead/less.js/tree/master/bin*/

//less variables

//Font settings for the theme. Changing here will change font style for all controls,header and footer font styles.
@font-family:Segoe UI,Trebuchet MS ,Candara,Bitstream Vera Sans ,DejaVu Sans ,Verdana;
@font-size:12px;

//less mixins for reusing common properties across all the styles.
//basic font settings css
.fontsettings(){
	color: #000000;
	font-family:@font-family;
	font-size:@font-size;
}
//Mixin to define Border Radius of elements
.border-radius (@radius:10px) {
  border-radius: @radius;
  -moz-border-radius: @radius;
  -webkit-border-radius: @radius;
}

//Mixin to draw Text Shadow for input elements
.box-shadow(@x: 0,@y: 0,@blur: 1px,@color: #000)
{
    -webkit-box-shadow: inset @x @y @blur @color;
    -moz-box-shadow: inset @x @y @blur @color;
    box-shadow: inset @x @y @blur @color;
}

//Base mixin for all input elements in the form. Changing here will change style of input[text,selectbox,checkbox,radiobutton and textarea]
.widget()
{
   .fontsettings;
   .border-radius(2px);
	text-shadow: 0px 1px 0px #fff;
	outline: none;
    border: 1px solid #DBDBDB;
    &:hover{
        -webkit-box-shadow: 0px 0px 5px #007eff;
        -moz-box-shadow: 0px 0px 5px #007eff;
        box-shadow: 0px 0px 5px #007eff;
    }
}
//base mixin for header and login header
.header()
{
    font-family:@font-family;
    font-weight: 600;
    text-rendering: optimizelegibility;
    text-shadow: 0 1px 0 #FFFFFF, 0 -1px 0 #000000;
    width: 100%;
    color:#808080;
    -webkit-font-smoothing: antialiased;
}
//end of less mixins


/*******************************************************  Header/Footer/Login Definition **********************************/
//defines body background color of the whole page
.body
{
    background-color:#f5f6f6;
    .fontsettings;
}

//header title
.siteheader {
   .header;
    font-size: 34px;
}

//loging dialog header title
.loginheader {
  .header;
   font-size: 24px;
}

//loging page background image
.login
{
    background: #f5f6f6 url(/static/images/loginBg.png) no-repeat left;
}

//background css of the form.
.content_background
{
    background: #FFFFFF;
    height: 100%;
    vertical-align:top;
}

//footer style
.sitefooter {
  border-top: 2px solid #6080A9;
  color: #FFFFFF;
  font-size: 24px;
  font-weight: normal;
  font-family:@font-family;
  background-color: #6080A9;
  width: 100%;
}

//footer text css style
.footer_text {
    font-family: @font-family;
	font-size: 10px;
	color: #2A2A2A;
}

//style of poweredby logo in footer
.poweredby-logo{
	background: transparent url(/static/images/os_logo.gif) no-repeat;
	height:14px;
	width:98px;
	display:inline-block;
	vertical-align:middle;
}
/***************************************************** widget css**********************************************************/
.label{
	.fontsettings;
    color:#646464;
    height:100%;
    width:100%;
}

.button{
    .border-radius(0.3em);
    .box-shadow(0px,1px,2px,rgba(0, 0, 0, 0.2));
    width: 100%;
	background: black;
    color:#fff;
    background: -webkit-gradient(linear, left top, left bottom, from(#666666), to(#000000));
	background: -moz-linear-gradient(top,  #666666,  #000000);
    border: 1px solid #333333;
    cursor: pointer;
    display: inline-block;
    outline: medium none;
    padding: 0.2em 0.8em;
	margin:1px;
    text-align: center;
    text-decoration: none;
    &:hover{text-decoration: none;}
    &:active{
        background: -moz-linear-gradient(center top , #000000, #444444) repeat scroll 0 0 transparent;
        background: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#000000));
        color: #fff;
    }
}

.textbox{
	.widget();
    width: 100%;
    height:100%;
}

.textarea{
    .widget;
	overflow:auto;
    width: 100%;
    height:100%;
}

.combobox{
    .widget;
    width: 100%;
    height:100%;
	background: white url(/runtime/images/drop_down.png) no-repeat right;
}

.optionbutton{
	.widget;
}

.checkbox{
	.widget;
}

.image{
	cursor:pointer;
}

.readonly{

}

.calendar{
    background: transparent url(/runtime/images/cal.png) no-repeat right;
    cursor:pointer;
}

.hidden{
	visibility: hidden;
}

//inbox column header style
.column-header{
    font-size:15px;
    font-weight:bold;
    font-family:@font-family;
    background-color:#999999;
}

//inbox normal row style
.normal-row-style{
	background-color: #EEEEEE
}

//inbox alternate row style
.alternate-row-style{
	background-color: #CCCCCC
}
.blockMsg {
    	width: 350px;
    	top: 10px;
    	left: 0 px;
    	right: 10px;
   	padding: 5px;
    	background: #000;
    	-webkit-border-radius: 10px;
    	-moz-border-radius: 10px;
    	opacity: .6;
    	color: #fff;
    	text-align: center;
}

/*************************************************  Error/Warning/Info styles ************************************************/
/* ------ Validation Error Message ------------- */
/* error message of the input when there is an error*/
.invalidentry-error{
    border:1px solid #BDBDBD;
	background-color:#F1BFC0;
}
/* error message that is shown near the input when there is an error*/
.error {
    .border-radius(2px);
	height:22px;
	font-size:10px;
	font-family:@font-family;
	color:#B43F3E;
	display:none;
    p {
        margin:0;
        float:right;
    }
    img {
        float:left;
    }
    em {
        display:block;
        width:0;
        height:0;
        border:10px solid;
        border-color:#F1BFC0 transparent transparent;
        /* positioning */
        position:absolute;
    }
}

/* warning message of the input when there is an warning*/
.invalidentry-warning{
    border:1px solid #EFB31E;
	background-color:#FEEFB3;
}
/* warning message that is shown near the input when there is an warning*/
.warning {
	height:22px;
	font-size:10px;
	font-family:10px;
	color:#EFB31E;
	display:none;
    .border-radius(2px);
    p {
        margin:0;
        float:right;
    }
    em {
        display:block;
        width:0;
        height:0;
        border:10px solid;
        border-color:#9CBFD5 transparent transparent;
        /* positioning */
        position:absolute;
    }
}

/* info message of the input when there is an info*/
.invalidentry-info{
    border:1px solid #5778A3;
	background-color:#9CBFD5;
}
/* info message that is shown near the input when there is an info*/
.info {
	height:22px;
	font-size:10px;
	font-family:@font-family;
	color:#5778A3;
	display:none;
    .border-radius(2px);
    p {
        margin:0;
        float:right;
    }
    em {
        display:block;
        width:0;
        height:0;
        border:10px solid;
        border-color:#9CBFD5 transparent transparent;
        position:absolute;
    }
    img {
        float:left;
    }
}

//Default system styles. All these styles are by default defined in the platform and can be present in studio/cellstyles
.Normal {
	font-family:@font-family;
	font-size:@font-size;
}

.NormalFormCell {
	font-family:@font-family;
	font-size:@font-size;
}

.Note {
	background-color:#FFFECB;
	border:1px solid #ABA9A6;
}

.PublicCell {
	background-color:#D1E8FF;
	font-family:@font-family;
}

.ReferenceCell {
	background-color:#FFEDDB;
	font-family:@font-family;
}

.page-title{
    border-bottom:2px solid #6080A9;
    color:#234E81;
    font-size:24px;
    font-weight:bold;
    font-family:@font-family;
}

.section-title{
    border-bottom:2px solid #A4CBDC;
    color:#234E81;
    font-size:18px;
    font-weight:bold;
    font-family:@font-family;
}
.selectedtab {
	background: #fff;
	.fontsettings;
	font-weight: bold;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	background-color: #fff;
	border-left:1px solid #b3b3b3;
	border-right:1px solid #b3b3b3;
	border-top:1px solid #b3b3b3;
	box-shadow: 0 0 0px 0 #fff;
  	border-bottom:0px;
}

.unselectedtab {
	background: #fcfcfc;
	.fontsettings;
	font-weight: normal;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	background-color: #f3f3f3;
	border:1px solid #b3b3b3;
	box-shadow: 0 0 0px 0 #fff;
  	border-bottom:0px;
}

.tabborderline {
	border-bottom: 1px solid #b3b3b3;
}
