@media only screen and (min-width: 0px) and (max-width : 600px){
    body{height: auto !important; background: none!important;}  
    #canvas{width: 100%!important; margin: 0 auto; display: block; }
    #teaserimages{height: 410px !important;}
    .slideshow-wrapper{
      width: 100% !important;
     height: 300px !important;}
    #headlines{width: 97%!important; margin: 0 0 0 5px !important; top: 25px !important; height: 100%;}
    .slideshow-wrapper img{width: 100%;}
    .headline{font-size: 32px !important; line-height: 32px !important;}
    #headlines a{font-size: 12px  !important; padding: 5px 15px  !important;}
    #menu ul.level1 li a,
    #menu ul.level1 li a:hover{font-size: 9px; padding: 4px 5px 2px 5px !important;}
    #menu ul.level1 li.lastitem a,
    #menu ul.level1 li.lastitem a:hover{padding: 6px 0 !important;}
    .sec_navbg a, .sec_navbg span{font-size: 10px !important;}
    #sec_nav ul.dropdown{width: 45% !important;}
    #sec_nav ul.dropdown li{
       padding:0 5px 0 0!important;
       margin: 0;}
    #twfeed{width: 100% !important; margin: 5px 0 !important;}
    .twfeed_in{width: 100% !important;}
    #twfeed img{width: 99% !important;}
      .twfeed_in div{left: 0!important; top: -2px !important; text-align: center; width: 100%;}
  .twfeed_in div span{font-size: 11px !important;}
  .twfeed_in div h1{font-size: 11px !important; display: block !important; margin-top: 5px; background: #efefef; padding: 3px;}
    .slideshow-controls{top: 85%!important;}
    .social_promo a:first-child{width: 40%; float: left;}
    .social_promo a:last-child{width: 59%; float: left;}
    .social_promo a img{width: 100%; height: auto;}
     #promos h2{font-size: 15px !important; line-height: 18px !important; }
     #footer_home .content ul li a, #footer_home h4, #footer_home li{font-size: 10px !important;}
  #footer_home{padding-bottom: 55px !important;}
  }

@media only screen and (min-width: 320px) and (max-width : 479px){  
  #headlines { top: 10px !important;}
  .headline {
     font-size: 15px !important;
    line-height: 15px !important;
    }
  #headlines p {
    font-size: 11px !important;
    line-height: 13px !important;}
  .slideshow-wrapper {
    height: 130px !important;
    }
  #teaserimages {
    height: 285px !important;
  }
  #footer_home{background: #4a4a4a !important;}
  #menu ul.level1 li{margin: 3px 2px !important;}
  .social_promo a:first-child{width: 100% !important;}
  .social_promo a:last-child{width: 100% !important;}
  #headlines a{position: absolute; bottom: 20px; right: -5px;}  
  #sec_nav{width: 62% !important;}
  }

@media only screen and (min-width: 320px) and (max-width : 350px){
  #menu ul.level1 li:nth-last-child(2) {width: 98% !important;}
  #teaserimages {
    height: 310px !important;
  }
}
 
@media only screen and (min-width: 480px) and (max-width : 600px){  
  #headlines { top: 30px !important;}
  .headline {
     font-size: 15px !important;
    line-height: 15px !important;
    }  
  #teaserimages {height: 330px !important;}
  .slideshow-wrapper {height: 180px !important;}
  #footer_home{background: #646464;}    
  #sec_nav{width: 45% !important;}    
  #menu ul.level1 li{margin: 3px 4px !important;}
  }
@media only screen and (min-width:360px) and (max-width : 479px){
  #sec_nav{width: 55% !important;}
  #teaserimages {height: 280px !important;}
  }                                                            
