@font-face {
	font-family: 'gadget';
	src:url('./fonts/gadget.eot?r=1');
	src:url('./fonts/gadget.eot?r=1') format('embedded-opentype'),
		url('./fonts/gadget.woff?r=1') format('woff'),
		url('./fonts/gadget.ttf?r=1') format('truetype'),
		url('./fonts/gadget.svg?r=1') format('svg');
	font-weight: normal;
	font-style: normal;
}
.glyphicon:before, [class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: 'gadget' !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icon-twitter:before {content: "\e609"}
.icon-facebook:before {content: "\e60a"}
.icon-google:before {content: "\e60b"}
.icon-linkedin:before {content: "\e60c"}

.icon-asterisk:before {content: "\e612"}
.icon-envelope:before {content: "\e618"}
.icon-phone:before {content: "\e942"}
.icon-expand:before {content: "\e943"}
.icon-collapse:before {content: "\e941"}

.glyphicon-ok:before {content: "\e616"}
.glyphicon-remove:before {content: "\e617"}

*, *:after, *:before {
  box-sizing: border-box;
}
body {
  font-family: Arial, Helvetica, sans-serif;font-size:80%;
  font-style: normal;
  color: #333;
  font-style: normal;
  padding: 0; margin: 0; background-color: white ;
  text-align: left;
  line-height:1.3;
}
form {padding:0; margin:0}
b {font-weight:normal}
strong {color:black}
img {border:none}

h1,h2,h3,h4, .heading {
  padding:3px 0; margin:5px 0;
}
h1 {color:#008080;font-size:150%; font-weight:bolder}
h2 {color:#008080;font-size:120%; font-weight:bold; padding:5px 0}
h3 {color:#008080;font-size:120%; font-weight:normal; padding:10px 0 5px 0;}

h1 a {text-decoration:none}
h1 a:hover {text-decoration:underline}

p {margin-top:0;margin-bottom:10px}
p.join {margin-bottom:0px}
li {margin-bottom:0px;margin-left:10px;padding-left:0px}
ul, ol {margin:0 0 10px 20px; padding:0}

a, a:visited {font-weight:bold;color:#101010; text-decoration:none}
a:hover {text-decoration:underline}

table td {vertical-align:center}

fieldset {padding:5px}

/****** GENERAL CLASSES ******/
.Warning    { color: #FF0000; }
.Error      { text-align:center; color: #FF0000; }
.Message    { text-align:center; padding:0; font-weight: bold; color: #FF0000; }
.clear {clear:both}
.clearbox {position:relative;overflow:hidden}

/* HIDDEN - move things right off the top of the page - only useful to screen readers */
.hidden, .sr-only {
  position: absolute;top: -10000px;left: 0;
}
.removed {display:none}
.left {text-align:left}
.right {text-align:right}
.centre {text-align:center}

/** floats are ignored in the smallest screen sizes **/
.rfloat, .lfloat {width:100%}
.rfloat a, .lfloat a {display:block}
@media all and (min-width:480px) {
  .rfloat, .lfloat {font-size:80%;margin-bottom:10px;text-align:center;font-weight:bold !important;width:auto}
  .rfloat {float:right;margin-left:10px}
  .lfloat {float:left;margin-right:10px}
}
.form-submit, .separate {
  padding-top:10px;margin-top:10px;border-top:1px solid black
}
.menulist , .menulist ul {padding:0;margin:0;border:none}
.menulist li {display:inline;margin:0;padding:0px 10px;border-left:1px solid black}
.menulist li:first-child {border:none;padding-left:0}

.menu ul {padding:0;margin:0}
.menu li {display:inline}

.menublk ul {padding:0;margin:0}
.menublk li {display:block;padding:0;margin:0;padding:0 3px 3px 3px;margin:0 0 3px 0;border-bottom:1px dotted black}

.menusep li {border-left:1px solid black;padding-left:3px;margin-left:3px}
.menusep .first, .menusep li:first-child {border-left:none;padding-left:0;margin-left:0}
/* Basic structure */
#extright {width:100%;background:url(/custom/images/gradient7.png) bottom left repeat-x #008080;height:37px;position:absolute;top:0;right:0}
#pageWrap {
  width:100%;margin:0 auto;position:relative;z-index:10
}
.row {position:relative;xoverflow:hidden;width:100%}
.blk-related {clear:right}
.container, .container-fluid {width:100%}
/*** show- classes are hidden by default ***/
[class^="show-"], [class*=" show-"] {
  position:absolute;top:-10000px;left:0
}
@media all and (max-width:479px) {
  /** The default is 'xs' **/
  .show-xs {position:static}
  .hide-xs {display:none}
}

@media all and (min-width:480px) {
  /** This is sm **/
  #pageWrap {width:480px}
  .show-sm {position:static}
  .hide-sm {display:none}
}
@media all and (min-width:768px) {
  /** This is md **/
  #pageWrap {width:768px}
  .show-md {position:static}
  .hide-md {display:none}
}
@media all and (min-width:992px) {
  /** This is lg **/
  #pageWrap {width:992px}
  #bodyWrap1 {width:100%;float:left}
  .show-lg {position:static}
  .hide-lg {display:none}
}
@media all and (min-width:1200px){
  /** This is xl **/
  #pageWrap {width:1200px}
  .show-xl {position:static}
  .hide-xl {display:none}
}

#bodyWrap {padding-top:90px;height:400px}
html>body #bodyWrap {height:auto; min-height:400px}

/* BANNER */
#banner {
  position:absolute;top:0;left:0;width:100%;height:100px
}
#topMenu {display:none}
#banner .toggle {
  display:block;
  position:absolute;right:2px;top:2px;z-index:50001
}
#banner .toggle button{
  border:1px solid #fff;
  border-radius: 5px;
  background-color:#fff;
  width:40px;height:32px;
}
#banner .bigmenushow {
  display:block !important
}
.icon-bar {
    display: block;
    width: 22px;
    height: 6px;
    border-bottom:3px solid #008080;
    border-radius: 1px;
    xmargin-bottom:10px;
}
/* Social media buttons */
#banner .social {position:absolute;top:45px;left:190px;z-index:101;width:180px;height:32px;text-align:right}
#banner .social img {width:28px;height:28px}
#banner .social a {display:inline-block;margin-left:20px;vertical-align:top}
#banner .social a:first-child {margin-left:0}
@media all and (min-width:768px) {
  #banner .social {position:absolute;top:40px;left:auto;right:0;z-index:101;width:190px;height:32px;text-align:right;}
  #banner .social img {width:32px;height:32px}
}
#banner .logo {
  padding:0;margin:0;width:173px;height:75px;
  background-color:white;display:block;padding:10px;position:absolute;top:0px;left:0;
  border:3px solid #008080;border-left:none;
  border-bottom-right-radius:10px;
  border-top-right-radius:10px;
  behavior: url(/pie/PIE.htc);
}
#banner .corner  {display:block;position:absolute;top:37px;left:172px;}
#banner .corner3  {display:none}
#banner .extleft {display:block;width:1000px;border-top:3px solid #008080;border-bottom:3px solid #008080;height:75px;position:absolute;top:0;left:-1000px;background-color:white}
#banner .grad  {display:block;position:absolute;top:2px;left:190px;z-index:30}
#banner .search {display:none}

@media all and (min-width:480px) {
  #banner .search {display:block;position:absolute;top:50px;left:200px;}
  #banner .social {top:3px;left:190px}
}
@media all and (max-width:991px) {
  /* Style the menu in pop-up mode */
  #topMenu {
    background-color:#fff; color:#000;
    width:100%;
    border:1px solid #000;
    position:relative;
    z-index:50000;
  }
  #banner .bigmenu li:first-child {border:none;padding-left:0}
  #banner .bigmenu ul {padding:0;margin:0}
  #banner .bigmenu li {display:block;padding:5px 0}
  #banner .bigmenu a {color:#000;font-weigth:normal;color:#008080;font-size:120%}
  #banner .bigmenu a:hover {text-decoration:underline;color:#000}
}
@media all and (min-width:992px) {
  #topMenu {display:block}
  #banner .social {width:200px;top:40px;left:auto;right:0}
  #banner .toggle {display:none}
  #topMenu {
    position:relative;z-index:40;
    width:804px;float:right;text-align:right;
    padding:10px 0;height:17px;
  }
  #banner .bigmenu li {border:none}
  #banner .bigmenu a {
    color:white;text-decoration:none;font-weight:bold
  }
  #banner .bigmenu a:hover {text-decoration:underline}
  #banner .bigmenu , #banner .bigmenu ul {padding:0;margin:0;border:none}
  #banner .bigmenu li {display:inline;margin:0;padding:0px 10px}
  #banner .bigmenu li:first-child {border:none;padding-left:0}
  #banner .bigmenu ul {padding:0;margin:0}
}

