﻿/*
Name: A levetett ruhája
Version: 1.2
Author: Balint Peter
Author URI: http://weloveweb.hu
*/
*{font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; margin:0px; padding:0px;-webkit-font-smoothing: antialiased;}
html{padding-top:0px !important;}
body{font-family: 'Open Sans', "Helvetica", sans-serif;  background-repeat: repeat; background-color:#fff;background-repeat:  repeat;  padding:0px; margin: 0px; width:100%; height: 100%; text-align:center; display:block; font-size:14px;}
b, strong{font-weight:bold;}
em{font-style:italic;}
del{text-decoration:line-through;}
ins{text-decoration:none; font-size:larger; padding:5px;}
.hp{display:none;}
section{width:1100px;margin:0px auto; box-sizing: content-box;padding:0px;display:inline-block; text-align: center;}

li{list-style: none;}


ul.grid{width:100%; height:auto; box-sizing:content-box;display:inline-block;padding:0px;}
ul.grid li{float:left;text-align:left;height:auto; box-sizing:content-box;}
ul.grid li.fullwidth{width:100%;}
ul.grid li.halfwidth{width:50%;}
ul.grid li.onethird{width:33%;}
ul.grid li.onefourth{width:25%;}
ul.grid li.twothird{width:66%;}
ul.grid li.paddedthird{width:calc(33% - 20px);padding:10px;}
ul.grid li.twothird{width:66%;}
ul.grid li.rightline{text-align:right;}
ul.grid li.centerline{text-align:center;}
ul.grid li.leftlineline{text-align:left}

.left{float:left;}
.right{float:right;}

a{color:rgba(241, 196, 15,1.0);text-decoration: none;}
a:hover{color:rgba(241, 196, 15,1.0);text-decoration: none;}

.header_holder{width:100%; height: 80px; margin:0px; padding:0px;}
header{width:100%; text-align: center; padding:20px 0px; height: 70px;position: static;transition: all 0.5s ease; z-index: 5;}
header.darker{position: fixed; top:0px; padding:5px; left:0px; background:rgba(0,0,0,0.4);}

header #logo{width:calc(100% / 9); height:42px;float:left; text-align:left;}
header #logo h1{font-family: 'merriweather', sans-serif; font-size:14px; line-height: 16px; color:#fff;letter-spacing: 1;}
header #logo h1 span{font-size: 25px; line-height: 30px; color:#efe; font-weight: bold; letter-spacing:1px;}
header nav{float:right; width:calc((100% / 9)*5);display:block;}
header nav item{width:calc(100% / 5); height: 30px; float:left; letter-spacing: 0px; font-size:14px; line-height: 20px; padding:20px 0px; text-align: center;font-weight: bold; color:#fff; cursor:pointer;opacity:0.9; position: relative;}
header nav item:hover{opacity: 1;}
header nav item:after{width:40%; height: 2px; position: absolute; bottom: 26px;  transition: all 0.5s ease;left:calc(0%); opacity:0;background:rgba(241, 196, 15,1.0); content:""; float:left;}
header nav item.active:after,header nav item:hover:after{opacity: 1; left:calc(30%);}

slider{margin:0px; padding:0px; height: 120vh; width:100%; display:block; position: relative;}
slider .loader{width:100%; position: absolute; top:0px; left:0px;height: 3px; overflow: hidden;z-index:6;}
slider .loader .line{content:""; float: left; height: 3px; width: 2%;background:#f1c40f;}
slider .canvas{width:100%; height: 110vh;background-image:cover; background-position: center center;}
slider .canvas section{margin-top:25vh; }
slider .canvas section h1{color:#fff;font-family: 'Lato', sans-serif; font-weight: bold; text-shadow: 0px 0px 10px rgba(50, 50,50, 1);   margin-bottom: 0;    font-size: 48px; line-height: 1.3;    text-transform: uppercase;}
slider .canvas section h2{color:#fff;font-family: 'Lato', sans-serif; font-weight: 300; font-size: 20px; letter-spacing: 1px;text-shadow: 0px 0px 3px rgba(150, 150, 150, 1);}
slider .canvas section a.button.nice{background:#f1c40f; color:#333;transition: all 0.5s ease;margin-top:30px; padding:20px 50px; text-transform: uppercase; letter-spacing: 1px; font-size: 14px; line-height: 14px;font-weight:bold;float:left;}
slider .canvas section a.button.nice:hover{color:#fff;}
slider .canvas section .boxofthings{padding:15px; width:80%; background: rgba(255,255,255,0.6);float:right;border-radius: 5px; position: relative; top:-20px;}
slider .canvas section img.iconme{width:44px; height: 44px;}
slider .canvas section .holdme{border-radius: 50px;background:#666;transition: all 0.5s ease; padding:10px 12px;max-width: 43px;text-align: center; }
slider .canvas section li.fullwidth.active .holdme,
slider .canvas section li.fullwidth:hover .holdme{background:#f1c40f;}
slider .canvas section li.fullwidth{margin-bottom:5px;border-bottom:1px solid rgba(255,255,255,0.2);padding-bottom:5px;padding-top:5px;}
slider .canvas section li.fullwidth:last-child{border:none;}
slider .canvas section li.onethird{width:calc(100% / 5);}
slider .canvas section li.twothird{width:calc((100% / 5) * 4);}
slider .canvas section li h3{font-size:14px; letter-spacing: 1px;margin-bottom:5px; line-height: 1.2;font-family: 'Lato', sans-serif;color:#333;}
slider .canvas section li.fullwidth.active h3,
slider .canvas section li.fullwidth:hover h3{color:#f1c40f;}
slider .canvas section li p{font-size:12px;line-height: 15px;}
slider #chooser{position: absolute; bottom:0px; height: 150px;text-align: center;width:100%; margin:0px; padding:0px;}
slider #chooser section{display:block;}
slider #chooser section item{float:left; width:calc((100% / 5) - 10px); height:130px;background-size:cover; border:10px solid #fff; border-right-width:5px; border-left-width:5px;cursor:pointer; position:relative;}
slider #chooser section item:before{content:"";transition: all 0.5s ease; position: absolute; top:0px; bottom:0px; left:0px; right:0px; background:rgba(255,255,255,0.4);}
slider #chooser section item:hover:before{background:rgba(255,255,255,0);}
slider #chooser section item:first-child{width:calc((100% / 5) - 15px);border-left-width:10px;}
slider #chooser section item:last-child{width:calc((100% / 5) - 15px);border-right-width:10px;}

.slide .mapandstory{height:100vh;}
.slide .mapandstory li.halfwidth{height: 100vh;}
.slide .mapandstory li.halfwidth #map{width:100%; height: 100vh;}

.slide .sectionhead{width:100%; height: auto; padding:10px 0px; margin-bottom:10px;}
.slide .sectionhead .hr{width:100%;background-image:url("images/navilabel-disz.png");background-repeat: no-repeat; background-position: center center; height: 15px;margin:20px 0px;position: relative;}
.slide .sectionhead .hr:before{position: absolute; width:calc(50% - 50px);position: absolute;height: 1px; background:#ccc; left:0px; float:left; content:"";top:7.5px;}
.slide .sectionhead .hr:after{position: absolute; width:calc(50% - 50px);position: absolute;height: 1px; background:#ccc; right:0px; float:right; content:"";top:7.5px;}
.slide .sectionhead h3{font-family: 'Great Vibes', cursive; font-size:30px; position: relative; top:-5px; margin-bottom: 5px; text-align:center;color: #f1c40f; }
.slide .sectionhead h2{ letter-spacing: 5px; text-transform: uppercase; font-weight: 100;font-size:25px; text-align: center;padding:5px 0px;}
.slide .sectionhead h1{ letter-spacing: 2px; text-transform: uppercase; font-weight: 800;font-size:22px; text-align: center;color: #f1c40f; }

#story.slide{margin-bottom:20px;}
p.lead{max-width:70%; margin:30px auto;    font-size: 18px;    font-weight: 400;    max-width: 70%;
    margin: 20px auto;    text-align: center;    font-size: 16px;    letter-spacing: 0px;    color: #333;
    line-height: 24px;    color: #808080;    line-height: 1.7;    font-size: 14px;    font-weight: 100;}

#story.slide .nicebg{background:url("images/1.jpg"); background-size:cover; background-position:  center center; position: relative;}
#story.slide .nicebg:before{position: absolute; top:0px; bottom: 0px; left:0px; right: 0px; background: rgba(255,255,255,0.9); z-index: 0;content:""; float:left; }
#story.slide .story{position: relative; z-index: 1;max-width: 75%; margin:0px auto; margin-top:40px;}
#story.slide .story p{text-align: justify;margin-bottom: 10px; font-size:14px; line-height: 1.6; color:#333; font-weight: 100;}
#story.slide .story .signature{margin-top: 20px;text-align: center; font-weight: bold;   font-size:14px; line-height: 18px;    color: rgba(117, 97, 90 ,1);}
#story.slide .story .signature span{ font-family: 'Great Vibes', cursive;  line-height: 30px;    font-size: 30px;   }
#story.slide .story h4{font-family: 'Lato', sans-serif; width:100%; text-align: center; font-size:20px; color:#000;text-transform: uppercase; margin-bottom: 15px; letter-spacing: 2px;padding-bottom:10px; position: relative;}
#story.slide .story h4:before{content:""; position: absolute; left:calc(45%); width:10%; height: 5px; bottom:0px; float:left; background:#f1c40f;}    

.sectors{height:100vh; min-height: 863px; position: relative;}
.sectors li.halfwidth{height: 50vh; min-height: 438px; position: relative;}
.sectors li.halfwidth.image:before{content:""; position: absolute; float:left; top:0px; bottom:0px; right:0px; left:0px; background:rgba(241, 196, 15,0.8);}
.sectors li.halfwidth.image.lakossagi{background-image:url("images/img_0029.jpg");background-size: cover; background-position: center center;}
.sectors li.halfwidth.image.ceges{background-image:url("images/img_6285_small_vj.jpg");background-size: cover; background-position: center center;}
.sectors li.pattern{background:#rgba(255,255,255,0.09);}

.imagewrap{width:100%; display:block; margin:50px 0px;padding-bottom:20px;}
.imagewrap item{cursor:pointer; overflow: hidden; margin:5px;background-image:url("images/5.jpg"); width:calc((100% / 3) - 10px); float:left; height:230px;background-size:cover; background-position:center center; position:relative;}
.imagewrap item:after{position: absolute; top:0px;transition: all 0.5s ease; bottom:0px; left:0px; right:0px; background:rgba(0,0,0,0);content:""; float:left;}
.imagewrap item:hover:after{background:rgba(0,0,0,0.4);}
.imagewrap item h2{text-align: center;transition: all 0.5s ease;line-height: 20px; font-size: 16px; font-weight: bold; letter-spacing: 1px;text-transform:uppercase; padding: 15px 0px; background:rgba(255,255,255,0.6); position: absolute; top:0px; left:0px; width:100%;z-index: 1;}
.imagewrap item:hover h2{top:-45px;}
.imagewrap item h2:before{content:"";float:left;position: absolute; bottom: -20px;left:0px;width: 0;
height: 0;border-style: solid;border-width: 20px 178px 0 0;border-color: rgba(255,255,255,0.6) transparent transparent transparent;}
.imagewrap item h2:after{content:"";float:right;position: absolute; bottom:-20px;right:0px;width: 0;
height: 0;border-style: solid;border-width: 0 178px 20px 0;border-color: transparent rgba(255,255,255,0.6) transparent transparent;}

.imagewrap item .viewbutton{font-size: 14px; line-height: 14px; letter-spacing: -1px; color:#fff; padding:5px 10px; border:3px solid #fff; margin:0px auto; float:left; position: absolute; top:calc(50% - 15px);left:calc(50% - 55px);z-index: 1;text-transform: uppercase; font-weight: bold;-webkit-transform: scale(0, 0); /* Safari */    transform: scale(0, 0);transition: all 0.5s ease;}
.imagewrap item:hover .viewbutton{ -webkit-transform: scale(1, 1); /* Safari */    transform: scale(1, 1);}

footer{width:100%; text-align: center; margin:0px; padding: 0px;}
footer .callme{background:#f1c40f; color:#fff; padding:50px; margin-bottom: 20px; height: auto; display:block;}
footer .callme h1{font-family: 'Lato', sans-serif;   font-size: 30px;    line-height: 1;    margin-bottom: 35px;font-weight: 400;    margin: 0px 0px 20px 0px;    padding: 0px;   -ms-word-wrap: break-word;    word-wrap: break-word;}
footer .callme p{max-width:70%; margin:0px auto;margin-bottom: 20px;}
footer .callme p span{font-weight: bold;}
footer .callme button.useflop{background: rgba(255,255,255,0.3);transition: all 0.5s ease; padding:10px 30px; border:none; font-weight: bold;     text-decoration: none;
    line-height: 1;    cursor: pointer;    display: inline-block;    width: auto;    margin: 0px 12px 6px 0px;    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;    border-radius: 0px;    text-shadow: none;    -moz-box-shadow: none;    -webkit-box-shadow: none;    box-shadow: none;
    text-transform: uppercase;    border: none;    padding: 21px 28px;    font-size: 15px;    letter-spacing: 1px; color:#fff;cursor:pointer;}
footer .callme button.useflop:hover{background: rgba(255,255,255,0.2);}
footer .callme .flop{display:none;}
footer .callme .flop li{max-width:50%; margin:10px auto;}
footer .callme .flop li input{width:calc(100% - 40px); padding:10px 20px;border:none; background:rgba(255,255,255,0.5);}
footer .callme .flop li textarea{width:calc(100% - 40px); padding:10px 20px;border:none; background:rgba(255,255,255,0.5);}
footer .callme .flop li input{width:calc(100% - 40px); padding:10px 20px;border:none; background:rgba(255,255,255,0.5);}
footer .callme  #flipflop input.submit{background: rgba(255,255,255,0.3);transition: all 0.5s ease; padding:10px 30px; border:none; font-weight: bold;     text-decoration: none;
    line-height: 1;    cursor: pointer;    display: inline-block;    width: auto;    margin: 0px 12px 6px 0px;    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;    border-radius: 0px;    text-shadow: none;    -moz-box-shadow: none;    -webkit-box-shadow: none;    box-shadow: none;
    text-transform: uppercase;    border: none;    padding: 21px 28px;    font-size: 15px;    letter-spacing: 1px; color:#fff;cursor:pointer;}
footer .callme button.useflop:hover{background: rgba(255,255,255,0.2);}
footer .callme  #flipflop.active .flip{display:none;}
footer .callme  #flipflop.active .flop{display:block;}

footer .social{text-align: center; width: 100%; height: 60px; line-height: 30px;padding:5px 0px; background:rgba(0,0,0,0.05);margin:30px 0px;margin-top:60px;}
footer .social i{color: #c1c0c0;    background: #e9e8e8;margin:0px 5px; padding:20px; border-radius: 3px; min-width: 15px; font-size:16px; line-height: 20px;cursor:pointer;}
footer .social i:hover{color:#fff;}
footer .social i.fa-home:hover{background:#2c3e50;}
footer .social i.fa-facebook:hover{background:#3498db;}
footer .social i.fa-google-plus:hover{background:#e74c3c}
footer .social i.fa-map-marker:hover{background:#2ecc71;}
footer .social i.fa-envelope:hover{background:#95a5a6;}
footer .copyright{font-weight: bold;    color: #bbb;font-size: 16px; line-height: 1.5; letter-spacing: -1px; text-align: center;margin:20px 0px;}
footer .copyright span{font-size: 14px; font-weight: 300;}


#imagepopup{position: fixed; top:0px; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; bottom: 0px; left:0px; right: 0px;z-index: 99;text-align: center;opacity:0; display: none;}
#imagepopup.active{display:block; opacity: 1;}
#imagepopup #exit{height: 20px; line-height: 20px; font-size: 20px; position: absolute; top:3px; right: 0px; text-align: center; width: 40px; cursor:pointer; opacity: 0.6;font-size: 20px;z-index: 1;color:#fff;}
#imagepopup #exit:hover{opacity: 1.0;}
#imagepopup #imagefeed{overflow:hidden;margin:auto;border:1px solid rgba(255, 255, 255, 0.0980392);background:#000;width:auto; display:inline-block;z-index: 1; position: relative;max-height: 580px;position: absolute; top:30px; bottom:30px; left:60px; right:60px;}
#imagepopup #imagefeed #imagewrap{width: calc(100% - 360px); height: auto; float: left; display: block; text-align: center;position: absolute; top:0px; left:0px; bottom: 0px;}
#imagepopup #imagefeed #imagewrap img.spotlight{width:auto; height: auto; max-width: 100%; max-height: 100%;margin:0 auto;margin-top:90px;}
#imagepopup #imagefeed #imagewrap .arrow{position: absolute; top:0px; bottom:0px; width:80px; z-index: 1;text-align: center;opacity:0.3; cursor: pointer;}
#imagepopup #imagefeed #imagewrap .arrow:hover{opacity:1.0;}
#imagepopup #imagefeed #imagewrap #left{left:0px;}
#imagepopup #imagefeed #imagewrap #right{right:0px;}
#imagepopup #imagefeed #imagewrap #right.arrow:before{content: "\f105";right:2px; left:2px; text-align: right;}
#imagepopup #imagefeed #imagewrap .arrow:before{position:absolute; top:calc(50% - 50px); left:2px;font-family: FontAwesome; content: "\f104"; font-size: 100px; color:#fff;}
#imagepopup #imagefeed #imagewrap #shared{position: absolute; bottom:0px; left:0px; right:0px; height: 20px;padding:5px 0px; line-height: 20px; background:rgba(0,0,0,0.7);}  
.posabsolutefullwindow{position:absolute;top:0;left:0;right:0;bottom:0;}
#imagepopup #imagefeed #textwrap{width:330px;padding:15px 15px 0px 15px; position: absolute; right: 0px; top:0px; bottom: 0px; display:block;background:#fff;float:left;-webkit-box-shadow: -9px 0px 30px -12px rgba(0,0,0,0.75);
-moz-box-shadow: -9px 0px 30px -12px rgba(0,0,0,0.75);
box-shadow: -9px 0px 30px -12px rgba(0,0,0,0.75);}
#imagepopup #imagefeed #textwrap .logo{width:40px; height: 40px; float:left; margin-right: 10px;background:url("images/logo.png"); background-position: 30% center; background-size: 300%; background-repeat: no-repeat; background-origin: content-box;}
#imagepopup #imagefeed #textwrap h3{font-weight: bold;color:rgba(117, 97, 90 ,1); font-size: 14px; line-height: 18px;letter-spacing: -1px;}
#imagepopup #imagefeed #textwrap p{color:#999; font-style: italic;font-size:13px; line-height: 16px; margin-bottom:5px;}
#imagepopup #imagefeed #textwrap p span.time{font-weight: bold; }
#imagepopup #imagefeed #textwrap h4{font-weight: bold; letter-spacing: 1px; line-height: 18px; font-size: 14px; color:#000;margin-bottom: 5px;}
#imagepopup #imagefeed #textwrap .description{width:100%; text-align: left; font-size: 14px; font-weight: 100; color:#333; line-height: 18px;}
#fog{background: rgba(117, 97, 90 ,0.8);}
#fog.smoke{background:rgba(0,0,0,0.4);z-index: 1;}
#fog.smog{background:rgba(0,0,0,0.8);z-index: 1;}
#fog.yellow{background:rgba(243,156,18,0.7);}
#fog.red{background:rgba(222,77,55,0.7);}
#fog.blue{background:rgba(31,176,229,0.7);}
#fog.heavysmoke{background:rgba(0,0,0,0.8);}
/*Sizes*/
 @media (max-width:320px){ 

}     

 @media (min-width:321px) and (max-width:375px){

 }       
       
 @media (min-width:375px) and (max-width:480px){

          }           
       
@media (min-width:480px) and (max-width:568px){

}
       
@media (min-width:569px) and (max-width:768px){

          }                

@media (min-width:768px) and (max-width:910px){

         } 
         
@media (min-width:910px) and (max-width:1100px){

         }          	