@media only screen and (min-width:320px) and (max-width : 600px){
     #login{height: auto!important;}
     #containerNavMeta{display: none!important;}
     #containerGlobalSearch{width: 45% !important; margin: 3px 0 0 0!important; padding:0!important;}
     #country-selector{ display: none!important;}
     #globalSearch{margin-top: 0!important;}
     #globalSearch span.searchInputWrapper{width: 65%!important; height: 13px!important; padding: 2px; border: 1px solid #ccc; border-radius: 8px 0;}
     #containerGlobalSearch p{padding: 5px 5px 0 0 !important; font-size: 10px;}
     #globalSearch input.searchInput{background: none!important; position: relative !important; padding: 0 !important;}
     #globalSearch span.right{display: none!important;}
    #login{background: none !important;}
    #logo{margin-left: 5px !important; width: 100px !important; height: 40px!important; position: absolute !important; top: -22px !important;}
    .sec_navbg{background: #fff !important; float: right !important;}
    #sec_nav ul.sublinks li a{margin: 0 !important;}
    #sec_nav{padding: 0 !important;}
    #sec_nav ul.sublinks{width: 98% !important;}
    #sec_nav ul.dropdown{display: none !important; width: 0% !important;}
    #promos p a span{font-size: 14px !important;}
    #menu ul.level1{
      background: none !important;
      height: auto!important;
      display: table;
      width: 100%;
      margin: 11px 0 0 0 !important;
      padding: 0 !important;}
      
    #menu ul.level1 li{
      float: left; 
      overflow: hidden; 
      color: #000 !important; 
      display: table-cell;  
      vertical-align: middle; 
      text-align: center; 
      height: auto!important;
      width: 31% !important;
      border: 1px solid #ccc;
      background: #efefef!important;
      border-radius: 9px 0;}
     #menu ul.level1 li a{float: none !important;}
    
    #menu ul.level1 li .level2 .submenu_column a.h_link,
    #menu ul.level1 li.lastitem .level2 .submenu_column a.h_link,
    #menu ul.level1 li .level2 .submenu_column a{
          font-size: 10px !important;
          background: 0 none !important; 
          width: auto!important;
          padding: 3px !important;
          line-height: 11px !important;
          height: auto !important;
          float: left !important;
          background: #efefef;
    }
    
    #menu .level2 .submenu_column a.h_link:hover,
    #menu ul.level1 li.lastitem .level2 .submenu_column a.h_link:hover{
          font-size: 10px !important;
          background: 0 none !important; 
          width: 97% !important;
          height: auto !important;
         }

     #menu ul.level1 li a,
     #menu ul.level1 li a:hover{line-height: 13px !important; color: #000 !important; background: none !important; text-shadow: none !important; width: auto!important;  padding: 3px 0!important; height: auto;}
    
     #menu ul.level1 li.lastitem a, 
     #menu ul.level1 li.lastitem a:hover{background: #00263d !important; color: #a0d4e9 !important; font-size: 13px; width:100%!important; }
    
    #menu div.level2{margin: 0!important; width: 99%!important; border: 1px solid red; padding: 0!important; left: 0!important; display: none!important;}
    #menu .level2 .submenu_column{width: 40% !important;}

    #menu ul.level1 li .level2 .submenu_column a{padding: 3px 0!important; margin: 0;}
    #menu ul.level1 li .level2 .submenu_column a:hover{padding: 3px 0!important; color: #444 !important;}
    #menu ul.level1 li.lastitem{display: block !important; clear: both; width: 99%!important; margin: 4px 0!important;}

    #headlines p {
      font-size: 11px !important;
      line-height: 12px !important;
      margin: 10px 0 0 !important;}
    
   .headline {
      font-size: 16px !important;
      line-height: 19px !important;
    }

    #headlines a {
      font-size: 9px !important;
      padding: 0 5px !important;
      border-radius: 0px!important;
      box-shadow: none!important;
    }
  
  .slideshow-controls {display: none !important;}
  .grid-margin{width: 2% !important;}
  #grid-platforms p{font-size: 13px !important; line-height: 13px !important;}
  .grid-highlights,
  .grid-platforms-5boxes{width: 92% !important;  margin: 5px !important; border: 1px solid #ccc; border-radius: 10px 0; text-align: center; background: 0 none !important; }
  .grid-platforms-5boxes{height: auto!important;}
  div.grid-platforms-5boxes p{width: 45%;}
   #twfeed img { height: auto!important;}
   .social_promo{ margin: 5px 0 !important;}
   .promologo{ left: 50%; transform: translate(-50%, 0)!important; -webkit-transform: translate(-50%, 0); display: inline-block !important; }
   .promologo{ transform: translate(-50vw, 0); }
   #tabnav{
    margin: 0 !important;
    width: 100% !important;}
   ul#tabnav li{width: 50%;}
   ul#tabnav li a{width: 100% !important; padding: 0 !important; text-align: center;}
   #footer_home .content ul{width: 100%!important;}
   #footer_home .content ul li{clear: none !important; float: left; border-right: 1px solid #ccc;}
   #footer_home .content ul li:first-child{display: block; width: 100%; text-align: center;}
   #footer_home .content ul li:last-child{border: 0 none;}
   #footer_home .content ul li a{margin: 0 3px!important; padding: 0 5px!important; font-size: 11px !important;}
   #footer_links{background:  none !important; border-top: 1px solid #999;}
  }

@media only screen and (min-width : 601px) and (max-width : 767px){
   #menu ul.level1 li a, #menu ul.level1 li a:hover{font-size: 9px !important;}
   #promos h2{width: 45%;}
  }
              
