/* Reset v1.0 | 20080212 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}
body {
  line-height: 1;
}
ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

/* remember to define focus styles! */
:focus {
  outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
  text-decoration: none;
}
del {
  text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

a img {
  padding: 0;
  margin: 0;
  border: 0;
}

/* Framework reset */

div, section, header, footer, article,
ol, ul, li,
dl, dt, dd,
p, h1, h2, h3, h4, h5, h6,
textarea, input, select, label, blockquote, form, fieldset, legend {
  position: relative;
  float: left;
  width: 100%;
}

input, textarea, select { width: auto; }

input { border: none; }

a img {
  padding: 0;
  margin: 0;
  border: 0;
}

a,
input.submit,
input.button,
input[type=submit],
input[type=button]
{ cursor: pointer; }

/* EM calcs:
    16 source:
      12 - 0.75
        11 - 0.92
        14 - 1.17
        100 - 8.333
        20 - 1.667
        24 - 2
      11 - 0.69
*/

/* Colours used:
  RED: #D22C23;
  DARK RED: #970A02;
  BLUE: #004999;
  DARK BLUE: #08326F;
  LIGHT BLUE: #E0E9F3;
  YELLOW: #F2FF00;
  LIME: #AFC700;
*/

/* Hidden text */
.hiddenText, a.rating {
  text-indent: -9999px;
  overflow: hidden;
  font-size: 0;
}

/* Hidden elements */
span.tooltip,
.hidden {
  display: none;
}

/* Globals */

a,
a:link,
a:visited {
  font-weight: bold;
  text-decoration: none;
  cursor: pointer;
  /*color: #006097;*/
  color: #FFF;
}

a:hover { /*color: #00395A;*/ text-decoration: underline; }

h1 a, 
h2 a, 
h3 a, 
h4 a, 
h5 a, 
h6 a,
section > ul li a {
  font-weight: normal !important;
}

p {
  font-size: 1.17em;
  margin-bottom: 1em;
}

/* Styles */

body {
  background: #000;
  font-family: 'Oxygen', Tahoma, sans-serif;
  letter-spacing: 0.05ex;
  color: #EEE;
  font-size: 0.75em;
  line-height: 1.5;
}

h1, h2, h4, h5, h6 {
  font-family: 'Uncial Antiqua', cursive;
  font-variant: small-caps;
  font-weight: normal;
  color: #FFF;
}

h3 {
  font-family: 'Metamorphous', cursive;
  font-weight: normal;
  font-size: 1.667em;
  line-height: 1.8;
  margin-bottom: 0.45em;
  color: #FFF;
}

section > ul li a { font-family: 'Metamorphous', cursive; }

input, textarea {
  font-family: Arial;
  line-height: 1.5;
  font-size: 1em;
  color: #444;
  border: 1px solid #DFDFDF;
}

div.wrapper {
  position: static;
  float: none;
  width: 960px;
  margin: 0 auto;
  padding: 0;
}

header img#logo {
  position: relative;
  float: left;
  width: auto;
  height: 150px;
  padding: 10px 0;
  margin: 10px 26px 20px 27px;
}

header h1 {
  width: 670px;
  margin-top: 30px;
  margin-right: 10px;
  text-align: center;
  font-size: 6.333em;
  font-family: 'Uncial Antiqua', cursive;
  text-transform: uppercase;
}

header small {
  position: relative;
  float: left;
  width: 670px;
  margin-right: 10px;
  font-family: 'Metamorphous', cursive;
  font-size: 1.17em;
  text-align: center;
  color: #939393;
}

header ul#navigation {
  background: #292929;
  -webkit-border-top-left-radius: 5px;
  -webkit-border-top-right-radius: 5px;
  -moz-border-radius-topleft: 5px;
  -moz-border-radius-topright: 5px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  overflow: hidden;
}

header ul#navigation li {
  width: 240px;
}

header ul#navigation li:active {
  background: #121212;
}

header ul#navigation li a {
  position: relative;
  float: left;
  width: 100%;
  font-family: 'Uncial Antiqua', cursive; /* Uncial+Antiqua | Berkshire Swash */
  font-size: 2em;
  text-align: center;
  color: #FFF;
  line-height: 2;
  font-weight: normal;
  font-variant: small-caps;
}
header ul#navigation li a.active,
header ul#navigation li a:hover {
  background: #121212;
  text-decoration: none;
}

div.navBox { 
  display: none; 
  padding: 10px 0;
  background: url(/img/navBoxBack.png) 0 0 repeat-x #000;
}

/* @todo TEMP */
div#navBox2 { display: block; }

ul.subNav {
  width: 220px;
  margin: 10px;
}

div.smallMod {
  width: 300px;
  margin: 10px;
}

div.largeMod {
  width: 380px;
  margin: 10px;
}

ul.subNav li {
  margin-bottom: 0.5em;
}

