/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */


/* =============================================================================
   HTML5 element display
   ========================================================================== */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, address { display: block; }
audio[controls], canvas, video { display: inline-block; *display: inline; *zoom: 1; }


/* =============================================================================
   Base
   ========================================================================== */

/*
 * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
 *    http://clagnut.com/blog/348/#c790
 * 2. Force vertical scrollbar in non-IE
 * 3. Remove Android and iOS tap highlight color to prevent entire container being highlighted
 *    www.yuiblog.com/blog/2010/10/01/quick-tip-customizing-the-mobile-safari-tap-highlight-color/
 * 4. Prevent iOS text size adjust on device orientation change, without disabling user zoom
 *    www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/
 */

html { font-size: 100%; /*overflow-y: scroll;*/ -webkit-overflow-scrolling: touch; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

body { margin: 0; font-size: 13px; line-height: 1.231; }

body, button, input, select, textarea { font-family: sans-serif; color: #222; }

/* 
 * These selection declarations have to be separate
 * No text-shadow: twitter.com/miketaylr/status/12228805301
 * Also: hot pink!
 */

/* ::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
::selection { background: #fe57a1; color: #fff; text-shadow: none; } */


/* =============================================================================
   Links
   ========================================================================== */

a { color: #6eb409; }
/* a:visited { color: #551a8b; }
a:focus { outline: thin dotted; } */

/* Improve readability when focused and hovered in all browsers: people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active { outline: 0; }


/* =============================================================================
   Typography
   ========================================================================== */

abbr[title] { border-bottom: 1px dotted; }

b, strong { font-weight: bold; }

blockquote { margin: 1em 40px; }

dfn { font-style: italic; }

hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }

ins { background: #ff9; color: #000; text-decoration: none; }

mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }

/* Redeclare monospace font family: en.wikipedia.org/wiki/User:Davidgothberg/Test59 */
pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }

/* Improve readability of pre-formatted text in all browsers */
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }

q { quotes: none; }
q:before, q:after { content: ""; content: none; }

small { font-size: 85%; }

/* Position subscript and superscript content without affecting line-height: gist.github.com/413930 */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }


/* =============================================================================
   Lists
   ========================================================================== */

ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; margin: 0; padding: 0; }


/* =============================================================================
   Embedded content
   ========================================================================== */

/*
 * Improve image quality when scaled in IE7
 * code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/
 */

img { border: 0; -ms-interpolation-mode: bicubic; }

/*
 * Correct overflow displayed oddly in IE9 
 */

svg:not(:root) {
    overflow: hidden;
}


/* =============================================================================
   Figures
   ========================================================================== */

figure { margin: 0; }


/* =============================================================================
   Forms
   ========================================================================== */

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }

/* 
 * 1. Correct color not inheriting in IE6/7/8/9 
 * 2. Correct alignment displayed oddly in IE6/7 
 */

legend { border: 0; *margin-left: -7px; padding: 0; }

/* Indicate that 'label' will shift focus to the associated form element */
label { cursor: pointer; }

/*
 * 1. Correct font-size not inheriting in all browsers
 * 2. Remove margins in FF3/4 S5 Chrome
 * 3. Define consistent vertical alignment display in all browsers
 */

button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }

/*
 * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
 * 2. Correct inner spacing displayed oddly in IE6/7
 */

button, input { line-height: normal; *overflow: visible; }

/*
 * 1. Display hand cursor for clickable form elements
 * 2. Allow styling of clickable form elements in iOS
 */

button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }

/*
 * Consistent box sizing and appearance
 */

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
input[type="search"] { -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }

/* 
 * Remove inner padding and border in FF3/4
 * www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/ 
 */

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

/* Remove default vertical scrollbar in IE6/7/8/9 */
textarea { overflow: auto; vertical-align: top; }

/* Colors for form validity */
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }


/* =============================================================================
   Tables
   ========================================================================== */

table { border-collapse: collapse; border-spacing: 0; }
address { font-style: normal; }

