Team:Cornell/ppCSS
/********************************* PRACTICES TIMELINE ********************************/
.timeline {
position: relative; margin-top: 100px;
}
/* vertical line */
.timeline::before {
content: ; position: absolute; margin: 0; position: absolute; top: 50%; left: 50%; width: 1.5px; background: #808080; z-index: 1;
}
.inspiration-timeline::before {
transform: translate(-50%, -52%); height: 1650px;
}
.ideation-timeline::before {
transform: translate(-50%, -51%); height: 2800px;
}
.implementation-timeline::before {
transform: translate(-50%, -51.2%); height: 1800px;
}
.timeline-block {
margin-bottom: 50px;
}
.timeline-img {
display: block; margin: 0 auto; padding-top: 25px; width: 100%;
}
.date {
font-family: 'Source Sans Pro', serif;
}
.timeline-content h3 {
font-family: 'Source Sans Pro', serif; font-weight: bold;
}
.timeline-content p {
line-height: normal; font-size: 16px;
}
.timeline-content-left {
/*padding-right: 25px;*/ padding-left: 0; text-align: right;
}
.timeline-content-right {
/*padding-left: 25px;*/ padding-right: 0;
}
.marker {
width: 16px; height: 16px; border-radius: 50%; border: 2px solid #567151; background: #567151; margin: 0; position: absolute; left: 50%; transform: translate(-50%, -50%); z-index: 3;
}
.urban-info {
font-style: italic; text-align: center;
}
/********************************* END PRACTICES TIMELINE ********************************/
/* Typography */
.text-left {
text-align: left;
}
.text-right {
text-align: right;
}
.text-center {
text-align: center;
}
.text-justify {
text-align: justify;
}
.text-nowrap {
white-space: nowrap;
}
.italic {
font-style: italic;
}
h1, h2, h3, h4, h5, h6 {
font-weight: 400; line-height: 1.6; color: #333333; font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em;
}
h1 {
font-size: 36px;
}
h2 {
font-size: 28px;
}
h3 {
font-size: 21px;
}
h4 {
font-size: 18px;
}
h5 {
font-size: 14px;
}
h6 {
font-size: 11px;
}
h1, h2, h3, h4, h5, h6, p {
margin-bottom: 25px; margin-top: 0;
}
h1.smb, h2.smb, h3.smb, h4.smb, h5.smb, h6.smb, p.smb {
margin-bottom: 10px;
}
h1.nmb, h2.nmb, h3.nmb, h4.nmb, h5.nmb, h6.nmb, p.nmb {
margin-bottom: 0;
}
- -moz-selection {
background-color: #30B397; color: #ffffff;
}
- selection {
background-color: #30B397; color: #ffffff;
}
- focus {
outline: none;
}
.heading-icon-1 {
-webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;
}
.heading-icon-1:before {
color: #30B397; content: "\e2d0"; display: block; font-size: 72px; font-weight: 400; line-height: 1; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; font-family: "wolverine";
}
.heading-icon-2 {
-webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;
}
.heading-icon-2:after {
color: #30B397; content: "\e2cf"; display: block; font-size: 72px; font-weight: 400; line-height: 1; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; font-family: "wolverine";
}
.heading-bgc-gray {
padding: 22px 0; background-color: #f4f4f4;
}
.heading-hr-1:after {
border-bottom: 2px solid #30B397; content: ""; display: block; position: relative; margin-top: 20px; width: 40px;
}
.heading-hr-1.center {
text-align: center;
}
.heading-hr-1.center:after {
margin-left: auto; margin-right: auto;
}
.heading-hr-1.right {
text-align: right;
}
.heading-hr-1.right:after {
margin-left: auto; margin-right: 0;
}
.heading-hr-2 {
text-align: center;
}
.heading-hr-2:after {
border-bottom: 1px solid #555555; content: ""; display: block; position: relative; margin-top: 5px; width: 40px;
}
.heading-hr-2:after {
margin-left: auto; margin-right: auto;
}
.heading-border-1 {
position: relative; text-align: center;
}
.heading-border-1:after {
border-top: 1px solid #dddddd; content: ""; left: 0; position: absolute; top: 50%; width: 100%; z-index: 3;
}
.heading-border-1 span {
border: 1px solid #dddddd; padding: 15px; width: 100%; display: inline-block; max-width: 270px; position: relative; z-index: 5; background-color: #ffffff;
}
.font-heading {
font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em;
}
.font-serif {
font-style: italic; font-family: 'Playfair Display', serif;
}
.font-content {
font-family: 'Raleway', sans-serif;
}
.fz-common-1 {
font-size: 28px;
}
.fz-common-2 {
font-size: 20px;
}
.fz-common-3 {
font-size: 16px;
}
.fz-common-4 {
font-size: 13px;
}
.fz-common-5 {
font-size: 11px;
}
.fz-common-6 {
font-size: 10px;
}
/* Color */
.color-main {
color: #30B397;
}
.color-main-2 {
color: #518f37;
}
.color-light {
color: #ffffff;
}
.color-gray {
color: #999999;
}
.color-lightgray {
color: #dddddd;
}
.color-dark {
color: #333333;
}
.color-common {
color: #555555;
}
.bgc-main {
background-color: #30B397;
}
.bgc-dark {
background-color: #333333;
}
.bgc-light {
background-color: #ffffff;
}
.bgc-gray {
background-color: #f6f8fb;
}
.border-bottom {
border-bottom: solid 1px #eeeeee;
}
.border-top {
border-top: solid 1px #eeeeee;
}
/* Button */
.border-btn {
background-color: transparent; border-style: solid; border-width: 1px; display: inline-block; font-size: 10px; letter-spacing: 2px; line-height: 1.6; outline: none; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em;
}
.border-btn.border-btn-light {
border-color: #ffffff; color: #ffffff;
}
.border-btn.border-btn-light:hover, .border-btn.border-btn-light:focus {
background-color: #ffffff; color: #333333;
}
.border-btn.border-btn-gray {
border-color: #999999; color: #555555;
}
.border-btn.border-btn-gray:hover, .border-btn.border-btn-gray:focus {
background-color: #999999; color: #ffffff;
}
.border-btn.border-btn-lightgray {
border-color: #dddddd; color: #777777;
}
.border-btn.border-btn-lightgray:hover, .border-btn.border-btn-lightgray:focus {
background-color: #dddddd; color: #ffffff;
}
.border-btn.border-btn-main {
border-color: #30B397; color: #30B397;
}
.border-btn.border-btn-main.color-common {
color: #555555;
}
.border-btn.border-btn-main:hover, .border-btn.border-btn-main:focus {
background-color: #30B397; color: #ffffff;
}
.border-btn.btn-size-1 {
padding: 16px 139px;
}
.border-btn.btn-size-2 {
padding: 16px 107px;
}
.border-btn.btn-size-3 {
padding: 13px 87px;
}
.border-btn.btn-size-4 {
padding: 13px 57px;
}
.border-btn.btn-size-5 {
padding: 13px 37px;
}
.border-btn.btn-size-6 {
padding: 9px 17px;
}
.normal-btn {
border: 0; display: inline-block; font-size: 10px; letter-spacing: 2px; line-height: 1.6; outline: none; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em; color: #ffffff;
}
.normal-btn.btn-size-1 {
padding: 17px 140px;
}
.normal-btn.btn-size-2 {
padding: 17px 108px;
}
.normal-btn.btn-size-3 {
padding: 14px 88px;
}
.normal-btn.btn-size-4 {
padding: 14px 58px;
}
.normal-btn.btn-size-5 {
padding: 14px 38px;
}
.normal-btn.btn-size-6 {
padding: 10px 18px;
}
.normal-btn.normal-btn-dark {
background-color: #333333;
}
.normal-btn.normal-btn-dark:hover, .normal-btn.normal-btn-dark:focus {
background-color: #30B397; color: #ffffff;
}
.normal-btn.normal-btn-darkgray {
background-color: #555555;
}
.normal-btn.normal-btn-darkgray:hover, .normal-btn.normal-btn-darkgray:focus {
background-color: #333333; color: #ffffff;
}
.normal-btn.normal-btn-gray {
background-color: #999999;
}
.normal-btn.normal-btn-gray:hover, .normal-btn.normal-btn-gray:focus {
background-color: #333333; color: #ffffff;
}
.normal-btn.normal-btn-main {
background-color: #30B397;
}
.normal-btn.normal-btn-main:hover, .normal-btn.normal-btn-main:focus {
background-color: #333333; color: #ffffff;
}
/* Flexslider Custom */
/*
- jQuery FlexSlider v2.5.0
- http://www.woothemes.com/flexslider/
- Copyright 2012 WooThemes
- Free to use under the GPLv2 and later license.
- http://www.gnu.org/licenses/gpl-2.0.html
- Contributing author: Tyler Smith (@mbmufffin)
- /
/* ====================================================================================================================
- RESETS
- ====================================================================================================================*/
.flex-container a:hover, .flex-slider a:hover, .flex-container a:focus, .flex-slider a:focus {
outline: none;
}
.slides, .slides>li, .flex-control-nav, .flex-direction-nav {
list-style: none; margin: 0; padding: 0;
}
.flex-pauseplay span {
text-transform: capitalize;
}
/* ====================================================================================================================
- BASE STYLES
- ====================================================================================================================*/
.flexslider-custom .slides:after {
clear: both; content: ""; display: block; height: 0; line-height: 0; visibility: hidden;
}
.flexslider-custom .slides>li {
-webkit-backface-visibility: hidden; display: none;
}
.flexslider-custom .slides img {
display: block; width: 100%;
}
html[xmlns] .flexslider-custom .slides {
display: block;
}
- html .flexslider-custom .slides {
height: 1%;
}
.no-js .flexslider-custom .slides>li:first-child {
display: block;
}
/* ====================================================================================================================
- DEFAULT THEME
- ====================================================================================================================*/
.flexslider-custom {
position: relative; zoom: 1;
}
.flexslider-custom .slides {
zoom: 1;
}
.flexslider-custom .slides img {
height: auto;
}
.flex-viewport {
max-height: 2000px; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;
}
.loading .flex-viewport {
max-height: 300px;
}
.carousel li {
margin-right: 5px;
}
.flex-direction-nav {
*height: 0;
}
.flex-direction-nav .flex-disabled {
cursor: default; filter: alpha(opacity=0); opacity: 0!important;
}
.flex-direction-nav a {
cursor: pointer; display: block; height: 40px; margin: -20px 0 0; overflow: hidden; position: absolute; width: 40px; z-index: 10;
}
.flex-direction-nav a:before {
content: ""; display: inline-block; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;
}
.flex-pauseplay a {
bottom: 5px; color: #000; cursor: pointer; display: block; height: 20px; left: 10px; opacity: 0.8; overflow: hidden; position: absolute; width: 20px; z-index: 10;
}
.flex-pauseplay a:before {
content: ; display: inline-block; font-size: 20px;
}
.flex-control-nav {
bottom: -40px; position: absolute; text-align: center; width: 100%;
}
.flex-control-nav li {
*display: inline; display: inline-block; margin: 0 6px; zoom: 1;
}
.flex-control-paging li a {
background: #666; background: rgba(0, 0, 0, 0.5); border-radius: 20px; -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3); box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3); cursor: pointer; display: block; height: 11px; text-indent: -9999px; width: 11px;
}
.flex-control-paging li a.flex-active {
background: #000; background: rgba(0, 0, 0, 0.9); cursor: default;
}
.flex-control-paging li a:hover {
background: #333; background: rgba(0, 0, 0, 0.7);
}
.flex-control-thumbs {
margin: 5px 0 0; overflow: hidden; position: static;
}
.flex-control-thumbs .flex-active {
cursor: default; opacity: 1;
}
.flex-control-thumbs img {
-moz-transition: all 1s ease; -ms-transition: all 1s ease; -o-transition: all 1s ease; -webkit-transition: all 1s ease; cursor: pointer; display: block; height: auto; opacity: 0.7; -webkit-transition: all 1s ease; transition: all 1s ease; width: 100%;
}
.flex-control-thumbs img:hover {
opacity: 1;
}
.flex-control-thumbs li {
float: left; margin: 0; width: 25%;
}
/* Slick Theme Custom */
/* Slider */
.slick-loading .slick-list {
background: #ffffff url("../images/ajax-loader.gif") center center no-repeat;
}
/* Arrows */
.slick-prev, .slick-next {
background: transparent; border: none; color: transparent; cursor: pointer; display: block; font-size: 0; line-height: 0; padding: 0; position: absolute;
}
.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before {
opacity: 0.25;
}
.slick-prev:hover, .slick-next:hover, .slick-prev:focus, .slick-next:focus {
background: transparent; color: transparent;
}
.slick-prev:before, .slick-next:before {
-moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; line-height: 1; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;
}
.slick-prev:before {
content: "";
}
.slick-next:before {
content: "";
}
/* MIXIN */
.call-to-action {
background-color: #ffffff; border: 1px solid #dddddd; padding: 50px 60px; width: 100%;
}
.call-to-action:after {
clear: both;
}
.call-to-action:before, .call-to-action:after {
content: " "; display: table;
}
.call-to-action:after {
clear: both;
}
.call-to-action:before, .call-to-action:after {
content: " "; display: table;
}
.call-to-action a {
margin: 0 auto;
}
.call-to-action p {
display: inline-block; font-style: italic; font-family: 'Playfair Display', serif; font-size: 20px;
}
@media only screen and (min-width: 992px) {
.call-to-action p {
float: left;
margin-bottom: 0;
}
.call-to-action a {
float: right;
}
}
.call-to-action-wrapper.style-2 .call-to-action {
background-color: #f4f4f4; border: 1px solid #f4f4f4; padding: 50px 60px; width: 100%;
}
.call-to-action-wrapper.style-2 .call-to-action:after {
clear: both;
}
.call-to-action-wrapper.style-2 .call-to-action:before, .call-to-action-wrapper.style-2 .call-to-action:after {
content: " "; display: table;
}
.call-to-action-wrapper.style-2 .call-to-action:after {
clear: both;
}
.call-to-action-wrapper.style-2 .call-to-action:before, .call-to-action-wrapper.style-2 .call-to-action:after {
content: " "; display: table;
}
.call-to-action-wrapper.style-3 .call-to-action {
background-color: #333333; border: 1px solid #333333; padding: 50px 60px; width: 100%;
}
.call-to-action-wrapper.style-3 .call-to-action:after {
clear: both;
}
.call-to-action-wrapper.style-3 .call-to-action:before, .call-to-action-wrapper.style-3 .call-to-action:after {
content: " "; display: table;
}
.call-to-action-wrapper.style-3 .call-to-action:after {
clear: both;
}
.call-to-action-wrapper.style-3 .call-to-action:before, .call-to-action-wrapper.style-3 .call-to-action:after {
content: " "; display: table;
}
.call-to-action-wrapper.style-3 p {
color: #ffffff;
}
.call-to-action-wrapper.style-4 .border-btn.border-btn-light:hover, .call-to-action-wrapper.style-4 .border-btn.border-btn-light:focus {
background-color: #ffffff; color: #30B397;
}
.call-to-action-wrapper.style-4 .call-to-action {
background-color: #30B397; border: 1px solid #30B397; padding: 50px 60px; width: 100%;
}
.call-to-action-wrapper.style-4 .call-to-action:after {
clear: both;
}
.call-to-action-wrapper.style-4 .call-to-action:before, .call-to-action-wrapper.style-4 .call-to-action:after {
content: " "; display: table;
}
.call-to-action-wrapper.style-4 .call-to-action:after {
clear: both;
}
.call-to-action-wrapper.style-4 .call-to-action:before, .call-to-action-wrapper.style-4 .call-to-action:after {
content: " "; display: table;
}
.call-to-action-wrapper.style-4 p {
color: #ffffff;
}
.call-to-action-wrapper .call-to-action {
background-color: #ffffff; border: 1px solid #dddddd; padding: 50px 60px; width: 100%;
}
.call-to-action-wrapper .call-to-action:after {
clear: both;
}
.call-to-action-wrapper .call-to-action:before, .call-to-action-wrapper .call-to-action:after {
content: " "; display: table;
}
.call-to-action-wrapper .call-to-action:after {
clear: both;
}
.call-to-action-wrapper .call-to-action:before, .call-to-action-wrapper .call-to-action:after {
content: " "; display: table;
}
.call-to-action-wrapper .call-to-action:after {
clear: both;
}
.call-to-action-wrapper .call-to-action:before, .call-to-action-wrapper .call-to-action:after {
content: " "; display: table;
}
.call-to-action-wrapper .call-to-action:after {
clear: both;
}
.call-to-action-wrapper .call-to-action:before, .call-to-action-wrapper .call-to-action:after {
content: " "; display: table;
}
.call-to-action-wrapper .call-to-action a {
margin: 0 auto;
}
.call-to-action-wrapper .call-to-action p {
display: inline-block; font-style: italic; font-family: 'Playfair Display', serif; font-size: 20px;
}
@media only screen and (min-width: 992px) {
.call-to-action-wrapper .call-to-action p {
float: left;
margin-bottom: 0;
}
.call-to-action-wrapper .call-to-action a {
float: right;
}
}
@media (max-width: 1229px) {
.call-to-action-wrapper .call-to-action {
text-align: center;
}
.call-to-action-wrapper .call-to-action .normal-button-1 {
float: none;
margin: 0 auto;
}
.call-to-action-wrapper .call-to-action p {
display: block;
}
}
.call-to-action-2 {
text-align: center;
}
.call-to-action-2 * {
color: #ffffff;
}
.call-to-action-2 .container {
position: relative;
}
.call-to-action-2 img {
width: 100%;
}
.call-to-action-2 .content {
padding-top: 146px; padding-bottom: 100px; background-position: 50% 0; background-repeat: no-repeat; background-size: cover;
}
.call-to-action-2 .content a {
display: inline-block; margin-bottom: 18px;
}
.call-to-action-2 .content h3 {
display: block; width: 237px; margin-bottom: 0; padding: 15px 50px; border: 5px solid #ffffff;
}
.call-to-action-2 .content p {
margin-bottom: 0;
}
@media (max-width: 479px) {
.call-to-action-2 .content {
padding-top: 50px;
padding-bottom: 25px;
}
}
/* Accordion */
.accordion-1.style-2 .panel-heading {
border: 1px solid #30B397; background-color: #30B397; color: #ffffff;
}
.accordion-1.style-2 .panel-heading h5 {
color: #ffffff;
}
.accordion-1.style-2 .panel-heading h5 i:before {
color: #ffffff;
}
.accordion-1.style-2 .panel-heading h5:after {
color: #ffffff;
}
.accordion-1 .panel {
margin-bottom: 20px;
}
.accordion-1 .panel:last-of-type {
margin-bottom: 0;
}
.accordion-1 .panel-body {
padding: 20px 15px;
}
.accordion-1 .panel-group {
margin: 0 auto; width: 100%;
}
.accordion-1 .panel-heading {
border: 1px solid #dddddd; padding: 12px 15px; color: #555555;
}
.accordion-1 .panel-heading a.collapsed h5:after {
content: "\e07f";
}
.accordion-1 .panel-heading h5 {
display: block; margin: 0; padding-right: 29px; position: relative;
}
.accordion-1 .panel-heading h5:after {
content: ":"; display: block; font-size: 24px; height: 24px; line-height: 1; margin: auto; position: absolute; width: 24px; color: #999999; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; font-family: "wolverine"; bottom: 0; right: 5px; top: 0;
}
.accordion-1 .panel-heading i {
display: inline-block; line-height: 26px; margin-right: 25px; color: #30B397;
}
.accordion-1 .panel-heading i:before {
display: inline-block; font-size: 26px; vertical-align: middle;
}
@media (max-width: 470px) {
.accordion-1 .panel-heading h5 {
font-size: 12px;
padding-right: 19px;
}
.accordion-1 .panel-heading h5:after {
right: -5px;
}
.accordion-1 .panel-heading h5 i {
display: none;
}
}
.accordion-3 .panel {
margin-bottom: 20px;
}
.accordion-3 .panel:last-of-type {
margin-bottom: 0;
}
.accordion-3 .panel-body {
padding: 20px 15px;
}
.accordion-3 .panel-group {
margin: 0 auto; width: 100%;
}
.accordion-3 .panel-heading {
border-bottom: 1px solid #dddddd; border-top: 1px solid #dddddd; padding: 10px 15px; background-color: #f4f4f4;
}
.accordion-3 .panel-heading a.collapsed h5:after {
content: "\e0ae";
}
.accordion-3 .panel-heading h5 {
margin: 0; font-size: 11px;
}
.accordion-3 .panel-heading h5:after {
content: "/"; float: right; font-size: 9px; color: #999999; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; font-family: "wolverine";
}
.accordion-3.style-2 .panel-heading {
background-color: #ffffff; padding: 10px 0px;
}
/* Portfolio */
.isotope-container .iso-grid {
position: relative;
}
.isotope-container .iso-grid:after {
clear: both;
}
.isotope-container .iso-grid:before, .isotope-container .iso-grid:after {
content: " "; display: table;
}
.isotope-container .iso-grid:after {
clear: both;
}
.isotope-container .iso-grid:before, .isotope-container .iso-grid:after {
content: " "; display: table;
}
.isotope-container .iso-grid .grid-item {
height: auto; padding-bottom: 30px;
}
.isotope-container .remove-col-padding .iso-grid .grid-item {
padding-bottom: 0; padding-top: 0;
}
section.portfolio-section .isotope-container .remove-col-padding {
margin-bottom: 30px;
}
.isotope-container .container-fluid:not(.remove-col-padding) {
padding-left: 30px; padding-right: 30px;
}
@media only screen and (min-width: 1230px) {
.isotope-container .w20p {
width: 20%;
}
}
.portfolio-filter-group {
padding: 20px 0; text-align: center;
}
.portfolio-filter-group .iso-button {
color: #888888; display: inline-block; padding: 0 23px; font-weight: 600; line-height: 1.2; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;
}
.portfolio-filter-group .iso-button.is-checked, .portfolio-filter-group .iso-button:hover {
color: #333333;
}
.portfolio-filter-group .iso-button:not(:first-of-type) {
border-left: 1px solid #dddddd;
}
.portfolio-group {
padding-top: 30px;
}
.portfolio-show-more {
padding: 30px 0 60px;
}
.portfolio-show-more a {
display: inline-block; border-bottom: 1px solid #555555; font-weight: 600;
}
.portfolio-more h5 {
-webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; margin-bottom: 10px;
}
.portfolio-more i {
-webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; color: #333333;
}
.portfolio-more:hover {
background-color: #333333;
}
.portfolio-more:hover i, .portfolio-more:hover h5 {
color: #ffffff;
}
.portfolio-item {
position: relative; display: block; overflow: hidden;
}
.portfolio-item img {
width: 100%;
}
.portfolio-item .overlay {
-webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; background-color: rgba(244, 244, 244, 0.9); opacity: 0;
}
.dark-overlay .portfolio-item .overlay, .portfolio-item.dark-overlay .overlay {
background-color: rgba(51, 51, 51, 0.9);
}
.dark-overlay .portfolio-item, .portfolio-item.dark-overlay, .dark-overlay .portfolio-item h1, .portfolio-item.dark-overlay h1, .dark-overlay .portfolio-item h2, .portfolio-item.dark-overlay h2, .dark-overlay .portfolio-item h3, .portfolio-item.dark-overlay h3, .dark-overlay .portfolio-item h4, .portfolio-item.dark-overlay h4, .dark-overlay .portfolio-item h5, .portfolio-item.dark-overlay h5, .dark-overlay .portfolio-item h6, .portfolio-item.dark-overlay h6, .dark-overlay .portfolio-item .heading-icon-1:before, .portfolio-item.dark-overlay .heading-icon-1:before {
color: #ffffff;
}
.portfolio-item .overlay-content {
padding: 20px; overflow: auto;
}
.portfolio-item .overlay-content h1, .portfolio-item .overlay-content h2, .portfolio-item .overlay-content h3, .portfolio-item .overlay-content h4, .portfolio-item .overlay-content h5, .portfolio-item .overlay-content h6, .portfolio-item .overlay-content p {
margin-bottom: 0;
}
.portfolio-item .overlay-content .group-link {
padding-top: 10px;
}
.portfolio-item .overlay-content .group-link a {
display: inline-block; height: 34px; width: 34px; border-radius: 17px; color: #666666; border: 1px solid #666666; margin: 5px;
}
.portfolio-item .overlay-content .group-link a:before {
font-size: 17px; line-height: 32px; display: block;
}
.portfolio-item .overlay-content .group-link a:hover {
border-color: #30B397; color: #ffffff; background-color: #30B397;
}
.portfolio-item .overlay-content .heading-icon-1:before {
font-size: 60px;
}
.portfolio-item:hover .overlay {
opacity: 1;
}
.portfolio-blog .overlay-content i {
font-size: 120px;
}
.portfolio-blog .overlay-content i:before {
display: block;
}
.portfolio-blog .overlay-content h4 {
margin-bottom: 0px;
}
.portfolio-blog .overlay-content .date {
font-style: normal;
}
.portfolio-item-1 .overlay-content .caption, .portfolio-item-2 .overlay-content .caption {
font-size: 14px;
}
.portfolio-item-3 .overlay-content {
padding: 0 50px;
}
.portfolio-item-3 .overlay-content .heading-icon-1 {
color: #30B397; margin-bottom: 20px;
}
.portfolio-item-3 .overlay-content .heading-icon-1:before {
color: #999999; margin-bottom: 10px;
}
.portfolio-item-3 .overlay-content .caption {
margin-bottom: 10px;
}
.portfolio-item-3 .overlay-content .group-link {
margin-left: -5px;
}
.portfolio-item-3 .overlay-content .group-link a {
text-align: center;
}
.portfolio-icon-item .overlay .group-function {
font-size: 26px;
}
.portfolio-icon-item .overlay .group-function a:first-child {
padding-right: 20px; margin-right: 20px; display: inline-block; border-right: 1px solid #dddddd;
}
.portfolio-icon-item .overlay .group-function a:first-child:before {
display: block;
}
.portfolio-footer-title footer {
-webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; border: 1px solid #dddddd; padding: 35px 30px;
}
.portfolio-footer-title footer h5 {
-webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; margin-bottom: 0;
}
.portfolio-footer-title footer h5 a {
-webkit-transition: all 0s; transition: all 0s;
}
.portfolio-footer-title footer .subtitle {
-webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; font-size: 14px;
}
.portfolio-footer-title:hover footer {
border-color: #30B397; background-color: #30B397;
}
.portfolio-footer-title:hover footer h5, .portfolio-footer-title:hover footer .subtitle {
color: #ffffff;
}
.portfolio-text .overlay {
background-color: transparent; padding: 30px;
}
.portfolio-text .overlay .overlay-content {
padding: 30px; background-color: rgba(255, 255, 255, 0.9);
}
.portfolio-text .overlay .overlay-content h5 {
margin-bottom: 15px; font-size: 16px;
}
@media (max-width: 1229px) {
.portfolio-index-1 {
padding-top: 90px;
}
}
@media only screen and (min-width: 1230px) {
.portfolio-index-1 .header-wrapper {
position: relative;
display: block;
height: 0;
padding-top: 50%;
}
.portfolio-index-1 .header-wrapper>*:only-child {
position: absolute;
left: 0%;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
width: 100%;
}
.portfolio-index-1 .section-header.header-type-2.style-1 {
padding: 0 80px;
margin-bottom: 0;
}
.portfolio-index-1 .section-header.header-type-2.style-1 q {
margin: 0;
}
.portfolio-index-1 .section-header.header-type-2.style-1 .container {
width: 100% !important;
}
}
@media (max-width: 767px) {
.homepage-portfolio-special-group .container {
max-width: 400px;
}
}
.homepage-portfolio-external-filter .label, .homepage-portfolio-external-filter .go-to-home {
padding: 20px 0;
}
.homepage-portfolio-external-filter .label {
margin-right: 20px;
}
.homepage-portfolio-external-filter .go-to-home a:hover {
color: #30B397;
}
.homepage-portfolio-external-filter .go-to-home i:before {
display: inline-block; -webkit-transform: translateY(3px); -ms-transform: translateY(3px); transform: translateY(3px);
}
.homepage-portfolio-external-filter .portfolio-filter-group {
float: left;
}
@media (max-width: 991px) {
.homepage-portfolio-external-filter .portfolio-filter-group {
float: none;
}
}
.homepage-portfolio-external-filter .portfolio-filter-group a {
font-weight: 400; color: #333333;
}
.homepage-portfolio-external-filter .portfolio-filter-group a.is-checked {
font-weight: 600;
}
@media (max-width: 479px) {
.homepage-classic-portfolio .container {
max-width: 270px;
}
.homepage-classic-portfolio .container .col-xs-6 {
width: 100%;
}
}
/* Blog Homepage */
.post-index {
margin-bottom: 60px;
}
.post-index:after {
clear: both;
}
.post-index:before, .post-index:after {
content: " "; display: table;
}
.post-index:after {
clear: both;
}
.post-index:before, .post-index:after {
content: " "; display: table;
}
.post-index .entry-header .post-meta {
margin-bottom: 10px;
}
.post-index .post-thumbnail, .post-index .video-container {
margin-bottom: 40px;
}
.post-index .post-thumbnail a {
display: block; position: relative;
}
.post-index .post-thumbnail img {
width: 100%;
}
.post-index .entry-content {
margin-bottom: 45px;
}
.post-index .entry-footer:after {
clear: both;
}
.post-index .entry-footer:before, .post-index .entry-footer:after {
content: " "; display: table;
}
.post-index .entry-footer:after {
clear: both;
}
.post-index .entry-footer:before, .post-index .entry-footer:after {
content: " "; display: table;
}
.post-index .entry-footer .readmore {
margin-bottom: 50px;
}
.post-index .entry-footer .author {
float: left;
}
.post-index .entry-footer .social-01 {
float: right; line-height: 17px; margin-right: -15px; font-size: 16px;
}
.post-index .entry-footer .social-01 a {
margin-right: 15px;
}
.post-index.quote {
padding: 40px 20px;
}
.post-index.quote .entry-header {
position: relative;
}
.post-index.quote .icon-quote {
display: none; position: absolute; top: 0; left: 0; height: 70px; width: 70px; background-color: #333333; color: #ffffff; font-size: 45px; text-align: center; float: left;
}
.post-index.quote .icon-quote:before {
line-height: 70px; display: block;
}
.post-index.quote .entry-content {
margin-bottom: 20px;
}
.post-index.quote .entry-content blockquote {
quotes: '"' '"'; margin: 0; font-style: italic; font-family: 'Playfair Display', serif; font-size: 16px;
}
.post-index.quote .entry-footer .author {
float: right; text-transform: uppercase; font-size: 16px;
}
@media only screen and (min-width: 480px) {
.post-index.quote {
padding: 60px 60px 60px 30px;
}
.post-index.quote .entry-header,
.post-index.quote .entry-content {
padding-left: 95px;
}
.post-index.quote .icon-quote {
display: block;
}
}
.post-index-style-1 {
padding-bottom: 15px;
}
.post-index-style-1:not(.quote) {
border-bottom: 1px solid #dddddd;
}
.post-index-style-1:not(.quote) .entry-header {
text-align: center;
}
.post-index-style-1 .post-title {
font-size: 24px;
}
.post-index-style-1.quote {
background-color: #f4f4f4;
}
.post-index-style-2 {
background-color: #ffffff; padding: 0 20px 40px;
}
.post-index-style-2 .post-thumbnail, .post-index-style-2 .video-container {
margin: 0 -20px 40px;
}
@media only screen and (min-width: 480px) {
.post-index-style-2 {
padding: 0 30px 50px;
}
.post-index-style-2 .post-thumbnail,
.post-index-style-2 .video-container {
margin: 0 -30px 50px;
}
}
@media only screen and (min-width: 992px) {
.post-index-style-2 {
padding: 0 70px 50px;
}
.post-index-style-2 .post-thumbnail,
.post-index-style-2 .video-container {
margin: 0 -70px 50px;
}
}
.masonry-post-index {
margin-bottom: 50px;
}
.masonry-post-index:after {
clear: both;
}
.masonry-post-index:before, .masonry-post-index:after {
content: " "; display: table;
}
.masonry-post-index:after {
clear: both;
}
.masonry-post-index:before, .masonry-post-index:after {
content: " "; display: table;
}
.masonry-post-index .entry-header {
text-align: center;
}
.masonry-post-index .entry-header img {
margin-left: auto; margin-right: auto;
}
.masonry-post-index .entry-content {
margin-bottom: 20px;
}
.masonry-post-index .entry-footer {
margin-bottom: 10px;
}
.masonry-post-index.quote {
padding: 30px; border: 0; background-color: #f4f4f4;
}
.masonry-post-index.quote .entry-header {
position: relative;
}
.masonry-post-index.quote .entry-header .post-title {
padding-top: 10px;
}
.masonry-post-index.quote .entry-content {
margin-bottom: 20px;
}
.masonry-post-index.quote .entry-content blockquote {
quotes: '"' '"'; margin: 0; font-style: italic; font-family: 'Playfair Display', serif; font-size: 16px;
}
.masonry-post-index.quote .entry-footer .author {
float: right; text-transform: uppercase; font-size: 16px;
}
.masonry-post-index-style-1 {
border-bottom: 1px solid #dddddd;
}
.masonry-post-index-style-1 .post-title {
padding-top: 40px;
}
.masonry-post-index-style-2:not(.quote) .entry-content {
padding: 30px 30px 10px; border-width: 0 1px 1px 1px; border-style: solid; border-color: #dddddd; text-align: center;
}
/* Post Detail*/
.post-detail-01.style-02 img {
margin-bottom: 40px;
}
.post-detail-01 .title h2 {
margin-bottom: 0;
}
.post-detail-01 .title span {
color: #30B397;
}
.post-detail-01 .title p {
color: #999999; margin-bottom: 34px;
}
.post-detail-01 .content {
margin-bottom: 55px;
}
.post-detail-01 .content img {
float: left; margin-right: 30px; margin-bottom: 20px;
}
.post-detail-01 .content blockquote {
font-style: italic; font-family: 'Playfair Display', serif; line-height: 2.2; margin-bottom: 30px; font-size: 14px;
}
.post-detail-01 .tag-share:after {
clear: both;
}
.post-detail-01 .tag-share:before, .post-detail-01 .tag-share:after {
content: " "; display: table;
}
.post-detail-01 .tag-share:after {
clear: both;
}
.post-detail-01 .tag-share:before, .post-detail-01 .tag-share:after {
content: " "; display: table;
}
.post-detail-01 .tag-share p {
display: inline-block; color: #333333; font-weight: 600;
}
.post-detail-01 .tag-share .tag {
display: inline-block;
}
.post-detail-01 .tag-share .tag span {
display: inline-block; margin-left: 20px; color: #30B397;
}
.post-detail-01 .tag-share .share {
float: right; display: inline-block;
}
@media (max-width: 580px) {
.post-detail-01 .tag-share .share {
float: none;
}
}
.post-detail-01 .tag-share .share p {
margin-right: 34px; color: #30B397;
}
.post-detail-01 .tag-share .share .social-01 {
display: inline-block;
}
.post-detail-01 .tag-share .share .social-01 li:not(:last-of-type) {
margin-right: 15px;
}
.post-detail-01 .tag-share .share .social-01 li:hover i:before {
color: #30B397;
}
.post-author {
padding-top: 50px; padding-bottom: 50px;
}
.post-author:after {
clear: both;
}
.post-author:before, .post-author:after {
content: " "; display: table;
}
.post-author:after {
clear: both;
}
.post-author:before, .post-author:after {
content: " "; display: table;
}
.post-author .avatar {
float: left; width: 200px; margin-right: 30px;
}
@media (max-width: 767px) {
.post-author .avatar {
float: none;
margin: 0 auto 20px auto;
}
}
.post-author .content {
position: relative;
}
.post-author .content h4 {
display: inline-block; border-right: 1px solid #dddddd; padding-right: 20px; line-height: 1; margin-right: 20px;
}
.post-author .content .social-01 {
display: inline-block;
}
.post-author .content .social-01 li {
margin-right: 20px;
}
.post-author .content .social-01 li:hover i:before {
color: #30B397;
}
.post-comments .big-comment {
border-bottom: 1px solid #dddddd;
}
.post-comments-style {
padding-top: 50px;
}
.post-comments-style.style-02 {
border-top: 1px solid #dddddd; margin-left: 100px; padding-top: 35px;
}
.post-comments-style.style-02 .image {
width: 70px;
}
.post-comments-style.style-02 .image img {
width: 100%;
}
.post-comments-style .image {
float: left; display: inline-block; width: 100px; margin-right: 30px;
}
.post-comments-style .content {
position: relative; overflow: hidden;
}
.post-comments-style .content p.comment {
margin-bottom: 10px;
}
.post-comments-style .content .date {
color: #30B397; font-weight: 600; font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em;
}
.post-comments-style .content .name {
display: inline-block; font-style: italic; line-height: 1; padding-right: 30px; border-right: 1px solid #dddddd; margin-right: 20px; font-weight: 600; font-family: 'Playfair Display', serif;
}
.post-comments-style .content .like-reply .reply {
color: #30B397; font-weight: 600; font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em; display: inline-block;
}
.post-comments-style .content .like-reply .like {
line-height: 1; padding-right: 30px; border-right: 1px solid #dddddd; margin-right: 20px; font-weight: 500; font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em; display: inline-block;
}
.post-comments-style .content .like-reply a {
margin-bottom: 15px;
}
@media (max-width: 479px) {
.post-comments-style.style-02 {
margin-left: 50px;
}
.post-comments-style .content>.name {
padding-right: 0;
margin-right: 0;
border-right: none;
display: block;
}
.post-comments-style .content>.like-reply>.like {
padding-right: 15px;
margin-right: 10px;
}
.post-comments-style .content {
overflow: visible;
}
}
.post-comments-form {
padding-top: 50px;
}
.post-comments-form .image {
float: left; width: 100px;
}
.post-comments-form .widget.contact-us {
margin-left: 130px;
}
.post-comments-form .widget.contact-us .normal-btn.btn-size-5 {
padding: 15px 60px;
}
@media (max-width: 767px) {
.post-comments-form .image {
float: none;
margin: 0 auto 30px auto;
}
.post-comments-form .widget.contact-us {
margin-left: 0;
}
}
/* Portfolio Special */
.portfolio-special-style-01 .image {
display: inline-block; position: relative;
}
.portfolio-special-style-01 .image .overlay {
background-color: rgba(244, 244, 244, 0.9); opacity: 0;
}
.portfolio-special-style-01 .image .overlay:hover {
opacity: 1;
}
.portfolio-special-style-01 .image .overlay a {
border: 1px solid #777777; border-radius: 50%; display: inline-block; font-size: 12px; line-height: 30px; text-align: center; height: 28px; width: 28px;
}
.portfolio-special-style-01 .image .overlay a:first-of-type {
margin-right: 15px;
}
.portfolio-special-style-01 .image .overlay a:hover {
border-color: #30B397; background-color: #30B397; color: #ffffff;
}
.portfolio-special-style-01 .image .overlay h5 {
color: #30B397;
}
.portfolio-special-style-01 .image img {
width: 100%;
}
.portfolio-special-style-01 .portfolio-special-item-01 .content {
bottom: 0; padding: 70px; position: absolute;
}
.portfolio-special-style-01 .portfolio-special-item-01.style-02 .content {
padding: 0 70px; position: inherit;
}
@media (max-width: 767px) {
.portfolio-special-style-01 .portfolio-special-item-01 .overlay {
text-align: center;
}
.portfolio-special-style-01 .portfolio-special-item-01 .overlay .content {
padding: 0;
position: relative;
}
.portfolio-special-style-01 .portfolio-special-item-01 .overlay .content p {
display: none;
}
}
.portfolio-special-style-02 .image {
display: inline-block; position: relative;
}
.portfolio-special-style-02 .image .overlay {
opacity: 0;
}
.portfolio-special-style-02 .image .overlay:hover {
opacity: 1;
}
.portfolio-special-style-02 .image .overlay .content {
background-color: rgba(255, 255, 255, 0.9); padding: 35px;
}
.portfolio-special-style-02 .image .overlay h5 {
color: #30B397;
}
.portfolio-special-style-02 .image img {
width: 100%;
}
.portfolio-special-style-02 .portfolio-special-item-03 .image .overlay {
bottom: 0; padding: 45px;
}
.portfolio-special-style-02 .portfolio-special-item-03 .image .overlay .content {
bottom: 0; position: absolute;
}
@media (min-width: 992px) and (max-width: 1230px) {
.portfolio-special-style-02 .portfolio-special-item-03 .image .overlay {
padding: 0;
}
.portfolio-special-style-02 .portfolio-special-item-03 .image .overlay .content {
position: relative;
bottom: auto;
}
}
.portfolio-special-style-02 .portfolio-special-item-03 .image .overlay .content-wrapper {
position: relative;
}
.portfolio-special-style-02 .portfolio-special-item-04 .content {
height: 100%; width: 100%;
}
/* Tab */
.tab-section-01 .content>.tab-pane {
display: none;
}
.tab-section-01 .content>.active {
display: block;
}
.tab-section-01 .content p:last-of-type {
margin-bottom: 0; opacity: 0.5;
}
.tab-section-01 .tabs li {
display: inline-block; border: 1px solid #dddddd;
}
.tab-section-01 .tabs li a {
display: inline-block; font-family: 'Source Sans Pro', sans-serif; letter-spacing: 0.2em; font-size: 12px;
}
.tab-section-01.style-1 .tabs li {
margin-right: 5px;
}
.tab-section-01.style-1 .tabs li a {
background-color: #eeeeee; font-size: 12px; font-weight: 700; outline: none; padding: 10px 30px;
}
.tab-section-01.style-1 .tabs li.active a, .tab-section-01.style-1 .tabs li.active a:focus, .tab-section-01.style-1 .tabs li.active a:hover {
color: #ffffff; background-color: #567151; border-color: #567151; cursor: default;
}
.tab-section-01.style-1 .tabs li:hover a {
background-color: #ffffff;
}
.tab-section-01.style-2 .content {
padding: 35px; border: 1px solid #dddddd; border-top: none;
}
.tab-section-01.style-2 .tabs {
position: relative; letter-spacing: -4px; text-align: left; border-bottom: 1px solid #dddddd;
}
.tab-section-01.style-2 .tabs>li {
letter-spacing: 0; margin-right: -1px; margin-bottom: -1px;
}
.tab-section-01.style-2 .tabs>li:before {
content: ""; display: block; width: 100%; height: 1px; background-color: transparent;
}
.tab-section-01.style-2 .tabs>li a {
padding: 10px 30px;
}
.tab-section-01.style-2 .tabs>li a:hover {
background-color: #eeeeee;
}
.tab-section-01.style-2 .tabs>li.active {
border-bottom-color: white; border-top: 1px solid #30B397;
}
.tab-section-01.style-2 .tabs>li.active:before {
content: ""; display: block; width: 100%; height: 1px; background-color: #30B397;
}
.tab-section-01.style-2 .tabs>li.active a, .tab-section-01.style-2 .tabs>li.active a:hover, .tab-section-01.style-2 .tabs>li.active a:focus {
cursor: default; background-color: #ffffff;
}
.tab-section-01.style-3 .content {
padding: 35px; border: 1px solid #dddddd; border-top: none;
}
.tab-section-01.style-3 .tabs {
position: relative; letter-spacing: -4px; text-align: right; border-bottom: 1px solid #dddddd;
}
.tab-section-01.style-3 .tabs>li {
letter-spacing: 0; margin-right: -1px; margin-bottom: -1px;
}
.tab-section-01.style-3 .tabs>li:before {
content: ""; display: block; width: 100%; height: 1px; background-color: transparent;
}
.tab-section-01.style-3 .tabs>li a {
padding: 10px 30px;
}
.tab-section-01.style-3 .tabs>li a:hover {
background-color: #eeeeee;
}
.tab-section-01.style-3 .tabs>li.active {
border-bottom-color: white; border-top: 1px solid #30B397;
}
.tab-section-01.style-3 .tabs>li.active:before {
content: ""; display: block; width: 100%; height: 1px; background-color: #30B397;
}
.tab-section-01.style-3 .tabs>li.active a, .tab-section-01.style-3 .tabs>li.active a:hover, .tab-section-01.style-3 .tabs>li.active a:focus {
cursor: default; background-color: #ffffff;
}
@media (max-width: 767px) {
.tab-section-01 .tabs li {
display: block;
margin-bottom: 20px;
}
.tab-section-01 .tabs li a {
width: 100%;
padding: 10px 35px;
}
}
/* Count */
.count-section-01 {
letter-spacing: -4px; text-align: center;
}
.count-section-01.style-2 {
background-color: #eeeeee;
}
.count-section-01.style-3 .timer {
color: #30B397;
}
.count-section-01.style-3 .counter>p {
color: #777777;
}
.count-section-01.style-4 {
position: relative; z-index: 0;
}
.count-section-01.style-4:before {
content: ""; width: 100%; height: 100%; top: 0; left: 0; position: absolute; background-color: transparent; z-index: -1;
}
.count-section-01.style-4 .timer {
color: #ffffff;
}
.count-section-01.style-4 .counter {
border: 1px solid #999999; border-bottom: none; border-top: none;
}
.count-section-01.style-4 .counter>p {
color: #ffffff;
}
.count-section-01.style-4 .counter-group {
z-index: 500;
}
@media only screen and (min-width: 1230px) {
.count-section-01 .count-wrapper {
float: left;
width: 20%;
margin-right: -1px;
}
}
.count-section-01 .counter {
border: 1px solid #eeeeee; border-bottom: none; border-top: none; letter-spacing: -4px; display: inline-block; text-align: center; width: 100%; max-width: 235px;
}
.count-section-01 .counter .timer {
display: block; font-size: 60px; line-height: 60px; text-align: center;
}
@media (max-width: 1229px) {
.count-section-01 .counter .timer {
font-size: 50px;
}
}
.count-section-01 .counter p {
display: block; font-size: 16px; letter-spacing: 0; line-height: 1; margin-bottom: 0; font-style: italic; color: #30B397; font-family: 'Playfair Display', serif;
}
/* Page */
.back-to-home {
color: #30B397; font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em; margin-bottom: 15px; font-size: 10px;
}
.back-to-home:after {
display: block; margin: 0 auto; width: 72px; border-top: 1px solid #30B397; content: "";
}
.page-contact .map-iframe {
margin-bottom: 15px; width: 100%; height: 457px; border: #eeeeee;
}
.page-contact .social-03 {
line-height: 1; text-align: center;
}
.page-contact .social-03 li {
display: inline-block;
}
.page-contact .social-03 li a {
display: inline-block; color: #999999;
}
.page-contact .social-03 li a i:before {
font-size: 13px; margin-right: 10px; vertical-align: middle; font-family: FontAwesome;
}
.page-contact .social-03 li a i {
color: #30B397; font-size: 13px;
}
.page-contact .social-03 li:last-of-type {
border-right: none;
}
.page-contact .social-03 li {
padding: 0 10px; border-right: 1px solid #dddddd;
}
.page-contact h3 {
margin-bottom: 50px;
}
.page-contact h5 {
color: #30B397; margin-bottom: 10px;
}
/* Page-About */
.page-about-header {
padding: 80px 0 55px 0;
}
.page-about-header h5 {
margin-bottom: 10px;
}
.page-about {
background-color: #f4f4f4; padding: 90px 0;
}
.page-about .quote h5 {
color: #30B397; float: right;
}
.page-about .quote p {
font-style: italic; font-family: 'Playfair Display', serif; margin-bottom: 17px; font-size: 16px;
}
.page-about h4 {
margin: 0; padding-bottom: 35px;
}
/* Page-Services */
.page-services .content:after {
clear: both;
}
.page-services .content:before, .page-services .content:after {
content: " "; display: table;
}
.page-services .content:after {
clear: both;
}
.page-services .content:before, .page-services .content:after {
content: " "; display: table;
}
.page-services .content a {
float: right;
}
.page-services .content h4 {
margin: 0;
}
.page-services .content h4:after {
margin-top: 30px;
}
.page-services .content p {
font-style: italic; font-family: 'Playfair Display', serif; margin: 46px 0; font-size: 16px;
}
.page-services .logo li {
display: inline-block; padding-right: 20px; padding-bottom: 50px;
}
@media only screen and (min-width: 992px) {
.page-services .logo li:nth-of-type(3n+3) {
padding-right: 0;
}
}
@media (max-width: 1229px) {
.page-services .logo li {
padding-right: 10px;
}
}
@media (max-width: 991px) {
.page-services .logo li {
padding-right: 60px;
}
.page-services .logo li:nth-of-type(3n+3) {
padding-right: 60px;
}
}
.page-services .logo ul {
display: inline-block; padding-left: 25px; text-align: center;
}
/* Page 404Page */
.page-error {
padding-top: 50px; padding-bottom: 50px;
}
.page-error h1 {
color: #555555; margin-bottom: 20px;
}
.page-error h4 {
color: #999999; font-style: italic; font-family: 'Playfair Display', serif; margin-bottom: 60px;
}
.page-error .footer-foot {
border-top: 1px solid #eeeeee; border-bottom: 1px solid #eeeeee;
}
/* Page Under Construction*/
.page-under-construction .page-under {
background-color: #f4f4f4; padding: 140px 0;
}
.page-under-construction .page-under:after {
clear: both;
}
.page-under-construction .page-under:before, .page-under-construction .page-under:after {
content: " "; display: table;
}
.page-under-construction .page-under:after {
clear: both;
}
.page-under-construction .page-under:before, .page-under-construction .page-under:after {
content: " "; display: table;
}
.page-under-construction .page-under .content {
display: inline-block; padding-left: 30px;
}
@media (max-width: 991px) {
.page-under-construction .page-under .content>form>a {
padding: 10px;
line-height: 24px;
}
.page-under-construction .page-under .content>h1 {
font-size: 25px;
}
}
.page-under-construction .page-under .content form {
position: relative; padding-bottom: 35px; max-width: 426px;
}
.page-under-construction .page-under .content form a {
position: absolute; right: 0;
}
.page-under-construction .page-under .content form input {
width: 100%; border: 1px solid #dddddd;
}
.page-under-construction .page-under .content h1 {
font-family: 'Playfair Display', serif;
}
.page-under-construction .page-under .content h4 {
font-style: italic; font-family: 'Playfair Display', serif;
}
.page-under-construction .page-under .image {
display: inline-block; float: right;
}
@media (max-width: 991px) {
.page-under-construction .page-under .image {
padding-bottom: 70px;
}
}
.page-under-construction .page-under .image img {
width: 100%;
}
.page-under-construction .page-under .social-01 a {
height: 30px; width: 30px; border-radius: 50%; background-color: #999999; text-align: center; font-size: 15px;
}
.page-under-construction .page-under .social-01 a:hover {
background-color: #30B397;
}
.page-under-construction .page-under .social-01 a i {
line-height: 30px;
}
.page-under-construction .page-under .social-01 a i:before {
color: #ffffff;
}
.page-under-construction .page-under .social-01 li {
padding: 0 4px;
}
.page-under-construction .footer-foot {
background-color: #ffffff; border-top: 1px solid #eeeeee; border-bottom: 1px solid #eeeeee;
}
/* Page Login */
.page-login-wrapper .page-login {
text-align: center;
}
.page-login-wrapper .page-login .back-to-home {
color: #ffffff;
}
.page-login-wrapper .page-login .back-to-home:after {
border-color: #ffffff;
}
.page-login-wrapper .page-login .button {
display: block; margin-bottom: 0; padding-bottom: 0;
}
.page-login-wrapper .page-login .button:nth-of-type(4) {
position: relative; margin-bottom: 30px; padding-bottom: 30px; border-bottom: 1px solid #cccccc;
}
.page-login-wrapper .page-login .button:nth-of-type(4):after {
position: absolute; bottom: -20px; left: 50%; display: block; padding: 5px; background-color: #ffffff; content: "OR"; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%);
}
.page-login-wrapper .page-login .button a {
width: 100%;
}
.page-login-wrapper .page-login .remember {
margin-bottom: 25px; text-align: right;
}
.page-login-wrapper .page-login .remember .checkbox {
display: inline-block;
}
.page-login-wrapper .page-login .remember .checkbox [type=checkbox]:checked+span {
position: relative;
}
.page-login-wrapper .page-login .remember .checkbox [type=checkbox]:checked+span:after {
color: #30B397; font-family: "wolverine"; position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; content: "W"; line-height: 14px;
}
.page-login-wrapper .page-login .remember .checkbox input {
display: none;
}
.page-login-wrapper .page-login .remember .checkbox span {
display: inline-block; width: 15px; height: 15px; border: 1px solid #dddddd; vertical-align: middle;
}
.page-login-wrapper .page-login .remember p {
display: inline-block; margin: 0; color: #777777;
}
.page-login-wrapper .page-login form {
background-color: #ffffff; position: relative; margin: 0 auto 75px auto; padding: 50px; max-width: 400px;
}
.page-login-wrapper .page-login form h3 {
margin-bottom: 0;
}
.page-login-wrapper .page-login form p {
margin-bottom: 30px; font-family: 'Playfair Display', serif;
}
.page-login-wrapper .page-login form .infor {
position: relative; float: right; margin-bottom: 20px; width: 100%;
}
.page-login-wrapper .page-login form .infor .icon {
color: #999999; position: absolute; top: 50%; left: 15px; z-index: 1; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);
}
.page-login-wrapper .page-login form .infor .icon i:before {
vertical-align: middle; font-size: 19px;
}
.page-login-wrapper .page-login form .infor input {
display: block; margin-bottom: 0; padding-left: 50px; width: 100%; border: 1px solid #dddddd; background: white;
}
.page-login-wrapper .page-login form a.forgotpass {
color: #ffffff; position: absolute; top: 100%; left: 0;
}
.page-login-wrapper .page-login form p {
color: #30B397;
}
.page-login-wrapper .footer-foot {
background-color: #f4f4f4;
}
/* REGSITER */
.page-rigsiter-wrapper .footer-foot {
background-color: #f4f4f4;
}
.page-rigsiter form {
background-color: #ffffff; position: relative; margin: 0 auto; padding: 50px; max-width: 570px;
}
.page-rigsiter form .button {
text-align: center;
}
.page-rigsiter form .name {
position: relative;
}
.page-rigsiter form .name:after {
clear: both;
}
.page-rigsiter form .name:before, .page-rigsiter form .name:after {
content: " "; display: table;
}
.page-rigsiter form .name:after {
clear: both;
}
.page-rigsiter form .name:before, .page-rigsiter form .name:after {
content: " "; display: table;
}
.page-rigsiter form .name input {
float: left; display: block; width: -webkit-calc(50% - 15px); width: calc(50% - 15px);
}
.page-rigsiter form .name input:first-of-type {
margin-right: 30px;
}
.page-rigsiter form h3 {
margin-bottom: 50px; text-align: center;
}
.page-rigsiter form input {
margin-bottom: 20px; width: 100%; border-color: #dddddd;
}
.page-rigsiter form p {
font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em; margin-bottom: 5px; font-size: 11px;
}
.page-rigsiter form span {
font-style: italic; font-family: 'Playfair Display', serif; color: #999999; display: block; margin-bottom: 55px;
}
.page-rigsiter form span a {
color: #30B397; text-decoration: underline;
}
/* Page Under Construction */
.page-under-construction-2-wrapper .parallax-bg {
background-attachment: fixed; background-position: 50% 0; background-repeat: repeat-x; background-size: cover; position: absolute; z-index: -1; left: 0; top: 0; height: 100%; width: 100%;
}
.page-under-construction-2-wrapper .parallax-bg:after {
background-color: transparent; content: ""; display: block; position: absolute; z-index: 0; left: 0; top: 0; height: 100%; width: 100%;
}
.page-under-construction-2-wrapper .parallax-bg:after {
background-color: transparent; content: ""; display: block; position: absolute; z-index: 0; left: 0; top: 0; height: 100%; width: 100%;
}
.page-under-construction-2 {
padding: 150px 0 100px; width: 100%;
}
.page-under-construction-2 .clock-canvas {
height: 0; border-radius: 50%;
}
.page-under-construction-2 .clock-canvas:before {
position: absolute; display: block; width: 100%; height: 100%; border: 6px solid rgba(255, 255, 255, 0.5); border-radius: 50%; content: " ";
}
.page-under-construction-2 .clock-item {
position: relative; display: inline-block; margin-right: 30px; width: 150px; height: 150px;
}
.page-under-construction-2 .text {
position: absolute; top: 50%; width: 100%; color: #ffffff; text-align: center; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);
}
.page-under-construction-2 .text .type-time {
margin: 0; font-weight: 600;
}
.page-under-construction-2 .text .val {
font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em; margin-bottom: 0; font-size: 55px; line-height: 55px;
}
.page-under-construction-2 h1 {
margin: 0;
}
.page-under-construction-2 h1, .page-under-construction-2 h4, .page-under-construction-2 h1:before {
color: #ffffff;
}
.page-under-construction-2 h4 {
margin: 30px 0 55px;
}
.subcribe {
background-color: #f4f4f4; padding: 80px 0;
}
.subcribe p {
margin-bottom: 40px;
}
.subcribe h4.heading-icon-1 {
margin-bottom: 10px;
}
.subcribe .social-03 {
line-height: 1; text-align: center;
}
.subcribe .social-03 li {
display: inline-block;
}
.subcribe .social-03 li a {
display: inline-block; color: #30B397;
}
.subcribe .social-03 li a i:before {
font-size: 13px; margin-right: 10px; vertical-align: middle; font-family: FontAwesome;
}
.subcribe .social-03 li a i {
color: #999999; font-size: 13px;
}
.subcribe .social-03 li:last-of-type {
border-right: none;
}
.subcribe .social-03 li {
padding: 0 10px; border-right: 1px solid #dddddd;
}
.subcribe form {
position: relative; top: 0; right: 0; margin: 0 auto; padding-bottom: 35px; max-width: 426px; text-align: center;
}
.subcribe form a {
position: absolute; right: 0; height: 44px;
}
.subcribe form input {
width: 100%; border: 1px solid #dddddd;
}
/* Undercontruction 3 */
.underconstruction-3-header {
padding-top: 30px; padding-bottom: 40px;
}
.underconstruction-3-header img {
height: 50px;
}
.underconstruction-3-hr {
border-top: 1px solid rgba(221, 221, 221, 0.2);
}
.page-under-construction-3 {
padding-top: 90px;
}
.page-under-construction-3 .underconstruction-container h1, .page-under-construction-3 .underconstruction-container h4 {
font-style: italic; font-family: 'Playfair Display', serif;
}
.page-under-construction-3 .underconstruction-container h4 {
margin-bottom: 15px;
}
.page-under-construction-3 .underconstruction-container h1 {
font-style: normal; margin-bottom: 60px;
}
.page-under-construction-3 .clock-canvas {
height: 0; border-radius: 50%;
}
.page-under-construction-3 .clock-canvas:before {
position: absolute; display: block; width: 100%; height: 100%; border: 6px solid rgba(255, 255, 255, 0.5); border-radius: 50%; content: " ";
}
.page-under-construction-3 .clock-item {
position: relative; display: inline-block; margin-right: 30px; width: 150px; height: 150px;
}
.page-under-construction-3 .countdown {
text-align: center; margin-bottom: 90px;
}
.page-under-construction-3 .subcribe {
padding: 80px 0; background-color: transparent;
}
.page-under-construction-3 .subcribe .social-03 {
line-height: 1; text-align: center;
}
.page-under-construction-3 .subcribe .social-03 li {
display: inline-block;
}
.page-under-construction-3 .subcribe .social-03 li a {
display: inline-block; color: #dddddd;
}
.page-under-construction-3 .subcribe .social-03 li a i:before {
font-size: 13px; margin-right: 10px; vertical-align: middle; font-family: FontAwesome;
}
.page-under-construction-3 .subcribe .social-03 li a i {
color: #dddddd; font-size: 13px;
}
.page-under-construction-3 .subcribe .social-03 li:last-of-type {
border-right: none;
}
.page-under-construction-3 .subcribe .social-03 li {
padding: 0 10px; border-right: 1px solid #dddddd;
}
.page-under-construction-3 .subcribe form {
position: relative; top: 0; right: 0; margin: 0 auto; padding-bottom: 35px; max-width: 426px; text-align: center;
}
.page-under-construction-3 .subcribe form a {
position: absolute; right: 0; height: 44px;
}
.page-under-construction-3 .subcribe form input {
width: 100%; border: 1px solid #dddddd; background-color: rgba(255, 255, 255, 0.8);
}
.page-under-construction-3 .subcribe p, .page-under-construction-3 .subcribe h4, .page-under-construction-3 .subcribe h4:before {
color: #ffffff;
}
.page-under-construction-3 .text {
position: absolute; top: 58%; width: 100%; color: #ffffff; text-align: center; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);
}
.page-under-construction-3 .text .type-time {
margin-top: 20px; margin-bottom: 0; font-family: 'Playfair Display', serif;
}
.page-under-construction-3 .text .val {
margin-bottom: 0; font-size: 55px; line-height: 15px; font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em;
}
.page-under-construction-3 .wrapper {
position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(85, 85, 85, 0.5);
}
.page-under-construction-3 h1, .page-under-construction-3 h4, .page-under-construction-3 h1:before {
color: #ffffff;
}
.page-under-construction-3 h4 {
margin: 0;
}
/* Footer */
footer:after {
clear: both;
}
footer:before, footer:after {
content: " "; display: table;
}
footer:after {
clear: both;
}
footer:before, footer:after {
content: " "; display: table;
}
.footer-quote .content {
padding-top: 50px; margin-bottom: 15px;
}
.footer-quote .content a {
color: #30B397;
}
.footer-quote .icon {
display: inline-block; width: 100%;
}
.footer-quote .icon .social-02 {
display: inline-block; padding-left: 15px;
}
.footer-quote .icon .social-02 a:hover i:before {
color: #30B397;
}
.footer-quote .icon .social-02 li {
padding-right: 15px;
}
.footer-quote .icon p {
color: #30B397; font-style: italic; font-family: 'Playfair Display', serif; display: inline-block; float: left; margin: 0;
}
.footer-quote-01 .content {
border-bottom: 1px solid #dddddd; padding-bottom: 25px;
}
.footer-quote-01 .content a {
text-align: center; font-weight: 800; font-size: 10px;
}
.footer-quote-01 .content a:before {
background-color: #30B397; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; font-family: "wolverine"; display: inline-block; margin-right: 10px; border-radius: 50%; height: 20px; width: 20px; color: #ffffff; content: "\e07f"; vertical-align: middle; font-weight: 400; font-size: 18px; line-height: 1;
}
.footer-quote-02 .content {
border-bottom: 1px solid #555555;
}
.footer-quote-02 .content a {
font-style: italic; font-family: 'Playfair Display', serif; display: inline-block;
}
.footer-quote-02 .content a:first-of-type {
color: #dddddd;
}
.footer-quote-02 .content a:last-of-type {
float: right;
}
.footer-quote-03 .content {
border-bottom: 1px solid #cccccc;
}
.footer-quote-03 .content a {
font-style: italic; font-family: 'Playfair Display', serif; display: inline-block;
}
.footer-quote-03 .content a:first-of-type {
color: #999999;
}
.footer-quote-03 .content a:last-of-type {
float: right;
}
.footer-preset-wrapper {
padding-top: 80px; padding-bottom: 50px; border-bottom-width: 1px; border-bottom-style: solid;
}
.footer-preset-wrapper:after {
clear: both;
}
.footer-preset-wrapper:before, .footer-preset-wrapper:after {
content: " "; display: table;
}
.footer-preset-wrapper:after {
clear: both;
}
.footer-preset-wrapper:before, .footer-preset-wrapper:after {
content: " "; display: table;
}
.footer-preset-wrapper h5 {
margin-bottom: 0; padding-bottom: 50px;
}
.footer-preset-02 {
background-color: #f4f4f4;
}
.footer-preset-02 .footer-preset-wrapper {
border-color: #dddddd;
}
.footer-preset-03 {
background-color: #333333;
}
.footer-preset-03 .footer-foot {
background-color: transparent;
}
.footer-preset-03 .footer-preset-wrapper {
border-color: #555555;
}
.footer-preset-03 .footer-preset-wrapper h5 {
color: #ffffff;
}
.footer-preset-03 p {
color: #999999;
}
.footer-preset-04 {
padding: 30px 0; text-align: center; border-top: 1px solid #dddddd; border-bottom: 1px solid #dddddd;
}
.footer-preset-04 h1 {
letter-spacing: 3px; font-family: 'Playfair Display', serif;
}
/*.footer-preset-04 .social-04 {
padding-bottom: 50px;
}
- /
.footer-preset-04 .social-04 a {
margin-right: 12px; margin-left: 12px;
}
.footer-preset-04 .social-04 a:hover {
color: #999999;
}
.footer-preset-04 p {
color: #999999; margin-bottom: 0px;
}
.footer-preset-05 .footer-preset-wrapper {
border-color: #dddddd;
}
.footer-preset-05 .footer-foot {
background-color: #ffffff; border-bottom-color: #dddddd;
}
.footer-preset-06 {
background-color: #f4f4f4;
}
.footer-preset-06 .footer-preset-wrapper {
border-color: #dddddd;
}
.footer-foot {
padding: 20px 0; background-color: #f4f4f4; border-style: solid; border-width: 1px; border-color: transparent;
}
.footer-foot p {
font-size: 11px; font-weight: 500; margin: 0; font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em;
}
.footer-foot-border {
padding: 20px 0; border-top: 1px solid #999999; border: 1px solid #dddddd; font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em; background-color: #f4f4f4;
}
.footer-foot-border p {
font-size: 11px; font-weight: 500; margin: 0;
}
.sticky-button {
position: fixed; bottom: 0px; z-index: 1450;
}
.purchase-bottom {
right: 80px; position: fixed; bottom: 0px; z-index: 1450;
}
.referrals-bottom {
right: 20px; position: fixed; bottom: 0px; z-index: 1450;
}
/* Shop Slider */
.shop-gallery-carousel {
margin-bottom: 75px;
}
.shop-gallery-carousel .shop-product-item .image {
position: relative; max-width: 170px; margin-right: auto; margin-left: auto; background-color: #ffffff;
}
.shop-gallery-carousel .shop-product-item .image .overlay {
opacity: 0; text-align: center; background-color: rgba(255, 255, 255, 0.5); z-index: 512; position: absolute; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; left: 0; top: 0; height: 100%; width: 100%;
}
.shop-gallery-carousel .shop-product-item .image .overlay ul {
display: block; position: absolute; height: 44px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; width: 100%;
}
.shop-gallery-carousel .shop-product-item .image .overlay ul:after {
clear: both;
}
.shop-gallery-carousel .shop-product-item .image .overlay ul:before, .shop-gallery-carousel .shop-product-item .image .overlay ul:after {
content: " "; display: table;
}
.shop-gallery-carousel .shop-product-item .image .overlay ul:after {
clear: both;
}
.shop-gallery-carousel .shop-product-item .image .overlay ul:before, .shop-gallery-carousel .shop-product-item .image .overlay ul:after {
content: " "; display: table;
}
.shop-gallery-carousel .shop-product-item .image .overlay ul li {
display: inline-block; line-height: 0;
}
.shop-gallery-carousel .shop-product-item .image .overlay ul li>a {
color: #ffffff; width: 44px; height: 44px; line-height: 44px; display: inline-block; position: relative; border-radius: 50%; background-color: #333333;
}
.shop-gallery-carousel .shop-product-item .image .overlay ul li>a i {
position: absolute; bottom: 0; left: 0; right: 0; top: 0; margin: auto; display: block; line-height: 1; width: 16px; height: 16px; font-size: 16px;
}
.shop-gallery-carousel .shop-product-item .image .overlay ul li>a:hover {
background-color: #30B397;
}
.shop-gallery-carousel .shop-product-item .image:hover .overlay {
opacity: 1;
}
.shop-gallery-carousel .shop-product-item .image img {
width: 170px; display: block; margin-right: auto; margin-left: auto;
}
.shop-gallery-carousel .shop-product-item .name {
margin-top: 5px;
}
.shop-gallery-carousel .shop-product-item .name a {
display: inline-block; max-width: 170px;
}
.shop-gallery-carousel .shop-product-item .name a:hover {
color: #30B397;
}
.shop-gallery-carousel.caro .shop-product-item:nth-of-type(2n) .image {
background-color: #EBEBEB;
}
.shop-gallery-carousel .slick-next {
right: -30px;
}
.shop-gallery-carousel .slick-next:before {
content: "\e07e";
}
.shop-gallery-carousel .slick-prev {
left: -30px;
}
.shop-gallery-carousel .slick-prev:before {
content: "\e031";
}
.shop-gallery-carousel .slick-prev, .shop-gallery-carousel .slick-next {
height: 25px; top: 85px; width: 25px;
}
.shop-gallery-carousel .slick-prev:before, .shop-gallery-carousel .slick-next:before {
font-size: 25px; color: #999999; font-family: "wolverine";
}
.shop-gallery-carousel .slick-prev:hover:before, .shop-gallery-carousel .slick-next:hover:before {
color: #333333;
}
@media (max-width: 1300px) {
.shop-gallery-carousel .slick-next {
right: 50%;
-webkit-transform: translateX(36px);
-ms-transform: translateX(36px);
transform: translateX(36px);
}
.shop-gallery-carousel .slick-next:before {
content: "\e07f";
}
.shop-gallery-carousel .slick-prev {
left: 50%;
-webkit-transform: translateX(-36px);
-ms-transform: translateX(-36px);
transform: translateX(-36px);
}
.shop-gallery-carousel .slick-prev:before {
content: "\e032";
}
.shop-gallery-carousel .slick-prev,
.shop-gallery-carousel .slick-next {
bottom: -35px;
margin-top: 0;
top: auto;
}
}
/* Shop */
.shop-product-1 {
max-width: 370px; margin-right: auto; margin-left: auto; margin-bottom: 70px;
}
.shop-product-1 .image {
display: inline-block; position: relative; margin-bottom: 18px;
}
.shop-product-1 .image img {
width: 100%;
}
.shop-product-1 .image .overlay {
opacity: 0; text-align: center; background-color: rgba(119, 119, 119, 0.5); z-index: 512; position: absolute; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; left: 0; top: 0; height: 100%; width: 100%;
}
.shop-product-1 .image .overlay ul {
display: block; position: absolute; height: 44px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; width: 100%;
}
.shop-product-1 .image .overlay ul:after {
clear: both;
}
.shop-product-1 .image .overlay ul:before, .shop-product-1 .image .overlay ul:after {
content: " "; display: table;
}
.shop-product-1 .image .overlay ul:after {
clear: both;
}
.shop-product-1 .image .overlay ul:before, .shop-product-1 .image .overlay ul:after {
content: " "; display: table;
}
.shop-product-1 .image .overlay ul li {
display: inline-block; line-height: 0;
}
.shop-product-1 .image .overlay ul li>a {
color: #ffffff; width: 44px; height: 44px; line-height: 44px; display: inline-block; position: relative; border-radius: 50%; background-color: #333333;
}
.shop-product-1 .image .overlay ul li>a i {
position: absolute; bottom: 0; left: 0; right: 0; top: 0; margin: auto; display: block; line-height: 1; width: 16px; height: 16px; font-size: 16px;
}
.shop-product-1 .image .overlay ul li>a:hover {
background-color: #30B397;
}
.shop-product-1 .image:hover .overlay {
opacity: 1;
}
.shop-product-1 .info {
padding-right: 50px; position: relative;
}
.shop-product-1 .info a.name {
width: 100%; color: #777777; display: inline-block; font-weight: 600; margin: 0;
}
.shop-product-1 .info a.name:hover {
color: #30B397;
}
.shop-product-1 .info a.add-to-cart {
position: absolute; top: 0; right: 0px; margin-right: 20px; line-height: 20px;
}
.shop-product-1 .info a.add-to-cart:before {
content: "\e064"; display: block; font-size: 13px; position: absolute; right: 100%; color: #30B397; font-family: "wolverine";
}
.shop-product-1 .info a.add-to-cart i {
font-size: 20px; line-height: 1; height: 20px; display: inline-block;
}
.shop-product-1 .info a.add-to-cart i:before {
display: inline-block;
}
.shop-product-1 .info a.add-to-cart:hover {
color: #30B397;
}
.shop-product-1 .info .price {
width: 100%;
}
.shop-product-1 .info .price * {
font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em;
}
.shop-product-1 .info .price del {
margin-right: 20px; color: #999999;
}
.shop-product-1 .info .price del+span {
color: #30B397;
}
.shop-product-1.next-page .fixed-ratio-1-1 {
-webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;
}
.shop-product-1.next-page .fixed-ratio-1-1 h5 {
display: block; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; margin-bottom: 10px;
}
.shop-product-1.next-page .fixed-ratio-1-1 i {
display: block; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; color: #333333; line-height: 1;
}
.shop-product-1.next-page .fixed-ratio-1-1:hover {
background-color: #999999;
}
.shop-product-1.next-page .fixed-ratio-1-1:hover i, .shop-product-1.next-page .fixed-ratio-1-1:hover h5 {
color: #ffffff;
}
.product-listing-2 {
float: left;
}
.product-listing-2.caro .shop-product-2-wrapper:nth-of-type(2n+1) .shop-product-2 .image {
background-color: #ffffff;
}
.product-listing-2.caro .shop-product-2-wrapper:nth-of-type(2n+1) .shop-product-2 .info {
background-color: #f4f4f4;
}
.shop-product-2 {
text-align: center; margin-left: auto; margin-right: auto; max-width: 320px;
}
.shop-product-2:hover .overlay {
opacity: 1;
}
.shop-product-2 .image {
background-color: #EBEBEB; display: inline-block; width: 100%; position: relative;
}
.shop-product-2 .image .saleoff {
margin: 10px 15px 0 0; position: absolute; right: 0; font-size: 14px; top: 0; font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em; z-index: 514; color: #30B397;
}
.shop-product-2 .image img {
width: 100%;
}
.shop-product-2 .image .overlay {
opacity: 0; text-align: center; background-color: rgba(255, 255, 255, 0.5); z-index: 512; position: absolute; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; left: 0; top: 0; height: 100%; width: 100%;
}
.shop-product-2 .image ul {
display: block; position: absolute; height: 44px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; width: 100%;
}
.shop-product-2 .image ul:after {
clear: both;
}
.shop-product-2 .image ul:before, .shop-product-2 .image ul:after {
content: " "; display: table;
}
.shop-product-2 .image ul:after {
clear: both;
}
.shop-product-2 .image ul:before, .shop-product-2 .image ul:after {
content: " "; display: table;
}
.shop-product-2 .image ul li {
display: inline-block;
}
.shop-product-2 .image ul li>a {
color: #ffffff; width: 44px; height: 44px; line-height: 44px; display: inline-block; position: relative; border-radius: 50%; margin-left: 8px; margin-right: 8px;
}
.shop-product-2 .image ul li>a i {
position: absolute; bottom: 0; left: 0; right: 0; top: 0; margin: auto; display: block; line-height: 1;
}
.shop-product-2 .image a.add-to-cart {
background-color: #30B397; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px);
}
.shop-product-2 .image a.add-to-cart i {
width: 24px; height: 24px; font-size: 24px;
}
.shop-product-2 .image a.add-to-cart:hover {
color: #ffffff; background-color: #333333;
}
.shop-product-2 .image a.quick-view {
background-color: #333333; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px);
}
.shop-product-2 .image a.quick-view i {
width: 16px; height: 16px; font-size: 16px;
}
.shop-product-2 .image a.quick-view:hover {
background-color: #30B397;
}
.shop-product-2 .image:hover .overlay {
opacity: 1;
}
.shop-product-2 .image:hover a.add-to-cart {
-webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0);
}
.shop-product-2 .image:hover a.quick-view {
-webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0);
}
.shop-product-2 .info {
padding: 30px 0;
}
.shop-product-2 .info>a {
color: #777777; display: inline-block; margin: 0;
}
.shop-product-2 .info>a:hover {
color: #30B397;
}
.shop-product-2 .info .price {
line-height: 1.6;
}
.shop-product-2 .info .price del, .shop-product-2 .info .price span {
font-style: italic; font-family: 'Playfair Display', serif; font-size: 16px;
}
.shop-product-2 .info .price del {
margin-right: 20px; color: #999999;
}
.shop-product-2 .info .price span {
color: #30B397; font-style: italic; font-family: 'Playfair Display', serif;
}
.shop-product-2 .info .star-ratings[data-rating="0"] {
visibility: hidden;
}
.shop-product-2 .info .star-ratings span {
font-size: 18px;
}
/* Shop Homepage */
.shop-homepage-other-links {
text-align: center;
}
.shop-homepage-other-links .border-btn, .shop-homepage-other-links .normal-btn {
padding-left: 15px; padding-right: 15px; max-width: 270px; width: 100%;
}
.shop-homepage-other-links .border-btn {
margin-right: 30px;
}
.shop-homepage-other-links br {
display: none;
}
@media (max-width: 767px) {
.shop-homepage-other-links br {
display: block;
}
.shop-homepage-other-links .border-btn {
margin-right: 0;
margin-bottom: 30px;
}
}
.shop-homepage-1-category-links-wrapper {
font-size: 0;
}
.shop-homepage-1-category-links {
padding-top: 10px; padding-bottom: 10px; border-bottom: 1px solid #dddddd; display: inline-block;
}
.shop-homepage-1-category-links:after {
clear: both;
}
.shop-homepage-1-category-links:before, .shop-homepage-1-category-links:after {
content: " "; display: table;
}
.shop-homepage-1-category-links:after {
clear: both;
}
.shop-homepage-1-category-links:before, .shop-homepage-1-category-links:after {
content: " "; display: table;
}
.shop-homepage-1-category-links>a {
font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em; font-size: 12px; display: inline-block; margin-right: 20px; margin-left: 20px;
}
.shop-homepage-1-category-links>a.active, .shop-homepage-1-category-links>a:hover {
color: #30B397;
}
.shop-homepage-banner-wrapper {
max-width: 370px; margin-left: auto; margin-right: auto; margin-bottom: 30px;
}
.shop-homepage-banner-wrapper .shop-homepage-banner {
position: relative;
}
.shop-homepage-banner-wrapper .shop-homepage-banner img {
width: 100%;
}
.shop-homepage-banner-wrapper .shop-homepage-banner .overlay {
background-color: rgba(255, 255, 255, 0.7); z-index: 512; position: absolute; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; left: 0; top: 0; height: 100%; width: 100%; opacity: 0;
}
.shop-homepage-banner-wrapper .shop-homepage-banner .overlay i {
font-size: 60px; color: #30B397; display: inline-block; height: 60px; line-height: 1;
}
.shop-homepage-banner-wrapper .shop-homepage-banner .overlay i:before {
display: inline-block; line-height: 1;
}
.shop-homepage-banner-wrapper .shop-homepage-banner .overlay h5 {
margin-bottom: 0;
}
.shop-homepage-banner-wrapper .shop-homepage-banner:hover .overlay {
opacity: 1;
}
@media (max-width: 767px) {
.shop-homepage-banner-wrapper-2:not(:last-of-type) {
margin-bottom: 30px;
}
}
.shop-homepage-banner-2 {
position: relative; background-position: 50% 0; background-repeat: no-repeat; background-size: cover; height: 195px; width: 100%;
}
.shop-homepage-banner-2 .overlay {
background-color: rgba(51, 51, 51, 0.7); z-index: 512; position: absolute; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; left: 0; top: 0; height: 100%; width: 100%; opacity: 0;
}
.shop-homepage-banner-2:hover .overlay {
opacity: 1;
}
.shop-side-cart-fixed {
position: fixed; z-index: 1450; top: 150px; right: 20px; height: 44px; width: 44px; background-color: #f4f4f4; text-align: center; line-height: 44px;
}
.shop-side-cart-fixed .shop-side-cart {
display: inline-block; position: relative; top: -4px; color: #999; line-height: 28px; vertical-align: middle; height: 30px;
}
.shop-side-cart-fixed .shop-side-cart:before {
width: 22px; height: 18px; text-align: center; position: absolute; display: block; line-height: 18px; top: 0px; left: 0px; content: attr(data-content); font-size: 11px; color: #30B397; font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em;
}
.shop-side-cart-fixed .shop-side-cart i {
font-size: 18px; display: inline-block; line-height: 18px; height: 18px; vertical-align: bottom;
}
@media (max-width: 991px) {
.shop-side-cart-fixed {
right: 0;
}
}
/* Product */
.product-image-slider .product-image-item .item-image img {
cursor: -webkit-zoom-in; cursor: zoom-in; display: block; width: 100%;
}
.product-image-slider .slick-dots {
padding-bottom: 20px; padding-top: 20px; right: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width: 50px;
}
.product-image-slider .slick-dots li {
cursor: pointer; display: block; height: 10px; margin-left: auto; margin-right: auto; padding: 0; width: 10px;
}
.product-image-slider .slick-dots li.slick-active button:before {
background-color: #999999;
}
.product-image-slider .slick-dots li:not(:last-of-type) {
margin-bottom: 15px;
}
.product-image-slider .slick-dots li button:before {
border: 1px solid #999999; border-radius: 50%; height: 100%; left: 0; position: absolute; top: 0; width: 100%; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;
}
.product-image-slider .slick-dots li button:hover:before {
background-color: #999999;
}
.product-thumbnail-slider .product-syn-slider-1 {
margin-bottom: 25px;
}
.product-thumbnail-slider .product-syn-slider-1 .product-slider-item .item-image img {
cursor: -webkit-zoom-in; cursor: zoom-in; display: block; width: 100%;
}
.product-thumbnail-slider .product-syn-slider-1 .slick-next {
right: 0; text-align: right;
}
.product-thumbnail-slider .product-syn-slider-1 .slick-next:before {
content: '\e2c4'; margin-right: 10px;
}
.product-thumbnail-slider .product-syn-slider-1 .slick-prev {
left: 0; text-align: left;
}
.product-thumbnail-slider .product-syn-slider-1 .slick-prev:before {
content: '\e2c5'; margin-left: 10px;
}
.product-thumbnail-slider .product-syn-slider-1 .slick-prev, .product-thumbnail-slider .product-syn-slider-1 .slick-next {
background-color: #555555; height: 70px; margin-top: -35px; opacity: 0; top: 50%; width: 40px; z-index: 10; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;
}
.product-thumbnail-slider .product-syn-slider-1 .slick-prev:before, .product-thumbnail-slider .product-syn-slider-1 .slick-next:before {
font-size: 15px; color: #ffffff; font-family: "wolverine";
}
.product-thumbnail-slider .product-syn-slider-1 .slick-prev:not(.slick-disabled):hover, .product-thumbnail-slider .product-syn-slider-1 .slick-next:not(.slick-disabled):hover {
background-color: #999999;
}
.product-thumbnail-slider .product-syn-slider-1:hover .slick-prev, .product-thumbnail-slider .product-syn-slider-1:hover .slick-next {
opacity: 1;
}
.product-thumbnail-slider .product-syn-slider-2-wrapper {
margin-right: -5px; margin-left: -5px;
}
.product-thumbnail-slider .product-syn-slider-2 {
width: 100%;
}
.product-thumbnail-slider .product-syn-slider-2 .product-slider-item.slick-current .layout-after:after {
background-color: rgba(51, 51, 51, 0.3);
}
.product-thumbnail-slider .product-syn-slider-2 .product-slider-item .item-image {
margin-left: 5px; margin-right: 5px; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;
}
.product-thumbnail-slider .product-syn-slider-2 .product-slider-item .item-image img {
display: block; margin-left: auto; margin-right: auto; width: 100%;
}
.product-thumbnail-slider .product-syn-slider-2 .product-slider-item .layout-after {
cursor: pointer;
}
.product-option>div {
margin-left: -15px; margin-right: -15px;
}
.product-option>div>div {
padding-left: 15px; padding-right: 15px; float: left; position: relative;
}
.product-option>div>div:after {
clear: both;
}
.product-option>div>div:before, .product-option>div>div:after {
content: " "; display: table;
}
.product-option>div>div:after {
clear: both;
}
.product-option>div>div:before, .product-option>div>div:after {
content: " "; display: table;
}
.product-option>div:nth-of-type(1) {
margin-bottom: 25px;
}
.product-option>div:nth-of-type(1) .colour {
width: 40%; max-width: 200px;
}
.product-option>div:nth-of-type(1) .colour>div {
float: left;
}
.product-option>div:nth-of-type(1) .colour>div:nth-of-type(1) {
width: 40%;
}
.product-option>div:nth-of-type(1) .colour>div:nth-of-type(1) p {
margin-bottom: 0;
}
.product-option>div:nth-of-type(1) .colour>div:nth-of-type(2) {
width: 60%; text-align: center;
}
.product-option>div:nth-of-type(1) .colour>div:nth-of-type(2) label {
cursor: pointer;
}
.product-option>div:nth-of-type(1) .colour>div:nth-of-type(2) label>span i.radio-button {
border: 1px solid #555555; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-left: 5px; margin-right: 5px; position: relative;
}
.product-option>div:nth-of-type(1) .colour>div:nth-of-type(2) label>span i.radio-button:after {
-webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; position: absolute; bottom: -5px; left: -1px; content: ""; width: 10px; height: 1px;
}
.product-option>div:nth-of-type(1) .colour>div:nth-of-type(2) label.color-option-1>span i.radio-button {
border-color: #30B397; background-color: #30B397;
}
.product-option>div:nth-of-type(1) .colour>div:nth-of-type(2) label.color-option-2>span i.radio-button {
border-color: #111; background-color: #111;
}
.product-option>div:nth-of-type(1) .colour>div:nth-of-type(2) label input[type="radio"] {
display: none;
}
.product-option>div:nth-of-type(1) .colour>div:nth-of-type(2) label input[type="radio"]:checked+span i.radio-button:after {
background-color: #999999;
}
.product-option>div:nth-of-type(1) .size {
width: 60%;
}
.product-option>div:nth-of-type(1) .size>div {
float: left;
}
.product-option>div:nth-of-type(1) .size>div:nth-of-type(1) {
margin-right: 15px;
}
.product-option>div:nth-of-type(1) .size>div:nth-of-type(1) p {
margin-bottom: 0;
}
.product-option>div:nth-of-type(1) .size>div:nth-of-type(2) select {
border: 0; font-weight: 700;
}
.product-option>div:nth-of-type(2) .quantity-wrapper {
width: 40%; padding-left: 15px; padding-right: 15px; max-width: 210px;
}
.product-option>div:nth-of-type(2) .quantity-wrapper .quantity {
padding: 6px 15px; width: 100%; border: 1px solid #dddddd;
}
.product-option>div:nth-of-type(2) .quantity-wrapper .quantity:after {
clear: both;
}
.product-option>div:nth-of-type(2) .quantity-wrapper .quantity:before, .product-option>div:nth-of-type(2) .quantity-wrapper .quantity:after {
content: " "; display: table;
}
.product-option>div:nth-of-type(2) .quantity-wrapper .quantity:after {
clear: both;
}
.product-option>div:nth-of-type(2) .quantity-wrapper .quantity:before, .product-option>div:nth-of-type(2) .quantity-wrapper .quantity:after {
content: " "; display: table;
}
.product-option>div:nth-of-type(2) .quantity-wrapper .quantity p {
width: 40%; margin-bottom: 0; float: left; line-height: 30px;
}
.product-option>div:nth-of-type(2) .quantity-wrapper .quantity input[type='number']::-webkit-inner-spin-button, .product-option>div:nth-of-type(2) .quantity-wrapper .quantity input[type='number']::-webkit-outer-spin-button {
opacity: 1;
}
.product-option>div:nth-of-type(2) .quantity-wrapper .quantity input[type='number'] {
display: inline-block; padding: 0; width: 60%; float: left; text-align: center; font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em; font-size: 14px; line-height: 2.2; border: 0;
}
.product-option>div:nth-of-type(2) .cart-button {
width: 60%;
}
.product-option>div:nth-of-type(2) .cart-button a.normal-btn {
width: 100%; max-width: 310px; padding: 0 15px; text-align: center; letter-spacing: 3px; line-height: 44px; font-size: 11px;
}
.product-option>div:nth-of-type(2) .cart-button a.normal-btn i {
font-size: 18px; line-height: 18px; display: inline-block; vertical-align: middle; margin-right: 10px;
}
.product-option>div:nth-of-type(2) .cart-button a.normal-btn i:before {
display: inline-block;
}
@media only screen and (min-width: 992px) {
.product-option>div:nth-of-type(2) .quantity-wrapper {
left: 60%;
}
.product-option>div:nth-of-type(2) .cart-button {
right: 40%;
}
}
@media (max-width: 991px) {
.product-option>div:nth-of-type(1) {
margin-bottom: 25px;
}
.product-option>div:nth-of-type(1) .colour {
width: 60%;
}
.product-option>div:nth-of-type(1) .size {
width: 40%;
}
.product-option>div:nth-of-type(2) .quantity-wrapper {
width: 100%;
margin-bottom: 30px;
}
.product-option>div:nth-of-type(2) .cart-button {
width: 100%;
}
}
.product-detail-others>p {
font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em; margin-bottom: 0;
}
.product-detail-others>p>a {
color: #30B397;
}
.product-detail-others>p>a:hover {
color: #999999;
}
.product-detail-1 h3 {
font-size: 24px; margin-bottom: 12px;
}
.product-detail-1 h1 {
font-family: 'Playfair Display', serif; margin-bottom: 10px;
}
.product-detail-1 .product-option {
margin-bottom: 30px;
}
.product-detail-2 h3 {
font-size: 24px; margin-bottom: 10px;
}
.product-detail-2 h1 {
font-family: 'Playfair Display', serif; margin-bottom: 16px;
}
.product-detail-2 .rating {
margin-bottom: 20px;
}
.product-detail-2 .rating .star-ratings {
float: left;
}
.product-detail-2 .rating>p {
margin-left: 11px; margin-bottom: 0; float: left;
}
.product-detail-2 .product-option {
margin-bottom: 25px;
}
@media (max-width: 991px) {
.product-detail-2 h3 {
font-size: 21px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1229px) {
.product-detail-2-wrapper .product-detail-2 h3 {
font-size: 21px;
}
.product-detail-2-wrapper .product-detail-2 .product-option>div:nth-of-type(2) .quantity-wrapper {
width: 100%;
margin-bottom: 30px;
left: auto;
}
.product-detail-2-wrapper .product-detail-2 .product-option>div:nth-of-type(2) .cart-button {
right: auto;
width: 100%;
}
}
@media only screen and (min-width: 1230px) {
.product-detail-2-wrapper .product-thumbnail-slider-wrapper {
width: 44.44444444%;
}
.product-detail-2-wrapper .product-detail-2 {
width: 55.55555556%;
}
}
@media (max-width: 767px) {
.product-detail-2-wrapper .product-thumbnail-slider-wrapper {
margin-bottom: 50px;
}
}
/* Shop detail */
.shop-detail-side-bar .category-product-wrapper {
margin-bottom: 35px;
}
.shop-detail-side-bar .category-product-wrapper h5 {
margin-bottom: 35px;
}
.shop-detail-side-bar .shop-recently-viewed {
margin-bottom: 55px;
}
.product-tags h5 {
margin-bottom: 40px;
}
.product-tags>a {
-webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; font-family: 'Montserrat', sans-serif; display: inline-block; padding: 9px 10px; margin-bottom: 10px; margin-right: 10px; line-height: 1; font-size: 10px; text-transform: uppercase; letter-spacing: 0.05em; border: 1px solid #ddd; color: inherit;
}
.product-tags>a:hover {
border-color: #30B397; color: #ffffff; background-color: #30B397;
}
.shop-detail-relate-item {
max-width: 270px; margin-right: auto; margin-left: auto; margin-bottom: 30px;
}
.shop-detail-relate-item .image {
display: inline-block; position: relative;
}
.shop-detail-relate-item .image img {
width: 100%;
}
.shop-detail-relate-item .image .overlay {
opacity: 0; text-align: center; background-color: rgba(255, 255, 255, 0.5); z-index: 512; position: absolute; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; left: 0; top: 0; height: 100%; width: 100%;
}
.shop-detail-relate-item .image .overlay ul {
display: block; position: absolute; height: 44px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; width: 100%;
}
.shop-detail-relate-item .image .overlay ul:after {
clear: both;
}
.shop-detail-relate-item .image .overlay ul:before, .shop-detail-relate-item .image .overlay ul:after {
content: " "; display: table;
}
.shop-detail-relate-item .image .overlay ul:after {
clear: both;
}
.shop-detail-relate-item .image .overlay ul:before, .shop-detail-relate-item .image .overlay ul:after {
content: " "; display: table;
}
.shop-detail-relate-item .image .overlay ul li {
display: inline-block; line-height: 0;
}
.shop-detail-relate-item .image .overlay ul li>a {
color: #ffffff; width: 44px; height: 44px; line-height: 44px; display: inline-block; position: relative; border-radius: 50%; background-color: #333333;
}
.shop-detail-relate-item .image .overlay ul li>a i {
position: absolute; bottom: 0; left: 0; right: 0; top: 0; margin: auto; display: block; line-height: 1; width: 16px; height: 16px; font-size: 16px;
}
.shop-detail-relate-item .image .overlay ul li>a:hover {
background-color: #30B397;
}
.shop-detail-relate-item .image:hover .overlay {
opacity: 1;
}
.shop-detail-orther-link {
text-align: center;
}
.shop-detail-orther-link br {
display: none;
}
.shop-detail-orther-link a.border-btn, .shop-detail-orther-link a.normal-btn {
width: 100%; max-width: 270px; padding-left: 15px; padding-right: 15px;
}
.shop-detail-orther-link a.border-btn {
margin-right: 30px;
}
@media (max-width: 767px) {
.shop-detail-orther-link br {
display: block;
}
.shop-detail-orther-link a.border-btn {
margin-right: 0px;
margin-bottom: 30px;
}
}
.shop-detail-1-page .product-image-slider-wrapper {
padding-top: 85px;
}
.shop-detail-1-page .product-detail-1 {
padding-top: 85px;
}
.shop-detail-1-page .shop-detail-orther-link {
padding-top: 75px; padding-bottom: 75px;
}
.shop-detail-1-page .shop-detail-relate {
padding-top: 40px;
}
.shop-detail-1-page .shop-detail-relate h5 {
margin-bottom: 55px;
}
.product-quick-view .modal-body {
padding: 30px;
}
.product-quick-view .modal-body .close {
position: absolute; width: 30px; height: 30px; top: 0; border: 0; right: 0; background-color: #30B397; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;
}
.product-quick-view .modal-body .close:before {
content: "\f00d"; cursor: pointer; font-size: 18px; height: 100%; line-height: 30px; position: absolute; right: 0px; text-align: center; color: #ffffff; top: 0px; width: 100%; font-family: FontAwesome;
}
.product-quick-view .modal-body .close:hover {
background-color: #333333;
}
.product-quick-view .modal-body .content {
margin-right: -15px; margin-left: -15px;
}
.product-quick-view .modal-body .content>div {
padding-left: 15px; padding-right: 15px; float: left;
}
.product-quick-view .modal-body .product-thumbnail-slider-wrapper {
width: 50%;
}
.product-quick-view .modal-body .product-detail-2 {
width: 50%;
}
.product-quick-view .product-thumbnail-slider .product-syn-slider-1 .product-slider-item .item-image img {
cursor: default;
}
@media (max-width: 650px) {
.product-quick-view .modal-body {
padding: 30px;
}
.product-quick-view .modal-body .product-thumbnail-slider-wrapper {
width: 100%;
}
.product-quick-view .modal-body .product-thumbnail-slider-wrapper .product-syn-slider-2-wrapper {
display: none;
}
.product-quick-view .modal-body .product-detail-2 {
width: 100%;
}
.product-quick-view .modal-body .product-detail-2 .product-option>div:nth-of-type(1) .colour {
width: 70%;
}
.product-quick-view .modal-body .product-detail-2 .product-option>div:nth-of-type(1) .size {
width: 50%;
}
}
/* Shop category */
.category-sorting {
padding: 10px 0;
}
.category-sorting>p {
float: left; margin-bottom: 0; line-height: 44px; margin-right: 30px;
}
.category-sorting select {
float: left; font-weight: 600; height: 44px; border: 1px solid #ddd; max-width: 100%; padding: 0 15px;
}
.shop-category-side-bar .category-product-wrapper {
margin-bottom: 50px;
}
.shop-category-side-bar .category-product-wrapper h5 {
margin-bottom: 40px;
}
.shop-category-side-bar .category-product-wrapper .widget.category-product {
margin-bottom: 0;
}
.shop-category-side-bar .price-filter {
margin-bottom: 75px;
}
.shop-category-page .pagination-2 {
padding-top: 25px; padding-bottom: 105px;
}
.shop-category-caro-page .pagination-2 {
padding-top: 70px; padding-bottom: 65px;
}
/* Shop Cart*/
.shop-cart-list {
width: 100%; margin-bottom: 60px;
}
.shop-cart-list table * {
font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em; font-size: 14px; color: #333333;
}
.shop-cart-list table thead th {
border-bottom: 2px solid #30B397; padding-top: 15px; padding-bottom: 15px;
}
.shop-cart-list table tbody .cart-item {
border-bottom: 1px solid #DDD;
}
.shop-cart-list table tbody .cart-item td.product-img {
padding-top: 25px; padding-bottom: 25px;
}
.shop-cart-list table tbody .cart-item td.product-img>a {
display: inline-block;
}
.shop-cart-list table tbody .cart-item td.product-img .image {
position: relative;
}
.shop-cart-list table tbody .cart-item td.product-img .image:after {
background-color: rgba(51, 51, 51, 0.5); content: ""; display: block; position: absolute; z-index: 512; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; left: 0; top: 0; height: 100%; width: 100%;
}
.shop-cart-list table tbody .cart-item td.product-img .image:after {
opacity: 0;
}
.shop-cart-list table tbody .cart-item td.product-img .image:hover:after {
opacity: 1;
}
.shop-cart-list table tbody .cart-item td.product-img .image img {
width: 100%;
}
.shop-cart-list table tbody .cart-item td.product-name>a:hover {
color: #30B397;
}
.shop-cart-list table tbody .cart-item td.product-remove>a:before {
content: "\e261"; font-family: "wolverine";
}
.shop-cart-list table tbody .cart-item td.product-remove>a:hover {
color: #30B397;
}
.shop-cart-list table tbody .cart-item td.product-quantity input[type='number']::-webkit-inner-spin-button, .shop-cart-list table tbody .cart-item td.product-quantity input[type='number']::-webkit-outer-spin-button {
opacity: 1;
}
.shop-cart-list table tbody .cart-item td.product-quantity input[type='number'] {
width: 60px; padding: 0; text-align: center; font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em; font-size: 14px; line-height: 2.2; border: 0;
}
.shop-cart-list table .product-img {
text-align: left; padding-right: 5px;
}
.shop-cart-list table .product-name {
text-align: left; padding-left: 5px; padding-right: 5px;
}
.shop-cart-list table .product-size {
text-align: center; width: 50px;
}
.shop-cart-list table .product-price {
text-align: center; padding-left: 5px; padding-right: 5px;
}
.shop-cart-list table .product-quantity {
text-align: center; width: 100px;
}
.shop-cart-list table .product-total {
text-align: center; padding-left: 5px; padding-right: 5px;
}
.shop-cart-list table .product-remove {
text-align: center; width: 30px;
}
@media only screen and (min-width: 992px) {
.shop-cart-list table {
width: 100%;
}
.shop-cart-list table tbody .cart-item td.product-img .image {
width: 100px;
}
.shop-cart-list .product-img {
width: 150px;
}
.shop-cart-list .product-price {
width: 150px;
}
.shop-cart-list .product-total {
width: 150px;
}
}
@media only screen and (min-width: 1230px) {
.shop-cart-list table tbody .cart-item td.product-img .image {
width: 120px;
}
.shop-cart-list .product-img {
width: 190px;
}
}
@media (max-width: 991px) {
.shop-cart-list {
overflow-x: auto;
}
.shop-cart-list table {
width: 720px;
}
.shop-cart-list table tbody .cart-item td.product-img .image {
width: 80px;
}
.shop-cart-list table .product-img {
width: 100px;
}
.shop-cart-list table .product-price {
width: 120px;
}
.shop-cart-list table .product-total {
width: 120px;
}
}
.shop-cart-coupon {
margin-bottom: 40px;
}
.shop-cart-coupon h5 {
margin-bottom: 20px;
}
.shop-cart-coupon p {
margin-bottom: 20px;
}
.shop-cart-coupon br {
display: none;
}
.shop-cart-coupon input {
max-width: 270px; width: 100%; margin-right: 30px;
}
@media (max-width: 550px) {
.shop-cart-coupon input {
margin-right: 0px;
margin-bottom: 30px;
}
.shop-cart-coupon br {
display: block;
}
}
.shop-cart-total span.price {
font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em; text-align: right;
}
.shop-cart-total h3.title {
margin-bottom: 40px; font-size: 24px; text-align: center;
}
.shop-cart-total .sub-total {
margin-bottom: 20px;
}
.shop-cart-total .sub-total:after {
clear: both;
}
.shop-cart-total .sub-total:before, .shop-cart-total .sub-total:after {
content: " "; display: table;
}
.shop-cart-total .sub-total:after {
clear: both;
}
.shop-cart-total .sub-total:before, .shop-cart-total .sub-total:after {
content: " "; display: table;
}
.shop-cart-total .sub-total * {
line-height: 30px;
}
.shop-cart-total .sub-total h5 {
display: block; float: left; margin-bottom: 0; width: 40%;
}
.shop-cart-total .sub-total span.price {
display: block; float: left; width: 60%; font-size: 14px;
}
.shop-cart-total .shipping {
border-bottom: 1px solid #DDD; padding-bottom: 18px;
}
.shop-cart-total .shipping:after {
clear: both;
}
.shop-cart-total .shipping:before, .shop-cart-total .shipping:after {
content: " "; display: table;
}
.shop-cart-total .shipping:after {
clear: both;
}
.shop-cart-total .shipping:before, .shop-cart-total .shipping:after {
content: " "; display: table;
}
.shop-cart-total .shipping * {
line-height: 30px;
}
.shop-cart-total .shipping span.price {
font-size: 14px;
}
.shop-cart-total .shipping h5 {
margin-bottom: 0;
}
.shop-cart-total .shipping .content label {
cursor: pointer; display: block; width: 100%; margin-bottom: 10px;
}
.shop-cart-total .shipping .content label input[type="radio"] {
display: none;
}
.shop-cart-total .shipping .content label input[type="radio"]+span i.radio-button {
-webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 10px; border: 1px solid #999999;
}
.shop-cart-total .shipping .content label input[type="radio"]:checked+span i.radio-button {
border: 3px solid #30B397;
}
.shop-cart-total .shipping .content label>span {
display: block; position: relative; padding-left: 20px;
}
.shop-cart-total .shipping .content label>span:after {
clear: both;
}
.shop-cart-total .shipping .content label>span:before, .shop-cart-total .shipping .content label>span:after {
content: " "; display: table;
}
.shop-cart-total .shipping .content label>span:after {
clear: both;
}
.shop-cart-total .shipping .content label>span:before, .shop-cart-total .shipping .content label>span:after {
content: " "; display: table;
}
.shop-cart-total .shipping .content label>span i.radio-button {
position: absolute; top: 0; bottom: 0; left: 0; margin-top: auto; margin-bottom: auto;
}
.shop-cart-total .shipping .content label>span span {
display: block; float: left;
}
.shop-cart-total .shipping .content label>span span.name {
width: 60%;
}
.shop-cart-total .shipping .content label>span span.price {
width: 40%;
}
.shop-cart-total .shipping .content>p {
margin-bottom: 0;
}
.shop-cart-total .total {
padding-top: 15px; padding-bottom: 15px; margin-bottom: 30px;
}
.shop-cart-total .total:after {
clear: both;
}
.shop-cart-total .total:before, .shop-cart-total .total:after {
content: " "; display: table;
}
.shop-cart-total .total:after {
clear: both;
}
.shop-cart-total .total:before, .shop-cart-total .total:after {
content: " "; display: table;
}
.shop-cart-total .total * {
line-height: 46px;
}
.shop-cart-total .total h4 {
display: block; float: left; margin-bottom: 0; width: 40%;
}
.shop-cart-total .total span.price {
display: block; float: left; width: 60%; font-size: 21px;
}
.shop-cart-total .button-wrapper {
text-align: center;
}
.shop-cart-total .button-wrapper a.border-btn {
letter-spacing: 3px; font-size: 11px;
}
@media only screen and (min-width: 768px) {
.shop-cart-total .shipping h5 {
float: left;
display: block;
width: 20%;
}
.shop-cart-total .shipping .content {
float: left;
width: 80%;
}
}
@media only screen and (min-width: 992px) {
.shop-cart-total h3.title {
text-align: right;
}
.shop-cart-total .shipping h5 {
width: 25%;
}
.shop-cart-total .shipping .content {
width: 75%;
}
.shop-cart-total .button-wrapper {
text-align: right;
}
}
@media (max-width: 767px) {
.shop-cart-total .button-wrapper a.border-btn {
padding-left: 50px;
padding-right: 50px;
}
}
form.cart-page-form {
padding-top: 55px; padding-bottom: 95px;
}
form.cart-page-form .list-button {
padding-top: 10px; margin-bottom: 60px;
}
form.cart-page-form .list-button a.normal-btn, form.cart-page-form .list-button a.border-btn {
font-size: 11px; letter-spacing: 3px;
}
form.cart-page-form .list-button a.normal-btn {
margin-right: 30px;
}
form.cart-page-form .list-button br {
display: none;
}
@media (max-width: 767px) {
form.cart-page-form .list-button {
text-align: center;
}
form.cart-page-form .list-button br {
display: block;
}
form.cart-page-form .list-button a.normal-btn,
form.cart-page-form .list-button a.border-btn {
padding-left: 30px;
padding-right: 30px;
width: 100%;
max-width: 300px;
}
form.cart-page-form .list-button a.normal-btn {
margin-right: 0px;
margin-bottom: 30px;
}
}
/* Check Out */
.checkout-page-form {
padding-top: 55px;
}
.checkout-account>h5 {
margin-bottom: 5px;
}
.checkout-account p {
font-weight: 600; color: #333333; font-size: 14px;
}
.checkout-account .log-in {
margin-bottom: 15px;
}
.checkout-account .log-in>a {
color: #30B397; font-weight: 600; margin-left: 10px;
}
.checkout-account .log-in>a:after {
font-family: "wolverine"; font-weight: 400; content: "\e07f"; vertical-align: middle; font-size: 20px; margin-left: 30px;
}
.checkout-account .log-in>a:hover {
color: #999999;
}
.checkout-account .sign-up p {
margin-bottom: 10px;
}
.checkout-account .sign-up .input-wrapper {
margin-left: -15px; margin-right: -15px;
}
.checkout-account .sign-up .input-wrapper:after {
clear: both;
}
.checkout-account .sign-up .input-wrapper:before, .checkout-account .sign-up .input-wrapper:after {
content: " "; display: table;
}
.checkout-account .sign-up .input-wrapper:after {
clear: both;
}
.checkout-account .sign-up .input-wrapper:before, .checkout-account .sign-up .input-wrapper:after {
content: " "; display: table;
}
.checkout-account .sign-up .input-wrapper>div {
padding-left: 15px; padding-right: 15px; width: 50%; float: left; margin-bottom: 25px;
}
.checkout-account .sign-up .input-wrapper input {
width: 100%;
}
.checkout-account .question {
margin-bottom: 45px;
}
.checkout-account .question p {
margin-bottom: 5px;
}
.checkout-account .question label {
cursor: pointer;
}
.checkout-account .question label input[type="radio"] {
display: none;
}
.checkout-account .question label input[type="radio"]+span i.radio-button {
-webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 10px; border: 1px solid #999999;
}
.checkout-account .question label input[type="radio"]:checked+span i.radio-button {
border: 3px solid #30B397;
}
.checkout-account .question label>span span {
margin-right: 10px;
}
@media (max-width: 767px) {
.checkout-account .sign-up .input-wrapper>div {
width: 100%;
float: left;
}
}
.checkout-shipping-address {
padding-top: 40px; padding-bottom: 25px;
}
.checkout-shipping-address h5 {
margin-bottom: 35px;
}
.checkout-shipping-address .content>div {
margin-bottom: 20px;
}
.checkout-shipping-address .content>div input {
width: 100%;
}
@media only screen and (min-width: 768px) {
.checkout-shipping-address .content>div:after {
clear: both;
}
.checkout-shipping-address .content>div:before,
.checkout-shipping-address .content>div:after {
content: " ";
display: table;
}
.checkout-shipping-address .content>div:after {
clear: both;
}
.checkout-shipping-address .content>div:before,
.checkout-shipping-address .content>div:after {
content: " ";
display: table;
}
.checkout-shipping-address .content>div>span,
.checkout-shipping-address .content>div input {
display: inline-block;
float: left;
}
.checkout-shipping-address .content>div>span {
width: 30%;
line-height: 44px;
padding-right: 15px;
}
.checkout-shipping-address .content>div input {
width: 70%;
}
}
@media only screen and (min-width: 992px) {
.checkout-shipping-address .content>div>span {
width: 35%;
}
.checkout-shipping-address .content>div input {
width: 65%;
}
}
@media only screen and (min-width: 1230px) {
.checkout-shipping-address .content>div>span {
padding-right: 20px;
padding-left: 20px;
}
}
.checkout-payment {
padding-bottom: 70px;
}
.checkout-payment:after {
clear: both;
}
.checkout-payment:before, .checkout-payment:after {
content: " "; display: table;
}
.checkout-payment:after {
clear: both;
}
.checkout-payment:before, .checkout-payment:after {
content: " "; display: table;
}
.checkout-payment label {
cursor: pointer;
}
.checkout-payment label input[type="radio"] {
display: none;
}
.checkout-payment label input[type="radio"]+span i.radio-button {
-webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; display: inline-block; width: 20px; height: 20px; line-height: 18px; vertical-align: middle; border-radius: 50%; margin-right: 15px; border: 1px solid #CCC; color: #ffffff;
}
.checkout-payment label input[type="radio"]:checked+span i.radio-button {
border: 1px solid #30B397; background-color: #30B397; text-align: center;
}
.checkout-payment label input[type="radio"]:checked+span i.radio-button:before {
content: "W"; font-family: "wolverine"; font-style: normal; font-size: 16px; line-height: 1;
}
.checkout-payment label span {
display: inline-block; line-height: 30px;
}
.checkout-payment .payment-credit-card .item-head:after {
clear: both;
}
.checkout-payment .payment-credit-card .item-head:before, .checkout-payment .payment-credit-card .item-head:after {
content: " "; display: table;
}
.checkout-payment .payment-credit-card .item-head:after {
clear: both;
}
.checkout-payment .payment-credit-card .item-head:before, .checkout-payment .payment-credit-card .item-head:after {
content: " "; display: table;
}
.checkout-payment .payment-credit-card .item-head label {
float: left;
}
.checkout-payment .payment-credit-card .item-head span.logo {
float: right; line-height: 30px; display: inline-block;
}
.checkout-payment .payment-credit-card .item-body {
background-color: #f4f4f4; padding: 20px 30px; margin-top: 20px; margin-bottom: 20px;
}
.checkout-payment .payment-credit-card .item-body>div:after {
clear: both;
}
.checkout-payment .payment-credit-card .item-body>div:before, .checkout-payment .payment-credit-card .item-body>div:after {
content: " "; display: table;
}
.checkout-payment .payment-credit-card .item-body>div:after {
clear: both;
}
.checkout-payment .payment-credit-card .item-body>div:before, .checkout-payment .payment-credit-card .item-body>div:after {
content: " "; display: table;
}
.checkout-payment .payment-credit-card .item-body>div>p {
display: inline-block; float: left; width: 25%; margin-bottom: 0;
}
.checkout-payment .payment-credit-card .item-body>div>p:after {
clear: both;
}
.checkout-payment .payment-credit-card .item-body>div>p:before, .checkout-payment .payment-credit-card .item-body>div>p:after {
content: " "; display: table;
}
.checkout-payment .payment-credit-card .item-body>div>p:after {
clear: both;
}
.checkout-payment .payment-credit-card .item-body>div>p:before, .checkout-payment .payment-credit-card .item-body>div>p:after {
content: " "; display: table;
}
.checkout-payment .payment-credit-card .item-body>div>p span {
clear: both; float: right;
}
.checkout-payment .payment-credit-card .item-body>div h5 {
margin-bottom: 0; float: left; width: 75%; padding-left: 120px;
}
.checkout-payment .payment-credit-card .item-body>div:not(:last-of-type) {
margin-bottom: 20px;
}
.checkout-payment .payment-paypal {
margin-bottom: 65px;
}
.checkout-payment .payment-paypal:after {
clear: both;
}
.checkout-payment .payment-paypal:before, .checkout-payment .payment-paypal:after {
content: " "; display: table;
}
.checkout-payment .payment-paypal:after {
clear: both;
}
.checkout-payment .payment-paypal:before, .checkout-payment .payment-paypal:after {
content: " "; display: table;
}
.checkout-payment .payment-paypal label {
float: left;
}
.checkout-payment .payment-paypal span.logo {
float: right; line-height: 30px; display: inline-block;
}
.checkout-payment .button-wrapper {
width: 100%;
}
.checkout-payment .button-wrapper>a.border-btn {
float: right;
}
@media (max-width: 991px) {
.checkout-payment .payment-credit-card .item-body>div>p {
width: 40%;
}
.checkout-payment .payment-credit-card .item-body>div h5 {
width: 60%;
padding-left: 0;
text-align: right;
}
.checkout-payment .button-wrapper {
text-align: center;
}
.checkout-payment .button-wrapper>a.border-btn {
float: none;
}
}
@media (max-width: 767px) {
.checkout-payment .payment-credit-card .item-head .ro-image img {
width: 100px;
}
.checkout-payment .payment-credit-card .item-body {
padding: 15px;
}
.checkout-payment .payment-credit-card .item-body>div>p {
width: 50%;
}
.checkout-payment .payment-credit-card .item-body>div h5 {
width: 50%;
}
.checkout-payment .payment-paypal label span img {
width: 80px;
}
.checkout-payment .payment-paypal .logo img {
width: 130px;
}
}
/* Shop Successfully */
.shop-successfully {
padding-top: 60px; padding-bottom: 165px;
}
.shop-successfully h3 {
font-size: 24px; margin-bottom: 30px;
}
.shop-successfully p:not(:last-of-type) {
margin-bottom: 0;
}
.shop-successfully p:last-of-type {
margin-bottom: 35px;
}
.shop-successfully p.infor span {
font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em; font-size: 14px; color: #333333;
}
@media (max-width: 767px) {
.shop-successfully h3 {
font-size: 18px;
margin-bottom: 20px;
}
}
/* Quote */
.quote-slider-01 .quote-item .item-content {
padding: 0 15px;
}
.quote-slider-01 .quote-item .item-content .heading-icon-2 {
-webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;
}
.quote-slider-01 .quote-item .item-content .heading-icon-2:after {
color: #ffffff; content: "\e2d1"; display: block; font-size: 68px; font-weight: 400; line-height: 1; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; font-family: "wolverine";
}
.quote-slider-01 .quote-item .item-content .heading-icon-2:after {
font-style: normal; margin-top: 10px;
}
.quote-slider-01 .quote-item .item-content p {
font-size: 28px; margin-bottom: 0; font-style: italic; font-family: 'Playfair Display', serif;
}
@media (max-width: 767px) {
.quote-slider-01 .quote-item .item-content p {
font-size: 16px;
}
}
.quote-slider-02 {
margin-bottom: -15px;
}
.quote-slider-02:after {
clear: both;
}
.quote-slider-02:before, .quote-slider-02:after {
content: " "; display: table;
}
.quote-slider-02:after {
clear: both;
}
.quote-slider-02:before, .quote-slider-02:after {
content: " "; display: table;
}
.quote-slider-02.color-light .quote-item .item-content .name p {
color: #ffffff;
}
.quote-slider-02.color-light .quote-item .item-content .name p:before, .quote-slider-02.color-light .quote-item .item-content .name p:after {
border-color: #ffffff;
}
.quote-slider-02.color-light .quote-item .item-icon i {
border-color: #ffffff;
}
.quote-slider-02.color-light .quote-item .item-icon i:before {
color: #ffffff;
}
.quote-slider-02 .quote-item .item-content {
padding-left: 15px; padding-right: 15px;
}
.quote-slider-02 .quote-item .item-content .comment {
font-size: 18px;
}
.quote-slider-02 .quote-item .item-content .name p {
display: inline-block; font-size: 21px; color: #30B397;
}
.quote-slider-02 .quote-item .item-content .name p:after {
margin-left: 10px;
}
.quote-slider-02 .quote-item .item-content .name p:before {
margin-right: 10px;
}
.quote-slider-02 .quote-item .item-content .name p:before, .quote-slider-02 .quote-item .item-content .name p:after {
border: 1px solid #30B397; content: ""; display: inline-block; width: 50px;
}
.quote-slider-02 .quote-item .item-content p {
margin-bottom: 0; font-style: italic; font-family: 'Playfair Display', serif;
}
.quote-slider-02 .quote-item .item-icon {
height: 150px; margin-left: auto; margin-right: auto; width: 150px;
}
.quote-slider-02 .quote-item .item-icon i {
border: 4px solid #555555; display: block; line-height: 142px; text-align: center; height: 100%; width: 100%;
}
.quote-slider-02 .quote-item .item-icon i:before {
font-size: 94px; vertical-align: middle; color: #555555;
}
.quote-slider-02 .slick-next {
right: -85px;
}
.quote-slider-02 .slick-next:before {
content: "\e07f";
}
.quote-slider-02 .slick-prev {
left: -85px;
}
.quote-slider-02 .slick-prev:before {
content: "\e032";
}
.quote-slider-02 .slick-prev, .quote-slider-02 .slick-next {
height: 25px; margin-top: -12px; top: 50%; width: 25px;
}
.quote-slider-02 .slick-prev:before, .quote-slider-02 .slick-next:before {
font-size: 25px; color: #999999; font-family: "wolverine";
}
.quote-slider-02 .slick-prev:hover:before, .quote-slider-02 .slick-next:hover:before {
color: #333333;
}
@media only screen and (min-width: 992px) {
.quote-slider-02 .quote-item .item-content {
padding-left: 215px;
}
.quote-slider-02 .quote-item .item-icon {
float: left;
margin-left: 15px;
}
}
@media (max-width: 1229px) {
.quote-slider-02 .slick-next {
right: 50%;
-webkit-transform: translateX(36px);
-ms-transform: translateX(36px);
transform: translateX(36px);
}
.quote-slider-02 .slick-next:before {
content: "\e07f";
}
.quote-slider-02 .slick-prev {
left: 50%;
-webkit-transform: translateX(-36px);
-ms-transform: translateX(-36px);
transform: translateX(-36px);
}
.quote-slider-02 .slick-prev:before {
content: "\e032";
}
.quote-slider-02 .slick-prev,
.quote-slider-02 .slick-next {
bottom: -35px;
margin-top: 0;
top: auto;
}
}
@media (max-width: 991px) {
.quote-slider-02 .quote-item .item-content {
margin-top: 30px;
text-align: center;
}
}
@media (max-width: 767px) {
.quote-slider-02 {
margin-bottom: 60px;
margin-top: 40px;
}
.quote-slider-02 .quote-item .item-content .comment {
font-size: 16px;
}
.quote-slider-02 .quote-item .item-content .name {
text-align: center;
}
.quote-slider-02 .quote-item .item-content .name p {
margin-top: 15px;
font-size: 16px;
}
.quote-slider-02 .quote-item .item-content .name p:before,
.quote-slider-02 .quote-item .item-content .name p:after {
width: 25px;
}
.quote-slider-02 .quote-item .item-icon {
height: 120px;
width: 120px;
}
.quote-slider-02 .quote-item .item-icon i {
line-height: 112px;
}
.quote-slider-02 .quote-item .item-icon i:before {
font-size: 75px;
vertical-align: middle;
}
}
.parallax-bg.quote-slider-parallax {
background-attachment: fixed; background-position: 50% 0; background-repeat: repeat-x; background-size: cover; position: absolute; z-index: -1; left: 0; top: 0; height: 100%; width: 100%;
}
.parallax-bg.quote-slider-parallax:after {
background-color: rgba(51, 51, 51, 0.7); content: ""; display: block; position: absolute; z-index: 0; left: 0; top: 0; height: 100%; width: 100%;
}
/* Brand Slider */
.brand-carousel-wrapper {
background-color: #939e98;
}
.brand-carousel .brand-item .item-image {
text-align: center;
}
.brand-carousel .brand-item .item-image>a {
display: inline-block; opacity: 1;
}
.brand-carousel .brand-item .item-image>a:hover {
opacity: 0.7;
}
/* Portfolio Slider */
.portfolio-box-slider:hover .slick-prev, .portfolio-box-slider:hover .slick-next {
opacity: 1;
}
.portfolio-box-slider .portfolio-slider-item .item-image img {
display: block; width: 100%;
}
.portfolio-box-slider .slick-next {
right: 0; text-align: right;
}
.portfolio-box-slider .slick-next:before {
content: '\e2c4'; margin-right: 10px;
}
.portfolio-box-slider .slick-prev {
left: 0; text-align: left;
}
.portfolio-box-slider .slick-prev:before {
content: '\e2c5'; margin-left: 10px;
}
.portfolio-box-slider .slick-prev, .portfolio-box-slider .slick-next {
background-color: #555555; height: 70px; margin-top: -35px; opacity: 0; top: 50%; width: 40px; z-index: 10; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;
}
.portfolio-box-slider .slick-prev:before, .portfolio-box-slider .slick-next:before {
font-size: 15px; color: #ffffff; font-family: "wolverine";
}
.portfolio-box-slider .slick-prev:hover, .portfolio-box-slider .slick-next:hover {
background-color: #999999;
}
@media (min-width: 1100px) {
.portfolio-box-slider:hover .slick-prev,
.portfolio-box-slider:hover .slick-next {
-webkit-transform: translateX(0px);
-ms-transform: translateX(0px);
transform: translateX(0px);
}
.portfolio-box-slider .slick-next {
-webkit-transform: translateX(40px);
-ms-transform: translateX(40px);
transform: translateX(40px);
}
.portfolio-box-slider .slick-prev {
-webkit-transform: translateX(-40px);
-ms-transform: translateX(-40px);
transform: translateX(-40px);
}
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2-wrapper {
margin-top: 54px; background-color: #f4f4f4;
}
.portfolio-thumbnail-slider .portfolio-syn-slider-1:hover .slick-prev, .portfolio-thumbnail-slider .portfolio-syn-slider-1:hover .slick-next {
opacity: 1;
}
.portfolio-thumbnail-slider .portfolio-syn-slider-1 .portfolio-slider-item .item-image img {
display: block; width: 100%;
}
.portfolio-thumbnail-slider .portfolio-syn-slider-1 .slick-next {
right: 0; text-align: right;
}
.portfolio-thumbnail-slider .portfolio-syn-slider-1 .slick-next:before {
content: '\e2c4'; margin-right: 10px;
}
.portfolio-thumbnail-slider .portfolio-syn-slider-1 .slick-prev {
left: 0; text-align: left;
}
.portfolio-thumbnail-slider .portfolio-syn-slider-1 .slick-prev:before {
content: '\e2c5'; margin-left: 10px;
}
.portfolio-thumbnail-slider .portfolio-syn-slider-1 .slick-prev, .portfolio-thumbnail-slider .portfolio-syn-slider-1 .slick-next {
background-color: #555555; height: 70px; margin-top: -35px; opacity: 0; top: 50%; width: 40px; z-index: 10; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;
}
.portfolio-thumbnail-slider .portfolio-syn-slider-1 .slick-prev:before, .portfolio-thumbnail-slider .portfolio-syn-slider-1 .slick-next:before {
font-size: 15px; color: #ffffff; font-family: "wolverine";
}
.portfolio-thumbnail-slider .portfolio-syn-slider-1 .slick-prev:hover, .portfolio-thumbnail-slider .portfolio-syn-slider-1 .slick-next:hover {
background-color: #999999;
}
@media (min-width: 1100px) {
.portfolio-thumbnail-slider .portfolio-syn-slider-1:hover .slick-prev,
.portfolio-thumbnail-slider .portfolio-syn-slider-1:hover .slick-next {
-webkit-transform: translateX(0px);
-ms-transform: translateX(0px);
transform: translateX(0px);
}
.portfolio-thumbnail-slider .portfolio-syn-slider-1 .slick-next {
-webkit-transform: translateX(40px);
-ms-transform: translateX(40px);
transform: translateX(40px);
}
.portfolio-thumbnail-slider .portfolio-syn-slider-1 .slick-prev {
-webkit-transform: translateX(-40px);
-ms-transform: translateX(-40px);
transform: translateX(-40px);
}
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2 {
margin-bottom: 50px; margin-top: 50px;
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .portfolio-slider-item.slick-center .item-image {
-webkit-transform: scale(1.07843137); -ms-transform: scale(1.07843137); transform: scale(1.07843137);
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .portfolio-slider-item.slick-center .layout-after:after {
background-color: transparent;
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .portfolio-slider-item .item-image {
margin: 15px; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .portfolio-slider-item .item-image img {
display: block; margin-left: auto; margin-right: auto; width: 100%;
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .portfolio-slider-item .layout-after {
position: relative;
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .portfolio-slider-item .layout-after:after {
background-color: rgba(51, 51, 51, 0.3); content: ""; display: block; position: absolute; z-index: 512; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; left: 0; top: 0; height: 100%; width: 100%;
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .portfolio-slider-item .layout-after:hover:after {
background-color: transparent;
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .slick-next {
right: -30px;
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .slick-next:before {
content: '\e07e';
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .slick-prev {
left: -30px;
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .slick-prev:before {
content: '\e031';
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .slick-prev, .portfolio-thumbnail-slider .portfolio-syn-slider-2 .slick-next {
height: 25px; top: 85px; width: 25px;
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .slick-prev:before, .portfolio-thumbnail-slider .portfolio-syn-slider-2 .slick-next:before {
font-size: 25px; color: #999999; font-family: "wolverine";
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .slick-prev:hover:before, .portfolio-thumbnail-slider .portfolio-syn-slider-2 .slick-next:hover:before {
color: #333333;
}
@media (max-width: 1300px) {
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .slick-next {
right: 50%;
-webkit-transform: translateX(36px);
-ms-transform: translateX(36px);
transform: translateX(36px);
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .slick-next:before {
content: '\e07f';
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .slick-prev {
left: 50%;
-webkit-transform: translateX(-36px);
-ms-transform: translateX(-36px);
transform: translateX(-36px);
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .slick-prev:before {
content: '\e032';
}
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .slick-prev,
.portfolio-thumbnail-slider .portfolio-syn-slider-2 .slick-next {
bottom: -35px;
margin-top: 0;
top: auto;
}
}
@media (max-width: 767px) {
.portfolio-thumbnail-slider .portfolio-syn-slider-2 {
display: none;
}
}
/* Highlights */
.highlights span {
background-color: #30B397; color: #ffffff; padding: 4px;
}
.highlights.style-2 span {
background-color: #cccccc; color: #333333;
}
/* Message Box */
.message p {
position: relative; padding: 5px 20px 5px 50px; font-weight: 600; margin-bottom: 0;
}
.message p:before {
font-family: "wolverine"; position: absolute; top: 50%; left: 0px; display: inline-block; width: 50px; text-align: center; font-size: 19px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);
}
.message p a {
position: absolute; top: 50%; right: 12px; font-weight: 800; font-size: 17px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);
}
.message.notice p {
border: 1px solid #eeeeee;
}
.message.notice p:before {
content: "\e048";
}
.message.error p {
color: #ffffff; background-color: #30B397;
}
.message.error p:before {
font-family: FontAwesome; content: "\f06a";
}
.message.warning p {
color: #30B397; border: 1px solid #cccccc; background-color: #eeeeee;
}
.message.warning p:before {
content: "\i";
}
.message.success p {
border: 1px solid #cccccc; background-color: #eeeeee;
}
.message.success p:before {
content: "\W";
}
.message.info p {
color: #30B397; border: 1px solid #30B397;
}
.message.info p:before {
content: "\e020";
}
.messagefull .content {
position: relative; padding: 20px 25px 20px 108px; font-weight: 600;
}
.messagefull .content p, .messagefull .content h5, .messagefull .content a, .messagefull .content:before {
margin-bottom: 0;
}
.messagefull .content a {
position: absolute; top: 0px; right: 15px; font-weight: 800; font-size: 17px;
}
.messagefull .content:before {
font-family: FontAwesome; position: absolute; top: 50%; left: 0px; display: inline-block; width: 108px; content: "\f06a"; text-align: center; font-size: 35px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);
}
.messagefull.error .content {
background-color: #30B397;
}
.messagefull.error .content p, .messagefull.error .content h5, .messagefull.error .content a, .messagefull.error .content:before {
color: #ffffff;
}
.messagefull.error .content:before {
content: "\f06a";
}
.messagefull.warning .content {
border: 1px solid #cccccc; background-color: #eeeeee;
}
.messagefull.warning .content p, .messagefull.warning .content h5, .messagefull.warning .content a, .messagefull.warning .content:before {
color: #30B397;
}
.messagefull.warning .content:before {
font-family: "wolverine"; content: "\i";
}
.messagefull.success .content {
border: 1px solid #cccccc; background-color: #eeeeee;
}
.messagefull.success .content:before {
font-family: "wolverine"; content: "\W";
}
.messagefull.info .content {
border: 1px solid #30B397;
}
.messagefull.info .content p, .messagefull.info .content h5, .messagefull.info .content a, .messagefull.info .content:before {
color: #30B397;
}
.messagefull.info .content:before {
font-family: "wolverine"; content: "\e020";
}
/* Pricing Table */
.price-table {
padding-left: 1px; text-align: center; -webkit-transition: all .3s; transition: all .3s;
}
.price-table:before, .price-table:after {
display: table; content: " "; -webkit-transition: all .3s; transition: all .3s;
}
.price-table:after {
clear: both; -webkit-transition: all .3s; transition: all .3s;
}
.price-table-content {
margin-left: -1px; padding: 0 25px; padding-bottom: 60px; border: 1px solid #dddddd; -webkit-transition: all .3s; transition: all .3s;
}
.price-table-content.default {
background-color: #f4f4f4;
}
.price-table-content.default h5:first-of-type {
background-color: #30B397;
}
.price-table-content h5 {
margin-bottom: 0; padding-top: 25px; padding-bottom: 25px; border-bottom: 1px solid #dddddd; color: #666666; -webkit-transition: all .3s; transition: all .3s;
}
.price-table-content h5:first-of-type {
background-color: #333333; color: #ffffff; margin: -1px -26px 0 -26px; padding: 32px 0px;
}
.price-table-content h1 {
margin-bottom: 0; padding: 60px 0; font-size: 80px; -webkit-transition: all .3s; transition: all .3s;
}
.price-table-content span {
color: #444444;
}
/* Block Quotes */
.blockquotes-wrapper {
margin: 90px 0;
}
.blockquotes-wrapper p, .blockquotes-wrapper h4 {
margin-bottom: 0;
}
.blockquotes-wrapper .blockquotes {
padding: 40px 0 40px 35px;
}
.blockquotes-wrapper .blockquotes h4 {
font-style: italic; font-family: 'Playfair Display', serif; display: inline-block; line-height: 40px;
}
.blockquotes-wrapper .blockquotes span {
font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em; color: #30B397; display: inline-block; float: left; margin-top: 10px; font-size: 70px; line-height: 40px;
}
.blockquotes-wrapper .blockquotes.style-2 span {
color: #444444;
}
/* Dropcaps*/
.dropcap-1 span.first-letter {
border: 1px solid; font-size: 38px; display: inline-block; width: 56px; height: 56px; float: left; font-weight: 700; line-height: 56px; margin-right: 15px; text-align: center;
}
.dropcap-1.style-1 span.first-letter {
background-color: #30B397; color: #ffffff; border-color: #30B397;
}
.dropcap-1.style-2 span.first-letter {
color: #ffffff; border-color: #555555; background-color: #555555;
}
.dropcap-1.style-3 span.first-letter {
border-color: #777777; color: #777777;
}
.dropcap-2 span.first-letter {
border: 1px solid; font-size: 38px; display: inline-block; width: 56px; height: 56px; float: left; font-weight: 700; line-height: 56px; margin-right: 15px; text-align: center; border-radius: 50%;
}
.dropcap-2.style-1 span.first-letter {
background-color: #30B397; color: #ffffff; border-color: #30B397;
}
.dropcap-2.style-2 span.first-letter {
color: #ffffff; border-color: #555555; background-color: #555555;
}
.dropcap-2.style-3 span.first-letter {
border-color: #777777; color: #777777;
}
.dropcap-3 span.first-letter {
float: left; font-size: 55px; line-height: 55px; font-weight: 700; margin-right: 15px;
}
.dropcap-3.style-1 span.first-letter {
color: #30B397;
}
.dropcap-3.style-2 span.first-letter {
color: #555555;
}
.dropcap-3.style-3 span.first-letter {
color: #777777;
}
/* Progressbar*/
.progressbar-container {
position: relative; width: 100%; margin-bottom: 20px;
}
.progressbar-container .progressbar-title {
margin-bottom: 0; line-height: 2.2;
}
.progressbar-container .progressbar {
-webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; background-color: #30B397; width: 0;
}
.progressbar-container .progressbar-back-text, .progressbar-container .progressbar-front-text {
display: none;
}
.progressbar-container.basic, .progressbar-container.style-tooltip {
position: relative;
}
.progressbar-container.basic .progressbar, .progressbar-container.style-tooltip .progressbar {
background-color: #30B397; height: 20px; width: 0;
}
.progressbar-container.basic .progressbar:before, .progressbar-container.style-tooltip .progressbar:before {
content: ; bottom: 0; position: absolute; display: block; width: 100%; height: 20px; background-color: #eeeeee; z-index: -1;
}
.progressbar-container.basic .progressbar {
position: static;
}
.progressbar-container.basic .progressbar-back-text {
position: absolute; display: block; right: 0; font-size: 14px; font-weight: 600; text-align: right;
}
.progressbar-container.style-tooltip {
margin-bottom: 40px; position: relative;
}
.progressbar-container.style-tooltip .progressbar {
position: absolute;
}
.progressbar-container.style-tooltip .progressbar-back-text {
position: absolute; display: block; width: 100%; height: 20px; bottom: -20px; font-size: 0; background-color: #eeeeee; z-index: -1;
}
.progressbar-container.style-tooltip .progressbar-front-text {
position: absolute; display: block; right: -25px; bottom: 28px; line-height: 1; height: 23px; font-weight: 600; text-align: center; max-width: 50px; padding: 5px; border-radius: 3px; color: #ffffff; background-color: #555555;
}
.progressbar-container.style-tooltip .progressbar-front-text:before {
content: ""; position: absolute; bottom: -10px; left: 20px; border-left-width: 4px; border-right-width: 4px; border-top-width: 7px; border-style: solid; border-color: transparent; border-top-color: #555555; display: block; width: 0; height: 0;
}
.progressbar-container.fill-text {
height: 40px; margin-bottom: 35px; background-color: #eeeeee;
}
.progressbar-container.fill-text .progressbar-title {
position: absolute; line-height: 40px; padding-left: 15px; top: 0; left: 0;
}
.progressbar-container.fill-text .progressbar {
position: absolute; height: 100%; overflow: hidden; z-index: 1;
}
.progressbar-container.fill-text .progressbar:before {
height: 100%;
}
.progressbar-container.fill-text .progressbar .progressbar-title {
color: #ffffff;
}
.progressbar-container.fill-text .progressbar-back-text, .progressbar-container.fill-text .progressbar-front-text {
position: absolute; display: block; right: 0; font-size: 14px; line-height: 40px; padding-right: 15px; font-weight: 600; text-align: right;
}
.progressbar-container.fill-text .progressbar-front-text {
left: 0; top: 0; color: #ffffff;
}
.progressbar-container.vertical {
height: 120px; float: left; margin-right: 50px; margin-bottom: 80px; background-color: #ffffff;
}
.progressbar-container.vertical.gray {
background-color: #f4f4f4;
}
.progressbar-container.vertical .progressbar-title {
display: block; position: absolute; bottom: -40px;
}
.progressbar-container.vertical .progressbar {
height: 0; width: 100%; position: absolute; bottom: 0; left: 0;
}
.progressbar-container.vertical .progressbar-back-text {
display: block; position: absolute; max-height: 20px; bottom: -50px; line-height: 30px !important; font-weight: 600; color: #30B397;
}
/* Piechart*/
.block-piechart {
text-align: center; font-size: 14px;
}
.block-piechart .piechart {
max-width: 200px; margin-left: auto; margin-right: auto; margin-bottom: 35px;
}
.block-piechart .piechart .progressbar-text {
font-family: 'Montserrat', sans-serif; letter-spacing: 0.05em; font-size: 30px;
}
.block-piechart .piechart path:first-child {
stroke: #f4f4f4;
}
.block-piechart .piechart path:last-child {
stroke: #30B397;
}
.block-piechart.trail-light .piechart path:first-child {
stroke: #ffffff;
}
.block-piechart.stroke-dark .piechart path:last-child {
stroke: #555555;
}
.block-piechart.center-color-main .piechart .icon, .block-piechart.center-color-main .piechart .progressbar-text {
color: #30B397 !important;
}
.block-piechart .piechart-icon {
position: relative;
}
.block-piechart .piechart-icon .icon {
font-size: 52px; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%);
}
.block-piechart .piechart-icon .icon:before {
display: block;
}
.block-piechart h5 {
margin-bottom: 0;
}
/* Shortcode Button */
@media (max-width: 479px) {
.shortcode-button .normal-btn.btn-size-1 {
padding: 14px 88px;
}
.shortcode-button .normal-btn.btn-size-2 {
padding: 14px 75px;
}
.shortcode-button .normal-btn.btn-size-3 {
padding: 14px 65px;
}
.shortcode-button .border-btn.btn-size-1 {
padding: 13px 87px;
}
.shortcode-button .border-btn.btn-size-2 {
padding: 13px 74px;
}
.shortcode-button .border-btn.btn-size-3 {
padding: 13px 64px;
}
}
/* Shortcode Parallax */
.shortcode-parallax-1 {
padding-top: 210px; padding-bottom: 210px;
}
.shortcode-parallax-1 .content img {
margin-left: auto; margin-right: auto; width: 300px; margin-bottom: 38px;
}
.shortcode-parallax-1 .content p {
font-size: 21px; margin-bottom: 0; color: #ffffff; font-style: italic; font-family: 'Playfair Display', serif;
}
@media (max-width: 767px) {
.shortcode-parallax-1 {
padding-top: 100px;
padding-bottom: 100px;
}
.shortcode-parallax-1 .content img {
width: 250px;
}
.shortcode-parallax-1 .content p {
font-size: 16px;
}
}
.shortcode-parallax-2 {
padding-top: 210px; padding-bottom: 210px;
}
.shortcode-parallax-2 .content .heading-icon-2 {
-webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;
}
.shortcode-parallax-2 .content .heading-icon-2:after {
color: #ffffff; content: "\e2d1"; display: block; font-size: 68px; font-weight: 400; line-height: 1; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; font-family: "wolverine";
}
.shortcode-parallax-2 .content .heading-icon-2:after {
font-style: normal; margin-top: 10px;
}
.shortcode-parallax-2 .content p {
font-size: 28px; margin-bottom: 0; font-style: italic; font-family: 'Playfair Display', serif;
}
@media (max-width: 767px) {
.shortcode-parallax-2 {
padding-top: 100px;
padding-bottom: 100px;
}
.shortcode-parallax-2 .content p {
font-size: 16px;
}
}
/* Index Demo Page */
.index-header, .index-footer {
text-align: center; position: relative;
}
.index-header h1, .index-footer h1, .index-header h2, .index-footer h2, .index-header p, .index-footer p, .index-header .icon, .index-footer .icon {
color: #ffffff; margin-bottom: 10px;
}
.index-header h1, .index-footer h1, .index-header h2, .index-footer h2 {
font-weight: 700;
}
.index-header .footer-foot p, .index-footer .footer-foot p {
color: #333333; margin-bottom: 0;
}
@media only screen and (min-width: 992px) {
.index-header h1,
.index-footer h1 {
font-size: 60px;
}
}
.index-header {
padding-top: 80px; padding-bottom: 30px;
}
.index-header .icon {
font-size: 120px; display: block;
}
.index-header .icon:before {
display: block;
}
@media only screen and (min-width: 992px) {
.index-header {
padding-top: 230px;
padding-bottom: 180px;
}
}
.index-footer .page-common-background {
background-attachment: fixed; background-position: 50% 0; background-repeat: repeat-x; background-size: cover; position: absolute; z-index: -1; left: 0; top: 0; height: 100%; width: 100%;
}
.index-footer .page-common-background:after {
background-color: rgba(0, 0, 0, 0.45); content: ""; display: block; position: absolute; z-index: 0; left: 0; top: 0; height: 100%; width: 100%;
}
.index-footer .footer-content {
padding-top: 30px; padding-bottom: 30px;
}
@media only screen and (min-width: 992px) {
.index-footer .footer-content {
padding-top: 130px;
padding-bottom: 130px;
}
}
.index-footer .footer-content p.font-serif {
margin-bottom: 60px;
}
.index-demo-item {
text-align: center; max-width: 428px; margin-left: auto; margin-right: auto;
}
.index-demo-item:after {
clear: both;
}
.index-demo-item:before, .index-demo-item:after {
content: " "; display: table;
}
.index-demo-item:after {
clear: both;
}
.index-demo-item:before, .index-demo-item:after {
content: " "; display: table;
}
.index-demo-item .image-frame {
position: relative; margin-bottom: 25px;
}
.index-demo-item .image-frame .overlay {
-webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; opacity: 0; background-color: rgba(51, 51, 51, 0.5);
}
.index-demo-item .image-frame:hover .overlay {
opacity: 1;
}
/******************** GENERAL PAGES START ********************/
@import url('https://fonts.googleapis.com/css?family=Merriweather%7COpen+Sans%7CRaleway'); html, body {
width: 100%; height: 100%; margin: 0; padding: 0; overflow-x: hidden;
}
body {
background-size: 40px 40px;
}
p {
color: #000; font-family: 'Open Sans', sans-serif;
}
nav {
padding-top: 30px; padding-bottom: 30px; padding-right: 100px; background-color: #a0e0bd; height: 98px;
}
.nav-bar-logo {
vertical-align: top; display: inline-block; float: left; margin-left: 80px; margin-top: -5px;
}
.nav-bar-logo img {
width: 140px;
}
.nav-bar-main-menu {
font-family: 'Raleway', sans-serif;
}
.banner-container {
display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center;
}
.home-banner-logo {
height: 250px; width: 35%; padding-top: 170px; margin-right: -400px;
}
.home-banner-wrapper {
background: #a0e0bd; height: 400px; width: 100%;
}
.home-banner-plants {
height: 400px; width: 80%;
}
.dropbtn {
background-color: transparent; text-decoration: none; padding: 15px; margin: 0px; font-size: 15px; border: none; color: #fff;
}
@media (max-width: 1050px) {
.dropbtn {
font-size: 12px;
}
}
.dropdown {
position: relative; vertical-align: top; display: inline-block; float: right;
}
.dropdown ul {
list-style-type: none;
}
.dropdown a {
position: relative; display: inline-block; color: #e8b023; text-decoration: none;
}
.dropdown-content {
display: none; position: absolute; background-color: #016C64; color: #ffffff; width: 200px; font-size: 14px; box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2); z-index: 1;
}
.toolkit-dropdown-content {
width: 720px; left: -160px;
}
.modeling-dropdown-content {
left: -40px;
}
.human-dropdown-content {
left: 12px;
}
.outreach-dropdown-content {
width: 230px; left: -40px;
}
.team-dropdown-content {
width: 140px; left: -35px;
}
.dropdown-content a {
color: #ffffff; padding: 12px 16px; text-decoration: none; display: block;
}
.wet-lab-list-title, .doc-list-title, .pd-list-title {
padding-top: 12px; padding-left: 16px; padding-bottom: 14px;
}
.nav-second-col {
margin-left: 30px;
}
.nav-third-col {
margin-left: 30px;
}
.dropbtn:hover, .active-page {
color: #016C64; transition-duration: 0.5s;
}
.dropdown-content a:hover {
color: #016C64; background-color: #ffffff;
}
.dropdown:hover .dropdown-content {
display: block;
}
footer {
padding: 35px; position: relative; text-align: center; background-color: #a0e0bd;
}
.footer-wrapper {
margin: auto; display: inline-block;
}
.icon-wrapper {
display: inline-block; position: relative; padding-right: 18px; border-right: 0.5px solid white;
}
.icon-wrapper-last {
border-right: none;
}
.icon {
margin: 16px;
}
.icon img {
height: 24px;
}
/******************** GENERAL PAGES END ********************/
/******************** STANDARD PAGE START ********************/
.standard-page-banner {
background-image: url(); background-size: cover; font-family: Raleway; fill: black; font-size: 14px;
}
.standard-page-side-bar-content-wrapper {
padding: 5% 0;
}
.standard-page-side-bar>li>a {
text-decoration: none; color: #016C64; font-weight: bold;
}
.standard-page-side-bar {
list-style-type: none; font-family: 'Open Sans', sans-serif; padding-left: 15px; padding-right: 15px; vertical-align: middle; margin: 0;
}
.standard-page-side-bar>li {
margin-bottom: 15px;
}
.standard-page-content-title {
font-family: 'Merriweather', serif; font-size: 24px; font-weight: 700; color: #000; position: relative;
}
.green-accent-line-left {
border: #a0e0bd solid 1px; display: block; float: left; margin: 1em auto 1em auto; width: 80px;
}
.standard-page-content-subheading {
font-family: 'Merriweather', serif; font-size: 18px; font-weight: 1; color: #000; padding-top: 8%; padding-bottom: 0;
}
.content-title {
font-family: 'Merriweather', serif; font-size: 24px; font-weight: 700; color: #000; position: relative; margin-bottom: 20px;
}
.text-justify {
color: #000; font-family: 'Open Sans', sans-serif; font-size: 16px;
}
.pp-page-content-wrapper {
padding: 80px 80px 0px 80px;
}
.pp-page-content {
padding-bottom: 80px;
}
/******************** NOTEBOOK PAGE END ********************/
/******************** ATRIBUTIONS PAGE START ********************/
.attributions-body-text {
font-family: 'Open Sans', serif; font-size: 16px; color: white;
}
/******************** STANDARD PAGE END ********************/
/******************** STANDARD PAGE GRID START ********************/
nav {
grid-area: navbar;
}
.nav-bar-main-menu .dropdown:nth-child(5) .dropdown-contentx {
display: grid; grid-template-columns: auto auto auto;
}
.nav-first-col {
display: inline-grid;
}
.nav-second-col {
display: inline-grid;
}
.nav-third-col {
display: inline-grid;
}
nav {
grid-area: navbar;
}
.standard-page-wrapper {
display: grid; grid-template-columns: auto; grid-template-rows: 100px 550px auto 100px; grid-template-areas: "navbar" "standardpagebanner" "pandppagecontent" "footer";
}
.standard-page-banner {
grid-area: standardpagebanner;
}
.pp-page-content-wrapper {
grid-area: pandppagecontent;
}
footer {
grid-area: footer;
}
/******************** STANDARD PAGE GRID END ********************/