/* 

RESOLUÇÃO SITE CENTRALIZADO RESPONSIVO 4.0

PARA SITES QUE POSSUEM TELA RESPONSIVA CENTRALIZADA, QUANDO A RESOLUÇÃO FOR MAIOR QUE 1200px, DEIXA TELA FIXA EM 1200px E CONTINUA AUMENTANDO AS MARGENS.

*/


/************* CONFIGURACOES DA PAGINA (BODY) ***************/

body {
		margin: 0px;								                /* SEM MARGENS NA BODY */
		line-height: 0px;                                           /* ESPAÇAMENTO GERAL ENTRE AS LINHAS NA PÁGINA, EVITA ESPAÇAMENTO TAMBÉM ENTRE DIVS */
		overflow-x: hidden;							                /* RETIRA SCROLL INFERIOR DA BODY*/
		background-image: url("imagens/layout/body_fdo.jpg");		/* IMAGEM DEGRADE, FUNDO DA BODY */
}


/********* CONFIGURAÇÃO E TAMANHO DO CONTAINER *************/

#container{                
			display: flex;    
			margin: 0 auto;    
			width: 100%;      /* CENTRALIZA ÁREA ÚTIL DA DIV container, baseado NO TAMANHO MÁXIMO de 1208px da DIV resolucao, SEM MARGENS (1200px imagens + 8px bordas) */
}


/*********** CONFIGURAÇÃO DA DIV RESOLUÇÃO ****************/

#resolucao {
			margin: 0 auto;     
			border: 4px solid #ffffff;			                                /* ESPESSURA DA BORDA E COR */
			background-color: #000000; 			                                /* COR DE FUNDO DA DIV PRINCIPAL */
			overflow-x: hidden;					                                /* RETIRA SCROLL INFERIOR */
			overflow-y: hidden;					                                /* RETIRA SCROLL LATERAL */
			border-radius: 0px 0px 0px 0px;                                     /* ARREDONDAMENTO DO TRAÇOS DA BORDA */
			background-image: url("imagens/paginas/fundo.png") ;				/* IMAGEM FUNDO DA DIV RESOLUCAO */
			background-size: 100% 100%;
			text-align: center;
}




/********* RESPONSIBILIDADE DA DIV RESOLUCAO ************/




@media only screen and (min-width: 1px) and (max-width: 320px) {		/* TELAS DE ATÉ 320PX - REDUÇÃO DA ORIGINAL 8,28*/
	#resolucao {
				width: 300px;		/* TAMANHO MÍNIMO DA TELA PARA MOSTRAGEM - TELA SEM MARGEM */
				height: 424px;	    
	}
	#logotipo {						/* IMAGEM LOGOTIPO */
	    		width: 105px;
				height: 61px;
				margin-top: 55px;
				margin-bottom: 27px;
    }
	#convite {						/* IMAGEM CONVITE */
				width: 81px;
				height: 131px;
    }
	#lista {						/* IMAGEM LISTA */
				width: 81px;
				height: 131px;
    }
	#data {							/* IMAGEM DATA */
				margin-top: 55px;		
				width: 81px;
				height: 14px;
    }
	#lista1 {							/* IMAGEM LISTA 1 */
				width: 91px;
				height: 49px;
    }
	#lista2 {							/* IMAGEM LISTA 2 */
				width: 91px;
				height: 49px;
    }
	#logotipo2 {						/* IMAGEM LOGOTIPO 2 */
				width: 54px;
				height: 30px;
				margin-top: 29px;
				margin-bottom: 7px;
    }
	#video {							/* VIDEO */
				width: 150px;
				height: 201px;
				margin-bottom: 7px;		
    }
	#presenca {							/* IMAGEM PRESENCA */
				width: 62px;
				height: 103px;
    }
	#chegar {							/* IMAGEM CHEGAR */
				width: 62px;
				height: 103px;
    }
	#data2 {							/* IMAGEM DATA 2 */
				margin-top: 16px;		
				width: 57px;
				height: 8px;
    }
}




