﻿/* CUSTOM LISTBOX */

.customlist-ul{
    margin: 0 0 0 0;
    background-color: #f6f6f6;
    padding: 3px 3px 3px 0;
    list-style-type: none;
    position: absolute;
    max-width: 600px;
	box-shadow: 1px 1px 1px rgba(0,0,0,0.2);
}

.customlist-ul li{
    float: left;
	font-size: 14px;
	margin-left: 5px;
}

.customlist-desc{
    background-color: #f6f6f6;
	font-size: 14px;
    cursor: pointer;
    padding: 3px;
    float: left;
	padding-right: 15px;
	background-image: url(/main/css/res/expand.jpg);
	background-repeat: no-repeat;
	background-position: right center;
}

.customlist-sel{
	font-size: 14px;
	cursor: default;
    padding: 3px;
	color: #f90;
    float: left;
}

/* CUSTOM DROP */

.customdrop{
	filter: alpha(opacity=0);
	position: absolute;
	opacity: 0;
}
.customdrop-div{
	background-color: #f3f3f3;
	border: solid 1px #f3f3f3;
	display: inline-block;
	padding-left: 2px;
	font-size: 13px;
	margin: 2px 0;
}
.customdrop-arrow{
	float: right;
	color: #666;
	cursor: default;
}
select:hover + .customdrop-div{
	background-color: #dfebeb;
}
select:focus + .customdrop-div{
	background-color: #f90;
	color: #fff;
}
select:focus + .customdrop-div .customdrop-arrow{
	color: #fff;
}

/*------------------------------------------------*/

input{
	border: none;
	border-bottom: solid 1px #bbb;
}
input:focus, textarea:focus{ border-bottom: solid 1px #f90 !important; }
textarea:focus{ border: solid 1px #f90 !important; }
select{
	border: #fff solid 1px;
	background: #f3f3f3;
	outline: 0;
}
select:focus{
	border-color: #f90;
}

/* INPUT TEXT */

input[type="text"], input[type="password"], textarea, input:not([type]){
	-webkit-transition: border-color 0.2s;
	-moz-transition: border-color 0.2s;
	-ms-transition: border-color 0.2s;
	-o-transition: border-color 0.2s;
	border-bottom: solid 1px #bbb;
	padding: 3px;
	color: #666;
	outline: 0;
	margin: 0;
}textarea{ border: solid 1px #bbb; }

input[type="text"]:not(:disabled):hover, input[type="password"]:not(:disabled):hover,
textarea:not(:disabled):hover, input:not([type]):not(:disabled):hover{
	border-bottom: solid 1px #f90;
	color: #333;
}textarea:not(:disabled):hover{border: solid 1px #f90;}

input[type="text"]:focus, input[type="password"]:focus, textarea:focus, input:not([type]):focus, select:focus{
	color: #000;
}
input[type="text"]:disabled, input[type="password"]:disabled, textarea:disabled,
input:not([type]):disabled, select:disabled{
	color: #999;
	background-color: #f3f3f3;
}

/* CHECKBOX Y RADIO */

input[type="checkbox"], input[type="radio"] {
    opacity: 0;
    position: absolute;
    z-index: 5;
    background: #fff;
}

input[type="checkbox"] + label, input[type="radio"] + label{
    display: inline;
    margin-left: 23px;
}

input[type="checkbox"] + label:before, input[type="radio"] + label:before{
    color: #444;
    cursor: pointer;
    margin-left: -20px;
    padding-right: 4px;
    vertical-align: middle;
}
input[type="checkbox"] + label:before{
    font: 15px FontAwesome;
    content: "\f096";            
}
input[type="radio"] + label:before{
    font: 13px FontAwesome;
    content: "\f111";
}
input[type="checkbox"]:checked + label:before { content: "\f046"; }
input[type="radio"]:checked + label:before { content: "\f10c"; }

input[type="checkbox"]:hover:not(:disabled) + label,
input[type="radio"]:hover:not(:disabled) + label{ color: #f63; cursor: default; }
input[type="checkbox"]:active:not(:disabled) + label,
input[type="radio"]:active:not(:disabled) + label{ color: #fbcc85; }
input[type="checkbox"]:disabled + label,
input[type="radio"]:disabled + label{ background-color: #fff; }

/* ANCHOR */

a{
	text-decoration: none;
}
a[href]:not(.nostyle){
	-webkit-appearance: none;
	-webkit-transition: background-color 0.2s;
	-moz-transition: background-color 0.2s;
	-ms-transition: background-color 0.2s;
	-o-transition: background-color 0.2s;
	transition: background-color 0.2s;
	border-bottom: solid 1px #f90;
	color: #f90;
}
a[href]:not(.nostyle):hover{
	background-color: rgba(252,207,140,0.8);
	cursor: pointer;
	color: #eb9007;
}
a:focus{ outline: #f90 dashed 1px; }

/* BOTONES */

input[type="button"], input[type="submit"]{
	-webkit-transition: background-color 0.1s, color 0.1s, border-color 0.2s;
	-moz-transition: background-color 0.1s, color 0.1s, border-color 0.2s;
	-ms-transition: background-color 0.1s, color 0.1s, border-color 0.2s;
	-o-transition: background-color 0.1s, color 0.1s, border-color 0.2s;
	transition: background-color 0.1s, color 0.1s, border-color 0.2s;
	background-color: #fff;
	border: solid 1px #ccc;
	text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.4);
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
	font-family: FontAwesome, Arial;
	min-width: 30px !important;
	padding: 3px;
	color: #333;
}
input[type="button"].red, input[type="submit"].red{ background-color: #c66; }
input[type="button"].blue, input[type="submit"].blue{ background-color: #06c; }
input[type="button"].orange, input[type="submit"].orange{ background-color: #fa6; }
input[type="button"]:hover:not(:disabled), input[type="submit"]:hover:not(:disabled){
	color: #111;
	border: solid 1px #f63;
}
input[type="button"]:active:not(:disabled), input[type="submit"]:active:not(:disabled){
	box-shadow: inset 0 0 0 1px #f90;
	behavior: url(/PIE.htc);
}
input[type="button"]:active:hover:not(:disabled),
input[type="submit"]:active:hover:not(:disabled){ background-color: #fbcc85; }
input[type="button"].red:not(:disabled):active:hover,
input[type="submit"].red:not(:disabled):active:hover{ background-color: #d78c8c; }
input[type="button"].blue:not(:disabled):active:hover,
input[type="submit"].blue:not(:disabled):active:hover{ background-color: #69c; }
input[type="button"]:disabled, input[type="submit"]:disabled{
	background: #fff;
	color: #ccc;
}
input[type="file"]{ width: 240px; }