@charset "UTF-8";

@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,700,400italic,300italic,700italic&subset=latin,latin-ext);

@media screen {
/* ========================================= 
@UNIVERSAL NORMALIZES
========================================= */
header, nav, section, article, aside, footer, hgroup { display: block; margin: 0; padding: 0; font-size: 100%; font-weight: normal; line-height: 1.25em; }
body, div, dl, dd, ol, ul, li, h1, h2, h3, h4, h5, h6, p, cite, blockquote, pre, form, fieldset, input, textarea, select, table, th, td { margin: 0; padding: 0; font-size: 100%; font-weight: normal; line-height: 1.25em; }
h1, h2, h3, h4, h5, h6, p, li { cursor: default; }
ol, ul { list-style-type: none; }
a, embed, object, .button { outline-style: none; outline-width: 0; }
a, a:hover { text-decoration: none; cursor: pointer; transition: all 0.5s ease;}
hr	{ clear: both; display: block; height: 1px; border: none; }
fieldset, img { border: 0; }
mark { background: none; }
input, textarea, select { background-color: #f2f2f2; border: 1px solid #CCC; padding: 4px;  box-sizing:border-box; -moz-box-sizing: border-box; color:#666; transition: all 0.5s ease;}
input:hover, textarea:hover,
input:active, textarea:active,
input:focus, textarea:focus { background: #FFF; color:#000; }
input.button, input.submit, .button input { border: none; background: none; cursor: pointer; }

.error { background-color:#F00; color:#FFF;}

*::before, *::after { box-sizing: border-box; }
.left { float:left; display:inline;}
.right { float:right; display:inline;}
.clear { clear: both; height: 0; font-size: 0; line-height: 0; }
.center { text-align:center;}

/* BASIC FONT */
body, body * { font-family: 'Roboto', sans-serif; font-weight:300;}
h1, h2, h3, h4, h5 { font-weight: normal; }

/* @BASIC SIZE	*/
html { text-align: center; width: 100%; }
body { background:#c3d7da url(/images/hatter.png) center top no-repeat; background-size:cover; margin: 0 auto; width: 100%; line-height: 1.25em;  text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
body > iframe {display:none}
.holder {position: relative; overflow:hidden;}
.container { position:relative; margin:0 auto; box-sizing:border-box; max-width: 1040px; }

/* @HEADER */
header { position:relative; z-index:2; min-height: 340px;}
header .container { z-index:1;}
header .container .logo {float:right; margin: 170px 10px 0 0; }
header .container .logo img {width: 100%; margin-left: 13px;}
header .szog { position:absolute; top:-110px; right:185px; background-color:#6eb7be; border: 50px solid #00a2a9; width: 120px; height:120px; -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg) ; transform: rotate(-45deg); z-index:2;}

@media all and (max-width: 620px) {
	header .container .logo { width: 286px; }
}
@media all and (max-width: 550px) {
	header .container .logo.engedelyezettkepzesek { margin-top: 360px; }
	header .container .logo:not(.engedelyezettkepzesek) { margin-top: 265px; }
}
@media all and (max-width: 480px) {
	/* header .container .logo { width: 286px; } */
}
@media all and (max-width: 340px) {
	header .container .logo:not(.engedelyezettkepzesek) { margin-top: 235px; }
}

.lang {position: absolute; right: 10px; top: 50px;}
.lang a {background-color:rgba(0,0,0,0.3); display:block; width:30px; height:30px; border-radius:50%; color:#FFF; text-align:center; padding-top: 5px;
box-sizing: border-box; font-size: 0.75em; margin-bottom: 5px;}
.lang a.active, .lang a:hover { background-color:#00a2a9;}


/* @NAV */
.nav_controler { display:none;}
nav {width:100%; background-color: rgba(0,0,0,1); overflow:hidden; position: fixed; z-index:8;}
#mainnav { width:100%; padding:10px 0; }
#mainnav li {display:inline-block; text-transform:uppercase; margin:0 5px; }
#mainnav li a { color:rgba(255,255,255,0.8); white-space:nowrap; font-family: 'Ubuntu', sans-serif; font-size:1em; font-weight:700; line-height:1.25em; transition: all 0.5s ease;}
#mainnav li a:hover, #mainnav li.selected a:hover { color:#FFF;}

/* @CONTENT */
.content { clear:both; z-index:1; position: relative; box-sizing: border-box; -moz-box-sizing:border-box; }
.content .container { text-align:left; max-width:1040px; transition: all 0.5s ease;}
.content a { color:#00A2A9; transition: all 0.5s ease; }
.content a:hover { color: #333; }

.textcontent { padding:30px; color: #000; min-height:550px; border-bottom-left-radius:10px; font-size: 1em; line-height:1.25em;}
.textcontent h1, .textcontent h2, .textcontent h3, .textcontent h4, .textcontent h5, .textcontent h6 { color:#333; font-weight:300; line-height:1.125em; }
.textcontent p, .textcontent ul, .textcontent ol { margin: 15px 0px; text-align: justify;}
.textcontent h1 { font-size: 3em; margin: 10px 0 10px 0; text-align:center; text-transform:uppercase;}
.textcontent h2 { font-size: 2em; margin: 10px 0px;}
.textcontent h3 { font-size: 1.75em; margin: 10px 0px;}
.textcontent h4 { font-size: 1.5em; margin: 10px 0px;}
.textcontent h5 { font-size: 1.25em; margin: 10px 0px;}
.textcontent h6 { font-size: 1.125em; margin: 10px 0px;}
.textcontent ul { list-style:square; list-style-position:inside;}
.textcontent form ul { list-style-type:none;}
.textcontent form input[type="checkbox"], .textcontent form input[type="submit"] { width: auto;}
.textcontent form input[type="submit"], .textcontent form input[type="button"] { cursor: pointer; background-color: #00A2A9; color: white; padding: 5px 15px; border-radius: 3px;}
.textcontent ul li { padding: 2px 0 2px 20px; }
.textcontent ol li { padding: 2px 0 2px 0; list-style-type: decimal; list-style-position: outside; margin: 0 0 0 20px;}
.textcontent ol ol, .textcontent ul ul {font-size:1em;}
.textcontent h1 a, .textcontent h2 a, .textcontent h3 a, .textcontent h4 a, .textcontent h5 a { color: inherit; text-decoration: none; }
.textcontent img { display:inline-block; max-width:100%; }
.textcontent b, .textcontent strong { font-weight:400;}
.textcontent .emphasized {color:#00A2A9;}
.highlight {background-color:#00a2a9; color:#FFF !important; padding:20px;}
span.highlight {background-color:transparent; color:inherit !important; padding:0px; font-weight: 400;}
.textcontent div.fellow-worker {
	clear: both;
	float: left;
	text-align: center;
	margin-top: 30px;
	width: 100%;
}
.textcontent div.fellow-worker > img {
	max-width: 200px;
	width: 30%;
	float: left;
	margin-top: 15px;
	margin-right: 30px;
	margin-bottom: 30px;
	border: #00a2a9 double;
}
.textcontent div.fellow-worker > h4 {
	margin-bottom: 25px;
	margin-top: 15px;
}
.col3 {width: 15%;float: left;text-align: center;padding: 4%;font-size: 80%;}
.col3 img {opacity: 0.7;}

.two-col {
	-webkit-column-count: 2; /* Chrome, Safari, Opera */
	-moz-column-count: 2; /* Firefox */
	column-count: 2;
	-webkit-column-gap:20px; /* Chrome, Safari, Opera */
	-moz-column-gap: 20px; /* Firefox */
	column-gap: 20px;
}

.col2 {
	width: 46%;float: left;padding: 4%;
}
@media all and (max-width: 768px) {
	.col2 {
		width: 100%;float: left;padding-left: 0 !important;
	}
}
@media all and (max-width: 640px) {
	.textcontent div.fellow-worker > img {
		max-width: 100%;
		width: 200px;
		float: none;
		margin-top: 30px;
		margin-right: 0;
		margin-bottom: 0px;
	}
}


label {
	font-size: 13px;
}
label.checkbox {
    display: inline-block;
    cursor: pointer;
    position: relative;
    padding-left: 25px;
    margin-right: 5px;
    font-size: 13px;
}
label.checkbox::before {
    content: "";
    display: inline-block;
    width: 21px;
    height: 21px;
    margin-right: 10px;
    position: absolute;
    left: 0;
    top: 1px;
    background-color: lightgray;
    box-shadow: inset 0px 1px 1px 0px rgba(0, 0, 0, .3);
	border-radius: 3px;
	border: 1px solid rgb(0, 162, 169);
}
input[type="checkbox"]:checked + label::before {
    content: "\2713";
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .2);
    font-size: 21px;
    color: #00A2A9;
    text-align: center;
    line-height: 21px;
	font-weight: bold;
}
input.custom[type="radio"], input.custom[type="checkbox"] {
    display: none;
}
.has-error {
    box-shadow: 1px 1px 3px 0px rgba(0, 162, 169, 0.75);
	border: 1px solid rgba(255, 0, 0, 0.5);
}

.cta-button{
	border:1px solid #777/* #f48221 */;
	-webkit-box-shadow: #FFAB61 0px 1px 0px inset;
	-moz-box-shadow: #FFAB61 0px 1px 0px inset;
	box-shadow: #FFAB61 0px 1px 0px inset;
	-webkit-border-radius: 14px;
	-moz-border-radius: 14px;
	border-radius: 14px;
	font-family:arial, helvetica, sans-serif;
	padding: 4px 15px;
	text-decoration:none;
	display:inline-block;
	/* text-shadow: 0px 1px 0 rgba(255,255,255,0.44);
	font-size: 14px; */
	font-weight:bold;
	color: #fff !important;
	background-color: #f48221; 
	box-sizing: border-box;
	text-decoration: none !important;
	font-weight: bold;
	text-shadow: 1px 1px 1px black;
}
.cta-button:hover{
	color: #fff !important;
	border:1px solid #777;
	background-color: #FF9832;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#FFB13D), to(#FD790D));
	background-image: -webkit-linear-gradient(top, #FFB13D, #FD790D);
	background-image: -moz-linear-gradient(top, #FFB13D, #FD790D);
	background-image: -ms-linear-gradient(top, #FFB13D, #FD790D);
	background-image: -o-linear-gradient(top, #FFB13D, #FD790D);
	background-image: linear-gradient(to bottom, #FFB13D, #FD790D);
	text-decoration: none;
}
.cta-button:active{
	color: #fff !important;
	border:1px solid #777;
	background-color: #FD790D;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#FD790D), to(#FF9832));
	background-image: -webkit-linear-gradient(top, #FD790D, #FF9832);
	background-image: -moz-linear-gradient(top, #FD790D, #FF9832);
	background-image: -ms-linear-gradient(top, #FD790D, #FF9832);
	background-image: -o-linear-gradient(top, #FD790D, #FF9832);
	background-image: linear-gradient(to bottom, #FD790D, #FF9832);
	box-shadow: inset 1px 1px 2px #777;
	text-decoration: none;
}

.content p.pic img { margin: 10px 30px; border: 1px solid #999;}
#map { margin: 20px0; width: 100%; height: 400px;}
h4.ref_link {margin:0; padding:10px 0;}
h4.ref_link a {position:relative; padding-left:30px;}
h4.ref_link a:before {position:absolute;
content: "";
display: block;
width: 0px;
height: 0px;
border-top: 15px solid transparent;
border-left: 15px solid #F48221;
border-bottom: 15px solid transparent;
margin: -25px -20px 0px 0px; transition: all 0.5s ease;}
h4.ref_link a:hover {padding-left:40px;}
h4.ref_link.active a:before, h4.ref_link a:hover:before { -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); -noz-transform: rotate(90deg); transform: rotate(90deg);}

.graph svg {width:100% !important; height:450px !important;}
.g01, .graph .g02, .g03, .g04, .g05, .g06, .g07, .g08  { transition: all 0.5s ease; transform: scale(1); transform-origin: center;}
.g01:hover, .graph .g02:hover, .g03:hover, .g04:hover, .g05:hover, .g06:hover, .g07:hover, .g08:hover {
transform:translate(-10 10) /*scale(1.1) translate(-10px,-10px)*/; transition-property: transform; transition-duration: 0.5s; transform-origin: center;
-webkit-transform: translate(-10 10) /*scale(1.1) translate(-10px,-10px)*/; -webkit-transition-property: -webkit-transform; transition-duration: 0.5s; -webkit-transform-origin: center;
-moz-transform:translate(-10 10) /*scale(1.1) translate(-10px,-10px)*/; -moz-transition-property: transform; -moz-transition-duration: 0.5s; -moz-transform-origin: center;}
.cikk { transition: all 0.5s ease;}
.cikk:hover {fill:#02A2A9; }

.graph2 svg {width:100% !important; height:450px !important;}
.c01 .text, .c02 .text, .c03 .text, .c04 .text, .c05 .text, .c06 .text {transition: all 0.5s ease; stroke:#C3D7DA; stroke-width:6;}
.c01:hover .text, .c02:hover .text, .c03:hover .text, .c04:hover .text, .c05:hover .text, .c06:hover .text {fill:#02A2A9; stroke:white; stroke-width:6;}

table {
	border-collapse: collapse;
}
td {
	border: 2px solid #b2b2b2;
	padding: 5px;
}

/* TRÉNINGEK */

.training-nav-holder {}
.training-holder { width:100%; height:auto; overflow:hidden; position:relative; min-height:500px; transition: all 0.5s ease;}
a.training-tab {
color: #006367;
background-color: #f48221;
margin: 4px 0px;
display: inline-block;
float: left;
clear: left;
padding: 5px;
width: 50%;
min-height: 30px; height: 30px;
box-sizing: border-box; transition: all 0.5s ease;
}
a.training-tab:hover, a.training-tab.open {width:80%; transition: all 0.5s ease;}
a.training-tab.open, a.training-tab:hover {color:#FFF;}
a.training-tab:after {float: right;
content: "";
display: block;
width: 0px;
height: 0px;
border-top: 15px solid transparent;
border-left: 15px solid #f48221;
border-bottom: 15px solid transparent;
margin: -5px -20px 0px 0px; transition: all 0.5s ease;}

a.training-tab-1 {
	background-color: #f48221;
	min-height: 36px;
	height: 36px;
	font-size: 140%;
	line-height: 29px;
	color: white;
}
a.training-tab-1:after {
	border-top: 18px solid transparent;
	border-left: 18px solid #f48221;
	border-bottom: 18px solid transparent;
	margin: -5px -23px 0px 0px;
}

a.training-tab-2 {
	background-color: #6eb7be;
	min-height: 30px; 
	height: 30px;
	margin-left: 30px;
	width: calc(50% - 30px);
	font-size: 110%;
}
a.training-tab-2:after {
	border-left-color: #6eb7be;
}
a.training-tab2:hover, a.training-tab2.open {width: calc(80% - 30px); transition: all 0.5s ease;}


div[class^="training-box"] { position:absolute; top:0; left:0; display:block; width:100%; margin-left:-100%; transition: all 0.5s ease; overflow: hidden;}
div[class^="training-box"].open { margin-left:0;}


/* REFERENCIÁK */

.testimonials {margin: 30px 0px;}
.testimonial { margin: 1em 0px; padding:1em;  transition: all 0.5s ease; }
.testimonial:nth-child(odd) { background-color: rgba(255, 255, 255, 0.2); }
.testimonial:hover { background-color: rgba(255, 255, 255, 0.5); }
.testimonial blockquote {line-height: 1.5em; }
.testimonial p cite { display: block; font-size: 0.875em; }

/* FORM */
form { box-sizing:border-box; -moz-box-sizing:border-box; transition: all 0.5s ease;}
form input, form textarea, #recaptcha_response_field {width: 100%; margin:5px 0; padding:5px; }
form .text:hover, #recaptcha_response_field:hover {}
#recaptcha_response_field {margin-bottom:5px;}
form .button {  background:#d98d7d; color:#FFF; font-size:18px !important; margin:0 auto; font-family: 'Ubuntu', sans-serif; font-weight:700; transition: all 0.5s ease; display: inherit;-webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
form .button:hover { background-color:#d96952; color:#FFF;}
/*#recaptcha_response_field, form .text:hover, form textarea:hover, form .text:focus, form textarea:focus { color:#000;}*/
textarea { width:286px; min-height:126px; font-size:16px; resize:none;}
#recaptcha_widget div { width: 100% !important; margin: 0 auto; text-align: center;}
#recaptcha_image img { width:300px !important; height:57px !important;}
span.recaptcha_only_if_image { display:block; padding-left:2%; padding-top:8px; color:#666; }
.privacy {display:inline-block; text-align:center; font-size:12px !important; width:100%; margin:0 0 4px 0; }
.privacy a { color:#d98d7d !important;}
.privacy a:hover { color:#d96952 !important;; text-decoration:none !important;}
a.reload { color:#d98d7d !important; padding-right:2%}
a.reload:hover { color:#d96952 !important;}

/* CONTACT FORM */

.hidden {display: none;}
.contactform-holder { /* background:#c3d7da; */ margin:0; padding:0; height: 100%;}
.contactform { margin:0 auto; padding-top:40px; width:100%; max-width: 500px;}
.contactform p { font-size:12px;}
.contactform p a:hover { text-decoration:underline;}
.contactform p.big { font-size:22px; color:#f27900; text-transform:uppercase;}
.contactform p.small { font-size:13px;}
.contactform p span { color:#33c9ff;}
.contactform ul { list-style:none; display:block;}
.contactform ul li { float:left; display:inline-block; margin:10px 1% 0 1%; width:98%;}
/*.contactform ul li.l1 { width:150px;}
.contactform ul li.l2 { width:150px;}
.contactform ul li.r1 { width:300px;}
.contactform ul li.r2 { width:167px;}
.contactform li p.send2 a { display:block; padding-top:3px; color:#000; line-height:22px; text-align:center;} */
.contactform li p {}
.contactform form {margin: 0px auto; padding: 0px; float: none;}
.contactform img { cursor:pointer;}
.contactform p.c_info { padding-top:20px; font-size:13px; color:#999;}

/* VCARD */

.vcard { position:fixed; left:-200px; top:80px; width:400px; height: 400px;  background-color: #f48221; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); z-index:9; -moz-box-shadow: 0px 0px 10px rgba(0,0,0,0.25); -webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.25); box-shadow: 0px 0px 10px rgba(0,0,0,0.25); transition: all 0.5s ease;}
.vcard:hover {left:-200px;}
.vcard .textholder {position: relative; width: 150px; top: 105px; left: 235px; text-align: left; -ms-transform: rotate(-45deg) translateY(-50%); -webkit-transform: rotate(-45deg) translateY(-50%); transform: rotate(-45deg) translateY(-50%);}
.vcard p { color:#000; font-size: 0.875em; line-height:1.125em;}
.vcard a { color:#000;}
.vcard a:hover { color:#FFF;}

#triangle-bottomleft { position:absolute; top:170px; right:0;  -ms-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); transform: rotate(-90deg); width: 0; height: 0; border-bottom: 90px solid rgba(255, 255, 255, 0.3); border-right: 90px solid transparent; border-left: 90px solid transparent;}
#triangle-topleft { position: absolute; bottom: 270px; left: 90px; width: 0px; height: 0px; border-top: 90px solid rgba(255, 255, 255, 0.3); border-right: 90px solid transparent; border-left: 90px solid transparent;} 

/* ICON */

.socialholder {margin: 70px 0 10px 0;}
a.social { display:inline-block; width:40px; height:40px; border-radius:50%; background-color:rgba(0,0,0,0.3); color:#FFF; text-align:center; }
a.social:hover { background-color:rgba(0,0,0,1);}

.sr-only { position: absolute; width: 1px;  height: 1px; margin: -1px; padding: 0px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); border: 0px none; }

.fa { font-family: FontAwesome; font-style: normal; font-weight: normal; line-height: 40px;}
footer .fa {box-sizing: border-box; padding-top: 11px;}
.fa-lg {color:#FFF; font-size:1em; line-height:1em;}

.social .fa-facebook::before { content:"\f09a";}
.social .fa-twitter::before { content:"\f099";}
.social .fa-google-plus::before { content: "\f0d5";}
.social .fa-youtube-play::before { content: "\f16a";}

.nav_controler .fa-bars::before {  content:"\f0c9"; display:block; color:#FFF;}
.nav_controler.open .fa-bars::before { content:"\f00d" !important; }

#slider1_container {background-color: rgb(255, 255, 255); box-shadow: 0px 5px 1px rgba(0, 0, 0, 0.4); text-align:center;}
#slider1_container h3 {font-size:1.5em; color:#00a2a9; font-weight:700; padding: 20px 0px 0 0; text-transform: uppercase;}

/* @FOOTER */	
footer { clear:both; overflow:hidden;}
footer .container { text-align:left; max-width: 1040px; padding:10px 20px; min-height: 160px; margin-top: 30px;}
footer p { color:rgba(0,0,0,0.7)}
footer .szog { position:absolute; bottom:-109px; right:185px; background-color:#6eb7be; border: 50px solid #00a2a9; width: 120px; height:120px; -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg) ; transform: rotate(-45deg); z-index:2;}
footer a { color: #00A2A9; transition: all 0.5s ease; }
footer a:hover { color: #333; }
}

@media all and (max-width: 980px) {
header .container p.title { float:none; text-align:center; width:auto; padding:0;}
header .container p.phone { float:none; text-align:center; width:auto; padding-bottom:10px; margin-bottom:10px;}
#mainnav { padding: 10px 0px; }

.textcontent { margin-left:10px; margin-right:10px;}
}


@media all and (min-width:768px) and (max-width: 987px) {
	#mainnav li a {font-size:0.875em}
	a.training-tab {width: 70%;}
	a.training-tab:hover, a.training-tab.open {width:90%;}
	a.training-tab2 {width: calc(70% - 30px);}
	a.training-tab2:hover, a.training-tab2.open {width: calc(90% - 30px);}
}


@media all and (min-width: 768px) and (max-width: 1160px) {
	.textcontent {padding-left: 80px;}
}

@media all and (max-width: 767px) {
	header .container { position:relative;}
	header .container p.phone { border-radius: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px;}

	.nav_controler { display:block; z-index:99; float:right;}
	.nav_controler a { display:block; color: #FFF; text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.15); padding: 4px 10px; margin-top: 5px; margin-bottom: 5px; position:relative;}

	#mainnav { width:auto; height:auto; display:none; padding: 10px; text-align:left;}
	#mainnav li { display:block; width:100%; padding:3px 0; margin:0; }
	#mainnav li:first-child { padding-top:0px; }

	.textcontent {}
	.textcontent h1 { font-size: 2.5em;}
	.textcontent h2 { font-size: 2em;}
	.textcontent h3 { font-size: 1.75em;}
	.textcontent h4 { font-size: 1.5em;}
	.textcontent h5 { font-size: 1.25em; }
	.textcontent h6 { font-size: 1.125em;}

	.two-col {
		-webkit-column-count: 1; /* Chrome, Safari, Opera */
		-moz-column-count: 1; /* Firefox */
		column-count: 1;
		-webkit-column-gap:0px; /* Chrome, Safari, Opera */
		-moz-column-gap: 0px; /* Firefox */
		column-gap: 0px;}

	a.training-tab {
	float:none;
	width: 100%;
	min-height: 30px; height:auto;
	text-align:center;
	}
	a.training-tab:hover, a.training-tab.open {width:100%;}
	a.training-tab:after {display:none;}

	a.training-tab-1 {
	min-height: 36px;
	}

	a.training-tab-2 {
	width: calc(100% - 30px);
	min-height: 30px;
	}
	a.training-tab-2:hover, a.training-tab-2.open {width:calc(100% - 30px);}

	.vcard {position:absolute; top:auto; bottom:-143px;}
	.socialholder {float:right;}
	.socialholder a {display:block; margin-bottom:5px;}
	footer .szog {top:auto; bottom:-220px;}

	.col3 {
		width: 40%;
	}

}

@media all and (min-width: 641px) {
	#mainnav ul { display: block !important; }
}

@media all and (max-width: 480px) {
	.textcontent h1 { font-size: 2.5em; word-break:break-strict; }
	.textcontent h2 { font-size: 1.5em; word-break:break-strict; }
	.textcontent h3 { font-size: 1.25em; word-break:break-strict; }
	.textcontent h4 { font-size: 1.125em; word-break:break-strict; }
	.textcontent h5 { font-size: 1em; }
	.textcontent h6 { font-size: 1em;}
	.textcontent p, .textcontent ul, .textcontent ol { text-align: left;}
	.col3 {
		width: 100%;
	}
}

.felso {
    top: 0px;
    left: 0px;
	border-top: solid #00A2A9;
	border-right: solid transparent;
	border-left: solid transparent;
	transition: all 2s ease 0s;
}
.also {
    bottom: 0px;
    left: 0px;
	border-bottom: solid #00A2A9;
	border-right: solid transparent;
	border-left: solid transparent;
	transition: all 2s ease 0s;
}
.bal {
    top: 0px;
    left: 0px;
    transition: all 2s ease 0s;
    border-top: solid transparent;
    border-left: solid #F48221;
    border-bottom: solid transparent;
}
.jobb {
	top: 0px;
	right: 0px;
	transition: all 2s ease 0s;
	border-right: solid #F48221;
	border-bottom: solid transparent;
	border-top: solid transparent;
}

.felso, .also, .bal, .jobb, .felso2, .also2, .bal2, .jobb2 {
	position: absolute;
	height: 0px;
	width: 0px;
}

.felso2 {
    border-top: solid rgba(255, 255, 255, 0.5);
    border-right: solid transparent;
    border-left: solid transparent;
    transition: all 2s ease 0s;
}

.also2 {
	border-bottom: solid rgba(255,255,255,0.5);
	border-right: solid transparent;
	border-left: solid transparent;
	transition: all 2s ease;
}

.bal2 {
	border-left: solid rgba(255,255,255,0.5);
	border-top: solid transparent;
	border-bottom: solid transparent;
	transition: all 2s ease;
}

.jobb2 {
	border-right: solid rgba(255,255,255,0.5);
	border-top: solid transparent;
	border-bottom: solid transparent;
	transition: all 2s ease;
}

.kepernyo {position:fixed; top: 0; left: 0; width:100%; height:100%; border:0px solid #000; display: none; z-index:20; background-color: rgba(244,130,33,1);}
.kepernyo .kep {position: absolute;  top: 50%; left:50%; margin-left:-100px; margin-top:-100px; opacity:1; z-index:2;transition: all 1s ease;}
.kepernyo .kep.live {opacity:0; -ms-transform: rotate(-360deg); -webkit-transform: rotate(-360deg); transform: rotate(-360deg); }