@media only screen and (min-width: 321px) and (max-width: 375px)  {		/* TELAS DE ATÉ 375PX - REDUÇÃO DA ORIGINAL 7,98 */
	#resolucao {														/* DEIXA DE AUMENTAR A DIV E CENTRALIZA na container aumentando apenas a margem*/
	    		width: 311px;
				height: 440px;

    }
	#logotipo {						/* IMAGEM LOGOTIPO */
				width: 124px;
				height: 72px;
				margin-top: 65px;
				margin-bottom: 32px;
    }
	#convite {						/* IMAGEM CONVITE */
				width: 84px;
				height: 135px;
    }
	#lista {						/* IMAGEM LISTA */
				width: 84px;
				height: 135px;
    }
	#data {							/* IMAGEM DATA */
				margin-top: 65px;		
				width: 84px;
				height: 14px;
    }
	#lista1 {							/* IMAGEM LISTA 1 */
				width: 94px;
				height: 51px;
    }
	#lista2 {							/* IMAGEM LISTA 2 */
				width: 94px;
				height: 51px;
    }
	#logotipo2 {						/* IMAGEM LOGOTIPO 2 */
				width: 54px;
				height: 30px;
				margin-top: 29px;
				margin-bottom: 7px;
    }
	#video {							/* VIDEO */
				width: 150px;
				height: 201px;
				margin-bottom: 7px;		
    }
	#presenca {							/* IMAGEM PRESENCA */
				width: 62px;
				height: 103px;
    }
	#chegar {							/* IMAGEM CHEGAR */
				width: 62px;
				height: 103px;
    }
	#data2 {							/* IMAGEM DATA 2 */
				margin-top: 16px;		
				width: 57px;
				height: 8px;
    }
}




@media only screen and (min-width: 376px) and (max-width: 574px)  {		/* TELAS DE ATÉ 574PX - REDUÇÃO DA ORIGINAL 6,78 */
	#resolucao {														/* DEIXA DE AUMENTAR A DIV E CENTRALIZA na container aumentando apenas a margem*/
				width: 366px;
				height: 517px;
    }
	#logotipo {						/* IMAGEM LOGOTIPO */
				width: 192px;
				height: 111px;
				margin-top: 75px;
				margin-bottom: 37px;
    }
	#convite {						/* IMAGEM CONVITE */
				width: 99px;
				height: 160px;
    }
	#lista {						/* IMAGEM LISTA */
				width: 99px;
				height: 160px;
    }
	#data {							/* IMAGEM DATA */
				margin-top: 75px;		
				width: 99px;
				height: 17px;
    }
	#lista1 {							/* IMAGEM LISTA 1 */
				width: 111px;
				height: 60px;
    }
	#lista2 {							/* IMAGEM LISTA 2 */
				width: 111px;
				height: 60px;
    }
	#logotipo2 {						/* IMAGEM LOGOTIPO 2 */
				width: 64px;
				height: 36px;
				margin-top: 34px;
				margin-bottom: 9px;
    }
	#video {							/* VIDEO */
				width: 176px;
				height: 236px;
				margin-bottom: 9px;		
    }
	#presenca {							/* IMAGEM PRESENCA */
				width: 73px;
				height: 121px;
    }
	#chegar {							/* IMAGEM CHEGAR */
				width: 73px;
				height: 121px;
    }
	#data2 {							/* IMAGEM DATA 2 */
				margin-top: 19px;		
				width: 67px;
				height: 10px;
    }
}




