﻿html {
	font-size: 62.5%; /* 1rem = 10px */
}

html.show-mobile-menu {
	overflow-y: scroll;
    position: fixed;
    width: 100%;
    top: 0px;
    left: 0px;
}

body {
	background: #f4f4f4;
	box-sizing: border-box;
	color: #53585e;
	font-family: 'Open Sans', Arial, Helvetica, sans-serif;
	font-size: 1.6rem;
	letter-spacing: -0.015em;
	text-align: left;
	display: flex;
    min-height: 100vh;
    flex-direction: column;
	line-height: 2.4rem;
}

a, a:link, a:visited {
	color: #57922b;
	text-decoration:none;
}
a:hover, a:active {
	color: #BE4B4B;
}

h1, h2, h3, h4 {
	margin: 0 0 2rem 0;
	color: #1a475e;
	font-weight: 600;
}

h1 {
	font-weight: 700;
	font-size: 4.8rem;
	line-height: 5rem;
}

h2 {
	font-size: 3rem;
	margin-bottom: 3rem;
	line-height: 3.5rem;
}

h3 { 
	font-size: 2.5rem;
	margin-bottom: 3rem;
	line-height: 3rem;
}

h4 {
	margin-bottom: 2rem;
}

.hgroup h1,
.hgroup h2,
.hgroup h3 {
	margin-bottom: 0;
}

hr {
	margin: 3rem 0;
    border-bottom: 1px solid silver !important;
	border-top: 0 !important;
}

strong {
	font-weight: 600;
}

p {
	margin-top: 0;
	margin-bottom: 2rem;
}

p:last-child {
	margin-bottom: 0;
}

p:empty {
	display: none;
}

p + h3 {
	margin-top: 4rem;
}

ul { 
	margin: 0;
	padding: 0;
}

ul.list,
ol.list,
.wp-post ul,
.wp-post ol {
	padding: 0 4rem;
	margin-top: 2rem;
    margin-bottom: 2rem;
}

ul.list,
ol.list,
.wp-post ul li,
.wp-post ol li {
	margin-bottom: 1rem;
}

table {
	width:100%;
	border-collapse:collapse;
	margin-bottom: 6rem;
	border-top: 1px solid #2f7da7;
}

th {
	text-align: left;
	font-weight: 400;
	background-color: #2f7da7;
	color:#fff;
	padding: .8rem 1.6rem;
}

th a,
th a:link,
th a:visited {
	color: #fff;
	text-decoration: underline;
}

td {
	padding: .8rem 1.6rem;
	border-bottom:1px solid silver;
}

tr:nth-child(odd) {
	background:#f0f8ff;
}

table.projects {
	font-size: 1.6rem;
}

table.projects th {
	white-space: nowrap;
}

table.projects .row-project {
	font-weight: 500;
}

table.projects .row-project td {
	border-bottom: 2px solid silver;
}

table.projects .row-project-wave td:first-child {
	padding-left: 2rem;
}

header {
	padding-top: 2rem;
	width: 100%;
	background-color: #19465E;
	color: #fff;
}

header > div {
	display: flex;
	justify-content: space-between;
}

header nav:last-child {
	margin-bottom: 0;
}

header nav ul {
	list-style-type: none;
	display: flex;
	justify-content: flex-end;
}

.header-title-wrapper a {
	margin-bottom: 1rem;
	display: inline-block;
}

.header-nav-wrapper {
	display: flex;
	flex-direction: column;
}

.header-nav li {
	margin-right: .4rem;
}

.header-nav li:last-child {
	margin-right: 0;
}

.header-nav a, 
.header-nav a:link, 
.header-nav a:visited {
	display: inline-block;
	padding: .5rem 1.6rem 1rem 1.6rem;	
	color: #fff;
} 

.header-nav a:hover, 
.header-nav a:active {
	text-decoration: underline;
}

#main-menu {
	margin-top: auto;
}

#main-menu a, 
#main-menu a:link, 
#main-menu a:visited {
	border-radius: 5px 5px 0 0;
	text-transform: uppercase;
	padding: 1rem 1.6rem;
} 

#main-menu a:hover, 
#main-menu a:active {
	background: #0f6392;
	text-decoration: none;
}

#main-menu a.active,
#main-menu a.active:hover, 
#main-menu a.active:active {
	background:#fff;
	color:#182831;
}

#savvyconnect-header {
	background: #113243;
	padding: 2rem;
	margin-bottom: 0;
	text-align: center;
	flex-shrink: 0;
}

.page-template-page-savvyconnect #main-menu .current-menu-item a,
.page-template-page-savvyconnect #main-menu .current-menu-item a:hover, 
.page-template-page-savvyconnect #main-menu .current-menu-item a:active,
.page-template-page-savvyconnect-header #main-menu .current-menu-item a,
.page-template-page-savvyconnect-header #main-menu .current-menu-item a:hover, 
.page-template-page-savvyconnect-header #main-menu .current-menu-item a:active {
	background:#113243;
	color:#fff;
}

#mobile-menu-btn {
	display: none;
}

#mobile-menu-btn a {
	display: block;
	width: 8rem;
	font-size: 1.2rem;
	text-align: center;
	padding: 2rem 0;
    margin-top: -2rem;
}

#mobile-menu-btn a span {
	display: block;
}

#mobile-menu-btn svg {
	fill: #fff;
}

#mobile-menu {
	background-color: #fff;
	z-index: 5;
	position: absolute;
	width: 100%;
	height: 100%;
	display: none;
}

#mobile-menu li {
	border-bottom: 1px solid #ccc;
}

#mobile-menu a {
	padding: 2rem 2.5rem;
	display: block;
}

#mobile-menu-close {
	text-align: right;
}

#mobile-menu-close svg {
	vertical-align: middle;
	margin-left: .5rem;
}

#main-content-wrapper,
#main-content {
	flex: 1 0 auto;
    display: flex;
    flex-direction: column;
}

#main-content {
	margin: 0 auto;
}

#main-content > section:first-child {
	flex: 1 0 auto;
}

#main-content:not(.has-banner) > section:first-child {
	border-radius: 0 0 1rem 1rem;
}

section {
	background-color: #fff;
	border-radius: 1rem;
	padding: 3rem;
	box-sizing: border-box;
	margin-bottom: 2rem;
}

.modal section {
	padding: 1rem;
	margin-bottom: 0;
}

.banner-header {
	background: #fff;
	text-align: center;
}

.banner-header > div {
	padding: 5rem 0;
    max-width: 72rem;
}

.block {
	margin-bottom: 6rem;
}

.block-small {
	margin-bottom: 2rem;
}

.block:last-child,
.block-small:last-child,
.block > *:last-child,
.block-small > *:last-child {
	margin-bottom: 0;
}

footer {
	font-size: 1.2rem;
	background-color: #fff;
	flex-shrink: 0;
}

footer img {
	display: block;
    margin-top: auto;
    margin-bottom: auto;	
	flex-grow:0 !important;
}

footer p {
	margin:0;
	line-height: 1.8rem;
}

footer a.flex, footer a.flex:link {
	color: #1a475e;
}

footer .footer-info {
	padding: 3rem 0 1.5rem;
}

footer .footer-info > div:first-child {
	min-width: 42rem;
}

footer .copyright-notice {
	background-color: #f6f7f9;
	padding: .8rem 0;
	text-align: center;
}

.max-content-width,
.narrow-content-width {
	width: 100%;
	max-width: 120rem;
	margin-left: auto;
	margin-right: auto;
}

.home .max-content-width {
	max-width: 152rem;
}

.narrow-content-width {
	max-width: 107.6rem;
}

label {
	margin-bottom: .5rem;
}

.input {
	margin-bottom: 2rem;
}

.input.date .flex-row > * {
	margin-bottom: 0;
}

input,
select,
.input-like {
	padding: .8rem 1rem;
	border-radius: .3rem;
    border: 1px solid #ccc;	
}

input:focus, 
select:focus, 
textarea:focus{
	border: 1px solid #5897fb;
    outline: none;
	box-shadow: 0 0 5px rgba(0, 0, 0, .3);
}

input[type="checkbox"],
input[type="radio"] {
	margin-right: 1rem;
}

.input.error input {
	margin-bottom: .5rem;
}

