body{font-family: Arial;}
/*DIV FUNDO CENTRAL*/


@media (min-width:2160px) and (max-width: 3840px){
	.sect-fdotopag{background-image:url(../imgs/ispe-cabfront.jpg); background-position: center; background-size: cover; 
		box-shadow: inset 0 0 0 100px rgba(0, 0, 0, 0.5);}
	/**/
	.h3toptitulo{color: #fff; padding: 55px 0 35px 0}
	.h3toptitulo p{margin:2px 0}
	.p1obrainstitut{text-transform: uppercase; font-weight: 550; font-size:36px}
	.p2da{padding:0 450px; font-size: 32px}
	.ptitoiea{text-align: center; font-size: 36px}
	.ptoptitopag{color:#fff; text-align: center; font-size: 36px; padding: 10px;}

/*Zona da Div do INTRO E MAIS*/
	#dvintropag{padding:35px 0 22px 0; display: grid; column-gap:35px; grid-template-columns: 1fr 500px;
		grid-template-areas:"intropag slider" "intropag latetopics"}
	.dvintro{grid-area:intropag;}
	.artintro{text-align: justify;}
	.p1intro, .p2intro{font-size: 28px}
	.p2intro{font-size: 27px}
	.ulfasesexecucao{font-size: 24px}
	.ulfasesexecucao h6{text-decoration: underline; font-size:25px}
	.ulfasesexecucao li{margin:0 0 0 15px}
	.dvdimensionamentos{font-size: 25px}
	/*Sobre o SLIDER LATERAL*/
	.dvslider{grid-area:slider; background:#eee; margin-bottom: 15px; height: 290px; padding: 12px}
	/*Responsáveis da Obra*/
	.dvlateraltopics{grid-area: latetopics; background:#ccc; padding:7px; font-family: Arial Narow}
	.h6respontito{font-weight: 550; padding:5px 0 5px 10px; border-left: 5px solid #b22627; font-size:27px; text-transform: uppercase;}
	#dvobrarespons{}
	.figobrarespons{background:#fff; padding: 3px; margin: 8px 0; clear: both;}
	.figobrarespons img{width:130px; height: 150px; object-fit: cover; float: left;  clear: both; margin-right: 7px;}
	.figobrarespons p{margin: 0}
	.pnometec{padding:5px 0; margin: 0; font-size: 21px}
	.pcargo{font-size: 18px; margin: 0; color: #b22627;}
}

@media (min-width:1680px) and (max-width: 2159px){
	.sect-fdotopag{background-image:url(../imgs/ispe-cabfront.jpg); background-position: center; background-size: cover; 
		box-shadow: inset 0 0 0 100px rgba(0, 0, 0, 0.5);}
	/**/
	.h3toptitulo{color: #fff; padding: 45px 0 25px 0}
	.h3toptitulo p{margin:2px 0}
	.p1obrainstitut{text-transform: uppercase; font-weight: 550; font-size:30px}
	.p2da{padding:0 450px; font-size: 32px}
	.ptitoiea{text-align: center; font-size: 32px}
	.ptoptitopag{color:#fff; text-align: center; font-size: 28px; padding: 10px;}

/*Zona da Div do INTRO E MAIS*/
	#dvintropag{padding:35px 0 22px 0; display: grid; column-gap:35px; grid-template-columns: 1fr 400px;
		grid-template-areas:"intropag slider" "intropag latetopics"}
	.dvintro{grid-area:intropag;}
	.artintro{text-align: justify;}
	.p1intro, .p2intro{font-size: 21px}
	.p2intro{}
	.ulfasesexecucao{font-size: 19px}
	.ulfasesexecucao h6{text-decoration: underline; font-size:20px}
	.ulfasesexecucao li{margin:0 0 0 15px}
	.dvdimensionamentos{font-size: 20px}
	/*Sobre o SLIDER LATERAL*/
	.dvslider{grid-area:slider; background:#eee; margin-bottom: 15px; height: 220px; padding: 12px}
	/**/
	.dvlateraltopics{grid-area: latetopics; background:#ccc; padding:7px}
	.h6respontito{font-weight: 550; padding:5px 0 5px 10px; border-left: 5px solid #b22627; font-size:22px; text-transform: uppercase;}
	#dvobrarespons{}
	.figobrarespons{background:#fff; padding: 3px; margin: 8px 0; clear: both;}
	.figobrarespons img{width:100px; height: 120px; object-fit: cover; float: left;  clear: both; margin-right: 7px;}
	.figobrarespons p{margin: 0}
	.pnometec{padding:5px 0; margin: 0}
	.pcargo{font-size: 15px; margin: 0; color: #b22627;}
}

@media (min-width:1024px) and (max-width:1679px){
	.sect-fdotopag{background-image:url(../imgs/ispe-cabfront.jpg); background-position: center; background-size: cover; 
		box-shadow: inset 0 0 0 100px rgba(0, 0, 0, 0.5);}
	/**/
	.h3toptitulo{color: #fff; padding: 35px 0 15px 0}
	.h3toptitulo p{margin:2px 0}
	.p1obrainstitut{text-transform: uppercase; font-weight: 550; font-size:24px}
	.p2da{padding:0 300px}
	.ptitoiea{text-align: center;}
	.ptoptitopag{color:#fff; text-align: center; font-size: 20px; padding: 10px;}

/*Zona da Div do INTRO E MAIS*/
	#dvintropag{padding:25px 0 15px 0; display: grid; column-gap:25px; grid-template-columns: 1fr 300px;
		grid-template-areas:"intropag slider" "intropag latetopics"}
	.dvintro{grid-area:intropag;}
	.artintro{text-align: justify;}
	.p1intro{}
	.ulfasesexecucao h6{text-decoration: underline;}
	.ulfasesexecucao li{margin:0 0 0 15px}
	/*Sobre o SLIDER LATERAL*/
	.dvslider{grid-area:slider; background:#eee; margin-bottom: 12px; height: 160px; padding: 7px}
	/**/
	.dvlateraltopics{grid-area: latetopics; background:#ccc; padding:7px}
	.h6respontito{font-weight: 550; padding:3px 0 3px 7px; border-left: 5px solid #b22627; font-size:18px; text-transform: uppercase;}
	#dvobrarespons{}
	.figobrarespons{background:#fff; padding: 3px; margin: 8px 0; clear: both;}
	.figobrarespons img{width:100px; height: 120px; object-fit: cover; float: left;  clear: both; margin-right: 7px;}
	.figobrarespons p{margin: 0}
	.pnometec{padding:5px 0; margin: 0}
	.pcargo{font-size: 15px; margin: 0; color: #b22627;}

/*Zona de IMAGEM DOS TRÊS ARQUITECTOS PRINCIPAIS*/
	.sect-analiseprojeto{background-image:url(../imgs/trabalhadorlideres.jpg); background-position: center; background-size: cover;
	 padding:55px 0 ; margin:55px 0 0 0;}
	 #dvanileobra{position: relative; padding: 280px 0 20px 0; font-family: Arial Narow}
	 .h2titobloc{color: #fff; text-shadow: 2px 2px 6px 2px #000; font-weight: 550; font-size:42px; text-align: center; position: absolute;
	 	left: 0; top: 0; width: 120px; text-align: center;}
	 .pdirectornam{position: absolute; color: red; left: 320px; bottom: 110px; background:#fff; padding: 1px 7px; font-weight: 550}
	 .p-resarquitec{position: absolute; right: 250px; bottom: 55px; box-shadow: inset 0 0 0 100px rgba(0, 0, 0, 0.3); 
	 	color:#fff; width: 180px; padding: 2px 12px; border-radius: 5px}
	 .prepctrolquality{position: absolute; color: #fff; right: 0px; bottom: 7px; box-shadow:inset 0 0 0 40px rgba(0, 0, 0, 0.3);
	 	padding: 1px 7px; height: 50px; width:190px; border-radius:5px; text-align: center;}

/*Trabalhadores da OBRA DO CAIO LITORAL*/
	#corpogeralzona{margin: 35px 0 0 0; padding:35px 0 0 0}
	#dvtopfdo{background-image:url(../imgs/trabalhadoresdaobra.jpg); background-position: center; 
		background-size: cover; background-attachment: fixed; border-radius:15px 15px 0 0; padding:35px 15px; margin-bottom: 25px}
	#dvtopfdo h4{text-align: justify; box-shadow: inset 0 0 0 200px rgba(0, 0, 0, 0.0); font-weight: 700; color:#b22627;
	 text-shadow: 1px 2px #fff; font-size:36px; padding:25px 0 25px 20px}
	/**/
	#dvgtraba-obra{display: grid; grid-gap:15px; grid-template-columns: repeat(6, 1fr);}
	.fig-bloctrabal{text-align: center; :0.5px 1px 3px 2px #000; height:234px; border-bottom:1px solid}
	.fig-bloctrabal img{width: 100%; height:160px}
	.fig-bloctrabal figcaption{font-weight: 600; font-size: 13px; color:#fff; background: #036; height:38px}
	.pcargotec{font-size: 12px}

/*Estilizar a ZONA DE GALERIA DAS ÁREAS DO PROJETO*/
	.sect-galeriasprojeto{margin:75px 0 25px 0}
	.h5titogeralgaleria{background:#4f50ce; font-weight: 550; padding:10px 0 10px 15px}
	.h5titogeralgaleria p{margin: 0; background: #fff; color: #4f50ce; text-transform: uppercase; padding:0}
	.h5titogeralgaleria p span{background: #4f50ce; color:#fff; padding: 0 5px}
	/**/
	#dvgalariaprojeto{display: grid; gap: 25px; grid-template-columns: repeat(3, 1fr); padding:25px 0 10px 0}
	.ftoprincipal{ font-family: Arial Narow}
	.ftoprincipal img{width: 100%; height:170px}
	.pnomebloc{text-align: center; background:#4f50ce; color: #fff; padding:3px 0;}
	.plink{text-align:center;}
	.plink a{background:conic-gradient(#4f50ce, #b22627); padding:5px 12px; border-radius:0 15px 0 15px; color: #fff; 
			transition-duration:0.9s; -webkit-transition-duration: 0.9s;}
	.plink a:hover{background:#4f50ce;}
}

@media (min-width:1280px) and (max-width:1024px){
}

@media (min-width:768px) and (max-width:1023px){
	.sect-fdotopag{background-image:url(../imgs/ispe-cabfront.jpg); background-position: center; background-size: cover; 
		box-shadow: inset 0 0 0 100px rgba(0, 0, 0, 0.5);}
	/**/
	.h3toptitulo{color: #fff; padding: 35px 0 15px 0}
	.h3toptitulo p{margin:2px 0}
	.p1obrainstitut{text-transform: uppercase; font-weight: 550; font-size:24px}
	.p2da{padding:0 300px}
	.ptitoiea{text-align: center;}
	.ptoptitopag{color:#fff; text-align: center; font-size: 20px; padding: 10px;}

/*Zona da Div do INTRO E MAIS*/
	#dvintropag{padding:25px 0 15px 0; display: grid; column-gap:20px; grid-template-columns: 1fr 270px; padding:0 15px;
		grid-template-areas:"intropag slider" "intropag latetopics"}
	.dvintro{grid-area:intropag;}
	.artintro{text-align: justify;}
	.p1intro{}
	.ulfasesexecucao h6{text-decoration: underline;}
	.ulfasesexecucao li{margin:0 0 0 15px}
	/*Sobre o SLIDER LATERAL*/
	.dvslider{grid-area:slider; background:#eee; margin-bottom: 12px; height: 160px; padding: 7px}
	/*Responsáveis da Obra*/
	.dvlateraltopics{grid-area: latetopics; background:#ccc; padding:7px}
	.h6respontito{font-weight: 550; padding:3px 0 3px 7px; border-left: 5px solid #b22627; font-size:18px; text-transform: uppercase;}
	#dvobrarespons{}
	.figobrarespons{background:#fff; padding: 3px; margin: 8px 0; clear: both;}
	.figobrarespons img{width:80px; height: 100px; object-fit: cover; float: left;  clear: both; margin-right: 7px;}
	.figobrarespons p{margin: 0}
	.pnometec{padding:5px 0; margin: 0}
	.pcargo{font-size: 15px; margin: 0; color: #b22627;}
}
	
@media (min-width:480px) and (max-width:767px){
	.sect-fdotopag{background-image:url(../imgs/ispe-cabfront.jpg); background-position: center; background-size: cover; 
		box-shadow: inset 0 0 0 100px rgba(0, 0, 0, 0.5);}
	/**/
	.h3toptitulo{color: #fff; padding: 20px 0 10px 0}
	.h3toptitulo p{margin:2px 0}
	.p1obrainstitut{text-transform: uppercase; font-weight: 550; font-size:20px; padding: 0 10px}
	.p2da{padding:0 180px}
	.ptitoiea{text-align: center;}
	.ptoptitopag{color:#fff; text-align: center; font-size: 20px; padding: 10px;}

/*Zona da Div do INTRO E MAIS*/
	#dvintropag{padding:25px 0 15px 0; display: grid; column-gap:20px; grid-template-columns: 1fr 220px; padding:0 7px;
		grid-template-areas:"slider slider" "intropag intropag" "latetopics latetopics"}
	.dvintro{grid-area:intropag;}
	.artintro{text-align: justify;}
	.p1intro{}
	.ulfasesexecucao{margin:; padding:0 7px}
	.ulfasesexecucao h6{text-decoration: underline;}
	.ulfasesexecucao li{margin:0 0 0 15px}
	/*Sobre o SLIDER LATERAL*/
	.dvslider{grid-area:slider; background:#eee; margin-bottom: 12px; height: 200px; padding: 7px}
	/*Responsáveis da Obra*/
	.dvlateraltopics{grid-area: latetopics; background:#ccc; padding:7px}
	.h6respontito{font-weight: 550; padding:3px 0 3px 7px; border-left: 5px solid #b22627; font-size:18px; text-transform: uppercase;}
	#dvobrarespons{}
	.figobrarespons{background:#fff; padding: 3px; margin: 8px 0; clear: both;}
	.figobrarespons img{width:100px; height: 120px; object-fit: cover; float: left;  clear: both; margin-right: 7px;}
	.figobrarespons p{margin: 0}
	.pnometec{padding:5px 0; margin: 0}
	.pcargo{font-size: 15px; margin: 0; color: #b22627;}
}

@media (min-width:320px) and (max-width:479px){
	.sect-fdotopag{background-image:url(../imgs/ispe-cabfront.jpg); background-position: center; background-size: cover; 
		box-shadow: inset 0 0 0 100px rgba(0, 0, 0, 0.5);}
	/**/
	.h3toptitulo{color: #fff; padding: 15px 0 10px 0}
	.h3toptitulo p{margin:2px 0}
	.p1obrainstitut{text-transform: uppercase; font-weight: 550; font-size:18px; padding: 0 10px}
	.p2da{padding:0 30%}
	.ptitoiea{text-align: center;}
	.ptoptitopag{color:#fff; text-align: center; font-size: 20px; padding: 10px;}

/*Zona da Div do INTRO E MAIS*/
	#dvintropag{padding:25px 0 15px 0; display: grid; column-gap:20px; grid-template-columns: 1fr 220px; padding:0 3px;
		grid-template-areas:"slider slider" "intropag intropag" "latetopics latetopics"}
	.dvintro{grid-area:intropag;}
	.artintro{text-align: justify;}
	.p1intro{}
	.ulfasesexecucao{margin:; padding:0 5px}
	.ulfasesexecucao h6{text-decoration: underline;}
	.ulfasesexecucao li{margin:0 0 0 15px}
	/*Sobre o SLIDER LATERAL*/
	.dvslider{grid-area:slider; background:#eee; margin-bottom: 12px; height: 180px; padding: 7px}
	/*Responsáveis da Obra*/
	.dvlateraltopics{grid-area: latetopics; background:#ccc; padding:7px}
	.h6respontito{font-weight: 550; padding:3px 0 3px 7px; border-left: 5px solid #b22627; font-size:18px; text-transform: uppercase;}
	#dvobrarespons{}
	.figobrarespons{background:#fff; padding: 3px; margin: 8px 0; clear: both;}
	.figobrarespons img{width:80px; height: 100px; object-fit: cover; float: left;  clear: both; margin-right: 7px;}
	.figobrarespons p{margin: 0}
	.pnometec{padding:5px 0; margin: 0}
	.pcargo{font-size: 15px; margin: 0; color: #b22627;}
}

@media (min-width:240px) and (max-width:319px){
	.sect-fdotopag{background-image:url(../imgs/ispe-cabfront.jpg); background-position: center; background-size: cover; 
		box-shadow: inset 0 0 0 100px rgba(0, 0, 0, 0.5);}
	/**/
	.h3toptitulo{color: #fff; padding: 15px 0 10px 0}
	.h3toptitulo p{margin:2px 0}
	.p1obrainstitut{text-transform: uppercase; font-weight: 550; font-size:16px; padding: 0 10px; text-align: justify;}
	.p2da{padding:0 20%}
	.ptitoiea{text-align: center;}
	.ptoptitopag{color:#fff; text-align: center; font-size: 17px; padding: 10px;}

/*Zona da Div do INTRO E MAIS*/
	#dvintropag{padding:20px 0 10px 0; display: grid; column-gap:20px; grid-template-columns: 1fr 1fr; padding:0 7px;
		grid-template-areas:"slider slider" "intropag intropag" "latetopics latetopics"}
	.dvintro{grid-area:intropag;}
	.artintro{text-align: justify;}
	.p1intro, .p1intro{font-size: 15px}
	.ulfasesexecucao{margin:; padding:0 5px}
	.ulfasesexecucao h6{text-decoration: underline;}
	.ulfasesexecucao li{margin:0 0 0 15px}
	/*Sobre o SLIDER LATERAL*/
	.dvslider{grid-area:slider; background:#eee; margin-bottom: 12px; height: 150px; padding: 7px}
	/*Responsáveis da Obra*/
	.dvlateraltopics{grid-area: latetopics; background:#ccc; padding:7px}
	.h6respontito{font-weight: 550; padding:3px 0 3px 7px; border-left: 5px solid #b22627; font-size:18px; text-transform: uppercase;}
	#dvobrarespons{}
	.figobrarespons{background:#fff; padding: 3px; margin: 8px 0; clear: both;}
	.figobrarespons img{width:65px; height: 85px; object-fit: cover; float: left;  clear: both; margin-right: 7px;}
	.figobrarespons p{margin: 0; font-size: 15px}
	.pnometec{padding:5px 0; margin: 0}
	.pcargo{font-size: 15px; margin: 0; color: #b22627;}
}