/* ================   RESET HTML   ==================================*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video { border: 0; font-size: 100%; font: inherit; vertical-align: baseline; margin: 0; padding: 0; }
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display: block; }
/* ================   RESET HTML   ==================================*/

/* ================   FONTS   ==================================*/
@font-face {
    font-family: 'AlrightSans-Regular';
    src:    url('../fonts/alrightsans/AlrightSans-Regular.otf?');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'AlrightSans-Light';
    src:    url('../fonts/alrightsans/AlrightSans-Light-v3.otf?');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'icomoon';
    src:    url('../fonts/icomoon/icomoon.eot?zfi1ii');
    src:    url('../fonts/icomoon/icomoon.eot?zfi1ii#iefix') format('embedded-opentype'),
        url('../fonts/icomoon/icomoon.ttf?zfi1ii') format('truetype'),
        url('../fonts/icomoon/icomoon.woff?zfi1ii') format('woff'),
        url('../fonts/icomoon/icomoon.svg?zfi1ii#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-youtube:before {
  content: "\f167";
}
.icon-ticket:before {
  content: "\f145";
}
.icon-angle-right:before {
  content: "\f105";
}
.icon-angle-left:before {
  content: "\f104";
}
.icon-comments-o:before {
  content: "\f0e6";
}
.icon-comment-o:before {
  content: "\f0e5";
}
.icon-rotate-left:before {
  content: "\f0e2";
}
.icon-undo:before {
  content: "\f0e2";
}
.icon-pinterest:before {
  content: "\f0d2";
}
.icon-bars:before {
  content: "\f0c9";
}
.icon-navicon:before {
  content: "\f0c9";
}
.icon-reorder:before {
  content: "\f0c9";
}
.icon-facebook:before {
  content: "\f09a";
}
.icon-facebook-f:before {
  content: "\f09a";
}
.icon-twitter:before {
  content: "\f099";
}
.icon-book:before {
  content: "\f02d";
}
.icon-tag:before {
  content: "\f02b";
}
.icon-unlock:before {
  content: "\f09c";
}
.icon-folder-open:before {
  content: "\f07c";
}
.icon-folder:before {
  content: "\f07b";
}
.icon-lock:before {
  content: "\f023";
}
.icon-user:before {
  content: "\f007";
}
.icon-shopping-cart:before {
  content: "\f07a";
}
.icon-instagram:before {
  content: "\f16d";
}
.icon-paypal:before {
  content: "\f1ed";
}
.icon-map-o:before {
  content: "\f278";
}
.icon-basket:before {
  content: "\f291";
}
.icon-checkopen:before {
  content: "\e915";
}
.icon-checkmark:before {
  content: "\e600";
}
.icon-cross:before {
  content: "\e914";
}
.icon-minus:before {
  content: "\e913";
}
.icon-plus:before {
  content: "\e912";
}
.icon-cloud-check:before {
  content: "\e911";
}
.icon-cloud-upload:before {
  content: "\e910";
}
.icon-cloud-download:before {
  content: "\e90f";
}
.icon-key:before {
  content: "\e90c";
}
.icon-bubble2:before {
  content: "\e909";
}
.icon-database:before {
  content: "\e908";
}
.icon-mic:before {
  content: "\e906";
}
.icon-film:before {
  content: "\e905";
}
.icon-music:before {
  content: "\e904";
}
.icon-camera:before {
  content: "\e903";
}
.icon-images:before {
  content: "\e902";
}
.icon-image:before {
  content: "\e901";
}
.icon-pencil:before {
  content: "\e900";
}

/* ================   END FONTS   ==================================*/



/* ===============     BASE ELEMENTS   ==================== */
*,*:before,*:after{
box-sizing:border-box;
/*-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
transition: all .3s ease;*/
}
body,html {
margin:0;padding:0;
}
body{background-color: #f7f7f6;color: #595959;font-size: 100%;line-height: 23px;font-family: 'AlrightSans-Regular','Open Sans', Arial, Helvetica, 'Nimbus Sans L', sans-seriff;box-sizing: border-box;font-weight:100;-webkit-transition: all .3s ease;-moz-transition: all .3s ease;transition: all .3s ease;}
a {
border: none;
text-decoration: none;
color:inherit;
}
a:focus {
outline: none;
}
a, a:link, a:visited{color:#19c3e9;}
/*a { color: #0067ac; text-decoration: none; }*/
a:hover {color: inherit; text-decoration: none;}
a { outline: 0; }

blockquote,.blockquote{
border-left: 6px solid #b8d7da;
padding-left: 18px;
margin: 30px 50px;
font-style: italic;
line-height: 26px;
color: #939598;
font-size: 16px;
}
blockquote strong,.blockquote strong {
color: #ef4035;
display: block;
width: 100%;
text-align: right;
}
img, video {max-width: 100%;height: auto;}
img.resp{
    width:100%;
}
iframe{z-index: 0;}

.note-editor{min-height: 500px;}

.alignright{float:right;}
.alignleft{float:left;}
.center{text-align: center;}
.italic{font-style:italic;}
.quote{font-size:1.3rem;color:#7b7b7b;font-family:'Times';letter-spacing: 0px;font-weight: 100;}
.nudge{padding:0 30px;}
.nudge-right{padding-right:30px;}
.nudge-left{padding-left:30px;}
img,video,iframe{max-width: 100%;}
.button, button, a, div, li {
    -webkit-transition: background-color ease .3s;
    -moz-transition: background-color ease .3s;
    transition: background-color ease .3s;
}

code {
  font: 12px Monaco,"Courier New","DejaVu Sans Mono","Bitstream Vera Sans Mono",monospace;
  color: #52595d;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  border: 1px solid #ccc;
  background-color: #f9f9f9;
  padding: .5em!important;
  /* display: inline-block; */
  line-height: 2em;
  width: 70%;
  /*white-space: initial;*/
}
#hideme{display:none;}
form[action*="pagedesign"] #hideme{display: block;}
/* ===============     END BASE ELEMENTS   ==================== */




/* ===============     GRID ELEMENTS   ==================== */

.wrapper{max-width: 1200px;width: 94%;margin:0 auto;position: relative;}

.flex-row {
  border:none!important;
  border-collapse:collapse;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  clear: both;
  /* height: 100%; */
  /* padding: 2% 0 0; */
  }
.row:after, .section:after {
  clear: both; 
  display: table; 
  content: ''; 
  }

.test [class*="col"]:nth-child(odd){/* background-color: #ccc; */}
.test [class*="col"]{/* background-color: #E5E5E5; */color:black;padding: 1rem;/* margin-bottom:10px; */}
.tight [class*="col"]{margin:0;width:25%;position: relative;}


[class*="col"]:last-child,[class*="col"].last{margin: 0; }
.grid1 [class*="col"]{float: left; margin: 0 1% 0 0; }
.grid0 [class*="col"]{float: left;margin: 0;}
.grid3 [class*="col"],[class*="col"]{float: left;margin: 0 3% 0 0;/* float: none; *//* width: 100%; */border-collapse:collapse;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;overflow: visible;}

/*Based on 3% margin */
.grid3 .col1,.col1  { width: 5.578%; }
.grid3 .col2,.col2 { width: 14.16%; }
.grid3 .col3,.col3 { width: 22.75%; }
.grid3 .col4,.col4 { width: 31.33%; }
.grid3 .col5,.col5 { width: 39.5%; }
.grid3 .col6,.col6 { width: 48.5%; }
.grid3 .col7,.col7 { width: 57.5%; }
.grid3 .col8,.col8 { width: 65.6%; }
.grid3 .col9,.col9 { width: 74.2%; }
.grid3 .col10,.col10 { width: 82.8%; }
.grid3 .col11,.col11 { width: 91.4%; }
.grid3 .col12,.col12 { width: 100%; margin: 0; }

/*Based on 1% margin */
.grid1 .col1 {width: 7.33% }
.grid1 .col2 {width: 15.65% }
.grid1 .col3 {width: 24% }
.grid1 .col4 {width: 32.3% }
.grid1 .col5 {width: 37% }
.grid1 .col6 {width: 49% }
.grid1 .col7 {width: 61% }
.grid1 .col8 {width: 65.7% }
.grid1 .col9 {width: 74% }
.grid1 .col10 {width: 82.3% }
.grid1 .col11 {width: 90.6% }
.grid1 .col12 {width: 98.8%; margin: 0 }

/*Based on 0% margin */
.grid0 .col1 {width: 8.33%;}
.grid0 .col2 {width: 16.66%;}
.grid0 .col3 {width: 24.99%;}
.grid0 .col4 {width: 33.33%;}
.grid0 .col5 {width: 39.5% }
.grid0 .col6 {width: 50%;}
.grid0 .col7 {width: 60.5%;}
.grid0 .col8 {width: 66.6%;}
.grid0 .col9 {width: 75%;}
.grid0 .col10 {width: 83.3%;}
.grid0 .col11 {width: 91.6%;}
.grid0 .col12 {width: 99.8%; margin: 0 }

@media only screen and (max-width:960px){
.mobile-two [class*="col"].last{margin:0 3% 0 0;}
.mobile-two .col4 {width: 47%;float: left;}
.mobile-two.grid0 .col4 {width: 50%; float: left; }
.mobile-two.grid1 .col4 {width: 49%; float:left;}
#standard [class*="col"]{float: none;width: 100%;}

}
@media only screen and ( max-width: 600px ){
  [class*="col"],[class*="grid"] [class*="col"],.mobile-two [class*="col"]{float: none;width: 100%;}
}
/* ===============     END GRID ELEMENTS   ==================== */



/* ===============     MENUS ELEMENTS   ==================== */

/*^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^     
MENU STYLES
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ */
ul.inline li{display:inline;font-size:0;}
ul.inline li > a{font-size:initial;display:inline-block;color: #606467;text-decoration: none;/* text-transform: uppercase; */font-size: 12px;font-weight: 100;display: inline-block;padding: 20px;}
ul.inline.alignright{float:none;text-align:right;}
ul.inline.alignright li.logo a{position:absolute;left:0;}
ul.bar li:after {content: '';height: 20px;background: #606467;width: 1px;top: -15px;position: absolute;}
ul.bar li:last-child:after{display:none;}
ul.border li a{border-bottom:1px solid rgba(255,255,255,0.06);}
ul.social li a{font-size:20px;padding:10px;}

ul.menu {
    background-color: white;
}

ul.menu li{
display: inline;
}

ul.menu li > a{ display:block; padding:12px;}
ul.menu li:hover ul,
ul.menu ul li:hover ul{display:block;}


ul.menu ul li a {
padding-left: 20px;
display:block;
}

ul.menu ul {
    display: none;
    background-color: #F0F0F0;
}

ul.menu ul ul {
    display: none;
    background-color: #FCFFFF;
    /*padding-left:20px;*/
}
ul.menu li:hover > a {
    background-color: #4BD4FF;
    color: white;
}

ul.menu ul ul li a {
    padding-left: 30px;
}

.pagination li a.active {
    background: #4BD4FF;
    color: white;
}
/* ===============     END MENU ELEMENTS   ==================== */




/* ===============     TYPOGRAPHY ELEMENTS   ==================== */
p.split2,.split2 {
     -webkit-column-count: 2;
     -moz-column-count: 2;
     column-count: 2;
     -webkit-column-rule-color: #cccccc; /* Chrome, Safari, Opera */
     -moz-column-rule-color: #4D4D4D;
     column-rule-color: #ccc;
     -webkit-column-rule-style: solid; /* Chrome, Safari, Opera */
     -moz-column-rule-style: solid;
     column-rule-style: solid;
     -webkit-column-rule-width: 1px; /* Chrome, Safari, Opera */
     -moz-column-rule-width: 1px;
     column-rule-width: 1px;
     -webkit-column-gap: 40px;
     -moz-column-gap: 40px;
     column-gap: 40px;
}
p.split3 {
     -webkit-column-count: 3;
     -moz-column-count: 3;
     column-count: 3;
     -webkit-column-rule-color: #4D4D4D; /* Chrome, Safari, Opera */
     -moz-column-rule-color: #4D4D4D; 
     column-rule-color: #4D4D4D;
     -webkit-column-rule-style: solid; /* Chrome, Safari, Opera */
     -moz-column-rule-style: solid;
     column-rule-style: solid; 
     -webkit-column-rule-width: 1px; /* Chrome, Safari, Opera */
     -moz-column-rule-width: 1px; 
     column-rule-width: 1px; 
     -webkit-column-gap: 40px;
     -moz-column-gap: 40px;
     column-gap: 40px;
}
.firstcharacter,
p.dropcap:first-letter { 
float: left; 
color: #35928F; 
font-size: 75px; 
line-height: 60px; 
padding-top: 4px; 
padding-right: 8px; 
padding-left: 3px; 
font-family: Georgia; }


h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
hr {
position: relative;
font-size: inherit;
line-height: normal;
}
h1, h2, h3, h4, b {
    font-weight: 300;
    font-family: 'AlrightSans-Regular', Arial, Helvetica, 'Nimbus Sans L', sans-serif;
    /* padding-bottom: 30px; */
    color: #00bce7;
    padding: 12px 0;
    display: block;
    width: 100%;
    line-height: normal;
}
h1 {font-size: 36px;font-weight: 600;}
h2 {
    font-size: 24px;
}
h3{font-size:20px;}
b {
    font-weight: 500;
    font-size: 16px;
    
    color: #c3522f;
}

p {color: inherit;line-height: 2em;font-weight: inherit;padding-bottom: 15px;}
/* ===============     END TYPOGRAPHY ELEMENTS   ==================== */


/* ===============     LISTS ELEMENTS   ==================== */

ul,li,ol{ list-style-position: inside;}
ul.plain{list-style: none;padding-left:15px;}
ul li a{padding:6px 0;display:block;/* font-family: 'Open Sans', Arial, Helvetica, 'Nimbus Sans L', sans-serif; */font-weight: 100;font-weight: normal;font-style: normal;text-transform: none;text-decoration: none;}


/* ===============     FORM ELEMENTS   ==================== */

form {
margin: 0 0 20px;
}

fieldset {
padding: 0;
margin: 0;
border: 0;
}

legend {
display: block;
width: 100%;
padding: 0;
margin-bottom: 20px;
font-size: 21px;
line-height: 40px;
color: #333333;
border: 0;
border-bottom: 1px solid #e5e5e5;
}

legend small {
font-size: 15px;
color: #999999;
}

label,
input,
button,
select,
textarea {
font-size: 14px;
font-weight: normal;
line-height: 20px;
}

input,
button,
select,
textarea {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

label {
/*display: block;*/
margin-bottom: 5px;
}
label.lbl_required:after{
  content:'*';
  color:red;
}
select,
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
width:100%;
display: inline-block;
height: 30px;
padding: 4px 6px;
margin-bottom: 10px;
font-size: 14px;
line-height: 20px;
color: #555555;
vertical-align: middle;
-webkit-border-radius: 4px;
 -moz-border-radius: 4px;
      border-radius: 4px;
}



textarea {
height: auto;
}
select,
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
font-family: 'AlrightSans-Light';
  background-color: #ffffff;border: 1px solid #cececf;-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);-webkit-transition: border linear 0.2s, box-shadow linear 0.2s;-moz-transition: border linear 0.2s, box-shadow linear 0.2s;-o-transition: border linear 0.2s, box-shadow linear 0.2s;transition: border linear 0.2s, box-shadow linear 0.2s;}

textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
border-color: rgba(82, 168, 236, 0.8);
outline: 0;
outline: thin dotted \9;
/* IE6-9 */

-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
 -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
      box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
}

input[type="radio"],
input[type="checkbox"] {
margin: 4px 0 0;
margin-top: 1px \9;
*margin-top: 0;
line-height: normal;
}

input[type="file"],
input[type="image"],
input[type="submit"],
input[type="reset"],
input[type="button"],
input[type="radio"],
input[type="checkbox"] {width: auto!important;cursor: pointer;}

select,
input[type="file"] {
height: 30px;
/* In IE7, the height of the select element cannot be changed by height, only font-size */

*margin-top: 4px;
/* For IE7, add top margin to align select with labels */

line-height: 30px;
}

select {border: 1px solid #cfd0d0;line-height: normal;/* -webkit-appearance: none; *//* -moz-appearance: none; */
/* appearance: none; */height: 40px;}


select[multiple],
select[size] {
height: auto;
}

select:focus,
input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus {
outline: thin dotted #333;
outline: 5px auto -webkit-focus-ring-color;
outline-offset: -2px;
}
input.donateBtn {
    border: none;
    padding: 12px 20px;
    background-color: #00bce7;
    color: white;
    text-transform: uppercase;
    border-radius: 4px;
    text-align: center;
    display: inherit;
    margin: 0 auto;
}


/* custom buttons  */
.custom label.clipped{
 white-space:nowrap;
}
.custom label {
    display: inline-block;
    position:relative;
    padding: .4rem 1rem;
    color: #000;
    border: 1px solid #e6e6e6;
    border-radius: 6px;
    cursor:pointer;
    display:inline-block;
    left:0;margin-bottom:1rem;
    padding:.865rem .865rem .865rem 2.7rem;
    position:relative;top:0;overflow: hidden;}
.custom label::before {
    background: #f3f2e8;
    content: '';
    display: block;
    height: 100%;
    width: 40px;
    position: absolute;
    left: 0;
    top: 0;
}
.custom label::after {background:transparent;border:2px solid #333;border-right:none;border-top:none;content:"";height:6px;left:17px;opacity:.25;position:absolute;top:22px;transform:rotate(-45deg);transition:opacity 100ms ease-in;width:12px;}

.custom input[type="radio"] + label::after {background: #ffffff;border-radius:100%;content:"";height:14px;left:16px;opacity: 1;position:absolute;top:19px;transition:opacity 100ms ease-in;width:14px;border: 0;}

.custom label:hover::after,
.custom input[type="radio"] + label:hover::after { opacity:.5; }

.custom input[type="checkbox"]:checked + label::after,
.custom input[type="radio"]:checked + label::after {opacity:1;border-color: #ffffff;}

.custom input[type="checkbox"]:checked + label::before, 
.custom input[type="radio"]:checked + label::before,
.custom input[type="radio"]:checked + label,
.custom input[type="checkbox"]:checked + label{
    background: #00bce7;
    color:white;
    border-radius: 5px;
}

.custom input[type="checkbox"],
.custom input[type="radio"]{ display:none; }

/* ========  MINI DONATION LAYOUT ============*/
.custom label{
  font-size:1.2vw;
  background-color: white;
}
@media only screen and (max-width:940px){

}
/* === TRIBUTE LAYOUT ===*/

.show-tribute #tribute{display:block;}
#tribute {display: none;}

/* === RECURRING LAYOUT ===*/

.show-recurring #recurring{display:block;}
#recurring {display: none;}

/* ===============     CARD ELEMENTS   ==================== */
.square {
  /* border: 5px solid red; */
  position: relative;
  text-align: center;
  width: 34vw;
  height: 25vw;
  float:left;
  margin-right: 0px;
  overflow:hidden;
  background-color: #424555;
}
.square .content h1{font-size: calc(100% - .5vw);}
.square .content img{width:100%;}
.square .content p{font-size: calc(100% - 1.3vw);position:absolute;bottom:0;/* display: none; */color: white;}
.content {
  font-size: 2em;
  padding-top: 2%;
}

/*  */
.cta {
    padding: 3rem 2rem;
    color: white;
    background-color:#3b3d4a;

}
.cta h1{font-size:1rem;color:white;}
.cta p{text-align:center;}
.cta a{color: #ffffff;display: inline-block;text-align:center;padding:12px;border: 2px solid #fff;border-radius:3px;}
.cta a:hover{background-color:white;color:initial}
/*  */
.card {
    background: #fff;
    border: .1rem solid #efefef;
    border-radius: .3rem;
    display: block;
    margin: 0 0 1rem 0;
    padding: 0;
    text-align: left;
    z-index: 0;
    position: relative;
}
.card [class*="card-"]:nth-child(2).card-image{padding-top:1.2rem;}
.card-header,.card-body{padding: 1.2rem 1.2rem 0;}
.card-body p.clipped-1{width: 100%;overflow:hidden;white-space: nowrap;text-overflow: ellipsis;margin: 0 auto;}
.card-body p.clipped-2, .clipped-2 p{display: block;display: -webkit-box;max-width: 400px;height: 43px;margin: 0 auto;line-height: 1.3;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;}

.card-title {
    font-size: 1.4em;
    line-height: 1;
    margin-bottom: .5rem;
    margin-top: 0;
    padding: 0;
    color:initial;
}

.card-meta{
    color: #b3b3b3;
    font-size: 1em;
    margin-bottom: 0;
    margin-top: 0;
    padding: 0;
    }
.card-footer{padding: 0 1rem 1rem 1rem;}
.card-footer .btn{display:block;margin-top:8px;}
.card.horz {
    margin: 0 0 2rem 0;
    /* overflow: hidden; */
}
.card.horz .card-image img{display:block;}
.card.horz .card-image{
    margin: 0;
    background-size: cover !important;
    background-position: 50% 50% !important;
    overflow: hidden;
    position: relative;
}
.card.horz .card-body{padding:1.2rem;}
.card.horz .card-image .card-title {
    background: black;
    padding: 1.2rem;
    position: absolute;
    bottom: 1.2rem;
    /* width: 23%; */
    color: white;
}


@media screen and (max-width:800px){
  .card.horz .card-image .card-title{position: relative;bottom: auto;margin: 0;}
}
.show-video .video-overlay{opacity:1;}
.video-overlay {
    position: absolute;
    z-index: 9;
    width: 100%;
    height: 100%;
    top: 0;
    opacity: 0;
    transition:opacity ease .3s;
}
#article .card-image.video.show-video:after {display:none;}
#article .card-image.video:after {
    content:'';
    width: 100%;
    height:120px;
    display:block;
    background: url(/file/webdev/img/play-icon.png) no-repeat center;
    position:absolute;
    z-index:99;
    top: 30%;
}
.video-overlay iframe {
    width: 100%;
    height: 100%;
}

.btn {
  -webkit-appearance: none;
  background: transparent;
  border: .1rem solid #19c3e9;
  border-radius: .3rem;
  color: #19c3e9;
  cursor: pointer;
  display: inline-block;
  line-height: 1.6rem;
  outline: 0;
  padding: .7rem 1.5rem;
  text-align: center;
  text-decoration: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  vertical-align: middle;
  white-space: nowrap;
}

.btn:focus {
  background: #f3f4fb;
}
.btn:hover {
  background: #19c3e9;
  border-color: #19c3e9;
  color: #fff;
}
.btn:active,
.btn.active {
  background: #19c3e9;
  border-color: #19c3e9;
  color: #fff;
}



/* ===============     TABLE ELEMENTS   ==================== */
.seagreen {
    background: #4ad8c8; /* Old browsers */
    background: -moz-linear-gradient(-45deg,  #4ad8c8 0%, #60bad1 86%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg,  #4ad8c8 0%,#60bad1 86%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg,  #4ad8c8 0%,#60bad1 86%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4ad8c8', endColorstr='#60bad1',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.seagreen,.seagreen #navigation ul ul{} 
.orange {
    background-color: #e2985b;
background: #e2985b; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #e2985b 0%, #e8cd84 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #e2985b 0%,#e8cd84 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #e2985b 0%,#e8cd84 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2985b', endColorstr='#e8cd84',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}

.teal {
    background-color: #2ea294;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#2ea294+0,58d8a9+100 */
background: #2ea294; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #2ea294 0%, #58d8a9 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #2ea294 0%,#58d8a9 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #2ea294 0%,#58d8a9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2ea294', endColorstr='#58d8a9',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}
.midnight{
      /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#3b3d4a+0,afdbcd+100 */
    background: #3b3d4a; /* Old browsers */
    background: -moz-linear-gradient(-45deg,  #3b3d4a 0%, #605d75 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg,  #3b3d4a 0%,#605d75 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg,  #3b3d4a 0%,#605d75 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3b3d4a', endColorstr='#605d75',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}
.midnight,.midnight #navigation ul ul{background-color:#3b3d4a;} 
.midnight #navigation ul li > a{color:white;} 

.blanc,.blanc #navigation ul ul {
    background: white;
}
.blanc #navigation li > a{color:initial;}

/* ===============     TABLE ELEMENTS   ==================== */

table {
  border-collapse: collapse;
  border-spacing: 0;
  margin:1.3rem 0;
  width: 100%;
  margin: 0;
}
table tbody tr:nth-of-type(odd) {
/*   background: #fcfcfc; */
}
table tbody tr:hover,table tbody tr.selected {
/*   background: #f2f2f2; */
}
table th,
table td {/*   border-bottom: .1rem solid #efefef; */padding: 0;text-align: left;vertical-align: top;}
table th {
  border-color: #c9c9c9;
}


#header .page-title p {
    position: relative;
    width: 60%;
    padding: 2.3rem;
    font-size: 1.7rem;
    text-align: center;
    color: #00667b;
    font-weight: 500;
    line-height: normal;
    margin: 0 auto;
}
/*==========  HEADER =============*/
header#mast-head {
    z-index: 999;
    position: relative;
}
header#mast-head h1.logo {
    margin: 0;
    padding: 11px;
    font-weight: 500;
    font-size: 18px;
    color: rgb(255, 86, 75);
}

#header .caption h4, #header .caption h1 {
color: rgb(69, 98, 109);
font-size: 1rem;
line-height: 1rem;
}


/*==========  HERO =============*/
.fixedtop #hero{margin-top: 55px;}
#hero{
  background-size:cover;
  background-repeat:no-repeat;
  min-height: 300px;
  line-height: 0;
}
.hero-caption {
    position: relative;
    margin: 0 20%;
    margin-top: -10rem;
    /* background: white; */
    margin-bottom: 4rem;
}
/*==========  CONTENT =============*/
#content {
    min-height: 500px;
    background: white;
    display: block;
    padding: 2rem;
}
.article{
    background-color: white;
    padding: 20px;
    margin-bottom: 20px;
}
.titlearea {
    position: relative;
    margin-top: -7rem;
    margin-bottom: 2rem;
    margin-left: -1rem;
    background: white;
    padding: 1rem;
}
#starkey input.donateBtn {
    border: none;
    padding: 12px 20px;
    background-color: #00bce7;
    color: white;
    text-transform: uppercase;
    border-radius: 0;
    text-align: center;
    display: inherit;
    margin-top: 2rem;
}
.mail-a-letter-on-my-behalf label.lbl_required:after {display:none;}
/*==========  FOOTER =============*/
#footer{
  background-color: #ffffff;
  font-weight:100;
  padding: 30px 0;
}
#footer ul li{list-style:none;}
#footer ul li:hover a{color:white;}
#footer h1{
  color:white;
  font-size:1rem;
  font-weight:400;
  text-transform:uppercase;
  margin: 0 0 1rem 0;
  padding: 0;
}
#footer .credits{margin: 0 8rem;}
#footer .credits img {margin: 1rem;}
#footer .credits p{font-size:14px;line-height: 20px;color: black;}
#hero,#footer {
    /* min-height: 300px; */
}





#navigation{position:relative;}
.fixedtop #navigation .logo a {
    z-index: 9;
    position: fixed;
    top: 0;
    left: 0;
    left: 0;
    background: rgba(233, 233, 229, 0);
    color: #4bd4ff;
    text-transform: uppercase;
    width: 300px;
}
#navigation .logo img {display: block;}
#header {
    position: relative;
    display: block;
    width: 100%;
    top: 0;
    z-index: 99;
    background: white;
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.13);
}
/*  Fixed Header styles */
.fixedtop #header {
    position: fixed;
    display: inline-block;
    width: 100%;
    top: 0;
    z-index: 99;
    /* background: rgba(59, 61, 74, 0.47); */
}

