/*
Temporary additions until the shared-style path is corrected

*/

/*
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)
*/

@media (min-width:993px){
	.footer-adjust {
		margin-left:-21px;
		margin-bottom:-10px;
	}
}

/*

 __          ______    _____           _ _       
 \ \        / /___ \  |  __ \         | (_)      
  \ \  /\  / /  __) | | |__) |__ _  __| |_  ___  
   \ \/  \/ /  |__ <  |  _  // _` |/ _` | |/ _ \ 
    \  /\  /   ___) | | | \ \ (_| | (_| | | (_) |
     \/  \/   |____/  |_|  \_\__,_|\__,_|_|\___/ 
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;
}

/*
   _____          _                     _____ _                         
  / ____|        | |                   / ____| |                        
 | |    _   _ ___| |_ ___  _ __ ___   | |    | | __ _ ___ ___  ___  ___ 
 | |   | | | / __| __/ _ \| '_ ` _ \  | |    | |/ _` / __/ __|/ _ \/ __|
 | |___| |_| \__ \ || (_) | | | | | | | |____| | (_| \__ \__ \  __/\__ \
  \_____\__,_|___/\__\___/|_| |_| |_|  \_____|_|\__,_|___/___/\___||___/
*/

.site-footer {
    overflow:visible;
}


.multi-column {
	column-count:3;
}

@media (max-width: 726px){
	.multi-column {
		column-count:2;
	}
	.bws-font { /*bws -> Big When Small*/
		font-size:1.2em;
	}
}

@media (max-width: 495px){
	.multi-column {
		column-count:1;
	}
	.bws-font { /*bws -> Big When Small*/
		font-size:1.4em;
	}
}

.simple-ol {
	list-style-type:none;	
	
}

.simple-li {
	margin-bottom:20px;
}

.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 #0080A3; */ /*Light Blue*/ /*#003471;*/
    /*outline-offset: -3px;*/
    outline: 0px;
    box-shadow: 0 0 3pt 2pt #0080A3 !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;
}

/*
  _______              
 |__   __|             
    | | __ _  __ _ ___ 
    | |/ _` |/ _` / __|
    | | (_| | (_| \__ \
    |_|\__,_|\__, |___/
              __/ |    
             |___/     
Styling for inputs that utilize the tag functionality.
*/
#basic {
    border-color: transparent;
    padding: 5px;
    background: transparent;
    outline: none;
    margin: 0 5px 5px 0;
    display: block;
    float: left;
    box-shadow: none;
    width: auto;
    line-height: normal;
}

#tagInput-basic {
    width: auto;
    /*min-height: 100px;*/
    border: 1px solid #CCC;
    padding: 5px 5px 0 5px;
    height: auto;
    overflow-y: auto;
    cursor:text;
}

#tagInput-basic.tag-focus { /*Used to give a div a focus like appearance*/
    border: 1px solid #66afe9;
    -moz-box-shadow: 0 0 8px rgba(102,175,233,.6);
    -webkit-box-shadow: 0 0 8px rgba(102,175,233,.6);
    box-shadow: 0 0 8px rgba(102,175,233,.6); 
}

a.x-close {
    text-decoration: none !important;
    cursor: auto;
}

.tag {
    display: block;
    float: left;
    padding: 5px;
    text-decoration: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    margin: 0 5px 5px 0;
}

/*
  _____                              _      _ _                          
 |_   _|                            | |    (_) |                         
   | |  _ __ ___   __ _  __ _  ___  | |     _| |__  _ __ __ _ _ __ _   _ 
   | | | '_ ` _ \ / _` |/ _` |/ _ \ | |    | | '_ \| '__/ _` | '__| | | |
  _| |_| | | | | | (_| | (_| |  __/ | |____| | |_) | | | (_| | |  | |_| |
 |_____|_| |_| |_|\__,_|\__, |\___| |______|_|_.__/|_|  \__,_|_|   \__, |
                         __/ |                                      __/ |
                        |___/                                      |___/ 
*/

@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;
}

/*
  _____                               _____       _ _                 
 |_   _|                             / ____|     | | |                
   | |  _ __ ___   __ _  __ _  ___  | |  __  __ _| | | ___ _ __ _   _ 
   | | | '_ ` _ \ / _` |/ _` |/ _ \ | | |_ |/ _` | | |/ _ \ '__| | | |
  _| |_| | | | | | (_| | (_| |  __/ | |__| | (_| | | |  __/ |  | |_| |
 |_____|_| |_| |_|\__,_|\__, |\___|  \_____|\__,_|_|_|\___|_|   \__, |
                         __/ |                                   __/ |
                        |___/                                   |___/ 

This section of CSS is for classes specific to the Image Gallery functionality.
*/

.image-thumb-gallery {
	position: absolute;
	background-repeat: no-repeat;
	background-position: 50%;
	background-color: #FFFFFF;
	background-size: cover;
}

/*
  __  __           _       _ 
 |  \/  |         | |     | |
 | \  / | ___   __| | __ _| |
 | |\/| |/ _ \ / _` |/ _` | |
 | |  | | (_) | (_| | (_| | |
 |_|  |_|\___/ \__,_|\__,_|_|
*/

/* 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.*/
}

/*Site Specific CSS*/
/*

   _____                   _         ____                      _     _           
  / ____|                 | |       / __ \                    (_)   | |          
 | |  __  ___   ___   __ _| | ___  | |  | |_   _____ _ __ _ __ _  __| | ___  ___ 
 | | |_ |/ _ \ / _ \ / _` | |/ _ \ | |  | \ \ / / _ \ '__| '__| |/ _` |/ _ \/ __|
 | |__| | (_) | (_) | (_| | |  __/ | |__| |\ V /  __/ |  | |  | | (_| |  __/\__ \
  \_____|\___/ \___/ \__, |_|\___|  \____/  \_/ \___|_|  |_|  |_|\__,_|\___||___/
                      __/ |                                                      
                     |___/                                                       
Overrides specific to the Google Custom Search Engine (Google CSE)
*/
 a.gs-title {
     color: #003471 !important;
 }
 
 .gsc-input-box {
     border: none !important;
 }
 
 #gsc-i-id1 {
     height: 40px !important;
     border: 1px solid #CCC !important;
     border-radius: 4px !important;
     box-shadow: inset 0 1px 1px rgba(0,0,0,.075) !important;
     padding: 0 6px 0 6px !important;
     margin-left: -12px !important;
 }
 
 .gcsc-find-more-on-google-query, .gs-webResult.gs-result a.gs-title:visited, .gs-webResult.gs-result a.gs-title:visited b, .gs-imageResult a.gs-title:visited, .gs-imageResult a.gs-title:visited b, a.gs-title b {
     color: #003471 !important;
 }
 
 .gcsc-find-more-on-google-text {
     color: #666 !important;
 }
 
 .gcsc-find-more-on-google-magnifier {
     fill: #003471 !important;
 }
 
 .cse input.gsc-input, input.gsc-input {
     background-image:none !important;
 }

