@media all and (min-width: 900px){

.shelf[data-shelf="header-callout"] #h-callout-container {
bottom: 20%;
}

.shelf[data-shelf="header"][data-loaded="true"] .shelf[data-shelf="header-callout"] #h-callout-container {
bottom: 15%;
}

}

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

.content-section[data-section="programs-posts"],
.content-section[data-section="familia-posts"],
.content-section[data-section="media-posts"] {
display: block;
padding: 10px;
}

.content-section[data-section="programs-posts"] .post-section-title,
.content-section[data-section="familia-posts"] .post-section-title,
.content-section[data-section="media-posts"] .post-section-title {
padding-left: 5px;
}

.g-gallery a.g-request {
top: calc(60% + 5px);
}

.g-gallery a.g-request[data-request="prev"] {
left: -10px;
}

.g-gallery a.g-request[data-request="next"] {
right: -10px;
}

}

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

.shelf[data-shelf="header-callout"] .center,
.shelf[data-shelf="header-menu"] .center {
max-width: calc(100% - 40px);
}

}

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

body {
font-size: 18px;
line-height: 24px;
-webkit-text-size-adjust: none;
-ms-text-size-adjust: none;
}

.shelf[data-shelf="header"] {
min-height: 0;
}

.shelf[data-shelf="header-callout"] #h-callout-container {
top: 50px;
}

.shelf[data-shelf="header"][data-loaded="true"] .shelf[data-shelf="header-callout"] #h-callout-container {
top: 20px;
left: 10px;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}

.shelf[data-shelf="header-callout"] #h-callout-image,
.shelf[data-shelf="header-callout"] #h-callout-image span {
height: 100%;
background-attachment: scroll;
}

.shelf[data-shelf="header-menu"] {
top: calc(100vh - 100px);
}

.shelf[data-shelf="header"].active .shelf[data-shelf="header-menu"] .center-container {
overflow: visible;
}

.shelf[data-shelf="header-menu"][data-position="top"] {
top: 10px;
}

#h-logo {
width: 20%;
background: #fff;
padding: 5px;
}

#h-logo a {
height: 90%;
}

#h-logo a img[data-size="mobile"] {
display: inline-block;
}

#h-logo a img[data-size="desktop"] {
display: none;
}

#h-content {
width: 80%;
padding-left: 0;
background: rgba(60, 73, 169, 1);
}

#h-nav-toggle {
position: relative;
float: right;
width: 50px;
height: 100%;
text-align: center;
display: inline-block;
}

#h-nav-toggle:before {
content: "\f0c9";
font-family: "Font Awesome\ 5 Free";
font-size: 18px;
line-height: 40px;
font-weight: 900;
color: #fff;
}

.shelf[data-shelf="header"].active #h-nav-toggle:before {
content: "\f00d";
}

#h-nav-donate {
width: calc(100% - 50px);
display: inline-block;
}

#h-nav-donate a[title="Online Shop"]:before {
display: none;
}

#h-nav-donate a {
padding: 0 5px;
}

#h-nav-main {
display: none;
}

.shelf[data-shelf="header"].active #h-nav-main {
display: block;
position: absolute;
top: 40px;
bottom: auto;
left: 0;
width: 100%;
background: rgba(60, 73, 169, 1);
z-index: 100;
}

.shelf[data-shelf="header"].active .shelf[data-shelf="header-menu"][data-position="bottom"] #h-nav-main {
bottom: 40px;
top: auto;
}

#h-nav-main ul,
#h-nav-main li {
width: 100%;
margin: 0;
}

#h-nav-main a {
width: 100%;
line-height: 16px;
padding: 20px 10%;
}

/*Home*/

body.home .shelf[data-shelf="body"] {
padding-top: 20px;
overflow-x: hidden;
overflow-y: visible;
}

#ig-widget #ig-header {
width: 90%;
margin-left: 5%;
}

#ig-header-iglogo, #ig-header-handle, #ig-header-follow {
margin-right: 10px;
}

#ig-header-iglogo img {
width: 30px;
height: auto;
}

#ig-header-handle a {
font-size: 16px;
line-height: 30px;
}

#ig-header-follow {
margin-top: 2px;
}

.ig-item {
width: 100%;
height: auto;
margin: 0;
}

.ig-item a {
width: 100%;
height: auto;
margin: 0;
padding: 5px 0;
}

.ig-item:hover a {
width: 100%;
height: auto;
}

.ig-item span {
display: none !important;
}

#sb_instagram .sbi_photo {
height: 250px !important;
}

/*Interior*/

#b-header {
height: auto;
}