.fixedtop #navigation li a {color: inherit;text-decoration: none;display: inline-block;padding: 18px;/* font-family: 'Montserrat', Arial, Helvetica, 'Nimbus Sans L', sans-serif; */font-size: 12px;line-height: 20px;font-weight: 700;font-style: normal;text-transform: uppercase;}
#navigation li:hover > a,#navigation li > a.active{background-color: rgba(0, 0, 0, 0.24);color:white;}
.fixedtop #navigation li {display: inline;padding:0;position:relative;/* width: 300px; */}
.fixedtop #navigation ul li:hover ul {display:block;}
.fixedtop #navigation ul{margin:0;padding:0;}
.fixedtop #navigation ul ul {position: absolute;border: none;margin:0;padding:0;width:300px;display: none;z-index: 800;left: 0;text-align: left;/* border-left: 1px solid #ccc; *//* border-right: 1px solid #ccc; *//* border-bottom: 1px solid #ccc; */}
.fixedtop #navigation ul > li:last-child:hover ul{text-align: right;right:0;left:auto;}
.fixedtop #navigation ul ul > li a {
display:inline-block;
width:100%;
}


/* SIDE MENU STYLES */
#navigation li.active a,#navigation li.selected a {
    background: #FF564B;
    color: white;
}
#mast-head.sidenav  {
z-index: 900;
position: fixed;
background-color: #121d21;
 top: 0; 
 bottom: 0; 
