body, html {min-height: 100%; min-width: 100%;}

body{
    color: #262626;
    position: relative;
  /*  -webkit-tap-highlight-color: transparent;*/
}


li:hover, .btn:hover, .btn-default:hover { /*-webkit-tap-highlight-color: transparent;*/ background:transparent;background-color:transparent;background-image:none;}
footer{position:sticky;}

.full-bg, .carousel-item{
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #fff;
}
.portfolio {width:240px; height:160px;display:block; } 
.portfolio img {width:100%; height:100%; } 


.portfolio a {
  display: inline-block;
  margin: 10px 10px 0 0;
}

.portfolio a:last-of-type {
  margin-right: 0;
}

.portfolio a img {
  vertical-align: top;
}

.detailpage {width:30%; height:100%; background: rgba(255,255,255,.8);}


.imgBox {display:block;}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
/*
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
  -webkit-tap-highlight-color: transparent;
}*/
input[type="button" i], input[type="submit" i], input[type="reset" i], 
input[type="file" i]::-webkit-file-upload-button, button {background-color:transparent;/*-webkit-tap-highlight-color: transparent;*/} 


/*.filters-container  { font-size: 18px;text-tranform:uppercase; text-align:center;margin: 1em auto 2em;}*/
.filters-buttons-container {
  /*  -webkit-background-color:transparent;*/
    background-image:none;
    background-color:transparent;
    border:none;
  /*  padding:5px10px;*/
    margin:30px auto 30px; 
    text-align:center; 
    text-transform:uppercase;
}
.filters-buttons-container:after {
    content: " ";
    visibility: hidden;
    display: block;
    height: 0;
    clear: both;

} 

.filters-buttons-group{
    -webkit-appearance: value;
    -moz-appearance:    value;
    appearance:         value;
    font-size: 0;
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: left;
    display: inline-block;
    background-image:none;
 }

.filters-buttons-group>li{
    display: inline-block;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
    -webkit-appearance: value;
    -moz-appearance:    value;
    appearance:         value;      
    background-image:none;
  /*  font-weight: 400;
    color: #212529;*/
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-background-color:transparent;
    background-color: transparent;
    border:0solid transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
   
    
}

.filters-buttons-group>li:last-child{
    margin-right: 0 !important;
}

.filters-buttons-group>li .filter-button{
    -webkit-box-sizing: content-box ; /* Safari/Chrome, other WebKit */
       -moz-box-sizing: content-box ;    /* Firefox, other Gecko */
            box-sizing: content-box ;         /* Opera/IE 8+ */

    vertical-align: top;
    border: 0 none;
    display: inline;
    cursor: pointer;
    color: #6C6C6C;
    font-size: 15px;
    height: 38px;
    line-height: 38px;
    text-decoration: none;
    margin: 0;
    padding: 0 15px;
    -webkit-background-color:transparent;
    background-color: transparent;
    background-image:none;
    -webkit-border-radius: 0;
       -moz-border-radius: 0;
            border-radius: 0;

    -webkit-transition: border .1s;
       -moz-transition: border .1s;
         -o-transition: border .1s;
        -ms-transition: border .1s;
            transition: border .1s;
     -webkit-appearance: value;
     -moz-appearance:    value;
     appearance:         value;      
  }

.filters-buttons-group>li .filter-button:hover{
    text-decoration: none;
    border: 0 none;
  }

.filters-buttons-group>li .filter-button .selected,.filters-buttons-group>li .filter-button .active, .filters-buttons-group>li .filter-button:active,.filters-buttons-group>li .filter-button:hover{
    background: transparent; 
    color: #3D3D3D ;
    background-image:none;
  }
