/*! normalize.css v3.0.0 | MIT License | git.io/normalize */
html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background:0 0}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}

/* General styles */
html,
button,
input,
select,
textarea {
    color: #222;
}

html {
    font-size: 1em;
    line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight
 */

/*::-moz-selection {
    background: #f39519;
    text-shadow: none;
}

::selection {
    background: #f39519;
    text-shadow: none;
}*/

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 5px solid #e9e9e9;
    margin: 1.5em 0;
    padding: 0;
    clear: both;
}

audio,
canvas,
img,
video {
    vertical-align: middle;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}

*,
*:before,
*:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

img,
object,
embed {
  max-width: 100%;
  height: auto;
}

a {
    outline: none !important;
}

ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

abbr {
    cursor: help;
}

/* ==========================================================================
   Browse Happy / no JS prompt
   ========================================================================== */

.ltie7, .noJS { margin: 0; padding: 7px 20px; background: #d40000; text-align: center; }
.ltie7, .noJS, .ltie7 a, .noJS a { color: white; }
.ltie7 a:hover, .ltie7 a:focus, .noJS a:hover, .noJS a:focus { text-decoration: none; }

/* ==========================================================================
   Custom styles
   ========================================================================== */

body {
    font-family: 'Roboto', sans-serif;
}

/* Typo */
a {
    color: #1e91b7;
    text-decoration: none;
    font-weight: 300;
}
a:hover {
    color: #1e91b7;
    text-decoration: none;
}

h1, h2, h3, h4 {
    font-family: 'Roboto', sans-serif;
    font-weight: 300; 
}

h2 {
    font-size: 2.1em;
    letter-spacing: 0.01em;
}

strong {font-weight: 400;}

.blue {color: #1e91b7;}

.green {color: #18c46e; font-weight: bold;}

p {
    color: #333;
    font-size: 1em;
    font-weight: 300;
    margin-bottom: 1.875em;
    letter-spacing: 0.025em;
}
p:last-child {
    margin-bottom: 0;
}

/* Navigation */
nav#main-nav {
    position: relative;
    padding: 1em 0;
    background-color: rgba(30,145,183,.85);
}

nav#main-nav ul {
    display: none;
    padding-top: 1.250em;
    text-align: center;
}
nav#main-nav ul li {
    display: block;
}
nav#main-nav ul li a {
    font-family: 'Roboto', sans-serif;
    color: #fff;
    text-decoration: none;
    font-weight: 400;
}

nav#main-nav .start_button {
    background-color: none;
}

.start a {
    display: block;
    background: url(../img/starticon.png) no-repeat center;
    width: 49px;
    height: 49px;
}

/* Mobile Navigation */

#mobile-nav {
    margin: auto;
    font-size: 1em;
    text-align: center;
    text-decoration: none;
    padding: 1em;
    position: absolute;
    top: 18px;
    right: 10px;
    background: transparent;
}

#mobile-nav .icon-bar {
    background-color: #fff;
    display: block;
    height: 3px;
    line-height: 14px;
    vertical-align: text-top;
    width: 18px;
}

#mobile-nav .icon-bar + .icon-bar {
    margin-top: 3px;
}

/* header */
.logo {
    display: none;
    text-align: center;
    padding-top: 120px;
}

/* Sections */

p.introtext {
    color: #333;
    font-size: 1em;
    font-weight: 400;
    letter-spacing: 0.06em;
    margin-bottom: 50px;

}

section#manager .icons {
    margin-bottom: 80px;
    display: block; 
    margin: 3.125em auto;
}

section#manager .icons.iMac {
    background: url(../img/iMac.png) no-repeat center;
    width: 201px;
    height: 201px;
}

section#manager .icons.pencil {
    background: url(../img/pencil.png) no-repeat center;
    width: 200px;
    height: 200px;
}

section#manager .icons.briefcase {
    background: url(../img/briefcase.png) no-repeat center;
    width: 200px;
    height: 200px;
    margin-bottom: 0em;
}

section#manager, section#kontakt {
    padding: 4em 0;
    word-wrap: break-word;
}

section#manager h2 {
    margin-bottom: 1.2em;
    line-height: 0;

}

section#kontakt .intro {
    text-align: center;
    margin-bottom: 4em;
}

section#kontakt label {
    font-weight: 300;
    font-size: 1em;
    margin-bottom: 7px;
    color: #fff;
}

