﻿@import url(https://fonts.googleapis.com/css?family=Oxygen:400,300,700);

/*COLOR PALETTE
    LightBlue: #00ADEE;
    Blue: #0457a7; 4 87 167;
    Dark blue: #001d41
    Turquoise: #00C4CD; 0 196 205;
*/


/*----------BOOSTRAP OVERRIDE----------*/
.navbar-brand {max-width:220px; height:auto; padding:0 15px;}
.navbar {margin-bottom:0px; padding:10px;}
.navbar-default {border:none; background:#0457a7;}
.navbar-default .navbar-nav>li>a,.navbar-default .navbar-nav>li>a:hover,.navbar-default .navbar-nav>li>a:focus,.dropdown-menu li a {text-transform:uppercase; margin:0 8px; padding:8px 15px; color:#FFF;}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover {background-color:rgba(0,0,0,0.5); color:#FFF;}
.navbar-default .navbar-toggle .icon-bar {background-color:#FFF;}
.navbar-default .navbar-collapse, .navbar-default .navbar-form {border:none;}
/*navbar animation*/
.navbar-nav a {-webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; position: relative; -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; transition-duration: 0.3s;}
.navbar-nav a:before {content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: #00C4CD; -webkit-transform: scaleY(0); transform: scaleY(0); -webkit-transform-origin: 50% 100%; transform-origin: 50% 100%; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out;}
.navbar-nav a:hover:before, .navbar-nav a:focus:before, .navbar-nav a:active:before {-webkit-transform: scaleY(1);transform: scaleY(1);}

.panel, .panel-heading {border-radius:0 !important;}
.panel-default>.panel-heading a h2 {color:#FFF; font-size:24px; font-weight:300; font-style:italic;}
.panel-default>.panel-heading {background-color:#00C4CD; color:#FFF; position:relative; padding-right:60px;}
.panel-body {padding:20px;}
.panel-body li {margin-top:15px; margin-bottom:15px;}
.panel-default>.panel-heading .badge {width:35px; height:35px; position:absolute; right:15px; top:15px; background:#66dce1; border-radius:0; font-size:30px; font-weight:bold; text-align:center;}
.panel-default>.panel-heading .badge:after {content:'-';}
.panel-default>.panel-heading .collapsed .badge:after { content:'+'; }

.navbar-nav > li > .dropdown-menu {background:#0457a7; margin-top:10px;}

dl {margin-bottom:0;}
dt, dd {display:inline-block; vertical-align:top}
.dl-horizontal dt {width:auto;}
.dl-horizontal dd {margin-left:3px;}

.row {margin-bottom:10px;}
.container {padding:30px 15px;}
.bg-primary,.panel-primary>.panel-heading {background-color:#0457a7;}
.form-control,.input-group-addon {border-radius:0;}
.text-primary {color:#0457a7;}
.btn {border-radius:0; border:none;}
.btn-primarym.btn-primary:hover,.btn-primary:focus {background-color:#0457a7; color:#FFF;}
fieldset {margin-bottom:20px;}
.well {border-radius:0;}
.progress {border-radius:0;}
.progress-bar-success {background-color:#00C4CD;}
.modal-open { overflow-y: scroll; padding-right: 0 !important; }

/*----------FONT AWESOME OVERRIDE----------*/
.fa-stack {color:#FFF;}
.fa-inverse {color:#001d41;}
.fa-stack .fa-circle-thin:before {content: "";}
.fa-stack .fa-circle-thin {border:2px solid; border-radius:50%; height:1em;}

/*----------MAIN CSS----------*/
/*LAYOUT*/
body, html {height:100%; font-family:Arial,Helvetica,sans-serif;}
body {background:#001d41; overflow-y:scroll;}
#wrapper {min-height:calc(100% - 320px); background:#FFF; position:relative;}
#div-nav {position:fixed; top:0px; width:100%; z-index:1000;}
header {background:#00C4CD; padding:2.5px 15px; font-size:12px; color:#FFF; text-align:right;}
header a, header a:hover, header a:focus {color:#FFF;}
footer {background:#001d41; color:#FFF; padding:50px 15px; text-align:center; position:relative;}
footer>.container-fluid {opacity:0.5; transition: all 0.5s ease;}
footer>.container-fluid:hover {opacity:1;}
footer a, footer a:hover, footer .btn, footer .btn:hover,footer a:focus, footer .btn:focus {color:#FFF;}
footer .btn:hover {background:#00C4CD; transition: all 1s ease;}
footer .btn {margin:5px;}
.fullpage {background-position: top center; background-size:cover; height:100%; width:100%; position:absolute; background-color:#333;}
.fullpage-content {position:relative; z-index:2; padding:30px 0; padding-top:100px;}
.table-wrapper {display:table; width:100%;}
.table-cell {display:table-cell; vertical-align:middle;}
table {width:100%;}
.table-bordered{border:0px;}
.table-bordered>tbody>tr>td {border:10px solid #FFF; border-top:none;}
.table-bordered>tbody>tr>td.noLeftBorder {border-left:none;}
.table-bordered>tbody>tr>td.noRightBorder {border-right:none;}
section {padding:40px 5%; text-align:center; padding-top:100px;}
section h1, section h2, section h3 {color:#FFF;}
.icon-with-label {display:inline-block; text-align:center; margin-right:10px;}
.icon-with-label label {display:block; color:#FFF; margin-top:5px;}
.overlay-link {position:absolute; width:100%; height:100%; top:0; left:0; opacity:0; background:rgba(0,0,0,0.5); transition:.5s all ease; z-index:1;}
.overlay-link:hover {opacity:0.9;}
.overlay-link .circle {width:100%; height:100%; max-width:180px; max-height:180px; font-weight:bold; text-transform:uppercase; background:#FFF; border-radius:50%; color:#000; text-align:center; margin:0 auto; position:relative; top:50%; transform:translateY(-50%); -webkit-transform: translateY(-50%);}

/*PAGES*/
#div-home .table-wrapper {height:50vh;}
#div-home #form-joinSimple {max-width:460px;}
#div-home #form-joinSimple h1 {font-size:3.8em;}
#div-home #getInvolved .icon-with-label {min-width:100px;}
#div-join fieldset legend {margin-bottom:20px; color:#555;}
#div-action .box {border:1px solid #DDD; width:100%; margin-bottom:20px;}
#div-action .box-body {min-height:360px;}
#div-action .box-body h3 {margin-bottom:20px;}
#div-faqs .panel-primary, #div-membership .panel-primary {border:none;}
#div-faqs .panel-primary>.panel-body, #div-membership .panel-primary>.panel-body {padding:10px 0;}
#div-joinAdditional ul.nav {max-width: 450px; margin: 30px auto;}
#div-joinAdditional ul.nav li a {margin: 0 15px;}
#div-joinAdditional .fa.fa-4x {display: block;margin-bottom: 10px;}
#div-joinAdditional .page {display: none;}
#div-joinAdditional .page.active {display: block;}
#div-joinAdditional .well, #div-joinAdditional .alert {margin-bottom: 0;}
#div-joinAdditional #div_nav {margin-top: 30px;}
#div-joinAdditional #div_progress {margin-top: 20px;}
#page-marketPlace .parallax h1 {padding:60px 40px;}
#page-marketPlace h3 { margin:0; margin-top:10px; }

/*TEXT*/
h1, .h1 {font-size:4em;}
h2, .h2 {font-size:3em;}
h3, .h3 {font-size:2em;}
h1, h2, h3, h4, h5, .h1, .h2, .h3, .h4, .h5 {font-family:'Oxygen', sans-serif; font-weight:bold; margin-top:10px; margin-bottom:10px;}
h3, h4, h5, .h3, .h4, .h5 {font-weight:normal;}
label {font-weight:normal; color:#888;}
.txt-xlarge {font-size:6em;}
.txt-large {font-size:5em;}
.text-turquoise {color:#00C4CD;}
.text-white {color:#FFF;}
.text-shadow {text-shadow: 0 1px 3px rgba(0,0,0,0.3);}
.text-shadow-primary {text-shadow: 0 1px 3px rgba(4,87,167,0.3);}
select option:disabled {color: #ccc;}
h4 mark {line-height: 1.4em;}

/*BACKGROUNDS*/
.bg {background-size:cover; background-position:center center; padding:30px; color:#FFF; position:relative;}
.bg a,.bg a:hover,.bg a:focus {color:#FFF;}
.bg-turquoise {background-color:#00C4CD; color:#FFF;}
.bg-darkBlue {background-color:#001d41; color:#FFF;}
.bg-lightBlue {background-color:#00ADEE; color:#FFF;}

/*BUTTONS*/
.btn-donate,btn-donate:hover,btn-donate:focus {background:#FFF !important; color:#001d41 !important;}
.active>.btn-donate,.active>.btn-donate:hover,.active>.btn-donate:focus {background:#00C4CD !important;}
.btn[disabled], .btn[disabled]:hover, .btn[disabled]:focus {background:#AAA;}
.btn, a {opacity:1;}
.btn:hover, a:hover,.btn:focus, a:focus {opacity:0.9; text-decoration:none;}
.btn-xl {font-size:25px; padding:15px; font-weight:bold;}
.btn-white {background:#FFF; color:#001d41 !important;}
.btn-transparent,.btn-transparent:hover,.btn-transparent:focus {border:1px solid; color:initial;}
.btn-turquoise, .btn-turquoise:hover, .btn-turquoise:focus {background-color:#00C4CD; color:#FFF;}
.btn-hero, .btn-hero:hover, .btn-hero:focus {background:#0457a7; text-align:left; padding:20px 15px; position:relative; color:#FFF;}
.btn-hero .btn-hero-go {position:absolute; right:0px; top:0; height:100%; background:#00ADEE; padding:20px;}
.btn-hero.active {background:#CCC; cursor:default;}
.btn-hero.active .btn-hero-go {background:#BBB;}
.btn-yellow {background:#ffcf00; color:#0077bc !important; font-weight:bold;}

/*MISC*/
.parallax {background-position:center 0; /*background-attachment:fixed;*/ background-size:cover; background-color:#333;}
.box {background:#FFF;}
.box .box-heading {background:#0457a7; padding:15px; text-align:center; color:#FFF;}
.box .box-body {padding:30px;}
.square {padding:5% 15px; width:30%;}
.box-text {padding:30px;}
@keyframes fadein { from {opacity:0;}to {opacity:1;}}
@-webkit-keyframes fadein { from {opacity:0;} to {opacity:1;}}
@keyframes fadeout { from {opacity:1;}to {opacity:0;display:none;}}
@-webkit-keyframes fadeout { from {opacity:1;} to {opacity:0;display:none;}}
@keyframes slidein { from {margin-top:-200px;}to {margin-top:0;}}
@-webkit-keyframes slidein { from {margin-top:-200px;}to {margin-top:0;}}
.clickable {cursor: pointer}

/*SWEETALERT OVERRIDE*/
body.stop-scrolling { overflow-y: scroll !important; }

/*EVENTS*/
a.date[href] {display: block; cursor: pointer;}
a.date[href]:hover {box-shadow: inset 0 0 100px rgba(0,0,0,0.2); color: #FFFFFF;}
#div-events .eventrow {margin-top: 2em;}
#div-events .Jan ~ .Jan,
#div-events .Feb ~ .Feb,
#div-events .Mar ~ .Mar,
#div-events .Apr ~ .Apr,
#div-events .May ~ .May,
#div-events .Jun ~ .Jun,
#div-events .Jul ~ .Jul,
#div-events .Aug ~ .Aug,
#div-events .Sep ~ .Sep,
#div-events .Oct ~ .Oct,
#div-events .Nov ~ .Nov,
#div-events .Dec ~ .Dec {margin-top: 0;}