.filters-buttons-group>.filter-button { -webkit-background-color:transparent; background-color:transparent; color:#6C6C6C;}
.filters-buttons-group>.filter-button:hover, .filters-buttons-group>.filter-button .active, .filters-buttons-group>.filter-button:active,
.filters-buttons-group>.li:hover, .filters-buttons-group>.li .active, .filters-buttons-group>.li:active {
   -webkit-background-color:transparent;
   background-color:transparent;
   background-image:none;
   color: #3D3D3D; 
   font-weigth:bold; 
}

.filter-button {
  border: none;
  outline: none;
  padding: 12px 16px;
  -webkit-background-color:transparent;
  background-color: transparent;
  cursor: pointer;
  background-image:none;

}

.filters-button, .filters-button:hover, 
.filters-button:active, .filters-button:focus {
  -webkit-background-color:transparent; 
  -webkit-background:transparent;
  background:transparent;
  background-color:transparent; 
  background-image:none;
  
}


/*
.projectView {max-height:260px;}
.projectView img {max-height:320px;}*/

  .projectView{
    position: relative;
    overflow: hidden;
    width: 100%;
  }
  
  /* Hack to center the image */
  .projectView div[data-width][data-height]{
    position: relative;
    overflow: hidden;
  }
  .projectView div[data-width][data-height] img{
    position: absolute;
    top:-100%; left:0; right: 0; bottom:-100%;
    margin: auto;
  }
  /* End Hack */
  
  /* fill-height instead of the width */
  .projectView .media-box-fill-height[data-width][data-height] img{
    top: 0 !important; 
    left: -100% !important; 
    right: -100% ; 
    bottom: 0 ;
    min-width: 100% ;
    width: auto ;
    max-width: none;
    height: 100%;
  }

  .projectView  img{
    width: 100%;
    max-width: 100%;
    display: block;
  }
  
  .projectView img{
    max-width: 100%;
    -webkit-transform: translate3D(0, 0, 0);
       -moz-transform: translate3D(0, 0, 0);
        -ms-transform: translate3D(0, 0, 0);
         -o-transform: translate3D(0, 0, 0);
            transform: translate3D(0, 0, 0);
  }

.projTitel {
   position: absolute;
   z-index:52;
   font-size:14px;
   font-weight:normal;
   margin-top:79px; 
   background-color:#fff;
   padding:10px 18px;
   color:#3E0100;
   z-index:20;
}



.targets:after {
    content: '';
    display: inline-block;
    width: 100%;
}
.detailpage {position:relative; left:10px; top:120px; color:#fff;}



.gallery_project
{
    margin-bottom: 30px;
}

.thumbnail {margin-bottom:6px;}

.carousel-control.left,.carousel-control.right{
  background-image:none;
  margin-top:10%;
  width:5%;
}

/* Target Elements
---------------------------------------------------------------------- */



.imgBox {
    display: inline-block;
    vertical-align: top;
}

.imgBox {
    background: #fff;
   
    margin-bottom: 1rem;
    position: relative;
}

.imgBox:before {
    content: '';
    display: inline-block;
    padding-top: 0;
}




.container{padding:10px;min-width:320px;}
.imgBox{
  display:block;
  padding:0;
  margin:0 0 30px;
}
.imgBox img{
  width:270px;
  height:auto;
  
}

.targets:after {
    content: '';
    display: inline-block;
    width: 100%;
}


.hiddenText {display: none !important;}

.normal-height{border-bottom: 0 none;}
.full-height {border-bottom: 0 none} 

.left-padding{padding-left:15px;}
body #2{overflow-y:hidden;}
#myCarousel{overflow-y:hidden;}
/*
.main-menu-btn{
  top:25px;
  right:-10px;
  padding:20px;
  background-color: transparent;
  border: thin solid;
}
#main-menu{margin-top:15px; background-color:rgba(255,255,255,.9);}
.mainnav {background-color:transparent !important;}
.mainnav {background:transparent!important;}
*/
.page-title  {margin: 105px 0 0 ;}
.hidden {display:none;}

.fancyboxMB-button--play,
.fancyboxMB-button--fsenter,
.fancyboxMB-button--thumbs {display:none;}


footer {
  background: rgba(255,255,255,.9) !important;
  height: 50px;
  width: 100%;
  display: block;
  z-index:2000;
  position:fixed;
  right:0;
  bottom:0;
  color:#202020;
  text-align: right;
}
.footerContent{position:relative;}
footer > a{ color:#202020;}
.header{
  width: 100%;
  height:90px;
  
  z-index:5000;
  background-color:rgba(255,255,255,.9);
}
/*#Portfolio .header {position:fixed; top:0;} 
#Portfolio.navbar-brand {padding-left:10px;}
#Startseite .header, #Startseite .carousel {position:absolute;top:0;}
#HOME .header, #HOME .carousel  {position:absolute;top:0;}*/
 
.frame .frame-default .frame-type-header > header {position:relative;}

#Startseite.header, #HOME.header, #Profil.header, #Portfolio.header, #Presse.header, #Kontakt.header, #Datenschutz.header,#Impressum.header{position:fixed !important;}
/* #Startseite header, #HOME header, #Profil header, #Portfolio header, #Presse header, #Kontakt header, #Datenschutz header,#Impressum header{position:fixed !important;} */
.full-height{position:fixed !important; top:-10px;}

#presse > .page-title,#presse.page-title, #presse > h1  {margin: 24px 0 0 15px !important; padding-left:10px;}
#profil > .page-title {margin: 24px 0 0 -15px !important;}
/*
#Profil header, #Portfolio header, #Presse header,#Kontakt header, #Datenschutz header,#Impressum header{margin-top:-20px;}
#Startseite header, #HOME header {margin-top:-20px;position: fixed;}*/
#Startseite .carousel, #HOME .carousel {position: absolute;top:0;}
.portfolio-gallery {margin-top:76px;}

.carousel-indicators{display:none;}
.image {
  opacity: 1;
  display: block;
  width: 100%;
  height: auto;
  transition: .5s ease;
  backface-visibility: hidden;
}
.carousel-indicators{display:none;}
.middle {
  transition: .5s ease;
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}
.carousel-control-next-icon, .carousel-control-prev-icon {
  position:fixed;
  top:50vh;
  height: 60px;
  width:45px;
}
.carousel-control-next-icon {
  background-image: url("../Images/slider_arrow_right.svg");
 
}
.carousel-control-prev-icon {
    background-image: url("../Images/slider_arrow_left.svg");
    
    
}
.carousel-control-prev, .carousel-control-next {width:20%;}

@media screen and (min-width: 640px){
  .carousel-control-prev, .carousel-control-next {width:12%;}
}


*, *:before, *:after{
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing:border-box;
  box-sizing: border-box;
}

.pageheader {display:table;min-height: 40px;} 

.main-title{
  color: #2d2d2d;
  text-align: center;
  text-transform: capitalize;
  padding: 0.7em 0;
}




.container .title{
  color: #1a1a1a;
  text-align: center;
  margin-bottom: 10px;
}



/*-------------------------- CROME --------------------------------*/


/* #main>.container-home>.row {margin-top:0; margin-bottom:0px;}*/
a, a:hover{color:#3d0400;}
a, p > a, .mail{color: #3e0100 !important;}
a:hover ,p > a:hover, a:focus, p>a:focus{color: #3e0100; text-decoration:underline;}
.container.mna{padding-left:20px;padding-right:20px;}
.row{margin-left:-15px;}

h1, h2, h3, h4, h5, h6{text-transform:uppercase;font-weight: 600;}
h1, h2, h3{font-size:24px;}
.h1, .h2, .h3, h1, h2, h3{margin-bottom: 12px;margin-top:26px;font-weight: 600;}
.h1, .h2, .h3, h1, h2, h3, p{color:#3d0400;}
h1,h2{margin-top:0;padding-top:0;}
p {font-family: 'Open Sans';font-style: normal;font-size:14px;line-height:23px; }
strong {font-family: 'Open Sans';font-weight: 600;}
h1,.h1{font-size:24px;}

/* Google Map  */
.googlemap{
    margin-top:30px;
    margin-right:15px;
}
header .container {margin-top:0;}
header .row{margin-top:0;margin-bottom:0;padding-top:0;padding-bottom:0;}

@media screen and (min-width: 768px) {
 /* .specialnavmobile{display:none;}
  .specialnav {display:block;}*/
  /*.main-menu-btn {display:none;}*/
}

@media screen and (max-width: 767px) {
 /* .specialnavmobile{display:block}
  .specialnav {display:none;}
  */
  .page-title{text-align:left;}
}

#carousel .flex-direction-nav .flex-prev.flex-disabled  , #carousel .flex-direction-nav .flex-next.flex-disabled {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    display: none;
    height: 0;
    width: 0;
}

.selected img{border:3px solid #000;}





a:focus, a:active {outline:none;}

.row:after {
  content: "";
  display: table;
  clear: both;
}

.content {
  background-color: white;
  padding: 10px;
}

.targets:after {
    content: '';
    display: inline-block;
    width: 100%;
}

.modal-full {min-widtn:100%;min-height:100%;position:fixed;top:0;left:0;}

  .carousel-control-prev, .carousel-control-next {
    font-size: 2em;
    top: auto;
    opacity: 1;
    bottom: -52px;
    
  }
  
  .carousel-control-next-icon,  .carousel-control-prev-icon {
    height: 40px;
    width: 30px;
  }
  
    .carousel-control-prev-icon {
     left:0;
    }
    .carousel-control-next-icon {
     right:0;
    }  
 
/* Controls
---------------------------------------------------------------------- */

.controls {
    padding: 1rem;
    background: transparent;
    font-size: 15px;
    text-align:center;
    display:block;
    width:100%;
    margin: 100px auto 50px;
    list-style: none;
}
.controls ul {list-style:none; }
.controls li {float:left; margin: 0 5px;}
.controls li:marker {display:none;}
.controls a, .controls a:hover {text-decoration:none; }
.control {
    position: relative;
   /*  display: inline-block;
    background: #444;*/
    cursor: pointer;
    font-size: 15px;
    color: #838383;
    transition: background 150ms;
    padding: 10px 20px;
}

.control:hover {
    font-weight: bold;
}

.control[data-filter]:after {
    content: '';
    position: absolute;

    background: transparent;
    transition: background-color 150ms, border-color 150ms;
}

.control[data-sort]:after {
    content: '';
    position: absolute;
    width: 10px;
    height: 10px;
    border-top: 2px solid;
    border-left: 2px solid;
    top: calc(50% - 6px);
    left: calc(50% - 6px);
    transform:  translateY(1px) rotate(45deg);
}

.control[data-sort*=":desc"]:after {
    transform:  translateY(-4px) rotate(-135deg);
}

.control:first-of-type {
    border-radius: 3px 0 0 3px;
}

.control:last-of-type {
    border-radius: 0 3px 3px 0;
}

.control[data-filter] + .control[data-sort] {
    margin-left: .75rem;
}

.portfoliocard .card {max-width:360px; max-height:240px;/*width:100%;height:100%;*/position:relative;background-color:#f1f1f1;}

/* The Modal (background) */
.modal {
  display: none;
  position: fixed;
  z-index: 1055;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
/* background-color: #E4E4E4;*/
}
.modal-backdrop{background-color:#f2f2f2;}
.modal-dialog {max-width:100vw;width:100vh;height:100%;}
.modal-body {border:0 none; background-color: transparent;padding:0;}
.modal-full {width:100vw;height:100vh;margin:0;padding:0;background-position:center;background-repeat:no-repeat;background-size:cover;}
.modal-header .close {padding: .45rem 0;margin:0.3rem 0 0 0;}
.modal-header .close .mobileX {font-size:14px;}
.modal-header .close .deskX {display:none !important;}
.modal-header {border:0 none;border-radius:0; padding:0;width:100%;height:1px;}
.modal-header h4{font-size:14px;font-weight:normal;margin-top:86px; background-color:#fff;padding:10px 18px;color:#3E0100;z-index:20;}
.modal-header p {text-shadow:none;min-width:300px;}

.modal .carousel-item{
background-size: 100%;
background-position-x: 50%, center;

}

.modal-footer{display:none;}
.modal-inner {
     height:100vh !important;
 }
/* Modal Content */
.modal-content {
  position: relative;
  border:0 none;
  border-radius:0 none;
  box-shadow:none;
/* background-color: #fefefe;*/
  margin: auto;
  padding: 0;
  width: 100vw;
 /* max-width: 1200px;*/
}

/* The Close Button */
button.close {
  color: #fff;
  background-color:#3E0100 ;
  padding:10px 18px;
  position: absolute;
  top: 85px;
  right: 0;
  font-size: 14px;
  font-weight: 400;
  z-index:20;
  text-shadow:none;
}
button.close span, button.close p{margin:0;padding:0;color:#fff; }
.close {opacity: 1;}
.close:hover,
.close:focus {
  color: #999;
  text-decoration: none;
  cursor: pointer;
  opacity: 0.5;
}
button.close.mobileX {
font-size: 20px;
padding-right:16px;
padding-left:23px;
margin-right:0;
}
button.close.mobileX span{
text-align:center;
}

button.close.deskX {display:none} 
   



.mySlides {
  display: none;
}

.cursor {
  cursor: pointer;
}

/* carousel */
.modal.carousel-control {
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  position: absolute;
  top: 50%;
  margin-top: -22px;
  bottom: inherit;
  width: 45px;
  height: 45px;
  background: #777;
}
.modal.carousel-control:hover {
  background: #6a6a6a;
}
.modal.carousel-control.left, .carousel-control.right { background-image: none;}
.modal.carousel-control .fa { line-height: 45px;}
.modal.carousel-indicators { bottom: -90px;}
.modal.carousel-indicators > li {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
  opacity: 0.5;
  background-color: #fff;
}
.modal.carousel-indicators > li.active {
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
}

  /*---Firefox Bug Fix --*/
.modal.carousel-item { 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
    width: 100vw;
  height: 100vh;
  background-repeat: no-repeat;
  background-position: center center;
  position: fixed;
  
  transition: -webkit-transform 0.5s ease;
  transition: transform 0.5s ease;
  transition: transform 0.5s ease, -webkit-transform 0.5s ease;
  -webkit-backface-visibility: visible;
  backface-visibility: visible;  
}   
  
.modal.carousel-item img {
  max-height: 100vh; 
  object-fit: cover;
}


.overlay-image {
  display: block;
  width: 100%;
/*  height: 100%; */
}

.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: auto;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
   
    background-color:rgba(56,16,22, .8);
}
.overlay-container {position: relative; width: 100%; margin-bottom:30px;}
.overlay-container:hover .overlay {
  opacity: 1;
}
.overlay h4 {font-weight:400;}
.overlay-text {
  color: white;
  font-size: 16px;
  font-weight:400;
  position: absolute;
  bottom: 5px;
  left: 50%;
  width:80%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: left;
}
 


.prev,
.next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
  background-color: rgba(0, 0, 0, 0.8);
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}
.overlay-container {
  overlay: hidden;
}


.overlay-container img {
  margin-bottom: 0;
}

.overlay-container img:hover {
   transform: scale(1.02);
}
.caption-container {
  text-align: center;
  background-color: black;
  padding: 2px 16px;
  color: white;
}


img.hover-shadow {
  transition: 0.3s;
}

.hover-shadow:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}


/*  breadcrumb + searchbox */
.breadcrumb{
    width:auto;
    float: left;
}

.searchbox {
    float: right;
    width: 15%;
}

.country-selection > li > a {
  font-size: 12px;
}


@media only screen and (min-width: 320px) {
.filters-buttons-container, .filters-buttons-container:hover,.filters-buttons-container:active,.filters-buttons-container:focus,
.filters-buttons-group,.filters-buttons-group:hover,.filters-buttons-group:active,.filters-buttons-group:focus,
.filters-buttons-group.btn,.filters-buttons-group.btn:hover,.filters-buttons-group.btn:active,.filters-buttons-group.btn:focus,
.filters-buttons-group.btn-default,.filters-buttons-group.btn-default:hover,.filters-buttons-group.btn-default:active,.filters-buttons-group.btn-default:focus,
.filters-buttons-group.filter-button,.filters-buttons-group.filter-button:hover,.filters-buttons-group.filter-button:active,.filters-buttons-group.filter-button:focus{background:#fff;background-color:#fff;background-image:none;background:#fff;}
ul#main-menu {background-color:#fff;top:-1px; }
.filters-buttons-container > li, 
.filters-buttons-container > .btn-default,
.filters-buttons-container > .filter-button,
.filters-buttons-container > li:hover, 
.filters-buttons-container > .btn-default:hover,
.filters-buttons-container > .filter-button:hover,
.filters-buttons-group > li,
.filters-buttons-group > .btn-default,
.filters-buttons-group > .filter-button,
.filters-buttons-group > li:hover,
.filters-buttons-group > .btn-default:hover,
.filters-buttons-group > .filter-button:hover {
   
   background-color:transparent;
 /*  -webkit-background-image:linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1)); 
   background-image:linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1)); 
   -webkit-background:#fff;
   background:#fff;*/}
}
 
@media screen and (max-width:379px){
  body{padding-left:0;padding-right:0;}
  .mobileX {display:block;}
  .deskX {display:none;}
  .carousel-inner {min-height:0; min-width:0;}
  .modal .carousel-item { background-size:100%;}
  .main-menu-btn {right: -4px;}
  .projTitel {max-width:50%;}
  .container {padding: 0 10px;}
  footer .metanav {margin-right:10px;}
  :lang(de) ul#main-menu {width:95%;top:9px;background-color:#fff;}
  :lang(fr) ul#main-menu {width:95%;top:9px;background-color:#fff;}  
}



@media screen and (max-width:400px){
 /* ul#main-menu {width:95% !important;margin-top:13px!important;}*/
  :lang(de) ul#main-menu {width:95%;top:-1px;background-color:#fff;}
  :lang(fr) ul#main-menu {width:95%;top:-1px;background-color:#fff;} 
  .specialnavmobile {}
  .topbar{margin-top:10px;margin-right:10px;}
  
}
@media screen min-width:401px) and (max-width:480px){
  :lang(de) ul#main-menu {width:95%;top:0;background-color:#fff;}
  :lang(fr) ul#main-menu {width:95%;top:0;background-color:#fff;} 
  
}
@media screen min-width:481px) and (max-width:520px){  
    body{padding-left:0 !important;padding-right:0 !important;} 
  :lang(de) ul#main-menu {width:69%;top:0;background-color:#fff;}
  :lang(fr) ul#main-menu {width:69%;top:0;background-color:#fff;} 
}
@media screen min-width:521px) and (max-width: 640px){
  .container{
    display: block;
    width: 100%;
  }
  :lang(de) ul#main-menu {width:55%;top:-1px;background-color:#fff;}
  :lang(fr) ul#main-menu {width:55%;top:-1px;background-color:#fff;} 
}

@media screen min-width:641px) and (max-width:767px){
  body{padding-left:0 !important;padding-right:0 !important;}
  #myCarousel{margin-top: 155px;}    
  footer {bottom:0;}
  .carousel-inner {min-height:0;} 
  .mobile{margin-top:0;}
  .sm-simple {
      background: #fff none repeat scroll 0 0;
      border: 1px solid #bbbbbb;
      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
  } 
  .wrapper > footer .container {
    padding: 30px 15px;
    min-width: 480px;
    min-width: -moz-min-content;
  }
/*  .specialnav .nav > li > a:focus, .specialnav .nav > li > a:hover,
  .specialnavmobile{margin-top:14%;right:-67px;}*/
  .specialnavmobile .nav > p > a:focus, .specialnavmobile .nav > p > a:hover,, .specialnavmobile .nav > p,
  .specialnavmobile {margin-top:-224px;right:-15px; position:relative;}
  .specialnav{top:-300px;}
  :lang(de) ul#main-menu {width:55%;top:-1px;background-color:#fff;}
  :lang(fr) ul#main-menu {width:55%;top:-1px;background-color:#fff;}  
  .topbar{margin-top:10px;margin-right:10px;}
}
@media screen min-width:768px) and (max-width:800px){
  :lang(de) ul#main-menu {width:55%;top:-1px;background-color:#fff;}
  :lang(fr) ul#main-menu {width:55%;top:-1px;background-color:#fff;} 
  .topbar{margin-top:0;margin-right:0;}
}
@media screen min-width:820px) and (max-width:1024px){
  :lang(de) ul#main-menu {width:55%;top:-1px;background-color:#fff;}
  :lang(fr) ul#main-menu {width:55%;top:-1px;background-color:#fff;} 
}

@media screen min-width:801px) and (max-width:920px){
   ul#main-menu {
     z-index:333;
     position:absolute;
     margin-top:3px;     
     height:274%;    
     padding-bottom: 100px;
     box-shadow: 1px 0 3px 0 #eee;
     background-color:#fff;  
    /* width:81%;*/
   }
  :lang(de) ul#main-menu {width:55%;}
  :lang(fr) ul#main-menu {width:55%;}     
}
@media screen min-width:921px) and (max-width:1024px){
    ul#main-menu {width:65%;background-color:#fff;}
    .langnav {position:absolute;display:block;}
    .langnav > li {top:5px;;}
}