height: 100%;
}
#mast-head.fixed {
    position: fixed;
    left: 0;
    right: 0;
    z-index: 99;
}
.sidenav #navigation {
background-color: #445E68;
position: relative;
top: 0;
bottom: 0;
height: 100%;
width: 110px;
overflow: hidden;
}
.sidenav #navigation ul {
margin: 0;
padding: 0;
}
.sidenav #navigation ul ul {
position: fixed;
background-color: #9AC0CE;
margin: 0;
padding: 0;
z-index: 0;
overflow: hidden;
/* left value must be same as conatiner width */
left: 110px;
height: 100%;
width:0;
top: 0;
bottom: 0;
}
.sidenav #navigation li {
display: inline;
padding: 0;
}
.sidenav #navigation li a {
color: white;
text-decoration: none;
display: block;
padding: 15px;
}
.sidenav #navigation ul li:hover ul {
display: block;
width:200px;
}
.sidenav #container {
width: 900px;
margin: 0 auto;
margin-left: 120px;
}

#mobilebuttons{display: none;}
.pagination {
display: block;
padding-left: 0;
margin: 0 auto;
border-radius: 4px;
width: 337px;
}
.pagination li {
display: inline;
}
.pagination>li>a, .pagination>li>span {
position: relative;
float: left;
padding: 6px 12px;
margin-left: -1px;
line-height: 1.42857143;
text-decoration: none;
background-color: #fff;
border: 1px solid #ddd;
}