@media only screen and (min-width : 601px) and (max-width : 767px){
  .grid-highlights,
  .grid-platforms-5boxes{height: auto!important; padding: 5px 10px!important; width: 94% !important;  margin: 5px !important; border: 1px solid #ccc; border-radius: 10px 0; text-align: center; background: 0 none !important; }
  .grid-platforms-5boxes a{font-size: 16px; line-height: 17px;}
  .grid-highlights{padding: 45px 10px!important;}
  .grid-highlights h2{float: left;}
  .twfeed_in{width: 100% !important;}
.promologo {
    bottom: 10px !important;
    right: 10px;
}
    #tabnav{
    margin: 0 !important;
    width: 100% !important;}
   ul#tabnav li{width: 50%;}
   ul#tabnav li a{width: 100% !important; padding: 0 !important; text-align: center;}
   #footer_home .content ul{width: 100%!important;}
   #footer_home .content ul li{clear: none !important; float: left; border-right: 1px solid #ccc;}
   #footer_home .content ul li:first-child{display: block; width: 100%; text-align: center;}
   #footer_home .content ul li:last-child{border: 0 none;}
   #footer_home .content ul li a{margin: 0 3px!important; padding: 0 5px!important; font-size: 11px !important;}
   #footer_links{background:  none !important; border-top: 1px solid #999;}
   #teaserimages{height: 370px !important;}
    .slideshow-wrapper{
      width: 100% !important;
     height: 250px !important;}
    
    #headlines p {
      font-size: 15px !important;
      line-height: 17px !important;
      margin: 10px 0 0 !important;}
    
   .headline {
      font-size: 20px !important;
      line-height: 21px !important;
    }
   #sec_nav ul.dropdown ul{width: auto!important;}
   #sec_nav ul.dropdown ul li{height: auto!important; display: block;}
   #sec_nav ul.dropdown ul li a{padding: 3px !important;}
   #twfeed{margin: 5px 0!important; height: 30px !important;}
  .twfeed_in div{width: 100%; left: 55px !important; top: 0 !important;}
  .twfeed_in div span{font-size: 11px !important;}
  .twfeed_in div h1{font-size: 11px !important;   }
  .twfeed_in img{height: auto!important;}
   }


@media screen and (min-width : 768px) and (max-width : 972px){
  #teaserimages{height: 410px !important;}
  .slideshow-wrapper{height: 300px !important;}  
  .twfeed_in{width: 100% !important;}
  .twfeed_in div{left: 60px !important;}
  .twfeed_in div span{font-size: 13px !important;}
  .twfeed_in div h1{font-size: 13px !important;   }
  }


@media screen and (min-width : 697px) and (max-width : 972px){
  .grid-platforms-5boxes{width: 16.2% !important;}
  .grid-margin{width: 1% !important;}
  #grid-platforms p{font-size: 13px !important; line-height: 13px !important;}
  .grid-highlights{width: 30.7% !important;}
  .promologo{width: 92% !important;}
  #footer_home .content ul{width: 19% !important;}
   .headline{font-size: 32px !important; line-height: 32px !important;}
  }


@media screen and (min-width : 601px) and (max-width : 972px){
    body{height: auto !important;}  
    #canvas{width: 100%!important; margin: 0 auto; display: block; }
    .slideshow-wrapper{width: 100% !important;}
    #headlines{width: 95%!important; margin: 0 0 0 5px !important; top: 25px !important;}
    .slideshow-wrapper img{width: 100%;}
    #headlines a{font-size: 12px  !important; padding: 5px 15px  !important;}
    #menu ul.level1 li a,
    #menu ul.level1 li a:hover{font-size: 10px; padding: 4px 5px 2px 5px !important;}
    #menu ul.level1 li.lastitem a, #menu ul.level1 li.lastitem a:hover{width: auto!important;}
    .sec_navbg a, .sec_navbg span{font-size: 10px !important;}
    #sec_nav ul.sublinks{width: 55% !important;}
    #sec_nav ul.sublinks li a{margin: 0 !important;}
    #sec_nav ul.dropdown{width: 45% !important;}
    #sec_nav ul.dropdown li{
       padding:0 5px 0 0!important;
       margin: 0;}
    #twfeed{width: 100% !important;}
    #twfeed img{width: 99% !important;}
    .slideshow-controls{top: 85%!important;}
    .social_promo a:first-child{width: 40%; float: left;}
    .social_promo a:last-child{width: 59%; float: left;}
    .social_promo a img{width: 100%; height: 44px;}
     #promos h2{font-size: 15px !important; line-height: 18px !important; width: 45%;}
     #footer_home .content ul li a, #footer_home h4, #footer_home li{font-size: 10px !important;}
      #menu ul.level1 li .level2 .submenu_column a.h_link,
    #menu ul.level1 li.lastitem .level2 .submenu_column a.h_link,
    #menu ul.level1 li .level2 .submenu_column a{
          font-size: 10px !important;
          background: 0 none !important; 
          width: 97%!important;
          height: auto !important;
    }
    
    #menu .level2 .submenu_column a.h_link:hover,
    #menu ul.level1 li.lastitem .level2 .submenu_column a.h_link:hover{
          font-size: 10px !important;
          background: 0 none !important; 
          width: 97% !important;
          height: auto !important;}
      #menu ul.level1 li .level2 .submenu_column a{padding: 3px !important; margin: 0;}
    #menu ul.level1 li .level2 .submenu_column a:hover{padding: 3px !important; color: #444 !important;}
    #country-selector{width: 30% !important;}
    #containerGlobalSearch{width: 30% !important;}
    #containerNavMeta{width: 30% !important;}
    .topHint li{font-size: 10px !important;}
    div.grid-platforms-5boxes p{width: 45% !important;}
    #globalSearch span.searchInputWrapper{width: 55% !important;}
    }