ul.subNav li a {
  font-family: 'Uncial Antiqua', cursive;
  font-variant: small-caps;
  font-size: 2em;
  text-align: center;
  font-weight: normal;
  color: #FFF;
}
ul.subNav li a:hover {
  text-decoration: underline;
}

div#sponsors {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  overflow: hidden;
  background: url(/img/grayLoader.gif) no-repeat 50% 50% #292929;
}

div#sponsors img {
  position: absolute;
  top: 0px;
  left: 0px;
  display: none;
  background: #292929;
}
div#sponsors a {
  border: 0;
  display: block;
}

div.section {
  margin: 0 0 30px 0;
}

section.announcements {
  width: 630px;
  background: #292929;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  overflow: hidden;
}

section h4 {
  font-size: 2em;
}

section { padding: 10px 0; }

section.announcements article {
  width: 360px;
  margin: 0 10px;
  padding-right: 20px;
}

section small {
  position: relative;
  float: left;
  width: 100%;
  font-size: 0.92em;
  color: #939393;
}

section.announcement article small {
  margin-bottom: 1em;
}

section.announcements ul {
  width: 210px;
  margin: 10px;
  margin-top: 20px;
}

section ul li,
section ol li {
  margin-bottom: 1em;
}

section.announcements article > a {
  font-size: 1.17em;
}

section.announcements > div { width: auto; }

section h5 {
  line-height: 1.1;
}

section h5 a {
  font-size: 1.083em;
}

section.news {
  margin-left: 20px;
  width: 290px;
  padding: 10px;
  background: #121212;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  overflow: hidden;
}

section.gallery {
  width: 960px;
  height: 295px;
  background: #121212;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  overflow: hidden;
  padding: 0;
}

section.gallery h4 { margin-top: 10px; }

section.gallery div.photos {
  float: right;
  width: 630px;
  height: 295px;
  background: url(/img/grayLoader.gif) no-repeat 50% 50% #292929;
}

section.gallery div.photos img {
  position: absolute;
  top: 0px;
  left: 0px;
  display: none;
  background: #121212;
}
section.gallery div.photos a {
  border: 0;
  display: block;
}

section.gallery div.description {
  width: 300px;
  padding: 0 10px;
}

section.gallery div.description small,
section.announcements article small {
  margin-bottom: 1em;
}

section.tournaments,
section.overallPlacement {
  width: 450px;
  padding: 10px;
  background: #292929;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
section.tournaments { margin-right: 20px; }

section.overallPlacement ol {
  margin-left: 1.5em;
  width: auto;
  list-style-position: outside;
  list-style-type: decimal;
}

div.page {
  background: url(/img/navBoxBack.png) 0 0 repeat-x #000;
  min-height: 500px;
}

div.page section.mainContent {
  float: left;
  width: 620px;
  padding: 10px;
}

section.mainContent > * { width: 90%; }

section.mainContent h2 { 
  font-size: 2.5em; 
  margin-bottom: 0.75em;
}

section.mainContent article a,
section.mainContent article a:link {
  text-decoration: underline;
}
section.mainContent article a:hover {
  text-decoration: none;
}

section.mainContent article ul,
section.mainContent article ol {
  margin-left: 2em;
  list-style-position: outside;
  list-style-type: disc;
  font-size: 1.17em;
}
section.mainContent article ol { 
  list-style-type: upper-roman;
}
  
div.sideContent {
  width: 320px;
}

div.sideContent section {
  width: auto;
  padding: 10px;
  margin: 10px 0;
  background: #121212;
}

div.sideContent section.announcements ul { width: auto; margin: 0; }

div.sideContent h3 { font-size: 1.17em; }

div.sideContent ul.subNav {
  margin-top: 10px;
  width: 300px;
}

div.sideContent ul.subNav li.active {
  background: #292929;
  /*-webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;*/
  margin-left: -10px;
  padding-left: 10px;
  padding-right: 10px;
}

ol.members li { width: 45%; margin-right: 5%; }

ol.members li h3 { font-size: 1.17em; }

ol.members li dt,
ol.members li dd {
  width: auto;
}
ol.members li dt { 
  clear: left; 
  margin-right: 1ex;
  font-weight: bold;
}
ol.members li dt:after {
  content: ':';
}

ol.sponsors { width: 100%; }
ol.sponsors li { width: 300px; margin: 0 10px 10px 0; }

a img { margin: 0; padding: 0; float: left; }

ol.sponsors li img,
ol.sponsors li span {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  background: #FFF;
  width: 300px;
  height: 134px;
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  color: #000;
}
ol.sponsors li span {
  padding-top: 20px;
  height: 114px;
  font-family: 'Metamorphous', cursive;
  font-size: 2em;
}

section.sponsor > img {
  width: auto;
  margin-bottom: 1em;
}

section.mainContent div.tournaments {
   background: #292929;
   border-radius: 5px 5px 5px 5px;
   padding: 10px;
   margin: 0 -10px;
}

section.mainContent div.tournaments h4 { 
  font-family: 'Metamorphous', cursive;
  font-size: 1.083em; 
}

section.tournament > small { 
  top: -1.5em; 
  font-size: 1em;
}

section.tournament ol.tournamentPlacements li,
ol.overallPlacements li {
  list-style: outside decimal;
  margin-left: 1.5em;
}

a.more {
  position: relative;
  float: left;
  clear: left;
}

section.mainContent article h4 a:link,
section.mainContent article h4 a:visited { text-decoration: none; }
section.mainContent article h4 a:hover { text-decoration: underline; }

ol.galleries {
  margin-right: -10px;
  width: 630px;
}

ol.galleries li {
  padding: 0 10px 0 0;
  width: 300px;
}

ol.galleries li img {
  max-width: 300px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}

div#lightbox div {
  position: static;
  float: none;
  width: auto;
}

