/*
colours used
#007ac2 (MAIN COLOUR: process names in menu, borders of inputs and fieldsets, top bar of thickbox, background of sweettitle, overlay text, background of header and topnav)
#4e4f78 (SECONDARY COLOUR: hyperlinks, buttons, module names in menu, borders of menu, hovered buttons, colouring of datepicker)
#f6f6f6 (BACKGROUND COLOR: background of page, background of disabled fields and buttons, close link in thickbox)
lightgoldenrodyellow (EXTRAS: buttons, side bar and top nav headers of tutorial pages)

'black' and 'white' are also used in various places 

values used
60px (height of header/top nav)
220px (width of sidebar)
*/

/*LAYOUT, FONTS AND COLOURS OF MAIN SECTIONS (in order of page hierarchy)*/
html
{
  xxbackground:url(../Images/random.png) repeat 0 0;
  background-color:white;
  background:repeat-y -330px 0 url(../Images/body.png)\9; /*IE8 and below*/
}

body
{
  xbackground-image:url(../Images/Body.png);
  xbackground-position:-111px 0;
  xbackground-repeat:repeat-y;
  xbackground:url(../Images/random.png) repeat 0 0, url(../Images/Body.png) repeat-y -111px 0;
  xbackground-color:#f6f6f6;
  font-family: 'Abhaya Libre', 'Droid Sans', sans-serif;
  font-size:large;
  margin:10px;
  padding:0;
  color:#363636
}

#RDToverlaytext
{
  color:#4e4f78;
  display:none;
  font-size:small;
}

#topnav
{
  background-image:none;
  background-position:left top;
  background-repeat:repeat-x;
  background-color:#4e4f78 ;
  font-size:large;
  height:180px;;
  margin:0;
  padding:6px;
  padding-top:0px;
  text-align:center;
}

#topnavlinks
{
  float:left;
  width:250px;
}

#topnavnotes
{
  float:right;
  position:relative;
  width:100px;
  z-index:10;
}

#topnav h1
{
  clear:left;
  color:lightgoldenrodyellow;
  margin:0;
  padding-top:4px;
}

#topnav a.hiddenlink
{
  color:#fa6900;
}

#main a.hiddenlink
{
  color:#b0b0b0;
}

#wrapper
{
  float:right;
  margin-left:-220px;
  *margin-left:-20px; /*IE7 and below*/
  width:100%;
  padding-right:5px;
}

.classicstyle #wrapper
{
  float:none;
  margin-left:0;
  width:100%;
}

#content
{
  background:url(../Images/Fade.png) repeat-x 0 -60px;
  background-image:none \9; /*IE8 and below*/

  margin-left:220px;
  margin-right:0;
}



.details #content
{
  background-image:none;
}

body.datamine #content
{
  margin-left:0;
  background:url(../Images/Fade.png) repeat-x 0px -60px;
  _background-image:none;
}

body.datamine
{
  background-position:-330px
}

body.datamine #topnav,
body.datamine #wrapper
{
  max-width:1666px;
}

.details #content
{
  background-image:none;
}

#main
{
  min-height:120px;
  padding-left:10px;
  padding-top:10px;
}

#sidebar
{
  background-image:url(../Images/Body.png);
  background-position:-111px -60px;
  background-repeat:repeat-y;
  background:url(../Images/random.png) repeat 0 -60px, url(../Images/Body.png) repeat-y -111px -60px;
  background-color:#e0e4cc;
  float:left;
  font-size:80%;
  left:0;
  min-height:800px;
  _height:800px;
  position:absolute;
  width:220px;
  clear:left;
}

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

#sidebar h1,
#sidebar p
{
  padding:3px 10px;
}

#footer
{
  
  background:url(../Images/Footer.png) right bottom no-repeat;
  _background:url(../Images/ssIePngFixBlank.gif) right bottom no-repeat;
  bottom:0;
  color:white;
  display:none;
  height:40px;
  right:20px;
  position:fixed;
  text-align:right;
  width:125px;
}


/*LOGIN PAGE*/
.login #frmMain
{
  width:400px;
}

.login input
{
  font-family:sans-serif;  /*not all fonts eg calibri, have the appropriate password asterisk characters*/
}

.login input.pushbutton
{
  font-family: 'Josefin Sans', sans-serif; /*for the submit button in the login screen override the font width just set above for the login*/
}


