Skip to content

Instantly share code, notes, and snippets.

@mistergraphx
Created March 26, 2020 16:17
Show Gist options
  • Save mistergraphx/b3dbf270fd32bdceff53557468a2932d to your computer and use it in GitHub Desktop.
Save mistergraphx/b3dbf270fd32bdceff53557468a2932d to your computer and use it in GitHub Desktop.
A collection of never do that again !!
/*
Theme Name: Orio Child
Theme URI: http://www.spab-rice.com/themes
Description: Orio child Theme.
Version: 1.0
Author: Spab Rice
Author URI: http://www.spab-rice.com
Tags: portfolio
Template: orio
Text Domain: orio-child
*/
/* -----------------------------------
CHILD CSS
------------------------------------- */
@import url('https://fonts.googleapis.com/css?family=Muli:200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&display=swap');
@import url('https://fonts.googleapis.com/css?family=Zilla+Slab:300,300i,400,400i,500,500i,600,600i,700,700i&display=swap');
html {
padding-top: 0 !important;
}
body {
font-family: "Muli";
font-weight: 400;
font-size: 20px;
line-height: 1.6;
}
body.limit-big #page-body,
body.limit-big #hero,
body.limit-big .fullwidth-section.forcefullwidth .fullwidth-content {
max-width: calc(1300px - 60px);
}
// body.limit-big #page-body,
// body.limit-big .fullwidth-section.forcefullwidth .fullwidth-content,
// body.limit-big #hero {
// max-width: 100%;
// }
body.limit-big .fullwidth-section.forcefullwidth .fullwidth-content {
width: 100%;
}
#hero.hero-text-nobg #page-title {
padding: 0 30px;
}
.fullwidth-section .fullwidth-content {
padding: 80px 0;
}
body {
#page-body,
&.limit-big #page-body,
&.limit-big #hero {
width: 100%;
max-width: calc(1300px - 60px);
//padding: 0 !important;
}
}
body {
#header.sticky .header-inner {
max-width: 1280px;
}
}
#page-title h2,
#page-title h1,
#page-title .h2,
#page-title .h1 {
max-width: 100%;
}
#id-hero-agency {
.fullwidth-section {
background-color: transparent;
img{
max-width: 1020px;
}
}
}
canvas {
position: absolute;
background-color: #FFFFFF;
left: 0;
top: 0;
bottom: 0;
width: auto;
height: auto;
min-width: 100%;
min-height: 100%;
}
.gradient{
width:100%!important;
height:100%!important;
position:absolute;
top:0;height:0;
background:linear-gradient( rgba(255,255,255,0), rgba(255,255,255,1)) }
body{margin:0;Padding:0}
h3{
text-transform: none;
margin: 36px 0 20px;
}
.kl-section-rows-hide + .kl-section-rows-hide {
margin-top: 80px;
}
.isotope-item {
//margin-top: 0 !important;
}
h4.post-cat a.cat-link {
color: #ff566f !important;
text-transform: uppercase;
}
h4.post-cat {
color: #ff566f !important;
text-transform: uppercase;
font-size: 16px;
font-weight: 700;
letter-spacing: .8px;
}
.blog-item .blog-info .info-bottom h4 {
font-size: 18px;
font-weight: 700;
color: #999999;
line-height: 36px;
letter-spacing: .8px;
}
#header .header-inner {
width: calc(100% - 100px);
}
header#header.kl-hero-dark {
top: 0px !important;
position: absolute !important;
.menu-language a {
color: #ffffff;
}
}
@media only screen and (max-width: 1199px){
.welcomekit-department h2:not(.widget-title):not(#reply-title), .h2 {
font-size: 22px !important;
line-height: 30px !important;
margin: 1px 0 0;
}
.welcomekit-department h3:not(.widget-title):not(#reply-title), .h3 {
font-size: 24px !important;
line-height: 1 !important;
}
}
#page-title > h1 {
color: #999999;
}
#page-title h2,
#page-title h1,
#page-title .h2,
#page-title .h1 {
font-weight: 400;
font-size: 56px;
line-height: 60px;
text-transform: none;
max-width: 55%;
margin: 10px 0;
color: #999999;
}
body.single #page-title h2,
body.single #page-title h1,
body.single #page-title .h2,
body.single #page-title .h1 {
//color: #000000;
}
#page-title h2 strong,
#page-title h2 b {
font-weight: inherit;
}
#page-title > h1 em,
#page-title > h2 em,
#page-title > .h2 em,
#page-title > .h1 em {
color: #000;
font-style: normal;
display: block;
}
ul#filters {
display: flex;
align-items: center;
padding: 0;
margin: 0 -25px 50px;
flex-wrap: wrap;
position: relative;
z-index: 2;
>li {
margin: 0 20px;
list-style: none;
position: relative;
&.disabled {
opacity: .3;
}
.kl-item {
text-transform: uppercase;
font-size: 16px;
font-weight: 600;
color: #999999;
letter-spacing: .8px;
padding-right: 20px;
.fa {
color: #999999;
position: absolute;
right: 0;
top: 50%;
margin: -6px 0 0 10px;
}
.fa-spinner {
display: none;
}
&:hover {
background-color: transparent;
color: #ff566f!important
}
}
&:hover {
.sub-terms {
transform: scaleY(1);
}
.fa:not(.fa-spin) {
transform: rotate(90deg);
color: #ff566f;
}
}
.sub-terms {
z-index: 2;
transform-origin: top;
transform: scaleY(0);
margin: 0 0 0 -40px;
padding: 20px 40px 20px;
position: absolute;
top: 100%;
left: 0;
min-width: calc(100% + 40px);
background: #ffffff;
box-shadow: 3px 6px 6px rgba(0,0,0,.1);
li {
list-style: none;
line-height: 1;
}
a, span{
text-transform: uppercase;
font-size: 16px;
font-weight: 600;
color: #999999;
letter-spacing: .8px;
padding-right: 20px;
white-space: nowrap;
}
a:hover {
color: #ff566f;
opacity: 1;
}
}
}
}
#hero.hero-text-nobg #page-title {
margin: 0 0 60px;
}
nav#main-nav ul > li.current-page-ancestor > a,
nav#main-nav ul > li.current_page_parent > a {
color: #000000;
&::after {
width: 6px;
height: 6px;
border-radius: 10px;
top: -1px;
right: -8px;
}
}
#id-content-portfolio .column-section {
margin-top: 0;
margin-bottom: 50px !important;
}
#page-title .post-cat + .post-name, #page-title .post-cat + .title-alt {
margin: 10px 0;
}
#filters li.active a,
#filters li:hover.active a {
color: #FF566F!important;
}
#blog-single .blog-media {
width: 100%;
}
#blog-single .blog-media img {
width: 100%;
}
.blog-item .blog-info .post-name {
line-height: 40px;
font-weight: 600;
margin: 0;
font-size: 26px;
}
#page-title .post-cat, #page-title .post-date, #page-title .meta-author {
font-size: 16px;
line-height: 34px;
font-weight: 600;
letter-spacing: .8px;
}
.kl-breadcrumbs {
color: rgba(0,0,0,0.35);
}
.kl-breadcrumbs .fa {
margin: 0 3px 0 10px;
font-size: 6px;
position: relative;
top: -1px;
color: #a6a6a6;
}
.blog-media {
margin: 0 0 35px;
}
#page-body > h4 + h3 {
margin: 30px 0 25px;
}
#page-body h4 {
color: #999999;
}
div#page-title > h4 {
color: #999999;
a{
font-size: inherit;
margin-right: 15px;
padding-right: 25px;
position: relative;
&:after {
content: "";
position: absolute;
height: 5px;
width: 5px;
top: 50%;
right: 0;
margin-top: -2.5px;
background-color: #000000;
border-radius: 50%;
}
}
}
#page-title h1 strong,
#page-title h1 b {
font-weight: inherit;
}
.wpcf7-form-control.wpcf7-file {
width: auto;
height: auto;
display: block;
text-indent: -9999em;
background: red;
border: 0;
padding: 10px 15px;
text-align: left;
}
.jsFile-upload-hidden {
display: none;
visibility: hidden;
position: absolute;
left: -9999px;
}
.jsFile-upload {
display: block;
width: auto;
font-size: 16px;
margin-top: 15px;
}
.jsFile-upload label {
display: block;
margin-bottom: 5px;
}
.wrapper {
position: relative;
margin-bottom: 5px;
}
.upload-input {
width: 300px;
color: #fff;
font-size: 16px;
padding: 11px 17px;
border: none;
background-color: #0077aa;
-moz-transition: all 0.2s ease-in;
-o-transition: all 0.2s ease-in;
-webkit-transition: all 0.2s ease-in;
transition: all 0.2s ease-in;
float: left;
}
.upload-input:hover, .upload-input:focus {
background-color: #0069aa;
outline: none;
}
.upload-button {
position: absolute;
height: 52px;
width: 22px;
padding: 0;
border-radius: 0 !important;
left: 0;
top: 50%;
margin: -30.5px 0 0;
background: url(images/trombone.png) no-repeat top center;
background-size: 100%;
}
.upload-button:hover {
opacity: .8;
background: url(images/trombone.png) no-repeat top center;
background-color: transparent;
background-size: 100%;
}
input[type="text"].upload-input {
margin: 0 0 0 60px;
border: none;
}
input[type="text"].upload-input:focus,
input[type="text"].upload-input:hover {
background-color: transparent;
}
.d-flex {
margin-top: 40px;
display: flex;
align-items: center;
justify-content: space-between;
position: relative;
}
body.loader-dot div.wpcf7 .d-flex .ajax-loader {
position: absolute;
height: 30px;
width: 30px;
right: 0;
top: 50%;
margin: -15px 0 0;
}
#hero.no-bg #page-title {
padding: 0 0 40px;
}
#hero.hero-text-nobg #page-title {
margin: 0 0 65px;
}
#id-nosprix {
h2{
margin: 0 0 15px;
}
p{
font-size: 15px;
}
h6{
font-size: 12px;
}
}
#page-body .team-infos {
margin-top: 14px;
h4 {
margin: 0 0 8px;
}
}
.hidden-rows {
padding: 80px 0 0;
}
.one-fourth .col-content h3 {
font-size: 28px;
line-height: 1;
margin: 0;
}
#id-nous-faison .one-fourth .col-content h3 span {
font-weight: 300;
}
#page-title > h4 + h1 {
margin-top: 10px;
}
.wpcf7-response-output {
/*opacity: 1;*/
/*visibility: visible;*/
}
.thumb-hover .overlay-caption {
position: absolute;
height: 100%;
text-align: left;
margin: 0;
left: 0;
align-items: start;
flex-direction: column;
width: 50%;
padding: 20px 5%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
z-index: 2;
}
#header .header-inner {
padding: 40px 0 !important;
background-color: #ffffff;
}
#header {
transition: all .4s ease;
background: #ffffff;
}
.caption-sub + .caption-name, .caption-name + .caption-sub{
margin-top: 0;
}
.d-flex {
display: flex;
}
.mt-auto {
margin-top: auto !important;
}
.mb-auto {
margin-bottom: auto !important;
}
.thumb-hover .overlay-caption .caption-name {
margin: auto 0 0;
color: #c2c2c2;
font-weight: bold;
font-size: 16px;
}
.thumb-hover .overlay-caption .caption-sub {
margin-bottom: auto !important;
}
.btn-6,
h6.content-btn:not(.product-name) > a {
color: #ffffff !important;
padding: 20px 30px;
background: #ff566f;
border-radius: 5px!important;
font-family: Muli;
font-weight: 700;
letter-spacing: 0.1em;
text-transform: uppercase;
position: relative;
padding-right: 56px;
}
.btn-6,
h6.content-btn:not(.product-name) > a:hover {
color: #ffffff !important;
opacity: .8;
}
/*h6.content-btn:not(.product-name) > a:after {
content: "";
position: absolute;
height: 12px;
width: 21px;
top: 50%;
right: 23px;
background: url(images/arrow-right.png) no-repeat top center;
background-size: 100%;
margin-top: -6px;
}*/
#footer {
h4{
font-size: 13px;
}
p.p1 {
font-size: 20px;
line-height: 1.8;
}
}
#hero.hero-text-nobg #page-title {
width: 100% !important;
margin: 0 0 50px;
padding: 0;
max-width: unset;
}
body.limit-big #hero.hero-text-nobg {
background-color: transparent;
}
.kl-file-content {
bottom: 0;
padding: 0 250px 0 72px;
width: 100%;
box-sizing: border-box;
position: relative;
margin: 56px 0 0;
min-height: 50px;
}
.kl-file-content >div:not(#mfcf7_zl_multifilecontainer) {
position: absolute;
right: 0;
top: 0;
}
.kl-file-content {
.kl-placeholder {
font-size: 16px;
color: #999999;
margin: 9px 0 0;
display: inline-block;
}
}
div#mfcf7_zl_multifilecontainer {
margin-top: 0;
position: relative;
top: 9px;
min-height: 40px;
}
span.mfcf7-zl-multifile-name > span {
display: block;
font-size: 16px;
line-height: 1.2;
text-overflow: initial;
word-break: break-word;
}
span.mfcf7-zl-multifile-name > span + span {
margin-top: 5px;
}
#id-seenk {
.spacer.spacer-medium {
height: 40px;
}
}
input#mfcf7_zl_add_file {
// position: absolute;
// height: 52px;
// width: 22px;
// padding: 0;
// border-radius: 0 !important;
// margin: 0;
// background: url(images/trombone.png) no-repeat top center;
// background-size: 100%;
// color: transparent;
// left: 0;
// top: 11px;
position: absolute;
height: 40px;
width: 40px;
padding: 0;
border-radius: 50% !important;
margin: 0;
background: url(images/plus-file.png) no-repeat center #ff566f;
background-size: 20px 20px;
color: transparent;
left: 0;
top: 5px;
}
a.mfcf7_zl_delete_file {
position: absolute;
right: 0;
top: 3px;
font-size: 14px;
line-height: 1;
}
span.mfcf7-zl-multifile-name {
display: block;
padding: 0;
}
div#mfcf7_zl_multifilecontainer p {
position: relative;
}
body.page-id-9 {
#page-title h2 {
font-size: 50px !important;
}
}
#page-title h2,
#page-title h1,
#page-title .h2,
#page-title .h1 {
font-size: 64px !important;
line-height: 1.3 !important;
}
.wpcf7-response-output {
display: none !important;
border: 1px solid #ff566f !important;
color: #ff566f !important;
font-size: 20px;
font-weight: 600;
padding: 10px 30px !important;
width: auto;
background: transparent;
line-height: 1.2;
left: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
opacity: 1;
visibility: visible;
transform: none;
position: relative;
background: none;
}
div.wpcf7-mail-sent-ng, div.wpcf7-aborted,
.wpcf7-response-output.wpcf7-validation-errors {
display: block !important;
margin: 30px 0 0 !important;
}
.wpcf7-response-output.wpcf7-mail-sent-ok {
color: #22c56b !important;
background: url('images/check.png') no-repeat 0 4px;
}
.wpcf7 .wpcf7-form {
position: relative;
padding: 0;
}
body.loader-dot div.wpcf7 .ajax-loader {
position: absolute;
width: 22px;
height: 5px;
margin: -2.5px 0 0 10px;
background: none;
right: 0;
top: 50%;
}
a.mfcf7_zl_delete_file .delete-file {
color: transparent !important;
display: block;
height: 17px;
width: 17px;
background: url('images/cross.png') no-repeat 0 0;
}
div#mfcf7_zl_multifilecontainer p {
padding-right: 50px;
display: inline-block;
width: auto;
min-width: 51%;
margin: 0 !important;
}
.welcomekit-job-infos > li:before {
top: 6px !important;
}
#btn-content {
margin: -50px 0 35px;
padding: 0 0 39px;
border-bottom: 1px solid #e1e1e1;
}
#id-col-empty {
max-width: 1170px;
margin: 60px auto;
.fullwidth-section {
background-color: transparent;
img {
max-width: 450px;
}
}
.btn-6.kl-outline {
font-size: 13px;
font-weight: 600;
margin-top: 30px;
max-width: 240px;
}
}
/*.kl-custom-grid .blog-media.do-anim {*/
/*opacity: 1 !important;*/
/*transform: none !important;*/
/*}*/
#page-pagination {
display: none !important;
}
#blog-grid {
padding-bottom: 60px;
}
.welcomekit-department {
margin: 0 0 50px;
}
@media(min-width: 992px) {
.welcomekit-department {
display: flex;
align-items: start;
justify-content: start;
}
}
.welcomekit-office-city, .welcomekit-department-name {
display: block;
padding: 0;
background: transparent;
font-weight: bold;
border: none;
font-size: 17px;
line-height: 18px;
text-transform: uppercase;
}
ul.welcomekit-jobs-list {
margin: 30px -15px 0;
}
.isotope-item:first-child .blog-media.do-anim ,
.isotope-item:nth-child(1) .blog-media.do-anim ,
.isotope-item:nth-child(2) .blog-media.do-anim {
/*visibility: visible;*/
/*opacity: 1;*/
}
@media(max-width: 1300px) {
body #header .header-inner {
width: calc(100% - 80px);
}
body.limit-big #page-body,
body.limit-big #hero,
body.limit-big .fullwidth-section.forcefullwidth .fullwidth-content {
width: calc(100% - 100px);
max-width: 1240px;
}
body.limit-big #id-content-forms.fullwidth-section.forcefullwidth .fullwidth-content {
width: 100%;
}
#kl-middle-bg,
#id-nous-faison {
.fullwidth-content {
padding: 0;
}
.one-fourth .col-content h3 {
font-size: 20px;
}
}
}
@media(max-width: 1024px){
#id-404 {
h2:not(.widget-title):not(#reply-title), .h2 {
font-size: 38px !important;
}
}
.kl-spaced-left {
padding-left: 0;
}
.kl-position-top {
margin-top: -197px;
}
#id-nosprix.fullwidth-section img {
right: 0;
}
.fullwidth-section.forcefullwidth {
//left: -30px !important;
}
body.limit-big #page-body, body.limit-big #hero {
//: 100%;
}
body.limit-big .fullwidth-section.forcefullwidth .fullwidth-content {
max-width: calc(100% - 130px);
padding: 0;
}
}
.kl-position-top {
margin-top: -200px;
padding-top: 100px;
}
@media(min-width: 992px) {
ul.welcomekit-jobs-list {
width: 80%;
margin: -15px 0 0 30px;
}
}
ul.welcomekit-jobs-list li {
list-style: none;
font-size: 14px;
line-height: 1;
}
.welcomekit-jobs-list-item-link {
position: relative;
display: block;
margin: 0 0 15px;
padding: 15px;
border-bottom: none;
text-decoration: none;
transition: all 0.2s;
}
li.welcomekit-job-description {
margin: 22px 0 0 !important;
}
#menu {
padding-right: 50px;
}
$btn-width: 250px !default;
$btn-height: auto !default;
$btn-full: $btn-height+$btn-width !default;
$btn-half: $btn-full/2 !default;
$bg-color: #eeeeee !default;
* {
cursor: none;
}
.custom-cursor {
position: fixed;
opacity: 0;
pointer-events: none;
mix-blend-mode: difference;
width: 20px;
height: 20px;
border-radius: 50%;
background-color: #00A990;
transition: transform 350ms ease;
transform: translate(-50%, -50%) scale(.3);
z-index: 1000;
z-index: 9999999;
}
#header.sticky .header-inner {
max-width: 1360px;
}
.custom-cursor.hoveredCursor {
transform: translate(-50%, -50%) scale(2);
}
a {
font-size: 20px;
cursor: none;
}
.menu-language {
overflow: hidden;
margin-top: 0;
height: 30px;
text-align: center;
position: absolute;
right: 0;
top: 50%;
margin: -14px 0 0;
}
.menu-language:hover {
overflow: visible;
}
.menu-language > a {
border-radius: 50%;
}
.menu-language a.show-language {
border-bottom: none;
}
.menu-language a:hover {
color: #000000 !important;
background-color: #ff566f;
}
.menu-language a {
font-weight: 600;
font-size: 16px;
line-height: 1;
font-family: Muli;
height: 30px;
text-transform: capitalize;
letter-spacing: 0.04em;
display: block;
vertical-align: top;
padding: 6px 4px;
box-sizing: border-box;
width: 30px;
margin: auto;
border-radius: 50%;
color: #999999;
}
.menu-language ul {
list-style: none;
display: block;
margin: 0;
padding: 0;
border-left: none;
height: 30px;
}
.menu-language ul li {
height: auto;
display: inline-block;
vertical-align: top;
}
@import 'juice';
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400|Raleway:300);
$btn-width: 250px !default;
$btn-height: 80px !default;
$btn-full: $btn-height+$btn-width !default;
$btn-half: $btn-full/2 !default;
$bg-color: #eeeeee !default;
html {
padding-top: 50px;
font-family: 'Open Sans', Helvetica, arial, sans-serif;
text-align: center;
background-color: $bg-color;
*,
*:before,
*:after {
box-sizing: border-box;
transition: 0.5s ease-in-out;
}
i,em,
b,strong,
span {
transition: none;
}
}
*:before,
*:after {
z-index: -1;
}
h1,
h4 {
font-family: 'Raleway', 'Open Sans', sans-serif;
margin: 0;
line-height: 1;
}
.big-title {
font-size: 65px !important;
}
#id-hero-hoem {
.col-content {
margin-left: -54px;
}
.big-title {
margin-bottom: 15px;
}
}
a {
text-decoration: none;
color: black;
}
.centerer {
width: 100%;
max-width: 600px;
margin: 0 auto;
padding: 0 1rem
}
body {
h1:not(.product-name) a:hover,
h2:not(.product-name) a:hover,
h3:not(.product-name) a:hover,
h4:not(.product-name) a:hover,
h5:not(.product-name) a:hover,
h6:not(.product-name) a:hover,
p a:not(.entry-navigation__item):not(.post-edit-link):not(.fancybox):not(.button):not(.image-text-link):hover, p a:hover, li.next a span:hover, li.prev a span:hover {
Color: #000000 !important;
}
}
@media (min-width: 600px) {
.wrap {
width: 50%;
float: left;
}
}
.btn-6 {
position: relative;
display: block;
overflow: hidden;
width: 100%;
height: auto;
max-width: 200px;
margin: 0;
text-align: center;
padding: 10px;
border: none;
font-size: 16px;
font-weight: 400;
}
.btn-6 {
$btn-color: random-color($max:200);
$btn-color-dark: shade($btn-color, 40%);
color: tint($btn-color);
span {
@include absolute();
display: block;
@include size(0);
border-radius: 50%;
background-color: #CA4458;
transition: width 0.4s ease-in-out, height 0.4s ease-in-out;
transform: translate(-50%, -50%);
z-index: -1;
}
&:hover {
color: tint($btn-color, 75%);
span {
@include size(225%, $btn-width*2.25);
}
}
&:active {
background-color: $btn-color;
}
}
.spacer-small {
height: 20px;
}
.portfolio-category {
color: #000;
display: block;
em {
font-style: normal;
display: block;
}
}
.portfolio-container .portfolio-info .portfolio-name {
margin: 0 0 10px;
a {
color: #999999 !important;
font-weight: 700;
font-size: 15px;
letter-spacing: 2px;
}
}
.isotope-grid.style-column-2 .isotope-item {
margin-bottom: 0 !important;
}
.isotope-grid.style-column-2 .isotope-item:nth-child(2n+2) {
margin-top: 0 !important;
padding-top: 70px !important;
margin-bottom: 0 !important;
}
#btn-group {
margin-top: 50px;
.col-content {
display: flex;
justify-content: center;
> div {
padding: 0 15px;
> .btn-6 {
min-width: 170px;
height: 50px;
padding: 9px 15px;
}
}
}
}
div#portfolio-grid1 .portfolio-info {
margin-bottom: 0;
}
.kl-texte-bold {
font-size: 15px;
letter-spacing: 2px;
}
.kl-buton-content {
.btn-6{
max-width: 222px;
}
}
.kl-content-list {
.kl-load-more {
margin-bottom: 80px;
width: auto;
padding: 15px 20px;
}
}
#id-nous-somme {
background-color: #ffffff !important;
.kl-section-rows-hide {
& + .kl-section-rows-hide {
margin-top: 0;
}
.hidden-rows {
transition: all .5s ease;
transform: scale(0);
transform-origin: top center;
}
}
&.show {
.kl-section-rows-hide {
.hidden-rows {
display: block !important;
transform: scale(1);
}
}
}
}
@media(min-width: 992px) {
#id-seenk .Kl-column-rows {
display: flex;
align-items: stretch;
}
#id-col-50 {
display: flex;
align-items: center;
}
}
.isotope-grid.style-column-3 .isotope-item {
padding-bottom: 30px;
}
#id-hero-home {
.column {
min-height: 1px !important;
}
}
#id-seenk {
h2 {
line-height: 1.5;
}
.Kl-column-rows {
&.kl-full-bg {
background-color: #ffffff;
.column {
&:last-child {
padding: 0 0 30px;
.col-content {
padding-top: 0;
&:before {
content: none;
}
}
}
}
}
&.spaced-big .column {
margin-right: 40px;
}
&.spaced-big .one-half {
width: calc(50% - 20px);
}
& + .spacer {
height: 40px;
}
.column {
background: #fff;
padding: 30px;
min-height: 100%;
.fullwidth-section {
img{
max-height: 200px;
width: auto !important;
display: block;
margin: 0 auto 0 0;
}
}
h3{
margin: 0 0 10px;
color: #000000;
span {
color: inherit !important;
}
}
h6{
line-height: 1.5;
}
.col-content {
padding: 60px 0 10px;
position: relative;
&:before {
content: "";
position: absolute;
height: 8px;
width: 8px;
top: 0;
left: 0;
border-radius: 50%;
background-color: #ff566f;
z-index: 1;
}
}
}
}
}
.kl-row-liste {
.column {
p{
font-size: 16px;
margin: 0;
line-height: 2;
}
}
}
.pagination {
li{
max-width: 50%;
a{
.text {
color: #ff566f !important;
}
&:hover {
background-color: transparent !important;
}
}
b{
display: block;
margin: 17px 0;
font-weight: bold;
font-family: 'muli', 'Helvetica Neue', Helvetica, Arial, sans-serif;
text-transform: initial;
letter-spacing: 0;
font-size: 20px;
}
.fa {
font-size: 24px;
}
&.prev {
a{
text-align: left;
}
}
&.next {
a{
text-align: right;
}
}
}
}
#blog-single #single-pagination:not(.fixed) .pagination li.prev {
display: block !important;
}
#single-pagination .pagination li a {
color: #000000 !important;
&[data-title]::after {
content: none !important;
}
&:hover {
background: none !important;
}
}
#single-pagination {
margin: 80px 0 0 !important;
padding: 50px;
width: 100vw;
background: #f7f7f7;
}
#id-nosprix {
margin: auto;
.wrapper-medium {
width: 100%;
max-width: unset;
}
&.fullwidth-section {
img{
position: absolute;
width: 320px !important;
bottom: -80px;
right: 120px;
}
.fullwidth-content {
padding: 80px 60px;
}
}
}
#id-seenk .column {
.fullwidth-section {
background-color: transparent !important;
}
}
.btn-6 {
&.kl-outline {
background-color: #ffffff;
color: #ff566f !important;
border: 1.5px solid #ff566f;
max-width: 290px;
font-weight: 700 !important;
> span {
background-color: #ff566f;
}
&:hover {
color: #ffffff !important;
border: 1px solid transparent;
}
}
}
.blog-item .blog-info .post-name a {
line-height: 40px;
font-weight: 400;
margin: 0;
font-size: 26px;
line-height: 1;
}
.tnp-subscription div.tnp-field {
.btn-6 {
background: #ff566f !important;
height: 100%;
margin: 0 0 0 15px;
}
}
.fullwidth-section .tnp-subscription {
font-size: 16px;
margin: 0;
width: 100%;
form {
display: flex;
justify-content: flex-start;
.tnp-email {
background-color: transparent !important;
border-bottom: 1px solid #ffffff;
padding: 0;
min-width: 232px;
&::-webkit-input-placeholder { /* Edge */
font-size: 16px;
font-weight: 300;
color: #ffffff !important;
position: relative;
opacity: 1;
}
&:-ms-input-placeholder { /* Internet Explorer 10-11 */
font-size: 16px;
font-weight: 300;
color: #ffffff !important;
position: relative;
opacity: 1;
}
&::placeholder {
font-size: 16px;
font-weight: 300 !important;
color: #ffffff !important;
position: relative;
opacity: 1;
}
}
label {
display: none;
}
input.tnp-submit {
background-color: #ff566f;
color: #fff;
width: auto;
margin: 0 0 0 15px !important;
margin: 0;
height: 100%;
padding: 0 26px;
letter-spacing: 0.2px;
font-weight: 400;
}
}
}
#id-img-right-full {
.column-section {
display: flex;
align-items: center;
}
.fullwidth-section {
img{
width: auto !important;
max-width: unset;
height: auto;
max-height: 450px;
}
}
}
.kl-btn-content {
a {
text-transform: uppercase;
font-size: 16px;
letter-spacing: 1px;
font-weight: 700;
}
}
#id-col-50 {
.fullwidth-section {
background-color: transparent !important;
figure {
margin: 47px -25px -75px -22px;
}
}
.column {
h2{
line-height: 1.5;
margin: 0 0 40px;
}
.btn-6 {
margin-top: 15px;
}
}
}
.isotope-grid[class*='isotope-spaced-huge'] .isotope-item {
margin-bottom: 0;
margin-right: 80px;
}
@keyframes criss-cross-left {
0% {
left: -20px;
}
50% {
left: 50%;
@include size(20px);
}
100% {
left: 50%;
@include size($btn-width*1.5);
}
}
@keyframes criss-cross-right {
0% {
right: -20px;
}
50% {
right: 50%;
@include size(20px);
}
100% {
right: 50%;
@include size($btn-width*1.5);
}
}
#header.sticky + #hero-and-body > #page-body:first-child {
margin-top: 5rem !important;
}
#header.sticky + #hero-and-body #hero:not(.hero-fullscreen) {
margin-top: calc(40px + 60px + 36px) !important;
}
#page-body > .kl-section-rows-hide.wrapper {
//padding: 0 30px;
}
.kl-liste-portfolio {
.fullwidth-content {
//padding: 0 !important;
}
}
.wpcf7-form-control-wrap {
color: #999999;
}
.kl-alert {
margin: 0 0 80px;
font-size: 16px;
padding: 15px 30px;
background: #f4f4f4;
}
.kl-spaced-left{
padding-left: 5%;
}
#kl-middle-bg {
position: relative;
bottom: -7px;
&:before {
content: "";
position: absolute;
height: 50%;
width: 100%;
top: 50%;
background: black !important;
z-index: 1;
}
.fullwidth-content {
//padding: 0 !important;
}
.fullwidth-content {
position: relative;
z-index: 2;
}
}
.wpcf7-form > p label + br {
display: none;
}
#contact-form-btn {
&.btn-6.kl-outline {
max-width: 290px;
font-weight: 500;
min-width: 200px;
}
}
#id-content-forms {
background-color: transparent !important;
max-width: 100%;
left: 0 !important;
.spacer-mini {
height: 7px;
}
.spaced-big .one-fourth:not(.last-col) {
width: calc(22% - 60px);
p{
font-size: 14px;
line-height: 2;
a{
font-size: inherit;
line-height: inherit;
}
}
}
.spaced-big .one-fourth.last-col {
width: calc(28% - 60px);
}
.fullwidth-content {
padding: 0;
}
.fullwidth-section {
background-color: transparent;
margin: 0 0 0 -80px;
}
label, form label {
margin-bottom: 30px;
font-size: 16px;
color: #000;
}
label.kl-textarea {
margin-top: 60px;
}
textarea {
min-height: 60px;
}
form {
.btn-6 {
padding: 15px 20px;
}
}
input[type=text],
input[type=password],
input[type=email],
input[type=number],
input[type=tel],
input[type=date],
select,
textarea {
border-bottom: 1px solid rgba(0,0,0,0.13);
}
}
body {
blockquote cite,
.team-role {
font-weight: 700;
}
}
.kl-404-content{
display: flex;
align-items: center;
&>.col-content{
margin-top: 0 !important;
}
.kl-btn-back-home{
margin: 10px 0 0;
font-size: 14px;
max-width: 246px;
}
}
.kl-404-img{
display: flex;
align-items: center;
&>.col-content{
margin-top: 0px;
text-align: center;
padding-left: 0;
}
img{
max-width: 77%;
}
}
.isotope-grid[class*='isotope-spaced-huge'] {
margin-bottom: 80px;
}
#id-footer-rejoindre{ display:none; }
@media only screen and (min-width: 1025px){
#menu.classic nav#main-nav > ul > li{
margin: 0 16px !important;
}
}
@media(min-width: 1200px) {
.isotope-grid.style-column-3 .isotope-item {
padding-bottom: 40px;
}
.portfolio-category {
/*max-width: 50%;*/
}
#id-content-forms {
.spaced-big .one-fourth:not(.last-col) {
width: calc(20% - 60px);
}
.spaced-big .one-fourth.last-col {
width: calc(30% - 60px);
}
.fullwidth-section {
background-color: transparent;
margin: 0 0 0 -120px;
}
}
}
@media(min-width: 992px) and (max-width: 1199px){
#id-content-forms .fullwidth-section {
img{
max-width: 400px;
display: block;
margin: auto;
}
}
}
@media only screen and (max-width: 1024px) {
h5:not(.widget-title):not(#reply-title), .h5 {
font-size: 14px !important;
line-height: 18px !important;
}
}
@media(max-width: 767px){
.fullwidth-section .tnp-subscription form .tnp-email {
min-width: 160px;
}
#page-title h2,
#page-title h1,
#page-title .h2,
#page-title .h1 {
max-width: 100% !important;
}
#id-content-forms .fullwidth-section {
margin: 0;
}
.kl-file-content input[type="submit"] {
position: relative;
left: -56px;
}
#mfcf7_zl_multifilecontainer {
min-height: 1px;
}
.wpcf7-response-output{
top: 0;
line-height: 1.5;
font-size: 14px !important;
}
.kl-file-content {
padding: 0 0 0 56px;
}
.kl-file-content >div:not(#mfcf7_zl_multifilecontainer) {
position: relative;
right: 0;
top: 0;
margin: 24px 0 0;
}
input#mfcf7_zl_add_file {
top: 0;
}
}
#hero.hero-fullscreen {
min-height: calc(100vh - 100px);
}
.clients h6 a {
font-size: inherit;
}
section#hero.hero-fullscreen.parallax-section{
-webkit-transition: 0.00001ms ease-in-out;
-moz-transition: 0.00001ms ease-in-out;
-ms-transition: 0.00001ms ease-in-out;
-o-transition: 0.00001ms ease-in-out;
transition: 0.00001ms ease-in-out;
div#page-title {
opacity: 1 !important;
-webkit-transform: translateY(-50%) translateX(-50%) !important;
-moz-transform: translateY(-50%) translateX(-50%) !important;
-ms-transform: translateY(-50%) translateX(-50%) !important;
-o-transform: translateY(-50%) translateX(-50%) !important;
transform: translateY(-50%) translateX(-50%) !important;
padding-left: 0;
h1, h1 em{
color: #fff !important;
}
h4{
color: rgba(255,255,255,0.7) !important;
a{
color: #fff !important;
&:after{
background-color: #fff !important;
}
}
}
}
}
.post-template-default.single.single-post #page-title h2.h1,
.post-template-default.single.single-post #page-title h2,
.post-template-default.single.single-post #page-title h1{
font-weight: 300;
font-size: 2.5em;
line-height: 80px;
text-transform: none;
max-width: 100%;
margin: 10px 0;
color: #999999;
}
#blog-single {
#single-share {
li {
a{
color: #000000 !important;
&:hover {
color: #000000!important;
background: none !important;
}
}
}
}
}
body.portfolio-template-default.single{
#header.kl-hero-dark {
background: transparent;
.header-inner {
background-color: transparent;
}
nav#main-nav ul > li > a{
color: #fff !important;
}
img#dark-logo{
opacity: 0 !important;
visibility: hidden !important;
}
img#light-logo{
opacity: 1 !important;
visibility: visible !important;
}
}
}
html.kl-no-margin {
margin-top: 0 !important;
padding-top: 0 !important;
}
.kl-custom-text .col-content {
h5{
font-family: 'muli', 'Helvetica Neue', Helvetica, Arial, sans-serif;
text-transform: uppercase;
font-size: 13px;
font-weight: 700;
letter-spacing: 1px;
color: #999999;
}
p{
line-height: 1.7;
font-size: 20px;
font-weight: 600;
}
}
.kl-custom-spacer-col.spaced-big {
.one-half {
width: calc(50% - 35px) !important;
}
.column {
margin-right: 70px;
.spacer-big {
height: 70px;
}
}
}
#header.sticky + #hero-and-body > #page-body:first-child {
margin-top: 8rem !important;
}
figure {
figcaption {
padding: 10px 0 0;
font-size: 14px;
color: #828282;
}
}
#id-small-container {
&.column-section {
max-width: 650px !important;
margin: auto;
}
}
@media(max-width: 991px) and (min-width: 768px){
.wpcf7-response-output{
top: 610px;
line-height: 1.5;
font-size: 14px !important;
}
}
@media(max-width: 768px) and (min-width: 576px){
#id-content-forms .spaced-big .one-fourth:not(.last-col) {
width: 30% !important;
float: left !important;
}
#id-content-forms .spaced-big .one-fourth.last-col {
width: 69% !important;
float: left !important;
}
#id-content-forms .fullwidth-section {
margin: -80px 0 0;
}
}
@media(max-width: 1200px) and (min-width: 992px){
.wpcf7-response-output{
top: 0;
line-height: 1.5;
font-size: 14px;
}
}
@media(max-width: 1024px){
#id-content-forms .fullwidth-content {
margin: 0;
max-width: 100%;
}
.kl-file-content {
padding: 0 160px 0 57px;
}
#contact-form-btn.btn-6.kl-outline {
max-width: 290px;
font-weight: 500;
min-width: 150px;
}
#id-content-forms .fullwidth-section {
background-color: transparent;
margin: 0 -110px 0 -23px;
}
body {
.fullwidth-section .fullwidth-content {
padding: 0;
}
}
#menu:not(.classic) #menu-inner,
#menu.classic #menu-inner {
min-height: 100vh;
}
#id-hero-home {
h1:not(.widget-title):not(#reply-title), .h1 {
font-size: 46px !important;
line-height: 65px !important;
}
p{
br {
display: none;
}
}
}
#btn-group .col-content > div > .btn-6 {
min-width: 160px;
}
h1:not(.widget-title):not(#reply-title), .h1 {
font-size: 46px !important;
line-height: 65px !important;
}
#menu.classic #menu-inner {
margin-top: 100px !important;
}
#menu-inner .menu-language {
position: relative;
top: 0;
margin: 14px 0 0;
a.show-language {
margin: 0 0 0 auto;
}
}
.menu-toggle span.hamburger,
.menu-toggle span.hamburger:after,
.menu-toggle span.hamburger:before {
//background: #000000 !important;
}
.kl-hero-dark {
.menu-toggle span.hamburger,
.menu-toggle span.hamburger:after,
.menu-toggle span.hamburger:before {
background: #ffffff !important;
}
}
#menu {
padding-right: 0;
}
body.portfolio-template-default.single #header nav#main-nav ul > li > a {
color: #999999 !important;
}
body.portfolio-template-default.single #header.kl-hero-dark nav#main-nav ul > li > a {
color: #999999 !important;
}
.one-fourth .col-content h3 {
word-break: break-all;
}
body {
h5:not(.widget-title):not(#reply-title), .h5 {
font-size: 14px !important;
line-height: 21px !important;
}
h3:not(.widget-title):not(#reply-title), .h3 {
font-size: 20px !important;
}
}
}
@media(max-width: 768px){
.kl-buton-content {
.btn-6{
margin: 0 auto;
}
}
#hero-and-body #hero.hero-fullscreen #page-title:not(.wrapper-small) {
width: calc(100% - 100px);
}
#id-content-forms .fullwidth-section {
background-color: transparent;
margin: -93px 0 0 0;
}
body.page-id-9 #page-title h2 {
font-size: 30px !important;
line-height: 1.2 !important;
}
#id-content-forms {
.spacer-big {
height: 30px;
}
.fullwidth-section {
background-color: transparent;
margin: -38px 0 0 0;
}
}
#id-404 {
h2:not(.widget-title):not(#reply-title), .h2 {
font-size: 30px !important;
}
}
#blog-single .blog-content {
margin-top: 30px;
}
.custom-cursor {
//display: none !important;
}
#id-img-right-full .fullwidth-section img {
width: auto !important;
max-width: 100%;
height: auto;
max-height: 450px;
}
body {
&.limit-big {
#page-body,
#hero {
width: calc(100% - 100px);
&.hero-fullscreen {
width: 100%;
}
}
}
#footer {
width: calc(100% - 100px);
}
&.limit-big .fullwidth-section.forcefullwidth .fullwidth-content {
max-width: calc(100% - 100px);
padding: 0;
}
.fullwidth-section.forcefullwidth {
left: -50px !important;
}
}
.isotope-grid[class*='isotope-spaced-big'] .isotope-item:last-child {
margin-bottom: 0;
.blog-info {
margin-bottom: 0;
}
}
body .fullwidth-section.forcefullwidth .fullwidth-content {
padding-right: 0;
padding-left: 0;
}
#hero.hero-text-nobg #page-title {
margin: 0 0 30px !important;
}
#id-content-forms .fullwidth-content {
padding: 0;
}
#id-nosprix.fullwidth-section .fullwidth-content {
padding: 40px;
}
#footer {
.fullwidth-section.forcefullwidth .fullwidth-content {
padding: 0;
}
}
.kl-section-rows-hide + .kl-section-rows-hide {
margin-top: 40px;
}
.team-member {
img{
min-width: 100%;
}
}
div#id-nous-faison {
.column-section {
display: flex;
flex-wrap: wrap;
.column {
width: calc(50% - 30px) !important;
margin: 0 0 30px !important;
&:nth-child(2n+2) {
margin-left: 30px !important;
}
}
}
}
div#id-col-footer {
display: flex;
> div {
margin-top: 0;
}
}
body.limit-big #footer {
p{
font-size: 16px;
* {
font-size: inherit !important;
}
}
.spacer-big {
height: 50px;
}
}
#header.sticky {
position: fixed !important;
}
.isotope-grid[class*='isotope-spaced-huge'] .isotope-item {
margin-bottom: 20px;
margin-right: 40px;
}
}
@media(max-width: 650px){
#btn-group {
margin-top: 20px;
.col-content {
display: block;
> div > .btn-6 {
min-width: 160px;
width: 100%;
max-width: unset;
margin: 0 0 15px;
}
}
}
div#id-col-footer {
display: block;
> div + div {
margin-top: 30px;
}
.column-section.spaced-big {
& + .spacer {
display: none !important;
}
}
}
#id-content-forms .fullwidth-section {
margin: -60px 0 0;
}
}
@media(min-width: 1200px) {
#id-content-portfolio .column-section {
margin-top: 0;
margin-bottom: 80px !important;
}
}
@media(min-width: 769px){
#id-hero-home {
display: flex;
align-items: center;
.col-content {
margin: auto !important;
}
}
body.limit-big #footer {
width: calc(100% - 100px);
.fullwidth-section.forcefullwidth {
left: -50px !important;
}
.spacer-big {
height: 60px;
}
}
body.limit-big #page-body, body.limit-big .fullwidth-section.forcefullwidth .fullwidth-content, body.limit-big #hero {
//padding: 0;
}
}
@media (min-width: 576px) and (max-width: 768px) {
div#id-nous-faison {
.column-section {
display: flex;
flex-wrap: wrap;
.column {
width: calc(50% - 30px) !important;
margin: 0 0 30px !important;
&:nth-child(2n+2) {
margin-left: 30px !important;
}
}
}
}
}
@media only screen and (max-width: 1200px){
.fullwidth-section.forcefullwidth {
left: -80px;
}
}
@media(max-width: 576px){
#id-content-forms .fullwidth-content {
> .spacer {
display: none;
}
}
#contact-form-btn.btn-6.kl-outline {
position: relative;
left: -57px;
}
.kl-file-content {
padding: 0 0 0 60px;
}
#hero-and-body #hero.hero-fullscreen #page-title:not(.wrapper-small) {
width: calc(100% - 60px);
}
body {
&.limit-big {
#page-body,
#hero {
width: calc(100% - 100px);
&.hero-fullscreen {
width: 100%;
}
}
}
#footer {
width: calc(100% - 60px);
}
&.limit-big .fullwidth-section.forcefullwidth .fullwidth-content {
max-width: calc(100% - 60px);
padding: 0;
}
.fullwidth-section.forcefullwidth {
left: -50px !important;
}
}
.tnp-subscription div.tnp-field .btn-6 {
background: #ff566f !important;
height: 100%;
margin: 0 0 0 10px;
font-size: 14px;
padding: 0 5px;
}
#id-nosprix.fullwidth-section img {
display: none;
}
.portfolio-info {
margin-top: 17px;
}
.portfolio-item-inner {
h3:not(.widget-title):not(#reply-title), .h3 {
line-height: 20px !important;
}
}
}
@media only screen and (max-width: 480px){
.portfolio-media h2:not(.widget-title):not(#reply-title), .h2 {
font-size: 16px !important;
line-height: 25px !important;
}
#hero.hero-text-nobg #page-title {
margin: 0 0 40px !important;
}
}
@media only screen and (max-width: 374px){
.portfolio-media h2:not(.widget-title):not(#reply-title), .h2 {
font-size: 12px !important;
line-height: 18px !important;
}
}
@media only screen and (max-width: 425px){
.portfolio-item-inner img {
min-height: 180px;
}
div#id-nous-faison .kl-section-rows-hide:last-child .column-section .column {
margin: 40px 0 0 !important;
}
div#id-nous-faison .column-section .column {
width: 100% !important;
}
div#id-nous-faison .column-section .column:nth-child(2n+2) {
margin-left: 0 !important;
}
}
@media only screen and (max-width: 680px) {
#portfolio-grid1.isotope-grid.offset-big:not(.offset-crazy) .isotope-item {
margin-bottom: 10px !important;
}
}
@media(max-width: 575px){
ul#filters {
display: block;
> li .sub-terms {
margin: 0;
padding: 20px;
min-width: unset;
width: 100%;
}
}
.btn-6.kl-outline {
letter-spacing: -0.1px;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment