Link

johnhey · Maio 29, 2019

Boa pessoal, preciso de vossa ajuda, fiz um download de um template gratuito.

e fiz todas as alterações necessárias e ficou do jeito que queria.

Mas tenho um problema toda vez que diminuo o monitor, por exemplo em um celular os link com HREF deixam de funcionar e não sei onde e nem como resolver.

o que posso fazer?

ShadowDLL · Maio 29, 2019

Favor, postar os códigos quem compõe o template.

johnhey · Maio 29, 2019

<!DOCTYPE html>
<html lang="en">
	<head>
		<!-- metas -->
		<?php
			include 'metas.php';
		?>
	</head>
<body>
    <header class="site-header">
        <div class="top">
            <div class="container">
                <div class="row">
                    <div class="col-sm-6">
                        <p>Um novo conceito de fazer funerais em Portugal</p>
                    </div>
                    <div class="col-sm-6">
                        <ul class="list-inline pull-right">
                            <li><a href="https://pt-pt.facebook.com/Agenciafunerariahugocardoso/" target="_blank"><i class="fab fa-facebook-square"></i></a></li>
                            <li><a href="contacto.php"><i class="fas fa-envelope"></i></a></li>
                            <li><a href="tel:+351 913 235 446"><i class="fa fa-phone"></i> +351 913 235 446</a></li>
                        </ul>                        
                    </div>
                </div>
            </div>
        </div>
		
		<nav class="navbar navbar-default">
			<div class="container">
				<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-navbar-collapse">
					<span class="sr-only">Toggle Navigation</span>
					<i class="fa fa-bars"></i>
				</button>
				<a href="index.php" class="navbar-brand">
					<h1 class="logo">Hugo Cardoso Agência Funerária</h1>
				</a>
				<!--menu-->
					<?php
						include 'menu.php';
					?>
			</div>
		</nav>
	</header>
    <main class="site-main">
        <section class="hero_area">
            <div class="hero_content">
                <div class="container">
                    <div class="row">
                        <div class="col-sm-12">
                            <h1>INOVAÇÃO</h1>
                            <h2>"...Um novo conceito de fazer funerais em Portugal, com respeito, honestidade e seriedade, levando até si o conforto para que possa despedir daqueles que amamos...</h2>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="boxes_area">
            <div class="container">
                <div class="row">
                    <div class="col-sm-4">
                        <div class="box">
                            <h3>Nossos Serviços</h3>
                            <p>O desaparecimento de uma pessoa que nos é próxima, é sempre 
							um acontecimento que todos temos dificuldade em superar, e 
							nesses momentos, torna-se necessário contar com profissionais 
							dedicados que nos possam ajudar, esses são apenas alguns de 
							nossos serviços, que prestamos para o melhor servir.</p>
                            <i><img src="img/capelas.jpg" width="90px" alt="Loja em Camarate"></i>
                        </div>
                    </div>
                    <div class="col-sm-4">
                        <div class="box">
                            <h3>Showroom</h3>
                            <p>A Hugo Cardoso conta com um showroom e uma diversidade de urnas e pessoal especializado em resolver toda parte burocrática amenizando esse ato doloroso.</p>
                            <i><img src="img/showroom.jpg" width="90px" alt="Loja em Camarate"></i></i>
                        </div>
                    </div>
                    <div class="col-sm-4">
                        <div class="box">
                            <h3>Serviços Internacionais</h3>
                            <p>Nosso departamento de Serviço Internacional dedicado em Repatriamento para toda a Europa e resto do mundo, conta com uma diversidade de rede de representantes internacionais, que nos permite com profissionalismo e qualidade atender todas as necessidades.</p>
                            <i><img src="img/servico.jpg" width="90px" alt="Serviços Internacionais"></i>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="services">
            <h2 class="section-title">NOSSOS SERVIÇOS</h2>
            <p class="desc">Melhor qualidade e perfeito para amenizar a vossa dor</p>
            <div id="Servicos" class="container">
                <div class="row">
                    <div class="col-md-4 col-sm-6 col-xs-12">
                        <div class="media">
                            <div class="media-left media-middle">
                                <i class="fas fa-church"></i>
                            </div>
                            <div class="media-body">
                                <h4 class="media-heading">Funerias</h4>
                                <p>Funeral é uma cerimônia, religiosa ou não, tradicionalmente 
								adotada para despedida de um ente querido.<br>
								Embora doloroso, não pode ter na dor sua principal razão
								de ser. O Funeral traz consigo a semente do recomeçar, por mais 
								penoso que seja, é o momento único e apropriado para encararmos 
								a partida deste ente que tanto amamos.<br>
								</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6 col-xs-12">
                        <div class="media">
                            <div class="media-left media-middle">
                                <i class="fas fa-cross"></i>
                            </div>
                            <div class="media-body">
                                <h4 class="media-heading">Exumações</h4>
                                <p>Terminado o período legal de inumação em 
								sepultura temporária (nunca inferior a 3 anos 
								ou a 5 no caso concreto nos cemitérios da cidade 
								de Lisboa), procede-se assim e caso a família 
								manifeste essa vontade ao levantamento das ossadas,
								a esse procedimento damos o nome de Exumação.<br>
								Caso não seja possível efectuar a exumação, a mesmo
								deverá aguardar por mais 2 anos para uma nova 
								tentativa.</p>
                            </div>
                        </div>
                    </div>
					<div class="col-md-4 col-sm-6 col-xs-12">
                        <div class="media">
                            <div class="media-left media-middle">
                                <i class="fas fa-plane-departure"></i>
                            </div>
                            <div class="media-body">
                                <h4 class="media-heading">Serviços Internacionais</h4>
                                <p>Nosso departamento de Serviço Internacional dedicado
								em Repatriamento para toda a Europa e resto do 
								mundo, conta com uma diversidade de rede de 
								representantes internacionais, que nos permite 
								com profissionalismo e qualidade atender todas as 
								necessidades.<br>
								Fazendo os contactos directamente com embaixada, 
								consulado e representante no pais de destino.</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6 col-xs-12">
                        <div class="media">
                            <div class="media-left media-middle">
                                <i class="fas fa-truck-moving"></i>
                            </div>
                            <div class="media-body">
                                <h4 class="media-heading">Trasladações</h4>
                                <p>Poderá se efectuar a trasladação de cadáver, 
								ossada e cinzas.<br>
								A trasladação de cadáver para o exterior 
								deverá ser em urna de zinco.<br>
								Poderá efectuar a trasladação de 
								cadáver ou ossadas que tenham sido inumados  
								anteriormente em caixão de chumbo.<br>
								A trasladação de ossadas só poderá ser realizada 
								através de uma Agência Funerária.<br>
								Também é permitido trasladar cinzas de um cemitério
								para outro, desde que o cliente possua um jazigo 
								particular ou columbário.<br>
								Toda as trasladações deverá ser acompanhada pela
								documentação necessária.</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6 col-xs-12">
                        <div class="media">
                            <div class="media-left media-middle">
                                <i class="fab fa-pagelines"></i>
                            </div>
                            <div class="media-body">
                                <h4 class="media-heading">Serviços de Florista</h4>
                                <p>Mais que uma forma de homenagiar, uma demonstração de carinho.<br>
								Com uma variedade de flores e cores, cada uma com seu significado próprio. <br>
								Além dos vários tipo de significados de cada flor, é possível diversifica-las, 
								para que a coroa ou palma fique ainda mais bela e transmita a homenagem de forma clara.</p>
                            </div>
                        </div>
                    </div>  
                    <div class="col-md-4 col-sm-6 col-xs-12">
                        <div class="media">
                            <div class="media-left media-middle">
                                <i class="fas fa-syringe"></i>
                            </div>
                            <div class="media-body">
                                <h4 class="media-heading">Tanatopraxia/tanatoestética</h4>
                                <p>Tanatopraxia é o procedimento que consiste na preparação de um cadáver 
								para o velório ou funeral, assim o corpo não sofrerá, pelo tempo solicitado 
								pelos familiares, a decomposição natural. </p>
                            </div>
                        </div>
                    </div>
					 <div class="col-md-4 col-sm-6 col-xs-12">
                        <div class="media">
                            <div class="media-left media-middle">
                                <i class="fas fa-address-card"></i>
                            </div>
                            <div class="media-body">
                                <h4 class="media-heading">Serviço de Canteiro</h4>
                                <p>Para a comodidade de nossos cliente, disponibilizamos-nos de colaboradores especializado na construção de sepulturas e/ou jazigos.</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="home-area">
            <div class="home_content">
                <div class="container">
                    <div class="row">
                        <div class="col-sm-12"><h2 class="sub_title">VEJA TAMBÉM</h2></div>
                        <div class="home_list">
                            <ul>
                                <li class="col-md-3 col-sm-6 col-xs-12">
                                    <div class="thumbnail">
                                        <img src="img/catalogo.jpg" alt="Post">
                                        <div class="caption">
                                          
                                          <!-- O ERRO ESTA NESSE DOIS HREF ABAIXO ATÉ O INSTALAÇOES -->
                                          
                                          
                                            <h3><a href="florista.php">Lounge Flowers</a></h3>
                                            <p>Conheça o nosso serviço de florista que temos a sua disposição</p>
                                            <a href="florista.php" class="btn btn-link" role="button">Mais</a>
                                        </div>
                                    </div>                                        
                                </li>
                                <li class="col-md-3 col-sm-6 col-xs-12">
                                    <div class="thumbnail">
                                        <img src="img/carros.jpg" class="img-responsive" alt="Post">
                                        <div class="caption">
                                            <h3><a href="frota.php">Frota</a></h3>
                                            <p>Possuimos uma frota de carros modernos para o seu maior conforto</p>
                                            <a href="frota.php" class="btn btn-link" role="button">Mais</a>
                                        </div>
                                    </div>                                        
                                </li>
                                <li class="col-md-3 col-sm-6 col-xs-12">
                                    <div class="thumbnail">
                                        <img src="img/showroom1.jpg" class="img-responsive" alt="Post">
                                        <div class="caption">
                                            <h3><a href="showroom.php">Showroom</a></h3>
                                            <p>Temos um showroom onde poderá ter a noção do que esta a escolher.</p>
                                            <a href="showroom.php" class="btn btn-link" role="button">Mais</a>
                                        </div>
                                    </div>                                        
                                </li>
                                <li class="col-md-3 col-sm-6 col-xs-12">
                                    <div class="thumbnail">
                                        <img src="img/loja.jpg" class="img-responsive" alt="Post">
                                        <div class="caption">
                                            <h3><a href="instalacoes.php">Instalações</a></h3>
                                            <p>Conheça as nossas instalações para o melhor servir.</p>
                                            <a href="instalacoes.php" class="btn btn-link" role="button">Mais</a>
                                        </div>
                                    </div>                                        
                                </li>                                    
                            </ul>
                        </div>
                        
                        <div class="col-sm-12 home_bottom">
                            <h2 class="sub_title">LINK UTEIS</h2>
                            <div class="clearfix"></div>
                            <div class="row">
                                <div class="carousel slide" data-ride="carousel" data-type="multi" data-interval="6000" id="myCarousel">
                                    <div class="carousel-inner">
                                        <div class="item active">
                                            <div class="col-md-2 col-sm-6 col-xs-12">
                                                <a href="https://jf-camarate-unhos-apelacao.pt/"><img src="img/miniatura/jfcamarate.jpg" class="img-responsive" alt="Reference"></a>
                                            </div>
                                        </div>
                                        <div class="item">
                                            <div class="col-md-2 col-sm-6 col-xs-12">
                                                <a href="http://www.cm-lisboa.pt"><img src="img/miniatura/cml.png" class="img-responsive" alt="Reference"></a>
                                            </div>
                                        </div>
                                        <div class="item">
                                            <div class="col-md-2 col-sm-6 col-xs-12">
                                                <a href="http://www.inmlcf.mj.pt/"><img src="img/miniatura/inml.png" class="img-responsive" alt="Reference"></a>
                                            </div>
                                        </div>
                                        <div class="item">
                                            <div class="col-md-2 col-sm-6 col-xs-12">
                                                <a href="https://www.irn.mj.pt/IRN/sections/inicio"><img src="img/miniatura/irn.png" class="img-responsive" alt="Reference"></a>
                                            </div>
                                        </div>
                                        <div class="item">
                                            <div class="col-md-2 col-sm-6 col-xs-12">
                                                <a href="http://www.psp.pt"><img src="img/miniatura/psp.jpg" class="img-responsive" alt="Reference"></a>
                                            </div>
                                        </div>
                                        <div class="item">
                                            <div class="col-md-2 col-sm-6 col-xs-12">
                                                <a href="http://www.seg-social.pt/inicio"><img src="img/miniatura/seguranca_social.jpg" class="img-responsive" alt="Reference"></a>
                                            </div>
                                        </div>
                                        <div class="item">
                                            <div class="col-md-2 col-sm-6 col-xs-12">
                                                <a href="http://www.cga.pt/cgaInicio.asp"><img src="img/miniatura/cga.png" class="img-responsive" alt="Reference"></a>
                                            </div>
                                        </div>
                                        <div class="item">
                                            <div class="col-md-2 col-sm-6 col-xs-12">
                                                <a href="https://www.recenseamento.mai.gov.pt/"><img src="img/miniatura/dgai.jpg" class="img-responsive" alt="Reference"></a>
                                            </div>
                                        </div>
                                        <div class="item">
                                            <div class="col-md-2 col-sm-6 col-xs-12">
                                                <a href="https://www.anel.pt/"><img src="img/miniatura/anel.png" class="img-responsive" alt="Reference"></a>
                                            </div>
                                        </div>                              
                                    </div>
                                    <a class="left carousel-control" href="#myCarousel" data-slide="prev"><i class="glyphicon glyphicon-chevron-left"></i></a>
                                    <a class="right carousel-control" href="#myCarousel" data-slide="next"><i class="glyphicon glyphicon-chevron-right"></i></a>
                                </div>
                            </div>                            
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </main>
    <!-- Rodape -->
		<?php
			include 'rodape.php';
		?>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script type="text/javascript">
        $('.carousel[data-type="multi"] .item').each(function(){
          var next = $(this).next();
          if (!next.length) {
            next = $(this).siblings(':first');
          }
          next.children(':first-child').clone().appendTo($(this));

          for (var i=0;i<4;i++) {
            next=next.next();
            if (!next.length) {
                next = $(this).siblings(':first');
            }

            next.children(':first-child').clone().appendTo($(this));
          }
        });        
    </script>
