@media screen and (min-width: 950px)
{

  #sidebar
  {
    font-size:101%;
  }

  body,
  body.sidebarstyle
  {
    background-position:-60px 0 ;
  }

  #sidebar
  {
    background:url(../Images/random.png) repeat 0 -60px, url(../Images/Body.png) repeat-y -60px -60px;
    width:270px;
  }

  .sidebarstyle #sidebar
  {
    background:url(../Images/random.png) repeat 0 -60px, url(../Images/Body.png) repeat-y -60px -60px;
    width:270px;
  }

  #content,
  .sidebarstyle #content
  {
    margin-left:270px;
  }

  #main 
  {
    min-height:0;
  }

  .sidebarstyle .overlay100
  {
    left: 270px !important; /*270 is position of vertical line*/
    width:665px;
  }

}



@media screen and (min-width: 1010px)
{

  #sidebar
  {
    font-size:125%;
  }

  body,
  body.sidebarstyle
  {
    background-position:0 0 ;
  }

  #sidebar
  {
    background:url(../Images/random.png) repeat 0 -60px, url(../Images/Body.png) repeat-y 0px -60px;
    width:330px;
  }

  .sidebarstyle #sidebar
  {
    background:url(../Images/random.png) repeat 0 -60px, url(../Images/Body.png) repeat-y 0px -60px;
    width:330px;
  }

  #content,
  .sidebarstyle #content
  {
    margin-left:330px;
  }

  #main 
  {
    min-height:0;
  }

  .sidebarstyle .overlay100
  {
    xxpadding-left: 300px !important; /*270 is position of vertical line*/
    xxpadding-top: 100px !important; /*270 is position of vertical line*/
  }
  .sidebarstyle .overlay100
  {
    left: 330px !important; /*270 is position of vertical line*/
    width:665px;
  }

}


@media screen and (min-width: 1036px)
{

  .sidebarstyle .overlay100
  {
    left: 0px !important; /*270 is position of vertical line*/
    width:675px;
    top:0;
  }

  #topnav,
  #wrapper
  {
    margin-left:auto;
    margin-right:auto;
    width:1028px;
  }
  
  .datamine #topnav,
  .datamine #wrapper
  {
    margin-left:auto;
    margin-right:auto;
    width:auto;
  }
  
  #wrapper
  {
    padding:0;
  }
  
  body
  {
    background: white;
  }
  
  #wrapper
  {
    background-repeat:repeat-y;
    background:url(../Images/random.png) repeat 0 0, url(../Images/Body.png) repeat-y 0 0;
    float:none;
    height:10000px; /*nb this is used in RDTFrame.js to detect it as the large version so be careful if you change it*/
  }
  
  #sidebar,
  .sidebarstyle #sidebar
  {
    background:none;
    float:none;
    left:-350px;
    margin-left:auto;
    margin-right:auto;
    position:relative;
    top:-10000px;
  }

  .datamine  #wrapper
  {
    background:url("../Images/random.png") repeat scroll 0 0pt, url("../Images/Body.png") repeat-y scroll -330px 0 transparent
  }

}




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

  /*all this is clearing stuff from the main stylesheet for the side bar*/
  .hasSearch div#search
  {
    display: block;
  }

  #searchIcon
  {
    display: inline;
  }
  
  #xxstrSearch
  {
    display: none;
  }

  body,
  body.sidebarstyle
  {
    background-position:-330px 0px;
  }

  #wrapper
  {
    padding-right: 0;
  }

  #sidebar,
  .sidebarstyle #sidebar
  {
    background-image:url(../Images/random.png);
    background-repeat:repeat;
    margin-top:10px;
    float:none;
    left:0px;
    position:inherit;
    width:100%;
  }

  #sidebarcontent
  {
    cbackground:url(../Images/fade.png) repeat-x 0 -120px;
    _background-image:none;
    margin:0;
    padding:12px 0 0 0;
  }

  #wrapper
  {
    float:none;
    margin-left:0;
  }

  #content
  {
    margin-left:0;   
  }

  #main
  {
    margin-left:10%;
  }
  
  .datamine #main
  {
    margin-left:0;
  }
  
  .sidebarstyle #content
  {
    margin-left:0;
    _background-image:none;
  }

  .sidebarstyle .overlay100
  {
    display:none;
  }

  #sidebar li,
  .sidebarstyle #sidebar li
  {
    white-space:nowrap;
  }

  #frmSearch
  {
    margin-left:9px;
    margin-right:4px;
    width:95%;
  }
  
  #results
  {
    margin-right:8px;
    width:95%;
  }

  #sidebar #results li, 
  .sidebarstyle #results #sidebar li
  {
    white-space: normal;
  }
  
  #footer
  {
    display:none
  }

  #sidebar
  {
    font-size:115%;
  }

  #sidebarcontent li br
  {
    display:none;
  }
  
  #xxxsidebarcontent #results li br
  {
    display:block;
    background-color:red;
  }
  
  #sidebarcontent li
  {
    display:inline;
    line-height:2;
    padding-right:24px;
  }
  
  #sidebarcontent #results li
  {
    display:block;
    line-height:1;
    padding-right:0;
  }
  
  #RDTOverlay
  {
    display:none;
  }

  
}

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

  #main
  {
    margin-left:5%;
  }

}

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

  #main
  {
    margin-left:10px;
  }
  
  .deaneryMapContainer
  {
    display:none;
  }
  
  
  .mapImage
  {
    height:178px;
    width:250px;
  }
  
  .nonLightboxMap
  {
    display:inline !important;
  }

}

