html, body{ margin:0; padding:0;}
html{ height:100%;background:url(../image/bg.png) left top repeat; }
body{ background:url(../image/bodyBg.png) center top no-repeat fixed;}
.clear{ clear:both; }
.hide{ display:none !important; }

/*Betű típusok*/
@font-face {
    font-family: 'HelveticaNeueLTCom75Bold';
    src: url('../font/helveticaneueltcom-bd.eot');
    src: url('../font/helveticaneueltcom-bd.eot') format('embedded-opentype'),
        url('../font/helveticaneueltcom-bd.woff') format('woff'),
        url('../font/helveticaneueltcom-bd.ttf') format('truetype'),
        url('../font/helveticaneueltcom-bd.svg#HelveticaNeueLTCom75Bold') format('svg');
}

@font-face {
    font-family: 'HelveticaNeueLTCom56Italic';
    src: url('../font/helveticaneueltcom-it.eot');
    src: url('../font/helveticaneueltcom-it.eot') format('embedded-opentype'),
        url('../font/helveticaneueltcom-it.woff') format('woff'),
        url('../font/helveticaneueltcom-it.ttf') format('truetype'),
        url('../font/helveticaneueltcom-it.svg#HelveticaNeueLTCom56Italic') format('svg');
}

@font-face {
    font-family: 'HelveticaNeueLTCom55Roman';
    src: url('../font/helveticaneueltcom-roman.eot');
    src: url('../font/helveticaneueltcom-roman.eot') format('embedded-opentype'),
        url('../font/helveticaneueltcom-roman.woff') format('woff'),
        url('../font/helveticaneueltcom-roman.ttf') format('truetype'),
        url('../font/helveticaneueltcom-roman.svg#HelveticaNeueLTCom55Roman') format('svg');
}

@font-face {
    font-family: 'HelveticaNeueLTCom35Thin';
    src: url('../font/helveticaneueltcom-th.eot');
    src: url('../font/helveticaneueltcom-th.eot') format('embedded-opentype'),
        url('../font/helveticaneueltcom-th.woff') format('woff'),
        url('../font/helveticaneueltcom-th.ttf') format('truetype'),
        url('../font/helveticaneueltcom-th.svg#HelveticaNeueLTCom35Thin') format('svg');
}

body{
    color:#000;
    font-size:100%;
    font-family:'HelveticaNeueLTCom55Roman', Arial, Helvetica, sans-serif;
}

b, strong{ 
    font-family:'HelveticaNeueLTCom75Bold', Arial, Helvetica, sans-serif;
    font-size:14px;
    font-size: 1em;}
i{
    font-family:'HelveticaNeueLTCom56Italic', Arial, Helvetica, sans-serif;
    font-size:14px;
    font-size: 1em;
}

/*-----------------------------------------------------------------------------
 --- Visszajelzések --- */

.system_error {
    background: url("../image/icon-error.png") no-repeat scroll 10px 7px #FCCAC1;
    border: 1px solid #E18B7C;
    color: #C33820;
}

.system_succes {
    background: url("../image/icon-succes.png") no-repeat scroll 10px 7px #DEFCC1;
    border: 1px solid #AEE17C;
    color: #62AF17;
}

.system {
    font: 12px/1.6em Arial;
    margin: 0 0 10px 0;
    padding: 5px 10px 4px 33px;
    display:none;
    cursor:pointer;
}

