@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local("Roboto"), local("Roboto-Regular"), url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Me5Q.ttf) format("truetype");
}
@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local("Roboto Bold"), local("Roboto-Bold"), url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlvAw.ttf) format("truetype");
}
@font-face {
    font-family: "Encode Sans";
    font-style: normal;
    font-weight: 400;
    font-stretch: normal;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/encodesans/v6/LDIcapOFNxEwR-Bd1O9uYNmnUQomAgE25imKSbHhROjLsZBWTSrQGGHjZtU.ttf) format("truetype");
}
@font-face {
    font-family: "Encode Sans";
    font-style: normal;
    font-weight: 500;
    font-stretch: normal;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/encodesans/v6/LDIcapOFNxEwR-Bd1O9uYNmnUQomAgE25imKSbHhROjLsZBWTSrQGFPjZtU.ttf) format("truetype");
}
@font-face {
    font-family: "Encode Sans";
    font-style: normal;
    font-weight: 700;
    font-stretch: normal;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/encodesans/v6/LDIcapOFNxEwR-Bd1O9uYNmnUQomAgE25imKSbHhROjLsZBWTSrQGIbkZtU.ttf) format("truetype");
}
/* ------------- Main setup ----------- */
html, body{
    font-size: 14px;
    font-family: 'Encode Sans', sans-serif;
    color:rgb(26,26,26);
}
.btn, 
.form-control{
    border-radius: 0;
}
.btn-maszol { 
    color: #FFFFFF; 
    background-color: #E01E33; 
    border-color: #E01E33; 
  } 
   
  .btn-maszol:hover, 
  .btn-maszol:focus, 
  .btn-maszol:active, 
  .btn-maszol.active, 
  .open .dropdown-toggle.btn-maszol { 
    color: #FFFFFF; 
    background-color: #e01e33; 
    border-color: #E01E33; 
  } 
   
  .btn-maszol:active, 
  .btn-maszol.active, 
  .open .dropdown-toggle.btn-maszol { 
    background-image: none; 
  } 
   
  .btn-maszol.disabled, 
  .btn-maszol[disabled], 
  fieldset[disabled] .btn-maszol, 
  .btn-maszol.disabled:hover, 
  .btn-maszol[disabled]:hover, 
  fieldset[disabled] .btn-maszol:hover, 
  .btn-maszol.disabled:focus, 
  .btn-maszol[disabled]:focus, 
  fieldset[disabled] .btn-maszol:focus, 
  .btn-maszol.disabled:active, 
  .btn-maszol[disabled]:active, 
  fieldset[disabled] .btn-maszol:active, 
  .btn-maszol.disabled.active, 
  .btn-maszol[disabled].active, 
  fieldset[disabled] .btn-maszol.active { 
    background-color: #E01E33; 
    border-color: #E01E33; 
  } 
   
  .btn-maszol .badge { 
    color: #E01E33; 
    background-color: #FFFFFF; 
  }
.form-control:focus{
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: -webkit-focus-ring-color auto 0px;
    background-color: rgb(255,255,255);
}
button:focus,
.btn:focus{
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: -webkit-focus-ring-color auto 0px;
}
.btn-light:not(:disabled):not(.disabled).active:focus, .btn-light:not(:disabled):not(.disabled):active:focus, .show>.btn-light.dropdown-toggle:focus{
    box-shadow: none;
    outline:none;
}
.btn-success:not(:disabled):not(.disabled).active:focus, .btn-success:not(:disabled):not(.disabled):active:focus, .show>.btn-success.dropdown-toggle:focus{
    box-shadow: none;
}
.dropdown-item.active, .dropdown-item:active{
    background-color: initial;
}
/* ------------------------ Pagination -------------------*/
.pagination_container{
    margin: 30px 0;
}
.pagination_container .pagination{
    justify-content: center;
}
.page-link,
.page-link:hover{
    color: rgb(224,30,51);
}
.page-item.active{
    background-color: rgb(224,30,51);
    border-color: rgb(224,30,51);
    position: relative;
    display: block;
    padding: 0.5rem 0.75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: #ffffff;
    border: 1px solid #dee2e6;
}
.maszol_red,
a{
    color:rgb(224,30,51);
}
a:hover{
    color:rgb(224,30,51);
    text-decoration: none;
}
.container-xl {
    padding-left: 0px;
    padding-right: 0px;
}
.pointer{
    cursor: pointer;
}
.bg_gray{
    background-color: rgb(235,235,235);
}
html .form-control::-webkit-input-placeholder { color:rgb(224,30,51); }
html .form-control:-moz-placeholder { color:rgb(224,30,51); }
html .form-control::-moz-placeholder { color:rgb(224,30,51); }
html .form-control:-ms-input-placeholder { color:rgb(224,30,51); }

main{
    margin-top: 62px;
    min-height: 100vh;
}

section h1, 
aside h1{
    text-transform: uppercase;
    color:rgb(224,30,51);
    font-size: 19px;
    font-weight: bold;
    padding: 17px 20px 0 20px;
}
/* ---------------- Search -----------------*/
#search_full{
    display: none;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color:rgba(230, 230, 230, 0.95);
    z-index: 9999;
}
#search_full form{
    height: 100%;
}

