/* * Mobile CSS * */

/* Tablet or smaller */
@media only screen and (max-width: 1024px) {
  ul.DataFoldList,
  ul.DataFoldList li,
  ul.DataFoldList li ul,
  ul.DataFoldList li ul li    {height: auto; list-style-image: url(../img/_layout/list_bullet.png); list-style-type:disc; transition: none; -webkit-transition: none; -moz-transition: none; -o-transition: none; }
  ul.DataFoldList li ul       {padding-top: 10px;}

/*  
  .printbtn                   {}
  .socialbar                  {clear: both !important; width: 450px !important; }
  .socialbtns                 {}
  #fb-root                    {}
  */      
}

@media only screen and (max-width: 980px) {
  #pageContainer              {width: 100%; }
  #ContentBoxTop              {}
  .ContentBoxTopInner         {width: 100%; background-image: url(../img/_layout/logo_jlu_solo.png); }
  .headerBoxLogo              {right: 82px; }

  .BreadCrumbBox              {margin-left: 10px !important; }

  #ContentBoxBottom           {}
  .ContentBoxLeft             {}
  #ContentBoxTopMenu          { }
  .ContentContainer           {width: 100%; }
  .ContentBoxMiddle           {width: 48%; }
  .parent-body-2327 .ContentBoxMiddle,
  #start .ContentBoxMiddle    {width: 75%; padding-left:15px; }

  ul.makeMenu                 {width: 100%; }
  ul.makeMenu li              {width: auto; }

  a.TopMenu, a.TopMenu:visited, a.TopMenu:link, a.TopMenu:active,
  a.TopMenu_sel, a.TopMenu_sel:hover, a.TopMenu_sel:visited, a.TopMenu_sel:link, a.TopMenu_sel:active,
  a.TopMenu:hover                     					                                                       {padding: 8px 20px 7px; }

  .FooterBox                  {width: 100%; }

}


