| Current File : /home/c/i/d/cideo/sainchargny/wp-content/plugins/addons-for-elementor/assets/css/lae-widgets.scss |
@import "lae-lib";
$theme_color: #f94213;
/* --------------------------------- Team Members --------------------------------------- */
.lae-team-members {
clear: both;
.lae-team-member {
.lae-social-list {
margin-top: 20px;
.lae-social-list-item {
display: inline;
margin: 0 15px 0 0;
}
}
.lae-team-member-details {
@include lae-body-font();
}
.lae-team-member-text {
.lae-title {
@include lae-heading-style();
}
.lae-team-member-position {
font-size: 15px;
line-height: 24px;
font-style: italic;
color: #888;
margin-bottom: 10px;
}
}
}
}
/*-------- Style 1 ----------------*/
.lae-team-members-style1 {
.lae-team-member-wrapper {
float: left;
padding: 10px;
}
.lae-team-member {
max-width: 320px;
margin: 0 auto 40px;
.lae-image-wrapper {
text-align: center;
position: relative;
img {
max-width: 100%;
margin: 0 auto 30px;
border-radius: 50%;
transition: all .3s ease-in-out 0s;
}
.lae-social-list {
position: absolute;
height: 100%;
width: 100%;
top: 40%;
z-index: 2;
@include respond-to-max(767) {
position: relative;
top: 0;
}
i {
font-size: 26px;
color: #fff;
opacity: 0;
transition: all .3s ease-in-out 0s;
&:hover {
color: #ccc;
}
@include respond-to-max(767) {
color: inherit;
opacity: 1;
&:hover {
color: inherit;
}
}
}
}
}
&:hover {
.lae-image-wrapper {
img {
filter: brightness(50%);
@include respond-to-max(767) {
filter: brightness(80%);
}
}
.lae-social-list i {
opacity: 1;
}
}
}
.lae-team-member-text {
text-align: center;
max-width: 650px;
.lae-title {
margin-bottom: 10px;
}
}
.lae-social-list {
margin: 10px auto;
}
}
}
/*-------- Style 2 ----------------*/
.lae-team-members-style2 {
position: relative;
max-width: 960px;
.lae-team-member-wrapper {
clear: both;
margin-top: 100px;
&:first-child {
margin-top: 0;
}
/* Make that flip-flop possible */
.lae-image-wrapper {
float: left;
position: relative;
img {
max-width: 320px;
border-radius: 50%;
transition: all .3s ease-in-out 0s;
}
}
.lae-team-member-text {
margin: 10px 0 0;
vertical-align: middle;
padding-top: 20px;
.lae-title {
margin-bottom: 5px;
}
.lae-team-member-details {
margin: 10px 0 10px;
}
.lae-social-list {
i {
font-size: 24px;
}
}
}
&:hover {
.lae-image-wrapper img {
filter: brightness(80%);
}
}
}
.lae-team-member-wrapper:nth-child(odd) {
.lae-image-wrapper {
margin-right: 50px;
}
}
.lae-team-member-wrapper:nth-child(even) {
.lae-image-wrapper {
float: right;
margin-left: 50px;
}
.lae-team-member-text {
.lae-title, .lae-team-member-position, .lae-team-member-details, .lae-social-list {
text-align: right;
}
}
}
}
@include respond-to-max(767) {
.lae-team-members-style2 {
.lae-team-member-wrapper {
margin-top: 75px;
}
.lae-team-member {
.lae-image-wrapper, .lae-team-member-text {
width: 100%;
float: none;
}
.lae-image-wrapper {
text-align: center;
img {
margin: 0 auto 20px;
}
}
.lae-team-member-text {
max-width: 400px;
margin: 0 auto;
padding-top: 0;
.lae-title, .lae-team-member-position, .lae-team-member-details, .lae-social-list {
text-align: center !important;
}
}
}
}
}
.lae-dark-bg .lae-team-members {
.lae-team-member {
.lae-team-member-details {
color: #909090;
}
.lae-team-member-text {
.lae-title {
color: #e5e5e5;
}
.lae-team-member-position {
color: #505050;
}
}
}
}
/* ---------------------------------------- Testimonials --------------------------------------- */
.lae-testimonials {
clear: both;
.lae-testimonial {
margin-bottom: 50px;
}
.lae-testimonial-text {
background: #ffffff;
border: 1px solid #dbdbdb;
border-radius: 30px;
text-align: center;
position: relative;
padding: 20px 20px 0;
margin-bottom: 40px;
font-style: italic;
font-size: 15px;
line-height: 24px;
color: #888;
.lae-dark-bg & {
color: #666;
background: #eee;
}
&:after {
content: '';
display: block;
background: #fff;
border-left: 1px solid #dbdbdb;
border-bottom: 1px solid #dbdbdb;
background: #ffffff;
transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: skew(0deg, -44deg);
width: 24px;
height: 24px;
position: absolute;
bottom: -12px;
left: 40px;
margin: auto;
.lae-dark-bg & {
background: #eee;
}
}
text-align: center;
max-width: 450px;
}
.lae-testimonial-user {
display: table;
.lae-image-wrapper {
display: table-cell;
img {
max-width: 64px;
border-radius: 50%;
margin-right: 20px;
}
}
.lae-text {
display: table-cell;
vertical-align: middle;
color: #888;
.lae-dark-bg & {
color: #909090;
}
.lae-author-name {
@include lae-heading-style();
font-size: 15px;
line-height: 24px;
margin-bottom: 5px;
color: #333;
.lae-dark-bg & {
color: #e5e5e5;
}
}
}
}
}
/* ------------------------------ Testimonials Slider ------------------------------------- */
.lae-testimonials-slider {
clear: both;
position: relative;
&.lae-container {
max-width: 900px;
margin: 0 auto;
}
.lae-testimonial-text {
text-align: center;
max-width: 750px;
margin: 0 auto 40px;
font-size: 18px;
line-height: 32px;
font-style: italic;
color: #666;
.lae-dark-bg & {
color: #ccc;
}
i {
color: #ccc;
font-size: 32px;
display: block;
margin-bottom: 35px;
background: none;
width: auto;
height: auto;
.lae-dark-bg & {
color: #ddd;
}
}
}
.lae-testimonial-user {
display: table;
margin: 0 auto;
.lae-image-wrapper {
display: table-cell;
img {
max-width: 64px;
border-radius: 50%;
margin-right: 15px;
}
}
.lae-text {
display: table-cell;
vertical-align: middle;
color: #888;
.lae-dark-bg & {
color: #909090;
}
.lae-author-name {
@include lae-heading-style();
font-size: 15px;
line-height: 24px;
margin-bottom: 5px;
.lae-dark-bg & {
color: #e5e5e5;
}
}
}
}
}
/* ------------------------------------- Stats Bar --------------------------------------------- */
.lae-stats-bars {
clear: both;
.lae-stats-bar {
width: 100%;
display: block;
margin: 0 0 18px;
overflow: hidden;
.lae-stats-title {
margin: 0;
display: block;
color: #888;
font-style: normal;
font-size: 15px;
text-transform: none;
color: #333;
font-size: 16px;
line-height: 28px;
span {
margin-left: 5px;
}
.lae-dark-bg & {
color: #ddd;
}
}
.lae-stats-bar-wrap {
position: relative;
}
.lae-stats-bar-content {
background: #e55a54;
display: block;
height: 10px;
width: 0;
position: relative;
z-index: 1;
border-radius: 5px;
}
.lae-stats-bar-bg {
width: 100%;
background: rgba(0, 0, 0, 0.1);
height: 10px;
display: block;
margin-top: -10px;
border-radius: 5px;
.lae-dark-bg & {
background: rgba(255, 255, 255, 0.1);
}
}
}
}
/*--------------------------------- Pie Charts -------------------------------------- */
.lae-piecharts {
clear: both;
}
.lae-piechart {
position: relative;
text-align: center;
float: left;
overflow: hidden;
float: left;
padding: 10px;
canvas {
position: relative;
top: 0;
left: 0;
max-width: 100%;
margin: 0 auto;
}
.lae-label {
text-align: center;
position: absolute;
left: 0;
right: 0;
margin-left: auto;
margin-right: auto;
top: 55%;
max-width: 65%;
color: #888;
.lae-dark-bg & {
color: #909090;
}
}
.lae-percentage {
span {
position: absolute;
top: 25%;
left: 0;
right: 0;
margin-left: auto;
margin-right: auto;
font-size: 60px;
line-height: 60px;
font-weight: 300;
text-align: center;
color: #333;
font-weight: bolder;
.lae-dark-bg & {
color: #e5e5e5;
}
}
sup {
font-size: 18px;
vertical-align: middle;
}
}
&.dark-bg {
.lae-label {
color: #fff;
}
.lae-percentage span {
color: #eee;
}
}
}
@media only screen and (max-width: 479px) {
.lae-piechart canvas {
margin-bottom: 15px;
}
}
/* ---------------------------------- Odometers/Counters ---------------------------------- */
.odometer.odometer-auto-theme, .odometer.odometer-theme-default {
display: inline-block;
vertical-align: middle;
*vertical-align: auto;
*zoom: 1;
*display: inline;
position: relative; }
.odometer.odometer-auto-theme .odometer-digit, .odometer.odometer-theme-default .odometer-digit {
display: inline-block;
vertical-align: middle;
*vertical-align: auto;
*zoom: 1;
*display: inline;
position: relative; }
.odometer.odometer-auto-theme .odometer-digit .odometer-digit-spacer, .odometer.odometer-theme-default .odometer-digit .odometer-digit-spacer {
display: inline-block;
vertical-align: middle;
*vertical-align: auto;
*zoom: 1;
*display: inline;
visibility: hidden; }
.odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner, .odometer.odometer-theme-default .odometer-digit .odometer-digit-inner {
text-align: left;
display: block;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
overflow: hidden; }
.odometer.odometer-auto-theme .odometer-digit .odometer-ribbon, .odometer.odometer-theme-default .odometer-digit .odometer-ribbon {
display: block; }
.odometer.odometer-auto-theme .odometer-digit .odometer-ribbon-inner, .odometer.odometer-theme-default .odometer-digit .odometer-ribbon-inner {
display: block;
-webkit-backface-visibility: hidden; }
.odometer.odometer-auto-theme .odometer-digit .odometer-value, .odometer.odometer-theme-default .odometer-digit .odometer-value {
display: block;
-webkit-transform: translateZ(0); }
.odometer.odometer-auto-theme .odometer-digit .odometer-value.odometer-last-value, .odometer.odometer-theme-default .odometer-digit .odometer-value.odometer-last-value {
position: absolute; }
.odometer.odometer-auto-theme.odometer-animating-up .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-up .odometer-ribbon-inner {
-webkit-transition: -webkit-transform 2s;
-moz-transition: -moz-transform 2s;
-ms-transition: -ms-transform 2s;
-o-transition: -o-transform 2s;
transition: transform 2s; }
.odometer.odometer-auto-theme.odometer-animating-up.odometer-animating .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-up.odometer-animating .odometer-ribbon-inner {
-webkit-transform: translateY(-100%);
-moz-transform: translateY(-100%);
-ms-transform: translateY(-100%);
-o-transform: translateY(-100%);
transform: translateY(-100%); }
.odometer.odometer-auto-theme.odometer-animating-down .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-down .odometer-ribbon-inner {
-webkit-transform: translateY(-100%);
-moz-transform: translateY(-100%);
-ms-transform: translateY(-100%);
-o-transform: translateY(-100%);
transform: translateY(-100%); }
.odometer.odometer-auto-theme.odometer-animating-down.odometer-animating .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-down.odometer-animating .odometer-ribbon-inner {
-webkit-transition: -webkit-transform 2s;
-moz-transition: -moz-transform 2s;
-ms-transition: -ms-transform 2s;
-o-transition: -o-transform 2s;
transition: transform 2s;
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
transform: translateY(0); }
.odometer.odometer-auto-theme, .odometer.odometer-theme-default {
font-family: "Helvetica Neue", sans-serif;
line-height: 1.1em; }
.odometer.odometer-auto-theme .odometer-value, .odometer.odometer-theme-default .odometer-value {
text-align: center; }
/* --- Animate Numbers ---- */
.lae-odometers {
clear: both;
font-size: 0;
/* inline-block hack */
.lae-odometer {
display: inline-block;
vertical-align: top;
text-align: left;
position: relative;
margin-bottom: 50px;
&:last-child:after {
border: none;
}
.lae-prefix, .lae-suffix {
display: inline;
font-size: 36px;
line-height: 48px;
color: #333;
vertical-align: middle;
.lae-dark-bg & {
color: #e5e5e5;
}
}
.lae-prefix {
margin-right: 5px;
margin-left: 5px;
}
.lae-suffix {
margin-left: 5px;
}
.lae-number {
font-size: 60px;
line-height: 72px;
font-style: normal;
text-transform: none;
letter-spacing: 2px;
font-weight: 900;
color: #333;
margin-bottom: 10px;
span {
font-size: 60px;
}
.lae-dark-bg & {
color: #e5e5e5;
}
}
.lae-stats-title {
font-size: 18px;
line-height: 28px;
display: inline-block;
color: #888;
.lae-dark-bg & {
color: #909090;
}
span {
float: left;
margin-right: 15px;
}
.lae-icon-wrapper {
font-size: 32px;
margin-right: 10px;
vertical-align: middle;
color: #ccc;
}
}
}
}
@media only screen and (max-width: 960px) {
.lae-odometers .lae-odometer {
.lae-number {
font-size: 48px;
line-height: 56px;
margin-bottom: 0;
span {
font-size: 48px;
}
}
.lae-stats-title {
font-size: 15px;
line-height: 26px;
}
}
}
@include respond-to-max(479) {
.lae-odometers {
.lae-odometer {
text-align: center;
}
}
}
/* ---------------------------------- Pricing table ------------------------------------ */
.lae-pricing-table {
clear: both;
}
.lae-pricing-table .lae-pricing-plan {
float: left;
padding: 10px;
}
.lae-center {
text-align: center;
}
.lae-pricing-table {
padding: 0;
.lae-top-header {
padding: 15px 0;
background-color: #494949;
border-bottom: 1px solid #2c2b2b;
.lae-plan-name {
@include lae-heading-style();
font-size: 20px;
line-height: 32px;
color: #fefefe;
margin: 0;
}
img {
margin-top: 15px;
}
.lae-tagline {
display: block;
font-size: 15px;
line-height: 24px;
color: #EDEDED;
text-transform: none;
text-align: center;
margin-bottom: 5px;
}
}
.lae-pricing-plan {
background: #fff;
padding: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: all 0.1s ease-in-out 0s;
-moz-transition: all 0.1s ease-in-out 0s;
-ms-transition: all 0.1s ease-in-out 0s;
transition: all 0.1s ease-in-out 0s;
margin-bottom: 30px;
&:hover {
.lae-purchase {
background: #e5e5e5;
}
}
.lae-plan-price {
color: #fff;
font-size: 22px;
line-height: 28px;
font-weight: 700;
margin: 0;
span {
font-size: 22px;
line-height: 32px;
}
}
}
.lae-plan-header {
padding: 30px 0 30px;
background-color: #494949;
}
.lae-plan-price {
.lae-text {
display: inline-block;
padding: 6px 25px;
border-radius: 25px;
background: #2C2B2B;
}
sup {
font-size: 18px;
line-height: 32px;
vertical-align: top;
margin-right: 2px;
position: static;
}
}
.lae-plan-details {
padding: 15px 0;
margin: 0;
border: 1px solid #eee;
.lae-pricing-item {
list-style: none;
display: block;
padding: 6px;
margin: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
text-align: center;
i {
color: #777;
font-size: 18px;
display: inline;
margin-right: 8px;
}
.lae-title {
color: #838383;
margin-bottom: 10px;
}
.lae-value-wrap {
display: block;
&:after {
position: relative;
content: "";
background: #ddd;
width: 120px;
height: 1px;
display: block;
margin: 12px auto 0;
}
}
.lae-value {
color: #444;
font-size: 24px;
line-height: 32px;
display: inline;
}
s {
color: #b4c9d3;
}
&:last-child .lae-value-wrap:after {
display: none;
}
}
}
.lae-purchase {
text-align: center;
text-transform: uppercase;
padding: 15px;
margin: 0 auto;
background: #f1f1f1;
-webkit-transition: all 0.1s ease-in-out 0s;
-moz-transition: all 0.1s ease-in-out 0s;
-ms-transition: all 0.1s ease-in-out 0s;
transition: all 0.1s ease-in-out 0s;
border-left: 1px solid #eee;
border-right: 1px solid #eee;
border-bottom: 1px solid #eee;
a {
padding: 12px 25px;
border-radius: 5px;
letter-spacing: 0;
font-size: 16px;
line-height: 24px;
letter-spacing: 6px;
font-weight: bold;
}
}
.lae-pricing-plan.lae-highlight {
background: #f5f5f5;
margin-top: -10px;
.lae-plan-details {
border-color: #e5e5e5;
}
.lae-top-header {
padding: 20px 0;
}
.lae-pricing-table .lae-top-header .lae-plan-name {
color: #28c2ba;
}
.lae-purchase {
padding: 20px 0;
background-color: #e5e5e5;
border-color: #ddd;
}
}
}
/* ------------------------------------ Services ------------------------------------------- */
/* Style 1 */
.lae-services-style1 {
.lae-service {
.lae-icon-wrapper span {
display: block;
text-align: center;
font-size: 96px;
line-height: 1;
margin-bottom: 20px;
transition: color .4s ease-in-out 0s;
}
.lae-image-wrapper img {
display: block;
max-width: 100%;
text-align: center;
margin: 0 auto 25px;
transition: all .4s ease-in-out 0s;
}
.lae-service-text {
text-align: center;
max-width: 300px;
margin: 0 auto;
.lae-title {
@include lae-heading-style();
margin-bottom: 20px;
}
}
&:hover {
.lae-image-wrapper img {
transform: scale(0.9, 0.9);
}
}
}
}
/* Style 2 */
.lae-services-style2 {
.lae-service {
.lae-image-wrapper img, .lae-icon-wrapper span {
float: left;
margin-right: 18px;
}
.lae-icon-wrapper span {
font-size: 24px;
line-height: 32px;
}
.lae-service-text .lae-title {
@include lae-heading-style();
margin-bottom: 20px;
}
}
}
/* Style 3 */
.lae-services-style3 {
.lae-service {
.lae-icon-wrapper span {
display: block;
text-align: left;
font-size: 80px;
line-height: 1;
margin-bottom: 25px;
color: #555;
.lae-dark-bg & {
color: #c5c5c5;
}
}
.lae-image-wrapper img {
display: block;
max-width: 100%;
text-align: left;
margin-bottom: 25px;
}
.lae-service-text {
text-align: left;
max-width: 300px;
margin: 0;
font-size: 14px;
line-height: 32px;
color: #888;
ul.lae-services-list {
padding: 0;
margin: 0;
border: none;
}
ul.lae-services-list li {
border-bottom: 1px solid #eee;
position: relative;
padding: 0;
margin: 0;
list-style: none;
line-height: 42px;
&:hover {
padding: 0;
}
.lae-dark-bg & {
border-color: #333;
}
}
ul.lae-services-list li:before {
@include lae-icon-font();
position: relative;
display: inline-block;
height: auto;
width: auto;
background: none;
float: none;
vertical-align: middle;
margin: 0 15px 0 0;
content: "\e913";
color: #BBBBBB;
font-size: 12px;
line-height: 1;
.lae-dark-bg & {
color: #606060;
}
}
.lae-title {
@include lae-heading-style();
margin-bottom: 20px;
}
}
}
}
/* -------- General services -------- */
.lae-services {
clear: both;
.lae-service {
margin-bottom: 50px;
.lae-icon-wrapper span {
transition: color .4s ease-in-out 0s;
}
.lae-service-text {
font-size: 15px;
line-height: 24px;
.lae-dark-bg & {
color: #909090;
.lae-title {
color: #e5e5e5;
}
}
}
}
}
/* ---------------------------------- Posts Carousel ---------------------------------- */
.lae-posts-carousel {
clear: both;
max-width: none;
@include respond-to-min(1024) {
max-width: 96%;
}
.lae-posts-carousel-item {
.hentry {
background: #fff;
border-radius: 6px;
border: none;
padding: 0;
margin: 0;
transition: box-shadow .25s ease 0s;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
overflow: hidden;
&:hover {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}
}
.lae-project-image {
position: relative;
overflow: hidden;
img {
width: 100%;
display: block;
transition: all .4s ease-in-out 0s;
max-width: 100%;
}
&:hover {
img {
filter: brightness(50%);
}
}
.lae-image-info {
display: block;
text-align: center;
.lae-entry-info {
text-align: center;
display: block;
position: absolute;
top: 50%;
left: 0;
right: 0;
margin: auto;
max-width: 100%;
transform: translateY(-50%);
}
.lae-post-title {
padding: 10px;
margin: 0;
font-size: 22px;
line-height: 34px;
font-weight: 400;
color: #fff;
opacity: 0;
transition: opacity .4s ease-in-out 0s;
@include respond-to-max(1024) {
font-size: 18px;
line-height: 26px;
}
a {
display: inline;
color: #fff;
transition: all .3s ease-in-out 0s;
border-bottom: 1px solid transparent;
&:hover {
border-bottom: 2px solid #ccc;
}
}
}
.lae-terms {
display: block;
color: #f9f9f9;
font-size: 14px;
line-height: 22px;
opacity: 0;
transition: opacity .4s ease-in-out 0s;
a {
color: #ddd;
position: relative;
display: inline;
zoom: 1;
font-size: 14px;
line-height: 22px;
font-style: italic;
transition: all .4s ease-in-out 0s;
&:hover {
color: #fff;
}
}
}
}
&:hover {
.lae-image-info {
.lae-post-title, .lae-terms {
opacity: 1;
}
}
}
}
.lae-entry-text-wrap {
text-align: center;
max-width: 650px;
margin: 0 auto;
padding: 25px 15px;
.entry-title {
@include lae-heading-style();
font-size: 16px;
line-height: 24px;
margin-bottom: 10px;
&:after, &:before {
display: none;
}
a {
color: #333333;
transition: all .4s ease-in-out 0s;
&:hover {
color: #888;
}
}
}
.lae-entry-meta {
span {
display: inline-block;
padding: 0;
margin: 0;
font-style: italic;
color: #999;
a {
@include transition(all 0.3s ease-in-out 0s);
font-style: normal;
}
&:after {
content: '//';
padding-left: 6px;
padding-right: 6px;
}
&:first-child {
border: none;
padding-left: 0;
}
&:last-child:after{
display: none;
}
}
}
.entry-summary {
padding: 0;
margin: 10px auto 0;
&:before {
width: 35px;
height: 1px;
background: #aaa;
display: block;
content: "";
text-align: center;
margin: 0 auto 15px;
}
}
.lae-category-list {
@include bottom-line(35, 1, #aaa);
transition: all .4s ease-in-out 0s;
&:after {
text-align: center;
margin: 10px auto 10px;
}
}
.lae-category-list a {
font-style: italic;
transition: all .4s ease-in-out 0s;
}
}
.type-post .lae-entry-text-wrap .entry-summary:before {
display: none;
}
}
}
/* ---------------------------------- Portfolio/Posts Grid ---------------------------------- */
.lae-portfolio-wrap {
clear: both;
overflow: hidden;
.lae-portfolio-header {
position: relative;
max-width: 1140px;
margin: 0 auto 30px;
overflow: hidden;
clear: both;
display: flex;
flex-flow: row nowrap;
justify-content: space-between;
&.lae-no-heading {
justify-content: center;
}
@include respond-to-max(800) {
flex-flow: column wrap;
justify-content: flex-start;
}
}
.lae-heading {
display: inline-block;
text-align: left;
max-width: none;
font-size: 32px;
line-height: 44px;
text-transform: uppercase;
letter-spacing: 1px;
color: #333;
margin: 0 100px 0 0;
.lae-dark-bg & {
color: #e5e5e5;
}
@include respond-to-max(800) {
margin-bottom: 30px;
}
}
.lae-taxonomy-filter {
display: block;
margin: 0;
padding: 0;
@include align-self(center);
@include respond-to-max(800) {
@include align-self(flex-start);
}
.lae-filter-item {
position: relative;
display: inline-block;
margin: 0 0 15px 0;
padding: 0;
font-style: normal;
border-bottom: 1px solid #ddd;
.lae-dark-bg & {
border-color: #444;
}
a {
font-size: 15px;
line-height: 24px;
transition: all .4s ease-in-out 0s;
display: block;
color: #777;
padding: 0 15px 15px;
.lae-dark-bg & {
color: #999;
}
&:hover {
color: #222;
.lae-dark-bg & {
color: #fff;
}
}
@include respond-to-max(479) {
padding: 0 10px 8px;
}
}
&.lae-active {
a {
color: #222;
.lae-dark-bg & {
color: #fff;
}
}
&:after {
content: '';
position: absolute;
left: 0;
bottom: 0;
border-bottom: 3px solid #f94213;
width: 100%;
}
}
&:last-child {
margin-right: 0;
}
}
}
.lae-portfolio {
.lae-portfolio-item {
.hentry {
margin: 0;
padding: 0;
border: none;
background: none;
box-shadow: none;
}
.lae-project-image {
position: relative;
overflow: hidden;
img {
display: block;
width: 100%;
transition: all .4s ease-in-out 0s;
}
&:hover {
img {
filter: brightness(50%);
}
}
.lae-image-info {
display: block;
text-align: center;
.lae-entry-info {
text-align: center;
display: block;
position: absolute;
top: 50%;
left: 0;
right: 0;
margin: auto;
max-width: 100%;
transform: translateY(-50%);
}
.lae-post-title {
padding: 10px;
margin: 0;
font-size: 18px;
line-height: 28px;
font-weight: 400;
color: #fff;
opacity: 0;
transition: opacity .4s ease-in-out 0s;
@include respond-to-max(1024) {
font-size: 18px;
line-height: 26px;
}
a {
display: inline;
color: #fff;
transition: all .3s ease-in-out 0s;
border-bottom: 1px solid transparent;
&:hover {
border-bottom: 1px solid #ccc;
}
}
}
.lae-terms {
display: block;
color: #f9f9f9;
font-size: 14px;
line-height: 22px;
opacity: 0;
transition: opacity .4s ease-in-out 0s;
a {
color: #ddd;
position: relative;
display: inline;
zoom: 1;
font-size: 14px;
line-height: 22px;
font-style: italic;
transition: all .4s ease-in-out 0s;
&:hover {
color: #fff;
}
}
}
}
&:hover {
.lae-image-info {
.lae-post-title, .lae-terms {
opacity: 1;
}
}
}
}
.lae-entry-text-wrap {
text-align: center;
max-width: 650px;
margin: 20px auto 0;
}
.entry-title {
font-size: 18px;
line-height: 26px;
font-weight: normal;
margin-bottom: 10px;
&:after, &:before {
display: none;
}
a {
transition: all .4s ease-in-out 0s;
color: #333;
&:hover {
color: #888;
}
}
.lae-dark-bg & {
a {
color: #e0e0e0;
&:hover {
color: #fff;
}
}
}
}
.lae-entry-meta {
span {
display: inline-block;
padding: 0;
margin: 0;
font-style: italic;
color: #999;
&:after {
content: '//';
padding-left: 6px;
padding-right: 6px;
}
&:first-child {
border: none;
padding-left: 0;
}
&:last-child:after {
display: none;
}
a {
@include transition(all 0.3s ease-in-out 0s);
font-style: normal;
}
.lae-dark-bg & {
color: #707070;
}
}
}
.entry-summary {
margin: 15px auto 0;
padding: 0;
&:before {
width: 35px;
height: 1px;
background: #aaa;
display: block;
content: "";
text-align: center;
margin: 0 auto 15px;
}
.lae-dark-bg & {
color: #999;
&:before {
background: #505050;
}
}
}
}
}
}
/* ---------------------------------- Heading ---------------------------------- */
.lae-heading {
text-align: center;
margin: 0 auto 60px;
max-width: 640px;
@include respond-to-max(767) {
margin-bottom: 40px;
}
.lae-text {
font-size: 18px;
line-height: 28px;
margin: 0 auto;
@include respond-to-max(767) {
font-size: 15px;
line-height: 26px;
}
}
&.lae-alignleft, &.lae-alignright {
margin: 0;
.lae-text {
margin: 0;
}
}
&.lae-alignleft {
text-align: left;
}
&.lae-alignright {
text-align: right;
max-width: none;
}
}
.lae-heading {
.lae-title {
font-weight: 700;
font-size: 32px;
line-height: 42px;
margin: 0 auto 20px;
color: #333;
font-weight: bold;
@include respond-to-max(767) {
font-size: 24px;
line-height: 32px;
}
}
.lae-dark-bg & {
.lae-title {
color: #e5e5e5;
}
.lae-subtitle {
color: #B0B0B0;
}
.lae-text {
color: #909090;
}
}
&.lae-alignleft, &.lae-alignright {
.lae-title {
margin: 0 0 20px;
}
}
}
.lae-heading {
.lae-subtitle {
margin: 0 auto 5px;
color: #888;
font-size: 12px;
line-height: 20px;
text-transform: uppercase;
font-weight: 600;
letter-spacing: 2px;
position: relative;
display: inline-block;
padding: 0 10px;
@include respond-to-max(767) {
font-size: 11px;
line-height: 18px;
}
}
&.lae-alignleft, &.lae-alignright {
.lae-subtitle {
margin: 0 0 5px;
padding: 0;
&:before, &:after {
display: none;
}
}
}
}
.lae-heading.lae-style3 {
margin: 0 auto 30px;
.lae-title {
font-size: 22px;
line-height: 32px;
text-transform: uppercase;
letter-spacing: 1px;
@include bottom-line(35, 1, #aaa);
&:after {
margin: 10px auto 20px;
.lae-dark-bg & {
background: #909090;
}
}
@include respond-to-max(767) {
font-size: 16px;
line-height: 24px;
}
}
&.lae-alignleft, &.lae-alignright {
margin: 0 0 30px;
.lae-title:after {
margin: 10px 0 20px;
}
}
}
/* ---------------------------------- Clients Widget ---------------------------------- */
.lae-clients {
clear: both;
overflow: hidden;
margin: 0 auto;
.lae-client {
position: relative;
border-right: 1px solid #ddd;
border-bottom: 1px solid #ddd;
overflow: hidden;
.lae-dark-bg & {
border-color: #505050 !important;
}
&.lae-twocol:nth-child(6n + 1) {
border-left: 1px solid #ddd;
}
&.lae-twocol:nth-child(-n + 6) {
border-top: 1px solid #ddd;
}
&.lae-onefifth:nth-child(5n + 1) {
border-left: 1px solid #ddd;
}
&.lae-onefifth:nth-child(-n + 5) {
border-top: 1px solid #ddd;
}
&.lae-threecol:nth-child(4n + 1) {
border-left: 1px solid #ddd;
}
&.lae-threecol:nth-child(-n + 4) {
border-top: 1px solid #ddd;
}
&.lae-fourcol:nth-child(3n + 1) {
border-left: 1px solid #ddd;
}
&.lae-fourcol:nth-child(-n + 3) {
border-top: 1px solid #ddd;
}
&.lae-sixcol:nth-child(2n + 1) {
border-left: 1px solid #ddd;
}
&.lae-sixcol:nth-child(-n + 2) {
border-top: 1px solid #ddd;
}
@include respond-to-max(800) {
&.lae-twocol:nth-child(n), &.lae-threecol:nth-child(n), &.lae-fourcol:nth-child(n), &.lae-onefifth:nth-child(n), &.lae-sixcol:nth-child(n) {
border-left: none;
border-top: none;
width: 50%;
float: left;
}
&.lae-twocol:nth-child(2n + 1), &.lae-threecol:nth-child(2n + 1), &.lae-fourcol:nth-child(2n + 1), &.lae-onefifth:nth-child(2n + 1), &.lae-sixcol:nth-child(2n + 1) {
border-left: 1px solid #ddd;
}
&.lae-twocol:nth-child(-n + 2), &.lae-threecol:nth-child(-n + 2), &.lae-fourcol:nth-child(-n + 2), &.lae-onefifth:nth-child(-n + 2), &.lae-sixcol:nth-child(-n + 2) {
border-top: 1px solid #ddd;
}
}
img {
-webkit-transition: all 0.3s ease-in-out 0s;
-moz-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s;
width: 100%;
margin: 0;
display: block;
}
.lae-client-name {
position: absolute;
z-index: 2;
top: 50%;
left: 0;
text-align: center;
width: 100%;
height: 100%;
margin-top: -12px;
color: #fff;
font-size: 18px;
line-height: 26px;
transition: opacity .4s ease-in-out 0s;
opacity: 0;
a {
color: #fff;
text-decoration: none;
}
}
.lae-image-overlay {
position: absolute;
left: 0;
top: 0;
overflow: hidden;
width: 100%;
height: 100%;
background: #000;
filter: alpha(opacity=0);
-moz-opacity: 0;
opacity: 0;
transition: opacity .4s ease-in-out 0s;
}
&:hover {
.lae-image-overlay {
opacity: 0.7;
.lae-dark-bg & {
opacity: 0.8;
}
}
.lae-client-name {
opacity: 1;
}
}
}
}
/* ---------------------------------- Generic Carousel Widget ---------------------------------- */
.lae-carousel .lae-carousel-item {
position: relative;
}
.lae-carousel.lae-container {
max-width: none;
}
/* ---------------------------------- Button Widget ---------------------------------- */
input.lae-button.lae-with-icon, button.lae-button.lae-with-icon, a.lae-button.lae-with-icon, .lae-button.lae-with-icon:active, .lae-button.lae-with-icon:visited {
span, img.lae-thumbnail {
margin-right: 15px;
}
span {
color: #fff;
font-size: 24px;
vertical-align: middle;
line-height: 1;
}
img.lae-thumbnail {
display: inline !important;
vertical-align: middle;
max-width: 50px;
}
}