/*HEADINGS, PARAGRAPHS, LISTS etc. (in alphabetical order)*/
h1
{
  font-size:135%;
  margin:0;
  padding-left:5px;
}

h2
{
  font-size:110%;
  padding-left:5px;
}

h3
{
  font-size:90%;
  padding-left:5px;
}

h4
{
  font-size:85%;
  padding-left:5px;
}

p
{
  line-height:1.2;
  margin:7px 3px;;
  padding:3px;
}

hr
{
  background-color:#4e4f78;
  border:1px solid #4e4f78;
}

ul
{
  list-style:none;
  margin:0;
  padding-left:16px;
}


/*HYPERLINKS (in order of page hierarchy)*/
a
{
  color:#4e4f78;
  font-weight:bold;
}

a:link,
a:visited
{
  text-decoration:none;
}

a:hover,
a:active
{
  color:black;
  text-decoration:underline;
}

#topnav a
{
  color:#9e1881;
  font-family: "Reem Kufi";
  text-transform: uppercase;
  font-weight:normal;
}

#topnav a:link,
#topnav a:visited
{
  text-decoration:none;
}

#topnav a:hover,
#topnav a:active
{
  text-decoration:underline;
}

#sidebar a
{
  color:#4e4f78;
  /*font-size:85%;*/
}

#sidebar a:link,
#sidebar a:visited
{
  text-decoration:none;
}

#sidebar a:hover,
#sidebar a:active
{
  color:#101010;
  text-decoration:underline;
}

#sidebarcontent li
{
  padding-bottom:7px;
}

#sidebarcontent small
{
  font-size:62%;
  padding-left:24px;
  position:relative;
  top:-6px;
  *top:-1px; /*IE7 and below*/
}

#sidebarcontent span.notAHyperlink
{
  color:#4e4f78;
  font-weight:bold;
}

#sidebarcontent small a
{
  padding-right:8px;
}

#main a
{
  color:#00acac; 
  xfont-weight:bold;
  font-weight: 400;
}

#main a:link,
#main a:visited
{
  text-decoration:none;
}

#main a:hover,
#main a:active
{
  color:black;
  text-decoration:underline;
}


/*IMAGES*/
img
{
  border:0;
}

.photo
{
  border:1px solid black;
}


/*DATE PICKER*/
.calendar .nav
{
  background:#4e4f78 no-repeat 100% 100%;
  color:#fff;
}

.calendar thead .headrow
{
  /* Row <TR> containing navigation buttons */
  background:#4e4f78;
  color:#fff;
}

.calendar tfoot .ttip
{
  /* Tooltip (status bar) cell <TD> */
  background:#4e4f78;
  color:#fff;
}

img.datepicker
{
  border:0;
  cursor:pointer;
}


/*SORTABLE TABLE*/
.even
{
  background-color:#fff;
 }

.odd
{
  background-color:#e3e3e3;
}

table.sortabletable
{
  border:2px solid black;
  padding:2px;
  -moz-border-radius:4px;
  -o-border-radius:4px;
  -webkit-border-radius:4px;
  border-radius:4px;
  -moz-box-shadow:0 3px 6px rgba(0, 0, 0, 0.2);
  -o-box-shadow:0 3px 6px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow:0 3px 6px rgba(0, 0, 0, 0.2);
  box-shadow:0 3px 6px rgba(0, 0, 0, 0.2);
}


/*FORMS */
fieldset
{
  background-color:white;
  border:2px solid #4e4f78;
  margin:2px 22px 2px 8px;
  padding:11px;
  border-radius:4px;
  xxxbox-shadow:0 3px 6px rgba(0, 0, 0, 0.2);
}

button,
input,
select,
textarea
{
  border:1px solid #4e4f78;
  font-family: 'Josefin Sans', sans-serif;
  font-size:100%;
  padding:1px;
  border-radius:3px;
}

input.required,
select.required,
textarea.required
{
  background:lightyellow;
  font-weight:bold;
}

.hidden
{
  display:none;
}

.readonly
{
  border-color:white;
  border:0;
}
.inputlabel
{
  padding:1px;
  text-align:right;
}

td.required, p.required
{
  font-weight:bold;
}

td.right
{
  text-align:right;
}

td.grey,
.lightGrey
{
  color:#e0e0e0;
}