/****************** SITE ADVERTISING *****************/
#g-rightcol {
  width:100%
}
@media all and (min-width:480px) {
}
@media all and (min-width:768px) {
}
@media all and (min-width:992px) {
  /** This is lg **/
  #g-rightcol {width:225px;margin-left:20px;float:left}

}
@media all and (min-width:1200px){
  /** This is xl **/
  #pageWrap {width:1200px}
  #g-rightcol {width:280px}
  .show-xl {position:static}
  .hide-xl {display:none}
}
#g-adblock2, .g-adblock3 {
  position:relative;width:260px;margin:0 auto
}
#g-adblock2 {height:265px}
.g-adblock3 {height:120px}

#g-adblock2 div, .g-adblock3 div {
  position:absolute;width:125px;height:125px;background-color:#d0d0d0;border:1px solid black
}
.round-pane {
  padding:5px;margin-bottom:20px;
  border:3px solid #008080;
  border-radius:10px;
  -moz-box-shadow: 5px 5px 5px #888;
  -webkit-box-shadow: 5px 5px 5px #888;
  box-shadow: 5px 5px 5px #888;
  behavior: url(/pie/PIE.htc);
  background-color:white;
}
.round-pane h2  {
  text-align:center
}

.tick {list-style-image:url(/images/tick.gif)}
.cross {list-style-image:url(/images/cross.gif)}

