html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    font: inherit;
    font-size: 100%;
    border: 0;
    vertical-align: baseline;
    outline: 0;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
img,
h1 {
    display: block;
}

body {
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 23px;
    color: #47474A;
}
strong {font-weight: bold;}


blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: "";
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

img {
    height: auto;
}


/* ==|== TYPOGRAPHY ========================================================= */

h1 {
    font-size: 24px;
    font-style: normal;
    line-height: 28px;
    background: url("img/h1bg-01.svg") no-repeat center right;
    padding-right: 75px;
    padding-left: 125px;
    margin-left: -125px;
}


/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/

a {
    margin: 0;
    padding: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
    outline: none;
    color: #FFF;
}

a:link,
a:visited,
a:focus {
    outline: none;
    border: none;
    text-decoration: none;
}

*:focus {
    outline: none;
}


/* ==|== COMMON ============================================================= */

html {
    height: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-family: 'Roboto', sans-serif;
}

body {
    height: 100%;
    background: white;
}

*,
*:before,
*:after {
    -webkit-box-sizing: inherit;
    box-sizing: inherit;
}

.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.transition,.accordion,
a {
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}


/* ==|==  ============================================================== */
.container {
    margin: 0 auto;
    padding-left: 20px;
    padding-right: 20px;
    position: relative;
    width: 100%;
    max-width: 984px;
}

.container-in {
    max-width: 506px;
}

/* ==|== TEMPLATE ========================================================== */

#page {
    overflow-x: hidden;
}

#content-bottom {

   padding-bottom: 320px;

}

#header {
    height: 130px;
    width: 100%;
    background: rgb(255, 255, 255);
    background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 1)), color-stop(50%, rgba(255, 255, 255, 1)), color-stop(50%, rgba(15, 174, 151, 1)), to(rgba(15, 174, 151, 1)));
    background: -o-linear-gradient(left, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(15, 174, 151, 1) 50%, rgba(15, 174, 151, 1) 100%);
    background: linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(15, 174, 151, 1) 50%, rgba(15, 174, 151, 1) 100%);
}

#hero img {
    width: 100%;
    height: auto;
    -o-object-fit: contain;
    object-fit: contain
}

#logo {
    position: relative;
    z-index: 11;
    min-width: 400px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 130px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

#top-info {
    color: #FFF;
    width: 100%;
    position: relative;
    height: 130px;
    background: #10AC93;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

#top-info a:hover {
    opacity: 0.72
}

#logo:after {
    content: "";
    position: absolute;
    right: -1px;
    top: 0;
    bottom: 0;
    width: 130px;
    height: 130px;
    background: #10AC93;
    -webkit-clip-path: polygon(0 0, 100% 100%, 100% 0);
    clip-path: polygon(0 0, 100% 100%, 100% 0);
    z-index: 1
}

.fbicon {
    margin: 4px 0 0 25px
}

.mail img {
    margin-right: 10px;
}



.regisztracio .container-in {
    max-width: 680px;
    background: url("img/h1bgm-01.svg") no-repeat left 100px;
}

#content {
    background: url("img/bg-01.svg") no-repeat top center;
    background-size: 100%;
    position: relative;
    margin-top: -3px;
}
#content-bottom {
     background: url("img/bgb-01-01.svg") no-repeat top center;
    background-size: 100%;
    position: relative;
}
#content .container {
    padding-top: 30px
}

.minus-left {
    margin: 45px 15px 60px -212px;
    font-size: 24px;
    max-width: 600px;
    line-height: 28px;
}

.green-box {
    background: #10AC93;
    padding: 25px 20px 25px 50px;
    color: #FFF;
    position: relative;
    margin: 30px 0 30px -50px;
    font-weight: 700;
}

