/*@import url('https://fonts.googleapis.com/css2?family=Assistant:wght@200..800&display=swap');*/
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");


/*
@media (prefers-color-scheme: dark) {
    :root {
        --maincolor: #EF1111;
        --white: #161723;
        --grey: #808080;
        --lightgrey: #808080;
        --grey75: rgba(7,6,5,0.75);
        --borderradius: 0px;
        --grey25: rgba(7,6,5,0.75);
    }
}

@media (prefers-color-scheme: light) {
    :root {
        --maincolor: #DB0238;
        --white: #ffffff;
        --grey: #808080;
        --lightgrey: #808080;
        --grey75: rgba(0,0,0,0.1);
        --borderradius: 2px;
        --grey25: #EAEAEA;
    }
}
*/

:root {
    --maincolor:hsl(50.13deg 100% 84.51%);/*hsl(16.36deg 82.5% 68.63%);*/ /* #FFF2B0;*/
    --maincoloralpha: hsl(50.13deg 100% 84.51% / 60%); /*hsl(16.36deg 82.5% 68.63% / 60%);*/
    --maincolor-lighthex: #ddcf89;
    --atrenative-color:#413B61; /* #514E9C */
    --atrenative-color-alpha:rgba(65,59,97, 0.5); /* rgba(81, 78, 156, 0.5); */
    --alt2-h: 242.31deg; /*302.45deg;*/
    --alt2-s:33.33%; /*23.22%;*/
    --alt2-l:45.88%; /*58.63%;*/
    --alt2-10:hsl(var(--alt2-h) var(--alt2-s) calc(var(--alt2-l) - 10%));
    --alt2-20:hsl(var(--alt2-h) var(--alt2-s) calc(var(--alt2-l) - 20%));
    --alt2-30:hsl(var(--alt2-h) var(--alt2-s) calc(var(--alt2-l) - 30%));
    --alternate2:hsl(var(--alt2-h) var(--alt2-s) var(--alt2-l)); /* hsl(274, 51%, 62%); */
    --alt3-h:273.6deg; /*249.47deg;*/
    --alt3-s:51.02%; /*24.36%;*/
    --alt3-l:61.57%; /*30.59%;*/
    --alt3-10:hsl(var(--alt3-h) var(--alt3-s) calc(var(--alt3-l) - 10%));
    --alt3-20:hsl(var(--alt3-h) var(--alt3-s) calc(var(--alt3-l) - 20%));
    --alt3-30:hsl(var(--alt3-h) var(--alt3-s) calc(var(--alt3-l) - 30%));
    --alternate3:hsl(var(--alt3-h) var(--alt3-s) var(--alt3-l)); /* hsl(242, 33%, 46%); */
    --white: #f9fcff;
    --whitealpha: rgba(249,252,255,0.1);
    --grey: #031231;
    --grey75: rgba(3,18,49,0.75);
    --grey25: rgba(3,18,49,0.125);
    --borderradius: 0px;
    --lightgrey: rgba(3,18,49,0.25);
    --primary-font: "gotham", sans-serif;
    --secondary-font: "gotham", sans-serif;

    
    
}



/*
 * ################ START DEFAULTS START ################ 
 */
/*NHassGrotesk    /    Assistant  */
/**
 * removing defaults
 */
* {
	padding: 0px;
	margin: 0px;
    font-family: var(--primary-font);
        box-sizing: border-box;
}

/**
 * font settings
 */
html {
    font-family: var(--primary-font);

	/*font-size: 76%;*/
	height: 100%;
        /* http://www.hicksdesign.co.uk/journal/forcing-scrollbars-now-even-better */
        /*margin-bottom: 1px;*/
}

h1,h2,h3,h4,h5,h6{
    font-family: var(--secondary-font);
}

html * {
	font-size: 1em;
}

body {
	height: 100%;
	width: 100%;
	/*background: rgb(237,193,177);*/
/*background: linear-gradient(180deg, rgba(237,193,177,1) 15%, rgba(255,255,255,1) 100%);*/
	text-align: center; /* for IE to do centering */
    background-color:var(--white);
    color:var(--grey);
}


/**
 * setting my defaults
 */

a {text-decoration: none;}

table {
	border-collapse: collapse;
}

table.border td{
	border: solid 1px black;
}

ul {
	list-style-type: disc;
        /* 05-12-12 ie bug, nem lesz jo az A tag */
	list-style-position: outside;
	/*margin-left: 5%;*/
}

ol {
	margin-left: 5%;
}

p, ul, ol, dl {
	/*margin-bottom: 1em;*/
}

b, strong {
    font-weight: 700;
}

h1 {/* IE - Disappearing Text Bug In IE 6 - http://www.soxiam.com/Code/CSSDisappearingTextBugInIE6 - Zss*/

 
}

sup {
    font-size: 0.6em;
    line-height: 0.6em;
}
.sup {
    font-size: 0.6em;
}

* img {
	border: 0;

}

.hide {
	display: none;
}

img.trspng{
  filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
}

/**
 * clearing floats
 * http://www.quirksmode.org/css/clearing.html
 *
 * width or height required
 * The use of a width or height declaration is required to make the effect work in Explorer Windows and Opera. If you don't include it Explorer Windows continues to show the border at the top of the columns, as if there were no overflow. Opera completely hides the content of the container.
 * A width: 100% is a neat starting point, although more complicated layouts may require other values.
 */
* html .floated {
	height: 1%;
}

.floated {
	overflow: hidden;
}

.nowrap {
	white-space: nowrap;
}


/**
 * my class
 */

img.floatleft {
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
}

img.floatright {
	float: right;
	margin-left: 10px;
	margin-bottom: 10px;
}

* html .gapfix {
	/* This fixes the IE5 Win gap! */
	/* http://phonophunk.phreakin.com/articles/ie-fix-for-gaps-between-list-items.php */
	vertical-align: bottom; /* ie5.x set this width */
	/* v\ertical-align: baseline;  all other browser set this default */
}

