/*========= NORMALIZACAO ==========*/
	*{ padding: 0px; margin: 0px; font-family: Arial; }
	.clear{ clear: both; }

/*=================BODY====================*/
	body{ width: 100%; margin: 0 auto; }
	.voltar{
		display: none;
		position: fixed;
		width: 40px;
		height: 40px;
		bottom: 0;
		right: 0;
		margin: 0 10px 10px 0;
		background: url(../imagens/seta.png) no-repeat center;
		background-size: 100% auto;
		-webkit-border-radius: 2px;
	   	-moz-border-radius: 2px;
        border-radius: 2px;
		opacity: 0.5;
		filter: Alpha(opacity=50);
		z-index: 2;
		outline: none;
		border: none;
	}
	.voltar:hover{
		cursor: pointer;
		opacity: 1;
		filter: Alpha(opacity=100);
		-webkit-transition: .2s;
		   -moz-transition: .2s;
		        transition: .2s;
	}
	/*============ACESSIBILIDADE===============*/
	.acessibilidade{ width: 960px; margin: 2.5px auto; }
	.acessibilidade #img-acessibilidade{
		height: 40px;
		width: 180px;
		background: url(../imagens/img-acessibilidade.png) no-repeat center;
		background-size: 100% auto;
		display: inline-block;
		vertical-align: middle;
	}
	.acessibilidade input{ 
		background-color: #808aff;
		color: #fff;
		width: 40px; 
		height: 36px; 
		outline: none; 
		border: none;
		-webkit-border-radius: 2px;
		   -moz-border-radius: 2px;
		        border-radius: 2px;
		margin: 0px 5px; 
	}
	.acessibilidade input:hover{ 
		cursor: pointer; 
		background-color: #9cc7e4; 
	}
/*================HEADER===================*/
	header{ 
		height: 350px; 
		width: 100%;
		background-color: #E1EAF9;
	}
	header #header-div{
		width: 960px;
		margin: 0 auto;
		height: 350px;
	}
	header #header-div #logotipo{
		width: 950px;
		height: 100%;
		background: url(../imagens/CABEÇALHOCEAPCD.jpeg) no-repeat center;
		margin-left: 0%;
		background-size: 100% auto;
	}
	.menu_fixo{
		position: fixed;
		top: 0;
		left: 0;
		z-index: 1000;
		-webkit-box-shadow: 0px 5px 10px 0px rgba(50, 50, 50, 0.3);
  		   -moz-box-shadow: 0px 5px 10px 0px rgba(50, 50, 50, 0.3);
  				box-shadow: 0px 5px 10px 0px rgba(50, 50, 50, 0.3);
	}