/*
   ____                      _     _           
  / __ \                    (_)   | |          
 | |  | |_   _____ _ __ _ __ _  __| | ___  ___ 
 | |  | \ \ / / _ \ '__| '__| |/ _` |/ _ \/ __|
 | |__| |\ 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 {
}*/

a:focus, button:focus, *:focus {
  outline:1px solid #f5ffff !important;  
}

.umbutton-link, .umbutton-link:hover {
	color: white !important;
    text-decoration: none !important;
}

a.brand.site_name {
	color: #69676F;
}

input.search-query.search_input {
	color:#757575 !important;
}

.site_container.container.container-normal {
	min-width:320px;
}

#site_navigation.site-top-nav-dropdown.form-control {
    /* The selection box navigation on small screen widths is cutting off the bottom part of text without this adjustment. */
    height:auto;
}

/*@media (min-width: 992px) {
    .social_container.display_inline.facebook_widget_container, .plugin.social-media .social_container {
        float:none !important;
    }
}*/

@media (min-width: 768px) {
    .special-20-margin-768 {
        margin-bottom:20px;
    }
}
.wrapper {
    padding: 0px !important;    
}

/*.dept_leftnav.span3.sidebar-offcanvas {
    height: auto !important;
}*/

/*.nav-tabs > li > a {
    border-radius: 8px !important;
}*//*Default UM Template has only top two edges rounded, this makes all 4 rounded.*/

@media (max-width: 568px) {
    .nav-tabs > li > a {
        border-radius: 4px !important;        
    }
    .nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
        border-bottom: 1px solid !important;
    }
}

.content-area.remainder-box.normal_page a {
    border-bottom: inherit !important;
}

.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
	border-color: #427E7F;
    background-color: #FFFFFF;
}

#maincontent {
    height:inherit !important;
}

.site_container table {
    margin-top: 0px;    
}

.panel-no-bottom-margin {
    margin-bottom: 0px !important;
}

.site_container table>tbody>tr:nth-child(odd)>td, .site_container table>tbody>tr:nth-child(odd)>th {
    background-color: inherit;    
}

.site_container table>thead>tr>th {
    vertical-align: top;
}

.umbutton.paginate_button {
    background: #FFFFFF !important;
    color: #003471 !important; /*Dark Blue*/
    text-shadow: none;
    box-shadow: none;
    font-size: 1.4em;
}

.umbutton.paginate-active {
    background: linear-gradient(to bottom,  #427E7F 0%, #003471 100%) !important;
    color: white;
    text-shadow: none;
    box-shadow: none;
}

.umbutton {
    background: #0080A3 !important; /*Light Blue*/
    border: none;
}

.umbutton:hover, input.umbutton:focus, .umbutton:focus {    
    outline 0px;
    box-shadow: 0 0 3pt 2pt #F5FFFF !important; /*Main Page Background #427E7F (lightened 70%)*/
    z-index: 2;
}

.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;
}

/*
   _____          _                     _____ _                         
  / ____|        | |                   / ____| |                        
 | |    _   _ ___| |_ ___  _ __ ___   | |    | | __ _ ___ ___  ___  ___ 
 | |   | | | / __| __/ _ \| '_ ` _ \  | |    | |/ _` / __/ __|/ _ \/ __|
 | |___| |_| \__ \ || (_) | | | | | | | |____| | (_| \__ \__ \  __/\__ \
  \_____\__,_|___/\__\___/|_| |_| |_|  \_____|_|\__,_|___/___/\___||___/
*/
 .no-show {
	 display: none;
}

.site_breadcrumbs ol.breadcrumb li:nth-child(2) {
    display: none;
}

.bottom-spacer-md {
    padding-bottom: 20px;
}

/*
   _____ _____  _      _    _        _____                 _ _       
  / ____|  __ \| |    | |  | |      |  __ \               | | |      
 | (___ | |__) | |    | |__| |______| |__) |___  ___ _   _| | |_ ___ 
  \___ \|  ___/| |    |  __  |______|  _  // _ \/ __| | | | | __/ __|
  ____) | |    | |____| |  | |      | | \ \  __/\__ \ |_| | | |_\__ \
 |_____/|_|    |______|_|  |_|      |_|  \_\___||___/\__,_|_|\__|___/
*/
.citation-border, .record-border {
	border-style: solid;
	border-color: grey;
	border-width: 0 1px 1px 1px; /*Doesn't include the top border*/
}

.citation-border-topper, .record-border-topper {
	border-style: solid;
	border-color: grey;
	border-width: 1px 1px 1px 1px; /*Includes the top border*/
}

.citation-header, .record-header {
	margin-top: 10px !important;
	margin-left: 10px !important;
	padding-top: 10px;
	border-bottom: none !important;
}

.citation-segment, .record-segment {
	padding-left:20px;
	padding-right:20px;
	margin-left: 5px;
	margin-right: 5px;
}

.citation-starter, .record-starter {
	padding-left:20px;
}

.citation-padding, .record-padding {
	padding:3px;
}


.even-citation, .even-record {
	background-color:#F0F0F0; /*One level up from HTML WhiteSmoke (grayscale)*/
}

.odd-citation, .odd-record {
	background-color:#FFFFFF; /*White*/
}

.even-law {
	background-color:#F2EDE0; /*Monochromatic color of E2D8BD (tan)*/
}

.odd-law {
	background-color:#CCE8F0; /*Tint of 008FB6 (light blue from Wilderness Connect Logo)*/
}

.law-segment {
	padding: 0 10px 10px 10px; 
}

/*
  _______ _                _ _            
 |__   __(_)              | (_)           
    | |   _ _ __ ___   ___| |_ _ __   ___ 
    | |  | | '_ ` _ \ / _ \ | | '_ \ / _ \
    | |  | | | | | | |  __/ | | | | |  __/
    |_|  |_|_| |_| |_|\___|_|_|_| |_|\___|
*/

