/* Some Google Fonts 
  <link href="https://fonts.googleapis.com/css?family=Montserrat:400,500,600|Amiri:400|Open+Sans:400|Great+Vibes" rel="stylesheet"> */
/* latin-ext */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v12/JTUSjIg1_i6t8kCHKm459Wdhyzbi.woff2) format('woff2');
  src: local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v12/JTUSjIg1_i6t8kCHKm459WlhzQ.woff) format('woff');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v12/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2) format('woff2');
  src: local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v12/JTUSjIg1_i6t8kCHKm459WlhzQ.woff) format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 500;
  src: local('Montserrat Medium'), local('Montserrat-Medium'), url(https://fonts.gstatic.com/s/montserrat/v12/JTURjIg1_i6t8kCHKm45_ZpC3gfD_u50.woff2) format('woff2');
  src: local('Montserrat Medium'), local('Montserrat-Medium'), url(https://fonts.gstatic.com/s/montserrat/v12/JTURjIg1_i6t8kCHKm45_ZpC3gnD-A.woff) format('woff');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 500;
  src: local('Montserrat Medium'), local('Montserrat-Medium'), url(https://fonts.gstatic.com/s/montserrat/v12/JTURjIg1_i6t8kCHKm45_ZpC3gnD_g.woff2) format('woff2');
  src: local('Montserrat Medium'), local('Montserrat-Medium'), url(https://fonts.gstatic.com/s/montserrat/v12/JTURjIg1_i6t8kCHKm45_ZpC3gnD-A.woff) format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  src: local('Montserrat SemiBold'), local('Montserrat-SemiBold'), url(https://fonts.gstatic.com/s/montserrat/v12/JTURjIg1_i6t8kCHKm45_bZF3gfD_u50.woff2) format('woff2');
  src: local('Montserrat SemiBold'), local('Montserrat-SemiBold'), url(https://fonts.gstatic.com/s/montserrat/v12/JTURjIg1_i6t8kCHKm45_bZF3gnD-A.woff) format('woff');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  src: local('Montserrat SemiBold'), local('Montserrat-SemiBold'), url(https://fonts.gstatic.com/s/montserrat/v12/JTURjIg1_i6t8kCHKm45_bZF3gnD_g.woff2) format('woff2');
  src: local('Montserrat SemiBold'), local('Montserrat-SemiBold'), url(https://fonts.gstatic.com/s/montserrat/v12/JTURjIg1_i6t8kCHKm45_bZF3gnD-A.woff) format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans Regular'), local('OpenSans-Regular'), url(https://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFW50bbck.woff2) format('woff2');
  src: local('Open Sans Regular'), local('OpenSans-Regular'), url(https://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFVZ0d.woff) format('woff');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans Regular'), local('OpenSans-Regular'), url(https://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFVZ0b.woff2) format('woff2');
  src: local('Open Sans Regular'), local('OpenSans-Regular'), url(https://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFVZ0d.woff) format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Amiri';
  font-style: normal;
  font-weight: 400;
  src: local('Amiri Regular'), local('Amiri-Regular'), url(https://fonts.gstatic.com/s/amiri/v10/J7aRnpd8CGxBHpUgtLMA7w.woff2) format('woff2');
  src: local('Amiri Regular'), local('Amiri-Regular'), url(https://fonts.gstatic.com/s/amiri/v10/J7aRnpd8CGxBHpUutLU.woff) format('woff');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Amiri';
  font-style: normal;
  font-weight: 400;
  src: local('Amiri Regular'), local('Amiri-Regular'), url(https://fonts.gstatic.com/s/amiri/v10/J7aRnpd8CGxBHpUutLM.woff2) format('woff2');
  src: local('Amiri Regular'), local('Amiri-Regular'), url(https://fonts.gstatic.com/s/amiri/v10/J7aRnpd8CGxBHpUutLU.woff) format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Great Vibes';
  font-style: normal;
  font-weight: 400;
  src: local('Great Vibes'), local('GreatVibes-Regular'), url(https://fonts.gstatic.com/s/greatvibes/v5/RWmMoKWR9v4ksMfaWd_JN9XLiaQ6DQ.woff2) format('woff2');
  src: local('Great Vibes'), local('GreatVibes-Regular'), url(https://fonts.gstatic.com/s/greatvibes/v5/RWmMoKWR9v4ksMfaWd_JN9XFiaI.woff) format('woff');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Great Vibes';
  font-style: normal;
  font-weight: 400;
  src: local('Great Vibes'), local('GreatVibes-Regular'), url(https://fonts.gstatic.com/s/greatvibes/v5/RWmMoKWR9v4ksMfaWd_JN9XFiaQ.woff2) format('woff2');
  src: local('Great Vibes'), local('GreatVibes-Regular'), url(https://fonts.gstatic.com/s/greatvibes/v5/RWmMoKWR9v4ksMfaWd_JN9XFiaI.woff) format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

body {
 padding:0;
 margin:0;
 font-family: "Montserrat",sans-serif;
 font-weight:400;
 line-height:1.7;
 color:#333;
 transition: 0.5s;
 -webkit-print-color-adjust: exact;
}
body .ie-only {
 display:none;
}
body.ms-ie .ie-only {
 display:inline;
}

section {
 page-break-after: always;
}
section.constrained-static .container {
 max-width:76em;
}
body.landscape-right main section {
 padding-right:env(safe-area-inset-right); /* for iPhone X Notch */
}
p, article {
 font-family: "Open Sans",sans-serif;
 font-size:1em;
}
a {
 color:#333;
 text-decoration:none;
 transition: background .15s,color .15s;
}
p a, article .content a:not(.button) {
 /* the next two lines give a thicker grey underline instead of the default underline */
 border-bottom:2px solid #bbb;
}
p a:hover, article .content a:not(.button):hover {
 color: #ccc;
 border-bottom:2px solid #354c64;
}
img {
 vertical-align:middle;
}
article .content img {
 width:100%;
 -webkit-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.3);
 -moz-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.3);
 box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.3);
}

article .content .celeb {
 overflow:hidden;
 background: #f8f8f8;
 margin-bottom:1em;
 padding: 1em 1.5em;
}
article .content .celeb h4 {
 margin-bottom:0.5em;
 margin-top:0.5em;
 text-align:center;
}
article .content .celeb img {
 float:left;
 margin-right:1.5em;
 width:160px;
}
article .content p.quote {
 font-style:italic;
}
article .content span.quote::before,
article .content p.quote::before {
 content: "\201C";
}
article .content span.quote::after,
article .content p.quote::after {
 content: "\201D";
}
article .content .celebList {
 column-count:2;
}

html.modal, html.sidenav-open {
 overflow:hidden;
 position:relative;
 height:100%;
}

body.modal, body.sidenav-open {
 overflow:hidden;
 position:relative;
/* height:100%; */
/* after transform, position:fixed, top 0 is no longer the top of the screen, it's the top of the entire page */
/* transform: translateX(-600px);
 transition: 0.3s;
*/
}

body.sidenav-open .sidenav {
 width:600px; /* the width of the sidenav */
 /* compensate for the body transform: translateX(-600px), needed for chrome only */
 /* right:-600px; */
}
/*
body.ms-ie.sidenav-open .sidenav {
 right:0;
 transition: 0.3s;
}
*/

figure {
 margin:0;
 -webkit-margin-before: 0;
 -webkit-margin-after: 0;
 -webkit-margin-start: 0;
 -webkit-margin-end: 0;
 position:relative; /* without this and z-index:0 figure always on top layer */
 page-break-inside: avoid;
}
.overlay, .modal-overlay {
 height: 100%;
 width:100%;
 opacity: 0;
 display: none;
 position: fixed;
 background:rgba(17,17,17, 0.85);
 top:0;
 left:0;
 z-index:480; /* higher than the overlay-btn */
}
.overlay {
 cursor: pointer;
}
.overlay .close-btn {
 position:fixed;
 top:30%;
 padding 1em;
 transform: rotate(270deg) translateY(-25px);
}
.overlay a.close-btn {
 color:#eee;
}

body.modal .modal-overlay,
body.sidenav-open .overlay {
 display:block;
 opacity: 1;
}

/* right side navigation buttons */
.overlay-btn {
 display: none;
 position: fixed;
 bottom: 50%;
 right: -20px;
 margin-right:0;
 z-index: 450;  /* below the sidenav */
 border: none;
 outline: none;
 background: rgba(53,76,100, 0.5);
 color: #fff;
 cursor: pointer;
 padding: 6px;
 border-radius: 6px;
 font-size:0.9em;
 transform: rotate(270deg) translateY(-25px);
}
.favorite-icon {
 position: absolute;
 bottom:0;
 font-size:2em;
 color:rgba(0,0,0, 0.3);
 cursor: pointer;
 padding:5px;
}
.fp-list figure .favorite-icon {
 font-size:1em;
 bottom:0.25em;
}

/* the favorite button on the left */
#favorite-btn {
 display: none;
 position: fixed;
 right: -0.15em;
 bottom: 66%;
 font-size:1.7em;
 color:rgba(0,0,0, 0.4);
 cursor: pointer;
 z-index: 450;  /* below the sidenav */
 margin-right:0;
}
.favorite-icon.favorite,
#favorite-btn.favorite {
 color:rgba(255,0,0,0.5);
}

body.landscape-right #related-btn,
body.landscape-right #search-btn,
body.landscape-right #favorite-btn,
body.landscape-right #top-btn,
body.landscape-right #freeinfo-btn,
body.landscape-right #photo-btn,
body.landscape-right #contact-btn {
 margin-right:env(safe-area-inset-right); /* for iPhone X Notch */
}

#search-btn:before {
 content: 'Show Search Criteria';
}
#search-btn.open:before {
 content: 'Hide Search Criteria';
}

#search-btn.overlay-btn {
 bottom: 20%;
 right: -84px;
 background: rgba(128,176,181,0.6);
}
#search-btn.overlay-btn.open {
 right: -81px;
}
#search-btn.overlay-btn.open {
 background: rgba(53,76,101,0.7);
}
#top-btn.overlay-btn {
 bottom: 57%;
 right: -26px;
}
#freeinfo-btn.overlay-btn {
 bottom: 20%;
 right: -56px;
}
#photo-btn.overlay-btn {
 bottom: 47%;
 right: -38px;
}
#contact-btn.overlay-btn {
 bottom: 32%;
 right: -49px;
}
#related-btn.overlay-btn {
 bottom: 40%;
 right: -63px;
}