/*BUTTONS*/
.pushbutton, button
{
  background-color:#4e4f78;
  background-image:url(../Images/Over.png);
  _background-image:none;
  background-position:left center;
  border-width:2px;
  border-color:#4e4f78;
  border-style:solid;
  color:#f6f6f6;
  font-weight:bold;
  margin:3px 0;
  padding:3px;
  -moz-border-radius:3px;
  -o-border-radius:3px;
  -webkit-border-radius:3px;
  border-radius:3px;
  -moz-transition-property:all;
  -o-transition-property:all;
  -webkit-transition-property:all;
  transition-property:all;
  -moz-transition-duration:0.2s;
  -o-transition-duration:0.2s;
  -webkit-transition-duration:0.2s;
  transition-duration:0.2s;
  -moz-transition-timing-function:ease;
  -o-transition-timing-function:ease;
  -webkit-transition-timing-function:ease;
  transition-timing-function:ease;
}

.pushbutton:hover,
button:hover,
.pushbutton:focus, 
button:focus
{
  background-color:#2b2b2b;
  border-color:#000000;
  color:#f6f6f6;
  cursor:pointer;
}

.pushbutton:active,
button:active
{
  background-image:url(../Images/Active.png);
  border-color:#4e4f78;
  color:white;
}

button
{
  margin:5px;
  width:150px;
}


/*DISABLED FORMS*/
.disabledform fieldset
{
  background-color:#f6f6f6;
  border-color:white;
  -moz-box-shadow:0 0 0 rgba(0, 0, 0, 0.2);
  -o-box-shadow:0 0 0 rgba(0, 0, 0, 0.2);
  -webkit-box-shadow:0 0 0 rgba(0, 0, 0, 0.2);
  box-shadow:0 0 0 rgba(0, 0, 0, 0.2);
}

.disabledform fieldset .readonly
{
  background-color:#f6f6f6;
  border-color:#f6f6f6;
}

.disabledform fieldset input,
.disabledform fieldset input.required,
.disabledform fieldset select,
.disabledform fieldset select.required,
.disabledform fieldset textarea,
.disabledform fieldset textarea.required
{
  background-color:#f6f6f6;
}

input:disabled,
input.sfdisabled
{
  background:white !important;
  xxcolor:#ccc;
}

.disabledform #btnSubmit,
.disabledform #btnCancel
{
  background-color:#f6f6f6;
  border-color:white;
}


/*THICKBOX*/
#TB_closeAjaxWindow, 
#TB_title
{
  background-color:#4e4f78 !important;
  /*color:white;*/
}

#TB_closeAjaxWindow a
{
  color:#f6f6f6 !important;
}

#TB_ajaxWindowTitle
{
  color:white !important;

}

#TB_ajaxContent #btnCancel,
#TB_ajaxContent a.pushbutton
{
  display:none;
}

.printLinkInThickBox
{
  display:none;
}

#TB_ajaxContent .printLinkInThickBox
{
  display:inline;
}


/*DIVS FOR CHECKING AJAX COMPLETION*/
#mainstatus,
#extrastatus
{
  display:none;
}


/*SWEETITLES*/
body div#toolTip
{
  background:#00acac !important;
}


/*IE PNG FIX (fix probs with partial transparency in IE6), note the * html targets just ie6 (causes minor probs with status bar in ie 7 when loading images using ajax)*/
* html img
{
  behavior:url(../Include/ssIePngFix.htc);
  margin:0;
}


/*MENU*/
#nav
{
  margin-top:13px;
}

#nav a
{
  color:#4e4f78;
}

#nav li li a
{
  color:#4e4f78;
}

#nav li li a:hover
{
  border:5px solid #4e4f78;
}

#nav li
{
  border:1px solid #4e4f78;
}

.module ul
{
  border-right:solid 1px #4e4f78;
}


/*POPUP*/
body.popup
{
  background-image:none;
}

html body.popup #wrapper,
body.popup #wrapper
{
  background-image:none;
}

body.popup #content
{
  margin-left:0;
}

body.popup #sidebar
{
  display:none;
}

/*EXPAND AND COLLAPSE*/
.hiddenInitially
{
  display:none;
}

.xxxxexpand
{
  background-image:url(../Images/ssAdd.png);
  _background-image:url(../Images/ssAdd.gif);
  background-position:5px 5px !important;
  background-repeat:no-repeat;
  border:1px solid #f6f6f6;
  cursor:pointer;
  padding-left:32px;
  border-radius:16px;
}