.timeline {
    position: relative;
    padding:4px 0 0 0;
    margin-top:22px;
    list-style: none;
}

.timeline>li:nth-child(even) {
    position: relative;
    margin-bottom: 50px;
    height: 180px;
    right:-100px;
}

.timeline>li:nth-child(odd) {
    position: relative;
    margin-bottom: 50px;
    height: 180px;
    left:-100px;
}

.timeline>li:before,
.timeline>li:after {
    content: " ";
    display: table;
}

.timeline>li:after {
    clear: both;
    min-height: 170px;
}

.timeline > li .timeline-panel {
  position: relative;
  float: left;
  width: 41%;
  padding: 0 20px 20px 30px;
  text-align: right;
}

.timeline>li .timeline-panel:before {
    right: auto;
    left: -15px;
    border-right-width: 15px;
    border-left-width: 0;
}

.timeline>li .timeline-panel:after {
    right: auto;
    left: -14px;
    border-right-width: 14px;
    border-left-width: 0;
}

.timeline>li .timeline-image {
    z-index: 100;
    position: absolute;
    left: 50%;
    border: 7px solid #3b5998;
    border-radius: 100%;
    background-color: #3b5998;
    box-shadow: 0 0 5px #4582ec;
    width: 200px;
    height: 200px;
    margin-left: -100px;
}

.timeline>li .timeline-image h4 {
    margin-top: 12px;
    font-size: 10px;
    line-height: 14px;
}

.timeline>li.timeline-inverted>.timeline-panel {
    float: right;
    padding: 0 30px 20px 20px;
    text-align: left;
}

.timeline>li.timeline-inverted>.timeline-panel:before {
    right: auto;
    left: -15px;
    border-right-width: 15px;
    border-left-width: 0;
}

.timeline>li.timeline-inverted>.timeline-panel:after {
    right: auto;
    left: -14px;
    border-right-width: 14px;
    border-left-width: 0;
}

.timeline>li:last-child {
    margin-bottom: 0;
}

.timeline .timeline-heading h4 {
  margin-top:22px;
    margin-bottom: 4px;
    padding:0;
    color: #b3b3b3;
}

.timeline .timeline-heading h4.subheading {
  margin:0;
  padding:0;
    text-transform: none;
    font-size:18px;
    color:#333333;
}

.timeline .timeline-body>p,
.timeline .timeline-body>ul {
    margin-bottom: 0;
    color:#808080;
}
/*Style for even div.line*/
.timeline>li:nth-child(odd) .line:before {
    content: "";
    position: absolute;
    top: 60px;
    bottom: 0;
    left: 690px;
    width: 4px;
    height:340px;
    background-color: #3b5998;
    -ms-transform: rotate(-44deg); /* IE 9 */
    -webkit-transform: rotate(-44deg); /* Safari */
    transform: rotate(-44deg);
    box-shadow: 0 0 5px #4582ec;
}
/*Style for odd div.line*/
.timeline>li:nth-child(even) .line:before  {
    content: "";
    position: absolute;
    top: 60px;
    bottom: 0;
    left: 450px;
    width: 4px;
    height:340px;
    background-color: #3b5998;
    -ms-transform: rotate(44deg); /* IE 9 */
    -webkit-transform: rotate(44deg); /* Safari */
    transform: rotate(44deg);
    box-shadow: 0 0 5px #4582ec;
}
/* Medium Devices, .visible-md-* */
@media (min-width: 992px) and (max-width: 1199px) {
  .timeline > li:nth-child(even) {
    margin-bottom: 0px;
    min-height: 0px;
    right: 0px;
  }
  .timeline > li:nth-child(odd) {
    margin-bottom: 0px;
    min-height: 0px;
    left: 0px;
  }
  .timeline>li:nth-child(even) .timeline-image {
    left: 0;
    margin-left: 0px;
  }
  .timeline>li:nth-child(odd) .timeline-image {
    left: 690px;
    margin-left: 0px;
  }
  .timeline > li:nth-child(even) .timeline-panel {
    width: 76%;
    padding: 0 0 20px 0px;
    text-align: left;
  }
  .timeline > li:nth-child(odd) .timeline-panel {
    width: 70%;
    padding: 0 0 20px 0px;
    text-align: right;
  }
  .timeline > li .line {
    display: none;
  }
  ul.timeline {
      padding-left: 0;
  }
}
/* Small Devices, Tablets */
@media (min-width: 768px) and (max-width: 991px) {
  .timeline > li:nth-child(even) {
    margin-bottom: 0px;
    min-height: 0px;
    right: 0px;
  }
  .timeline > li:nth-child(odd) {
    margin-bottom: 0px;
    min-height: 0px;
    left: 0px;
  }
  .timeline>li:nth-child(even) .timeline-image {
    left: 0;
    margin-left: 0px;
  }
  .timeline>li:nth-child(odd) .timeline-image {
    left: 520px;
    margin-left: 0px;
  }
  .timeline > li:nth-child(even) .timeline-panel {
    width: 70%;
    padding: 0 0 20px 0px;
    text-align: left;
  }
  .timeline > li:nth-child(odd) .timeline-panel {
    width: 70%;
    padding: 0 0 20px 0px;
    text-align: right;
  }
  .timeline > li .line {
    display: none;
  }
  ul.timeline {
    padding-left: 0;
  }
}
/* Custom, iPhone Retina */
@media only screen and (max-width: 767px) {
  .timeline > li:nth-child(even) {    
    margin-bottom: 0px;
    min-height: 0px;
    right: 0px;
  }
  .timeline > li:nth-child(odd) {
    margin-bottom: 0px;
    min-height: 0px;
    left: 0px;
  }
  .timeline>li .timeline-image {
    position: static;
    width: 150px;
    height: 150px;
    margin-bottom:0px;
  }
  .timeline>li:nth-child(even) .timeline-image {
    float:left;
    left: 0;
    margin-left: 0;
  }
  .timeline>li:nth-child(odd) .timeline-image {
    float:right;
    left: 0px;
    margin-left:0;
  }
  .timeline > li:nth-child(even) .timeline-panel {
    width: 100%;
    padding: 0 0 20px 14px;
  }
  .timeline > li:nth-child(odd) .timeline-panel {
    width: 100%;
    padding: 0 14px 20px 0px;
  }
  .timeline > li .line {
    display: none;
  }
  
  ul.timeline {
      padding-left: 0;
  }
}