* html .ie5_centered {
	text-align: center;
}

.link {
	cursor: pointer; /* MB */  
}

.two_columns {
	float: left;
	width: 45%;
}



/*----------------lipidcsokkentes-----------*/
#header{
    position: sticky;
    top:0;
    width:100%;
    height:120px;
    Background:var(--maincolor);
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
    z-index: 50;
    box-shadow:0px 0px 5px var(--grey);
    
}

#header #logo{
    position: absolute;
    top:33px;
    left: 33px;
}

#header #logo img {
    height: 54px;
}

div#hamburgernav {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    flex-direction: row;
    transition: all 500ms;
}

div.hamburgericon {
    display:none;
}
.opacity {
        opacity: 1 !important;
        top:90px !important;
    }

/**
 * Login
 */


#login_box{
    position: absolute;
    right:25px;
    top:35px;
    color:var(--grey75);
}
#login_box form label {
    padding:10px;
    color:var(--grey75);
}

#login_box form input {
    padding:10px;
    color:var(--grey75);
    background: var(--white);
    border:0px;
    max-width: 120px;
    border-radius: var(--borderradius);
}

#login_box form input.submit {
    padding:10px;
    color:var(--white);
    background: var(--grey);
    border:0px;
    cursor:pointer;
    border-radius: var(--borderradius);
}

#login_box form a {
    color:var(--grey);
    margin-left: 20px;
}

#login_box form .loginboxlinks {
    margin:10px;
}



/**
 * Menu, mainmenu
 */
#mainmenudiv{
	/*bottom: 10px;
	position: absolute;*/
	width: 100%;
	height:auto;
	transition: all 300ms;
}

#mainmenu {
	/*font-size: 14px;*/
	font-weight: 100;
	height: 100%;
	margin: 0 auto;
	/*position: relative;*/
    display: flex;
    flex-direction: row;
	z-index: 2;
    width: fit-content;
    justify-content: center;
}

#mainmenu .arrow {
  width: 0.5em;
  height: 0.5em;
  display: inline-block;
  vertical-align: middle;
  border-left: 0.15em solid currentColor;
  border-bottom: 0.15em solid currentColor;
  transform: rotate(-45deg);
  margin-top: -0.25em;
  transition: transform 100ms ease-in-out;
}

/* ANIMATE aRROWS */
#mainmenu > li:hover > a > .arrow {
  transform: rotate(315deg);
}

#mainmenu .submenu > li:hover > a > .arrow {
  transform: rotate(225deg);
}

#mainmenu li { line-height: 36px; list-style: none; position: relative; transition:all 200ms;border-radius:var(--borderradius); }
#mainmenu li a.last { border: none; }
#mainmenu li a.active { 
    color: var(--white);
    background: var(--maincolor);
    border-radius:var(--borderradius);
}
#mainmenu li a {
	color: var(--grey);
	font-size: 1.2em;
	font-weight: 100;
	padding: 0 18px;
	text-align: center;
    display:block;
}
/* submenu plus */
#mainmenu .submenu {
  position: absolute;
  left: 0;
  background-color: var(--maincolor-lighthex);
    color: var(--white);
  white-space: nowrap;
  /*padding: 1.5em 0;*/
  min-width: 100%;

  /* hide submenus */
  opacity: 0;
  transform: scaleY(0);
  transform-origin: top center;
    box-shadow: 0px 0px 5px var(--grey75);
}

#mainmenu .submenu .submenu {
  background-color: var(--maincolor);
    color: var(--white);
}

#mainmenu .submenu > li > a {
  /*padding: 0.8em 1.5em;*/
    color:var(--white);
    padding: 10px;
    border-bottom:2px solid var(--grey75);
}
#mainmenu .submenu .submenu {
  left: 100%;
  top: 0;
    border-left:2px solid var(--grey75);
}
#mainmenu .submenu .submenu .submenu {
  left: -100%;
  top: 0;
}

#mainmenu > li:hover > a{
  background-color: var(--grey75);
  color: var(--grey);
}

#mainmenu .submenu > li:hover > a {
  background-color: var(--grey75);
  color: var(--white);
}
#mainmenu > li:hover > a {
 
    border-radius:var(--borderradius);
}

/* Reveal  */
#mainmenu > li:hover > a + .submenu,
#mainmenu .submenu > li:hover > a + .submenu {
  opacity: 1;
  transform: scaleY(1);
}

/* submenu plus vége */

/*
#mainmenu ul {
	background: var(--grey);
    border-radius:var(--borderradius);
	display: none;
	left: 0;
	margin: 0;
	position: absolute;
	top: 36px;
	width: 100%;
	z-index: 10;
	text-align: center;
    box-shadow: 0px 0px 3px var(--grey);
}

#mainmenu ul.wide { width: 150%;}
#mainmenu li:hover ul { display: block; }
#mainmenu ul li {
	float: none;
	line-height: 28px;
    display: block;
    transition:all 200ms;
}

#mainmenu li:hover,
#mainmenu ul li:hover {
    background: var(--grey75);
}

#mainmenu ul li a {
	border: none;
    color: var(--white);
	display: block;
	padding: 0 17px;
	text-align: center;
}

*/

/**
 * Mainbody
 */
 #mainbody {
    /*background: url(../images/lipidcsokkentes/Header_pic_Lipidologia_lepesrol_lepesre.jpg) no-repeat;
    background-position: center -255px;
    margin: 0 3%;
    padding: 85px 0 0 0;*/
    transition: all 300ms;
}
#body {
    width: 100%;
    /* max-width: 1000px; */
    /* height: 1000px; */
    margin: 0 auto;
    background: var(--white);
    position: relative;
    z-index: 10;
    /*border-top: 1px solid var(--grey);*/
}

#curvedbody{
    /*max-width: 1000px;*/
    margin: 0 auto;
}

