/**
 * @copyright 2015 MarkCon
 * @link http://www.markcon.hu
 */

@CHARSET "UTF-8";

/*  ----------  FONTS  ----------  */

    @import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic&subset=latin,latin-ext);
    @import url(https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,300italic,700&subset=latin,latin-ext);
    @import url(https://fonts.googleapis.com/css?family=PT+Sans:400,400italic,700,700italic&subset=latin-ext,latin);
    @import url(https://fonts.googleapis.com/css?family=PT+Sans+Narrow:400,700&subset=latin,latin-ext);

/*  ----------  GENERAL  ----------  */

    html {
        overflow-x: hidden;
    }

    body {
        background-color: #f5f5f5;
        font-size: 14px;
        font-family: 'PT Sans', 'Arial', 'Verdana';
        line-height: 1;
        /*overflow-x: hidden;*/
    }

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

    h2 {
        text-transform: uppercase;
        font-family: 'PT Sans Narrow';
        font-weight: normal;
        font-size: 64px;
        line-height: 1.05em;
        color: #fb783e;
        text-align: center;
        margin: 0;
    }


    h2 .Subtitle {
        display: block;
        font-size: 26px;
        line-height: 1em;
    }

    h3 {
        text-transform: uppercase;
        font-family: 'PT Sans Narrow';
        font-weight: bold;
        font-size: 34px;
        color: #fb783e;
        margin: 0;
        line-height: 1.05em;
    }

    h4 {
        text-transform: uppercase;
        font-family: 'PT Sans Narrow';
        font-size: 26px;
        line-height: 1.15em;
        font-weight: normal;
        margin: 1em 0;
    }

    .TextOrange { color: #fb783e; }
    .TextYellow { color: #fba63e; }
    .TextBlue { color: #42b3e5; }
    .TextLightBlue { color: #0ec0bf; }
    .TextGreen { color: #1ce4ae; }
    .TextWhite { color: #fff; }

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

    .Clearfix:before, .Clearfix:after {
        display: table;
        content: " ";
        clear: both;
    }

    /* Responsive */
    @media (max-width: 991px) {
        h2 {
            font-size: 48px;
        }

        h2 .Subtitle {
            font-size: 20px;
        }
    }

    @media (max-width: 767px) {
        h2 {
            font-size: 32px;
        }

        h2 .Subtitle {
            font-size: 16px;
        }
    }

/*  ----------  CONTAINER  ----------  */

    .Container:before, .Container:after, .ContainerFluid:before, .ContainerFluid:after,
    .Row:before, .Row:after,
    .Col-100:before, .Col-100:after, .Col-SM-100:before, .Col-SM-100:after {
        display: table;
        content: " ";
        clear: both;
    }

    .Container, .ContainerFluid {
        padding-right: 15px;
        padding-left: 15px;
        margin-right: auto;
        margin-left: auto;
    }

    @media (min-width: 768px) {
        .Container { width: 750px; }
    }
    @media (min-width: 992px) {
        .Container { width: 970px; }
    }
    @media (min-width: 1200px) {
        .Container { width: 1170px; }
    }

    .Row {
        margin-right: -15px;
        margin-left: -15px;
    }

    .Column {
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
        float: left;
    }

    .Col-XS-100 { width: 100%; }
    .Col-XS-75 { width: 75%; }
    .Col-XS-70 { width: 70%; }
    .Col-XS-60 { width: 60%; }
    .Col-XS-50 { width: 50%; }
    .Col-XS-40 { width: 40%; }
    .Col-XS-30 { width: 30%; }
    .Col-XS-25 { width: 25%; }
    .Col-XS-20 { width: 20%; }
    .Col-XS-15 { width: 15%; }
    .Col-XS-10 { width: 10%; }

    @media (min-width: 768px) {
        .Col-SM-100 { width: 100%; }
        .Col-SM-75 { width: 75%; }
        .Col-SM-70 { width: 70%; }
        .Col-SM-60 { width: 60%; }
        .Col-SM-50 { width: 50%; }
        .Col-SM-40 { width: 40%; }
        .Col-SM-33 { width: 33.33%; }
        .Col-SM-30 { width: 30%; }
        .Col-SM-25 { width: 25%; }
        .Col-SM-20 { width: 20%; }
        .Col-SM-15 { width: 15%; }
        .Col-SM-10 { width: 10%; }
    }

    @media (min-width: 992px) {
        .Col-MD-75 { width: 75%; }
        .Col-MD-70 { width: 70%; }
        .Col-MD-50 { width: 50%; }
        .Col-MD-40 { width: 40%; }
        .Col-MD-33 { width: 33.33%; }
        .Col-MD-30 { width: 30%; }
        .Col-MD-25 { width: 25%; }
        .Col-MD-20 { width: 20%; }
    }

    @media (min-width: 1200px) {
        .Col-100 { width: 100%; float: none; }
        .Col-75 { width: 75%; }
        .Col-70 { width: 70%; }
        .Col-50 { width: 50%; }
        .Col-30 { width: 30%; }
        .Col-25 { width: 25%; }
        .Col-20 { width: 20%; }
    }

/*  ----------  FIXED BAR  ----------  */

    #fixedBar {
        position: fixed;
        left: 0;
        top: 25%;
        z-index: 10;
        width: 100%;
        left: -100%;
        -moz-transition: all 0.5s;
        -webkit-transition: all 0.5s;
        -o-transition: all 0.5s;
        -ms-transition: all 0.5s;
        transition: all 0.5s;
    }

    #fixedBar.Open {
        width: 100%;
        position: absolute;
        z-index: 1000;
        left: 0;
    }

    #fixedBar .BarButton {
        display: block;
        width: 68px;
        height: 85px;
        background-color: rgba(33,222,181,0.5);
        position: absolute;
        z-index: 1;
        background-image: url("image/icon/contact.png");
        background-repeat: no-repeat;
        background-position: 6px 12px;
        left: 100%;
    }

    #fixedBar.Open .BarButton {
        height: 100%;
        background-color: rgba(33,222,181,1);
        left: 0;
    }

    #fixedBar .BarContent {
        width: 100%;
        padding: 0 102px;
        background: #fff;
        position: relative;
        top: 0;
        box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.1);
    }

    #fixedBar.Open .BarContent {
        display: block;
        opacity: 1;
    }

    #fixedBar .Contact {
        padding-top: 34px;
        padding-bottom: 34px;
        max-width: 100%;
    }

    #fixedBar .Contact h3 {
        font-size: 36px;
        font-weight: bold;
        color: #1ce4ae;
        margin-bottom: 0.6em;
    }

    #fixedBar .Contact p {
        font-size: 26px;
        color: #1ce4ae;
        font-family: 'PT Sans Narrow', 'Arial', 'Verdana';
        line-height: 1.1em;
    }

    #fixedBar .Contact ul li {
        font-family: 'PT Sans Narrow', 'Arial', 'Verdana';
        font-size: 26px;
        text-transform: uppercase;
        color: #3a9ecb;
        line-height: 48px;
        margin: 30px 0;
        padding-left: 54px;
        position: relative;
        cursor: pointer;
    }

    #fixedBar .Contact ul li .Icon {
        display: block;
        width: 44px;
        height: 48px;
        background-image: url("../Global/image/hexagon-blue.png");
        background-repeat: no-repeat;
        background-position: center;
        position: absolute;
        left: 0;
        top: 0;
    }

    #fixedBar .Contact ul li .Icon:after {
        content: " ";
        position: absolute;
        width: 100%;
        height: 100%;
        background-repeat: no-repeat;
        background-position: center;
    }

    #fixedBar .Contact ul li.Error .Icon:after {
        background-image: url("image/icon/error.png");
    }

    #fixedBar .Contact ul li.Obscene .Icon:after {
        background-image: url("image/icon/obscene.png");
    }

    #fixedBar .Contact ul li.Question .Icon:after {
        background-image: url("image/icon/question.png");
    }

    #fixedBar .Contact ul li.Selected .Icon {
        background-image: url("../Global/image/hexagon-red.png");
    }

    #fixedBar .Contact ul li.Selected {
        color: #e46e4e;
    }

    #fixedBar .Contact .Form .InputWrapper {
        margin: 14px 0;
    }

    #fixedBar .Contact .Form .InputWrapper label {
        display: block;
        font-size: 26px;
        color: #1ce4ae;
        font-family: 'PT Sans Narrow', 'Arial', 'Verdana';
        text-transform: uppercase;
        line-height: 1.2em;
        padding: 0 10px;
    }

    #fixedBar .Contact .Form .InputWrapper input[type="text"] {
        height: 82px;
        border: 1px solid rgba(28,228,174,0.6);
        font-size: 26px;
    }

    #fixedBar .Contact .Form .InputWrapper.send {
        text-align: right;
        margin-top: 28px;
    }

    #fixedBar .Contact .Form .InputWrapper.send button {
        margin: 0;
        text-align: left;
        background-image: url("../Global/Input/image/button-arrow-fw.png");
    }

    #fixedBar .Contact .Form ul {
        margin: 7px 0;
    }

    #fixedBar .Contact .Form ul li {
        font-size: 26px;
        text-transform: none;
        color: #e46e4e;
        line-height: 1.2em;
        margin: 0;
        padding-left: 0px;
        cursor: default;
    }

    #fixedBar .Message {
        width: auto;
        margin: 20px auto;
        font-size: 22px;
        border-radius: 3px;
        line-height: 22px;
        padding: 10px;
        color: #fff;
    }


    #fixedBar .Message.Success {
        border: 1px solid #8affdf;
        background-color: #1ce4ae;
    }

    #fixedBar .Message.Error {
        background-color: #e60d0d;
        border: 1px solid #b40000;
    }

    @media (max-width: 768px) {
        #fixedBar {
            display: none;
        }
    }