#search_full .close{
    opacity: 1;
    font-size: 2rem;
    position: absolute;
    right: 0;
    padding: 20px 15px;
}
/* ---------------- Header -------------*/
header{
    font-family: 'Roboto', sans-serif;
    position: fixed;
    top:0;
    background-color: rgb(224,30,51);
    z-index:999;
    left:0;
    right:0;
    transition:top .4s ease-in-out;
}
header.scroll-hide{
    top:-6.5rem;
}
#nav-social > a > i > svg,
footer a > i > svg {
    height: 26px;
    max-height: 26px;
}

/* ---------------- Navigation ----------- */

.navbar{
    color:rgb(255,255,255);
    padding: 7px 2px 5px 3px;
}
.navbar-collapse{
    border-top: 1px solid;
    margin-left: -20px;
    margin-right: -20px;
    padding-left: 20px;
    padding-right: 20px;
    margin-top: 5px;
}
.navbar-nav{
    margin-top: 5px;
    font-size: 15px;
}
.navbar-brand{
    padding-top: .1rem;
    padding-bottom: .1rem;
}
.nav-link{
    color:rgb(255,255,255);
    font-weight: 600;
    text-transform: uppercase;
}
.nav-link:hover{
    padding-bottom: 0px;
    color:rgb(255,255,255);
    border-bottom: 1px solid rgb(255,255,255);
    margin-bottom: 6px;
}
.navbar-toggler{
    border: none;
    padding: 11px 10px;
    position: absolute;
    right: 47px;
    top: 0;
    border-right: 1px solid rgb(255,255,255);
    border-left: 1px solid rgb(255,255,255);
    border-radius: 0;
}
.menu {
    background-color: transparent;
    cursor: pointer;
    display: flex;
}
.line {
    fill: none;
    stroke: rgb(255,255,255);
    stroke-width: 6;
    transition: stroke-dasharray 600ms cubic-bezier(0.4, 0, 0.2, 1),
        stroke-dashoffset 600ms cubic-bezier(0.4, 0, 0.2, 1);
}
.line1 {
    stroke-dasharray: 60 207;
    stroke-width: 6;
}
.line2 {
    stroke-dasharray: 60 60;
    stroke-width: 6;
}
.line3 {
    stroke-dasharray: 60 207;
    stroke-width: 6;
}
.opened .line1 {
    stroke-dasharray: 90 207;
    stroke-dashoffset: -134;
    stroke-width: 6;
}
.opened .line2 {
    stroke-dasharray: 1 60;
    stroke-dashoffset: -30;
    stroke-width: 6;
}
.opened .line3 {
    stroke-dasharray: 90 207;
    stroke-dashoffset: -134;
    stroke-width: 6;
}
#h24{
    border: none;
    padding: 16px 13px;
    position: absolute;
    right: 109px;
    top: 0;
    border-left: 1px solid rgb(255,255,255);
    border-radius: 0;
}
#h24 a{
    color: rgb(255,255,255);
    font-weight: bold;
    font-size: 20px;
}
/* ---------------- Search ----------- */
header #search{
    position: absolute;
    top: 14px;
    right: 0;
    padding-right: 7px;
    font-size: 21px;
    font-weight: 600;
}

/* ---------------- Social incons ----------- */
#nav-social a{
    font-size: 24px;
    padding: 0 5px;
    display: inline-block;
    color:rgb(255,255,255);
}
#nav-social a:nth-child(n+3){
    font-size: 26.4px;
}


/* ----------------- article general -------------*/
.edit-article{
    margin: 10px 15px;
}
.edit-article a{
    background-color: #DEDEDE;
    color: #000;
    padding: 5px 10px;
}
article{
    padding: 10px 0 16px 0;
    margin: 0 20px;
    border-top: 2px solid rgb(229,229,229);
}
article a{
    /*display: block;*/
}
article .top picture img{
    display: block;
    max-width: calc(100% + 40px);
    height: 66.66vw;
    object-fit: cover;
    margin: 0 -20px;
    width: calc(100% + 40px);
}
article .top{
    position: relative;
}
article .top .tags{
    width: calc(100% + 40px);
    position: absolute;
    left: -20px;
    bottom: 1px;
}
article .top .tag{
    float: left;
    padding: 7px 17px 3px 20px;
    min-width: 35%;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: bold;
}
article .top .updated{
    float: right;
    color:rgb(255,255,255);
    padding: 7px 17px 3px 4px;
    font-size: 12px;
}

article h2{
    margin:0;
    font-size: 19px;
    line-height: 1.2;
    font-weight: bold;
    padding: 0 0 11px 0;
}
article h2 a{
    color: rgb(26,26,26);
}
article .btag{
    text-transform: uppercase;
    font-size: 10px;
    font-weight: bold;
    color: rgb(224,30,51);
    padding-left: 25px;
}
article .btag:before{
    content: "";  
    background-color: rgb(224,30,51);
    display: inline-block; 
    width: 10px;
    height: 10px;
    border-radius: 6px;
    margin-left: -24px;
    margin-right: 5px;
}
article .desc{
    margin:0;
    font-size: 15px;
    padding-top: 8px;
    padding-bottom: 8px;
    line-height: 1.35;
}
/* ------------- featured -----------*/
article.featured{
    padding: 0;
    border-top: 0;
    border-bottom: 2px solid rgb(229,229,229);
}
article.featured .tag{
    background-color: rgb(224,30,51);
}
article.featured .tag a{
    color:rgb(255,255,255);
}
article.featured h2{
    padding-top: 10px;
    padding-bottom: 9px;
    line-height: 1.2;
}
article.featured h2 a{
    color: rgb(224,30,51);
}