</body>
</html>

CSS

/* Base */
* {
	outline:none;
	}
	
html, body {
	height: 100%;
	}
	
body {
	font-family: 'Open Sans', sans-serif;
	font-size: 13px;
	line-height: 1.6;
	color: #8c8c8c;
	background-color: #fff;
	}
	
h1, h2, h3, h4, h5, h6 {
	font-family: 'Open Sans', sans-serif;
	}
	
a {
	color: #404040;
	}
	
a:hover {
	color: #404040;
	transition-property: all;
	transition-duration: 0.3s;
	transition-timing-function: linear;
	}
	
a.none:hover {
	text-decoration: none;
	}

/* Header */
.logo{
	background-image: url(img/logotipo.png); 
	background-size: contain; 
	background-position:center center; 
	background-repeat: no-repeat;
	font-size:0; 
	width:350px; 
	height: 150px;
	}
	
.top {
	background: linear-gradient(to right, #efefef, #4169E1);
	padding: 5px 0;
	color: #fff;
	}
	
.top p {
	margin: 0;
	}
	
.top ul {
	margin: 0;
	padding: 0;
	}
	
.top li i {
	color: #fff;
	}
	
.top li a {
	color: #fff;
	}
	
.top li a:hover {
	text-decoration: none;
	}
	
.top li a:hover,.top li a:hover i {
	color: #005FA6;
	transition-property: all;
	transition-duration: 0.3s;
	transition-timing-function: linear;
	}

/* Menu */
.navbar {
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	border-radius: 0;
	margin-bottom: 0;
	}
	
.navbar .container {
	position: relative;
	}
	
.navbar-default {
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
	width: 100%;
	border: none;
	border-bottom: 1px solid #e7e7e7;
	background-color: #fff;
	}
	
.navbar-default .navbar-nav > li > a {
	color: #404040;
	font-weight: normal;
	font-size: 13px;
	}
	
.navbar-default .navbar-nav > li > a:hover {
	background-color: transparent;
	color: #005FA6;
	}
	
.navbar-default .navbar-nav > .open > a,.navbar-default .navbar-nav > .open > a:hover,.navbar-default .navbar-nav > .open > a:focus {
	background-color: transparent;
	color: #005FA6;
	}
	
.navbar-default .navbar-nav .active > a,.navbar-default .navbar-nav .active > a:hover,.navbar-default .navbar-nav .active > a:focus {
	color: #005FA6;
	background-color: transparent;
	}
	
.navbar-default .navbar-toggle {
	margin: 10px 0 0 15px;
	}
	
.navbar-default .navbar-toggle,.navbar-default .navbar-toggle:hover,.navbar-default .navbar-toggle:focus {
	border: none;
	background: #f3f3f3;
	}
	
.navbar-default .navbar-toggle i {
	font-size: 31px;
	}
	
.navbar-default .navbar-collapse {
	float: right;
	border-top: none;
	padding-left: 0;
	padding-right: 0;
	}
	
.navbar-brand>img {
	padding: 5px;
	}

@media screen and (max-width: 768px) {
	.navbar-default .navbar-collapse {
		padding-left: inherit;
		padding-right: inherit;
		}
		}
		
@media screen and (max-width: 992px) {
	.navbar-default .navbar-collapse {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
		max-height: none;}
		}
	}
		