.print {display:none}

#footBlock {
  background:url(/custom/images/gradient7.png) top left repeat-x #008080;
  clear:both;
  min-height:35px;
  position:relative;
  margin:20px 0 0 0;padding:0;
  border-radius:10px;
}
#footBlock a {color:white;text-decoration:none;font-weight:bold}
#footBlock .menu a {padding:0 10px;font-weight:bold;font-size:100%}
#footBlock li {border-left:none}

@media all and (max-width:479px) {
  #footBlock .menu ul {padding-top:20px;}
  #footBlock .menu li {display:block; padding-left:10px;margin-left:0}
}
#copyright {
  clear:both;
  font-size:80%;
  text-align:center;
  padding:10px 10px  0 0;
  margin-top:10px;
  color:white;
}

@media all and (min-width:480px) {
  #footLeft {
    position:absolute;left:0;top:3px;
    width:650px; height:42px;
  }
  #footLeft ul {padding:10px 0 0 10px}
  #copyright {
    text-align:right;
    padding:5px 10px  0 0;xmargin:0 0 0 650px;
    height:35px;
  }
}
#copyright a {
  text-decoration:none; color:white;
}
#footBlock a:hover {border-bottom:1px solid yellow}

#footBlock ul {list-style-type:none}
#footBlock2 {
  margin:10px;padding-top:10px;border-top:1px solid #00c0c0
}
/********** POPUP WINDOWS **************/
.popup-win, .popup-win-vis {
  position:absolute;z-index:600000
}
.popup-win {visibility:hidden}

#popup-win-login {
  top:250px;left:350px;
  width:300px;
  border:3px solid #394a5a;
  background-color:white;
  padding:0;margin:0;white-space:nowrap;
}
#popup-win-login form {padding:5px}
#popup-win-login h3 {color:white;background-color:#de4949;padding:2px 10px;margin:0}
#popup-shield {
  position:absolute;z-index:500000;top:-10px;left:-10px;bottom:-10px;width:100%;background-color:#202020;
  display:none;margin:0 auto;
  filter:alpha(opacity=35);   /* Internet Explorer       */
  -moz-opacity:0.35;           /* Mozilla 1.6 and below   */
  opacity: 0.35;               /* newer Mozilla and CSS-3 */
}
#popup-shield.visible {display:block}

