/*
This shared-style CSS file is for CSS utilized by both the Public and Practitioner side.  Blocks that go on both sides can then utilize the CSS stored in this location.
Created by Lee Curran
10/12/2017 (edits and updates are not tracked)
*/

/*

 __          ______    _____           _ _       
 \ \        / /___ \  |  __ \         | (_)      
  \ \  /\  / /  __) | | |__) |__ _  __| |_  ___  
   \ \/  \/ /  |__ <  |  _  // _` |/ _` | |/ _ \ 
    \  /\  /   ___) | | | \ \ (_| | (_| | | (_) |
     \/  \/   |____/  |_|  \_\__,_|\__,_|_|\___/ 
https://www.w3.org/TR/2016/WD-wai-aria-practices-1.1-20160317/examples/radio/css/radio.css                                                 
Accessibility CSS for Radio Buttons (Accessed 10/25/2018)                                                 
*/
[role=radio] {
  display: block;
  position: relative;
  margin: 0.5em;
  padding-left: 20px;
  border: thin transparent solid;
}

/* This creates the visuals for the radio buttons */
[role=radio]::before,
[role=radio]::after {
  display: block;
  position: absolute;
  border-radius: 50%;
  content: '';
}

[role=radio]::before {
  top: 0;
  left: 0;
  width: 14px;
  height: 14px;
  border: 1px solid #000;
  background: #fff;
}

[role=radio][aria-checked=true]::after {
  top: 3px;
  left: 3px;
  border: 5px solid #000;
  content: '';
}

#codeex{
  background-color: #F1F1F1 ;
  padding:10px;
}

/*
   _____          _                     _____ _                         
  / ____|        | |                   / ____| |                        
 | |    _   _ ___| |_ ___  _ __ ___   | |    | | __ _ ___ ___  ___  ___ 
 | |   | | | / __| __/ _ \| '_ ` _ \  | |    | |/ _` / __/ __|/ _ \/ __|
 | |___| |_| \__ \ || (_) | | | | | | | |____| | (_| \__ \__ \  __/\__ \
  \_____\__,_|___/\__\___/|_| |_| |_|  \_____|_|\__,_|___/___/\___||___/
*/

.quiz {
    display: none;
    font-weight: bold;
    color: #008000;
}

.quizWrong {
    display: none;
    font-weight: bold;
    color: #FF0000;
}

.quiz-radio-input {
    padding-left: 10px;
}

fieldset.quiz-border {
    border: 2px solid #427E7F;
}

[data-toggle-target]{
  display: none;
}

.fast-facts-button {
    width: 100%;
    padding: 6px;
    border: 2px solid #427E7F;
}

.fast-facts-h3 {
    margin-bottom: 0;
}

.data-toggle-div {
    border-left: 2px solid #427E7F;
    border-right: 2px solid #427E7F;
    border-bottom: 2px solid #427E7F;
    padding: 6px;
}

.data-toggle-div p{
    font-size: 1.2em;
}

.narrow-p {
    margin-bottom: 2px;
}

.center-image {
    display: block;
    margin-left: auto !important;
    margin-right: auto !important;
}

hr.site-green-hr { 
    display: block;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    margin-left: auto;
    margin-right: auto;
    border-style: inset;
    border-width: 1px;
    color: #427E7F;
    background-color: #427E7F;
    border-color: #427E7F;
} 

.top-bottom-spacer {
    padding-top: 5px;   
    padding-bottom: 5px;
}

.show-hidden-with-links {
    display: inline;
}

.inLineHeader {
    text-align: right;
}

.inLineNum {
    padding-right: 0px;
    padding-left: 5px;
}

.rightAlign {
    text-align: right;
}

.leftAlign {
    text-align: left;
}

.centerAlign {
    text-align: center;
}

.select-formatting.line-padding {
    line-height: normal;
    padding: 0px 6px;
}

.select-formatting.line-padding.tall-select {
   -webkit-appearance: menulist-button;
   height: 50px;
   margin-bottom: 10px;
   border-radius: 8px;
   border: solid 3px #427E7F;
   background-color: #427E7F;
   color: #FFFFFF;
   font-size:1.2em;
}

