.demo1 {
text-transform: uppercase;
.content-container &.left {left: auto;}
h2 {
margin: 5px 0 45px;
color: #000;
font-family: 'Oswald';
font-size: 70px;
font-weight: 800;
letter-spacing: 5px;
line-height: 1;
}
.btn {
padding: 18px 40px;
border: 0;
color: #fff;
letter-spacing: 1px;
line-height: 1;
}
}
.demo2 {
padding: 0 75px;
text-align: right;
text-transform: uppercase;
h2 {
font-family: 'Oswald';
letter-spacing: 0;
font-size: 102px;
color: #fff;
line-height: 1;
font-weight: 700;
margin: 0;
}
h3 {
margin: 7px 0;
font-family: 'Oswald';
font-size: 25px;
color: #fff;
b {
display: inline-block;
vertical-align: top;
font-weight: 300;
}
}
.text-large {
font-family: 'Playfair Display';
font-weight: 700;
font-style: italic;
font-size: 76px;
line-height: 1;
padding: 0 20px;
}
.btn {
margin-top: 68px;
margin-left: 7px;
padding: 11px 28px;
float: left;
border: 0;
background-color: #e1ddc3;
color: #61605a;
font-size: 17px;
letter-spacing: .075em;
}
}
.demo3 {
margin-right: 5%;
margin-left: 4.5%;
padding: 42px;
background-color: #0e0e0e;
color: #fff;
text-transform: uppercase;
h2 {
margin: 0;
padding-bottom: 2px;
font-size: 17px;
font-weight: 400;
letter-spacing: .05em;
}
h3 {
font-family: 'Oswald';
font-size: 48px;
font-weight: 300;
margin-bottom: 22px;
}
.btn {
margin-bottom: 23px;
padding: 9px 19px;
border: solid 2px #2c2c2c;
background-color: #0e0e0e;
color: #fff;
letter-spacing: .05em;
}
}
.demo5,
.demo13 {
margin: 0 10%;
padding: 2em 0;
color: #0e2f40;
font-size: 1.8rem;
text-align: center;
text-transform: uppercase;
h2 {
margin: 0;
font-family: 'Oswald',sans-serif;
font-size: 1em;
font-weight: 700;
}
h3 {
font-size: 2em;
font-weight: 900;
letter-spacing: -1px;
}
.btn {
margin-top: 1em;
padding: 8px 16px;
border-color: #08c #08c #069;
border-radius: 3px !important;
background-color: #08c;
color: #fff;
font-size: 16px;
}
&.right {font-size: 2.3rem;}
h2 span::before {
content: '';
position: absolute;
top: 0;
left: 10%;
width: 80%;
height: 100%;
border: 6px solid;
border-color: inherit;
z-index: -1;
}
}
.demo10 {
font-size: 1.6rem;
text-align: center;
text-transform: uppercase;
.content-container &.left {left: 20%;}
.content-container &.right {
right: 20%;
margin-left: 1.5rem;
text-align: left;
}
h2 {
font-size: 2em;
font-family: 'Oswald';
font-weight: 400;
letter-spacing: .1em;
color: #575757;
p {
margin-bottom: 5px;
font-family: 'Georgia';
font-size: .5em;
font-weight: 300;
letter-spacing: 0;
line-height: 1;
text-transform: none;
}
}
h3 {
margin-bottom: .5556em;
color: #000;
font-family: 'Oswald';
font-size: 4.5em;
font-weight: 700;
letter-spacing: 0.1em;
line-height: 1.1111em;
}
&.right h3 {
font-size: 3.3125em;
line-height: 1.0944em;
}
.btn {
padding: 0 25px;
border: 2px solid #000;
background-color: transparent;
color: #000;
font-weight: 500;
letter-spacing: .1em;
line-height: 41px;
&:hover {
background-color: #000;
color: #fff;
}
}
}
.demo12 {
color: #000;
font-size: 1.8rem;
text-transform: uppercase;
.content-container &.left {left: 9%;}
.content-container &.right {
right: 9%;
margin-left: 1.5rem;
}
h2 {
margin: 2px 0 12px;
font-family: 'Oswald';
font-size: 3.333em;
font-weight: 700;
letter-spacing: .05em;
line-height: 1;
p {
margin-bottom: 5px;
font-size: .3em;
font-weight: 400;
letter-spacing: .025em;
}
}
h3 {
font-family: 'Oswald';
font-size: 1.333em;
font-weight: 400;
letter-spacing: .025em;
}
.btn {
margin-top: 2.5em;
padding: 8px 13px;
letter-spacing: .05em;
}
}
.demo13 {
color: #111;
.btn {
font-size: 14px;
letter-spacing: .05em;
}
}
.demo14 {
display: -ms-flexbox;
display: flex;
background-color: #2f2727;
color: #fff;
font-size: 2rem;
text-transform: uppercase;
.content-container & {
top: auto;
bottom: 0;
transform: none;
}
&.right {background-color: #d92a2e;}
h2 {
margin: 0;
padding: .6977em 0.605em .6977em 1.047em;
font-family: 'Oswald', sans-serif;
font-size: 2.15em;
font-weight: 400;
letter-spacing: .025em;
line-height: 1;
p {
margin: 0 0 10px;
font-size: 0.4186em;
font-weight: 300;
letter-spacing: .1em;
line-height: 1;
}
}
h3 {
margin: 3px 0 0;
padding-right: .2433em;
font-family: 'Poppins', sans-serif;
font-size: 9.25em;
line-height: .7;
font-weight: 700;
letter-spacing: -.05em;
span {
position: absolute;
top: 50%;
right: 3.7273em;
transform: translateY(-50%);
font-family: 'Oswald';
font-size: .1189em;
font-weight: 300;
letter-spacing: .1em;
line-height: 1;
text-align: center;
b {
font-size: 0.6364em;
font-weight: 300;
}
}
}
.btn {
position: absolute;
bottom: 0;
right: 0;
padding: 8px 10px;
border-color: #2f2727;
background-color: #2f2727;
font-size: 12px;
letter-spacing: .075em;
line-height: 1;
}
}
.demo16 {
color: #fff;
font-size: 1.8rem;
text-transform: uppercase;
.slideshow-section &.left {left: 17%;}
.slideshow-section &.right {right: 17%;}
h2 {
font-family: 'Oswald';
font-size: 1em;
font-weight: 400;
letter-spacing: -0.01em;
line-height: 1;
b {
display: inline-block;
margin-top: .078125em;
margin-right: .078125em;
margin-left: -.0625em;
font-family: 'Poppins';
font-size: 3.5556em;
font-weight: 600;
text-shadow: .078125em .046875em #92a9b3;
}
span {
position: absolute;
top: .8485em;
font-family: 'Open Sans';
font-size: 1.8333em;
b {
display: block;
margin: 0;
font-family: 'Oswald';
font-size: .5455em;
font-weight: 400;
letter-spacing: .075em;
text-shadow: none;
}
}
}
h3 {
margin-top: .375em;
font-family: 'Oswald';
font-size: 4.4445em;
font-weight: 700;
line-height: 1;
p {
margin-bottom: 1.75em;
font-family: 'Poppins';
font-size: .25em;
font-weight: 400;
letter-spacing: .075em;
}
}
.btn {
border: 0;
border-radius: 2px !important;
padding: 14px 20px;
letter-spacing: .05em;
line-height: 1;
}
&.right {
h2 {
font-size: 4.4445em;
font-weight: 700;
b {
margin: 0 0 .391em;
font-size: .8em;
letter-spacing: -.01em;
line-height: 1;
}
}
h3 {
margin: 0 0 1.9445em;
font-size: 1em;
letter-spacing: -.01em;
}
}
}
.demo19 {
font-size: 1.8rem;
.slideshow-section &.left {left: 10%; padding-left: 314px;}
.slideshow-section &.right {right: 10%;}
h2 {
margin: 0;
color: #292525;
font-family: 'Oswald';
font-size: 3.556em;
font-weight: 400;
letter-spacing: .01em;
line-height: 1.328125em;
text-transform: uppercase;
p {
position: relative;
height: 0;
margin: 0 -.21875em;
padding: 0 .21875em;
border-bottom: 1.328125em solid #292525;
border-right: .234375em solid transparent;
color: #fff;
font-weight: 400;
line-height: 1.328125em;
}
}
h3 {
margin-bottom: .8em;
color: #292525;
font-family: 'Oswald';
font-size: 1.3889em;
font-weight: 300;
letter-spacing: -0.025em;
line-height: 2.667em;
b {font-weight: 800;}
}
.btn, .btn:hover {
border: 0;
background-color: transparent;
color: #292525;
font-size: 1em;
font-weight: 600;
}
}
.demo20 {
width: 100%;
font-size: 2rem;
text-align: center;
text-transform: uppercase;
h2 {
margin: 0;
color: #301b24;
font-family: 'Oswald';
font-size: 4em;
font-weight: 700;
letter-spacing: .035em;
line-height: 1;
text-transform: uppercase;
p {
margin-bottom: .25em;
font-size: .5em;
font-weight: 300;
letter-spacing: .1em;
}
}
h3 {
margin-bottom: .5em;
color: #39332d;
font-family: 'Oswald';
font-size: 3em;
font-weight: 300;
span {color: #dd3d60;}
}
.btn {
padding: 13px 28px;
font-size: 13px;
letter-spacing: .075em;
}
}
@media (max-width: 991px) {
.demo1 {
h2 {
margin: 4px 0 20px;
font-size: 30px;
letter-spacing: 2px;
}
.btn {
padding: 10px 20px;
font-size: 10px;
}
}
.demo5, .demo13 {
font-size: 1.5rem;
&.right {font-size: 1.8rem;}
.btn {font-size: 1.3rem;}
}
.demo10 {
.content-container &.right {right: 10%;}
.content-container &.left {left: 10%;}
}
.demo12 {
font-size: 1.4rem;
.btn {font-size: 1.1rem;}
}
.demo14, .demo16, .demo19, .demo20 {font-size: 1.6rem;}
.demo19 {
.content-container &.left {padding-left: 0;}
}
}
@media (max-width: 767px) {
.demo2 {
h2 {font-size: 50px;}
h3 {
font-size: 15px;
padding-left: 1px;
display: block;
}
.text-large {
font-size: 30px;
padding: 0 10px;
}
.btn {
padding: 10px 20px;
font-size: 10px;
margin-top: 20px;
}
}
.demo3 {
padding: 20px;
h2 {font-size: 11px;}
h3 {
margin-bottom: 10px;
font-size: 20px;
}
.btn {
margin-bottom: 0;
padding: 5px 15px;
font-size: 11px;
}
}
.demo5, .demo13 {
font-size: 1.2rem;
.btn {font-size: 1.1rem;}
&.right {font-size: 1.5rem;}
}
.demo10 {font-size: 1.2rem;}
.demo12 {font-size: 1.2rem;}
.demo14, .demo16, .demo19, .demo20 {font-size: 1.2rem;}
}
.blog_article {
h3.title-widget {
&.type_1 {
background: none;
text-align: center;
}
}
.item {
padding-top: 10px;
.row {
margin-right: -10px;
margin-left: -10px;
.col-md-5 {
padding-right: 10px;
padding-left: 10px;
}
.col-md-7 {
padding-right: 10px;
padding-left: 10px;
}
.post-image {
position: relative;
margin: 0 0 15px;
padding: 2px;
border: 1px solid #e1e1e1;
border-radius: 5px;
background-color: #fff;
overflow: hidden;
img {
width: 100%;
border-radius: 4px;
}
}
.post-date {
margin-right: 10px;
float: left;
text-align: center;
.day {
display: block;
padding: 8px;
color: #3f4658;
font-size: 18px;
font-weight: 700;
}
.month {
display: block;
width: 45px;
padding: 2px 0;
border-radius: 0 0 2px 2px;
color: #fff;
font-size: .9em;
line-height: 1.4;
box-shadow: 0 -1px 0 0 rgba(0, 0, 0, .07) inset;
}
}
.postTitle {
h2 {
min-height: 55px;
margin: 0 0 10px;
font-size: 20px;
font-weight: 400;
line-height: 27px;
}
}
.postContent {
padding-bottom: 15px;
font-size: 14px;
line-height: 1.5;
p {margin: 0;}
}
a.readmore {
font-size: 16px;
font-weight: 300;
&:hover {text-decoration: underline;}
}
}
&.blog_post_type_1 {
-ms-flex-align: center;
align-items: center;
.post-image {
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 250px;
}
.post-content {
min-height: 212px;
margin-left: -40px;
padding: 40px;
background-color: #fff;
text-align: left;
z-index: 1;
.postTitle {
min-height: auto;
margin-bottom: 9px;
h2 {
margin-bottom: 12px;
font-size: 18px;
font-weight: 600;
letter-spacing: -.01em;
line-height: 1;
text-transform: uppercase;
}
}
.post-date {
display: inline-block;
margin-right: 10px;
margin-bottom: 8px;
padding: 8px;
float: none;
background-color: #e1ddc3;
color: #8f8e86;
font-family: 'Oswald';
font-size: 14.5px;
font-weight: 300;
letter-spacing: .1em;
text-align: left;
}
.postContent {
margin-bottom: 15px;
padding: 0;
font-size: 15px;
letter-spacing: .03em;
line-height: 25px;
}
.readmore {
background: none !important;
color: #333;
font-size: 13px;
font-weight: 700;
letter-spacing: .03em;
text-transform: uppercase;
}
}
}
&.blog_post_type_2 {
margin-top: 10px !important;
padding: 10px;
padding-top: 10px;
background-color: #fff;
.post-image {
margin: 0;
border: 0;
.post-date {
position: absolute;
top: 7px;
left: 7px;
background-color: #08c;
color: #fff;
font-family: 'Oswald';
font-weight: 400;
.day {
display: block;
padding: 12px 0 6px;
color: #fff;
font-size: 16px;
font-weight: 400;
letter-spacing: .05em;
line-height: 1;
}
.month {
display: block;
width: 45px;
padding: 0 0 10px;
color: #fff;
font-size: 16px;
font-weight: 400;
letter-spacing: .05em;
line-height: 1;
text-transform: uppercase;
box-shadow: none;
}
}
}
.col-md-7 {
.post-date {display: none;}
.postTitle {
min-height: auto;
margin-bottom: 10px;
padding-top: 10px;
h2 {
min-height: auto;
margin: 0 0 10px;
font-size: 18px;
font-weight: 400;
letter-spacing: -.001em;
line-height: 22px;
}
}
.postContent {
margin-bottom: 10px;
padding-bottom: 15px;
color: #687176;
font-size: 13px;
line-height: 24px;
}
a.readmore {
display: inline-block;
padding: 9px 16px;
border-radius: 2px !important;
background-color: #2b2b2d;
font-family: 'Oswald';
font-size: 12px;
font-weight: 300;
letter-spacing: .05em;
line-height: 1.42857143;
text-transform: uppercase;
}
}
}
}
.owl-nav {
position: absolute;
top: -33px;
right: 0;
button {display: inline-block;}
}
}
.blog-slidebar {
.latest_news {
margin: 0 -10px;
.item {
padding: 20px 10px 0;
.row {
margin-right: -10px;
margin-left: -10px;
.col-md-5,
.col-md-7 {
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
padding-right: 10px;
padding-left: 10px;
}
.post-image {
margin: 0 0 15px;
padding: 2px;
border: 1px solid #e1e1e1;
border-radius: 5px;
background-color: #fff;
overflow: hidden;
img {
width: 100%;
border-radius: 4px;
}
}
.post-date {
margin-right: 10px;
float: left;
text-align: center;
.day {
display: block;
padding: 8px;
background-color: #f7f7f7;
color: #3f4658;
font-size: 18px;
font-weight: 700;
}
.month {
display: block;
width: 45px;
padding: 2px 0;
border-radius: 0 0 2px 2px;
color: #fff;
font-size: .9em;
line-height: 1.4;
box-shadow: 0 -1px 0 0 rgba(0, 0, 0, .07) inset;
}
}
.postTitle {
h2 {
min-height: 55px;
margin: 0 0 10px;
font-size: 20px;
font-weight: 400;
line-height: 27px;
}
}
.postContent {
padding-bottom: 15px;
font-size: 14px;
line-height: 1.5;
p {margin: 0;}
}
a.readmore {
font-size: 16px;
font-weight: 300;
&:hover {text-decoration: underline;}
}
}
}
}
}
.last_blog_clients {
padding: 30px 0;
.blog_article {
padding: 0;
.item {
.row {
margin-right: -20px;
margin-left: -20px;
}
&.blog_post_type_2 {
.row {
a.readmore {border-radius: 0 !important;}
.col-md-7 {
.postContent {font-size: 14px;}
}
}
}
}
}
.testimonials {
padding-top: 10px;
.owl-nav {
position: absolute;
top:-35px;
right:0;
button {display: inline-block;}
}
}
}
// PARALLAX SECTION STYLE
.parallax-wrapper {
.parallax {
position: relative;
margin: 0 auto;
padding: 50px 0;
background-color: #eee;
color: #fff;
.overlay {
display: block;
position: absolute;
top: 0;
width: 100%;
height: 100%;
background-color: #000;
opacity: .65;
z-index: 2;
filter: alpha(opacity=75);
}
}
.parallax_fixed_text {
.content {
position: absolute;
top: -28px;
left: 15px;
min-width: 307px;
padding: 40px;
background-color: #0e0e0e;
color: #fff;
text-align: left;
text-transform: uppercase;
z-index: 3;
em {
display: block;
padding-top: 8px;
padding-bottom: 6px;
color: #fff;
font-size: 17px;
font-style: normal;
font-weight: 400;
letter-spacing: .05em;
}
h2 {
margin-bottom: 28px;
color: #fff;
font-family: 'Oswald';
font-size: 48px;
font-weight: 300;
line-height: 1.1;
}
a {
margin-bottom: 25px;
padding: 9px 19px;
border: solid 2px #2c2c2c;
border-radius: 2px;
background-color: #0e0e0e;
color: #fff;
font-family: 'Oswald';
font-size: 14px;
font-weight: 400;
letter-spacing: .05em;
box-shadow: none;
}
}
}
}
.parallax-slider {
position: relative;
z-index: 3;
.item {
max-width: 100%;
float: none !important;
text-align: center;
}
h2 {
margin-top: 0;
margin-bottom: 15px;
font-size: 60.28px;
font-weight: 600;
line-height: 1;
text-transform: uppercase;
}
a {
border: 0;
background: transparent;
font-size: 16px;
font-weight: 300;
line-height: 1;
}
p {
margin-bottom: 30px;
font-size: 22.6px;
font-weight: 300;
line-height: 1;
}
.owl-dots {
margin-top: 25px;
text-align: center;
}
}
.parallax_fullscreen {
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
img {
max-width: 100%;
height: auto;
}
.parallax-content-15 {
position: absolute;
top: 37%;
width: 100%;
text-align: center;
.text_content_1 {
margin: 0;
line-height: 1;
img {
display: inline-block;
width: 37px;
height: 10px;
vertical-align: middle;
}
em {
display: inline-block;
color: #fff;
font-style: normal;
font-weight: 300;
line-height: 1;
vertical-align: middle;
}
}
.text_content_2 {
color: #fff;
font-weight: 800;
line-height: 1;
}
.text_content_3 {
color: #fff;
font-weight: 300;
line-height: 1;
}
a {
border: 0;
border-radius: 0;
}
}
&.parallax_01 {
.parallax-content-15 {
em {
margin: 0 10px;
font-size: 26.26px;
}
h2 {
margin: 5px 0 10px;
font-size: 79.12px;
}
p {font-size: 23.64px;}
}
}
&.parallax_04 {
.parallax-content-15 {
em {
font-size: 26.26px;
margin: 0 10px;
}
h2 {
font-size: 61px;
letter-spacing: -3px;
margin: 5px 0 10px;
}
p {
font-size: 18px;
margin-bottom: 15px;
}
a {
font-size: 16px;
padding: 8px 35px;
}
}
}
}
// INSTAGRAM SECTION STYLE
.enable-effect .insta-item .content {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
transition: all .3s;
background-color: rgba(255, 0, 0, .5);
color: #fff;
font-size: 35px;
text-align: center;
opacity: 0;
visibility: hidden;
z-index: 1;
}
.enable-effect .insta-item:hover .content {
opacity: 1;
visibility: visible;
}
.insta-item .content i {
display: none;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
.enable-effect & {display: inline-block;}
}
.instagram-section.type2 .container {
max-width: 100%;
padding: 0;
}
.instagram-section.type2 .container .row {
margin-right: 0;
margin-left: 0;
}
.main-container .instagram-section .title-widget {
margin-bottom: 16px;
font-family: 'Oswald';
font-size: 18px;
font-weight: 400;
background: none;
color: #282d3b;
letter-spacing: .05em;
text-align: center;
}
.insta-follow {
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
color: #fff;
text-align: center;
text-transform: uppercase;
z-index: 2;
&.insta-content-style1 {
top: 50%;
transform: translate(-50%, -50%);
}
> div {height: 100%;}
h3 {
font-family: 'Oswald';
line-height: 1;
}
span {
display: block;
letter-spacing: .05em;
}
a {
border-radius: 2px;
font-family: 'Oswald';
font-size: 14px;
letter-spacing: .05em;
text-transform: uppercase;
box-shadow: none;
}
}
.insta-content-style1 {
padding: 30px 40px;
.d-flex {
-ms-flex-direction: column;
flex-direction: column;
}
h3 {
padding-top: 15px;
font-size: 48px;
font-weight: 300;
}
span {
margin-bottom: 28px;
font-size: 15px;
}
a {
margin-bottom: 5px;
padding: 9px 28px;
border: solid 2px #2c2c2c;
font-weight: 400;
}
i {font-size: 24px;}
}
.insta-content-style2 { // Instagram Content Style - Light Fit
width: 33.4%;
min-width: 420px;
height: 100%;
padding: 20px 10px;
.description {
text-align: right;
}
h3 {
margin-bottom: 0;
font-size: 32px;
font-weight: 700;
}
span {
color: #777;
font-size: 10px;
}
i {
-ms-flex-order: 2;
order: 2;
margin: 0 4%;
font-size: 50px;
&::before {margin: -2px 0 0;}
}
.description {
-ms-flex-order: 1;
order: 1;
}
a {
-ms-flex-order: 3;
order: 3;
padding: .8em 3em;
font-weight: 300;
}
.d-flex {
height: 100%;
-ms-flex-pack: center;
justify-content: center;
a {border-radius: 3px !important;}
}
}
.blog-instagrams {
.col-xl-2 {
padding-right: 10px;
padding-left: 10px;
a {
display: block;
position: relative;
margin: 10px 0;
img {width: 100%;}
}
}
}
.intagram-shop {
.content {
padding: 10px 0 40px;
h2 {
font-size: 40px;
font-weight: 600;
line-height: 45px;
text-align: center;
text-transform: uppercase;
}
p {
margin: 0;
font-size: 20px;
line-height: 30px;
text-align: center;
}
}
}
.snptwdgt__ftr,
.fauximg-bin .snptico,
.public-modal .modal-left-column .snptico-shopping-bag {
display: none !important;
}
.snptwdgt-container-liner .fauximg-bin,
.snptwdgt-container .snptwdgt__item .snpt__fauxim img {
backface-visibility: hidden !important;
}
.snptwdgt-container .snptwdgt__item .snpt__fauximg {
backface-visibility: hidden !important;
transition: opacity .3s, transform .3s !important;
-webkit-transform: scale(1) !important;
transform: scale(1) !important;
}
.snptwdgt-container .snptwdgt__item:hover .snpt__fauximg {
transform: scale(1.05) !important;
-webkit-transform: scale(1.05) !important;
}
.widget-hotspot:hover {
background: #008acc !important;
text-decoration: none !important;
}
.hotspot.hotspot--highlighted,
.hotspot:hover {
background: #008acc !important;
text-decoration: none !important;
}
.hotspot {
backface-visibility: hidden !important;
text-decoration: none !important;
transition: all .3s linear !important;
}
.widget-hotspot {
background: #008acc !important;
border-width: 3px !important;
color: #fff !important;
}
.product-images-slide a.hotspot {border-radius: 100% !important;}
.loadr-arc-rotate-move .loader::before {
border-color: rgba(31, 192, 160, .155) !important;
opacity: .3 !important;
}
public-modal .image-holder__buy-button:hover .icon-shapping-bag,
public-modal .image-holder__buy-button:hover .snptico-shopping-bag {
color: #008acc !important;
}
.loadr-arc-rotate-move .loader:after {
border-bottom-color: #008acc !important;
}
.hotspot-modal {font-family: 'Open Sans' !important;}
.main-container {
.main-tab-products {
.row {
margin-right: -20px;
margin-left: -20px;
}
}
}
// MAIN SECTION STYPE
.main-section-one {
.home_slidebar {
.block-subscribe {
margin-top: 30px;
margin-bottom: 30px;
padding: 25px 20px 0;
border-top: 5px solid rgb(0, 136, 204);
border-width: 5px 1px 1px;
border-style: solid;
border-radius: 7px;
border-color: rgb(0, 136, 204) rgb(221, 221, 221) rgb(221, 221, 221);
border-image: initial;
background-color: rgb(251, 251, 251);
text-align: center;
.block-title {
margin: 5px 0 10px;
border-width: 0;
border-style: initial;
border-color: initial;
border-image: initial;
background-color: transparent;
color: rgb(49, 49, 49);
font-size: 16px;
font-weight: 700;
line-height: 1.2;
}
.block-content {
padding: 6px;
p {line-height: 1.8;}
.block_subscribe_form {
.input-group {
margin: 0 auto;
padding: 10px 10px 22px;
input {
width: 100%;
height: 34px;
padding: 5px 60px 5px 10px;
float: left;
border-width: 1px;
border-style: solid;
border-radius: 5px;
border-color: rgb(211, 211, 211);
border-image: initial;
background-color: rgb(254, 254, 254);
line-height: 16px;
}
button {
width: 50px;
height: 34px;
margin-left: -51px;
float: left;
border-left: 1px solid rgb(211, 211, 211);
border-radius: 0 5px 5px 0;
background: transparent;
color: rgb(81, 81, 81);
line-height: 32px;
}
}
}
}
}
.testimonials {
.item {
blockquote {
position: relative;
margin: 0;
padding: 10px 50px;
border-width: 0;
border-style: initial;
border-radius: 10px;
border-color: initial;
border-image: initial;
color: rgb(255, 255, 255);
font-family: Georgia, serif;
font-size: 1.2em;
font-style: italic;
line-height: 1.3;
&::before {
position: absolute;
top: 0;
left: 10px;
color: rgb(255, 255, 255);
font-size: 80px;
font-style: normal;
line-height: 1;
content: '\201c';
}
}
.testimonial-arrow-down {
width: 0;
height: 0;
margin: 0 0 0 25px;
border-bottom: 0;
border-width: 15px 15px 0;
border-style: solid solid solid;
border-color: transparent transparent;
border-image: initial;
}
.testimonial-author {
margin: 8px 0 0 8px;
.img-thumbnail {
display: inline-block;
position: relative;
max-width: 100%;
height: auto;
margin-right: 10px;
padding: 4px;
float: left;
border-width: 1px;
border-style: solid;
border-radius: 7px;
border-color: rgb(221, 221, 221);
border-image: initial;
background-color: rgb(255, 255, 255);
line-height: 1.5;
}
p {
margin: 0 0 0 25px;
color: rgb(102, 102, 102);
line-height: 24px;
text-align: left;
strong {
display: block;
padding-top: 7px;
color: rgb(17, 17, 17);
font-size: 14px;
}
span {
display: block;
color: rgb(102, 102, 102);
font-size: 12px;
}
}
&.author_new {
margin-bottom: 20px;
.img-thumbnail {
border: 0;
img {border-radius: 50% !important;}
}
}
}
}
.owl-dots {
display: block;
position: relative;
margin-top: 10px;
text-align: center;
}
}
.blog_article .latest_news .item .row .post_date_new {
display: block;
margin-right: 10px;
float: none;
text-align: left;
.long-date {
font-size: 13px;
font-weight: 700;
line-height: 22px;
text-transform: uppercase;
}
}
h3.title-widget {background-image: none;}
}
h3.title-widget {
margin: 0;
background: url(//cdn.shopify.com/s/files/1/1613/0121/t/5/assets/slider-bar.png?10803987245425891640) right center no-repeat;
color: rgb(49, 49, 49);
font-size: 16px;
font-weight: 700;
line-height: 42px;
text-align: left;
text-transform: uppercase;
}
.blog-slidebar {
padding: 0;
.owl-dots {
display: block;
position: relative;
margin-top: 10px;
text-align: center;
}
}
.filter-products {
h3.title-widget {
margin-top: 20px;
margin-bottom: 5px;
background-image: none;
}
.category-products {
.item {
display: inline-block;
position: relative;
width: 100%;
max-width: 300px;
padding: 0;
float: none;
text-align: left;
}
}
}
.shop-features {
text-align: center;
h2.shop-features-title {
position: relative;
margin: 26px 0;
font-size: 18px;
font-weight: 400;
text-align: center;
span.shop-features-title-content {
display: inline-block;
position: relative;
padding: 0 12px;
background-color: #fff;
color: #313131;
font-size: 15px;
font-weight: 700;
z-index: 1;
}
&:before {
display: block;
position: absolute;
top: 50%;
width: 100%;
height: 1px;
background-image: linear-gradient(to right, transparent, rgba(0, 0, 0, .2), transparent);
content: '';
}
}
.col-md-4 {
i {
display: inline-block;
width: 64px;
height: 64px;
border: 2px solid #ccc;
border-radius: 50%;
color: #333;
font-size: 28px;
line-height: 60px;
text-align: center;
}
h3 {
margin: 20px 0 10px;
color: #121214;
font-size: 15px;
font-weight: 600;
line-height: 1;
}
p {
margin: 0;
margin-bottom: 15px;
padding: 0 20px;
color: #777;
font-size: 14px;
}
a {
margin: 0;
font-size: 14px;
&:hover {text-decoration: underline;}
}
}
}
.single-images {
.row {
margin-right: -10px;
margin-left: -10px;
.col-md-4 {
padding-right: 10px;
padding-left: 10px;
.image-link {
&:before {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
transition: all .2s;
background-color: #000;
content: '';
opacity: 0;
visibility: hidden;
filter: alpha(Opacity = 0);
}
&:hover {
&:before {
opacity: .1;
visibility: visible;
filter: alpha(Opacity = 10);
}
}
}
}
}
}
}
.main_section_two {
.home_slidebar {
h3.title-widget {
margin-bottom: 5px !important;
background-image: none !important;
}
.block {
padding: 0;
background: url(bkg_4.png) bottom no-repeat;
}
.sidebar_banner_image img {width: 100%;}
}
.grid-images {
padding: 20px 0;
clear: both;
text-align: center;
img {
width: 100%;
height: auto;
}
.row {
margin-right: -10px;
margin-left: -10px;
.col-md-4,
.col-md-8 {
padding-right: 10px;
padding-left: 10px;
.grid1,
.grid2,
.grid3 {
img {
transition: all .2s;
opacity: 1;
visibility: visible;
filter: alpha(Opacity = 100);
}
&:hover {
img {
position: relative;
opacity: .8;
visibility: visible;
z-index: 2;
filter: alpha(Opacity = 80);
}
}
}
.grid1 {margin-bottom: 10px;}
}
}
}
.tab-product-collection {
.category-list {
.tab-selector {
display: -ms-flexbox;
display: flex;
padding: 10px 0;
background: url(slider-bar.png) right no-repeat;
line-height: 42px;
ul {
background: white;
li {
margin-left: 12px;
padding-left: 15px;
border-left: 1px solid #ddd;
&.active,
&.hover,
&.focus {
a {
background: #fff;
&:hover {background: #fff;}
}
}
a {
margin-left: 0;
padding: 0;
color: #313131;
font-size: 16px;
font-weight: 700;
&:hover {
background: #fff;
}
}
&:first-child {
margin-left: 0;
padding-left: 0;
border-left: 0;
a {
margin: 0;
padding: 0;
}
}
}
}
}
}
}
.featured-brands {
.owl-carousel {padding: 0;}
.owl-dots {margin-top: 30px;}
.item img {width: 100%;}
}
.blog_article {
h3.title-widget {
margin: 0;
color: #313131;
font-size: 16px;
font-weight: 700;
line-height: 42px;
text-align: left;
text-transform: uppercase;
}
.latest_news {
margin: 0 -10px;
.item {
padding: 20px 10px 0;
.row {
margin-right: -10px;
margin-left: -10px;
.col-md-5,
.col-md-7 {
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
padding-right: 10px;
padding-left: 10px;
}
.post-image {
margin: 0 0 15px;
padding: 2px;
border: 1px solid #e1e1e1;
border-radius: 5px;
background-color: #fff;
overflow: hidden;
img {
width: 100%;
border-radius: 4px;
}
}
.post-date {
margin-right: 10px;
float: left;
text-align: center;
.day {
display: block;
padding: 8px;
background-color: #f7f7f7;
color: #3f4658;
font-size: 18px;
font-weight: 700;
}
.month {
display: block;
width: 45px;
padding: 2px 0;
border-radius: 0 0 2px 2px;
color: #fff;
font-size: .9em;
line-height: 1.4;
box-shadow: 0 -1px 0 0 rgba(0, 0, 0, .07) inset;
}
}
.postTitle {
h2 {
min-height: 55px;
margin: 0 0 10px;
font-size: 20px;
font-weight: 400;
line-height: 27px;
}
}
.postContent {
padding-bottom: 15px;
font-size: 14px;
line-height: 1.5;
p {margin: 0;}
}
a.readmore {
font-size: 16px;
font-weight: 300;
&:hover {text-decoration: underline;}
}
}
}
}
}
}
.main_section_three {
.sidebar-section-main {
.home-side-menu-type2 {
h2 {
margin-bottom: 15px;
color: #333;
font-size: 15px;
font-weight: 600;
i:before {margin-left: 0;}
}
.sidebar-content {
border-top: 1px solid #ddd;
ul.nav-accordion {
a {
display: inline;
color: #777;
font-size: 13px;
&:hover {color: #000;}
}
> li {
display: block;
padding-left: 12px;
border-bottom: 1px solid #ddd;
line-height: 40px;
> a {font-size: 15px;}
span.collapse,
span.expand {
top: 0;
right: 0;
text-align: center;
&:after {
width: 21px;
padding-right: 0;
color: #777;
font-size: 15px;
line-height: inherit;
}
&:hover {
&:after {color: #000;}
}
}
span.collapse {
&:after {content: '\e80b';}
}
span.expand {
&:after {content: '\e80d';}
}
}
ul {
margin: 0;
padding-left: 1.5em;
list-style: none;
> li {
border-top: 1px solid #ddd;
line-height: 40px;
a {padding-left: 0;}
&:first-child {border-top: 0;}
}
}
}
}
}
.featured-box-2 {
margin: 30px 0;
h3 {
margin-bottom: 10px;
padding: 8px 0;
border-bottom: 1px solid #ddd;
color: #121213;
font-size: 15px;
line-height: 1.4;
i {font-size: 18px;}
}
p {
margin-bottom: 10px;
font-size: 14px;
}
a {font-size: 14px;}
}
}
.products-collection {
h3.title-widget {
margin: 0 0 5px 0;
background: none;
color: #333;
font-size: 15px;
font-weight: 600;
line-height: inherit;
}
.category-products .owl-nav {top: -22px !important;}
}
}
// Collection List Style
.collection-list {
a {
display: block;
position: relative;
height: 100%;
overflow: hidden;
}
img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform .3s ease;
&:hover {
-webkit-transform: scale(1.1, 1.1);
transform: scale(1.1, 1.1);
}
}
h3 {
position: absolute;
bottom: 0;
margin-bottom: 0;
padding: 9px 11px;
font-weight: 400;
text-transform: uppercase;
}
}
// BRAND SECTION STYLE
.featured-brands {
h3 {
margin: 30px 0 0;
color: #313131;
font-size: 16px;
font-weight: 700;
line-height: 42px;
text-align: left;
text-transform: uppercase;
&.title-widget {
background: url(//cdn.shopify.com/s/files/1/1613/0173/t/2/assets/slider-bar.png?4249384177349900548) right center no-repeat;
line-height: 42px;
.inner {padding-right: 20px;}
}
}
.owl-nav {
position: absolute;
top: -43px;
right: 0;
font-size: 18px;
}
.item {
-ms-flex-pack: center;
justify-content: center;
}
}
// CUSTOM HTML SECTION STYLE
.homepage-bar {
border-top: 1px solid #e1e1e1;
border-bottom: 1px solid #e1e1e1;
line-height: 1;
[class^='col-md-'], [class^='col-lg-'] {
padding-top: 20px;
padding-bottom: 21px;
border-left: 1px solid #e1e1e1;
text-align: center;
i {
display: inline-block;
font-size: 40px;
vertical-align: middle;
&::before {width: auto;}
}
.text-area {
display: inline-block;
margin-left: 5px;
text-align: left;
vertical-align: middle;
h3 {
margin: 0;
font-size: 16px;
line-height: 1.5;
}
p {
margin: 0;
font-size: 12px;
line-height: 20px;
}
}
&:first-child {border-left: 0;}
}
}
.custom-support {
i {
width: 62px;
height: 62px;
float: left;
border-radius: 50%;
font-size: 20px;
line-height: 62px;
text-align: center;
}
.content {
margin-left: 76px;
h2 {
margin: 0;
color: #000;
font-size: 20px;
font-weight: 600;
line-height: 1.5;
}
em {
display: block;
margin-bottom: 15px;
color: #888;
font-size: 11px;
font-style: normal;
font-weight: 300;
line-height: 1;
}
p {
color: #666;
font-size: 14px;
}
}
}
// CATEGORY SLIDER SECTION STYLE
.category_slider {
.category-products {
.products-grid {
.item {float: none;}
.owl-nav {
position: absolute;
top: -33px;
right: -5px;
button {
display: inline-block;
font-size: 18px;
text-align: center;
}
}
}
.carousel-init {
.owl-nav {
button {
display: inline-block;
font-size: 18px;
text-align: center;
}
}
}
}
.thumb-info-title {
position: absolute;
top: 40%;
left: 12px;
h3 {
margin-bottom: 0;
a {
font-family: 'Oswald';
font-size: 20px;
font-weight: 700;
letter-spacing: .01em;
line-height: 20px;
text-transform: uppercase;
}
}
.thumb-info-type {
font-size: 11px;
font-weight: 300;
line-height: 20px;
text-transform: uppercase;
}
}
.single-image {
text-align: center;
overflow: hidden;
&:hover {
img {transform: scale(1.2);}
}
img {
width: 100%;
transition: .5s ease !important;
}
}
.item {
padding: 4px 0 !important;
a {
display: block;
position: relative;
border-radius: 5px;
p {
position: absolute;
bottom: 13px;
width: 100%;
color: #fff;
text-align: center;
.category_slider_content {
padding: 0 10px;
background-color: rgba(23, 23, 23, .9);
font-size: 20.28px;
font-weight: 800;
line-height: 37px;
}
}
}
}
}
// BANNER SECTION STYLE
.banner_text_1 {
padding-bottom: 30px;
.item {
margin-bottom: 30px;
transition: all .3s;
text-align: center;
img {
width: 100%;
}
.content {
padding: 10px;
h3 {
padding: 18px 0 8px;
color: #111;
font-family: 'Oswald';
font-size: 18px;
font-weight: 400;
letter-spacing: .05em;
line-height: 24px;
text-transform: uppercase;
a:hover {text-decoration: underline;}
}
span {
display: block;
padding-bottom: 28px;
font-size: 13px;
line-height: 24px;
}
}
&:hover {
box-shadow: 0 8px 35px -10px rgba(0, 0, 0, .3);
}
}
}
.banner_text_2 {
.image-link {
img {display: block;}
span.category-title {
display: block;
position: absolute;
bottom: 20px;
left: -10px;
min-width: 174px;
padding: 15px 17px;
font-size: 15px;
font-weight: 600;
line-height: 1;
text-align: left;
&::before {
display: block;
position: absolute;
top: 100%;
left: 0;
width: 10px;
height: 10px;
border: 5px solid transparent;
content: '';
}
}
}
}
.banner_text_3 {
.image-link {
img {display: block;}
}
.row {
margin-right: -8px;
margin-left: -8px;
.column {
margin: 8px 0;
padding-right: 8px;
padding-left: 8px;
.img-desc-home3 {
position: absolute;
top: 50%;
width: 100%;
margin-top: -88px;
padding: 0 25px;
font-family: Georgia;
h3 {
font-family: Georgia;
font-size: 24px;
}
hr {
width: 90px;
margin: 15px 0;
}
p {font-size: 15px;}
a {font-size: 15px;}
}
}
}
}
.banner_text_4 {
&.single-images {
.single-image-label {
padding: 10px 0;
font-size: 17px;
font-weight: 600;
line-height: 1.4;
text-align: center;
}
.caption {
font-size: 14px;
line-height: 35px;
text-align: center;
}
}
}
.banner_text_5 {
.home-banner {
img {
max-width: 100%;
height: auto;
}
[class^='col-md-'] {
border-left: solid 1px #d9e0e8;
&:first-child {
border-left: 0;
.content {padding-left: 0;}
}
.content {
position: absolute;
top: 30%;
left: 0;
padding-left: 46px;
text-align: left;
h2 {
margin-bottom: 15px;
font-size: 24px;
font-weight: 400;
}
a {
padding: 10px 28px;
border: 1px solid #e1ddc3;
font-family: 'Oswald';
font-size: 12px;
letter-spacing: .05em;
box-shadow: none;
}
}
}
}
}
.banner_fixed_grid {
.b-left.banner-item {
margin-bottom: 20px;
&:last-child {margin-bottom: 0;}
}
.b-right.banner-item {
margin-bottom: 20px;
&:last-child {margin-bottom: 0;}
}
.b-center.banner-item {
margin-bottom: 20px;
&:last-child {margin-bottom: 0;}
}
}
.banner_fixed_grid_2 {
.image-link {
img {display: block;}
}
.row {
margin-right: -8px;
margin-left: -8px;
.column {
padding-right: 8px;
padding-left: 8px;
a {margin: 8px 0;}
}
}
}
.banner_fixed_grid_3 {
.grid4 a {color: #fff;}
.ribbon {
width: 33.5%;
height: 22.3%;
line-height: 1;
&::before {
position: absolute;
top: 0;
right: 0;
border: 150px solid #08c;
border-right: 0;
border-bottom: 0;
border-left: 200px solid transparent;
content: '';
}
em {font-size: 14px;}
h4 {
margin: 0;
font-size: 33px;
line-height: 1;
}
h5 {
margin: 0;
font-size: 18px;
line-height: 1;
}
}
* {transition: all .2s;}
.row {
margin-right: -5px;
margin-left: -5px;
}
img {
width: 100%;
max-width: 100%;
height: auto;
}
.col-md-margin {margin-bottom: 8px;}
.row {
.col-md-1,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-10,
.col-md-11,
.col-md-12 {
padding-right: 5px;
padding-left: 5px;
}
}
}
.banner_fullwidth {
padding: 200px 0;
text-align: center;
h3 {
color: #fff;
font-size: 90px;
font-weight: 600;
letter-spacing: -5px;
}
a {
display: inline-block;
margin: 20px 0;
padding: 20px 45px;
transition: all .3s;
background-color: #fff;
color: #000;
font-size: 12px;
font-weight: 600;
letter-spacing: 3px;
line-height: 1;
text-transform: uppercase;
box-shadow: 3px 3px 0 rgba(255, 255, 255, .5);
&:hover {opacity: .85;}
}
}
.banner-grid {
.title {
color: #151515;
font-size: 22px;
font-weight: 400;
text-align: center;
text-transform: uppercase;
}
img {
width: 100%;
height: auto;
}
}
.masonry-grid {
position: relative;
margin: 3px;
&.products-grid {
display: -ms-flexbox;
display: flex;
}
.grid-sizer,
.masonry-grid-item {
width: 25%;
padding: 3px;
float: left;
}
.masonry-grid-item {
a {
display: block;
position: relative;
img {
width: 100%;
max-width: 100%;
height: auto;
}
&:before {
display: block;
position: absolute;
width: 100%;
height: 100%;
transition: .3s all;
background-color: #000;
content: '';
opacity: 0;
visibility: hidden;
filter: alpha(opacity = 0);
}
&:hover {
&:before {
opacity: .2;
visibility: visible;
filter: alpha(opacity = 20);
}
}
}
&.w2 {width: 50%;}
&.w3 {width: 75%;}
&.w4 {width: 100%;}
}
}
.collection_banner {
h3.fullwidth-filter-title {
color: #000;
font-size: 28px;
font-weight: 600;
line-height: 1.2;
}
p.fullwidth-filter-description {
color: #666;
font-size: 14px;
line-height: 1.4;
}
.hide-action {
.item .details-area .actions {display: none;}
}
.owl-stage-outer {padding: 15px 0;}
.collection-banner-ct {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
text-align: left;
.banner-ct-area {
position: relative;
height: 100%;
span.text {
position: absolute;
top: 32%;
left: 17%;
div > span {
color: #fff;
font-family: 'Oswald';
font-size: 60px;
font-weight: 400;
line-height: 1;
text-transform: uppercase;
}
}
}
}
}
.home-banner {
display: inline-block;
padding-top: 30px;
.image-link {
img {display: block;}
span.category-title {
display: block;
position: absolute;
bottom: 20px;
left: -10px;
min-width: 174px;
padding: 15px 17px;
background-color: #3f4658;
color: #fff;
font-size: 15px;
font-weight: 600;
line-height: 1;
text-align: left;
&::before {
display: block;
position: absolute;
top: 100%;
left: 0;
width: 10px;
height: 10px;
border: 5px solid transparent;
border-top-color: #3f4658;
border-right-color: #3f4658;
content: '';
}
}
}
}
.banner-slide-section {
.content {
position: absolute;
top: 20%;
right: 15%;
max-width: 40%;
h3 {
margin-bottom: 20px;
color: #fff;
font-size: 60px;
font-weight: 600;
letter-spacing: -4px;
}
img {max-width: 100%;}
p {margin-bottom: 15px;}
a {
display: inline-block;
margin: 20px 0;
padding: 20px 45px;
transition: all .3s;
background-color: #fff;
color: #000;
font-size: 12px;
font-weight: 600;
letter-spacing: 3px;
line-height: 1;
text-transform: uppercase;
box-shadow: 3px 3px 0 rgba(255, 255, 255, .5);
&:hover {opacity: .85;}
}
}
.owl-dots {
display: inline-block;
position: absolute;
bottom: 0;
width: 100%;
.owl-dot {
span {
width: 10px;
height: 10px;
border: solid 2px #fff;
border-radius: 20px !important;
background: none;
opacity: 1;
}
&.active {
span {background: #fff;}
}
}
}
.owl-nav {
position: absolute;
top: calc(50% - 27.5px);
width: 100%;
.owl-prev {
display: inline-block;
position: absolute;
left: 8px;
}
.owl-next {
display: inline-block;
position: absolute;
right: 8px;
}
i {font-size: 40px;}
}
}
.slideshow-content-collection {
.banner-content-18 {
.text-content {
em {
margin-bottom: 5px;
margin-left: 5px;
font-size: 26.26px;
}
h2 {
font-size: 79.12px;
letter-spacing: -4px;
}
p {
span {
padding-left: 5px;
font-size: 23.64px;
line-height: 2;
}
a {
margin-top: 7px;
margin-bottom: 125px;
margin-left: 5px;
padding: 10px 35px;
border: 0;
color: white;
font-size: 16px;
}
}
}
.owl-middle-outer-narrow p {
display: table;
width: 100%;
margin: 0;
margin-bottom: 10px;
font-size: 19px;
font-weight: 300;
}
.filter_title_type_2 {
display: table;
width: 100%;
margin: 0;
margin-bottom: 10px;
font-size: 19px;
font-weight: 300;
.title_line,
.title_line_content {
display: table-cell;
position: relative;
}
.title_line::after {
display: block;
position: absolute;
top: 50%;
width: 100%;
margin-top: -1px;
border-top: 1px solid #d8d8d8;
content: '';
}
}
}
.owl-nav {
position: absolute;
top: 34%;
left: 0;
width: 100%;
button {
display: inline-block;
i {font-size: 18px;}
&.owl-prev {margin-left: -30px;}
&.owl-next {
margin-right: -30px;
float: right;
}
}
}
}
// SLIDESHOW SECTION STYLE
.slideshow-content-product {
.parallax-content-15 {
padding: 250px 0;
line-height: 1;
.owl-middle-outer-narrow {
p {
margin: 0;
margin-bottom: 5px;
color: #333;
font-size: 15px;
font-weight: 600;
}
}
}
&.parallax_02 {
.text-content {
em {
margin: 0;
font-size: 26.26px;
}
h2 {
font-size: 79.12px;
letter-spacing: -6px;
}
p {
margin: 0;
span {
padding-left: 6px;
font-size: 23.64px;
}
a {
margin-top: 5px;
margin-left: 10px;
padding: 10px 28px;
border: 0;
color: #fff;
font-size: 16px;
}
}
}
.owl-middle-outer-narrow .category-products .item .item-area .details-area .ratings .spr-badge .spr-starrating .spr-icon-star-empty {
color: #c3c5c9 !important;
}
}
&.parallax_03 {
.text-content {
em {
margin: 0;
margin-left: 5px;
font-size: 26.26px;
}
h2 {
font-size: 79.12px;
letter-spacing: -6px;
}
p {
margin: 0;
span {
padding-left: 6px;
font-size: 23.64px;
}
a {
margin-top: 5px;
margin-left: 125px;
padding: 10px 28px;
border: 0;
color: #000;
font-size: 16px;
}
}
}
.owl-middle-outer-narrow .category-products .item .item-area .details-area .ratings .spr-badge .spr-starrating .spr-icon-star-empty {
color: #c3c5c9 !important;
}
}
}
.slideshow-collection.slideshow-section {
&.full-screen-slider {
&:after {
position: absolute;
top: 50%;
left: 50%;
margin-top: -18px;
margin-left: -10px;
color: #777;
font-family: 'FontAwesome';
font-size: 20px;
content: '\f110';
z-index: 1;
-webkit-animation: spin 2s infinite linear;
animation: spin 2s infinite linear;
}
}
}
.img-content-left,
.img-content-right {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
text-transform: uppercase;
}
.img-content-left {
margin-left: 20%;
}
.img-content-right {
margin-left: 50%;
}
.video-wrap {
.video-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-repeat: repeat;
background-position: center top;
z-index: 9;
&.overlay-lightgrid {background-image: url('//cdn.shopify.com/s/files/1/0028/1958/8142/t/14/assets/vo_pixel_light.png?v=11706009885453837161560388115');}
}
video {
width: 100%;
min-width: 100%;
min-height: 100%;
}
.video-background {
position: absolute;
top: 50%;
width: 100%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
z-index: -1;
}
}
.main-slideshow {
.side-custom-menu {
margin-bottom: 11px;
border: 1px solid #ddd;
border-radius: 7px;
overflow: hidden;
&:last-child {margin-bottom: 0;}
h2 {
margin: 0;
padding: 13px 13px 12px;
border-bottom: 1px solid #ddd;
border-radius: 5px 5px 0 0;
background-color: #f5f5f5;
color: #000;
font-size: 13px;
font-weight: 700;
line-height: 1;
text-align: left;
}
ul {
padding: 0 12px;
li {
text-align: left;
&:first-child {border: 0;}
a {
color: #777;
.cat-label {text-transform: capitalize;}
}
&.float-right {float: none !important;}
.ulmenu-block.col-md-8 {
ul.level1 {
li.level2 {width: 200px;}
}
}
}
}
li.level0 {
padding: 13px 4px 12px;
border-top: 1px solid #ddd;
text-align: left;
&:first-child {border: 0;}
a {
display: block;
color: #777;
font-size: 15px;
line-height: 1;
&:hover {text-decoration: underline;}
}
}
}
.owl-stage-outer {border-radius: 5px;}
.owl-dots {bottom: 18px;}
}
.slideshow-thumbnails.slideshow-section {
position: relative;
&.full-screen-slider {
&::after {
position: absolute;
top: 50%;
left: 50%;
margin-top: -18px;
margin-left: -10px;
color: #777;
font-family: 'FontAwesome';
font-size: 20px;
content: '\f110';
z-index: 1;
-webkit-animation: spin 2s infinite linear;
animation: spin 2s infinite linear;
}
}
.slideshow {
z-index: 5;
.owl-nav {
button {
display: none;
position: absolute;
top: 35%;
margin: 5px;
padding: 3px 10px;
color: #3b3b3b;
font-size: 40px;
text-shadow: 0 0 3px rgba(255, 255, 255, .5);
}
.owl-prev {left: 0;}
.owl-next {right: 0;}
}
&:hover {
.owl-nav {
button {display: block;}
}
}
img {
width: auto;
max-width: 100%;
height: auto;
}
ul.scene {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
> li.layer {
width: 100%;
height: 100%;
}
}
.content {
position: absolute;
top: 30%;
left: 20%;
width: auto;
margin: 0;
padding: 0;
text-align: left;
h2 {
margin-bottom: 18px;
font-size: 80px;
font-weight: 600;
line-height: .9;
}
.button a {
display: inline-block;
margin: 20px 0;
padding: 20px 45px;
transition: all .3s;
background-color: #fff;
color: #000;
font-size: 12px;
font-weight: 700;
letter-spacing: 3px;
line-height: 1;
text-transform: uppercase;
box-shadow: 3px 3px 0 rgba(255, 255, 255, .5);
&:hover {
opacity: .85;
}
}
}
}
.owl-thumbs {
position: absolute;
right: 100px;
bottom: 50px;
width: 30%;
z-index: 6;
button {
width: auto;
max-width: 33.33%;
height: auto;
margin: 0;
padding: 0;
float: left;
border: 0;
background: none;
img {
max-width: 100%;
border: 3px solid transparent;
}
&.active {
img {border-color: rgba(255, 255, 255, .5);}
}
}
}
}
.slideshow-section {
position: relative;
.slideshow {
z-index: 2;
.item {
position: relative;
min-height: 320px;
}
.owl-nav {
button {
display: none;
position: absolute;
top: 40%;
margin: 5px;
padding: 3px 10px;
font-size: 40px;
text-shadow: 0 0 3px rgba(255, 255, 255, .5);
}
.owl-prev {left: 0;}
.owl-next {right: 0;}
}
.owl-dots {
display: inline-block;
position: absolute;
right: 0;
bottom: 5px;
left: 0;
text-align: center;
}
&:hover {
.owl-nav {
button {display: block;}
}
}
}
&.full-screen-slider {
&:after {
position: absolute;
top: 50%;
left: 50%;
margin-top: -18px;
margin-left: -10px;
color: #777;
font-family: 'FontAwesome';
font-size: 20px;
content: '\f110';
z-index: 1;
animation: spin 2s infinite linear;
-webkit-animation: spin 2s infinite linear;
}
}
.copyright-text {
position: absolute;
bottom: 0;
left: 100px;
color: #000;
font-family: 'Oswald';
font-size: 12px;
font-weight: 400;
line-height: 92px;
z-index: 9;
}
}
.content-container {
position: absolute;
top: 0;
left: 50%;
width: 100%;
height: 100%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.slide-image {
position: absolute;
top: 0;
left: 0;
min-height: 320px;
}
.slide-bg {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
max-height: none !important;
min-height: 320px;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
}
.slideshow-background {
.slideshow {
.content {
position: absolute;
top: 30%;
left: 9%;
width: auto;
height: auto;
line-height: 1;
text-align: right;
}
}
}
.slideshow .banner-content-18 {
padding: 290px 0 80px;
line-height: 1;
}
.group_product {
.one-product {
h4 {
margin: 0;
padding: 14px 0;
background-color: #fff;
color: #333;
font-size: 16px;
font-weight: 700;
line-height: 1.4;
text-align: center;
}
.category-products {
padding-bottom: 15px;
background: white;
.products-grid {
position: relative;
.item {
padding: 0;
float: none;
.details-area {padding-top: 20px;}
}
.owl-dots {margin-top: 8px;}
.owl-nav {
button {
display: none;
position: absolute;
top: 35%;
i {font-size: 20px;}
&.owl-prev {left: 5px;}
&.owl-next {right: 5px;}
}
}
&:hover {
.owl-nav {
button {display: block;}
}
}
}
}
}
}
#slideshow_slidebar_collection {
.side-custom-menu {
overflow: visible;
ul {
li {
border-top: 0;
a:hover {text-decoration: none;}
}
}
}
}
// SHOP BY COLLECTION
.block-by-collection.container {
width: 100%;
max-width: 100%;
.tab-product-collection .category-detail {
position: relative;
padding: 70px 15px;
}
}
.shop-by-collection.tab-product-collection {
display: -ms-flexbox;
display: flex;
width: 100%;
padding: 0 85px;
.category-list {
padding: 70px 15px;
border-right: 1px solid #dcdcdc;
> span {
display: block;
margin-bottom: 10px;
color: gray;
font-size: 20px;
font-weight: 600;
}
.tab-selector {
ul {
-ms-flex-direction: column;
flex-direction: column;
border-bottom: 0;
li {
display: block;
margin: 0;
padding: 10px 0;
float: none;
line-height: 20px;
a {
position: relative;
padding: 0 0 0 20px;
border: 0;
background: transparent;
color: #000;
font-size: 12px;
line-height: 20px;
text-transform: uppercase;
&::before {
position: absolute;
left: 0;
width: 11px;
font-family: 'porto';
content: '\f87a';
}
&.active {
&::before {content: '\f87b';}
}
}
}
}
}
}
.category-detail {
position: relative;
padding: 70px 15px;
.products-grid {
> li {padding: 10px 5px !important;}
&.flex-grid {
> li {padding: 0 !important;}
}
}
.infinite-scrolling {
padding: 30px 0;
clear: both;
text-align: center;
a {
display: inline-block;
padding: 20px 45px;
transition: all .3s;
background-color: #000;
color: #fff;
font-size: 12px;
font-weight: 600;
letter-spacing: 3px;
line-height: 1;
text-transform: uppercase;
box-shadow: 3px 3px 0 rgba(0, 0, 0, .5);
}
}
}
}
// GROUP COLLECTION
.group-collection.filter-products {
h3.title-widget {
margin-top: 20px !important;
margin-bottom: 5px !important;
background-image: none !important;
}
.category-products {
.products-grid {
.item {
display: inline-block;
width: 100%;
max-width: 300px;
padding: 0;
float: none;
&:last-child {
.item-area {padding-bottom: 6px;}
}
}
}
}
}
.slider-with-side {
margin: 0 -8px;
line-height: 1;
.slideshow-section {
.content {
position: absolute;
top: 30%;
left: 10%;
z-index: 3;
}
}
.slider-area {
-ms-flex: 0 0 72.3%;
flex: 0 0 72.3%;
max-width: 72.3%;
padding: 0 8px;
}
img {
max-width: 100%;
height: auto;
}
.side-area {
-ms-flex: 0 0 27.7%;
flex: 0 0 27.7%;
max-width: 27.7%;
padding: 0 8px 0 7px;
.item1 {
position: relative;
margin-bottom: 9px;
overflow: hidden;
.content {
position: absolute;
bottom: 17px;
left: 15px;
text-align: left;
z-index: 9;
em {
display: block;
margin: 0 0 2px 4px;
font-size: 27.45px;
}
h2 {
margin: 0;
margin-bottom: 14px;
font-size: 35.16px;
}
a {
display: block;
margin: 0;
margin-left: 4px;
font-size: 15.08px;
}
}
}
.item2 {
position: relative;
margin-bottom: 9px;
overflow: hidden;
.content {
position: absolute;
bottom: 17px;
left: 21px;
text-align: left;
z-index: 9;
h2 {
margin: 0;
margin-bottom: 12px;
font-size: 33.86px;
}
p {
margin: 0;
margin-left: 1px;
font-size: 18.34px;
}
a {
margin: 13px 0 0 25px;
padding: 8px 10px 8px 15px;
border: 0;
font-size: 13px;
text-shadow: none;
}
}
}
.item3 {
position: relative;
margin: 0 !important;
margin-bottom: 9px;
overflow: hidden;
.content {
position: absolute;
bottom: 17px;
left: 19px;
text-align: left;
z-index: 9;
h2 {
margin: 0;
font-size: 32px;
}
p {
margin: 0;
margin-bottom: 17px;
font-size: 20px;
}
}
}
}
}
// TEMPLATE INDEX
.template-index {
.page-header {display: none;}
.modal-backdrop.in {
opacity: .5 !important;
z-index: 10 !important;
}
.fixed-position {
.footer-top,
.footer-middle {
display: none;
}
.footer-bottom {
position: fixed;
bottom: 0;
width: 100%;
margin: 0;
padding: 5px 0;
background-color: rgba(255, 255, 255, .85);
z-index: 99;
}
}
.details-area {
.actions {
.configurable-swatch-list {display: none;}
}
}
}