/*
    MOBILE BUTTON
*/

.menu-toggle span, .menu-toggle span:after, .menu-toggle span:before {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background-color: #161A21;
    height: 3px;
    -webkit-transition: all .3s;
    transition: all .3s;
    width: 20px;
    position: absolute;
    top: 4px;
    left: 10px;
}
.menu-toggle span:after, .menu-toggle span:before {
    content: '';
    left: 0;
    position: absolute;
    top: -6px;
}
.menu-toggle span:after {
    top: 6px;
}
.menu-toggle {
    display: block;
    position: fixed;
    right: 45px;
    top: 20px;
    padding: 30px;
    z-index: 99;
}

.open .menu-toggle span:before {
    -webkit-transform: rotate(45deg)translate(3px,3px);
    -ms-transform: rotate(45deg)translate(3px,3px);
    transform: rotate(45deg)translate(3px,3px);
}
.open .menu-toggle span:after {
    -webkit-transform: rotate(-45deg)translate(5px,-6px);
    -ms-transform: rotate(-45deg)translate(5px,-6px);
    transform: rotate(-45deg)translate(5px,-6px);
}
.open .menu-toggle span{background-color: transparent;}

.mobile-btn {
    display: none;
}


/* ===============     MEDIA QUERIES   ==================== */




/* *********************************************************************************************************************
* Small devices
*/
@media all and (max-width: 800px) {
    ul.bar li:after{display:none;}
    .mobile-btn,.flex-row-row {display: block;}
    .open .menu-toggle span:after, .open .menu-toggle span:before{background-color: #fff;}

    .open.fixedtop div#navigation {right:0;width: 200px;}
    .fixedtop div#navigation ul{margin-top: 60px;}
    .fixedtop #navigation ul ul{position:relative;margin:0;text-align:center;background-color:rgba(0, 0, 0, 0.16);width: auto;}
    .fixedtop div#navigation {
        position: fixed;
        top: 0;
        bottom:0;
        right:-230px;
        height:100%;
        /* overflow:hidden; */
        background: #3b3d4a;
        -webkit-transition:right ease .4s;
        -moz-transition:right ease .4s;
        transition:right ease .4s;
    }
    .fixedtop #navigation .logo{position: absolute;display: block;left: 0px;z-index: 9;height: 40px;width: 200px;margin: 0 auto;}
    .fixedtop div#navigation ul li a {
        display: block;
        color:white;
    }
    .fixedtop #header{
       position: fixed;
       box-shadow: none;
       height: 55px;
    }
}


