@charset "utf-8";
/* CSS Document */
/* fonts */
@import url('../fonts/stylesheet.css');
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300);

/* site */
* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    outline: none;
}

html {
    min-height: 100%;
    height: 100%;
}

body {
    width: 100%;
    min-height: 100%;
    height: 100%;

    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    color: #000000;

    -webkit-font-smoothing: antialiased;

}

ul, li {
    list-style: none;
}

a {
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    color: #000000;
    text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
    display: block;
    font-weight: normal;
}

#qLoverlay {
    padding-top: 100px;
}

#qLoverlay h1 {
    display: block;
    width: 320px;
    margin: 0 auto;

    font-family: bebas_neuebold;
    font-size: 66px;
    color: #444444;
    text-align: center;

}

#qLoverlay h2 {
    display: block;
    width: 320px;
    margin: 0 auto;

    font-family: bebas_neuebold;
    font-size: 15px;
    color: #cccccc;
    text-align: center;

}

header {
    position: fixed;
    top: 0;
    display: none;
    width: 100%;
    height: 104px;
    background: #000000;

    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}

header .header-wr {
    position: relative;
    display: block;
    max-width: 960px;
    margin: 0 auto;
}

header .h1 {
    display: block;
    width: 320px;
    margin-left: 320px;
    padding-top: 10px;

    font-family: bebas_neuebold;
    font-size: 66px;
    color: #ffffff;
    text-align: center;

    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;

}

header h2 {
    display: block;
    width: 320px;
    margin-left: 320px;

    font-family: bebas_neuebold;
    font-size: 15px;
    color: #ffffff;
    text-align: center;

}

header nav {
    position: absolute;
    top: 120px;

    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

header nav ul {
    display: block;
    width: 960px;
    margin: 0 auto;
}

header nav ul li {
    display: inline-block;
    margin: 0 40px;
    font-family: bebas_neuebold;
    font-size: 25px;
    color: #000000;

    cursor: pointer;

    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;

}

header nav ul li.current {
    color: #cccccc;
}

header#page-header nav ul li.backLava {
    left: 40px;
    /*background: url(../img/backLava.png) center no-repeat;*/
    margin: 0 -15px;

    z-index: 100;

}

header.ps {
    height: 68px;

}

header.ps .h1 {

    width: 200px;
    margin-left: 0px;
    font-size: 40px;
    text-align: left;

}

header.ps h2 {
    display: none;
}

header.ps nav {
    top: 0px;
    left: 260px;
}

header.ps nav ul {

    padding-top: 20px;
}

header.ps nav ul li {
    margin: 0 15px;
    color: #ffffff;
}

header.ps nav ul li.current {
    color: #444444;
}

/* ------ [ section ] ------ */

section {
    display: none;
    min-height: 800px;

    border-top: 1px solid #444444;
}

#home {
    padding-top: 200px;

}

#home .s1 {
    display: block;
    max-width: 960px;
    margin: 0 auto 50px auto;

}

#home .s1 img {
    display: block;
    max-width: 100%;

}

#home .s2 {

    text-align: center;

    font-family: bebas_neuebold;
    font-size: 20px;
    color: #000000;

}

#aboutme {

    padding-top: 67px;

}

#aboutme .photos {

    display: block;
    margin-bottom: 50px;

}

#aboutme .photos img {
    display: block;
    max-width: 100%;
}

#aboutme h2 {
    display: block;
    margin-bottom: 20px;

    font-family: bebas_neuebold;
    font-size: 35px;
    color: #000000;
}

#aboutme .content {
    display: block;

    font-family: 'Open Sans', sans-serif;
    font-size: 15px;
    color: #000000;
}

#expertise {
    padding-top: 120px;
}

#expertise h2 {
    display: block;
    margin-bottom: 50px;

    font-family: bebas_neuebold;
    font-size: 35px;
    color: #000000;
}

#expertise .ex {

    display: block;
    padding-left: 220px;
    margin-bottom: 40px;
}

#expertise .ex h3 {

    display: block;
    margin-bottom: 15px;

    font-family: bebas_neuebold;
    font-size: 18px;
    color: #000000;

}

#expertise .ex ul {

    display: block;
    margin-bottom: 120px;

}

