/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}
/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

.loading {
  background: url("../../img/loadingSpinner.gif") no-repeat scroll 50% 50% transparent;
  min-height: 50px;
}

.kehys {
  border: 4px solid #FFFFFF;
  box-shadow: 1px 1px 5px #000000;
  max-width: 100%;
  height: auto;
}

#footer #footerSlogan {
  margin: 10px 0 5px 0;
}
#footer #footerSlogan a {
  color: #999999;
  font-size: 0.9em;
  text-decoration: none;
}
#footer .col {
  word-wrap: break-word;
}

/* Validaatio-pluginin virheet */
label.error {
  background: url("../../img/bg_error_label.png") repeat-x scroll top left #C81E2B;
  border-radius: 0 0 8px 8px;
  box-shadow: 1px 2px 5px #999999;
  color: #FFFFFF;
  font-size: 0.8em;
  padding: 5px 15px 5px 7px;
  white-space: nowrap;
  display: inline;
  margin-top: 2px;
}
textarea.error,
input.error {
  border: 1px solid #DD8888;
}
textarea.error:focus,
input.error:focus {
  border: 1px solid #DD8888;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 6px #D59392;
}

.validatorErrorClose {
    color: #CCCCCC;
    cursor: pointer;
    margin: -5px 0 0 3px;
    position: absolute;
}
.validatorErrorClose:hover {
    color: #FFFFFF;
}

.pageError {
  background-color: #FFBBBB;
  border: 1px solid #994444;
  border-radius: 5px;
  box-shadow: 0 0 2px #888888;
  color: #800000;
  margin: 20px 0;
  padding: 10px 15px;
}
.pageError .pageErrorSulje {
  cursor: pointer;
}
.pageError .pageErrorSulje:hover {
  color: #BB0000;
}


/*  
Sticky Footer Solution
by Steve Hatcher 
http://stever.ca
http://www.cssstickyfooter.com
*/

* {margin:0;} 

/* must declare 0 margins on everything, also for main layout components use padding, not 
vertical margins (top and bottom) to add spacing, else those margins get added to total height 
and your footer gets pushed down a bit more, creating vertical scroll bars in the browser */

html, body {height: 100%;}

#wrap {min-height: 100%;}

#containerContent {
  overflow:auto;
	padding-bottom: 200px;
}  /* must be same height as the footer */

#footer {
  position: relative;
	margin-top: -200px; /* negative value of footer height */
	height: 200px;
	clear:both;
} 

/*Opera Fix*/
body:before {/* thanks to Maleika (Kohoutec)*/
  content:"";
  height:100%;
  float:left;
  width:0;
  margin-top:-32767px;/* thank you Erik J - negate effect of float*/
}


body {
  background-color: #F0F2F1;
  color: #000000;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

h1 {
  color: #EE1C25;
  text-shadow: 1px 1px #555555;
}

.glyphicon {
  color: #EE1C25;
}

#navigation {
  border: none;
  box-shadow: 0 0 4px #444444;
}

#containerNavi {
  float: right;
}
#containerNavi ul li a {
  background-color: transparent;
}
#containerNavi ul li.active a {
  background-color: #EE1C25;
  color: #FFFFFF;
  text-shadow: 0 1px 0 #555555;
}

#contentTop {
  background-color: #0B0203;
  text-align: center;
  padding-bottom: 10px;
  padding-top: 5px;
  border-top: 1px solid #666666;
  box-shadow: 0 0 4px #888888;
}
#contentTop img {
  max-width: 100%;
  height: auto;
}

#containerContent {
  background-color: #FFFFFF;
  box-shadow: 0 0 10px #888888;
}

#content {
  padding-bottom: 30px;
}
#footer {
  background-color: #333333;
  color: #CCCCCC;
  box-shadow: 0 0 2px #888888;
}

#footerTop {
  background: url("../../img/bg_footer_top.png") repeat-x scroll 0 0 #EE1C25;
  height: 25px;
}

#footerMiddle {
  border-top: 1px solid #888888;
  height: 135px;
}

#footerBottom {
  border-top: 1px solid #444444;
  background-color: #222222;
  height: 40px;
}

.mainos {
  font-weight: bold;
}

#tikkeri {
  margin-bottom: 20px;
  min-height: 320px;
  max-width: 100%;
}
#tikkeri .tikkeriBoxi {
  cursor: pointer;
  max-width: 100%;
}
#tikkeri .tikkeriBoxi .containerImg {
  max-width: 100%;
}
#tikkeri .tikkeriBoxi .ajoneuvo {
  width: 400px;
  box-shadow: 0 0 5px #888888;
  max-width: 100%;
}
#tikkeri .tikkeriBoxi .tikkeriBarContainer {
  background: url("../../img/bg_tikkeri_white.png") repeat scroll 0 0 transparent;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  color: #444444;
  padding: 2px 5px;
  /*text-shadow: 1px 1px #000000;*/
}
#tikkeri .tikkeriBoxi .tikkeriBarContainer label {
  display: none;
}
#tikkeri .tikkeriBoxi .containerImg {
  float: right;
  position: relative;
}
#tikkeri .tikkeriBoxi .tblTiedot td {
  text-align: left;
}
#tikkeri .tikkeriBoxi .tblTiedot .tdMerkki {
  width: 80%;
}
#tikkeri .tikkeriBoxi .tblTiedot .spnMallitarkenne {
  font-size: 0.9em;
}
#tikkeri .tikkeriBoxi .tblTiedot .tdVuosiKm {
  font-size: 1.1em;
}
#tikkeri .tikkeriBoxi .tblTiedot .tdHinta {
  font-size: 1.7em;
  vertical-align: middle;
}


@media (max-width: 767px) {
  #containerNavi {
    float: none;
  }
  
  #footer {
    height: auto;
  }
  
  #footerMiddle {
    height: auto;
  }
}