@media (min-width:768px) {
	.navbar>.container .navbar-brand,.navbar>.container-fluid .navbar-brand {
		margin-left: 0;
		}
		}

.main-navbar-nav {
	-moz-transition: all 0.3s linear;
	-o-transition: all 0.3s linear;
	-webkit-transition: all 0.3s linear;
	transition: all 0.3s linear;
	}
	
.main-navbar-nav > li > a {
	padding-top: 30px;
	padding-bottom: 30px;
	line-height: 1;
	}
	
.main-navbar-nav li > .dropdown-menu {
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
	min-width: 225px;
	border: none;
	border-top: 2px solid #005FA6;
	}
	
.main-navbar-nav li > .dropdown-menu > li > a {
	padding: 10px;
	position: relative;
	color: #404040;
	line-height: 1.12857143;
	font-size: 12px;
	}
	
.main-navbar-nav li > .dropdown-menu > li > a:hover,.main-navbar-nav li > .dropdown-menu > li > a:focus {
	color: #005FA6;
	background-color: transparent;
	}
	
.main-navbar-nav li > .dropdown-menu > li > a i {
	position: absolute;
	right: 20px;
	top: 50%;
	margin-top: -8px;
	font-size: 16px;
	}

@media screen and (min-width: 993px) {
	.main-navbar-nav .dropdown:hover > .dropdown-menu {
		display: block;
		}
		
		.main-navbar-nav .dropdown:hover > .dropdown-menu .dropdown:hover .dropdown-menu {
			left: 225px;top: 0;
			margin-top: -2px;
			}
		}
		
