/********* MOBILE ***********/
/****************************/
                                     
@media screen and (max-width:960px){
  body                        {}
  img                         {max-width: 100%; height: auto;}
  #page                       {width: 96%;padding-left: 2%;padding-right:2%;}
  .banners                    {float: none;}
  .banners .banner            {margin: 0 10px 10px 0;}
  .links                      {margin-right: 10px;}
  .el_article.with_col        {float: none; width: 100%;}
  .el_aside                   {float: none; width: 100%;}
  .el_aside .survey           {margin-bottom: 20px;}
  .big_text                   {display: none;}
  .mid_text                   {color:#000;}
  .footer_cont                {width: 100%;}
  .footer_bg                  {padding: 0px 10px; width:auto;}
  .webcam                     {display: none !important}

  #lang_menu                  {margin-top: 10px;}
  #main_search_box            {clear:right; margin-top:5px;}
  
  .article .date              {padding:0; float:none;} /* add 18.5.*/
  article .under_article_banner { max-width:700px; width:100%;}   /* add 18.5.*/
  .mobil                      {margin:0 0 20px;}
  
  .bxslider img { width: 50%; height: auto; margin: 0; }
  .bxslider .desc { width: 47%; margin-left: 3%; padding-left: 0 !important; }
  .bx-wrapper {
    margin: 0 auto 20px;
  }
  .bxslider .more { margin-left: 0; }
                      
}

@media screen and (max-width:768px){
  body.turist                 {background: url(../images/plzen2/mobile_bg.png) repeat-x top}
  #page                       {overflow: hidden; padding-bottom:65px;}   /* edit 18.5. */
  #top                        {height: 160px;}
  .slider                     {display:none;}             
  #sitelinks                  {position: relative; top: 0px;margin-bottom:10px;}
  #sitelinks a.blank.first    {margin-right:0px;}
  #logo img                   {width: 140px; margin-top: 5px;}
  #lang_menu                  {position: absolute; top:2px; right: 0px; margin: 0 ; width: auto; z-index: 9999;padding: 5px}
  #lang_menu a                {border: 0px ; float: none; display: none; text-align: right; padding: 3px 0 !important }
  #lang_menu a.active         {display: block;}
  #lang_menu:hover            {border: 1px #DDDDDD solid; background: #B9B9B9 url() ; }
  #lang_menu:hover a          {display: block;} 
  #nav                        {top: 100px}
  #menu li                    {display: none;}
  #menu li.mobile,
  #menu li.mobile_list        {display: table-cell;}       
  .tabs .tabs_header          {display: none;}
  .tabs .ui-tabs-panel        {display: block !important; margin-bottom: 20px;}
  .article.district .title    {width: 80%; padding-right: 15px;}
  .padding .article.district .title{width: 60%;}
  .article .date              {margin-bottom: 0;}
  .birobox                    {height: 100%;}
  .footer_cont .col_50,
  .tabs .col_33               {float: none !important; width: 100%}
  .txt_banner                 {float: none; width: auto; max-width: 220px; margin: 0 0 10px 0}
  .footer_bg                  {background-image: url() !important;}
  .know                       {width: 100%; height: auto;}
  .know.webcam-box .whitebox { padding-right: 20px;padding-left: 20px;background: none;}
  .know.webcam-box .next-2 { position: static;margin: 20px 0 0;}
  .know .whitebox             {height: 100%;}
  .calendar                   {width: 100%;}
  #content > div              {float: none; width: auto; clear: both;margin:0 0 20px}
  #content > div.clear        {display:none;}
  
  #program                    {position: absolute; left: 180px; top: 46px; width: 110px; height: 35px;margin: 0; padding: 5px 10px; border-bottom: 1px solid #d14d80; font-size: 18px;}
  #program .arrow {display: none;}
  .button .icon {padding-right: 15px;}
  .col_50,
  .col_33,
  .col_25 {float: none;width: auto;}
  .whitebox {padding:15px;}
  #main_search_box            {position: absolute;right:0;top:55px;margin-top:0; }
  #main_search_box .search_js {border: 1px solid #ababab;}
  #main_search_box .input     {width:120px;}
  .turist #main_search_box .magnifier {background: url(../images/plzen2/magnifier2.png) no-repeat top;}

  #sitelinks                  {margin-right:40px;}
@media screen and (max-width:640px) {
  .bxslider .item { padding: 15px 10px;}
  .bxslider img { width: 100%; margin-bottom: 15px; }
  .bxslider .desc { width: 100%; margin-left: 0; }
  .bx-controls-direction { display: none; }
  .footer_cont .social { float: none; clear: both; padding-top: 10px;}
}
  #sitelinks a,
  #sitelinks a.out            {background: url() !important;  width: 60px !important; margin: 3px 0 0 10px !important; text-indent:0px; color:#000;}
  #sitelinks a:hover          {text-decoration: underline;} 

}

@media screen and (max-width:500px){
  .footer_cont .col_33,
  .tabs  .col_50              {float: none !important; width: 100% }
  .tabs  .col_50 .padding     {padding: 0 }
  .tabs  .col_50 .birobox     {border:0 !important}
  .padding .article.district .title{width: 80%;}
  .button                     {font-size: 12px !important; padding: 0 15px !important}
  #lang_menu                  {top:9px;}
  #sitelinks                  {top: 7px;}
  #top                        {height:200px;}
  #program                    {width:100%;}
  #main_search_box            {left: 10px;right:0;top: 162px;background:lime;}
  #main_search_box .search_js {width:100%;}
  #main_search_box .magnifier {position:absolute;right:6px;top:4px;background-color:#fff;}
}


@media screen and (max-width:350px){
  #logo img                   {width: 100px; margin-top:10px;}
  #sitelinks a,
  #sitelinks a.out            {background: none !important;width: 50px !important;margin: 3px 0 0 5px !important; text-indent:0px;font-size:14px;}
  #sitelinks a:hover          {text-decoration: underline;} 
   
  .el_article table td,
  .el_article table th            {padding: 3px } 
  #lang_menu                  {top:6px;}
  #sitelinks                  {top: 4px}
}