User:Makirui/fancy-blue.css

Note: After saving, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Internet Explorer: Hold Ctrl while clicking Refresh, or press Ctrl-F5
• Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.

.headerContainer,z-tabs
{
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size:14px;
}

.headerContainer
{
  margin:0;
  padding:0;
  border-color:#0487BD;
  border-style:solid;
  border-width:1px 1px 0 1px;  
  display:block;
  background-color:#0487BD;
  min-height:100px;
}
.headerContainer > .headerContent
{
  width:100%;
  text-align:center;
}

.headerContainer > .headerContent h1
{
  color:#fff;
  text-shadow: -1px -1px 1px #B4D8E7, 1px 1px 1px #000;
  opacity:.9;
  font-variant:small-caps;
  font-size:35px;
  font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
}

.headerContainer > .headerContent hr
{
  border: 0; 
  text-align:center;
  height: 1px; 
  background-image: -webkit-linear-gradient(left, #0487BD, #fff, #0487BD);
  background-image: -moz-linear-gradient(left, #0487BD, #fff, #0487BD);
  background-image: -ms-linear-gradient(left, #0487BD, #fff, #f0f0f0);
  background-image: -o-linear-gradient(left, #f0f0f0, #fff, #0487BD); 
  margin-bottom:14px;
}

.headerContainer > .headerContent hr:after
{
  content: '§';
    display:inline-block;
  position:relative;
  top:-14px;
  padding:0 10px;
  color:#fff;
  font-size:25px;
  -webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	transform: rotate(90deg);
}

.headerContainer .headerContent > .quote
{
  color:#fff;
  font-variant:small-caps;
  letter-spacing:4px;
  font-size:16px;
  text-shadow: 3px 3px 0px #2c2e38, 5px 5px 0px #5c5f72;
}

.headerLogo
{
  float:left;
  height:100%;
  width:100px;
}
.headerLogo img
{
  border-radius: 50%;
  max-height:100px;
  max-width:100px;
  position:relative;
  top:10px;
  left:10px;
   -webkit-box-shadow: rgba(255,255,255,0.8) 0px 0 10px;
 -moz-box-shadow: rgba(255,255,255,0.8) 0 0 10px;
 box-shadow: rgba(255,255,255,0.8) 0 0 10px;
  
}

.headerContent
{
  
  display:block;
}

.headerContainer:after
{
  clear:both;
}


.contentTabs,.z-tabs
{
  margin:0;
  border:0;
    display:block;
    outline:0 none;
  clear:both;
}

.z-tabs-nav
{
  min-width:70px;
  float:left;
  box-shadow:0 1px 6px rgba(0,0,0,0.125);
  margin:0;
  margin-right:-1px;
  border-color:#0487BD;
  border-style:solid;
  border-width:1px 0 1px 1px;  
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  position:relative;
    padding:0;
    display:block;
    text-decoration:none;
    list-style:none;
    list-style-type:none;
}

.z-tabs.nav > li
{
  position:relative;
  margin:0;
  padding:0;
  border:0;
  outline:0 none;
  display:block;
  text-decoration:none;
  list-style:none;
  list-style-type:none;
}

.z-tabs-nav > li > a
{
  box-shadow:0 1px 3px -3px rgba(0,0,0,0.15);
  padding:13px 25px;
  color:white;
  text-shadow:1px 1px 1px rgba(0,0,0,.5);
      background: #1abde7;
    background: -moz-linear-gradient(top, #1abde7 0%, #1c9dd1 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1abde7), color-stop(100%,#1c9dd1));
    background: -webkit-linear-gradient(top, #1abde7 0%,#1c9dd1 100%);
    background: -o-linear-gradient(top, #1abde7 0%,#1c9dd1 100%);
    background: -ms-linear-gradient(top, #1abde7 0%,#1c9dd1 100%);
    background: linear-gradient(to bottom, #1abde7 0%,#1c9dd1 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1abde7', endColorstr='#1c9dd1',GradientType=0 );
  border-color:#0487BD;
  border-style:solid;
  border-width:0 0 1px 0;
  font-size:12px;
  line-height:18px;
  font-weight:inherit;
  cursor:pointer;
  position:relative;
  margin:0;
  display:block;
  box-sizing:content-box;
}

.z-tabs-nav > li > a:hover
{
  background: #21ADDF;
}

.z-tabs-nav > li.z-active.z-first > a
{
  border-bottom-width:1px;
}

.z-tabs-nav > li.z-active > a
{
  background:#fff;
  color:#000F4D;
      text-shadow: 0 1px rgba(78, 78, 78, 0.1);
    filter: none;
      border-right-width: 0;
    z-index: 10;
}

.z-container
{
  
    border-color:#0487BD;
    border-style:solid;
    border-width:1px;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.125);
    position:relative;
    overflow:hidden;
    padding:0;
    margin:0;
    background:#fff;
    box-sizing:content-box;
    
}

.z-content
{
    display:none;
  width:100%;
  height:100%;
  overflow:hidden;
  padding:0;
    box-sizing:content-box;
}

.z-content > .z-content-inner
{
    padding:10px 25px;
  font-family:"Trebuchet MS", Helvetica, sans-serif;
}

.z-active
{
    display:block;
}

.z-content h1
{
  font-variant:small-caps;
  font-weight:bold;
}

.z-content h2
{
  width:100%;
  background-color:#0487BD;
  color:#fff;
  padding:5px;
  font-variant:small-caps;
  letter-spacing:3px;
  text-shadow: 1px 1px 2px black;
  margin:0;
}
.z-content h3
{
  width:100%;
  background-color:#B4D8E7;
  color:#000;
  padding:5px;
  font-variant:small-caps;
  letter-spacing:3px;
  font-weight:600;
  text-shadow: 1px 1px 2px #0487BD;
  margin:0;
}

.z-content .container
{
  display:inline-block;
  min-width:350px;
  margin-right:10px;
}

.z-content ul
{
  list-style:none;
  padding:0;
  margin:0;  
}
.z-content ul li
{
  padding-left:1em;
  text-ident:-7em;
}
.z-content ul li:before
{
  content:"Ï ";
  font-family: Wingdings; 
  color:#0487BD;
}

.z-content .container title
{
  background-color:#0487BD;
  color:white;
  padding:5px;
  display:block;
  font-weight:bold;
  text-align:center;
  font-variant:small-caps;
  letter-spacing:3px;
  text-shadow: 1px 1px 2px black;
  border:1px solid #000;
}

.z-content .container section
{
  display:block;
  padding:5px;
  
}

h4
{
    margin:0;
}
h1
{
  margin:0;
}

.icon
{
  position:absolute;
  height:20px;
  top:10px;
  left:3px;
  vertical-align:middle;
}

.icon-profile
{
  content: url('http://i.imgur.com/Eat3PDV.png');
  top:10px;
}

.icon-appearance
{
  content: url('http://i.imgur.com/n26NxUC.png');
}

.icon-skills
{
  content: url('http://i.imgur.com/I2f362U.png');
}

.icon-allies
{
  content: url('http://i.imgur.com/6sgrTTZ.png');
}

.icon-rumors
{
  content: url('http://i.imgur.com/6achxtY.png');
}

.icon-history
{
  content: url('http://i.imgur.com/SVvMDwy.png');
}

.icon-info
{
  content: url('http://i.imgur.com/qAADVap.png');
}