@media screen and (max-width: 992px) {
	.main-navbar-nav > li {
		border-bottom: 1px solid #f3f3f3;
		}
		
		.main-navbar-nav > li:last-child {
			border-bottom: none;
			}
			
			.main-navbar-nav > li > a {
				padding-top: 12px;
				padding-bottom: 12px;
				}
			}

.navbar-brand {
	height: auto;
	padding: 0;
	}

@media screen and (max-width: 992px) {
	.navbar-toggle {
		display: block;
		}
		
		.navbar-collapse.collapse {
			display: none !important;
			}
			
			.main-navbar-nav.navbar-nav,.main-navbar-nav.navbar-nav > li {
				float: none !important;
				}
				
				.navbar-collapse.collapse.in {
					display: block !important;
					overflow-y: auto !important;
					}
				}

/* Hero */
.hero_area {
	background-image: url(img/hero.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 475px;
	padding: 0;
	}
	
.hero_content {
	padding: 80px 0;
	}
	
.hero_content h1 {
	text-shadow: 1px 1px 2px rgba(0,0,0,0.75);
	color: #005FA6;
	font-weight: 700;
	font-size: 42px;
	}
	
.hero_content h2 {
	text-shadow: 1px 1px 2px rgba(0,0,0,0.25);
	color: #000;
	font-weight: 700;
	font-size: 32px;
	margin-top: 0;
	width: 55%;
	line-height: 38px;
	text-align:center;
	}

/* Boxes */
.boxes_area {
	padding-top: 40px;
	padding-bottom: 10px;
	padding-left: 0;
	padding-right: 0;
	background-color: #f8f8f8;
	}
	
.box {
	position: relative;
	}
	
.box h3 {
	position: relative;
	margin-bottom: 20px;
	padding-bottom: 20px;
	}

@media (min-width:769px) {
    .boxes_area div[class*="col-"]:after {
		content: " ";
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		width: 1px;
		height: 100%;
		background-color: #ebebeb;
		}
		
    .boxes_area div[class*="col-"]:last-child:after {
		display: none;
		}    
}

/* Home */
.home_content h2:after,.box h3:after {
	content: '';
	position: absolute;
	width: 30px;
	background-color: #005FA6;
	height: 2px;
	left: 0;
	bottom: 0;
	}
	
.box i {
	position: absolute;
	right: 0;
	top: 0;
	margin: 0;
	color: #005FA6;
	font-size: 45px;
	}
	
.boxes_area h3 {
	font-size: 16px;
	font-weight: 500;
	margin-top: 0;
	margin-bottom: 18px;
	}
	
.boxes_area .box p{
	text-align: justify;
	padding-top:5%;
	}
	
.services {
	padding-top: 50px;
	padding-bottom: 50px;
	}
	
h2.section-title {
	text-align: center;
	color: #404040;
	}
	
.services p.desc {
	text-align: center;
	font-size: 13px;
	margin-bottom: 20px;
	}
	
.services .media {
	margin-top: 30px;
	}
	
.services .media i {
	font-size: 45px;
	color: #005FA6;
	}
	
.services .media h4 {
	font-size: 15px;
	font-weight: 600;
	color: #404040;
	}
	
.services .media p {
	text-align: justify;
	}

/* Veja Também */
.home-area {
	padding-bottom: 50px;
	}
	
.home_content h2 {
	position: relative;
	font-size: 17px;
	font-weight: 600;
	padding-bottom: 20px;
	color: #404040;
	margin-bottom: 30px;
	}
	
.home_list ul {
	margin: 0;
	padding: 0;
	float: left;
	width: 100%;
	}
	
.home_list ul li {
	list-style: none;
	}
	
.home_list .thumbnail {
	border: none;
	padding: 0;
	}
	
.thumbnail .caption {
	padding: 9px;
	color: #404040;
	padding-left: 0;
	padding-right: 0;
	}
	
.home_list h3 {
	font-size: 16px;
	font-weight: 600;
	margin-top: 10px;
	margin-bottom: 10px;
	color: #404040;
	}
	
.home_list p {
	color:#8c8c8c;
	}
	
.home_list a.btn {
	font-size: 13px;
	padding: 0;
	color: #005FA6;
	}
	
.home_bottom .row {
	margin-left: -5px;
	margin-right: -5px;
	}
	
.home_bottom div[class*="col-"] {
	padding-right: 5px;
	padding-left: 5px;
	position: relative;
	}
	
/* Referencias */
.carousel-control{ 
	width:  4%; 
	}
	
.carousel-control.left,.carousel-control.right {
	margin-left:0;
	background-image:none;
	}

@media (max-width: 767px) {
	.carousel-inner .active.left {
		left: -100%;
		}
		
		.carousel-inner .next {
			left: 100%;
			}
			
			.carousel-inner .prev {
				left: -100%;
				}
				
				.active > div {
					display:none;
					}
					
					.active > div:first-child {
						display:block;
						}
					}
					
@media (min-width: 767px) and (max-width: 992px ) {
	.carousel-inner .active.left {
		left: -50%;
		}
		
		.carousel-inner .next {
			left:  50%;
			}
			
			.carousel-inner .prev {
				left: -50%;
				}
				
				.active > div {
					display:none;
					}
					
					.active > div:first-child {
						display:block;
						}
						
						.active > div:first-child + div {
							display:block;
							}
						}
						
@media (min-width: 992px ) {
	.carousel-inner .active.left {
		left: -25%;
		}
		
		.carousel-inner .next {
			left: 25%;
			}
			
			.carousel-inner .prev {
				left: -25%;
				}
			}

/* Rodape */
footer.site-footer {
	background: #e6e6e6;
	padding: 20px 0 0;
	float: left;
	width: 100%;
	}
	
footer.site-footer h4 {
	font-size: 17px;
	font-weight: 500;
	}
	
footer.site-footer ul {
	padding-left: 0;
	margin-bottom: 20px;
	list-style: none;
	}
	
footer.site-footer ul a {
	color: #666;
	font-size: 13px;
	}
	
footer.site-footer p {
	font-size: 13px;
	}
	
footer.site-footer p a {
	color: #666;
	}
	
p.text {
	color: #666;
	}
	
#copyright {
	background: #404040;
	color: #ccc;
	padding: 15px 0;
	font-size: 12px;
	margin-top: 20px;
	}
	