.title,h1,h2,h3,h4,h5,h6,h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{
 font-family:"Amiri",serif;
 font-weight:400;
 color: #354c65;
 line-height:1.2;
}
h1 {
 font-size:3em;
}
h2 {
 font-size:2em;
}
h3 {
 font-size:1.9em;
}
h4 {
 font-size: 1.7em;
}

button, .button {
 font-family: "Montserrat",sans-serif;
 text-transform: uppercase;
 font-weight: 500;
 font-size: 0.875em;
 color:#354c64;
 display:inline-block;
 background: rgba(255,255,255,0.5);
 padding:3px; /* along witht he span inside button, create a double border effect */
 cursor:pointer;
}
.button span, button span {
 display:inline-block;
 border: 1px solid rgba(255,255,255,0.2);
 padding: 0.6em 2em;
}
.button:hover, button[type=submit]:hover {
 background: rgba(255,255,255,0.6);
}
.button-group {
 margin-top:2em;
}
.button-group:first-child {
 margin-left:0;
}
.button-group.light .button span, .button-group.light button span {
  color:white;
}
.button-group.light .button, .button-group.light button[type=submit] {
 background:#acd7db;
}
.button-group.light .button:hover,.button-group.light button[type=submit]:hover {
 background:#9aced3
}

ol.breadcrumb {
 padding: 8px 16px 8px 0;
 list-style: none;
 background-color: rgba(255,255,255,0); /* transparent */
 text-align:center;
}
ol.breadcrumb li {display: inline;}
ol.breadcrumb li+li:before {
 padding: 4px;
 color: #ddd;
 content: "/\00a0";
}
ol.breadcrumb li a {
 color: #354c64;
 font-size:0.9em;
}
ol.breadcrumb li a:hover {
 border-bottom:1px solid #888;
}

.container {
 overflow:auto;
 padding-left:1em;
 padding-right:1em;
}
section .container {
 margin-left:auto;
 margin-right:auto;
}

header {
 background: rgba(255,255,255, 0);
 position:fixed;
 top:0;
 width:100%;
/*
 -webkit-transition: margin-left 0.7s, background 0.5s;
 -moz-transition: margin-left 0.7s, background 0.5s;
 -ms-transition: margin-left 0.7s, background 0.5s;
 -o-transition: margin-left 0.7s, background 0.5s;
 transition: margin-left 0.7s, background 0.5s; /* 0.7 second transition effect to slide in the sidenav */
*/
 -webkit-transition: background 0.5s;
 -moz-transition: background 0.5s;
 -ms-transition: background 0.5s;
 -o-transition: background 0.5s;
 transition: background 0.5s;
}
header .container {
 height:4em;
 padding:1.5em;
 width:100%;
 overflow:hidden;
}
header.scrolled {
 /* background transition doesn't seem to work with gradient */
 /*background:linear-gradient(rgba(255,255,255,1.0),rgba(255,255,255,0.8));  */
 background: rgba(255,255,255, 0.95);
 transition: background 0.5s;
 -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
 -moz-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
 box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);                
 z-index:479; /* always on top, but below the sidenav, and below the dark overlay */
}
header.scrolled .container {
 padding-top: 0.5em;
 padding-bottom: 0.5em;
}

#navbar {
 overflow: hidden;
 position:absolute;
 left:50%;
 -webkit-transform:translateX(-50%);
 transform:translateX(-50%);
}

/* Navbar links */
#navbar a, #navbar-right a {
 float: left;
 display: block;
 color: #354c64;
 text-align: center;
 padding: 1em 1em 2.5em 1em;
 text-transform: uppercase;
 letter-spacing: .125em;
 font-size: 0.875em;
 font-weight: 500;
 border-bottom: 1px solid rgba(202,200,177,.15);
 transition: border-color .15s;
}

#navbar a:hover, #navbar-right a:hover {
  border-bottom: 1px solid rgba(238,247,248, 1);
  transition: border-color .15s;
}

/* Right-aligned section inside the top navigation */
#navbar-right {
  float: right;
  margin-right:1em;
}
header .container .navbar-logo a.tel-link, header .container .navbar-logo a.form-link {
 display:none;
}

/*html{box-sizing:border-box;height:101%}*,::after,::before{box-sizing:inherit} */

/* Special Font for American Adoptions, open ttf to view 
 * a (\61, or &97; or U+0061) = youtube logo
 * b (\62, or &98; or U+0062) = twitter logo
 * ...
 */
@font-face{
 font-family:"american-adoptions";
 src:url(/assets/fonts/american-adoptions.eot);
 src:url(/assets/fonts/american-adoptions.eot?#iefix) format("embedded-opentype"),url(/assets/fonts/american-adoptions.woff) format("woff"),url(/assets/fonts/american-adoptions.ttf) format("truetype"),url(/assets/fonts/american-adoptions.svg#american-adoptions) format("svg");
 font-weight:400;
 font-style:normal
}
[class*=" icon-"]:before,[class^=icon-]:before{
 font-family:"american-adoptions"!important;
 font-style:normal!important;
 font-weight:400!important;
 font-variant:normal!important;
 text-transform:none!important;
 speak:none;
 line-height:1;
 vertical-align:middle;
 -webkit-font-smoothing:antialiased;
 -moz-osx-font-smoothing:grayscale
}
.icon-youtube:before{content:"\61"}
.icon-twitter:before{content:"\62"}
.icon-google:before{content:"\64"}
.icon-facebook:before{content:"\65"}
.icon-arrow:before{content:"\66"}
.icon-play:before{content:"\63"}
.icon-contact:before{content:"\67"}
.icon-login:before{content:"\68"}
.icon-angle-down:before{content:"\69"}
.icon-burger:before{content:"\6a"}
.icon-star:before{content:"\6c"}
.icon-long-arrow-left:before{content:"\6b"}
.icon-long-arrow-right:before{content:"\6d"}
.icon-angle-right:before{content:"\6e"}
.icon-heart:before{content:"\6f"}
.icon-heart-full:before{content:"\70"}
.icon-angle-left:before{content:"\71"}
.icon-angle-up:before{content:"\72"}
.icon-angle-down.active:before{content:"\72"}
.icon-angle-down.open:before{content:"\72"}
.icon-baby::before {content: url(/assets/images/aa-icon_baby.svg);} 
.icon-parents::before {content: url(/assets/images/aa-icon_parents.svg);} 
.icon-religion::before {content: url(/assets/images/aa-icon_religion.svg);} 
/* Load FontAwesome icons */
@font-face {
  font-family: 'FontAwesome';
  src: url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.eot?v=4.7.0');
  src: url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'), url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'), url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}
.fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  /* add a box around the search icon */
  border: 1px solid #354c64;
  border-radius: 5px;
  width: 3em;
  text-align: right;
  padding: 3px;
}
.fa-search:before {
  content: "\f002";
}

/* make the video play icon a circle */
.icon-play {
 display: inline-block;
 border-radius: 50%;
 border: 1px solid rgba(53,76,101,0.1);
 width: 2.1em;
 height: 1.9em;
 padding-top: 0.2em;
 padding-left: 0.05em;
 background: rgba(255,255,255,0.3);
 text-align: center;
}
a .icon-play:hover {
 background: rgba(255,255,255,0.6);
}

/* The main side navigation menu */
.sidenav {
 display:block;
 width:0; /* effective hidden when closed */
 max-width:100%; /* can never be wider then the viewport */
 height: 100%; /* 100% Full-height */
 position: fixed; /* Stay in place */
 z-index: 500; /* Stay on top */
 top: 0;
 right:0;
 /* stay on the right side, accomodate the body transform translateX(-600px) */
 /*right:-600px; */
 background:#f1f1f1;
 overflow:hidden; /* Disable both horizontal and vertical scroll */
 -webkit-transition: width 0.3s linear;
 -moz-transition: width 0.3s linear;
 -ms-transition: width 0.3s linear;
 -o-transition: width 0.3s linear;
 transition: width 0.3s linear; /* transition effect to slide in the sidenav */
}
body.ms-ie .sidenav {
 right: 0; 
}

.sidenav-header {
 background: white;
 padding:0 0 0.8em 0;
 border-bottom: 1px solid #bec5cd;
 overflow:hidden;
}
.sidenav-header .logo {
 display:inline;
 padding-left:1em;
}
.sidenav-header .logo img{
 margin-top:0.5em;
}

/* Position and style the close button (top right corner) */
.sidenav .close-btn {
 display:inline-block;
 float:right;
 padding-top: 1em;
 padding-right:1em;
 color: #354c64;
 font-size: 2em;
 z-index:100;
}
.sidenav .close-btn, .sidenav .logo,
.sidenav a.close-btn:hover, .sidenav a.logo:hover {
  background: white;
}
.sidenav .close-btn:hover {
 color:#5e7084;
}

/* The navigation menu links */
.sidenav a, .dropdown-btn {
 font-size: 20px;
 color: #eee;
 display: block;
 transition: 0.2s;
 border: none;
 outline: none;
 cursor: pointer;
 text-align:center;
 text-transform:uppercase;
}

.sidenav-links {
 padding:0;
 height:100vh;
 overflow-y:scroll;
 overflow-x:hidden;
}

.sidenav-links a {
 background:#5e7084;
 padding:1.8em 0 1.8em 0;
 border-bottom:1px solid #aaa;
}

.sidenav-links .dropdown-btn {
 color: #333;
 border-bottom: 1px solid #bdc4cc;
 transition: background .15s;
 background:#dadee1;
 padding:1.5em 0 1.5em 0;
}
button.dropdown-btn {
 width:100%;
}

