﻿/* 
Adapted from:
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/

div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 
	display:block;
}

nav ul {
	list-style:none;
}

blockquote, q {
	quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content:'';
	content:none;
}

a {
	margin:0;
	padding:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}

ins {
	background-color:#ff9;
	color:#000;
	text-decoration:none;
}

mark {
	background-color:#ff9;
	color:#000; 
	font-style:italic;
	font-weight:bold;
}

del {
	text-decoration: line-through;
}

abbr[title], dfn[title] {
	border-bottom:1px dotted;
	cursor:help;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}

hr {
	display:block;
	height:1px;
	border:0;   
	border-top:1px solid #cccccc;
	margin:1em 0;
	padding:0;
}

input, select {
	vertical-align:middle;
}

/* End HTML5 CSS reset */

body {
	font-family: sans-serif;
	font-size: 0.9em;
	line-height: 1.2;
	color: #303030;
	background-color: white;
	margin: 0;
	padding: 0;
}

a[href] {
	color: #3b73ae;
}

/* Header */

#header-wrapper {
	border-bottom: 3px solid #6dac39;
	background-color: #303030;
	color: white;
}

#header, #wrapper {
	position: relative;
}

#logo-link {
	text-decoration: none;
}

/* Menu */

.use-hover #menu > .combo-menu-item:hover, .use-hover #menu > .icon-menu-item:hover {
	background-color: #3f3f3f;
}

#menu > .combo-menu-item.selected, #menu > .icon-menu-item.selected {
	background-color: #3f3f3f;
}

#menu > #messages-menu-item {
	position: relative;
}

#menu > #messages-menu-item .badge {
	display: block;
	position: absolute;
	background-color: #6dac39;
	color: white;
	top: 50%;
	line-height: 1.2;
	padding: 0 0.25em;
	font-size: 0.8em;
	font-weight: bold;
}

/* Combo menu items */

#menu > .combo-menu-item {
	display: inline-block;
	line-height: 3.375em;
	height: 3.375em;
	text-decoration: none;
	color: white;
	padding: 0 0.9em 0 3em;
	position: relative;
	font-size: 1.111em;
}

#menu > .combo-menu-item > img {
	height: 1.063em;
	width: auto;
	position: absolute;
	left: 0.9em;
	top: 50%;
	margin-top: -0.575em;
}

#menu > .combo-menu-item#messages-menu-item {
	padding-left: 2.75em;
}

#menu > .combo-menu-item#messages-menu-item .badge {
	left: 1.8em;
}

#menu > .combo-menu-item#account-menu-item {
	padding-left: 2.6em;
}

#menu > .combo-menu-item#logout-menu-item, #menu > .combo-menu-item#login-menu-item {
	position: absolute;
	right: 0;
	top: 0;
	padding-left: 2.4em;
}

/* Icon menu items */

#menu .icon-menu-item .menu-item-text {
	display: none;
}

#menu > .icon-menu-item {
	display: inline-block;
	padding: 1.285em;
	margin: 0;
}

#menu > .icon-menu-item#messages-menu-item .badge {
	left: 2.5em;
}

/* Main content */

#wrapper {
	min-width: 16em;
	max-width: 35em;
	margin: 0 auto;
	padding: 0;
}

.title {
	font-size: 2em;
	font-weight: normal;
	padding: 0.75em 0 0 0;
	margin: 0 0 0.75em 0;
}

.secondary-title {
	font-size: 1.5em;
	font-weight: normal;
	color: #3a73ad;
	margin: 0.75em 0;
}

.loading-indicator {
	color: #3a73ad;
	margin: 1em 0;
	text-align: center;
	font-weight: bold;
}

.support-email-note {
	margin: 1em 0;
}

.support-email {
	font-weight: bold;
}

.standard-paragraph {
	margin: 1em 0;
}

/*
.online-status-indicated:before {
	content: ' ';
	background-color: #ccc;
	vertical-align: -0.15em;
	margin-right: 0.3em;
	display: inline-block;
	width: 0.8em;
	height: 0.8em;
	border-radius: 50%;
	border: 0.1em solid white;
}

.online-status-indicated.is-online:before {
	background-color: #70C045;
}
*/

/* Inputs and forms */

.standard-form {
	color: #888888;
}

.standard-form .form-item {
	margin: 1em 0;
	position: relative;
}