.green-box:before {
    content: "";
    height: 56px;
    width: 60px;
    position: absolute;
    top: 0;
    left: -59px;
    display: block;
    background: #10AC93;
    -webkit-clip-path: polygon(0 0, 100% 100%, 100% 0);
    clip-path: polygon(0 0, 100% 100%, 100% 0);
}
.green-box.blue-boxe {
    background: #0371B7;
    padding: 25px 20px 25px 50px;
    color: #FFF;
    position: relative;
    margin: 30px 0 30px -50px;
    font-weight: 700;
}
.green-box.blue-boxe:before {
    content: "";
    height: 56px;
    width: 60px;
    position: absolute;
    top: 0;
    left: -59px;
    display: block;
    background: #0371B7;
    -webkit-clip-path: polygon(0 0, 100% 100%, 100% 0);
    clip-path: polygon(0 0, 100% 100%, 100% 0);
}
.green-box.blue-boxe ol {padding-left: 1em;}
.green-box.blue-boxe ol li{margin-bottom: 4px;}
.green-box.orange-box {
    background: #ed7f3e;
    padding: 25px 20px 25px 50px;
    color: #FFF;
    position: relative;
    margin: 30px 0 30px -50px;
    font-weight: 700;
}
.green-box.orange-box:before {
    content: "";
    height: 56px;
    width: 60px;
    position: absolute;
    top: 0;
    left: -59px;
    display: block;
    background: #ed7f3e;
    -webkit-clip-path: polygon(0 0, 100% 100%, 100% 0);
    clip-path: polygon(0 0, 100% 100%, 100% 0);
}

.blue-left-box {
    background: #0371B7;
    padding: 25px 25px 25px 50px;
    color: #FFF;
    position: relative;
    margin: 30px 0 30px -50px;
}

.blue-left-box:before {
    content: "";
    height: 56px;
    width: 60px;
    position: absolute;
    top: 0;
    right: -59px;
    display: block;
    background: #0371B7;
    -webkit-clip-path: polygon(100% 0, 0 0, 0 100%);
    clip-path: polygon(100% 0, 0 0, 0 100%);
}

.seven {
    font-weight: 700;
    margin-top: 25px;
}

.blue-box {
    background: #0371B7;
    padding: 15px 10px 5px 15px;
    color: #FFF;
    position: relative;
    margin: 30px 0 30px -50px;
}

.blue-box:before {
    content: "";
    height: 56px;
    width: 60px;
    position: absolute;
    top: 0;
    left: -59px;
    display: block;
    background: #0371B7;
    -webkit-clip-path: polygon(0 0, 100% 100%, 100% 0);
    clip-path: polygon(0 0, 100% 100%, 100% 0);
}

.blue-box li {
    margin-bottom: 12px
}
/*----------ACCORDION-------------------*/
.acc-wrap {
    
    width: calc(100% + 212px);
    display: block;
    margin: 45px 15px 0px -212px;
}
h2.blue {

font-size: 24px;
font-style: normal;
font-weight: 900;
line-height: 28px;
color: #006EB6

}
.acc-wrap .panel h2 {

font-size: 24px;
font-style: normal;
font-weight: 400;
line-height: 28px;
margin:5px 0 25px 0;
    
}
.panel p{
  line-height:  23px;
    font-size: 18px;
    margin-bottom: 20px;
}
.panel ul {
    list-style-type: "-";
    margin: 0 0 20px 40px;
padding: 0;
}
.left-margin {margin-left: 32px;}
.dot {display: inline-block;margin-right: 1.3em;}
.space {
    display: inline-block;
    width: 1.9em;
}
.panel ol {
    list-style:disc;
    margin: 0 0 20px 40px;
padding: 0;
}
.panel ul li{
    
    margin: 0 0 4px 0;
padding: 0 0 0 1.5em;
line-height:  23px;
}
.panel table {
    border-collapse: collapse;
    width: 100%;
}
.panel td {
    border: 1px solid #ddd;
    text-align: left;
    padding: 15px;
    vertical-align: top;
}
.sec-table td {
    vertical-align: middle;
}
.sec-table tr td:nth-child(2) {
    text-align: center;
}
.panel a {color:#404040}
.panel table p{margin:0}
.accordion {
font-weight: normal;
font-size: 24px;
line-height: 28px;
background: none;
color: #10AC93;
cursor: pointer;
padding: 18px 0;
width: 100%;
border: none;
text-align: left;
outline: none;
transition: 0.4s;
display: flex;
justify-content: space-between;
align-items: center;
}

.active {
  font-weight: 900
}
.accordion:after {
  content: '';
 width: 0px;
height: 0px;
    display: block;
border-left: 18px solid transparent;
border-right: 18px solid transparent;
border-top: 20px solid #006EB6;
}

.active:after {
  content: "";
    display: block;
    border:0;
    width: 37px;
height: 5px;
    
background: #0371B7;
    
}
.panel {
  padding:0;
  background-color: white;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

#tajekoztato {display: block;
    width: 100%;
    max-width: 220px;
}
#tajekoztato-btn {
    background: #0371B7;
    display: block;
    color: #FFF;
    padding: 15px;
    margin-right: 90px;
    margin-left: 0;
    text-align: center;
    margin-top:25px;
}

