﻿body{
    padding-top: 50px;
    /*padding-bottom: 20px;*/
    background-position: center top;
    background-repeat: repeat-y;
    background-attachment: fixed;
    background-size: 100%;
    background-position-x:center;
    min-height:650px
}
.body-content {
    width:100%;
    padding:0 15px;
}
h1, h2, h3, h4{
    /*color:white;*/
}

input{
    height:30px;
}
input[type=text], input[type=password]{
    /*font-size:1.2em!important;*/
    /*font-size:1.2em;*/
    margin: 0 10px;
    /*padding: 0 10px;*/

}

footer{
    background-color:#F5F5F5;
    opacity:0.9;
    margin-top:10px;
    padding:15px;
}
.color-content {
    background-color: #F5F5F5;
}
.page-content{
    /*border:solid thin #ff0000;*/
    background-color:#F5F5F5;
    opacity:0.9;
    /*margin-top:0;*/
    padding:10px;
}
.header-content{
    background-color:#F5F5F5;
    opacity:0.9;
    /*font-size:0.8em;*/
    /*margin: 0 0 10px 0;*/
    padding:10px;
}
.header-content-bereich{
    background-color:#2c77ba; 
    color:#F5F5F5; 
    min-height:30px; 
    font-size:1.2em; 
    vertical-align:middle;
    /*background-color:#F5F5F5;*/
    opacity:0.9;
    padding:2px 2px 2px 10px;
    margin-bottom:10px;
}

/************************************************************
ClassEigenschaften für das Anzeigen der Coupons
************************************************************/

.coupon-outer-wrapper{
    background-color:#2c77ba;
    opacity:0.9;
    /*padding:10px;*/
    min-height:200px;
}
.coupon-content{

}
.coupon-header{
    font-size:1.8em;
    background-color:#58B3F0;
    /*padding:0 10px;
    margin:0 0 10px 0;*/
}
.coupon-code-wrapper{
    font-size:1em;
    text-align:center;
}
.coupon-code-header {
    font-size:1.8em;
    background-color:#58B3F0;
    /*padding:0 10px;
    margin:0 0 10px 0;*/
    /*text-align:center;*/
}

.coupon-code-text {

}

/*#navbar-app {
    background-color: #2c77ba;
    opacity:0.8;
    border-color: none;
    border: 0;
    box-shadow: none;
    z-index: 999;
    -webkit-font-smoothing: antialiased;
    -webkit-transition: background .5s ease-in-out, opacity .5s ease;
    -moz-transition: background .5s ease-in-out, opacity .5s ease;
    transition: background .5s ease-in-out, opacity .5s ease;
}
#navbar-app .navbar-brand {
  color: #CCCCCC;
}
#navbar-app .navbar-brand:hover,
#navbar-app .navbar-brand:focus {
  color: #FFFFFF;
}
#navbar-app .navbar-text {
  color: #CCCCCC;
}
#navbar-app .navbar-nav > li > a {
  color: #CCCCCC;
}
#navbar-app .navbar-nav > li > a:hover,
#navbar-app .navbar-nav > li > a:focus {
  color: #FFFFFF;
  background-color: transparent;
}
#navbar-app .navbar-nav > .active > a,
#navbar-app .navbar-nav > .active > a:hover,
#navbar-app .navbar-nav > .active > a:focus {
  color: #FFFFFF;
  background-color: #e7e7e7;
}
#navbar-app .navbar-nav > .disabled > a,
#navbar-app .navbar-nav > .disabled > a:hover,
#navbar-app .navbar-nav > .disabled > a:focus {
  color: #cccccc;
  background-color: transparent;
}
#navbar-app .navbar-toggle {
  border-color: #dddddd;
}
#navbar-app .navbar-toggle:hover,
#navbar-app .navbar-toggle:focus {
  background-color: #dddddd;
}
#navbar-app .navbar-toggle .icon-bar {
  background-color: #cccccc;
}
#navbar-app .navbar-collapse,
#navbar-app .navbar-form {
  border-color: #e6e6e6;
}
#navbar-app .navbar-nav > .dropdown > a:hover .caret,
#navbar-app .navbar-nav > .dropdown > a:focus .caret {
  border-top-color: #FFFFFF;
  border-bottom-color: #FFFFFF;
}
#navbar-app .navbar-nav > .open > a,
#navbar-app .navbar-nav > .open > a:hover,
#navbar-app .navbar-nav > .open > a:focus {
  color: #FFFFFF;
  background-color: #666666;
}
#navbar-app .navbar-nav > .open > a .caret,
#navbar-app .navbar-nav > .open > a:hover .caret,
#navbar-app .navbar-nav > .open > a:focus .caret {
  border-top-color: #2c77ba;
  border-bottom-color: #555555;
}
#navbar-app .navbar-nav > .dropdown > a .caret {
  border-top-color: #2c77ba;
  border-bottom-color: #CCCCCC;
}
#navbar-app .navbar-link {
  color: #CCCCCC;
}
#navbar-app .navbar-link:hover {
  color: #2c77ba;
}
#navbar-app.affix {
    top: 0;
    min-width: 100%;
    background-color: darkred;
    opacity: 0.9;
    -webkit-transition: background .5s ease-in-out, opacity .5s ease;
    -moz-transition: background .5s ease-in-out, opacity .5s ease;
    transition: background .5s ease-in-out, opacity .5s ease;
}*/



