File: /var/www/html/wpmuhibbah_err/wp-content/themes/goodwish/assets/css/scss/_global.scss
/* #Reset default styles - start
========================================================================== */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,
ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{
background: transparent;
border: 0;
margin: 0;
padding: 0;
vertical-align: baseline;
outline: none;
}
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
display: block;
}
blockquote {
quotes: none;
}
blockquote:before,blockquote:after {
content: '';
content: none;
}
del {
text-decoration: line-through;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
border: medium none;
vertical-align: middle;
margin: 20px 0;
}
table th{
border: 0;
padding: 16px 7px;
text-align: center;
}
table td {
padding: 5px 10px;
text-align: center;
}
a img {
border: none;
}
img,.wp-caption{
max-width: 100%;
height: auto;
}
iframe {
max-width: 100%;
}
/* #Reset default styles - end
========================================================================== */
/* #General styles that are used in our theme - start
* Here are defined global styles on body element, on container elements that hold every page,
* headings and links, inputs, core wp styles and default pagination styles
========================================================================== */
.clearfix:before,
.clearfix:after {
content: " "; /* 1 */
display: table; /* 2 */
}
.clearfix:after {
clear: both;
}
.clearfix {
*zoom: 1;
}
.clear:after {
clear: both;
content: "";
display: block;
}
html {
height: 100%;
margin: 0 !important;
@include edgtfTransition(all 0.33s ease-out);
overflow-y: scroll !important; /* to prevent page jumping on ajax and when there is not enough content */
}
body {
font-family: 'Open Sans', sans-serif;
font-size: 14px;
line-height: 26px;
color: $default-text-color;
font-weight: 400;
background-color: $default-background-color;
overflow-x: hidden !important;
-webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5{
font-family: $default-heading-font;
color: $default-heading-color;
font-weight: 700;
}
h1 {
font-size: 60px;
line-height: 1.0834em; /* 65px/60px */
}
h2 {
font-size: 35px;
line-height: 1.2em; /* 42px/35px */
}
h3 {
font-size: 22px;
line-height: 1.364em; /* 30px/22px */
}
h4,
h4.ui-helper-reset{
font-size: 18px;
line-height: 1.445em; /* 26px/18px */
}
h5 {
font-size: 15px;
line-height: 1.333em; /* 20px/15px */
}
h6 {
font-size: 14px;
color: $default-heading-color;
line-height: 1.429em; /* 20px/14px */
font-family: $default-heading-font;
font-weight: 700;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a{
@include edgtfTypographyLayout();
}
h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover,
h5 a:hover,
h6 a:hover{
color: $first-main-color;
}
a,
p a {
color: $first-main-color;
text-decoration: none;
cursor: pointer;
-webkit-transition: color 0.15s ease-out;
-moz-transition: color 0.15s ease-out;
-o-transition: color 0.15s ease-out;
-ms-transition: color 0.15s ease-out;
transition: color 0.15s ease-out;
}
p {
margin: 0 0 25px;
}
input[type='submit'],
.woocommerce input[type='button'],
.woocommerce-page input[type='button'] {
-webkit-appearance: none;
}
ul, ol {
list-style-position:inside;
margin: 15px 0;
}
ul ul,
ol ol,
ol ul,
ul ol {
margin: 0;
padding: 0 0 0 15px;
}
pre {
background-color: $default-background-color;
padding: 15px;
max-width: 100%;
white-space: pre-wrap;
word-wrap: break-word;
margin: 15px 0;
}
dt {
font-size: 15px;
font-weight: 700;
margin-bottom: 10px;
}
dd {
margin-bottom: 15px;
}
sub, sup {
font-size: 75%;
height: 0;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
top: 0.5ex;
}
sup {
bottom: 0.5ex;
}
.wp-caption-text {
margin: 0;
font-style: italic;
}
table {
width: 100%;
}
table thead tr, table tbody tr {
border: 1px solid $default-border-color;
}
table tbody th {
border-right: 1px solid $default-border-color;
}
blockquote:not(.edgtf-blockquote-shortcode) {
padding: 0;
border: none;
font-style: italic;
font-size: 17px;
line-height: 1.6em;
margin: 20px 0;
}
blockquote cite {
font-style: normal;
font-weight: 500;
}
/* Webkit */
::selection {
background: $first-main-color;
color: $default-background-color;
}
/* Gecko/Mozilla */
::-moz-selection {
background: $first-main-color;
color: $default-background-color;
}
.wp-caption,
.wp-caption-text,
.sticky,
.gallery-caption,
.bypostauthor{
opacity: 1;
}
.alignleft {
float: left;
margin: 0 20px 20px 0;
}
.alignright {
float: right;
margin: 0 0 20px 20px;
}
.aligncenter {
display: block;
margin: 10px auto;
}
.text-align-right {
text-align: right;
}
.text-align-left {
text-align: left;
}
.text-align-center {
text-align: center;
}
a.vc_single_image-wrapper {
position:relative;
&:after {
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
@include edgtfTransition(background 0.3s cubic-bezier(0.4, 0.87, 0.4, 0.87));
}
&:hover {
&:after {
background:rgba(48, 39, 28, 0.3);
}
}
}
.edgtf-wrapper {
background-color: $default-background-color;
position: relative;
z-index: 1000;
@include edgtfTransition(left 0.33s cubic-bezier(0.694, 0.0482, 0.335, 1));
left: 0px;
.edgtf-wrapper-inner{
width: 100%;
overflow: hidden;
}
}
.edgtf-meta {
display: none;
}
.edgtf-full-width-inner,
.edgtf-container-inner,
.edgtf-elementor-container-inner > .elementor-container {
> h1, > h2, > h3 {
margin: 15px 0;
}
> h4, > h5, > h6 {
margin: 10px 0;
}
> table{
margin: 15px 0 25px;
}
}
.edgtf-content{
margin-top: 0;
position: relative;
z-index: 100;
background-color: $default-background-color; /*this is needed because of the uncovering footer*/
}
/*visual composer override styles*/
.wpb_row, .wpb_content_element,
ul.wpb_thumbnails-fluid > li,
.last_toggle_el_margin, .wpb_button {
margin-bottom: 0 !important; // important is in order to prevent visual composer styles in all cases
}
.edgtf-content{
.edgtf-content-inner > .edgtf-container > .edgtf-container-inner,
.edgtf-content-inner > .edgtf-full-width > .edgtf-full-width-inner{
padding: 30px 0;
}
}
.edgtf-boxed{
overflow: hidden !important; /* this is because content jumping while using accordion and display:inline-block on 'body.edgtf-boxed .edgtf-wrapper' */
.edgtf-wrapper{
display: inline-block;
vertical-align: middle;
width: 100%;
.edgtf-wrapper-inner {
width: $grid-width-boxed;
overflow: visible;
margin: auto;
}
}
.edgtf-content {
overflow: hidden;
}
.edgtf-footer-inner{
width: $grid-width-boxed;
margin: auto;
}
.edgtf-page-header .edgtf-sticky-header,
.edgtf-page-header .edgtf-fixed-wrapper.fixed{
width: $grid-width-boxed;
left: auto;
}
}
.edgtf-smooth-transition-loader {
position: fixed;
top: 0; left: 0; right: 0; bottom: 0;
z-index: 2000;
&.edgtf-hide-spinner {
.edgtf-st-loader {
display: none;
}
}
}
.edgtf-container{
background-color: #fff; //beacuse of the Edge Slider, since content have to go over it
position: relative;
padding: 0;
width: 100%;
z-index:100;
&:before{
content: " ";
display: table;
}
&:after{
content: " ";
display: table;
clear: both;
}
}
.edgtf-container-inner,
.edgtf-elementor-container-inner > .elementor-container { //not in parent selector since this class is used for positioning other elements in grid
width: $grid-width;
margin: 0px auto;
}
.edgtf-full-width {
position: relative;
z-index: 100;
}
@media only screen and (min-width: 1400px){
.edgtf-grid-1300{
.edgtf-grid,
.edgtf-container-inner,
.edgtf-elementor-container-inner > .elementor-container,
.edgtf-grid-section .edgtf-section-inner,
.edgtf-footer-top-border-holder.edgtf-in-grid,
.edgtf-footer-bottom-border-holder.edgtf-in-grid{
width: $grid-width-1300;
}
}
.edgtf-grid-1300.edgtf-boxed{
.edgtf-footer-inner,
.edgtf-wrapper-inner{
width: $grid-width-1300 + 50px;
}
.edgtf-page-header .edgtf-sticky-header,
.edgtf-page-header .edgtf-fixed-wrapper.fixed{
width: $grid-width-1300 + 50px;
left: auto;
}
}
}
@media only screen and (min-width: 1300px){
.edgtf-grid-1200{
.edgtf-grid,
.edgtf-container-inner,
.edgtf-elementor-container-inner > .elementor-container,
.edgtf-grid-section .edgtf-section-inner,
.edgtf-footer-top-border-holder.edgtf-in-grid,
.edgtf-footer-bottom-border-holder.edgtf-in-grid{
width: $grid-width-1200;
}
}
.edgtf-grid-1200.edgtf-boxed{
.edgtf-footer-inner,
.edgtf-wrapper-inner{
width: $grid-width-1200 + 50px;
}
.edgtf-page-header .edgtf-sticky-header,
.edgtf-page-header .edgtf-fixed-wrapper.fixed{
width: $grid-width-1200 + 50px;
left: auto;
}
}
}
@media only screen and (min-width: 1200px){
.edgtf-grid-1000{
.edgtf-grid,
.edgtf-container-inner,
.edgtf-elementor-container-inner > .elementor-container,
.edgtf-grid-section .edgtf-section-inner,
.edgtf-footer-top-border-holder.edgtf-in-grid,
.edgtf-footer-bottom-border-holder.edgtf-in-grid{
width: $grid-width-1000;
}
}
.edgtf-grid-1000.edgtf-boxed{
.edgtf-footer-inner,
.edgtf-wrapper-inner{
width: $grid-width-1000 + 50px;
}
.edgtf-page-header .edgtf-sticky-header,
.edgtf-page-header .edgtf-fixed-wrapper.fixed{
width: $grid-width-1000 + 50px;
left: auto;
}
}
}
@media only screen and (min-width: 1000px){
.edgtf-grid-800{
.edgtf-grid,
.edgtf-container-inner,
.edgtf-elementor-container-inner > .elementor-container,
.edgtf-grid-section .edgtf-section-inner,
.edgtf-footer-top-border-holder.edgtf-in-grid,
.edgtf-footer-bottom-border-holder.edgtf-in-grid{
width: $grid-width-800;
}
}
.edgtf-grid-800.edgtf-boxed{
.edgtf-footer-inner,
.edgtf-wrapper-inner{
width: $grid-width-800 + 50px;
}
.edgtf-page-header .edgtf-sticky-header,
.edgtf-page-header .edgtf-fixed-wrapper.fixed{
width: $grid-width-800 + 50px;
left: auto;
}
}
}
/* #General styles that are used in our theme - end
========================================================================== */
/* #Grid system styles - start
* Here are defined styles for grid system that is used outside Visual Composer
========================================================================== */
.edgtf-two-columns-66-33{
width: 100%;
.edgtf-column1 {
width: 66.66%;
float: left;
.edgtf-column-inner {
padding: 0 20px 0 0;
}
}
.edgtf-column2 {
width: 33.33%;
float: left;
.edgtf-column-inner{
padding: 0 0 0 20px;
}
}
}
.edgtf-two-columns-33-66{
width: 100%;
.edgtf-column1{
width: 33.33%;
float: left;
.edgtf-column-inner{
padding: 0 20px 0 0;
}
}
.edgtf-column2{
width: 66.66%;
float: left;
.edgtf-column-inner{
padding: 0 0 0 20px;
}
}
}
.edgtf-two-columns-75-25{
width: 100%;
.edgtf-column1{
width: 75%;
float: left;
.edgtf-column-inner{
padding: 0 20px 0 0;
}
}
.edgtf-column2{
width: 25%;
float: left;
.edgtf-column-inner{
padding: 0 0 0 20px;
}
}
}
.edgtf-two-columns-25-75{
width: 100%;
.edgtf-column1{
width: 25%;
float: left;
.edgtf-column-inner{
padding: 0 20px 0 0;
}
}
.edgtf-column2{
width: 75%;
float: left;
.edgtf-column-inner{
padding: 0 0 0 20px;
}
}
}
.edgtf-two-columns-50-50{
width: 100%;
> .edgtf-two-columns-50-50-inner{
margin: 0 -15px;
}
.edgtf-column{
width: 50%;
float: left;
.edgtf-column-inner{
padding: 0 15px;
}
}
}
.edgtf-three-columns {
width: 100%;
> .edgtf-three-columns-inner{
margin: 0 -15px;
}
.edgtf-column{
width: 33.33%;
float: left;
.edgtf-column-inner{
padding: 0 15px;
}
}
}
.edgtf-four-columns{
width: 100%;
> .edgtf-four-columns-inner{
margin: 0 -15px;
}
.edgtf-column{
width: 25%;
float: left;
.edgtf-column-inner{
padding: 0 15px;
}
}
}
.edgtf-five-columns{
width: 100%;
> .edgtf-five-columns-inner{
margin: 0 -15px;
}
.edgtf-column{
width: 20%;
float: left;
.edgtf-column-inner{
padding: 0 15px;
}
}
}
.edgtf-has-sidebar{
&.edgtf-two-columns-66-33,
&.edgtf-two-columns-75-25 {
.edgtf-column1 .edgtf-column-inner{
padding-right: 30px;
}
}
&.edgtf-two-columns-66-33,
&.edgtf-two-columns-75-25 {
.edgtf-column2 .edgtf-column-inner{
padding-left: 30px;
}
}
&.edgtf-has-sidebar-left {
.edgtf-column1 {
float: right;
.edgtf-column-inner{
padding-left: 30px;
padding-right: 0;
}
}
.edgtf-column2 {
float: left;
.edgtf-column-inner{
padding-right: 30px;
padding-left: 0;
}
}
}
}
body.woocommerce.woocommerce-page{
.edgtf-two-columns-66-33.woocommerce_with_sidebar .edgtf-column1 .edgtf-column-inner,
.edgtf-two-columns-75-25.woocommerce_with_sidebar .edgtf-column1 .edgtf-column-inner{
padding-left: 40px;
}
.edgtf-two-columns-33-66.woocommerce_with_sidebar .edgtf-column2 .edgtf-column-inner,
.edgtf-two-columns-25-75.woocommerce_with_sidebar .edgtf-column2 .edgtf-column-inner{
padding-right: 40px;
}
.full_width{
.edgtf-two-columns-66-33.woocommerce_with_sidebar .edgtf-column1 .edgtf-column-inner,
.edgtf-two-columns-75-25.woocommerce_with_sidebar .edgtf-column1 .edgtf-column-inner{
padding-left: 0;
}
.edgtf-two-columns-33-66.woocommerce_with_sidebar .edgtf-column2 .edgtf-column-inner,
.edgtf-two-columns-25-75.woocommerce_with_sidebar .edgtf-column2 .edgtf-column-inner{
padding-right: 0;
}
}
}
/* #Grid system styles - end
========================================================================== */
@include keyframes(preload-background) {
from { background-position: 0 0; }
to { background-position: 100% 0; }
}
.edgtf-preload-background{
background-repeat: repeat !important;
background-color: transparent !important;
background-attachment: scroll !important;
background-size: inherit !important;
@include animation(preload-background, 40s, infinite, linear, 0s);
}
.edgtf-grid{
width: $grid-width;
margin: 0 auto;
}
.edgtf-vertical-align-containers {
position: relative;
height: 100%;
width: 100%;
padding: 0 25px;
box-sizing: border-box;
&.edgtf-25-50-25 {
.edgtf-position-left,
.edgtf-position-right {
width: 25%;
}
.edgtf-position-center {
width: 50%;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.edgtf-position-left-inner,
.edgtf-position-center-inner,
.edgtf-position-right-inner {
width: 98%;
}
}
&.edgtf-33-33-33 {
.edgtf-position-left,
.edgtf-position-center,
.edgtf-position-right {
width: 33.33%;
}
.edgtf-position-center {
width: 50%;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.edgtf-position-left-inner,
.edgtf-position-center-inner,
.edgtf-position-right-inner {
width: 98%;
}
}
&.edgtf-50-50 {
.edgtf-position-left,
.edgtf-position-right {
width: 50%;
}
.edgtf-position-left-inner,
.edgtf-position-center-inner,
.edgtf-position-right-inner {
width: 98%;
}
}
.edgtf-position-left {
position: relative;
float: left;
z-index: 2;
height: 100%;
}
.edgtf-position-center {
height: 100%;
width: 100%;
position: absolute;
left: 0;
text-align: center;
z-index: 1;
}
.edgtf-position-right {
position: relative;
float: right;
z-index: 2;
height: 100%;
text-align: right;
}
.edgtf-position-left-inner,
.edgtf-position-center-inner,
.edgtf-position-right-inner {
vertical-align: middle;
display: inline-block;
}
.edgtf-position-right.edgtf-has-widget .edgtf-position-right-inner{
height: 100%;
}
.edgtf-position-left:before,
.edgtf-position-center:before,
.edgtf-position-right:before {
content: "";
display: inline-block;
vertical-align: middle;
height: 100%;
margin-right: -3px; /* adjusts for spacing */
}
}
/* ==========================================================================
#Row styles - start
========================================================================== */
.edgtf-section {
position:relative;
}
.edgtf-grid-section .edgtf-section-inner {
width: $grid-width;
margin: 0 auto;
position: relative;
z-index: 20;
}
.edgtf-section-inner-margin{
margin-left: -15px;
margin-right: -15px;
}
.edgtf-content-aligment-left {
text-align: left;
}
.edgtf-content-aligment-center {
text-align: center;
}
.edgtf-content-aligment-right {
text-align: right;
}
/* #Parallax section styles - start
========================================================================== */
.edgtf-lighter-effect {
position: absolute;
z-index: 20;
display:block;
&.edgtf-lighter-effect-top {
top: -26px;
}
&.edgtf-lighter-effect-bottom {
bottom: -26px;
@include edgtfTransform(rotate(180deg));
}
path{
fill: #fff;
}
}
/* #Parallax section styles - start
========================================================================== */
.edgtf-parallax-section-holder{
position: static;
padding: 0px;
background-repeat: no-repeat;
background-color: transparent;
background-position: center 0px;
background-attachment: fixed;
overflow: hidden;
transition: none !important;
&.edgtf-vertical-middle-align{
display: table;
width: 100%;
margin-right: 0;
margin-left: 0;
}
.edgtf-parallax-content-outer{
display: table-cell;
height: 100%;
vertical-align: middle;
padding: 100% 0;
}
.touch &.edgtf-parallax-section-holder-touch-disabled{
height: auto !important;
min-height: 200px;
background-position: center top !important;
background-attachment: scroll;
background-size: cover;
}
}
section.parallax_section_holder.vertical_middle_align .parallax_content_outer{
display: table-cell;
height: 100%;
vertical-align: middle;
padding: 100% 0;
}
/* #Video section styles - start
========================================================================== */
.edgtf-section {
.edgtf-mobile-video-image {
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
display: none;
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: 10;
}
.edgtf-video-overlay {
height: 100%;
left: 0;
opacity: 0;
position: absolute;
top: 0;
width: 100%;
z-index: 11;
&.edgtf-video-overlay-active {
background-image: url("img/pixel-video.png");
background-position: 0px 0px;
background-repeat: repeat;
opacity: 1;
}
}
.edgtf-video-wrap {
top: 0px;
left: 0px;
overflow: hidden;
position: absolute;
width: 100%;
z-index: 10;
.mejs-offscreen {
display: none;
}
.mejs-container .mejs-controls {
display: none!important;
}
.mejs-poster {
background-size: cover !important;
-moz-background-size: cover !important;
-webkit-background-size: cover !important;
-o-background-size: cover !important;
}
.mejs-container {
background-color: transparent!important;
background-image: none!important;
height: auto !important;
width: 100% !important;
}
.mejs-mediaelement{
background: none !important;
border: 0px !important;
}
.mejs-container .mejs-poster img {
max-width: none!important;
width: 100%!important;
}
}
.edgtf-row-box {
padding:55px 85px 80px;
margin-left: -100px;
margin-right: -100px;
}
.edgtf-row-overlap {
margin-top: -150px;
}
.edgtf-row-overlap.edgtf-row-overlap-small {
margin-top: -65px;
}
}
/* ==========================================================================
#Row styles - end
========================================================================== */
.ui-helper-reset{
line-height: inherit;
}