﻿/* ****************************** */
/* DEFINIÇÕES DE TODA A APLICAÇÃO */
*{
    margin:0;  /* retirar margin */
    padding:0; /* retirar padding */
}
/* FIM DEFINIÇÕES DE TODA A APLICAÇÃO */

/* *************************** */
/* DEFINIÇÕES PARA HTML E BODY */
html, body {
    font:12px "Trebuchet MS", Arial, Helvetica, sans-serif; /* tamanho de letra e tipo de letra a utilizar*/
    color: black;                                           /* cor do texto a preto */
}
/* FIM DEFINIÇÕES PARA HTML E BODY*/

/* ***************** */
/* DEFINIÇÕES HEADER */
#header{
    height: 10vh;                       /* Altura: 10 VH */
    margin-top:1vh;                     /* Margin Top: 1 VH*/
    margin-left:auto;                   /* Margin Left: Auto (para que o header fique centrado na página) */
    margin-right:auto;                  /* Margin Right: Auto (para que o header fique centrado na página) */
    width:70vw;                         /* Largura: 70 vw */
    border-bottom: 2px dotted silver;   /* Border Botton: com 2 px, pontos e cinzenta*/
}
/* FIM DEFINIÇÕES DO HEADER*/

/* ********************* */
/* DEFINIÇÕES LEFT HEADER*/
#left_header{
    width:50%;      /* largura: 50% */
    float:left;     /* float: left */
    height:100%;    /* altura: 100% */
}
/* FIM DEFINIÇÕES LEFT HEADER */

/* *********************** */
/* DEFINIÇÕES RIGHT HEADER */
#right_header{
    width:50%;          /* largura: 50% */
    float: left;        /* float: left */
    height:100%;        /* altura: 100% */
    text-align:right;   /* alinhamento do texto à direita*/
}
/* FIM DEFINIÇOES RIGHT HEADER */

/* ****************** */
/* DEFINIÇÕES DO MENU */
#menu{
     margin-left:auto;      /* margem esquerda: auto (para que o conteudo fique centrado na pagina */
     margin-right:auto;     /* margem direira: auto (para que o conteudo fique centrado na pagina */
     width: 70vw;           /* largura: 70 vw */
     height:5vh;            /* altura: 5 vh */
}
/* FIM DEFINIÇÕES DO MENU*/

/* ******************************* */
/* DEFINIÇÕES CONTEUDO DAS PAGINAS */
#content
{
    position:relative;                  /* posição: relagtiva */
    width: 70vw;                        /* largura: 70 vw */
    height:80vh;                        /* altura: 80 vh */
    margin-left:auto;                   /* margem esquerda: auto (para que o conteudo fique centrado na pagina) */
    margin-right:auto;                  /* margem direira: auto (para que o conteudo fique centrado na pagina) */
    overflow: auto;                     /* overflow: auto (para que esteja disponivel o scroll no conteuto */
                                        /* Duas linhas abaixo foram acrescentadas para que funcione no IPHONE*/
    overflow-y: scroll;                 /* tem de ser scroll, não pode ser auto */
   -webkit-overflow-scrolling: touch;   /* para que funcione o scroll com o touch */
}
/* FIM DEFINIÇÕES CONTEUDO DAS PAGINAS */

/* ********************* */
/*  DEFINIÇÕES DO FOOTER */
#footer
{
    border-top: 2px dotted silver;  /* border top com 2 px, pontos e cinzenta*/
    width: 70vw;                    /* lagura: 70 vw */
    margin-left:auto;               /* margem esquerda: auto (para o conteudo ficar centrado na página) */
    margin-right:auto;              /* margem direita: auto (para o conteudo ficar centrado na página) */
    text-align:center;              /* alinhamento central do texto na página*/
    height: 5vh;                    /* altura: 5vh */
}
/* FIM DEFINIÇÕES DO FOOTER */


/* ******************* */
/* DEFINIÇOES CONTEUDO */
.conteudo{
    position:relative;      /* posição: relativa */
    margin:auto;            /* margem: auto (para centrar o conteudo na pagina) */
    width:55vw;             /* largura: 55 vw */
    overflow: auto;         /* overflow: auto (para mostrar scroll no conteudo) */
    height: 100%;           /* altura: 100% */
}
/* FIM DEFINIÇÕES CONTEUDO */

/* ****************** */
/* DEFINIÇÕES LEFT UP */
.leftUp{
    width:30vw;         /* largura: 30 vw */
    overflow: auto;     /* overflow: auto (para centrar os conteudos) */
    height:40vh;        /* altura: 40 vh */
    float: left         /* float: left */
}
/* FIM DEFINIÇÕES LEFT UP */

/* ************** */
/* DEFINIÇÃO LEFT */
.left{
    width:45vw;     /* largura: 45 vw */
    float: left     /* float: left */
}
/* FIM DEFINIÇÃO LEFT */

/* ****************** */
/* DEFINIÇÃO RIGHT UP */
.rightUp{
    margin-left:8vw;        /* margem esquerda: 8 vw */
    height:40vh;            /* altura: 40 vh */
    width:30vw;             /* largura: 30 vw */
    overflow: auto;         /* overflow: auto (para mostrar o scroll)*/
    float: left             /* float left */
}
/* FIM DEFINIÇÃO RIGHT UP */

/* **************** */
/* DEFINIÇÕES RIGHT */
.right{
    margin-left:5vw;        /* margem esquerda: 5 vw */
    width:20vw;             /* largura: 20 vw */
    float: left             /* float left */
}
/* FIM DEFINIÇÕES RIGHT */