#mainimageflex {
    display: flex;
    max-height: 530px;
    align-items: center;
    background: #A36BCF;
    background: url(../images/szivelegtelenseg/Header.png) no-repeat top right, linear-gradient(68deg, var(--alternate2) 0%, var(--alternate3) 100%);
    background-size: auto 100%, auto;
    height: clamp(33vw, 15rem, 100vw);
}

#maintitlebox {
    width: 100%;
    text-align: left;
    font-size: 3.5vw;
    /*padding-left: 3vw;*/
}
#maintitlebox *{
    font-family: var(--secondary-font);
}

#maintitle {
    position: relative;
}

/*#maintitle::after {
    width: 13vw;
    height: 1vw;
    background: var(--maincolor);
    position: absolute;
    bottom: -3vw;
    left: 0;
    content: "";
}*/

.afterline {
    /*width: 75%; */
    /* height: 0.75rem; */
    background: var(--maincolor);
    margin-top: 2vw;
    font-size:85%;
    /*margin-left: -40px;
    padding-left: 40px;*/
    border-radius: 0 100px 100px 0;
    color: var(--atrenative-color);
    display: inline-block;
    font-weight: 400;
    padding-right: 3vw;
    padding-top: 5px;
    padding-bottom: 5px;
}

#mainimage {
    width: 150%;
    /*max-width: 960px;*/
    /*background: url(../images/szivelegtelenseg/Header.png) no-repeat;*/
    background-size: cover;
    height: 100%;
    background-position: left center;
}

#mainimage img {
    width: 100%;
    max-width: 450px;
}

.lipidbox {
    width: 100%;
}

.lipidboxes {
    display: flex;
    gap:30px;
    margin-bottom:25px;
}

div#vidsboxes{
    background: var(--maincolor);
}
div#podcastboxes {
    background: var(--maincolor-lighthex);
}
#vidboxhead, #otheading {
    color: var(--grey);
    font-size: clamp(1.3rem, 4vw, 2.5em);
    margin-top:25px;
    position: relative;
    text-transform: uppercase;
    width:max-content;
    margin:2em auto;
    font-family: var(--secondary-font);
}

/*#otheading::after {
    width: 13vw;
    height: 0.6vw;
    background: var(--maincolor);
    position: absolute;
    bottom: -2vw;
    left: 0;
    content: "";
}*/

#podcasthead {
    color: var(--maincolor-lighthex);
    font-size:2.5em;
    margin-top:25px;
}

div#vidsboxes,
div#podcastboxes {
    width:100%;
    display: flex;
    padding:15px 15px;
    /*background: url("../images/vaspotlas/Video_cikk_bg_vapotlas_2021.png") top center no-repeat;*/
    /*background-color:var(--maincolor);*/
    box-sizing: border-box;
    justify-content: center;
    flex-wrap: wrap;
    flex-direction: row;
    border-radius: 30px;
    position: relative;
}

div#vidsboxes .MainRovatBox,
div#podcastboxes .MainRovatBox {
    width: 50%;
    padding: 15px;
    color:var(--white);
    text-align: justify;
    box-sizing: border-box;
}

.MainRovatBox img {
    width:100%;
    height:auto;
    z-index: 3;
    position: relative;
}

.MainRovatBox h1 {
    color: var(--white);
    font-weight: 900;
    font-size:2.5em;
    text-align: left;
    line-height: initial;
    margin-bottom:25px;
}

.MainRovatBox h3,.MainRovatBox h3 a {
    color: var(--white);
    font-weight: 500;
    font-size:1.2em;
    text-align: left;
    line-height: initial;
    margin:10px 0px;
    min-height: 2.8em;
}

.MainRovatBox .lead {
    color: var(--white);
    font-weight: 100;
    line-height: 1.4em;
    margin:10px 0px;
}
.MainRovatBox a.more {
    color: var(--maincolor);
    background: var(--white);
    line-height: 1.4em;
    padding:10px 30px;
    display: block;
    margin:0 auto;
    width:70%;
    text-align: center;
    border-radius:var(--borderradius);
}

a.more:hover,
.otbuttcontainer .otbutton a:hover{
    background-image: var(--grey75) !important;
    text-shadow: 0 0 4px var(--grey);
    transition: all 200ms;
}
input.submit:hover{
    background: var(--grey75) !important;
    text-shadow: 0 0 4px var(--grey);
    transition: all 200ms;
}

/**
 * Eloszo
 */
#container #eloszo {
   color: var(--grey);
    width:100%;
    padding:35px 75px 0px 75px;
    background: var(--white);
    background-size: cover;
}

#container #onlinetovabbkepzestop {
   color: var(--white);
    width:100%;
    padding:45px 0px ;
    background: var(--maincolor);
    max-height:150px;
}
#container #onlinetovabbkepzestop h1, #container #cikk #onlinetovabbkepzestop h1 {
    font-weight: 900;
    font-size:2.5em;
    text-align: left;
    line-height: initial;
    color: var(--white);
    max-width: 1100px;
    margin: 0 auto;
    padding:0 40px;
}

#container #onlinetovabbkepzestop h3, #container #cikk #onlinetovabbkepzestop h3 {
    font-weight: 400;
    font-size:1.35em;
    text-align: left;
    line-height: initial;
    margin-bottom:10px;
    color: var(--white);
    max-width: 1100px;
    margin: 0 auto;
    padding:0 40px;
}

#container #onlinetovabbkepzes {
    color: var(--grey);
    width:100%;
    padding:15px 75px 15px 75px;
    background-color: var(--maincolor);
    background-image:url(../images/szivelegtelenseg/lines.svg);
    background-repeat: no-repeat;
    position: relative;
    background-size: cover;
    background-position: center;
}

#container .arnyekkeret {
    border-radius: 20px;
    border: 5px solid var(--white);
    height: 250px;
    width: 95%;
    max-width: 950px;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.5), 0px 0px 10px inset rgba(0,0,0,0.5);
    /*top:150px;*/
    transition: opacity 300ms;
}

.FirstArticleLead{
    position: relative;
}

.glide .titleea {
    font-size: 0.9em;
}