button.dropdown-btn i {
 float:right;
 margin-right: 0.5em;
}

.dropdown-container button.dropdown-btn i {
 color:#eee;
}

.sidenav a:hover {
 background-color: #354c64;
}
.sidenav .dropdown-btn:hover {
 color: #aaa;
}

.sidenav .sidenav-links #search a {
 padding-top:0;
 padding-bottom:0;
 text-align:left;
 background:white;
 text-transform:none;
 border-bottom:none;
 line-height:1;
}
.sidenav .sidenav-links #search input[type=button] {
 background:white;
 width:5em;
}
.sidenav .sidenav-links #search,.sidenav iframe {
 display:none;
}

/* Add an active class to the active dropdown button */
.dropdown-btn.active {
 color:#354c64;
}

/* Dropdown container (hidden by default by setting max-height to 0) */
/* display:none is not used because it doesn't have transition effect */
.dropdown-container {
 padding:0 1em 0 2em;
 overflow:hidden;
 max-height:0;
 -webkit-transition:max-height, 1s cubic-bezier(0, 1.05, 0, 1);
 -moz-transition: max-height, 1s cubic-bezier(0, 1.05, 0, 1);
 -ms-transition: max-height, 1s cubic-bezier(0, 1.05, 0, 1);
 -o-transition: max-height, cubic-bezier(0, 1.05, 0, 1)1s ;
 transition: max-height, 1s  cubic-bezier(0, 1.05, 0, 1); /* max-height is set to a large value, so start fast and end slow to minimize delay effect */
}
.dropdown-container.open {
 max-height:6000px;
 margin-bottom:0.5em;
 -webkit-transition:max-height, 1s linear;
 -moz-transition: max-height, 1s linear;
 -ms-transition: max-height, 1s linear;
 -o-transition: max-height, 1s linear;
 transition: max-height, 1s linear;
}
.dropdown-container a, .dropdown-container .dropdown-btn {
 background:#5e7084;
 color: #eee;
 text-align:left;
 padding: 1.5em 1em 1.5em 1em;
 text-transform: none;
 font-size:1em;
}
/* Add a star before and after the featured link */
.dropdown-container a.featured:before,
.dropdown-container a.featured:after {
 content:url(/assets/images/stars-small.svg);
 opacity: 0.425;
 position:relative;
 top: 0.5em;
/*
 -webkit-transform: translateY(-60%);
 transform: translateY(-60%);
*/
}
.dropdown-container a.featured {
 padding: 0.4em 1em 0.6em 1em; 
}
.dropdown-container a.featured span {
 display:inline-block;
 text-align:center;
 text-transform:uppercase;
 height:2em;
 width: calc(100% - 86px);
}
.dropdown-container a.featured:hover {
 color:#999;
}
.dropdown-container a.featured:nth-child(3n+0) {
 background:#364c64;
}
.dropdown-container a.featured:nth-child(3n+1) {
 background:#5e7084;
}
.dropdown-container a.featured:nth-child(3n+2) {
 background:#72b5bd;
}
.dropdown-container button.dropdown-btn i {
 right: 1.5em;
}

/* 2nd level drop down */
.dropdown-container .dropdown-container {
 margin-bottom:0; 
 padding:0;
}
.dropdown-container .dropdown-container a, .dropdown-container .dropdown-container .dropdown-btn {
 background:#718191;
 color: #eee;
 text-align:left;
 padding: 1.4em 1em 1.4em 1.5em;
 text-transform: none;
 font-size:0.9em;
}

/* 3nd level drop down */
.dropdown-container .dropdown-container .dropdown-container a, .dropdown-container .dropdown-container .dropdown-container .dropdown-btn {
 background:#888;
 color: #eee;
 text-align:left;
 padding: 1.3em 1.0em 1.3em 2em;
 text-transform: none;
 font-size:0.8em;
}

/* top hero section */
#hero {
 text-align:center;
 background: #ccc;
 background-size: cover;
/* background-position: center; */
 background-image: url(/assets/images/header_home.jpg);
 background-position: 50% 40%;
 background-repeat: no-repeat;
 height: 28em;
}

#hero::before {
 content: '';
 display: block;
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 12em;
 /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0.95+0,0+85 */
 background: -moz-linear-gradient(top, rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.6) 40%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
 background: -webkit-linear-gradient(top, rgba(255,255,255,0.9) 0%,rgba(255,255,255,0.6) 40%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
 background: linear-gradient(to bottom, rgba(255,255,255,0.9) 0%,rgba(255,255,255,0.6) 40%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */
}

#hero .container {
 overflow:hidden;
 max-width:106em;
 padding-bottom: 3em; /* should be at least the same amount as the margin-top of the .button-group, otherwise the buttom will be cut off */
 position: relative;
 top: 8em;
 color: white;
 opacity: 0.95;
}

#hero .container h1 {
 color:rgba(53,76,100,0.95);
 font-size: 2.8em;
 margin-bottom: .5em;
 text-align:center;
 width:42%;
 padding-left:0.5em;
/*
 padding-left:1.3em;
 text-indent:-0.3em;
*/
}

#hero .button {
 color:white;
 border:1px solid #ccc;
 margin-left: 2em;
 color:#354c64;
 padding:0;
}

#hero #video-btn.button {
 border:0;
 background:none;
 width:40%;
 display:block;
 text-align:center;
 font-size:0.9em;
}
/* internal page hero section */
#hero.inner {
 height:16em;
}
/* little extra shadow transparency on top of the hero section */
#hero.inner::before {
 height:10em; 
 background: -moz-linear-gradient(to bottom,rgba(255,255,255,.9) 0%,rgba(255,255,255,.7) 30%,rgba(255,255,255,.2) 70%,rgba(255,255,255,0) 100%);
 background: -webkit-linear-gradient(to bottom,rgba(255,255,255,.9) 0%,rgba(255,255,255,.7) 30%,rgba(255,255,255,.2) 70%,rgba(255,255,255,0) 100%);
 background: linear-gradient(to bottom,rgba(255,255,255,.9) 0%,rgba(255,255,255,.7) 30%,rgba(255,255,255,.2) 70%,rgba(255,255,255,0) 100%);
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ffffff', endColorstr='#00ffffff',GradientType=0 )
 opacity: 0.9;
}

#hero.inner .container {
 top:5em;
 padding-bottom:1em;
}

/*
#hero.inner.adoption .container {
 position:relative;
 top:3em;
}
#hero.inner.adoption .container h1 {
 width:42%;
}
#hero.inner.adoption .container #video-btn.button {
 width:40%;
 margin-left:2em;
}
*/

#hero.inner .container h1 {
 width:100%;
}
#hero.inner .container #video-btn.button {
 width:100%;
}
#hero.inner .button {
 margin-left:auto;
}

#hero.inner .container ol.breadcrumb li a {
 color: rgba(53,76,100,0.9);
}

/* adopt, pregnant header has darker background, so use lighter color */
#hero.inner.adopt .container h1,
#hero.inner.adopt .container .button,
#hero.inner.adopt .container ol.breadcrumb li a,
#hero.inner.pregnant .container h1,
#hero.inner.pregnant .container .button,
#hero.inner.pregnant .container ol.breadcrumb li a {
 color:rgba(255,255,255,0.9);
}

#hero.inner.pregnant {
 background-image: url(/assets/images/header_pregnant.jpg);
}
#hero.inner.adopt {
 background-image: url(/assets/images/header_adopt.jpg);
}
#hero.inner.adoption {
 background-image: url(/assets/images/header_adoption.jpg);
}
/* end of top hero section */

/* contact bar section */
#contact .container {
margin-top:5.1em; /* compensate for the removal of hero section */
 padding: 1.5em 0.5em;
 text-align:center;
 background:#354c64;
 color:white;
}
#contact .container a {
 color:white;
 display:inline-block;
 background:#f8f8f8; 
 color: #354c64;
 font-size:0.9em;
 font-weight:600;
 padding:0.2em 0.5em;
 margin:0;
 border-radius: 5px;
 box-shadow: 3px 3px 5px grey;
}
#contact .container a:hover {
 background: #80b0b5;
}

#contact i { /* star icon */
 color: #80b0b5;
 margin: 0 0.5em 0 0.5em;
}

#burger {
 float:right;
 padding:0.2em;
 font-size:1.5em;
}
#burger a {
 color:white;
}

.supplement-top-nav {
 z-index:450; /* same layer as the overlay-btn */
 width:100%;
 text-align:center;
 color: white;
 background-color:rgba(128,176,181,0.85);
 font-size:0.9em;
 overflow:hidden;
}
.supplement-top-nav a.button {
 display:inline-block;
 padding:6px 10px 6px 10px;
 border-radius: 3px;
 color:white;
 text-transform:none;
/* background:rgba(53,76,100,0.4); */
 background:none;
 margin-left:0.1em;
 margin-right:0.1em;
}
body.landscape-left .supplement-top-nav a.button:first-of-type {
 margin-left:env(safe-area-inset-left); /* for iPhone X Notch */
}
body.landscape-right .supplement-top-nav a.button:last-of-type {
 margin-right:env(safe-area-inset-right); /* for iPhone X Notch */
}
.supplement-top-nav a.button:hover {
 color: #354c64;
}
.supplement-top-nav a.button span {
 border:0;
 padding:0;
}
main.scrolled .supplement-top-nav {
 position:fixed;
 top:5.65em;
}

#page-error-message .container {
 width:60em;
 text-align:center;
}

footer {
 background: #374f67;
}

footer a {
 color: rgba(255,255,255,0.8);
 transition: background 0.15s, color 0.15s;
 display:block;
}
footer p {
 color: rgba(200,200,200,0.8);
}