.submit,
.wpforms-submit-container {
	text-align: right;
	margin-top: 2rem;
}
.btn, 
a.btn, 
input[type="submit"],
.wp-block-button__link,
.wp-block-button__link:link,
.wp-block-button__link:visited,
div.wpforms-container-full .wpforms-form button[type=submit] {
	text-align: center;
	background: #7db751;
	color: #fff;
	font-size: 1.6rem;
	padding: .8rem 3.2rem;
	border-radius: .5rem;
	border: 1px solid transparent;
	cursor: pointer;
	transition: background-color 0.1s ease-in-out;
	text-transform: uppercase;
	font-weight: 600;
	white-space: nowrap;
	display: inline-block;
}

.btn:hover, 
.btn:focus,
input[type="submit"]:hover,
input[type="submit"]:focus,
.wp-block-button__link:hover,
.wp-block-button__link:focus {
	background-color:#96db63;
	text-decoration:none;
}

.btn[disabled],
.btn.btn-disabled,
input[type="submit"][disabled],
input[type="submit"][disabled].btn {
	background-color:#dadada;
	border-color:#dadada;
	cursor: default;
	pointer-events: none;
}

.btn.btn-inverse {
    background-color: #fff;
    color: #7db751;
}

.wp-block-buttons {
	margin-bottom: 2rem;
}

input.loading,
select.loading {
	background: url(../image/loading1.gif) no-repeat right 1rem center;
}

select.loading {
	background-position: right 2rem center;
}

input.checked {
	background: url(../image/circle-check.svg) no-repeat right 1rem center;
	border-color: #7db751;
}

.btn.btn-negative {
	background:#d33c44;
}

.btn.btn-negative:hover, 
.btn.btn-negative:focus {
	background-color:#ef0016;
}

.btn.btn-hollow {
	background-color: #fff;
	color: #7db751;
	border-color: #7db751;
}

.btn.btn-hollow:hover,
.btn.btn-hollow:active {
	background-color: #f2ffe7;
}

td .btn,
.btn.btn-sml {
	padding: .4rem 1.6rem;
    font-size: 1.2rem;
}

.btn.btn-can-wrap {
	white-space: pre-wrap;
	display: inline-block;
}