.standard-form .form-item label {
	display: block;
	margin: 0.5em 0;
}

.standard-form .form-item label.checkbox-label {
	display: inline;
	margin: 0;
}

.standard-form .required-fields-message, .standard-form .text-box.input-validation-error {
	font-size: 0.9em;
}

.standard-form .form-item.required label:after, .standard-form .required-field-indicator {
	color: #cc3433;
	font-weight: bold;
}

.standard-form .form-item.required label:after {
	content: ' *';
}

.standard-form .text-box.input-validation-error {
	border-color: #cc3433;
}

.standard-form .text-box.input-validation-error:focus {
	border-color: #cc3433;
}

.standard-form .field-validation-error {
	display: block;
	margin: 0.5em 0;
	color: #cc3433;
	font-size: 0.8em;
}

.standard-form button[type=submit], .standard-form input[type=submit] {
	margin: 1em 0;
}

.text-box {
	font-size: 1em;
	border: 1px solid #afafaf;
	padding: 0.75em 0.25em;
	margin: 0;
	outline: none;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
}

.text-box:focus {
	border-color: #6dac39;
}

/* Buttons */

.btn, .icon-btn, .combo-btn {
	background: none;
	padding: 0;
	margin: 0;
	border: none;
	font-size: 1em;
	text-decoration: none;
	cursor: pointer;
	display: inline-block;
}

.btn, a.btn[href], .icon-btn, a.icon-btn[href], .combo-btn, a.combo-btn[href] {
	color: white;
}

.btn[disabled], .icon-btn[disabled], .combo-btn[disabled] {
	opacity: 0.4;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
	cursor: default !important;
}

.icon-btn > img {
	width: auto;
	height: 1.95em;
	vertical-align: middle;
}

.icon-btn.small > img {
	width: 0.972em;
	height: 0.972em;
}

.combo-btn {
	background-color: #6dac39;
	font-weight: bold;
	line-height: 2.8em;
	height: 2.8em;
	padding: 0 1.4em 0 3.1em;
	position: relative;
}

.combo-btn > img {
	width: auto;
	height: 1.1em;
	position: absolute;
	left: 1.4em;
	top: 50%;
	margin-top: -0.55em;
}

.combo-btn.subtle {
	background-color: transparent;
	padding-left: 2.1em;
	height: 2em;
	line-height: 2em;
}

.combo-btn.subtle, a.combo-btn.subtle[href] {
	color: #3c73ac;
}

.combo-btn.subtle > img {
	left: 0.4em;
}

.message-input-row {
	position: relative;
	display: block;
	padding-right: 7.75em;
	margin: 0.75em 0;
}

.message-input-row .combo-btn {
	position: absolute;
	top: 0;
	right: 0;
}

/* Lists */

.list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.list > li {
	display: block;
	margin: 0;
	padding: 0;
	border-top: 1px solid #eaeaea;
	position: relative;
}

.use-hover .list > li:hover {
	background-color: #f7f7f7;
}

.list.item-actions > li {
	padding-right: 0;
}

.list > li:first-child {
	border-top: none;
}

.list > li > .list-item-content {
	display: block;
	text-decoration: none;
	color: inherit;
	padding: 0.5em 7em 0.5em 0.75em;
}

.list > li > .list-item-content > * {
	display: block;
	margin: 0.25em 0;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	color: #868686;
}

.list > li > .list-item-content > :first-child {
	font-size: 1.15em;
	color: inherit;
}

.list.item-actions > li > .list-item-action, .list.item-actions > li > .list-item-confirm-wrapper {
	position: absolute;
	top: 0.6em;
	right: 1.25em;
}

.list.item-actions > li > .list-item-action {
	display: block;
}

.use-hover .list.item-actions > li > .list-item-action {
	display: none;
}

.use-hover .list.item-actions > li:hover > .list-item-action {
	display: block;
}

.list.item-actions > li > .list-item-confirm-wrapper > .list-item-confirm, .list.item-actions > li > .list-item-confirm-wrapper > .list-item-cancel {
	line-height: 1.4em;
	height: 1.4em;
	color: white;
	display: inline-block;
	padding: 0 0.7em;
}

.list.item-actions > li > .list-item-confirm-wrapper > .list-item-confirm {
	background-color: #cc3433;
}