#b-header img {
position: relative;
float: left;
}

.column-narrow {
width: 90%;
margin-right: 0;
margin-left: 5%;
}

.column-narrow #b-title,
#b-content h1#b-title {
float: left;
}

.column-wide,
.column-wide-small {
width: 90%;
padding: 0;
margin-left: 5%;
}

.column-wide p,
.column-wide h1,
.column-wide h2,
.column-wide h3,
.column-wide h4,
.column-wide h5,
.column-wide h6 {
width: 100%;
padding: 0 5%;
}

#b-content iframe {
height: 250px;
}

#press-grid, #events-grid {
width: 100%;
margin-left: 0;
}

.grid-item {
width: 100%;
height: auto;
margin: 0;
border-bottom: 1px solid #575757;
}

.grid-item.active {
background: #575757;
}

.grid-item img {
display: none !important;
}

.grid-item.active img {
float: left;
width: 100%;
height: auto !important;
min-height: 0 !important;
display: block !important;
}

.grid-overlay {
position: relative;
height: auto;
float: left;
bottom: auto;
}

.grid-overlay-header {
top: 0;
transform: translateY(0);
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
}

.grid-overlay-header-cont  {
height: auto;
}

.grid-item .grid-content {
display: none;
}

.grid-item.active .grid-content {
opacity: 1;
display: block;
max-height: none;
}

.grid-item .grid-overlay a {
left: 0;
display: none !important;
}

.grid-item.active .grid-overlay a {
opacity: 1;
display: block !important;
}

.content-section[data-section="programs-posts"],
.content-section[data-section="familia-posts"] {
float: left;
width: 100%;
padding: 0 5%;
margin-top: 20px;
}

.post-section[data-gallery="false"] .post-item {
margin: 0 0 20px 0;
}

.post-section[data-gallery="false"] .post-item {
flex: 1 0 100%;
max-width: 100%;
}

.g-item .g-item-content-container {
width: 100%;
margin: 0;
}

.g-gallery a.g-request[data-request="prev"] {
left: 5px;
}

.g-gallery a.g-request[data-request="next"] {
right: 5px;
}

/*About*/

.content-section[data-section="about-main"],
.content-section[data-section="about-mission"],
.content-section[data-section="about-row"] {
float: left;
width: 100%;
}

.content-section[data-section="about-row"] h2,
.content-section[data-section="about-row"] h3 {
width: 100%;
padding: 0;
}

.column-wide .content-section p {
width: 100%;
padding: 0;
}

/*Gallery*/

.shelf[data-shelf="gallery"] {
width: 100%;
border: 0;
margin: 10px 0;
}

.gallery-header {
width: 100%;
left: 0;
}

.gallery-label {
width: 50%;
margin-left: 15px;
font-size: 14px;
line-height: 15px;
}

/*Contact*/

.column-wide form {
float: left;
width: 90%;
margin: 0 5%;
}

.column-wide form label {
float: left;
width: 100%;
margin-right: 0;
text-align: left;
}

.column-wide form input,
.column-wide form select,
.column-wide form textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
float: left;
width: 100%;
padding-left: 5%;
padding-right: 5%;
margin: 0;
}

.column-wide form .button input {
margin-left: 0;
}

}

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

.shelf[data-shelf="header-callout"] .center,
.shelf[data-shelf="header-menu"] .center {
max-width: calc(100% - 20px);
}

.shelf[data-shelf="header"][data-loaded="true"] .shelf[data-shelf="header-callout"] #h-callout-container {
top: 50px;
left: 0;
max-width: 100%;
}

.shelf[data-shelf="header-callout"] #h-callout-container #h-callout-content {
padding: 20px 10% 60px 10%;
-webkit-border-bottom-right-radius: 0;
-webkit-border-bottom-left-radius: 0;
-moz-border-radius-bottomright: 0;
-moz-border-radius-bottomleft: 0;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}

.shelf[data-shelf="header-callout"] #h-callout-container #h-callout-content {
padding-bottom: 30px;
}

.shelf[data-shelf="header-callout"] #h-callout-container #h-callout-more-text {
margin-bottom: 0;
}

}

@media all and (max-height: 500px){

.shelf[data-shelf="header-callout"] #h-callout-container #h-callout-content {
-webkit-border-top-left-radius: 0;
-webkit-border-top-right-radius: 0;
-moz-border-radius-topleft: 0;
-moz-border-radius-topright: 0;
border-top-left-radius: 0;
border-top-right-radius: 0;
}

#h-callout-content {
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}

}

@media all and (max-height: 300px){

.shelf[data-shelf="header-callout"] {
display: none;
}

}
