Predefinição:Skillbox/styles.css
Ir para navegação
Ir para pesquisar
.skillbox-container {
width: 100%;
font-family: sans-serif;
color: #222;
margin: 0 auto;
overflow-x: clip; /* <-- este é o isolamento */
position: relative; /* necessário para o clip funcionar */
}
.skillbox-inner {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
padding: 0;
}
.skillbox-info-area {
width: 100%;
max-width: 900px;
display: flex;
flex-direction: column;
align-items: center;
margin: 24px 0 0;
padding: 0;
}
.skillbox-wrapper {
width: 100%;
max-width: 900px;
box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
margin: 0 auto;
}
.skillbox-tabs-separator {
width: 100vw;
height: 2px;
background: #ccc;
margin: 0 calc(-50vw + 50%);
}
.skillbox-tabs {
display: flex;
flex-wrap: wrap;
justify-content: center;
width: 100%;
gap: 6px;
padding: 0;
margin-bottom: -2px;
}
.skillbox-tab {
cursor: pointer;
background: #eaf1fb;
color: #1d3f63;
border: 2px solid #337ab7;
border-bottom: none;
border-radius: 6px 6px 0 0;
padding: 8px 16px;
font-size: 1em;
font-weight: bold;
transition: background 0.2s ease;
}
.skillbox-tab.active,
.skillbox-tab:hover {
background: #337ab7;
color: #fff;
border-color: #337ab7;
border-bottom: none;
}
.skillbox-desc {
font-size: 1em;
width: 100%;
max-width: 840px;
text-align: center;
font-weight: 500;
line-height: 1.6;
margin: 0 auto;
color: #222;
padding: 12px 0 8px;
}
.skillbox-video-area {
width: 100%;
max-width: 900px;
display: flex;
justify-content: center;
align-items: center;
padding: 0 !important;
margin: 0 auto !important;
}
.skillbox-video video {
width: 100%;
max-width: 720px;
min-height: 270px;
background: #000;
border-radius: 6px;
display: block;
margin: 0 auto;
padding: 0;
vertical-align: middle;
}
@media (max-width: 768px) {
.skillbox-tab {
padding: 8px 14px;
font-size: 1.05em;
}
.skillbox-desc {
font-size: 0.95em;
padding: 10px 0 6px;
}
.skillbox-video video {
max-width: 100%;
min-height: 220px;
}
}