#copyright p{
	margin: 0;
	float: left;
	font-size: 12px; 
	text-align: center;
	}
	
.site-footer li a:hover {
	color:#005FA6;
	}
	
ul.big li {
	float: left;
	width: 49%;
	}
	
ul.big li:nth-child(2n) {
	margin-left: 2%;
	}

@media (max-width:462px) {
	.fbox:last-child {
		margin-top: 20px;
		float: left;
		width: 100%;
		}
	}

/* Maillist */
.login-form-1 {
	max-width: 300px;
	border-radius: 5px;
	display: inline-block;
	}
	
.main-login-form {
	position: relative;
	}
	
.login-form-1 .form-control {
	border: 0;
	box-shadow: 0 0 0;
	border-radius: 0;
	background: transparent;
	color: #555555;
	padding: 7px 0;
	font-weight: bold;
	height:auto;
	}
	
.login-form-1 .form-control::-webkit-input-placeholder {
	color: #999999;
	}
	
.login-form-1 .form-control:-moz-placeholder,.login-form-1 .form-control::-moz-placeholder,.login-form-1 .form-control:-ms-input-placeholder {
	color: #999999;
	}
	
.login-form-1 .form-group {
	margin-bottom: 0;
	border-bottom: 2px solid #fff;
	padding-right: 20px;
	position: relative;
	}
	