@media all and (max-width: 400px) {
#content{padding:0;}
}





/* ===============     CUSTOM THEME ELEMENTS   ==================== */
#starkey #navigation .logo {
    float: left;
    margin: 1rem;
}

#starkey #navigation ul li a {
    color: #666666;
    font-family: 'Open Sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 18px;
    line-height: 1.2em;
    letter-spacing: 1px;
}
#starkey .designation-title{font-size:30px;margin:0;padding:0;font-family: 'AlrightSans-Light', Arial, Helvetica, 'Nimbus Sans L', sans-serif;}
#starkey .catalog-group{margin:2rem 0;}
#starkey #article{
  background:url(/file/webdev/img/background-diamond.png)center #f3f3f4;
  padding:2rem;
}
#starkey #article .card{background-color:transparent;border: 0;border-radius: 0;}
#starkey #article .card-title{padding-top:1rem;border-top:2px solid #00bce7;}
#starkey #article .card-body{padding: 0 0 0 1.2rem;}
#starkey #donate_button button:hover{
  background-color:#00667d;
}
#starkey #donate_button button {
    padding: .5rem 2rem;
    display: block;
    margin: 1rem auto;
    height: auto;
    vertical-align: middle;
    border: 0;
    background: #00bce7;
    color:white;
}
#starkey #donate_button button:after{/*     font-family:'FontAwesome'; */content:">>";position: relative;right: -8px;top: 0px;}
#starkey #donate_button button span{font-size:1.6rem;display: none;line-height: 0;position: relative;top: 2px;}
#starkey input[type="text"]{height:40px;}
/* === CART ICONS ===*/
.cart-btn {
    position: absolute;
    right: 0;
    top: 60px;
    z-index: 99;
    float: right;
}
.cart-btn a:before{margin-right:6px;font-size:2rem;}
.cart-btn a:after{
    content:attr(data-cartcount);
    color:white;
    background-color: #00bce7;
    position:absolute;
    display:block;
    border-radius:100%;
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: normal;
    top: 12px;
}
.cart-btn a{
    position:relative;
    padding: 1rem;
    color: #00667d;
}

