/*
    Document   : styles
    Updated    : 03-Jul-2012
    Author     : Bex
    Description: Error pages
*/
html {
  margin: 0;
  padding: 0;
  height: 100%; }

body {
  background: #f7f7f7;
  height: 100%;
  margin: 0;
  padding: 0;
  color: #333;
  font-family: 'Averta', arial, helvetica, FreeSans, Nimbus Sans L, Garuda, Utkal, sans-serif;
  font-size: 13px; }

body.billetech {
  background: #ece7d1; }

.container {
  min-height: 100%;
  width: 1000px;
  margin: 0 auto;
  background: #dddbdc; }

.container.short {
  min-height: 680px; }

header .container {
  background: transparent; }

.content {
  width: 100%;
  margin: 0 auto;
  overflow: auto;
  min-height: 472px;
  background: #fff;
  background: #dddbdc; }

body.billetech .container,
body.billetech .content {
  background: #fff; }

body.billetech header .container {
  background: transparent; }

.boxStyle {
  border: 1px solid #bcbcbc;
  margin: 15px;
  overflow: hidden;
  padding: 0 0 70px 28px;
  background: #fff; }

.boxStyle p {
  position: relative;
  z-index: 10; }

h1 {
  width: auto;
  margin: 0 auto;
  padding: 10px 25px;
  float: left; }

img {
  border: none; }

h2 {
  color: #0098a5;
  font-size: 200px;
  float: left;
  margin: 0; }

h3,
.errorQueue h2,
.errorQueue p {
  font-size: 17px;
  font-weight: bold;
  color: #333;
  float: none; }

p {
  color: #333;
  font-size: 17px;
  margin: 1em 0; }

a {
  color: #0098a5;
  text-decoration: none;
  font-weight: bold;
  font-size: 13px;
  margin: 0; }

a:hover {
  color: #0098a5;
  text-decoration: underline; }

.oops {
  font-size: 31px;
  font-weight: bold;
  margin: 0; }

.colRight,
.hilight {
  float: left;
  padding: 26px 29px 34px;
  margin: 43px 0 0 23px;
  position: relative;
  background: #efba1c; }

.hilight {
  float: none;
  background: #fdbe00;
  width: 426px;
  margin: 43px auto 0; }

.hilight p {
  margin-bottom: 0; }

.hilight .oops {
  color: #fff; }

.colRight p {
  margin: 6px; }

.colRight div,
.hilight div {
  position: absolute; }

.triangle-left {
  left: 0;
  top: 0;
  width: 0;
  height: 0;
  border-bottom: 272px solid #fff;
  border-left: 0 inset transparent;
  border-right: 21px inset transparent; }

.triangle-right {
  right: 0;
  top: 0;
  width: 0;
  height: 0;
  border-bottom: 265px solid #fff;
  border-left: 23px inset transparent;
  border-right: 0 inset transparent; }

.triangle-top {
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  border-right: 494px solid #fff;
  border-top: 0 inset transparent;
  border-bottom: 30px inset transparent; }

.triangle-bottom {
  bottom: 0;
  left: 0;
  width: 0;
  height: 0;
  border-right: 494px solid #fff;
  border-top: 14px inset transparent;
  border-bottom: 0 inset transparent; }

.colRight .link {
  position: absolute;
  bottom: -48px; }

.content .boxInner {
  padding: 10px 15px;
  text-align: center; }

#polling {
  margin: 30px;
  text-align: center; }

header {
  padding: 0;
  margin: 0 auto;
  width: 100%;
  display: inline-block;
  vertical-align: top; }

footer {
  position: relative;
  margin: -90px auto 0 auto;
  /* negative value of footer height */
  height: 70px;
  clear: both;
  text-align: center;
  color: #ccc;
  font-size: 12px;
  background: #393939;
  padding: 10px 0;
  width: 1000px; }

.error500 .content,
.errorMaintenance .content {
  border: 1px solid #cacaca;
  margin-top: 25px;
  width: 970px;
  padding: 0; }

.errorQueue .content {
  text-align: center; }

.error500 h2,
.errorMaintenance h2 {
  height: auto;
  float: none;
  padding: 5px 20px;
  background: url("../../images/bgh2.gif") repeat-x scroll 0 0 #020202;
  color: #f2f2f2;
  display: block;
  min-height: 20px;
  width: auto;
  font-size: 18px;
  font-weight: bold;
  line-height: 18px; }

.error500 p,
.errorQueue .warning p {
  font-weight: bold;
  font-size: 13px; }

.errorMaintenance p {
  font-size: 17px;
  font-weight: bold; }

.errorQueue .content,
.errorQueue .boxInner {
  background: none; }

.clearfix {
  clear: both; }

.warning {
  background-color: #ffffcd;
  border: 1px solid #a7a98f;
  line-height: 1.6;
  overflow: hidden;
  padding: 7px 0 7px 37px;
  position: relative;
  text-align: left;
  width: 650px;
  margin: 30px auto 0; }

.warning p {
  margin: 0; }

.warning span.logo {
  background: url("../../images/errorPages/icon_warning.png") no-repeat scroll 0 0 transparent;
  display: block;
  height: 14px;
  left: 11px;
  position: absolute;
  top: 12px;
  width: 19px; }

#done {
  height: 5px;
  background: #e2282d; }

#todo {
  height: 5px;
  background: #ccc; }

#jhide {
  visibility: hidden; }

#jhide table {
  margin: 45px auto; }

body.billetech header,
body.billetech footer {
  background: #680000; }

body.billetech h2 {
  background: transparent;
  color: #7d1414; }

body.billetech .colRight,
.billetech .hilight {
  background: #ece7d1; }

body.billetech .oops,
body.billetech .link a {
  color: #680000; }

/**
 * Languages
 */
#languages-list {
  list-style-type: none;
  margin: 40px 15px 0 0;
  float: right; }

#languages-list li {
  display: inline; }

#languages-list a,
#languages-list span {
  font-weight: normal; }

#languages-list a.active {
  color: #999;
  cursor: default; }

#languages-list a.active:hover {
  text-decoration: none; }

.boxInner p:last-child {
  margin-bottom: 100px; }

/* less than desktop */
@media only screen and (max-width: 999px) {
  .container,
  footer {
    width: 768px; }
  h2 {
    font-size: 133px;
    margin-top: 17px; } }

/* mobile-landscape */
@media only screen and (max-width: 767px) {
  .container,
  footer {
    width: 480px; }
  .container,
  .content {
    background: #fff; }
  h2 {
    display: none; }
  h1 {
    float: none;
    text-align: center; }
  #languages-list {
    margin: 0 0 10px; }
  .hilight {
    width: auto; }
  .hilight .oops {
    color: #000; }
  .colRight,
  .hilight,
  .billetech .colRight,
  .billetech .hilight {
    background: #fff;
    float: none;
    text-align: center;
    padding: 0;
    margin: 43px 0 0; }
  body.billetech .colRight,
  .hilight {
    background: #fff; }
  .triangle-left,
  .triangle-right,
  .triangle-top,
  .triangle-bottom {
    display: none; }
  .boxStyle {
    padding: 0 10px 50px;
    border: none; }
  .colRight .link {
    position: static;
    margin-top: 17px; } }

/* mobile-portrait */
@media only screen and (max-width: 479px) {
  .container,
  footer {
    width: 320px; } }