/* ************* */
/* DEFINIÇÕES H3 */
 h3{
    color: #0095CC;                         /* cor: cinzento*/
    width:100%;                             /* largura: 100% */
    border-bottom: 1px dotted #0095CC;      /* limite inferior 1 px, como pontos e cinzento*/
}
 /* FIM DEFINIÇÕES H3 */

/* ************* */
/* DEFINIÇÕES H2 */
 h4{
    color: silver;                         /* cor: azul*/
    width:100%;                             /* largura: 100% */
    border-bottom: 1px dotted silver;      /* limite inferior 1 px, como pontos e azul*/
 }
/* FIM DEFINIÇÕES H2 */

/* ********************** */
/* DEFINIÇÕES LABELMASTER */
 .labelMaster{
     padding-right:10px;    /* paddding direira: 10 px*/
 }
 /* FIM DEFINIÇÕES LABEL MASTER*/

 /* **************** */
 /* DEFINIÇÕES LABEL */
.label{
    padding-left:2vw;       /* padding left 2 vw */
    display:block;          /* display block */
    width:8vw;              /* largura 8 vw */
    float:left;             /* float left */
    margin-top:0.5vh;       /* margem para o topo: 0.5 vh*/
}
/* FIM DEFINIÇÕES LABEL */

/* ********************* */
/* DEFINIÇÕES LABELERROR */
.labelError{
    color:red;          /* cor vermelha */
    margin-top:0.5vh;   /* margem para o topo 0.5 vh */
}
/* FIM DEFINIÇÕES LABEL ERROR*/

/* ********************** */
/* DEFINIÇÕES LABELERROR2 */
.labelError2{
    color:red;              /* cor vermelha */
    margin-top:0.5vh;       /* margem para o topo 0.5 vh */
    padding-left: 12vw;     /* padding esquerda 12 vw */
}
/* FIM DEFINIÇÕES LABELERROR2 */

/* **************** */
/* DEFINIÇÕES TEXTO */
.texto{
    width:20vw;         /* largura: 20 vw */
    color: black;       /* cor preta */
    margin-top:0.5vh;   /* margem para o topo 0.5 vh */
}
/* FIM DEFINIÇÕES TEXTO*/

/* ***************** */
/* DEFINIÇÕES TEXTO2 */
.texto2{
    width:8vw;          /* largura 8 vw */
    color: black;       /* cor preta */
    margin-top:0.5vh;   /* margem para o topo 0.5 vh */
}
/* FIM DEFINIÇÕES TEXTO2*/

/* ***************** */
/* DEFINIÇÕES TEXTO3 */
.texto3{
    width:2vw;                  /* largura: 2 vw */
    color: silver;              /* cor cinzento */
    margin-top:0.5vh;           /* margem para o topo 0.5 vh */
    text-transform: uppercase;  /* letras sempre maiusculas */
}
/* FIM DEFINIÇÕES TEXTO3 */


/* ***************** */
/* DEFINIÇÕES TEXTO4 */
.texto4{
    width:11vw;          /* largura 11 vw */
    color: black;       /* cor preta */
    margin-top:0.5vh;   /* margem para o topo 0.5 vh */
}
/* FIM DEFINIÇÕES TEXTO4*/

/* ***************** */
/* DEFINIÇÕES TEXTO5 */
.texto5{
    width:6vw;          /* largura 6 vw */
    color: black;       /* cor preta */
    margin-top:0.5vh;   /* margem para o topo 0.5 vh */
}
/* FIM DEFINIÇÕES TEXTO5*/




/* ***************** */
/* DEFINIÇÕES BOTOES */
.botoes {
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) );
	background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
	background-color:#ededed;
	-webkit-border-top-left-radius:20px;
	-moz-border-radius-topleft:20px;
	border-top-left-radius:20px;
	-webkit-border-top-right-radius:20px;
	-moz-border-radius-topright:20px;
	border-top-right-radius:20px;
	-webkit-border-bottom-right-radius:20px;
	-moz-border-radius-bottomright:20px;
	border-bottom-right-radius:20px;
	-webkit-border-bottom-left-radius:20px;
	-moz-border-radius-bottomleft:20px;
	border-bottom-left-radius:20px;
	text-indent:0;
	border:1px solid #dcdcdc;
	display:inline-block;
	color:#777777;
	font-family:Georgia;
	font-size:12px;
	font-weight:bold;
	font-style:normal;
	height:30px;
	line-height:30px;
    min-width:5vw;
	text-decoration:none;
	text-align:center;
	text-shadow:1px 1px 0px #ffffff;
}
/* FIM DEFINIÇÕES BOTÕES */

/* ******************************** */
/* DEFINIÇÕES BOTOES:HOVER E ACTIVE */
.botoes:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed) );
	background:-moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed');
	background-color:#dfdfdf;
}
.botoes:active {
	position:relative;
	top:1px;
}
 /* FIM DEFINIÇÕES BOTOES: HOVER E ACTIVE */

 /* **************** */
 /* DEFINIÇÕES LOCAL */
 .local{
    padding-left:10px;
    padding-right:20px;
    width:8vw;
    display:inline;
}
 /* FIM DEFINIÇÕES LOCAL */

 /* **************** */
 /* DEFINIÇÕES CHECK */
 .check{
    padding-left:2vw;
    display:block;
    width:20vw;
    float:left;
    margin-top:0.5vh;
}
 /* FIM DEFINIÇÕES CHECK */
 
 /* ********************** */
 /* DEFINIÇÕES CHECK LABEL */
 .check label{
      margin-right: 20px;
 }
 /* FIM DEFINIÇÕES CHECK LABEL */

 /* ********************** */
 /* DEFINIÇÕES CHECK INPUT */
 .check input{
      margin-top:0.5vh;
 }
 /* FIM DEFINIÇÕES CHECK INPUT */