#tajekoztato-btn-fourth {
    background: #0371B7;
    display: block;
    color: #FFF;
    padding: 15px;
    margin-right: 90px;
    margin-left: 0;
    text-align: center;
    margin-top:25px;
}
#tajekoztato-btn-sec {
    background: #0fae97;
    display: block;
    color: #FFF;
    padding: 15px 25px;
    margin-right: 90px;
    margin-left: 0;
    text-align: center;
    margin-top:25px;
}
#tajekoztato-btn-third {
    background: #ed7f3e;
    display: block;
    color: #FFF;
    padding: 15px;
    margin-right: 90px;
    margin-left: 0;
    text-align: center;
    margin-top:25px;
}
#tajekoztato-btn:hover,#tajekoztato-btn-third:hover,#tajekoztato-btn-sec:hover {
    opacity: 0.8;
  
}

/*----------ACCORDION-------------------*/
.triang {
    width: 22px;
    height: 22px;
    display: inline-block;
    background: #FFF;
    -webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%);
    clip-path: polygon(100% 0, 0% 100%, 100% 100%);
    margin-right: 16px
}

.image {
    margin: 60px auto;
}

.image img {
    width: 100%;
    height: auto;
}

footer {
    color: #FFF;
    position: relative;
}

#footer-contact {
    background: #10AC93;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 21px;
    letter-spacing: 0em;
    text-align: left;
}

#footer-contact .flex {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    min-height: 80px;
}

.foo-info {
    background: #10AC93;
    -webkit-clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
    clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
    max-width: 410px;
    padding-top: 135px;
    padding-bottom: 0px;
    text-align: left;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    margin-bottom: -1px;
    flex-direction: column;
    align-items: center;
}

#footer-info {
    position: relative;
    margin-top: -200px;
    margin-left: -135px
}

#footer-info h3 {
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
    letter-spacing: 0em;
    text-align: left;
    margin-bottom: 15px;
}


.transition,
a {
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

/* ==|== MEDIA SCREEN ============================================================== */

@media only screen and (max-width: 1280px) {
    #content {
        background: url("img/bg-011.svg") no-repeat top center;
        background-size: unset;
    }
}

@media only screen and (max-width: 990px) {

    .green-box,
    .blue-boxe {
        margin: 30px auto!important;
    }

    #header {
        background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 1)), color-stop(60%, rgba(255, 255, 255, 1)), color-stop(60%, rgba(15, 174, 151, 1)), to(rgba(15, 174, 151, 1)));
        background: -o-linear-gradient(left, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 60%, rgba(15, 174, 151, 1) 60%, rgba(15, 174, 151, 1) 100%);
        background: linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 60%, rgba(15, 174, 151, 1) 60%, rgba(15, 174, 151, 1) 100%);
    }

    #footer-info {
        margin-left: 0
    }

    #footer-info .container {
        padding: 0
    }

    .green-box::before {
        content: "";
        height: 36px!important;
        width: 36px!important;
        position: absolute;
        top: 0!important;
        left: -35px!important;
    }

    .minus-left,.acc-wrap {
        margin-left: 0;
    }
    .acc-wrap {width: 100%}
}