.btn-klmaweb {
    color: #ffffff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    background-color: #00b2e9;
    *background-color: #00b2e9;
    background-image: -moz-linear-gradient(top, #00b2e9, #007ac2);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#00b2e9), to(#007ac2));
    background-image: -webkit-linear-gradient(top, #00b2e9, #007ac2);
    background-image: -o-linear-gradient(top, #00b2e9, #007ac2);
    background-image: linear-gradient(top bottom, #00b2e9, #007ac2);
    background-repeat: repeat-x;
    border: none;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00b2e9', endColorstr='#007ac2', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}

.btn-klmaweb:hover,
.btn-klmaweb:focus,
.btn-klmaweb:active,
.btn-klmaweb.active,
.btn-klmaweb.disabled,
.btn-klmaweb[disabled] {
    color: #ffffff;
    background-color: #007ac2;
    *background-color: #007ac2;
}

.btn-klmaweb:active,
.btn-klmaweb.active {
    background-color: #007ac2 \9;
}

/*-----------------------------------------------------------------------------
 -- Design*/

/*Fejléc*/
.Header{
    width: 100%;
    margin:0 auto;
    margin-top:20px;
}

.LogoLink{
    display:block;
    width: 95%;
    max-width:355px;
    margin-bottom:1%;
    margin-left:1%;
}

.Slider {
    margin: 0 auto;
    max-width: 670px;
    max-height:315px;
}

/*Tartalom*/
.ContentBody{
    max-width: 900px;
    margin:0 auto;
    padding:0;
    margin-bottom:20px;
}

.leftSide{
    float:left;
    width: 75%;
    max-width: 675px;
    padding:5px 0;
    min-height:250px;
    text-align:left;
    font-family:'HelveticaNeueLTCom55Roman', Arial, Helvetica, sans-serif;
    font-size:14px;
    font-size: 1em;
}

.rightSide{
    float:right;
    max-width: 205px;
}


/*Lábléc*/
.Footer{
    margin:0 auto;
    background:#3f9dd0;
    width:100%;
    -webkit-box-shadow:0 0 20px #fff, inset 0 5px 10px rgba(255,255,255,.8);
    -moz-box-shadow:0 0 20px #fff, inset 0 5px 10px rgba(255,255,255,.8);
    box-shadow:0 0 20px #fff, inset 0 5px 10px rgba(255,255,255,.8);
}

.FooterContent{
    margin:0 auto;
    position:relative;
    max-width:900px;
    padding:20px 0;

}

.Footer a {
    font-family:'HelveticaNeueLTCom55Roman', Arial, Helvetica, sans-serif;
    color:#fff;
}


#footerLogo{
    display:block;
    width:165px;
    height:22px;
    float: left;
    margin:0 1% .5% 0;

}

.author{
    position:absolute;
    bottom:5px;
    right:10px;
    font-size: 0.8em;
}

.ajanlatlink{
    display:block;
    margin-top: 25px;
}

/* --- Navigation modul */
#TopPosition ul.Navigation{
    margin:0;
    max-width: 900px;
    min-height: 25px;
    line-height: 25px;
    margin-top:10px;
    margin-bottom:10px;
    list-style:none;
    text-align:center;
}

#TopPosition ul.Navigation > li{
    display:inline-block;
    padding:5px 0;
    margin: 0 5px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

#TopPosition ul.Navigation > li > a{
    display:block;
    color:#000;
    padding:0 10px;
    text-transform:uppercase;
    text-decoration:none;
    font-family: 'HelveticaNeueLTCom56Roman', Arial, Helvetica, sans-serif;
    font-size:14px;
    font-size:100%;
    font-size: 1em;           

}

#TopPosition ul.Navigation > li.active,
#TopPosition ul.Navigation > li:hover{
    color:#fff;
    background-color: #00b2e9;
    *background-color: #00b2e9;
    background-image: -moz-linear-gradient(top, #00b2e9, #007ac2);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#00b2e9), to(#007ac2));
    background-image: -webkit-linear-gradient(top, #00b2e9, #007ac2);
    background-image: -o-linear-gradient(top, #00b2e9, #007ac2);
    background-image: linear-gradient(top bottom, #00b2e9, #007ac2);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00b2e9', endColorstr='#007ac2', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}

#TopPosition ul.Navigation > li.active a,
#TopPosition ul.Navigation > li:hover a{
    color:#fff;
}

/* --- FooterMenu modul */
#FooterPosition{
    margin-top: 5px;
    margin-bottom: 5px;
    width:95%;
    font-family:'HelveticaNeueLTCom55Roman', Arial, Helvetica, sans-serif;
    color:#fff;
    font-size: 0.8em;
}

#FooterMenuPosition ul.FooterMenu{
    margin:0 auto;
    width:100%;
    margin-top:3px;
    margin-bottom:10px;
    list-style:none;
}

#FooterMenuPosition ul.FooterMenu > li{
    display:inline-block;
}

#FooterMenuPosition ul.FooterMenu > li > a{
    display:block;
    color:#fff;
    text-transform:uppercase;
    text-decoration:none;
    padding:0 5px;
    font-family:'HelveticaNeueLTCom55Roman', Arial, Helvetica, sans-serif;
    font-size: .9em
}

#FooterMenuPosition ul.FooterMenu > li.active > a,
#FooterMenuPosition ul.FooterMenu > li:hover > a{
    text-decoration:underline;
    color:#f3f3f3;
}