#expertise .ex ul li {
    display: block;
    margin-bottom: 3px;
    padding-left: 25px;

    font-size: 14px;

    background: url("../img/bg-07.png") 12px 6px no-repeat;

}

#expertise .ex.e1 {
    background: url("../img/bg-06.jpg") left top no-repeat;
}

#expertise .ex.e2 {
    background: url("../img/bg-05.jpg") left top no-repeat;
}

#expertise .ex.e3 {
    background: url("../img/bg-04.jpg") left top no-repeat;
}

#expertise .ex.e4 {
    background: url("../img/bg-03.jpg") left top no-repeat;
}

#services {
    padding-top: 120px;
}

#services h2 {
    display: block;
    margin-bottom: 50px;

    font-family: bebas_neuebold;
    font-size: 35px;
    color: #000000;
}

#services .srv {

    display: block;
    padding-left: 220px;
    padding-bottom: 40px;
    margin-bottom: 40px;
}

#services .srv h3 {

    display: block;
    margin-bottom: 30px;

    font-family: bebas_neuebold;
    font-size: 18px;
    color: #000000;

}

#services .srv p {
    display: block;
    font-size: 14px;
}

#services .srv.s1 {
    background: url("../img/bg-10.jpg") left top no-repeat;

}

#services .srv.s2 {
    background: url("../img/bg-09.jpg") left top no-repeat;

}

#services .srv.s3 {
    background: url("../img/bg-08.jpg") left top no-repeat;

}

#services .srv.s4 {
    background: url("../img/bg-21.svg?v=2") left top no-repeat;

}

#services .srv p a {
    font-weight: bold;
}

#contactme {
    padding-top: 120px;
}

#contactme h2 {
    display: block;
    margin-bottom: 50px;

    font-family: bebas_neuebold;
    font-size: 35px;
    color: #000000;
}

/* ------ [ general ] ------ */

.g960 {
    display: block;
    width: 960px;
    margin: 0 auto;
}

span.reverse {
    unicode-bidi: bidi-override;
    direction: rtl;
}

/* ------ [ media queries ] ------ */

@media only screen and (min-width: 320px) {

    /* Small screen, non-retina */

}

@media only screen and (-webkit-min-device-pixel-ratio: 2)      and (min-width: 320px), only screen and (   min--moz-device-pixel-ratio: 2)      and (min-width: 320px), only screen and (     -o-min-device-pixel-ratio: 2/1)    and (min-width: 320px), only screen and (        min-device-pixel-ratio: 2)      and (min-width: 320px), only screen and (                min-resolution: 192dpi) and (min-width: 320px), only screen and (                min-resolution: 2dppx)  and (min-width: 320px) {

    /* Small screen, retina, stuff to override above media query */

}

@media only screen and (min-width: 700px) {

    /* Medium screen, non-retina */

}

@media only screen and (-webkit-min-device-pixel-ratio: 2)      and (min-width: 700px), only screen and (   min--moz-device-pixel-ratio: 2)      and (min-width: 700px), only screen and (     -o-min-device-pixel-ratio: 2/1)    and (min-width: 700px), only screen and (        min-device-pixel-ratio: 2)      and (min-width: 700px), only screen and (                min-resolution: 192dpi) and (min-width: 700px), only screen and (                min-resolution: 2dppx)  and (min-width: 700px) {

    /* Medium screen, retina, stuff to override above media query */

}

@media only screen and (min-width: 1300px) {

    /* Large screen, non-retina */

}

@media only screen and (-webkit-min-device-pixel-ratio: 2)      and (min-width: 1300px), only screen and (   min--moz-device-pixel-ratio: 2)      and (min-width: 1300px), only screen and (     -o-min-device-pixel-ratio: 2/1)    and (min-width: 1300px), only screen and (        min-device-pixel-ratio: 2)      and (min-width: 1300px), only screen and (                min-resolution: 192dpi) and (min-width: 1300px), only screen and (                min-resolution: 2dppx)  and (min-width: 1300px) {

    /* Large screen, retina, stuff to override above media query */

}

#mon {
    position: fixed;

    background: #ffffff;
    z-index: 5;
}