footer .container {
 padding: 3em 1.5em 3em 1.5em;
 margin-top:1em;
}
footer .site-info {
 float:left;
 width:25%;
}
footer .site-info .footer-logo img {
 max-width:95%;
}
footer .site-info a {
 margin-bottom: 1.25em;
}
footer .site-info a.tel-link {
 font: 2.25em "Amiri",serif;
 margin-bottom: 1.1em;
}
footer .site-links {
 float:left;
 width:72%;
}
footer .site-links h4 {
 color: rgba(255,255,255,0.5);
 margin: 0;
}
footer .site-links ul {
 list-style:none;
 padding-left:0;
 line-height: 2.5;
}
footer .site-links ul a {
 color: rgba(237,239,241,0.5);
 transition: color 0.15s;
}
footer .site-links ul a:hover {
 color: rgba(237,239,241,0.9);
 transition: color 0.15s;
}
footer .site-links>div {
 float:left;
 display:block;
 margin-left:2%;
 width: 31%;
}

footer .social {
 margin-top: 1.5em;
}
footer .social a {
 display: inline-block;
 font-size: 1.8125em;
}

footer .seo {
 background: #4c6c7d;
 color: #afbbc2;
 padding: 3em 2em 1em 2em;
 margin-top: 1em;
}
footer .seo h4 {
 color: white;
 margin-top: 0;
 margin-bottom: 0.7em;
}
footer .seo p {
 margin-top: 0;
}

.videoWrapper, .video-wrapper {
 position: relative;
 padding-bottom: 56.25%; /* 16:9 */
 padding-top: 25px;
 height: 0;
 max-height:calc(100% - 10em);
}
.videoWrapper object, .video-wrapper object,
.videoWrapper embed, .video-wrapper embed,
.videoWrapper iframe, .video-wrapper iframe {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
}

.table {
 display:table;
}
.table-row {
 display:table-row;
}
.table-column {
 display:table-column;
}
.table-cell {
 display:table-cell;
}

.tabs {
 display:flex;
 overflow:hidden;
 width:100%;
 padding:0;
 margin:0;
 border:0;
}
.tabs button, .tab-title {
 border:0;
 outline:none;
 font-size:1.25em;
 display: inline-block;
 box-sizing: border-box;
 width: 100%;
 text-align: center;
 color: #fff;
 text-transform: uppercase;
 padding: 2em 1em;
 letter-spacing: .0375em;
}
.tabs button {
 float:left; /* without float left, there'll be a small gap between elements due to the space characters in HTML code between the two elements */
}

.tab-content {
 margin-top:-8px;
 padding:2em;
 display:none;
}
.tabs button:nth-child(n),
.tab-title:nth-of-type(6n-4),
.tab-content:nth-of-type(6n-3) {
 background: #364c64;
}
.tabs button:nth-child(n),
.tab-content:nth-of-type(6n-3) {
 display:block; /* default show the first tab content */
}
.tabs button:nth-child(2n),
.tab-title:nth-of-type(6n-2),
.tab-content:nth-of-type(6n-1) {
 background: #5b728c;
}
.tabs button:nth-child(3n),
.tab-title:nth-of-type(6n),
.tab-content:nth-of-type(6n+1) {
 background: #8d99a6;
}

.tab-content .container {
 background:white;
 text-align:left;
 padding:1em 2em;
 max-width:40em;
}
.tab-content article {
 border-bottom: 1px solid #d8e6ef;
 padding:1em;
 overflow:hidden;
}
.tab-content article:last-of-type {
 border-bottom:none;
}
.tab-content article .button {
 border:1px solid #bbc4cb;
 padding:0.8em 1.5em;
 color:#6f8293;
 display:inline-block;
 float:right;
}

/******************************************************************/
/****** form style ************************************************/
/******************************************************************/
form input:not([type=checkbox]):not([type=radio]), form select, form textarea {
 box-sizing:border-box;
 width: 100%;
 border: 1px solid #ccd3d9;
 font-family: "Open Sans",sans-serif;
 font-size:0.95em;
 line-height: 1.125;
 padding: .5em;
 margin-bottom:0.1em;
 border-radius: 0;
 color: #374d65;
 outline:none;  /* disable default outline, need to define :focus css */
/* height: auto;  */
 height:2.2em; 
 -webkit-appearance:none; /* disable all IOS formatting */
 -webkit-transition: all 0.2s ease-in-out;
 -moz-transition: all 0.2s ease-in-out;
 -ms-transition: all 0.2s ease-in-out;
 -o-transition: all 0.2s ease-in-out;
}
form input:not([type=checkbox]):not([type=radio])::placeholder,  /* Chrome, Firefox */
form input:not([type=checkbox]):not([type=radio])::-moz-placeholder,  /* Firefox 19 */
form input:not([type=checkbox]):not([type=radio]):-moz-placeholder,  /* Firefox 18- */
form input:not([type=checkbox]):not([type=radio]):-ms-input-placeholder,  /* IE 10-11 */
form input:not([type=checkbox]):not([type=radio])::-ms-input-placeholder,  /* Edge */
form input:not([type=checkbox]):not([type=radio])::-webkit-input-placeholder, /* Chrome/Opera/Safari */
form textarea:-ms-input-placeholder, /* IE 10-11 */
form textarea::-ms-input-placeholder { /* Edge */
 color: #aaa;
 font-size:0.8em;
}

form input:not([type=checkbox]):not([type=radio]):focus, form select:focus, form textarea:focus {
 box-shadow: 0 0 5px #acd7db;
 border: 1px solid #acd7db;
}
form textarea {
 height:4em;
}

.b-form div {
 transition: 0.3s; /* does not apply to "display" */
}
.b-form label.header {
 font: 1.5em/1.375 "Amiri",serif;
 display:block;
}
.input-field-wrap {
 margin-top:0.7em;
 margin-bottom:1.1em;
 display:block;
}
.input-field-wrap.inline {
 display:inline-block;
 margin-top:0;
 margin-bottom:0.4em;
}

.input-field-wrap label {
 font-size: 1em;
 display:block;
}
.input-field-wrap label.question {
 font-weight:500;
 margin-bottom:0.2em;
}

.input-field-wrap label.question.inline,
.input-field-wrap.inline label.question,
.input-field-wrap.inline select,
.input-field-wrap.inline input:not([type=checkbox]):not([type=radio]) {
 display:inline-block;
 width:auto;
}
.b-form h4.required::after,
.input-field-wrap.required label.question::after {
 content:"*";
 color:red;
}

.b-form .radio-wrap.inline input[type="radio"],
.b-form .radio-wrap.inline label {
 display:inline;
 width:auto;
 float:none;
}
.b-form .radio-wrap.inline input[type="radio"] {
 margin-right:2em;
}
.b-form .radio-wrap.inline label {
 margin-right:0.3em;
}
.b-form input {
 margin-bottom:0.3em;
}
.b-form h4 {
 margin-bottom:0.2em;
}

.instruction {
 margin-top:0.5em;
 margin-bottom:0.5em;
 background:#ffffcc;
 padding:0.5em 1em 0.5em 1em;
 border:1px solid #ffcc00;
 border-radius: 2px;
}

.errormsg, .disclaimer {
 margin-top:0.5em;
 margin-bottom:0.5em;
 background:rgba(253,253,240,0.7);
 padding:0.5em 1em 0.5em 1em;
 border:1px solid #ffe197;
}
.errormsg {
 color:#ff9966;
 font-weight:600;
}
.noticemsg {color:#080;
 margin-top:0.5em;
 margin-bottom:0.5em;
 background:rgba(238,254,238,0.7);
 border:1px solid #bbb;
 padding:0.5em 1em 0.5em 1em;
}

form .b-actions,
.b-form .b-actions {
 float: none;
 text-align: center;
 margin-top: 1.6875em;
 padding:4px;
}

.b-actions button, .b-actions .button, .b-actions .btn,
.b-actions button, .b-actions .btn, .b-actions button.btn {
/* border: 1px solid rgba(255,255,255,.2); 
 border-style:outset;
*/
 border:none;
 padding: 3px;
 width: auto;
 text-transform: uppercase;
 color: white;
 letter-spacing: 0.175em;
 cursor: pointer;
 font-size: 0.875em;
 font-weight: 500;
 display: inline-block;
 text-align:center;
 background:#354c64;
 transition: background 0.15s;
 margin:0.5em;
}
.b-actions button:hover,
.b-actions .button:hover,
.b-actions .btn:hover {
 background: #9aced3;
}

.b-actions button span {
 display: block;
 border: 1px solid rgba(255,255,255,.2);
 padding: 1em 2.5em;
}
aside .b-actions button, aside .b-actions .button, aside .b-actions .btn,
aside .b-actions button, aside .b-actions .btn, aside .b-actions button.btn {
 margin:0;
 width:100%;
}
aside .b-actions button span, aside .b-actions .button span {
 width:calc(100% - 4em);
}

/* center the Google ReCaptcha box */
div.g-recaptcha>div {
 margin:auto;
}
/* floating-labels */
.input-field-wrap.float-label {
 position:relative;
}
.input-field-wrap.float-label label.question {
 position:absolute;
 top: 0.4em;
 left:0.5em;
 font-size:0.9em;
 padding-left:0.5em;
 padding-right:0.5em;
 transition: all 0.3s;
 background:white;
 width:fit-content;
 color:#888;
 cursor: text;
 display:inline-block; 
 min-width:70%
}
.input-field-wrap.float-label label.question.float {
 font-size:0.7em;
 -moz-transform: translateY(-1.35em);
 -ms-transform: translateY(-1.35em);
 -webkit-transform: translateY(-1.35em);
 transform: translateY(-1.35em);
 color:#4ea9b1;
 min-width:5%;
}

/* Customize checkbox and radio button */
/* https://www.w3schools.com/howto/howto_css_custom_checkbox.asp */
/* Customize the label (the container) */
.checkbox-container, .radio-container {
 display: block;
 position: relative;
 padding-left: 30px;
 margin-bottom: 12px;
 margin-right:1em;
 cursor: pointer;
 -webkit-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;
}

.input-field-wrap.inline .checkbox-container,
.input-field-wrap.inline .radio-container,
.checkbox-container.inline,
.radio-container.inline {
 display: inline-block;
}