/* ------------- bigImg -----------*/
article.bigImg{
    position: relative;
    padding: 0;
    border-top: 0;
    border-bottom: 0;
}
article.bigImg h2{
    width: calc(100% + 40px);
    position: absolute;
    bottom: 0;
    left: -20px;
    padding: 30px 20px 12px 20px;
    margin-bottom: 0;
    background: rgba(0,0,0,0.8);
    background: linear-gradient(0deg, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0) 100%);
}
article.bigImg h2 a{
    color: rgb(255,255,255);
}
/* ------------- inline -----------*/
article.inline{
    display: flex;
    position: relative;
    padding: 8px 0 12px 0;
}
article.inline .left{
    position: relative;
    flex: 0 0 42.5%;
    /*max-width: 136px;*/
    display: inline-block;
}
article.inline .left picture img{
    display: block;
    width: 100%;
    height: 26.3vw;
    object-fit: cover;
}
article.inline time {
    font-size: 11px;
    line-height: 9px;
    padding-left: 13px;
    display: inherit;
    padding-bottom: 6px;
    color: #9c9c9c;
}
article.inline h2{
    font-size: 3.9vw;
    padding-left: 13px;
}
article.inline .btag{
    position: absolute;
    left: calc(42.5% + 13px);
    font-size: 2.5vw;
    bottom: 6px;
    background-color: white;
    padding-top: 5px;
}
.video_container article.inline .btag{
    background-color: rgb(55,35,48);
}
article.inline .btag:before {
    width: 8px;
    height: 8px;
    margin-right: 3px;
}
article.inline.noimage{
    padding-bottom: 20px;
}
article.inline.noimage h2{
    padding-left: 0;
}
article.inline.noimage .btag{
    position: absolute;
    left: 0;
    bottom: 6px;
}
article.inline.featured{
    padding: 8px 20px 12px 20px;
    background-color: rgb(224,30,51);
    margin: 0;
    border-bottom: 0;
    margin-bottom: -2px;
    z-index: 1;
}
article.inline.featured h2 a,
article.inline.featured .btag{
    color: rgb(255,255,255);
}
article.inline.featured h2{
    padding-top: 0;
}
article.inline.featured .btag{
    left: calc(42.5% + 18px);
}
article.inline.featured .btag::before{
    background-color: rgb(255,255,255);
}
/* ---------------- Live --------------------*/
article.live{
    padding: 0;
    border-top: 0;
}
article.live h2{
    font-size: 20px;
    padding: 4px 0 11px 0;
    border-bottom: 2px solid rgb(229,229,229);
}
article.live .top .liveicon{
    background-image: url('/img/Live_icon.svg');
    background-position: center left;
    background-repeat: no-repeat;
    float: left;
    color: rgb(224,30,51);
    margin-left: 12px;
    padding: 5px 3px 3px 18px;
    font-size: 13px;
    animation: pulse 2s infinite;
}
@keyframes pulse {
    0% {
      opacity: 0 ;
    }
    50% {
        opacity: 1 ;
    }
    100% {
        opacity: 0 ;
    }
  }

/* --------------- article icons -------------*/
/* --------------- article icons -------------*/
article.inline.has_video .left a:after,
article.featured.has_video .top a:after,
article.bigImg.has_video .top a:after,
article.inline.has_adult .left a:after,
article.featured.has_adult .top a:after,
article.bigImg.has_adult .top a:after,
article.inline.has_audio .left a:after,
article.featured.has_audio .top a:after,
article.bigImg.has_audio .top a:after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    background-size: cover;
}
article.inline.has_audio .left > a:after{
    background-image: url(/img/audio_icon.svg);
    width: 35px;
    height: 35px;
}
article.featured.has_audio .top > a:after,
article.bigImg.has_audio .top > a:after{
    background-image: url(/img/audio_icon.svg);
    width: 51px;
    height: 51px;
}
article.inline.has_video .left > a:after{
    background-image: url(/img/play_icon.svg);
    width: 35px;
    height: 35px;
}
article.featured.has_video .top > a:after,
article.bigImg.has_video .top > a:after{
    background-image: url(/img/play_icon.svg);
    width: 51px;
    height: 51px;
}
article.inline.has_adult .left > a:after{
    background-image: url(/img/adult_icon.svg);
    width: 35px;
    height: 35px;
}
article.featured.has_adult .top > a:after,
article.bigImg.has_adult .top > a:after{
    background-image: url(/img/adult_icon.svg);
    width: 51px;
    height: 51px;
}

/* --------------- Related articles ----------*/
.related{
    margin: 0;
    padding-top: 1px;
    padding-right: 0px;
    padding-bottom: 7px;
    padding-left: 67px;
    list-style: none;
    font-weight: bold;
    line-height: 1.3;
    font-size: 3.6vw;
}
.related li{
    padding: 7px 0;
}
.related li:before{
    content: "";  
    background-color: rgb(224,30,51);
    display: inline-block; 
    width: 7px;
    height: 7px;
    border-radius: 4px;
    margin-left: -20px;
    margin-right:13px; 
}
.related a{
    color: rgb(26,26,26);
}