@media screen min-width:1025px) and (max-width:1100px){
  .sm-simple {
      background: #fff none repeat scroll 0 0;
      border: 1px solid #bbbbbb;
      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
  }
  :lang(de) ul#main-menu {width:68%;background-color:#fff;}
  :lang(fr) ul#main-menu {width:68%;background-color:#fff;} 
  
}

@media screen min-width:1121px) and (max-width:1200px){
  :lang(de) ul#main-menu {width:55%;background-color:#fff;}
  :lang(fr) ul#main-menu {width:55%;background-color:#fff;}   
  
  
}
@media screen (min-width:1201px)and (max-width:1400px){
  :lang(de) ul#main-menu {width:68%;background-color:#fff;}
  :lang(fr) ul#main-menu {width:68%;background-color:#fff;} 
 
}




@media screen and (min-width:480px){
  
}
@media screen and (min-width:680px){
  
}
@media screen (min-width:690px) and (max-width:921px) {
   ul#main-menu {width:99% !important;top:-1px; }
}

@media screen (min-width:921px) and (max-width:1344px){
   button.close.deskX {display:block} 
   .specialnavmobile {top:-50px; right:5px width:67px;}
 /*  ul#main-menu {width:69%; left:-2% !important; top:92px !important;margin-top:2px;}*/
   :lang(de) ul#main-menu {width:100% !important; top:-1px !important;/*margin-top:2px;*/}  
   :lang(fr) ul#main-menu {width:100% !important; top:-1px !important;}
}


