/*
 * Layout
 */

body
{
  background-color:#333333;
  background-size:cover, auto;
  margin:0;
  padding:0px;
}

div#outer
{
  background-color:#FAFAFA;
  background-color:rgba(255,255,255,0.7);
  border:solid gray;
  border-color:rgba(0,0,0,0.3);
  border-width:0 0.2em;
  max-width:1024px;
  margin:0 auto;
  padding:0;
  position:relative;
}
#gallery
{
  text-align: left;
  margin: 1%;
  padding: 1% 1% 1% 1%;
}
#gallery ul { list-style: none; }
#gallery ul li {
  display: inline;
}
#gallery ul img {
  border: solid #000;
  display: inline;
  margin: 2px;
  border-width: 4px;
}
#gallery ul a { color: none;}
#gallery ul a:hover img{
  border: solid #800;
  border-width: 4px;
}
#gallery ul a:hover {
  color: #444;
}

@media all and (min-width:60em)
{
  div#outer
  {
    width:90%;
  }
}

div#inner
{
  font-size:small;
  margin:20px;
  padding:0 1em 1px 1em;
}
div#titlebox
{
  margin:0 -1em;
}
@media all and (min-width:40em)
{
  div#inner
  {
    padding:0 3em 1em 3em;
  }
  div#titlebox
  {
    margin:0 -3em;
  }
}

div#footer
{
  background-color:rgba(30,30,30,0.1);
  font-family:arial, sans-serif;
  font-size:medium;
  font-style:italic;
  font-weight:normal;
  font-variant:small-caps;
  color:white;
  padding:1em;
  line-height:2em;
  text-align:center;
}

/* Naughty element, to make sure things don't overflow at the bottom of the home page */
hr
{
  clear:both;
  margin:2em 0;
  visibility:hidden;
}



/*
 * All Pages
 */

/* T2K Logo */

img#logo
{
  background-color:white;
  border:solid #646464;
  border-width:0 1px 1px 1px;
    -moz-border-radius-bottomright:10px;
    -webkit-border-bottom-right-radius:10px;
  border-bottom-right-radius:10px;
    -moz-border-radius-bottomleft:10px;
    -webkit-border-bottom-left-radius:10px;
  border-bottom-left-radius:10px;
    -moz-box-shadow:3px 3px 5px black;
    -webkit-box-shadow:3px 3px 5px black;
  box-shadow:3px 3px 5px black;
  display:block;
  margin:0 auto;
  padding:20px 10px 10px 10px;
  width:100px;
  width:6em;
  z-index:10;
}

@media all and (min-width: 50em)
{
  img#logo
  {
    position:absolute;
    top:0;
    right:3em;
  }
}


/* Main Menu */

ul#menu
{
  background-color:gray;
  color:white;
  display:block;
  font-family:arial, sans-serif;
  font-style:italic;
  list-style-type:none;
  margin:1em 0;
  padding:0 1em;
  text-align:left;
  z-index:2;
}

ul#menu li
{
  border:solid rgb(130,130,130);
  border-width:1px 0 0 0;
  display:block;
  font-variant:small-caps;
  line-height:2em;
  margin:0;
  text-align:center;
}

ul#menu li:first-child
{
  border-top-width:0;
}

ul#menu li a
{
  color:white;
  display:block;
  text-decoration:none;
}
ul#menu a:hover
{
  background-color:#707070;
}

@media all and (min-width:50em)
{
  ul#menu
  {
    background-color:rgba(70,70,70,0.7);
    position:absolute;
    top:0;
    left:0;
    right:0;
    padding:0 12em 0 0;
  }
  ul#menu li
  {
    border-width:0 1px 0 0;
    display:inline-block;
    line-height:2.5em;
  }
  ul#menu li:first-child
  {
    margin-left:5em;
    border-width:0 1px;
  }
  ul#menu li a
  {
    padding:0 1em;
  }
  ul#menu a:hover
  {
    background-color:rgba(10,10,10,0.4);
  }
}

/* Non front pages header image */

img#photohead
{
  border:0;
  display:block;
  margin:0;
  padding:0;
  width:100%;
}

img#portrait
{
  border:solid #000;
  border-width: 2px;
  display:block;
  width:50%;
  text-align: center;
  margin:1em;
  margin-left: auto;
  margin-right: auto;
  padding:0em;
}


/*
 * Body Content
 */