.login-form-1 .form-group:last-child {
	border-bottom: 0;
	}
	
.login-group {
	background: #efefef;
	color: #999999;
	border-radius: 8px;
	padding: 10px 20px;
	}
	
.login-group-checkbox {
	padding: 5px 0;
	}
	
.login-form-1 .login-button {
	position: absolute;
	right: -25px;
	top: 50%;
	background: #ffffff;
	color: #999999;
	padding: 11px 0;
	width: 50px;
	height: 50px;
	margin-top: -25px;
	border: 5px solid #efefef;
	border-radius: 50%;
	transition: all ease-in-out 500ms;
	}
	
.login-form-1 .login-button:hover {
	color: #555555;
	transform: rotate(450deg);
	}
	
.login-form-1 .login-button.clicked {
	color: #555555;
	}
	
.login-form-1 .login-button.clicked:hover {
	transform: none;
	}
	
.login-form-1 .login-button.clicked.success {
	color: #2ecc71;
	}
	
.login-form-1 .login-button.clicked.error {
	color: #e74c3c;
	}

/* Breadcrumb */
.bread_area {
	border-bottom: 1px solid #e7e7e7;
	padding: 10px 0;
	margin-bottom: 40px;
	}
	
.breadcrumb {
	margin: 0;
	background: #fff;
	padding: 0;
	}

