:root {
--color-primary: #EE7779;
--color-secondary: #1A8584;
--color-tertiary: #9FCCBB;
--color-rfv: #EE7779;
--heading-font: "calder-dark", sans-serif;
--body-font: "calder-lc", sans-serif;
}
/*COLOR THEME*/
.black{ color:#000}
.white{ color:#FFF}
.red{ color:#CC3333}
.melon { color: var(--color-primary); }
.gray{ color:#747577}
.pink{ color:#F5D6D5}
.green{color: var(--color-secondary);}
.mint{color: var(--color-tertiary);}
.cream{color:#FFFAF3}
.inactive{ color:#CCC}
.bold{font-weight:bold}
*:focus {outline: none}
body{font-size:100%; font-family: calder-lc, sans-serif; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none}
h1{font-family: "calder-dark", sans-serif; font-weight: 400; font-style: normal; font-size:300% !important; color:#1A8584; text-align:center}
h2{font-family: "calder-dark", sans-serif; font-weight: 400; font-style: normal; font-size:200% !important; color:#1A8584; text-align:center}
h3{font-family: "calder-dark", sans-serif; font-weight: 400; font-style: normal; font-size:200% !important; color:#EE7779; text-align:center}
h4{font-family:'calder-lc', sans-serif; font-size:110%; font-weight:bold !important}
h5, h6{font-family:'calder-dark', sans-serif}
a{font-family: calder-lc, sans-serif; color:#1A8584; text-decoration:underline}
a:hover{color:#EE7779}
.a-no-underline{text-decoration:none}
a.nolink{color:#2F3035}
a.nolink:hover{text-decoration:none}
.checkbox label:after, .radio label:after {content: ''; display: table; clear: both}
.checkbox .cr, .radio .cr {position: relative; display: inline-block; border: 1px solid #747577; border-radius: .25em; width: 1.3em; height: 1.3em; float: left; margin-right: .5em}
.radio .cr {border-radius: 50%}
.checkbox .cr .cr-icon, .radio .cr .cr-icon {position: absolute; font-size:.8em; line-height:0; top:53%; left:16%}
.checkbox label input[type="checkbox"], .radio label input[type="radio"] {display: none}
.checkbox label input[type="checkbox"] + .cr > .cr-icon, .radio label input[type="radio"] + .cr > .cr-icon {transform: scale(3) rotateZ(-20deg); opacity: 0; transition: all .3s ease-in}
.checkbox label input[type="checkbox"]:checked + .cr > .cr-icon, .radio label input[type="radio"]:checked + .cr > .cr-icon {transform: scale(1) rotateZ(0deg); opacity: 1}
.checkbox label input[type="checkbox"]:disabled + .cr, .radio label input[type="radio"]:disabled + .cr {opacity: .5}
header{padding:1%; background-color:#9FCCBB; border-bottom:2px solid #1A8584; font-size:80%; color:#464646}
@media screen and (min-width:768px) {.logo{max-width:14.6%}}
#nav{background-color:#1A8584; border:none; border-radius:50px; padding:8%; width:80%; height:100vh}
@media screen and (min-width:1500px) {#nav{background-color:#1A8584; border:none; border-radius:50px; padding:8%; width:70%; margin-left:10%}}
#nav a{font-family: calder-lc, sans-serif; font-size:110%; color:#FFF; text-decoration:none}
#nav a:hover{color:#9FCCBB}
#MobileMenu{background-color:#1A8584; border:none; border-radius:50px; margin-left:2%; padding:8%; width:40%}
@media screen and (max-width:768px) {#MobileMenu{width:95%}}
#MobileMenu a{font-family: calder-lc, sans-serif; font-size:110%; color:#FFF; text-decoration:none}
#MobileMenu a:hover{color:#9FCCBB}
@media screen and (min-width:1200px) {.mobile-nav-buttons{display:none }}
.metric-box{border:solid 1px #CCC !important; margin:.20%; padding:2%; min-height:180px; color:#2F3035}
.metric-box a{color:#29B473} .metric-box a:hover{color:#2F3035}
.dropzone{border:dashed 4px #CCC !important; margin:.20%; padding:1% !important; text-align:center}
.form-group{font-family: calder-lc, sans-serif; font-size:90% !important; font-weight:bold; color:#646464; margin-bottom:1.5%}
.form-text{font-family: "circe-rounded", sans-serif; font-weight: 400; font-style: normal; font-size:120%; color:#464646}
.grid-title{display:block; margin:0; font-weight:bold}
.grid-label{display:block; margin:0}
.grid-text{font-family:'calder-lc', sans-serif; font-size:105%;}
.button-pink{padding:10px 20px; background-color:#EE7779; border:none; border-radius:50px; outline:none; font-family: 'calder-lc', sans-serif; font-size:120%; color:#FFF; transition: background-color 0.3s;}
.button-pink:hover{background-color:#F5D6D5; color:#EE7779}
.button-grid{padding:10px; background-color:#1A8584; border:none; border-radius:50px; outline:none; font-family: 'calder-lc', sans-serif; font-size:95%; color:#FFF; transition: background-color 0.3s;}
.button-grid:hover{background-color:#9FCCBB; color:#FFF}
.btn-cake {width:35%; padding: 0.5rem 0.75rem; text-align: center; vertical-align: middle; background-color: #F5D6D5; font-family: "circe-rounded", sans-serif; font-size:2rem; color: #EE7771; text-decoration:none !important;
border:solid 15px #F5D6D5; border-radius:1em; -webkit-border-radius:1em; -moz-border-radius:1em; user-select:none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none}
.btn-cake:hover {font-family: "circe-rounded", sans-serif; color: #EE7771 !important; text-decoration:none !important; border:dotted 15px #EE7771}
.btn-cake span {display:block; font-family: "circe-rounded", sans-serif; font-size:1rem; color: #646464 !important; text-decoration:none}
/*RAD-WINDOW************/
a.rwIcon{display:none !important; background-image:none !important}
.t-chrome .rwWindowContent.rwExternalContent {display:flex}
/*RAD-TEXTBOX************/
textarea{font-family: calder-lc, sans-serif !important; font-size: 18px !important; background-color:#FFF !important} /*<--to style all multi-link textboxes */
.RadInput{font-family: calder-lc, sans-serif !important; width:100% !important; background-color:#FFF !important}
.style1 .riTextBox{font-family: calder-lc, sans-serif !important; width:100% !important; background-color:#FFF !important}
.RadInput input.riTextBox {font-family: calder-lc, sans-serif !important; font-size: 18px !important; height:42px !important; background-color:#FFF !important}
/*RAD-COMBOBOX************/
div.RadComboBox .rcbInput {font-family: calder-lc, sans-serif !important; font-size: 18px !important}
div.RadComboBox .rcbArrowCell {font-family: calder-lc, sans-serif !important; font-size: 18px !important}
div.RadComboBoxDropDown .rcbHeader {font-family: calder-lc, sans-serif !important; font-size: 18px !important}
div.RadComboBoxDropDown .rcbItem {font-family: calder-lc, sans-serif !important; font-size: 18px !important; padding-left:18px !important} /*items in the list -- setting padding-left stops the jarring on select*/
div.RadComboBoxDropDown .rcbFocused {font-family: calder-lc, sans-serif !important; font-size: 18px !important}
div.RadComboBoxDropDown {font-family: calder-lc, sans-serif !important; font-size: 18px !important}
div.RadComboBox .rcbDisabled .rcbInputCell {background-color:#F1F1F1 !important} /*ddl bground color when disabled*/
div.RadComboBox .rcbDisabled .rcbArrowCell {background-color:#F1F1F1 !important} /*ddl arrow cell bground color when disabled*/
div.RadComboBox .rcbDisabled .rcbArrowCell:hover {background-color:#F1F1F1 !important} /*ddl arrow cell when hovered bground color when disabled*/
div.RadComboBoxDropDown img{max-width:20px} /*size of an image displayed in a RadComboBox*/
.tabs .RadButton {line-height:25px !important; font-family: GothamRounded-Book !important; font-size:18px !important; height:24px !important} /*this is for the LinkButton in a .tabs div*/
.RadButton .fas, .RadButton .fab {margin-right:6px !important} /*this is the distance between the icons and the text on all RadButtons*/
.RadButton {font-family: GothamRounded-Book !important; font-size:18px !important; color: #646464 !important; line-height:20px !important; border-width:1px !important; padding-right:8px !important; padding-left:6px !important; background-image: linear-gradient(#EEE, #f7f7f7 100%) !important; border-color: #CCCCCC !important;}
.RadButton:hover {background-image: linear-gradient(#CCC, #F1F1F1 100%) !important;}
@media screen and (max-width:1200px) {
}
@media screen and (max-width:992px) {
}
@media screen and (max-width:768px) {
}
@media screen and (max-width:576px){
}
@media screen and (max-width:400px){
}