/* --------------------------------------- Rovatok -------------------------------------------*/
.rovat{
    position: relative;
    margin-top: 10px;
}
.rovat h1,
.rovat h1 a{
    color: rgb(255,255,255);
}
.rovat .articles{
    display: flex;
    flex-direction: column;
}
.rovat article.featured{
    padding-top: 10px;
    border-bottom: 0;
    padding-bottom: 6px;
}
.rovat article .top picture img{
    max-width: 100%;
    height: 59vw;
    margin: 0;
    width: 100%;
}
.rovat:before{
    content: "";
    position: absolute;
    top:0;
    left: 0;
    right: 0;
    height: 237px;
    z-index: -1;
}
.rovat h2{
    font-size: 18px;
}
.rovat article:nth-child(-n+8){
    order: 1;
}
.rovat .boxStyle3{
    order: 4;
}
.rovat .boxStyle3:first-of-type{
    order: 2;
}
.rovat article:nth-child(n+8){
    order: 3;
}
/* ------------------------ Belfold ----------------------*/
#belfold article.featured h2 a,
#belfold article .btag,
#belfold article .btag a {
    color: rgb(255,109,90);
}
#belfold h1,
#belfold:before,
#belfold article .btag:before{
    background-color: rgb(255,109,90);
}

/* ------------------------ Külföld ----------------------*/
#kulfold article.featured h2 a,
#kulfold article .btag,
#kulfold article .btag a {
    color: rgb(6,77,183);
}
#kulfold h1,
#kulfold:before,
#kulfold article .btag:before{
    background-color: rgb(6,77,183);
}

/* ------------------------ Gazdaság ----------------------*/
#gazdasag article.featured h2 a,
#gazdasag article .btag, 
#gazdasag article .btag a {
    color: rgb(27,153,139);
}
#gazdasag h1,
#gazdasag:before,
#gazdasag article .btag:before{
    background-color: rgb(27,153,139);
}
/* ------------------------ Kultúra ----------------------*/
#kultura article.featured h2 a,
#kultura article .btag,
#kultura article .btag a {
    color: rgb(63,56,107);
}
#kultura h1,
#kultura:before,
#kultura article .btag:before{
    background-color: rgb(63,56,107);
}
/* ------------------------ Sport ----------------------*/
#sport article.featured h2 a,
#sport article .btag,
#sport article .btag a {
    color: rgb(0,161,221);
}
#sport h1,
#sport:before,
#sport article .btag:before{
    background-color: rgb(0,161,221);
}
/* ------------------------ Színes ----------------------*/
#eletmod article.featured h2 a,
#eletmod article .btag,
#eletmod article .btag a {
    color: rgb(244,54,126);
}
#eletmod h1,
#eletmod:before,
#eletmod article .btag:before{
    background-color: rgb(244,54,126);
}

#konyvsarok article.featured h2 a,
#konyvsarok article .btag,
#konyvsarok article .btag a {
    color: rgb(28,106,138)
}
#konyvsarok h1,
#konyvsarok:before,
#konyvsarok article .btag:before{
    background-color: rgb(28,106,138)
}

#fotoriport article.featured h2 a,
#fotoriport article .btag,
#fotoriport article .btag a{
    color: rgb(65,65,65);
}
#fotoriport h1,
#fotoriport:before,
#fotoriport article .btag:before{
    background-color: rgb(65,65,65);
}

#video h1,
#video .articles h1,
#video article.featured h2 a {
    color: rgb(51,51,51);
}
#video .articles h1 a,
#velemeny.rovat h1,
#today.rovat h1 {
    color: rgb(224,30,51);
}

/* ------------------------------------------------------------------------------------ Rovat oldal ----------------------------------------*/
#rovat .rovat article:nth-child(-n+8) {
    order: 1;
}
#rovat .rovat .boxStyle3:nth-of-type(1){
    order: 2;
}
#rovat .rovat article:nth-child(n+8) {
    order: 3;
}
#rovat .rovat .boxStyle3:nth-of-type(2){
    order: 4;
}
#rovat .rovat article:nth-child(n+14) {
    order: 5;
}
#rovat .rovat .boxStyle3:nth-of-type(3){
    order: 6;
}
#rovat .rovat article:nth-child(n+22) {
    order: 7;
}
#rovat .rovat .boxStyle3:nth-of-type(4){
    order: 8;
}
#rovat .rovat article:nth-child(n+30) {
    order: 9;
}
#rovat .rovat .boxStyle3:nth-of-type(5){
    order: 10;
}
#rovat .rovat article:nth-child(n+36) {
    order: 11;
}
#rovat .rovat .boxStyle3:nth-of-type(6){
    order: 12;
}
#rovat .rovat article:nth-child(n+44) {
    order: 13;
}
#rovat .rovat .boxStyle3:nth-of-type(7){
    order: 14;
}
#rovat .rovat article:nth-child(n+52) {
    order: 15;
}
#rovat .rovat .boxStyle3:nth-of-type(8){
    order: 16;
}
#rovat .rovat article:nth-child(n+60) {
    order: 17;
}
#rovat .rovat .boxStyle3:nth-of-type(9){
    order: 18;
}
#rovat .rovat article:nth-child(n+68) {
    order: 19;
}
#rovat .rovat .boxStyle3:nth-of-type(10){
    order: 20;
}
#rovat .rovat article:nth-child(n+76) {
    order: 21;
}
#rovat .rovat .boxStyle3:nth-of-type(11){
    order: 22;
}
#rovat .rovat article:nth-child(n+84) {
    order: 23;
}
/* ------------------------------------------------------------------------------------ Video rovat ----------------------------------------*/