/* Hide the browser's default checkbox */
.checkbox-container input {
 position: absolute;
 top:0;
 opacity: 0;
 cursor: pointer;
}

/* Create a custom checkbox */
.checkmark {
 position: absolute;
 top: 0.12em;
 left: 0;
 height: 20px;
 width: 20px;
 background-color: #eee;
}

/* On mouse-over, add a grey background color */
.checkbox-container:hover input ~ .checkmark,
.radio-container:hover input ~ .checkmark {
 background-color: #ccc;
}

/* When the checkbox is checked, or radio button is clicked, add a blue background */
.checkbox-container input:checked ~ .checkmark,
.radio-container input:checked ~ .checkmark {
 background-color: #acd7db;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
 content: "";
 position: absolute;
 display: none;
}

/* Show the checkmark when checked */
.checkbox-container input:checked ~ .checkmark:after,
.radio-container input:checked ~ .checkmark:after {
 display: block;
}

/* Style the checkmark/indicator */
.checkbox-container .checkmark:after {
 left: 7px;
 top: 3px;
 width: 5px;
 height: 10px;
 border: solid white;
 border-width: 0 3px 3px 0;
 -webkit-transform: rotate(45deg);
 -ms-transform: rotate(45deg);
 transform: rotate(45deg);
}

/* Customize radio button */
/* https://www.w3schools.com/howto/howto_css_custom_checkbox.asp */
/* Customize the label (the container) */
.radio-container {
 display: block;
 position: relative;
 padding-left: 35px;
 margin-bottom: 12px;
 cursor: pointer;
 -webkit-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;
}

/* Hide the browser's default radio button */
.radio-container input {
 position: absolute;
 opacity: 0;
}

/* Create a custom radio button */
.radio-container .checkmark {
 border-radius: 50%;
}

/* Style the indicator (dot/circle) */
.radio-container .checkmark:after {
 top: 6px;
 left: 6px;
 width: 8px;
 height: 8px;
 border-radius: 50%;
 background: white;
}
/******************************************************************/
/****** End of form style *****************************************/
/******************************************************************/

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.dot.active, .dot:hover {
  background-color: #717171;
}

/* multipage navation links */
.multi-page-nav {
 display:block;
 width:100%;
 overflow:hidden;
}
.multi-page-nav .num {
 text-align: center;
}
.multi-page-nav .num a,
.multi-page-nav .num span {
 display:inline-block;
 border: 1px solid #d5dadf;
 padding: 0.5em 0.1em 0.5em 0.1em;
 margin:0.5em 0.2em 0 0.2em;
 min-width: 3em;
 color: #555;
 transition: background 0.15s, color 0.15s;
 font-size: 0.875em;
 font-weight: 500;
 letter-spacing: 0.15em;
}
.multi-page-nav .num a#prev-page, .multi-page-nav .num a#next-page {
 padding-left: 0.2em;
 padding-right: 0.2em;
}

.multi-page-nav .num a:hover {
 color:white;
 background:#354c64;
}
.multi-page-nav .num span.current {
 background:#888;
 color:white;
}

/* Fading animation */
.fade {
 -webkit-animation-name: fade;
 -webkit-animation-duration: 1.5s;
 animation-name: fade;
 animation-duration: 1.5s;
}

@-webkit-keyframes fade {
 from {opacity: .4} 
 to {opacity: 1}
}

@keyframes fade {
 from {opacity: .4} 
 to {opacity: 1}
}

.only-print, .only-print * {
  display: none !important;
}


body.embed header,
body.embed nav,
body.embed section#hero,
body.embed section#contact,
body.embed section#more-questions,
body.embed section.featured-card,
body.embed aside#sidebar,
body.embed ol.breadcrumb,
body.embed footer {
 display:none
}

/* Family Slider */
section#family-slider  {
 text-align:center;
 width:100%;
 overflow:hidden;
 height:690px;
 position:relative;
}

section#family-slider div {
 width:3000vw;
 /*transform: translateX(-50%); */
 position:relative;
 top:0;
 left:0;
 overflow:hidden;
}
section#family-slider img {
 height:230px;
 border:0;
 transition:opacity .15s;
 float:left;
}

section#trust-logos {
 background: #fff;
 padding: 0;
 margin-bottom:1em;
}
section#trust-logos img {
 width:25%;
 height:auto;
 float:left;
}
section.show-case {
 background-size: cover;
 background-position: center;
 background-repeat: no-repeat;
 text-align: center;
 margin-bottom:1.5em;
}
section.show-case#bp-ask-a-question {
 background-image:url(/assets/images/aa-cta_birthmom.jpg);
}

section.show-case .container {
 padding: 8em 3em;
}

section.show-case .title {
 font-size: 3.375em;
 color: #fff;
 line-height: 1.125;
 margin-bottom: .59259em;
 letter-spacing: .01375em;
}
section.show-case .button {
 background: #fff;
 color: #354c64;
 display: inline-block;
 padding: 2em 1.5em;
 border-radius: 7px;
 text-transform: none;
 font-weight: 600;
 font-size: 1em;
 box-shadow: 0 0 40px 10px rgba(0,0,0,.4);
 min-width: 16em;
}
section.show-case .button .icon-arrow {
 font-size:1em;
}
section.show-case .button i {
 color: #b3d2d6;
 margin-left: .5em;
}

section#family-slider .button {
 position: absolute;
 top: 50%;
 left: 50%;
 -webkit-transform: translate(-50%,-50%);
 transform: translate(-50%,-50%);
}

.modal-overlay .video-wrapper {
 position: absolute;
 top: 50%;
 left: 50%;
 width:100%;
 -webkit-transform: translate(-50%,-50%);
 transform: translate(-50%,-50%);
}
.modal-close {
 color: white;
 position: absolute;
 top: 10px;
 right: 0px;
 padding:0 0.3em 0 0.5em;
 font-size: 55px;
 font-weight: bold;
 z-index:10;
}

.modal-close:hover,
.modal-close:focus {
 color: #999;
 cursor: pointer;
}

a.article-read-link {
 font-weight: 500;
 color: #354c64;
}
a.article-read-link i {
 position: relative;
 color: #b8d5d8;
 margin-left: .25em;
}

/* Featured Article Card */
section.featured-card {
 position: relative;
 display:block;
 overflow:hidden;
 text-align:center;
 background:#efefec;
 height:32em;
 max-height:40em;
 padding: 2.5em 0 1em 0;
/* font-size:1.125em; */
}
section.featured-card:before,
section.featured-card:after {
 position: absolute;
 width: 40em;
 height: 14.21384em;
 background: url(/assets/images/stars.svg) no-repeat center/cover;
 content: '';
 z-index: 0;
 opacity: .8;
}
section.featured-card:before {
 top: 2.25em;
}
section.featured-card:after {
 bottom: -1em;
}

section.featured-card:nth-of-type(odd):before,
section.featured-card:nth-of-type(odd):after {
 -webkit-transform: rotateY(180deg);  /* top-left */
 transform: rotateY(180deg);
 left: 3.25em;
}
section.featured-card:nth-of-type(even):before,
section.featured-card:nth-of-type(even):after {
 right: 3.25em;
}

section.featured-card .container {
 position: relative;
 z-index: 1;
 max-width: 76em;
 overflow:hidden;
 padding:2em 0 1em 0;
 height:100%;
}
section.featured-card h3 {
 font-size:2.25em;
} 
section.featured-card p {
 font-size:1.1em;
}
section.featured-card .description {
 position:absolute;
 top: 7.5em;
 display: block;
 background: #fff;
 padding: 1em 3em 2em 3em;
 margin-right: 2.35765%;
 box-sizing:border-box;
 width: 60%;
 box-shadow: 0 0 30px 10px rgba(197,194,184,.2);
 z-index: 2;
 min-height:25em;
}
section.featured-card:nth-of-type(odd) .description {
 right: 0;
}
section.featured-card:nth-of-type(even) .description {
 left: 1em;
}

section.featured-card figure {
 box-sizing:border-box;
 width:100%;
 margin-left:1em;
 margin-right:1em;
}
section.featured-card figure img {
 box-sizing:border-box;
 box-shadow: 0 0 30px 10px rgba(197,194,184,.2);
 width: 50%;
 height: auto;
}
section.featured-card:nth-of-type(odd) figure,
section.featured-card:nth-of-type(odd) img {
 float:left;
}
section.featured-card:nth-of-type(even) figure,
section.featured-card:nth-of-type(even) img {
 float:right;
}

/* Article View with ASIDE */
section.with-sidebar {
 display:block;
 overflow:hidden;
}
section#article-view .article-wrapper {
 max-width:70em;
 padding:0 1em 2em 1em;
 margin-right:auto;
 margin-left:auto;
 overflow:hidden;
}

section#landing-page-intro {
 margin-bottom:3em;
 text-align:center;
}
section#landing-page-intro a.button {
 padding:0.7em;
}

section.featured-list article .title,
section#article-view .article-wrapper article .title {
 border-bottom:1px solid #ccc;
 margin-bottom:1em;
 text-align:center;
}
section#article-view .article-wrapper article .content {
 box-sizing: border-box;
 float:left;
 width:65%;
 margin-right:2%;
 padding:0 0 1em 0;
}
aside {
 box-sizing: border-box;
 float:left;
 width:33%;
}
aside.featured-list .container {
 padding-top:1.5em;
 padding-bottom:0.5em;
 overflow:hidden;
}
aside .explore {
 background: #e9edf0;
 margin-bottom: 2em;
 overflow:hidden;
}

aside .explore a {
 padding:1.125em 1em;
 font-weight:500;
 color: #384c67;
 text-transform: uppercase;
 display:block;
 position:relative;
}