a:hover > .image-link-button {
    /*outline: 3px solid #008fb6; */ /*Light Blue*/ /*#003471;*/
    /*outline-offset: -3px;*/
    outline: 0px;
    box-shadow: 0 0 3pt 2pt #008fb6 !important; /*Light Blue*/ /*#003471;*/
}

a:focus > .image-link-button  {
    outline: 0px;
    box-shadow: 0 0 3pt 2pt #003471 !important; /*Dark Blue*/
}

.padded-row{    
    padding-top: 25px;
    padding-bottom: 25px;
}

.neg-marg {
   margin-left: -30px !important;
   margin-right: -30px !important;
}

.mar-5 {
    margin: 10px 0px 0px 0px !important;
}
    
.warn-user {
    border:  3px solid orange;
}

.orange-highlight {
    background-color: orange !important;
    color: white !important;
}

@media (max-width: 767px){
	.block-small-screen {
		display:block !important;
	}
}

/*

  _______    _     _           
 |__   __|  | |   | |          
    | | __ _| |__ | | ___  ___ 
    | |/ _` | '_ \| |/ _ \/ __|
    | | (_| | |_) | |  __/\__ \
    |_|\__,_|_.__/|_|\___||___/
Table CSS for both Wilderness and Wilderness Practitioner
*/

/*For displaying rows of data with alternating colors (resultRow adds padding)*/
.oddRow {
    /*background-color: #ededed;/* UM changed it so that it now covers up this color -> #F5F5F5;*/*/
    background: -webkit-gradient(linear,left top,right top,color-stop(69%,rgba(0,0,0,0)),color-stop(87%,rgba(0,0,0,0)),color-stop(100%,rgba(0,0,0,.04)));
    background: -webkit-linear-gradient(left,rgba(0,0,0,0) 69%,rgba(0,0,0,0) 87%,rgba(0,0,0,.04) 100%);
    background: -o-linear-gradient(left,rgba(0,0,0,0) 69%,rgba(0,0,0,0) 87%,rgba(0,0,0,.04) 100%);
    background: -ms-linear-gradient(left,rgba(0,0,0,0) 69%,rgba(0,0,0,0) 87%,rgba(0,0,0,.04) 100%);
    background: linear-gradient(to right,rgba(0,0,0,0) 69%,rgba(0,0,0,0) 87%,rgba(0,0,0,.04) 100%);
}

