/* YOU CAN FIND THE HOMEPAGE STYLING WITHIN THE HOMEPAGE STYLESHEET  - /assets/css/homepage.css*/


/* Box Model */
#road_quiz .box{ border: 1px solid #dbe9f5; position:relative; background:#b5d433 url("/assets/images/core/box_bg.gif") repeat-x left bottom; padding: 6px; margin: 0 0 15px; }
#road_quiz .box .inner{ padding: 10px; border: 2px solid #d1e1f1; border-width: 2px 0 0; position: relative; }
/* Box Title styling */
#road_quiz .box h2{ font-size: 1.1em; font-weight:bold; padding: 0; margin:0 0 5px; }

/* Default list styling */
#road_quiz .box ul{ list-style-type:none; margin:0; padding:0; }
#road_quiz .box li{ width:100%; margin:0; padding:0; border: 2px solid #ecf3fa; border-width: 0 0 3px; }
#road_quiz .box li a{ display: block; padding: 8px 0 4px; }
#road_quiz .box li a:hover{ color:#295B9B; text-decoration:none;}
#road_quiz .box li a.selected{ color:#0200bf; text-decoration:underline; }

/* ---------------------------------------------------------------------------------------------------------------------------------
	3) BUTTONS
/* --------------------------------------------------------------------------------------------------------------------------------- */
/* DEFAULT BUTTONS */
a.button_new						{ display:block; margin-left: 40px !important; position: relative; color:#fff; text-align:center; padding:0 22px 0 5px; width:90px; height: 22px; line-height:22px; font-size:1.1em; font-weight:bold; background: #418ac9 url("buttons.gif") no-repeat left 0; }
a.button_new span					{ width: 20px; height:100%; background: url("buttons.gif") no-repeat right 0; position:absolute; right:-3px; top:0; }
a:hover.button_new				{ background: #317ab8 url("buttons.gif") no-repeat left -22px; text-decoration:none; }
a:hover.button_new span			{  background: url("buttons.gif") no-repeat right -22px; height:22px; }

a.blue_large					{ background-position: left -176px; background-color:#418ac9; text-align:center; margin:10px 0 0; width:100px; height: 29px; line-height:29px; font-size:1.2em; }
a.blue_large span				{ background-position: right -176px; width: 25px; height:29px !important; }
a:hover.blue_large				{ background-position: left -205px;  }
a:hover.blue_large span			{ background-position: right -205px; }


.question a.button_new{ background: url("buttons2.gif") no-repeat top left !important; line-height: 32px; text-align:center; height: 32px; padding-right: 5px; }
.question a.button_new span{ width: 5px; margin-right:0; background: url("buttons2.gif") no-repeat top right !important; right:0; height: 32px !important; }
.question a:hover.button_new{ background-position: left -32px !important; }
.question a:hover.button_new span{ background-position: right -32px !important; }

.current_score a.button_new{ background: url("buttons2.gif") no-repeat left -71px !important; line-height: 32px !important; text-align:center; height: 32px; padding-right: 5px; font-size: 0.7em !important; margin-left: 10px; width: auto; color: #fff !important; text-indent:0; }
.current_score a.button_new span{ width: 5px; margin-right:0; background: url("buttons2.gif") no-repeat right -71px !important; right:0; height: 32px !important; }
.current_score a:hover.button_new{ background-position: left -103px !important; }
.current_score a:hover.button_new span{ background-position: right -103px !important; }


/* ------------------------------------------------------------------------
	Miscellaneous
  ------------------------------------------------------------------------- */

  .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
  .clearfix {display: inline-block;}

  /* Hides from IE-mac \*/
  * html .clearfix {height: 1%;}
  .clearfix {display: block;}
  /* End hide from IE-mac */


  #road_quiz{ background: #fff; }
  #road_quiz .question_container{ position: relative; width:100%; }
  #road_quiz #centre .question_container .inner{ padding-bottom:0; height: auto; }
  #road_quiz .question, .results{ background: #b5d433 url("box_sprite.gif") no-repeat top left; color: #000; width: 495px; border:0; padding-bottom: 10px; position:relative; padding-right: 15px; }
  #road_quiz .question h3, #road_quiz .results h3{ margin: 5px 0 !important; color: #004689; padding-top: 10px; font-size: 18px; font-weight: bold; line-height: 1.0em; height: 40px; letter-spacing:-0.02em; }
  #road_quiz .question ul{ margin: 5px 0 0 0 !important; padding: 5px 0 0 60px; }
  #road_quiz .question li{ background-image: none !important; margin: 0; font-size: 1.2em !important; width:100%;margin-bottom: 5px; border: 0; overflow:hidden; padding: 2px 5px !important; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; }
  #road_quiz .question label{ display: inline-block; float: left; width: 92%; }
  #road_quiz .question label:hover, #road_quiz .question input:hover{ cursor: pointer; }
  #road_quiz .question input{ border: none; float: left; margin: 1px 10px 0 0; width: 3%; }
  #road_quiz .results p{ font-size: 1.2em !important; }
  #road_quiz .question a.button, #road_quiz .results a.button{ font-size: 15px !important; width: 120px; }

  #road_quiz .question .inner{ float: left; width: 82%; border:0; padding:0; height: 1%; }
  #road_quiz .question .leftblock{ width: 16%; float: left; overflow:hidden; text-align: center; font-size: 3.8em; border:0; padding:0; margin:0; font-weight: bold; line-height: 1em; color: #004689; }
  #road_quiz .question .leftblock span{ display: block; font-size: 15px !important; margin-top: -15px; }

  #road_quiz .question .bottom{ height: 20px; position:absolute; bottom:0px; left:0; width: 100%; background: url("box_sprite.gif") no-repeat bottom left; }

  #road_quiz .question_error{ border-color:#cc0000 !important; background: #ffe7e7; color: #cc0000;}

  #road_quiz .current_score{ font-size: 1.5em; text-align:center; width: 130px; padding-right: 81px; height: 146px; background: url("your_score_bg.jpg") no-repeat top left; text-indent:-9000px; float: right; margin-left: 40px; }
  #road_quiz .current_score .score{ font-size: 3.5em; display: block; text-indent:0; color: #fff; font-weight: bold; letter-spacing: -0.05em; padding: 10px 0 0 0; opacity: 0.9; -filter-opacity: 90; -moz-opacity: 0.9; height: 63px; }

  #road_quiz .footer{ margin-top: 10px; padding: 0 5px; color: #296dbe; font-size: 1.1em; }

  #road_quiz #btnsharefbook{ color: #333333; font-weight: bold; font-size: 0.9em; vertical-align: middle; }
  #road_quiz .footer img{ display: inline; vertical-align:middle; margin-top: -4px; }

  #road_quiz .active{ background: #4d8fe3 !important; color: #fff;  }

  #road_quiz .results .inner_roadsafety{ width: auto; padding: 10px; }
  #road_quiz .results h2{ font-size: 20px; color: #004689; }
  #road_quiz .results h3{ height: auto; margin: 10px; }

  #road_quiz .box_roadsafety .normallist{ padding-left: 20px !important; }
  #road_quiz .box_roadsafety .normallist li{ font-size: 14px !important; background: url('bullet.gif') no-repeat 0 2px !important; padding-left: 25px !important; width: 88%;  }

  #road_quiz .bgr_right_nav{ height: auto; }
  #road_quiz .inner_left_picture{ float: right; width: 220px; }
  #road_quiz .pre_inner_right_info{ margin:0; }
  #road_quiz{ min-height: 510px; }

  #road_quiz .intro_copy{ margin: 15px 0; }

  #result_1 p, #result_2 p, #result_3 p{ margin: 10px 0; }

  .clear{ clear: both !important; float: none; line-height:0; height:0; font-size: 1px; }