/*
   _____              _        _____            __ _ _      
  / ____|            | |      |  __ \          / _(_) |     
 | |     __ _ _ __ __| |______| |__) | __ ___ | |_ _| | ___ 
 | |    / _` | '__/ _` |______|  ___/ '__/ _ \|  _| | |/ _ \
 | |___| (_| | | | (_| |      | |   | | | (_) | | | | |  __/
  \_____\__,_|_|  \__,_|      |_|   |_|  \___/|_| |_|_|\___|
*/

div.card-text > strong {
    font-size: 1.3em;
}

h3.card-title {
    border-bottom: 1px solid #ccc;
    padding-bottom: 15px;
    line-height: 1.3em;
    height: 50px;
    text-align: center;
    font-size:1.3em;
    margin-top: 10px;
}

.card-profile {
    border: 1px solid #ccc;
    /*border-radius: 8px;*/
    /*box-shadow: 2px 2px 1px 1px #ccc;*/
    padding: 10px;
    text-align: center;
    height: 100%;
    /*background: url("/wilderness/practitioners/images/backgrounds/card-background-2.jpg");*/
    /*background: #f0fcfc;*/ /*Based on main color*/
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12); /*Same as leopold.wilderness.net*/
}

.card-image {
    float:left;
    /*max-width: 200px;*/
    max-height:200px;
    min-width:75px;
    min-height:75px;
}

.card-image img {
    max-width: 100%;
    max-height: 100%;
}

@media(max-width: 991px) {
    .card-profile {
        min-width: 337.5px;
        /*max-width:337.5px;*/
    }
    
    .card-image {
        float: none;
    }
    
    .card-image img {
        display: block;
        margin: auto;
    }
}

@media(max-width: 767px) {
    .card-profile {
        min-width: 277px;
        /*max-width:249px;*/
    }
}

div.card-profile div.card-text {
    float: none;
    min-width: 60px;
} 

/* _______                _      
 |__   __|              | |     
    | | ___   __ _  __ _| | ___ 
    | |/ _ \ / _` |/ _` | |/ _ \
    | | (_) | (_| | (_| | |  __/
    |_|\___/ \__, |\__, |_|\___|
              __/ | __/ |       
             |___/ |___/        
*/

.parent-toggle-child, .parent-no-child-no-toggle {
    /*margin-bottom:22px;*/
    padding:10px;
    border-radius:8px;
    border-bottom: 2px solid #FFFFFF;
    background-color: #007798;/*#F5FFFF; #0080A3;*/
    color: #FFFFFF;
    font-size: 1.2em;
    height:auto;
}

/*
.parent-toggle-child {
    outline: 1px groove #FFFFFF;
    outline-offset: -5px;
}*/

.parent-no-child-no-toggle {
    background-color: #557c8a;/*#88aab6;  Original color didn't pass accessibility contrast for AA rating*/
}

.parent-toggle-child:hover {
    cursor: pointer;
    /*
    border-bottom: 2px solid #003471;
    background-color:#003471;
    box-shadow:0px 1px 1px 2px #0080A3;
    */
    filter: alpha(opacity=80);
    opacity: 0.80;
    /*border: 3px solid #003471;/*
}

.parent-toggle-child.toggle-open-state:hover {    
    filter: alpha(opacity=100);
    opacity:1.0;
    /*border:none;
    border-bottom: 2px solid #FFFFFF;*/
}

.hidden-child {
    background-color:#FFFFFF;
    padding: 10px;
    border: solid 1px #003471;
    border-radius:8px;
    margin-top: 15px;
}
.hidden-child > ul li {
    color: #000000;
}

@media(max-width: 992px) {
    .hidden-child > ul li {
        padding-bottom:10px;
    }
}

.toggle-arrow {
    float: left;
    width: 0px;
    height: 0px;    
    margin-left: 23px;
    border: 10px solid transparent;
    margin-left: 21px;
    border-left-color: #F3F3F3;
    position: absolute;
    top: 30%;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 1;
    width: auto;
}

.open-arrow.toggle-arrow {
    margin-left: 11px;
    border-top-color: #F3F3F3;
    border-left-color: transparent;
}

/*
  _______    _     _           
 |__   __|  | |   | |          
    | | __ _| |__ | | ___  ___ 
    | |/ _` | '_ \| |/ _ \/ __|
    | | (_| | |_) | |  __/\__ \
    |_|\__,_|_.__/|_|\___||___/
*/

.collapse-td {
    padding-top: 1.2em !important;
}

.collapse-td > p {
    line-height: 1.2; /*Type-less to mimic the um-template*/
    padding-bottom: 1.2em !important;
}

/*For displaying identical columns (one is always hidden) that should toggle from small screens to large*/
.small-screens-table {
    display: none;
}
.large-screens-table {
    display: block;
}
@media(max-width: 767px) {
    .small-screens-table {
        display: block;
    }
    .large-screens-table {
        display: none;
    }
    .collapse-td {
        border-left: solid windowtext 1.0pt !important;
    }
    #rows-per-page {
        width:auto;
    }
    #table-print-excel, #table-row-select {
        text-align:left !important;
        float:left;
    }
    #table-print-excel {
        padding-top:0px !important;
        padding-bottom:0px;
    }
    #summarySection, #pagination-left-div, #pagination-right-div {
        margin-left:5px;
    }
    #pagination-right-div {
        text-align:left !important;
        float:left !important;
    }
    #pagination-left-div {
        padding-bottom:5px;
    }
    
    /*UM template overrides section*/
    
    .table-responsive {
        border: none;
    }
    
    /*Prevents UM-template from making data table not wrap correctly on smaller screens*/
    .table-responsive>.table>tbody>tr>td, .table-responsive>.table>tbody>tr>th, .table-responsive>.table>tfoot>tr>td, .table-responsive>.table>tfoot>tr>th, .table-responsive>.table>thead>tr>td, .table-responsive>.table>thead>tr>th {
        white-space: inherit;
    }
}

.headRow {
    padding: 1px;
}

.headRow th {
    background-color: #427E7F !important; /*Main Page Background*/
    color: #FFFFFF;
    /*min-width: 200px !important;*/ /*Moved to each generated th to customize for small screens without overlapping toggle arrows*/
    position: relative;
    /*min-height: 100px;*/
    /*border: solid 3px #FFFFFF !important; Not needed in Chrome and doesn't work in FireFox or Edge*/
    outline: thin solid #FFFFFF;
      /*outline-offset: 2px;*/
}