.arnyekkeretmini {
    border-radius: 10px;
    border: 5px solid var(--white);
    height: 30%;
    width: 108%;
    max-width: 950px;
    position: absolute;
    left: -4%;
    right: 0;
    margin: 0 auto;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.5), 0px 0px 10px inset rgba(0,0,0,0.5);
    top: -10px;
    transition: opacity 300ms;
    max-height:115px;
    display:none;
}
.arnyekkeretduo {
    border-radius: 15px;
    border: 5px solid var(--white);
    height: 30%;
    width: 97%;
    max-width: 950px;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.5), 0px 0px 10px inset rgba(0,0,0,0.5);
    top: 15px;
    transition: opacity 300ms;
    max-height:115px;
}

#container #onlinetovabbkepzes .otflex {
    display: flex;
    /* flex-wrap: wrap; */
    flex-direction: column;

}
#container #onlinetovabbkepzes h1 {
    font-variant:small-caps;
    font-size:2.5em;
}

#container #onlinetovabbkepzes .otflex .otimg {
    width:100%;
}
/*#container #onlinetovabbkepzes .otflex .otimg img {
    width:100%;
	height: auto;
	padding:15px;
}*/

#container #onlinetovabbkepzes .otflex .ottxt {
    width:100%;
    padding:15px 0;
}

#container #onlinetovabbkepzes .otflex .otbutton, .otbutton {
    width:100%;
}
.otbuttcontainer{
    display: flex;
}
#container #onlinetovabbkepzes .otflex .otbutton a, .otbutton a {
    width:85%;
    text-align: center;
    display: block;
    font-size: 1.2em;
    color: var(--maincolor);
    background: var(--white);
    text-decoration: none;
    margin:0 auto;
    margin-top:30px;
    font-weight: 400;
    line-height: 1.4em;
    padding:10px 30px;
    border-radius:var(--borderradius);
}


#container .contentszoveg{
    text-align: justify;
    font-weight: 400;
    font-size: 1.2em;
    line-height:1.4em;
    hyphens: auto; 
    padding: 25px;
    /*background:var(--white);*/
    max-width: 850px;
    margin:0 auto;
}
#container #eloszo p{
    margin-top:25px;
}

#lipidcsokkentesMindig {
   color: var(--maincolor);
    width:100%;
    padding-bottom:50px;
    border-top:3px solid var(--maincolor);
    max-width: 1000px;
    margin: 0 auto;
    background: var(--white);
    z-index: 2;
    position: relative;
}

#lipidcsokkentesMindig a {
   color: var(--maincolor);
    text-decoration: underline;
}

#lipidcsokkentesMindig #lipidcsokkenteshirdetes {
    width: 100%;
}
#lipidcsokkentesMindig #lipidcsokkenteshirdetes img{
    width: 100%;
    max-width: 600px;
}

#lipidcsokkentesMindig #lipidcsokkenteslogokflex {
    display: flex;
    flex-wrap: wrap;
    width: 80%;
    max-width: 450px;
    margin: 0 auto;
}
#lipidcsokkentesMindig #lipidcsokkenteslogokflex div {
    width:50%;
}

/**
 * CIKK
 */
#container #cikk {
    /*max-width:850px;
    padding:25px 0px;*/
    margin:0 auto;
    background:var(--white);
    width:100%;
    text-align: justify;
    font-size: 1em;
    line-height:1.4em;
    hyphens: auto;
}

#container #cikk h1, #eloszo h1, #module_registration h1#maintitle {
   color: var(--atrenative-color);
    font-weight: 900;
    font-size:2.5em;
    text-align: left;
    line-height: initial;
}

#container #cikk h2 {
   color: var(--atrenative-color);
    font-weight: 900;
    font-size:2em;
    text-align: left;
    line-height: initial;
    margin-bottom:10px;
}

#container #cikk h3 {
   color: var(--atrenative-color);
    font-weight: 900;
    font-size:1.5em;
    text-align: left;
    line-height: initial;
    margin-bottom:10px;
}

#container #cikk h4 {
   color: var(--atrenative-color);
    font-weight: 500;
    font-size:1.3em;
    text-align: left;
    line-height: initial;
    margin-bottom:10px;
}

#container #cikk h5 {
   color: var(--atrenative-color);
    font-weight: 500;
    font-size:1.3em;
    text-align: left;
    line-height: initial;
}

#container #cikk h6 {
   color: var(--atrenative-color);
    font-weight: 400;
    font-size:1.1em;
    text-align: left;
    line-height: initial;
}

#container #cikk p {
   color: var(--grey);
    font-weight: 400;
}

#container #cikk .cikk_head_box {
    padding:25px 75px;
    background: url(../images/lipidcsokkentes/BG_dots_Lipidologia_lepesrol_lepesre.png) bottom center;
    border-bottom:3px solid var(--maincolor);
}

#container #cikk .titles {
    padding:25px;
    /*background:var(--white);*/
}
#container #cikk .titles .tags, #container #cikk .titles .szerzok{
    margin-top:5px;
    font-size:11pt;
    font-weight: 100;
    color:var(--grey75);
}


#container #cikk .lead {
    padding:0px 25px 25px 25px;
    /*background:var(--white);*/
}

#container #cikk .date {
    padding:0 25px;
}

#container #cikk .cikktartalom {
    padding:25px 100px;
}

#container #cikk .irodalomjegyzek {
    word-break: break-all;
    color: var(--grey);
    font-size: 0.8em;
    line-height: 1.5em;
    margin: 30px 0px;
}

#container #cikk ul, #container #cikk ol {
    margin-left:10%;
    color:var(--maincolor);
}


#container #cikk ul li::marker, #container #cikk ol li::marker {
    color: var(--alternate3); /* Change the color */
    font-weight: bold; /* If you want it to be bold */
}

#container #cikk ul li, #container #cikk ol li {
    color:var(--grey);
    font-weight: 100;
}



span#fr_1_count {
    color:var(--grey);
    font-size:0.8em;
}