@media only screen and (min-width: 575px) and (max-width: 718px)  {		/* TELAS DE ATÉ 718PX - REDUÇÃO DA ORIGINAL 4,39 */
	#resolucao {														/* DEIXA DE AUMENTAR A DIV E CENTRALIZA na container aumentando apenas a margem*/
				width: 565px;
				height: 800px;
    }
	#logotipo {						/* IMAGEM LOGOTIPO */
				width: 240px;
				height: 140px;
				margin-top: 104px;
				margin-bottom: 52px;
    }
	#convite {						/* IMAGEM CONVITE */
				width: 153px;
				height: 247px;
    }
	#lista {						/* IMAGEM LISTA */
				width: 153px;
				height: 247px;
    }
	#data {							/* IMAGEM DATA */
				margin-top: 104px;		
				width: 153px;
				height: 26px;
    }
	#lista1 {							/* IMAGEM LISTA 1 */
				width: 171px;
				height: 94px;
    }
	#lista2 {							/* IMAGEM LISTA 2 */
				width: 171px;
				height: 94px;
    }
	#logotipo2 {						/* IMAGEM LOGOTIPO 2 */
				width: 98px;
				height: 56px;
				margin-top: 52px;
				margin-bottom: 15px;
    }
	#video {							/* VIDEO */
				width: 269px;
				height: 359px;
				margin-bottom: 15px;		
    }
	#presenca {							/* IMAGEM PRESENCA */
				width: 112px;
				height: 185px;
    }
	#chegar {							/* IMAGEM CHEGAR */
				width: 112px;
				height: 185px;
    }
	#data2 {							/* IMAGEM DATA 2 */
				margin-top: 30px;		
				width: 103px;
				height: 16px;
    }

}



@media only screen and (min-width: 719px) and (max-width: 907px)  {		/* TELAS DE ATÉ 907PX - REDUÇÃO DA ORIGINAL 3,50 */
	#resolucao {														/* DEIXA DE AUMENTAR A DIV E CENTRALIZA na container aumentando apenas a margem*/
				width: 709px;
				height: 1003px;
    }
	#logotipo {						/* IMAGEM LOGOTIPO */
				width: 304px;
				height: 177px;
				margin-top: 121px;
				margin-bottom: 60px;
    }
	#convite {						/* IMAGEM CONVITE */
				width: 192px;
				height: 310px;
    }
	#lista {						/* IMAGEM LISTA */
				width: 192px;
				height: 310px;
    }
	#data {							/* IMAGEM DATA */
				margin-top: 121px;		
				width: 192px;
				height: 33px;
    }
	#lista1 {							/* IMAGEM LISTA 1 */
				width: 215px;
				height: 118px;
    }
	#lista2 {							/* IMAGEM LISTA 2 */
				width: 215px;
				height: 118px;
    }
	#logotipo2 {						/* IMAGEM LOGOTIPO 2 */
				width: 123px;
				height: 71px;
				margin-top: 65px;
				margin-bottom: 19px;
    }
	#video {							/* VIDEO */
				width: 337px;
				height: 449px;
				margin-bottom: 19px;		
    }
	#presenca {							/* IMAGEM PRESENCA */
				width: 141px;
				height: 232px;
    }
	#chegar {							/* IMAGEM CHEGAR */
				width: 141px;
				height: 232px;
    }
	#data2 {							/* IMAGEM DATA 2 */
				margin-top: 38px;		
				width: 129px;
				height: 21px;
    }
}




@media only screen and (min-width: 908px) and (max-width: 1078px)  {	/* TELAS DE ATÉ 1078PX - REDUÇÃO DA ORIGINAL 2,76 */
	#resolucao {														/* DEIXA DE AUMENTAR A DIV E CENTRALIZA na container aumentando apenas a margem*/
				width: 898px;
				height: 1272px;
    }
	#logotipo {						/* IMAGEM LOGOTIPO */
				width: 362px;
				height: 211px;
				margin-top: 155px;
				margin-bottom: 77px;
    }
	#convite {						/* IMAGEM CONVITE */
				width: 244px;
				height: 393px;
    }
	#lista {						/* IMAGEM LISTA */
				width: 244px;
				height: 393px;
    }
	#data {							/* IMAGEM DATA */
				margin-top: 155px;		
				width: 245px;
				height: 42px;
    }
	#lista1 {							/* IMAGEM LISTA 1 */
				width: 273px;
				height: 149px;
    }
	#lista2 {							/* IMAGEM LISTA 2 */
				width: 273px;
				height: 149px;
    }
	#logotipo2 {						/* IMAGEM LOGOTIPO 2 */
				width: 155px;
				height: 90px;
				margin-top: 82px;
				margin-bottom: 24px;
    }
	#video {							/* VIDEO */
				width: 425px;
				height: 566px;
				margin-bottom: 24px;		
    }
	#presenca {							/* IMAGEM PRESENCA */
				width: 178px;
				height: 293px;
    }
	#chegar {							/* IMAGEM CHEGAR */
				width: 178px;
				height: 293px;
    }
	#data2 {							/* IMAGEM DATA 2 */
				margin-top: 49px;		
				width: 163px;
				height: 27px;
    }
}




