@charset "UTF-8";
/* CSS Document */


.dan-menu {
    position:relative;/* need this for the overlay */
    border:1px solid #999;
    border-radius: 3px;
    font-family: 'Roboto', sans-serif!important;
} 



.dan-menu-title {
    font-size: 1.375rem;
    font-weight: 700;
    line-height: 26px;
    display:block;
    padding: 10px;
    cursor: pointer;
}    


.dan-menu .dan-menu-title span {
    color: #006272;
    float: right;
}     


.drop-down {
    position: absolute; /* make the dan-menu overlay content below it */
    left: -1px; 
    top: 100%;
    width: 100.5%;
    max-height: 0;
    overflow:hidden;
}    


.drop-down-menu {
    display: block;
}    


 /* Links  */
.dan-menu a {
    display: block;
    padding: 3px;
}    


/* Both Title and links */
.dan-menu a, label {
    text-decoration: none;
}


.activate {
    display: none;
    position: absolute;
    cursor: pointer;
    width: 100%;
    height: 40px;
    margin: 0 0 0 -15px;
    opacity: 0;
}


.dan-menu a {
    color: black;
}    


.drop-down {
    background: rgba(255, 255, 255, 0.9);
    outline:1px solid #999;
    outline-offset: -1px;
    outline-radius: 5px;        
    color: black;
}    


.offsetter {padding: 0 8px 0 16px}


.drop-down a {
    margin: 10px 0;
    padding: 3px 7px;
}    


.drop-down a:hover {
    font-weight: 700;
    color: #006272!important;
    box-shadow: -4px 0 0 0 #006272;
    padding-left: 10px;
}


.activate:checked ~ .drop-down {
    max-height: 1000px; 
}


.drop-down, .dan-menu a, .drop-down-menu {
    -webkit-transform: translateZ(0);  
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}   







/* Bouncing Arrow Icon */    
.bounce {
    width:15px;
    height:15px;
    display: block;
    -moz-animation: bounce 3s infinite;
    -webkit-animation: bounce 3s infinite;
    animation: bounce 3s infinite;
}


@-moz-keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        -moz-transform: translateY(0);
        transform: translateY(0);
    }
    40% {
        -moz-transform: translateY(-8px);
        transform: translateY(-8px);
    }
    60% {
        -moz-transform: translateY(-4px);
        transform: translateY(-4px);
    }
}


@-webkit-keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        -webkit-transform: translateY(0);
         transform: translateY(0);
    }
    40% {
        -webkit-transform: translateY(-8px);
        transform: translateY(-8px);
    }
    60% {
        -webkit-transform: translateY(-4px);
        transform: translateY(-4px);
    }
}


@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    40% {
        -moz-transform: translateY(-8px);
        -ms-transform: translateY(-8px);
        -webkit-transform: translateY(-8px);
        transform: translateY(-8px);
  }
     60% {
        -moz-transform: translateY(-4px);
        -ms-transform: translateY(-4px);
        -webkit-transform: translateY(-4px);
        transform: translateY(-4px);
    }
}



/* Arrow Controls */
.text-wrapper {display: inline-block}

.flip-arrow {
    display:inline-block;
    -webkit-transition:.125s;
    -moz-transition:.125s;
    -o-transition:.125s;
    -ms-transition:.125s;
    transition:.125s;
}


input[name='accordion-1'] ~ .flip-arrow {
 transform: rotate(0deg);
 -o-transform: rotate(0deg);
 -ms-transform: rotate(0deg);
 -webkit-transform: rotate(0deg);
 } 


input[name='accordion-1']:checked ~ label .flip-arrow {
    /* rotate arrow */
    color:#f08f21;
    transform: rotate(-180deg);
    -o-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg);
    margin-top: 12px;
 }    


/* Solid ball ordered list */
.circled-numbers {
    list-style: none;
    margin: 0 0 0 43px;
    text-indent: -43px;
}


.circled-numbers li {
    counter-increment: circle-counter;
    margin-bottom: 0.5rem;
}


.circled-numbers li:before {
    content: counter(circle-counter);
    width: 2rem;  /* Circle */
    height: 2rem;  /* Circle */
    border-radius: 50%; /* Circle */
    display: inline-block; /* Circle & text */
    font-size: 1.25rem; /* Text in Circle */
    line-height: 2rem; /* Text in Circle */
    color: white; /* Text in Circle */
    text-align: center; /* Text in Circle */
    margin-right: 10px; /* Text in Circle */
    text-indent:0; 
    background-color: #006272;
}


.circled-numbers li:last-child {
    margin-bottom: 0;
}




/* various */
.light-blue-back {background: #e5eff1}
.fake-h2 {font-size: 20px; line-height: 24px;}