Ok so I know pretty easy to horizontally align a text inside a div using text-align
but I want to remove it from the top of the div. I tried using vertical-align
but it didn't work out.
Here's how it is looking right now
Does anybody have a clue what might work? I know I could just add some margin-top but that seems to be like a stupid solution
.container {
background-color: rgb(255, 255, 255);
max-width: 95%;
margin: 0 auto;
}
header {
display: flex;
border-bottom: solid 1px black;
padding: 10px;
align-items: center;
}
.allButtons {
display: flex;
margin-left: auto;
}
.headerButtons {
margin: 10px;
background-color: rgb(10, 153, 254, .1);
text-align: center;
color: #0A99FE;
font-size: 20px;
width: 150px;
height: 40px;
border-radius: 10px;
}
.headerButtons:hover {
background-color: #0A99FE;
color: white;
}
ul {
margin: 0;
padding: 0;
border: 0;
display: flex;
list-style-type: none;
}
img {
border-radius: 10px;
}
li {
margin-right: 10px;
text-align: center;
background-color: #f8f8f8;
border-radius: 10px;
align-content: center;
}
h1 {
font-size: 20px;
font-weight: 400;
}
p {
font-size: 16px;
color: #868383;
}
#titleCards {
font-weight: 500;
}
<header >
<svg width="164" height="54" viewBox="0 0 164 54" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M34.6341 38.347C30.0324 40.0528 23.3232 39.2311 20.4862 37.9192C17.6411 36.6026 14.062 40.1065 18.1966 41.7563C22.3304 43.4058 29.3089 43.0965 34.6369 41.8034" fill="#0A99FE"/>
<path d="M34.6341 38.347C30.0324 40.0528 23.3232 39.2311 20.4862 37.9192C17.6411 36.6026 14.062 40.1065 18.1966 41.7563C22.3304 43.4058 29.3089 43.0965 34.6369 41.8034" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M37.3815 47.4288L35.3135 48.5538L33.8293 44.4007L35.8464 34.7222L32.7996 26.0337L36.9103 18.2146L48.8209 17.9628L51.3387 19.6712L54.0802 21.4771L54.9769 23.9681L53.8602 26.0206L52.7914 28.2193L53.5284 30.5154L51.6277 31.2494L48.2777 37.5047L42.3556 44.1037L39.9187 45.5867L37.3815 47.4288Z" fill="#0A99FE"/>
<path d="M49.8828 17.3271C53.6701 25.5104 52.6224 34.6247 45.3759 44.9323C51.416 45.9056 47.6171 50.3048 40.1762 45.8149" fill="#0A99FE"/>
<path d="M49.8828 17.3271C53.6701 25.5104 52.6224 34.6247 45.3759 44.9323C51.416 45.9056 47.6171 50.3048 40.1762 45.8149" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M33.2819 26.0334C35.8281 34.3033 35.9591 42.0565 31.6789 48.8662C35.5428 55.442 39.6209 50.6029 36.4317 48.3576" fill="#0A99FE"/>
<path d="M33.2819 26.0334C35.8281 34.3033 35.9591 42.0565 31.6789 48.8662C35.5428 55.442 39.6209 50.6029 36.4317 48.3576" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M47.7151 33.3036C46.3229 39.2472 42.4295 43.9228 36.4671 48.3316L47.7151 33.3036Z" fill="#0A99FE"/>
<path d="M47.7151 33.3036C46.3229 39.2472 42.4295 43.9228 36.4671 48.3316" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M50.6031 19.0504C55.364 21.167 56.3238 24.2183 53.0232 28.3173C54.9823 30.5633 53.4137 31.7456 51.7063 30.7128" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M33.0049 29.0136L38.6542 30.8666C39.1103 41.5652 29.7687 37.7605 35.5809 33.702C20.314 32.3437 20.5906 28.8259 35.275 19.8782L45.3531 16.9391L47.4802 19.4782" fill="#0A99FE"/>
<path d="M33.0049 29.0136L38.6542 30.8666C39.1103 41.5652 29.7687 37.7605 35.5809 33.702C20.314 32.3437 20.5906 28.8259 35.275 19.8782L45.3531 16.9391L47.4802 19.4782" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M41.3332 24.6116L31.4328 29.8635L41.3332 24.6116Z" fill="#0A99FE"/>
<path d="M41.3332 24.6116L31.4328 29.8635" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M15.4239 4.30242C14.809 7.49465 14.0051 9.26857 10.0159 11.0189C6.6965 12.4488 0.889192 13.9475 0.0136247 17.6953C4.50403 20.0811 10.5996 22.2078 19.8948 19.5555C27.2064 17.4693 32.1783 21.6527 40.451 22.1748C38.4454 17.5598 37.1082 15.3508 34.6809 13.7268C30.626 13.5208 28.1016 8.65118 24.1513 6.68459C20.8398 5.036 19.9526 4.91399 15.4239 4.30242Z" fill="black"/>
<path d="M32.2778 2.95281C32.2518 2.6826 32.4969 2.5817 32.7189 2.77121L34.98 4.70148L37.2412 6.63179C37.4632 6.8213 37.4956 7.15902 37.2995 7.23976L35.3024 8.06176L33.3053 8.8838C33.1092 8.96449 32.8317 8.72759 32.8058 8.45739L32.5418 5.70508L32.2778 2.95281Z" fill="#0A99FE"/>
<path d="M32.2778 2.95281C32.2518 2.6826 32.4969 2.5817 32.7189 2.77121L34.98 4.70148L37.2412 6.63179C37.4632 6.8213 37.4956 7.15902 37.2995 7.23976L35.3024 8.06176L33.3053 8.8838C33.1092 8.96449 32.8317 8.72759 32.8058 8.45739L32.5418 5.70508L32.2778 2.95281Z" stroke="black" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M43.4032 1.38483C43.4997 1.12527 43.784 1.11048 43.915 1.35823L45.2494 3.88157L46.5838 6.40482C46.7148 6.65257 46.5942 6.97705 46.3668 6.9889L44.0499 7.10931L41.7331 7.2298C41.5056 7.24161 41.3418 6.93191 41.4383 6.67235L42.4207 4.02865L43.4032 1.38483Z" fill="#0A99FE"/>
<path d="M43.4032 1.38483C43.4997 1.12527 43.784 1.11048 43.915 1.35823L45.2494 3.88157L46.5838 6.40482C46.7148 6.65257 46.5942 6.97705 46.3668 6.9889L44.0499 7.10931L41.7331 7.2298C41.5056 7.24161 41.3418 6.93191 41.4383 6.67235L42.4207 4.02865L43.4032 1.38483Z" stroke="black" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M52.6317 13.1373C52.5355 18.1552 47.8016 22.1548 42.0581 22.0708C36.3146 21.9868 31.7365 17.851 31.8327 12.8332C31.9288 7.81534 36.6628 3.81572 42.4063 3.89972C48.1498 3.98372 52.7278 8.11954 52.6317 13.1373Z" fill="#0A99FE"/>
<path d="M52.6317 13.1373C52.5355 18.1552 47.8016 22.1548 42.0581 22.0708C36.3146 21.9868 31.7365 17.851 31.8327 12.8332C31.9288 7.81534 36.6628 3.81572 42.4063 3.89972C48.1498 3.98372 52.7278 8.11954 52.6317 13.1373Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M40.0902 8.01892C42.6114 13.6259 46.6678 12.0728 43.6248 7.43546" stroke="black" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M44.9714 7.21087C47.0745 12.7384 50.5785 10.8353 46.8276 6.65171" stroke="black" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M47.0793 12.4942L48.3819 15.1063" stroke="black" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M50.2585 15.8632L48.4904 15.2581L47.774 17.0972" stroke="black" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M73.9091 23.7609C73.8097 23.4153 73.67 23.1099 73.4901 22.8447C73.3101 22.5748 73.09 22.3475 72.8295 22.1629C72.5739 21.9735 72.2803 21.8291 71.9489 21.7296C71.6222 21.6302 71.2599 21.5805 70.8622 21.5805C70.1188 21.5805 69.4654 21.7652 68.902 22.1345C68.3433 22.5038 67.9077 23.0412 67.5952 23.7467C67.2827 24.4474 67.1264 25.3045 67.1264 26.3177C67.1264 27.331 67.2803 28.1927 67.5881 28.9029C67.8958 29.6132 68.3314 30.1553 68.8949 30.5294C69.4583 30.8987 70.1236 31.0833 70.8906 31.0833C71.5866 31.0833 72.1809 30.9602 72.6733 30.714C73.1705 30.4631 73.5492 30.1103 73.8097 29.6558C74.0748 29.2012 74.2074 28.6638 74.2074 28.0436L74.8324 28.1359H71.0824V25.8206H77.169V27.6529C77.169 28.9313 76.8991 30.0298 76.3594 30.9484C75.8196 31.8622 75.0762 32.5677 74.1293 33.0649C73.1823 33.5573 72.098 33.8035 70.8764 33.8035C69.5128 33.8035 68.3149 33.5028 67.2827 32.9015C66.2505 32.2955 65.4455 31.4361 64.8679 30.3234C64.295 29.206 64.0085 27.8802 64.0085 26.3461C64.0085 25.1671 64.179 24.116 64.5199 23.1927C64.8655 22.2647 65.3485 21.4787 65.9688 20.8348C66.589 20.1908 67.3111 19.7008 68.1349 19.3646C68.9588 19.0284 69.8513 18.8603 70.8125 18.8603C71.6364 18.8603 72.4034 18.9811 73.1136 19.2225C73.8239 19.4593 74.4536 19.7955 75.0028 20.2311C75.5568 20.6667 76.009 21.1851 76.3594 21.7865C76.7098 22.3831 76.9347 23.0412 77.0341 23.7609H73.9091ZM84.3938 33.8177C83.2717 33.8177 82.3058 33.5904 81.4961 33.1359C80.6912 32.6766 80.0709 32.0279 79.6353 31.1899C79.1997 30.3471 78.9819 29.3504 78.9819 28.1998C78.9819 27.0777 79.1997 26.0928 79.6353 25.2453C80.0709 24.3977 80.6841 23.7372 81.4748 23.2637C82.2702 22.7903 83.203 22.5535 84.2731 22.5535C84.9928 22.5535 85.6628 22.6695 86.283 22.9015C86.908 23.1288 87.4525 23.4721 87.9165 23.9313C88.3853 24.3906 88.7499 24.9683 89.0103 25.6643C89.2707 26.3556 89.4009 27.1653 89.4009 28.0933V28.9242H80.1893V27.0492H86.5529C86.5529 26.6136 86.4582 26.2278 86.2688 25.8916C86.0794 25.5554 85.8166 25.2926 85.4805 25.1032C85.149 24.9091 84.7631 24.812 84.3228 24.812C83.8635 24.812 83.4563 24.9186 83.1012 25.1316C82.7508 25.34 82.4762 25.6217 82.2773 25.9768C82.0785 26.3272 81.9767 26.7178 81.9719 27.1487V28.9313C81.9719 29.4711 82.0714 29.9375 82.2702 30.3305C82.4738 30.7235 82.7603 31.0265 83.1296 31.2396C83.4989 31.4527 83.9369 31.5592 84.4435 31.5592C84.7797 31.5592 85.0875 31.5118 85.3668 31.4171C85.6462 31.3224 85.8853 31.1804 86.0842 30.991C86.283 30.8016 86.4345 30.5696 86.5387 30.295L89.337 30.4796C89.195 31.152 88.9038 31.7391 88.4634 32.241C88.0278 32.7382 87.4644 33.1264 86.7731 33.4058C86.0865 33.6804 85.2934 33.8177 84.3938 33.8177ZM96.3469 33.8177C95.2248 33.8177 94.2589 33.5904 93.4492 33.1359C92.6443 32.6766 92.024 32.0279 91.5884 31.1899C91.1528 30.3471 90.935 29.3504 90.935 28.1998C90.935 27.0777 91.1528 26.0928 91.5884 25.2453C92.024 24.3977 92.6372 23.7372 93.4279 23.2637C94.2234 22.7903 95.1561 22.5535 96.2262 22.5535C96.9459 22.5535 97.6159 22.6695 98.2362 22.9015C98.8612 23.1288 99.4057 23.4721 99.8697 23.9313C100.338 24.3906 100.703 24.9683 100.963 25.6643C101.224 26.3556 101.354 27.1653 101.354 28.0933V28.9242H92.1424V27.0492H98.506C98.506 26.6136 98.4113 26.2278 98.2219 25.8916C98.0326 25.5554 97.7698 25.2926 97.4336 25.1032C97.1022 24.9091 96.7163 24.812 96.2759 24.812C95.8166 24.812 95.4094 24.9186 95.0543 25.1316C94.704 25.34 94.4293 25.6217 94.2305 25.9768C94.0316 26.3272 93.9298 26.7178 93.9251 27.1487V28.9313C93.9251 29.4711 94.0245 29.9375 94.2234 30.3305C94.427 30.7235 94.7134 31.0265 95.0827 31.2396C95.4521 31.4527 95.89 31.5592 96.3967 31.5592C96.7328 31.5592 97.0406 31.5118 97.32 31.4171C97.5993 31.3224 97.8384 31.1804 98.0373 30.991C98.2362 30.8016 98.3877 30.5696 98.4918 30.295L101.29 30.4796C101.148 31.152 100.857 31.7391 100.417 32.241C99.9809 32.7382 99.4175 33.1264 98.7262 33.4058C98.0397 33.6804 97.2466 33.8177 96.3469 33.8177ZM106.07 30.4654L106.077 26.8362H106.517L110.012 22.6956H113.485L108.79 28.1785H108.073L106.07 30.4654ZM103.328 33.6046V19.0592H106.354V33.6046H103.328ZM110.147 33.6046L106.936 28.8532L108.953 26.7154L113.691 33.6046H110.147Z" fill="#1E1E1E"/>
<path d="M118.165 33.6046L114.188 19.0592H115.978L119.017 30.9058H119.159L122.256 19.0592H124.245L127.341 30.9058H127.483L130.523 19.0592H132.313L128.336 33.6046H126.517L123.307 22.0137H123.194L119.983 33.6046H118.165ZM137.696 33.8319C136.712 33.8319 135.847 33.5975 135.104 33.1288C134.365 32.66 133.788 32.0043 133.371 31.1615C132.959 30.3187 132.753 29.3338 132.753 28.2069C132.753 27.0706 132.959 26.0786 133.371 25.2311C133.788 24.3835 134.365 23.7254 135.104 23.2566C135.847 22.7879 136.712 22.5535 137.696 22.5535C138.681 22.5535 139.543 22.7879 140.282 23.2566C141.025 23.7254 141.603 24.3835 142.015 25.2311C142.431 26.0786 142.64 27.0706 142.64 28.2069C142.64 29.3338 142.431 30.3187 142.015 31.1615C141.603 32.0043 141.025 32.66 140.282 33.1288C139.543 33.5975 138.681 33.8319 137.696 33.8319ZM137.696 32.3262C138.444 32.3262 139.06 32.1345 139.543 31.751C140.026 31.3674 140.383 30.8632 140.615 30.2382C140.847 29.6132 140.963 28.9361 140.963 28.2069C140.963 27.4778 140.847 26.7983 140.615 26.1686C140.383 25.5388 140.026 25.0298 139.543 24.6416C139.06 24.2533 138.444 24.0592 137.696 24.0592C136.948 24.0592 136.333 24.2533 135.85 24.6416C135.367 25.0298 135.009 25.5388 134.777 26.1686C134.545 26.7983 134.429 27.4778 134.429 28.2069C134.429 28.9361 134.545 29.6132 134.777 30.2382C135.009 30.8632 135.367 31.3674 135.85 31.751C136.333 32.1345 136.948 32.3262 137.696 32.3262ZM145.198 33.6046V22.6956H146.817V24.3433H146.931C147.13 23.8035 147.49 23.3655 148.011 23.0294C148.531 22.6932 149.119 22.5251 149.772 22.5251C149.895 22.5251 150.049 22.5275 150.234 22.5322C150.418 22.5369 150.558 22.544 150.653 22.5535V24.2581C150.596 24.2438 150.466 24.2225 150.262 24.1941C150.063 24.161 149.853 24.1444 149.63 24.1444C149.1 24.1444 148.626 24.2557 148.21 24.4782C147.798 24.696 147.471 24.9991 147.229 25.3873C146.993 25.7708 146.874 26.2088 146.874 26.7012V33.6046H145.198ZM156.427 33.8319C155.518 33.8319 154.715 33.6023 154.019 33.143C153.323 32.679 152.779 32.0256 152.386 31.1828C151.993 30.3352 151.796 29.3338 151.796 28.1785C151.796 27.0327 151.993 26.0384 152.386 25.1956C152.779 24.3528 153.326 23.7017 154.026 23.2424C154.727 22.7831 155.537 22.5535 156.455 22.5535C157.165 22.5535 157.727 22.6719 158.138 22.9086C158.555 23.1406 158.872 23.4058 159.09 23.7041C159.313 23.9976 159.486 24.2391 159.609 24.4285H159.751V19.0592H161.427V33.6046H159.808V31.9285H159.609C159.486 32.1274 159.31 32.3783 159.083 32.6813C158.856 32.9796 158.531 33.2472 158.11 33.4839C157.689 33.7159 157.128 33.8319 156.427 33.8319ZM156.654 32.3262C157.326 32.3262 157.895 32.151 158.359 31.8007C158.823 31.4456 159.175 30.9555 159.417 30.3305C159.658 29.7008 159.779 28.974 159.779 28.1501C159.779 27.3357 159.661 26.6231 159.424 26.0123C159.187 25.3968 158.837 24.9186 158.373 24.5777C157.909 24.232 157.336 24.0592 156.654 24.0592C155.944 24.0592 155.352 24.2415 154.879 24.6061C154.41 24.9659 154.057 25.456 153.82 26.0762C153.588 26.6918 153.472 27.3831 153.472 28.1501C153.472 28.9266 153.591 29.6321 153.827 30.2666C154.069 30.8963 154.424 31.3982 154.893 31.7723C155.366 32.1416 155.953 32.3262 156.654 32.3262Z" fill="#0A99FE"/>
</svg>
<div >
<div >Products</div>
<div >Contatos</div>
</div>
</header>
<div >
<Main>
<section>
<h1>Paintings</h1>
<ul>
<li><img src="./assets/img/painting/gamepad.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
<li><img src="./assets/img/painting/clock.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
<li><img src="./assets/img/painting/personagem.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
</ul>
</section>
<section>
<h1>Action Figures</h1>
<ul>
<li><img src="./assets/img/actions/animewoman.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
<li><img src="./assets/img/actions/dragonballpersonagem.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
<li><img src="./assets/img/actions/starwarspersonagem.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
</ul>
</section>
</Main>
</div>
CodePudding user response:
The generally simplest way to align stuff vertically these days is to use flex
with align-items: center
.
In your case:
.headerButtons {
display: flex;
justify-content: center;
align-items: center;
}
And you can get rid of text-align: center
.container {
background-color: rgb(255, 255, 255);
max-width: 95%;
margin: 0 auto;
}
header {
display: flex;
border-bottom: solid 1px black;
padding: 10px;
align-items: center;
}
.allButtons {
display: flex;
margin-left: auto;
}
.headerButtons {
margin: 10px;
background-color: rgb(10, 153, 254, .1);
display: flex;
justify-content: center;
align-items: center;
color: #0A99FE;
font-size: 20px;
width: 150px;
height: 40px;
border-radius: 10px;
}
.headerButtons:hover {
background-color: #0A99FE;
color: white;
}
ul {
margin: 0;
padding: 0;
border: 0;
display: flex;
list-style-type: none;
}
img {
border-radius: 10px;
}
li {
margin-right: 10px;
text-align: center;
background-color: #f8f8f8;
border-radius: 10px;
align-content: center;
}
h1 {
font-size: 20px;
font-weight: 400;
}
p {
font-size: 16px;
color: #868383;
}
#titleCards {
font-weight: 500;
}
<header >
<svg width="164" height="54" viewBox="0 0 164 54" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M34.6341 38.347C30.0324 40.0528 23.3232 39.2311 20.4862 37.9192C17.6411 36.6026 14.062 40.1065 18.1966 41.7563C22.3304 43.4058 29.3089 43.0965 34.6369 41.8034" fill="#0A99FE"/>
<path d="M34.6341 38.347C30.0324 40.0528 23.3232 39.2311 20.4862 37.9192C17.6411 36.6026 14.062 40.1065 18.1966 41.7563C22.3304 43.4058 29.3089 43.0965 34.6369 41.8034" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M37.3815 47.4288L35.3135 48.5538L33.8293 44.4007L35.8464 34.7222L32.7996 26.0337L36.9103 18.2146L48.8209 17.9628L51.3387 19.6712L54.0802 21.4771L54.9769 23.9681L53.8602 26.0206L52.7914 28.2193L53.5284 30.5154L51.6277 31.2494L48.2777 37.5047L42.3556 44.1037L39.9187 45.5867L37.3815 47.4288Z" fill="#0A99FE"/>
<path d="M49.8828 17.3271C53.6701 25.5104 52.6224 34.6247 45.3759 44.9323C51.416 45.9056 47.6171 50.3048 40.1762 45.8149" fill="#0A99FE"/>
<path d="M49.8828 17.3271C53.6701 25.5104 52.6224 34.6247 45.3759 44.9323C51.416 45.9056 47.6171 50.3048 40.1762 45.8149" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M33.2819 26.0334C35.8281 34.3033 35.9591 42.0565 31.6789 48.8662C35.5428 55.442 39.6209 50.6029 36.4317 48.3576" fill="#0A99FE"/>
<path d="M33.2819 26.0334C35.8281 34.3033 35.9591 42.0565 31.6789 48.8662C35.5428 55.442 39.6209 50.6029 36.4317 48.3576" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M47.7151 33.3036C46.3229 39.2472 42.4295 43.9228 36.4671 48.3316L47.7151 33.3036Z" fill="#0A99FE"/>
<path d="M47.7151 33.3036C46.3229 39.2472 42.4295 43.9228 36.4671 48.3316" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M50.6031 19.0504C55.364 21.167 56.3238 24.2183 53.0232 28.3173C54.9823 30.5633 53.4137 31.7456 51.7063 30.7128" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M33.0049 29.0136L38.6542 30.8666C39.1103 41.5652 29.7687 37.7605 35.5809 33.702C20.314 32.3437 20.5906 28.8259 35.275 19.8782L45.3531 16.9391L47.4802 19.4782" fill="#0A99FE"/>
<path d="M33.0049 29.0136L38.6542 30.8666C39.1103 41.5652 29.7687 37.7605 35.5809 33.702C20.314 32.3437 20.5906 28.8259 35.275 19.8782L45.3531 16.9391L47.4802 19.4782" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M41.3332 24.6116L31.4328 29.8635L41.3332 24.6116Z" fill="#0A99FE"/>
<path d="M41.3332 24.6116L31.4328 29.8635" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M15.4239 4.30242C14.809 7.49465 14.0051 9.26857 10.0159 11.0189C6.6965 12.4488 0.889192 13.9475 0.0136247 17.6953C4.50403 20.0811 10.5996 22.2078 19.8948 19.5555C27.2064 17.4693 32.1783 21.6527 40.451 22.1748C38.4454 17.5598 37.1082 15.3508 34.6809 13.7268C30.626 13.5208 28.1016 8.65118 24.1513 6.68459C20.8398 5.036 19.9526 4.91399 15.4239 4.30242Z" fill="black"/>
<path d="M32.2778 2.95281C32.2518 2.6826 32.4969 2.5817 32.7189 2.77121L34.98 4.70148L37.2412 6.63179C37.4632 6.8213 37.4956 7.15902 37.2995 7.23976L35.3024 8.06176L33.3053 8.8838C33.1092 8.96449 32.8317 8.72759 32.8058 8.45739L32.5418 5.70508L32.2778 2.95281Z" fill="#0A99FE"/>
<path d="M32.2778 2.95281C32.2518 2.6826 32.4969 2.5817 32.7189 2.77121L34.98 4.70148L37.2412 6.63179C37.4632 6.8213 37.4956 7.15902 37.2995 7.23976L35.3024 8.06176L33.3053 8.8838C33.1092 8.96449 32.8317 8.72759 32.8058 8.45739L32.5418 5.70508L32.2778 2.95281Z" stroke="black" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M43.4032 1.38483C43.4997 1.12527 43.784 1.11048 43.915 1.35823L45.2494 3.88157L46.5838 6.40482C46.7148 6.65257 46.5942 6.97705 46.3668 6.9889L44.0499 7.10931L41.7331 7.2298C41.5056 7.24161 41.3418 6.93191 41.4383 6.67235L42.4207 4.02865L43.4032 1.38483Z" fill="#0A99FE"/>
<path d="M43.4032 1.38483C43.4997 1.12527 43.784 1.11048 43.915 1.35823L45.2494 3.88157L46.5838 6.40482C46.7148 6.65257 46.5942 6.97705 46.3668 6.9889L44.0499 7.10931L41.7331 7.2298C41.5056 7.24161 41.3418 6.93191 41.4383 6.67235L42.4207 4.02865L43.4032 1.38483Z" stroke="black" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M52.6317 13.1373C52.5355 18.1552 47.8016 22.1548 42.0581 22.0708C36.3146 21.9868 31.7365 17.851 31.8327 12.8332C31.9288 7.81534 36.6628 3.81572 42.4063 3.89972C48.1498 3.98372 52.7278 8.11954 52.6317 13.1373Z" fill="#0A99FE"/>
<path d="M52.6317 13.1373C52.5355 18.1552 47.8016 22.1548 42.0581 22.0708C36.3146 21.9868 31.7365 17.851 31.8327 12.8332C31.9288 7.81534 36.6628 3.81572 42.4063 3.89972C48.1498 3.98372 52.7278 8.11954 52.6317 13.1373Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M40.0902 8.01892C42.6114 13.6259 46.6678 12.0728 43.6248 7.43546" stroke="black" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M44.9714 7.21087C47.0745 12.7384 50.5785 10.8353 46.8276 6.65171" stroke="black" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M47.0793 12.4942L48.3819 15.1063" stroke="black" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M50.2585 15.8632L48.4904 15.2581L47.774 17.0972" stroke="black" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M73.9091 23.7609C73.8097 23.4153 73.67 23.1099 73.4901 22.8447C73.3101 22.5748 73.09 22.3475 72.8295 22.1629C72.5739 21.9735 72.2803 21.8291 71.9489 21.7296C71.6222 21.6302 71.2599 21.5805 70.8622 21.5805C70.1188 21.5805 69.4654 21.7652 68.902 22.1345C68.3433 22.5038 67.9077 23.0412 67.5952 23.7467C67.2827 24.4474 67.1264 25.3045 67.1264 26.3177C67.1264 27.331 67.2803 28.1927 67.5881 28.9029C67.8958 29.6132 68.3314 30.1553 68.8949 30.5294C69.4583 30.8987 70.1236 31.0833 70.8906 31.0833C71.5866 31.0833 72.1809 30.9602 72.6733 30.714C73.1705 30.4631 73.5492 30.1103 73.8097 29.6558C74.0748 29.2012 74.2074 28.6638 74.2074 28.0436L74.8324 28.1359H71.0824V25.8206H77.169V27.6529C77.169 28.9313 76.8991 30.0298 76.3594 30.9484C75.8196 31.8622 75.0762 32.5677 74.1293 33.0649C73.1823 33.5573 72.098 33.8035 70.8764 33.8035C69.5128 33.8035 68.3149 33.5028 67.2827 32.9015C66.2505 32.2955 65.4455 31.4361 64.8679 30.3234C64.295 29.206 64.0085 27.8802 64.0085 26.3461C64.0085 25.1671 64.179 24.116 64.5199 23.1927C64.8655 22.2647 65.3485 21.4787 65.9688 20.8348C66.589 20.1908 67.3111 19.7008 68.1349 19.3646C68.9588 19.0284 69.8513 18.8603 70.8125 18.8603C71.6364 18.8603 72.4034 18.9811 73.1136 19.2225C73.8239 19.4593 74.4536 19.7955 75.0028 20.2311C75.5568 20.6667 76.009 21.1851 76.3594 21.7865C76.7098 22.3831 76.9347 23.0412 77.0341 23.7609H73.9091ZM84.3938 33.8177C83.2717 33.8177 82.3058 33.5904 81.4961 33.1359C80.6912 32.6766 80.0709 32.0279 79.6353 31.1899C79.1997 30.3471 78.9819 29.3504 78.9819 28.1998C78.9819 27.0777 79.1997 26.0928 79.6353 25.2453C80.0709 24.3977 80.6841 23.7372 81.4748 23.2637C82.2702 22.7903 83.203 22.5535 84.2731 22.5535C84.9928 22.5535 85.6628 22.6695 86.283 22.9015C86.908 23.1288 87.4525 23.4721 87.9165 23.9313C88.3853 24.3906 88.7499 24.9683 89.0103 25.6643C89.2707 26.3556 89.4009 27.1653 89.4009 28.0933V28.9242H80.1893V27.0492H86.5529C86.5529 26.6136 86.4582 26.2278 86.2688 25.8916C86.0794 25.5554 85.8166 25.2926 85.4805 25.1032C85.149 24.9091 84.7631 24.812 84.3228 24.812C83.8635 24.812 83.4563 24.9186 83.1012 25.1316C82.7508 25.34 82.4762 25.6217 82.2773 25.9768C82.0785 26.3272 81.9767 26.7178 81.9719 27.1487V28.9313C81.9719 29.4711 82.0714 29.9375 82.2702 30.3305C82.4738 30.7235 82.7603 31.0265 83.1296 31.2396C83.4989 31.4527 83.9369 31.5592 84.4435 31.5592C84.7797 31.5592 85.0875 31.5118 85.3668 31.4171C85.6462 31.3224 85.8853 31.1804 86.0842 30.991C86.283 30.8016 86.4345 30.5696 86.5387 30.295L89.337 30.4796C89.195 31.152 88.9038 31.7391 88.4634 32.241C88.0278 32.7382 87.4644 33.1264 86.7731 33.4058C86.0865 33.6804 85.2934 33.8177 84.3938 33.8177ZM96.3469 33.8177C95.2248 33.8177 94.2589 33.5904 93.4492 33.1359C92.6443 32.6766 92.024 32.0279 91.5884 31.1899C91.1528 30.3471 90.935 29.3504 90.935 28.1998C90.935 27.0777 91.1528 26.0928 91.5884 25.2453C92.024 24.3977 92.6372 23.7372 93.4279 23.2637C94.2234 22.7903 95.1561 22.5535 96.2262 22.5535C96.9459 22.5535 97.6159 22.6695 98.2362 22.9015C98.8612 23.1288 99.4057 23.4721 99.8697 23.9313C100.338 24.3906 100.703 24.9683 100.963 25.6643C101.224 26.3556 101.354 27.1653 101.354 28.0933V28.9242H92.1424V27.0492H98.506C98.506 26.6136 98.4113 26.2278 98.2219 25.8916C98.0326 25.5554 97.7698 25.2926 97.4336 25.1032C97.1022 24.9091 96.7163 24.812 96.2759 24.812C95.8166 24.812 95.4094 24.9186 95.0543 25.1316C94.704 25.34 94.4293 25.6217 94.2305 25.9768C94.0316 26.3272 93.9298 26.7178 93.9251 27.1487V28.9313C93.9251 29.4711 94.0245 29.9375 94.2234 30.3305C94.427 30.7235 94.7134 31.0265 95.0827 31.2396C95.4521 31.4527 95.89 31.5592 96.3967 31.5592C96.7328 31.5592 97.0406 31.5118 97.32 31.4171C97.5993 31.3224 97.8384 31.1804 98.0373 30.991C98.2362 30.8016 98.3877 30.5696 98.4918 30.295L101.29 30.4796C101.148 31.152 100.857 31.7391 100.417 32.241C99.9809 32.7382 99.4175 33.1264 98.7262 33.4058C98.0397 33.6804 97.2466 33.8177 96.3469 33.8177ZM106.07 30.4654L106.077 26.8362H106.517L110.012 22.6956H113.485L108.79 28.1785H108.073L106.07 30.4654ZM103.328 33.6046V19.0592H106.354V33.6046H103.328ZM110.147 33.6046L106.936 28.8532L108.953 26.7154L113.691 33.6046H110.147Z" fill="#1E1E1E"/>
<path d="M118.165 33.6046L114.188 19.0592H115.978L119.017 30.9058H119.159L122.256 19.0592H124.245L127.341 30.9058H127.483L130.523 19.0592H132.313L128.336 33.6046H126.517L123.307 22.0137H123.194L119.983 33.6046H118.165ZM137.696 33.8319C136.712 33.8319 135.847 33.5975 135.104 33.1288C134.365 32.66 133.788 32.0043 133.371 31.1615C132.959 30.3187 132.753 29.3338 132.753 28.2069C132.753 27.0706 132.959 26.0786 133.371 25.2311C133.788 24.3835 134.365 23.7254 135.104 23.2566C135.847 22.7879 136.712 22.5535 137.696 22.5535C138.681 22.5535 139.543 22.7879 140.282 23.2566C141.025 23.7254 141.603 24.3835 142.015 25.2311C142.431 26.0786 142.64 27.0706 142.64 28.2069C142.64 29.3338 142.431 30.3187 142.015 31.1615C141.603 32.0043 141.025 32.66 140.282 33.1288C139.543 33.5975 138.681 33.8319 137.696 33.8319ZM137.696 32.3262C138.444 32.3262 139.06 32.1345 139.543 31.751C140.026 31.3674 140.383 30.8632 140.615 30.2382C140.847 29.6132 140.963 28.9361 140.963 28.2069C140.963 27.4778 140.847 26.7983 140.615 26.1686C140.383 25.5388 140.026 25.0298 139.543 24.6416C139.06 24.2533 138.444 24.0592 137.696 24.0592C136.948 24.0592 136.333 24.2533 135.85 24.6416C135.367 25.0298 135.009 25.5388 134.777 26.1686C134.545 26.7983 134.429 27.4778 134.429 28.2069C134.429 28.9361 134.545 29.6132 134.777 30.2382C135.009 30.8632 135.367 31.3674 135.85 31.751C136.333 32.1345 136.948 32.3262 137.696 32.3262ZM145.198 33.6046V22.6956H146.817V24.3433H146.931C147.13 23.8035 147.49 23.3655 148.011 23.0294C148.531 22.6932 149.119 22.5251 149.772 22.5251C149.895 22.5251 150.049 22.5275 150.234 22.5322C150.418 22.5369 150.558 22.544 150.653 22.5535V24.2581C150.596 24.2438 150.466 24.2225 150.262 24.1941C150.063 24.161 149.853 24.1444 149.63 24.1444C149.1 24.1444 148.626 24.2557 148.21 24.4782C147.798 24.696 147.471 24.9991 147.229 25.3873C146.993 25.7708 146.874 26.2088 146.874 26.7012V33.6046H145.198ZM156.427 33.8319C155.518 33.8319 154.715 33.6023 154.019 33.143C153.323 32.679 152.779 32.0256 152.386 31.1828C151.993 30.3352 151.796 29.3338 151.796 28.1785C151.796 27.0327 151.993 26.0384 152.386 25.1956C152.779 24.3528 153.326 23.7017 154.026 23.2424C154.727 22.7831 155.537 22.5535 156.455 22.5535C157.165 22.5535 157.727 22.6719 158.138 22.9086C158.555 23.1406 158.872 23.4058 159.09 23.7041C159.313 23.9976 159.486 24.2391 159.609 24.4285H159.751V19.0592H161.427V33.6046H159.808V31.9285H159.609C159.486 32.1274 159.31 32.3783 159.083 32.6813C158.856 32.9796 158.531 33.2472 158.11 33.4839C157.689 33.7159 157.128 33.8319 156.427 33.8319ZM156.654 32.3262C157.326 32.3262 157.895 32.151 158.359 31.8007C158.823 31.4456 159.175 30.9555 159.417 30.3305C159.658 29.7008 159.779 28.974 159.779 28.1501C159.779 27.3357 159.661 26.6231 159.424 26.0123C159.187 25.3968 158.837 24.9186 158.373 24.5777C157.909 24.232 157.336 24.0592 156.654 24.0592C155.944 24.0592 155.352 24.2415 154.879 24.6061C154.41 24.9659 154.057 25.456 153.82 26.0762C153.588 26.6918 153.472 27.3831 153.472 28.1501C153.472 28.9266 153.591 29.6321 153.827 30.2666C154.069 30.8963 154.424 31.3982 154.893 31.7723C155.366 32.1416 155.953 32.3262 156.654 32.3262Z" fill="#0A99FE"/>
</svg>
<div >
<div >Products</div>
<div >Contatos</div>
</div>
</header>
<div >
<Main>
<section>
<h1>Paintings</h1>
<ul>
<li><img src="./assets/img/painting/gamepad.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
<li><img src="./assets/img/painting/clock.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
<li><img src="./assets/img/painting/personagem.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
</ul>
</section>
<section>
<h1>Action Figures</h1>
<ul>
<li><img src="./assets/img/actions/animewoman.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
<li><img src="./assets/img/actions/dragonballpersonagem.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
<li><img src="./assets/img/actions/starwarspersonagem.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
</ul>
</section>
</Main>
</div>
CodePudding user response:
The easiest way in this situation (i.e. if there is only one line of text) is to add line-height: 40px;
, i.e. the defined height of your div
. That way the top-aligned text-line fills the full height, which results in vertically centered text.
(Note: Your text doesn't contain letters with descenders, like y, p, q etc., so it might look a bit offset vertically. But as soon as you use any of these letters in your text, it will look perfectly centered.)
.container {
background-color: rgb(255, 255, 255);
max-width: 95%;
margin: 0 auto;
}
header {
display: flex;
border-bottom: solid 1px black;
padding: 10px;
align-items: center;
}
.allButtons {
display: flex;
margin-left: auto;
}
.headerButtons {
margin: 10px;
background-color: rgb(10, 153, 254, .1);
text-align: center;
color: #0A99FE;
font-size: 20px;
width: 150px;
height: 40px;
border-radius: 10px;
line-height: 40px;
}
.headerButtons:hover {
background-color: #0A99FE;
color: white;
}
ul {
margin: 0;
padding: 0;
border: 0;
display: flex;
list-style-type: none;
}
img {
border-radius: 10px;
}
li {
margin-right: 10px;
text-align: center;
background-color: #f8f8f8;
border-radius: 10px;
align-content: center;
}
h1 {
font-size: 20px;
font-weight: 400;
}
p {
font-size: 16px;
color: #868383;
}
#titleCards {
font-weight: 500;
}
<header >
<svg width="164" height="54" viewBox="0 0 164 54" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M34.6341 38.347C30.0324 40.0528 23.3232 39.2311 20.4862 37.9192C17.6411 36.6026 14.062 40.1065 18.1966 41.7563C22.3304 43.4058 29.3089 43.0965 34.6369 41.8034" fill="#0A99FE"/>
<path d="M34.6341 38.347C30.0324 40.0528 23.3232 39.2311 20.4862 37.9192C17.6411 36.6026 14.062 40.1065 18.1966 41.7563C22.3304 43.4058 29.3089 43.0965 34.6369 41.8034" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M37.3815 47.4288L35.3135 48.5538L33.8293 44.4007L35.8464 34.7222L32.7996 26.0337L36.9103 18.2146L48.8209 17.9628L51.3387 19.6712L54.0802 21.4771L54.9769 23.9681L53.8602 26.0206L52.7914 28.2193L53.5284 30.5154L51.6277 31.2494L48.2777 37.5047L42.3556 44.1037L39.9187 45.5867L37.3815 47.4288Z" fill="#0A99FE"/>
<path d="M49.8828 17.3271C53.6701 25.5104 52.6224 34.6247 45.3759 44.9323C51.416 45.9056 47.6171 50.3048 40.1762 45.8149" fill="#0A99FE"/>
<path d="M49.8828 17.3271C53.6701 25.5104 52.6224 34.6247 45.3759 44.9323C51.416 45.9056 47.6171 50.3048 40.1762 45.8149" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M33.2819 26.0334C35.8281 34.3033 35.9591 42.0565 31.6789 48.8662C35.5428 55.442 39.6209 50.6029 36.4317 48.3576" fill="#0A99FE"/>
<path d="M33.2819 26.0334C35.8281 34.3033 35.9591 42.0565 31.6789 48.8662C35.5428 55.442 39.6209 50.6029 36.4317 48.3576" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M47.7151 33.3036C46.3229 39.2472 42.4295 43.9228 36.4671 48.3316L47.7151 33.3036Z" fill="#0A99FE"/>
<path d="M47.7151 33.3036C46.3229 39.2472 42.4295 43.9228 36.4671 48.3316" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M50.6031 19.0504C55.364 21.167 56.3238 24.2183 53.0232 28.3173C54.9823 30.5633 53.4137 31.7456 51.7063 30.7128" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M33.0049 29.0136L38.6542 30.8666C39.1103 41.5652 29.7687 37.7605 35.5809 33.702C20.314 32.3437 20.5906 28.8259 35.275 19.8782L45.3531 16.9391L47.4802 19.4782" fill="#0A99FE"/>
<path d="M33.0049 29.0136L38.6542 30.8666C39.1103 41.5652 29.7687 37.7605 35.5809 33.702C20.314 32.3437 20.5906 28.8259 35.275 19.8782L45.3531 16.9391L47.4802 19.4782" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M41.3332 24.6116L31.4328 29.8635L41.3332 24.6116Z" fill="#0A99FE"/>
<path d="M41.3332 24.6116L31.4328 29.8635" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M15.4239 4.30242C14.809 7.49465 14.0051 9.26857 10.0159 11.0189C6.6965 12.4488 0.889192 13.9475 0.0136247 17.6953C4.50403 20.0811 10.5996 22.2078 19.8948 19.5555C27.2064 17.4693 32.1783 21.6527 40.451 22.1748C38.4454 17.5598 37.1082 15.3508 34.6809 13.7268C30.626 13.5208 28.1016 8.65118 24.1513 6.68459C20.8398 5.036 19.9526 4.91399 15.4239 4.30242Z" fill="black"/>
<path d="M32.2778 2.95281C32.2518 2.6826 32.4969 2.5817 32.7189 2.77121L34.98 4.70148L37.2412 6.63179C37.4632 6.8213 37.4956 7.15902 37.2995 7.23976L35.3024 8.06176L33.3053 8.8838C33.1092 8.96449 32.8317 8.72759 32.8058 8.45739L32.5418 5.70508L32.2778 2.95281Z" fill="#0A99FE"/>
<path d="M32.2778 2.95281C32.2518 2.6826 32.4969 2.5817 32.7189 2.77121L34.98 4.70148L37.2412 6.63179C37.4632 6.8213 37.4956 7.15902 37.2995 7.23976L35.3024 8.06176L33.3053 8.8838C33.1092 8.96449 32.8317 8.72759 32.8058 8.45739L32.5418 5.70508L32.2778 2.95281Z" stroke="black" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M43.4032 1.38483C43.4997 1.12527 43.784 1.11048 43.915 1.35823L45.2494 3.88157L46.5838 6.40482C46.7148 6.65257 46.5942 6.97705 46.3668 6.9889L44.0499 7.10931L41.7331 7.2298C41.5056 7.24161 41.3418 6.93191 41.4383 6.67235L42.4207 4.02865L43.4032 1.38483Z" fill="#0A99FE"/>
<path d="M43.4032 1.38483C43.4997 1.12527 43.784 1.11048 43.915 1.35823L45.2494 3.88157L46.5838 6.40482C46.7148 6.65257 46.5942 6.97705 46.3668 6.9889L44.0499 7.10931L41.7331 7.2298C41.5056 7.24161 41.3418 6.93191 41.4383 6.67235L42.4207 4.02865L43.4032 1.38483Z" stroke="black" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M52.6317 13.1373C52.5355 18.1552 47.8016 22.1548 42.0581 22.0708C36.3146 21.9868 31.7365 17.851 31.8327 12.8332C31.9288 7.81534 36.6628 3.81572 42.4063 3.89972C48.1498 3.98372 52.7278 8.11954 52.6317 13.1373Z" fill="#0A99FE"/>
<path d="M52.6317 13.1373C52.5355 18.1552 47.8016 22.1548 42.0581 22.0708C36.3146 21.9868 31.7365 17.851 31.8327 12.8332C31.9288 7.81534 36.6628 3.81572 42.4063 3.89972C48.1498 3.98372 52.7278 8.11954 52.6317 13.1373Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M40.0902 8.01892C42.6114 13.6259 46.6678 12.0728 43.6248 7.43546" stroke="black" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M44.9714 7.21087C47.0745 12.7384 50.5785 10.8353 46.8276 6.65171" stroke="black" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M47.0793 12.4942L48.3819 15.1063" stroke="black" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M50.2585 15.8632L48.4904 15.2581L47.774 17.0972" stroke="black" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M73.9091 23.7609C73.8097 23.4153 73.67 23.1099 73.4901 22.8447C73.3101 22.5748 73.09 22.3475 72.8295 22.1629C72.5739 21.9735 72.2803 21.8291 71.9489 21.7296C71.6222 21.6302 71.2599 21.5805 70.8622 21.5805C70.1188 21.5805 69.4654 21.7652 68.902 22.1345C68.3433 22.5038 67.9077 23.0412 67.5952 23.7467C67.2827 24.4474 67.1264 25.3045 67.1264 26.3177C67.1264 27.331 67.2803 28.1927 67.5881 28.9029C67.8958 29.6132 68.3314 30.1553 68.8949 30.5294C69.4583 30.8987 70.1236 31.0833 70.8906 31.0833C71.5866 31.0833 72.1809 30.9602 72.6733 30.714C73.1705 30.4631 73.5492 30.1103 73.8097 29.6558C74.0748 29.2012 74.2074 28.6638 74.2074 28.0436L74.8324 28.1359H71.0824V25.8206H77.169V27.6529C77.169 28.9313 76.8991 30.0298 76.3594 30.9484C75.8196 31.8622 75.0762 32.5677 74.1293 33.0649C73.1823 33.5573 72.098 33.8035 70.8764 33.8035C69.5128 33.8035 68.3149 33.5028 67.2827 32.9015C66.2505 32.2955 65.4455 31.4361 64.8679 30.3234C64.295 29.206 64.0085 27.8802 64.0085 26.3461C64.0085 25.1671 64.179 24.116 64.5199 23.1927C64.8655 22.2647 65.3485 21.4787 65.9688 20.8348C66.589 20.1908 67.3111 19.7008 68.1349 19.3646C68.9588 19.0284 69.8513 18.8603 70.8125 18.8603C71.6364 18.8603 72.4034 18.9811 73.1136 19.2225C73.8239 19.4593 74.4536 19.7955 75.0028 20.2311C75.5568 20.6667 76.009 21.1851 76.3594 21.7865C76.7098 22.3831 76.9347 23.0412 77.0341 23.7609H73.9091ZM84.3938 33.8177C83.2717 33.8177 82.3058 33.5904 81.4961 33.1359C80.6912 32.6766 80.0709 32.0279 79.6353 31.1899C79.1997 30.3471 78.9819 29.3504 78.9819 28.1998C78.9819 27.0777 79.1997 26.0928 79.6353 25.2453C80.0709 24.3977 80.6841 23.7372 81.4748 23.2637C82.2702 22.7903 83.203 22.5535 84.2731 22.5535C84.9928 22.5535 85.6628 22.6695 86.283 22.9015C86.908 23.1288 87.4525 23.4721 87.9165 23.9313C88.3853 24.3906 88.7499 24.9683 89.0103 25.6643C89.2707 26.3556 89.4009 27.1653 89.4009 28.0933V28.9242H80.1893V27.0492H86.5529C86.5529 26.6136 86.4582 26.2278 86.2688 25.8916C86.0794 25.5554 85.8166 25.2926 85.4805 25.1032C85.149 24.9091 84.7631 24.812 84.3228 24.812C83.8635 24.812 83.4563 24.9186 83.1012 25.1316C82.7508 25.34 82.4762 25.6217 82.2773 25.9768C82.0785 26.3272 81.9767 26.7178 81.9719 27.1487V28.9313C81.9719 29.4711 82.0714 29.9375 82.2702 30.3305C82.4738 30.7235 82.7603 31.0265 83.1296 31.2396C83.4989 31.4527 83.9369 31.5592 84.4435 31.5592C84.7797 31.5592 85.0875 31.5118 85.3668 31.4171C85.6462 31.3224 85.8853 31.1804 86.0842 30.991C86.283 30.8016 86.4345 30.5696 86.5387 30.295L89.337 30.4796C89.195 31.152 88.9038 31.7391 88.4634 32.241C88.0278 32.7382 87.4644 33.1264 86.7731 33.4058C86.0865 33.6804 85.2934 33.8177 84.3938 33.8177ZM96.3469 33.8177C95.2248 33.8177 94.2589 33.5904 93.4492 33.1359C92.6443 32.6766 92.024 32.0279 91.5884 31.1899C91.1528 30.3471 90.935 29.3504 90.935 28.1998C90.935 27.0777 91.1528 26.0928 91.5884 25.2453C92.024 24.3977 92.6372 23.7372 93.4279 23.2637C94.2234 22.7903 95.1561 22.5535 96.2262 22.5535C96.9459 22.5535 97.6159 22.6695 98.2362 22.9015C98.8612 23.1288 99.4057 23.4721 99.8697 23.9313C100.338 24.3906 100.703 24.9683 100.963 25.6643C101.224 26.3556 101.354 27.1653 101.354 28.0933V28.9242H92.1424V27.0492H98.506C98.506 26.6136 98.4113 26.2278 98.2219 25.8916C98.0326 25.5554 97.7698 25.2926 97.4336 25.1032C97.1022 24.9091 96.7163 24.812 96.2759 24.812C95.8166 24.812 95.4094 24.9186 95.0543 25.1316C94.704 25.34 94.4293 25.6217 94.2305 25.9768C94.0316 26.3272 93.9298 26.7178 93.9251 27.1487V28.9313C93.9251 29.4711 94.0245 29.9375 94.2234 30.3305C94.427 30.7235 94.7134 31.0265 95.0827 31.2396C95.4521 31.4527 95.89 31.5592 96.3967 31.5592C96.7328 31.5592 97.0406 31.5118 97.32 31.4171C97.5993 31.3224 97.8384 31.1804 98.0373 30.991C98.2362 30.8016 98.3877 30.5696 98.4918 30.295L101.29 30.4796C101.148 31.152 100.857 31.7391 100.417 32.241C99.9809 32.7382 99.4175 33.1264 98.7262 33.4058C98.0397 33.6804 97.2466 33.8177 96.3469 33.8177ZM106.07 30.4654L106.077 26.8362H106.517L110.012 22.6956H113.485L108.79 28.1785H108.073L106.07 30.4654ZM103.328 33.6046V19.0592H106.354V33.6046H103.328ZM110.147 33.6046L106.936 28.8532L108.953 26.7154L113.691 33.6046H110.147Z" fill="#1E1E1E"/>
<path d="M118.165 33.6046L114.188 19.0592H115.978L119.017 30.9058H119.159L122.256 19.0592H124.245L127.341 30.9058H127.483L130.523 19.0592H132.313L128.336 33.6046H126.517L123.307 22.0137H123.194L119.983 33.6046H118.165ZM137.696 33.8319C136.712 33.8319 135.847 33.5975 135.104 33.1288C134.365 32.66 133.788 32.0043 133.371 31.1615C132.959 30.3187 132.753 29.3338 132.753 28.2069C132.753 27.0706 132.959 26.0786 133.371 25.2311C133.788 24.3835 134.365 23.7254 135.104 23.2566C135.847 22.7879 136.712 22.5535 137.696 22.5535C138.681 22.5535 139.543 22.7879 140.282 23.2566C141.025 23.7254 141.603 24.3835 142.015 25.2311C142.431 26.0786 142.64 27.0706 142.64 28.2069C142.64 29.3338 142.431 30.3187 142.015 31.1615C141.603 32.0043 141.025 32.66 140.282 33.1288C139.543 33.5975 138.681 33.8319 137.696 33.8319ZM137.696 32.3262C138.444 32.3262 139.06 32.1345 139.543 31.751C140.026 31.3674 140.383 30.8632 140.615 30.2382C140.847 29.6132 140.963 28.9361 140.963 28.2069C140.963 27.4778 140.847 26.7983 140.615 26.1686C140.383 25.5388 140.026 25.0298 139.543 24.6416C139.06 24.2533 138.444 24.0592 137.696 24.0592C136.948 24.0592 136.333 24.2533 135.85 24.6416C135.367 25.0298 135.009 25.5388 134.777 26.1686C134.545 26.7983 134.429 27.4778 134.429 28.2069C134.429 28.9361 134.545 29.6132 134.777 30.2382C135.009 30.8632 135.367 31.3674 135.85 31.751C136.333 32.1345 136.948 32.3262 137.696 32.3262ZM145.198 33.6046V22.6956H146.817V24.3433H146.931C147.13 23.8035 147.49 23.3655 148.011 23.0294C148.531 22.6932 149.119 22.5251 149.772 22.5251C149.895 22.5251 150.049 22.5275 150.234 22.5322C150.418 22.5369 150.558 22.544 150.653 22.5535V24.2581C150.596 24.2438 150.466 24.2225 150.262 24.1941C150.063 24.161 149.853 24.1444 149.63 24.1444C149.1 24.1444 148.626 24.2557 148.21 24.4782C147.798 24.696 147.471 24.9991 147.229 25.3873C146.993 25.7708 146.874 26.2088 146.874 26.7012V33.6046H145.198ZM156.427 33.8319C155.518 33.8319 154.715 33.6023 154.019 33.143C153.323 32.679 152.779 32.0256 152.386 31.1828C151.993 30.3352 151.796 29.3338 151.796 28.1785C151.796 27.0327 151.993 26.0384 152.386 25.1956C152.779 24.3528 153.326 23.7017 154.026 23.2424C154.727 22.7831 155.537 22.5535 156.455 22.5535C157.165 22.5535 157.727 22.6719 158.138 22.9086C158.555 23.1406 158.872 23.4058 159.09 23.7041C159.313 23.9976 159.486 24.2391 159.609 24.4285H159.751V19.0592H161.427V33.6046H159.808V31.9285H159.609C159.486 32.1274 159.31 32.3783 159.083 32.6813C158.856 32.9796 158.531 33.2472 158.11 33.4839C157.689 33.7159 157.128 33.8319 156.427 33.8319ZM156.654 32.3262C157.326 32.3262 157.895 32.151 158.359 31.8007C158.823 31.4456 159.175 30.9555 159.417 30.3305C159.658 29.7008 159.779 28.974 159.779 28.1501C159.779 27.3357 159.661 26.6231 159.424 26.0123C159.187 25.3968 158.837 24.9186 158.373 24.5777C157.909 24.232 157.336 24.0592 156.654 24.0592C155.944 24.0592 155.352 24.2415 154.879 24.6061C154.41 24.9659 154.057 25.456 153.82 26.0762C153.588 26.6918 153.472 27.3831 153.472 28.1501C153.472 28.9266 153.591 29.6321 153.827 30.2666C154.069 30.8963 154.424 31.3982 154.893 31.7723C155.366 32.1416 155.953 32.3262 156.654 32.3262Z" fill="#0A99FE"/>
</svg>
<div >
<div >Products</div>
<div >Contatos</div>
</div>
</header>
<div >
<Main>
<section>
<h1>Paintings</h1>
<ul>
<li><img src="./assets/img/painting/gamepad.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
<li><img src="./assets/img/painting/clock.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
<li><img src="./assets/img/painting/personagem.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
</ul>
</section>
<section>
<h1>Action Figures</h1>
<ul>
<li><img src="./assets/img/actions/animewoman.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
<li><img src="./assets/img/actions/dragonballpersonagem.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
<li><img src="./assets/img/actions/starwarspersonagem.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
</ul>
</section>
</Main>
</div>
CodePudding user response:
I found your code doesn't have link tag inside the div (navigation button). I don't know if it was intentional or not. but i tried to add link tag there. "align-items: center;" on the "headerButtons" class worked fine. now the text is in the middle of the button (div).
.container {
background-color: rgb(255, 255, 255);
max-width: 95%;
margin: 0 auto;
}
header {
display: flex;
border-bottom: solid 1px black;
padding: 10px;
align-items: center;
}
.allButtons {
display: flex;
margin-left: auto;
}
.headerButtons {
margin: 10px;
background-color: rgb(10, 153, 254, .1);
display: flex;
justify-content: center;
align-items: center;
color: #0A99FE;
font-size: 20px;
width: 150px;
height: 40px;
border-radius: 10px;
}
.headerButtons a {
text-decoration: none; // remove underscores in links, specific to that section.
}
.headerButtons:hover {
background-color: #0A99FE;
color: white;
}
ul {
margin: 0;
padding: 0;
border: 0;
display: flex;
list-style-type: none;
}
img {
border-radius: 10px;
}
li {
margin-right: 10px;
text-align: center;
background-color: #f8f8f8;
border-radius: 10px;
align-content: center;
}
h1 {
font-size: 20px;
font-weight: 400;
}
p {
font-size: 16px;
color: #868383;
}
#titleCards {
font-weight: 500;
}
<header >
<svg width="164" height="54" viewBox="0 0 164 54" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M34.6341 38.347C30.0324 40.0528 23.3232 39.2311 20.4862 37.9192C17.6411 36.6026 14.062 40.1065 18.1966 41.7563C22.3304 43.4058 29.3089 43.0965 34.6369 41.8034" fill="#0A99FE"/>
<path d="M34.6341 38.347C30.0324 40.0528 23.3232 39.2311 20.4862 37.9192C17.6411 36.6026 14.062 40.1065 18.1966 41.7563C22.3304 43.4058 29.3089 43.0965 34.6369 41.8034" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M37.3815 47.4288L35.3135 48.5538L33.8293 44.4007L35.8464 34.7222L32.7996 26.0337L36.9103 18.2146L48.8209 17.9628L51.3387 19.6712L54.0802 21.4771L54.9769 23.9681L53.8602 26.0206L52.7914 28.2193L53.5284 30.5154L51.6277 31.2494L48.2777 37.5047L42.3556 44.1037L39.9187 45.5867L37.3815 47.4288Z" fill="#0A99FE"/>
<path d="M49.8828 17.3271C53.6701 25.5104 52.6224 34.6247 45.3759 44.9323C51.416 45.9056 47.6171 50.3048 40.1762 45.8149" fill="#0A99FE"/>
<path d="M49.8828 17.3271C53.6701 25.5104 52.6224 34.6247 45.3759 44.9323C51.416 45.9056 47.6171 50.3048 40.1762 45.8149" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M33.2819 26.0334C35.8281 34.3033 35.9591 42.0565 31.6789 48.8662C35.5428 55.442 39.6209 50.6029 36.4317 48.3576" fill="#0A99FE"/>
<path d="M33.2819 26.0334C35.8281 34.3033 35.9591 42.0565 31.6789 48.8662C35.5428 55.442 39.6209 50.6029 36.4317 48.3576" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M47.7151 33.3036C46.3229 39.2472 42.4295 43.9228 36.4671 48.3316L47.7151 33.3036Z" fill="#0A99FE"/>
<path d="M47.7151 33.3036C46.3229 39.2472 42.4295 43.9228 36.4671 48.3316" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M50.6031 19.0504C55.364 21.167 56.3238 24.2183 53.0232 28.3173C54.9823 30.5633 53.4137 31.7456 51.7063 30.7128" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M33.0049 29.0136L38.6542 30.8666C39.1103 41.5652 29.7687 37.7605 35.5809 33.702C20.314 32.3437 20.5906 28.8259 35.275 19.8782L45.3531 16.9391L47.4802 19.4782" fill="#0A99FE"/>
<path d="M33.0049 29.0136L38.6542 30.8666C39.1103 41.5652 29.7687 37.7605 35.5809 33.702C20.314 32.3437 20.5906 28.8259 35.275 19.8782L45.3531 16.9391L47.4802 19.4782" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M41.3332 24.6116L31.4328 29.8635L41.3332 24.6116Z" fill="#0A99FE"/>
<path d="M41.3332 24.6116L31.4328 29.8635" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M15.4239 4.30242C14.809 7.49465 14.0051 9.26857 10.0159 11.0189C6.6965 12.4488 0.889192 13.9475 0.0136247 17.6953C4.50403 20.0811 10.5996 22.2078 19.8948 19.5555C27.2064 17.4693 32.1783 21.6527 40.451 22.1748C38.4454 17.5598 37.1082 15.3508 34.6809 13.7268C30.626 13.5208 28.1016 8.65118 24.1513 6.68459C20.8398 5.036 19.9526 4.91399 15.4239 4.30242Z" fill="black"/>
<path d="M32.2778 2.95281C32.2518 2.6826 32.4969 2.5817 32.7189 2.77121L34.98 4.70148L37.2412 6.63179C37.4632 6.8213 37.4956 7.15902 37.2995 7.23976L35.3024 8.06176L33.3053 8.8838C33.1092 8.96449 32.8317 8.72759 32.8058 8.45739L32.5418 5.70508L32.2778 2.95281Z" fill="#0A99FE"/>
<path d="M32.2778 2.95281C32.2518 2.6826 32.4969 2.5817 32.7189 2.77121L34.98 4.70148L37.2412 6.63179C37.4632 6.8213 37.4956 7.15902 37.2995 7.23976L35.3024 8.06176L33.3053 8.8838C33.1092 8.96449 32.8317 8.72759 32.8058 8.45739L32.5418 5.70508L32.2778 2.95281Z" stroke="black" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M43.4032 1.38483C43.4997 1.12527 43.784 1.11048 43.915 1.35823L45.2494 3.88157L46.5838 6.40482C46.7148 6.65257 46.5942 6.97705 46.3668 6.9889L44.0499 7.10931L41.7331 7.2298C41.5056 7.24161 41.3418 6.93191 41.4383 6.67235L42.4207 4.02865L43.4032 1.38483Z" fill="#0A99FE"/>
<path d="M43.4032 1.38483C43.4997 1.12527 43.784 1.11048 43.915 1.35823L45.2494 3.88157L46.5838 6.40482C46.7148 6.65257 46.5942 6.97705 46.3668 6.9889L44.0499 7.10931L41.7331 7.2298C41.5056 7.24161 41.3418 6.93191 41.4383 6.67235L42.4207 4.02865L43.4032 1.38483Z" stroke="black" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M52.6317 13.1373C52.5355 18.1552 47.8016 22.1548 42.0581 22.0708C36.3146 21.9868 31.7365 17.851 31.8327 12.8332C31.9288 7.81534 36.6628 3.81572 42.4063 3.89972C48.1498 3.98372 52.7278 8.11954 52.6317 13.1373Z" fill="#0A99FE"/>
<path d="M52.6317 13.1373C52.5355 18.1552 47.8016 22.1548 42.0581 22.0708C36.3146 21.9868 31.7365 17.851 31.8327 12.8332C31.9288 7.81534 36.6628 3.81572 42.4063 3.89972C48.1498 3.98372 52.7278 8.11954 52.6317 13.1373Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M40.0902 8.01892C42.6114 13.6259 46.6678 12.0728 43.6248 7.43546" stroke="black" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M44.9714 7.21087C47.0745 12.7384 50.5785 10.8353 46.8276 6.65171" stroke="black" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M47.0793 12.4942L48.3819 15.1063" stroke="black" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M50.2585 15.8632L48.4904 15.2581L47.774 17.0972" stroke="black" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round"/>
<path d="M73.9091 23.7609C73.8097 23.4153 73.67 23.1099 73.4901 22.8447C73.3101 22.5748 73.09 22.3475 72.8295 22.1629C72.5739 21.9735 72.2803 21.8291 71.9489 21.7296C71.6222 21.6302 71.2599 21.5805 70.8622 21.5805C70.1188 21.5805 69.4654 21.7652 68.902 22.1345C68.3433 22.5038 67.9077 23.0412 67.5952 23.7467C67.2827 24.4474 67.1264 25.3045 67.1264 26.3177C67.1264 27.331 67.2803 28.1927 67.5881 28.9029C67.8958 29.6132 68.3314 30.1553 68.8949 30.5294C69.4583 30.8987 70.1236 31.0833 70.8906 31.0833C71.5866 31.0833 72.1809 30.9602 72.6733 30.714C73.1705 30.4631 73.5492 30.1103 73.8097 29.6558C74.0748 29.2012 74.2074 28.6638 74.2074 28.0436L74.8324 28.1359H71.0824V25.8206H77.169V27.6529C77.169 28.9313 76.8991 30.0298 76.3594 30.9484C75.8196 31.8622 75.0762 32.5677 74.1293 33.0649C73.1823 33.5573 72.098 33.8035 70.8764 33.8035C69.5128 33.8035 68.3149 33.5028 67.2827 32.9015C66.2505 32.2955 65.4455 31.4361 64.8679 30.3234C64.295 29.206 64.0085 27.8802 64.0085 26.3461C64.0085 25.1671 64.179 24.116 64.5199 23.1927C64.8655 22.2647 65.3485 21.4787 65.9688 20.8348C66.589 20.1908 67.3111 19.7008 68.1349 19.3646C68.9588 19.0284 69.8513 18.8603 70.8125 18.8603C71.6364 18.8603 72.4034 18.9811 73.1136 19.2225C73.8239 19.4593 74.4536 19.7955 75.0028 20.2311C75.5568 20.6667 76.009 21.1851 76.3594 21.7865C76.7098 22.3831 76.9347 23.0412 77.0341 23.7609H73.9091ZM84.3938 33.8177C83.2717 33.8177 82.3058 33.5904 81.4961 33.1359C80.6912 32.6766 80.0709 32.0279 79.6353 31.1899C79.1997 30.3471 78.9819 29.3504 78.9819 28.1998C78.9819 27.0777 79.1997 26.0928 79.6353 25.2453C80.0709 24.3977 80.6841 23.7372 81.4748 23.2637C82.2702 22.7903 83.203 22.5535 84.2731 22.5535C84.9928 22.5535 85.6628 22.6695 86.283 22.9015C86.908 23.1288 87.4525 23.4721 87.9165 23.9313C88.3853 24.3906 88.7499 24.9683 89.0103 25.6643C89.2707 26.3556 89.4009 27.1653 89.4009 28.0933V28.9242H80.1893V27.0492H86.5529C86.5529 26.6136 86.4582 26.2278 86.2688 25.8916C86.0794 25.5554 85.8166 25.2926 85.4805 25.1032C85.149 24.9091 84.7631 24.812 84.3228 24.812C83.8635 24.812 83.4563 24.9186 83.1012 25.1316C82.7508 25.34 82.4762 25.6217 82.2773 25.9768C82.0785 26.3272 81.9767 26.7178 81.9719 27.1487V28.9313C81.9719 29.4711 82.0714 29.9375 82.2702 30.3305C82.4738 30.7235 82.7603 31.0265 83.1296 31.2396C83.4989 31.4527 83.9369 31.5592 84.4435 31.5592C84.7797 31.5592 85.0875 31.5118 85.3668 31.4171C85.6462 31.3224 85.8853 31.1804 86.0842 30.991C86.283 30.8016 86.4345 30.5696 86.5387 30.295L89.337 30.4796C89.195 31.152 88.9038 31.7391 88.4634 32.241C88.0278 32.7382 87.4644 33.1264 86.7731 33.4058C86.0865 33.6804 85.2934 33.8177 84.3938 33.8177ZM96.3469 33.8177C95.2248 33.8177 94.2589 33.5904 93.4492 33.1359C92.6443 32.6766 92.024 32.0279 91.5884 31.1899C91.1528 30.3471 90.935 29.3504 90.935 28.1998C90.935 27.0777 91.1528 26.0928 91.5884 25.2453C92.024 24.3977 92.6372 23.7372 93.4279 23.2637C94.2234 22.7903 95.1561 22.5535 96.2262 22.5535C96.9459 22.5535 97.6159 22.6695 98.2362 22.9015C98.8612 23.1288 99.4057 23.4721 99.8697 23.9313C100.338 24.3906 100.703 24.9683 100.963 25.6643C101.224 26.3556 101.354 27.1653 101.354 28.0933V28.9242H92.1424V27.0492H98.506C98.506 26.6136 98.4113 26.2278 98.2219 25.8916C98.0326 25.5554 97.7698 25.2926 97.4336 25.1032C97.1022 24.9091 96.7163 24.812 96.2759 24.812C95.8166 24.812 95.4094 24.9186 95.0543 25.1316C94.704 25.34 94.4293 25.6217 94.2305 25.9768C94.0316 26.3272 93.9298 26.7178 93.9251 27.1487V28.9313C93.9251 29.4711 94.0245 29.9375 94.2234 30.3305C94.427 30.7235 94.7134 31.0265 95.0827 31.2396C95.4521 31.4527 95.89 31.5592 96.3967 31.5592C96.7328 31.5592 97.0406 31.5118 97.32 31.4171C97.5993 31.3224 97.8384 31.1804 98.0373 30.991C98.2362 30.8016 98.3877 30.5696 98.4918 30.295L101.29 30.4796C101.148 31.152 100.857 31.7391 100.417 32.241C99.9809 32.7382 99.4175 33.1264 98.7262 33.4058C98.0397 33.6804 97.2466 33.8177 96.3469 33.8177ZM106.07 30.4654L106.077 26.8362H106.517L110.012 22.6956H113.485L108.79 28.1785H108.073L106.07 30.4654ZM103.328 33.6046V19.0592H106.354V33.6046H103.328ZM110.147 33.6046L106.936 28.8532L108.953 26.7154L113.691 33.6046H110.147Z" fill="#1E1E1E"/>
<path d="M118.165 33.6046L114.188 19.0592H115.978L119.017 30.9058H119.159L122.256 19.0592H124.245L127.341 30.9058H127.483L130.523 19.0592H132.313L128.336 33.6046H126.517L123.307 22.0137H123.194L119.983 33.6046H118.165ZM137.696 33.8319C136.712 33.8319 135.847 33.5975 135.104 33.1288C134.365 32.66 133.788 32.0043 133.371 31.1615C132.959 30.3187 132.753 29.3338 132.753 28.2069C132.753 27.0706 132.959 26.0786 133.371 25.2311C133.788 24.3835 134.365 23.7254 135.104 23.2566C135.847 22.7879 136.712 22.5535 137.696 22.5535C138.681 22.5535 139.543 22.7879 140.282 23.2566C141.025 23.7254 141.603 24.3835 142.015 25.2311C142.431 26.0786 142.64 27.0706 142.64 28.2069C142.64 29.3338 142.431 30.3187 142.015 31.1615C141.603 32.0043 141.025 32.66 140.282 33.1288C139.543 33.5975 138.681 33.8319 137.696 33.8319ZM137.696 32.3262C138.444 32.3262 139.06 32.1345 139.543 31.751C140.026 31.3674 140.383 30.8632 140.615 30.2382C140.847 29.6132 140.963 28.9361 140.963 28.2069C140.963 27.4778 140.847 26.7983 140.615 26.1686C140.383 25.5388 140.026 25.0298 139.543 24.6416C139.06 24.2533 138.444 24.0592 137.696 24.0592C136.948 24.0592 136.333 24.2533 135.85 24.6416C135.367 25.0298 135.009 25.5388 134.777 26.1686C134.545 26.7983 134.429 27.4778 134.429 28.2069C134.429 28.9361 134.545 29.6132 134.777 30.2382C135.009 30.8632 135.367 31.3674 135.85 31.751C136.333 32.1345 136.948 32.3262 137.696 32.3262ZM145.198 33.6046V22.6956H146.817V24.3433H146.931C147.13 23.8035 147.49 23.3655 148.011 23.0294C148.531 22.6932 149.119 22.5251 149.772 22.5251C149.895 22.5251 150.049 22.5275 150.234 22.5322C150.418 22.5369 150.558 22.544 150.653 22.5535V24.2581C150.596 24.2438 150.466 24.2225 150.262 24.1941C150.063 24.161 149.853 24.1444 149.63 24.1444C149.1 24.1444 148.626 24.2557 148.21 24.4782C147.798 24.696 147.471 24.9991 147.229 25.3873C146.993 25.7708 146.874 26.2088 146.874 26.7012V33.6046H145.198ZM156.427 33.8319C155.518 33.8319 154.715 33.6023 154.019 33.143C153.323 32.679 152.779 32.0256 152.386 31.1828C151.993 30.3352 151.796 29.3338 151.796 28.1785C151.796 27.0327 151.993 26.0384 152.386 25.1956C152.779 24.3528 153.326 23.7017 154.026 23.2424C154.727 22.7831 155.537 22.5535 156.455 22.5535C157.165 22.5535 157.727 22.6719 158.138 22.9086C158.555 23.1406 158.872 23.4058 159.09 23.7041C159.313 23.9976 159.486 24.2391 159.609 24.4285H159.751V19.0592H161.427V33.6046H159.808V31.9285H159.609C159.486 32.1274 159.31 32.3783 159.083 32.6813C158.856 32.9796 158.531 33.2472 158.11 33.4839C157.689 33.7159 157.128 33.8319 156.427 33.8319ZM156.654 32.3262C157.326 32.3262 157.895 32.151 158.359 31.8007C158.823 31.4456 159.175 30.9555 159.417 30.3305C159.658 29.7008 159.779 28.974 159.779 28.1501C159.779 27.3357 159.661 26.6231 159.424 26.0123C159.187 25.3968 158.837 24.9186 158.373 24.5777C157.909 24.232 157.336 24.0592 156.654 24.0592C155.944 24.0592 155.352 24.2415 154.879 24.6061C154.41 24.9659 154.057 25.456 153.82 26.0762C153.588 26.6918 153.472 27.3831 153.472 28.1501C153.472 28.9266 153.591 29.6321 153.827 30.2666C154.069 30.8963 154.424 31.3982 154.893 31.7723C155.366 32.1416 155.953 32.3262 156.654 32.3262Z" fill="#0A99FE"/>
</svg>
<div >
<div ><a href="#">Products</a></div>
<div ><a href="#">Contatos</a></div>
</div>
</header>
<div >
<Main>
<section>
<h1>Paintings</h1>
<ul>
<li><img src="./assets/img/painting/gamepad.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
<li><img src="./assets/img/painting/clock.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
<li><img src="./assets/img/painting/personagem.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
</ul>
</section>
<section>
<h1>Action Figures</h1>
<ul>
<li><img src="./assets/img/actions/animewoman.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
<li><img src="./assets/img/actions/dragonballpersonagem.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
<li><img src="./assets/img/actions/starwarspersonagem.jpg" height="275" width="207" alt="">
<p>
<h1>Main text</h1>
</p>
<p>Some leftover</p>
</li>
</ul>
</section>
</Main>
</div>