/* Page */
.page-main {
	float: left;
	width: 100%;
	background-color: #fff;
	margin-bottom: 30px; 
	line-height: 3.0em; 
	text-align: justify;
	}
	
.contact{
	line-height: 2.0em;
	}

/* Entry (Contacto) */
.entry{
	padding: 5%;
}

/* Category - Florista - frota */
.category-main {
	float: left;
	width: 100%;
	background-color: #fff;
	margin-bottom: 30px;
	}
	
.category-content h3 {
	font-size: 19px;
	margin-bottom: 20px;
	}
	
.category-main .media {
	margin-top: 30px;
	}
	
.category-main .media:first-child{
	margin-top: 0;
	}
	
.category-main ul li {
	list-style: none;
	position: relative;
	}
	
.category-main .media-left {
	padding-right: 20px;
	}
	
.category-main .meta {
	position: absolute;
	bottom: 0;
	border-bottom: 2px solid #e7e7e7;
	width: 71%;
	min-height: 30px;
	line-height: 24px;
	padding-bottom: 3px;
	}
	
.category-main .category-meta {
	width: 67%;
	}
	
.category-main .meta .arc-comment {
	float: left; 
	margin-right: 5px; 
	border-right: 2px solid #e7e7e7;
	padding-right: 7px;
	}
	
.category-main .meta .arc-comment a, .archive ul.arc-share li a {
	color: #333;
	font-size: 15px;
	}
	
.category-main .meta .arc-comment a:hover, .archive ul.arc-share li a:hover {
	text-decoration: none;
	color: #ff1515;
	}
	
.category-main .meta .arc-date {
	float: right;
	font-size: 15px;
	color: #333;
	}
	
.category-main ul.arc-share {
	float: left;
	margin: 0;
	padding: 0;
	margin-right: 5px;
	}
	
.category-main ul.arc-share li{ 
	float: left;
	list-style: none;
	margin-left: 10px;
}

.category-main .archive-cat a {
	color: #ff1515;
	}
	
.category-main .archive-cat a:hover {
	color: #333; 
	text-decoration: none;
	}

/* Form Contact */

.page-main .tipo_contacto{
	text-align:center;
	}
	
.page-main form p{
	line-height:2.0em;
	}
	
.page-main form input[type="text"], form input[type="email"], form input[type="url"]{
	padding: 0; 
	width:100%; 
	height: 30px;
	}
	
.page-main form textarea{
	width:100%; 
	height: 200px;
	}

/* showroom */
.category-main ul ul{
	display: none;
	}

/* Sidebar */
.widget h4,h2.page-title, h2.category-title {
	position: relative;
	margin-top: 0;
	padding-bottom: 20px;
	margin-bottom: 20px;
	font-size: 17px;
	font-weight: 700;
	color: #404040;
	width: 100%;
	}
	
.widget h4 {
	font-size: 15px;
	margin-left: 15px;
	}
	
.widget h4:after,h2.page-title:after, h2.category-title:after {
	content: '';
	position: absolute;
	width: 30px;
	background-color: #005FA6;
	height: 2px;
	left: 0;
	bottom: 0;
	}
	