/*  ----------  JCAROUSEL  ----------  */

    .Jcarousel {
        position: relative;
        overflow: hidden;
    }

    .Jcarousel >ul {
        width: 20000em;
        position: relative;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .Jcarousel > ul > li {
        float: left;
    }

    .JcarouselControl {
        position: absolute;
        top: 50%;
        display: block;
        width: 47px;
        height: 102px;
        -moz-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        text-decoration: none;
        text-indent: -9999px;
        overflow: hidden;
        background-repeat: no-repeat;
        z-index: 20;
    }

    .JcarouselControl.Inactive {
        opacity: 0;
    }

    .JcarouselControl:after {
        content: " ";
        position: absolute;
        width: 18px;
        height: 43px;
        background-repeat: no-repeat;
        top: 50%;
        -moz-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        opacity: 0.6;
    }

    .JcarouselControl:hover:after {
        opacity: 1;
    }

    .JcarouselControl.Next {
        right: 0px;
        background-image: url("image/carousel-control-next.png");
    }

    .JcarouselControl.Next:after {
        background-image: url("image/carousel-control-arrow-next-white.png");
        left: 17px;
    }

    .JcarouselControl.Prev {
        left: 0px;
        background-image: url("image/carousel-control-prev.png");
    }

    .JcarouselControl.Prev:after {
        background-image: url("image/carousel-control-arrow-prev-white.png");
        right: 17px;
    }

    .JcarouselPagination {
        position: absolute;
        bottom: 48px;
        left: 50%;
        -moz-transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
    }

    .JcarouselPagination a {
        display: block;
        float: left;
        width: 22px;
        height: 22px;
        background-color: #fff;
        border-radius: 50%;
        margin: 0 11px;
        text-decoration: none;
        text-indent: -9999px;
        overflow: hidden;
        opacity: 0.3;
    }

    .JcarouselPagination a:hover {
        opacity: 0.6;
    }

    .JcarouselPagination a.Active {
        opacity: 1;
    }

/*  ----------  MESSAGES  ----------  */

    .Message {
        margin: 1em 0;
        font-size: 18px;
        line-height: 1.2em;
        padding: 22px;
        border-radius: 3px;
        position: relative;
        padding-left: 42px;
        min-height: 64px;
    }

    .Message:after {
        content: "";
        position: absolute;
        width: 44px;
        height: 48px;
        left: -22px;
        top: 10px;
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
    }

    .Message .Title {
        font-weight: bold;
        text-transform: uppercase;
    }

    .Message .Description {
        margin-top: 0.5em;
    }

    .Message.Notice {
        background-color: rgba(66,179,229,0.15);
        border: 1px solid rgb(66,179,229);
        color: #3a9ecb;
    }

    .Message.Notice:after {
        background-image: url("image/message-notice.png");
    }

