Camp Countdown
Days
Hours
Mins
/* ----------------------------------------- */
/* View slug: top-banners - start */
/* ----------------------------------------- */
.top-banner {
background: #f7b733;
padding: 15px;
}
.top-banner p {
text-align: center;
display: block;
margin: 0;
}
.top-banner p span {
font-weight: 600;
}
.top-banner a, .top-banner p {
color: #ffffff;
font-size: 14px;
text-transform:uppercase;
letter-spacing: 2px;
font-weight: 400;
}
/* ----------------------------------------- */
/* View slug: top-banners - end */
/* ----------------------------------------- */
/* ----------------------------------------- */
/* View slug: post-view - start */
/* ----------------------------------------- */
#home-nav-filter .radio input[type="radio"], .radio-inline input[type="radio"], .checkbox input[type="checkbox"], .checkbox-inline input[type="checkbox"] {
display: none !important;
}
.radio-inline input[type="radio"]:checked {
background: #fff; padding: 30px;
}
.radio:checked+label {
background: #fff;
width:200px;
height:500px;
}
#home-nav-filter .radio, .checkbox {
position: relative;
display: block;
display: inline-block;
margin-top:0;
margin-bottom:0;
width: 25%;
float:left;
text-align: center;
background: #eaeaea;
border-right: 1px solid #cccccc;
}
#home-nav-filter label:before {
content:"";
height:40px;
width: 40px;
margin:0px auto;
padding: 10px 0;
display: block;
}
#home-nav-filter label[for=home-feature-history]:before {
content:"";
background: url(/wp-content/uploads/2018/02/summer-camp.svg);
}
#home-nav-filter label[for=home-feature-camp]:before {
content:"";
background: url(/wp-content/uploads/2018/02/camp-fire.svg);
}
#home-nav-filter label[for=home-feature-latest-blog]:before {
content:"";
background: url(/wp-content/uploads/2018/02/news-paper-icon.svg);
}
#home-nav-filter label[for=home-feature-parents]:before {
content:"";
background: url(/wp-content/uploads/2018/02/parents.svg);
}
#home-nav-filter label {
position:absolute;
padding: 15px 0 !important;
left:0;
right:0;
top:0;
bottom:0;
width:100%;
height: 100%;
-webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
#home-nav-filter label:hover, #home-nav-filter label:active, #home-nav-filter label:hover .radio:checked, .js-wpv-filter-trigger:active, #home-nav-filter .active {
background: #0E314F;
color:#fff;
position:absolute;
padding: 15px 0;
left:0;
right:0;
top:0;
bottom:0;
width:100%;
height: 100%;
}
input[type="radio"]:checked+label{ font-weight: bold; }
input[type="radio"],
input[type="radio"]:checked{
background: #333333 !important;
}
#home-feature-camp input[type="radio"]:checked+label{
background: #fff;
font-weight: bold;
}
#home-nav-filter .radio label, .checkbox label {
position:relative;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto auto;
}
#home-nav-filter label img {
width: 4vw;
display: block;
margin: 0 auto;
}
input[type=checkbox]:checked {
background: #eaeaea;
}
/* ----------------------------------------- */
/* View slug: post-view - end */
/* ----------------------------------------- */
/* ----------------------------------------- */
/* Content Template: post-view-slide - start */
/* ----------------------------------------- */
.col-sm-8.stacked {
padding-right: 15px !important;
}
.col-sm-4.single {
padding-left: 0px !important;
margin-top: 15px;
}
.col-sm-8.stacked a.c-preview {
position: relative;
height: 220px;
margin-top:15px;
color:#fff;
}
@media (max-width: 786px) {
.col-xs-12.single a.c-preview {
position: relative;
height: 220px !important;
margin: 0px auto !important;
margin-top:15px;
color:#fff;
}
p.page-title {
font-size: 4.2vw !important;
}
}
.col-sm-4.single a.c-preview{
position: relative;
height:455px;
color:#fff;
}
div.single figure {
position: absolute;
z-index: 1000;
bottom: 0;
padding: 20px;
width: 300px;
left: 0;
opacity: 1;
transform: translateY(0);
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
div.stacked figure {
position: absolute;
z-index: 1000;
/* bottom: 0; */
padding: 20px;
width: 300px;
left: 0;
opacity: 1;
transform: translateY(0);
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
div.single figcaption {
position: absolute;
z-index: 1000;
bottom: 0;
padding: 20px;
opacity:0;
transform: translateY(0);
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
p.page-title {
display: block;
font-family: "rift",sans-serif;
font-weight: bold;
position: relative;
line-height: 1.2em;
font-size: 2.2vw;
letter-spacing: 3px;
color: #fff;
}
p.read-more {
font-size: 14px;
font-weight: bold;
color: #4FABCB;
letter-spacing: 1px;
text-transform: uppercase;
}
.stacked .c-preview {
/* background: #000;
background: -moz-linear-gradient(-45deg, #0E314F 0%, #19485f 25%, #1e539e 50%, #B5D3E0 75%, #4FABCB 100%);
background: -webkit-linear-gradient(-45deg, #0E314F 0%, #19485f 25%, #1e539e 50%, #B5D3E0 75%, #4FABCB 100%);
background: linear-gradient(135deg, #0E314F 0%, #19485f 25%, #1e539e 50%, #B5D3E0 75%, #4FABCB 100%);
background-size: 400% 400%;*/
background-repeat: no-repeat;
display: flex;
width: 100%;
height: 200px;
max-width: 100vw;
max-height: 100vh;
justify-content: center;
align-items: center;
color: #fff;
position: relative;
cursor: pointer;
transition: .5s all;
}
.single .c-preview {
background-repeat: no-repeat;
display: flex;
width: 100%;
height: 100%;
max-width: 100vw;
max-height: 100vh;
justify-content: center;
align-items: center;
color: #fff;
position: relative;
cursor: pointer;
transition: .2s all;
}
.stacked .c-preview:before {
content:'';
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#4fabcb+25,4fabcb+100&1+28,0+100 */
background: -moz-linear-gradient(left, rgba(79,171,203,1) 25%, rgba(79,171,203,1) 28%, rgba(79,171,203,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(79,171,203,1) 25%,rgba(79,171,203,1) 28%,rgba(79,171,203,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(79,171,203,1) 25%,rgba(79,171,203,1) 28%,rgba(79,171,203,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4fabcb', endColorstr='#004fabcb',GradientType=1 ); /* IE6-9 */
width:70%;
position:absolute;
z-index:3;
height: 100%;
left:0;
bottom:0;
top:0;
right:0%;
display:block;
}
.single .c-preview:before {
content:"";
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#4fabcb+1,4fabcb+81&0+13,1+100 */
background: -moz-linear-gradient(top, rgba(79,171,203,0) 1%, rgba(79,171,203,0) 13%, rgba(79,171,203,0.78) 81%, rgba(79,171,203,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(79,171,203,0) 1%,rgba(79,171,203,0) 13%,rgba(79,171,203,0.78) 81%,rgba(79,171,203,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(79,171,203,0) 1%,rgba(79,171,203,0) 13%,rgba(79,171,203,0.78) 81%,rgba(79,171,203,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#004fabcb', endColorstr='#4fabcb',GradientType=0 ); /* IE6-9 */
width:100%;
position:absolute;
z-index:3;
height: 70%;
left:0;
bottom:0;
right:0%;
display:block;
}
.c-preview__img {
position: absolute;
left: 0;
top: 0;
background: #19485f;
background-size: cover !important;
width: 100%;
height: 100%;
z-index: 1;
opacity: 1;
}
.c-preview__title {
position: relative;
z-index: 10;
text-transform: uppercase;
letter-spacing: .05em;
color: #fff;
}
.c-preview:hover {
background-position: 100% 100%;
color:#fff;
}
.c-preview:hover .c-preview__title {
color:#fff;
}
.c-preview:hover__title {
text-shadow: 0 0 0px black;
}
a.learn-more {
font-size: 15px;
color: #fff;
}
/* ----------------------------------------- */
/* Content Template: post-view-slide - end */
/* ----------------------------------------- */