/*=================MENU====================*/
	#menu .link{ 
		list-style: none; 
		display: inline-block; 
		margin: 10px 2.5px; 
		line-height: 40px;
		background-color: #808aff;
		text-align: center;
		-webkit-border-radius: 2px;
		   -moz-border-radius: 2px;
		        border-radius: 2px;
	}
	#menu .ativo{ 
		list-style: none; 
		display: inline-block; 
		margin: 10px 2.5px; 
		line-height: 40px;
		background-color: #9cc7e4;
	}
	#cert{
		list-style: none;
	    display: inline-block;
	    margin: 10px 2.5px;
	    line-height: 40px;
	    background-color: #808aff;
	    text-align: center;
	    -webkit-border-radius: 2px;
	    -moz-border-radius: 2px;
	    border-radius: 2px;

	}
	#menu .link:hover{
		background-color: #9cc7e4; 
	}
	#menu a:link{ text-decoration: none; color: #FFF; }
	#menu a:visited{ color: #fff; }
	#menu a{
		/*display: block;*/
		height: 40px;
		width: 130px;
		font-size: 14px;
		padding: 15px;
	}
	#menu{
		text-align: center;
	}
	nav{ 
		width: 100%;
		margin: 0; 
		height: 60px; 
		background-color: #c7d7e0;

	}
	#btn-menu-responsivo{
		display: none;
	}
	/*============CONTEUDO-LOGIN===============*/
	#box-login{
		width: 470px;
		height: 300px;
		margin: 0px auto 0 auto;
		background-color: #ccc;
		border-radius: 2px;
	}
	.div-usuario, .div-senha, .input-login{
		display: inline-block;
		vertical-align: top;
		height: 30px;
		border: none;
	}
	.input-login{
		width: 240px;
		padding: 5px;
		font-size: 22px;
		color: #777;
	}
	.input-login:focus{
		border: none;
		outline: none;
	}
	.div-usuario, .div-senha{
		width: 50px;
		height: 40px;
		border-radius: 30px 0 0 30px;
	}
	.div-usuario{
		background: url(../imagens/user.png) no-repeat center;
		background-size: auto 60%;
		background-color: #808AFF;
	}
	.div-senha{
		background: url(../imagens/lock.png) no-repeat center;
		background-size: auto 60%;
		background-color: #808AFF;
	}
	#usuario, #senha{
		width: 300px;
		margin: 20px auto 0 auto;
	}

	.conteudo > h1{
		text-align: center;
		font-weight: normal;
		display: block;
	}
	#div-btns-logar{
		width: 300px;
		margin: 20px auto;
		text-align: center;
		padding: 0;
	}
	.btn-logar, .btn-reset{
		width: 50%;
		display: inline-block;
		vertical-align: top;
		margin: 10px 0;
		outline: none;
		border: none;
		height: 40px;
		cursor: pointer;
		font-size: 18px;
		text-transform: uppercase;
		font-weight: normal;
		border-radius: 5px;
	}
	.btn-logar{
		border-radius: 2px 0 0 2px;
		background-color: #808AFF; 
		color: #fff;
	}
	.btn-reset{
		border-radius: 0 2px 2px 0;
		background-color: #999;
		color: #fff;
	}
	.btn-form-logar:hover{
		opacity: 0.8;
	}