@media screen and (max-width: 680px)
{
  /*a quick fudge, for viewalls in iframes*/
  .viewall table,
  .viewall #comments
  { 
    margin-right:30px;
  }
}

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

  html,
  body,
  body.edit,
  body.new,
  body.viewall,
  body.datagrid,
  body.file,
  body.datamine,
  body.details,
  body.login,
  #content,
  #sidebar,
  .sidebarstyle #sidebar,
  #sidebarcontent 
  {
    background-image:none;
  }
  




  .diary table,
  .diary thead,
  .diary tbody,
  .diary th,
  .diary td,
  .diary tr
  {
    display: block;
  }
  .diary table
  {
   width:auto;
  }

  /* Hide table headers (but not display: none;, for accessibility) */
  .diary thead tr,
  .subregtext33,
  .subregtext34
  {
    position: absolute;
    top: -9999px;
    left: -9999px;
  }
  
  .daily_background64,
  .daily_backgroundwithtopborder64,
  .daily_backgroundwithtopborder642
  {
    height:auto !important;
  }
  
  .module h3,
  .table100-1
  {
    width:auto;
  }
  
  #content
  {
    margin-right:0px;
    padding-right:0px;
  }

  #main
  {
    width:100%;
  }

  #leftpanel,
  #leftPanel,
  #rightpanel,
  #rightPanel
  {
    clear:both;
    float:none;
    margin-bottom:20px;
    margin-right:50px;
    padding-right:50px;
    width:100%;
  }
  
  #massiveGapToAllowRoomForTip
  {
    display:none;
  }

}

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

  #logo
  {
    height:60px
    width:162px
  }

  .breakWhenSmall
  {
    display:none;
  }

  #content
  {
    padding-right:0;
  }
  
  textarea
  {
    width: 95%
  }
  
}

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

  #main a img
  {
    xxxdisplay:none;
  }

  #credentials br
  {
    display:none;
  }

  #credentials span
  {
    display:none;
  }
  .topNavIcon
  {
    height:24px;
    width:24px;
  }
}




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

  .topNavIcon
  {
    height:16px;
    width:16px;
  }

  #topNavOne.BASSA #logo,
  #topNavOne.Wales #logo,
  #topNavOne.Salisbury #logo
  {
    height:24px;
    width:65px;
  }
  
}    


/*TABLE*/
@media screen and (max-width: 500px)
{

  /* Force table to not be like tables anymore */
  table,
  thead,
  tbody,
  th,
  td,
  tr
  {
    display: block;
  }
  
  .table0-0-100-0-ffffff
  {
   width:auto;
  }

  /* Hide table headers (but not display: none;, for accessibility) */
  thead tr
  {
    position: absolute;
    top: -9999px;
    left: -9999px;
  }

  tr
  { 
    border-bottom: 1px solid #fcfcfc;
    padding-bottom:8px;
  }

  td.first
  {
    font-weight:bold
  }

  .sortabletable td,
  .sortabletable tbody td.Number,
  td.Date,
  td.ShortEnglishDate,
  td.Currency
  {
    /* Behave  like a "row" */
    border: none;
    border-bottom: 1px solid #eee;
    position: relative;
    text-align:left;
  }

  td:before
  {
    padding-right:10px;
    position:absolute;
    left:6px;;
    top:6px;
    white-space:nowrap;
    width:100px;
  }

  /*
  Label the data
  */
  xtd:nth-of-type(1):before { content: "Player"; }
  xtd:nth-of-type(2):before { content: "Team"; }
  xtd:nth-of-type(3):before { content: "Number"; }
  xtd:nth-of-type(4):before { content: "Country"; }

  .inputlabel
  {
    text-align:left;
    xtext-decoration:underline;
  }
 
  tbody td.Number,
  tbody td.Date,
  tbody td.date,
  tbody td.ShortEnglishDate,
  tbody td.Currency,
  tfoot .Number,
  tfoot .Currency
  {
    text-align:left !important;
  }

}


/*BASSA Specifics*/
@media screen and (max-width: 880px)
{

  #sidebarcontent small
  {
    padding-left:4px;
    position:relative;
    top:-1px;
  }
  
  #sidebarcontent small a
  {
    padding-right:4px;
  }

}

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

  #boxAddPost textarea
  {
    width:95%;
  }
  


}

@media screen and (max-width: 500px)
{
  
  .roster #main table
  {
    width:auto;
  }
  
  .roster #main table a
  {
    border:0;
    padding-right:0;
    margin-right:0;
    width:100%;
  }

}


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

  #addPosting
  {
    left:0px;
    top:-5px;
  }

  #strTitleOfNewPost
  {
    width:95%;
  }
  

  
}