section#kontakt input, section#kontakt textarea {
    border-radius: 6px;
}

section#kontakt .button {
    background: #18c46e url(../img/ico-mail.png) no-repeat 100px center;
    border-radius: 6px;
    -webkit-box-shadow: 0 2px 0 rgba(0,0,0,.15), inset 0 1px 0px rgba(225,225,225,.3);
    -moz-box-shadow: 0 2px 0 rgba(0,0,0,.15), inset 0 1px 0px rgba(255,255,255,.3);
    box-shadow: 0 2px 0 rgba(0,0,0,.15), inset 0 1px 0px rgba(255,255,255,.3);
    padding: 1.3em 1.4em 1.3em 3.8em;
    font-weight: 300;
    font-size: 16px;
    width: 100%;
    margin-top: 3em;
    margin-bottom: auto;
}

section#kontakt .button:hover, section#kontakt .button:focus {
    background-color: #10b462;
}

section#kontakt .button:active {
    /*-webkit-box-shadow: 0 0 0 rgba(0,0,0,.3), inset 0 1px 0px rgba(255,255,255,.4);
    -moz-box-shadow: 0 0 0 rgba(0,0,0,.3), inset 0 1px 0px rgba(255,255,255,.4);
    box-shadow: 0 0 0 rgba(0,0,0,.3), inset 0 1px 0px rgba(255,255,255,.4);*/
    -webkit-box-shadow: 0 0 0 rgba(0,0,0,.3), inset 0 1px 0 rgba(0,0,0,.4);
       -moz-box-shadow: 0 0 0 rgba(0,0,0,.3), inset 0 1px 0 rgba(0,0,0,.4);
            box-shadow: 0 0 0 rgba(0,0,0,.3), inset 0 1px 0 rgba(0,0,0,.4);
    background-color: #099650;
}

section#kontakt h2 {
    font-size: 1.7em;
    margin-bottom: 25px;
    color: #fff;
}

section#kontakt h4 {
    font-size: 1.125em;
    color: #fff;
    letter-spacing: 0.05em;
}

section#kontakt {
    background-color: #1e91b7;
    color: #fff;
}

section#kontakt p {
    color: #fff;
    margin-top: 1em; 
}

section#kontakt .small {
    font-size: 0.8em;
}

/* section#kontakt form input.failed, section#kontakt form textarea.failed { border: 1px solid #dd0000; } */
section#kontakt form label.failed { color: #18c46e; }
section#kontakt p.error { font-weight: bold; color: #18c46e; }
section#kontakt p.confirm { font-weight: bold; color: #18c46e; }

input[type="text"],
input[type="password"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="month"],
input[type="week"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="time"],
input[type="url"],
textarea {
    border: 0;
    -webkit-box-shadow: inset 0 2px 0px rgba(000,000,000,.25);
    -moz-box-shadow: inset 0 2px 0px rgba(000,000,000,.25);
    box-shadow: inset 0 2px 0px rgba(000,000,000,.25); 
    -webkit-backface-viability: hidden;   
}
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
textarea:focus{
    border: 0;
    -webkit-box-shadow: inset 0 3px 0px rgba(000,000,000,.25);
    -moz-box-shadow: inset 0 3px 0px rgba(000,000,000,.25);
    box-shadow: inset 0 3px 0px rgba(000,000,000,.25);    
}

footer#main-footer {
    font-size: 1em;
    color:#fff;
    margin-top: 2em;
    margin-bottom: 1.25em;
    font-weight: 300;
    text-align: center;
}

footer#main-footer .bold-blue{
    font-weight: 400;
    color: #1e91b7;
}

/* ==========================================================================
   Icons / Buttons
   ========================================================================== */