aside .explore span.text {
 display:inline-block;
 width: calc(100% - 2em);
}
aside .explore span.plus {
 width: 1.8em;
 height: 1.8em;
 border: 1px solid #768394;
 position:relative;
 float: right;
}
span.plus::before {
 width:2px;
 height:0.9em;
 content: '';
 background: #384e65;
 position: absolute;
 top: 50%;
 left: 50%;
 -webkit-transform: translate(-50%,-50%);
 transform: translate(-50%,-50%)
}
span.plus::after {
 width:0.9em;
 height:2px;
 content: '';
 background: #384e65;
 position: absolute;
 top: 50%;
 left: 50%;
 -webkit-transform: translate(-50%,-50%);
 transform: translate(-50%,-50%);
}

section#article-view .container article aside .title {
 font-size:1.9em;
 border-bottom:none;
}
section#article-view .container article aside.featured-list .container .item {
 width:100%;
 float:none;
}
section#article-view .container article aside.featured-list .container .item .title {
 font-size:1em;
}
aritcle aside figure {
 display: block;
 width: 100%;
 margin: 2em 0 .5em;
}
article aside figure figcaption {
 background: #e5f3f4;
 padding: 1em 1.25em;
 transition: background .15s;
 position: relative;
 z-index: 1;
}

/* article view aside */
section#article-view .container article aside.featured-list .container .item:nth-of-type(n+5) {
 /* enable vertical center for the figure*/
 display: flex;
 margin-top:1em;
 background: #e5f3f4;
}
section#article-view .container article aside.featured-list .container .item:nth-of-type(n+5) figure {
 width:4.5em;
 display:inline-block;
 box-sizing:border-box;
 float:left;

 /* vertical center align */
 display: flex;
 justify-content: center;
 flex-direction: column;
}
section#article-view .container article aside.featured-list .container .item:nth-of-type(n+5) figure img {
 height:4.5em; /* without an explicit height, IE will use the original image height as the flex container height */
 width:4.5em;
 object-fit:cover;
}
section#article-view .container article aside.featured-list .container .item:nth-of-type(n+5) .title {
 width:calc(100% - 4.6em);
 box-sizing:border-box;
 display:inline-block;
 padding: 0.5em 0.5em 0.5em 1em;
 text-align:left;
 margin-bottom:0;
 height:4.6em;
}
section#article-view .container article aside.featured-list .container .item:nth-of-type(n+5) .title>a {
 font-size:0.85em;
}
section#article-view .container article aside.featured-list .container .item:nth-of-type(n+5) .title>a i {
 display:none;
}

/* Featured Category/Article List */
.featured-list {
 box-sizing:border-box;
}
.featured-list .container {
 padding:0 1em 1em 1em;
 max-width:76em;
}

/* the category description on top of the category listing, fade away + drawer effect */
.featured-list .container article .content-wrapper {
 position:relative;
 max-height:8em;
 max-width:40em;
 margin-left:auto;
 margin-right:auto;
 overflow:hidden;
 font-size:1.1em;
 padding-bottom:2em;
 text-align:center;
 -webkit-transition:max-height, 1s cubic-bezier(0, 1.05, 0, 1);
 -moz-transition: max-height, 1s cubic-bezier(0, 1.05, 0, 1);
 -ms-transition: max-height, 1s cubic-bezier(0, 1.05, 0, 1);
 -o-transition: max-height, cubic-bezier(0, 1.05, 0, 1)1s ;
 transition: max-height, 1s  cubic-bezier(0, 1.05, 0, 1); /* when open, the max-height is set to a large value, so start fast and end slow to minimize delay effect */
}
.featured-list .container article .content-wrapper .mask{
 position:absolute;
 top:0;
 width:100%;
 height:100%;
 z-index:1;
 background:-moz-linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 30%,rgba(255,255,255,1) 80%, rgba(255,255,255,1) 100%);
 background:linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 30%,rgba(255,255,255,1) 80%, rgba(255,255,255,1) 100%);
}
.featured-list .container article .content-wrapper .mask a {
 display:block;
 width:100%;
 position:absolute;
 bottom:0;
 background:white;
}
.featured-list .container article .content-wrapper a i.icon {
 font-size:1.6em;
 color:#777;
}
.featured-list .container article .content-wrapper .mask a:hover {
 background:#eee;
}
.featured-list .container article .content-wrapper.open {
 max-height:20000px;
 -webkit-transition:max-height, 1s linear;
 -moz-transition: max-height, 1s linear;
 -ms-transition: max-height, 1s linear;
 -o-transition: max-height, 1s linear;
 transition: max-height, 1s linear;
}
.featured-list .container article .content-wrapper.open .mask{
 background:rgba(255,255,255,0);
 z-index:-100; /* send the mask to bottom layer so it doesn't cover the content */
}

/*.featured-list .container article .content-wrapper.open .mask i.icon-angle-down:before{content:"\72"}*/
.featured-list .container article .content-wrapper.open .mask a {
 display:none;
}
/* end of category description on top of the category listing*/

.featured-list .container article .content {
 margin-bottom:2em;
 text-align:justify;
}

.featured-list .container article .content h1,
.featured-list .container article .content h2{
 text-align:center;
}
.featured-list .container .row {
 display:flex; /* make all .item divs in this row the same height */
 overflow:hidden;
 margin-bottom:1.5em;
 clear:both;
}

.featured-list .container .row .item {
 float: left;
 display: block;
 margin-right: 1.6%;
 width: 23.8%;
 background:white;
 border:1px solid #ddd;
 overflow:hidden;
 position:relative;
 padding-bottom:2em; /* enough padding for the "...more" button */
}
.featured-list .container .row .item:last-of-type {/* last item don't need margin */
 margin-right:0;
}

.featured-list .container .item figure,
.featured-list .container .item img {
 width: 100%;
}
.featured-list .container .item .title {
 font-family: "Montserrat",sans-serif;
 padding:0.8em 1.3em;
 font-size:1.05em;
 font-weight: 500;
 color:#354c64;
 background: #e5f3f4;
 transition: color .15s,background .15s;
}

.featured-list .container .item .title {
 padding:1.2em 0.5em;
 height:2em; /* enough height for 2 line of texts, without it will have uneven height when text wraps to 2 lines */ 
 text-align:center;
 /* vertical center */ 
 display: flex;
 justify-content: center;
 flex-direction: column;
}
.featured-list .container .item .title:hover {
 background: rgba(53,76,101,0.7);
}
.featured-list .container .item a:hover .title,
.featured-list .container .item .title:hover>a {
 color:white;
}
.featured-list .container .item a {
 transition: color .15s,background .15s
}
.featured-list .container .item .title>a {
 color:#354c64;
}

.featured-list .container .item .title>a i {
 float:right;
 border:1px solid #cddae0;
 width:2em;
 height:2em;
 margin-left:1em;
 line-height:2;
 display: block;
 text-align:center;
 font-size: 0.6em;
 color:#728596;
}
.featured-list .container .item .title>a:hover i {
 background:#fff;
}
.featured-list .container .item .synopsis {
 font-family: "Open Sans",sans-serif;
 padding:0.5em 0.7em 1em 0.7em;
 font-size:0.96em;
}
.featured-list .container .item .featured-articles {
 background: white;
 margin-top: -4px;
 padding: 0.7em;
}
.featured-list .container .item .featured-articles a {
 display:block;
 color:#222;
 font-family: "Open Sans",sans-serif;
 font-weight:600;
 font-size:0.85em;
 padding:0.8em 0 0.8em 0;
 border-bottom: 1px solid #ddd;
 position:relative;
}
.featured-list .container .item .featured-articles a span.plus {
 position:absolute;
 right:0.5em;
 top:50%;
 font-size:0.7em;
}
.featured-list .container .item .featured-articles a span.plus:before,
.featured-list .container .item .featured-articles a span.plus:after {
 background: #555;
}

.featured-list .container .item .featured-articles a:last-of-type {
 border-bottom:0;
 font-weight:500;
 /* put the "...more" button at the lower right corder of the .item box */
 position:absolute;
 bottom:0;
 right:1em;
 text-align:right;
}
/* override the previous a css if it appears in article synoposis. */
.featured-list .container .item .featured-articles .synopsis a {
  position: relative;
  display:inline;
  right:0;
}
.featured-list .container .item .featured-articles a:hover {
 color:#aaa;
}
.featured-list .container .item .featured-articles a:hover span.plus:before,
.featured-list .container .item .featured-articles a:hover span.plus:after {
 background: #aaa;
}

/* these are only used for the home page */
section#how-it-works .container,
section#blog-feed .container {
 width:96%;
 max-width:76em;
 text-align:center;
 overflow:hidden;
}
section#how-it-works .container h2,
section#blog-feed .container h2 {
 font-size:3em;
}
section#how-it-works .container>p {
 font-size:1.125em;
 width:60%;
 margin:0 auto 1.5em auto;
}
.icon-blocks-wrap {
 margin-top:3em;
 overflow:hidden;
 position:relative;
}
.icon-block {
 width: calc(25% - 3.13em); /* 3.125 = 2 x 1em (padding) + 1.5*3/4 (margin) */
 background: #eef7f8;
 padding: 7.5em 1em 3em;
 margin: 7em 1.5em 3em 0;
 position: relative;
 float:left;
 display:block;
 height:10em;
}
.icon-block:last-of-type {
 margin-right:0;
}
.icon-block h4 {
 font: 500 1.3em "Montserrat",sans-serif;
 color: #354c64;
 margin: 0 0 1em;
}
.icon-block figure {
 background: #fff;
 border-radius: 50%;
 width: 11.25em;
 height: 11.25em;
 position: absolute;
 top: 0;
 left: 50%;
 -webkit-transform: translate(-50%,-50%);
 transform: translate(-50%,-50%);
 margin: 0;
 box-shadow: 0 0 30px 10px rgba(143,172,182,.1);
}
.icon-block figure>div {
 font: 500 1.875em "Montserrat",sans-serif;
 width: 100%;
 position: absolute;
 left: 0;
 bottom: 1.25em;
 color: #354c64;
}
.icon-block figure>div span.odometer {
 font-family:"Montserrat",sans-serif;
}
section#blog-feed {
 background: #f3f3f1;
 padding: 1em 0;
}
section#blog-feed .container .posts {
 display:flex;
 width:100%;
}
section#blog-feed .post {
 background: #fff;
 box-sizing:border-box;
 float: left;
 display: block;
 margin-right: 2.35765%;
 width: 31.76157%;
 text-align: left;
 padding: 2.8125em 2.8125em 3.4375em;
}
section#blog-feed .post:last-of-type {
 margin-right:0;
}
section#blog-feed .post .info {
 color: #82bec8;
}
section#blog-feed img {
 width: 100%;
 height: auto;
}
/* these are only used for state-adoption pages */
section#state-links {
 background:#f3f3f1;
 text-align:center;
}
section#state-links .container{
 max-width:70em;
 padding:2em;
}
section#state-links .container .content{
 column-count:3;
 column-gap:2em;
 column-width:20em;
 text-align:center;
}
section#state-links .container a {
 display:block;
 margin-bottom:0.5em;
}

