/home/techb158/l2hypotheques.com/wp-content/themes/pylon/assets/sass
Edit: /home/techb158/l2hypotheques.com/wp-content/themes/pylon/assets/sass/_common.scss (6117B)
:root {
--thm-font: "Rubik", sans-serif;
--heading-font: "Rubik", serif;
--thm-color: #798490;
--thm-color-rgb: 121, 132, 144;
--thm-base: #008fd5;
--thm-base-rgb: 0, 143, 213;
--thm-primary: #004aa1;
--thm-primary-rgb: 0, 74, 161;
--thm-secondary: #ed4b4b;
--thm-secondary-rgb: 237, 75, 75;
--thm-special: #5366c2;
--thm-special-rgb: 83, 102, 194;
--thm-black: #0c2139;
--thm-black-rgb: 12, 33, 57;
--thm-black2: #1d1c1c;
--thm-black2-rgb: 29, 28, 28;
--thm-text-dark: #8e96a0;
--thm-text-dark-rgb: 142, 150, 160;
}
body {
font-family: $thm-font;
color: $thm-color;
font-size: $body-size;
line-height: $body-line-height;
}
a,
a:hover,
a:focus,
a:visited {
text-decoration: none;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: $heading-font;
color: $thm-black;
br {
@media (max-width: 575px) {
display: none;
}
}
}
p {
br {
@media (max-width: 575px) {
display: none;
}
}
}
::placeholder {
color: inherit;
opacity: 1;
}
.background-base {
background-color: $thm-base;
}
.background-primary {
background-color: $thm-primary;
}
.background-secondary {
background-color: $thm-secondary;
}
.background-special {
background-color: $thm-special;
}
.page-wrapper {
position: relative;
margin: 0 auto;
width: 100%;
min-width: 300px;
overflow: hidden;
}
@media (min-width: 1200px) {
.container {
max-width: 1200px;
}
}
.thm-btn {
@include thmBtn;
}
.block-text {
font-size: 18px;
line-height: 1.88;
color: $thm-color;
margin-bottom: 0;
}
.block-title {
margin-bottom: 50px;
@media(max-width: 425px) {
margin-bottom: 30px;
}
p {
display: inline-flex;
align-items: center;
font-size: 18px;
font-weight: 400;
color: $thm-color;
margin: 0;
line-height: 1;
position: relative;
top: -10px;
&::after {
content: '';
width: 43px;
height: 3px;
background-color: $thm-base;
border-radius: $border-radius;
margin-left: 10px;
}
}
h2 {
margin: 0;
color: $thm-black;
font-size: 32px;
font-weight: 400;
line-height: 1.4;
@media (min-width: 481px) {
font-size: 40px;
}
@media (min-width: 1200px) {
font-size: 60px;
line-height: 1;
}
@media (max-width: 575px) {
br {
display: none;
}
}
}
}
.ul-list-one {
margin-bottom: 0;
li {
position: relative;
padding-left: 45px;
font-size: $body-size;
font-weight: 500;
color: $thm-black;
@media (min-width: 481px) {
font-size: $heading-size;
}
&::before {
content: "\e907";
color: $thm-secondary;
font-size: 26px;
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
font-family: "azino-icon";
}
}
}
.preloader {
position: fixed;
background-color: #fff;
background-position: center center;
background-repeat: no-repeat;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 9991;
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
-webkit-box-align: center;
align-items: center;
text-align: center;
&__image {
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-name: flipInY;
animation-name: flipInY;
-webkit-animation-duration: 2s;
animation-duration: 2s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
}
/* scroll to top */
.scroll-to-top {
display: inline-block;
width: 45px;
height: 45px;
background: $thm-base;
position: fixed;
bottom: 40px;
right: 40px;
z-index: 99;
text-align: center;
-webkit-transition: all .4s ease;
transition: all .4s ease;
display: none;
border-radius: 50%;
transition: all .4s ease;
}
.scroll-to-top i {
color: #ffffff;
font-size: 18px;
line-height: 45px;
}
.scroll-to-top:hover {
background-color: $thm-black;
}
.scroll-to-top:hover i {
color: #fff;
}
/* post paginations */
.post-pagination {
margin-bottom: 0;
margin-top: 0px;
@media (min-width: 992px) {
margin-top: 0px;
}
a {
display: flex;
width: 45px;
height: 45px;
background-color: #eff2f6;
align-items: center;
justify-content: center;
color: $thm-color;
font-size: 16px;
font-weight: 500;
border-radius: 50%;
transition: 500ms ease;
@media (min-width: 992px) {
width: 60px;
height: 60px;
font-size: 18px;
}
&:hover {
background-color: $thm-primary;
color: #fff;
}
}
li:first-child a {
background-color: $thm-base;
color: #fff;
}
li:last-child a {
background-color: $thm-black;
color: #fff;
}
li + li {
margin-left: 10px;
}
}
/* custom animations */
@-webkit-keyframes shapeMover {
0%,
100% {
-webkit-transform: perspective(400px) translateY(0) rotate(0deg)
translateZ(0px) translateX(0);
transform: perspective(400px) translateY(0) rotate(0deg) translateZ(0px)
translateX(0);
}
50% {
-webkit-transform: perspective(400px) rotate(-45deg) translateZ(20px)
translateY(20px) translateX(20px);
transform: perspective(400px) rotate(-45deg) translateZ(20px)
translateY(20px) translateX(20px);
}
}
@keyframes shapeMover {
0%,
100% {
-webkit-transform: perspective(400px) translateY(0) rotate(0deg)
translateZ(0px) translateX(0);
transform: perspective(400px) translateY(0) rotate(0deg) translateZ(0px)
translateX(0);
}
50% {
-webkit-transform: perspective(400px) rotate(-45deg) translateZ(20px)
translateY(20px) translateX(20px);
transform: perspective(400px) rotate(-45deg) translateZ(20px)
translateY(20px) translateX(20px);
}
}