.icon, .sprite {
    background: url(../img/sprite.png) left top no-repeat;
}
.icon {
    display: inline-block;
    vertical-align: middle;
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/*
 * Hide from both screenreaders and browsers
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders
 */

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

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix */


.clearfix:before
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * extended clearfix for IE 6/7 only
 */

.clearfix {
    *zoom: 1;
}
/* centering */

.text-center, .content-center { text-align: center; }

.vertical-center:before {
  content: "";
  display: inline-block;
  height: 100%; 
  margin-left: -.32em; 
  vertical-align: middle;
 }
 
.text-center .centered, .content-center .centered, .vertical-center .centered {
    width: 100%;    
    display: inline-block;
}
.vertical-center .centered {
    vertical-align: middle;
}


/* Helper class to highlight undefined content like layout images or dummy text */

.lorem {
    color: fuchsia !important;
}

/* Debug class and Debug Monitor styles */

.debug { border: 1px solid #d66; background: rgba(221,102,102,.20); }
.debugMonitor {
    position: fixed;
    left: 0;
    top: 0;
    padding: 10px;
    color: white;
    background: rgba(0,0,0,0.5);
    z-index: 200;
}
.lt-ie9 .debugMonitor { background: #000; }

/* pos rel */
.relative { position: relative; }
.absolute { position: relative; }

.sticky {
    position: fixed !important;
}

/* Remove iOS form input zoom */
select:focus,
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"] { font-size: 16px; }


/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (min-width: 35em) { /* >= 560px */

}

@media only screen and (max-width: 40em) { /* < 641px */

}

@media only screen and (min-device-width : 20em) and (max-device-width : 30em) and (orientation : landscape) {  /* 320x480px */
   
    .start a {
        background-size: 35px !important;
        width: 35px !important;
        height: 35px !important;
    }

    #mobile-nav {
        top: 10px;
    }

    a {
        font-size: 0.75em;
    }

    h2 {
        font-size: 1.5em;
    }

    p {
        font-size: 0.625em;
        letter-spacing: 0.09em;
    }

    p.introtext {
        font-size: 0.625em;
        margin-bottom: 2.2em;
    }
    
    section#manager {
       padding-top: 2em;
       padding-bottom: 1.5em;
    }
    section#manager .icons {
        margin: 1em auto !important;
    }

    section#manager .icons.iMac {
        background-size: 150px !important;
        width: 150px !important;
        height: 150px !important;
    }

    section#manager .icons.pencil {
        background-size: 150px !important;
        width: 150px !important;
        height: 150px !important;
    }

    section#manager .icons.briefcase {
        background-size: 150px !important;
        width: 150px !important;
        height: 150px !important;
    }

    section#kontakt .intro{
        margin-bottom: 2em;
    }

    section#kontakt{
        padding-top: 2em;
        padding-bottom: 2em;
    }

    section#kontakt label {
        font-size: 0.625em;
    }
    
    section#kontakt input{
        height: 2em;
        margin-bottom: 0em;
    }

    section#kontakt textarea {
        height: 5em;
    }

    section#kontakt h2 {
        font-size: 1em;
    }

    section#kontakt h4 {
        font-size: 0.750em;
    }

    section#kontakt .small {
        font-size: 0.5em;
    }

    section#kontakt .button {
        padding: 1em 1.1em 1em 3.5em;
        font-size: 12px;
        margin-top: 1.8em;
    }
    
    footer#main-footer {
        margin-top: 2em;
    }

    footer#main-footer p{
        margin-bottom: 1em;
    }

    footer#main-footer p a{
        font-size: 1em;
    }

@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : landscape) { /* STYLES GO HERE */}

}