@media (max-width: 768px) {
  /*#navbar-app{
    background-color:#555555;
}
  #navbar-app .navbar-nav > .open > a .caret,
  #navbar-app .navbar-nav > .open > a:hover .caret,
  #navbar-app .navbar-nav > .open > a:focus .caret {
  border-top-color: #2c77ba;
  border-bottom-color: #555555;
}
  #navbar-app .navbar-nav .open .dropdown-menu > li > a {
    color: #CCCCCC;
    background-color:#555555
  }
  #navbar-app .navbar-nav .open .dropdown-menu > li > a:hover,
  #navbar-app .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #DDDDDD;
    background-color: #555555;
  }
  #navbar-app .navbar-nav .open .dropdown-menu > .active > a,
  #navbar-app .navbar-nav .open .dropdown-menu > .active > a:hover,
  #navbar-app .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #FFFFFF;
    background-color: #555555;
  }
  #navbar-app .navbar-nav .open .dropdown-menu > .disabled > a,
  #navbar-app .navbar-nav .open .dropdown-menu > .disabled > a:hover,
  #navbar-app .navbar-nav .open .dropdown-menu > .disabled > a:focus {
    color: #cccccc;
    background-color:  #555555;
  }*/
}

@media (min-width:991px){
}
/* Responsive: Portrait tablets and up */
@media screen and (min-width: 768px) {
    .body-content {
        /*padding: 0;*/
    }
}

@media (min-width: 300px) and (max-width:767px) {
    body{
        background-image:url(/App_Themes/Image/hintergrund600px.jpg);
    }
    input{
        /*height:30px;*/
    }
    .dxic input{
        /*font-size:1.2em !important;*/
    }
    .coupon-header{
        font-size:1.5em;
    }
}
@media (min-width: 768px) and (max-width:1019px) {
    body {
        background-image: url(/App_Themes/Image/hintergrund1000px.jpg);
    }
    /*#navbar-app .dropdown-menu {
        border-radius: 0;
        border: none;
        border-top: 5px solid transparent;
        -webkit-box-shadow: none;
        box-shadow: none;
        padding-top: 0;
    }
    #navbar-app .container {
        padding-top: 5px;
        padding-bottom: 5px;
        -webkit-transition: padding-top .5s ease, padding-bottom .5s ease;
        -moz-transition: padding-top .5s ease, padding-bottom .5s ease;
        transition: padding-top .5s ease, padding-top .5s ease, padding-bottom .5s ease;
    }
    #navbar-app.affix {
        top: 0;
        min-width: 100%;
        background-color: #333333;
        opacity: 0.9;
        -webkit-transition: background .5s ease-in-out, opacity .5s ease;
        -moz-transition: background .5s ease-in-out, opacity .5s ease;
        transition: background .5s ease-in-out, opacity .5s ease;
    }*/
}
@media (min-width: 1020px) and (max-width:1199px) {
    body{
        background-image:url(/App_Themes/Image/hintergrund1200px.jpg);
    }
}
@media (min-width: 1200px) and (max-width:1599px) {
    body{
        background-image:url(/App_Themes/Image/Hintergrund1600px.jpg);
    }
}
@media (min-width: 1600px) and (max-width:1899px) {
    body{
        background-image:url(/App_Themes/Image/hintergrund1900px.jpg);
    }
}
@media (min-width: 1900px) {
    body{
        background-image:url(/App_Themes/Image/hintergrund1900px.jpg);
    }
}

/* Die Breiten für Bootstrap sind wie folgt festgelegt
   --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
*/
/* Der Bootstrapbereich xs*/
@media (min-Widht: 0px){
    /* Festlegung der */

}
/* Der Bootstrapbereich sm*/
@media (min-Widht: 576){

}
/* Der Bootstrapbereich md*/
@media (min-Widht: 7680px){

}
/* Der Bootstrapbereich lg*/
@media (min-Widht: 992px){

}
/* Der Bootstrapbereich xl*/
@media (min-Widht: 1200px){

}