/* =============================================================================
   Primary styles
   Author: 
   ========================================================================== */

/* Text align, float
------------------------------ */

.f_left    { float:left !important;}
.f_right   { float:right !important; }
 
.a_left     { text-align:left; }
.a_right    { text-align:right; }
.a_center   { text-align:center; }
.a_justify  { text-align:justify; }
 
.v_top     { vertical-align:top; }
.v_middle     { vertical-align:middle; }
.v_bottom     { vertical-align:bottom; }


/*	Display
------------------------------ */

.b_top { border-top: 1px solid #e6e6e6;}
.b_bottom {	border-bottom: 1px solid #e6e6e6;}

/*	Columns
------------------------------ */
.w_5 { width: 5%; }
.w_10 { width: 10%; }
.w_15 { width: 15%; }
.w_20 { width: 20%; }
.w_25 { width: 25%; }
.w_30 { width: 30%; }
.w_35 { width: 35%; }
.w_40 { width: 40%; }
.w_45 { width: 45%; }
.w_50 { width: 50%; }
.w_55 { width: 55%; }
.w_60 { width: 60%; }
.w_65 { width: 65%; }
.w_70 { width: 70%; }
.w_75 { width: 75%; }
.w_80 { width: 80%; }
.w_85 { width: 85%; }
.w_90 { width: 90%; }
.w_95 { width: 95%; }
.w_100 { width: 100%; }

.w_33 { width: 33%; }
.w_66 { width: 66%; }

.w_38 { width: 38%; }
.w_62 { width: 62%; }

.w_300px { width: 300px; }
.w_492px { width: 492px; }

/* Typografy
------------------------------ */
h1 {
	font-size:		20px;
	color:			#6eb409;
	font-weight:	normal;
	margin:			0 0 0.5em;
	vertical-align:		middle;
}
	h1 img {
		vertical-align:		middle;
	}
h2 {
	font-size:		18px;
	color:			#6eb409;
	font-weight:	normal;
	margin:			0 0 0.5em;
}
h3 {
	font-size:		16px;
	color:			#6eb409;
	font-weight:	normal;
	margin:			0;
}
h4 {
	font-size:		14px;
	color:			#6eb409;
	font-weight:	normal;
	margin:			0;
}

p {
	margin:			0;
	padding:		0 0 1.25em;
}

.bold          { font-weight:bold; }
.italic        { font-style:italic; }
.underline     { border-bottom:1px solid; }
.highlight     { background:#ffc; }
.uppercase     { text-transform:uppercase; }

.white 	{ color:white; }
.black 	{ color:black; }
.red, .error, .required  { color:red !important; }
.green  { color:#6EB409; }
.cyan  { color:#00bbee; }
.gray  { color:#666; }

.fs_10 {
	font-size: 				10px;
    line-height: 			1.25em;
}
.fs_15 {
	font-size: 				15px;
    line-height: 			1.25em;
}
.fs_22 {
	font-size: 				22px;
    line-height: 			1.25em;
}
.bg_black {
	background-color: 		#000;
}
.bg_darkviolet {
	background-color: 		#8b04e0;
}
.bg_forestgreen {
	background-color: 		#558a07;
}
.bg_olivedrab {
	background-color: 		#7cad36;
}
.bg_yellowgreen {
	background-color: 		#91d929;
}
.bg_red {
	background-color: 		#ff0000;
}

.inf {
	border-left:			4px solid #dcedc9;
	background:				#f5fbef;
	padding:				1em;
	margin-bottom:			1.25em;
}

.attention {
	background-image:		url(images/product_attention.png);
	background-position:	10px 50%;
	background-repeat:		no-repeat;
	padding-left:			60px;
	min-height: 			25px;
}

.btn {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #ffffff;
	display: inline-block;
	padding: 5px 17px;
	background: #bd071a;
	background: -moz-linear-gradient(
		top,
		#fc051a 0%,
		#7d0015);
	background: -webkit-gradient(
		linear, left top, left bottom, 
		from(#fc051a),
		to(#7d0015));
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	border: 0px solid #000000;
	-moz-box-shadow:
		0px 1px 3px rgba(089,089,089,0.5),
		inset 0px 0px 1px rgba(255,255,255,0.3);
	-webkit-box-shadow:
		0px 1px 3px rgba(089,089,089,0.5),
		inset 0px 0px 1px rgba(255,255,255,0.3);
	text-shadow:
		0px -1px 0px rgba(000,000,000,0.4),
		0px 1px 0px rgba(255,255,255,0.3);
	text-decoration: none;
	border:1px solid #d83526;
}
.btn.btn-success {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #7FC024), color-stop(1, #5C8C15) );
	background:-moz-linear-gradient( center top, #7FC024 5%, #5C8C15 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#7FC024', endColorstr='#5C8C15');
	background-color:#7FC024;
	border:1px solid #268a16;
	-moz-box-shadow:inset 0px 1px 0px 0px #caefab;
	-webkit-box-shadow:inset 0px 1px 0px 0px #caefab;
	box-shadow:inset 0px 1px 0px 0px #caefab;
}

.btn2 {
	font-size: 11px;
	color: #ffffff;
	padding: 5px 12px;
	text-decoration: none;
	background: -moz-linear-gradient(
		top,
		#e03c00 0%,
		#de3400 50%,
		#ce1800 51%,
		#d01c00);
	background: -webkit-gradient(
		linear, left top, left bottom, 
		from(#e03c00),
		color-stop(0.50, #de3400),
		color-stop(0.51, #ce1800),
		to(#d01c00));
	-moz-border-radius: 30px;
	-webkit-border-radius: 30px;
	border-radius: 30px;
	border: 3px solid #ffffff;
	-moz-box-shadow:
		0px 0px 2px rgba(000,000,000,0.5);
	-webkit-box-shadow:
		0px 0px 2px rgba(000,000,000,0.5);
	box-shadow:
		0px 0px 2px rgba(000,000,000,0.5);
	text-shadow:
		0px 0px 4px rgba(000,000,000,0.4),
		0px 1px 0px rgba(255,255,255,0.3);
}
.btn2.blue {
	background: -moz-linear-gradient(
		top,
		#0ca6cc 0%,
		#0ca6cc 50%,
		#0090b0 51%,
		#0090b0);
	background: -webkit-gradient(
		linear, left top, left bottom, 
		from(#0ca6cc),
		color-stop(0.50, #0ca6cc),
		color-stop(0.51, #0090b0),
		to(#0090b0));
}
.btn2.blue:hover {
	background: -moz-linear-gradient(
		top,
		#20b4d9 0%,
		#20b4d9 50%,
		#19a3c2 51%,
		#19a3c2);
	background: -webkit-gradient(
		linear, left top, left bottom, 
		from(#20b4d9),
		color-stop(0.50, #20b4d9),
		color-stop(0.51, #19a3c2),
		to(#19a3c2));
}
.btn3 {
	display: inline-block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #ffffff;
	padding: 5px 17px;
	background: #bd071a;
	background: -moz-linear-gradient(
		top,
		#fc051a 0%,
		#7d0015);
	background: -webkit-gradient(
		linear, left top, left bottom, 
		from(#fc051a),
		to(#7d0015));
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	border: 0px solid #000000;
	-moz-box-shadow:
		0px 1px 3px rgba(089,089,089,0.5),
		inset 0px 0px 1px rgba(255,255,255,0.3);
	-webkit-box-shadow:
		0px 1px 3px rgba(089,089,089,0.5),
		inset 0px 0px 1px rgba(255,255,255,0.3);
	text-shadow:
		0px -1px 0px rgba(000,000,000,0.4),
		0px 1px 0px rgba(255,255,255,0.3);
	text-decoration: none;
}
ul.inline { 
	padding: 0; 
	margin: 0; 
	list-style: none;
}
	ul.inline li { 
		/*padding: 0; */
		/*margin: 0; */
		display: inline-block;
	}
