body {
    padding-top: 25px;
	/* background-image: url('img/the-hermit.png') */
}

html, body, #aod-hip-container {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    padding-top: 25px;
}

.aod-read-about {
    background-color: lightgoldenrodyellow;
}

.starter-template {
	/* padding: 20px 15px; */
	padding: 20px 15px;
	text-align: left;
}

.panel-primary {
	/* border-color: #080808; */
}

.panel-primary>.panel-heading {
	/* background-color: #FAE3C2; */
	border-color: #080808;
}

.bs-callout {
	padding: 10px;
	margin: 10px 0;
	border: 1px solid #eee;
	border-left-width: 5px;
	border-radius: 3px;
}

.bs-testcontrol-container {
	padding: 10px;
	margin: 10px 0;
	/*
	border: 1px solid #eee;
	border-left-width: 5px;
	border-radius: 3px;
	*/
}

.bs-callout h4 {
	margin-top: 0;
	margin-bottom: 5px;
}

.bs-callout p:last-child { margin-bottom: 0; }
.bs-callout code { border-radius: 3px; }
.bs-callout+.bs-callout { margin-top: -5px; }
.bs-callout-default { border-left-color: #777; }
.bs-callout-default h4 { color: #777; }
.bs-callout-primary { border-left-color: #428bca; }
.bs-callout-primary h4 { color: #428bca; }
.bs-callout-success { border-left-color: #5cb85c; }
.bs-callout-success h4 { color: #5cb85c; }
.bs-callout-danger { border-left-color: #d9534f; }
.bs-callout-danger h4 { color: #d9534f; }

.bs-callout-scripted {
	border-left-color: #668C43;
	/* background-color: #FAE3C2; */
	background-color: #E1FFD1;
}

.bs-callout-scripted h4 { color: #668C43; }

.bs-callout-action {
	border-left-color: #f0ad4e;
	background-color: #FCEED9;
}

.bs-callout-action h4 { color: #f0ad4e; }

.bs-callout-observe {
	border-left-color: #A26769;
	background-color: #EDCEC7;
}

.bs-callout-observe h4 { color: #A26769; }

/* not sure what this one is used for */
.panel-branded { background-color: #EDE1D0; }
.panel-info { border: 1px solid #eee; }

/*
 * done to keep the panel header white if wrapped in a link
 */
a.panel-header-link:active, a.panel-header-link:link, a.panel-header-link:hover {
	text-decoration:none;
	color:#D6CFCD;
}

/* D6CFCD */
.jumbotron-hip {
	padding: 4rem 2rem;
	margin-top: 2rem;
	margin-bottom: 2rem;
	background-color: white;
	color: #23384F;
	border-radius: .3rem;	
}

.panel-heading {background-color: #23384F!important}
.panel-heading {border-color: #23384F!important}
.panel-info {
    margin-top: 15px ;
    border-color: #23384F!important ; 
}
.panel-info .panel-heading  {color: #D6CFCD!important}

.btn-default.active {
	background-color: #286090;
	color: white;
}
.btn-default.over {
	background-color: limegreen;
}

.dropdown-submenu {
	position: relative;
}

.dropdown-submenu>.dropdown-menu {
	top: 0;
	left: 100%;
	margin-top: -6px;
	margin-left: -1px;
	-webkit-border-radius: 0 6px 6px 6px;
	-moz-border-radius: 0 6px 6px;
	border-radius: 0 6px 6px 6px;
}

.dropdown-submenu:hover>.dropdown-menu {
	display: block;
}

.dropdown-submenu>a:after {
	display: block;
	content: " ";
	float: right;
	width: 0;
	height: 0;
	border-color: transparent;
	border-style: solid;
	border-width: 5px 0 5px 5px;
	border-left-color: #ccc;
	margin-top: 5px;
	margin-right: -10px;
}

.dropdown-submenu:hover>a:after {
    border-left-color: #fff;
}

.dropdown-submenu.pull-left {
    /* float: none; */
}

.dropdown-submenu.pull-left>.dropdown-menu {
    left: -100%;
    margin-left: 10px;
    -webkit-border-radius: 6px 0 6px 6px;
    -moz-border-radius: 6px 0 6px 6px;
    border-radius: 6px 0 6px 6px;
}
.my-helpicon {
	margin-left: 5px; 
    font-size: 20px;
	color: #337ab7;
	cursor: pointer;
}

.my-margin {
    margin-left: 5px;
    top: 5px;
}
/* this is for the scoring radio buttons */
.upgaze-label {
	font-size: 170%;
	vertical-align: middle;
	margin-left: 0px;
	margin: 0px;
	padding: 0px;
}

[type='radio'] {
	display: none; 
}

p.ers-prescore {
	font-size: +30px;
}

.sal-timer-table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 20px;
}

/* BEGIN NAVBAR CUSTOM
REMOVE IF NOT NEEDED */

/* navbar */
.navbar-default {
    background-color: #F8F8F8;
    border-color: #E7E7E7;
}
/* Title */
.navbar-default .navbar-brand {
    color: #777;
}
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
    color: #5E5E5E;
}
/* Link */
.navbar-default .navbar-nav > li > a {
    color: #777;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    color: #333;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
    color: #555;
    background-color: #E7E7E7;
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
    color: #555;
    background-color: #D5D5D5;
}
/* Caret */
.navbar-default .navbar-nav > .dropdown > a .caret {
    border-top-color: #777;
    border-bottom-color: #777;
}
.navbar-default .navbar-nav > .dropdown > a:hover .caret,
.navbar-default .navbar-nav > .dropdown > a:focus .caret {
    border-top-color: #333;
    border-bottom-color: #333;
}
.navbar-default .navbar-nav > .open > a .caret,
.navbar-default .navbar-nav > .open > a:hover .caret,
.navbar-default .navbar-nav > .open > a:focus .caret {
    border-top-color: #555;
    border-bottom-color: #555;
}
/* Mobile version */
.navbar-default .navbar-toggle {
    border-color: #DDD;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
    background-color: #DDD;
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #CCC;
}
@media (max-width: 767px) {
    .navbar-default .navbar-nav .open .dropdown-menu > li > a {
        color: #777;
    }
    .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
    .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
          color: #333;
    }
}

/* END NAVBAR CUSTOM
REMOVE IF NOT NEEDED */

/**
 * iPhone screen landscape
 **/
@media (max-width: 768px) {

	.starter-template {
		padding: 0px 0px;
	}

	.alertify-message { font-size: 16px; }
	.alertify-log { font-size: 16px; }

	.bs-callout-action { font-size: +16px; }
	.bs-callout-scripted { font-size: +16px; }
	.btn { font-size: +16px; }
	.control-label { font-size: 16px; }
	.form-control { font-size: 16px; }
	.form-control-static { font-size: 16px; }
	.checkbox-inline { font-size: 16px;}
	.hip-form-message { font-size: 16px; }
	.panel-title { font-size: +18px; }
	.table-condensed { font-size: 16px; }

	.panel-info {
		margin-bottom: 0px;
		border-radius: 0px;
	}

	.panel-info .panel-heading {
		margin-bottom: 0px;
		border-radius: 0px;
		padding-top: 20px;
	}

	.dropdown-submenu {
		font-size: +17px;
	}

	.dropdown-submenu>.dropdown-menu {
		font-size: +17px;
	}
	.navbar {
		font-size: +17px;
	}

	ul {
		font-size: +17px;
	}

	.my-helpicon {

		font-size: 24px;
		color: #337ab7;

	}
}

/**
 * iPhone screen portrait
 **/
@media (max-width: 480px) {
    
    h4 {
        font-size: 20px;
    }
    
    .label {
        font-size: 65%;
    }
    
    .badge {
        font-size: 14px;
    }
    
    .container {
        font-size: 17px;
    }
    
    .modal-body {
        font-size: 17px;
    }

	.media-body {
		float: left;
		max-width: 480px;
		display: table;
	}

	.media-body > p {
		width: 350px;
		margin-bottom: 0px;
	}

	.btn-hipwide {
		display: block;
		width: 100%;
		margin-bottom: 10px;
	}

	.my-helpicon {

		font-size: 24px;
		color: #337ab7;

	}
}