#container #cikk .ertekeles {
    border-top: 1px solid var(--grey75);
}


#c2_1024 div#cikk div#login_in_article_view {
    padding: 50px 100px;
}
/**
 * ROVAT
 */
#container .rovatpadding {
    text-align:justify;
    padding:50px 100px 25px 100px;
    border-bottom:3px solid var(--maincolor);
    min-height: 260px;
}


#container .leftcol {
    display: flex;
    flex-wrap: wrap;
    padding: 25px 50px;
    
    
}

#container .leftcol .block {
    width: 50%;
    padding: 15px 50px;
    text-align: left;
}

#container .leftcol .block a.h1 {
    color: var(--maincolor);
    font-weight: 900;
    font-size:1.2em;
    text-align: left;
    line-height: initial;
}
#container .rovatpadding a.h1 {
    color: var(--maincolor);
    font-weight: 900;
    font-size:1.4em;
    text-align: left;
    line-height: initial;
}

/*#container .leftcol .block p, */
.rovatpadding p {
    margin-top:15px;
    text-align: justify;
    color:var(--grey);
    font-weight: 100;
    line-height: 1.4em;
}
#container .leftcol .block p {
    text-align: justify;
    color:var(--grey);
    font-weight: 100;
    line-height: 1.4em;
}


#container img.bbor {
    float: left;
    margin: 0px 15px 15px 0px;
}

#container .leftcol img.bbor {
    width:210px;
    height:auto;

}

#container a.more .arrow_right {
  transform: rotate(180deg);
  font-size:2em;
    display: inline-block;
    position: relative;
    top: 11px;
}

#container #left-column .rightmore {
    text-align: right;
    margin-top:1em;
}
#container #left-column .rightmore a.more {
    background: var(--maincolor);
    color: var(--white);
    padding: 10px;
    border-radius:var(--borderradius);
    transition:all 200ms;
}
#container #left-column .rightmore a.more:hover {
    background-image: linear-gradient(rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.3)) !important;
}
#container #left-column #cikk .cikkcontent{
    padding:50px 100px;
}




/**
 * Onlinetovabbkepzes
 */

/*#container #cikk .vpotkkoszonto {
    padding:25px 100px;
    text-align: justify;
}*/
#container #cikk .vpotkkoszonto {
    padding: 25px 40px;
    text-align: justify;
    max-width: 1100px;
    margin: 0 auto;
    font-size:1.2em;
}

#container #cikk .vpeloadas {
    width: 100%;
    /*max-width: 1100px;
    margin: 0 auto;*/
    text-align: left;
    margin-bottom: 5em;
}

#container #cikk .vpvideobox {
    /*background: var(--maincolor);*/
    padding: 20px 20px;
    color: var(--white);
    background-color: var(--maincolor);
    background-image: url(../images/szivelegtelenseg/lines.svg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

#container #cikk .vpvideobox p {
    color: var(--white);
    margin:15px 0px;
    text-align: justify;
}

#container #cikk .vpvideobox div:first-child {
    max-width: 1100px;
    margin: 0 auto;
    aspect-ratio: 16 / 9;
    padding-bottom:unset !important;
}

#container #cikk .vpvideotitle {
    display: flex;
    margin-left: 30px;
    padding: 15px;
    color: var(--grey);
    max-width: 1100px;
    margin: 0 auto;
}

#container #cikk .titletext {
    margin-left: 30px;
}

#container #cikk .titlecim {
    color: var(--alternate2);
    font-weight: 700;
    font-size: 1.4em;
    margin-bottom: 10px;
}

#container #cikk .titleea {
    color: var(--grey);
}

#container #cikk .titleea strong {
    font-weight: 700;
}

#container #cikk .vpvideobox .vpvideotitle .titleea strong{
    font-weight:700;
}







/**
 * footer
 */

#c2_1024 #footer {
		/*background: url("../images/vaspotlas/site_bottom_BG_vapotlas_2021.png") no-repeat top center;*/
		background: #A36BCF;
background: linear-gradient(68deg,var(--alternate2) 0%, var(--alternate3) 100%);
        color: var(--white);
		margin: 0 auto;
		text-align: center;
		width: 100%;
		display: flex;
        align-items: flex-end;
        justify-content: center;
        position:relative;
        z-index: 1;
        /*margin-top:-150px;*/
	}
	
	#c2_1024 #footer ul {
		margin-top:10px;
	}
	
	
	#c2_1024 #footer li {
		float: none;
		list-style: none;
		display: inline-block;
        padding:0 15px;
	}
    #c2_1024 #footer a {
		color: var(--white);
        font-weight: 500;
	}
	
	#c2_1024 #footer .leftcol, #c2_1024 #footer ul {
		float: none;
	}
    
    #c2_1024 #footer .leftcol{
        padding:10px;
	}





/*
	Regisztráció

*/

form.editform {
    line-height: 2.5em;
    color: var(--grey);
}

form.editform p {
    line-height: 1.5em;
    text-align: justify;
	margin-bottom:15px;
}




fieldset {
    padding: 10px;
    border-top: 2px solid var(--grey25);
    border-bottom: none;
    border-left: none;
    border-right: none;
    text-align: center;
}

fieldset fieldset{
    padding: 10px 0px;
    margin: 10px 0px;
    border-bottom: 2px solid var(--grey25);
}


div#module_registration {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    padding: 30px;
}

div#module_registration label {
    padding: 5px;
    color: var(--maincolor);
    display: inline-block;
    width: 30%;
    text-align: right;
    font-size: 1em;
    line-height: 1.2em;
}

div#module_registration input {
    padding: 10px;
    color: var(--grey);
    background: var(--grey25);
    border: 0px;
	width: 40%;
}

div#module_registration .radio {
    display: flex;
    justify-content: center;
}

div#module_registration .radio .coloumn {
    margin: 0px 10px;
}

div#module_registration .radio input[type=radio] {
    margin: 5px;
}