.xxxxcollapse
{
  cursor:pointer;
  background-image:url(../Images/ssSubtract.png);
  _background-image:url(../Images/ssSubtract.gif);
  background-position:5px 5px !important;
  background-repeat:no-repeat;
  border:1px solid #f6f6f6;
  padding-left:32px;
  border-radius:16px;
}


/*VALIDATION*/
.validationerror
{
  background-color:darksalmon !important;
  border:1px solid indianred;
}


/*TIP*/

#JT_close_left,
#JT_close_right
{
  background-color:#4e4f78  !important;
  color:white  !important;
}

#JT
{
  border:2px solid black !important;
}


/*PSEUDO TABLES*/
.endofpseudotable,
.breakbetweensuperboxes,
.endOfPseudoTable,
.breakBetweenSuperBoxes
{
  clear:left;
  height:0;
  padding:0;
}

.table,
.table div,
.table div div
{
  margin:0;
  padding:0;
}

.table div div
{
  border:1px solid #f9f9f9;
  float:left;
  height:16px;
  padding:5px 5px 5px 5px;
  text-align:right;
}

.table div
{
  float:left;
}

.table div div.th
{
  text-align:center;
}

.totals div
{
  font-weight:bold;
  text-align:right;
}

.table div.firstcol, 
.table div.firstCol
{
  border-left:2px solid #f9f9f9;
}

.table div.lastcol, 
.table div.lastCol
{
  border-right:2px solid #f9f9f9;
}

.table div.firstrow, 
.table div.firstRow
{
  border-top:2px solid #f9f9f9;
}

.table div.lastrow, 
.table div.lastRow
{
  border-bottom:2px solid #f9f9f9;
}

.endOfPseudoTable
{
  clear:both;
}

/*RESPONSIVE TOP NAV*/
#logo
{
  height:60px
  width:162px
}
      
.breakWhenSmall
{
  display:none;
}

#credentials
{
   color:white;
   float:right;
   height:45px;
   text-align:right;
}

#logOut
{
  font-size:80%;
}

#search
{
  float:right;
  margin-right:6px;
  margin-top:2px;
}

#searchIcon
{
  display:none;;
}

#menuIcon
{
  display:none;
}

#menuuu
{
  float:right;
  margin-right:6px;
  margin-top:2px;
}

#strSearch
{
  background: url(../Images/search-icon-md.png) no-repeat right white;;
  background-size: 90% 90%;
  font-size:160%;
  height:30px;
  width:300px;
}

#credentials,
#search
{
  *position:relative; /*IE7 and below*/
  *top:-60px; /*IE7 and below*/
}

#strSearch2
{
  background: url(../Images/search-icon-md.png) no-repeat right white;
  font-size:160%;
  height:30px;
  margin:2px;
  width:98%;
}

#topNavOne,
#topNavTwo
{
  padding:4px;
}

#topNavSearch
{
  display:none;
}

#topNavSearch.shown
{
  display:block;
}

.module ul
{
  display:none;
}

#nav
{
  padding-left:0;
}

.module,
.module div
{
  display:inline;
}

.diaryTable .module,
.diaryTable .module div
{
  display:block;
}

.module div
{
  line-height:1.5;
}

#nav li div a
{
  color:white;
  font-weight:normal;
  font-size:110%;
  padding-right:20px;
  text-decoration:none;
}

#nav li div a:hover
{
  text-decoration:none;
}

#nav li ul a
{
  text-decoration:none;
}

#nav li
{
  border:0;
}

.module ul.shown
{
  display:block;
  position:absolute;;
  xtop:130px;
  left:0;
  z-index:100;
  width:100%;
  background:white;
  margin-left:0
  padding-left:0;
  padding-bottom:10px;
  padding-top:10px;
}

.module ul.shown li
{
  width:300px;
  display:block;
  float:left;
  padding-bottom:6px;
  padding-top:6px;
}

#nav li li a:hover
{
  border:0;
}

#last.module
{
  display:none;
}

#topnav a:hover  /*just overriding the #topnav rule in style.css*/
{
  text-decoration:underline;
}

.moduleprocess a:hover;
{
  text-decoration:underline;
}

/*TWO COL STUFF*/
#RDTbottomofpage
{
  clear:both;
}