/*The following custom width (minimized CSS) is based on maxpx (in Python CSS generator for custom width) min-width adjusted to compensate for the wording length of the table header with footnote to prevent visual collision*/
.headRow th.customWidth7{min-width:75px;}.headRow th.customWidth8{min-width:85px;}.headRow th.customWidth9{min-width:96px;}.headRow th.customWidth10{min-width:106px;}.headRow th.customWidth11{min-width:117px;}.headRow th.customWidth12{min-width:128px;}.headRow th.customWidth13{min-width:138px;}.headRow th.customWidth14{min-width:149px;}.headRow th.customWidth15{min-width:159px;}.headRow th.customWidth16{min-width:170px;}.headRow th.customWidth17{min-width:180px;}.headRow th.customWidth20{min-width:212px;}@media(max-width:991px){.headRow th.customWidth13{min-width:85px;}.headRow th.customWidth17{min-width:117px;}.headRow th.customWidth14{min-width:149px;}.headRow th.customWidth12{min-width:75px;}.headRow th.customWidth16{min-width:117px;}.headRow th.customWidth20{min-width:138px;}}

/*
th.results {
    border-left: 1px solid #FFFFFF !important;
    border-right: 1px solid #FFFFFF !important;
    padding: 0px !important;
}
*/
/*
.table-head-container {
   position: relative;
  color: white;
}

.site_container table > tbody > tr > td, .site_container table > tbody > tr > th, .site_container table > tfoot > tr > td, .site_container table > tfoot > tr > th, .site_container table > thead > tr > td, .site_container table > thead > tr > t h{
    border: 3px solid #ddd !important;
}
*/
.Col-header {
  text-align: left;
}

.table-head-background {
   position: absolute;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   z-index: 1;
   width: auto;
}

.table-head-background > a:link {
    color: #FFFFFF !important;
    text-decoration: none !important;
}

.table-head-background > a:active {
    color: #FFFFFF !important;
}

.table-head-background > a:hover > .small-frame {
    color: blue !important;
}
.table-head-background > a:focus > .small-frame {
    color: blue !important;
}

.table-head-background > a:visited {
    color: #FFFFFF !important;
}

.table-head-background > a > .small-frame {
  position: absolute;
  right: 15px;
  padding: 3px 0px 5px 0px;
  width: 5px !important;
  word-wrap: break-word;
  line-height: 15px; /*Reduces the gap between the arrows*/
}

.table-foot-background {
    background-color: #427E7F;
    color: #FFFFFF;
}

/*
.table-head-background > .right-text > .small-frame > .up-arrow, .table-head-background > .right-text > .small-frame > .down-arrow {
    padding: 2px 4px 2px 0px;
}
*/

/*.table-head-background > a > .small-frame > .up-arrow:hover, .table-head-background > a > .small-frame > .down-arrow:hover {
.table-head-background > .small-frame:hover {
    color: blue !important;
}
*/

.resultRow {
     padding: 10px 4px 10px 4px;  
}

/* 
  _      _       _        
 | |    (_)     | |       
 | |     _ _ __ | | _____ 
 | |    | | '_ \| |/ / __|
 | |____| | | | |   <\__ \
 |______|_|_| |_|_|\_\___/
This section changes the color of the links in the top navigation bar and side navigation.
Note: quietstyle and quietstyle-white links CSS is in the Footnote section*/

/*For changing the primary link coloring for WildernessNow*/

a:link {
    color: #003471; /*Dark Blue*/
}

a:active {
    color: #003471 !important; /*Dark Blue*/
}

a:hover {
    color: #669AD7 !important; /*Dark Blue #003471 (lightened 40%)*/
    border-bottom-color: #669AD7 !important;
}

.dept_leftnav > ul > a:link, .dept_leftnav > ul > ul  li > a:link {
    color: #003471 !important; /*Dark Blue*/
}

.dept_leftnav > ul > a:active, .dept_leftnav > ul > ul  li > a:active {
    color: #003471 !important; /*Dark Blue*/
}

.dept_leftnav > ul > a:hover, .dept_leftnav > ul > ul  li > a:hover{
    color: #669AD7 !important; /*Dark Blue #003471 (lightened 40%)*/
    border-bottom-color: #669AD7 !important;
}

.dept_leftnav > ul > a:visited, .dept_leftnav > ul > ul  li > a:visited {
    color: #003471 !important; /*Dark Blue*/
}

a:visited {
    color: #003471; /*Dark Blue*/
}

.active, .active > a {
    color: #003471 !important; /*Dark Blue*/
}

.navbar > .site-top-nav.navbar-inner.site-nav > ul.nav > li > a:link {
    color: #FFFFFF; /*White*/
}

.navbar > .site-top-nav.navbar-inner.site-nav > ul.nav > li > a:active {
    background-color: #FFFFFF; /*White*/
    color: #003471; /*Dark Blue*/
}

.navbar > .site-top-nav.navbar-inner.site-nav > ul.nav > li > a:hover, .navbar > .site-top-nav.navbar-inner.site-nav > ul.nav > li > a:focus {
    background-color: #0080A3 !important; /*Light Blue*/
    color: #FFFFFF !important; /*White*/
    border-radius:4px;  
}

.navbar > .site-top-nav.navbar-inner.site-nav > ul.nav > li > a:visited {
    color: #FFFFFF; /*White*/
}

.navbar > .site-top-nav.navbar-inner.site-nav > ul.nav > li.active > a.activepage {
    background-color: #FFFFFF; /*White*/
    color: #003471; /*Dark Blue*/
}

/*
  _   _             ____             
 | \ | |           |  _ \            
 |  \| | __ ___   _| |_) | __ _ _ __ 
 | . ` |/ _` \ \ / /  _ < / _` | '__|
 | |\  | (_| |\ V /| |_) | (_| | |   
 |_| \_|\__,_| \_/ |____/ \__,_|_|   
Changes the background color of the navigation bar - Note: The text inside the navigation bar are links so color here will not change them.
NavBar links are in the above Links section*/

.navbar > .site-top-nav.navbar-inner.site-nav > ul.nav {
    background-color: #003471; /*Dark Blue*/
}

.navbar > .site-top-nav.navbar-inner.site-nav {
    background-color: #003471; /*Dark Blue*/
    background-image: none !important;
}


/*Changes the background color of the end (button area) of the navigation bar*/
.navbar {
    background-color: #003471 !important; /*Dark Blue*/
}

