Fixed overflow with giant logo on small screens

This commit is contained in:
Ethan N. Paul 2018-02-06 08:08:16 -05:00
parent 53e5a460e6
commit f2370a7d53
2 changed files with 13 additions and 7 deletions

View File

@ -90,14 +90,20 @@ h1, h2, h3, h4, h5, h6 {
background-size: cover;
}
#top .hero-logo {
#top .top-logo {
margin: 20px;
}
#top .hero-logo img {
#top .top-logo img {
max-width: 100%;
}
@media (max-width: 768px) {
#top .top-logo img {
max-width: 50%;
}
}
#top .top-container {
background: rgba(0, 0, 0, 0.3);
display: table-cell;
@ -170,9 +176,9 @@ h1, h2, h3, h4, h5, h6 {
--------------------------------------------------------------*/
#header {
background: black;
padding: 15px 0;
height: 55px;
margin-top: -80px;
padding: 10px 0;
height: 40px;
margin-top: -60px;
}
#header #logo {
@ -294,7 +300,7 @@ h1, h2, h3, h4, h5, h6 {
/* Nav Meu Container */
#nav-menu-container {
float: right;
margin: 5px 0;
/*margin: 5px 0;*/
}
@media (max-width: 768px) {

View File

@ -60,7 +60,7 @@
<section id="top">
<div class="top-container">
<div class="wow fadeIn">
<div class="hero-logo">
<div class="top-logo">
<img class="" src="img/e-w.png" alt="ENPaul">
</div>