﻿* {
   outline: none;
}
/*== Select ==============================================================================================================*/
.cool_select {
   position: relative;
   cursor: default;
   display: inline;
   z-index: 1000;
}
.cool_select > .selected {
   min-width: 100px;
   background-position: right 0px;
   margin: 0;
   background-repeat: no-repeat;
   display: inline-block;
   position: relative;
   text-decoration: none;
   cursor: default;
}
.cool_select.disabled > .selected > span.text {
   color: #666666;
}
.cool_select > .selected > span.bg {
   background-position: left 0px;
   display: block;
   background-repeat: no-repeat;
   float: left;
}
.cool_select.disabled > .selected {
   background-position: right -63px; /*Posição da imagem que representa o select desabilitado*/
}
.cool_select > .selected > span.bg {
   background-position: left -63px; /*Posição da imagem que representa o select desabilitado*/
}
.cool_select > .options {
   position: absolute;
   left: 0px;
   z-index: 10000000;
   overflow: auto;
   overflow-x: hidden;
}
.cool_select > .options > ul {
   list-style: none;
   margin: 0;
   padding: 0;
   cursor: default;
}
.cool_select > .options > ul > li {
   padding-left: 2px;
   line-height: 16px;
   min-width: 100px;
   cursor: default;
   display: block;
}
.cool_select > .options > ul > li:hover {
   background-color: #888888;
   color: #FFFFFF;
}
.cool_select > .options > ul > li.selected {
   background-color: #65B0CB;
   color: #FFFFFF;
}
/*== Fim Select ==========================================================================================================*/

/*== Button ==============================================================================================================*/
.cool_button {
   background-position: right 0px;
   background-repeat: no-repeat;
   display: inline-block;
   position: relative;
   cursor: pointer;
}
.cool_button > span.bg {
   background-position: left 0px;
   display: block;
   background-repeat: no-repeat;
   float: left;
   cursor: pointer;
}
.cool_button > span.text {
   display: block;
}
.cool_button.disabled {
   cursor: default;
}
.cool_button.disabled > span.text {
   cursor: default;
}
.cool_button.disabled > span.bg {
   cursor: default;
}

/*== Button Skins ========================================================================================================*/
.btnVerde {
   margin: 0px 0px 0px 15px;
   color: #FFFFFF;
   font-size: 11px;
   padding: 0px 15px 0px 0px;
   background-image: url('pngs/btnVerde.png');
   line-height: 24px;
   font-weight: bold;
   display: inline-block;
}
.btnVerde > span.text {
   color: #FFFFFF;
}
.btnVerde > span.bg {
   height: 24px;
   background-image: url('pngs/btnVerde.png');
   margin-left: -15px;
   width: 15px;
}
.btnVerde.disabled {
   background-position: right -72px;
}
.btnVerde.disabled > span.bg {
   background-position: left -72px;
}
.btnVerde.disabled > span.text {
   color: #CCCCCC;
}

.btnVermelho {
   color: #FFFFFF;
   font-size: 11px;
   padding: 0px 15px 0px 0px;
   background-image: url('pngs/btnVermelho.png');
   margin-left: 15px;
   line-height: 24px;
   font-weight: bold;
}
.btnVermelho > span.text {
   color: #FFFFFF;
}
.btnVermelho > span.bg {
   height: 24px;
   background-image: url('pngs/btnVermelho.png');
   margin-left: -15px;
   width: 15px;
}
.btnVermelho.disabled {
   background-position: right -72px;
}
.btnVermelho.disabled > span.bg {
   background-position: left -72px;
}
.btnVermelho.disabled > span.text {
   color: #CCCCCC;
}

.btnAmarelo {
   color: #FFFFFF;
   font-size: 11px;
   padding: 0px 15px 0px 0px;
   background-image: url('pngs/btnAmarelo.png');
   margin-left: 15px;
   line-height: 24px;
   font-weight: bold;
}
.btnAmarelo > span.text {
   color: #FFFFFF;
}
.btnAmarelo > span.bg {
   height: 24px;
   background-image: url('pngs/btnAmarelo.png');
   margin-left: -15px;
   width: 15px;
}
.btnAmarelo.disabled {
   background-position: right -72px;
}
.btnAmarelo.disabled > span.bg {
   background-position: left -72px;
}
.btnAmarelo.disabled > span.text {
   color: #CCCCCC;
}
/*== Fim Button =========================================================================================================*/

