@font-face {
    font-family: OpenSansRegular;
    src: url("../font/OpenSans-Regular.ttf") format("truetype"), url("../font/OpenSans-Regular.eot");
}
@font-face {
    font-family: OpenSansLight;
    src: url("../font/OpenSans-Light.ttf") format("truetype"),url("../font/OpenSans-Light.eot");
}
@font-face {
    font-family: OpenSansBold;
    src: url("../font/OpenSans-Bold.ttf") format("truetype"), url("../font/OpenSans-Bold.eot");
}
@font-face {
    font-family: OpenSansSemiBold;
    src: url("../font/OpenSans-Semibold.ttf") format("truetype"), url("../font/OpenSans-Semibold.ttf") format("truetype");
}

body{
    font-family: OpenSansLight;
    margin:0;
    font-size: 24px;
    background-color:#fff;
    color:#0080bb;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
    background-image:url("../gfx/background_lg.png");
    background-size: 100%;
    background-repeat:no-repeat;
    background-position-y: 128px;
    background-attachment: fixed;
}

.clear{
    clear: both;
}

a:focus,a:hover{
    text-decoration: none;
}

.hideme{
    opacity: 0;
}

header{
    z-index:9;
    top:0;
    position:fixed;
    width:100%;
    background-color: #fff;
}
header a.logolink .logotext{
    display:inline-block;
    line-height: 88px;
}

header a.logolink{
    display:inline-block;
    color:#0080bb;
    font-size: 24px;
    line-height: 48px;
}

header a.logolink:hover,header a.logolink:active,header a.logolink:focus,header a.logolink:visited{
    color:#0080bb;
}

header a.logolink img{
    margin-bottom: 3px;
    width:80px;
    display:inline-block;
}

/*header .logo{
    background-image:url("../gfx/logo.png");
    height:10vw;
    width:100%;
    max-width: 495px;
    max-height: 51px;
    background-repeat: no-repeat;
    background-size: 100%;
    margin: 12px 0 8px 0;
    display:inline-block;
}*/

header div.contact-datas{
    height:100%;
    display:inline-block;
    float:right;
    margin-top: 23px;
}
header div.contact-datas div:not(.infolabel):not(.infodata){
    display:inline-block;
    vertical-align: bottom;
}

header div.contact-datas div.infotext{
    margin-left:6px;
    cursor: default;
}

header div.contact-datas a div.infotext,header div.contact-datas a div.infolabel{
    cursor:pointer;
    font-size:13px;
    color: #344c51;
}

header div.contact-datas a:hover{
    border:none;
}

header div.contact-datas div.infodata,header div.contact-datas div.infolabel{
    font-size:13px;
    color: #344c51;
}
header div.contact-datas div.infolabel{
    font-weight:bold;
    cursor:default;
}

header div.contact-datas .icon{
    width:36px;
    text-align: right;
}

header div.contact-datas .icon img{
    padding:0 5px;
}

nav{
    min-height: 58px;
    line-height: 58px;
    background-color: #303536;
    width:100%;
}
div.shadow{
    width: 100%;
    box-shadow: 0 5px 15px #000;
    z-index: -1;
    height: 100%;
    position: absolute;
    bottom: 0;
}
main{
    background-color: #fff;
    padding-bottom:60px;
}

div.img_area{
    height:28.7vw;
    width:100%;
    margin-top:128px;
    /*background-color: #001c29;*/
    /*opacity:0;*/
    -webkit-transition: opacity 300ms ease-in 200ms; 
    -moz-transition: opacity 300ms ease-in 200ms;
    -o-transition: opacity 300ms ease-in 200ms;
    transition: opacity 300ms ease-in 200ms;
    text-align: center;
}

/*div.img_area:hover{
    opacity: 0.5;
}*/


footer{
    background-color: #303536;
    padding-top: 45px;
    min-height: 98px;
    color:#fff;
    text-align: center;
    font-size: 16px;
    
}

.contacts .contact-box{
    border: 1px solid #d7d7d7;
    display: inline-block;
    text-align: center;
    width:100%;
    margin-top: 35px;
}

.contacts .contact-box:first-child{
    margin-left: 0;
}
.contacts .contact-box:last-child{
    margin-right: 0;
}

.contacts .contact-box > img{
    margin:8px;
}

.contacts .contact-box > img::before{
    content: "ok";
}

.contacts .contact-box .note{
    color: #344c51;
    font-family: OpenSansRegular;
}

.contacts .contact-box .note .city{
    font-size: 28px;
    line-height:60px;
}

.contacts .contact-box .note .address{
    font-size: 16px;
    line-height:28px;
}

.contacts .contact-box .note .phone-info{
    font-size: 18px;
    font-weight: bold;
    line-height:28px;
}

.contacts .contact-box .note .email-info{
    font-size: 18px;
    line-height:28px;
    margin-bottom: 15px;
}

footer .container div.up{
    position:absolute;
    background-color: #0080bb;
    border-radius: 105px;
    display:inline-block;
    width:100px;
    height:100px;
    margin-left: -50px;
    margin-top: -80px;
    cursor: pointer;
}

footer .container div.up:hover{
    background-color: #008ccc;
}

footer .container div.up img{
    position:absolute;
    margin-top:40px;
    margin-left:-20px;
}

.shaped-button{
    min-width: 180px;
    background-color: #0080bb;
    border-radius: 8px;
    min-height:46px;
    color:#fff;
    font-family: OpenSansRegular;
    font-size: 20px;
    border: 1px solid #0080bb;
    -webkit-transition: all 300ms ease-in 50ms; 
    -moz-transition: all 300ms ease-in 50ms;
    -o-transition: all 300ms ease-in 50ms;
    transition: all 300ms ease-in 50ms;
    outline: none;
}