/*Changes the background color of the end (button area) of the navigation bar*/
.navbar > .site-top-nav.navbar-inner.site-nav > .below_block {
    background-color: #003471 !important; /*Dark Blue*/
}

/*
   _____ _               _    _                                
  / ____| |             | |  | |                           _   
 | |    | |__   ___  ___| | _| |__   _____  _____  ___   _| |_ 
 | |    | '_ \ / _ \/ __| |/ / '_ \ / _ \ \/ / _ \/ __| |_   _|
 | |____| | | |  __/ (__|   <| |_) | (_) >  <  __/\__ \   |_|  
  \_____|_| |_|\___|\___|_|\_\_.__/ \___/_/\_\___||___/        
This section is for CSS dedicated to making the site more mobile friendly
Sources Include:
    https://codepen.io/paul66/pen/jKBzu (3/29/17) (input type checkbox and isSelected)
    http://stackoverflow.com/questions/22645930/how-to-add-padding-to-the-extra-small-xs-column-only-without-affecting-other-s (4/5/2017) (pbenard's answer 3/25/2014)
*/

@media screen and (max-width: 768px){

  *[class*='col-xs']{
    padding-bottom: 8px;
  }
}

input[type="checkbox"] {
  vertical-align: middle;
  position: relative;
  margin-left: -22px !important;
}

.checkbox > label > input.checkButton {
    margin-right: 15px !important;
}

.isSelected {
  background-color: #B3E7FF; /*Dark Blue #003471 (lightened 70%)*/
}

/*Intended to hide highlighting backgrounds done in JQuery/JS for labels when JS is disabled*/
.noscript-noBack > label {
    background-color: transparent !important;
}

.checkButton{
    vertical-align: middle;
}

.checkbox {
    padding: 5px 10px 5px 10px;
    vertical-align: middle;
}

.checkbox > label {
    display: block;
    padding: 5px;
    border-radius: 7px;
    margin-left: 20px;
}

.checkbox > label:hover {
    background-color: #E5FFFF; /*Dark Blue #003471 (lightened 90%)*/
    cursor: pointer !important;
}

/*
                                _ _     _ _ _ _         
     /\                        (_) |   (_) (_) |        
    /  \   ___ ___ ___  ___ ___ _| |__  _| |_| |_ _   _ 
   / /\ \ / __/ __/ _ \/ __/ __| | '_ \| | | | __| | | |
  / ____ \ (_| (_|  __/\__ \__ \ | |_) | | | | |_| |_| |
 /_/    \_\___\___\___||___/___/_|_.__/|_|_|_|\__|\__, |
                                                   __/ |
                                                  |___/ 
This section is for accessibility based CSS
Sources Include:
    http://webaim.org/techniques/css/invisiblecontent/ (3/29/2017) (visuallyhidden)
*/

/*Used to add additional information for screen readers (3 inputs for phone number might only have one label but with this screen readers would get a label on each of the 3 inputs specifying their intended input)*/
.visuallyhidden {border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}

/*
       _  ____                        _    _ _____ 
      | |/ __ \                      | |  | |_   _|
      | | |  | |_   _  ___ _ __ _   _| |  | | | |  
  _   | | |  | | | | |/ _ \ '__| | | | |  | | | |  
 | |__| | |__| | |_| |  __/ |  | |_| | |__| |_| |_ 
  \____/ \___\_\\__,_|\___|_|   \__, |\____/|_____|
                                 __/ |             
                                |___/              
This section is for css related to JQuery UI
cross-browser support improvements based on: http://www.456bereastreet.com/archive/201302/fieldset_legend_border-radius_and_box-shadow/ (accessed 3/29/2017)
*/
fieldset {
    border:1px solid #e1e1e1;
    margin:0 2px;
    padding:0.35em 0.625em 0.75em;
    background-color: #FFFFFF;
    }

legend{
    float: left;
    border:0;
    padding:0
}

legend + * {
    clear:both;
}

.overflow {
      height: 200px;
}


/*
  _____                 _ 
 |  __ \               | |
 | |__) |_ _ _ __   ___| |
 |  ___/ _` | '_ \ / _ \ |
 | |  | (_| | | | |  __/ |
 |_|   \__,_|_| |_|\___|_|
Bootstrap Panel CSS adjustments*/
.panel-body {
    background-color: #FFFFFF; /*Main page background color*/
}

.panel-custom-body {
    background-color: #427E7F !important;/*Main page background color*/
}

.panel-default > .panel-heading {
    background-color: #0080A3; /*Light blue: #0080A3 */ 
    color: #FFFFFF;
    font-size: 1.1em;
}
/*
  ______          _               _            
 |  ____|        | |             | |           
 | |__ ___   ___ | |_ _ __   ___ | |_ ___  ___ 
 |  __/ _ \ / _ \| __| '_ \ / _ \| __/ _ \/ __|
 | | | (_) | (_) | |_| | | | (_) | ||  __/\__ \
 |_|  \___/ \___/ \__|_| |_|\___/ \__\___||___/
This section of CSS is based on an article by Hugo Giraudel (accessed 3/23/2017) from https://www.sitepoint.com/accessible-footnotes-css/
The purpose of this CSS is to create a footer like section that is accessible (allows easy travel between content to footnotes for that content)
*/

a.quietstyle {
    padding-right: 5px;    
}

a.quietstyle:link {
    color: #555555 !important;
    text-decoration: none !important;
}

a.quietstyle:active {
    color: #555555 !important;
}

a.quietstyle:hover {
    color: #555555 !important;
}

a.quietstyle:hover {
    color: #555555 !important;
}

a.quietstyle.white-special:hover {
    border: 1px solid silver;
    border-color: #555555 !important;
}

a.quietstyle:visited {
    color: #555555 !important;
}

a.quietstyle-white, a.quietstyle.parent-child-toggle-link {
    position: relative;
    z-index: 2;
}

a.quietstyle-white:link, a.quietstyle.parent-child-toggle-link:link {
    color: #FFFFFF !important;
    text-decoration: none !important;
}

a.quietstyle-white:active, a.quietstyle.parent-child-toggle-link:active {
    color: #FFFFFF !important;
}

a.quietstyle-white:hover, a.quietstyle.parent-child-toggle-link:hover {    
    outline 0px;
    box-shadow: 0 0 4pt 2pt  #0080A3; /*Light blue: #0080A3 */ 
}

a.quietstyle-white:visited, a.quietstyle.parent-child-toggle-link:visited {
    color: #FFFFFF !important;
}