/* === CARD OVERLAYS ===*/

.card:hover .card-overlay,.card.active_designation .card-overlay{opacity:1;}
.card-overlay {
    position: absolute;
    width: 100%;
    top: 0;
    opacity:0;
    background: rgba(0, 48, 96, 0.8);
    bottom: 0;
    left: 0;
    right: 0;
    transition: all .3s ease;
}
.overlay-content{
    position: absolute;
    top: 20%;
    width: 100%;
}
.card-overlay h4{color:white;font-size:1.7rem;}


/* === CARD COLORS ===*/

#starkey .navy .card{background-color:#003060; color:white}
#starkey .navy .designation-title{color:#003060;}
#starkey .royal .card{background-color:#0087cb; color:white}
#starkey .royal .designation-title{color:#0087cb;}
#starkey .sky .card{background-color:#00c2e8; color:white}
#starkey .sky .designation-title{color:#00c2e8;}

/* === CATALOG GROUP LAYOUT ===*/
h1.article-title {font-size: 18px; }
#article p {font-size: 14px; }
#starkey .catalog-group .card {
    text-align: center;
    line-height: 22px;
    border-radius:0;
    border:none;
    position: relative;
}
#starkey .catalog-group .card-title{color:white;font-weight: 100;font-family: 'AlrightSans-Light','Open Sans',sans-serif;font-size: 20px;}
#starkey .catalog-group .card-body {
    padding-top: 0;
    padding-bottom: 2rem;
}
div#otherinput{position:relative;width: 60%;display: block; margin:0 auto}
div#otherinput:before {content: '$';display: block;position: absolute;left: 10px;top: 10px;font-size: 20px;}
div#otherinput:after{content:'USD';position:absolute;right: 10px;top: 10px;display: block;}
div#otherinput input[type="text"]{padding-left: 24px;font-size: 20px;}