#topic-bar {display:none}
@media all and (min-width:480px) {
  #topic-bar {display:block;text-align:center;margin:0 auto}
}
#topic-bar a, #topic-bar-wide a {
  width:60px;height:66px;display:inline-block;
  xfloat:left;
  background:transparent url(/custom/images/topics-bar.png?r=6) top left no-repeat;text-decoration:none;
  padding:1px
}
#topic-bar-wide a {margin-left:20px}
#topic-bar-wide a:first-child {margin-left:0}

#topic-bar a:hover, #topic-bar-wide a:hover {
  padding:0;
  border:1px solid #008080;
  border-radius:10px;
  -moz-box-shadow: 5px 5px 5px #888;
  -webkit-box-shadow: 5px 5px 5px #888;
  box-shadow: 5px 5px 5px #888;
  behavior: url(/pie/PIE.htc);
}
.articleOutline {
  border-bottom:1px solid #008080;
  margin-bottom:10px;padding:5px 10px;
  background-color:white;
}
.articleOutline h2 {
  font-size:140%
}
.articleOutline h2 a {
  text-decoration:none
}
.articleOutline img {
  float:right;
  xwidth:100%
}
.articleSummary {margin-bottom:0.5em;color:black}
.articleHead {font-size:140%;padding:0 0 1em 0;color:#404040}
@media all and (min-width:480px) {
  .articleOutline {
    padding-bottom:5px;
    border:3px solid #008080;
    border-radius:10px;margin-bottom:10px;padding:5px 10px;
    -moz-box-shadow: 5px 5px 5px #888;
    -webkit-box-shadow: 5px 5px 5px #888;
    box-shadow: 5px 5px 5px #888;
    behavior: url(/pie/PIE.htc);
    background-color:white;
    margin-right:0
  }
  #fp_articles .articleOutline {width:100% !important;margin-right:0}
  .articleOutline h2 {
    font-size:140%
  }
  .articleOutline h2 a {
    text-decoration:none
  }
  .articleOutline img {
    float:right;
    width:auto
  }
  .articleSummary {margin-bottom:0.5em;color:black}
  .articleHead {font-size:140%;padding:0 0 1em 0;color:#404040}
}
@media all and (min-width:992px) {
  .articleOutline {width:485px;margin-right:20px;float:left}
  .articleOutline:nth-child(odd) {clear:both}
  #articleList {width:1050px}
}
@media all and (min-width:1200px){
  .articleOutline:nth-child(odd) {clear:none}
  .articleOutline:nth-child(3n+1) {clear:both}
  #articleList {width:1300px}
  .articleOutline {width:385px}
}

  /************* Gen purpose pretty table ***************/
.pretty_table th {
  text-align:center;font-weight:bold;color:white;background-color:#008080;vertical-align:center;padding:3px 5px 0 5px;
}
.pretty_table td {
  background-color:#E0E0E0;vertical-align:top;padding:0 5px
}
/************* Gen purpose pretty table - v2***************/
table.pretty {border:1px solid black;margin-bottom:20px}
table.pretty thead th {
  text-align:center;font-weight:bold;color:white;background-color:#008080;vertical-align:middle;padding:3px 5px 0 5px;
}
table.pretty tbody th {
  text-align:left;font-weight:normal;color:white;background-color:#008080;vertical-align:middle;padding:3px 5px 0 5px;
}
table.pretty td {
  background-color:#E0E0E0;vertical-align:top;padding:3px 5px
}
table.pretty caption {font-weight:bold;text-align:center;font-size:120%;border-top:1px solid black}

/******** PRIZEDRAW INFORMATION *******/
.promotion {
  text-align:center; margin-bottom:10px; margin-top:10px
}
.promotion .wrap {padding:10px}
.promotion .highlight {font-weight:bold;text-decoration:none;color:black}
.promotion a.highlight:hover {text-decoration:underline}
/******** LOGIN/REG *********/
#month_comp {
  position:absolute;left:300px;top:11em;z-index:1000;
  width:400px;padding:5px;
  background:white
}
#month_comp h2 {
  color:white;background-color:#008080;text-align:center;font-size:140%;margin-top:0;
  border-radius:10px;
  -moz-box-shadow: 5px 5px 5px #888;
  -webkit-box-shadow: 5px 5px 5px #888;
  box-shadow: 5px 5px 5px #888;
  behavior: url(/pie/PIE.htc);
}
#competition-rules {
  margin-top:200px;padding-top:20px;border-top:1px solid black
}