fieldset.megerosit label{
    display: none !important;
}
div#module_registration input[type=radio] {
    width:40px;
    height: 20px;
    margin: 10px 0;
}
div#module_registration input[type=submit] {
    background:var(--maincolor);
    color:var(--white);
    cursor:pointer;
    border-radius: var(--borderradius);
}

div#module_registration select {
    width: 40%;
	color: var(--grey);
    background: var(--grey25);
    border: 0px;
    padding:10px;
    margin-left: 3px;
}


#c2_1024 .panels a.panelTab {
    color: var(--white);
    background: var(--maincolor);
    border-right: 1px solid white;
    margin-bottom: 10px;
    padding: 3px 6px;
    text-decoration: none !important;
    cursor: pointer;
	filter: brightness(1) grayscale(0.5);
}

#c2_1024 .panels a.panelTab:hover {
	filter: brightness(1.2) grayscale(0);
}
#c2_1024 .panels a.active {
    filter: brightness(1) grayscale(0);
}

span.error_message {
		background: #e67e22;
		color: var(--white);
		padding: 5px;
		line-height: 1.2em;
		display: block;
	}

/*----------------lipidcsokkentes end-----------*/


/* KWINDOW: */
#kwindow_center {
	width: 100%;
	margin: 0px;
	padding: 0px;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 101;

}

#kwindow_center #kwindow {
    background: white;
    width: 100% !important;
    height: auto;
    position: static;
    margin: 70px auto;
    display: none;
    overflow: hidden;
    padding: 10px;
    max-width: 1000px;
    box-sizing: border-box;
}

#kwindow_center #kwindow img{
    width: 100%;
    height: auto;
}



#kwindow_center #kwindow #kwindow_content {
	text-align: left;
}

#kwindow_center #kwindow_loading {
	width: 100px;
	height: 100px;
	background: url(/images/miracle/loading.gif) no-repeat;
	position: static;
	margin: 200px auto;
	display: none;
}

#photogallery2_darken {
	display: none;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background: black;
	filter:alpha(opacity=35);
	-moz-opacity:.35;
	opacity:.35;
	z-index: 100;
}

*html #photogallery2_darken {
	position: absolute;
	display: none;
}

/* kwindow gallery template 1 (a meretek automatikusak a kepmeretek szerint) */

.kwindow_gallery_template_1 .floated {
	overflow: hidden;
}

*html .kwindow_gallery_template_1 .floated {
	overflow: visible;
	height: 1%;
}

.kwindow_gallery_template_1 .floated .leftcol {
	float: left;
}

/* csavez 2009.04.10 */
.kwindow_gallery_template_1 .floated .leftcol .main_image {
	float:left;
	width:470px;
	margin:0px auto;
}

.kwindow_gallery_template_1 .floated .leftcol .nav_left,
.kwindow_gallery_template_1 .floated .leftcol .nav_right {
	margin:0px;
	width:16px;
	float:left;
}

.kwindow_gallery_template_1 .floated .leftcol .nav_right {
	float:right;
}

.kwindow_gallery_template_1 .floated .leftcol .nav .move_prev,
.kwindow_gallery_template_1 .floated .leftcol .nav .move_next  {
	background:transparent url(/images/miracle/kwindow_gallery_prev.jpg) no-repeat scroll right center;
	height:45px;
	padding:0px;
	width:16px;
	float:none;
	height:300px;
}

.kwindow_gallery_template_1 .floated .leftcol .nav .move_next {
	background:transparent url(/images/miracle/kwindow_gallery_next.jpg) no-repeat scroll right center;
	width:16px;
	padding:0px;
	float:right;
	
}
/* vége */

.kwindow_gallery_template_1 .floated .leftcol img {
	margin: 0px auto;
	display: block;
}

.kwindow_gallery_template_1 .floated .leftcol .picture_title {
	text-align: center;
	margin-top: 4px;
	color: #303030;
}

.kwindow_gallery_template_1 .floated .rightcol {
	float: right;
	border-left: 1px dotted #AAAAAA;
	padding-left: 10px;
}

*html .kwindow_gallery_template_1 .floated .rightcol {
	overflow: hidden;
	position: relative;
}

*+*+html .kwindow_gallery_template_1 .floated .rightcol {
	overflow: hidden;
	position: relative;
}

.kwindow_gallery_template_1 .floated .rightcol .thumbs {
	overflow: hidden;
}

.kwindow_gallery_template_1 .floated .rightcol .thumbs table#kwindow_gallery_thumbs {
	position: relative;
}

.kwindow_gallery_template_1 .floated .rightcol .thumbs td {
	border-bottom: 4px solid white;
}

.kwindow_gallery_template_1 .floated .rightcol .thumbs td img {
	display: block;
	margin: 0px auto;
}

.kwindow_gallery_template_1 .floated .rightcol .move_up {
	background: white url(/images/miracle/kwindow_gallery_up.jpg) center no-repeat;
	height: 25px;

	margin-bottom: 10px;
	position: relative;
	z-index: 7777;
}

.kwindow_gallery_template_1 .floated .rightcol .move_down {
	background: white url(/images/miracle/kwindow_gallery_down.jpg) center no-repeat;
	height: 25px;

	margin-top: 10px;
	position: relative;
}

.kwindow_gallery_template_1 #va_outer {

}

.kwindow_gallery_template_1 #va_inner img {
	display: block;
	margin: 0px auto;
}

.kwindow_gallery_template_1 .nav {
	float: left;
	width: 260px;
	margin-left: 250px;
	margin-top: -34px;
	margin-bottom: 7px;
}

*html .kwindow_gallery_template_1 .nav {
	margin-left: 125px;
}

.kwindow_gallery_template_1 .nav a.print_image {
	float: left;
	margin-left: 12px;
	cursor: pointer;
}

.kwindow_gallery_template_1 .nav .move_prev {
	background: white url(/images/miracle/kwindow_gallery_prev.jpg) no-repeat left top;
	width: 66px;
	height: 23px;
	float: left;
	padding: 15px 25px;
	cursor: pointer;
}