h1
{
  background:rgba(40,40,40,0.7);
  color:white;
  display:block;
  font-family:arial, sans-serif;
  font-style:italic;
  font-variant:small-caps;
  font-weight:normal;
  line-height:2em;
  margin:0 0 1em 0;
  padding:0;
  text-align:center;
}

div#inner h2
{
  display:block;
  font-family:arial, sans-serif;
  font-size:large;
  font-style:italic;
  font-weight:normal;
  margin:2em 0 1em 0;
  padding:0;
}

div#inner h3
{
  font-family:serif;
  font-size:large;
  font-style:normal;
  font-weight:bold;
}

div#inner p
{
  font-size:medium;
  margin:1em 0;
  text-align: left;
}
@media all and (min-width: 40em)
{
  div#inner p
  {
    line-height:2em;
    text-align:justify;
  }
}

div#inner a
{
  color:rgb(80,80,180);
}

div#inner p.pagedescription
{
  color:rgb(50,50,50);
  font-size:medium;
  font-style:italic;
  text-align:center;
  margin:0 0 3em 0;
}

div#inner ul
{
  font-size:inherit;
  margin:2em 1em;
}

div#inner li
{
  line-height:2em;
  padding-left:1em;
}

div#inner table td
{
  padding: 1em;
}

/* Figures */

div.figure
{
  background-color:rgba(100,100,100,0.5);
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em;
  border-radius:0.5em;
  padding:0.5em 1em;
  margin:2em auto;
  width:50%;
}
div.figure img
{
  margin:0 auto;
  padding:0;
  /*max-width:100%;*/
  width:100%;
}
div.figure div.figcaption
{
  color:white;
  font-style:italic;
  max-width:100%;
}

div#slideshow
{
  margin:0 auto 0 auto;
  padding:0;
  position: relative;
}

div#slideshow img
{
  display:block;
  height: auto;
  left: 0;
  margin:0;
  padding:0;
  position: absolute;
  top: 0;
  width: 100%;
}

div#slideshow img:first-child
{
  position:relative;
}

div.box
{
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
  border-radius:6px;
  display:block;
  margin:0;
  padding:0 0 1em 0;
    -moz-box-shadow: black 3px 3px 10px;
    -webkit-box-shadow: black 3px 3px 10px;
  box-shadow: black 3px 3px 10px;
}
div#boxnews
{
  background-color:rgba(150,20,20,0.5);
}
div#boxabout
{
  background-color:rgba(20,100,20,0.5);
}
div#boxcontact
{
  background-color:rgba(20,20,100,0.5);
}
div.box h2
{
    -moz-border-radius-topright:6px;
    -webkit-border-top-right-radius:6px;
  border-top-right-radius:6px;
    -moz-border-radius-topleft:6px;
    -webkit-border-top-left-radius:6px;
  border-top-left-radius:6px;
  color:white;
  text-align:center;
  background-color:rgba(0,0,0,0.2);
  margin:0 !important;
  padding:0;
  display:block;
  line-height:2em;
}
div#inner div.box p
{
  font-size:medium;
  margin:1em;
  padding:0 1em;
  text-align:left;
}
div#inner div.box a
{
  color:black; !important;
  font-style:italic;
}
div#inner div.box a:hover
{
  color:white;
}
@media all and (min-width:40em)
{
  div.box
  {
    margin:0 auto;
    width:30%;
  }
  div#boxnews
  {
    float:left;
    margin:0 1em;
  }
  div#boxcontact
  {
    float:right;
    margin:0 1em;
  }
}

div.box img
{
  border:solid rgba(100,100,100,0.5);
  border-width:0.5em 1em;
    -moz-border-radius:0.1em;
    -webkit-border-radius:0.1em;
  border-radius:0.1em;
  display:block;
  margin:2em auto;
  max-width:80%;
}
@media all and (min-width:30em)
{
  div.box img.left
  {
    float:left;
    margin:1em 2em;
  }
  div.box img.right
  {
    float:right;
    margin:1em 2em;
  }
}


#lightboxgallery {
text-align:center;
background-color: #fff;
#width: 90%
margin: 1%;
padding: 1% 1% 1% 1%;
}
#lightboxgallery ul { list-style: none; }
#lightboxgallery ul li {
display: inline;
}

#lightboxgallery ul img {
border: solid #fff;
display: inline;
width: 150px;
margin: 2px;
border-width: 1px 1px;
}
#lightboxgallery ul a{ color: none;}
#lightboxgallery ul a:hover img {
border: solid #f00;
border-width: 1px 1px;
}
#lightboxgallery ul a:hover {
color: #444;
}