ul.links li {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  background: #292929;
  padding: 10px;
  width: auto;
}

ul.links li p:last-child { margin-bottom: 0; }

ul.links li > *,
ul.videos li > * {
  position: relative;
  float: left;
  clear: both;
}
ul.links li > strong,
ul.videos li > strong {
  clear: left;
  cursor: pointer;
}

ul.links li div a.link {
  margin: 1ex 0;
  position: relative;
  float: left;
  clear: both;
}

footer { padding: 20px 0 80px 0; }

footer ul a {
  position: relative;
  float: left;
  clear: both;
}

footer > ul {
  float: right;
}

footer > ul > li > a {
  margin-bottom: 1ex;
  font-weight: bold;
  font-size: 1.17em;
}

footer p,
footer ul,
footer ul li {
  width: auto;
  margin-right: 1em;
}
footer ul li li,
footer ul li ul { clear: left; }

footer ul li li {
  font-size: 0.92em;
}
footer ul li li a {
  font-weight: normal;
}

footer p.copy {
  color: #939393;
}

ul.videos iframe { margin: 1em 0; }

ul.links a.showContent,
ul.videos a.showContent {
  position: relative;
  float: left;
  width: 16px;
  height: 16px;
  background: url(/img/contentArrows.png) left bottom no-repeat;
  clear: none;
  margin-left: 10px;
}
ul li a.showContent.open {
  background: url(/img/contentArrows.png) left top no-repeat;
}

ul.breadcrumbs li {
  width: auto;
}

ul.breadcrumbs {
  background: #121212;
  padding-top: 1em;
  margin-bottom: -1ex;
  z-index: 1;
}

ul.breadcrumbs li:after {
  content: ">";
  margin: 0 1ex;
  color: #939393;
}

ul.breadcrumbs li:first-child {
  margin-left: 10px;
}

ul.breadcrumbs li:last-child:after {
  content: none;
}

ul.breadcrumbs li a { color: #939393; }
ul.breadcrumbs li:last-child a { color: #FFF; }

.mainContent a[href^="http://"] { 
  padding-right: 1.1em;
  margin-right: 0.1ex;
  background: url(/img/externalLink.png) right 37% no-repeat;
}
.mainContent a[href*="udruga-topor"],
.mainContent a[href*="wrks.webfactional"],
.mainContent a[href*="localhost"] {
  padding-right: 0;
  background: none;
}

section.categories h4,
section.categories h4 + ul.links {
  margin-left: 5%;
  width: 85%;
}
section.categories h5,
section.categories h5 + ul.links {
  margin-left: 8%;
  width: 82%;
}
section.categories h6,
section.categories h6 + ul.links {
  margin-left: 11%;
  width: 79%;
}

section.categories h4,
section.categories h5,
section.categories h6 { 
  font-family: 'Metamorphous', cursive; 
  font-size: 1.2em; 
  font-variant: normal;
}

section.mainContent > div.column {
  width: 48%;
  margin-right: 2%;
}

div.linkCategory {
  width: 31%;
  margin-right: 2%;
  margin-bottom: 1em;
}
div.linkCategory:nth-child(3n+1) {
  clear: left;
}

.mainContent article h4 {
  margin-bottom: 0.75em;
}

.mainContent article ul li,
.mainContent article ol li {
  margin-bottom: 0.5ex;
}

.mainContent article ul,
.mainContent article ol {
  margin-bottom: 1em;
}

section.mainContent article a,
section.mainContent article a:link,
section.mainContent article a:visited {
  color: yellow;
  text-decoration: none;
  font-weight: normal;
}
section.mainContent article a:hover {
  text-decoration: underline;
}

table, td, th { border: 1px solid #333; }

td, th { text-align: left; padding: 0.4em 0.5em; vertical-align: middle; }

tr.place-1, tr.place-2, tr.place-3 {
  color: yellow;
}

tr[class*="masters"] {
  color: green;
}