/*CSS*/

/*---------------------------------------------HTML-BODY...*/
html, body { padding: 0; margin: 0; }
body { background: #001b5a url(art2015/body-bg.jpg) no-repeat center; border: none; text-align: left; font-size: 15px; color: #4e4d4c; font-family: 'Noto Sans', sans-serif; }
h1, h2, h3, h4, h5, .theotherfont { }
/*---------------------------------------------wrapper*/
.wrapper { width: 1000px; position: relative; margin: 0 auto; }
/*---------------------------------------------header*/
#header { padding: 20px 0; color: #a4a3a2; }
#header .wrapper { padding:0 0 44px 0; }
#site-title h1 { font-size: 170%; font-weight: bold; color: #4e4d4c; line-height: 110%; }
#site-title h1 span { font-size: 121%; font-weight: 200; color: #a4a3a2; letter-spacing: 9px; }
#site-title h2 { font-size: 90%; font-weight: normal; color: #757473; line-height: 110%; margin: 2% 0 0; }
#brand { position: absolute; left: 50%; bottom: -48px; margin-left: -120px; }
#header .right { text-align: right; }
#header .right ul:first-child { padding-bottom: 10px; }
#history-badges .title { transform: rotate(-90deg); vertical-align: middle; line-height: 100%; }
#history-badges li { transition: all ease-out .7s; }
#history-badges li:hover { transform: rotateY(360deg); }
/*---------------------------------------------menu-top*/
#menu-top { width: 100%; z-index: 999; background-color: #000e42; border-bottom: 1px solid #104f96; text-transform: uppercase; }
#menu-top li { font-size: 14px; margin: 0 6px; position: relative; }
#menu-top a { color: #0096d7; display: block; line-height: 400%; }
#menu-top a:hover { color: #fff; }
#menu-top .current a { color: #fff; }
#menu-top li ul { position: absolute; left: -10px; top: 120%; overflow: hidden; width: 200px; height: 0; opacity: 0; transition: all ease-in .2s; z-index: 999; background-color: #000e42; }
#menu-top li:hover ul { height: auto; opacity: 1; top: 100%; }
#menu-top li ul li { display: block; text-align: left; }
#menu-top li ul li a { line-height: 260%; box-shadow: 0 1px 0 rgba(255,255,255,.1); }
#menu-top li.current ul li a { color: #0096d7; }
#menu-top li.current ul li a:hover { color: #fff; }
/*---------------------------------------------content*/
/*columns*/
.column-title { padding: 20px 0; color: #74d8f1; text-transform: uppercase; }
.column-title h3 { font-weight: 300; font-size: 160%; }
/*cycle2 carousel slider*/
.cycle-slideshow { position: relative; }
.slide { width: 100%; background-repeat: no-repeat; background-position: center; background-size: cover; text-align: center; }
.slide .lead { position: absolute; bottom: 0; width: 96%; padding: 2% 2% 6%; background-color: rgba(19,31,52,.9); color: #39c8ff; }
.slide .lead h1 { font-size: 150%; }
.cycle-arrow { position: absolute; top: 50%; margin-top: -50px; width: 90px; height: 90px; background-repeat: no-repeat; background-size: 100%; background-position: center; cursor: pointer; transition: all ease-out .2s; }
.cycle-arrow.right { background-image: url(art2015/slider-arrow-right.png); right: -50px; }
.cycle-arrow.left { background-image: url(art2015/slider-arrow-left.png); left: -50px; }
.cycle-arrow:hover { transform: scale(1.2, 1.2); }
.cycle-arrow.left:hover { background-image: url(art2015/slider-arrow-left-on.png); }
.cycle-arrow.right:hover { background-image: url(art2015/slider-arrow-right-on.png); }
.cycle-pager { width: 100%; position: absolute; bottom: 4%; cursor: pointer; font-size: 0; text-align: center; z-index: 998; }
.cycle-pager span { display: inline-block; width: 20px; height: 20px; background-color: #ff6300; border-radius: 50%; margin: 0 4px; }
.cycle-pager span.cycle-pager-active { background-color: #fff; }
#slider-featured { width: 80%; margin: 0 auto 5%; position: relative; }
#slider-featured .slide { height: 480px; }
/*ribbons*/
.ribbon { margin: 5% 0 2%; text-transform: uppercase; }
.ribbon div { height: 65px; position: relative; background-repeat: no-repeat; }
.ribbon div.clear { height: 0; }
.ribbon .c1 { width: 45%; background-image: url(art2015/ribbon-left.png); background-position: left; text-align: right; }
.ribbon .c2 { width: 10%; height: 100px; top: -25px; background-image: url(art2015/vs.png); background-size: contain; transform: scale(1.3, 1.3); z-index: 2; text-align: center; font-size: 100%; }
.ribbon .c3 { width: 45%; background-image: url(art2015/ribbon-right.png); background-position: right; }
.ribbon .c2 p { padding-top: 10%; color: #fff; }
.ribbon .c2 small { font-size: 170%; font-weight: bold; }
.ribbon .c4 { height:auto; background-clip:rgba(0,0,0,.1); text-align: center; color: #fff; }
.ribbon h2 { font-size: 100%; text-shadow: none; padding: 10px 5% 0; }
.ribbon div.banner { height:auto; }
/*banners*/
.banner { margin: 20px 0; }
.banner p { text-transform: uppercase; color: #217ec6; font-size: 80%; padding: 5px 0; }
.banner img { max-width: 100%; height: auto; }
/*widgets*/
.widget { position: relative; margin: 2% 0 10%; }
.widget img { width: 100%; height: auto; transition: all ease .2s; }
#tipp-widget p { position: absolute; color: #4e4d4c; text-shadow: none; font-size: 14px; }
#tipp-widget .title { width: 70%; left: 15%; bottom: 24%; font-size: 20px; line-height: 30px; color: #fff; }
#tipp-widget .title small { font-size: 33px; font-weight: bold; }
#tipp-widget .igen { bottom: 20px; left: 40px; }
#tipp-widget .nem { bottom: 20px; right: 40px; }
.circle-holder { width: 240px; height: 240px; border-radius: 50%; position: relative; overflow: hidden; margin: 0 auto; box-shadow: 0 0 0 3px #ff6400; transition: all ease .2s; }
.circle-holder:hover { transform: scale(.9, .9); box-shadow: 0 0 0 10px #ff6400; }
.neat-ribbon { width: 100%; height: 55px; background: url(art2015/ribbon-small.png) no-repeat center; background-size: contain; padding-top: 10px; color: #4e4d4c; }
.neat-ribbon h1 { font-size: 90%; }
.neat-ribbon p { font-size: 80%; }
.widget-text { color: #74d8f1; padding: 5% 0; font-size: 80%; }
.widget-text a { color: #fff; }
.widget-text.grad-grey, .widget-text.grad-grey a { color: #4e4d4c; }
#pic-of-day .neat-ribbon, #player-of-day .neat-ribbon { margin-top: -30px; }
#player-of-day .neat-ribbon { z-index: 8; position: relative; }
#nextUP-widget { }
#nextUP-widget .title { position: absolute; top: 15px; text-align: center; width: 100%; font-size: 20px; line-height: 20px; color: #fff; }
#nextUP-widget .title strong { font-size: 40px; line-height: 35px; }
#nextUP-widget .left, #nextUP-widget .right { position: absolute; top: 97px; width: 35%; line-height: 100%; }
#nextUP-widget .left { left: 10%; text-align: right; }
#nextUP-widget .right { right: 10%; text-align: left; }
/*leads*/
.leads { margin: 0 0 10%; }
.leads.no-title { margin: 5% 0 10%; }
.leads .lead { position: relative; margin: 0 0 5%; color: #74d7ef; }
.leads .lead-thumb { float: left; max-width: 20%; transition: transform ease .2s; margin: -15px 0 0 -15px; }
.leads .lead-thumb:hover { transform: scale(.9, .9); }
.leads .lead-thumb img { width: 90%; height: auto; }
.leads .lead-excerpt { float: left; max-width: 80%; }
.leads .lead-excerpt a { color: #fff; }
.leads .lead-excerpt .date { color: #ff6600; font-size: 80%; }
.leads .lead-excerpt h2 { font-size: 140%; text-transform: uppercase; }
.leads .mini-leads { color:#ff6600; }
.leads .mini-leads li.title { margin-bottom:20px; }
.leads .mini-leads h2 { font-size: 100%; font-weight: 300; margin: 2% 0; text-transform: uppercase; position:relative; padding-left:33px; }
.leads .mini-leads h2 span { font-size:200%; line-height:5px; color:#74d8f1; position:absolute; left:0; top:0; }
.leads .mini-leads h2 a:hover { opacity: .8; color:#75d9f4; }
.leads .mini-leads .mini-button { margin-top:20px; }
.box { margin: 0 0 5%; }
.cube { width: 38%; padding-top: 38%; margin-right: 2%; position: relative; }
.cube.blue { background-color: #073c82; color: #fff; }
.cube.orange { background-color: #ff4500; color: #000; }
.cube-text { position: absolute; top: 0; left: 0; width: 90%; padding: 5%; }
.cube-text .leadkep { width: 50%; height: auto; margin: -10% 0 0 -10%; box-shadow: 5px 5px 0 rgba(0,0,0,.4); }
.cube-text p { padding: 5% 0; }
.cube-text .more { position: absolute; right: 5%; top: 5%; }
.cube-thumb { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; }
.cube-thumb img { width: 100%; height: auto; }
.cube-thumb .title { position: absolute; bottom: 0; left: 0; width: 90%; padding: 5%; color: #fff; font-size: 100%; line-height: 100%; text-transform: uppercase; background-color: rgba(0,0,0,.5); transition: all ease-out .2s; }
.cube-thumb:hover .title { padding: 8% 5%; }
.cake-for-all { width: 20%; padding-top: 40%; background: url(art2015/do-it-right.png) no-repeat right; background-size: cover; position: relative; }
.cake-for-all:hover { }
.cake-for-all a { position: absolute; width: 100%; height: 100%; font-size: 0; top: 0; left: 0; }
/*teaser page*/
.bread { padding: 2% 0; color: #0096d7; }
.bread a { color: #0096d7; }
.bread strong { color: #fff; }
.bread li { margin: 0 10px 0 0; }
.bread.menu li { font-size: 15px; }
/*article page*/
#article { color: #fff; }
.article-lead { font-weight: bold; }
.article-text img { max-width: 100%; height: auto; }
/*related gallery*/
.related-gallery .thumb { width: 30%; float: left; }
.related-gallery .thumb { margin: 0 0 2%; }
.related-gallery .thumb img { position: relative; }
.related-gallery .thumb:hover img { transform: scale(1.1, 1.1); }
.gutter-sizer { width: 2%; }
/*row*/
.row { position: relative; }
.col { display: inline-block; }
.col img { max-width: 100%; height: auto; }
.middle .col { vertical-align: middle; }
#vote .neat-ribbon { margin-top: -70px; position: relative; z-index: 3; }
/*--------------------------------------footer*/
#footer { color: #a4a3a2; padding: 1% 0; }
#footer a { color: #a4a3a2; }
#footer .left.menu li { margin: 0 10px 0 0; }
#footer .right.menu li { margin: 0 0 0 10px; }
#tamogatok img { margin: 0 10px 0 0; }
#tamogatok .cycle-arrow { top:10px; margin-top: 0; width: auto; height: auto; cursor: pointer; transition: all ease-out .2s; font-size:20px; }
#tamogatok .cycle-arrow.prev { left:-20px; }
#tamogatok .cycle-arrow.next { right:-20px; }
/*text styles*/
.text p { margin: 10px 0 0; text-align: justify; }
.text h1 { font-size: 500%; margin: 10vh 0 5vh; }
.text h2 { font-size: 350%; margin: 7vh 0 4vh; }
.text h3 { font-size: 180%; margin: 6vh 0 3vh; }
.text h4 { font-size: 130%; margin: 5vh 0 2vh; }
.text h5 { font-size: 100%; margin: 5vh 0 2vh; }
.text h6 { font-size: 15px; margin: 3vh 0 2vh; }
.text a { color: #d3d3d3; }
.text ul { padding: 0; }
.text li { margin: 2vh 0 0vh; }
.text .date { margin: 0; padding: 0; }
.text table h1 { font-size: 200%; margin: 10px 0 20px; }
.text table p { font-size: 100%; margin: 5px 0; }
/*unique styles*/
#column94259 td { vertical-align: top; padding: 2%; border-left: 1px solid rgba(255,255,255,.22); border-top: 1px solid rgba(255,255,255,.22); }
#column94259 table { border-right: 1px solid rgba(255,255,255,.22); }
#column94259 .text img { width: 320px; height: auto; }
/*column styles*/
.w10 { width: 10%; }
.w15 { width: 15%; }
.w20 { width: 20%; }
.w25 { width: 25%; }
.w32 { width: 32%; }
.w40 { width: 40%; }
.w42 { width: 42%; }
.w48 { width: 48%; }
.w64 { width: 64%; }
.w75 { width: 73%; }
.w80 { width: 78%; }
/*buttons*/
.button { text-transform: uppercase; font-size: 120%; font-weight: 400; }
.button a, input.button { display: inline-block; padding: 0 2%; border: none; line-height: 300%; background: url(art2015/button.png) repeat-x center; background-size: contain; position: relative; transition: all ease-out .2s; }
.button.blue a { background-color: #74d8f0; }
.mini-button a { display:inline-block; line-height:200%; background-color:#75d9f4; color:#fff; padding:0 10px; }
.mini-button a:hover { background-color:#30c1e5; }
/*popup*/
.popup { display: none; position: fixed; width: 40%; left: 25%; top: 117px; padding: 20px 5%; background-color: #fff; z-index: 999; box-shadow: 0 20px 100px rgba(0,0,0,.5); }
.popup .field { background-color: #fff; }
.popup .button { background-color: #fff; }
.popup-pict { text-align:center; }
#popupCartItemAdded { display:block; position: fixed; width:100%; max-width:640px; left:50%; transform:translateX(-50%); top: 100px; padding:50px 0; background-color: #fff; z-index: 999; box-shadow: 0 20px 100px rgba(0,0,0,.5); }
#popupCartItemAdded span { position:absolute; top:0; right:0; color:#0096d7; font-size:26px; width:50px; height:43px; padding-top:7px; text-align:center; border-radius:50%; font-weight:700; cursor:pointer; }
.popup-pict a { display:block; }
.popup-pict img  { max-width:100%; height:auto; }
/*---------------------------------extra*/
/*gradients*/
.grad-grey { background: #f3f2f1; /* For browsers that do not support gradients */ background: -webkit-linear-gradient(#f9f8f7, #ecebea); /* For Safari 5.1 to 6.0 */ background: -o-linear-gradient(#f9f8f7, #ecebea); /* For Opera 11.1 to 12.0 */ background: -moz-linear-gradient(#f9f8f7, #ecebea); /* For Firefox 3.6 to 15 */ background: linear-gradient(#f9f8f7, #ecebea); /* Standard syntax */ text-shadow: 1px 1px 0 rgba(255,255,255,.5); }
.grad-faderight { background: rgba(0,0,0,.1); /* For browsers that do not support gradients */ background: -webkit-linear-gradient(left, rgba(0,0,0,.3), rgba(0,0,0,0)); /* For Safari 5.1 to 6.0 */ background: -o-linear-gradient(right, rgba(0,0,0,.3), rgba(0,0,0,0)); /* For Opera 11.1 to 12.0 */ background: -moz-linear-gradient(right, rgba(0,0,0,.3), rgba(0,0,0,0)); /* For Firefox 3.6 to 15 */ background: linear-gradient(to right, rgba(0,0,0,.3), rgba(0,0,0,0)); /* Standard syntax */ }
/*...common classes*/
img { border: none; vertical-align: middle; }
table { text-align: left; }
hr { height: 1px; margin: 2% 0; border: none; box-shadow: 0 1px 0 rgba(0,0,0,.1), 0 2px 0 rgba(255,255,255,.5); }
a { color: #fff; text-decoration: none; transition: all ease-out .2s; }
a:active { opacity: .9; }
a.more { color: #fff; text-transform: uppercase; display: inline-block; padding: 1% 0; }
a.ghost { background: #fff; position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; filter: alpha(opacity=0); z-index: 99; }
h1, h2, h3, h4, h5, h6, p, ul, ol, li { margin: 0; padding: 0; list-style: none; }
p { }
i { }
.ico { background-repeat: no-repeat; background-position: center; border-radius: 50%; }
.clear { clear: both; }
.left { float: left; }
.right { float: right; }
#header .menu { margin:10px 0 0 0; }
#header .right .menu { margin:10px 0 0 0; float:right; clear:both; }
.menu ul { font-size: 0; width:100%; }
.menu li { display: inline-block; font-size: 12px; }
ul.floatliLeft li, .menuFloatLeft li { float: left; }
ul.floatliRight li, .menuFloatRight li { float: right; }
.centered { text-align: center; }
.menu.centered ul { text-align: center; }
.menu.centered ul li { display: inline-block; vertical-align: top; }
.hide { display: none; }
.spacer { padding: 0 5px; }
.field { background-color: #f2f2f2; border: 1px solid rgba(0,0,0,.22); padding: 13px 20px 14px; color: #9a9a9a; font-weight: bold; font-size: 18px; }
input.button { cursor: pointer; }
input:focus, select:focus { outline: none; }
table { border-spacing: 0; }
.sticky-wrapper { height:auto !important; }
.tippmix { margin-top:0; width:75%; float:right; }
.tippmix img { max-width:100%; height:auto; }
#history-badges { position:absolute; top:-22px; left:50%; transform:translateX(-50%); }
#Stage { max-width:100% !important; }
.cookieMessage {position: fixed; bottom:0; left: 0; width: 100%; box-sizing: border-box; z-index: 9999!important; padding:10px .25rem!important;}
.cookieMessage a, .cookieMessage .cookieButton {color:#0096d7;}
.insta { text-align:center; text-transform:uppercase; }
.insta a { color:#74d8f1; }
.insta a:hover { color:#fff; }
.tovabbi { text-align:center; font-size:18px; }
.tav { margin-bottom:10%; }
.swiper-container .swiper-slide { text-align:center; }
#lapozo2 { margin-bottom: 20px; text-align: center; }
.banner img { max-width: 100%; height: auto !important; }

/*RESPONSIVE*/
@media screen and (max-width: 1080px) {
.wrapper { width: 98%; }
/*header*/
#site-title { padding-left: 50px; }
#site-title h1 { font-size: 120%; }
#site-title h1 span { letter-spacing: 0; }
/*slider*/
#slider-featured { width: 100%; margin: 5% auto; }
.cycle-arrow { display: none; }
.slide .lead { padding: 2% 2% 10%; }
}

@media screen and (max-width: 980px) {
/*header*/
#header { padding: 40px 0 40px; }
#brand { bottom: -68px; }
#site-title { }
#site-title h1 { font-size: 100%; }
#history-badges { display: none; }
.tippmix { margin-top:0; }
}

@media screen and (max-width: 760px) {
/*header*/
#site-title { display: none; }
/*slider*/
#slider-featured .slide { height: 320px; }
/*popups*/
.popup { width: 100%; left: 0; }
/*columns*/
.column.left, .column.right { float: none; width: 100%; }
/*ribbons*/
.ribbon { margin: 10% 0 5%; text-transform: uppercase; }
.ribbon div { height: auto; }
.ribbon .c1 { width: 45%; background-image: none; background-color: #f2f1f0; }
.ribbon .c2 { width: 10%; height: auto; top: 0; background-image: none; background-color: #ff5b00; transform: scale(1.3, 1.3); }
.ribbon .c3 { width: 45%; background-image: none; background-color: #f2f1f0; }
.ribbon .c2 p { padding-top: 10%; color: #fff; }
.ribbon h2 { font-size: 100%; text-shadow: none; padding: 10% 5%; }
/*font sizes*/
body { font-size: 13px; }
.tippmix { margin:0 0 0 auto; width:38%; }
#header .right { margin-top:-30px; padding-bottom:90px; }
}

@media screen and (max-width: 540px) {
}

@media screen and (max-width: 480px) {
/*slider*/
#slider-featured .slide { height: 240px; }
/*leads*/
.leads .lead-thumb { max-width: 30%; }
.leads .lead-excerpt { max-width: 70%; }
/*article*/
.bread.menu li { font-size: 11px; }
#brand { bottom:-74px; transform:scale(.9); }
.tippmix { width:50%; }
}
/*RESPONSIVE MENU */
#responsive-menu-sticky-wrapper { position: absolute; }
#responsive-menu { display: none; position: fixed; top: 0; left: 0; z-index: 9999; }
#responsive-menu ul { display: block; width: 30px; padding: 5px; background-color: #000e42; }
#responsive-menu ul li { width: 100%; height: 4px; margin: 4px 0; background-color: rgba(255,255,255,1); }
.is-sticky #responsive-menu { top: 0; }

@media screen and (max-width: 1080px) {
#responsive-menu { display: block; }
#menu-top-render { display: none; width: 100%; max-height: 90%; position: fixed; top: 0; left: 0; z-index: 9998; background-color: #000e42; overflow: scroll; box-shadow: 0 200px 0 300px rgba(0,0,0,.5); padding: 5% 0; }
#menu-top-render li { display: block; margin: 0; }
#menu-top-render a { color: #fff; }
#menu-top-render .current a { box-shadow: none; background-color: rgba(0,0,0,.5); }
#menu-top li ul { position: relative; left: auto; top: 0; width: 100%; height: auto; opacity: 1; background-color: rgba(0,0,0,.5); }
#menu-top li:hover ul { height: auto; opacity: 1; top: 0; }
#menu-top li ul li { display: block; text-align: center; padding: 1% 0; }
#menu-top li ul li a { line-height: 100%; box-shadow: 0 1px 0 rgba(255,255,255,0); color: #0096d7; }
#menu-top li.current ul li a { color: #0096d7; }
#menu-top li.current ul li a:hover { color: #fff; }
}

/*----------------------------leftovers----------------------*/
/*div {
	outline:1px solid #000;
}*/