/*    
    ---------------------------------------------------------------------------------------------
    Basics
    ---------------------------------------------------------------------------------------------

    Definitions: ColorScheme
    Base color          --> #03b2f5    [search & replace]
    Link color          --> #046f98
    Active Menu Bar     --> #32c6ff


*/

@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,700,300,600,800,400);

body, html{
        font-family: Open Sans, sans-serif;
        text-rendering: optimizeLegibility !important;
        -webkit-font-smoothing: antialiased !important;
        color: #5b5b5b;
        /*height: 99%;
        width: 100%;*/
        overflow-x: hidden; /*hor.scrollbar unterdrücken*/
}

* {margin:0px; padding:0px}

.color{
        color: #03b2f5;
}


.content{
        position: relative;
        padding: 10% 0 0;
}

.content h1{
         color: #FFFFFF;
}


/* Typography----------------------------- */
h1{
        margin:  0;
}

h1 strong{
        font-weight: 900;
}

h2{
        line-height: 20px;
        margin:  0;
}

h3{
        font-size: 18px;
        font-weight: 900;
}

h4{
        margin:  0;
}

h5{
        font-weight: 700;
        line-height: 20px;
}


/*links----------------------------*/
a{
        color: #046f98;                         /* color of links*/
}

a:hover,
a:focus{
        text-decoration: none;
        color: #03b2f5;
}




/*Section title------------------------*/

.section-title hr{
        border-color: #03b2f5;
        border-width: 4px;
        width: 60px;
        float: left;
        clear: both;
}

.section-title.center{
        padding: 30px 0;
}

.section-title h2,
.section-title.center h2{
        font-weight: 300;
}


.section-title.center .line{
        border-top: 4px solid #03b2f5;
        height: 10px;
        width: 60px;
        text-align: center;
        margin: 0 auto;
        margin-top: 20px;
}


.section-title.center hr {
        border-top: 4px solid rgba(4, 111, 152, 0.8);           /* line No2 section title*/
        /*border-top: 4px solid rgba(252, 172, 69, 0.40);*/
        width: 40px;
        text-align: center;
        margin-top: 10px;
        position: relative;
        left: 20%;
}





/*Sonstiges------------------------*/
p{
        font-family: 'Open Sans', sans-serif;
}


ul, ol{
        padding: 0;
}

.clearfix:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
     }

.clearfix {
    display: inline-block;
}
* html .clearfix {
    height: 1%; }
.clearfix {
    display: block; }


.spacer{
        margin-top: 40px;
}


.run-animation {
  -webkit-animation: my-fancy-animation 5s 1;
  -moz-animation:    my-fancy-animation 5s 1;
  animation:         my-fancy-animation 5s 1;
}


/*
    --------------------------------------------------------------------------------------------
    top-header
    --------------------------------------------------------------------------------------------
*/
#top-header {
    color: #a1a1a1;
    background-color:#000;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 130px;
}

#top-header a {
    color: #a1a1a1;
}



/*
    --------------------------------------------------------------------------------------------
    Navigation
    --------------------------------------------------------------------------------------------
*/
#section-menu {
        padding: 20px;
        transition: all 0.8s;
}
#section-menu.navbar-default {
        background-color: rgba(248, 248, 248, 0);
        border-color: rgba(231, 231, 231, 0);
}
#section-menu a.navbar-brand {
        font-size: 22px;
        color: #fff;
        font-weight: 900;
}

#section-menu.navbar-default .navbar-nav > li > a {
        text-transform: uppercase;
        color: #FFF;
        font-size: 12px;
        letter-spacing: 1px;
}
.on {
        background-color: #222222 !important;
        padding: 0 !important;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
        color: #32c6ff !important;                  /* color of navbar active*/
        background-color: transparent;
        font-weight: 700;
}

.navbar-toggle {
        border-radius: 0;
        }
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
        background-color: #4bdc04;
        border-color: #4bdc04;
        }
.navbar-default .navbar-toggle:hover>.icon-bar {
        background-color: #FFF;
        }





/*
    --------------------------------------------------------------------------------------------
    Home - Title & Picture
    --------------------------------------------------------------------------------------------
*/

/*styles for home section with Carousel*/
#section-home-carousel {
        background-color: #222;
        color: #cfcfcf;
        height:  1200px;  /* wichtig: damit die cover-divs die richtige Höhe haben*/

        z-index:-1;
}

background-carousel{
        position:fixed;
            width:100%;
            height:100%;
            z-index:-1;
}

.carousel,
.carousel-inner {
            width:100%;
            height:100%;
            z-index:0;
            overflow:hidden;
}


.carousel-inner .item {
            width:100%;
            height:100%;
            background-position:center center;
            background-size:cover;
            z-index:0;
        transition: all 0.9s;
}

.item {
            width:100%;
            height:100%;
            background-position:center center;
            background-size:cover;
            z-index:0;
        transition: all 0.9s;
}