/*===============CONTEUDO==================*/
	section{
		width: 100%;
		background-color: #c1d4f4;
	}
	section #conteudo{
		width: 960px;
		margin: 0 auto;
		padding: 20px 0;
		color: #000;
		text-align: justify;
		text-indent: inherit;
	}
	section #conteudo a:link, section #conteudo a:visited{
		color: #000080;
	}
	section #conteudo .text-center{
		text-align: center;
		font-weight: bold;
	}
	section #conteudo h1{
		color: #6e214e;
		font-weight: normal;
		text-align: center;
	}
	section #conteudo .titulo-azul, h3{
		display: block;
		color: #6e214e;
		font-weight: bold;
		display: block;
		margin: 0 0 5px 0;
	}
	section #conteudo p{
		margin: 20px 0;
		line-height: 20px;
	}
	/***************Formulario***************/
	select#recur{
	width:40%;
	height:30px;	
		
		
	}
	
	section form{
		width: 500px;
		margin: 0 auto;
	}
	::-webkit-input-placeholder {
	   color: #777;
	}

	:-moz-placeholder {
	   color: #777;
	}

	::-moz-placeholder {
	   color: #777;
	}
	:-ms-input-placeholder {  
	   color: #777;
	 }
	section .form input[type=radio]{
		/*display: block;*/
		cursor: pointer;
		margin: 0 5px 0 10px;
	}
	section .form input[type=text], section .form input[type=email]{
		margin: 2px 0 10px 0;
		width: 500px;
		height: 30px;
		padding: 2.5px 5px;
		-webkit-border-radius: 2px;
		   -moz-border-radius: 2px;
		        border-radius: 2px;
		color: #666;
		border: 1px solid transparent;
	}
	section .form input[type=text]:focus, section .form input[type=email]:focus{
		border: 1px solid #8cb4cf;
	}



	section .form #btn-cep{
		display: inline-block;
		vertical-align: top;
	}
	section .form #input-cep{
		width: 360px;
	}
	section .form #btn-cep{
		margin-top: 2px;
		-webkit-border-radius: 2px;
		   -moz-border-radius: 2px;
		        border-radius: 2px;
		width: 120px;
		height: 37px;
		text-align: right;
		padding-right: 8px;
		background: url(../imagens/lupa-cep.png) no-repeat left center;
		background-size: auto 100%;
		background-color: #8cb4cf;
		border-bottom: 3px solid #7a9db4;
		color: #fff;
		text-transform: uppercase;
		cursor: pointer;
	}
	section .form #btn-cep:hover, section .form .btn-form:hover{
		background-color: #7a9db4;
	}
	section .form .btn-form{
		-webkit-border-radius: 2px;
		   -moz-border-radius: 2px;
		        border-radius: 2px;
		width: 150px;
		height: 50px;
		background-color: #8cb4cf;
		border-bottom: 3px solid #7a9db4;
		color: #fff;
		text-transform: uppercase;
		cursor: pointer;
	}
	.form table tr{
		text-align: left;
	}
	section .form p{
		text-align: center;
	}
	section .form .text-red{
		color: #f00;
		font-size: 20px;
	}
	/*============Area-Restrita================*/
	.logoff{
		float: left;
		line-height: 50px;
		padding-left: 20px;
	}
	.logoff img, 
	.logoff a, 
	.acessibilidade
	{
    	display: inline-block;
    	vertical-align: middle;
    }
    .logoff a, 
    .logoff a:link, 
    .logoff a:visited{
    	color: #808aff;
    	font-weight: bold;
    }
    .tb-cont-vis tr td, .tb-cont, .tb-cont tr td{		
		background-color: #eee;
		padding: 10px  !important;
		color: #000 !important;
		border: 1px solid rgba(0, 0, 0, 0.1);
	}
	.tb-cont-vis th, .tb-cont th{
		background-color: #eee;
		padding: 10px;
		color: #000;
	}
	.tb-cont-vis:first-letter, .tb-cont:first-letter{
		font-size: 16px;
	}
	.tb-cont-vis, .tb-cont{
		width: 960px;
		margin: 0 auto;
	}
	.tb-cont-vis td a, .bt-voltar,bt-exportar{
		text-decoration: none;
	}
        
        #div-btns-exportar{
		width: 300px;
		margin: 20px auto;
		text-align: center;
		padding: 0;
	}
	.bt-exportar, .bt-voltar {
		width: 50%;
		display: inline-block;
		vertical-align: top;
		margin:  10px 0px 10px -5px;
		outline: none;
		border: none;
		height: 40px;
		cursor: pointer;
		font-size: 18px;
		text-transform: uppercase;
		font-weight: normal;
		border-radius: 5px;
	}
	.bt-exportar{
		border-radius: 2px 0 0 2px;
		background-color: #808aff; 
		color: #fff;
		margin: 5px;
		width: 45%;
	}
	.bt-voltar{
		border-radius: 2px 0 0 2px;
		background-color: #058acf;
		color: #fff;
		margin: 5px;
		width: 45%;
                display: inline-block;
	}
	.bt-visualizar{
		border-radius: 2px 0 0 2px;
		background-color: #808aff;
		color: #fff;
		margin: auto;
		width: 70px;
                border: none;
                height: 30px;
		cursor: pointer;
	}
        .v-info{
            width: 60%;
            margin-left: auto;
            margin-right: auto;
        }
        .select-adm{
            width: 200px;
            height: 30px;
	    margin: 10px 10px 50px 140px;
                }
	/**********Certificado************/

	section #div-certificado{
		width: 500px;
		height: 180px;
		background-color: #a5b2b9;
		margin: 50px auto 0 auto;
		border-radius: 10px 180px 180px 10px;
		padding: 10px;
	}
	section #div-certificado #btn-certificado{
		-webkit-transition: .5s;
		   -moz-transition: .5s;
		        transition: .5s;
		outline: none;
		border: none;
		float: right;
		width: 160px;
		height: 160px;
		border-radius: 180px;
		margin: -170px 10px 10px 10px;
		cursor: pointer;
		background: url(../imagens/send.png) no-repeat top center;
		background-size: 50% auto;
		background-color: #9cc7e4;
		-webkit-box-shadow: 3px 3px 9px 0px rgba(50, 50, 50, 0.52);
		-moz-box-shadow:    3px 3px 9px 0px rgba(50, 50, 50, 0.52);
		box-shadow:         3px 3px 9px 0px rgba(50, 50, 50, 0.52);
		line-height: 210px;
		color: #5b97bf;
		font-size: 20px;
		text-transform: uppercase;
	}
	section #div-certificado #btn-certificado:hover{
		-webkit-box-shadow: -3px -3px 9px 0px rgba(50, 50, 50, 0.52);
		-moz-box-shadow:    -3px -3px 9px 0px rgba(50, 50, 50, 0.52);
		box-shadow:         -3px -3px 9px 0px rgba(50, 50, 50, 0.52);
		-webkit-transition: .5s;
		   -moz-transition: .5s;
		        transition: .5s;
	}
	section #div-certificado form{
		width: 300px;
		height: 160px;
		margin: 10px;
	}
	#div-certificado form .input-certificado{
		width: 90%;
		height: 30px;
		padding: 2.5px 5px;
		-webkit-border-radius: 2px;
		   -moz-border-radius: 2px;
		        border-radius: 2px;
		color: #666;
		border: 1px solid transparent;
	}
	#div-certificado form span{
		display: block;
		margin: 10px auto;
	}