.headRow th > a:hover {
    color: #003471 !important; /*Dark Blue*/
    background-color: #F5FFFF !important; /*Main Page Background #427E7F (lightened 70%)*/
}

.disclaimer {
   font-size: 0.8em;
   padding-left: 20px;
   
}

.in-section-footer {
  margin-top: 50px;
  border-top: 1px solid silver;
  font-size: 0.8em;
}

.in-section-footer ol {
    padding-left: 20px;
}

.in-section-footer :target {
    background: #F5FFFF; /*Main Page Background #427E7F (lightened 70%)*/
    color: #000000 !important;
    font-size: 1.2em;
    display: block;
    padding: 5px;
    border-radius: 7px;
}

/**
 * Initialiazing a `footnotes` counter on the wrapper
 */
article {
  counter-reset: footnotes;
}

/**
 * Inline footnotes references
 * 1. Increment the counter at each new reference
 * 2. Reset link styles to make it appear like regular text
 */
[aria-describedby="footnote-label"] {
  counter-increment: footnotes; /* 1 */
  text-decoration: none; /* 2 */
  color: inherit; /* 2 */
  cursor: default; /* 2 */
  outline: none; /* 2 */
}

.no-increment-counter[aria-describedby="footnote-label"] {
  counter-increment: footnotes 0; /*Allows the counter to be displayed but not incremented*/
}

/**
 * Actual numbered references
 * 1. Display the current state of the counter (e.g. `[1]`)
 * 2. Align text as superscript
 * 3. Make the number smaller (since it's superscript)
 * 4. Slightly offset the number from the text
 * 5. Reset link styles on the number to show it's usable
 */
[aria-describedby="footnote-label"]::after {
  content: '[' counter(footnotes) ']'; /* 1 */
  vertical-align: super; /* 2 */
  font-size: 0.5em; /* 3 */
  margin-left: 2px; /* 4 */
  color: #FFFFFF; /* 5 */
  text-decoration: underline; /* 5 */
  cursor: pointer; /* 5 */
}

.not-white-counter[aria-describedby="footnote-label"]::after {
  color: #555555 !important;
}

/**
 * Resetting the default focused styles on the number
 */
[aria-describedby="footnote-label"]:focus::after {
  outline: thin dotted;
  outline-offset: 2px;
}

[aria-describedby="footnote-label"]:hover::after {
    color: #003471 !important; /*Dark Blue*/
}

/**
 * Visually hidden yet accessible content
 */
.visually-hidden {
  position: absolute;
  clip: rect(0 0 0 0);
  visibility: hidden;
  opacity: 0;
}

/*
  _____                                 _             _______    _         
 |  __ \                               (_)           |__   __|  | |        
 | |__) |___  ___ _ __   ___  _ __  ___ ___   _____     | | __ _| |__  ___ 
 |  _  // _ \/ __| '_ \ / _ \| '_ \/ __| \ \ / / _ \    | |/ _` | '_ \/ __|
 | | \ \  __/\__ \ |_) | (_) | | | \__ \ |\ V /  __/    | | (_| | |_) \__ \
 |_|  \_\___||___/ .__/ \___/|_| |_|___/_| \_/ \___|    |_|\__,_|_.__/|___/
                 | |                                                       
                 |_|                                                       
 The following CSS section is for bootstrap responsive tabs */

/**
 * Responsive Bootstrap Tabs by @hayatbiralem
 * 15 May 2015
 */

@mixin ellipsis(){
    max-width: 100%;
    /*overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;*/
    word-wrap: normal;
    width: 100%;
}

@mixin icon-styles(){
  position: relative;
  top: 1px;
  display: inline-block;
  font-family: 'Glyphicons Halflings';
  font-style: normal;
  font-weight: 400;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@mixin transform($transform){
  -webkit-transform: $transform;
  -moz-transform: $transform;
  -ms-transform: $transform;
  -o-transform: $transform;
  transform: $transform;
}

@media screen and (max-width: 479px) {
  .nav-tabs-responsive {
    > li {
      display: none;
      width: 23%;
      > a {
        @include ellipsis();
        width: 100%;
        text-align: center;
        vertical-align: top;
      }
      &.active {
        width: 54%;
        &:first-child {
          margin-left: 23%;
        }
      }
      &.active,
      &.prev,
      &.next {
        display: block;
      }
      &.prev,
      &.next {
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
      }
      &.next > a,
      &.prev > a {
        -webkit-transition: none;
        transition: none;
        .text {
          display: none;
        }
        &:after,
        &:after {
          @include icon-styles();
        }
      }
      &.prev > a:after {
        content: "\e079";
      }
      &.next > a:after {
        content: "\e080";
      }
      &.dropdown {
        > a > .caret {
          display: none;
        }
        > a:after {
          content: "\e114";
        }
        &.active > a {
          &:after {
            display: none;
          }
          > .caret {
            display: inline-block;
          }
        }

        .dropdown-menu {
          &.pull-xs-left {
            left: 0;
            right: auto;
          }
          &.pull-xs-center {
            right: auto;
            left: 50%;
            @include transform(translateX(-50%));
          }
          &.pull-xs-right {
            left: auto;
            right: 0;
          }
        }
      }
    }
  }
}



/**
 * Demo Styles
 */

.wrapper {
  padding: 15px 0;
}

.bs-example-tabs .nav-tabs {
  margin-bottom: 15px;
}

@media (max-width: 479px) {
  #narrow-browser-alert {
    display: none;
  }
}

/*
  _______       ______             _______ _                _ _            
 |___  (_)     |___  /            |__   __(_)              | (_)           
    / / _  __ _   / / __ _  __ _     | |   _ _ __ ___   ___| |_ _ __   ___ 
   / / | |/ _` | / / / _` |/ _` |    | |  | | '_ ` _ \ / _ \ | | '_ \ / _ \
  / /__| | (_| |/ /_| (_| | (_| |    | |  | | | | | | |  __/ | | | | |  __/
 /_____|_|\__, /_____\__,_|\__, |    |_|  |_|_| |_| |_|\___|_|_|_| |_|\___|
           __/ |            __/ |                                          
          |___/            |___/                                           
Logic Start for 
"Zigzag Timeline Layout"
Bootstrap 3.3.0 Snippet by andrewnite
https://bootsnipp.com/snippets/featured/zigzag-timeline-layout
Accessed 6/19/2017
*/
.timeline {
    position: relative;
    padding:4px 0 0 0;
    margin-top:22px;
    list-style: none;
}