.list.item-actions > li > .list-item-confirm-wrapper > .list-item-cancel {
	background-color: #afafaf;
	margin-left: 0.25em;
}

/* List action confirm */

.list.item-actions > li > .list-item-confirm-wrapper {
	display: none;
}

.list.item-actions > li.confirm-action {
	background-color: #e3e3e3 !important;
	padding-right: 0;
}

.list.item-actions > li.confirm-action > .list-item-content {
	cursor: default;
	opacity: 0.5;
}

.list.item-actions > li.confirm-action > .list-item-action {
	display: none !important;
}

.list.item-actions > li.confirm-action > .list-item-confirm-wrapper {
	display: block;
}

/* Login */

#autologout-message {
	color: #cc3433;
}

#login-failed {
	color: #cc3433;
	margin: 0.5em 0;
}

.standard-form .form-item .agreement-label {
	display: inline;
	margin-left: 0.5em;
}

/*.add-contact {
	background-color: #3D6B99; 
	position: absolute;
	right: 0;
	top: 1.4em;
}*/

.text-box-success {
	border: #3D6B99 1px solid;
}

.success {
	color: #3D6B99;
	font-size: 0.8em;
	padding-left: 1em;
	padding-top: 0.5em;
}

/* Password strength */

.password-requirements {
	margin: 0.25em 0;
	font-size: 0.8em;
	display: block;
}

.password-strength {
	display: none;
	font-size: 0.8em;
	margin: 0.25em 0;
}

.password-strength.password-strength-fail,
.password-strength.password-strength-low,
.password-strength.password-strength-medium,
.password-strength.password-strength-high {
	display: block;
}

.password-strength .password-strength-text,
.password-strength .password-strength-bar {
	display: block;
}

.password-strength .password-strength-bar-background {
	display: block;
	background-color: #e3e3e3;
}

.password-strength .password-strength-bar {
	height: 1em;
}

.password-strength.password-strength-fail .password-strength-text {
	color: #cc3433;
}

.password-strength.password-strength-fail .password-strength-bar {
	background-color: transparent;
}

.password-strength.password-strength-low .password-strength-text {
	color: #cc3433;
}

.password-strength.password-strength-low .password-strength-bar {
	background-color: #cc3433;
	margin-right: 66%;
}

.password-strength.password-strength-medium .password-strength-text {
	color: #ff7900;
}

.password-strength.password-strength-medium .password-strength-bar {
	background-color: #ff7900;
	margin-right: 33%;
}

.password-strength.password-strength-high .password-strength-text {
	color: #6dac39;
}

.password-strength.password-strength-high .password-strength-bar {
	background-color: #6dac39;
	margin-right: 0;
}

/* Profile picture */

.profile-picture-wrapper {
	display: block;
	max-width: 64px;
	max-height: 64px;
	overflow: hidden;
	border: 2px solid #eaeaea;
}

/* Experimental CSS */

.alert {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
	background-color: #FCF8E3;
	border: 1px solid #FBEED5;
	color: #C09853;
	border-radius: 4px 4px 4px 4px;
	padding: 8px 35px 8px 14px;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}

.alert.success {
	background-color: #DFF0D8;
	border-color: #D6E9C6;
	color: #468847;
}

.alert.error {
	background-color: #F2DEDE;
	color: #B94A48;
	border-color: #EED3D7;
}

.alert.info {
	background-color: #D9EDF7;
	border-color: #BCE8F1;
	color: #3A87AD;
}

select.phone-type {
	height: 2.75em;
	font-size: 1em;
	vertical-align: middle;
	padding: 0.25em;
	padding-top: 0.6em;
}

.text-box.phone {
	width: 29.9em;   
}


.label {
	color: #FFFFFF;
	display: inline-block;
	font-size: 11.844px;
	font-weight: bold;
	line-height: 14px;
	padding: 2px 4px;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	vertical-align: baseline;
	white-space: nowrap;
}

.label.info
{
	background-color: #00719C; /* Replace with correct colors */
	color: #fff;
	padding: 0.1em;
}

.label.warn {
	background-color: #F89406; /* Replace with correct colors */
	color: #fff;
	padding: 0.1em;
}

.label.success {
	background-color: #468847;
}

#store-badge-container {
	margin-top: 60px;
}

#verification-failed-wrapper p,ul {
	margin-top: 1em;
}

#verification-failed-wrapper li {
	margin-left: 2em;
}