#section-home-carousel .overlay_gradient_light{
        background: linear-gradient(to bottom,  rgba(0,0,0,0.6) 0%,rgba(0,0,0,0.4) 10%,rgba(0,0,0,0.2) 15%,rgba(0,0,0,0.0) 20%); /*  W3C */
        background-attachment: fixed;
        height: 95%;
        position:absolute;
            z-index:1 !important;
        top: 0;
        left: 0;
            min-width:100%;
            min-height:100%;
}


#section-home-carousel p.lead{
        color: #FFFFFF;
}



/*styles for home section with static picture*/
#section-home{
        background: url(../img/title.jpg);
        background-size: cover;
        background-position: center;
        background-attachment: fixed;
        background-repeat: no-repeat;
        background-color: #222;
        color: #cfcfcf;
        height: 100%;  /* wichtig: damit die cover-divs die richtige Höhe haben*/
}


#section-home .overlay_gradient_light{
        background: linear-gradient(to bottom,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.6) 10%,rgba(0,0,0,0.2) 35%,rgba(0,0,0,0.0) 100%); /* W3C */
        background-attachment: fixed;
        height: 750px;
}

#section-home .overlay_gradient_dark{
        background: linear-gradient(to bottom,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* W3C */
        background-attachment: fixed;
        height: 750px;
}

#section-home .overlay_pattern{
        background-color: rgba(44, 62, 80, 0.2);
        background-image: url("../img/pattern.png");
        background-repeat: repeat;
        background-size: cover;
        background-attachment: fixed;
        height: 100%;
        width: 100%;
        left: 0;
        top: 0;
        position: relative;
        z-index: 0;
}



#section-home p.lead{
        color: #FFFFFF;
}



a.fa.fa-angle-down,  a.fa.fa-angle-double-down {
        padding: 10px 15px;
        color: #fff;
        border: 2px solid #b4b4b4;
        border-radius: 50%;
        font-size: 24px;
        margin-top: 200px;
        transition: all 0.5s;
}
a.fa.fa-angle-down:hover, a.fa.fa-angle-double-down:hover{
        background: #03b2f5;
        color: #ffffff;
        border: 2px solid #fff;
}





/*
    --------------------------------------------------------------------------------------------
    About  & _BIGPicture
    --------------------------------------------------------------------------------------------
*/
#section-about{
        padding: 80px 0;
}

#section-about_BIGPicture{
        background: url(../img/1.jpg);
        background-size: cover;
        background-position: center;
        background-attachment: fixed;
        background-repeat: no-repeat;
        color: #ffffff;
        padding: 80px 0;
        height: 750px;
}

.about-text {
        background: #fff;
        color:  #5b5b5b;
        padding: 20px 20px 20px 20px;
}




/*
    --------------------------------------------------------------------------------------------
    Work_BIGPicture
    --------------------------------------------------------------------------------------------
*/

#section-work_BIGPicture{
        background: url(../img/2.jpg);
        background-size: cover;
        background-position: center;
        background-attachment: fixed;
        background-repeat: no-repeat;
        color: #ffffff;
        padding: 80px 0;
        height: 750px;
}

.BIGPicture-text {
        background: #fff;
        color:  #5b5b5b;
        padding: 20px 20px 20px 20px;
}




/*
    --------------------------------------------------------------------------------------------
    Team
    --------------------------------------------------------------------------------------------
*/
#section-team{
        background: url(../img/3.jpg);
        background-size: cover;
        background-position: center;
        background-attachment: fixed;
        background-repeat: no-repeat;
        color: #ffffff;
}
#section-team .overlay{
        background: linear-gradient(to bottom,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* W3C */
        height: auto;
        background-attachment: fixed;
        padding: 80px 0;
}


img.img-circle.team-img {
        width: 200px;
        height: 200px;
        border: 1px solid white;
        transition: all 0.5s;
}


/*
    --------------------------------------------------------------------------------------------
    Services
    --------------------------------------------------------------------------------------------
*/
#section-services{
        padding: 80px 0;
}

#section-services i.fa {
        font-size: 40px;
        border: 3px solid #03b2f5;
        width: 100px;
        height: 100px;
        padding: 27px 25px;
        margin-bottom: 10px;
        border-radius: 50%;
        transition: all 0.5s;
}




/*
    --------------------------------------------------------------------------------------------
    Partner
    --------------------------------------------------------------------------------------------
*/
#section-partner{
        background: url(../img/2.jpg);
        background-size: cover;
        background-position: center;
        background-attachment: fixed;
        background-repeat: no-repeat;
        color: #ffffff;
}
#section-partner .overlay{
        background: linear-gradient(to bottom,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* W3C */
        height: auto;
        background-attachment: fixed;
        padding: 80px 0;
}


/*
    --------------------------------------------------------------------------------------------
    Call-to-action
    --------------------------------------------------------------------------------------------
*/
#section-call-to-action{
        background-color: #5b5b5b;  /*grau*/
        color: #fff;
}
#section-call-to-action_with_background{
        /* mit Hintergrundbild*/
        background: url(../img/02.jpg);
        background-size: cover;
        background-position: center;
        background-attachment: fixed;
        background-repeat: no-repeat;

        background-color: #5b5b5b;  /*grau*/
        color: #fff;
}
#section-call-to-action .overlay, #section-call-to-action_with_background .overlay{
        background: linear-gradient(to bottom,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* W3C */
        height: auto;
        background-attachment: fixed;
        padding: 80px 0;
}