/*================FOOTER===================*/
	footer{ min-height: 138px; width: 100%; background-color: #fff; }
	footer #rodape{ width: 960px; margin: 0 auto; min-height: 138px;; }
	footer #rodape #img-bandeira{
		background: url(../imagens/GovernoSP_SecretariaDosDireitosDaPessoaComDeficiencia_Vertical_cor.png) ;
		height: 138px;
		width: 138px;
		float: left;
                background-size: 115% auto;
                margin-top: 10px;
	}
	footer #rodape #img-secretaria{
		background: url(../imagens/GovernoSP_SecretariaDosDireitosDaPessoaComDeficiencia_Horizontal_cor.png) no-repeat center;
		background-size: 100% auto;
		height: 138px;
		width: 300px;
		float: right;
                margin-top: 23px;
	}
	footer #rodape #logotipo-rodape{
		width: 300px;
		height: 138px;
		float: right;
		background: url(../imagens/ceapcd.png) no-repeat center;
		background-size: 80% auto;
                margin-right: 90px;
	}

/*===============CONTRASTE=================*/
	.contraste{ background-color: #000;}
	.contraste section{ background-color: #eee; }
	.contraste #menu a:link{ color: #FFF; }
	.contraste #menu a:visited{ color: #FFF; }
	.contraste .acessibilidade input{ background-color: #FFF; color: #000; }
	.contraste footer{
		background-color: #fff;
	}
	.contraste #rodape #logotipo-rodape{
		background: url(../imagens/contraste/logotipo-contraste.png) no-repeat center;
		background-size: 100% auto;
	}
	.contraste .acessibilidade #img-acessibilidade{
		background: url(../imagens/contraste/img-acessibilidade-contraste.png) no-repeat center;
		background-size: 100% auto;
	}
	.contraste header{ 
		background-color: #fff;
	}
	.contraste nav{
		background-color: #666;
	}
	.contraste header #header-div #logotipo{
		background: url(../imagens/contraste/logotipo-contraste.png) no-repeat center;
		background-size: 100% auto;
	}
	.contraste #rodape #logotipo-rodape{
		background: url(../imagens/contraste/ceapcd-contraste.png) no-repeat center;
		background-size: 80% auto;
	}
	.contraste #menu .link{ 
		background-color: #888;
	}
	.contraste #menu .ativo{ 
		background-color: #aaa;
	}
	.contraste #menu .link:hover{
		background-color: #aaa; 
	}
	.contraste #menu a:link{ color: #FFF; }
	.contraste #menu a:visited{ color: #fff; }

	.contraste #rodape #img-bandeira{
		background: url(../imagens/contraste/rodape-bandeira-contraste.png) no-repeat left bottom;
	}
	.contraste #rodape #img-secretaria{
		background: url(../imagens/contraste/rodape-secretaria-contraste.png) no-repeat center;
		background-size: 100% auto;
	}
	.contraste .voltar{
		background: url(../imagens/contraste/seta-contraste.png) no-repeat center;
		background-size: 100% auto;
	}
	.contraste #conteudo .titulo-azul, .contraste #conteudo h1, .contraste #conteudo{
		color: #000 !important;
	}
	.contraste #conteudo a:link, .contraste #conteudo a:visited{
		color: #000 !important;
	}
	.contraste #div-certificado #btn-certificado{
		background: url(../imagens/send-contraste.png) no-repeat top center;
		background-size: 50% auto;
		background-color: #999;
		color: #fff;
	}
	.contraste #div-certificado{
		background-color: #777;
	}
	.contraste .form input{
		background-color: #fff;
	}
	.contraste .form input[type=text]:focus, .contraste .form input[type=email]:focus{
		border: 1px solid #888;
	}
	.contraste .form #btn-cep{
		background-color: #999;
		border-bottom: 3px solid #777;
		color: #fff;
	}
	.contraste .form #btn-cep:hover, .contraste .form .btn-form:hover{
		background-color: #777;
	}
	.contraste .form .btn-form{
		background-color: #999;
		border-bottom: 3px solid #777;
		color: #fff;
	}
	.contraste .form .text-red{
		color: #000;
	}