/** Standard form display **/
/*** DEAL WITH FORMS ***/
.Message {font-weight: 700; color: #b70d30; text-align: center}
.stdForm .control-group, .stdForm .form-group {padding:5px}
.stdForm fieldset {border:none}
.stdForm textarea,
.stdForm input[type=text], .stdForm input[type=email], .stdForm input[type=number], .stdForm input[type=password], .stdForm input[type=tel], .stdForm select {
  width:100%;
  padding:5px;
  border-radius:5px;
  border:1px solid #e0e0e0;
  color:#808080;
  font-size:120%
}
.stdForm button {
  padding:5px;
  background-color:#b70d30;
  border:1px solid #df1314;
  color:#fff;
  border-radius:5px;
}
.stdForm button:hover {
  background-color:#151c8d;
}
.stdForm .ErrField, .stdForm .control-group.has-error .input-group > *, .stdForm .form-group.has-error .input-group > * {
	border-color:#b70d30 !important;
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(255,102,0,.6)
}
.form-control:focus > *, .input-group-addon:focus, .stdForm input[type=text]:focus, .stdForm input[type=email]:focus, .stdForm input[type=password]:focus, .stdForm input[type=tel]:focus, .stdForm textarea:focus {
  border-color:#66afe9;
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6)
}
.stdForm .control-group.has-error .input-group-addon {
	color:#b70d30
}
.stdForm .glyphicon-ok:before {color:#404040 !important}

.stdForm input:placeholder-shown {
  color:#e0e0e0;font-size:18px
}
.stdForm .control-group, .stdForm .form-group {
  position:relative;
  display:table;
  width:100%;
  padding:0;
  margin:15px 0;
}
.stdForm .input-group input {
  border-color:0;
  border-radius:0
}
.stdForm .input-group:first-child {}
.stdForm .input-group {display:table-row;padding:0;margin:0}
.stdForm .input-group > input{display:table-cell;xpadding:0;margin:0;}
.stdForm .input-group .input-group-addon {display:table-cell;background-color:#c0c0c0;text-align:center;width:30px}
.stdForm .form-control-feedback:before {position:absolute;bottom:8px;right:40px;font-size:16px;color:#b70d30}
.stdForm .form-control-feedback.feedback-right:before {right:10px}

/* Deal with the radius */
.stdForm .input-group .form-control {
  border-radius:5px;
  border:1px solid #e0e0e0
}
.stdForm .input-group .form-control:not(:first-child) {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
  border-left:0;
}
.stdForm .input-group .form-control:not(:last-child) {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
  border-right:0;
}
.stdForm .input-group .input-group-addon {
  border:1px solid #e0e0e0
}
.stdForm .input-group .input-group-addon:first-child {
  border-bottom-left-radius: 5px;
  border-top-left-radius: 5px;
}
.stdForm .input-group .input-group-addon:not(:first-child) {
  border-left:0
}
.stdForm .input-group .input-group-addon:last-child {
  border-bottom-right-radius: 5px;
  border-top-right-radius: 5px;
}
.stdForm .input-group .input-group-addon:not(:last-child) {
  border-right:0
}

/** Popup viewer **/
#popup-image {
  width: 100vw; height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute; top: 0; left: 0; z-index: 10000;
  background-color: rgba(0,0,0,0.5);
}
#popup-image.removed {
  display: none;
}
#popup-image div {
  padding: 5px;
  background-color: #fff;
  position: relative;
}
#popup-image img {
  padding: 20px;margin: 0; border: 1px solid red;
  background-color: #fff;
}
#popup-image button {
  position: absolute;
  top: 10px; right: 10px; z-index: 1;
  border: 0;
  background-color: rgba(255,255,255,0.5);
  padding: 5px;
  margin: 0;
}
#popup-image button:before {
  font-family: gadget;
  font-size: 25px;
  content: "\e617";
  color: #888;
  padding: 0;
  margin: 0;
  position: relative; top: 1px;
}
#popup-image button:hover:before {
  color: #000
}