/*---------------------------------
	BLOCKQUOTES
-----------------------------------*/
blockquote { font-size: 1.5em; line-height: 1.5em; font-style: italic; margin: 30px 30px 30px 0; padding: 0 0 0 20px; border-left: 1px solid #ccc; }
blockquote span { font-size: 0.7em; display: block; }
blockquote.small { font-size: 1.0em;  line-height: 1.2em ; margin: 30px 10px 30px 30px;}

.testimonial_quote blockquote {font-size: 1.3em; line-height: 1.5em;}
.testimonial_name {text-align: right; font-weight:bold;}
.testimonial_company {text-align: right} 

.team_quote {font-size: 1.2em; line-height: 1.5em; margin: 30px 5% 30px 5%; padding: 0 0 0 3%; ;}
blockquote.team_quote::before {
  content: open-quote;font-size: 4.5em;
    color: #ccc;
    position: relative;
    left: -70px;
    top: 30px;
    margin-right: -34px;
}
/*---------------------------------
	LISTS
-----------------------------------*/
ul, ol { padding: 0; margin: 10px 8px 20px 60px; }
li { padding: 5px 0; margin: 0; }
ul.list-unstyled { padding: 0; margin: 0 0 20px 0; }
ul.list-unstyled li { padding: 5px 0; margin: 0; list-style-type: none; }
ol { padding: 0; margin: 10px 8px 20px 60px; }
ol ol li {list-style:lower-alpha;}
ul.check { list-style: none; }
ul.check li { padding: 10px 0; margin: 0 0 0 60px; font-size: 1.2em;max-width: 900px; }
ul.check li:before { color: green; font-weight: bold; content: '\2714\0020'; margin-left: -30px; font-size: 2rem; }

/*---------------------------------
	TABLES
-----------------------------------*/
table { width: 100%; margin: 0 0 10px 0; text-align: left; border-collapse: collapse; }
thead, tbody { margin: 0; padding: 0; }
th, td { padding: 7px 10px; font-size: 0.9em; border-bottom: 1px dotted #ddd; text-align: left; }
thead th { font-size: 0.9em; padding: 3px 10px; border-bottom: 1px solid #ddd; }
tbody tr.last th, tbody tr.last td { border-bottom: 0; }
/* striped */
table.striped { }
table.striped tr.alt { background: #f5f5f5; }
table.striped thead th { background: #fff; }
table.striped tbody th { background: #f5f5f5; text-align: right; padding-right: 15px; border-right: 1px dotted #e5e5e5; }
table.striped tbody tr.alt th { background: #efefef; }
/* tight */
table.tight { }
table.tight th, .tight td { padding: 2px 10px; }
/* sortable */
table.sortable { border: 1px solid #ddd; }
table.sortable thead th { cursor: pointer; position: relative; top: 0; left: 0; border-right: 1px solid #ddd; }
table.sortable thead th:hover { background: #efefef; }
table.sortable span.arrow { border-style: solid; border-width: 5px; display: block; position: absolute; top: 50%; right: 5px; font-size: 0; border-color: #ccc transparent transparent transparent; line-height: 0; height: 0; width: 0; margin-top: -2px; }

table.sortable span.arrow.up { border-color: transparent transparent #ccc transparent; margin-top: -7px; }

/*
MISC
*/
#FAQs{padding: 0 5% 30px;}
.question{ padding: 12px 12px 12px 40px; border-bottom: 1px silver dashed; font-size: 1.15em; cursor:pointer; background:url(../icons/addIcon.svg) no-repeat;  background-position:left; color:#000; }
.questionE{ padding: 12px 12px 12px 40px; border-bottom: 1px silver dashed; font-size: 1.15em; cursor:pointer; background:url(../icons/closeIcon4.svg) no-repeat;  background-position:left; color:#000; font-weight: bold; }
small {display: inline-block; line-height: 1.1em;}
.answer{ display:none; padding: 10px 12px 10px 5%; background:  #f5f5f5; border-radius: 6px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); margin-bottom:40px;   }
div.multiColumn { padding: 1em 0 0 0; -moz-column-count: 2; -moz-column-gap: 20px; -webkit-column-count: 2; -webkit-column-gap: 20px; column-count: 2; column-gap: 20px; -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; }
div.multiColumn4 { padding: 1em 0 0 0; -moz-column-count: 4; -moz-column-gap: 20px; -webkit-column-count: 4; -webkit-column-gap: 20px; column-count: 4; column-gap: 20px; -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; text-align: center; }
.multiColumn li, .multiColumn4 li { -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; }
.multiColumn4 ul { list-style: none; }
.multiColumn4 a { text-decoration: none; color: #036; font-size: 1.2em; }
.roundnum { float: left; display: inline-block; background: #15007f; color: #fff; -webkit-border-radius: 15px; border-radius: 15px; /*    font: 500 16px/16px 'Raleway';*/ width: 30px; height: 30px; text-align: center; margin-left: -38px; }

/* NAV BAR*/
.navbar { position: fixed; top: 0; left: 0; width: 100%; background: #000; color: #fff; z-index: 1000; }
.navbar #logo { position: absolute; top: 0; right: 0; padding: 0.5em 1em; font-size: 1.7em; color: #efefef; text-decoration: none; }
.navbar span { color: #86dc00; }
.navbar ul { display: inline-block; margin: 0; padding: 0; }
.navbar li { margin: 0; padding: 0; list-style-type: 0; display: inline-block; }
.navbar li a { display: inline-block; color: #efefef; padding: 1em 1.3em; text-decoration: none; text-transform: uppercase; line-height: 100%; font-size: 1.2em; }
/* callout*/
.callout { background: var(--calloutBG);/*#86dc00;*/ padding:5% 15%; color: #fff;  text-align: center; text-shadow: 0px 1px 3px rgba(0,0,0,0.2); display: block; }

.callout.CTA {  background-color: #485bc5; 
  background-blend-mode: multiply;    
  background-size: cover;
  background-position: bottom;
background-attachment: fixed;
}
.boxPaddingSmall {padding: 30px 20px}
.callout + div.grid { margin-top: 50px; }
a.callout { cursor: pointer; }
.callout i.icon-4x { font-size: 6em; }
.callout h4 { margin-bottom: 30px; }
.callout-top { margin: 50px 0 0 0; }
.callout p { margin-bottom: 0; }
.callout .button { margin-top: 40px; }
.callout.green { background: #19ad0b;/*#86dc00;*/ }



#bookPromote { display: flex; margin-top: 2em; margin-bottom: 2em; flex-wrap: wrap; }
.bookAside { width: 40%; padding: 2em 2em; ; float: left; display: flex; background: #333; justify-content: center; }
.bookAside img#DCAABook { max-height: 400px; box-sizing: border-box; width: auto; padding: 12px; background: #000; box-shadow: 0 0 16px rgba(0,0,0,0.7) }
.bookDesc { width: 60%; padding: 2em 2em; ; float: left; display: flex; flex-direction: column; }
#bookStats i { display: block; padding: 12px 0; }
#casestudies img { disply: block; padding: 2px 0; border: 1px solid #ccc; overflow: auto; }
#mc_embed_signup { padding: 30px 0; }
#ui-preview { border: 5px solid #ddd; margin: 30px 0; display: block; }
.reviewName { display: block; text-align: right; font-size: 1em; }
.two_cols { columns: 2; -webkit-columns: 2; -moz-columns: 2; column-gap: 10px; -moz-column-gap: 10px; -webkit-column-gap: 10px; -moz-column-rule: 1px solid #ddd; -webkit-column-rule: 1px solid #ddd; column-rule: 1px solid #ddd; }
ul.two_cols li { margin-left: 2.4em; Xtext-indent: -1em; -webkit-column-break-inside: avoid; -moz-column-break-inside: avoid; -o-column-break-inside: avoid; -ms-column-break-inside: avoid; column-break-inside: avoid; Xbreak-before: column; }
.bx-wrapper .bx-pager.bx-default-pager a { background: #1424B8; }
ul.two_cols { list-style: outside disc; padding: 0.5em; margin: 1em 0 0 0; }
.gridFlex {
    margin: 0;
    border: 0;
    padding: 0;
    display: flex;
    flex-flow: row wrap;
    align-items: stretch;
    padding: calc(var(--grid-margin) - var(--cell-margin));
    background-color: var(--grid-color);
    justify-content: center;
}

.cardWrap { display: flex; JUSTIFY-CONTENT: center; flex-flow: row wrap; align-items: stretch; }
.card { width: 30%; display: flex;  flex-direction: column; border: 0px solid #ccc;  border-radius: 8px;overflow: hidden; margin: 5px 12px; transition: box-shadow 0.3s ease-in-out; background: #fff; }
.card22{width: calc(24% - 24px); min-width: 270px;margin-bottom: 12px; height:110%;/* height : 480px; */height: calc(25vw* 1.4);  position: relative; }
.card h4{font-size: 1.1em;}
.card:hover {  }
.card-header { text-align: center; font-size: 1.3em; font-weight: 700; padding: 10px 10px; line-height: 110%;}
.card.card22 .card-header { text-align: center; font-size: 0.9em; font-weight: 500; padding: 10px 10px; }



 
/* 
@media all and (min-width: 1024px) and (max-width: 1280px) {

}
@media all and (min-width: 768px) and (max-width: 1023px) {

}
 @media all and (min-width: 480px) and (max-width: 768px) {

}
 @media all and (max-width: 480px) {

}
*/





.card-header a, .card a{ color: #222; text-decoration: none;}
.card-header span { font-size: 0.8em; }
.card-main { display: flex; align-items: stretch; flex-grow:1; height: 100%;  flex-direction: column; font-size: 90%;; padding: 10px 14px 40px; }
.card .card-img {max-height:70%;  overflow: clip;}
.card-link { position: absolute; bottom: 8px; width: 100%; }
.card img{max-width: 100%;  width: 100%; object-fit: cover; transition:transform 1s ease;}
.card img:hover{ transform: scale(1.025); }
.card ul{ padding: 0; margin: 10px 8px 20px 25px; }
.card li, li.card { padding: 0; }

.cardHalfPg { width:calc( 48% - 24px); color:#000; border: 1px solid #ccc; display: flex;  flex-direction: column;  border-radius: 8px;overflow: hidden; margin:12px 12px; transition: box-shadow 0.3s ease-in-out; background: #fff;position: relative; padding: 1.6% 3.2% 80px 3.2%;}
.cardHalfPg .card-header {padding:0; margin-left: -3.2%  }
.cardHalfPg .card-header *{font-size: 1.1em; text-align: left; }
.cardHalfPg .card-link { position: absolute; bottom: 8px; padding-bottom: 12px;  width: 100%;      max-width: 85%;}
.cardHalfPg .card-link a.button { } 

.newsCard { padding: 10px; border: 1px solid #ccc; position: relative; transition: all 1s ease; border-radius: 6px;   }
.newsCard img{ max-width: 100%;     max-height: 200px;
    display: block;
    margin: 0 auto 12px; background-color: #000;}
.newsCard:hover { box-shadow: 0 0 12px rgba(51,51,51,.25);}
.newsCard-Title { font-size: 1.3rem; margin-bottom: 12px; font-weight: bold; }
.newsCard-Title a { color: var(--darkBlue); transition: all .5s ease;     text-decoration: none;}
.newsCard-Title a:hover {     text-decoration: underline; }
.newsCard-Date { font-size: .9rem; margin-bottom: 6px; }
.newsCard-BF {margin-bottom: 4.75rem; } 
.newsCard-Link {position: absolute; width: 100%; bottom: 12px;}

.gridFlex img { max-width: 100%; }
.gridFlex { margin: 0; border: 0; padding: 0; display: flex; flex-flow: row wrap; align-items: stretch; padding: calc(var(--grid-margin) - var(--cell-margin)); background-color: var(--grid-color); justify-content: center; }
.gridFlex.twoColumns .cell { width: 47%; width: calc(100% / var(--grid-columns2) - var(--grid-gutter)); }
.gridFlex.threeColumns .cell { width: 31%; width: calc(100% / var(--grid-columns3) - var(--grid-gutter)); }
.gridFlex.fourColumns .cell { width: 21%; width: calc(100% / var(--grid-columns4) - var(--grid-gutter)); }
.gridFlex.oneColumns .cell { width: 80%; margin-left: auto; margin-right: auto; padding: 1em; }
.cell { color: rgb(97, 97, 97); display: flex; flex-direction: column; box-sizing: border-box; margin: 6px; margin: calc(var(--cell-margin)); background-color: #333; background-color: var(--cell-color); width: 23%; width: calc(100% / var(--grid-columns) - var(--grid-gutter)); box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12); position: relative; overflow: hidden; }

 @media all and (min-width: 1800px)   {
.card22{width: calc(24% - 24px); margin-bottom: 12px; height:110%;/* height : 480px; */height: calc(25vw* 1.8);  position: relative; }
.card .card-img {max-height: calc(25vw* 1.3);}
}



 @media all and (min-width: 1024px) and (max-width: 1280px) {
.card22 {height: calc(27vw* 1.9);}
.card .card-img {max-height:76%;  overflow: clip;}

}
@media all and (min-width: 768px) and (max-width: 1023px) {

}
 @media all and (min-width: 480px) and (max-width: 768px) {

}
 @media all and (max-width: 480px) {

.card, .card22{width:100%; }
.card22 {height: 580px; margin: 0 0 60px;}
.card .card-img {max-height: 450px; overflow: clip;}
}







body.home .cell { min-height: 420px; }
.cell.white { --primary-color: #fff;
--primary-color-text: #333;
}
.cell.green { --primary-color: var(--darkGreen);
--primary-color-text: #FFF;
}
.cell.lightgreen { --primary-color: var(--lightGreen);
--primary-color-text: #FFF;
}
.cell.blue { --primary-color:#6c8db4;
--primary-color: var(--lakeBlue);
--primary-color-text: #FFF;
}
.cell.orange { --primary-color: var(--lightOrange);
--primary-color-text: #FFF;
}
.cell.darkOrange { --primary-color: var(--darkOrange);
--primary-color-text: #FFF;
}
.cell.beige { --primary-color: var(--beige);
--primary-color-text: #FFF;
}
.cell-title { font-size: 1.25em; font-size: calc(2.9 * var(--spacing-unit));
width: 100%; position: relative; }
.cell-header { display: flex; align-items: center; color: #fff; box-sizing: border-box; background-color: #2b3848; background-color: var(--primary-color); padding: 4px; height: calc(12 * var(--spacing-unit));
z-index: 2; justify-content: center; text-align: center; }
.gridFlex h4 { display: flex; align-items: center; text-align: center; box-sizing: border-box; padding: 4px; height: 2em; text-align: center; }
.cell-header.black { background-color: #2b3848; background-color: var(--coolGrey); }
.cell a { text-decoration: none }
.cell-content {
font-size: calc(2.5 * var(--spacing-unit)); padding: calc(var(--cell-padding)); flex-grow: 1; background: #fff; Xbackground: var(--primary-color); min-height: 322px; position: relative; transition: 1s all ease; }
.cell-content.text { background: rgba(255,255,255,0.9); font-size: 1.3em; text-align: center; position: absolute; top: -400px; left: 10px; right: 10px; z-index: 1; transition-delay: 1s; transition-property: top; }
.cell-content.photo { transition-delay: 1s; transition-property: filter; background-position: center center; background-size: cover; background-repeat: no-repeat; }
.cell:hover .cell-content.text { top: 90px; transition-delay: 0s; transition-property: top; }
.cell-content photo { position: relative; z-index: 0; }
.cell-content.full { font-size: .8em; font-size: calc(2.0 * var(--spacing-unit));
padding: 8px 8px 16px 8px; ; flex-grow: 1; line-height: 130%; }
.cell-actions {
padding: calc(2 * var(--spacing-unit)); border-top: 1px solid rgba(0, 0, 0, 0.12); position: relative; z-index: 3; }
.cell-actions.full { padding: 0; border-top: none; }
#content a.button.picker-button { position: relative; font-size: calc(2 * var(--spacing-unit));
display: inline-block; box-sizing: border-box; border: none; border-radius: 2px; color: #fff; text-decoration: none; padding: calc(2 * var(--spacing-unit));
text-align: center; text-decoration: none; background: #333; Xbackground: var(--primary-color); cursor: pointer; overflow: hidden; text-transform: uppercase; transition: background-color 0.2s; }
.cell-actions.full .picker-button { display: block; width: 100%; }
a.picker-button { color: #fff; background: #333; text-decoration: none; }
  a.button.picker-button {
    position: relative;
    font-size: calc(2 * var(--spacing-unit));
    display: inline-block;
    box-sizing: border-box;
    border: none;
    border-radius: 2px;
    color: #fff;
    text-decoration: none;
    padding: calc(2 * var(--spacing-unit));
    text-align: center;
    text-decoration: none;
    background: #333;
    Xbackground: var(--primary-color);
    cursor: pointer;
    overflow: hidden;
    text-transform: uppercase;
    transition: background-color 0.2s;
}
.cell-actions.full a.picker-button { color: #fff; text-decoration: none; display: block; }
a.picker-button:hover { background: #6c8db4; background: var(--primary-color); opacity: 1; color: #000; border: none; box-shadow: 0 0 12px var(--primary-color); }
a.picker-button:focus { outline: none; }
a.picker-button:active { background-color: #DDD; }
a.button.fullWidth { width: 100%; text-align: center; }

/*---------------------------------
	TABS
-----------------------------------*/
ul.tabs { margin: 10px 0 -1px 0; padding: 0; width: 100%; border-bottom: 1px solid #e5e5e5; float: left; font-size: 0; }
ul.tabs.left { text-align: left; }
ul.tabs.center { text-align: center; }
ul.tabs.right { text-align: right; }
ul.tabs.right li { margin: 0 0 0 -2px; }
ul.tabs li { font-size: 14px; list-style-type: none; margin: 0 -2px 0 0; padding: 0; display: inline-block;  *display:inline;/*IE ONLY*/
position: relative; top: 0; left: 0;  *top:1px;/*IE 7 ONLY*/
zoom: 1; }
ul.tabs li a { text-decoration: none; color: #666; display: inline-block; padding: 9px 15px; position: relative; top: 0; left: 0; line-height: 100%; background: #f5f5f5; -webkit-box-shadow: inset 0 -3px 3px rgba(0,0,0,0.03); -moz-box-shadow: inset 0 -3px 3px rgba(0,0,0,0.03); box-shadow: inset 0 -3px 3px rgba(0,0,0,0.03); border: 1px solid #e5e5e5; border-bottom: 0; font-size: 0.9em; zoom: 1; }
ul.tabs li a:hover { background: #fff; }
ul.tabs li.current a { position: relative; top: 1px; left: 0; background: #fff; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; color: #222; }
.tab-content { border: 1px solid #efefef; border: 1px solid #e5e5e5; background: #fff; clear: both; padding: 20px; margin: 0 0 40px 0; }




/*---------------------------------
	SLIDESHOW2
-----------------------------------*/
.slideshow-wrap { clear: both; margin: 0; padding: 0; position: relative; top: 0; left: 0; overflow: hidden; clear: both; }
.slideshow-inner { overflow: hidden; clear: both; position: relative; top: 0; left: 0; border: 1px solid #efefef; }
.slideshow { clear: both; margin: 0; padding: 0; width: auto; height: 100%; overflow: hidden; }
.slideshow li { list-style-type: none; margin: 0; padding: 0; float: left; display: block; }
.slideshow img { vertical-align: bottom; }
.slideshow-buttons { text-align: right; margin: 3px 0 0 0; padding: 0; }
.slideshow-buttons li { display: inline; position: relative; top: 0; left: 0; line-height: 100%; margin: 0; padding: 0; }
.slideshow-buttons li.current a { background: #ddd; }
.slideshow-buttons a { display: inline; position: relative; top: 0; left: 0; padding: 1px 3px; margin: 0 1px; line-height: 100%; border: 1px solid #efefef; text-decoration: none; font-size: 0.8em; }


/*---------------------------------
	IMPORTS
-----------------------------------*/
/*--------------Vertical Menu Layout-------------------*/
.menu.vertical { }
.menu.vertical li { display: block; }
.menu.vertical li a { display: block; }
.menu.vertical ul { top: 0; left: 100%; }
.menu.vertical li.has-menu span.arrow { margin-top: -4px; }
/*--------------Vertical Right Menu Layout-------------------*/
.menu.vertical.right { text-align: left; }
.menu.vertical.right ul { top: 0; right: 100%; left: auto; }
.menu.vertical.right li a { padding-left: 25px; padding-right: 20px; }
.menu.vertical.right li.has-menu span.arrow { right: auto; left: 5px; margin-top: -4px; }


/*---------------------------------
	BUTTONS
-----------------------------------*/

button, a.btn, a.btn:visited, a.button, a.button:visited, input[type="submit"], input[type="reset"], input[type="button"] { position: relative; top: 0; left: 0; vertical-align: middle; margin: 0;padding: 0.6em 1em; line-height: 100%; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; cursor: pointer; width: auto; overflow: visible; font-weight: normal; font-size:1em; color: #000; text-decoration: none; vertical-align: middle; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; display: inline-block; *display:inline;
zoom: 1; background: var(--buttonBG); border: 1px solid #bbb; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; /*transition: all .5s; */}
button:active, a.btn:active, a.btn:visited:active, a.button:active, a.button:visited:active, input[type="submit"]:active, input[type="reset"]:active, input[type="button"]:active { }
button[disabled], .disabled:active { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
button, input[type="submit"], input[type="reset"], input[type="button"] { *padding:7px 15px;
}/*IE 7 ONLY*/
a.btn, a.button { }/*overrides*/
button.small, a.btn.small, a.button.small { font-size: 0.8em; padding: 5px 10px; }
button.medium, a.btn.medium, a.button.medium { }/*default*/
button.large, a.btn.large, a.button.large, input[type="submit"].large { font-size: 1.5em; padding: 12px 20px; }
button.disabled, a.btn.disabled, a.button.disabled { color: #ccc; cursor: default; background: #efefef; }
button.disabled:hover, a.btn.disabled:hover, a.button.disabled:hover { border: 1px solid #ccc; background: #efefef; }
button:hover, a.btn:hover, a.button:hover, input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover { border: 1px solid #bbb; background: rgb(232,232,232); }




button.buttonGrad:hover, a.btn.buttonGrad:hover, a.button.buttonGrad:hover, input[type="submit"].buttonGrad:hover, input[type="reset"].buttonGrad:hover, input[type="button"].buttonGrad:hover { border: 1px solid #bbb; background: rgb(252,252,252); /* Old browsers */ background: -moz-linear-gradient(top, rgba(252,252,252,1) 0%, rgba(237,237,237,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(252,252,252,1)), color-stop(100%, rgba(237,237,237,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(252,252,252,1) 0%, rgba(237,237,237,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(252,252,252,1) 0%, rgba(237,237,237,1) 100%); /* Opera11.10+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#ededed', GradientType=0 ); /* IE6-9 */
background: linear-gradient(top, rgba(252,252,252,1) 0%, rgba(237,237,237,1) 100%); /* W3C */ }

/*---------------------------------
	BUTTON BAR
-----------------------------------*/
ul.button-bar { display: inline-block; *display:inline;
margin: 0 auto; padding: 0; font-size: 0; position: relative; top: 0; left: 0; zoom: 1; border: 0; background: 0; }
ul.button-bar li { display: inline-block; *display:inline;
position: relative; top: 0; left: 0; zoom: 1; margin: 0 -1px 0 0; padding: 0; line-height: 100%; font-size: 0px; border: 1px solid #ccc; background: #000  }
ul.button-bar li a { margin: 0; display: inline-block; *display:inline;
padding: 12px 10px; position: relative; top: 0; left: 0; zoom: 1; font-weight: normal; font-size:14px; /*Pixels for consistancy*/ text-shadow: 0 1px 0 #fff; color: #fff; text-decoration: none; vertical-align: middle; line-height: 100%; border-left: 1px solid #fff; }
ul.button-bar li.first, ul.button-bar li.first a { -moz-border-radius-bottomleft: 5px; -moz-border-radius-topleft: 5px; -webkit-border-bottom-left-radius: 5px; -webkit-border-top-left-radius: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; -moz-background-clip: content-box; -webkit-background-clip: border; background-clip: content-box; }
ul.button-bar li.last, ul.button-bar li.last a { -moz-border-radius-bottomright: 5px; -moz-border-radius-topright: 5px; -webkit-border-bottom-right-radius: 5px; -webkit-border-top-right-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; -moz-background-clip: content-box; -webkit-background-clip: border; }
ul.button-bar li a:hover { background: rgb(52,52,52);  }
ul.button-bar li a:active { -webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.2), inset 0 -10px 20px rgba(0,0,0,0.07); -moz-box-shadow: inset 0 3px 5px rgba(0,0,0,0.2), inset 0 -10px 20px rgba(0,0,0,0.07); box-shadow: inset 0 3px 5px rgba(0,0,0,0.2), inset 0 -10px 20px rgba(0,0,0,0.07); border-left: 1px solid #ccc; }




/*---------------------------------
	STYLES
-----------------------------------*/
.pill , a.button.pill{ border-radius: 50px; }
.pop { -webkit-box-shadow: 0px 1px 5px rgba(0,0,0,0.2); -moz-box-shadow: 0px 1px 5px rgba(0,0,0,0.2); box-shadow: 0px 1px 5px rgba(0,0,0,0.2); }
.inset { -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,0.3); -moz-box-shadow: inset 0 1px 3px rgba(0,0,0,0.3); box-shadow: inset 0 1px 3px rgba(0,0,0,0.3); }
.square, a.button.square { -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; }
button.small, a.btn.small, a.button.small, input.button.small { font-size: 0.8em; padding: 5px 10px; }
button.large, a.btn.large, a.button.large, input.button.large { font-size: 1.1em; padding: 15px 22px; }
/*---------------------------------
	BLUE
-----------------------------------*/
 
button.blue, a.btn.blue, a.button.blue, input[type=submit].blue, input[type=reset].blue, input[type=button].blue { color: #fff; background: var(--primary-color);  }

a.button.blue:hover {box-shadow: 0 0 7px #6DB9FF; border: solid 1px #6DB9FF;}
/*---------------------------------
	GREEN
-----------------------------------*/
button.green, a.btn.green, a.button.green, input[type=submit].green, input[type=reset].green, input[type=button].green { color: #fff; background: var(--siteColorAccent)!important; }
button.green:hover, a.btn.green:hover, input[type=submit].green:hover, a.button.green:hover, input[type=button].green { color: #000; background: rgb(204 213 179); }

button.gold a.btn.gold, a.button.gold, input[type=submit].gold, input[type=reset].gold, input[type=button].gold { color: #000!important; background: var(--siteColorAccent); }


button.red, a.btn.red, a.button.red, input[type=submit].red, input[type=reset].red, input[type=button].red { color: #fff; background: #900; }
button.red:hover, a.btn.red:hover, input[type=submit].red:hover, a.button.red:hover, input[type=button].red { color: #fff; background: #C00; }

button.yellow, a.btn.yellow, a.button.yellow, input[type=submit].yellow, input[type=reset].yellow, input[type=button].yellow { color: #000; background: var(--yellow); }
button.yellow:hover, a.btn.yellow:hover, input[type=submit].yellow:hover, a.button.yellow:hover, input[type=button].yellow { color: #fff; background:  var(--orange); }

button.orange, a.btn.orange, a.button.orange, input[type=submit].orange, input[type=reset].orange, input[type=button].orange { color: #fff; background: var(--orange); border:1px solid var(--orange);}
button.orange:hover, a.btn.orange:hover, input[type=submit].orange:hover, a.button.orange:hover, input[type=button].orange { color: #fff; background:  var(--orange); box-shadow:  0px 0px 25px var(--orange); }

a.button.black, input[type=submit].black { color: #fff; text-decoration: none;  border-radius: 5px;  background: rgba(0,0,0,1);  border: 1px solid #141414;padding: 0.6em 1.2em; }

footer a.button.black {box-shadow:  0 0px 15px var(--lakeBlue); border:1px solid var(--lakeBlue)}
footer a.button.black:hover {box-shadow:  0px 0px 25px var(--lakeBlue); border:1px solid var(--lakeBlue)}

a.button.black:active, a.button.black:focus { box-shadow: 0 0 0 transparent inset; } 
div.calloutButton a.button { font-size: larger;}
div.calloutButton a.button:hover { background:none!important;}

/*---------------------------------
	FORMS
-----------------------------------*/
form { padding: 0; margin: 0; }
form.inline { display: inline-block; margin-right: 2em; }
form input[class*="col_"], form textarea[class*="col_"] { margin-left: 0; margin-right: 0; margin-top: 0.15em; margin-bottom: 0.45em; float: left; display: block; }
form div[class*="col_"] { margin-left: .25em; margin-right: .25em; margin-top: 0.0em; margin-bottom: 0.0em; float: left; display: block;    width: 90%; }
fieldset { margin: 30px 0 20px 0; padding: 5px 15px 15px 15px; border: 1px solid #ccc; background: #f5f5f5; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; position: relative; top: 0; left: 0; }
fieldset fieldset {background-color: #f9f9f9;}
fieldset .row { margin: 10px 0 20px 0; }
legend { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; border: 1px solid #333; background: #000; padding: 2px 10px; margin: 0 0 0 0; display: block; position: relative; top: 0; left: 0; color: #fff; box-shadow: 2px 2px 4px rgba(0,0,0,.3) }
/*IE ONLY - I know, this is a stop gap*/
.msie fieldset { padding-top: 25px; }
.msie legend { position: absolute; top: -0.7em; left: 10px; }
label + input[class*="col_"], label + textarea[class*="col_"] { margin-top: -.2em; }
label { display: inline-block; *display:inline;
vertical-align: middle; margin: 0; padding: 0; position: relative; top: 0; left: 0; zoom: 1; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; margin-left: .1em; }
label.inline { display: inline; margin: 0; }
label span { color: #999; font-size: 0.9em; }
label span.right { position: absolute; bottom: 0; right: 0; text-align: right; display: inline-block; *display:inline;
}
label.disabled { color: #ccc; }
i/*nput.innerShadow, textarea.innerShadow { -moz-box-shadow: inset 0 0 6px #ccc; -webkit-box-shadow: inset 0 1px 6px #ccc; box-shadow: inset 0 1px 6px #ccc; }
input.Round { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }*/


input { display: inline-block; *display:inline;
vertical-align: middle; width: auto; zoom: 1; margin: 0; border: 1px solid #ccc; font-size: 1em; text-indent: 8px; background: #fff; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
input[type="text"],input[type="tel"],input[type="email"],input[type="password"], textarea {font-size: 1.1em;   padding:1rem 1rem .8rem; } 




::-webkit-input-placeholder {
color:#ccc;
}
:-moz-placeholder {
color:#ccc;
}
::-moz-placeholder {
color:#ccc;
}
:-ms-input-placeholder {
color:#ccc;
}
input::-moz-focus-inner {
border:0;
}
input::-moz-focus-inner {
border:0;
}
input[disabled="disabled"], input.disabled { color: #999; background: #f5f5f5; -moz-box-shadow: inset 0 0 2px #ddd; -webkit-box-shadow: inset 0 1px 2px #ddd; box-shadow: inset 0 1px 2px #ddd; }


input:required:not([value=""]):not(:focus):invalid {
border: 1px solid red;
border-left: 4px solid red;
color:red;
}

input:required:not([value=""])  {
border: 1px solid black;
border-left: 4px solid black;
color:black;
}

input:required:valid, textarea:required:valid {
border-left: 4px solid green;
}


/* FOCUS STATES */
input[type="text"]:focus, textarea:focus, button:focus, a.button:focus, select:focus, input[type="file"]:focus, input[type="password"]:focus { -webkit-box-shadow: 0 0 7px #6DB9FF; -moz-box-shadow : 0 0 7px #6DB9FF; box-shadow : 0 0 7px #6DB9FF; border: 1px solid #50B1FE; outline: none; }
input.checkbox, input[type="checkbox"] { display: inline; width: auto; margin: 0; padding: 0; border: 0; background: none; vertical-align: center; *vertical-align: top;
}
input.radio, input[type="radio"] { display: inline; width: auto; margin: 0; padding: 0; border: 0; background: none; vertical-align: center; *vertical-align: top;
}
input[type="radio"]:focus, input[ type="checkbox"]:focus { -webkit-box-shadow: 0 0 5px #6DB9FF; -moz-box-shadow : 0 0 5px #6DB9FF; box-shadow : 0 0 5px #6DB9FF; outline-color: #6DB9FF; }
input.file, input[type="file"] { /*font-size:0.8em;*/ -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; border: none; }
select { display: inline; width: auto; max-width: 100%; margin: 0; border: 1px solid #ccc; font-size: 1em; line-height: 100%; padding: 5px 0; vertical-align: middle; }
select[disabled="disabled"], select.disabled { color: #999; background: #f5f5f5; -moz-box-shadow: inset 0 0 2px #ddd; -webkit-box-shadow: inset 0 1px 2px #ddd; box-shadow: inset 0 1px 2px #ddd; }
textarea { width: auto; height: 200px; margin: 0; border: 1px solid #ccc; padding: 5px; vertical-align: middle; font-family: inherit; font-size: 1em; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
input.fullWidth, textarea.fullWidth { width: 100%; }
input.autoWidth { width: auto; }
input[name="customer_Zip"] { width: 5em; }
input[ type="submit"] { transition: .4s all; }
 input[type="text"]:read-only, input[type="text"]:read-only:focus {
background: transparent;
border:none;
-webkit-box-shadow: none;
 -moz-box-shadow:none;
 box-shadow:none;
 border:none;
 outline: none;
}
/*---------------------------------
	COLUMN SIZES
-----------------------------------*/

/* sizes */
input[class*="col_"], select[class*="col_"], label[class*="col_"] { float: none; display: inline-block; *display:inline;
margin-bottom: 0; *margin-left: 0.5%;
*margin-right: 0.5%;/* this is for IE 7 Only and is not a good fix - work needed here */
}
/*---------------------------------
	FORMS VERTICAL
-----------------------------------*/
form.vertical { }
form.vertical label { display: block; }
form.vertical input, form.vertical select, form.vertical textarea { width: 100%; display: block; margin-bottom: 10px; }
form.vertical .chzn-container { display: block; margin-bottom: 10px; }
form.vertical .chzn-choices { display: block; margin-bottom: 10px; }
/* radios & checks */
form.vertical input.checkbox, form.vertical input[type="checkbox"], form.vertical input.radio, form.vertical input[type="radio"], form.vertical label.inline { display: inline; width: auto; margin: 0; }
/*---------------------------------
	FORM VALIDATION
-----------------------------------*/
label.error { color: red; padding: 4px 0 0 4px; }
input.error, textarea.error { border: 1px solid red; }
input.valid, textarea.valid { border: 1px solid green; }
select.error { border: 1px solid red; }
/*---------------------------------
	NOTICES
-----------------------------------*/
.notice { border: 1px solid gold; background: var(--primary-color); padding: 20px 20px 20px 40px; margin: 20px 0; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; color:  var(--primary-color-text); line-height: 120%; vertical-align: center; text-shadow: 0px 1px var(--primary-color-text); position: relative; top: 0; left: 0; clear: both; }
.notice.warning { }/*default*/
.notice.error { border:none;    background: red; color: white; }
.notice.success { border: 1px solid green; background: lightgreen; color: green; }
.notice i[class*='fa-'] { position: absolute; top: 50%; left: 0.8em; margin-top: -0.6em; }
.notice a[class*='fa-remove'], .notice a[class*='fa-remove']:active, .notice a[class*='fa-remove']:visited { text-decoration: none; font-size: 12px; position: absolute; top: 5px; right: 5px; left: auto; color: inherit; margin-top: 0; left: auto; }
/*--------------Vertical Menu Layout-------------------*/
.menu.vertical { }
.menu.vertical li { display: block; }
.menu.vertical li a { display: block; }
.menu.vertical ul { top: 0; left: 100%; }
.menu.vertical li.has-menu span.arrow { margin-top: -4px; }
/*--------------Vertical Right Menu Layout-------------------*/
.menu.vertical.right { text-align: left; }
.menu.vertical.right ul { top: 0; right: 100%; left: auto; }
.menu.vertical.right li a { padding-left: 25px; padding-right: 20px; }
.menu.vertical.right li.has-menu span.arrow { right: auto; left: 5px; margin-top: -4px; }

.fancybox-container { }
.fancybox-content { margin: 12vw!important; }.fancybox-content img{max-width:100%;} 
@media all and (min-width: 1024px) and (max-width: 1280px) {

}
@media all and (min-width: 768px) and (max-width: 1023px) {

}
 @media all and (min-width: 480px) and (max-width: 768px) {

}
 @media all and (max-width: 480px) {
.fancybox-content { margin: 4vw!important;  padding: 22px;}
.fancybox-content img{max-width:100%; -width:100%; margin: 12px auto; } 
.cardWrap {  /*display: flex;JUSTIFY-CONTENT: center; flex-flow: row wrap; align-items: stretch;*/ padding-inline-start: 0; }

.cardHalfPg {
    width: 100% ;padding: 1.6% 5.2% 90px 5.2%;
}
}