/*=============MEDIA QUERIES===============*/

@media screen and (max-width: 1200px) {

}

@media screen and (max-width: 1024px) {

}

@media screen and (max-width: 980px) {
	header #header-div,
	footer #rodape, 
	.acessibilidade{
		width: 100%;
	}
	/*********Cabecalho*********/
	header{ text-align: center; }
	header #ceapcd{
		display: none;
	}
	#header-div #logotipo{
		float: none !important;
		margin: 0 auto;
	}
	/*********Menu*********/
	#menu{
		display:none;
		background-color: #c7d7e0; 
		padding: 10px 0;
		position: relative;
		top: 70px;
		left: 0;
		width: 100%;
	}
	.contraste #menu{
		background-color: #666;
	}
	#menu .link{ 
		list-style: none; 
		display: block; 
		margin: 10px 5%; 
		line-height: 40px;
		background-color: #8cb4cf;
		text-align: left;
		-webkit-border-radius: 2px;
		   -moz-border-radius: 2px;
		        border-radius: 2px;
		width: 90%;
	}
	#menu .ativo{ 
		background-color: #9cc7e4;
	}
	#menu a{
		display: block;
		width: 90%;
		font-size: 14px;
		padding-left: 10%;
	}
	#btn-menu-responsivo{
		-webkit-transition: .5s;
		   -moz-transition: .5s;
		        transition: .5s;
		display: block;
		float: right;
		height: 50px;
		width: 50px;
		margin: 5px 10px;
		outline: none;
		border: none;
		background-color: transparent;
		background: url(../imagens/menu-responsivo.png) no-repeat center;
		background-size: 100% auto;
		cursor: pointer;

	}
	.menu-ativo #btn-menu-responsivo{
		background: url(../imagens/menu-responsivo-x.png) no-repeat center;
		background-size: 100% auto;
		-webkit-transform: rotate(180deg);
		   -moz-transform: rotate(180deg);
		        transform: rotate(180deg);
		-webkit-transition: .5s;
		   -moz-transition: .5s;
		        transition: .5s;
	}
	.contraste #btn-menu-responsivo{
		background: url(../imagens/contraste/menu-responsivo-contraste.png) no-repeat center;
		background-size: 100% auto;

	}
	.contraste .menu-ativo #btn-menu-responsivo{
		background: url(../imagens/contraste/menu-responsivo-x-contraste.png) no-repeat center;
		background-size: 100% auto;
	}
	/*********Conteudo*********/
	section #conteudo{
		width: 90%;
		margin: 0 auto;
		padding: 2% 5%;
	}
	/*********Form*********/
	#page-form form, section .form
	{
		width: 90%;
		margin: 0 auto;
		padding: 2% 5%;
	}
	section .form input[type=text], section .form input[type=email]{
		margin: 5px auto 10px auto!important;
		width: 100% !important;
		padding: 2.5px 0;
	}
	section .form #input-cep{
		width: 50% !important;
		margin-right: 10px !important;
	}
	section .form #btn-cep{
		margin-top: 4px;
		-webkit-border-radius: 2px;
		   -moz-border-radius: 2px;
		        border-radius: 2px;
		width: 40%;
	}
	
}
@media screen and (max-width: 768px) {
	footer #rodape #img-bandeira{
		display: none;
	}
	footer #rodape #logotipo-rodape{
		float: left;
	}
}
@media screen and (max-width: 630px) {
	footer #rodape #logotipo-rodape, 
	footer #rodape #img-secretaria{
		background-size: 85% auto;
		height: 138px;;
		width: 70%;
		float: none;
		margin: 0 auto;

	}
}
@media screen and (max-width: 600px) {
	.acessibilidade{
		text-align: center;
	}
	section .form .btn-form{
		width: 90%;
		margin: 2% 5%;
		height: 50px;
	}
	iframe{
		height: 280px !important;
	}
	section #div-certificado{
		width: 90%;
		height: auto;
		margin: 50px auto 0 auto;
		border-radius: 5px 5px 5px 5px;
		text-align: center;
	}
	section #div-certificado #btn-certificado{
		float: none;
		margin: 0px auto 0px auto;
		width: 80px;
		height: 80px;
		border-radius: 100px;
		line-height: 100px;
		font-size: 16px;
	}
	section #div-certificado form{
		width: 90%;
		margin: 0 auto;
	}
}