#video{
    display: flex;
    flex-direction: column;
}

#video.rovat article.bigvideo .top{
    width: calc(100% + 40px);
    margin-left: -20px;
}

#video.rovat article.bigvideo .top picture img {
    height: 56vw;
}

#video.rovat article .top picture img {
    height: 52vw;
}

#video.rovat .articles h1{
    text-transform: none;
    padding-top: 10px;
    margin-top: 10px;
    border-top: 2px solid rgb(229,229,229);
}
#video.rovat .articles h1 a{
    font-size: .8em;
    padding-left: 20px;
    float: right;
    padding-top: 4px;
}
#video.rovat .articles article{
    order:initial;
}
#video.rovat .boxStyle3:nth-of-type(1) {
    order: 2;
}
#video .video_category:nth-of-type(n+5) {
    order: 3;
}
#video.rovat .boxStyle3:nth-of-type(2) {
    order: 4;
}

#video.rovat .pagination_container{
    order: 60;
}

/* ------------------------------------------------------------------------------------ Kereso oldal ----------------------------------------*/
#kereso .result h1{
    padding-top: 0px;
}
#kereso .result p{
    padding: 10px 20px;
    margin: 0;
}
#kereso .search_form{
    padding: 10px 20px;
}
#kereso .search_form form{
    padding: 10px;
    background-color: rgb(235,235,235);
}
#kereso .search_form label,
#kereso .search_form button{
    text-transform: uppercase;
    font-weight: 600;
    font-size: 16px;
}
#kereso .form_container{
    background-color: #fff;
    margin-bottom: -2px;
    padding-bottom: 2px;
}
#kereso .articles article:first-of-type{
    border-top: none;
}
/* ------------------------ Footer ----------------------*/
footer{
    background-color: rgb(51,51,51);
    color:rgb(192,192,192);
    padding-top: 1rem;
    padding-bottom: 1rem;
    font-size: 0.9rem;
}
footer a{
    display: inline-block;
    color:rgb(192,192,192);
}
footer a i{
    font-size: 20px;
}
footer a:hover{
    color:rgb(255,255,255);
}
footer .d-flex{
    justify-content: center;
}


/* --------------------- cookie ----------------- */
/* --------------------- cookie ----------------- */
#cookie_consent_body{
    font-size: 16px;
    position: fixed;
    bottom:0;
    left: 0;
    right:0;
    color: rgb(0 0 0);
    background-color: rgb(255 255 255);
    padding: 1em 2em;
    z-index: 9999;
}
#cookie_consent.old{
    height: auto;
    top: auto;
    bottom: 0;
    background-color: black;
    color: white;
    padding: 30px 50px;
    display: flex;
    justify-content: space-between;
    align-content: center;
}
#cookie_consent {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.45);
    top: 0;
    left: 0;
    z-index: 9998;
}
.cc-compliance{
    text-align: right;
}
.cc-compliance .btn{
    padding-left: 30px;
    padding-right: 30px;
    font-weight: bold;
}
.cc-compliance .btn-light{
    border: 1px solid #ccc;
    background-color: #fff;
}
.cc-compliance .btn-light:hover{
    color: #fff;
    border: 1px solid #E01E33;
    background-color: #E01E33;
}
.modal{
    z-index: 999999999;
}
.modal-dialog-centered{
    min-height: calc(100% - 6rem);
}
.modal-dialog{
    margin: 3rem auto;
}

.toggleWrapper input.mobileToggle {
    opacity: 0;
    position: absolute;
}
.toggleWrapper input.mobileToggle + label {
    cursor: pointer;
    position: relative;
    display: inline-block;
    -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    -webkit-transition: 0.4s ease;
    transition: 0.4s ease;
    height: 23px;
    width: 37px;
    border: 1px solid #e4e4e4;
    border-radius: 60px;
    margin-bottom: 0;
}
.toggleWrapper input.mobileToggle + label:before {
    content: "";
    position: absolute;
    display: block;
    -webkit-transition: 0.2s cubic-bezier(0.24, 0, 0.5, 1);
    transition: 0.2s cubic-bezier(0.24, 0, 0.5, 1);
    height: 23px;
    width: 38px;
    top: 0;
    left: 0;
    border-radius: 30px;
}
.toggleWrapper input.mobileToggle + label:after {
    content: "";
    position: absolute;
    display: block;
    box-shadow: 0 0 0 1px hsla(0, 0%, 0%, 0.1), 0 4px 0px 0 hsla(0, 0%, 0%, 0.04), 0 4px 9px hsla(0, 0%, 0%, 0.13), 0 3px 3px hsla(0, 0%, 0%, 0.05);
    -webkit-transition: 0.35s cubic-bezier(0.54, 1.6, 0.5, 1);
    transition: 0.35s cubic-bezier(0.54, 1.6, 0.5, 1);
    background: whitesmoke;
    height: 20px;
    width: 20px;
    top: 1px;
    left: 0px;
    border-radius: 60px;
}
.toggleWrapper input.mobileToggle:checked + label:before {
    background: #dc3545;
    -webkit-transition: width 0.2s cubic-bezier(0, 0, 0, 0.1);
    transition: width 0.2s cubic-bezier(0, 0, 0, 0.1);
}
.toggleWrapper input.mobileToggle:checked + label:after {
    left: 18px;
}