@media only screen and (max-width: 768px) {
    .accordion:after {
        content: '';
        width: 0px;
        height: 0px;
        display: block;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid #006EB6;
    }
    .accordion,.acc-wrap .panel h2 {
        font-size: 16px;
        font-style: normal;
        line-height: 19px;
    }
    .active:after {
        height: 2px;
        border: 0;
        width: 20px;
    }
    h2.blue {
        font-size: 16px;
       
        line-height: 19px;
    }
    .panel p {
        line-height: 19px;
        font-size: 14px;
        margin-bottom: 15px;
    }
    .minus-left {
        margin: 25px 10px 0 45px;
        font-size: 16px;
        font-style: normal;
        line-height: 19px;
    }
    #tajekoztato-btn,#tajekoztato-btn-sec,#tajekoztato-btn-third,#tajekoztato-btn-fourth {
       
        margin-right: 0;
        margin-left: 45px;
      
        margin-top: 30px;
    }
    .acc-wrap {
        width: 100%;
          margin: 25px 10px 0 0;
    }
    body {
        font-size: 14px;
    }

    #content-bottom {
        position: relative;
        background: none;
        padding-bottom: 180px;
    }


    #header {
        background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 1)), color-stop(60%, rgba(255, 255, 255, 1)), color-stop(60%, rgba(15, 174, 151, 1)), to(rgba(15, 174, 151, 1)));
        background: -o-linear-gradient(left, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 60%, rgba(15, 174, 151, 1) 60%, rgba(15, 174, 151, 1) 100%);
        background: linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 60%, rgba(15, 174, 151, 1) 60%, rgba(15, 174, 151, 1) 100%);
        height: 70px;
    }

    #top-info .mail span,
    #footer-contact .mail span {
        display: none
    }

    .triang {
        width: 16px;
        height: 16px;
        margin-right: 6px
    }

    h1 {
        font-size: 16px;
        font-style: normal;
        line-height: 19px;
        background: url("img/h1bgm-01.svg") no-repeat center left;
        background-size: contain;
        padding-right: 0;
        padding-left: 64px;
        margin: 0;
        margin-left: -20px;
    }


    #content .container {
        padding-top: 30px;
        padding-left: 40px;
    }

    #content-bottom .container {
        padding-left: 40px;
    }

    .blue-left-box {
        margin: 30px 0 30px 0;
        padding-left: 20px;
    }

    .green-box,.green-box.blue-box ,.green-box.orange-box  {
        margin-top: 34px;
        padding: 25px 25px 25px 20px!important;
    }

    .image {
        margin: 25px auto;
        padding-left: 16px;
    }

    .mtext {
        padding-left: 16px;
    }

    .blue-box::before {
        content: "";
        height: 30px;
        width: 32px;
        position: absolute;
        top: 0;
        left: -32px;
        display: block;
        background: #0371B7;
        -webkit-clip-path: polygon(0 0, 100% 100%, 100% 0);
        clip-path: polygon(0 0, 100% 100%, 100% 0);
    }

    #logo {
        min-width: 55%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        height: 70px;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .fbicon {
        margin: 4px 0 0 15px;
    }

    .fbicon img {
        max-width: 24px;
    }

    #top-info {
        height: 70px;
    }

    #footer-info {
        margin-top: -20px
    }

    .blue-box,.green-box.blue-boxe ,.green-box.orange-box {
        padding: 15px 10px 5px 7px;
    }

    .foo-info {
        max-width: 230px;
        padding-top: 85px;
        padding-bottom: 0;
        text-align: left;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    #logo:after {
        width: 70px;
        height: 70px;
    }

    #logo img {
        max-width: 135px
    }

    #footer-info h3 {
        font-size: 14px;
        line-height: 17px;
        max-width: 60%;
        margin-bottom: 5px;
    }

    iframe {
        min-height: 2200px !important
    }

    #tajekoztato {
        max-width: 60%;
    }

    #page .regisztracio .container-in {
        padding-left: 0px !important;
    }
}

@media only screen and (max-width: 486px) {
    .blue-left-box:before {
        display: none;
    }

    #header {
        background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 1)), color-stop(70%, rgba(255, 255, 255, 1)), color-stop(70%, rgba(15, 174, 151, 1)), to(rgba(15, 174, 151, 1)));
        background: -o-linear-gradient(left, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 70%, rgba(15, 174, 151, 1) 70%, rgba(15, 174, 151, 1) 100%);
        background: linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 70%, rgba(15, 174, 151, 1) 70%, rgba(15, 174, 151, 1) 100%);
        height: 70px;
    }

    #logo {
        min-width: 65%;
    }

    #content.regisztracio .container {
        padding-top: 30px;
        padding-left: 0px !important;
    }
}
