

/* =============================================================================
   Font Styles
   ========================================================================== */    
   
body, input, button, select, textarea { font-family: 'Titillium Web', sans-serif; font-weight: 400; }
b, strong, h1, h2, h3 { font-family: 'Titillium Web', sans-serif; font-weight: 700; }         
.small { font-size: 0.8em;}     

@font-face {
  font-family: 'metroSysIcons';
  src: url('../fonts/metroSysIcons.woff') format('woff'), url('../fonts/metroSysIcons.ttf') format('truetype'), url('../fonts/metroSysIcons.svg#metroSysIcons') format('svg');
  font-weight: normal;
  font-style: normal;
}

/* =============================================================================
   Custom Styles  grau #605D5C blau #28166F hellgrau: #eee
   ========================================================================== */    
   
  /* Logo-Farben */
  .fil1 {fill:#28166F}
  .fil0 {fill:#605D5C}


   body { background: #fff; color: #444; }
   a, a:link, a:visited, a:hover { color: #28166F; }
   h1, h2, h3 { color: #000; }                                                                          
   h1 { border-bottom: 1px solid #eee; text-transform: none; padding-bottom: 10px; margin-bottom: 20px;}
   #page-1 h1 { border: 0; }
   h2 { font-size: 1.3em; border-top: 1px solid #eee; padding-top: 10px; text-transform: uppercase; padding-bottom: 10px; clear: both; }
   h3 { font-size: 1.2em; padding: 0; margin: 0 0 5px 0;  }
   .metro h2 { border-top: 0; border-bottom: 1px solid #eee;}
   #header { background: #28166F; height: 85px; overflow: visible; }    
   #search { background: #605D5C; height: 39px; overflow: hidden; width: 100%; }
   #footer { background: #28166F; }
   #footer, #footer a, #footer a:link, #footer a:visited, #footer a:hover { color: #fff; text-decoration: none;  }
                          
   /* Abmessungen */                 
   #wrap { width: 100%; overflow: hidden; }   
   #wrap > .container, .container, .row  { padding: 0; margin: 0 auto; width: 1200px; }
   .navbar { border: 0; border-radius: 0; }
   .navbar-nav { float: right; width: 72%; margin-right: -15px; }      
   .navbar-brand { height: 124px; width: 25%; border: 0; margin: 0; padding: 0; position: absolute; background: #fff; }      
   .navbar-brand img { height: auto; width: 90%; max-width: 90%; margin: 0 5%; }    
   .navbar-toggle .icon-bar { background: #fff; }    
   .navbar-toggle:hover .icon-bar { background: #605D5C; }
   #search form { width: 200px; padding: 7px 0 0 0; }    
   #search form input, #search form button { box-shadow: none; border: 0; border-radius: 0; }
   #search form input { height: 25px; padding: 4px; }
   #search form button { height: 25px; padding: 4px 9px; }
   
   #leftbar { width: 25%; float: left; min-height: 30px; margin-left: -15px; padding-left: 40px; }   
   #main { width: 70%; float: right; margin-top: 30px; }
   
   td.max { max-width: 200px; overflow: hidden; white-space: pre-line; }
   
   div.lang {}
   div.lang a { display: block; text-decoration: none; min-width: 25px; height: 25px; text-align: center; color: #fff; padding: 0; background: #333; margin: 7px 4px 0 0; line-height: 23px; }   
   div.lang a:hover { text-decoration: none; color: #fff; background: #000; }
   .moblang { display: none; }
   
   
.navbar-nav > li { display: block; float: left; width: 14%; padding: 15px 0 15px 5px; line-height: 1em; overflow: hidden; }     
.navbar-nav li:first-child { padding-left: 0; }    
.navbar-nav > li.dropdown { width: 18%; }       
.navbar-nav > li > a { display: block; padding: 25px 6px 10px 10px; height: 55px; background: #605D5C; color: #fff; text-align: left; text-transform: uppercase; }       
.navbar-nav > li > a:hover, .navbar-nav > li.active > a, .navbar-nav > li > a.choosen , .navbar-nav > li > a:focus { background: #000; color: #fff; }  
.navbar-nav > li.active > a { font-weight: bold; }                        
.navbar-nav > li > ul { display: none; }    

#XXnavarrow { position: absolute; left: 600px; top: 0; right: auto; margin-top: 67px; z-index: 5; width: 25px; height: 15px;  background: url('whitearrow.png') top left no-repeat transparent; background-size: cover; }
#YYnavarrow { position: absolute; left: 600px; top: 0; right: auto; margin-top: 75px; z-index: 5; background: #fff; width: 15px; height: 15px; transform: rotate(45deg); margin-left: 5px; }
#hovernavi { position: absolute; left: 0; top: 0; right: 0; margin-top: 82px; z-index: 4; }    
#hovernavi .container  { position: relative; }     
#hovernavi .container .sub { position: relative; width: 70%; float: right; background: #fff; color: #000; box-shadow: 3px 3px 10px #444;  min-height: 180px; padding: 20px 30px 20px 15px ; overflow: hidden; }     

#navarrow, #hovernavi { display: none;}   
#navarrow.choosen, #hovernavi.choosen { display: block;}  

.navbar-nav > li { }    
.navbar-nav > li > a { }
.navarrow { position: absolute; left: auto; top: 100%; right: 3px; margin-top: -11px; background: #fff; width: 15px; height: 15px; transform: rotate(45deg); }
.navarrow  { display: none; }        
.navbar-nav > li.choosen .navarrow  { display: block; }

div.loading { position: relative; top: 50%; left: 50%; margin-left: -16px; margin-top: -16px; width: 32px; height: 32px; background: url('loading.gif') top left no-repeat transparent; }
div.close { position: absolute; top: 10px; right: 10px; width: 16px; height: 16px; font-size: 16px; line-height: 16px; background: transparent; cursor: pointer; color: #444; }

#hovernavi .row1 { float: left; width: 33%; overflow: hidden; margin-right: 4%;}
#hovernavi .row1 ul, #hovernavi .row1 ul li { margin: 0; padding: 0; list-style: none; }
#hovernavi .row1 ul li { padding-right: 15px; border-right: 1px solid #eee; }
#hovernavi .row1 ul li a { display: block; padding: 3px 2px; border-bottom: 1px solid #eee; background: #fff; color: #444; }     
#hovernavi .row1 ul li.toppunkt a { text-transform: uppercase; font-weight: 700; }   
#hovernavi .row1 ul li:last-child a { border-bottom: 0; }                
#hovernavi .row1 ul li:hover { border-color: #fff; background: url('hoverarrow.png') center right no-repeat transparent; margin-right: -1px; }
#hovernavi .row1 ul li:hover a { color: #000; text-decoration: none; font-weight: bold; }


#hovernavi .row23 { float: left; width: 63%; overflow: hidden; padding: 5px;}
.metro.catsymbol .tile { margin-left: 20px; margin-bottom: 20px; }
.metro.catsymbol .tile:hover { outline: none; border: 0; }        

#leftbar ul { font-size: 1.1em; }  
#leftbar h2 { border: 0; border-bottom: 1px solid #eee; margin-bottom: 10px; padding-bottom: 10px; padding-top: 70px; line-height: 1em; }    
#leftbar h2 span { font-size: 0.8em; }      
#leftbar h2 br { display: none; }    
#leftbar h2 a { display: block; padding: 2px; color: #000; }                
#leftbar h2 a:hover { text-decoration: none; background: #eee; color: #000; }              
#leftbar ul li i { margin-left: -23px; margin-top: 4px; display: block; float: left; }
#leftbar ul, #leftbar ul li { list-style: none; margin: 0; padding: 0; }
#leftbar ul li a, #leftbar ul li span { display: block; padding: 4px 2px 4px 27px; color: #444; }            
#leftbar ul li.active a, #leftbar ul li.active a:hover { text-decoration: none; background: transparent; color: #000; font-weight: 700; }               
#leftbar ul li a:hover { text-decoration: none; background: #eee; color: #000; }      

#main ul.nav-pills { margin-bottom: 1em; }            
#main ul.nav-pills li a { color: #000; margin-left: 2px; } 
#main ul.nav-pills li.active a { color: #fff; } 
#main .label-light { color: #666; }
                                                   
ul.subitems, ul.subitems li { margin: 0; padding: 0; list-style: none; }  
ul.subitems { padding: 15px 0; }
ul.subitems li { display: block; width: 48%; float: left; border-top: 1px solid #eee; margin: 0 2% 0 0; }    
ul.subitems li a { display: block; padding: 5px 3px; text-decoration: none; color: #000; }   
ul.subitems li a:hover { background: #eee;}

.btn-info, a.btn-info { color: #fff; background: #605D5C; border-radius: 0; border: 0; font-weight: 700; }  
.btn-info:hover, a.btn-info:hover { color: #fff; background: #28166F; }    

.infobox { display: block; margin: 10px 0; float: left; width: 49%; outline: 2px solid #eee; position: relative; overflow: hidden; }   
.infobox.breit { margin: 10px 0; float: none; width: 100%; outline: 2px solid #eee; clear: both; }     
.infobox .media-body { padding: 5px; font-size: 0.9em; }
.infobox:hover { outline: 3px solid #ccc;}               
.default:nth-of-type(2n) { float: right; }  
.default:nth-of-type(2n+1) { clear: both; margin-right: 2%; }     
#xxoverview .default:nth-of-type(2n+1) { float: right; clear: none; margin-right: 0;}  
#xxoverview .default:nth-of-type(2n) { float: left; clear: both; margin-right: 2%; }   
.infobox .placeholder { width: 120px; height: 120px; background: #605D5C; }   
.infobox .placeholder i { width: 120px; height: 120px; text-align: center; color: #fff; line-height: 110px; font-size: 30px; }
.infobox .subbtn { position: absolute; bottom: 0; right: 0; width: auto; height: 24px; min-width: 24px; color: #fff; background: #000; padding: 4px 5px; font-size: 14px; line-height: 14px; } 
a.infobox { background: #fafafa; color: #444; } 
a.infobox:hover { text-decoration: none; }

.infobox.video { min-height: 240px; height: auto; }       
.infobox.video .media-body { padding: 15px 10px;}            
div.infobox a { font-weight: bold; }
div.infobox a:hover { text-decoration: none; background-color: #666; }    
div.infobox:hover { outline: 2px solid #eee; }
.mejs-overlay-loading span { background: none; }
.mejs-overlay-loading { background: none; }
.tile-content.video { display: block; float: left; width: auto; margin: 0 10px 10px 0; outline: 2px solid #eee; }
                                                                 
.form-horizontal .form-group  { margin: 0; padding: 5px 0;} 
.form-horizontal .form-group label { width: 35%; float: left;}
.form-horizontal .form-group .form-control { width: 60%; float: right;}     
.form-horizontal .btn { margin-top: 1em; width: 60%; float: right;}

/* Suchergebnisse */
.panel-heading { padding: 0; border: 1px solid #ddd; }      
.panel-heading h3 a { display: block; width: 100%; text-align: left; border-radius: 3px 3px 0 0; }

#ovmenu { position: relative; z-index: 2; float: right; width: auto; margin: 1em 0 30px 30px;}
#ovmenu ul, #ovmenu ul li { list-style: none; margin: 0; padding: 0; }
#ovmenu.metro .listview .list { border: 1px solid #ddd; width: 240px; margin-bottom: 6px; }  
#ovmenu.metro .listview .list.active { background: #eee; outline: none !important; }                                  
#ovmenu.metro .listview .list .list-content { border: 0; padding: 5px 10px; }  
#ovmenu.metro .listview .list .list-content .icon { font-size: 15px; height: 20px; width: 20px; }  
#ovmenu.metro .listview .list .list-content .data { margin-left: 20px; width: 200px; min-width: 0; }     
#ovmenu.metro .listview .list .list-content .data .list-title { font-size: 15px; line-height: 20px; }
#overview { position: relative; z-index: 1; padding-top: 0; overflow: hidden; padding-right: 5px; padding-left: 5px; }
#overview.shortend { max-height: 238px; padding-top: 0;}   
#overview.shortend .readmore { 
	position: absolute; 
	bottom: 0; left: 0;
	width: 100%; 
	margin: 0; padding: 40px 0; 
	
	/* "transparent" only works here because == rgba(0,0,0,0) */ 
	background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, rgba(255,255,255,0) ),color-stop(1, rgba(255,255,255,1)));
        background-image: -webkit-linear-gradient(top, rgba(255,255,255,0), rgba(255,255,255,1));
        background-image: -moz-linear-gradient(top, rgba(255,255,255,0), rgba(255,255,255,1));
        background-image: -ms-linear-gradient(top, rgba(255,255,255,0), rgba(255,255,255,1));
        background-image: -o-linear-gradient(top, rgba(255,255,255,0), rgba(255,255,255,1));
}
#downloads h2 { border-top: 1px solid #eee; }
.versteckt { display: none; }

.date{ padding: 14px 0 0 0; margin:0 auto;text-align:center;color:#fff;font-weight:bold; }
.date .day{font-size:30px;line-height:30px;}
.date .month{font-size:18px;line-height:18px;padding:5px 0px 5px 0px; text-transform: uppercase; }
.date .year{font-size:20px;line-height:20px;}

/* METRO ITEMS */           
.navbar-nav > li.dropdown > a:after{position:absolute;  right:0.6em;  bottom:12px;  font-family:metroSysIcons;  font-size:.7em;  line-height:1.5em;   content:'\e001';  border-left:1px solid #999;   width:1.6em;   text-align:right; }
.on-right { margin-left: 10px; }   

.metro #tile .small-size{width:80px;  height:80px;  margin:0 5px 5px 0;}
.metro #tile .meduim-size{width:120px;  height:120px;  margin:0 10px 10px 0;}
.metro #tile .large-size{width:150px;  height:150px;  margin:0 15px 15px 0;}
.metro .tile-area{position:relative;  padding:120px 80px 0 80px;  overflow:hidden;}
.metro .tile-area .tile-area-title{position:fixed;  top:20px;  left:80px;}
.metro .tile-area .user-id{position:fixed;  right:40px;  top:40px;  display:inline-block;  padding:8px;  background-color:transparent;  width:auto;  color:#ffffff;  cursor:default;}
.metro .tile-area .user-id .user-id-image{width:40px;  height:40px;  float:right;  margin-left:10px;  color:inherit;  background-color:#464646;  text-align:center;  vertical-align:middle;}
.metro .tile-area .user-id .user-id-image img, .metro .tile-area .user-id .user-id-image [class*="icon-"]{color:inherit;  font-size:16pt;  line-height:16pt;  width:100%;  height:100%;  text-align:center;  vertical-align:middle;}
.metro .tile-area .user-id .user-id-image [class*="icon-"]{padding:10px;}
.metro .tile-area .user-id .user-id-name{float:right;  text-align:right;  margin:0;  padding:0;}
.metro .tile-area .user-id .user-id-name .first-name, .metro .tile-area .user-id .user-id-name .last-name{display:block;  color:inherit;  font-family:'Segoe UI Light_','Open Sans Light',Verdana,Arial,Helvetica,sans-serif;  line-height:12pt;}
.metro .tile-area .user-id .user-id-name .first-name{font-size:20pt;  line-height:20pt;}
.metro .tile-area .user-id .user-id-name .last-name{font-size:12pt;}
.metro .tile-area .user-id:hover{background-color:#404040;}
.metro .tile-area-dark{min-width:100%;  height:100%;  background-color:#1d1d1d !important;}
.metro .tile-area-dark .tile{outline-color:#373737 !important;}
.metro .tile-area-dark:before, .metro .tile-area-dark:after{display:table;  content:"";}
.metro .tile-area-dark:after{clear:both;}
.metro .tile-area-darkBrown{min-width:100%;  height:100%;  background-color:#63362f !important;}
.metro .tile-area-darkBrown .tile{outline-color:#86493f !important;}
.metro .tile-area-darkBrown:before, .metro .tile-area-darkBrown:after{display:table;  content:"";}
.metro .tile-area-darkBrown:after{clear:both;}
.metro .tile-area-darkCrimson{min-width:100%;  height:100%;  background-color:#640024 !important;}
.metro .tile-area-darkCrimson .tile{outline-color:#970036 !important;}
.metro .tile-area-darkCrimson:before, .metro .tile-area-darkCrimson:after{display:table;  content:"";}
.metro .tile-area-darkCrimson:after{clear:both;}
.metro .tile-area-darkViolet{min-width:100%;  height:100%;  background-color:#57169a !important;}
.metro .tile-area-darkViolet .tile{outline-color:#701cc7 !important;}
.metro .tile-area-darkViolet:before, .metro .tile-area-darkViolet:after{display:table;  content:"";}
.metro .tile-area-darkViolet:after{clear:both;}
.metro .tile-area-darkMagenta{min-width:100%;  height:100%;  background-color:#81003c !important;}
.metro .tile-area-darkMagenta .tile{outline-color:#b40054 !important;}
.metro .tile-area-darkMagenta:before, .metro .tile-area-darkMagenta:after{display:table;  content:"";}
.metro .tile-area-darkMagenta:after{clear:both;}
.metro .tile-area-darkCyan{min-width:100%;  height:100%;  background-color:#1b6eae !important;}
.metro .tile-area-darkCyan .tile{outline-color:#228ada !important;}
.metro .tile-area-darkCyan:before, .metro .tile-area-darkCyan:after{display:table;  content:"";}
.metro .tile-area-darkCyan:after{clear:both;}
.metro .tile-area-darkCobalt{min-width:100%;  height:100%;  background-color:#00356a !important;}
.metro .tile-area-darkCobalt .tile{outline-color:#004e9d !important;}
.metro .tile-area-darkCobalt:before, .metro .tile-area-darkCobalt:after{display:table;  content:"";}
.metro .tile-area-darkCobalt:after{clear:both;}
.metro .tile-area-darkTeal{min-width:100%;  height:100%;  background-color:#004050 !important;}
.metro .tile-area-darkTeal .tile{outline-color:#006983 !important;}
.metro .tile-area-darkTeal:before, .metro .tile-area-darkTeal:after{display:table;  content:"";}
.metro .tile-area-darkTeal:after{clear:both;}
.metro .tile-area-darkEmerald{min-width:100%;  height:100%;  background-color:#003e00 !important;}
.metro .tile-area-darkEmerald .tile{outline-color:#007100 !important;}
.metro .tile-area-darkEmerald:before, .metro .tile-area-darkEmerald:after{display:table;  content:"";}
.metro .tile-area-darkEmerald:after{clear:both;}
.metro .tile-area-darkGreen{min-width:100%;  height:100%;  background-color:#128023 !important;}
.metro .tile-area-darkGreen .tile{outline-color:#18ad2f !important;}
.metro .tile-area-darkGreen:before, .metro .tile-area-darkGreen:after{display:table;  content:"";}
.metro .tile-area-darkGreen:after{clear:both;}
.metro .tile-area-darkOrange{min-width:100%;  height:100%;  background-color:#bf5a15 !important;}
.metro .tile-area-darkOrange .tile{outline-color:#e77120 !important;}
.metro .tile-area-darkOrange:before, .metro .tile-area-darkOrange:after{display:table;  content:"";}
.metro .tile-area-darkOrange:after{clear:both;}
.metro .tile-area-darkRed{min-width:100%;  height:100%;  background-color:#9a1616 !important;}
.metro .tile-area-darkRed .tile{outline-color:#c71c1c !important;}
.metro .tile-area-darkRed:before, .metro .tile-area-darkRed:after{display:table;  content:"";}
.metro .tile-area-darkRed:after{clear:both;}
.metro .tile-area-darkPink{min-width:100%;  height:100%;  background-color:#9a165a !important;}
.metro .tile-area-darkPink .tile{outline-color:#c71c74 !important;}
.metro .tile-area-darkPink:before, .metro .tile-area-darkPink:after{display:table;  content:"";}
.metro .tile-area-darkPink:after{clear:both;}
.metro .tile-area-darkIndigo{min-width:100%;  height:100%;  background-color:#4b0096 !important;}
.metro .tile-area-darkIndigo .tile{outline-color:#6400c9 !important;}
.metro .tile-area-darkIndigo:before, .metro .tile-area-darkIndigo:after{display:table;  content:"";}
.metro .tile-area-darkIndigo:after{clear:both;}
.metro .tile-area-darkBlue{min-width:100%;  height:100%;  background-color:#16499a !important;}
.metro .tile-area-darkBlue .tile{outline-color:#1c5ec7 !important;}
.metro .tile-area-darkBlue:before, .metro .tile-area-darkBlue:after{display:table;  content:"";}
.metro .tile-area-darkBlue:after{clear:both;}
.metro .tile-area-lightBlue{min-width:100%;  height:100%;  background-color:#4390df !important;}
.metro .tile-area-lightBlue .tile{outline-color:#6faae6 !important;}
.metro .tile-area-lightBlue:before, .metro .tile-area-lightBlue:after{display:table;  content:"";}
.metro .tile-area-lightBlue:after{clear:both;}
.metro .tile-area-lightTeal{min-width:100%;  height:100%;  background-color:#45fffd !important;}
.metro .tile-area-lightTeal .tile{outline-color:#78fffd !important;}
.metro .tile-area-lightTeal:before, .metro .tile-area-lightTeal:after{display:table;  content:"";}
.metro .tile-area-lightTeal:after{clear:both;}
.metro .tile-area-lightOlive{min-width:100%;  height:100%;  background-color:#78aa1c !important;}
.metro .tile-area-lightOlive .tile{outline-color:#97d623 !important;}
.metro .tile-area-lightOlive:before, .metro .tile-area-lightOlive:after{display:table;  content:"";}
.metro .tile-area-lightOlive:after{clear:both;}
.metro .tile-area-lightOrange{min-width:100%;  height:100%;  background-color:#c29008 !important;}
.metro .tile-area-lightOrange .tile{outline-color:#f3b40a !important;}
.metro .tile-area-lightOrange:before, .metro .tile-area-lightOrange:after{display:table;  content:"";}
.metro .tile-area-lightOrange:after{clear:both;}
.metro .tile-area-lightPink{min-width:100%;  height:100%;  background-color:#f472d0 !important;}
.metro .tile-area-lightPink .tile{outline-color:#f8a1e0 !important;}
.metro .tile-area-lightPink:before, .metro .tile-area-lightPink:after{display:table;  content:"";}
.metro .tile-area-lightPink:after{clear:both;}
.metro .tile-area-grayed{min-width:100%;  height:100%;  background-color:#585858 !important;}
.metro .tile-area-grayed .tile{outline-color:#727272 !important;}
.metro .tile-area-grayed:before, .metro .tile-area-grayed:after{display:table;  content:"";}
.metro .tile-area-grayed:after{clear:both;}
.metro .tile-group{margin-right:46px;  min-width:130px;  width:auto;  float:left;  display:block;  padding-top:40px;  position:relative;}
.metro .tile-group.one{width:130px;}
.metro .tile-group.two, .metro .tile-group.double{width:260px;}
.metro .tile-group.three, .metro .tile-group.triple{width:390px;}
.metro .tile-group.four, .metro .tile-group.quadro{width:520px;}
.metro .tile-group.five{width:650px;}
.metro .tile-group.six{width:780px;}
.metro .tile-group.seven{width:910px;}
.metro .tile-group:first-child{margin-left:80px;}
.metro .tile-group{color:#ffffff;}
.metro .tile-group .tile-group-title{font-family:'Segoe UI Light_','Open Sans Light',Verdana,Arial,Helvetica,sans-serif;  font-size:18px;  line-height:20px;  position:absolute;  top:10px;  left:0;  color:inherit;}
.metro .tile{position:relative;  overflow:hidden;  display:block;  float:left;  margin:0 10px 10px 0;  padding:0;  cursor:pointer;  background-color:#605D5C;  box-shadow:inset 0px 0px 1px #FFFFCC;}       
.metro .tile >.image {background-color:#efefef;}
.metro .tile:hover{outline:#999999 solid 3px;}
.metro .tile:active{outline:0;}
.metro .tile.no-outline{outline-color:transparent;}
.metro .tile{width:120px;  height:120px;  margin:0 10px 10px 0;}
.metro .tile.half{width:55px;  height:55px;}
.metro .tile.double{width:250px;}
.metro .tile.double-vertical{height:250px;}
.metro .tile.triple{width:380px;}
.metro .tile.triple-vertical{height:380px;}
.metro .tile.quadro{width:510px;}
.metro .tile.quadro-vertical{height:510px;}
                                                      
#page-1 #subheader .metro .tile { height: 180px; width:180px; background: #000; }
#page-1 #subheader .metro .tile.dunkelgrau { background: #615B78; }       
#page-1 #subheader .metro .tile.dunkelblau { background: #160C3C; }      
#page-1 #subheader .metro .tile.weiss { background: #fff; }
#page-1 #subheader .metro .tile:first-of-type { margin-left: -190px;}
#page-1 #subheader .metro .tile.double{width:370px;}                                                        
.metro .tile .brand { font-size: 14px; font-weight: bold; padding-left: 10px; color: #fff; }
#page-5 .metro .tile .brand { color: #000; }
#page-1 #subheader .metro .tile .brand{ text-transform: uppercase; font-size: 16px; font-weight: bold; padding-left: 10px; color: #fff; }
#page-1 #subheader .metro .tile .tile-content.icon [class*="icon-"], #page-1 #subheader .metro .tile .tile-content.icon img { right: 20px; top: 50px; bottom: auto; left: auto;}   
#page-1 #subheader .metro .tile .tile-content span.text { display: block; padding: 10px; color: #fff; font-size: 13px; }            
.metro .tile .tile-content.image img { max-width: 100%; max-height: 100%; margin: 0 auto;}                    
#page-1 #subheader .metro .tile .tile-content.image img { width: 100%; max-width: 100%; height: 100%; }                
#page-1 #subheader .metro .tile .brand .badge, #page-1 #subheader .metro .tile .tile-status .badge{ width:32px;  height:38px; font-size: 25px; background: transparent; }
#page-1 #subheader .metro .tile .tile-content span.alttext { display: none; }
                                                                                                                            
.galerie .metro .tile { outline: 2px solid #eee; }                                                                          
.galerie .metro .tile:hover { outline: 3px solid #ccc; }   
.galerie .metro a.tile .brand { padding-left: 5px; padding-right: 5px; display: none; background: #000; color: #fff; font-weight: 400; }   
.galerie .metro a.tile:hover .brand { display: block; }             


.metro .tile.selected{border:4px #4390df solid;}
.metro .tile.selected:after{position:absolute;  display:block;  border-top:28px solid #4390df;  border-left:28px solid transparent;  right:0;  content:"";  top:0;  z-index:101;}
.metro .tile.selected:before{position:absolute;  display:block;  content:"\e003";  color:#fff;  right:0;  font-family:'metroSysIcons';  font-size:9pt;  font-weight:normal;  z-index:102;  top:0;}
.metro .tile .tile-content{width:100%;  height:100%;  padding:0;  margin:0;  display:block;  position:absolute;  left:0;  top:0;  overflow:hidden;}
.metro .tile .tile-content.padded{padding:10px;}
.metro .tile .tile-content.image{width:100%;  min-height:100%;  max-height:100%;}
.metro .tile .tile-content.icon [class*="icon-"], .metro .tile .tile-content.icon img{line-height:56px;  height:56px;  width:56px;  font-size:48px;  color:#ffffff;  text-align:center;  position:absolute;  left:50%;  top:50%;  margin-top:-28px;  margin-left:-28px;}
.metro .tile .tile-content.image-set img{margin:0;  padding:0;  width:25% !important;  height:50%;  float:left;  border:1px #1e1e1e solid;}
.metro .tile .tile-content.image-set img:first-child{width:50% !important;  float:left;  height:100%;}
.metro .tile .tile-content{display:none;}
.metro .tile .tile-content:first-child{display:block;}
.metro .tile .brand, .metro .tile .tile-status{position:absolute;  bottom:0;  left:0;  right:0;  min-height:29px;  margin:0;}
.metro .tile .brand:before, .metro .tile .tile-status:before, .metro .tile .brand:after, .metro .tile .tile-status:after{display:table;  content:"";}
.metro .tile .brand:after, .metro .tile .tile-status:after{clear:both;}
.metro .tile .brand.opacity, .metro .tile .tile-status.opacity{opacity:.7;}
.metro .tile .brand .name, .metro .tile .tile-status .name, .metro .tile .brand .label, .metro .tile .tile-status .label, .metro .tile .brand .text, .metro .tile .tile-status .text{display:block;  font-size:10pt;  margin:5px 20px 2px 5px;  background:transparent;  color:#ffffff;}
.metro .tile .brand .text, .metro .tile .tile-status .text{margin:4px 5px;  font-size:8pt;  line-height:10pt;}
.metro .tile .brand .badge, .metro .tile .tile-status .badge{position:absolute;  bottom:0;  right:10px;  width:29px;  height:29px;  text-align:center;  color:#ffffff;  padding:5px;  margin:0;  vertical-align:middle !important;  display:block;  font-size:10pt;}
.metro .tile .brand .badge.activity,
.metro .tile .tile-status .badge.activity {
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGMSURBVDhPvZMtTwNBEIbv2mtScaICcQJRgSgJCQIEhqSiAlEHAlFRwU/ov0AgUEgUsrIkiJIgMOAQJFSQQAIJJBWIu95Hj2eGvXIpB3W8yWTn452Z3dld25pDmqZuFEWdcrm8jr6JK7Bt+wb9Ft85+vsXswBxHHdIfmFNi4TYG7InXAp6ss52kCTJIc6e6KzSVbrdYzrYDaSFXZU4uEQ8x3FW1ZpMJge5Tn3IdQ3kID5iw4zHTqIsUEP3TWCA7WhgDjRZg/eUFRCR3Fl3KYJjyfALIUU46jHcsSlQl8FdmQJnhrcQJFbJ6QZB0LDDMNyS4XBFo1Kp9Gw4/wi247GLHmvNuBaC47Y5gtzIQB1mBmMGdDSdTpfV+QdM8vfcsqkap6ClgQIQa+a4bXViPGRO5ILjuBqYAwk7yIfhXcNz9CljDFkkST6P4JGjnHA7d+gBxAY3tIve1Khljbi1beKvakHQp0uhfTrMjvOL9H3fX9FE8OM7yxAhdem4QWHZkSufSoTYaaVSkY9kYFmfXgyTciI3uacAAAAASUVORK5CYII%3D') 50% no-repeat;
}
.metro .tile .brand .badge.alert,
.metro .tile .tile-status .badge.alert {
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAFeSURBVDhPpZMtT8RAEIbb7YoTJ04gkQgQuBNIEpB4LD8AwQ9AkCCQhGAvQSAuKHCIE0gEP+DEISAhQYK4pE0/eWa65a7lSvh4k8nsvDv77sxs67UhSZLNNE0LZ3uO/gLj/J+hAkVRWI1+geqMCuR5fkKZoyiKViX+DuQu094wy7KhEmEYrkAk0qt4Nk5R77GszQCuE8fxIXxY8ZJjgiBY8n3/UcTwlsQDNifGmF29AcBtITyGOyan47gXXFfW2g/q+yi+VeptJhVgR1KRHp4HZI+bzknQlhYcvpQZuHRF8xmnCDyLL8MZEI9o4YkW3h1VB+o73DJp3to08l7xsw9Lng5i1EiSSV/Pcbdwzfk8MLcNqjIyye1STnHD5joln7lYcGWtXaP8gYsFfeJyHvR9waExt3wKsV74L3Brn/geu3OUDqiL1T7nNoEK8mLi9RUoZYqlsv4pqtf459/oeR8seozS7mDHCwAAAABJRU5ErkJggg%3D%3D') 50% no-repeat;
}
.metro .tile .brand .badge.available,
.metro .tile .tile-status .badge.available {
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAAIGNIUk0AAHolAACAgwAA+f8AAIDoAABSCAABFVgAADqXAAAXb9daH5AAAAKvSURBVHjahJA/bJR1HMY/31977x33r2LuClc1LYM9TSAUr5gqtkVJjAkSFxYHE3VgaWRw0cUwOagxMZLApoXFBIwuHVSoQYkVMBXUpqSkMW9jaS25plh7/3rv+3scTIwixs/8PHn+2Bk/SVtN2mqxacYOKw13KfNiXtlneihmDONXqs0VVs/VXP1UqJvnc8qBeZoWYWf9JHXVqWkj2EX55G76X86R4W40aDHNzMdzLBwJLLEWm6fTI+o0knvZ+dkgO/cDfGczTNpl5gjxePrpY0SPMKwKT1A5nCe7Y4ofDgQEv/Ghn2AqunZabUmR9Fb8gQoaUVIVFTSiokaV0qDu0T694Y+rGbWktnQ5+nHiuP+IjrFjR4cqevj9wBK8beO87t6jiyzbKJAiIEWSreQxjAm7QGyeAwzRzb39i/7WFbdV2bGs0nxvs7zjxtlOgRwZPP6v7R5PmhQPUOKEneFLd4UECfqs51WXU/opDL6wb/mdDfJkEfrXgUKk2UKbiM/5BoD76d7reujOANwgJH9H8p14PDnSzBGySZsSReecDIAIDxj/jxH/LcQtW7UJ0E8f69RwuP+0Ohwb1CnTS0CCW6zK3Wb9a4AnNcgWktRoYHdpYhgtWvypfRSARVv5yVXd2smGWuzTHo7qeRZZpk7zH00cRos2ITd5yT/HQY0gPKGW3u0YPvZ06HB77tO2hx5jN5HFTNk11lgHRIs2VW5Tp8kRf5g3eYUUSa5y/eKsfn7NTvlPaCjqelwDF3bx4ADAeXeJc1xijpCYmDJ9jKrCIe0H4IaF81/56VGDJTvtPwV1IFmhTO/4AOWDSQIAWmwiRIokADEx08xeXGD5hUjxQp0GnQCdOAKS1RnNP7tO7VDOMmO9bB8qUQRghVVCW7raUOPEvH45W7IidRoA/DEAmmk0pL+n6f4AAAAASUVORK5CYII%3D') 50% no-repeat;
}
.metro .tile .brand .badge.unavailable,
.metro .tile .tile-status .badge.unavailable {
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAAIGNIUk0AAHolAACAgwAA+f8AAIDoAABSCAABFVgAADqXAAAXb9daH5AAAAKASURBVHjalJK9axxXFMV/772ZzOysVqvRDgtaSSwpJYFwY3ATEpIm5KNLawgp3Ljz/5E2bu20CYQUBoMNNnaRMkUKqYiQtIgdCQ0TaVc7M29n3nspzC7GMYYcuMWFe7jnHI4YjUY453DOYYyh0+l8opT63vO8L8MwbAshqKqq0lo/c849rqrquXMOIcSbGY1GWGsxxny0urr6MI7jH5RSAFhrAZBSLvc8z3+dTqf3lFL/SCnxAIwxwdra2tP19fXPAC4vL8myjKIoAIiiiF6vR7/fJ0mS75RSH19dXX0hpbwWx8fHrKys/JwkyV1rLYeHh5yenuKc420lzjm2trbY3d3F8zzyPH8ynU6/ERcXF3fiOP7D930ODg44OjoiDMOl7AWstZRlyXA4ZH9/H2MM4/H4K+l53n3f98myjJOTE4Ig+A95kUMURZydnXF+fo5SiiiKHkjf9z9f+AaWst+HRfKL2yiKbssgCNrOOWaz2Xs/vwulFLPZjLquCcPwDcM5x//B2/dyPp9XC3/WWoQQHyQbY2i32/i+T1VVTtZ1/QogSZJlGz/02VpLkiQAlGX5l2ya5mHTNPT7fba3tynLctnAd8llWTIYDNjY2MBaS1EUP0qt9YvJZPI7wM7ODsPhEK01WmuapqFpGrTWVFXFYDBgb28PIQTX19ev67r+TYzHY7TW3W63+zKO41sAaZqSZRk3NzcAtNtter0em5ubAEwmk7/zPP9USjkWaZoyn89xziWdTudRt9v9etGFuq4B8H1/aSXP89dFUdx1zp065xBpmlLXNUIIjDG0Wq1vPc+7H4bhnVarhRCCsiwpiuJPY8xPRVH8EgQBxhistfw7ABpxTL93U9x/AAAAAElFTkSuQmCC') 50% no-repeat;
}
.metro .tile .brand .badge.away,
.metro .tile .tile-status .badge.away {
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAAIGNIUk0AAHolAACAgwAA+f8AAIDoAABSCAABFVgAADqXAAAXb9daH5AAAAJ2SURBVHjajJI7iFVnFIW//d9zz52ZO2fG14gzJBgbp5JYKPh+NqKxsxWMRZoBCxu1sAuBKFaClj5KDUQhRXybCIqICjqNYjFDhtExN45e7/uc8y+L/yJGp3A1+2fDWv/ea23zlQvIp0gpRgfrWbZRNrhP0cAOopEyGGSvWmQz15zq59SeuC5LsAis0MJ85SLKG8jXY3pXnKb8/X6iBAB8KLhuzZtQf/gbrWc/WTGetSgnAg9qlCiv/pNk1RYAqz3A6jeg/SyoxMtReRNKNsLAhj24gWW0726H+B3+9Rmyd3fPp5KyXMpf/SqNL5KelEIdH5Ke9Ejj8+SnjyrLWkolZbX7f/jZk5h/e3WN7197j0I/NnMMN3MYoiXgBv6/g+rQmUJDR/Ajv4BP0eylnU5u/pgK/Vj9Ee6/411y8gm5a4b1Qfwt9uYUrnoTXBGLvzvoFCXbDLDaVcjfd38WX0JBRCnUroRW/M1qRzRSxgPt55+NPRc8FJJgbtaB4rBz+phRxtcj//hylr5s4YDScvDVT0KfCw7yGpRGIYohfS2H3v4NoL6tYL3BbWwOsoHawY3y1tDJpp46p8pp5U2UrEcLD0BnCtT4bBIXyJ0J/Pwf0eAu8ELtiROO5uQtazy9LMAvPoKGDoU00n/CSr4K2RTkFfyCMRj+OWg2Ht9RNv27+X/PId8cVN+62/SvWAngqtehdq17yjmURlHfZjRvdxi98fyFr/21GWfT5ivnkQehRfSOnqV35S4KpW4w7ZB/1NNNMYf6wzukk3ulbBI1iIJkBBZX1Bn/gby621wyRrx0DcXhQGzPYOnEY/nmKbVeXLTicNcn+DAArZ4503S5ZjkAAAAASUVORK5CYII%3D') 50% no-repeat;
}
.metro .tile .brand .badge.busy,
.metro .tile .tile-status .badge.busy {
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAAIGNIUk0AAHolAACAgwAA+f8AAIDoAABSCAABFVgAADqXAAAXb9daH5AAAAKNSURBVHjajJI9a1RBGIWfGeLdmPXuKkR0Q0RTmFsFUxgQNcaPRonpbAW1sAlY2IhFfoCIVSDaaVImFhYWmkTxAwJBVgttNqTYQFAjAWPi7t3svXeOxeC3hQdeZpiZ887DmTFuchIlCUoSTLOJ6erqV7F4QYXCaTo68hgDHz82WFmZsbXauKrVWYUhBjCNBsZNTaF6HdVqAT09tzlw4BJhyD8Vx1Au36dSuWyC4LPJMlpwDur1HH19jzh48DiAefUK8+QJVCrgHHR3o2PHUH8/HD16jkKhi7m5UwTBF9zdu6RzcxOJpFRSduOG1N4u5XJ+3LlTam2Vtm+XGxlR2mgokZTOzz90o6PgpqcPpRsbP83GSKWSFEXS/v2+okjq7JRA7vp1pZLSZlPJ5OQZqx07hrVtG+b1a+zNm7B7N4ShR/8u56CtDfbswYyNYZ8+hS1bMPv2XbUKw5MGMNPTsLEBhQJIfwco+SZJAo8f+7XOzj5LR0cegIUFb/715j/lnKerVKDZhFLJWlnrN9OU/1aW/Zha8+FDA4Dublhfh+8N/yVr4etXiCIIAvj0SZa1tRcAOnECtm6FWg2M+dtsDGxu8uMsYJaX31q7unpbcYyOHEFXrsDyMtTrv5NY683VKu7iRTQ4CBKqVm/h7twhnZ9/kEhK41ju2jWpWJTa2qRdu3zl81I+r2x4WNnamv8H5fKLZHQU48bHURwXdfjwM3p6egHs7CzMzPi0swyiCA0MoKEhj76wsOiePx/AmPfGTUwgQFI7UXSP3t5BcjmPvrnp37+19Wf65fJLlpbOK02XqNdpAaClBYJgVe/enWV9fciE4TB79x6iVPLGlRVMtfpGcTymxcUpUyr5nIBvAwDWIWcndiwtQAAAAABJRU5ErkJggg%3D%3D') 50% no-repeat;
}
.metro .tile .brand .badge.newMessage,
.metro .tile .tile-status .badge.newMessage {
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAC/SURBVDhP1ZE9DgIhFIQhobDYg1haWniMbSw9j0exsfMAeg9L7Sy2kPATnCFI2LgYtjJOMjx4vPkoED+X5OK934cQ+thpFOYvSqmdMMascVDOuQMcGn1GptNaL4W1dgBkMwOSw8jeBJszIKMwexFAN0A+wnQG0Lh4wv0EJIb5AO4fRX8MoDFAlZAyPJSztOSSfiYLAYeyxTcdURcIrqSUJ7iLA4UmAdQbgnqvhakqgEoQXQtTXwEtIuCa9n8pIV67VJf6AmhGmgAAAABJRU5ErkJggg%3D%3D') 50% no-repeat;
}
.metro .tile .brand .badge.paused,
.metro .tile .tile-status .badge.paused {
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAArSURBVDhPY/j9+7fDnz9//mPBCQxQgE8NE1QN2WDUgFEDQGDUgIE3gIEBAArtNKc4HT7sAAAAAElFTkSuQmCC') 50% no-repeat;
}
.metro .tile .brand .badge.playing,
.metro .tile .tile-status .badge.playing {
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAEXSURBVDhPY4CBnz9/pvz+/dsFyiUaMEFpBiYmJhkgtf3v37/t////Z4GIEgZwA0CAkZGRBai5AmjIYSCtABXGC1AMQAIWf/78OQ/EEVA+ToDLAJBrBIDUcqBrZgNdwwMRxQQ4DYABoOYUoCGngYFsABVCAQQNgAINYCAf//XrVwGUDwfEGgDyEgfQkH5guGwGukoEKky8AUhA5sePH6DwAQOSDAC6YgIzM7MpJyfnHagQcQYAnfwGiD2BmguBhvyBCoMBMQbsYWFh0WVlZd0B5aMAnAYAbfzz79+/SqBmV6CtL6DCGACXAQ+ABliysbF1QPk4AYYBQI0rgH7VBWo+AxXCC+AGADV+AVKJQL9GAp0MYhMBGBgA8v5j1f90TA8AAAAASUVORK5CYII%3D') 50% no-repeat;
}
.metro .tile .brand .badge.error,
.metro .tile .tile-status .badge.error {
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAFiSURBVDhPjVM7TsNQELRjy8ISBQeIREtBEYnQUXCINFTkCCBxgNwAJI5AaejSpaCAEqRINBTcIQ1SbD9/mHmfZP3iSIw0ytt9O7O7thMGHpqmGVZVNQnD8AwcMde27RL8rOt6nqbpjy7sA4RTpdQKv20fcbcuy/IOZrGVbIHLpz7RHr52TJCYukuMeU+6WDBjdxej4UyLubMbm0KdBDyTzHWEyY01UEVRnA4Q8IEdaZVAFEW3yD/g+IzzFc6VuTFAHAPXO7vLKQi5q+suuOD+X15yx4ToEXON1QB3B6ZkC3Qd+q8Kaxzbo0TMCTLPefPAfPS8nTeOtnk1YEfMsf11pIm+y/P8BLusmaCZrevsLE1QO3F51FzopJyCQil2pAnFoLLxI7X6z8SxkVjgeMn4H/jGQz3Ht/BrY2MC85nrsI/sjNpDKzMTSODzHPELQ9EY1H9ndFqCHxC/JEnyrgs1guAPTvwreuY0IiIAAAAASUVORK5CYII%3D') 50% no-repeat;
}
.metro .tile .brand .badge.attention,
.metro .tile .tile-status .badge.attention {
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAEbSURBVDhPtZI9bsJAEIVZ7ANQ5gApEomChjoNBUUOkSJFivSUQE3JEThCCo4BkotcIVKKNEi2vP7hveVZrMFgKPJJo915szOzf51/Jc/zhbV2Jfc+kiR5QrLNsqzEMJJ8O0hcM1kWlWUZKtQOOo69ZGdpmn4ofB12QsI3k1BoRtP8F7Gell0GnT6rrpJ4HOfzUiU1ww7o9HepAGI2juNHyeegw7Ja3FRA9iW5jv9slSl0WqD2rEYjF7Hy68E7gCPNORpjpk44sg2CYAg969JTxVoywYIXmlyfAS77jRPDZ8PZN5j3KfiEYeh2yG07wQN5P4g/d9H9Hf5ZMkHM/QO5NbCzh6IoJgbVI/iNBdrALnY8An9X+w9rpLPbA/sADga+JgSiAAAAAElFTkSuQmCC') 50% no-repeat;
}
.metro .tile.parts > ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.metro .tile.parts > ul > li {
  display: block;
  float: left;
  height: 60px;
  width: 60px;
  margin: 0;
}
.metro .tile.parts > .part {
  display: block;
  float: left;
  height: 60px;
  width: 60px;
  margin: 0;
}
.metro .tile.half .tile-content.icon [class*="icon-"],
.metro .tile.half .tile-content.icon img {
  line-height: 37.33333333px;
  height: 37.33333333px;
  width: 37.33333333px;
  font-size: 32px;
  color: #ffffff;
  text-align: center;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-top: -18.66666667px;
  margin-left: -18.66666667px;
}
.metro .tile {
  font-family: 'Segoe UI_', 'Open Sans', Verdana, Arial, Helvetica, sans-serif;
}
.metro .tile * {
  font-family: 'Segoe UI_', 'Open Sans', Verdana, Arial, Helvetica, sans-serif;
}
.metro .tile.scale {
  -webkit-transform: scale(0.98);
  -moz-transform: scale(0.98);
  -ms-transform: scale(0.98);
  -o-transform: scale(0.98);
  transform: scale(0.98);
}
.metro [draggable] {
  cursor: default;
}
.metro .tile .tile-content.email {
  color: #ffffff;
  padding: 10px;
}
.metro .tile .tile-content.email .email-image {
  width: 64px;
  height: 64px;
  float: left;
}
.metro .tile .tile-content.email .email-image img {
  width: 100%;
  height: 100%;
}
.metro .tile .tile-content.email .email-data {
  display: block;
  color: inherit;
  margin-left: 70px;
  width: auto;
  overflow: hidden;
}
.metro .tile .tile-content.email .email-data .email-data-title,
.metro .tile .tile-content.email .email-data .email-data-subtitle,
.metro .tile .tile-content.email .email-data .email-data-text {
  color: inherit;
  display: block;
}
.metro .tile .tile-content.email .email-data .email-data-title {
  font-size: 14pt;
}
.metro .tile .tile-content.email .email-data .email-data-subtitle {
  font-size: 11pt;
}
.metro .tile .tile-content.email .email-data .email-data-text {
  font-size: 10pt;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.metro [class*=tile-transform-] {
  -webkit-transition: all 0.22s;
  transition: all 0.22s;
}
.metro .tile-transform-right {
  -webkit-transform-origin: left 50%;
  -moz-transform-origin: left 50%;
  -ms-transform-origin: left 50%;
  -o-transform-origin: left 50%;
  transform-origin: left 50%;
  -webkit-transform: perspective(500px) rotateY(0.138372rad);
  -moz-transform: perspective(500px) rotateY(0.138372rad);
  -ms-transform: perspective(500px) rotateY(0.138372rad);
  -o-transform: perspective(500px) rotateY(0.138372rad);
  transform: perspective(500px) rotateY(0.138372rad);
}
.metro .tile.double.tile-transform-right {
  -webkit-transform: perspective(500px) rotateY(0.069186rad);
  -moz-transform: perspective(500px) rotateY(0.069186rad);
  -ms-transform: perspective(500px) rotateY(0.069186rad);
  -o-transform: perspective(500px) rotateY(0.069186rad);
  transform: perspective(500px) rotateY(0.069186rad);
}
.metro .tile.triple.tile-transform-right {
  -webkit-transform: perspective(500px) rotateY(0.046124rad);
  -moz-transform: perspective(500px) rotateY(0.046124rad);
  -ms-transform: perspective(500px) rotateY(0.046124rad);
  -o-transform: perspective(500px) rotateY(0.046124rad);
  transform: perspective(500px) rotateY(0.046124rad);
}
.metro .tile.quadro.tile-transform-right {
  -webkit-transform: perspective(500px) rotateY(0.034593rad);
  -moz-transform: perspective(500px) rotateY(0.034593rad);
  -ms-transform: perspective(500px) rotateY(0.034593rad);
  -o-transform: perspective(500px) rotateY(0.034593rad);
  transform: perspective(500px) rotateY(0.034593rad);
}
.metro .tile.half.tile-transform-right {
  -webkit-transform: perspective(500px) rotateY(0.276744rad);
  -moz-transform: perspective(500px) rotateY(0.276744rad);
  -ms-transform: perspective(500px) rotateY(0.276744rad);
  -o-transform: perspective(500px) rotateY(0.276744rad);
  transform: perspective(500px) rotateY(0.276744rad);
}
.metro .tile-transform-left {
  -webkit-transform-origin: right 50%;
  -moz-transform-origin: right 50%;
  -ms-transform-origin: right 50%;
  -o-transform-origin: right 50%;
  transform-origin: right 50%;
  -webkit-transform: perspective(500px) rotateY(-0.138372rad);
  -moz-transform: perspective(500px) rotateY(-0.138372rad);
  -ms-transform: perspective(500px) rotateY(-0.138372rad);
  -o-transform: perspective(500px) rotateY(-0.138372rad);
  transform: perspective(500px) rotateY(-0.138372rad);
}
.metro .tile.double.tile-transform-left {
  -webkit-transform: perspective(500px) rotateY(-0.069186rad);
  -moz-transform: perspective(500px) rotateY(-0.069186rad);
  -ms-transform: perspective(500px) rotateY(-0.069186rad);
  -o-transform: perspective(500px) rotateY(-0.069186rad);
  transform: perspective(500px) rotateY(-0.069186rad);
}
.metro .tile.triple.tile-transform-left {
  -webkit-transform: perspective(500px) rotateY(-0.046124rad);
  -moz-transform: perspective(500px) rotateY(-0.046124rad);
  -ms-transform: perspective(500px) rotateY(-0.046124rad);
  -o-transform: perspective(500px) rotateY(-0.046124rad);
  transform: perspective(500px) rotateY(-0.046124rad);
}
.metro .tile.quadro.tile-transform-left {
  -webkit-transform: perspective(500px) rotateY(-0.034593rad);
  -moz-transform: perspective(500px) rotateY(-0.034593rad);
  -ms-transform: perspective(500px) rotateY(-0.034593rad);
  -o-transform: perspective(500px) rotateY(-0.034593rad);
  transform: perspective(500px) rotateY(-0.034593rad);
}
.metro .tile.half.tile-transform-left {
  -webkit-transform: perspective(500px) rotateY(-0.276744rad);
  -moz-transform: perspective(500px) rotateY(-0.276744rad);
  -ms-transform: perspective(500px) rotateY(-0.276744rad);
  -o-transform: perspective(500px) rotateY(-0.276744rad);
  transform: perspective(500px) rotateY(-0.276744rad);
}
.metro .tile-transform-top {
  -webkit-transform-origin: 50% bottom;
  -moz-transform-origin: 50% bottom;
  -ms-transform-origin: 50% bottom;
  -o-transform-origin: 50% bottom;
  transform-origin: 50% bottom;
  -webkit-transform: perspective(500px) rotateX(0.138372rad);
  -moz-transform: perspective(500px) rotateX(0.138372rad);
  -ms-transform: perspective(500px) rotateX(0.138372rad);
  -o-transform: perspective(500px) rotateX(0.138372rad);
  transform: perspective(500px) rotateX(0.138372rad);
}
.metro .tile.double.tile-transform-top {
  -webkit-transform: perspective(500px) rotateX(0.069186rad);
  -moz-transform: perspective(500px) rotateX(0.069186rad);
  -ms-transform: perspective(500px) rotateX(0.069186rad);
  -o-transform: perspective(500px) rotateX(0.069186rad);
  transform: perspective(500px) rotateX(0.069186rad);
}
.metro .tile.triple.tile-transform-top {
  -webkit-transform: perspective(500px) rotateX(0.046124rad);
  -moz-transform: perspective(500px) rotateX(0.046124rad);
  -ms-transform: perspective(500px) rotateX(0.046124rad);
  -o-transform: perspective(500px) rotateX(0.046124rad);
  transform: perspective(500px) rotateX(0.046124rad);
}
.metro .tile.quadro.tile-transform-top {
  -webkit-transform: perspective(500px) rotateX(0.034593rad);
  -moz-transform: perspective(500px) rotateX(0.034593rad);
  -ms-transform: perspective(500px) rotateX(0.034593rad);
  -o-transform: perspective(500px) rotateX(0.034593rad);
  transform: perspective(500px) rotateX(0.034593rad);
}
.metro .tile.half.tile-transform-top {
  -webkit-transform: perspective(500px) rotateX(0.276744rad);
  -moz-transform: perspective(500px) rotateX(0.276744rad);
  -ms-transform: perspective(500px) rotateX(0.276744rad);
  -o-transform: perspective(500px) rotateX(0.276744rad);
  transform: perspective(500px) rotateX(0.276744rad);
}
.metro .tile-transform-bottom {
  -webkit-transform-origin: 50% top;
  -moz-transform-origin: 50% top;
  -ms-transform-origin: 50% top;
  -o-transform-origin: 50% top;
  transform-origin: 50% top;
  -webkit-transform: perspective(500px) rotateX(-0.138372rad);
  -moz-transform: perspective(500px) rotateX(-0.138372rad);
  -ms-transform: perspective(500px) rotateX(-0.138372rad);
  -o-transform: perspective(500px) rotateX(-0.138372rad);
  transform: perspective(500px) rotateX(-0.138372rad);
}
.metro .tile.double.tile-transform-bottom {
  -webkit-transform: perspective(500px) rotateX(-0.069186rad);
  -moz-transform: perspective(500px) rotateX(-0.069186rad);
  -ms-transform: perspective(500px) rotateX(-0.069186rad);
  -o-transform: perspective(500px) rotateX(-0.069186rad);
  transform: perspective(500px) rotateX(-0.069186rad);
}
.metro .tile.triple.tile-transform-bottom {
  -webkit-transform: perspective(500px) rotateX(-0.046124rad);
  -moz-transform: perspective(500px) rotateX(-0.046124rad);
  -ms-transform: perspective(500px) rotateX(-0.046124rad);
  -o-transform: perspective(500px) rotateX(-0.046124rad);
  transform: perspective(500px) rotateX(-0.046124rad);
}
.metro .tile.quadro.tile-transform-bottom {
  -webkit-transform: perspective(500px) rotateX(-0.034593rad);
  -moz-transform: perspective(500px) rotateX(-0.034593rad);
  -ms-transform: perspective(500px) rotateX(-0.034593rad);
  -o-transform: perspective(500px) rotateX(-0.034593rad);
  transform: perspective(500px) rotateX(-0.034593rad);
}
.metro .tile.half.tile-transform-bottom {
  -webkit-transform: perspective(500px) rotateX(-0.276744rad);
  -moz-transform: perspective(500px) rotateX(-0.276744rad);
  -ms-transform: perspective(500px) rotateX(-0.276744rad);
  -o-transform: perspective(500px) rotateX(-0.276744rad);
  transform: perspective(500px) rotateX(-0.276744rad);
}                                                                

.metro .listview .list {
  border: 4px transparent solid;
  width: 300px;
  height: auto;
  position: relative;
  display: block;
  cursor: pointer;
  color: inherit;
  margin: 0 0 10px 0;
}
.metro .listview .list .list-content {
  padding: 10px;
  position: relative;
  display: block;
  color: inherit;
}
.metro .listview .list .list-content:before,
.metro .listview .list .list-content:after {
  display: table;
  content: "";
}
.metro .listview .list .list-content:after {
  clear: both;
}
.metro .listview .list:hover {
  outline: 3px #ccc solid;
}
.metro .listview .list:active {
  outline: 3px #3e3e3e solid;
}
.metro .listview .list {
  border: 1px #eaeaea solid;
}
.metro .listview .list .list-content .icon {
  display: block;
  width: 56px;
  height: 56px;
  font-size: 40px;
  float: left;
  margin-right: 10px;
}
.metro .listview .list .list-content [class*="icon-"].icon {
  padding: 8px;
}
.metro .listview .list .list-content .data {
  display: block;
  padding: 0;
  margin: 0;
  margin-left: 66px;
  min-width: 200px;
  position: relative;
}
.metro .listview .list .list-content .list-title,
.metro .listview .list .list-content .list-remark {
  margin: 0;
  padding: 0;
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.metro .listview .list .list-content .list-title {
  font-size: 14px;
  line-height: 16px;
}
.metro .listview .list .list-content .list-remark {
  font-size: 11px;
  line-height: 12px;
}
.metro .listview .list .list-content [class*="span"] {
  float: none;
}
.metro .listview .list .list-content .rating {
  color: inherit;
}
.metro .listview .list .list-content .progress-bar {
  margin: 5px 0;
}
.metro .listview.small .list-content .icon {
  display: block;
  width: 32px;
  height: 32px;
  line-height: 14px;
  font-size: 28px;
  float: left;
  margin-right: 10px;
}
.metro .listview.small .list-content [class*="icon-"].icon {
  padding: 8px 0;
}
.metro .listview.small .list-content [class*="icon-"].border {
  font-size: 22px;
  padding: 8px 4px;
}
.metro .listview.small .list-content .data {
  margin-left: 40px;
}
.metro .listview .list.selected {
  border: 4px #4390df solid;
}
.metro .listview .list.selected:after {
  position: absolute;
  display: block;
  border-top: 28px solid #4390df;
  border-left: 28px solid transparent;
  right: 0;
  content: "";
  top: 0;
  z-index: 101;
}
.metro .listview .list.selected:before {
  position: absolute;
  display: block;
  content: "\e003";
  color: #fff;
  right: 0;
  font-family: 'metroSysIcons';
  font-size: 9pt;
  font-weight: normal;
  z-index: 102;
  top: 0;
}

   
   .metro .listview .list { border: 0; border-bottom: 1px solid #eee; width: 100%; }
   .metro .listview a:hover { text-decoration: none; }
   
   .captbox .btn { width: 100%; }
   a.alert-success { display: block; color: #fff; text-decoration: none; font-weight: bold; background: #449D44; }    
   a.alert-success:hover { background: #000; }
   

/* =============================================================================
   Media Styles 
   ========================================================================== */    
   
@media only screen and (max-width: 1200px) {   
   #wrap > .container, .container, .row  { padding: 0 3%; margin: 0 auto; width: 96%; }      
   .navbar-nav > li { font-size: 11px; }                                               
}     
@media only screen and (max-width: 1080px) {      
   #leftbar, .navbar-brand { width: 30%;  }   
   #main, .navbar-nav  { width: 67%; }        
  .navbar-nav > li > a:after { display: none; }  
  .navbar-nav > li > a { padding: 25px 3px 10px 5px; }          
}    
@media only screen and (max-width: 959px) {            
   #leftbar { width: 100%; padding: 10px 3%; }   
   #main { width: 100%; }    
   .navbar-nav  { width: 74%; }                             
  
    #page-1 #subheader .metro .tile:first-of-type { margin-left: 0;}
    #leftbar h2 { padding-top: 10px; }  
    .infobox, .infobox:nth-of-type(2n+1) { clear: both; margin-right: 0; float: none; width: 100%; }    
}    
@media only screen and (max-width: 767px) {  
  
  .container-fluid > .navbar-collapse { position: relative; z-index: 5; margin-left: -35px; margin-right: -35px; padding-left: 20px; padding-right: 20px; background: #fff; box-shadow: 0 50px 50px 50px rgba(0,0,0,0.5); }
  .navbar-nav { margin-right: 0; width: 100%; margin-top: 8px; } 
  .navbar-nav > li, .navbar-nav > li.dropdown { float: none; width: 100%; margin: 0; font-size: 1em; }     
  .navbar-nav > li > a { padding: 5px 10px; border-bottom: 1px solid #fff; }
  .navbar-brand { min-height: 95px; height: auto; width: 50%; }  
  #search form { width: 45%; }   
  #header { height: 55px; }       
  .navbar-toggle { padding: 18px 15px 18px 15px; margin: 0; }
  
  #search { position: relative; z-index: 1; }
  .navbar-brand { z-index: 2; }  
  .navbar-nav { position: relative; z-index: 3; background: #fff; }
  .navbar-nav > li > a { height: auto; }
  .navbar-nav > li > ul { display: block; list-style: none; margin: 0; padding: 0; }   
  .navbar-nav > li > ul > li > a { display: block; padding: 5px 10px; background: #f6f6f6; color: #000; text-decoration: none; border-bottom: 1px solid #605D5C; }
  .navbar-nav > li > ul > li > a:hover { background: #605D5C; color: #fff; }
  .navbar-nav > li > ul > li.active > a { background: #000; color: #fff; }
  #navarrow.choosen, #hovernavi.choosen { display: none;}      
  
  

    #ovmenu { position: relative; z-index: 2; float: none; width: 100%; min-height: 80px; margin: 6px 0;}
    #ovmenu ul, #ovmenu ul li { list-style: none; margin: 0; padding: 0; }
    #ovmenu.metro .listview .list { border: 1px solid #ddd; width: 47%; margin-right: 10px; margin-bottom: 6px; float: left; }  
    #ovmenu.metro .listview .list.active { background: #eee; outline: none !important; }                                  
    #ovmenu.metro .listview .list .list-content { border: 0; padding: 5px 10px; }  
    #ovmenu.metro .listview .list .list-content .icon { font-size: 15px; height: 20px; width: 7%; }  
    #ovmenu.metro .listview .list .list-content .data { margin-left: 7%; width: 93%; min-width: 0; }     
    #ovmenu.metro .listview .list .list-content .data .list-title { font-size: 15px; line-height: 20px; }
    #overview.shortend { max-height: 100px; padding-top: 0;}           
    #overview.shortend .readmore { background: #fff; }    
    
    div.lang { display: none; }          
   div.moblang { margin: 0; display: block; float: right; width: auto; }
   div.moblang a { display: block; padding: 15px 7px; text-decoration: none; text-align: center; color: #fff; font-size: 20px; line-height: 20px; }   
  
}   
@media only screen and (max-width: 479px) {    

  #page-1 #subheader .metro .tile { width: 150px; height: 150px; margin-right: 10px; }       
  #page-1 #subheader .metro .tile.double { max-width: 310px; height: 150px; margin-right: 10px;}    
  
  .form-horizontal .form-group label { width: 100%; float: none;}
  .form-horizontal .form-group .form-control { width: 100%; float: none;}     
  .form-horizontal .btn { margin-top: 1em; width: 100%; float: none;}
  #ovmenu.metro .listview .list { border: 1px solid #ddd; width: 100%; margin-right: 0; margin-bottom: 6px; float: none; }  
  #overview.shortend { max-height: 130px; padding-top: 0;}   
  li.printbtn {display: none; }       
}     
@media only screen and (max-width: 339px) {    

  #page-1 #subheader .metro .tile, #page-1 #subheader .metro .tile.double { max-width: 100%; width: 100%; height: 120px; margin-right: 0;}            
} 

.video img.videoposter { display: none !important; }

@media print {     
   #wrap > .container, .container, .row  { padding: 0 3%; margin: 0 auto; width: 100%; }             
   #leftbar { width: 100%; margin-left: 0; padding-left: 0; }   
   #main { width: 100%; }   
   
   .navbar-nav, #search, #ovmenu, #contact, #demoformular, #downloads { display: none; }   
   .versteckt { display: block; }
   #footer { background: #fff; border-top: 1px solid #000; }
   #footer, #footer a, #footer a:link, #footer a:visited, #footer a:hover { color: #000;  }
   .navbar-brand { position: relative; width: 300px; height: auto; }
   #header { height: auto; border-bottom: 1px solid #000; background: #fff; display: none; }
   #leftbar h2 { padding-top: 1em; }
   
   .video img.videoposter { display: block !important; }
   .video video { display: none !important; }
                                                                              
}  