.copy-box {
	display: inline-block;
	padding: 1.2rem 5rem 1.2rem 2.4rem;
	border: 1px solid #7db751;
	border-radius: 1rem;
	background: url(https://surveysavvy.com/wp-content/themes/surveysavvy/img/icon-copy.png) no-repeat right 1rem center;
	cursor: pointer;
}

.copy-box:hover {
	background-color: #f0f8ff;
}

sup {
	margin-left: .8rem;
	font-weight: 600;
	display: inline-block;
	line-height: 1.8rem;
	font-size: 1.4rem;
}
sup a,
sup a:link,
sup a:visited {
	background: #7db751;
	border-radius: 1.6rem;
	color:#fff;
	padding: 0 .8rem;
	display: inline-block;
}

.none {
    background-color: #f1f1f1;
    padding: 2rem;
}

.form-sized {
	margin: 0 auto;	
	max-width: 100%;
}

.form-sized-small {
	width: 48rem;
}

.form-sized-small.wpforms-container-full {
	max-width: 48rem;
}

.form-sized-mid {
	width: 65rem;
}

.form-sized-big {
	width: 90rem;
}

.flex {
	display: flex;
}

.flex > * {
	flex: 1 1 auto;
}

.flex-row {
	margin-bottom: 1.5rem;
}

.flex-row > * {
	margin-right: 2rem;
}

.flex-col .flex-row > *,
.flex-row .input,
.flex-row .flex-row {
	margin-bottom: 0;
}

.flex-row > *:last-child {
	margin-right: 0;
}

.flex-col {
	flex-direction: column;
}

.flex-col > * {
	margin-bottom: 1rem;
}

.flex-col > *:last-child {
	margin-bottom: 0;
}

.flex-static-size {
	flex-grow: 0;
	flex-shrink: 0;
}

.message {
	padding: 2rem;
	font-weight: 400;
	text-align: center;
	border-radius: 1rem;
	background-color: #faffd1;
}

.message.success {
	background-color: #e0f8ff;
}

.message.error {
	background-color: #fffbd7;
}

.message.savvyconnect {
	background-color: #7db751;
    color: #fff;
	transition: background-color 0.1s ease-in-out;
}

.message.savvyconnect:hover {
	background-color: #96db63;
}

.message a.flash-link {
	display: block;
    padding: 2rem;
    margin: -2rem;
}

.message.error-attention {
	background-color: #d33c44;
	color: #fff;
}
.message.error-attention a {
	color: #fff;
}

.error-message {
	color: #d33c44;
	font-weight: 400;
}

.text-left {
	text-align: left;
}

.text-right {
	text-align: right;
}

.text-center {
	text-align: center;
}

.text-smaller {
	font-size: 1.4rem;
}

.text-smallest {
	font-size: 1.2rem;
}

.icon-plus {
	background: url(../image/plus-2x.png) no-repeat left center;
    padding-left: 2.5rem;
}

.consent-page {
	width: 100%;
}

.consent-page section {
	margin-bottom: 0;
	padding-bottom: 5rem;
	padding-top: 5rem;
	border-radius: 0;
}
.consent-page section:last-of-type {
	margin-bottom: 4rem;
}

.consent-page section:nth-of-type(2),
.consent-page section:nth-of-type(4),
.consent-page section:nth-of-type(6) {
	background: url("../image/section-divider-down-arrow-white.png") no-repeat center top;
	padding-top: 7rem;
}

.consent-page ul {
	margin: 3rem;
}

.payment-box {
	flex-grow: 0;
    background: #f0f8ff;
    padding: 2rem;
    border-radius: 1rem;
}

.payment-box p {
	margin-bottom: 0;
}

.payment-box div:last-child {
	display: flex;
	margin-left: 3rem;
}

.payment-box div:last-child a {
	margin: auto 0;
}

.referrals-box {
    background: #f0f8ff;
    padding: 2rem;
	text-align: center;
}

.referrals-box strong {
	display: block;
	font-size: 1.5rem;
	margin-top: .5rem;
}

.formatted-address {
	margin: 3rem auto;
    width: 40rem;
    padding: 2rem;
    border-radius: 1rem;
    border: 1px solid #d9e0e8;
}

.corrected {
	text-decoration: underline;
}

.none-found {
	text-align: center;
	padding: 1.5rem;
}

.scroll-container {
	max-height: 30rem;
	overflow: auto;
	border-top: 2px solid #5794d5;
	border-bottom: 1px solid silver;
}

.scroll-container table {
	border-top: none;
}

.paging {
	padding: .5rem 0;
	text-align: center;
	margin: auto 0;
}

.paging a {
	padding: .5rem 1rem;
	text-decoration: none;
}

.paging li {
	display: inline-block;
}

.paging .active a {
	color: #fff;
    background: #2f7da7;
    border-radius: .5rem;
    text-decoration: none;
}

.all-caps {
	text-transform: uppercase;
}

.tiny-caps {
	font-size: 1.2rem;
	margin-bottom: 0;
	text-transform: uppercase;
}

.dull {
	color:#8c8c8c;
}

@media ( max-width: 1250px ) {
	.max-content-width,
	.narrow-content-width,
	.home .max-content-width {
		max-width: 90%;
	}	
}

@media ( max-width: 660px ) {
	#mobile-menu-btn {
		display: block;
	}

	h2 {
		font-size: 2.2rem;
	}

	h3 {
		font-size: 2rem;
		margin-bottom: 1rem;
	}

	.max-content-width,
	.narrow-content-width,
	.home .max-content-width {
		max-width: 95%;
	}

	.header-nav-wrapper {
		display: none;
	}	

	.form-sized {
		width: 100%;
	}

	.flex-row {
		margin-bottom: 1rem;
}

	.referrals-box {
		padding: 2rem 1rem;
	}	

	/* could possibly be generic */
	.payment-box div:last-child {
		flex-grow: 0;
	}	
	}

