1181 lines
18 KiB
SCSS
1181 lines
18 KiB
SCSS
.site-blocks-cover {
|
|
background-size: cover;
|
|
background-repeat: no-repeat;
|
|
background-position: center center;
|
|
&.overlay {
|
|
position: relative;
|
|
&:before {
|
|
position: absolute;
|
|
content: "";
|
|
left: 0;
|
|
bottom: 0;
|
|
right: 0;
|
|
top: 0;
|
|
background: rgba($black, .4);
|
|
}
|
|
}
|
|
&, .row {
|
|
min-height: 600px;
|
|
height: calc(100vh);
|
|
}
|
|
&.inner-page {
|
|
&, .row {
|
|
min-height: 600px;
|
|
height: calc(40vh);
|
|
}
|
|
}
|
|
.sub-text {
|
|
font-size: $font-size-base + .1rem;
|
|
text-transform: uppercase;
|
|
color: rgba($white, .7);
|
|
letter-spacing: .2em;
|
|
}
|
|
h1 {
|
|
// font-weight: 900;
|
|
color: $white;
|
|
// text-transform: uppercase;
|
|
font-size: $font-size-base + 2rem;
|
|
font-family: $font-family-serif;
|
|
|
|
@include media-breakpoint-up(md) {
|
|
font-size: $font-size-base + 3rem;
|
|
font-weight: 900;
|
|
line-height: 1.2;
|
|
}
|
|
}
|
|
p {
|
|
color: $white;
|
|
font-size: $font-size-base + .5rem;
|
|
line-height: 1.5;
|
|
}
|
|
.intro-text {
|
|
font-size: 16px;
|
|
line-height: 1.5;
|
|
}
|
|
}
|
|
|
|
.site-heading {
|
|
|
|
font-weight: 300;
|
|
text-transform: uppercase;
|
|
font-size: $font-size-base + 1rem;
|
|
@include media-breakpoint-up(md) {
|
|
font-size: $font-size-base + 2rem;
|
|
}
|
|
strong {
|
|
font-weight: 900;
|
|
}
|
|
}
|
|
|
|
.site-block-1 {
|
|
padding-top: 50px;
|
|
@include media-breakpoint-up(lg) {
|
|
padding-top: 0;
|
|
position: absolute;
|
|
width: 100%;
|
|
transform: translateY(-100%);
|
|
}
|
|
}
|
|
|
|
.site-block-appointment {
|
|
background: #ece8d9!important;
|
|
form {
|
|
box-shadow: 0 5px 20px -2px rgba(0,0,0,.1);
|
|
}
|
|
}
|
|
.text-white-opacity-5 {
|
|
color: rgba($white, .5);
|
|
}
|
|
.text-black-opacity-5 {
|
|
color: rgba($black, .5);
|
|
}
|
|
|
|
.site-block-feature {
|
|
.d-block {
|
|
@include media-breakpoint-down(sm) {
|
|
border-bottom: none!important;
|
|
}
|
|
}
|
|
.item {
|
|
width: 50%;
|
|
|
|
@include media-breakpoint-down(sm) {
|
|
width: 100%;
|
|
border-right: none!important;
|
|
border-bottom: none!important;
|
|
}
|
|
}
|
|
}
|
|
.site-block-feature-2 {
|
|
.icon {
|
|
font-size: 50px;
|
|
position: relative;
|
|
line-height: 1;
|
|
}
|
|
h3 {
|
|
font-size: $font-size-base + .5rem;
|
|
}
|
|
}
|
|
|
|
.site-block-3 {
|
|
.row-items {
|
|
height: calc(50% - 15px);
|
|
margin-bottom: 30px;
|
|
&.last {
|
|
height: calc(50% - 15px);
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
.feature {
|
|
transition: .3s all ease-in-out;
|
|
height: 100%;
|
|
|
|
h3 {
|
|
color: $black;
|
|
font-size: $font-size-base + .4rem;
|
|
}
|
|
&:hover, &:active, &:focus, &.active {
|
|
box-shadow: 0 5px 20px -2px rgba(0,0,0,.1);
|
|
}
|
|
}
|
|
}
|
|
|
|
.site-block-half {
|
|
.image, .text {
|
|
width: 100%;
|
|
@include media-breakpoint-up(lg) {
|
|
width: 50%;
|
|
}
|
|
}
|
|
.image {
|
|
@include media-breakpoint-down(md) {
|
|
margin-bottom: 50px;
|
|
}
|
|
}
|
|
.text {
|
|
padding: 15px;
|
|
@include media-breakpoint-up(lg) {
|
|
padding: 4rem;
|
|
}
|
|
@include media-breakpoint-up(xl) {
|
|
padding: 8rem;
|
|
}
|
|
}
|
|
.bg-image {
|
|
background-position: center center;
|
|
@include media-breakpoint-down(md) {
|
|
height: 400px;
|
|
}
|
|
}
|
|
|
|
&.site-block-video {
|
|
.image {
|
|
position: relative;
|
|
.play-button {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
font-size: 20px;
|
|
width: 70px;
|
|
height: 70px;
|
|
background: $white;
|
|
display: block;
|
|
border-radius: 50%;
|
|
opacity: 1;
|
|
color: $primary!important;
|
|
&:hover {
|
|
opacity: 1;
|
|
}
|
|
> span {
|
|
position: absolute;
|
|
left: 55%;
|
|
top: 50%;
|
|
transform: translate(-60%, -50%);
|
|
}
|
|
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.site-block-testimony {
|
|
img {
|
|
max-width: 140px;
|
|
border-radius: 50%;
|
|
}
|
|
p {
|
|
font-size: $font-size-base + .2rem;
|
|
}
|
|
&.active {
|
|
background: $white;
|
|
box-shadow: 0 5px 20px -2px rgba(0,0,0,.1);
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.post-entry {
|
|
position: relative;
|
|
overflow: hidden;
|
|
border: 1px solid lighten($black, 90% );
|
|
&, .text {
|
|
border-radius: 4px;
|
|
border-top: none!important;
|
|
}
|
|
.date {
|
|
color: darken(#ccc, 15%);
|
|
font-weight: normal;
|
|
letter-spacing: .1em;
|
|
}
|
|
|
|
.image {
|
|
overflow: hidden;
|
|
position: relative;
|
|
img {
|
|
transition: .3s all ease;
|
|
transform: scale(1.0);
|
|
}
|
|
}
|
|
&:hover, &:active, &:focus {
|
|
.image {
|
|
img {
|
|
transform: scale(1.2);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.block-13, .block-14, .block-15, .slide-one-item {
|
|
position: relative;
|
|
z-index: 1;
|
|
.owl-nav {
|
|
position: relative;
|
|
position: absolute;
|
|
bottom: 0px;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
.owl-prev, .owl-next {
|
|
position: relative;
|
|
display: inline-block;
|
|
padding: 20px;
|
|
font-size: 30px;
|
|
color: $black;
|
|
&.disabled {
|
|
opacity: .2;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.block-13, .block-14, .block-15 {
|
|
.owl-stage-outer {
|
|
padding-top: 30px;
|
|
padding-bottom: 30px;
|
|
}
|
|
.owl-nav {
|
|
position: absolute;
|
|
width: 100%;
|
|
top: 50%;
|
|
left: 0;
|
|
transform: translateY(-50%);
|
|
@include media-breakpoint-down(md) {
|
|
display: none;
|
|
}
|
|
.owl-prev, .owl-next {
|
|
position: absolute;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
}
|
|
.owl-prev {
|
|
|
|
left: -70px;
|
|
}
|
|
.owl-next {
|
|
right: -70px;
|
|
|
|
}
|
|
}
|
|
.owl-dots {
|
|
text-align: center;
|
|
// border: 1px solid red;
|
|
.owl-dot {
|
|
display: inline-block;
|
|
margin: 5px;
|
|
> span {
|
|
line-height: 0;
|
|
display: inline-block;
|
|
width: 7px;
|
|
height: 7px;
|
|
border-radius: 50%;
|
|
border: none;
|
|
float: left;
|
|
background: lighten($black, 80%);
|
|
transition: .3s all ease;
|
|
}
|
|
&.active {
|
|
> span {
|
|
background: $primary;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.slide-one-item {
|
|
&.home-slider {
|
|
.owl-nav {
|
|
transition: .3s all ease-in-out;
|
|
opacity: 0;
|
|
visibility: hidden;
|
|
position: absolute!important;
|
|
top: 50%!important;
|
|
bottom: auto!important;
|
|
width: 100%;
|
|
}
|
|
.owl-prev {
|
|
left: 10px!important;
|
|
}
|
|
.owl-next {
|
|
right: 10px!important;
|
|
}
|
|
.owl-prev, .owl-next {
|
|
color: $white;
|
|
position: absolute!important;
|
|
top: 50%;
|
|
padding: 0px;
|
|
height: 50px;
|
|
width: 50px;
|
|
border-radius: 0%;
|
|
transform: translateY(-50%);
|
|
background: rgba($black, .2);
|
|
transition: .3s all ease-in-out;
|
|
|
|
line-height: 0;
|
|
text-align: center;
|
|
font-size: 25px;
|
|
@include media-breakpoint-up(md) {
|
|
font-size: 25px;
|
|
}
|
|
> span {
|
|
position: absolute;
|
|
line-height: 0;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
}
|
|
|
|
&:hover, &:focus {
|
|
background: rgba($black, 1);
|
|
}
|
|
}
|
|
|
|
&:hover, &:focus, &:active {
|
|
.owl-nav {
|
|
opacity: 1;
|
|
visibility: visible;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
.block-12 {
|
|
position: relative;
|
|
figure {
|
|
position: relative;
|
|
&:before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
background: -moz-linear-gradient(top, transparent 0%, transparent 18%, rgba(0,0,0,0.8) 99%, rgba(0,0,0,0.8) 100%);
|
|
background: -webkit-linear-gradient(top, transparent 0%, transparent 18%, rgba(0,0,0,0.8) 99%, rgba(0,0,0,0.8) 100%);
|
|
background: linear-gradient(to bottom, transparent 0%, transparent 18%, rgba(0,0,0,0.8) 99%, rgba(0,0,0,0.8) 100%);
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#cc000000',GradientType=0 );
|
|
}
|
|
}
|
|
.text-overlay {
|
|
position: absolute;
|
|
bottom: 20px;
|
|
left: 20px;
|
|
right: 20px;
|
|
z-index: 10;
|
|
h2 {
|
|
color: $white;
|
|
}
|
|
}
|
|
.text {
|
|
position: relative;
|
|
top: -100px;
|
|
.meta {
|
|
text-transform: uppercase;
|
|
padding-left: 40px;
|
|
color: $white;
|
|
display: block;
|
|
margin-bottom: 20px;
|
|
}
|
|
.text-inner {
|
|
box-shadow: 0 0 20px -5px rgba(0,0,0,.3);
|
|
background: $white;
|
|
padding: 10px;
|
|
margin-right: 30px;
|
|
position: relative;
|
|
@include media-breakpoint-up(sm) {
|
|
padding: 20px;
|
|
}
|
|
@include media-breakpoint-up(md) {
|
|
padding: 30px 40px;
|
|
}
|
|
|
|
&:before {
|
|
position: absolute;
|
|
content: "";
|
|
width: 80px;
|
|
height: 4px;
|
|
margin-top: -4px;
|
|
background: $primary;
|
|
top: 0;
|
|
}
|
|
.heading {
|
|
font-size: 20px;
|
|
margin: 0;
|
|
padding: 0;
|
|
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.block-16 {
|
|
figure {
|
|
position: relative;
|
|
.play-button {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
font-size: 20px;
|
|
width: 70px;
|
|
height: 70px;
|
|
background: $white;
|
|
display: block;
|
|
border-radius: 50%;
|
|
opacity: 1;
|
|
color: $primary!important;
|
|
&:hover {
|
|
opacity: 1;
|
|
}
|
|
> span {
|
|
position: absolute;
|
|
left: 55%;
|
|
top: 50%;
|
|
transform: translate(-60%, -50%);
|
|
}
|
|
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
.block-25 {
|
|
ul {
|
|
&, li {
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
li {
|
|
.date {
|
|
color: rgba($white, .25);
|
|
font-size: $font-size-base - .2rem;
|
|
display: block;
|
|
}
|
|
a {
|
|
.image {
|
|
flex: 0 0 90px;
|
|
img {
|
|
border-radius: 4px;
|
|
max-width: 100%;
|
|
opacity: 1;
|
|
transition: .3s all ease-in-out;
|
|
}
|
|
}
|
|
.text {
|
|
.heading {
|
|
font-size: $font-size-base - .1rem;
|
|
line-height: 1.5;
|
|
margin: 0;
|
|
padding: 0;
|
|
transition: .3s all ease;
|
|
color: lighten($black, 60%);
|
|
}
|
|
}
|
|
.meta {
|
|
color: $primary;
|
|
}
|
|
&:hover {
|
|
img {
|
|
opacity: .5;
|
|
}
|
|
.text {
|
|
.heading {
|
|
color: $white;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
#date-countdown {
|
|
.countdown-block {
|
|
color: rgba($white, .4);
|
|
}
|
|
.label {
|
|
font-size: 40px;
|
|
color: $white;
|
|
}
|
|
}
|
|
|
|
.next-match {
|
|
.image {
|
|
width: 50px;
|
|
border-radius: 50%;
|
|
}
|
|
}
|
|
|
|
.player {
|
|
position: relative;
|
|
img {
|
|
max-width: 100px;
|
|
border-radius: 50%;
|
|
margin-bottom: 20px;
|
|
}
|
|
.team-number {
|
|
position: absolute;
|
|
width: 30px;
|
|
height: 30px;
|
|
background: $primary;
|
|
border-radius: 50%;
|
|
color: $white;
|
|
> span {
|
|
position: absolute;
|
|
transform: translate(-50%, -50%);
|
|
left: 50%;
|
|
top: 50%;
|
|
}
|
|
}
|
|
h2 {
|
|
font-size: 20px;
|
|
letter-spacing: .2em;
|
|
text-transform: uppercase;
|
|
}
|
|
.position {
|
|
font-size: 14px;
|
|
color: lighten($black, 70%);
|
|
text-transform: uppercase;
|
|
}
|
|
}
|
|
|
|
.site-block-27 {
|
|
ul {
|
|
&, li {
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
li {
|
|
display: inline-block;
|
|
margin-bottom: 4px;
|
|
a,span {
|
|
text-align: center;
|
|
display: inline-block;
|
|
width: 40px;
|
|
height: 40px;
|
|
line-height: 40px;
|
|
border-radius: 50%;
|
|
border: 1px solid #ccc;
|
|
}
|
|
&.active {
|
|
a, span {
|
|
background: $primary;
|
|
color: $white;
|
|
border: 1px solid transparent;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.block-47 {
|
|
.block-47-image {
|
|
flex: 0 0 70px;
|
|
display: block;
|
|
img {
|
|
border: 5px solid $white;
|
|
border-radius: 50%;
|
|
box-shadow: 0 2px 30px -2px rgba(0,0,0,.1);
|
|
}
|
|
}
|
|
.block-47-quote {
|
|
|
|
padding: 30px;
|
|
|
|
font-weight: 300;
|
|
background: $white;
|
|
border-radius: 7px;
|
|
position: relative;
|
|
box-shadow: 0 2px 30px -2px rgba(0,0,0,.1);
|
|
@include media-breakpoint-up(md) {
|
|
margin-left: 40px;
|
|
font-size: 1.2rem;
|
|
}
|
|
|
|
&:before {
|
|
content: "";
|
|
border: 1px solid red;
|
|
z-index: 2;
|
|
position: absolute;
|
|
|
|
left: -15px;
|
|
|
|
border-width: 0 20px 20px 0;
|
|
border-style: solid;
|
|
border-color: transparent #fff transparent transparent;
|
|
}
|
|
|
|
.block-47-quote-author {
|
|
font-size: 14px;
|
|
color: lighten($black, 40%);
|
|
}
|
|
}
|
|
}
|
|
|
|
.site-block-check {
|
|
padding: 0;
|
|
margin: 0 0 30px 0;
|
|
li {
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
li {
|
|
display: block;
|
|
padding-left: 30px;
|
|
position: relative;
|
|
margin-bottom: 10px;
|
|
&:before {
|
|
position: absolute;
|
|
color: $success;
|
|
left: 0;
|
|
top: -.3rem;
|
|
font-family: 'icomoon';
|
|
font-size: 1.1rem;
|
|
content: "\e5ca";
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
.half-sm {
|
|
.text {
|
|
|
|
&, h2, small {
|
|
transition: .3s all ease-in-out;
|
|
}
|
|
a {
|
|
small {
|
|
border-bottom: 2px solid transparent;
|
|
}
|
|
}
|
|
}
|
|
&:hover, &:focus {
|
|
.text {
|
|
background: $primary!important;
|
|
color: $white;
|
|
h2 {
|
|
color: $white!important;
|
|
}
|
|
a {
|
|
small {
|
|
color: $white!important;
|
|
border-bottom: 2px solid $white;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.block-37 {
|
|
|
|
border-radius: 4px;
|
|
display: block;
|
|
overflow: hidden;
|
|
width: 100%;
|
|
height: 200px;
|
|
// height: 300px;
|
|
.image {
|
|
height: 100%;
|
|
// width: 100%;
|
|
// height: 100%;
|
|
background-color: black; /* fallback color */
|
|
background-position: center;
|
|
background-size: cover;
|
|
position: relative;
|
|
transition: .8s all ease;
|
|
&:before {
|
|
content: "";
|
|
visibility: hidden;
|
|
opacity: 0;
|
|
height: 100%;
|
|
width: 100%;
|
|
position: absolute;
|
|
transition: .3s all ease;
|
|
top: 0;
|
|
left: 0;
|
|
background-color: $primary;
|
|
}
|
|
|
|
.block-37-overlay {
|
|
z-index: 3;
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
opacity: 0;
|
|
visibility: hidden;
|
|
transition: .3s all ease;
|
|
transform: translate(-50%, -50%);
|
|
margin-top: 10px;
|
|
.icon {
|
|
font-size: 30px;
|
|
color: $white;
|
|
}
|
|
}
|
|
|
|
}
|
|
&:hover, &:focus {
|
|
.block-37-overlay {
|
|
opacity: 1;
|
|
visibility: visible;
|
|
margin-top: 0px;
|
|
}
|
|
.image {
|
|
transform: scale(1.2);
|
|
&:before {
|
|
opacity: .7;
|
|
visibility: visible;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.block-feature, .heading-with-border {
|
|
h2, .heading {
|
|
text-transform: uppercase;
|
|
font-size: 1.1rem;
|
|
position: relative;
|
|
padding-bottom: 20px;
|
|
margin-bottom: 20px;
|
|
&:after {
|
|
position: absolute;
|
|
content: "";
|
|
width: 50px;
|
|
height: 2px;
|
|
bottom: 0;
|
|
background: $primary;
|
|
left: 0;
|
|
}
|
|
}
|
|
&.text-center {
|
|
h2, .heading {
|
|
&:after {
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.block-media-1 {
|
|
position: relative;
|
|
transition: .3s all ease-in-out;
|
|
&:hover, &:focus, &:active {
|
|
box-shadow: 5px 0px 40px 0 rgba(0,0,0,.15);
|
|
}
|
|
}
|
|
|
|
.block-schedule {
|
|
background-position: center center;
|
|
background-size: cover;
|
|
background-repeat: no-repeat;
|
|
background-attachment: fixed;
|
|
&.overlay {
|
|
position: relative;
|
|
&:before {
|
|
position: absolute;
|
|
content: "";
|
|
background: rgba(0,0,0,.2);
|
|
top: 0; left: 0; right: 0; bottom: 0;
|
|
}
|
|
}
|
|
.container {
|
|
position: relative;
|
|
z-index: 10;
|
|
}
|
|
.row-wrap {
|
|
margin-left: 15px;
|
|
margin-right: 15px;
|
|
|
|
> .row {
|
|
margin-bottom: 2px;
|
|
transition: .3s all ease;
|
|
transform: scale(1.0);
|
|
z-index: 1;
|
|
position: relative;
|
|
border-left: 10px solid transparent;
|
|
border-right: 10px solid transparent;
|
|
&:hover{
|
|
border-left: 10px solid $primary;
|
|
border-right: 10px solid $primary;
|
|
transform: scale(1.01);
|
|
z-index: 2;
|
|
box-shadow: 0px 7px 40px -5px rgba(0,0,0,.2);
|
|
}
|
|
}
|
|
}
|
|
|
|
.tab-nav {
|
|
a {
|
|
color: $white;
|
|
text-transform: uppercase;
|
|
font-size: 12px;
|
|
letter-spacing: .2em;
|
|
}
|
|
}
|
|
}
|
|
|
|
.block-testimony {
|
|
.person {
|
|
flex: 0 0 80px;
|
|
}
|
|
blockquote {
|
|
font-size: 1rem;
|
|
font-style: italic;
|
|
}
|
|
}
|
|
.block-trainer {
|
|
position: relative;
|
|
width: 100%;
|
|
img {
|
|
display: block;
|
|
height: auto;
|
|
|
|
}
|
|
&:before {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background: rgba($primary, .7);
|
|
transition: .3s all ease;
|
|
visibility: hidden;
|
|
opacity: 0;
|
|
}
|
|
.block-trainer-overlay {
|
|
position: absolute;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
padding: 20px;
|
|
text-align: center;
|
|
transition: .3s all ease;
|
|
visibility: hidden;
|
|
opacity: 0;
|
|
h2 {
|
|
font-size: 20px;
|
|
color: $white;
|
|
}
|
|
a {
|
|
color: $white;
|
|
}
|
|
}
|
|
&:hover {
|
|
.block-trainer-overlay {
|
|
visibility: visible;
|
|
opacity: 1;
|
|
}
|
|
&:before {
|
|
visibility: visible;
|
|
opacity: 1;
|
|
}
|
|
}
|
|
}
|
|
|
|
.img-border, .img-border-sm {
|
|
|
|
|
|
position: relative;
|
|
|
|
img {
|
|
transition: .3s all ease-in-out;
|
|
position: relative;
|
|
top: 0;
|
|
left: 0;
|
|
z-index: 2;
|
|
}
|
|
// &:before {
|
|
// position: absolute;
|
|
// content: "";
|
|
// height: 97%;
|
|
// width: 97%;
|
|
// background: $warning;
|
|
// right: 0px;
|
|
// bottom: 0px;
|
|
// // border: 10px solid $primary;
|
|
// z-index: 1;
|
|
// transition: .3s all ease-in-out;
|
|
// }
|
|
// &:hover, &:active, &:focus {
|
|
// &:before {
|
|
// right: -30px;
|
|
// bottom: -30px;
|
|
// opacity: 1;
|
|
// visibility: visible;
|
|
// }
|
|
// img {
|
|
// top: -5px;
|
|
// left: -5px;
|
|
// }
|
|
// }
|
|
}
|
|
|
|
.img-border-sm {
|
|
// &:hover, &:active, &:focus {
|
|
// &:before {
|
|
// right: -10px;
|
|
// bottom: -10px;
|
|
// opacity: 1;
|
|
// visibility: visible;
|
|
// }
|
|
// img {
|
|
// top: -5px;
|
|
// left: -5px;
|
|
// }
|
|
// }
|
|
}
|
|
|
|
.media-with-text {
|
|
.heading {
|
|
font-size: 18px;
|
|
a {
|
|
color: $black;
|
|
}
|
|
}
|
|
}
|
|
|
|
.quick-contact-info {
|
|
// background: #5c7893;
|
|
background: $black;
|
|
color: rgba(255,255,255,.5);
|
|
h2 {
|
|
color: $white;
|
|
text-transform: uppercase;
|
|
font-size: 14px;
|
|
letter-spacing: .2em;
|
|
}
|
|
}
|
|
|
|
.latest-sermons {
|
|
h2 {
|
|
text-transform: uppercase;
|
|
font-size: 16px;
|
|
letter-spacing: .2em;
|
|
}
|
|
}
|
|
|
|
.image-play {
|
|
position: relative;
|
|
.icon-wrap {
|
|
z-index: 6;
|
|
position: absolute;
|
|
transform: translate(-50%, -50%);
|
|
top: 50%;
|
|
left: 50%;
|
|
width: 100px;
|
|
height: 100px;
|
|
background: rgba($white, .2);
|
|
border-radius: 50%;
|
|
> span {
|
|
font-size: 40px;
|
|
color: $white;
|
|
position: absolute;
|
|
transform: translate(-35%, -50%);
|
|
top: 50%;
|
|
left: 50%;
|
|
}
|
|
}
|
|
}
|
|
|
|
.post-date {
|
|
color: rgba($black, .4);
|
|
}
|
|
|
|
.section-heading {
|
|
h2 {
|
|
position: relative;
|
|
display: inline-block;
|
|
font-family: $font-family-serif;
|
|
font-size: 40px;
|
|
&:before, &:after {
|
|
content: "";
|
|
position: absolute;
|
|
bottom: 0;
|
|
height: 1px;
|
|
|
|
background: $black;
|
|
left: 0;
|
|
transform: translateX(-50%);
|
|
}
|
|
&:before {
|
|
width: 100px;
|
|
bottom: -10px;
|
|
left: 50%;
|
|
}
|
|
// &:after {
|
|
// width: 80px;
|
|
// bottom: -20px;
|
|
// left: 50%;
|
|
// }
|
|
}
|
|
&.text-left {
|
|
h2 {
|
|
&:before, &:after {
|
|
left: 0;
|
|
transform: translateX(-0%);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.unit-8 {
|
|
.accordion-item {
|
|
.heading {
|
|
font-size: 1.2rem;
|
|
font-weight: 400;
|
|
padding: 10px 0;
|
|
> a {
|
|
padding-left: 35px;
|
|
position: relative;
|
|
color: $black;
|
|
&:before {
|
|
|
|
width: 20px;
|
|
height: 20px;
|
|
line-height: 18px;
|
|
border: 1px solid #ccc;
|
|
text-align: center;
|
|
font-size: 18px;
|
|
top: .1em;
|
|
left: 0;
|
|
}
|
|
&[aria-expanded="true"] {
|
|
&:before {
|
|
font-family: 'icomoon';
|
|
position: absolute;
|
|
content: "\e316";
|
|
transition: .3s all ease;
|
|
background: $primary;
|
|
color: $white;
|
|
border: 1px solid $primary;
|
|
}
|
|
}
|
|
&[aria-expanded="false"] {
|
|
&:before {
|
|
content: "\e313";
|
|
color: #ccc;
|
|
font-family: 'icomoon';
|
|
position: absolute;
|
|
|
|
transition: .3s all ease;
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
.body-text {
|
|
padding: 5px 0;
|
|
padding-left: 30px;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
.upcoming-events {
|
|
|
|
}
|
|
.caption {
|
|
text-transform: uppercase;
|
|
letter-spacing: .2em;
|
|
font-size: 12px;
|
|
padding: 7px 10px;
|
|
color: $white;
|
|
display: inline-block;
|
|
}
|
|
.hotel-room {
|
|
transition: .3s all ease;
|
|
background: $white;
|
|
.heading {
|
|
font-size: 20px;
|
|
text-transform: uppercase;
|
|
a {
|
|
color: $black;
|
|
}
|
|
}
|
|
.hotel-room-body {
|
|
padding: 30px;
|
|
.price {
|
|
color: $blue;
|
|
font-weight: 400;
|
|
}
|
|
}
|
|
|
|
> .thumbnail {
|
|
overflow: hidden;
|
|
position: relative;
|
|
img {
|
|
transition: .3s all ease;
|
|
transform: scale(1.0);
|
|
}
|
|
}
|
|
&:hover {
|
|
box-shadow: 0 4px 20px 0 rgba(0,0,0,.05);
|
|
img {
|
|
transform: scale(1.05);
|
|
}
|
|
}
|
|
}
|
|
|
|
.image-absolute {
|
|
position: absolute;
|
|
width: 50%;
|
|
right: -50px;
|
|
border: 7px solid $white;
|
|
z-index: 9;
|
|
bottom: -50px;
|
|
}
|
|
|
|
.img-opacity {
|
|
img {
|
|
transition: .2s all ease;
|
|
opacity: 1;
|
|
}
|
|
&:hover {
|
|
cursor: zoom-in;
|
|
img {
|
|
opacity: .5;
|
|
}
|
|
}
|
|
} |