/*WebMark CSS*/

/*FONTS*/
/*@font-face { font-family: Open Sans; src: url('OpenSans-Regular.ttf'); }
@font-face { font-family: Open Sans; font-weight: bold; src: url('OpenSans-Semibold.ttf'); }
@font-face { font-family: Open Sans; font-weight: bold; src: url('OpenSans-Bold.ttf'); }
@font-face { font-family: Open Sans Extrabold; font-weight: bold; src: url('OpenSans-ExtraBold.ttf'); }
@font-face { font-family: Open Sans; font-style: italic; src: url('OpenSans-Italic.ttf'); }
@font-face { font-family: Open Sans; font-weight: bold; font-style: italic; src: url('OpenSans-SemiboldItalic.ttf'); }*/
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,700&subset=latin-ext,latin);
/*---------------------------------------------HTML-BODY*/
html { background: #e8e8e8; }
body { background: #e8e8e8; min-height: 566px; margin: 0px; padding: 0px; border: none; text-align: left; font: normal 13px 'Open Sans', Arial, sans-serif; color: #000; }
img { border: none; vertical-align: middle; }
table { text-align: left; }
hr { height: 5px; border: 1px solid #737276; background: #737276; margin: 2px 0; }
.clear { clear: both; }
.left { float: left; }
.right { float: right; }
a { color: #ff3c00; text-decoration: none; }
h1, h2, h3, h4, h5, h6, p, ul, ol, li { margin: 0; padding: 0; list-style: none; }
.b-bottom { border-bottom: 1px solid #373737; padding: 10px 0; margin: 0 0 10px; }
/*---------------------------------------------wrapper*/
.wrapper { width: 1000px; margin: 0 auto; position: relative; }
/*---------------------------------------------title*/
#title { background: #ff6608 url(/art/title-bg-repeat.png) repeat-x top; padding: 13px 0; font-size: 12px; color: #fff; }
#title a { color: #ffe684; margin: 0 5px; }
/*---------------------------------------------header*/
#header { height: 126px; background: url(/art/header-bg-repeat.gif); }
/*logo*/
#header .logo { position: absolute; left: 22px; top: 22px; }
/*search*/
#header .search { position: absolute; right: 22px; top: 52px; color: #ff8910; }
#header .search .field { width: 256px; border: none; background: none; color: #ff8910; border-bottom: 1px solid #585858; padding: 4px; }
#header .search .button { width: 25px; height: 21px; background: url(/art/magnif.png); border: none; cursor: pointer; }
/*----------------------------------------------slider*/
.slider-area.home { background: url(/art/slider-bg-repeat.png) repeat-x top #e8e8e8; }
.slider-area .wrapper { width: 960px; height: 400px; position: relative; overflow: hidden; background-color: #f6f6f6; }
.slider-area.home .wrapper { background: url(/art/slider-wrapper-bg-repeat.png) repeat-x top; }
#slider-featured { width: 920px; height: 360px; background: #000; color: #fff; position: relative; top: 20px; left: 20px; z-index: 1; }
#slider-featured .slide { width: 920px; height: 360px; z-index: 2; }
#slider-featured .slide .slide-bg { width: 918px; height: 358px; position: absolute; top: 0; left: 0; overflow: hidden; border: 1px solid #000; z-index: 3; }
#slider-featured .slide .slide-bg img { opacity: .4; filter: alpha(opacity=40); }
#slider-featured .slide .thumb { width: 420px; max-height: 320px; border: 10px solid #000; position: absolute; top: 10px; left: 25px; overflow: hidden; z-index: 200; }
#slider-featured .slide .thumb:hover { border: 10px solid #fff; outline: 1px solid #636363; }
#slider-featured .slide .description { width: 390px; position: absolute; right: 0; top: 30%; background: #ff770a; padding: 10px; z-index: 400; }
#slider-featured .slide .description .corner { display: none; position: absolute; bottom: -14px; right: 0; }
#slider-featured .slide .description .arrow { position: absolute; top: 50%; left: -15px; margin: -15px 0 0; }
#slider-featured .slide .description h1 { font-family: 'Open Sans' Extrabold, "Arial Black", Gadget, sans-serif; }
#slider-featured .slide .description h2 { margin: 0; padding: 0; }
#slider-featured .slide .description p { color: #2e2e2e; font-size: 13px; position: relative; left: 10px; }
#slider-featured .slide .description a { color: #fff; }
#slider-featured .slide .description a:hover { color: #fff; }
/*nav*/
#content .slider-controls.inner { background: url(/art/menu-border.gif) repeat-x top; padding: 15px 0 0; margin: 15px 0 0; }
#nav-featured a { font-size: 1px; padding: 10px; margin: 0 2px; background: url(/art/slider-nav-bg.png) no-repeat center; color: #fff; }
#nav-featured a.activeSlide { background: url(/art/slider-nav-bg-active.png) no-repeat center; color: #fe6f09; }
#next-featured, #prev-featured { cursor: pointer; }
#nav-test a { font-size: 1px; padding: 10px; margin: 0 2px; background: url(/art/slider-nav-bg.png) no-repeat center; color: #fff; }
#nav-test a.activeSlide { background: url(/art/slider-nav-bg-active.png) no-repeat center; color: #fe6f09; }
#next-test, #prev-featured { cursor: pointer; }
/*----------------------------------------------content*/
#content { background: url(/art/body-bg.png) no-repeat right top; }
/*menu*/
#menu { background: url(/art/menu-border.gif) repeat-x top; font-size: 17px; margin: 12px 0; text-align: center; text-transform: lowercase; }
#menu ul { background: url(/art/menu-border.gif) repeat-x bottom; padding: 15px 0; }
#menu ul li { display: inline; padding: 0 7px; }
#menu ul li.active { border-bottom: 5px solid #ff770a; background: none; padding-bottom: 12px; }
#menu a, #menu a:visited { color: #747474; padding: 3px; }
#menu a:hover { color: #ff4e00; }
#menu ul li.active a { color: #ff4e00; font-weight: bold; }
/*menu-sidebar*/
#menu-sidebar { font-size: 19px; }
#menu-sidebar a { display: block; color: #fff; padding: 6px; position: relative; left: 10px; }
#menu-sidebar ul li { width: 296px; height: 56px; background: url(/art/menu-sidebar-bg-green.png) no-repeat right top; position: relative; left: 2px; margin-bottom: -10px; }
#menu-sidebar ul li.active { background: url(/art/menu-sidebar-bg-orange.png) no-repeat right top; font-family: 'Open Sans' Extrabold, "Arial Black", Gadget, sans-serif; }
#menu-sidebar ul li:hover a { left: 15px; }
/*----------------------------------------------itw-content*/
#itw-content { width: 984px; margin: 0 auto; padding: 5px 0; }
#itw-content .column-title { font-size: 22px; color: #606060; text-shadow: -1px -1px 0 #fff; padding: 5px; }
#itw-content .column-title a { color: #606060; }
#itw-content .column-title strong { color: #ff4e00; }
/*box*/
#itw-content .box { width: 300px; margin: 0px 5px; }
#itw-content .box-content { position: relative; }
#itw-content .box-content h1 { font-size: 21px; font-weight: normal; line-height: 25px; color: #ff4e00; }
#itw-content .box.fadeBg.left .box-content h1, #itw-content .box.fadeBg.left .box-content p { padding-left: 44px; }
#itw-content .box-content h2 { font-size: 15px; font-weight: normal; line-height: 17px; color: #ff4e00; }
#itw-content .box-content small { font-size: 12px; color: #747474; }
#itw-content .box-content p { padding: 5px 0 0; }
#itw-content .article-push { width: 30%; float: left; background: url(/art/article-push-bg.png) no-repeat right top; padding-left: 3%; }
#itw-content .article-push h1 { font-size: 22px; font-weight: normal; color: #ff3c00; }
#itw-content .article-push p { padding-right: 15px; margin: 10px 0; color: #535353; }
/*more*/
#itw-content .box-content .more a, #itw-content .text .more a, #content .more a { width: 120px; display: block; background: #606060; padding: 5px 16px; margin: 10px 0 0; color: #fff; position: relative; text-transform: uppercase; }
#itw-content .box-content .more.long a, #itw-content .text .more.long a { width: 200px; }
#itw-content .box-content .more.long a:hover, #itw-content .text .more.long a:hover { width: 190px; }
#itw-content .box-content .more a:hover, #itw-content .text .more a:hover, #content .more a:hover { width: 100px; background: #ff4e00; padding-left: 20px; text-shadow: 1px 1px 0 rgba(0,0,0,0.4); }
#itw-content .box-content .more span, #itw-content .text .more span, #content .more span { width: 6px; height: 12px; background: url(/art/more-arrow.png); position: absolute; left: 0; top: 50%; margin: -6px 0 0 0; z-index: 0; }
/*related*/
#itw-content .text .related-stuff ul { padding: 5px; color: #666; }
#itw-content .text .related-stuff ul li { list-style: outside square; }
/*share-article*/
#itw-content .text .share-article { padding: 10px 0; }
/*more rovat*/
#itw-content .box-content .more.rovat { display: block; background: #606060; padding: 5px 16px; margin: 10px 10px 0 0; color: #fff; position: relative; }
#itw-content .box-content .more.rovat a { display: inline; background: none; padding: 0; margin: 0; color: #fff; }
#itw-content .box-content .more.rovat p { padding: 0; margin: 0; }
#itw-content .box-content .more.rovat.green { background: #acacac; }
#itw-content .box-content .more.rovat.orange { background: #ff770a; }
/*calendar*/
#itw-content .box-content .calendar { width: 56px; background: #ff770a; text-align: center; position: absolute; top: 15px; left: -8px; z-index: 333; color: #fff; text-shadow: 1px 1px 1px rgba(0,0,0,0.4); padding: 6px 0 2px; font-family: 'Open Sans' Extrabold, "Arial Black", Gadget, sans-serif; line-height: 28px; font-size: 11px; }
#itw-content .box-content .calendar strong { font-size: 29px; }
#itw-content .box-content .calendar span { width: 16px; height: 16px; background: url(/art/calendar-corner-orange.png); position: absolute; bottom: -16px; left: -1px; }
#itw-content .box-content .calendar.green { background: #b6c725; }
#itw-content .box-content .calendar.blue { background: #648eb2; }
#itw-content .box-content .calendar.reverse span { background-image: url(/art/calendar-corner-orange-reverse.png); left: 41px; }
#itw-content .box-content .calendar.green span { background-image: url(/art/calendar-corner-green.png); left: 41px; }
#itw-content .box-content .calendar.blue span { background-image: url(/art/calendar-corner-blue.png); left: 41px; }
#itw-content .sidebar .box-content .calendar { left: 242px; top: 0; }
/*box-bg*/
#itw-content .box.fadeBg .top, #itw-content .box.fadeBg .bottom { height: 7px; background-position: left; background-repeat: no-repeat; }
#itw-content .box.sidebar .top, #itw-content .box.sidebar .bottom { height: 7px; background-repeat: no-repeat; background-position: right; }
#itw-content .box.fadeBg .top { background-image: url(/art/box-bg-top.png); }
#itw-content .box.fadeBg .bottom { background-image: url(/art/box-bg-bottom.png); }
#itw-content .box.fadeBg .middle { background: url(/art/box-bg-middle.png) repeat-y left; padding: 10px 10px 15px 20px; /*56*/ }
#itw-content .box.sidebar .top { background-image: url(/art/box-bg-top-reverse.png); }
#itw-content .box.sidebar .bottom { background-image: url(/art/box-bg-bottom-reverse.png); }
#itw-content .box.sidebar .middle { background: url(/art/box-bg-middle-reverse.png) repeat-y right; padding: 15px 40px 15px 10px; }
#itw-content .box-content .middle { padding: 17px; position: relative; }
#itw-content .box-content .lead { padding: 0 10px 12px 0; position: relative; }
#itw-content .sidebar.right .lead { min-height: 75px; }
/*lead box*/
#itw-content .box.lead { width: 600px; min-height: 100px; margin: 0px 5px; }
/*portfolio lead box*/
#itw-content .box.portfolio { width: 440px; min-height: 100px; margin: 0 30px 22px 0; padding: 0 0 10px; color: #505050; border-bottom: 2px dotted #cecece; }
#itw-content .box.portfolio h1 { padding: 0; margin: 0; }
#itw-content .box.portfolio .thumb { width: 420px; height: 420px; border: 10px solid #fcfcfc; position: relative; overflow: hidden; margin: 5px 0 0; }
#itw-content .box.portfolio .box-content .middle { padding: 0; }
/*left-col*/
#itw-content .left-col { width: 610px; }
/*left-col rovat*/
#itw-content .left-col.rovat { width: 980px; }
/*left-col nyitolap*/
#itw-content .left-col.nyitolap { width: 650px; }
#itw-content .column-content { background: url(/art/left-col-bg.png) no-repeat 0 0; min-height: 333px; padding: 18px 0 0 25px; }
/*text*/
#itw-content .text h1, #itw-content .text h2, #itw-content .text h3 { padding: 10px 0; }
#itw-content .text h4, #itw-content .text h5, #itw-content .text h6 { padding: 6px 0; }
#itw-content .text p { padding: 5px 0; line-height: 20px; color:#666666; }
#itw-content .text ul li { list-style: outside disc; margin-left: 22px; line-height: 20px; color:#666666; }
#itw-content .text .article-title h2 { font: normal 23px/26px 'Open Sans', Arial, Helvetica, sans-serif; /*color: #ff4e00;*/ color:#777; }
#itw-content .text .thumb-cikk { text-align: center; }
#itw-content .text .thumb-cikk img { max-width: 420px; border: 10px solid #fff; margin: 10px 0 33px; box-shadow: 0 3px 30px rgba(0,0,0,0.15); -webkit-box-shadow: 0 3px 30px rgba(0,0,0,0.15); -o-box-shadow: 0 3px 30px rgba(0,0,0,0.15); }
/*----------------------------------------------footer*/
#footer { width: 920px; margin: 20px auto 0; padding: 20px; padding-bottom: 0; color: #777777; background: #fff; }
#footer .wrapper { width: 900px; background: url(/art/header-bg-repeat.gif); padding: 10px; }
#footer .content { background: url(/art/double-trouble.gif) repeat-x bottom; }
/*menu*/
#footer .menu ul { margin: 5px 0 0 5px; }
#footer .menu h4 { font-size: 15px; }
#footer .menu a { color: #777777; padding: 2px; }
#footer .menu a:hover { color: #fff; }
#footer .copy { color: #ff770a; }
#footer .copy a { color: #fff; }
/*totop*/
.totop { background: #f7f7f7; position: fixed; bottom: -5px; right: 2%; z-index: 2000; }
.totop img { padding: 10px 20px; }
.totop:hover { bottom: 0px; }
/*fb*/
.fb { padding: 22px 0; }
.kapcsgal.thumbs img { height: 66px; padding: 2px; background: #fff; border: 1px solid #dedede; box-shadow: 0 0 0 rgba(0,0,0,0.1); }
.kapcsgal.thumbs img:hover { position: relative; top: -2px; left: -2px; border: 1px solid #cdcdcd; box-shadow: 2px 2px 0 rgba(0,0,0,0.1); }
.kapcsgal img { margin: 3px; }
.recommend { margin: 16px; }
.integrations { margin: 4px; text-align: center; }
.integrations img { padding: 10px; }
.box.flex { display: flex; flex-wrap: wrap; position: relative; margin-bottom: 10px; padding: 6px; }
.box.flex > a { position:absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 2; }
.box.flex > a:hover { background-color: rgba(0,0,0,.1); }
.box.flex > .pict { width: auto; padding-right: 15px; }
.box.flex > .pict:empty { display: none; }
.box.flex .title { color: #ff3c00; font-size: 21px; line-height: 25px; padding-bottom: 12px; }
.box.flex .lead {}
.gallery-wrapper .grid-item { padding: 2px; box-sizing: border-box; }
.gallery-wrapper .grid-item a { display: block; }
.gallery-wrapper .grid-item img { width: 100%; height: auto !important; }
.col-sm-4 { -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%; position: relative; width: 100%; padding-right: 5px; padding-left: 5px; box-sizing: border-box; }

/*WebMark Europe goes RESPONSIVE*/

@media screen and (max-width: 1020px) {
	.wrapper { width:98%; }
	/*slider*/
	.slider-area .wrapper { width:98%; margin:0 auto; }
	#slider-featured { width:auto; left:0; }
	/*content*/
	#itw-content { width:98%; }
	#itw-content .left-col, #itw-content .left-col.rovat, #itw-content .left-col.nyitolap { width:68%; }
	#itw-content .right-col { width:28%; }
	#itw-content img { max-width:100%; height:auto!important; }
	.fb { position:relative; overflow:hidden; }
	/*dobozok*/
	#itw-content .box { width:98%; float:none; margin:0 auto; }
	#itw-content .box.sidebar .middle { padding:10px 0; }
	#itw-content .sidebar .box-content .calendar { left:auto; right:-8px; }
	/*footer*/
	#footer, #footer .wrapper { width:98%; padding:10px 1%; }
}
@media screen and (max-width: 768px) {
	/*header*/
	#header .search .field { width:88px; }
	/*content*/
	#itw-content .left-col, #itw-content .left-col.rovat, #itw-content .left-col.nyitolap { width:98%; float:none; }
	#itw-content .right-col { width:98%; float:none;  }
	/*slider nl home*/
	#slider-test { height:auto; }
	#slider-test .recommend { margin:0; width:90%; padding:2%; }
}
@media screen and (max-width: 640px) {
	/*header*/
	#title strong { display:none; }
	#title td:first-child { display:none; }
	#title td:nth-child(2) { display:block; width:100%; text-align:center; }
	#header { height:auto; padding:5% 0; }
	#header .search, #header .logo { display:block; position:relative; padding:2% 0; text-align:center; }
	#header .search { top:0; right:0; }
	#header .search .field { width:240px; } 
	#header .logo { left:0; top:0; }
	#header .logo img { width:90%; height:auto; }
	/*slider*/
	.slider-area .wrapper { height:auto; } 
	#slider-featured { height:290px; top:0; }
	#slider-featured .slide { width:100%; height:100%; }
	#slider-featured .slide .thumb { width:80%; position:relative; left:0; margin:0 auto; }
	#slider-featured .slide .thumb img { width:100%; height:auto; }
	#slider-featured .slide .description { top:auto; bottom:0; width:50%; }
	#slider-featured .slide .description h1 { font-size:16px; }
	#slider-featured .slide .description h2 { font-size:13px; }
	#nav-featured { display:none; }
	/*content*/
	#itw-content .text .thumb-cikk img { max-width:100%; }
	#itw-content .article-push { width:auto; display:block; float:none; }
	/*footer*/
	#footer table.menu td { display:block; text-align:center; }
	/*responsive menu*/
	#menu-toggle { width:30px; height:25px; margin:0; padding:5px; position:fixed; z-index:999; background-color:#ff6608; }
	#menu-toggle li { height:5px; background-color:#fff; padding:0; margin:0 0 5px; }
	#menu { display:none; width:100%; height:auto; background:#333; position:fixed; top:35px; left:0; z-index:999; margin:0; }
	#menu ul { background:none;  }
	#menu ul li { display:block; }
	#menu a, #menu a:visited { color:#fff; }
	#menu ul li.active { border:none; }
}
@media screen and (max-width: 575px) {
.col-sm-4 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; position: relative; width: 100%; padding-right: 5px; padding-left: 5px; }
}
@media screen and (max-width: 320px) {
    #itw-content .box.portfolio {
        width: 100%;
    }

    #itw-content .box.portfolio .thumb {
        width: 85%;
        height: auto;
    }
}

@media screen and (max-width: 480px) {
    #itw-content .box.portfolio .thumb {
        width: 95%;
        height: auto;
    }
}