/* Right modul box */
#RightPosition .ModulHtml{
    border:solid 5px #f3f3f3;
    border-top: none;
    background:#e6e6e6;
    padding: 10px 5px;
    width:185px;
    position: relative;
    display:block;
    font-family: 'HelveticaNeueLTCom35Thin', Arial, Helvetica, sans-serif;
    font-size: .9em;
}

#RightPosition .felirat{
    margin-top: 25px;
    width:205px;
    background:#1d696c;
    color:#fff;
    background-color: #00b2e9;
    *background-color: #00b2e9;
    background-image: -moz-linear-gradient(top, #00b2e9, #007ac2);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#00b2e9), to(#007ac2));
    background-image: -webkit-linear-gradient(top, #00b2e9, #007ac2);
    background-image: -o-linear-gradient(top, #00b2e9, #007ac2);
    background-image: linear-gradient(top bottom, #00b2e9, #007ac2);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00b2e9', endColorstr='#007ac2', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    text-decoration:none;
    font-family:'HelveticaNeueLTCom55Roman', Arial, Helvetica, sans-serif;
    font-size: 1em;
}

#RightPosition .felirat span{ display: block; padding: 8px 0 8px 15px;}
#RightPosition #kapcsolat span{background: url(../image/kapcsolat.png) 140px center no-repeat;}
#RightPosition #partnerek span{background: url(../image/partner.png) 140px center no-repeat;}


/*Kapcsolat form*/
#message .control-label { width: 50px; }
#message .controls { margin-left:60px; }
#message .control-group { margin-bottom:5px; }

.shadow{ width:100%; text-align: center; margin: 0 auto; }


@media screen and (max-width:900px){
    .leftSide{
        float:none;
        width: 95%;
        max-width: none;
        margin:0 auto;
    }

    .rightSide{
        float:none;
        width: 95%;
        max-width: none;
        margin:0 auto;
    }

    .rightSide .ajanlatlink,
    .rightSide #RightPosition,
    .rightSide .ModulContent{
        float:left;
        margin-right: 10px;
    }
}

@media screen and (max-width:600px){
    .nivo-controlNav{ display: none; }
}
@media screen and (max-width:700px){
    #FooterPosition{ display: none; }
}

.preview{
    margin:0 auto;
    width: 100%;
    height: auto;
    position: relative;
    overflow: hidden;
    border: solid 1px #f3f3f3;
    box-shadow: 0 0 2px rgba(0,0,0,.6);
}
.preview .leiras{
    width: 96%;
    height: auto;
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 1% 2%;
    background: rgba(255,255,255,.7);
    font-size: 0.8em;
}

.referenciak img{
    border:solid 1px transparent;
    cursor: pointer;
}

.referenciak img:hover{
    border:solid 1px #007ac2;
}

/*image effekt*/
.view {
   width: 280px;
   height: 170px;
   margin: 5px;
   margin-left:10px;
   float: right;
   border: 2px solid #fff;
   overflow: hidden;
   position: relative;
   text-align: center;
   box-shadow: 0px 0px 5px #aaa;
   cursor: default;
}
.view .mask, .view .content {
   width: 275px;
   height: 170px;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
}

.view img {
   display: block;
   position: relative;
}

.view a{ pointer-events: none; }

.fourth-effect .mask {
	position:absolute; /* Center the mask */
	top:35px;
	left:85px;
	cursor:pointer;
    border-radius: 50px;
    border-width: 50px;
    display: inline-block;
    height: 100px;
    width: 100px;
	border: 50px solid rgba(0, 0,0, 0.4);
	-moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
	opacity:1;
	visibility:visible;
	-moz-transform:scale(4);
	-webkit-transform:scale(4);
	-o-transform:scale(4);
	-ms-transform:scale(4);
	transform:scale(4);
	-moz-transition:all 0.3s ease-in-out;
	-webkit-transition:all 0.3s ease-in-out;
	-o-transition:all 0.3s ease-in-out;
	-ms-transition:all 0.3s ease-in-out;
	transition:all 0.3s ease-in-out;
}
.fourth-effect:hover .mask {
   opacity: 0;
   border:0px solid rgba(0,0,0,0.4);
   visibility:hidden;
}

.view2{
	width:325px;
        height: 216px;
}

.view2 .mask{
	top:65px;
	left:110px;
}

.view3{
	width:343px;
        height: 214px;
}

.view3 .mask{
	top:65px;
	left:110px;
}