@media only screen and (min-width: 1079px) and (max-width: 1307px)  {	/* TELAS DE ATÉ 1307PX - REDUÇÃO DA ORIGINAL 1,21  1308/1079*/
	#resolucao {														/* DEIXA DE AUMENTAR A DIV E CENTRALIZA na container aumentando apenas a margem*/
				width: 1069px;
				height: 1513px;
	}
	#logotipo {							/* IMAGEM LOGOTIPO */
				width: 440px;
				height: 256px;
				margin-top: 100px;
				margin-bottom: 200px;
    }
	#convite {							/* IMAGEM CONVITE */
				width: 290px;
				height: 467px;
    }
	#lista {							/* IMAGEM LISTA */
				width: 290px;
				height: 467px;
    }
	#data {								/* IMAGEM DATA */
				margin-top: 200px;		
				width: 291px;
				height: 50px;
    }
	#lista1 {							/* IMAGEM LISTA 1 */
				width: 325px;
				height: 178px;
    }
	#lista2 {							/* IMAGEM LISTA 2 */
				width: 325px;
				height: 178px;
    }
	#logotipo2 {						/* IMAGEM LOGOTIPO 2 */
				width: 188px;
				height: 109px;
				margin-top: 100px;
				margin-bottom: 30px;
    }
	#video {							/* VIDEO */
				width: 515px;
				height: 686px;
				margin-bottom: 30px;		
    }
	#presenca {							/* IMAGEM PRESENCA */
				width: 216px;
				height: 355px;
    }
	#chegar {							/* IMAGEM CHEGAR */
				width: 216px;
				height: 355px;
    }
	#data2 {							/* IMAGEM DATA 2 */
				margin-top: 60px;		
				width: 198px;
				height: 33px;
    }
}




@media only screen and (min-width: 1308px) {							/* TELAS ACIMA DE DE ATÉ 1307PX - REDUÇÃO DA ORIGINAL */
	#resolucao {														/* DEIXA DE AUMENTAR A DIV E CENTRALIZA na container aumentando apenas a margem*/
				width: 1069px;
				height: 1513px;
	}
	#logotipo {							/* IMAGEM LOGOTIPO */
				width: 440px;
				height: 256px;
				margin-top: 100px;
				margin-bottom: 200px;
    }
	#convite {							/* IMAGEM CONVITE */
				width: 290px;
				height: 467px;
    }
	#lista {							/* IMAGEM LISTA */
				width: 290px;
				height: 467px;
    }
	#data {								/* IMAGEM DATA */
				margin-top: 200px;		
				width: 291px;
				height: 50px;
    }
	#lista1 {							/* IMAGEM LISTA 1 */
				width: 325px;
				height: 178px;
    }
	#lista2 {							/* IMAGEM LISTA 2 */
				width: 325px;
				height: 178px;
    }
	#logotipo2 {						/* IMAGEM LOGOTIPO 2 */
				width: 188px;
				height: 109px;
				margin-top: 100px;
				margin-bottom: 30px;
    }
	#video {							/* VIDEO */
				width: 515px;
				height: 686px;
				margin-bottom: 30px;		
    }
	#presenca {							/* IMAGEM PRESENCA */
				width: 216px;
				height: 355px;
    }
	#chegar {							/* IMAGEM CHEGAR */
				width: 216px;
				height: 355px;
    }
	#data2 {							/* IMAGEM DATA 2 */
				margin-top: 60px;		
				width: 198px;
				height: 33px;
    }
}