@media (min-width: 360px) {
    #article .article-meta .social{
        max-width: none;
    }
}
@media (min-width: 480px) {
    #article .article_content {
        font-size: 18px;
    }
}
@media (min-width: 576px) {
    /* ----------------- Main setup --------------*/
    .container-xl {
        padding-left: 5px;
        padding-right: 5px;
    }
    /* ---------------- Grid layout --------------*/
    .col1{
        grid-column:1;
        -ms-grid-column:1;
    }
    .col2{
        grid-column:2;
        -ms-grid-column:2;
    }
    /* ----------------- header --------------*/
    #nav-social{
        position: absolute;
        right: 0;
        top: 12px;
        margin-right: 130px;
    }
    .navbar-toggler{
        border: none;
        right: 0;
        padding-right: 3px;
    }
    .navbar-toggler span{
        margin: 4px 0;
    }
    header #search{
        right: 67px;
    }
    .navbar-brand{
        padding-left: 13px;
    }
    /* ----------------- Articles default -------------*/
    article {
        margin: 0 15px;
    }

    article .top .tags {
        bottom: 0px;
        width: 100%;
        left: 0px;
    }
    article .top picture img {
        max-width: 100%;
        margin:0;
        height: 29vw;
    }
    article .top .tag{
        padding: 7px 7px 3px 10px;
    }
    article.live .top .liveicon{
        position: absolute;
        bottom: 30px;
        left: -7px;
    }
    article h2{
        font-size: 17px;
    }
    article.live h2{
        font-size: 17px;
        padding-top: 8px;
    }
    article.featured{
        border-bottom: 0;
    }
    .related{
        font-size: 13px;
        padding-left: 21px;
    }
    article.bigImg h2{
        width: 100%;
        left: 0px;
    }
    article.bigImg .desc,
    article.bigImg .btag{
        /*display: none;*/
    }
    article.inline{
        padding-bottom: 10px;
    }
    article.inline h2 {
        font-size: 13px;
        padding-left: 10px;
        padding-bottom: 15px;
    }
    article.inline time {
        padding-left: 10px;
    }
    article.inline .left{
        max-width: 136px;
    }
    article.inline .left picture img{
        height: 13.15vw;
    }
    article.inline .btag{
        left: calc(42.5% + 10px);
        font-size: 9px;
    }
    article.inline.featured .btag{
        left: calc(42.5% + 14px);
    }

    section h1, aside h1{
        padding-left: 15px;
    }
    /* --------------------------------------- Rovatok -------------------------------------------*/
    .rovat h1{
        margin: 22px 15px 5px 15px;
        padding: 8px 22px 12px 22px;
    }
    .rovat .articles{
        display: grid;
        grid-template-columns: 50% 50%;
        grid-template-rows: repeat(7, auto);
        grid-auto-flow: row dense;
        margin-bottom: 20px;
    }
    .rovat article .top picture img{
        height: 29.4vw;
    }
    .rovat:before{
        display: none;
    }
    .rovat article:nth-child(-n+3){
        order: 1;
    }
    .rovat .articles .boxStyle3.d-md-none{
        order: 2;
        grid-column: span 2;
    }
    .rovat .articles .boxStyle3{
        order: 4;
        grid-column: span 2;
    }
    .rovat article:nth-child(n+3){
        align-self: start;
        order: 3;
    }
    .rovat article:nth-child(n+11){
        display: none;
    }
    .rovatStyle2 .articles .boxStyle3{
        order: 5;
    }
    .rovatStyle2 article:nth-child(n+10){
        display: flex;
    }
    .rovatStyle2 article:nth-child(n+12){
        order: 5;
    }
    /* ------------------------------------------------------------------------------------ Rovat oldal ----------------------------------------*/
    #rovat .rovat article:nth-child(n+11) {
        display: flex;
    }

    #video .articles{
        display: flex;
    }
    #video.rovat article.featured {
        grid-row: initial;
        display: block;
    }

    /* ------------------------------------------------------------------------------------ kereso oldal ----------------------------------------*/
    #kereso .form_container{
        display: flex;
        align-items: flex-end;
    }
    #kereso .search_form,
    #kereso .result{
        flex: 0 0 50%;
        max-width: 50%;
    }
    #kereso .result{
        order: 1;
    }
    #kereso .search_form{
        order: 2;
    }
    #kereso .search_form,
    #kereso .result p {
        padding: 10px 15px;
    }
    #kereso .articles{
        display: grid;
        grid-template-columns: 50% 50%;
        grid-auto-flow: dense;
        display: -ms-grid;
        -ms-grid-template-columns: 50% 50%;
        -ms-grid-auto-flow: dense;
    }
    #kereso .articles article:nth-of-type(2){
        border-top: none;
    }

    .cc-compliance .btn{
        padding-left: 60px;
        padding-right: 60px;
    }
    
}
@media (min-width: 768px) {
    /* ----------------- Main setup --------------*/
    .container-xl {
        padding-left: 17px;
        padding-right: 5px;
    }
    /* ------------------ Articles --------------*/
    article .top .tag{
        padding: 7px 17px 3px 20px;
    }
    article.live .top .liveicon{
        position: static;
    }
    article h2,
    article.live h2 {
        font-size: 19px;
    }
    article.inline h2 {
        font-size: 15px;
    }
    article.inline .left picture img{
        height: 91px;
    }
    article.inline .btag{
        left: 146px;
    }
    article.inline.featured .btag{
        left: 165px;
    }
    #top5 article.inline h2{
        font-size: 14px;
    }
    .rovat article:nth-child(11){
        display: flex;
    }
    .rovat.rovatStyle2 article:nth-child(n+10) {
        display: flex;
    }
    .rovat .articles .boxStyle3 {
        order: 2;
        grid-column: auto;
        grid-row: span 3;
    }
    .rovatStyle2 .articles .boxStyle3{
        order: 4;
    }
    /* ------------------------------------------------------------------------------------ Rovat oldal ----------------------------------------*/
    #rovat .rovat{
        margin-top: 0px;
    }
    #rovat .rovat h1 {
        background-color: transparent;
        margin: 0 15px 0 15px;
        padding: 0 22px 12px 22px;
    }
    #rovat #belfold h1{
        color: rgb(255,109,90);
    }
    #rovat #kulfold h1{
        color: rgb(6,77,183);
    }
    #rovat #gazdasag h1{
        color: rgb(27,153,139);
    }
    #rovat #kultura h1{
        color: rgb(63,56,107);
    }
    #rovat #sport h1{
        color: rgb(0,161,221);
    }
    #rovat #eletmod h1{
        color: rgb(244,54,126);
    }
    #rovat #konyvsarok h1{
        color: rgb(28,106,138);
    }
    #rovat #fotoriport h1 {
        color: rgb(65,65,65);
    }
    #rovat .rovat .boxStyle2{
        grid-column: span 2;
    }

    #rovat .rovat article:nth-child(-n+3) {
        order: 1;
    }
    #rovat .rovat .boxStyle3:nth-of-type(1){
        order: 2;
    }
    #rovat .rovat article:nth-child(n+3) {
        order: 3;
    }
    #rovat .rovat .box2order1{
        order: 4;
    }
    #rovat .rovat article:nth-child(n+16) {
        order: 5;
    }
    #rovat .rovat .boxStyle3:nth-of-type(2){
        order: 6;
    }
    #rovat .rovat article:nth-child(n+25) {
        order: 7;
    }
    #rovat .rovat .box2order2{
        order: 8;
    }
    #rovat .rovat article:nth-child(n+32) {
        order: 9;
    }
    #rovat .rovat .boxStyle3:nth-of-type(3){
        order: 10;
    }
    #rovat .rovat article:nth-child(n+35) {
        order: 11;
    }
    #rovat .rovat .box2order3{
        order: 12;
    }
    #rovat .rovat article:nth-child(n+49) {
        order: 13;
    }

    #rovat .rovat .boxStyle3:nth-of-type(4){
        order: 14;
    }
    #rovat .rovat article:nth-child(n+57) {
        order: 15;
    }
    #rovat .rovat .boxStyle3:nth-of-type(5),
    #rovat .rovat .boxStyle3:nth-of-type(6),
    #rovat .rovat .boxStyle3:nth-of-type(7),
    #rovat .rovat .boxStyle3:nth-of-type(8),
    #rovat .rovat .boxStyle3:nth-of-type(9),
    #rovat .rovat .boxStyle3:nth-of-type(10),
    #rovat .rovat .boxStyle3:nth-of-type(11){
        display:none !important;
    }

    /* ----------------------------------------------------------------------------------- video rovat ------------------------------------*/
    #video .articles{
        display: grid;
        grid-template-columns: 50% 50%;
        grid-template-rows: repeat(2, auto);
        grid-auto-flow: row dense;
        margin-bottom: 20px;
    }
    #video.rovat .articles h1{
        grid-column: span 2;
        padding-left: 0;
    }
    #video.rovat article.bigvideo{
        grid-column: span 2;
    }
    #video.rovat article.bigvideo .top{
        width: 100%;
        margin-left: 0;
    }
    #video.rovat article .top picture img {
        height: 26vw;
    }
    #video.rovat article.bigvideo .top picture img {
        height: 52vw;
    }
    #video.rovat .articles article{
        order:initial;
        display: block;
    }
    #rovat .rovat .box2order2 {
        order: 2;
    }
    #rovat .rovat .box2order3 {
        order: 4;
    }
    #video.rovat .video_category:nth-of-type(n+2) article:nth-of-type(n+3){
        display: none;
    }

}
@media (min-width: 992px) {
    /* ------------------------------------------------------------------------------------ kereso oldal ----------------------------------------*/
    #kereso .search_form, #kereso .result p{
        padding: 15px;
    }
    #kereso .articles,
    #kereso .pagination_container{
        max-width: 66.66666666667%;
    }
    #kereso .search_form{
        position: absolute;
        top: 0;
        right: 0;
        width: 33.33333333334%;
    }
}
@media (min-width: 1200px) {
    /* ------------- Main setup ----------- */
    .navbar {
        padding: 7px 0 5px 0;
    }
    .navbar-collapse{
        border: none;
        margin-top: 0;
    }
    .nav-mobil{
        display: none;
    }
    .container-xl {
        max-width: 1161px;
        padding-left: 0;
        padding-right: 0;
    }
    .container-fluid{
        max-width: 1161px;
        margin-right: auto;
        margin-left: auto;
        padding-left: 0;
        padding-right: 0;
    }
    #nav-social{
        position: static;
        margin-right: 0;
    }
    .navbar-brand{
        padding-left: 0px;
    }
    header #search {
        position: static;
        padding-left: 20px;
        padding-right: 15px;
        right: 0;
    }
    header #search img{
        margin-left: 3px;
        margin-right: 2px;
        margin-bottom: 0px;
    }
    header #search span{
        font-size: 15px;
    }
    /* ----------------------- Articles -----------------*/
    article .top picture img{
        height: 239px;
    }
      
    /* --------------------------------------- Rovatok -------------------------------------------*/
    .rovat .articles,
    #video .articles{
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        margin-bottom: 20px;
    }
    .rovat article .top picture img{
        height: 240px;
    }
    .rovat article.featured{
        grid-row: span 3;
    }
    .rovat article:nth-child(3){
        border-top: 0;
        padding-top: 10px;
    }
    .rovat article:nth-child(-n+5){
        order: 1;
    }
    .rovat .boxStyle4{
        order: 2;
    }
    .rovat .articles .boxStyle3{
        order: 3;
    }
    .rovat article:nth-child(n+5){
        align-self: start;
        order: 4;
    }
    .rovat article:nth-child(n+7){
        align-self: start;
        order: 5;
    }
    .rovat article:nth-child(n+10){
        display: flex;
    }
    .rovat article:last-of-type{
        display: none;
    }
    .rovat article:nth-child(n+11){
        align-self: start;
        order: 6;
    }
    .rovatStyle2 article:last-of-type{
        display: flex;
    }
    .rovatStyle2 .articles .boxStyle3{
        order: 5;
    }
    /* ------------------------------------------------------------------------------------ Rovat oldal ----------------------------------------*/
    #rovat .rovat .boxStyle1{
        grid-column: span 3;
    }
    #rovat .rovat article:last-of-type{
        /*display: block;*/
    }
    #rovat .rovat article:nth-child(-n+6) {
        order: 1;
    }
    #rovat .rovat .boxStyle3:nth-of-type(1){
        order: 2;
    }
    #rovat .rovat article:nth-child(n+6) {
        order: 3;
    }
    #rovat .rovat .box1order1{
        order: 4;
    }
    #rovat .rovat article:nth-child(n+16) {
        order: 5;
    }
    #rovat .rovat .boxStyle3:nth-of-type(2){
        order: 6;
    }
    #rovat .rovat article:nth-child(n+32) {
        order: 7;
    }
    #rovat .rovat .box1order2{
        order: 8;
    }
    #rovat .rovat article:nth-child(n+36) {
        order: 9;
    }
    #rovat .rovat .boxStyle3:nth-of-type(3){
        order: 10;
    }
    #rovat .rovat article:nth-child(n+39) {
        order: 11;
    }
    #rovat .rovat .box1order3{
        order: 12;
    }
    #rovat .rovat article:nth-child(n+54) {
        order: 14;
    }
    #rovat .rovat .boxStyle3:nth-of-type(4){
        order: 12;
    }
    #rovat .rovat .boxStyle3:nth-of-type(5){
        order: 15;
        display:block !important;
    }
    #rovat .rovat article:nth-child(n+65) {
        order: 16;
    }
    
    #rovat .rovat .box2order1,
    /*#rovat .rovat .boxStyle3:nth-of-type(5)*/
    #rovat .rovat .boxStyle3:nth-of-type(6),
    #rovat .rovat .boxStyle3:nth-of-type(7),
    #rovat .rovat .boxStyle3:nth-of-type(8),
    #rovat .rovat .boxStyle3:nth-of-type(9),
    #rovat .rovat .boxStyle3:nth-of-type(10),
    #rovat .rovat .boxStyle3:nth-of-type(11){
        display:none !important;
    }

    /* ------------------------------------------------------------------------------------ Video rovat oldal ----------------------------------------*/

    #video.rovat article .top picture img {
        height: 202px;
    }
    #video.rovat article.bigvideo{
        grid-row: span 2;
        grid-column: span 2;
    }

    #video.rovat .articles h1{
        grid-column: span 3;
        padding-left: 0;
    }
    #video.rovat .articles h1 a{
        float: none;
        padding-top: 0;
    }
    #video.rovat .video_category:nth-of-type(n+2) article:nth-of-type(n+3){
        display: block;
    }
    #video.rovat .articles article:nth-child(4n+6){
        display: block;
    }
    #video.rovat article.bigvideo .top picture img{
        height: 422px;
    }
    #rovat #video.rovat .box2order1{
        display: block !important;
    }
    #rovat #video.rovat .box1order1{
        order: 2;
    } 

    #today.rovat article:last-of-type{
        display: flex;
    }
}