.container.errormsg {
 max-width:60em;
 text-align:center;
 padding:2em;
}
/* These need to be at the last so they override all others */
*.medium, *.mobile {
 display:none;
}
*.desktop {
 display:inline-block;
}
.desktop#pregFreeInfoIntroVideo {
 display:block;
}

@media print {    
 .no-print, .no-print * {
   display: none !important;
 }
 .only-print, .only-print * {
   display:block !important;
 }

 body {
  font-size:10pt;
 }

 header.scrolled,
 header.scrolled .container .navbar-logo,
 header .container .navbar-logo {
   display:none;
 }
 /* https://www.smashingmagazine.com/2013/03/tips-and-tricks-for-print-style-sheets/ */

 article a {
  font-weight: bolder;
 }
 article a[href^=http]:after {
   content:" <" attr(href) "> ";
 }
 article a[href^="#"]:after {
   content: "";
 }
 a:after > img {
   content: "";
 }
 a:not(:local-link):after {
   content:" <" attr(href) "> ";
 }

 section#article-view .article-wrapper article .content, aside {
  float:none;
  width:100%;
  margin:0;
 }
 aside.featured-list .container {
  padding:0;
 }

 @page {
  margin:1.9cm;
 }
}

/* On smaller screens, where height is less than 450px */
@media screen and (max-height: 450px) {
 #favorite-btn {
  bottom: 68%
 }
 #top-btn.overlay-btn {
  bottom: 68%;
 }
 #photo-btn.overlay-btn {
  bottom: 40%;
 }
 #contact-btn.overlay-btn {
  bottom: 18%;
 }
 #related-btn.overlay-btn {
  bottom: 42%;
 }
 #freeinfo-btn.overlay-btn {
  bottom: 6%;
 }

 /* side nav logo and close button */
 .sidenav-header {
  padding-bottom: 0;
 }
 .sidenav-header .logo {
  padding-top: 0px;
  text-align:left;
 }
 .sidenav-header .logo img {
  height:55px;
 }
 .sidenav .close-btn {
  padding:0.5em 0.5em 0 0.5em;
  font-size: 1.7em;
 }
 /* top level links/dropdowns */
 .sidenav-links a, .sidenav-links .dropdown-btn {
  padding:0.8em 0 0.8em 0;
  font-size:1em;
  margin-top: 0;
  margin-bottom: 0;
 }

 /* 1st level links/dropdowns */
 .dropdown-container a, .dropdown-container .dropdown-btn {
  padding: 0.8em 1em 0.8em 1em;
  font-size:0.9em;
 }

 .dropdown-container a.featured {
  padding: 0 1em 0.8em 1em;
 }
 .dropdown-container a.featured span {
  height:1.3em;
  width: calc(100% - 86px);
 }

 /* 2nd level links/dropdowns */
 .dropdown-container .dropdown-container a, .dropdown-container .dropdown-container .dropdown-btn {
  padding: 0.8em 1em 0.8em 1.5em;
  font-size:0.8em;
 }
 /* 3nd level links/dropdowns */
 .dropdown-container .dropdown-container .dropdown-container a, .dropdown-container .dropdown-container .dropdown-container .dropdown-btn {
  padding: 0.7em 1.0em 0.7em 2em;
  font-size:0.7em;
 }
}

@media screen and (min-width: 1800px) {
 #hero .container h1 {
  margin-top:0.1em;
  padding-left:0.2em;
  width:40%;
  font-size: 3.5em;
 }
}
@media screen and (max-width: 960px) {
 header, header.scrolled {
  background:#80b0b5;
  height:2.5em;
 }
 header.scrolled .container .navbar-logo {
  /* background transition doesn't seem to work with gradient */
  /*background:linear-gradient(rgba(255,255,255,1.0),rgba(255,255,255,0.8));  */
  background: rgba(255,255,255, 0.95);
  transition: background 0.9s;
  -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);                
 }

 header .container, header.scrolled .container {
  padding: 0;
 }
 #navbar {
  display:block;
  left:0;  /* align all the way to the left */
  -webkit-transform:translateX(0);
  transform:translateX(0);
 }
 
 main.scrolled .supplement-top-nav {
  top:6.75em;
 }
 body.embed main.scrolled .supplement-top-nav {
  top:0;
 }
 body.embed main {
  position:relative;
  top:2em;
 }

 #navbar a, #navbar-right a {
  color:white;
  padding-bottom:0.5em;
 }
 #navbar-right {
  margin-right:0.5em;
 }

 header .container .navbar-logo {
  display: block;
  position: fixed;
  top: 2.5em;
  width:100%;
  text-align:left;
  padding-top:0.4em;
  padding-bottom:0.2em;
  background:rgba(255,255,255,0);
 }

 header.scrolled .container .logo {
  display:none;
 }

 header .container .navbar-logo a.tel-link {
  display:block;
  float:right;
  text-align:right;
  color: #354c64;
  padding-right:1em;
  font-size:1.3em;
 }
 header.scrolled .container .navbar-logo {
  text-align:center;
 }
 header.scrolled .container .navbar-logo a.form-link,
 header.scrolled .container .navbar-logo a.tel-link {
  float:none;
  display:inline-block;
  background: #354c64;
  color:#f8f8f8;
  font-size:1.1em;
  padding:0.2em 0.8em;
  margin-left:1em;
  margin-right:1em;
  margin-bottom:0.3em;
  border-radius: 5px;
  box-shadow: 3px 3px 5px grey;
 }
 header.scrolled .container .navbar-logo a.form-link:hover,
 header.scrolled .container .navbar-logo a.tel-link:hover {
  background: #80b0b5;
 }

 header .container .navbar-logo img {
  float:left;
  width:45%;
  text-align:left;
 }
 
 /* hero section */
 #hero {
  height: 23em;
 }
 #hero .container {
  top: 7em;
 }
 #hero .container h1 {
  padding-left:0.2em;
  width:50%;
  font-size: 2.2em;
 }
 /* internal page hero section */
 #hero.inner {
   height:15em;
 }
 /* little extra shadow transparency on top of the hero section */
 #hero.inner::before {
   height:8em; 
 }

 /* side nav logo and close button */
 .sidenav-header {
  padding-bottom: 0;
 }
 .sidenav-header .logo {
  padding: 0px 0px 0px 0.5em;
  text-align:left;
 }
 .sidenav-header .logo img {
  height:60px;
 }
 .sidenav .close-btn {
  padding:0.7em 0.5em 0 0.5em;
  font-size: 1.7em;
 }
 /* top level links/dropdowns */
 .sidenav-links a, .sidenav-links .dropdown-btn {
  padding:0.8em 0 0.8em 0;
  font-size:1em;
  margin-top: 0;
  margin-bottom: 0;
 }

 /* 1st level links/dropdowns */
 .dropdown-container a, .dropdown-container .dropdown-btn {
  padding: 0.8em 1em 0.8em 1em;
  font-size:0.9em;
 }

 .dropdown-container a.featured {
  padding: 0 1em 0.8em 1em;
 }
 .dropdown-container a.featured span {
  height:1.3em;
  width: calc(100% - 86px);
 }

 /* 2nd level links/dropdowns */
 .dropdown-container .dropdown-container a, .dropdown-container .dropdown-container .dropdown-btn {
  padding: 0.8em 1em 0.8em 1.5em;
  font-size:0.8em;
 }
 /* 3nd level links/dropdowns */
 .dropdown-container .dropdown-container .dropdown-container a, .dropdown-container .dropdown-container .dropdown-container .dropdown-btn {
  padding: 0.7em 1.0em 0.7em 2em;
  font-size:0.7em;
 }

 .dropdown-container {
   padding:0 0.2em 0 0.5em;
 }

 /* Family Slider */
 section#family-slider  {
  height:420px;
 }
 section#family-slider  img {
  height:140px;
 }

 /* Featured Category/Article List */
 .featured-list .container .row {
  display:block;
  margin-bottom:0;
 }
 .featured-list .container .row .item {
  width: 48.5%;
  margin-right:2%;
  margin-bottom:1em;
 }
 .featured-list .container .row .item:nth-of-type(2n) {/* last item don't need margin */
  margin-right:0;
 }
 .featured-list .container .item .title {
  padding:1em;
 }
 .featured-list .container .item .synopsis {
  padding:0 1em 1em 1em;
 }

 .tabs.medium {
  display:flex;
 }
 .tabs button {
  padding:1em;
 }
 .tab-content {
  padding:1em;
 }

 /* These are only used for the home page */
 section#how-it-works .container>p {
  width:80%;
 }
 .icon-block {
  width: calc(50% - 2.8em); /* 2.75 = 2 x 1em (padding) + 1.5*1/2 (margin) */
 }
 .icon-block:nth-of-type(even) {
  margin-right:0;
 }

 section#blog-feed .container .posts {
   display:block;
 }
 section#blog-feed .post {
  width:100%;
  float:none;
  margin-right:0;
  margin-bottom:1em;
 }

 /* These need to be at the last so they override all others */
 *.desktop, *.mobile {
  display:none;
 }
 .desktop#pregFreeInfoIntroVideo {
   display:none;
 }
 *.medium {
  display:inline-block;
 }

 .fa {
  border: 1px solid #eee;
  width:2em;
 }
}