#main
{
  max-width:632px;
  *width:632px;
  width:auto;
  margin:0 0 0 10px;
}

#content #main,
.datamine #main
{
  max-width: none;
  width:auto;
}

#leftpanel,
#leftPanel
{
  float:left;
  left:0px;
  width:302px;
  xborder:2px solid #5e5e5e;
  padding:6px;
  xborder-radius:3px;
  xbox-shadow:0 3px 6px rgba(0, 0, 0, 0.2);
  xbackground-color:white;
}

#rightpanel,
#rightPanel
{
  float:right;
  width:302px;
  xmin-height:120px;
  xborder:2px solid #5e5e5e;
  padding:6px;
  xborder-radius:3px;
  xbox-shadow:0 3px 6px rgba(0, 0, 0, 0.2);
  xbackground-color:white;
}

#leftpanel h1, 
#leftpanel p,
#rightpanel h1, 
#rightpanel p
{
  padding:3px 5px;
}

#leftpanel h1, 
#leftPanel h1, 
#rightpanel h1,
#rightPanel h1
{
  font-size: 145%;
}

#leftpanel h2, 
#leftPanel h2, 
#rightpanel h2, 
#rightPanel h2
{
  margin: 0;
  padding: 3px 5px;
  border: none;
  background-color: transparent;
  font-size: 110%;
  font-weight: bold;
  min-width: 0;
}


/*DATA MINING*/
.datamine #sidebar
{
  display:none;
  float:none;
}

.datamine #content
{
  margin-left:0;
}

/*RDT PAGES*/
#top h3
{
  width:300px;
}

body.edit,
body.new,
body.viewall,
body.datagrid,
body.file,
body.xxxdatamine,
body.details,
body.xxlogin
{
  background-image:url(../Images/Body.png);
  background-position:-330px -60px;
  background-repeat:repeat-y;
  background:url(../Images/random.png) repeat 0px 0px,url(../Images/Body.png) repeat-y -330px -60px;
  background-color:#f6f6f6;
  margin:10px 0 0 5px;
  padding:15px 0 0 10px;
}



body.details #wrapper
{
  clear:right;
  width:100%;
  margin-left:0;
}

body.details #content
{
  margin-left:10px;
}

.viewall a img,
.viewallOutsideFrame a img
{
  padding-left:3px;
}

#RDTbottomofpage
{
  border:0px solid red;
  color:#f6f6f6;
  height:1px;
  margin:0;
  padding:0;
  *margin-top:10px; /*IE7 and below*/
}

iframe
{
  background-color:#f6f6f6;
}

.RDTfileframe
{
  background-color:white;
  border:0;
}


/*BOTH FRAME STYLES*/
/*this overrides the fade effect in #content in the two iframe styles (it is only really visible around the edges but worth doing)*/
body.classicstyle #content,
body.sidebarstyle #content
{
  background-image:url(../Images/Body.png);
  background-position:-330px -60px;
  background-repeat:repeat-y;
  background:url(../Images/random.png) repeat 0px 0px, url(../Images/Body.png) repeat-y -330px -60px;
  background-color:#f6f6f6;
}

/*RDT FRAME SIDESTYLE*/
.sidebarstyle #main
{
  margin:0;
  padding-left:0;
  padding-top:0;
  width:99%;
}

.sidebarstyle iframe
{
  height:0px;
  margin:0;
  padding:0;
  width:100%;
}

.sidebarstyle #footer,
.sidebarstyle #header h1,
.sidebarstyle #header h2
{
  display:none;
}

.sidebarstyle #frameset
{
  padding-right:0;
}

.sidebarstyle #header
{
  height: 0;
  cursor:pointer;
}

body.sidebarstyle
{
  margin:0;
  padding:0;
  min-height:1000px;
}

.sidebarstyle  h1
{
  font-size:120%;
}

.sidebsarstyle #topnav  /*have sidebsarstyle mis-spelled on purpose?*/
{
  background: #4e4f78 url(../Images/topnav.jpg) left top repeat-x;
  height:50px;
  margin:0;
  padding:5px;
}

.sidebarstyle #sidebar
{
  width:220px;
  position:absolute;
  left:0px;
}