/*
    --------------------------------------------------------------------------------------------
    Work Gallery
    --------------------------------------------------------------------------------------------
*/
#section-work{
        padding: 80px 0;
}

.gallery-item{
        margin-bottom: 17px;
        margin-top: 0px;
        margin-left: 0px;
        margin-right: 0px;
        width: 100%;
}

.gallery-item .gallery-hover-bg{
        height: 100%;
        width:100%;
        overflow: hidden;
        position: relative;
}

.gallery-hover-bg .gallery-text {
        position: absolute;
        text-align: center;
        margin: 0 auto;
        padding: 25% 0;
        color: #ffffff;
        background: rgba(0, 0, 0, 0.75);
        height: 100%;
        width: 100%;
        opacity: 0;
        transition: all 0.5s;
}

.gallery-hover-bg:hover .gallery-text{
        opacity: 1;
}









/*
    --------------------------------------------------------------------------------------------
    Template Sections <empty>
    --------------------------------------------------------------------------------------------
*/

/* !!!! id="section-white" */
#section-white{
        background-color: #fff;  /*weiss*/
        padding: 80px 0;
}
/* !!!! class="section-white" */
.section-white{
        background-color: #fff;  /*weiss*/
        padding: 80px 0;
}


#section-dark{
        background-color: #5b5b5b;  /*grau*/
        color: #fff;
}
#section-dark .overlay{
        background: linear-gradient(to bottom,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* W3C */
        height: auto;
        background-attachment: fixed;
        height: 100%;
        padding: 80px 0px 80px 0px;
}




/*
    --------------------------------------------------------------------------------------------
    Carousel News
    --------------------------------------------------------------------------------------------
*/
.carousel-inner .item img {
        width:100%;
        height:100%;
}
.carousel-inner {
        width:100%;
        height:100%;
}
.item .thumbnail {
        margin-bottom:0;
}
.carousel-control.left, .carousel-control.right {
        background-image:none !important;
}
.carousel-control {
        background:        #ddd;
        color:#999;
        padding: 4px 0;
        width:26px;
        top:auto;
        left:auto;
        bottom:0;
        opacity:1;
        text-shadow:none;
}
.carousel-control.right {
        right:10px;
}

.carousel-control.left {
        right: 40px;
}
#myCarousel{
		height:750px;
        width:100%;    
}

/*
    --------------------------------------------------------------------------------------------
    Contact & Map
    --------------------------------------------------------------------------------------------
*/

#section-contact{
        padding: 80px 0;
        background-color: #f6f6f6;
}

#section-map{
        padding: 80px 0;
}




label {
        float: left;
        font-size: 12px;
        font-weight: 400;
        font-family: 'Open Sans', sans-serif;
}
#section-contact .form-control {
        display: block;
        width: 100%;
        padding: 6px 12px;
        font-size: 14px;
        line-height: 1.42857143;
        color: #555;
        background-color: #fff;
        background-image: none;
        border: 1px solid #ccc;
        border-radius: 2px;
        -webkit-box-shadow: none;
        box-shadow: none;
        -webkit-transition: none;
        -o-transition: none;
        transition: none;
}

#section-contact .form-control:focus {
        border-color: inherit;
        outline: 0;
        -webkit-box-shadow: transparent;
        box-shadow: transparent;
}

button.btn.tf-btn.btn-default {
        float: right;
        background: #FCAC45;
        border: 0;
        border-radius: 0;
        padding: 10px 40px;
        color: #ffffff;
        text-transform: uppercase;
}

.btn:active, .btn.active {
        background-image: none;
        outline: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
}

.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
        outline: thin dotted;
        outline: none;
        outline-offset: none;
}



/*Dunkler Bildschirm bei Mailversand Kontaktform ("loading...") */
#Sendmail_Shade {
   display: none;
   position: fixed; z-index: 1000;
   top: 0%; left: 0%;
   width: 100%; height: 100%;
   background-color: black;
   opacity: .8;
}




/*
    --------------------------------------------------------------------------------------------
    trailteam
    --------------------------------------------------------------------------------------------
*/
#section-trailteam{
        background-color: #fff;  /*weiss*/
        padding: 80px 0;
}




/*
    --------------------------------------------------------------------------------------------
    Footer
    --------------------------------------------------------------------------------------------
*/
nav#footer{
        background: #222222;
        color: #ffffff;
        padding: 20px 0 15px 0;
}
nav#footer .fnav{
        vertical-align: middle;
}
ul.footer-social li{
        display: inline-block;
        margin-right: 10px;
}
nav#footer p{
        font-size: 12px;
        margin-top: 10px;
}
#footer i.fa {
        height: 30px;
        width: 30px;
        border: 2px solid #8c8c8c;
        font-size: 20px;
        padding: 4px 5px;
        border-radius: 50%;
        color: #8c8c8c;
        transition: all 0.5s;
}
#footer i.fa:hover {
        background: #03b2f5;
        border-color: #03b2f5;
        color: #ffffff;
}

#footer a {
        color: #03b2f5;
}