/* Edit Fonts
-------------------------------*/
.call-out-font, .ui-datepicker .ui-datepicker-title {font-family: "handel-gothic",sans-serif;}
.pageWrapper, .ui-datepicker {font-family:Arial, Helvetica, sans-serif;}



/* Edit Brand Colors 
-------------------------------*/

/* Defaults */
.pageWrapper, .pc-pag-ct a.active, .pc-next, .pc-next .fa, .ui-datepicker-calendar tr th, .ui-datepicker-calendar td a, .ui-datepicker-calendar td a:hover, .ui-datepicker-calendar td a:active, .ui-datepicker-calendar td a:focus  {color:#616161;} 
.flex-control-paging li a:hover, .flex-control-paging li a.flex-active {background: #616161;} 

/* Main Accent */
.main-brand-color, .ui-state-hover,.ui-widget-content .ui-state-hover,.ui-widget-header .ui-state-hover,.ui-state-focus,.ui-widget-content .ui-state-focus,.ui-widget-header .ui-state-focus, .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight, .add-to-calendar-checkbox:before, .ui-widget-content .ui-state-active {color:#2ca2c9;}
.top-img-container.pc-row , .flex-control-nav.flex-control-paging{ border-color: #2ca2c9; } 

/* White Fonts */
a.pc-btn, a.pc-btn:hover, a.pc-btn:active, a.pc-btn:focus, .top-img-container, .atc-style-blue .atcb-link, .ui-datepicker .ui-datepicker-header {background-color:#2ca2c9; -webkit-print-color-adjust: exact; }
.ui-datepicker-calendar .period-days a.ui-state-default {background-color:#18a0ae; -webkit-print-color-adjust: exact; } /* main accent */
.white, a.pc-btn, a.pc-btn:hover, a.pc-btn:active, a.pc-btn:focus, .top-img-container a, .top-img-container a:hover, .top-img-container a:active, .top-img-container a:focus, .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus, .ui-widget-header, .ui-datepicker-calendar .period-days a.ui-state-default, .ui-datepicker-calendar .pre-period a.ui-state-default, .ui-datepicker-calendar .peak-ovulation a.ui-state-default, .ui-datepicker-calendar .post-period a.ui-state-default{color:#ffffff;} 

/* Black Fonts */
.ui-datepicker-calendar .period-days a.ui-state-default, .ui-datepicker-calendar .pre-period a.ui-state-default, .ui-datepicker-calendar .peak-ovulation a.ui-state-default, .ui-datepicker-calendar .post-period a.ui-state-default{ border-color: #ffffff;} /*should match page background*/
.pc-sub-hdg, .pc-q-title, .pc-calendar-container .pc-hdg-1, .pc-day-hdg, .pc-benefits-hdg {color:#000000;} 

/* Pre-Period */
.pre-period-color {color:#e44497; -webkit-print-color-adjust: exact; }
.ui-datepicker-calendar .pre-period a.ui-state-default{ background-color:#e44497; -webkit-print-color-adjust: exact; }
/* Peak Ovulation */
.peak-ovulation-color{color:#2ca2c9; -webkit-print-color-adjust: exact; }
.ui-datepicker-calendar .peak-ovulation a.ui-state-default{ background-color:#2ca2c9; -webkit-print-color-adjust: exact; }
/* Post-Period */
.post-period-color {color:#411c52; -webkit-print-color-adjust: exact; }
.ui-datepicker-calendar .post-period a.ui-state-default{ background-color:#411c52; -webkit-print-color-adjust: exact; }
.period-color {color:#18a0ae; -webkit-print-color-adjust: exact; }

/* Misc Grays */
.lt-gray, .pc-pag-ct , .pc-pag-ct a.inactive  {color:#999999; -webkit-print-color-adjust: exact; }
.flex-control-paging li a, .ui-datepicker-calendar tr th {background: #dddddd; -webkit-print-color-adjust: exact; }

/* Basic Grid 
-------------------------------*/

.pc-row {width:100%;display: inline-block;}
.pc-col-2 {width:50%; float:left;}
.pc-col-3 {width:33.33333333%; float:left;}

/* Bassic Helpers
-------------------------------*/

.pc-left {position:relative; float:left;}
.pc-right {position:relative; float:right;}
.object-fit-cover {object-fit:cover;}
.txt-center {text-align:center;}

/* Page Specific Resets
-------------------------------*/

.pageWrapper {width:100%; max-width:960px; padding: 0; box-sizing: border-box; font-size:16px; line-height:24px;}
a.pc-btn {width: 100%;margin: 30px auto; }
.sfContentBlock .base-hr {margin:10px 0;}
a, button, .add-to-calendar-checkbox, .nextPrevious {cursor: pointer; cursor: hand;}
.ui-state-default {cursor: default;}

/* Top Content
-------------------------------*/

.content-strip {padding:0;}
.top-img-container {display:inline-block; box-sizing: border-box; border:5px solid; }
.top-img-img img{display:block; height: auto;}
.top-img-text {padding:15px;}
.top-img-text .pc-hdg-1 {padding:0 0 15px 0; font-size:28px;}
.top-img-text p:first-of-type {padding:0 0 15px 0;}
.sub-pc-hdg-1 {font-size:20px;padding:0 0 5px 0;}
.top-img-container .top-img-text p:last-of-type {margin-bottom:0;}
.top-img-container .fa-holder {padding:5px 0 0 0;}
.top-img-container .fa-holder .fa {font-style:normal; font-size:25px; margin:0; padding-right:10px;}

/* Question Container 
-------------------------------*/

.pc-questions-container { text-align:center;}
.pc-sub-hdg {font-size:26px; padding: 30px 0; line-height: 30px;}
#init-dt { border:none; padding:0; margin:0;line-height: 34px;text-align: center;}
#init-dt, .inc-num-ct {font-size:20px;}
.inc-ct {text-align:center; margin: 0 auto; display: inline-block;}
.inc-num-ct {padding-right: 10px;}
.pc-q-ct {padding:30px 0;}
.pc-q-title {font-size:20px; padding: 0 10px 15px 10px;}
.q-btn-ct {position:relative; display:inline-block;}
.q-btn {background:transparent; border: none;line-height: 29px; font-size: 13px; padding-right: 10px;}
.q-btn-ct .fa {font-style:normal; margin: 0; padding: 0;}
.pc-q-ct:last-of-type {padding-bottom:0;}
.pc-questions-container .pc-btn {width:25%; margin:20px auto 20px auto;}
.dt-ct input[type="text"] { position: relative; }
.pc-questions-container input { font-family: 'FontAwesome'; }
.dt-ct:after { font-family: 'FontAwesome'; position: relative; left:5px; content: "\f073";}


/* Calendar Section
-------------------------------*/

.pc-calendar-container .pc-hdg-1 {font-size:28px; margin: 20px auto 20px auto;line-height: 20px;}
.pc-pag-ct {display:block;margin: 20px auto 30px auto; font-size:14px; text-align:right;line-height: 20px;}
.pc-next, .pc-prev {display:inline-block; padding: 0 5px;}
.pc-prev .fa {padding-right:5px; font-style:normal;}
.pc-next .fa {padding-left:5px; font-style:normal;}
.ui-datepicker{width:100% !important;}
.ui-widget-header .ui-icon { background-image: none;}
.ui-icon, .ui-widget-content .ui-icon { background-image: none;}
.ui-datepicker-prev .ui-icon-circle-triangle-w {background-image: url(../../Images/arrow_prev.png); background-position: 0px 0px; background-size: cover; background-color:transparent;}
.ui-datepicker-next .ui-icon-circle-triangle-e {background-image: url(../../Images/arrow_next.png); background-position: 0px 0px;background-size: cover;background-color:transparent;}
.ui-datepicker-prev, .ui-datepicker-next, .ui-datepicker-prev-hover, .ui-datepicker-next-hover {background-color:transparent;}
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {border: none;background: transparent;font-weight: normal; background-position: 0px 0px;background-size: cover;background-color:transparent;}
.ui-datepicker .ui-datepicker-next, .ui-datepicker .ui-datepicker-next-hover { top:0; right:0; padding: 2px; margin: 2px;}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-prev-hover { top:0; left:0; padding: 2px; margin: 2px;}
.pc-questions-container .ui-datepicker {font-size:14px;-webkit-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.05);-moz-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.05);box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.05); padding: 0; margin: 0; border: none;}
.pc-questions-container .ui-datepicker .ui-datepicker-title, .pc-questions-container .ui-datepicker .ui-datepicker-header {font-size:18px;}
.pc-questions-container .ui-state-default, .pc-questions-container .ui-widget-content .ui-state-default, .pc-questions-container .ui-widget-header .ui-state-default{cursor: pointer; cursor: hand;}
.ui-datepicker-multi-3 .ui-datepicker-group { width: 33.3%;box-sizing: border-box; padding: 0 10px;}
.ui-datepicker-calendar {width:100%;}
.ui-datepicker-multi .ui-datepicker-group table {width: 100%;margin: 0 auto;}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {border: none; background: none; font-weight: normal;  text-align: center; }
.ui-datepicker {padding:0;}
.ui-widget-content {border:none;}
.ui-datepicker td { border: none; padding: 1px;}
.ui-datepicker .ui-datepicker-title { margin: 0; line-height: normal;text-align: center; font-weight: bold;  font-size: 20px;    cursor: default;    }
.ui-icon { display: block; overflow: hidden; background-repeat: no-repeat;}
.ui-datepicker { padding: .2em .2em 0; display: none;}
.ui-datepicker td:before {content: "";display: block;padding-top: 100%; }
.ui-state-disabled .ui-state-default {  display: none;}
.ui-datepicker td a {  display: flex; padding: .2em; text-align: center;  text-decoration: none; position:  absolute; top: 0;   left: 0;   bottom: 0;   right: 0; justify-content: center; align-items: center;}
.ui-datepicker td { position: relative;  border: none;  padding: 1px;}
.ui-datepicker table {  width: 100%; table-layout:fixed !important; font-size: .9em; border-collapse: collapse;  margin: 0 0 .4em;}
.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { border-bottom-left-radius: 0px;  -webkit-border-bottom-left-radius:0px; -moz-border-radius-bottomleft: 0px;}
.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl {border-top-left-radius: 0px;  -webkit-border-top-left-radius:0px;-moz-border-radius-topleft: 0px;}
.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {border-bottom-right-radius: 0px;  -webkit-border-bottom-right-radius:0px; -moz-border-radius-bottomright: 0px;}
.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr {border-top-right-radius: 0px;  -webkit-border-top-right-radius:0px;-moz-border-radius-topright: 0px;}
.ui-datepicker .ui-datepicker-header { position: relative;padding: 10px 0; background-image: none;}
.ui-widget-header { width:100%; border: none;font-weight: bold; text-align:center; font-size:20px; padding:10px 0;box-sizing: border-box;}
.ui-datepicker-calendar tr th {  font-weight:bold; border-color:transparent; }
.pc-calendar-container .ui-datepicker-calendar tr {border-bottom: 1px dotted #ccc;}
.pc-calendar-container .ui-datepicker-calendar tr:last-of-type {border-bottom: none;}
.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: 0; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter: Alpha(Opacity=0);}
.ui-datepicker-calendar td a {font-weight:normal;}
.ui-datepicker-calendar .pre-period a.ui-state-default{ border-radius:50%;-moz-border-radius:50%; -webkit-border-radius:50%; }
.ui-datepicker-calendar .period-days a.ui-state-default{ border-radius:50%;-moz-border-radius:50%; -webkit-border-radius:50%;  }
.ui-datepicker-calendar .peak-ovulation a.ui-state-default{ border-radius:50%; -moz-border-radius:50%; -webkit-border-radius:50%; }
.ui-datepicker-calendar .post-period a.ui-state-default{ border-radius:50%; -moz-border-radius:50%; -webkit-border-radius:50%;  }
.pc-calendar-container {margin-bottom: 30px;}
.pc-key { line-height: initial;display: flex;}
.key { display: inline-flex; padding-right: 8px; align-items: center; justify-content: center;}
.key .fa {font-style:normal; padding-right:3px;margin: 0; font-size: 12px;}
.pc-add-to-cal {text-align:right;}
.pc-add-to-cal a{font-weight:normal;}
.add-to-calendar-checkbox:before {font-family: 'FontAwesome'; position: relative; content: "\f064"; padding-right:3px;}
.igoogle:before {font-family: 'FontAwesome'; position: relative; content: "\f1a0"; padding-right:3px; color: #2ca2c9;}
.iyahoo:before {font-family: 'FontAwesome'; position: relative; content: "\f19e"; padding-right:3px; color: #2ca2c9;}
.ical:before {font-family: 'FontAwesome'; position: relative; content: "\f073"; padding-right:3px; color: #2ca2c9;}
.disclaimer p { margin:10px 10px 20px 10px;}
.btm-btn-ct {display:block;}


/* Product Slider
-------------------------------*/

.pc-product-slider .flex-viewport {padding:20px 0 0 0;}
.pc-product-slider .slides .pc-col-3 {box-sizing: border-box; padding:10px;}
.produt-img-ct { margin: auto; text-align: center; }
.pc-day-hdg {font-size:26px; padding-bottom: 5px;}
.pc-benefits-hdg {font-size:20px; padding-bottom: 5px; /*text-transform: capitalize;*/}
.product-benefits { list-style-type:disc; margin-left: 20px; /*text-transform: capitalize;*/}
.product-benefit {line-height: 18px;/*font-size:14px;*/}
.pc-product-slider .flex-control-nav { margin-bottom: 0px; position: relative; bottom: inherit; left: inherit; text-align: center;width: 100%;}
.flex-control-nav { padding-top:10px; border-top: 3px solid;}
.prod-link .pc-btn {width:75%; margin:15px 0 0 0;}
.flex-control-paging li a {width: 10px; height: 10px; display: block; cursor: pointer;text-indent: -9999px;border-radius:50%; -moz-border-radius:50%; -webkit-border-radius:50%;box-shadow: none;}
.flex-control-paging li a:hover, .flex-control-paging li a.flex-active {border-radius:50%; -moz-border-radius:50%; -webkit-border-radius:50%;}
.flex-direction-nav {display: none;}

/* Media Queries
-------------------------------*/

@media screen and (min-width: 1024px) { 
	.sfContentBlock { padding: 0;}
	.top-img-img img{ min-height: 300px; }
	.dot-border {border-right:1px dotted #ccc;border-left:1px dotted #ccc;}
	.top-img-container {max-height:310px;}
	.q-btn-ct {float:left;}
	.inc-ct {text-align:center; margin: 0 auto; display: flex; justify-content: center; vertical-align: baseline; align-items: center; }
	.btn-print {width:100%; max-width:230px; margin: 0 10px; position:relative; float:right;}
	.btn-save {width:100%; max-width:230px; margin:0 10px; position:relative; float:left;}
	.btn-save .pc-btn, .btn-print .pc-btn {margin:0;}
	.cal-counter:before {content:"3";}
	.pc-product-slider .flex-viewport {padding:20px 0;}
	.ui-datepicker-calendar .period-days a.ui-state-default, .ui-datepicker-calendar .pre-period a.ui-state-default, .ui-datepicker-calendar .peak-ovulation a.ui-state-default, .ui-datepicker-calendar .post-period a.ui-state-default{ border: 5px solid;}
}

@media screen and (min-width: 769px) and (max-width: 1023px) {
	.sfContentBlock { padding: 0 20px;}
	.top-img-img img{ min-height: 300px; }
	.pc-q-title {font-size:18px; padding: 0 10px 15px 10px;color:#000;}
	.inc-num-ct {font-size:18px;}
	.dot-border {border-right:1px dotted #ccc;border-left:1px dotted #ccc;}
	.top-img-container {max-height:310px;}
	.q-btn-ct {float:left;}
	.inc-ct {text-align:center; margin: 0 auto; display: flex; justify-content: center; vertical-align: baseline; align-items: center; }
	.btn-print {width:100%; max-width:230px; margin: 0 10px; position:relative; float:right;}
	.btn-save {width:100%; max-width:230px; margin:0 10px; position:relative; float:left;}
	.btn-save .pc-btn, .btn-print .pc-btn {margin:0;}
	.ui-datepicker-group-last  {display:none;}
	.ui-datepicker-multi-3 .ui-datepicker-group {width:50%;}
	.cal-counter:before {content:"2";}
	.ui-datepicker-calendar .period-days a.ui-state-default, .ui-datepicker-calendar .pre-period a.ui-state-default, .ui-datepicker-calendar .peak-ovulation a.ui-state-default, .ui-datepicker-calendar .post-period a.ui-state-default{ border: 10px solid;}
	.pc-product-slider .flex-viewport {padding:20px 0;}
	.pc-calendar-container .pc-hdg-1, .top-img-text .pc-hdg-1 {font-size:26px;}
	.pc-sub-hdg, .pc-day-hdg {font-size:24px;}
	.sub-pc-hdg-1, .inc-num-ct , .pc-q-title, .ui-widget-header, .pc-benefits-hdg, .ui-datepicker .ui-datepicker-title {font-size:18px;}
}

@media screen and (max-width: 768px) {
	.pc-col-2,
	.pc-col-3 {width:100%;}
	.dot-border {border-top:1px dotted #ccc;border-bottom:1px dotted #ccc;}
	.pc-q-ct {padding: 15px 0;}
	.q-1 {padding:0;}
	.inc-ct, #dt, .pc-questions-container {text-align:left;}
	.pc-q-title {padding: 0 0px 15px 0px;font-size:20px;}
	.inc-num-ct {font-size:20px;}
	a.pc-btn{width:75%;}
	.inc-ct {width:100%;}
	.q-btn-ct {float:right;}
	.q-btn {padding: 5px 20px; font-size:16px;}
	.btn-print a.pc-btn {margin:20px auto 0 auto;}
	a.pc-btn {margin:20px auto;}
	.pc-questions-container .pc-btn {width:75%;}
	.pc-product-slider .slides .pc-col-3 {padding:0px;}
	.pc-calendar-container .pc-col-3:nth-child(2), .pc-calendar-container .pc-col-3:nth-child(3), .pc-pag-ct, .flex-direction-nav a.flex-next, .flex-direction-nav a.flex-prev{ display:none;}
	.pc-calendar-container .pc-col-3:nth-child(1) .ui-datepicker-group {float:none;}
	.prod-link .pc-btn {margin:20px auto 20px auto;}
	.ui-datepicker-multi-3 .ui-datepicker-group {width:100%;}
	.ui-datepicker-group-middle, .ui-datepicker-group-last  {display:none;}
	.ui-datepicker, .ui-datepicker-multi-3 .ui-datepicker-group {padding:0;}
	.ui-widget-content {border:none;}
	.pc-key .pc-col-2 {width:50%;}
	.key {justify-content: flex-start; width: 100%;}
	.ui-datepicker-calendar .period-days a.ui-state-default, .ui-datepicker-calendar .pre-period a.ui-state-default, .ui-datepicker-calendar .peak-ovulation a.ui-state-default, .ui-datepicker-calendar .post-period a.ui-state-default{ border: 15px solid;}
}

@media screen and (max-width: 480px) {
	.pc-col-2,
	.pc-col-3 {width:100%;}
	.dot-border {border-top:1px dotted #ccc;border-bottom:1px dotted #ccc;}
	.pc-q-ct {padding: 15px 0;}
	.q-1 {padding:0;}
	.inc-ct,#dt, .pc-questions-container {text-align:left;}
	.pc-q-title {padding: 0 0px 15px 0px;font-size:20px;}
	.inc-num-ct {font-size:20px;}
	a.pc-btn{width:75%;}
	.inc-ct {width:100%;}
	.q-btn-ct {float:right;}
	.q-btn {padding: 5px 20px; font-size:16px;}
	a.pc-btn {margin:20px auto;}
	.pc-questions-container .pc-btn {width:75%;}
	.pc-product-slider .slides .pc-col-3 {padding:0px;}
	.pc-calendar-container .pc-col-3:nth-child(3) .ui-datepicker-group, .pc-pag-ct, .flex-direction-nav a.flex-next, .flex-direction-nav a.flex-prev{ display:none;}
	.pc-calendar-container .pc-col-3:nth-child(1) .ui-datepicker-group {float:none;}
	.prod-link .pc-btn {margin:20px auto 20px auto;}
	.ui-datepicker-calendar .period-days a.ui-state-default, .ui-datepicker-calendar .pre-period a.ui-state-default, .ui-datepicker-calendar .peak-ovulation a.ui-state-default, .ui-datepicker-calendar .post-period a.ui-state-default{ border: 5px solid;}
}
@media screen and (max-width: 1023px) {
	.pc-calendar-container .pc-col-3:nth-child(2), .pc-calendar-container .pc-col-3:nth-child(3), .pc-pag-ct, .flex-direction-nav a.flex-next, .flex-direction-nav a.flex-prev{ display:none;}
	.ui-widget-content {border:none;}
}
.flex-control-nav li{margin:0 6px;display:inline-block;zoom:1;*display:inline;}
sup {font-size: 60%;}