.sidebarstyle .overlay100
{
  background-image:url(../Images/Body.png);
  background-position:relative;
  background-repeat:repeat-y;
  background:url(../Images/random.png) repeat 0px 0px, url(../Images/Body.png) repeat-y -330px -60px;
  background-color:#f6f6f6;
  xxleft: 220px !important; /*220 is position of vertical line*/
  xxtop: 145px !important;
}


/*RDT FRAME CLASSICSTYLE*/
/*these first three clear out the default style of the content and wrapper, which are used in the regular page too.*/
.classicstyle #footer,
.classicstyle #topnav,
.classicstyle #header h1,
.classicstyle #header h2
{
  display:none;
}

.classicstyle #wrapper
{
  float:none;
  width:100%;
  margin:0px;
}

.classicstyle #content
{
  margin:0px;
}

.classicstyle #main
{
  float:auto;
  margin:0;
  max-width:auto;
  padding-left:0;
  padding-top:0;
  width:99.5%; //for opera, which shows a horizontal scrollbar if set to 100%
}

.classicstyle iframe
{
  height:0px;
  margin:0;
  padding:0;
  width:100%;
}

body.classicstyle
{
  background:  url(../Images/Body.png) -111px 0px repeat-y;
  margin:0;
  padding:0;
}

.classicstyle #header
{
  background: #4e4f78 url(../Images/Header.gif) left top repeat-x;
  cursor:pointer;
  height:60px;
}

.classicstyle #sidebar
{
  display:none;
  float:none;
}

.classicstyle .overlay100
{
  background:  url(../Images/Body.png) repeat -111px -60px; 
  left:0px !important;
  top:60px !important;
}

.afterMenu
{
  display:none;
}


/*RESPONSIVE COLOURS*/
@media screen and (max-width: 880px)
{
  #sidebar,
  .sidebarstyle #sidebar
  {
    background-color:#e0e4cc;
    border-top:2px solid #4e4f78;
  }
}


/*A COUPLE OF COLOURS TAKEN OUT OF RESPONSIVE SEARCH*/
#searchfieldset
{
  background-color:#f6f6f6;
  border:1px solid #4e4f78;
}


/*HELPER CLASSES*/
.rounded5
{
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
}

.leftAlign
{
  text-align:left;
}

.rightAlign
{
  text-align:right;
}

.centerAlign
{
  text-align:center;
}

.hasSearch div#search
{
  display:none;
}

.imageContainer
{
  height:18px; 
  width:18px;
  display:block;
  float:right;
  clear:right;
}

.notBold
{
  font-weight:normal;
}

.clearBoth
{
  clear:both;
}

.clearLeft
{
  clear:left;
}

.clearRight
{
  clear:right;
}

.floatLeft
{
  float:left
}

.floatRight
{
  float:right
}

.hiddenWhenTablesAreTables
{
  display:none;
}







/*temp stuff to quickly remove the top menu*/

xxx#topNavTwo #nav
{
  display:none;
}

xxx#menuIcon
{
  xdisplay:none !important;
}

.NotInMyDiocese td, .NotInMyDiocese td a
{
  color:gray;
}

#spnSwitchAccessRights
{
  font-size:small;
  float:right;
  position:relative;
  top:-35px;
  padding-right:10px;
}

#Page1113 #userAccessNav span.Page1113,
#Page1119 #userAccessNav span.Page1119,
#Page1330 #userAccessNav span.Page1330
{
  background-color:#fff4b0;
}

#userAccessNav span
{
  border:1px solid #999;
  padding:3px;
  -moz-border-radius:3px;
  -o-border-radius:3px;
  -webkit-border-radius:3px;
  border-radius:3px;
}


.mapImage
{
  border:1px solid #00acac;
  border-radius:5px;
  padding:5px;
  width:350px;
  height:250px;
}

#editPasswordEtc
{
  float:right;
  text-align:right;
  font-size:85%;
}

@media screen and (max-width: 1100px)
{
  #editPasswordEtc
  {
    float:right;
    position:fixed;
    top:10px;
    right:10px;
    text-align:right;
    font-size:85%;
  }
}

@media screen and (max-width: 800px)
{
  #editPasswordEtc
  {
    font-size:60%;
    line-height:20px;
  }
}

.editPassword #editPasswordEtc  
{
  display:none;
}

.warning
{
  font-weight:bold;
  color:tomato;
}


#TB_window
{
  font-size:80%;
}

#TB_window table
{
  width:560px;
  margin-bottom:50px;
}