/*@media screen (min-width: 1120px) and (max-width:1344px){ */
@media screen and (min-width: 1120px){ 
   button.close.mobileX {display:none} 
  button.close.deskX {display:block; margin-top:-5px;padding: 12px 26px;  } 
  .specialnavmobile > li {display:block;}   
 /* .specialnavmobile ul, .sm-simple ul {position:relative;float:right;bottom:2px;right:-5px;}*/
 /* .specialnavmobile ul {position:relative;float:right;bottom:2px;right:-5px;}
  .specialnavmobile > li {height:20px;}*/
  .sm-simple ul > li {float:right; height:30px;}  
  .sm, .sm ul, .sm li {width:auto;}
  #main-menu {margin-top:10px; background-color:transparent !important; }
  .specialnav .nav > p > a:focus, .specialnav .nav > p > a:hover, .specialnavmobile { float:right; margin-top:-1%; width:57px;}
  .specialnavmobile > p {float:right !important;}
  .specialnavmobile > p:first-child {top:4px;right:98px} 
  .specialnavmobile > p:last-child {position:relative;top:4px;right:101px;;}
  /*.specialnavmobile > p:last-child {position:relative;top:-57px;right:56px;;}*/
  :lang(de) ul#main-menu {width:64% !important; background-color:transparent !important; top:-7px;}
  :lang(fr) ul#main-menu {width:71% !important; background-color:transparent !important; top:-7px;}
  ul#main-menu >  li, .sm-simple li {width:auto; height:30px;float:left !important; background-color:transparent !important;}
  ul#main-menu >  li:last-child, .sm-simple li:last-child {margin-right:70px;}
/*  ul#main-menu li:last-child {padding-left:20px !impotant;} */
  .specialnav .nav > p > a:focus, .specialnav .nav > p > a:hover, .specialnavmobile {margin-top:-1%;right:-57px;} 
}
@media screen and (min-width: 1200px){ 
  .specialnavmobile {margin-top: -8px !important;}
  .specialnavmobile > p {top:-80px;}
 /* .main-nav ul li:last-child, ul#main-menu .sm-simple li:last-child, .sm-simple li:last-child {padding-left:20px !impotant;}*/

}