.widget {
	margin-bottom: 30px;
	}
	
.sidebar ul {
	padding-left: 15px;
	padding-right: 15px;
	margin: 0;
	}
	
.sidebar ul li {
	list-style: none;
	}
	
.sidebar ul li a {
	padding: 3px 15px;
	display: block;
	margin-left: -15px;
	margin-right: -15px;
	color: #404040;
	}
	
.sidebar li.current a {
	background-color: #005FA6;
	margin-left: -15px;
	margin-right: -15px;
	color: #FFFFFF;
	}
	
.sidebar ul li a:hover {
	background-color: #005FA6;
	color: #FFFFFF;
	text-decoration: none;
	transition-property: all;
	transition-duration: 0.2s;
	transition-timing-function: linear;
	}

/* Responsive */
@media screen and (max-width:462px) {
	.logo{
		background-image: url(img/logotipo.png); 
		background-size: contain; 
		background-position:center center; 
		background-repeat: no-repeat;
		font-size:0; 
		width:250px; 
		height: 100px;
		}
		
    .top {
		text-align: center;
		}
		
		.top ul.list-inline{
			float: none !important;
			text-align: center;
			}
			
    .hero_content {
		padding: 80px 0;
		}
		
    .hero_content h1 {
		font-size: 32px;
		}
		
    .hero_content h2 {
		width: 90%;
		font-size: 21px;
		}
	
    /*.boxes_area .row {margin-left: -20px;margin-right: -20px;}*/
    .boxes_area .box p {
		margin-bottom: 30px;
		}
		
    .services .media .media-left {
		padding-right: 15px;
		}
    
    .category-content .media-body {
		float: left;
		position: relative;
		width: 100%;
		}
		
	.category-content .media-body h3 {
		margin-top: 20px;
		}
		
    .category-main .meta {
		position: relative;
		width: 100%;
		}
		
    .category-main .meta .pull-left {
		margin-left: 40px;
		}
		
    .category-main .meta .pull-right {
		display: none;
		}
    
    .sidebar {
		margin-top: 40px;
		}
}

@media (min-width:463px) and (max-width:768px) {
	.hero_content {
		padding: 60px 0;
		}
		
    .hero_content h1 {
		font-size: 25px;
		}
		
    .hero_content h2 {
		padding-top: 2%; 
		width: 55%;
		font-size: 20px;
		}
	
	.logo{
		background-image: url(img/logotipo.png); 
		background-size: contain; 
		background-position:center center; 
		background-repeat: no-repeat;
		font-size:0; 
		width:250px; 
		height: 100px;
		}
		
    .fbox {
		float: left;
		}
		
    .fbox:nth-child(3) {
		float: right !important;
		}
}

ShadowDLL · Maio 29, 2019

1º

O'que está ocorrendo é que uma "camada" no CSS está

sobrepondo a outra. Sendo assim, para solucionar o

mesmo, adicione o código abaixo em sua folha de estilo:

CSS

.home_list {
	position: relative;
	z-index: 1;
}

Caso queira saber o'que está causando o problema,

segue código:

CSS

.home_content h2 {
	position: relative; /* "Causador" do erro... */
	font-size: 17px;
	font-weight: 600;
	padding-bottom: 20px;
	color: #404040;
	margin-bottom: 30px;
}

2º

Outro ponto que percebi é que você fechou uma

tag html 2 vezes... Caso queira arrumar o mesmo,

segue código:

HTML

<div class="col-sm-4">
    <div class="box">
        <h3>Showroom</h3>
        <p>A Hugo Cardoso conta com um showroom e uma diversidade de urnas e pessoal especializado em resolver toda parte burocrática amenizando esse ato doloroso.</p>
        <i><img src="img/showroom.jpg" width="90px" alt="Loja em Camarate"></i></i>
    </div>
</div>

johnhey · Maio 29, 2019

Obrigado, funcionou.

ShadowDLL · Maio 29, 2019

Disponível ;)

Entrar

Arquivado

Link

Recommended Posts

johnhey 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

ShadowDLL 2

Compartilhar este post

Link para o post

Compartilhar em outros sites

johnhey 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

ShadowDLL 2

Compartilhar este post

Link para o post

Compartilhar em outros sites

johnhey 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

ShadowDLL 2

Compartilhar este post

Link para o post

Compartilhar em outros sites

PHP+Codeigniter - Adicionar Registro Plano de Contas

Javascript - Passar Parâmetros para uma Função.

PHP - Consulta MySql para prazo de dias

Este projeto é apoiado pelas empresas

Fóruns

Tempo Real

Informação importante