.termekek-oldal { color: #0f263a; }
.termekek-tartalom { overflow: hidden; background: #fff; }
.termekek-fejlec { position: relative; padding: 85px 0 90px; color: #fff; background-image:
    linear-gradient(rgba(15, 38, 58, 0.65), rgba(15, 38, 58, 0.65)),
    url(../images/001.jpg); background-position: center center; background-size: cover; background-repeat: no-repeat; }
.termekek-fejlec:after { position: absolute; right: -80px; bottom: -130px; width: 360px; height: 360px; border: 70px solid rgba(250,185,10,.12); border-radius: 50%; content: ""; }
.termekek-kiscim { display: inline-block; margin-bottom: 14px; color: #fab90a; font-size: 14px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; }
.termekek-kiscim .fa { margin-right: 7px; }
.termekek-fejlec h1 { margin: 0 0 20px; color: #fff; font-size: 46px; font-weight: 700; line-height: 1.15; }
.termekek-fejlec p { max-width: 720px; margin: 0; color: rgba(255,255,255,.82); font-size: 18px; line-height: 1.7; }
.termekek-lista { padding: 75px 0 85px; }
.termek-csoport { scroll-margin-top: 20px; }
.termek-csoport-szurke { background: #f5f7f8; }
.termek-csoport-nav { padding: 17px 0; border-bottom: 1px solid #e7ebee; background: #fff; box-shadow: 0 4px 15px rgba(15,38,58,.06); }
.termek-csoport-nav a { display: inline-block; margin: 4px 5px; padding: 9px 16px; border: 1px solid #dce1e5; color: #0f263a; background: #fff; font-size: 13px; font-weight: 700; text-decoration: none; transition: all .2s ease; }
.termek-csoport-nav a:hover, .termek-csoport-nav a:focus { border-color: #fab90a; color: #0f263a; background: #fab90a; }
.termek-csoport-szam { display: inline-block; margin-bottom: 8px; color: #fab90a; font-size: 13px; font-weight: 700; letter-spacing: 2px; }
.termekek-bevezeto { max-width: 760px; margin: 0 auto 48px; }
.termekek-bevezeto h2 { margin: 0 0 12px; color: #0f263a; font-size: 30px; font-weight: 700; }
.termekek-bevezeto p { margin: 0; color: #66727c; font-size: 16px; line-height: 1.7; }
.termekek-figyelmeztetes { display: table; width: 100%; margin: 0 0 38px; padding: 22px 25px; border-left: 5px solid #fab90a; color: #fff; background: #0f263a; box-shadow: 0 10px 25px rgba(15,38,58,.12); }
.termekek-figyelmeztetes > .fa, .termekek-figyelmeztetes > div { display: table-cell; vertical-align: top; }
.termekek-figyelmeztetes > .fa { width: 48px; padding-top: 2px; color: #fab90a; font-size: 29px; }
.termekek-figyelmeztetes strong { display: block; margin-bottom: 5px; color: #fab90a; font-size: 16px; }
.termekek-figyelmeztetes p { margin: 0; color: rgba(255,255,255,.84); font-size: 14px; line-height: 1.65; }
.termek-kartya { margin-bottom: 34px; border: 1px solid #e7ebee; background: #fff; box-shadow: 0 12px 35px rgba(15,38,58,.08); }
.termek-kartya:last-child { margin-bottom: 0; }
.termek-sor { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; }
.termek-sor > [class*="col-"] { float: none; }
.termek-kep, .termek-kep > a, .termek-placeholder { display: block; width: 100%; height: 100%; min-height: 390px; }
.termek-kep { position: relative; overflow: hidden; background: #eef1f3; }
.termek-kep img { width: 100%; height: 100%; min-height: 390px; object-fit: cover; -webkit-transition: -webkit-transform .35s ease; transition: transform .35s ease; }
.termek-kep a:hover img { -webkit-transform: scale(1.04); transform: scale(1.04); }
.termek-nagyitas { position: absolute; right: 20px; bottom: 20px; width: 48px; height: 48px; border-radius: 50%; color: #0f263a; background: #fab90a; font-size: 18px; line-height: 48px; text-align: center; box-shadow: 0 5px 15px rgba(15,38,58,.25); }
.termek-placeholder { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; color: #0f263a; background: #f3f5f6; font-weight: 700; }
.termek-placeholder .fa { margin-bottom: 15px; color: #fab90a; font-size: 52px; }
.termek-adatok { position: relative; min-height: 390px; padding: 42px 45px; }
.termek-sorszam { display: inline-block; margin-bottom: 9px; color: #fab90a; font-size: 13px; font-weight: 700; letter-spacing: 2px; }
.termek-adatok h2 { margin: 0 0 13px; color: #0f263a; font-size: 28px; font-weight: 700; }
.termek-leiras { margin-bottom: 23px; color: #66727c; font-size: 15px; line-height: 1.65; }
.termek-jellemzok { margin-bottom: 20px; }
.termek-jellemzo { display: table; width: 100%; margin-bottom: 10px; }
.termek-jellemzo > .fa, .termek-jellemzo > div { display: table-cell; vertical-align: middle; }
.termek-jellemzo > .fa { width: 38px; color: #fab90a; font-size: 22px; }
.termek-jellemzo strong, .termek-jellemzo span { display: block; }
.termek-jellemzo strong { color: #77818a; font-size: 11px; letter-spacing: .7px; text-transform: uppercase; }
.termek-jellemzo span { margin-top: 2px; color: #0f263a; font-size: 15px; font-weight: 700; }
.termek-felhasznalas { margin-bottom: 23px; padding: 16px 18px; border-left: 3px solid #fab90a; background: #f6f7f8; }
.termek-felhasznalas h3 { margin: 0 0 7px; color: #0f263a; font-size: 14px; font-weight: 700; }
.termek-felhasznalas h3 .fa { margin-right: 5px; color: #fab90a; }
.termek-felhasznalas p { margin: 0; color: #66727c; font-size: 13px; line-height: 1.55; }
.termek-gomb { padding: 11px 20px; border: 2px solid #fab90a; border-radius: 0; color: #0f263a; background: #fab90a; font-weight: 700; -webkit-transition: all .2s ease; transition: all .2s ease; }
.termek-gomb:hover, .termek-gomb:focus { border-color: #0f263a; color: #fff; background: #0f263a; }
.termek-gomb .fa-angle-right { margin-left: 8px; }
.termekek-cta { padding: 48px 0; color: #0f263a; background: #fab90a; }
/* .termekek-cta { padding: 48px 0; color: #fff; background: #0f263a; } */
.termekek-cta h2 { margin: 0 0 10px; color: #0f263a; font-size: 25px; font-weight: 700; }
.termekek-cta p { margin: 0; color: #0f263a; line-height: 1.6; }
.cta-gomb-doboz { padding-top: 9px; }
.termek-gomb-vilagos .fa { margin-right: 7px; }
.termek-gomb-vilagos:hover, .termek-gomb-vilagos:focus { border-color: #fff; color: #0f263a; background: #fff; }

.btn-csikli-dark {
    padding: 14px 25px;
    border: 2px solid #0f263a;
    border-radius: 3px;
    background: #0f263a;
    color: #fff !important;
    font-weight: 700;
}

.btn-csikli-dark:hover,
.btn-csikli-dark:focus {
    background: transparent;
    color: #0f263a !important;
}

@media (max-width: 767px) {
    .termekek-fejlec { padding: 55px 0 60px; }
    .termekek-fejlec h1 { font-size: 34px; }
    .termekek-fejlec p { font-size: 16px; }
    .termekek-lista { padding: 50px 0 55px; }
    .termek-csoport-nav a { display: block; margin: 7px 0; }
    .termekek-bevezeto { margin-bottom: 32px; }
    .termekek-bevezeto h2 { font-size: 25px; }
    .termekek-figyelmeztetes { display: block; padding: 22px 20px; text-align: center; }
    .termekek-figyelmeztetes > .fa, .termekek-figyelmeztetes > div { display: block; width: auto; }
    .termekek-figyelmeztetes > .fa { margin-bottom: 10px; }
    .termek-sor { display: block; }
    .termek-sor > [class*="col-"] { float: left; }
    .termek-kep, .termek-kep > a, .termek-kep img, .termek-placeholder { min-height: 240px; height: 240px; }
    .termek-adatok { min-height: 0; padding: 30px 25px 34px; }
    .termek-adatok h2 { font-size: 24px; }
    .termekek-cta, .cta-gomb-doboz { text-align: center; }
    .cta-gomb-doboz { padding-top: 24px; }
}