@media screen (min-width: 1345px)and (max-width: 1460px){ 
 :lang(de) ul#main-menu {width:54% !important;background-color:transparent !important;float:right;}
 :lang(fr) ul#main-menu {width:60% !important;background-color:transparent !important;float:right;top:-1px;}
}

@media screen and (min-width: 1460px) { 
 :lang(de) ul#main-menu {width:54% !important;background-color:transparent !important;}
 :lang(fr) ul#main-menu {width:62% !important;background-color:transparent !important;}
}


@media screen and (-webkit-min-device-pixel-ratio:0) { 

    footer {
      background:  rgba(255,255,255,0.9) !important;
      height: 50px;
      width: 100%;
      display: block;
    }

}

svg {
  overflow: hidden;
  vertical-align: middle; 
}

.ftco-section {
  padding: 7em 0; }

.ftco-no-pt {
  padding-top: 0; }

.ftco-no-pb {
  padding-bottom: 0; }

.ftco-navbar-light {
  background: transparent !important;
  z-index: 3;
  padding: 10px 10px;
  border-radius: 0; 
  box-shadow: none;
 }
  @media (max-width: 991.98px) {
    .ftco-navbar-light {
      background: transparent  !important;
      position: relative;
      top: 0;
      padding: 10px 15px; 
  } 
}
  .ftco-navbar-light .navbar-brand {
    color: #000;
    text-transform: uppercase;
    font-weight: 700; 
}
    .ftco-navbar-light .navbar-brand:hover, 
    .ftco-navbar-light .navbar-brand:focus {
      color: #000; 
    }