.kwindow_gallery_template_1 .nav .move_next {
	background: white url(/images/miracle/kwindow_gallery_next.jpg) no-repeat right top;
	width: 66px;
	height: 23px;
	float: right;
	padding: 15px 25px;
	text-align: right;
	cursor: pointer;
}

.kwindow_gallery_template_1 .clear {
	clear: both;
}


/**
 * DEFAULT KGALLERY
 */
#kwindow_gallery .border {
	border:1px dotted #AAAAAA;
	padding: 10px;
}

#kwindow_gallery .title {
	border-left:8px solid #FF9500;
	font-size:1.1em;
	font-weight:bold;
	margin:10px auto;
	padding-left:6px;
	color: black;
}

#kwindow_gallery a.kwindow_close {
	background:transparent url(/images/miracle/icons/cross.png) no-repeat scroll 0 0;
	cursor:pointer;
	float:right;
	padding-left:20px;
}

/**
 * Tooltip irodalomjegyzékhez
 */
#biblio-tip,
#ad-tip {
    position: absolute;
    z-index: 9999;
    display: block;
    width: 300px;
    /*overflow: hidden;*/
    font-size: .70em;
    font-weight: 400;
    text-align: left;
    background: var(--maincolor);
    color:var(--white);
    padding:10px;
    box-shadow:0px 0px 5px var(--grey);
    word-wrap: break-word;
}

#biblio-tip::before {
    content:'';
    display:block;
    width:0;
    height:0;
    position:absolute;
   border-top: 20px solid transparent;
    border-bottom: 0px solid transparent;
    /* border-right: 20px solid black; */
    left: 25px;
    top: -20px;
    border-left: 20px solid var(--maincolor);
}

/*#biblio-tip div.top,
#ad-tip div.top {
    background: url(/images/tooltip_top.gif) no-repeat left top;;
    height: 27px;
    width: 300px;
}

#biblio-tip div.content,
#ad-tip div.content {
    background: url(/images/tooltip_bg.gif);
    background-repeat: repeat-y;
    width: 280px;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 5px;
}

#ad-tip div.content div.container {
    background: url(/images/hirdetes_ad.gif) no-repeat -9px center;
    padding-left: 15px;
}

#ad-tip div.content div.container span.ad_text {
    display: none;
}

#biblio-tip div.bottom,
#ad-tip div.bottom {
    background: url(/images/tooltip_bottom.gif) no-repeat left top;;
    height: 10px;
    width: 300px;
}*/

/**
 * kulcsszóra mejelenő hirdetés
 *
 */

.article_ad_keyword {
    border-bottom: double;
    color: #094FA3;
    cursor: pointer;
}

a.article_ad_keyword:hover {
    text-decoration: none;
}

/**
 *  .....kulcsszóra mejelenő hirdetés
 */


#cikk #comments form textarea {
    font-size: 12px;
}


div.cikk_content div.banner_468x60_in_article {
    background: transparent url(/images/hirdetes.gif) no-repeat scroll 2px 50%;
   
    margin: 15px auto;
    padding: 0 0 0 25px;
    width: 450px;
    margin-left: -20px;
}

div.cikk_content div.banner_468x60_in_article br {
    display: none;
}

div.cikk_content div.banner_468x60_in_article span {
    display: block;
}

div.cikk_content div.banner_468x60_in_article span.ad_title a {
    color: #000000;
    display:block;
    font-weight: bold;
    text-decoration: none;
}

div.cikk_content div.banner_468x60_in_article .ad_description {
    font-size: 0.9em;
    font-weight: normal;
}

div.cikk_content div.banner_468x60_in_article span.ad_link a {
    color: #4A9219;
    display: block;
    font-weight: bold;
    font-size: 0.9em;
    text-decoration: underline;
}

.banner {
   
}

#body .info {
    background: none;
}

/**
 * Tesztek (kreditpontot és adminon is)
 */
div#teszt form.editform label {
    width:80%;
    text-align: left;
}

/**
* Related figures
*/

#cikk div.related_figures {
	width: 100%;
	/*border: 1px solid var(--maincolor);*/
	overflow: hidden;
	margin-top: 10px;
	margin-bottom: 10px;
	padding: 10px;
    background: url("../images/vaspotlas/site_bottom_BG_vapotlas_2021.png") no-repeat 50% center;
	background-color: var(--maincolor);
    box-sizing: border-box;
    
}

#cikk div.related_figures img {
	margin: 10px auto;
	max-width: 100%;
    /*width:;*/
	border: 0;
}

#cikk div.related_figures p {
	/*font-size: 1em;*/
	font-weight: 400;
	color: var(--white);
	margin: 0;
}

#cikk div.related_figures a {
	display: block;
    text-align: center;
}

#cikk div.related_figures span {
    color:var(--white);
    font-weight: 400;
	display: block;
}

.topbar-nav ul {
    padding: 0;
    margin: 0;
    list-style: none;
  }
  .topbar-nav .metismenu {
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-size: 1.2em;
  }
  .topbar-nav .metismenu sup {
    font-size: 9px;
  }
  .topbar-nav .metismenu > li {
    /*flex: 0 0 150px;*/
    display: flex;
    flex-direction: column;
    position: relative;
    /*width: 160px;*/
    max-width: calc(100% + 100px);
    text-align: left;
  }
  
  .topbar-nav .metismenu a {
    text-decoration: none;
    position: relative;
    display: block;
    padding: 15px;
    text-transform: uppercase;
    color: var(--grey);
    outline-width: 0;
    transition: all 0.3s ease-out;
    /* margin: 0 10px; */
  }

  .topbar-nav .metismenu li a.active { 
    /*color: var(--white);
    background: var(--maincolor);
    border-radius:var(--borderradius);*/
    border-bottom: 2px solid var(--grey25);
}

  .topbar-nav .metismenu a img{
    position:absolute;
    left:10px;
    top:50%;
    transform: translate(0,-50%);
  }
  
  .topbar-nav .metismenu a:hover,
  .topbar-nav .metismenu a:focus,
  .topbar-nav .metismenu a:active {
    /*color: #0c63e4;*/
    text-decoration: none;
    background: var(--grey25);
    border-radius:var(--borderradius);
  }

  .metismenu .has-arrow::after {
    right: 15px !important;
}

