/**
* CSS styles for forms generated by yiic.
*
* The styles can be applied to the following form structure:
*
*
*
* The above code will render the labels and input fields in separate lines.
* In order to render them in the same line, please use the "wide" form as follows,
*
*
* ......
*
*
* @author Qiang Xue
* @link http://www.yiiframework.com/
* @copyright Copyright © 2008-2010 Yii Software LLC
* @license http://www.yiiframework.com/license/
*/
form.login-form {
/* width: 450px; */
height:auto;
padding: 20px 20px;
border: 2px solid #fff;
/* margin: 60px auto; */
overflow: hidden;
background-color: #e5e7ea;
background-image: -webkit-gradient(linear, left top, right top, color-stop(0%, #dcdee2), color-stop(50%, #eff0f1), color-stop(100%, #dcdee2)); /* Saf4+, Chrome */
background-image: -webkit-linear-gradient(left, #dcdee2, #eff0f1, #dcdee2); /* Chrome 10+, Saf5.1+, iOS 5+ */
background-image: -moz-linear-gradient(left, #dcdee2, #eff0f1, #dcdee2); /* FF3.6 */
background-image: -ms-linear-gradient(left, #dcdee2, #eff0f1, #dcdee2); /* IE10 */
background-image: -o-linear-gradient(left, #dcdee2, #eff0f1, #dcdee2); /* Opera 11.10+ */
background-image: linear-gradient(left, #dcdee2, #eff0f1, #dcdee2);
-pie-background: linear-gradient(left, #dcdee2, #eff0f1, #dcdee2); /* IE6-IE9 */
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
behavior: URL(PIE.htc);
margin: 0px auto -1px auto;
}
/* Labels */
label.login {
margin-right: 10px;
float: left;
clear: both;
width: 90px;
color: #333;
font-size: 14px;
font-weight: bold;
background-image:url(../images/required.gif);
background-repeat:no-repeat;
background-position: 65px 10px;
padding-top:7px;
}
label span {
font-size: 12px;
font-weight: normal;
color: red;
}
/* Textbox and textarea */
.form-input {
width: 300px;
height: 15px;
padding: 6px 10px;
margin-bottom: 20px;
font: 13px 'Helvetica Neue', Helvetica, Arial, sans-serif;
color: #333;
background: #fff;
border: 1px solid #ccc;
outline: none;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
-moz-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.5), 0 1px 0 rgba(255, 255, 255, 0.7);
-webkit-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.5), 0 1px 0 rgba(255, 255, 255, 0.7);
box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.5), 0 1px 0 rgba(255, 255, 255, 0.7);
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
-moz-transition: all 0.4s ease-in-out;
-webkit-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
behavior: url(PIE.htc);
float:left;
}
.form-input.user {
padding: 6px 10px 0px 35px;
background-image:url(../images/icons/user.png);
background-position:10px;
background-repeat:no-repeat;
}
.form-input.password {
padding: 6px 10px 0px 35px;
background-image:url(../images/icons/key.png);
background-position:10px;
background-repeat:no-repeat;
}
.form-input.textarea{
height: 200px;
width: 350px;
overflow: auto;
}
/* Focus style */
.form-input:focus {
border: 1px solid #7fbbf9;
-moz-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.5), 0 0 3px #7fbbf9;
-webkit-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.5), 0 0 3px #7fbbf9;
box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.5), 0 0 3px #7fbbf9;
background-color: #c4d7e8;
}
/* Form submit button */
.form-btn {
clear: both;
float: left;
padding: 0 15px;
height: 30px;
font: bold 12px 'Helvetica Neue', Helvetica, Arial, sans-serif;
text-align: center;
color: #fff;
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);
cursor: pointer;
border: 1px solid #1972c4;
outline: none;
position: relative;
background-color: #1d83e2;
background-image: -webkit-gradient(linear, left top, left bottom, from(#77b5ee), to(#1972c4)); /* Saf4+, Chrome */
background-image: -webkit-linear-gradient(top, #77b5ee, #1972c4); /* Chrome 10+, Saf5.1+, iOS 5+ */
background-image: -moz-linear-gradient(top, #77b5ee, #1972c4); /* FF3.6 */
background-image: -ms-linear-gradient(top, #77b5ee, #1972c4); /* IE10 */
background-image: -o-linear-gradient(top, #77b5ee, #1972c4); /* Opera 11.10+ */
background-image: linear-gradient(top, #77b5ee, #1972c4);
-pie-background: linear-gradient(top, #77b5ee, #1972c4); /* IE6-IE9 */
-moz-border-radius: 16px;
-webkit-border-radius: 16px;
border-radius: 16px;
-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.5);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.5);
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
behavior: url(PIE.htc);
}
.form-btn:active {
border: 1px solid #77b5ee;
background-color: #1972c4;
background-image: -webkit-gradient(linear, left top, left bottom, from(#1972c4), to(#77b5ee)); /* Saf4+, Chrome */
background-image: -webkit-linear-gradient(top, #1972c4, #77b5ee); /* Chrome 10+, Saf5.1+, iOS 5+ */
background-image: -moz-linear-gradient(top, #1972c4, #77b5ee); /* FF3.6 */
background-image: -ms-linear-gradient(top, #1972c4, #77b5ee); /* IE10 */
background-image: -o-linear-gradient(top, #1972c4, #77b5ee); /* Opera 11.10+ */
background-image: linear-gradient(top, #1972c4, #77b5ee);
-pie-background: linear-gradient(top, #1972c4, #77b5ee); /* IE6-IE9 */
-moz-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.5), 0 1px 0 rgba(255, 255, 255, 0.5);
-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.5), 0 1px 0 rgba(255, 255, 255, 0.5);
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.5), 0 1px 0 rgba(255, 255, 255, 0.5);
}
input[type=submit]::-moz-focus-inner {
border: 0;
padding: 0;
}
.obrigatorio{
width:14px;
height:12px;
display:block;
}
/* FOMULARIO GENERICO */
form.geral {
height:auto;
padding: 20px 20px;
border: 2px solid #fff;
/* margin: 60px auto; */
overflow: hidden;
background-color: #e5e7ea;
background-image: -webkit-gradient(linear, left top, right top, color-stop(0%, #dcdee2), color-stop(50%, #eff0f1), color-stop(100%, #dcdee2)); /* Saf4+, Chrome */
background-image: -webkit-linear-gradient(left, #dcdee2, #eff0f1, #dcdee2); /* Chrome 10+, Saf5.1+, iOS 5+ */
background-image: -moz-linear-gradient(left, #dcdee2, #eff0f1, #dcdee2); /* FF3.6 */
background-image: -ms-linear-gradient(left, #dcdee2, #eff0f1, #dcdee2); /* IE10 */
background-image: -o-linear-gradient(left, #dcdee2, #eff0f1, #dcdee2); /* Opera 11.10+ */
background-image: linear-gradient(left, #dcdee2, #eff0f1, #dcdee2);
-pie-background: linear-gradient(left, #dcdee2, #eff0f1, #dcdee2); /* IE6-IE9 */
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
behavior: URL(PIE.htc);
}
fieldset.geral {
margin: 0 0 22px 0;
border: 1px solid #095D92;
padding: 12px 17px;
}
p.change_link_int{
border-radius: 0 0 5px 5px;
border-top: 1px solid #DBE5E8;
padding: 17px 0 10px;
text-align: right;
border-top: 1px solid rgb(219, 229, 232);
-webkit-border-radius: 0 0 5px 5px;
-moz-border-radius: 0 0 5px 5px;
border-radius: 0 0 5px 5px;
background: rgb(225, 234, 235);
background: -moz-repeating-linear-gradient(-45deg,
rgb(247, 247, 247) ,
rgb(247, 247, 247) 15px,
rgb(225, 234, 235) 15px,
rgb(225, 234, 235) 30px,
rgb(247, 247, 247) 30px
);
background: -webkit-repeating-linear-gradient(-45deg,
rgb(247, 247, 247) ,
rgb(247, 247, 247) 15px,
rgb(225, 234, 235) 15px,
rgb(225, 234, 235) 30px,
rgb(247, 247, 247) 30px
);
background: -o-repeating-linear-gradient(-45deg,
rgb(247, 247, 247) ,
rgb(247, 247, 247) 15px,
rgb(225, 234, 235) 15px,
rgb(225, 234, 235) 30px,
rgb(247, 247, 247) 30px
);
background: repeating-linear-gradient(-45deg,
rgb(247, 247, 247) ,
rgb(247, 247, 247) 15px,
rgb(225, 234, 235) 15px,
rgb(225, 234, 235) 30px,
rgb(247, 247, 247) 30px
);
}
#Usuario_usuario_data_nascimento {
float:left;
}
/* Labels */
label.geral {
margin-right: 10px;
float: left;
clear: both;
width: 240px;
color: #333;
font-size: 14px;
font-weight: bold;
background-repeat:no-repeat;
background-position: 65px 10px;
padding-top:7px;
text-align:right;
}
label.geral.naoobrigatorio {
width: 201px;
margin-right:49px;
}
label.geral-botoes {
margin-right: 10px;
float: left;
clear: both;
width: 240px;
color: #333;
font-size: 14px;
font-weight: bold;
background-repeat:no-repeat;
background-position: 65px 10px;
padding-top:7px;
text-align:right;
padding-bottom:70px;
}
label span {
font-size: 12px;
font-weight: normal;
color: red;
}
.form-input.geral {
float:left;
}
.form-input.data {
width:65px;
}
.ui-datepicker-trigger{
padding-left:10px;
float: left;
cursor:pointer;
}
.apagar{
float:left;
padding-left: 10px;
cursor:pointer;
}
textarea.form-input {
height: 200px;
overflow: auto;
width: 350px;
}
/******** SELECT (DROPDOWN) */
.select-wrapper {
width: 250px;
margin-bottom: 10px;
overflow: hidden;
position: relative;
}
.select-wrapper {
background-color: #fff;
background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#efefef)); /* Saf4+, Chrome */
background-image: -webkit-linear-gradient(top, #ffffff, #efefef); /* Chrome 10+, Saf5.1+, iOS 5+ */
background-image: -moz-linear-gradient(top, #ffffff, #efefef); /* FF3.6 */
background-image: -ms-linear-gradient(top, #ffffff, #efefef); /* IE10 */
background-image: -o-linear-gradient(top, #ffffff, #efefef); /* Opera 11.10+ */
background-image: linear-gradient(top, #ffffff, #efefef);
-pie-background: linear-gradient(top, #ffffff, #efefef); /* IE6-IE9 */
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5), inset 0 1px 1px rgba(255, 255, 255, 0.5);
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5), inset 0 1px 1px rgba(255, 255, 255, 0.5);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5), inset 0 1px 1px rgba(255, 255, 255, 0.5);
behavior: url(PIE.htc);
float:left;
}
.selectTop {
position: absolute;
top: 0;
left:0;
bottom: 0;
right: 0;
padding: 6px 10px;
}
.select-wrapper:before {
content: '';
position: absolute;
top: 0;
right: 0;
width: 20px;
height: 100%;
pointer-events: none;
background-color: #fff;
background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#efefef)); /* Saf4+, Chrome */
background-image: -webkit-linear-gradient(top, #ffffff, #efefef); /* Chrome 10+, Saf5.1+, iOS 5+ */
background-image: -moz-linear-gradient(top, #ffffff, #efefef); /* FF3.6 */
background-image: -ms-linear-gradient(top, #ffffff, #efefef); /* IE10 */
background-image: -o-linear-gradient(top, #ffffff, #efefef); /* Opera 11.10+ */
background-image: linear-gradient(top, #ffffff, #efefef);
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
.select-wrapper:after {
content: '';
position: absolute;
top: 50%;
right: 10px;
margin-top: -3px;
border: 6px solid transparent;
border-top: 6px solid #444;
pointer-events: none;
}
.ie .select-wrapper:before, .ie9 .select-wrapper:before {
display: none;
}
select.geral {
width: 240px;
height: 14px;
padding: 8px 0 4px 10px;
border: 0;
background: transparent none;
outline: none;
font: 11px 'Helvetica Neue', Helvetica, Arial, sans-serif;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
select.geral::-moz-focus-inner {
border: 0;
}
select.geral option {
background: #ededed;
height: 14px;
width: 100%;
padding: 10px 0px 10px 10px;
border-bottom: 1px solid #ccc;
border-top: 1px solid #fff;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
/* BOTÔES **/
.buttons{
float:left;
}
.crud-botao {
cursor: pointer;
background: rgb(61, 157, 179);
padding: 8px 5px;
font-family: 'BebasNeueRegular','Arial Narrow',Arial,sans-serif;
color: #fff;
font-size: 14px;
border: 1px solid rgb(28, 108, 122);
margin-bottom: 10px;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.07) inset,
0px 0px 0px 2px rgb(254, 254, 254),
0px 5px 2px 2px rgb(210, 210, 210);
-moz-box-shadow:0px 1px 6px 4px rgba(0, 0, 0, 0.07) inset,
0px 0px 0px 2px rgb(254, 254, 254),
0px 5px 2px 2px rgb(210, 210, 210);
box-shadow:0px 1px 6px 4px rgba(0, 0, 0, 0.07) inset,
0px 0px 0px 2px rgb(254, 254, 254),
0px 5px 2px 2px rgb(210, 210, 210);
-webkit-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
transition: all 0.2s linear;
padding: 0 0 0 10px;
margin-right:15px;
min-height:29px;
max-height:33px;
min-width:100px;
}
.crud-botao:hover {
background: rgb(74, 179, 198);
background-repeat:no-repeat;
}
.crud-botao:active {
position:relative;
top:1px;
}
.crud-botao.voltar,
.crud-botao.voltar:hover
{
background-image:url(../images/icons/arrow_left_32.png) ;
background-size: 25px 25px;
background-repeat:no-repeat;
background-position:3px 50%;
}
.crud-botao.salvar,
.crud-botao.salvar:hover{
background-image:url(../images/icons/save_32.png) ;
background-size: 25px 25px;
background-repeat:no-repeat;
background-position:3px 50%;
}
.crud-botao.novo,
.crud-botao.novo:hover{
background-image:url(../images/icons/add_32.png) ;
background-size: 25px 25px;
background-repeat:no-repeat;
background-position:3px 50%;
float: right;
}
.crud-botao.editar,
.crud-botao.editar:hover{
background-image:url(../images/icons/pencil_32.png) ;
background-size: 25px 25px;
background-repeat:no-repeat;
background-position:3px 50%;
}
.crud-botao.excluir,
.crud-botao.excluir:hover{
background-image:url(../images/icons/close_32.png) ;
background-size: 25px 25px;
background-repeat:no-repeat;
background-position:3px 50%;
}
.crud-botao.desbloquear,
.crud-botao.desbloquear:hover{
background-image:url(../images/icons/lock_open_32.png) ;
background-size: 25px 25px;
background-repeat:no-repeat;
background-position:3px 50%;
padding: 0 0 0 20px;
}
.row-buttons{
margin-top:10px;
}
/*
#
# ESTILO PADRÃO
#
*/
div.form
{
}
div.form input{
}
div.form textarea{
}
div.form select
{
margin: 0.2em 0 0.5em 0;
}
div.form fieldset
{
padding: 10px;
border-radius: 8px 8px 8px 8px;
border: 1px solid #CCCCCC;
box-shadow: 0 0 1px rgba(0, 0, 0, 0.5) inset, 0 1px 0 rgba(255, 255, 255, 0.7);
margin: 0 0 22px;
}
legend {
background-color: #095D92;
color: #FFFFFF;
font-size: 1.1em;
font-weight: bold;
padding: 4px 8px;
border-radius: 8px 8px 8px 8px;
}
div.form label
{
/*font-weight: bold;
font-size: 0.9em;
display: block;
*/
}
div.form .row
{
margin: 5px 0;
border-bottom: 1px dashed #CCCCCC;
}
div.form .hint
{
margin: 0;
padding: 0;
color: #999;
}
div.form .note
{
font-style: italic;
}
div.form span.required
{
background-image: url("../images/required.gif");
background-position: 0 50%;
background-repeat: no-repeat;
color: red;
margin: 5px;
padding: 14px;
}
div.form div.error label:first-child,
div.form label.error,
div.form span.error
{
color: #C00;
}
div.form div.error input,
div.form div.error textarea,
div.form div.error select,
div.form input.error,
div.form textarea.error,
div.form select.error
{
background: #FEE;
border-color: #C00;
}
div.form div.success input,
div.form div.success textarea,
div.form div.success select,
div.form input.success,
div.form textarea.success,
div.form select.success
{
background: #E6EFC2;
border-color: #C6D880;
}
div.form .errorSummary
{
background-image: url(../images/exclamation.png);
background-position: 15px center;
background-repeat: no-repeat;
border: 2px solid #EB5339;
background-color: #FCCAC2;
color: #AC260F;
padding: 7px 7px 12px 7px;
/*
border: 2px solid #C00;
padding: 7px 7px 12px 7px;
margin: 0 0 20px 0;
background: #FEE;
font-size: 0.9em;
*/
margin-bottom:10px;
min-height: 70px;
}
div.form .errorMessage
{
color: red;
font-size: 0.9em;
}
div.form .errorSummary p
{
margin: 0;
padding: 5px;
}
div.form .errorSummary ul
{
margin: 0;
padding: 0 0 0 50px;
list-style:none
}
div.wide.form label
{
float: left;
margin-right: 10px;
position: relative;
text-align: right;
width: 100px;
}
div.wide.form .row
{
clear: left;
}
div.wide.form .buttons, div.wide.form .hint, div.wide.form .errorMessage
{
clear: left;
padding-left: 110px;
}
*/
/* disable selection for extrarows */
.grid-view td.extrarow
{
background: none repeat scroll 0 0 #F8F8F8;
}
/* checkcoxes */
.tzCheckBox{
background:url('../images/switcher.png') no-repeat right bottom;
display:inline-block;
/*min-width:60px;*/
height:23px;
white-space:nowrap;
position:relative;
cursor:pointer;
margin-left:14px;
margin-bottom: 0px;
margin-top: 0px;
top: -5px;
}
.tzCheckBox.checked{
background-position:0 6px;
/*margin:0 14px 10px 0;*/
}
.tzCheckBox {
/*
color: white;
line-height: 31px;
padding-right: 38px;
text-align: right;
*/
}
.tzCBContent{
color: white;
line-height: 31px;
padding-right: 38px;
text-align: right;
}
.tzCheckBox.checked {
text-align:left;
/*padding:0 0 0 38px;*/
}
.tzCBContent{
/*
text-align:left;
padding:0 0 0 38px;
*/
}
.tzCBPart{
/* background:url('../images/background.png') no-repeat left bottom; */
/*width:14px;
position:absolute;
top:0;
left:-14px;
height:27px;
overflow: hidden;*/
}
.tzCheckBox.checked .tzCBPart{
background-position:top right;
left:auto;
right:-14px;
}
label.check{
position: relative;
top: -8px;
font-size:12px;
color: #333333;
font-weight:bold;
padding-left: 10px;
}
/* teste login */
a.hiddenanchor{
display: none;
}
/** The wrapper that will contain our two forms **/
#wrapper{
width: 60%;
right: 0px;
min-height: 560px;
margin: 0px auto;
width: 500px;
position: relative;
}
/**** Styling the form elements **/
/**** general text styling ****/
#wrapper a{
color: rgb(95, 155, 198);
text-decoration: underline;
}
#wrapper h1{
font-size: 20px;
color: rgb(6, 106, 117);
padding: 2px 0 10px 0;
font-family: 'FranchiseRegular','Arial Narrow',Arial,sans-serif;
font-weight: bold;
text-align: center;
padding-bottom: 30px;
background-image:none;
}
/** For the moment only webkit supports the background-clip:text; */
#wrapper h1{
background: -webkit-repeating-linear-gradient(-45deg,
rgb(18, 83, 93) ,
rgb(18, 83, 93) 20px,
rgb(64, 111, 118) 20px,
rgb(64, 111, 118) 40px,
rgb(18, 83, 93) 40px);
-webkit-text-fill-color: transparent;
-webkit-background-clip: text;
}
#wrapper h1:after{
content: ' ';
display: block;
width: 100%;
height: 2px;
margin-top: 10px;
background: -moz-linear-gradient(left, rgba(147,184,189,0) 0%, rgba(147,184,189,0.8) 20%, rgba(147,184,189,1) 53%, rgba(147,184,189,0.8) 79%, rgba(147,184,189,0) 100%);
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(147,184,189,0)), color-stop(20%,rgba(147,184,189,0.8)), color-stop(53%,rgba(147,184,189,1)), color-stop(79%,rgba(147,184,189,0.8)), color-stop(100%,rgba(147,184,189,0)));
background: -webkit-linear-gradient(left, rgba(147,184,189,0) 0%,rgba(147,184,189,0.8) 20%,rgba(147,184,189,1) 53%,rgba(147,184,189,0.8) 79%,rgba(147,184,189,0) 100%);
background: -o-linear-gradient(left, rgba(147,184,189,0) 0%,rgba(147,184,189,0.8) 20%,rgba(147,184,189,1) 53%,rgba(147,184,189,0.8) 79%,rgba(147,184,189,0) 100%);
background: -ms-linear-gradient(left, rgba(147,184,189,0) 0%,rgba(147,184,189,0.8) 20%,rgba(147,184,189,1) 53%,rgba(147,184,189,0.8) 79%,rgba(147,184,189,0) 100%);
background: linear-gradient(left, rgba(147,184,189,0) 0%,rgba(147,184,189,0.8) 20%,rgba(147,184,189,1) 53%,rgba(147,184,189,0.8) 79%,rgba(147,184,189,0) 100%);
}
#wrapper p{
margin-bottom:15px;
}
#wrapper p:first-child{
margin: 0px;
}
#wrapper label{
color: rgb(64, 92, 96);
position: relative;
}
/**** advanced input styling ****/
/* placeholder */
::-webkit-input-placeholder {
color: rgb(190, 188, 188);
font-style: italic;
}
input:-moz-placeholder,
textarea:-moz-placeholder{
color: rgb(190, 188, 188);
font-style: italic;
}
input {
outline: none;
}
/* all the input except submit and checkbox */
#wrapper input:not([type="checkbox"]){
width: 92%;
margin-top: 4px;
padding: 10px 5px 10px 32px;
border: 1px solid rgb(178, 178, 178);
-webkit-appearance: textfield;
-webkit-box-sizing: content-box;
-moz-box-sizing : content-box;
box-sizing : content-box;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.6) inset;
-moz-box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.6) inset;
box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.6) inset;
-webkit-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
transition: all 0.2s linear;
background-image: url("../images/icons/user.png");
background-position: 10px center;
background-repeat: no-repeat;
}
/** the magic icon trick ! **/
[data-icon]:after {
content: attr(data-icon);
font-family: 'FontomasCustomRegular';
color: rgb(106, 159, 171);
position: absolute;
left: 10px;
top: 35px;
width: 30px;
}
/*styling both submit buttons */
#wrapper p.button input{
width: 15%;
cursor: pointer;
background: rgb(61, 157, 179);
padding: 8px 5px;
font-family: 'BebasNeueRegular','Arial Narrow',Arial,sans-serif;
color: #fff;
font-size: 14px;
border: 1px solid rgb(28, 108, 122);
margin-bottom: 10px;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.07) inset,
0px 0px 0px 3px rgb(254, 254, 254),
0px 5px 3px 3px rgb(210, 210, 210);
-moz-box-shadow:0px 1px 6px 4px rgba(0, 0, 0, 0.07) inset,
0px 0px 0px 3px rgb(254, 254, 254),
0px 5px 3px 3px rgb(210, 210, 210);
box-shadow:0px 1px 6px 4px rgba(0, 0, 0, 0.07) inset,
0px 0px 0px 3px rgb(254, 254, 254),
0px 5px 3px 3px rgb(210, 210, 210);
-webkit-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
transition: all 0.2s linear;
}
#wrapper p.button input:hover{
background: rgb(74, 179, 198);
}
#wrapper p.button input:active,
#wrapper p.button input:focus{
background: rgb(40, 137, 154);
position: relative;
top: 1px;
border: 1px solid rgb(12, 76, 87);
-webkit-box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.2) inset;
-moz-box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.2) inset;
box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.2) inset;
}
p.login.button,
p.signin.button{
text-align: right;
margin: 5px 0;
}
/* styling the checkbox "keep me logged in"*/
.keeplogin{
margin-top: -5px;
}
.keeplogin input,
.keeplogin label{
display: inline-block;
font-size: 12px;
font-style: italic;
}
.keeplogin input#loginkeeping{
margin-right: 5px;
}
.keeplogin label{
width: 80%;
}
/*styling the links to change from one form to another */
p.change_link{
position: absolute;
color: rgb(127, 124, 124);
left: 0px;
height: 20px;
width: 440px;
padding: 17px 30px 20px 30px;
font-size: 16px ;
text-align: right;
border-top: 1px solid rgb(219, 229, 232);
-webkit-border-radius: 0 0 5px 5px;
-moz-border-radius: 0 0 5px 5px;
border-radius: 0 0 5px 5px;
background: rgb(225, 234, 235);
background: -moz-repeating-linear-gradient(-45deg,
rgb(247, 247, 247) ,
rgb(247, 247, 247) 15px,
rgb(225, 234, 235) 15px,
rgb(225, 234, 235) 30px,
rgb(247, 247, 247) 30px
);
background: -webkit-repeating-linear-gradient(-45deg,
rgb(247, 247, 247) ,
rgb(247, 247, 247) 15px,
rgb(225, 234, 235) 15px,
rgb(225, 234, 235) 30px,
rgb(247, 247, 247) 30px
);
background: -o-repeating-linear-gradient(-45deg,
rgb(247, 247, 247) ,
rgb(247, 247, 247) 15px,
rgb(225, 234, 235) 15px,
rgb(225, 234, 235) 30px,
rgb(247, 247, 247) 30px
);
background: repeating-linear-gradient(-45deg,
rgb(247, 247, 247) ,
rgb(247, 247, 247) 15px,
rgb(225, 234, 235) 15px,
rgb(225, 234, 235) 30px,
rgb(247, 247, 247) 30px
);
}
#wrapper p.change_link a {
display: inline-block;
font-weight: bold;
background: rgb(247, 248, 241);
padding: 2px 6px;
color: rgb(29, 162, 193);
margin-left: 10px;
text-decoration: none;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
border: 1px solid rgb(203, 213, 214);
-webkit-transition: all 0.4s linear;
-moz-transition: all 0.4s linear;
-o-transition: all 0.4s linear;
-ms-transition: all 0.4s linear;
transition: all 0.4s linear;
font-size:12px;
}
#wrapper p.change_link a:hover {
color: rgb(57, 191, 215);
background: rgb(247, 247, 247);
border: 1px solid rgb(74, 179, 198);
}
#wrapper p.change_link a:active{
position: relative;
top: 1px;
}
/** Styling both forms **/
#register,
#login{
position: absolute;
top: 0px;
width: 88%;
padding: 18px 6% 70px 6%;
margin: 0 0 35px 0;
background: rgb(247, 247, 247);
border: 1px solid rgba(147, 184, 189,0.8);
-webkit-box-shadow: 0pt 2px 5px rgba(105, 108, 109, 0.7), 0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset;
-moz-box-shadow: 0pt 2px 5px rgba(105, 108, 109, 0.7), 0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset;
box-shadow: 0pt 2px 5px rgba(105, 108, 109, 0.7), 0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset;
-webkit-box-shadow: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
#register{
z-index: 21;
opacity: 0;
}
#login{
z-index: 22;
}
#toregister:target ~ #wrapper #register,
#tologin:target ~ #wrapper #login{
z-index: 22;
-webkit-animation-name: fadeInLeft;
-moz-animation-name: fadeInLeft;
-ms-animation-name: fadeInLeft;
-o-animation-name: fadeInLeft;
animation-name: fadeInLeft;
-webkit-animation-delay: .1s;
-moz-animation-delay: .1s;
-o-animation-delay: .1s;
-ms-animation-delay: .1s;
animation-delay: .1s;
}
#toregister:target ~ #wrapper #login,
#tologin:target ~ #wrapper #register{
-webkit-animation-name: fadeOutLeft;
-moz-animation-name: fadeOutLeft;
-ms-animation-name: fadeOutLeft;
-o-animation-name: fadeOutLeft;
animation-name: fadeOutLeft;
}
/** the actual animation, credit where due : http://daneden.me/animate/ ***/
.animate{
-webkit-animation-duration: 0.5s;
-webkit-animation-timing-function: ease;
-webkit-animation-fill-mode: both;
-moz-animation-duration: 0.5s;
-moz-animation-timing-function: ease;
-moz-animation-fill-mode: both;
-o-animation-duration: 0.5s;
-o-animation-timing-function: ease;
-o-animation-fill-mode: both;
-ms-animation-duration: 0.5s;
-ms-animation-timing-function: ease;
-ms-animation-fill-mode: both;
animation-duration: 0.5s;
animation-timing-function: ease;
animation-fill-mode: both;
}
/** yerk some ugly IE fixes 'cause I know someone will ask "why does it look ugly in IE?", no matter how many warnings I will put in the article */
.lt8 #wrapper input{
padding: 10px 5px 10px 32px;
width: 92%;
}
.lt8 #wrapper input[type=checkbox]{
width: 10px;
padding: 0;
}
.lt8 #wrapper h1{
color: #066A75;
}
.lt8 #register{
display: none;
}
.lt8 p.change_link,
.ie9 p.change_link{
position: absolute;
height: 90px;
background: transparent;
}
/*resumo*/
#resumoCliente{
background-color: #F4F4F4;
border: 1px solid #FFFFFF;
border-radius: 5px 5px 5px 5px;
box-shadow: 0 0 3px #AAAAAA;
clear: both;
float: left;
margin: 5px 0 5px 90px;
padding: 10px;
width: 500px;
}
.resultado{
width: 150px;
float:left;
text-align:left;
}
.tituloresultado{
float:left ;
min-width:250px ;
font-weight:bold ;
text-align:right;
margin-right: 10px;
}
/* ocultar obrigatorios */
.af-form {
}
.af-outer {
overflow: hidden;
/*height: 50px;*/
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
-o-transition: all 0.5s linear;
-ms-transition: all 0.5s linear;
transition: all 0.5s linear;
max-width: 700px;
}
.af-inner {
-webkit-transform-origin: center top;
-moz-transform-origin: center top;
-o-transform-origin: center top;
-ms-transform-origin: center top;
transform-origin: center top;
-webkit-transform: scale(1);
-moz-transform: scale(1);
-o-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
-o-transition: all 0.5s linear;
-ms-transition: all 0.5s linear;
transition: all 0.5s linear;
max-width: 700px;
}
#af-showreq:checked ~ .af-form .af-outer:not(.af-required) {
height: 0px;
visibility: hidden;
}
#af-showreq:checked ~ .af-form .af-outer:not(.af-required) .af-inner {
-webkit-transform: scale(0);
-moz-transform: scale(0);
-o-transform: scale(0);
-ms-transform: scale(0);
transform: scale(0);
opacity: 0;
}
#af-showreq:checked ~ .af-form .af-outer:not(.af-required) {
height: 0px;
visibility: hidden;
}
.af-show {
position: absolute;
top: 7px;
right: 15px;
cursor: pointer;
padding: 3px 0px;
width: 190px;
text-align: center;
font-weight: bold;
border: 1px solid #A8BC65;
color: #6d7649;
border-radius: 4px;
background: #e4efc0;
text-shadow: 0px 1px 1px rgba(255,255,255,0.4);
background: #cae082;
background: -moz-linear-gradient(top, #cae082 0%, #abbd73 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cae082), color-stop(100%,#abbd73));
background: -webkit-linear-gradient(top, #cae082 0%,#abbd73 100%);
background: -o-linear-gradient(top, #cae082 0%,#abbd73 100%);
background: -ms-linear-gradient(top, #cae082 0%,#abbd73 100%);
background: linear-gradient(top, #cae082 0%,#abbd73 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cae082', endColorstr='#abbd73',GradientType=0 );
box-shadow: 0 1px 2px rgba(0,0,0,0.2);
}
.af-show-input:checked ~ .af-show {
background: #cae082;
color: #535B31;
box-shadow: 0 1px 2px rgba(255,255,255,0.6);
}
/*
.testelabel {
display: block;
display: -webkit-box;
display: -moz-box;
display: box;
-moz-box-orient: horizontal;
-moz-box-pack: end;
-moz-box-align: center;
-webkit-box-orient: horizontal;
-webkit-box-pack: end;
-webkit-box-align: center;
box-orient: horizontal;
box-pack: end;
box-align: center;
font-size: 11px;
color: #888;
letter-spacing: 3px;
text-align: right;
text-transform: uppercase;
text-shadow: 1px 1px 1px rgba(255,255,255,0.6);
width:200px;
height: 30px;
position:absolute;
top:15px;
right:10px;
}
*/
/* ========= RODRIGO ========== */
/* CAPTCHA */
.captchaCorpoEsquerda
{
float: left; width: 140px;
}
.captchaCorpoDireita
{
float: left; margin-top: 16px; width: 340px;
}
.captchaCorpoDireitaBoxE
{
float: left; width: 340px;
}
.captchaCorpoDireitaBoxD
{
float: left; width: 340px; margin-top: -15px;
}
.bordaImgCAtArea
{
background: #ffffff; border: solid 1px #cccccc; margin-top: 15px; padding: 5px; width: 34px;
}
.bordaImgProfissional
{
background: #ffffff; border: solid 1px #cccccc; margin-top: 15px; padding: 5px; width: 166px;
}
.boxPreenchimento
{
position: absolute; top: 556px;
}
.boxColorPickAreas
{
position: relative; margin-top: -30px; top: 18px;
}