.evenRow {
    /*background-color: #F5FFFF; /*Main Page Background #427E7F (lightened 70%)*/*/
    background: -webkit-linear-gradient(left,#F5FFFF,#ecf2f2); /* Safari 5.1 to 6.0 */
    background: -o-linear-gradient(left,#F5FFFF,#ecf2f2); /* Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(left,#F5FFFF,#ecf2f2); /* Firefox 3.6 to 15 */
    background: linear-gradient(to right,#F5FFFF,#ecf2f2); /* Standard syntax (must be last) */
}

.evenRow-no-gradient {
    background: #ecf2f2;
}

.oddRow-no-gradient {
    background: #DCDCDC;
}

#summary-report-table tr:nth-child(even) {
	/*background-color: #F5FFFF; /*Main Page Background #427E7F (lightened 70%)*/*/
    background: -webkit-linear-gradient(left,#F5FFFF,#ecf2f2); /* Safari 5.1 to 6.0 */
    background: -o-linear-gradient(left,#F5FFFF,#ecf2f2); /* Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(left,#F5FFFF,#ecf2f2); /* Firefox 3.6 to 15 */
    background: linear-gradient(to right,#F5FFFF,#ecf2f2); /* Standard syntax (must be last) */
}

#summary-report-table tr:nth-child(odd) {
    /*background-color: #ededed;/* UM changed it so that it now covers up this color -> #F5F5F5;*/*/
    background: -webkit-gradient(linear,left top,right top,color-stop(69%,rgba(0,0,0,0)),color-stop(87%,rgba(0,0,0,0)),color-stop(100%,rgba(0,0,0,.04)));
    background: -webkit-linear-gradient(left,rgba(0,0,0,0) 69%,rgba(0,0,0,0) 87%,rgba(0,0,0,.04) 100%);
    background: -o-linear-gradient(left,rgba(0,0,0,0) 69%,rgba(0,0,0,0) 87%,rgba(0,0,0,.04) 100%);
    background: -ms-linear-gradient(left,rgba(0,0,0,0) 69%,rgba(0,0,0,0) 87%,rgba(0,0,0,.04) 100%);
    background: linear-gradient(to right,rgba(0,0,0,0) 69%,rgba(0,0,0,0) 87%,rgba(0,0,0,.04) 100%);
}

#summary-report-table th {
	background-color: #427E7F !important;
	color: #FFFFFF;
}

table#summary-report-table {
	display: block;
    overflow-x: auto;
}

.sortable-table-title {
	max-width:70%;
	float:left;
	display:inline-block;
}

.sortable-table-toggle {
	max-width:30%;
	display:inline-block;
	padding-left:5px;
	padding-right:5px;
}

.summary-header-small {
	min-width:117px;
	max-width:130px;
}

@media (max-width: 700px){
	.summary-header-medium {
		min-width:130px;
		max-width:150px;
	}

	.summary-header-large {
		min-width:150px;
		max-width:170px;
	}
}

.col-header-summary {
	float:left;
	display:inline-block;
	padding-right:20px;
}

/*
   ____                      _     _           
  / __ \                    (_)   | |          
 | |  | |_   _____ _ __ _ __ _  __| | ___  ___ 
 | |  | \ \ / / _ \ '__| '__| |/ _` |/ _ \/ __|
 | |__| |\ V /  __/ |  | |  | | (_| |  __/\__ \
  \____/  \_/ \___|_|  |_|  |_|\__,_|\___||___/

override the um-template (non-media)
The NavBar has it's own section under NavBar*/

/*Warning: only override this values if the default color schemes (browser based) need to be changed*/
/*:link:focus, :visited:focus, :focus {
}*/

.site_container.container.container-normal {
	min-width:320px;
}

.center-dot:before { /* W3 aria CSS for radio buttons dot is offset because of logic from um-template.  This corrects that issue.*/
    box-sizing:initial;
}

/*
  _____                              _      _ _                          
 |_   _|                            | |    (_) |                         
   | |  _ __ ___   __ _  __ _  ___  | |     _| |__  _ __ __ _ _ __ _   _ 
   | | | '_ ` _ \ / _` |/ _` |/ _ \ | |    | | '_ \| '__/ _` | '__| | | |
  _| |_| | | | | | (_| | (_| |  __/ | |____| | |_) | | | (_| | |  | |_| |
 |_____|_| |_| |_|\__,_|\__, |\___| |______|_|_.__/|_|  \__,_|_|   \__, |
                         __/ |                                      __/ |
                        |___/                                      |___/ 
*/

@media (min-width: 992px) {
	.image-library-image-adjustments {
		max-height: 600px;
	}
}

@media (max-width: 991px) {
	.image-library-image-adjustments {
		max-height: 400px;
	}
}

.image-library-image-adjustments {
	border: 1px solid black;
}

/*
  __  __           _       _ 
 |  \/  |         | |     | |
 | \  / | ___   __| | __ _| |
 | |\/| |/ _ \ / _` |/ _` | |
 | |  | | (_) | (_| | (_| | |
 |_|  |_|\___/ \__,_|\__,_|_|
*/

/* The Modal (background) 
Based on (an copied from) https://www.w3schools.com/howto/howto_css_modals.asp accessed 6/30/2017
Note: If JQuery gets updated on Cascade CMS the modal functionality should be returned to Bootstrap.
*/
.simple-modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 3; /* Sit on top - has to be above the select box for small screens*/
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.simple-modal-content {
    background-color: #fefefe;
    margin: 15% auto; /* 15% from the top and centered */
    padding: 0 42px 20px 42px; /*Left and Right are plus 22 to match um-templates extra 22 to bottom which matches the extra space from the X (close) row*/
    border: 1px solid #888;
    border-radius: 8px;
    width: 80%; /* Could be more or less, depending on screen size */
    text-align: left;
    min-width: 250px;
}

.simple-modal-content p {
    font-size: 1.2em;
}

a.popup-modal {
    font-size: 1.3em;
}

/* The Close Button */
.close-modal {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close-modal:hover,
.close-modal:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.modal-scroll-lock {
    overflow-y: hidden; /*Used to prevent the screen from scrolling when a modal view is open.*/
}