* { 
scroll-behavior: smooth;
}
html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul, dd, dt, li, tbody, td, tfoot, th, thead, tr, button, del, ins, map, object, a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span, strong, sub, sup, tt, var, legend, fieldset { 
margin: 0; 
padding: 0; 
}
:focus::-webkit-input-placeholder { opacity: 0; }
:focus::-moz-placeholder { opacity: 0; }
:focus:-moz-placeholder { opacity: 0; }
:focus:-ms-input-placeholder { opacity: 0; }
::-webkit-input-placeholder { color: #A4A2A0; opacity: 1; }
::-moz-placeholder { color: #A4A2A0; opacity: 1; }
:-moz-placeholder { color: #A4A2A0; opacity: 1; }
:-ms-input-placeholder { color: #A4A2A0; opacity: 1; }
body { 
background: #fff; 
color: #1D2746; 
font-family: Calibri, Tahoma, Arial, Verdana; 
font-size: 100%;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 
display: block; 
}
nav { 
background: rgba(35, 35, 77, 0.9); 
box-shadow: 0 1px 10px rgba(0, 0, 0, 0.1); 
width: 100%; 
position: sticky; 
top: 0; 
z-index: 100; 
}
.nav { 
max-width: 1200px; 
margin: 0 auto; 
padding: 15px 20px; 
display: flex; 
justify-content: space-between; 
align-items: center; 
position: relative; 
z-index: 1; 
}
.nav .nav-logo { 
background: url(//fribety.ru/wp-content/themes/frbtheme/images/nav-logo.png) no-repeat; 
width: 165px; 
height: 32px; 
transition: 0.25s ease-in-out; 
}
.nav .nav-logo:hover { 
background: url(//fribety.ru/wp-content/themes/frbtheme/images/nav-logo-hover.png) no-repeat; 
transition: 0.25s ease-in-out; 
}
.menu { 
display: flex; 
list-style: none; 
font-size: 105%; 
}
.menu li a { 
color: #16FF66; 
text-decoration: none; 
padding: 6px 10px 4px 10px; 
border-bottom: 2px dashed rgba(255, 255, 255, 0); 
display: block; 
transition: 0.25s ease-in-out; 
}
.menu li a:hover { 
color: #5AC4FF; 
background: rgba(255, 255, 255, 0.1); 
border-bottom: 2px dashed rgba(255, 255, 255, 0.3); 
transition: 0.25s ease-in-out; 
}
.menu li a.top-10 { 
color: rgba(35, 35, 77, 1); 
background: #5AC4FF; 
font-weight: bold; 
text-decoration: none; 
padding: 6px 10px 4px 10px; 
display: block; 
margin: 0; 
transition: 0.25s ease-in-out; 
}
.menu li a.top-10:hover { 
background: rgba(255, 255, 255, 0.9); 
color: rgba(35, 35, 77, 0.9); 
transition: 0.25s ease-in-out; 
}
.menu-toggle { 
display: none; 
cursor: pointer; 
width: 32px; 
height: 22px; 
position: relative; 
z-index: 101; 
}
.menu-toggle span { 
display: block; 
position: absolute; 
height: 4px; 
width: 100%; 
background: #fafafa; 
border-radius: 3px; 
opacity: 1; 
left: 0; 
transform: rotate(0deg); 
transition: all .25s ease-in-out; 
}
.menu-toggle span:nth-child(1) { top: 0; }
.menu-toggle span:nth-child(2), 
.menu-toggle span:nth-child(3) { top: 10px; }
.menu-toggle span:nth-child(4) { top: 20px; }
.menu-toggle.active span:nth-child(1), 
.menu-toggle.active span:nth-child(4) { 
top: 10px; 
width: 0%; 
left: 50%; 
}
.menu-toggle.active span:nth-child(2) { transform: rotate(45deg); }
.menu-toggle.active span:nth-child(3) { transform: rotate(-45deg); }
.bookmakers { 
width: 100%; 
background: #EEF8CE; 
box-shadow: inset 0 -2px 0 rgba(90, 90, 90, 0.1); 
text-align: center; 
padding: 15px 0 5px 0; 
font-size: 90%; 
}
.bookmakers ul { 
list-style: none; 
padding: 0; 
margin: 0; 
display: inline-block; 
}
.bookmakers li { 
display: inline-flex; 
align-items: center; 
margin: 0 7px 10px 7px; 
color: #1364BF; 
line-height: 20px; 
transition: all .25s ease-in-out; 
white-space: nowrap; 
}
.bookmakers li a { 
display: inline-flex; 
align-items: center; 
opacity: .75; 
filter: grayscale(100%); 
color: #5a5a5a; 
text-decoration: none; 
transition: all .25s ease-in-out; 
}
.bookmakers li a:hover { 
opacity: 1; 
filter: grayscale(0); 
}
.bookmakers li img { 
width: 20px; 
height: 20px; 
margin-right: 5px; 
flex-shrink: 0; 
}
.mini-baltbet, .mini-betboom, .mini-betcity, .mini-fonbet, .mini-leon, .mini-ligastavok, .mini-marathon, .mini-melbet, .mini-pari, .mini-wiline, .mini-zenit { 
cursor: pointer; 
}
.breadcrumb { 
width: 1200px; 
margin: 0 auto; 
font-size: 90%; 
color: #555; 
padding: 10px 0; 
line-height: 1.5; 
}
.breadcrumb a { 
text-decoration: none; 
padding: 5px 0; 
}
.breadcrumb a span { 
box-shadow: 0 -2px 0 0 rgba(24, 29, 85, 0.5) inset; 
text-decoration: none; 
padding: 0 0 2px 0; 
}
.breadcrumb a span:hover { 
box-shadow: 0 -2px 0 0 rgba(39, 157, 47, 0.5) inset; 
}
.breadcrumb span:last-child { color: #555; }
.breadcrumb .separator { margin: 0 5px; color: #555; }
.toc-toggle { 
font-weight: normal; 
font-size: 110%; 
display: flex; 
align-items: center; 
justify-content: space-between; 
color: #444; 
background-color: #f9f9f9; 
border-bottom: 1px solid #ddd; 
cursor: pointer; 
transition: all 0.3s ease; 
margin: 0 0 2% 0; 
padding: 10px 2%; 
width: 96%; 
}
.toc-toggle:hover { 
background-color: #f1f1f1; 
border-color: #ccc; 
}
.toc-toggle .icon { 
font-size: 110%; 
color: #333; 
transition: transform 0.3s ease; 
}
.toc-toggle.active .icon { 
transform: rotate(45deg); 
}
.toc-list { 
display: none; 
list-style-type: none; 
margin: 0; 
padding: 0; 
}
.toc-list li { 
margin: 0 0 5px 0; 
}
.toc-list li a { 
text-decoration: none; 
}
.toc-list li.toc-level-3 { 
padding-left: 20px; 
}
.toc-list li.toc-level-4 { 
padding-left: 40px; 
}
header { 
background: rgba(35, 35, 77, 1) url(//fribety.ru/wp-content/themes/frbtheme/images/header-info-bg.png) no-repeat 100% 100%; 
width: 100%; 
margin: 0 auto; 
overflow: hidden; 
padding: 20px 0 10px 0; 
}
header .width { 
width: 1200px; 
margin: 0 auto; 
}
header img { 
margin: 0; 
display: block; 
width: 256px; 
height: 256px; 
float: right; 
}
header h1 { 
margin: 0; 
line-height: 1.25; 
color: #fafafa; 
text-shadow: rgba(0, 0, 0, 0.2) 0 2px; 
font-size: 200%; 
}
header ul { 
padding: 0 0 0 30px; 
color: #fff; 
font-size: 110%; 
text-shadow: rgba(0, 0, 0, 0.2) 0 2px; 
}
header ul li { 
margin: 3px 0; 
}
header p { 
margin: 10px 0; 
color: #fff; 
line-height: 1.5; 
font-size: 110%; 
text-shadow: rgba(0, 0, 0, 0.2) 0 2px; 
}
main { 
width: 1200px; 
margin: 0 auto; 
padding: 0 0 1% 0; 
background: #fff; 
overflow: hidden; 
}
article { 
width: 870px; 
margin: 0 auto 30px auto; 
float: left; 
}
aside { 
width: 300px; 
margin: 0 auto; 
float: right; 
}
article h1 { 
font-size: 200%; 
margin: 0 0 2% 0; 
}
article h2 { 
font-size: 180%; 
margin: 2% 0 2% 0; 
}
article h3 { 
font-size: 160%; 
margin: 2% 0 2% 0; 
}
article h4 { 
font-size: 140%; 
margin: 2% 0 2% 0; 
}
article p { 
font-size: 100%; 
line-height: 1.5; 
margin: 1% 0; 
font-size: 125%; 
}
article ol, 
article ul { 
font-size: 100%; 
padding: 10px 20px; 
margin: 2% 0; 
background: #f9f9f9; 
}
article li { 
margin: 5px 0 0 15px; 
line-height: 1.5; 
font-size: 125%; 
}
article img { 
margin: 0 auto 2% auto; 
display: block; 
width: 100%; 
height: auto; 
}
article table { 
width: 100%; 
font-size: 100%; 
border-collapse: collapse; 
color: #333; 
background: #f9f9f9; 
margin: 2% 0; 
}
article th, 
article td { 
padding: 12px 15px; 
text-align: left; 
transition: all 0.3s ease; 
}
article th { 
background-color: #e0e0e0; 
font-weight: bold; 
color: #555; 
}
article table tr:nth-child(even) { 
background-color: #f0f0f0; 
}
article table td { 
border-bottom: 1px solid #ddd; 
transition: all 0.1s; 
}
article table tr:hover { 
background-color: #fafafa; 
}
article a { 
color: #279D2F; 
-webkit-box-shadow: 0px -2px 0px 0px rgba(39, 100, 167, .25) inset; 
text-decoration: none; 
padding: 0 4px 2px 4px; 
background: #fafafa; 
}
article a:hover { 
color: #669EDB; 
-webkit-box-shadow: 0px -2px 0px 0px rgba(39, 100, 167, .50) inset; 
transition: all 0.2s; 
}
.official { 
cursor: pointer; 
color: #279D2F; 
-webkit-box-shadow: 0px -2px 0px 0px rgba(39, 100, 167, .25) inset; 
text-decoration: none; 
padding: 0 4px 2px 4px; 
background: #fafafa; 
}
.official:hover { 
color: #669EDB; 
-webkit-box-shadow: 0px -2px 0px 0px rgba(39, 100, 167, .50) inset; 
transition: all 0.2s; 
}
aside ul li { 
list-style: none; 
margin: 0 0 10px 0; 
font-size: 125%; 
width: 100%; 
display: inline-block; 
}
aside ul li img { 
margin: 0 5px 0 0; 
float: left; 
vertical-align: middle; 
display: block; 
}
aside h3 { 
font-size: 160%; 
margin: 0 0 2% 0; 
}
aside a { 
color: #279D2F; 
-webkit-box-shadow: 0px -2px 0px 0px rgba(39, 100, 167, .25) inset; 
text-decoration: none; 
padding: 0 4px 2px 4px; 
background: #fafafa; 
}
aside a:hover { 
color: #669EDB; 
-webkit-box-shadow: 0px -2px 0px 0px rgba(39, 100, 167, .50) inset; 
transition: all 0.2s; 
}
.faq-item { 
overflow: hidden; 
display: block; 
margin: 0 0 20px 0; 
}
.faq-question { 
font-weight: normal; 
display: flex; 
align-items: center; 
justify-content: space-between; 
color: #444; 
background-color: #f9f9f9; 
border-bottom: 1px solid #ddd; 
cursor: pointer; 
transition: all 0.3s ease; 
margin: 0 0 1px 0; 
padding: 9px 2%; 
width: 96%; 
}
.faq-question:hover { 
background-color: #f1f1f1; 
border-color: #ccc; 
}
.faq-question.active { 
background-color: #f1f1f1; 
color: #111; 
}
.faq-question .icon { 
font-size: 110%; 
color: #333; 
transition: transform 0.3s ease; 
}
.faq-question.active .icon { 
transform: rotate(45deg); 
color: #111; 
}
.faq-answer { 
display: none; 
padding: 0 2%; 
color: #555; 
line-height: 1.5; 
}
.faq-answer.open { 
display: block; 
animation: fadeIn 0.5s; 
}
@keyframes fadeIn { 
from { 
opacity: 0; 
transform: translateY(-10px); 
} 
to { 
opacity: 1; 
transform: translateY(0); 
} 
}
.social { 
width: 100%; 
background: #DBEDFD; 
text-align: center; 
padding: 10px 0 8px 0; 
font-size: 95%; 
letter-spacing: 1px; 
margin: 0; 
list-style: none; 
}
.social li { 
display: inline-flex; 
align-items: center; 
margin: 0 2%; 
color: #1364BF; 
line-height: 20px; 
opacity: 0.5; 
transition: opacity 0.25s ease-in-out; 
}
.social li:hover { 
opacity: 0.9; 
}
.social li a { 
display: inline-flex; 
align-items: center; 
color: inherit; 
text-decoration: none; 
}
.social li img { 
width: 20px; 
height: 20px; 
margin-right: 5px; 
vertical-align: middle; 
}
.social .vk, 
.social .tg, 
.social .dzen { 
cursor: pointer; 
position: relative; 
}
.promo-width { 
width: 1200px; 
margin: 15px auto; 
}
.tabs { 
display: flex; 
text-align: center; 
-webkit-touch-callout: none; 
-webkit-user-select: none; 
-khtml-user-select: none; 
-moz-user-select: none; 
-ms-user-select: none; 
user-select: none; 
}
.tab-link { 
padding: 3px 15px; 
border: none; 
cursor: pointer; 
font-size: 120%; 
position: relative; 
margin: 0; 
transition: all .25s ease-in-out; 
}
.tab-link:hover { 
background-color: #F3F4F7; 
transition: all .25s ease-in-out; 
}
.tab-link.active { 
color: #2c3e50; 
font-weight: 600; 
background-color: #DEE0EA; 
}
.tab-content { 
display: none; 
animation: fadeIn 0.5s ease; 
}
@keyframes fadeIn { 
from { 
opacity: 0; 
} 
to { 
opacity: 1; 
} 
}
.tab-content.active { 
display: block; 
}
.table-container { 
width: 100%; 
overflow-x: auto; 
background: white; 
cursor: default; 
}
table { 
width: 100%; 
border-collapse: collapse; 
background: white; 
}
thead { 
-webkit-touch-callout: none; 
-webkit-user-select: none; 
-khtml-user-select: none; 
-moz-user-select: none; 
-ms-user-select: none; 
user-select: none; 
}
th, td { 
padding: 10px; 
text-align: left; 
border-bottom: 2px dotted #DFE8C2; 
}
th { 
background-color: #34396E; 
font-weight: 600; 
position: sticky; 
color: #fff; 
top: 0; 
}
tr { 
background-color: #F6FBE5; 
transition: all .25s ease-in-out; 
}
tr:hover { 
background-color: #F9F9FB; 
transition: all .25s ease-in-out; 
}
tr p { 
font-size: 67%; 
margin: 0 0 0 10px; 
color: #777; 
}
td strong { 
display: none; 
}
.max-freebet { 
color: #31A04A; 
font-weight: bold; 
font-size: 125%; 
}
.register-btn { 
display: inline-block; 
background: linear-gradient(90deg, rgba(48,159,74,1) 0%, rgba(77,186,34,1) 100%); 
color: white; 
margin: 0 15px 0 0; 
padding: 5px 10px; 
text-decoration: none; 
font-weight: 600; 
text-align: center; 
min-width: 120px; 
float: right; 
box-shadow: 0 2px 4px rgba(0,0,0,0.1); 
}
.register-btn:hover { 
background: linear-gradient(90deg, rgba(77,186,34,1) 0%, rgba(48,159,74,1) 100%); 
}
.sort-container { 
background: #fafafa; 
border-top: solid 2px #DEE0EA; 
padding: 10px; 
cursor: default; 
-webkit-touch-callout: none; 
-webkit-user-select: none; 
-khtml-user-select: none; 
-moz-user-select: none; 
-ms-user-select: none; 
user-select: none; 
}
.sort-link { 
text-decoration: none; 
cursor: pointer; 
border-bottom: 2px dotted #C8E76E; 
padding: 0 5px; 
white-space: nowrap; 
display: inline-block; 
background: #ECF4D6; 
margin: 2px; 
transition: all .25s ease-in-out; 
}
.sort-link:hover { 
background: #D9EBAA; 
border-bottom: 2px dotted #BBCCA4; 
transition: all .25s ease-in-out; 
}
.sort-link.active { 
background: #414E8B; 
color: white; 
border-bottom: 2px dotted #414E8B; 
}
.sort-link.asc::after { 
content: " ▲"; 
font-weight: bold; 
}
.sort-link.desc::after { 
content: " ▼"; 
font-weight: bold; 
}
footer { 
width: 1200px; 
margin: 0 auto; 
padding: 0; 
color: #1D2746; 
}
footer .copy { 
padding: 2% 0; 
background: #EEF8CE; 
}
footer .cattie { 
display: block;
}
footer p { 
padding: 10px 2%;
}
footer ul { 
width: 28%; 
padding: 2%; 
display: inline-block; 
overflow: hidden; 
list-style: none;
}
footer ul a { 
color: #f0f0f0; 
opacity: 0.5; 
transition: all .25s ease-in-out;
}
footer ul a:hover { 
opacity: 1; 
transition: all .25s ease-in-out;
}
.copyrights { 
opacity: 0.5;
} #cookie-notice {
position: fixed;
bottom: 0;
left: 0;
right: 0;
background: rgba(35, 35, 77, 0.95);
color: #fff;
padding: 12px 15px;
display: flex;
justify-content: space-between;
align-items: center;
z-index: 10000;
box-shadow: 0 -2px 10px rgba(0,0,0,0.2);
font-family: Calibri, Tahoma, Arial, Verdana;
font-size: 95%;
transition: all 0.5s ease;
border-top: 1px solid rgba(90, 196, 255, 0.3);
opacity: 0;
visibility: hidden;
transform: translateY(100%);
}
#cookie-notice.show {
opacity: 1;
visibility: visible;
transform: translateY(0);
}
.cookie-text {
flex: 1;
margin-right: 15px;
line-height: 1.4;
font-size: 95%;
}
.cookie-link {
color: #5AC4FF;
-webkit-box-shadow: 0px -2px 0px 0px rgba(90, 196, 255, 0.5) inset;
text-decoration: none;
padding: 0 3px 1px 3px;
transition: all 0.2s;
background: rgba(255, 255, 255, 0.05);
font-size: 95%;
}
.cookie-link:hover {
color: #16FF66;
-webkit-box-shadow: 0px -2px 0px 0px rgba(22, 255, 102, 0.5) inset;
background: rgba(255, 255, 255, 0.1);
}
.cookie-button {
background: linear-gradient(90deg, rgba(48,159,74,1) 0%, rgba(77,186,34,1) 100%);
color: white;
border: none;
padding: 7px 15px;
font-weight: 600;
cursor: pointer;
border-radius: 3px;
transition: all 0.2s;
font-size: 95%;
text-transform: uppercase;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
min-width: 110px;
}
.cookie-button:hover {
background: linear-gradient(90deg, rgba(77,186,34,1) 0%, rgba(48,159,74,1) 100%);
transform: translateY(-2px);
box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}
tr.baltbet-tr { cursor: pointer; }
tr.betboom-tr { cursor: pointer; }
tr.betcity-tr { cursor: pointer; }
tr.bettery-tr { cursor: pointer; }
tr.fonbet-tr { cursor: pointer; }
tr.leon-tr { cursor: pointer; }
tr.liga-stavok-tr { cursor: pointer; }
tr.marathon-tr { cursor: pointer; }
tr.melbet-tr { cursor: pointer; }
tr.olimp-tr { cursor: pointer; }
tr.pari-tr { cursor: pointer; }
tr.tennisi-tr { cursor: pointer; }
tr.winline-tr { cursor: pointer; }
tr.zenit-tr { cursor: pointer; }
@media (max-width: 1210px) {
header .width {
width: 96%; 
padding: 0 2%;
}
} @media (max-width: 768px) {
#cookie-notice {
flex-direction: column;
text-align: center;
padding: 10px;
}
.cookie-text {
margin-right: 0;
margin-bottom: 10px;
font-size: 90%;
}
.cookie-button {
width: 100%;
max-width: 180px;
padding: 8px;
font-size: 90%;
}
.cookie-link {
font-size: 90%;
}
footer .cattie {
padding: 0;
}
footer ul { 
width: 96%; 
padding: 2%;
} article p, 
article li, 
aside ul li,
.faq-question,
.toc-toggle {
font-size: 100% !important;
}
article h1 { font-size: 170%; }
article h2 { font-size: 150%; }
article h3 { font-size: 140%; }
article h4 { font-size: 130%; }
header h1 { 
font-size: 170%;
margin-top: 15px;
}
header p, 
header ul {
font-size: 100%;
}
}
@media (max-width: 520px) {
#cookie-notice {
padding: 8px;
}
.cookie-text {
font-size: 85%;
}
.cookie-link {
font-size: 85%;
}
} @media (max-width: 1200px) {
main, 
footer { 
max-width: 100%; 
}
.nav { 
max-width: 100%; 
}
.header-info { 
max-width: 100%; 
}
.promo-width { 
max-width: 96%; 
margin: 15px 2%;
}
article { 
width: 59%; 
margin: 0 2% 2% 2%; 
float: left; 
}
aside { 
width: 35%; 
margin: 0 auto; 
float: right; 
}
.breadcrumb {
width: 96%; 
margin: 0 2%;
}
} @media (max-width: 768px) {
header img { 
margin: 0 auto; 
display: block; 
width: 256px; 
height: 256px; 
float: none; 
}
article { 
width: 96%; 
margin: 0 2% 2% 2%; 
float: left; 
}
aside { 
width: 96%; 
margin: 0 2% 2% 2%; 
float: right; 
}
.tabs { 
flex-wrap: wrap; 
}
.tab-link { 
padding: 10px; 
}
th, 
td { 
padding: 5px 10px; 
}
td div strong { 
display: block; 
}
.sort-container { 
padding: 10px; 
margin: 0 0 10px 0; 
}
.sort-link { 
padding: 0 5px; 
}
table { 
border: 0; 
cursor: default; 
}
table thead { 
display: none; 
}
table tr { 
display: block; 
padding: 0; 
margin: 0 0 10px 0; 
overflow: hidden; 
}
table td { 
display: flex; 
justify-content: space-between; 
padding: 5px 15px; 
text-align: right; 
}
table td:before { 
content: attr(data-label); 
font-weight: 600; 
margin-right: 10px; 
text-align: left; 
flex: 1; 
}
table td:last-child { 
border-bottom: none; 
background: #F6FBE5; 
padding: 10px 10px 10px 0; 
text-align: center; 
}
table td:first-child { 
display: flex; 
align-items: center; 
gap: 15px; 
padding: 10px 15px 10px 15px; 
}
table td:first-child:before { 
display: none; 
}
table td:first-child img { 
margin: 0 0 0 5px; 
max-height: 40px; 
}
table td:first-child > div { 
display: flex; 
flex-direction: column; 
}
table td:first-child p { 
margin: 0; 
font-size: 67%; 
}
.register-btn { 
padding: 5px 10px; 
width: 100%; 
box-shadow: 0 2px 4px rgba(0,0,0,0.1); 
display: block; 
float: none; 
margin: 0 auto; 
}
.menu { 
position: absolute; 
top: 100%; 
left: 0; 
width: 100%; 
background: #f8f8f8; 
flex-direction: column; 
max-height: 0; 
overflow: hidden; 
transition: max-height 0.3s ease-out; 
}
.menu.active { 
max-height: 500px; 
}
.menu li { 
text-align: center; 
border-top: 1px solid #eee; 
background: #fff; 
}
.menu li a { 
color: #301B25; 
text-decoration: none; 
padding: 15px; 
display: block; 
font-weight: bold; 
transition: color 0.3s; 
}
.menu li a.top-10 { 
border-radius: 0; 
padding: 15px 0; 
margin: 0; 
box-shadow: 0 1px 10px rgba(0,0,0,0.1); 
}
.menu-toggle { 
display: block; 
}
.section-1 table, 
.section-1 thead, 
.section-1 tbody, 
.section-1 th, 
.section-1 td, 
.section-1 tr { 
display: block; 
}
.section-1 thead tr { 
display: none; 
}
.section-1 tr { 
margin-bottom: 10px; 
padding: 10px; 
background-color: #fff; 
}
.section-1 td { 
padding: 10px; 
position: relative; 
}
.section-1 td::before { 
content: attr(data-label); 
position: absolute; 
left: 15px; 
width: 45%; 
font-weight: bold; 
white-space: nowrap; 
color: #666; 
}
}