/* Style file for TLC Trust pages new look April 2015 */

body {
background-color: #A0B0B6;
font-family: Arial, Helvetica, Verdana, sans-serif;
font-size: 12px;
margin: 0;
padding: 0;
}

div#wrapper   {
background: #FFFFFF;
margin: 0 auto 0 auto;
padding: 0;
width: 85em;
}

div#metatagdiv {
display: none;
font-size:1px;
background-color:#ffffff;
color:#ffffff;
}

div#nojavascript {
display: block;
background: #FFDD22;
color: #C00000;
font-size: 1.8em;
padding: 1em 2em 1em 2em;
}

/********** Photo enlargement area  **********/

#zoom {
background-color: transparent;
position: absolute;
visibility:hidden;
width: 90em;
text-align: center;
cursor: default;
z-index: 100;
}

#innerzoom {
background-color: #000000;
margin: 0 auto 0 0;
padding: 1em 1em 1em 1em;
color: white;
font-weight: bold;
font-size: 1.4em;
cursor: default;
text-decoration: none;
}

#innerzoom, #innerzoom:focus {
cursor: url(http://www.tlc-trust.org.uk/img/zoomout.cur), pointer;
}

#innerzoom img {
border: none;
max-width: 99%;
}

div.photoboxlink {
cursor: default;
border: 2px solid transparent; 
margin: 0 0 0 0;
padding: 2px;
text-align: center;
}

div.photoboxlink, div.photoboxlink a {
background-color: transparent;
color: #A02010;
}

div.photoboxlink:hover, div.photoboxlink a:hover {
background-color: #A02010;
color: #FFFFFF;
}

div.photoboxlink:hover {
border: 2px solid #A02010;
}

div.photoboxlink img {
margin: 2px;
max-height: 95%;
max-width:  95%;
}

.boxedphoto {
background-color: #FFFFFF;
border: none;
margin: 0 0 0.5em 0;
padding: 3px 0 0 0;
text-align: center;
cursor: url(http://www.tlc-trust.org.uk/img/zoomin.cur), pointer;
}

.boxedphoto img, .profileindexphoto img {
max-width: 98%;
}

.boxedphoto a {
color: #6B5D40; 
font-weight: bold;
text-decoration: none;
}

.boxedphoto p {
margin: 0;
padding: 3px 3px 3px 3px;
}

/********** Page (wrapper) top area (to red line) **********/

div#top {
width: 100%;
margin: 0 0 0 0;
padding: 0 0 0 0;
background-color: #FFFFFF;
}

div#top img {
width: 100%;
}

div#strapline {
background-color: transparent;
color: #FEE7DB;
font-family: 'Times Roman';
font-size: 1.3em;
font-style: italic; 
font-weight: bold;
text-align: center;
position: relative;
left: 30px;
top:  -135px;
width: 240px;
}

div#allbelowtop {
background-color: transparent;
margin:  -4em 0 0 0;
padding: 0 0 0 0;
font-size: 1.1em;
}

/* ********* End of top of page stuff in div id="top" *********** */

div#leftcolumn, div#rightcolumn {
background-color: #FFFFF0; 
margin: 0 0 0 0;
padding: 1em;
text-align: left;
height: auto;
width: 15em;
}

div#leftcolumn {
float: left;
}

div#rightcolumn {
float: right;
}

/* div id="mainpage" is below the header-container and navbar */
div#mainpage {
background-color: #FFFFFF;
margin:  1em 17em 0 17em;
padding: 0 1.5em 2em 1.5em;
text-align: left;
height: auto;
min-height: 45em;
}

div#mainpage p {
padding: 0px 0px 7px 0px;
}
div#mainpage ul {
padding: 0px 0px 20px 10px;
}

div#mainpage a, div#leftcolumn a, div#rightcolumn a, 
div#mainpage p a, div#leftcolumn p a, div#rightcolumn p a {
color: #A00000;
font-weight: bold;
text-decoration: none;
}

div#mainpage a:hover, div#leftcolumn a:hover, div#rightcolumn a:hover, 
div#mainpage p a:hover, div#leftcolumn p a:hover, div#rightcolumn p a:hover {
background-color: #A00000;
color: #FFFFFF;
}

div#rightcolumn em {
font-size: 0.9em;
}

div#mainpage ul {
margin: 0 0 0 1em;
padding: 3px 1px 3px 1px;
}

h1 { font-size: 1.8em; text-align: center; }
h2 { font-size: 1.4em; }
h3 { font-size: 1.2em; }
h4 { font-size: 1.1em; }
h5 { font-size: 1.0em; }

div#footer {
background-color: #F0F0F0;
color: #303030;
height: 1.5em;
padding: 0.7em 2em 0.4em 2em;
text-align: center;
}

div#footer a {
color: #800000;
text-decoration: none;
}

div#footer a:hover {
color: #FFFFFF;
background-color: #800000;
}

#topmenu{
width: 100%;
height: 50px;
margin: 0;
z-index: 99;
position: relative;
background-color: transparent;
}

div#navbardiv {
background-color: transparent;
color: #871E2C;
font-family: Helvetica, Arial, sans;
font-weight: bold;
position: relative;
left: 20px;
top:  -107px;
width: 1040px;
}

ul.navbar {
font-size: 1.0em;
font-weight: bold;
height: 50px;
margin: 0;
padding: 0;
position: absolute;
}

ul.navbar li {
height: auto;
float: left;
text-align: center;
list-style: none;
font-weight: bold;
margin: 0;
padding: 0;
}

ul.navbar li div.wierhere, ul.navbar li a {
padding: 3px 2px 5px 2px;
color: #000000;
}

ul.navbar li div.wierhere {
}

ul.navbar li a {
background-color: transparent;
color: #A00000;
display: block;
text-decoration: none;
}

ul.navbar li a:hover {
background-color: #A02010;
color: #FFFFFF;
}

ul.navbar li.navbargap:hover, ul.navbar li.navbargap a:hover {
background-color: transparent;
color: transparent;
}

ul.navbar li ul  {
display: none;
height: auto;
margin: 0 0 0 2em;
padding: 0;
}

ul.navbar li:hover ul  {
display: block;
}

ul.navbar li ul li {
background-color: #A02010;
color: #FFFFFF;
min-width: 100px;
margin: 0 0 0 -2em;
padding: 0;
text-align: left;
width: auto;
}

ul.navbar li ul li a  {
border-left: 1px solid #1f5065;
border-right: 1px solid #1f5065;
border-top: 1px solid #74a3b7;
border-bottom: 1px solid #1f5065;
color: #FFFFFF;
padding: 5px 10px 5px 10px;
}

ul.navbar li ul li:hover, ul.navbar li ul li a:hover {
background-color: #F02010;
color: #FFFFFF;
}

h1, h2, h3, h4, h5 {
margin: 0; 
padding: 2px;
color: #338833;
}

h1 {
margin-top: 1em;
}