@media only screen and (min-width: 40.063em) { /* >= 641px */
    header#hero {
        background: url(../img/desktop.jpg) no-repeat;
        background-size: cover;
        height: 700px;
        position: relative;
    }
    header#hero.subpage {
        background: none;
        height: auto;
    }

    .start {
        padding: 1.9em 0;
    }
    .start a {
        display: block;
        background: url(../img/starticon.png) no-repeat center;
        width: 49px;
        height: 49px;
    }

    .logo {
        display: block;
    }

    /* Navigation */
    nav#main-nav {
        padding: 0;
        background-color: rgba(30,145,183,.85);
        -webkit-transition: all .2s ease-out;
        -moz-transition: all .2s ease-out;
        transition: all .2s ease-out;
    }

    nav#main-nav ul {
        display: block;
        text-align: right;
        padding-top: 0;
    }
    nav#main-nav ul li {
        display: inline-block;
    }
    nav#main-nav ul li a {
        font-family: 'Roboto', sans-serif;
        font-weight: 400;
        color: #fff;
        text-decoration: none;
        padding: 2.8em 1.5em;
        display: block;
    }
    nav#main-nav ul li a:hover {
        background-color: rgba(255,255,255,.2);
    }

    nav#main-nav .start_button {
        background-color: none;
    }

    #mobile-nav {display: none;}


    /* Scroll Button */
    .scroll-btn {
        text-align: center;
        width: 100%;
        position: absolute;
        top: -34px;
    }
    .btn.scroll {
        background: #1e91b7 url(../img/arrow-down.png) no-repeat center;
        border-radius: 50%;
        padding: 2em;
        display: inline-block;
    }

    /* Sections */

    section#manager {
        position: relative;
    }

    section#manager p {
        margin top: auto;
        margin-bottom: 4em;
    }
    section#manager.subtext p {
        margin-bottom: 2em;
    }
    section#manager p.introtext {
        color: #333;
        font-size: 1.1em;
        font-weight: 400;
        margin-bottom: 4em;

    }

    section#manager .icons {
        margin-bottom: 80px;
        margin-left: 2.9em;
        margin-top: auto;
    }

    section#manager, section#kontakt {
        padding: 6em 0;
        word-wrap: break-word;
    }

    section#manager h2 {
        margin-bottom: 70px;
        line-height: 0;
        font-size: 3.125em;
        letter-spacing: 0.01em;

    }

    section#kontakt .small {
        font-size: 0.8em;
    }

    section#kontakt .intro {
        text-align: center;
        margin-bottom: 4em;
    }

    section#kontakt label {
        font-weight: 300;
        font-size: 16px;
        margin-bottom: 7px;
        color: #fff;
    }

    section#kontakt input, section#kontakt textarea {
        border-radius: 6px;
    }

    section#kontakt textarea {
        height: 14.9em;
    }

    section#kontakt .button {
        background: #18c46e url(../img/ico-mail.png) no-repeat 20px center;
        float: right;
        border-radius: 6px;
        -webkit-box-shadow: 0 2px 0 rgba(0,0,0,.15), inset 0 1px 0px rgba(225,225,225,.3);
        -moz-box-shadow: 0 2px 0 rgba(0,0,0,.15), inset 0 1px 0px rgba(255,255,255,.3);
        box-shadow: 0 2px 0 rgba(0,0,0,.15), inset 0 1px 0px rgba(255,255,255,.3);
        padding: .7em 1.4em .7em 3.8em;
        font-weight: 300;
        font-size: 16px;
        width: auto;
        margin-top: auto;
    }

    section#kontakt h2 {
        font-size: 2.5em;
        margin-bottom: 25px;
        color: #fff;
    }

    section#kontakt h4 {
        font-size: 1.4em;
        color: #fff;
        letter-spacing: 0.05em;
    }

    section#kontakt {
        background-color: #1e91b7;
        color: #fff;
    }

    section#kontakt p {
        color: #fff;
        margin-top: auto
    }

    footer#main-footer {
        text-align: left;
    }
}

@media only screen and (min-width: 48.063em) { /* >= 769px */

}

@media only screen and (min-width: 64.063em) { /* >= 1025px */

}

@media only screen and (min-width: 80em) { /* >= 1280px */

}

@media only screen and (min-width: 90em) { /* >= 1440px */    

}

/* Style adjustments for high resolution devices */
@media print, (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) {
    .sprite, .icon {
        background-size: 400px 400px;
        background-image: url(../img/sprite@2x.png);
    }

    .start a {
        background: url(../img/starticon@2x.png) no-repeat center;
        background-size: 49px 49px;
        width: 49px;
        height: 49px;
    }

    section#manager .icons.iMac {
        background: url(../img/iMac@2x.png) no-repeat center;
        background-size: 201px 201px;
        width: 201px;
        height: 201px;
    }

    section#manager .icons.pencil {
        background: url(../img/pencil@2x.png) no-repeat center;
        background-size: 200px 200px;
        width: 200px;
        height: 200px;
    }

    section#manager .icons.briefcase {
        background: url(../img/briefcase@2x.png) no-repeat center;
        background-size: 200px 200px;
        width: 200px;
        height: 200px;
    }

    section#kontakt .button {
        background: #18c46e url(../img/ico-mail@2x.png) no-repeat 100px center;
        background-size: 27px 18px;
   
    }

    .btn.scroll {
        background: #1e91b7 url(../img/arrow-down@2x.png) no-repeat center;
        background-size: 32px 30px;
    }
}

/* ==========================================================================
   Print styles
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group;
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}