/*
Theme Name: Maws
Author: SWD
Author URI: https://swd.ca
Description: Maws Custom Made Design
Version: 1.0
*/

/**
 * 1.0 - Normalize
 *
 * Normalizing styles have been helped along thanks to the fine work of
 * Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
 */

html {-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin:0; padding:0; }
body {margin: 0; padding:0; background-color: #fff; font-family: 'Laila', serif; color: #050708; font-size: 18px; text-rendering: optimizeLegibility; overflow-x: hidden;}
*, *:before, *:after {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}

.clearfix:before, .clearfix:after {content: " "; display: table;}
.clearfix:after {clear: both;}
 

article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary {display: block;}
audio, canvas, progress, video {display: inline-block; vertical-align: baseline;}
audio:not([controls]) {display: none; height: 0;}
[hidden], template {display: none;}

abbr[title] {border-bottom: 1px dotted;}
small {font-size: 80%;}
sub, sup {font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}
img {border: 0;}
svg:not(:root) {overflow: hidden;}
figure {margin: 0;}
hr {-webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box;}
code, kbd, pre, samp {font-size: 1em;}
button, input, optgroup, select, textarea {color: inherit; font: inherit; margin: 0;}
select {text-transform: none;}
button {overflow: visible;}
button, input, select, textarea {max-width: 100%;}
button, html input[type="button"], input[type="reset"], input[type="submit"] {-webkit-appearance: button; cursor: pointer;}
button[disabled], html input[disabled] {cursor: default; opacity: .5;}
button::-moz-focus-inner, input::-moz-focus-inner {border: 0; padding: 0;}
input[type="checkbox"], input[type="radio"] {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-right: 0.4375em; padding: 0;}
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {height: auto;}
input[type="search"] {-webkit-appearance: textfield;}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}
fieldset {border: 1px solid #d1d1d1; margin: 0 0 1.75em; padding: 0.875em;}
fieldset > :last-child {margin-bottom: 0;}
legend {border: 0; padding: 0;}
textarea {overflow: auto; vertical-align: top;}
optgroup {font-weight: bold;}

/*=============================================================================== WP ALIGNMENTS ===============================================================================*/

.alignleft {float: left; margin: 0.375em 1.75em 1.75em 0;}
.alignright {float: right; margin: 0.375em 0 1.75em 1.75em;}
.aligncenter {clear: both; display: block; margin: 0 auto 1.75em;}

/*=============================================================================== FLEXIBLE EMBEDS ===============================================================================*/

embed, iframe, object, video {margin-bottom: 0; max-width: 100%; vertical-align: middle;}
p > embed, p > iframe, p > object, p > video {margin-bottom: 0;}
.entry-content .wp-audio-shortcode a, .entry-content .wp-playlist a {box-shadow: none;} 
.wp-audio-shortcode, .wp-video, .wp-playlist.wp-audio-playlist {margin-top: 0; margin-bottom: 1.75em;}
.wp-playlist.wp-audio-playlist {padding-bottom: 0;}
.wp-playlist .wp-playlist-tracks {margin-top: 0;}
.wp-playlist-item .wp-playlist-caption {border-bottom: 0; padding: 0.7142857143em 0;}
.wp-playlist-item .wp-playlist-item-length {top: 0.7142857143em;}


/*=============================================================================== CAPTIONS STYLE ===============================================================================*/

.wp-caption {margin-bottom: 1.75em; max-width: 100%;}
.wp-caption img[class*="wp-image-"] { display: block; margin: 0;}
.wp-caption .wp-caption-text {color: #686868; font-size: 13px; font-size: 0.8125rem; font-style: italic; line-height: 1.6153846154; padding-top: 0.5384615385em;}


/*=============================================================================== GALLERIES STYLE ===============================================================================*/

.gallery {margin: 0 -1.1666667% 1.75em;}
.gallery-item {margin: 0 !important; display: inline-block; max-width: 33.33%; padding: 10px; text-align: center; vertical-align: top; width: 100%;}
.gallery-item img {border: 0 !important; width: 100%; height: auto;}
.gallery-columns-1 .gallery-item {max-width: 100%;}
.gallery-columns-2 .gallery-item {max-width: 50%;}
.gallery-columns-4 .gallery-item {max-width: 25%;}
.gallery-columns-5 .gallery-item {max-width: 20%;}
.gallery-columns-6 .gallery-item {max-width: 16.66%;}
.gallery-columns-7 .gallery-item {max-width: 14.28%;}
.gallery-columns-8 .gallery-item {max-width: 12.5%;}
.gallery-columns-9 .gallery-item {max-width: 11.11%;}
.gallery-icon img {margin: 0 auto;}
.gallery-caption {color: #686868; display: block; font-size: 13px; font-size: 0.8125rem; font-style: italic; line-height: 1.6153846154; padding-top: 0.5384615385em;}
.gallery-columns-6 .gallery-caption,
.gallery-columns-7 .gallery-caption,
.gallery-columns-8 .gallery-caption,
.gallery-columns-9 .gallery-caption {display: none;}


/*=============================================================================== BASIC FORMATTING ===============================================================================*/
h1, h2, h3, h4, h5, h6 {margin:0; padding:0 0 20px 0; color: #404780; font-weight: 600; line-height: 1.2; font-family: 'Raleway', sans-serif;}

h1 {font-size: 60px; }
h2 {padding:0 0 80px 0; font-size: 55px;}
h3 {font-size: 35px;} 
h4 {font-size: 24px;}
h5 {font-size: 22px;}
h6 {font-size: 20px;}

p {margin: 0 0 1.75em; padding:0; font-size: 18px; line-height: 1.4;}

dfn, cite, em, i {font-style: italic;}

blockquote {margin:0; padding:0; z-index: 10; color: #fff;}
blockquote p {margin:0; padding:0; font-style: normal; font-size: 0.95em; line-height: 1.4; }
blockquote p strong {font-weight: 700;}

blockquote cite {display: block; margin:0; padding:20px 0 10px 0; font-size: 1em; font-weight: 900; font-style: normal; line-height: 1;}

address {font-style: normal; margin: 0; padding: 0; font-size: 0.875em; line-height: 1.6;}
address p {margin: 0; padding: 0; font-size: 0.875em; line-height: 2; font-weight: 400;}



code, kbd, tt, var, samp, pre {font-family: Inconsolata, monospace;}

pre {border: 1px solid #d1d1d1; font-size: 1em; font-size: 1rem; line-height: 1.3125; margin: 0 0 1.75em; max-width: 100%; overflow: auto; padding: 1.75em; white-space: pre; white-space: pre-wrap; word-wrap: break-word;}
code {background-color: #d1d1d1; padding: 0.125em 0.25em;}
abbr, acronym {border-bottom: 1px dotted #d1d1d1; cursor: help;}
mark, ins {background: #007acc; color: #fff; padding: 0.125em 0.25em; text-decoration: none;}
big {font-size: 125%;}

a {background-color: transparent; color: #404780;  cursor: pointer; text-decoration: none;}
a, a:hover, a:active, button, input[type="button"] {outline: 0; transition-property: all; transition-duration: 1s; transition-timing-function: ease-out;}
a:hover { text-decoration: none;}

a:focus {text-decoration: none; }
a:active {text-decoration: none;}

hr {margin:10px 0; padding:0; border: 0; height: 1px;  background-color: #404780;}

ul, ol {margin: 0 0 1.75em 1.25em; padding: 0;}
ul {list-style: none;}
ol {list-style: decimal; margin-left: 1.5em;}
li > ul, li > ol {margin-bottom: 0;}
dl {margin: 0 0 1.75em;}
dt {font-weight: 700;}
dd {margin: 0 0 1.75em;}

img {height: auto; max-width: 100%; vertical-align: middle;}

del {opacity: 0.8;}

table, th, td {border: 1px solid #d1d1d1;}
table {border-collapse: separate; border-spacing: 0; border-width: 1px 0 0 1px; margin: 0 0 1.75em; table-layout: fixed; width: 100%;}
caption, th, td {font-weight: normal; text-align: left;}
th {border-width: 0; font-weight: 700;}
td {border-width: 0;}
th, td {padding: 0.4375em;}

/*=============================================================================== FORMS ===============================================================================*/
/* Placeholder text color -- selectors need to be separate to work. */

::-webkit-input-placeholder {color: #686868;}
:-moz-placeholder {color: #686868;}
::-moz-placeholder {color: #686868; opacity: 1;}
:-ms-input-placeholder {color: #686868;}

.skip-link {
position: absolute;
top: -50px;
left: 0;
background: #000;
color: #fff;
padding: 8px;
z-index: 100;
text-decoration: none;
z-index: 9999; 
}
.skip-link:focus {
top: 0;
}

:focus {
outline: 2px solid #000;
outline-offset: 2px;
}




input {line-height: normal;}
label, .gfield_label {display: block; margin:10px 0 0 0; padding:0; font-size: 20px !important;  font-weight: 700 !important; }

.button, button, button[disabled]:hover, button[disabled]:focus, input[type="button"], input[type="button"][disabled]:hover, input[type="button"][disabled]:focus, input[type="reset"], input[type="reset"][disabled]:hover, input[type="reset"][disabled]:focus, input[type="submit"], input[type="submit"][disabled]:hover, input[type="submit"][disabled]:focus {margin:0 auto; padding:24px 46px !important; border: 0; background-color: #d12739; text-align: center; width: auto; line-height: 1; font-size: 20px; text-transform: uppercase; color: #fff;  transition-property: all; transition-duration: 1s; transition-timing-function: ease-out;  font-weight: 700; border-radius: 0 0 0 20px;}

a span.button, span.button a {padding: 10px 16px !important; color: #fff !important; text-decoration: none !important;}

.button:hover, button:hover, button:focus, input[type="button"]:hover, input[type="button"]:focus, input[type="reset"]:hover, input[type="reset"]:focus, input[type="submit"]:hover, input[type="submit"]:focus {background-color: #404780;}

select {display: inline-block !important; margin:0 0 10px 0 !important; padding: 4px 18px 4px 4px !important; height: auto !important; width: auto; line-height: 1.2; font-size: 18px !important; text-transform: uppercase;background: #fff; border: 1px solid #404780; color: #717171; appearance: none; /* this is must */ -webkit-appearance: none; -moz-appearance: none; background: #fff url('images/mockselect.jpg') right center no-repeat; font-weight: 400;}

button:focus, input[type="button"]:focus, input[type="reset"]:focus, input[type="submit"]:focus {outline: thin dotted; outline-offset: -4px;}

input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="tel"], input[type="number"], textarea {margin:0; padding: 8px !important; background: #fff; border: 2px solid #404780; color: #000;  width: 100%; line-height: 1; font-size: 18px !important; border-radius: 0 0 0 10px;}

input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="number"]:focus, textarea:focus {border: 2px solid #d12739; outline: 0;}

.gform_wrapper ul.gform_fields li.gfield {margin-left: 0 !important; padding-left: 0 !important;}

/* ============================================================================
GENERAL STYLES 
===============================================================================*/
.container {margin: 0 auto; width: 100%; max-width: 1170px;}
section {padding: 40px 0; margin: 0 auto; width: 100%; max-width: 2560px;}

/* ============================================================================ 
HEADER STYLES
==============================================================================*/
header {margin:0; padding:0; position: absolute; top:0; left:0; width: 100%; z-index: 999;}
.admin-bar header {top: 30px;}
header .topMenu {margin: 0 auto; width: 100%; max-width: 2560px; padding:0; background-color: rgba(102,105,158,0.8);}
header .topMenu .top-menu  {margin:0.4rem 0; padding:0; display: inline-block; width: auto; float: right;}
header .topMenu .top-menu li {margin:0; padding:4px 0 0 10px; display: inline-block; position: relative;}
header .topMenu .top-menu li a {display: block; margin:0; padding:10px 5px; color:#fff; font-size: 20px; line-height: 18px; text-transform: uppercase; font-weight: 400; font-family: 'Kalam', cursive;}
header .topMenu .top-menu li.menu-item-180 a {margin: 0 0 0 10px; padding:10px 10px 6px; background-color: #be202e; font-weight: 700; border-radius: 0 0 0 10px;}

header .topMenu .crisisPhone {margin:0.2rem 0; padding:10px 0; color: #fff !important; font-size: 20px; line-height: 1; font-family: 'Raleway', sans-serif;}
header .topMenu .crisisPhone a {color: #fff !important; font-weight: 700;}

header .topMenu .social-menu {margin:0.4rem 0; padding:0; display: inline-block; width: auto; float: right;}
header .topMenu .social-menu li {margin:0 0 0 12px; padding:0; display: inline-block; width: auto;}
header .topMenu .social-menu li a {display: block; margin:0 !important; padding:0 !important; color: #fff; font-size: 0; width: 35px; height: 35px !important; border-radius: 50%; display: flex; justify-content: center; align-items: center;}
header .topMenu .social-menu li a i {margin: 0 auto !important; padding:0 !important;  font-size: 24px; color: #fff;}
header .topMenu .social-menu li:nth-of-type(1) a {background-color: #3973CE;}
header .topMenu .social-menu li:nth-of-type(2) a {background-color: #00abf1;}
header .topMenu .social-menu li:nth-of-type(3) a {
  background: #f09433; 
background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); 
background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f09433', endColorstr='#bc1888',GradientType=1 );
}


@media (min-width : 230px) and (max-width : 767px) {
header .topMenu {text-align: center;}
header .topMenu .top-menu  {margin:0.4rem auto; padding:0; display: inline-block; width: auto; float: none;}
header .topMenu .social-menu {margin:0.4rem auto; padding:0; float: none !important;}
 
 
}



/* ============================================================================
MAIN MENU STYLE 
===============================================================================*/
header nav {margin: 0 auto; width: 100%; max-width: 2560px; padding:10px 0 0;background-color: rgba(255,255,255,0.6);}
header nav .logo {margin:0; padding:0;}
header nav .logo a {display: block; margin:0; padding:0; width: 257px; height: 55px; background: transparent url('images/logo.png') no-repeat center center; background-size: 100% auto; text-indent: -9000px;}

.menu-main-menu-container {margin:0; padding: 0.5rem 0 0 0; text-align: right;}
header .primary-menu {margin:0; padding:0; display: inline-block; width: auto;}
header .primary-menu li {margin:0; padding:0 0 10px 20px; display: inline-block; position: relative; text-align: left;}
header .primary-menu li a {color: #050708; font-size: 20px; line-height: 1; text-transform: uppercase; font-weight: 700; font-family: 'Kalam', cursive;}

header .primary-menu li.current-menu-item:after {content:''; display: block; margin:4px auto; padding:0; width: 42px; height: 2px; background-color: #be202e;}
header .primary-menu li a:hover {border-bottom: 2px solid #be202e;}

header .primary-menu li .sub-menu {position: absolute; width: auto; top:38px; left: -9999px; margin:0; padding:14px 0; height: auto; z-index: 100; background-color: #404780; border-radius: 0 0 0 20px;}
li.menu-item-has-children:hover .sub-menu, li.menu-item-has-children[aria-expanded="true"] .sub-menu {left: 0;}
header .primary-menu li .sub-menu li {display: block; margin:0; padding:3px 0 !important; float: none; white-space: nowrap;}
header .primary-menu li .sub-menu li.current-menu-item:after {display:none;}
header .primary-menu li .sub-menu li a {display: block; margin:0; padding:5px 30px; font-size: 20px; border:0; font-weight: 400; color: #fff; text-transform: none;}
header .primary-menu li .sub-menu li a:hover {background-color: #050708; color:#fff;}

header .primary-menu li .sub-menu li .sub-menu {position: static; }

header .primary-menu li.current-menu-item a  {border-bottom: 2px solid #be202e;}

/* ============================================================================ 
HOME STYLE
==============================================================================*/

.heroImage {margin: 0 auto; width: 100%; max-width: 2560px; padding: 0; background-repeat: no-repeat; background-position: center top; background-size: cover; height: 870px;}
.heroImage h1 {margin: 53% auto 0; padding: 20px 10px 5px; width: 86%; text-align: center; background-color: rgba(64,71,128,0.8); color: #f7ed33; font-size: 80px; line-height: 1; border-radius: 0 0 0 30px; font-weight: 700; text-transform: uppercase; }


.informationPanel {margin: 0 auto; width: 100%; max-width: 2560px; padding: 20px 0 30px; background-color: #404780;}
.informationPanel p {margin:0; padding: 0; color: #f7ed33; font-size: 24px; line-height: 1.1; font-family: 'Raleway', sans-serif; font-weight: 600; text-align: center;}

.helpPanel h2 {margin:0; padding: 0; text-align: center; color: #050708; font-family: 'Raleway', sans-serif; font-size: 40px; font-weight: 700;}
.helpPanel p {margin:0; padding: 14px 0 40px 0; text-align: center; font-size: 20px; }

.helpPanel .span6 {padding-bottom: 30px; border-radius: 0 0 0 60px; min-height: 630px;}
.helpPanel .span6 img {position: relative; z-index: -1;}
.helpPanel .span6 h3 {margin:-45px 0 10px 0; padding:80px 0 0 0; text-align: center; background: url('images/purple-dove.png') no-repeat center top; text-transform: uppercase; font-size: 28px; position: relative; z-index: 50;}
.helpPanel .span6 ul {margin:0; padding: 0 0 0 30px;}
.helpPanel .span6 ul li {margin:0; padding: 0 0 10px 30px; font-size: 20px; line-height: 1; font-weight: 500; background: url(images/purple-drop.png) no-repeat left 5px;}
.helpPanel .span6 ul li a {display: inline-block; margin:0; padding:0 0 4px 0; width: auto !important; color: #000; border-bottom: 2px #999dbb solid;}


.getHelp {border: 6px solid #404780;}
.helpOthers {border: 6px solid #be202e;}
.helpOthers h3 {color: #be202e;}
.helpOthers ul li {background: url(images/red-drop.png) no-repeat left 5px !important;}
.helpOthers ul li a {border-bottom: 2px #dc8890 solid !important;}

.statsPanel {background-color: #a5c84e;}
.statsPanel h2 {margin:0; padding: 0 20% 40px; text-align: center; color: #050708; font-family: 'Raleway', sans-serif; font-size: 42px; font-weight: 700; line-height: 1; text-transform: uppercase;}

.statsBox {margin:0 0.5%; padding:20px; width: 19%; height: 152px;  float: left; background-color: #fff; border-radius: 20px; text-align: center; display: flex; justify-content: center; align-items: center; }
.statsBox h3 {margin:0; padding:0; font-size: 70px; line-height: 1; color: #404780; font-family: 'Kalam', cursive; font-weight: 700;}
.statsBox h3 small {display: block; margin:0; padding:0; font-family: 'Laila', serif; line-height: 1; font-weight: 700; font-size: 25px; color: #050708;}

.latestStuff {margin: 0 auto; width: 100%; max-width: 2560px; padding: 40px 0 80px;}
.latestStuff .alm-listing {display: grid; grid-template-columns: 1fr 1fr 1fr; grid-column-gap: 1rem; grid-row-gap: 1rem;}
.latestStuff .alm-listing article {max-width: 360px;}


.latestStuff h2 {margin:10px 0 10px 0; padding:0; color: #be202e; font-size: 30px; text-align: center;}
.latestStuff h2:before {content:''; display: inline-block; margin:0 0 -5px 0; padding:0; background: url('images/latest-icons.png') no-repeat 0 0; width: 48px; height: 35px;}
.latestStuff .news h2:before {background-position: 0 0;}
.latestStuff .events h2:before {background-position: -62px 0;}
.latestStuff .blog h2:before {background-position: -126px 0;}

.latestStuff h3 {margin:20px 0 10px 0; padding:0; color: #050708; font-size: 22px; line-height: 1; font-family: 'Raleway', sans-serif; font-weight: 700;}
.latestStuff h3 a {color: #050708;}
.latestStuff h3 small {display: block; margin:0; padding:10px 0 0 0; color: #404780; font-family: 'Laila', serif; font-weight: 700;}
.latestStuff p {margin:0 0 14px 0; padding:0; font-size: 19px; line-height: 1.3;}
.latestStuff a.view {display: inline-block; margin:0 12px 0 0; padding: 9px 14px 5px; background-color: #be202e; border-radius: 0 0 0 10px; color: #fff; font-family: 'Kalam', cursive; line-height: 18px; font-weight: 300; text-transform: uppercase; font-size: 19px; }
.latestStuff .span4 {margin: 2% 2% 0 0; padding:0; width: 31.33333333333333%; height: auto;}


/* begin media for smartphone --------------------------------------------------------------------------------------------------------------------- */
@media (min-width : 230px) and (max-width : 767px) {
      .latestStuff .alm-listing {grid-template-columns: 1fr;} 
      .latestStuff .alm-listing article {max-width: 100%;}
}




.sponsorSlider {margin: 0 auto; width: 100%; max-width: 2560px; padding: 24px 0; border: 14px solid #a5c84e; border-left: 0; border-right: 0;}
.sponsorSlider .flexslider {margin:0 !important; padding:0 !important; width: 100% !important;}
.sponsorSlider .slides {margin:0 !important; padding:0 !important;}
.sponsorSlider .slides li {margin:0; padding:0 15px; width: 292px !important; text-align: center !important; display: flex !important; justify-content: center !important; align-items: center !important; height: 140px;}
.sponsorSlider .slides li img {width: auto !important;height: auto !important;}




/* ============================================================================ 
INTERNAL PAGES
==============================================================================*/

.pageImage {margin: 0 auto; width: 100%; max-width: 2560px; padding:9.5% 0; background-repeat:no-repeat; background-position: center center; background-size: cover;}

.internalContent {margin: 0 auto; width: 100%; max-width: 2560px; padding:30px 0 100px;}
.internalContent h1 {margin:0; padding:0 0 30px; font-size: 38px; color: #050708; font-family: 'Raleway', sans-serif; font-weight: 700;}
.internalContent h1 small {display: block; font-size: 24px;}

.internalContent h2 {padding:0 0 30px;  font-size: 30px; color: #050708; font-family: 'Raleway', sans-serif; font-weight: 700;}
.internalContent h3, .internalContent h4, .internalContent h5, .internalContent h6 {padding:0 0 10px; font-size: 22px; color: #050708; font-family: 'Raleway', sans-serif; font-weight: 700;}
.internalContent h1 a, .internalContent h2 a, .internalContent h3 a, .internalContent h4 a, .internalContent h5 a, .internalContent h6 a {border-bottom: 0;} 

.internalContent p {font-size: 20px; line-height: 1.6;}
.internalContent a {border-bottom: 1px solid #66699e;}
.internalContent .noLine {border-bottom: 0 solid #fff;}
.internalContent a img {border-bottom: 0 solid #fff !important;}
.internalContent a[href$=jpg], .internalContent a[href$=jpeg], .internalContent a[href$=jpe], .internalContent a[href$=png], .internalContent a[href$=gif] {
border-bottom: 0 solid #fff !important;
	}

.internalContent ol, .internalContent  ul {margin:0; padding:0 0 30px 40px; font-size: 1.3em; line-height: 1.4;}

.internalContent ul li {position: relative; margin:0; padding: 0 0 0 30px; line-height: 1.8; font-size: 20px;}
.internalContent ul li:before {content:''; position: absolute; top: 8px; left: 0; display: block; margin:0; padding:0; width: 18px; height: 18px; background: url('images/purple-drop.png') no-repeat left center; }

#itemsLoop {padding-bottom: 80px;}

.memberShelter .span4 {margin:1%; padding:0; width: 31.33333333333333%; text-align: center; height: 270px;}
.memberShelter .span4 a {color: #000;}
.memberShelter .span4 h3 {margin-top: 20px; font-size: 18px;}
.memberShelter .span4 .shelterLogo {display: block; height: 130px; overflow: hidden; text-align: center; display: flex; justify-content: center; align-items: center; text-decoration: none !important; border: 0 !important;}


/* ============================================================================ 
FOOTER
==============================================================================*/

footer {margin: 0 auto; width: 100%; max-width: 2560px; padding:30px 0 0 0; background-color: #66699e; color: #fff; position: relative;}
footer a, footer h4 {color: #fff;}
footer .span4 p {margin:0; padding:0 0 10px 0; color: #fff; font-size: 14px; line-height: 1.8; font-weight: 400; letter-spacing: 1px;}
footer .span4 p.gross {font-size: 18px; letter-spacing: 0;}
footer .span4:nth-of-type(2) {text-align: center;}
footer .span4:nth-of-type(2) img {margin-bottom: 10px;}
footer .span4:nth-of-type(3) {text-align: right;}

footer .social-menu {margin:0; padding:0; display: inline-block; width: auto; float: right;}
footer .social-menu li {margin:0 0 0 12px; padding:0; display: inline-block; width: auto;}
footer .social-menu li a {display: block; margin:0 !important; padding:0 !important; color: #66699e; font-size: 0; width: 58px; height: 58px !important; border-radius: 14px; display: flex; justify-content: center; align-items: center;}
footer .social-menu li a i {margin: 0 auto !important; padding:0 !important;  font-size: 44px; color: #fff;}
footer .social-menu li:nth-of-type(1) a {background-color: #3973CE;}
footer .social-menu li:nth-of-type(2) a {background-color: #00abf1;}
footer .social-menu li:nth-of-type(3) a {
  background: #f09433; 
background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); 
background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f09433', endColorstr='#bc1888',GradientType=1 );
}








.donateButton a {display: inline-block; margin:0 12px 0 0; padding: 12px 14px 7px; background-color: #be202e; border-radius: 0 0 0 10px; color: #fff; font-family: 'Kalam', cursive; line-height: 18px; font-weight: 400; text-transform: uppercase; font-size: 21px; }

.copyrights {margin: 30px 0 0 0; padding: 0; background-color: #404780;}
.copyrights p {margin:0; padding:14px 0 !important; color: #fff; font-size: 18px; line-height: 1; font-weight: 300; text-align: center; }

.hideSite {z-index: 9999; position: fixed; bottom: 70px; left: -88px; width: 182px; height: 182px;} 
.hideSite a {display: block;  margin:0; padding:60px 14px 0 0; width: 182px; height: 182px; border-radius: 50%; background: url('images/exit_button.png') no-repeat center center; text-align: center; font-weight: 700; font-size: 30px; text-transform: uppercase; line-height: 1;}


#rchat__wrapper .rchat__launcher-btn {height: 150px !important;}

/* ============================================================================ 
CSS ANIMATIONS
==============================================================================*/

@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-ms-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

@-webkit-keyframes fadeOut { from { opacity:1; } to { opacity:0; } }
@-moz-keyframes fadeOut { from { opacity:1; } to { opacity:0; } }
@-ms-keyframes fadeOut { from { opacity:1; } to { opacity:0; } }
@keyframes fadeOut { from { opacity:1; } to { opacity:0; } }
 
#fade-in {
     opacity:0;  
   
   /* make things invisible upon start */
    -webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
    -moz-animation:fadeIn ease-in 1;
    animation:fadeIn ease-in 1;
 
    -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
    -moz-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
 
    -webkit-animation-duration:1s;
    -moz-animation-duration:1s;
    animation-duration:1s;
}

:root #fade-in { opacity:1 \0/IE9; }  /* IE9 */
 
#fade-in.first {
-webkit-animation-delay: 0.25s;
-moz-animation-delay: 0.25s;
animation-delay: 0.25s;
}
 
#fade-in.second {
-webkit-animation-delay: 0.5s;
-moz-animation-delay:0.5s;
animation-delay: 0.5s;
}
 
#fade-in.third {
-webkit-animation-delay: 1s;
-moz-animation-delay: 1s;
animation-delay: 1s;
}


 
.fade-out.first {
-webkit-animation-delay: 0.25s;
-moz-animation-delay: 0.25s;
animation-delay: 0.25s;
}
 
.fade-out.second {
-webkit-animation-delay: 0.5s;
-moz-animation-delay:0.5s;
animation-delay: 0.5s;
}
 
.fade-out.third {
-webkit-animation-delay: 1s;
-moz-animation-delay: 1s;
animation-delay: 1s;
}



/**
 *
=======================================================================================================================================================================================================
=======================================================================================================================================================================================================
======================================================================================== 14.0 - Media Queries =========================================================================================
=======================================================================================================================================================================================================
=======================================================================================================================================================================================================
 */

/* ============================================================================ 
HAMBURGER MENU
==============================================================================*/
#hamburgericonmenuwrapper {display: none; z-index: 10000; position: absolute; font-size: 16px;}

#hamburgerui {overflow: hidden; position: fixed; right: 0; top: 0; z-index: 9999; width: 100%;}
#hamburgerui ul {margin: 0; padding: 10px; list-style-type: none; width: 100%; background: #404780; height: 60px;}
#hamburgerui li {display: block; margin: 0; padding:0; width: 50%; float: left;}
#hamburgerui li a.toggleButton {float: right; display: block; width: 40px; height: 40px; position: relative; text-decoration: none; margin: 0; padding: 10px 20px; color: white; outline: none;   -webkit-transition: all 0.5s; transition: all 0.5s;}
#hamburgerui li .logoMobile {margin:0; padding:0; float: left; width: 40px; height: 40px; background: transparent url('images/logo-no-bg.png') no-repeat center center; text-indent: -9000px; background-size: auto 100%;}
#hamburgerui li:last-of-type a:after{content: 'Menu'; visibility: hidden;}
#hamburgerui li a:visited {color: white;}
#hamburgerui li a:hover{background: #404780;}

#navtoggler{display: block; position: absolute; top: 50%; left: 50%; font-size: 8px; width: 4em; height: 2.5em; padding: 0; text-indent: -1000px; border: 0.6em solid white; border-width: 0.6em 0; cursor: pointer; -webkit-transform: translate3D(-50%, -50%, 0); transform: translate3D(-50%, -50%, 0); -webkit-transition: all 0.3s ease-in; transition: all 0.3s ease-in;}
#navtoggler::before, #navtoggler::after{content: ""; display: block; position: absolute; width: 100%; height: 0.6em; top: 50%; margin-top: -0.3em; left: 0; background: white;  -webkit-transition: all 0.3s ease-in; transition: all 0.3s ease-in;}

/* ###### CSS for Full Screen Menu NAV ###### */
.menu-mobile-menu-container {width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: #404780; padding-top: 80px; z-index: 1; visibility: hidden; overflow: auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transform: translate3D(0, -100%, 0); transform: translate3D(0, -100%, 0);  -webkit-transition: -webkit-transform 0.5s, visibility 0s 0.5s; transition: transform 0.5s, visibility 0s 0.5s;}
.menu-mobile-menu-container ul {margin: 0; padding: 0; list-style: none; width: 100%; position: relative; font-weight: bold; font-size: 2.5em; text-transform: uppercase; -webkit-transform: translate3D(0, -40px, 0); transform: translate3D(0, -40px, 0); opacity: 0; transition: all 0.5s 0.4s;}
.menu-mobile-menu-container ul li {width: 100%; display: inline; text-align: center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-bottom: 2px;}
.menu-mobile-menu-container ul li a { text-decoration: none; position: relative; color: white;padding: 10px 5px; font-size: 16px; display: block; -webkit-transition: background 0.3s; transition: background 0.3s;}
.menu-mobile-menu-container ul li a:hover { background: #be202e;}
.menu-mobile-menu-container ul li a:hover:after {width: 100%;}

/* #### Menu Hamburger Icon UI when shrinked CSS ######## */
#hamburgerui.shrink li:nth-last-of-type(n+2) a{opacity: 0; pointer-events: none;}

/* #### Menu Opened State CSS ######## */
#hamburgericonmenuwrapper.open .menu-mobile-menu-container{visibility: visible; -webkit-transform: translate3D(0, 0, 0);  transform: translate3D(0, 0, 0); -webkit-transition: -webkit-transform 0.5s; transition: transform 0.5s;}
#hamburgericonmenuwrapper.open #navtoggler{ border-width: 0;}
#hamburgericonmenuwrapper.open #navtoggler::before{-webkit-transform: rotate(-45deg); transform: rotate(-45deg); /* rotate line to create "x" */}
#hamburgericonmenuwrapper.open #navtoggler::after{-webkit-transform: rotate(45deg); transform: rotate(45deg); /* rotate line to create "x" */}
#hamburgericonmenuwrapper.open #hamburgerui li:nth-last-of-type(n+2) a{ opacity: 0; pointer-events: none;}
#hamburgericonmenuwrapper.open .menu-mobile-menu-container ul{ opacity: 1; -webkit-transform: translate3D(0, 0, 0); transform: translate3D(0, 0, 0); /* restore UL to original positon */}


/* begin media for smartphone */
@media (min-width : 230px) 
and (max-width : 767px) {

body {overflow-x: hidden;}
 
section {padding:40px 0;}
.container {margin: 0; padding: 0 10px;}	
.row-fluid [class*="span"], .row-fluid [class*="span"]:first-child {margin:0; padding:0;  width: 100%;}
.row-fluid [class*="span"]:first-child {margin-left: 0;} 
 
.heroImage {display: none !important;}


header .logo {margin: 1rem 0 1.5rem !important; padding:0; float: none; width:250px; height: 50px; text-align: center;}

header {margin:60px 0 0 0; padding:0; position: static;}
header .topMenu .top-menu  {margin:0; padding:0; display: inline-block; width: auto; float: none;}
header .topMenu .crisisPhone {margin:0; padding:10px 0; color: #fff !important; font-size: 18px; line-height: 1.2; text-align: center;}
 header .topMenu .menu-social-menu-container {display: none;}
.f-nav{position: static !important; } 
 /* ============================================================================
MAIN MENU STYLE 
===============================================================================*/
 .menu-main-menu-container {display: none;}
#hamburgericonmenuwrapper {display: block !important;}
 
/*.menu-item-has-children a {display: none !important;}*/   
.menu-item-has-children .sub-menu {display: none;}	
/*.menu-item-has-children .sub-menu li a {display: block !important;} */

header .primary-menu {margin:0; padding:0; width: 100%; float: none;}
header .primary-menu li {margin:0; padding:0; display: block; width: 100%;}
header .primary-menu li a {display: block; margin: 0; padding: 14px; color: #fff; font-size: 20px; line-height: 1.2; text-transform: uppercase; font-weight: 600; border: 0 !important;}

header .primary-menu li .sub-menu {display: none; position: static; width: 100%; top:auto; left:0; margin:0; padding:0; height: auto; z-index: 9999999; background-color:  transparent;}
header .primary-menu li .sub-menu li {display: block; margin:0; padding:0 !important; float: none; white-space: normal;}
header .primary-menu li .sub-menu li a {display: block; margin:0; padding:14px; font-size: 20px; color: #fff; border: 0 !important;}





h1 {font-size: 46px; }
h2 {padding:0 0 20px 0; font-size: 36px;}
h3, h3 a {font-size: 30px;} 
h4 {font-size: 24px;}
h5 {font-size: 22px;}
h6 {font-size: 20px;}

/* ============================================================================ 
HOME STYLE
==============================================================================*/
.informationPanel p {font-size: 20px; line-height: 1.3;}


.helpPanel .span6 {margin-bottom: 20px !important; padding-bottom: 40px !important;  min-height: auto !important;}
.helpPanel .span6 ul {margin:0; padding: 0 0 0 10px;}
.helpPanel .span6 ul li {margin:0; padding: 0 0 10px 30px; font-size: 20px; line-height: 1.3;}


.statsPanel h2 {font-size: 32px;}

.statsBox {margin:20px auto; width: 224px; float: none;}
.statsBox .counter {margin:0; padding:0; font-size: 70px; line-height: 1; color: #404780; font-family: 'Kalam', cursive; font-weight: 700;}
.statsBox p {margin:0; padding:0; font-family: 'Laila', serif; line-height: 1; font-weight: 700; font-size: 25px;}
.statsBox:nth-of-type(1) {padding-top: 30px;}

.latestStuff {padding: 40px 0 80px;}

.latestStuff .span4 {margin: 25px 0; padding:0; width: 100%; height: auto !important;}


footer .span4:nth-of-type(2) img {margin: 30px auto 10px;}
footer .span4:nth-of-type(3) {margin-top: 30px; text-align: left;}

.social-menu {margin:0; padding:0; display: inline-block; width: auto; float: left;}


.hideSite {display: none;} 
	
.memberShelter .span4 {margin-bottom: 30px !important; height: auto !important;}	
 
 footer {padding: 30px 0 127px 0;} 
	
}
/* end media for smartphone */




/* iPads (portrait) ----------- */
@media (min-width : 768px) 
and (max-width : 1024px) 
and (orientation : portrait) {

body {overflow-x: hidden;}
.container {margin: 0; padding: 0 10px;}	

header .topMenu .crisisPhone {font-size: 16px;}
header .topMenu .top-menu li {padding: 4px 0 0 2px;}	
header .topMenu .top-menu li a {font-size: 16px;}
    
header nav .logo {width: 210px; height: 46px;}	   
.menu-main-menu-container {padding: 12px 0 0 0;}
header .primary-menu li {padding: 0 0 0 10px;}        
header .primary-menu li a {font-size: 16px;}    
    
.heroImage h1 {margin: 78% auto 0; font-size: 57px;}   
    
.statsPanel h2 {padding: 0 2% 40px;}    
.statsBox .counter {font-size: 50px;}    
.statsBox p {font-size: 18px;}   
    
    
    
    
    
    
    
    
    
    
    
}
/* end iPads (portrait) ----------- */




/* iPads (landscape) ----------- */
@media (min-width : 768px) 
and (max-width : 1024px) 
and (orientation : landscape) {

body {overflow-x: hidden;}
.container {padding:0 20px;}
	




    
.heroImage h1 {font-size: 63px;}    
    
.statsPanel h2 {padding: 0 12% 40px;}	

.statsBox .counter {font-size: 60px;}    
.statsBox p {font-size: 22px;}    
 header .primary-menu li a {font-size: 20px;}      
	
}
/* end iPads (landscape) ----------- */