@media ( max-width: 700px ) {
	section {
		padding: 2rem;
	}
		
	.flex-col-on-narrow {
		flex-direction: column;
	}

	.flex-col-on-narrow > *,
	.flex-col-on-narrow > .input {
		margin-bottom: 1rem;
		margin-right: 0;
	}

	.flex-col-on-narrow > *:last-child {
		margin-bottom: 0;
	}
	
	.text-left-on-narrow {
		text-align: left;
	}

	.text-center-on-narrow {
		text-align: center;
	}

	.shares-box div {
		margin-right: 0;	
	}

	.full-width-on-narrow {
		width: 100%;
	}	
}

.all-caps {
	text-transform: uppercase;
}

.two-col > div {
	width: 50%;
}

.two-col > div:first-child {
	padding-right: 3rem;
	border-right: 1px solid #2f7da7;
}

.two-col > div:last-child {
	padding-left: 3rem;
}

.consent-container {
	margin: 3rem;
}

.consent-container .consent-options {
	flex-shrink: 0;
	margin-left: 3rem;
	text-align: right;
}

.consent-container .consent-options label {
	margin-right: 4rem;
}

.consent-container .consent-options label:last-child {
	margin-right: 0;
}

.consent-container .consent-options label input {
	margin-right: 1rem;
}

@media (max-width: 1170px) {

	.on-med-pad-sides {
		padding-left: 2rem;
		padding-right: 2rem;
	}

	.on-med-flex-shrink {
		flex-shrink: 1;
	}

	.on-med-flex-col {
		flex-direction: column;
	}	

	.on-med-line-up > * {
		margin-right:0 !important;
		margin-left:0 !important;
	}

	.on-med-line-up-col > * {
		margin-bottom: 1rem;
	}

	.on-med-center {
		margin-left: auto !important;
		margin-right: auto !important;
	}	
}

@media (max-width: 768px) {
	h1 {
		font-size: 3rem;
		line-height: 4rem;
	}

	.on-sml-flex-none {
		flex: none;
	}	

	.on-sml-flex-col {
		flex-direction: column;
	}

	.on-sml-flex-col-rev {
		flex-direction: column-reverse;
	}

	.on-sml-line-up > * {
		margin-right:0 !important;
		margin-left:0 !important;
	}	

	.on-sml-flex-shrink {
		flex-shrink: 1;
	}

	.on-sml-line-up > * {
		margin-right:0 !important;
		margin-left:0 !important;
	}

	.on-sml-line-up-col > * {
		margin-bottom: 3rem;
	}	

	.on-sml-text-left {
		text-align:left;
	}

	.on-sml-text-center {
		text-align:center;
	}

	.on-sml-margin-top {
		margin-top:1.5rem;
	}

	.on-sml-hide {
		display: none;
	}

	.btn.on-sml-btn-sml {
		padding: .25rem 1rem;
		font-size: .75rem;
	}

	footer {
		font-size: 1.2rem;
	}

	footer p {
		line-height: 2.4rem;
	}

	footer .flex .on-sml-flex-col img{
		margin: 0 auto 1.6rem !important;
	}

	.footer-contact-icon {
		padding: 1.6rem .8rem .8rem;
		border: 1px solid #a7a7a7;
		border-radius: .8rem;
		margin-bottom: 1.6rem;
		flex-basis: 50%;
	}		

	footer .footer-info {
		padding-bottom: 0;
	}

	.responsive-table {
		overflow: hidden;
		text-align: left !important;
	}
	.responsive-table tr {
		border-top: 2px solid #2f7da7;
		border-bottom: 2px solid #2f7da7;
		background:initial !important;
	}
	.responsive-table th {
		display: none;
	}
	.responsive-table td {
		display: block;
		padding: .5rem 0;
		display: flex;
    	flex-direction: column;
	}
	.responsive-table td:first-child {
		padding-top: 1rem;
	}
	.responsive-table td:last-child {
		padding-bottom: 1rem;
	}
	.responsive-table td:before {
		content: attr(data-th);
		font-weight: bold;
		width: 8rem;
		display: inline-block;
	}
	.responsive-table td.responsive-table-btns:before {
		content: attr(data-th) " ";
	}
	.responsive-table td.responsive-table-btns {
		text-align:left !important;
	}	
}

@media (max-width: 400px) {
	input, select {
		padding: .8rem .5rem;
	}

	.flex-row > * {
		margin-right: 1rem;
	}
}