@media screen and (max-width: 480px) {
	#header-div #logotipo{
		width: 90% !important;
		margin: 0 5%;
	}
	.acessibilidade #img-acessibilidade{
		width: 150px;
	}
	.acessibilidade input{ 
		width: 40px; 
		height: 36px; 
		outline: none; 
		border: none;
		-webkit-border-radius: 2px;
		   -moz-border-radius: 2px;
		        border-radius: 2px;
		margin: 0px 0px;
	}
	footer #rodape #logotipo-rodape, 
	footer #rodape #img-secretaria{
		background-size: 85% auto;
		width: 90%;
		float: none;
		margin: 0 auto;

	}
}

@media screen and (max-width: 320px) {

}
@media only screen and (orientation:landscape){
	#menu  { height: 150px; overflow: auto; top: 5px; }
}

button.close {
	-webkit-appearance: none;
	padding: 0;
	cursor: pointer;
	background: 0 0;
	border: 0
}

.container {
	padding-right: 15px;
	padding-left: 15px;
	margin-right: auto;
	margin-left: auto;
	width: 870px;
}

.btn {
  background:transparent;
  font-size: 12px;
  font-weight: 300;
  margin-bottom: 3px;
  padding: 1px 5px;
  text-transform: uppercase;
  border:1px solid#ddd;
  margin-right: 3px;
}

.btn-info {
	color: #fff;
	width: 70%;
	background-color: #5bc0de;
	background-color:#333;
	border-color: #46b8da;
}

.fade {
	opacity: 0;
	-webkit-transition: opacity .15s linear;
	-o-transition: opacity .15s linear;
	transition: opacity .15s linear
}

.footer {
  background: none repeat scroll 0 0 #2E2E2E;
  border-top: 5px solid #C52D2F;
  height: 84px;
  margin-top: 110px;
}

.n1{
	display: none;
}