/*== Input Text =========================================================================================================*/
.cool_inputText {
   background-repeat: no-repeat;
   background-position: left top;
   position: relative;
   display: inline-block;
}
.cool_inputText input[type="text"], .cool_inputText input[type="password"] {
   border-style: none;
   position: absolute;
   top: 2px;
   background-color: #FFFFFF;
   z-index: 0;
}
.cool_inputText > span.bg {
   background-repeat: no-repeat;
   background-position: right top;
   position: absolute;
   top: 0px;
}
.cool_inputText.disabled {
   background-position: left top;
}
.cool_inputText.disabled > input[type="text"], .cool_inputText.disabled > input[type="password"] {
   color: #CCCCCC;
}
.cool_inputText.disabled > span.bg {
   background-position: right top;
}
/*== Fim Input Text ======================================================================================================*/

/*== Input Radio =========================================================================================================*/
.cool_inputRadio {
   background-repeat: no-repeat;
   background-position: left top;
   display: inline-block;
   color: #333333;
   position: relative;
}
.cool_inputRadio > .radio {
   background-repeat: no-repeat;
   background-position: left top;
   display: inline-block; /*padding-right: 4px;    position: absolute;    top: 0px;    left: 0px;*/
}
.cool_inputRadio:hover {
   color: #333333;
}
.cool_inputRadio.disabled {
   background-position: left top;
   color: #888888;
}
.cool_inputRadio.disabled > .radio {
   background-position: left top;
}
.cool_inputRadio.disabled.checked > .radio {
   background-position: left bottom;
}
/*== Fim Input Radio =====================================================================================================*/

/*== Input Checkbox ======================================================================================================*/
.cool_inputCheckbox {
   display: inline-block;
   color: #333333;
   position: relative;
}
.cool_inputCheckbox > .check {
   background-repeat: no-repeat;
   background-position: left top;
   display: inline-block; /*padding-right: 4px;    position: absolute;    top: 0px;    left: 0px;*/
}
.cool_inputCheckbox:hover {
   color: #333333;
}
.cool_inputCheckbox.disabled {
   color: #888888;
}
.cool_inputCheckbox.disabled > .check {
   background-position: left top;
}
.cool_inputCheckbox.disabled.checked > .check {
   background-position: left bottom;
}
/*== Fim Input Checkbox ==================================================================================================*/

/*== Textarea =====================================================================================================*/
.cool_textArea {
   position: relative;
   display: inline-block;
}
.cool_textArea > textarea {
   overflow: auto;
}
.cool_textArea_lt, .cool_textArea_lb, .cool_textArea_rt, .cool_textArea_rb {
   background-position: left top;
   position: absolute;
   height: 5px;
   width: 5px;
   background-repeat: no-repeat;
   display: block;
}
.cool_textArea_lt {
   top: 0px;
   left: 0px;
}
.cool_textArea_lb {
   bottom: 0px;
   left: 0px;
}
.cool_textArea_rt {
   top: 0px;
   right: 0px;
}
.cool_textArea_rb {
   bottom: 0px;
   right: 0px;
}
.cool_textArea_t, .cool_textArea_b {
   background-position: left top;
   position: absolute;
   height: 5px;
   background-repeat: repeat-x;
   display: block;
}
.cool_textArea_t {
   top: 0px;
   left: 5px;
}
.cool_textArea_b {
   bottom: 0px;
   left: 5px;
}
.cool_textArea_l, .cool_textArea_r {
   background-position: left top;
   position: absolute;
   width: 5px;
   background-repeat: repeat-y;
   display: block;
}
.cool_textArea > textarea {
   border-style: none;
   background-color: #FFFFFF;
   resize: none;
}
.cool_textArea_l {
   top: 5px;
   left: 0px;
}
.cool_textArea_r {
   top: 5px;
   right: 0px;
}
/*== Fim Textarea ======================================================================================================*/