.topbar-nav .metismenu > li > ul {
    background: var(--maincolor);
    border-bottom:1px solid var(--whitealpha);
    /*border: 1px solid #e7f1ff;*/
}

.topbar-nav .metismenu > li > ul a{
    color: var(--white);
}

.topbar-nav .metismenu > li > ul > li{
    border-bottom:1px solid var(--whitealpha);
}

.topbar-nav .metismenu > li > ul > li > ul {
    background: var(--maincolor-lighthex);
    /*border: 1px solid #e7f1ff;*/
}
@media (min-width: 768px) {
    .topbar-nav .metismenu {
      flex-direction: row;
    }
    .topbar-nav .metismenu > li {
      flex-direction: column;
    }
    .topbar-nav .metismenu > li > ul {
      position: absolute;
      top: 100%;
      min-width: 250px;
      text-align: center;
      z-index: 1001;
      /*border: 1px solid #e7f1ff;*/
    }
    .topbar-nav.is-hoverable .metismenu > li > ul {
      height: auto !important;
    }
    .topbar-nav.is-hoverable .metismenu > li:hover > ul {
      display: block;
    }
    .topbar-nav.is-hoverable .metismenu > li:hover > a.has-arrow:after {
      transform: rotate(-135deg);
    }
  }

  .truncate2 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2; /* number of lines to show */
            line-clamp: 2;
    -webkit-box-orient: vertical;
    hyphens: auto;
    -webkit-hyphens: auto;
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10 and IE 11 */
    user-select: none; /* Standard syntax */
 }

 .truncate5 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 5; /* number of lines to show */
            line-clamp: 5;
    -webkit-box-orient: vertical;
    hyphens: auto;
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10 and IE 11 */
    user-select: none; /* Standard syntax */
 }

 span.tovabbkepzescounter {
    display: inline-block;
    width: 40px;
    height: 40px;
    min-width: 40px;
    min-height: 40px;
    max-width: 40px;
    max-height: 40px;
    line-height: 40px;
    background: var(--alternate3);
    color: var(--white);
    font-weight: 900;
    border-radius: 50%;
    font-size: 1.5em;
    text-align: center;
    text-shadow: 0 0 4px var(--grey);
}

/*div#cookie-bar {
    font-size: 1.2em !important;
}*/

.button-1 {
    position: relative;
    border: none;
    background: transparent;
    padding: 0;
    cursor: pointer;
    outline-offset: 4px;
    transition: filter 250ms;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    margin:10px;
}

.button-1-shadow {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 12px;
    background: hsl(0deg 0% 0% / 0.25);
    will-change: transform;
    transform: translateY(2px);
    transition: transform 600ms cubic-bezier(.3, .7, .4, 1);
}

.button-1-edge {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 12px;
    background: linear-gradient(to left, var(--alt2-20) 0%, var(--alt2-10) 8%, var(--alt2-10) 92%, var(--alt2-20) 100%);
    /*background: linear-gradient( to left, hsl(30 100% 16%) 0%, hsl(30 100% 32%) 8%, hsl(30 100% 32%) 92%, hsl(30 100% 16%) 100% );*/
}
.button-2-edge {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 12px;
    background: linear-gradient(to left, var(--alt3-20) 0%, var(--alt3-10) 8%, var(--alt3-10) 92%, var(--alt3-20) 100%);
    /*background: linear-gradient( to left, hsl(0, 100%, 16%) 0%, hsl(0, 100%, 32%) 8%, hsl(0, 100%, 32%) 92%, hsl(0, 100%, 16%) 100% );*/
}

.button-1-front {
    display: block;
    position: relative;
    padding: 12px 27px;
    border-radius: 12px;
    font-size: 1.1rem;
    color: white;
    background: var(--alternate2);
    /*background: hsl(0, 87.4%, 50.2%);*/
    /*background: hsl(30 100% 47%);*/
    will-change: transform;
    transform: translateY(-4px);
    transition: transform 600ms cubic-bezier(.3, .7, .4, 1);
}
.button-2-front {
    display: block;
    position: relative;
    padding: 12px 27px;
    border-radius: 12px;
    font-size: 1.1rem;
    color: white;
    background: var(--alternate3);
    /*background: hsl(0, 0.73%, 26.86%);*/
    /*background: hsl(0, 100%, 47%);*/
    will-change: transform;
    transform: translateY(-4px);
    transition: transform 600ms cubic-bezier(.3, .7, .4, 1);
}

.pdfbtn {
    background-color: var(--atrenative-color-alpha);
    border: none;
    color: white;
    padding: 12px 30px;
    cursor: pointer;
    font-size: 20px;
    transition:all 300ms;
    text-decoration: none;
  }
  
  /* Darker background on mouse-over */
  .pdfbtn:hover {
    background-color: var(--maincolor);
  }

@media (min-width: 768px) {
    .button-1-front, .button-2-front {
        font-size: 1.25rem;
        padding: 12px 42px;
    }
}

.button-1:hover {
    filter: brightness(110%);
    -webkit-filter: brightness(110%);
}

.button-1:hover .button-1-front, .button-1:hover .button-2-front {
    transform: translateY(-6px);
    transition: transform 250ms cubic-bezier(.3, .7, .4, 1.5);
}

.button-1:active .button-1-front, .button-1:active .button-2-front {
    transform: translateY(-2px);
    transition: transform 34ms;
}

.button-1:hover .button-1-shadow {
    transform: translateY(4px);
    transition: transform 250ms cubic-bezier(.3, .7, .4, 1.5);
}

.button-1:active .button-1-shadow {
    transform: translateY(1px);
    transition: transform 34ms;
}

.button-1:focus:not(:focus-visible) {
    outline: none;
}