/* smaller Tablets */
@media only screen and (max-width: 860px) {
  .show-mobile-0,
  .Comments,
  .CommentBox,
  #tagcloud,
  .LabelBox,
  .socialbar,
  .sociallinks,
  .BreadCrumbBox,
  a.section-anchor,
  a.section-anchor-sub,
  .parallax-slide,
  .sociallinks,
  a.close-btn,
  a.printbtn                  {display: none !important; }

  .MainNewsBtn                {display: block; }
  
  .ContentBoxMiddle .tile_square    {width: 47% !important; }
  .ContentBoxMiddle .tile_square p  {font-size: 100% !important; }

  h1                          {font-size: 140% !important; }

  #pageBody                   {background: #ffffff !important; }
  #pageContainer              {background: #ffffff !important; }

  a.extrabutton-up            {right: 10px !important; left: auto !important; margin: 5px 0px !important; }
  .minimized                  {display: none !important; }
  a.TopMenu                   {font-size: 16px !important; }
  a.MenuLevelSub              {font-size: 14px !important; }
  a.main-nav-toggle           {display: block; }

  .LanguageBox                {position: absolute !important; top: 10px !important; left: 10px !important; float: none !important; margin: 0px 0px 0px 0px !important; }

  #mainnav                    {position: fixed !important; display: block !important; top: 0px !important; width: 100% !important; box-shadow: 0px 5px 5px rgba(0,0,0,0.4); -moz-box-shadow: 0px 5px 5px rgba(0,0,0,0.4); -webkit-box-shadow: 0px 5px 5px rgba(0,0,0,0.4); }
  #start #mainnav             {top: 120px !important; }
  ul.makeMenu                 {position: fixed !important; width: 102% !important; height: 85% !important; overflow: auto !important; margin: 35px auto; padding: 0px; z-index: 1300; border: 1px solid #000000; background: #83a99f !important; }
  ul.makeMenu li              {display: block !important; width: 100% !important; height: auto !important; padding: 0px !important; margin: 0px !important; border: none !important; }
  ul.makeMenu li ul           {position: relative; top: auto !important; left: 0px !important; width: 100% !important; border: none !important; padding: 0px !important; margin: 0px !important; background: transparent url(../img/_layout/bg_white_trans30.png) repeat left top !important; -moz-border-radius: none; -webkit-border-radius: none; -khtml-border-radius: none; border-radius: none; box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; }
  ul.makeMenu li:hover > ul   {display: block !important;}
  ul.makeMenu a               {text-align: center !important; padding-bottom: 10px !important; border: none !important; }
  a.active-menu               {background: #006440 !important; padding-bottom: 10px !important; }

  a.MenuLevelSubSub, a.MenuLevelSubSub:visited, a.MenuLevelSubSub:link, a.MenuLevelSubSub:active	                                             {background: transparent url(../img/_layout/bg_white_trans20.png) repeat left top !important; }
  a.MenuLevelSubSub_sel, a.MenuLevelSubSub_sel:hover, a.MenuLevelSubSub_sel:visited, a.MenuLevelSubSub_sel:link, a.MenuLevelSubSub_sel:active	 {background: #eeeeee !important; }
  a.MenuLevelSubSub:hover                     					                                                                                       {background: #eeeeee !important; }

  ul.makeSubMenu                     {left: 0px; width: 100%; }
  ul.makeSubMenu ul,
  ul.makeSubMenu li                  {width: 100% !important; }
  a.makeSubMenuTop                   {font-size: 14px !important; width: 100% !important; padding: 6px 20px !important; }
  a.MenuLevelSub, a.MenuLevelSub_sel {font-size: 13px !important; width: 100% !important; background-image: none !important; padding: 8px 10px !important; }

  /* Slideshows */
  .BackgroundImage                   {height: 200px; margin: 140px auto 0px; }
  .tile_slide img                    {top: auto; bottom: 0px; height: auto; min-height: auto; }

  #ContentBoxTop                     {position: fixed !important; display: none !important; }
  #start #ContentBoxTop              {display: block !important; height: 120px !important; }
  .headerBox, .headerBoxLogo         {display: block; height: 100%; margin: 0px auto; }
  #ContentBoxTop .headerBoxLogo img  {margin: 0px 0px 0px 0px; height: 100%; }

  .ContentContainer           {padding: 40px 0px 30px 0px !important; margin: 0px !important; background: transparent !important; }
  #start .ContentContainer    {padding: 10px 0px 30px 0px !important; margin: 0px !important; }

  .ContentBoxLeft,
  .ContentBoxMiddle,
  .ContentBoxRight            {position: relative; top: auto; left: auto; display: block !important; width: 96% !important;  float: none !important; margin: 10px; padding: 0px; vertical-align: top; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; }


  .MainNewsBtn                {width: 100%; margin: 0px 0px 10px 0px; }
  #start .MainNewsBtn         {margin-top: 5px; }
  #start #newstop             {padding-top: 150px; }

  .ContentTextBoxLeft,
  .ContentTextBoxRight        {width: 100% !important; margin: 0px !important; padding: 0px !important; }
  .ContentImgBoxLeft,
  .ContentImgBoxRight         {width: 100% !important; margin: 0px !important; padding: 0px !important; }
  .ContentImgBoxNormal img,
  .ContentImgBoxLeft img,
  .ContentImgBoxRight img     {max-width: 92% !important; } 
  .leftcolumn,
  .rightcolumn                {float: none !important; width: 94% !important; margin: 0px !important; padding: 0px !important; }

  /* EXTRA-MENU */
  #ContentBoxTop ul.makeExtraMenu        {display: none !important;}
  #ContentBoxBottom                      {display: block !important; }
  #start #ContentBoxBottom               {top: 120px !important; }
  ul.makeExtraMenu	          {position: relative !important; overflow: hidden !important; top: 0px !important; left: auto !important; bottom: auto !important; right: 10px !important; width: auto !important; text-align:right; margin: 0px 0px 0px 0px !important; padding: 0px !important; }
  ul.makeExtraMenu li         {display: inline-block !important; float: none !important; width: 40px !important; margin: 0px !important; padding: 0px !important; }
  ul.makeExtraMenu li a       {color: transparent !important; height: 40px !important; min-width: none !important; width: 100% !important; background-repeat: no-repeat !important; background-position: center center !important; border-color: #ffffff !important; margin: 0px !important; padding: 0px 0px !important; }
  .extramenu-back             {display: none !important; border-left: none !important; } 
  a.printbtn,
  ul.makeExtraMenu li.li-extramenu-print         {display: none !important;}

  /* HOME: EXTRA-MENU */
  ul.makeExtraMenu li.li-extramenu-10,
  ul.makeExtraMenu li.li-extramenu-1804,
  #start .extramenu-back,
  #start .li-extramenu-back   {display: none !important;}

  .extramenu-back    { background-image: url(../img/_layout/icon_back.png) !important; } /* Back */
  .extramenu-975,
  .extramenu-1       { background-image: url(../img/_layout/icon_home.png) !important; } /* Home */
  .extramenu-1802,
  .extramenu-8       { background-image: url(../img/_layout/icon_contact.png) !important; } /* Kontakt */
  .extramenu-1803,
  .extramenu-9       { background-image: url(../img/_layout/icon_imprint.png) !important; } /* Impressum */

  .extramenu-1833    { background-image: url(../img/_layout/icon_phone.png) !important; } /* Sekretariat */
  .extramenu-37,
  .extramenu-1038    { background-image: url(../img/_layout/icon_partner.png) !important; } /* Partner */  
  .extramenu-1805,
  .extramenu-324     { background-image: url(../img/_layout/icon_dataprotection.png) !important; } /* Disclaimer */  
  .extramenu-1804,
  .extramenu-10      { background-image: url(../img/_layout/icon_sitemap.png) !important; } /* Sitemap */

}


@media only screen and (max-width: 540px) {

  .BackgroundImage                   {height: 160px; }
  .tile                              {width: 96%; margin: 0px 0px 10px 0px; }

}


@media only screen and (max-width: 400px) {

  /* Slideshows */
  .BackgroundImage                   {height: 120px; }

}