.timeline>li:nth-child(even) {
    position: relative;
    margin-bottom: 50px;
    height: 180px;
    right:-100px;
}

.timeline>li:nth-child(odd) {
    position: relative;
    margin-bottom: 50px;
    height: 180px;
    left:-100px;
}

.timeline>li:before,
.timeline>li:after {
    content: " ";
    display: table;
}

.timeline>li:after {
    clear: both;
    min-height: 170px;
}

.timeline > li .timeline-panel {
  position: relative;
  float: left;
  width: 41%;
  padding: 0 20px 20px 30px;
  text-align: right;
}

.timeline>li .timeline-panel:before {
    right: auto;
    left: -15px;
    border-right-width: 15px;
    border-left-width: 0;
}

.timeline>li .timeline-panel:after {
    right: auto;
    left: -14px;
    border-right-width: 14px;
    border-left-width: 0;
}

.timeline>li .timeline-image {
    z-index: 100;
    position: absolute;
    left: 50%;
    border: 7px solid #3b5998;
    border-radius: 100%;
    background-color: #3b5998;
    box-shadow: 0 0 5px #4582ec;
    width: 200px;
    height: 200px;
    margin-left: -100px;
}

.timeline>li .timeline-image h4 {
    margin-top: 12px;
    font-size: 10px;
    line-height: 14px;
}

.timeline>li.timeline-inverted>.timeline-panel {
    float: right;
    padding: 0 30px 20px 20px;
    text-align: left;
}

.timeline>li.timeline-inverted>.timeline-panel:before {
    right: auto;
    left: -15px;
    border-right-width: 15px;
    border-left-width: 0;
}

.timeline>li.timeline-inverted>.timeline-panel:after {
    right: auto;
    left: -14px;
    border-right-width: 14px;
    border-left-width: 0;
}

.timeline>li:last-child {
    margin-bottom: 0;
}

.timeline .timeline-heading h4 {
  margin-top:22px;
    margin-bottom: 4px;
    padding:0;
    color: #b3b3b3;
}

.timeline .timeline-heading h4.subheading {
  margin:0;
  padding:0;
    text-transform: none;
    font-size:18px;
    color:#333333;
}

.timeline .timeline-body>p,
.timeline .timeline-body>ul {
    margin-bottom: 0;
    color:#808080;
}
/*Style for even div.line*/
.timeline>li:nth-child(odd) .line:before {
    content: "";
    position: absolute;
    top: 60px;
    bottom: 0;
    left: 690px;
    width: 4px;
    height:340px;
    background-color: #3b5998;
    -ms-transform: rotate(-44deg); /* IE 9 */
    -webkit-transform: rotate(-44deg); /* Safari */
    transform: rotate(-44deg);
    box-shadow: 0 0 5px #4582ec;
}
/*Style for odd div.line*/
.timeline>li:nth-child(even) .line:before  {
    content: "";
    position: absolute;
    top: 60px;
    bottom: 0;
    left: 450px;
    width: 4px;
    height:340px;
    background-color: #3b5998;
    -ms-transform: rotate(44deg); /* IE 9 */
    -webkit-transform: rotate(44deg); /* Safari */
    transform: rotate(44deg);
    box-shadow: 0 0 5px #4582ec;
}
/* Medium Devices, .visible-md-* */
@media (min-width: 992px) and (max-width: 1199px) {
  .timeline > li:nth-child(even) {
    margin-bottom: 0px;
    min-height: 0px;
    right: 0px;
  }
  .timeline > li:nth-child(odd) {
    margin-bottom: 0px;
    min-height: 0px;
    left: 0px;
  }
  .timeline>li:nth-child(even) .timeline-image {
    left: 0;
    margin-left: 0px;
  }
  .timeline>li:nth-child(odd) .timeline-image {
    left: 690px;
    margin-left: 0px;
  }
  .timeline > li:nth-child(even) .timeline-panel {
    width: 76%;
    padding: 0 0 20px 0px;
    text-align: left;
  }
  .timeline > li:nth-child(odd) .timeline-panel {
    width: 70%;
    padding: 0 0 20px 0px;
    text-align: right;
  }
  .timeline > li .line {
    display: none;
  }
}
/* Small Devices, Tablets */
@media (min-width: 768px) and (max-width: 991px) {
  .timeline > li:nth-child(even) {
    margin-bottom: 0px;
    min-height: 0px;
    right: 0px;
  }
  .timeline > li:nth-child(odd) {
    margin-bottom: 0px;
    min-height: 0px;
    left: 0px;
  }
  .timeline>li:nth-child(even) .timeline-image {
    left: 0;
    margin-left: 0px;
  }
  .timeline>li:nth-child(odd) .timeline-image {
    left: 520px;
    margin-left: 0px;
  }
  .timeline > li:nth-child(even) .timeline-panel {
    width: 70%;
    padding: 0 0 20px 0px;
    text-align: left;
  }
  .timeline > li:nth-child(odd) .timeline-panel {
    width: 70%;
    padding: 0 0 20px 0px;
    text-align: right;
  }
  .timeline > li .line {
    display: none;
  }
}
/* Custom, iPhone Retina */
@media only screen and (max-width: 767px) {
  .timeline>li:nth-child(even) .timeline-image {
    float:left;
    left: 0;
    margin-left: 0;
    }
  .timeline > li:nth-child(odd) {
    margin-bottom: 0px;
    min-height: 0px;
    left: 0px;
  }
  .timeline>li .timeline-image {
    position: static;
    width: 150px;
    height: 150px;
    margin-bottom:0px;
  }
  .timeline>li:nth-child(even) .timeline-image {
    left: 0;
    margin-left: 0;
  }
  .timeline>li:nth-child(odd) .timeline-image {
    float:right;
    left: 0px;
    margin-left:0;
  }
  .timeline > li:nth-child(even) .timeline-panel {
    width: 100%;
    padding: 0 0 20px 14px;
  }
  .timeline > li:nth-child(odd) .timeline-panel {
    width: 100%;
    padding: 0 14px 20px 0;
  }
  .timeline > li .line {
    display: none;
  }
}

/*Logic end for zigzag timeline*/

/* Toolbox css */ 
.toolbox a:visited {
	color: #003471; /*Dark Blue*/
}
.toolbox a:link {
	 color: #003471; /*Dark Blue*/
}
.toolbox a:active {
    color: #003471 !important; /*Dark Blue*/
}
/* End toolbox css */