@media screen and (max-width: 800px) {
 section#article-view .article-wrapper article .content, aside {
  float:none;
  width:100%;
  margin:0;
 }
 aside.featured-list .container {
  padding:0 0 1em 0;
 }

 .fa {
  /* remove the box around the search icon */
  border: 0;
  width: auto;
  padding: 0;
 }

}

@media screen and (max-width: 600px) {
 .no-narrow, .no-narrow *, .button span.no-narrow {
  display:none;
 }
 /* no need for the overlay close button in mobile, sidenav covers the whole screen */
 body.sidenav-open .overlay a.close-btn {
  display:none;
 }
 header .container .navbar-logo a.tel-link {
  font-size:0.9em;
 }
 header.scrolled .container .navbar-logo a.tel-link,
 header.scrolled .container .navbar-logo a.form-link {
  font-size:0.9em;
  margin-left:0.2em;
  margin-right:0.2em;
 }
 header .container .navbar-logo img {
  height:40px;
 }
 .supplement-top-nav a.button {
  font-size:0.8em;
 }
 main.scrolled .supplement-top-nav {
  top:6.0em;
 }
 body.embed main.scrolled .supplement-top-nav {
  top:0;
 }

 h1 {
  font-size:2em;
 }
 h2 {
  font-size:1.5em;
 }
 h3, h4 {
  font-size:1.2em;
  font-weight:bold;
 }
 .input-field-wrap label {
  font-size:0.9em;
 }

 article {
  margin-right:0.5em;
 }

 ol.breadcrumb li a {
  font-size:0.8em;
 }
 #search-btn.overlay-btn {
  display:block;
 }

 #navbar-right {
  display:none;
 }

 /* hero section */
 #hero {
  height:21.5em;
  background-image: url(/assets/images/header_home_sm.jpg);
 }
 #hero .container {
  top: 5.2em;
 }
 #hero .container h1 {
  width:65%;
  font-size: 1.6em;
  padding-left:0;
  margin-bottom: .5em;
 }
 #hero #video-btn.button {
  font-size:0.9em;
  width:50%;
  text-align:center;
  padding-left:0;
 }
 #hero .button-group {
  margin-top:1em;
 }
 #hero a {
  font-size:0.75em;
 }
 #hero .button-group .button {
  padding: 0.5em;
  display:block;
  margin-bottom: 0.3em;
  margin-left:0;
 }

 /* internal page hero section */
 #hero.inner {
   height:14em;
 }
 /* little extra shadow transparency on top of the hero section */
 #hero.inner::before {
   height:8em; 
 }
 #hero.inner.pregnant {
  background-image: url(/assets/images/header_pregnant_sm.jpg);
 }
 #hero.inner.adopt {
  background-image: url(/assets/images/header_adopt_sm.jpg);
 }
 #hero.inner.adoption {
  background-image: url(/assets/images/header_adoption_sm.jpg);
 }

 /* contact bar section */
 #contact .container {
  margin-top:0em; /* will effectively be covered by the menu bar */
 }

 /* have a black border on the left side of side navigation links */
 .sidenav-links {
  border-left:8px solid #444;
 }
 /* side nav logo and close button */
 .sidenav-header {
  padding-bottom: 0;
 }
 .sidenav-header .logo {
  padding-top: 0.1em;
  padding-bottom: 0.1em;
  text-align:left;
 }
 .sidenav-header .logo img {
  width:50%;
 }
 .sidenav .close-btn {
  padding:0.6em 0.5em 0 0.5em;
  font-size: 1.7em;
 }

 /* top level links/dropdowns */
 .sidenav-links a, .sidenav-links .dropdown-btn {
  padding:0.8em 0 0.8em 0;
  font-size:1em;
 }

 /* 1st level links/dropdowns */
 .dropdown-container a, .dropdown-container .dropdown-btn {
  padding: 0.8em 1em 0.8em 1em;
  font-size:0.9em;
 }

 .dropdown-container a.featured {
  padding: 0 1em 0.8em 1em;
 }
 .dropdown-container a.featured span {
  height:1.3em;
  width: calc(100% - 86px);
 }

 /* 2nd level links/dropdowns */
 .dropdown-container .dropdown-container a, .dropdown-container .dropdown-container .dropdown-btn {
  padding: 0.8em 1em 0.8em 1.5em;
  font-size:0.8em;
 }
 /* 3nd level links/dropdowns */
 .dropdown-container .dropdown-container .dropdown-container a, .dropdown-container .dropdown-container .dropdown-container .dropdown-btn {
  padding: 0.7em 1.0em 0.7em 2em;
  font-size:0.7em;
 }

 footer .site-info, footer .site-links, footer .site-links>div {
  float:none;
  width:100%;
  text-align:center;
  margin:0;
 }

 /* Family Slider */
 section#family-slider  {
  height:360px;
 }
 section#family-slider  img {
  height:120px;
 }

 /* Featured Article Card */
 section.featured-card {
  height:auto;
  max-height:none;
  padding:0;
 }
 section.featured-card:before,
 section.featured-card:after {
  width:50%;
  height:auto;
 }
 section.featured-card:before {
  top:auto;
 }
 section.featured-card .description {
  top:auto;
 }
 section.featured-card h3 {
  font-size:2em;
 } 
 section.featured-card p {
  font-size:1em;
 }
 section.featured-card .container {
  position:inherit;
  padding-top:0;
 }
 section.featured-card figure {
  margin:0;
 }
 section.featured-card figure img {
  position:inherit;
  width: 98%;
  margin:0;
 }
 section.featured-card:nth-of-type(odd) figure,
 section.featured-card:nth-of-type(odd) img, 
 section.featured-card:nth-of-type(even) figure,
 section.featured-card:nth-of-type(even) img {
  float:none;
 }
 section.featured-card .description {
  position:inherit;
  width: 98%;
  padding:0.5em 1.5em 2em 1.5em;
  margin-left:auto;
  margin-right:auto;
  margin-top:-4px; /* get rid of the spacing caused by the spaces in HTML */
  height:auto;
  min-height:0;
 }
 section.featured-card:nth-of-type(even) .description {
  left: 0;
 }

 /* Featured Category/Article List */
 .featured-list .container .row {
  display:block;
  margin-bottom:0;
 }
 .featured-list .container .row .item {
  width: 99%;
  float:none;
  margin:0 0 1em 0;
 }

 .featured-list .container .row:nth-of-type(1) .item.article:last-of-type, 
 .featured-list .container .row:nth-of-type(n+2) .item.article{
  /* enable vertical center for the figure*/
  display: flex; 
  background: #e5f3f4;
  padding-bottom:0;
 }
 .featured-list .container .row:nth-of-type(1) .item.article:last-of-type figure, 
 .featured-list .container .row:nth-of-type(n+2) .item.article figure {
  width:22%;
  display:inline-block;
  box-sizing:border-box;
  float:left;

  /* vertical center align */
  display: flex; 
  justify-content: center;
  flex-direction: column;
 }
 .featured-list .container .row:nth-of-type(1) .item.article:last-of-type figure img,
 .featured-list .container .row:nth-of-type(n+2) .item.article figure img {
  height:4.5em; /* without an explicit height, IE will use the original image height as the flex container height */
/*
  width:4.5em;
*/
  object-fit:cover;
 }
 .featured-list .container .row:nth-of-type(1) .item.article:last-of-type .title,
 .featured-list .container .row:nth-of-type(n+2) .item.article .title {
  width:78%;
  display:inline-block;
  box-sizing:border-box;
  font-size:0.95em;
  padding: 0.5em 0.5em 0.5em 1em;
  position:absolute;
  right:0;
  text-align:left;
 }

 .featured-list .container .row:nth-of-type(1) .item.article:last-of-type .more,
 .featured-list .container .row:nth-of-type(n+2) .item.article .more,
 .featured-list .container .row:nth-of-type(1) .item.article:last-of-type .featured-articles,
 .featured-list .container .row:nth-of-type(n+2) .item.article .featured-articles,
 .featured-list .container .row:nth-of-type(1) .item.article:last-of-type .synopsis,
 .featured-list .container .row:nth-of-type(n+2) .item.article .synopsis,
 .featured-list .container .row:nth-of-type(1) .item.article:last-of-type .title>a i,
 .featured-list .container .row:nth-of-type(n+2) .item.article .title>a i {
  display:none;
 }
 .featured-list .container .item .title {
  padding:1em 0.6em;
  height:auto;
 }

 section.show-case .container {
  padding: 3em 2em;
 }

 section.show-case .title {
  font-size: 2.5em;
 }

 .tabs.medium { /* need this because it's specifically defined in other media type */
  display:none; 
 }
 .tab-title {
  padding-top:1.5em
  padding-bottom:0.5em;
 }
 .tab-content .container {
  padding:0 0.5em 0.5em 0.5em;
 }
 .tab-content article {
  padding:0 0.5em 0.5em 0.5em;
 }
 .tab-content {
  display:block;
 }

 /* These are only used for the home page */
 section#how-it-works .container>p {
  width:96%;
 }
 .icon-block {
  width: calc(100% - 2.1em); /* 2 = 2 x 1em (padding) */
  height:7em;
 }
 .icon-block {
  margin-right:0;
 }

 .fa-search:before {
  font-size:0.8em;
  margin-right:1.5em;
 }

 article .content .celeb img {
  float:none;
  margin-right:0;
  width:100%;
 }
 article .content .celebList {
  column-count:1;
 }

 .button span, button span {
  padding: 0.5em 2em;
  width: calc(100% - 4em);
 }
 .b-actions button, .b-actions .button, .b-actions .btn,
 .b-actions button, .b-actions .btn, .b-actions button.btn {
  box-sizing:border-box;
  width: calc(100% - 1em);
 }

 /* These need to be at the last so they override all others */
 *.desktop, *.medium {
  display:none;
 }
 .desktop#pregFreeInfoIntroVideo {
   display:none;
 }
 *.mobile {
  display:inline-block;
 }
}