@media (max-width: 991.98px) {
      .ftco-navbar-light .navbar-brand {color: #fff;} 
}
@media (max-width: 991.98px) {
    .ftco-navbar-light .navbar-nav {padding-bottom: 10px; } 
}
.ftco-navbar-light .navbar-nav > .nav-item > .nav-link {
    font-size: 14px;
    padding-top: 1.2rem;
    padding-bottom: 1.2rem;
    padding-left: 20px;
    padding-right: 20px;
    font-weight: 400;
    color: #333333;
    position: relative;
    opacity: 1 !important; 
}
.ftco-navbar-light .navbar-nav > .nav-item > .nav-link:hover {color: #fc7fb2; }
@media (max-width: 991.98px) {
      .ftco-navbar-light .navbar-nav > .nav-item > .nav-link {
        padding-left: 0;
        padding-right: 0;
        padding-top: .5rem;
        padding-bottom: .5rem;
        color: rgba(255, 255, 255, 0.7); }
        .ftco-navbar-light .navbar-nav > .nav-item > .nav-link:hover {color: #fff; } 
}
.ftco-navbar-light .navbar-nav > .nav-item .dropdown-menu {
    border: none;
    background: #fff;
    -webkit-box-shadow: 0px 10px 34px -20px rgba(0, 0, 0, 0.41);
    -moz-box-shadow: 0px 10px 34px -20px rgba(0, 0, 0, 0.41);
    box-shadow: 0px 10px 34px -20px rgba(0, 0, 0, 0.41);
    border-radius: 4px;
    padding: 0; 
}
.ftco-navbar-light .navbar-nav > .nav-item .dropdown-menu .dropdown-item {
      font-size: 12px;
      color: #000; 
}
.ftco-navbar-light .navbar-nav > .nav-item .dropdown-menu .dropdown-item:hover, .ftco-navbar-light .navbar-nav > .nav-item .dropdown-menu .dropdown-item:focus {
        background: #fc7fb2;
        color: #fff; 
}
  .ftco-navbar-light .navbar-nav > .nav-item.cta > a {
    color: #fff;
    background: #fc7fb2;
    border-radius: 0px; }
    @media (max-width: 767.98px) {
      .ftco-navbar-light .navbar-nav > .nav-item.cta > a {
        padding-left: 15px;
        padding-right: 15px; } }
    @media (max-width: 991.98px) {
      .ftco-navbar-light .navbar-nav > .nav-item.cta > a {
        color: #fff;
        background: #fc7fb2;
        border-radius: 4px; } }
  .ftco-navbar-light .navbar-nav > .nav-item.active > a {
    color: #fc7fb2; }
    @media (max-width: 991.98px) {
      .ftco-navbar-light .navbar-nav > .nav-item.active > a {
        color: #fff; } }
  .ftco-navbar-light .navbar-toggler {
    border: none;
    color: rgba(255, 255, 255, 0.5) !important;
    cursor: pointer;
    padding-right: 0;
    text-transform: uppercase;
    font-size: 16px;
    letter-spacing: .1em; }
    .ftco-navbar-light .navbar-toggler:focus {
      outline: none !important; }
.social-mobile {display:none;}
.social-media p a {
  border: 0 none;
  width: 35px;
  height: 40px;
  top:-7px;
  margin-right: 12px; 
}
  .social-media p a span {
    color: #4d4d4d; }
  .social-media p a:hover {
    background: transparent;
    border-color: transparent; }
    .social-media p a:hover span {
      color: #fff; }
.social-media-mobile {display:none; }      
      
@media (max-width: 991.98px) {
   .social-media {display:none; }
   .social-media-mobile {display:block; } 
   .social-media-mobile a {margin-left:12px; float:left;} 
   .social-media p a { 
      border-color: #fff;
      width: 30px;
      height: 30px; 
   }
   .social-media-mobile {width:250px;float:left;margin-left:-20px}
   .social-media p a span { color: #fff; } 
   .social-media {margin-top:20px; margin-left:10px; }
   .social-mobile {display:block; width:auto;}
}
@media (max-width: 419px) {
   .social-media-mobile {width:28%;float:left;margin-left:-20px}
   .social-media-mobile a {margin-right:0; } 
   
}

@media (min-width: 1120px) {
   #main-menu {position: sticky; right:0 !important;}
   .social-media .order-lg-last {position:relative; right:0 !important;}
   
}
#social-link {color:red;background:transparent;}
#social-link a {color:green;}

#social-link.facebook{width:30px;height:auto;background:url(../Images/fb.jpg);position:relative;left:0;top:0px;}}