.fejl{
    position:fixed;
    color:#000;
    font-size: 52px;
    text-align: center;
    font-weight: bold;
    margin:30px auto;
    width: 100%;
}

.shaped-button:hover{
    background-color: #008ccc;
}

.bordered-button{
    min-width: 180px;
    background:transparent;
    border-radius: 8px;
    min-height:46px;
    color:#fff;
    font-family: OpenSansRegular;
    font-size: 20px;
    border: 1px solid #0080bb;
    -webkit-transition: all 300ms ease-in 50ms; 
    -moz-transition: all 300ms ease-in 50ms;
    -o-transition: all 300ms ease-in 50ms;
    transition: all 300ms ease-in 50ms;
    outline: none;
}

.bordered-button:hover{
    border-color: #78c2e4;
}

.abs{
    position: absolute;
    z-index: 2;
}

.shaped-button.abs{
    left: calc(50% - 200px);
    margin-top: 18vw;
    opacity:0;
}

h1{
    text-align: center;
    color: #344c51;
}

h1::after{
    content: ' ';
    display:block;
    width:150px;
    border-bottom: 7px solid #0080bb;
    margin:15px auto;
}

.img_area img{
    margin-left: 3000px;
    -webkit-animation: slide 0.5s forwards;
    -webkit-animation-delay: 2s;
    animation: slide 0.5s forwards;
    animation-delay: 0s;
}

.img_area .col-lg-9{
    margin-left: -3000px;
    -webkit-animation: slide 0.5s forwards;
    -webkit-animation-delay: 2s;
    animation: slide 0.5s forwards;
    animation-delay: 0s;
}

h1{
    margin-left: -1000px;
    -webkit-animation: slide 0.5s forwards;
    -webkit-animation-delay: 2s;
    animation: slide 0.5s forwards;
    animation-delay: 0s;
}

@-webkit-keyframes slide {
    100% { margin-left: 0; }
}

@keyframes slide {
    100% { margin-left: 0; }
}

.bordered-button.abs{
    left: calc(50% + 20px);
    margin-top: 18vw;
    opacity:0;
}

.calc_link {
    float: right;
    background-color: #0080bb;
    opacity: 0.9;
    padding: 0px 15px;
    font-size: 14px;
    -webkit-transition: all 300ms ease-in 50ms;
    -moz-transition: all 300ms ease-in 50ms;
    -o-transition: all 300ms ease-in 50ms;
    transition: all 300ms ease-in 50ms;
}

.calc_link:hover {
    background-color: #303536;
}

.calc_link a{
    color:#fff;
    -webkit-transition: all 300ms ease-in 50ms;
    -moz-transition: all 300ms ease-in 50ms;
    -o-transition: all 300ms ease-in 50ms;
    transition: all 300ms ease-in 50ms;
}

.calc_link a:hover{
    color:#78c2e4;
}

.img_area .cv img, .img_area .cv p, .img_area .cv, .img_area .row, .img_area .container{
    height:100%;
}

.img_area .container{
    display:none;
    overflow: hidden;
}

.img_area img{
    -webkit-filter: drop-shadow(5px 0px 18px #fff);
    filter: drop-shadow(5px 0px 18px #fff)
}

.img_area .col-lg-9 p{
    color: #fff;
    text-shadow: 0 0 3px #000;
}
.img_area .col-lg-9 p span{
    display: block;
    background-color: rgba(48, 53, 54, 0.7);
    vertical-align: middle;
    position: absolute;
    top: calc(50% - 80px);
    padding: 10px;
    border-radius: 5px;
    box-shadow: 5px 0 80px #fff;
}


@media (max-width: 992px){
    .img_area.withdata .container{
        display:none !important; 
    }
}

@media (max-width: 1199px){    
    header div.contact-datas > div{
        margin:4px 0;
    }
    
    header div.contact-datas .infotext > .infodata, header div.contact-datas .infotext > .infolabel{
        display:none;
    }
    
    header div.contact-datas div.mail-data{
        display:none !important;
    }
}

@media (max-width: 768px) and  (min-width:560px) {
    .calc_link {
        position:absolute;
        height:88px;
        right:0;
        top:0;
        line-height:88px;
    }
}

@media (max-width: 768px) {
    body{
        background-image:url("../gfx/background-sm2.png");
    }
    
    /*header .logo{
        background-image:url("../gfx/logo_sm.png");
        max-width: 380px;
        max-height: 39px;
        margin : 6px 0 0 0;
    }*/
    
    header .logotext{
        font-size: 17px;
    }
    
    header div.contact-datas{
        display:none;
    }
    
    div.img_area{
        height:44vw;
    }
    
    footer{
        font-size: 11px;
        line-height: 24px;
    }
    
    .bordered-button,.shaped-button{
        min-width: 120px;
        min-height:35px;
        font-size: 14px;
        border-radius: 5px;
    }
    
    .shaped-button.abs{
        left: calc(50% - 140px);
    }
    
    
}

@media (max-width: 559px) {
    .calc_link {
        display: block;
        width: 100%;
        background-color: #303536;
        padding: 0 10px;
        border-top: 1px solid;
    }
}

@media (max-width: 445px) {
    header a.logolink .logotext{
        width: 165px;
        height: 75px;
        vertical-align: middle;
        line-height: 36px;
    }
    

    header a.logolink{
        
        font-size: 15px;
        line-height: 15px;
    }
}