/*
########################
# Release  : 0.000
# Copyright : Adnate Ltd
########################
*/

/*Relative formula
  1px ÷ 16px = 0.0625em
  2px ÷ 16px = 0.125em
  4px ÷ 16px = 0.25em;
  8px ÷ 16px = 0.5em
 10px ÷ 16px = 0.625em
 12px ÷ 16px = 0.75em
 14px ÷ 16px = 0.875em
 16px ÷ 16px = 1.0em
 20px ÷ 16px = 1.25em
 24px ÷ 16px = 1.5em
 48px ÷ 16px = 3em
112px ÷ 16px = 7em
128px ÷ 16px = 8em
212px ÷ 16px = 13.25em;
336px ÷ 16px = 21em
958px ÷ 16px = 59.875em 
960px ÷ 16px = 60em
*/

 /* html tags ###############################*/
html      {font-size: 100%; background: #fec; overflow: -moz-scrollbars-vertical; overflow-y: scroll;}
body      {margin: 0; font-size: 16px; font-family: Arial, Sans-serif; color: #005; }
p, li     {margin: 0; font-size: 0.875em;}
h1        {margin: 0; font-size: 1.5em; color: #017;}
h2        {margin: 0; font-size: 1em; color: #017;}
h3        {margin: 0; font-size: 1.0em;}
h4        {margin: 0; font-size: 0.75em;}
a         {color: #00f; }
a:hover   {color: #666;}
img       {max-width: 100%; height: auto;}
input     {border: solid 0.0625em #000; -moz-border-radius: 0.25em; -webkit-border-radius: 0.25em; border-radius: 0.25em; box-shadow: 0.125em 0.125em 0.25em #11427a;}
table, td {margin: 0; border-spacing: 0; border-collapse: collapse;}
th        {background: #ccf;}
td, th    {padding: 0.25em; vertical-align: top;}

div:empty {display: none;}

/* Input placeholders */
::-webkit-input-placeholder {font-size: 0.825em;}
::-moz-placeholder {font-size: 0.825em;}
:-ms-input-placeholder  {font-size: 0.825em;}
input:-moz-placeholder {font-size: 0.825em;}

/* resolution styles ########################*/
.wideBlock   {display: none;}
.narrowBlock {display: block;}
.smallText   {font-size: 0.75em;}
.smallText p {margin-bottom: 0.5em;}
.maintext    {margin: 1em; font-size: 1.25em;}

/* grid styles ##############################*/
.clear  {clear: both;}
.hrule  {clear: both; height: 1em; background: #11427a; margin: 0.625em; font-size: 0.1em;}
.shadow {border: solid 0.0625em #000; -moz-border-radius: 0.25em; -webkit-border-radius: 0.25em; border-radius: 0.25em; box-shadow: 0.125em 0.125em 0.25em #11427a;}
.left   {float: left; margin-right: 0.25em;}
.right  {float: right; margin-left: 0.25em;}
.noborder, .noborder td, .noborder th {border: 0;}
.padding  {padding: 0.125em;}

/* dev info #################################*/
#devInfo {display: none;}

/* background and foreground ################*/
#background       {width: 100%; height: 100%;}
#cycler           {width: 100%;}
#cycler div       {position: absolute; display: none; width: 100%; height: 100%;}
#cycler div img   {width: 100%;}
#foreground       {margin-top: 2em;}
#foreground .gigs {display: none;}
#background .gigs {display: block;}


/* container ################################*/
.container      {position: relative; margin: 0 auto; width: 100%; max-width: 61.5em; text-align: center;}
.edge           {padding: 0; text-align: left; border: 0; background: rgba(255,235,122,0.5);}

/* pages ####################################*/
.aboutme, .contactme, .comingup     {margin-left: 0.25em;}

/* gigs #####################################*/
.gigs       {text-align: center; margin-top: 1em;}
.gigs a img {opacity: 0.7; filter: alpha(opacity=70); max-width: 320px;}

/* logo element #############################*/
#logo            {position: relative; float: left;}
#logo img        {max-width: 100%; height: auto;}

/* menu element #############################*/
#menu            {float: right; font-size: 0.75em;}
#menu a          {color: #000; text-decoration: none; font-size: 1.25em;}
#menu a:hover    {color: #888; position: relative;  top: 2px; left: 2px; font-size: 1.25em;}
.menuItem        {display: block; margin: 0.25em 0.25em; width: auto; float: left;}
.menuItem div    {padding: 0.125em;  -moz-border-radius: 0.25em; -webkit-border-radius: 0.25em; border-radius: 0.25em; background: rgba(255,255,255,0.5);}

/* trunk elements ###########################*/
#trunk       {background: #fea; border: solid 0.0625em #000; -moz-border-radius: 0.25em; -webkit-border-radius: 0.25em; border-radius: 0.25em; box-shadow: 0.125em 0.125em 0.25em #11427a;}
.gallery h1  {}
.gallery div {float: left; margin: 0; min-height: 324px;}
.gallery img {width: 27em; margin: 0;}

/* legals element ###########################*/
#legals          {position: fixed; bottom: 1em; left: 1em; margin: 0.25em auto;}
#legals .edge    {padding: 0.25em; font-size: 0.75em; text-align: center; background: #eee; color: #eee; background: rgba(240,240,240,0.5); -moz-border-radius: 0.25em; -webkit-border-radius: 0.25em; border-radius: 0.25em; box-shadow: 0.1em 0.1em 0.25em #11427a;}
#legals a        {color: #000; text-decoration: none;}
#legals a:hover  {color: #ddd; position: relative; top: 2px; left: 2px;}