.recurring-options label,
.recurring-options span,
.recurring-options select {
    display:block;
    text-align:left;
    width: 100%;
    float: left;
}

@media only screen and (max-width:940px){
/*   #starkey #header{position:fixed;} */
/*   #starkey #header,#starkey .cart-btn {position:fixed;} */
  #starkey .cart-btn{width:100%;text-align:center;top:0;position: relative;}
  #starkey .cart-btn a{padding:0.5rem}
  #starkey #navigation .logo{display:block;width: 28%;position:relative;float: none;margin: 0rem auto;}
  #header .page-title p{font-size:1rem;position: relative;display:block;padding:.4rem;}
  #footer .credits{
    margin: 0 3rem;
  }
  #starkey #mini-donation .custom label{font-size:.8rem}
  #starkey #article .col6{width:100%;}
  #starkey #article .card-body{padding:0;}
  #starkey #article .card-image{margin-bottom:1rem;}


}
@media only screen and (max-width:760px){
    div#otherinput:before,div#otherinput:after {top: 24px;}
}
ul.social-share li a {
    padding:0;
    text-align:center;
}
ul.social-share span{
    color: #00bce7;
    font-size: 2rem;
    padding:1rem;
}
/* OVERRIDES BBNC */
div#validation {
    background: #fbe4e4;
    padding: 1rem;
    margin: 0 0 1rem;
}
span#spanTruePledgeEndingDate[style="display:none"] + span {display:none;}