@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100..900;1,100..900&display=swap');
*,
::after,
::before {
box-sizing: border-box;
border-width: 0;
}
.language-selector {
position: relative;
}
@media (max-width:992px) {
.language-selector {
padding-left: 1rem;
}
.language-selector::after {
left: 50px;
}
}
.language-selector select {
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
padding: 0.4rem 1.4rem 0.4rem 0.8rem;
font-weight: 500;
border: 1px solid #ddd;
border-radius: .75rem;
background: #fff;
cursor: pointer;
transition: all 0.2s ease;
}
/* Efecto hover */
.language-selector select:hover {
border-color: #ff6b9f;
box-shadow: 0 0 6px rgba(255, 107, 159, 0.4);
}
/* Efecto al hacer clic */
.language-selector select:focus {
outline: none;
border-color: #ff3d7a;
box-shadow: 0 0 8px rgba(255, 61, 122, 0.5);
}
/* Flecha personalizada */
.language-selector::after {
content: "▼";
font-size: 10px;
color: #666;
position: absolute;
right: 11px;
top: 50%;
transform: translateY(-50%);
pointer-events: none;
}
body {
color: #797979;
font-family: "Poppins", sans-serif;
font-optical-sizing: auto;
font-size: 15px;
font-weight: 400;
line-height: 1.6;
overflow-x: hidden;
}
.info-top-img {
top: -50px;
left: 50%;
}
.dropdown-toggle::after {
display: none;
}
.text-lg {
font-size: 1.125rem;
}
.badge {
background-color: #4caf50;
color: #fff;
}
.badge-1 {
background-color: #4caf50 !important;
color: #fff;
}
.badge-2 {
background-color: #28a745 !important;
color: #fff;
}
.steps-circle {
display: inline-flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
font-weight: bold;
border-radius: 15%;
background-color: #4caf50;
color: #fff;
font-size: 1.275rem;
margin-right: 20px;
line-height: 1;
text-align: center;
vertical-align: middle;
}
.steps-circle i {
display: flex;
align-items: center;
justify-content: center;
line-height: 1;
margin: 0;
padding: 0;
}
.rounded {
border-radius: 1rem !important;
}
.rounded-alert {
border-radius: 9999px !important;
font-size: 1rem;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px !important;
}
@keyframes bounce {
0%,
20%,
50%,
80%,
100% {
transform: translateY(0);
}
40% {
transform: translateY(-10px);
}
60% {
transform: translateY(-5px);
}
}
.animate-bounce {
animation: bounce 1.5s infinite;
}
.float {
width: 100%;
display:block;
border-radius: 12px;
box-shadow: 0 12px 30px rgba(0,0,0,0.12);
animation: bob 4s ease-in-out infinite;
}
@keyframes bob {
0%   { transform: translateY(0); }
50%  { transform: translateY(-12px); }
100% { transform: translateY(0); }
}
.rounded-sm {
border-radius: 0.75rem !important;
}
.price-home {
font-size: 4.5rem;
}
.month_price {
width: 300px;
margin-bottom: -2px;
}
.month {
font-size: 1rem;
margin-left: -50px;
}
.pl-pr-br-none {
padding-right: 0px !important;
padding-left: 0px !important;
border-radius: 0px !important;
}
.container-home {
width: 500px;
margin: 0 auto;
}
.border-right {
border-right: 1px solid #444444;
}
.card {
border-radius: 0.75rem;
border: none;
}
p {
color: #7a7a7a;
}
h2.shadow {
box-shadow: none !important;
}
.shadow {
text-shadow: 2px 1px 1px #000000;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px !important;
}
.sp_info {
max-width: 200px;
display: block;
margin: 0 auto;
margin-top: 6px;
}
.border-primary {
border: 3px solid #0D1216 !important;
}
.logo_h img {
width: auto;
height: 80px;
}
.navbar-light .navbar-brand:focus,
.navbar-light .navbar-brand {
transition: 0.1s;
}
.navbar-light .navbar-brand:focus,
.navbar-light .navbar-brand:hover {
transform: rotate(2deg);
transition: 0.1s;
}
.month_price {
width: 300px;
}
.euro_price {
width: 100px;
margin: 0 auto;
display: block;
}
.text_euro {
color: #ffffff;
text-align: center;
font-size: 0.9rem;
}
.step {
font-weight: 400 !important;
color: #0D1216;
}
.bg-contact {
background-color: #0D1216 !important;
color: #ffffff;
}
.bg-contact a {
text-decoration: none !important;
color: #ffffff;
}
.bg-secondary {
background-color: #ffffff !important;
}
.bg-terciary {
background-color: #f0f6fd !important;
}
.bg-light {
background-color: #f0f6fd !important;
}
.bg-light-2 {
background-color: #f9f9f9 !important;
}
.bg-dark-2 {
background-color: #4caf50;
}
.what_is {
border-top: 1px dashed #0D1216;
border-radius: 3px;
padding: 20px;
width: 100% !important;
}
.promos {
height: 70%;
width: 70%;
text-align: center;
padding: 30px 10px 30px 10px;
box-sizing: content-box;
vertical-align: top;
}
.promos-img,
.promos-glypho {
max-height: 300px;
}
.promos-glypho {
padding: 20px;
}
.bg-white {
border-radius: 16px;
}
ul {
list-style-type: none;
margin: 0;
padding: 0
}
a:hover {
text-decoration: none
}
button {
cursor: pointer
}
button:focus {
outline: 0;
box-shadow: none
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: "Poppins", sans-serif;
color: #242424;
line-height: 1.1
}
h1,
.h1 {
font-size: 60px;
font-weight: 700
}
h2,
.h2 {
font-size: 24px;
font-weight: 600
}
h3,
.h3 {
font-size: 20px;
font-weight: 500
}
h4,
.h4 {
font-size: 18px
}
[class^="flaticon-"]:before,
[class*=" flaticon-"]:before,
[class^="flaticon-"]:after,
[class*=" flaticon-"]:after {
margin: 0
}
.primary-text {
color: #4caf50;
}
.primary-text2 {
color: #000000;
}
.primary-text3 {
color: #bdff5e;
}
.primary-text4 {
color: #0D1216;
}
.primary-text5 {
color: #4caf50;
}
h1.primary-text4 {
font-size: 2rem;
}
.btn-primary-text3 {
background-color: #1c98c9;
color: #ffffff !important;
}
.btn-primary-text3:hover {
background-color: #1c98c9;
color: #ffffff !important;
opacity: .8;
}
.btn-primary-text2 {
background-color: #8b3dff;
color: #ffffff !important;
}
.btn-primary-text2:hover {
background-color: #8b3dff;
color: #ffffff !important;
opacity: .8;
}
.primary-bg {
background-color: #8b3dff
}
.bg-gray {
background: #f7f7f7
}
.bg-color-home {
background: #fff;
}
.section-padding--small {
padding: 50px 0;
background-size: cover;
background-position: bottom;
}
.bg-img {
background-image: url('../img/banner/bg.jpg');
background-size: cover;
background-position: bottom;
}
@media (min-width:992px) {
.section-padding--small {
padding: 100px 0
}
}
.section-margin {
margin: 70px 0
}
.section-error-connection {
margin: 70px 0px 70px 0px;
}
.section-membre {
margin: 70px 0
}
.section-offer {
padding: 0;
margin: 0;
}
@media (min-width: 1200px) {
.container {
max-width: 1440px;
}
}
.container-fluid {
width: 100%;
padding-right: 0px !important;
padding-left: 0px !important;
margin-right: auto;
margin-left: auto;
}
.section-new-offers {
margin: -100px 0px 50px 0px;
}
.section-new-offers-hebdo {
margin: 0px 0px 50px 0px;
}
.section-new-offers img {
margin: 0px 0px 50px 0px;
width: 90%;
}
.section-new-promos {
margin: -100px 0px 50px 0px;
}
@media (min-width:992px) {
.section-margin {
margin: 120px 0
}
.section-membre {
margin: 60px 0px
}
.section-error-connection {
margin: 70px 0;
padding: 0px;
}
}
.section-margin--large {
margin: 70px 0
}
@media (min-width:992px) {
.section-margin--large {
margin: 130px 0
}
}
.section-padding {
padding: 70px 0
}
@media (min-width:992px) {
.section-padding {
padding: 120px 0
}
}
.section-padding--large {
padding: 70px 0
}
@media (min-width:992px) {
.section-padding--large {
padding: 130px 0
}
}
.pb-98px {
padding-bottom: 58px
}
@media (min-width:992px) {
.pb-98px {
padding-bottom: 98px
}
}
.pb-80px {
padding-bottom: 58px
}
@media (min-width:992px) {
.pb-80px {
padding-bottom: 80px
}
}
.mb-50px {
margin-bottom: 50px
}
.tab-pane.active {
animation: slide-down .5s ease-out
}
@keyframes slide-down {
0% {
opacity: 0;
transform: translateY(50px)
}
100% {
opacity: 1;
transform: translateY(0)
}
}
.header_area {
width: 100%;
z-index: 99;
transition: background 0.4s, all 0.3s linear
}
@media (min-width:1199px) {
.navbar-expand-lg .navbar-toggler {
display: none;
}
}
.header_area .navbar-right {
min-width: 200px;
text-align: right
}
@media (max-width:991px) {
.header_area .navbar-right {
margin: 20px 0
}
}
.header_area .navbar-brand {
margin-right: 30px;
padding: 0
}
.header_area .navbar-social {
min-width: 95px;
float: right
}
.header_area .navbar-social li {
margin-right: 12px
}
.header_area .navbar-social li i,
.header_area .navbar-social li span {
font-size: 13px;
color: #242429
}
.header_area .navbar-social li:last-child {
margin-right: 0
}
.header_area .navbar-social li a:hover i,
.header_area .navbar-social li span {
color: #8b3dff
}
.header_area .menu_nav {
width: 100%
}
.header_area .navbar {
background: #fff;
border: 0px;
border-radius: 0px;
width: 100%;
padding-top: 0;
padding-bottom: 0;
}
.header_area .navbar .nav-right {
min-width: 140px
}
.header_area .navbar .nav-right a:hover {
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
transform: scale(1.1);
transition: 0.1s;
}
.header_area .navbar .nav-right a,
.forgot_password {
font-family: "Poppins", sans-serif;
font-optical-sizing: auto;
font-size: 15px;
font-weight: 600;
color: #fff !important;
background: #4caf50;
padding: 12px 18px;
border-radius: 0.75rem;
display: inline-block;
transition: 0.1s;
}
.member_link_logout {
color: #1c98c9 !important;
}
.nav-right a:hover,
.forgot_password:hover,
.member_link_logout:hover {
opacity: 1;
background-clip: #5d2de6;
}
.btn-primary {
background: #4caf50;
color: #fff;
font-family: "Poppins", sans-serif;
display: inline-block;
border: 1px solid transparent;
font-size: 1.275rem;
font-weight: 500;
padding: 1.2rem 2.5rem;
border-radius: 0.75rem;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.btn-primary-2 {
background: #fff;
color: #4caf50;
font-family: "Poppins", sans-serif;
display: inline-block;
border: 1px solid transparent;
font-size: 1.275rem;
font-weight: 700;
padding: 1.2rem 2.5rem;
border-radius: 0.75rem;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.btn-primary:hover {
font-family: "Poppins", sans-serif;
display: inline-block;
border: 1px solid transparent;
background-color: #4caf50;
font-size: 1.275rem;
font-weight: 700;
padding: 1.2rem 2.5rem;
border-radius: 0.75rem;
color: #ffffff;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
transform: scale(1.1);
}
.btn-primary-2:hover {
font-family: "Poppins", sans-serif;
display: inline-block;
border: 1px solid transparent;
background-color: #fff;
font-size: 1.275rem;
font-weight: 700;
padding: 1.2rem 2.5rem;
border-radius: 0.75rem;
color: #4caf50;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
transform: scale(1.1);
}
.btn-primary-plus {
background: #f0f6fd;
color: #000;
font-family: "Poppins", sans-serif;
display: inline-block;
border: 1px solid transparent;
font-size: 1.275rem;
font-weight: 500;
padding: 1.2rem 2.5rem;
border-radius: 0.75rem;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.btn-primary-plus:hover {
background: #f0f6fd;
color: #4caf50;
font-family: "Poppins", sans-serif;
display: inline-block;
border: 1px solid transparent;
font-size: 1.275rem;
font-weight: 700;
padding: 1.2rem 2.5rem;
border-radius: 0.75rem;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
transform: scale(1.1);
}
.header_area .navbar .nav .nav-item .nav-link {
font-family: "Poppins", sans-serif;
font-optical-sizing: auto;
color: #282828;
font-weight: 600;
padding: 12px 18px;
display: inline-block;
border-radius: 0.75rem;
transition: 0.1s;
}
.header_area .navbar .nav .nav-item .nav-link:after {
display: none
}
.nav-link:hover {
color: #4caf50 !important;
}
.header_area .navbar .nav .nav-item:hover .nav-link,
.header_area .navbar .nav .nav-item.active .nav-link {
color: #000;
opacity: 1;
display: inline-block;
padding: 12px 18px;
border-radius: 0.75rem;
}
.header_area .navbar .nav .nav-item.submenu {
position: relative
}
.header_area .navbar .nav .nav-item.submenu ul {
border: none;
padding: 0px;
border-radius: 0px;
box-shadow: none;
margin: 0px;
background: #fff
}
@media (min-width:992px) {
.header_area .navbar .nav .nav-item.submenu ul {
position: absolute;
top: 120%;
left: 0px;
min-width: 200px;
text-align: left;
opacity: 0;
transition: all 300ms ease-in;
visibility: hidden;
display: block;
border: none;
padding: 0px;
border-radius: 0px;
box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.4)
}
}
.header_area .navbar .nav .nav-item.submenu ul:before {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 10px 10px 0 10px;
border-color: #eeeeee transparent transparent transparent;
position: absolute;
right: 24px;
top: 45px;
z-index: 3;
opacity: 0;
transition: all 400ms linear
}
.header_area .navbar .nav .nav-item.submenu ul .nav-item {
display: block;
float: none;
margin-right: 0px;
border-bottom: 1px solid #ededed;
margin-left: 0px;
transition: all 0.4s linear
}
.header_area .navbar .nav .nav-item.submenu ul .nav-item .nav-link {
line-height: 45px;
color: #8b3dff !important;
padding: 0px 30px;
transition: all 150ms linear;
display: block;
margin-right: 0px
}
.header_area .navbar .nav .nav-item.submenu ul .nav-item:last-child {
border-bottom: none
}
.header_area .navbar .nav .nav-item.submenu ul .nav-item:hover .nav-link {
background-color: #8b3dff;
color: #fff !important
}
@media (min-width:992px) {
.header_area .navbar .nav .nav-item.submenu:hover ul {
visibility: visible;
opacity: 1;
top: 100%
}
}
.header_area .navbar .nav .nav-item.submenu:hover ul .nav-item {
margin-top: 0px
}
.header_area .navbar .nav .nav-item:last-child {
margin-right: 20px;
}
.header_area .navbar .search {
font-size: 12px;
line-height: 60px;
display: inline-block;
margin-left: 80px
}
.header_area .navbar .search i {
font-weight: 600
}
.header_area.navbar_fixed .main_menu {
position: fixed;
width: 100%;
top: -70px;
left: 0;
right: 0;
background: #fff;
z-index: 99;
transform: translateY(70px);
transition: transform 500ms ease, background 500ms ease;
-webkit-transition: transform 500ms ease, background 500ms ease;
box-shadow: 0px 3px 16px 0px rgba(0, 0, 0, 0.1)
}
.header_area.navbar_fixed .main_menu .navbar .nav .nav-item .nav-link {
line-height: 20px
}
.header_area.navbar_fixed .main_menu .navbar .nav .nav-item:hover .nav-link,
.header_area.navbar_fixed .main_menu .navbar .nav .nav-item.active .nav-link {
color: #ffffff
}
@media (min-width:992px) {
.header_area.white_menu .navbar .navbar-brand img {
display: none
}
.header_area.white_menu .navbar .navbar-brand img+img {
display: inline-block
}
}
@media (max-width:991px) {
.header_area.white_menu .navbar .navbar-brand img {
display: inline-block
}
.header_area.white_menu .navbar .navbar-brand img+img {
display: none
}
}
.header_area.white_menu .navbar .nav .nav-item .nav-link {
color: #fff
}
.header_area.white_menu.navbar_fixed .main_menu .navbar .navbar-brand img {
display: inline-block
}
.header_area.white_menu.navbar_fixed .main_menu .navbar .navbar-brand img+img {
display: none
}
.header_area.white_menu.navbar_fixed .main_menu .navbar .nav .nav-item .nav-link {
line-height: 70px
}
.top_menu {
background: #ec9d5f
}
.top_menu .float-left a {
line-height: 40px;
display: inline-block;
color: #fff;
text-transform: uppercase;
font-size: 12px;
margin-right: 50px;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
.top_menu .float-left a:last-child {
margin-right: 0px
}
.top_menu .float-right .pur_btn {
color: #fff;
line-height: 40px;
display: block;
padding: 0px 40px;
font-weight: 500;
font-size: 12px
}
.btn-link {
color: #000;
}
.btn-link:hover {
opacity: .9;
color: #dc3545;
}
@media (max-width:1619px) {
.header_area .navbar .search {
margin-left: 40px
}
}
@media (max-width:1199px) {
.header_area .navbar .nav .nav-item {
margin-right: 28px
}
.home_banner_area .banner_inner {
padding: 100px 0px
}
.header_area .navbar .tickets_btn {
margin-left: 40px
}
.home_banner_area .banner_inner .banner_content h2 br {
display: none;
font-size: 36px
}
.home_banner_area .banner_inner .banner_content h2 {
font-size: 36px;
line-height: 45px
}
}
@media (max-width:991px) {
/* Before was (max-width: 991px)*/
.navbar-toggler {
border: none;
border-radius: 0px;
padding: 0px;
cursor: pointer;
margin-top: 27px;
margin-bottom: 23px
}
.header_area .navbar {
/* background: #fff; */
}
.header_area .navbar .nav-item.active .nav-link {
color: #8b3dff !important
}
.navbar-toggler[aria-expanded="false"] span:nth-child(2) {
opacity: 1
}
.navbar-toggler[aria-expanded="true"] span:nth-child(2) {
opacity: 0
}
.navbar-toggler[aria-expanded="true"] span:first-child {
transform: rotate(-45deg);
position: relative;
top: 7.5px
}
.navbar-toggler[aria-expanded="true"] span:last-child {
transform: rotate(45deg);
bottom: 6px;
position: relative
}
.navbar-toggler span {
display: block;
width: 25px;
height: 3px;
background: #000;
margin: auto;
margin-bottom: 4px;
transition: all 400ms linear;
cursor: pointer
}
.navbar .container {
padding-left: 15px;
padding-right: 15px
}
.nav {
padding: 0px 0px
}
.header_top .nav {
padding: 0px
}
.header_area .navbar .nav .nav-item .nav-link {
/* padding:12px 0; */
margin-right: 0px;
display: block;
border: 0;
border-radius: 0px;
box-shadow: none;
}
.header_area .navbar .search {
margin-left: 0px
}
.header_area .navbar-collapse {
max-height: 340px;
overflow-y: scroll
}
.header_area .navbar .nav .nav-item.submenu ul .nav-item .nav-link {
padding: 0px 15px
}
.header_area .navbar .nav .nav-item {
margin-right: 0px
}
.home_banner_area .banner_inner .banner_content .banner_map_img {
display: none
}
.header_area.navbar_fixed .main_menu .navbar .nav .nav-item .nav-link {
line-height: 40px
}
.header_area.white_menu.navbar_fixed .main_menu .navbar .nav .nav-item .nav-link {
line-height: 40px
}
.header_area.white_menu .navbar .nav .nav-item .nav-link {
color: #222
}
.categories_post img {
width: 100%
}
.categories_post {
max-width: 360px;
margin: 0 auto
}
.blog_categorie_area .col-lg-4 {
margin-top: 30px
}
.blog_area {
padding-bottom: 80px
}
.single-post-area .form_landing {
margin-top: 30px
}
.contact_info {
margin-bottom: 50px
}
.home_banner_area .donation_inner {
margin-bottom: -30px
}
.home_banner_area .dontation_item {
max-width: 350px;
margin: auto
}
.footer_area .col-sm-6 {
margin-bottom: 30px
}
.footer_area .footer_inner {
margin-bottom: -30px
}
.news_widget {
padding-left: 0px
}
.home_banner_area .banner_inner .home_left_img {
display: none
}
.header_area .navbar .tickets_btn {
display: none
}
.home_banner_area .banner_inner {
padding: 70px 0px 100px 0px
}
.left_side_text {
margin-bottom: 50px
}
.price_item {
max-width: 360px;
margin: 0px auto 30px
}
.price_inner {
margin-bottom: -30px
}
}
@media (max-width:767px) {
.themes-grid {
display: grid;
grid-template-columns: repeat(2, 1fr) !important;
gap: 24px;
}
.home_banner_area {
min-height: 500px
}
.home_banner_area .banner_inner {
min-height: 500px
}
.home_banner_area .banner_inner .banner_content {
margin-top: 0px
}
.blog_banner .banner_inner .blog_b_text h2 {
font-size: 40px;
line-height: 50px
}
.blog_info.text-right {
text-align: left !important;
margin-bottom: 10px
}
.home_banner_area .banner_inner .banner_content h3 {
font-size: 30px
}
.home_banner_area .banner_inner .banner_content p br {
display: none
}
.home_banner_area .banner_inner .banner_content h3 span {
line-height: 45px;
padding-bottom: 0px;
padding-top: 0px
}
.footer-bottom {
text-align: center
}
.footer-bottom .footer-social {
text-align: center;
margin-top: 15px
}
.made_life_inner .nav.nav-tabs li {
flex: 0 0 50%;
max-width: 50%;
margin-bottom: 15px
}
.made_life_inner .nav.nav-tabs {
margin-bottom: -15px
}
.made_life_area.made_white .left_side_text {
margin-bottom: 0px;
margin-top: 30px
}
}
@media (max-width:575px) {
.top_menu {
display: none
}
.home_banner_area .banner_inner .banner_content h2 {
font-size: 28px;
line-height: 38px
}
.home_banner_area {
min-height: 450px
}
.home_banner_area .banner_inner {
min-height: 450px
}
.blog_banner .banner_inner .blog_b_text {
margin-top: 0px
}
.home_banner_area .banner_inner .banner_content img {
display: none
}
.home_banner_area .banner_inner .banner_content h5 {
margin-top: 0px
}
.p_120 {
padding-top: 70px;
padding-bottom: 70px
}
.main_title h2 {
font-size: 25px
}
.sample-text-area {
padding: 70px 0 70px 0
}
.generic-blockquote {
padding: 30px 15px 30px 30px
}
.blog_details h2 {
font-size: 20px;
line-height: 30px
}
.blog_banner .banner_inner .blog_b_text h2 {
font-size: 28px;
line-height: 38px
}
.footer-area {
padding: 70px 0px
}
.pad_top {
padding-top: 70px
}
.pad_btm {
padding-bottom: 70px
}
}
@media (max-width:480px) {
.bg-white {
margin: 10px;
}
.info-top-img {
top: -50px;
left: 38%;
}
.month_price {
width: 300px;
margin-bottom: 10px;
}
.month {
font-size: 1rem;
margin-left: -20px;
}
.price-home {
font-size: 3rem;
margin-bottom: 0px;
}
.shadow-sm {
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px !important;
}
.card-feature img {
float: left;
width: 24%;
margin-right: 4%;
margin-top: -20px;
}
.card-feature h4 {
text-align: left !important;
}
.button-home {
background: #8b3dff;
color: #fff;
border-radius: 40px;
border: 3px solid #0D1216;
font-size: .84rem !important;
}
h1.primary-text4 {
font-size: 2rem;
}
.sp_info {
max-width: 100% !important;
display: block;
margin: 0 auto;
padding: 10px 0px 10px 0px;
}
.title-offer {
margin-top: 0px !important;
font-size: .8rem !important;
}
.logo-offer {
width: 100px !important;
}
.header_area .navbar-collapse {
max-height: 250px
}
.home_banner_area .banner_inner .banner_content {
padding: 30px 15px;
margin-top: 0px
}
.banner_content .white_btn {
display: block
}
.home_banner_area .banner_inner .banner_content h3 {
font-size: 24px
}
.banner_area .banner_inner .banner_content h2 {
font-size: 32px
}
.comments-area .thumb {
margin-right: 10px
}
.testi_item .media .d-flex {
padding-right: 0px
}
.testi_item .media .d-flex img {
width: auto;
margin-bottom: 15px
}
.testi_item .media {
display: block
}
.banner_btn {
margin-bottom: 20px
}
}
.header_area .navbar .nav-right .forgot_password a.link {
background-color: transparent !important;
color: #000000 !important;
}
.forgot_password {
font-family: "Poppins", sans-serif;
font-size: 15px;
font-weight: 500;
color: #000000;
background: transparent;
padding: 12px;
border-radius: 8px;
display: inline-block;
}
.hero-banner {
position: relative;
padding: 70px 0;
background-size: cover;
background-color: slategrey;
color: #fff;
}
.hero-banner-home {
position: relative;
background-color: #ffeae6;
padding: 70px 0;
background-image: url('../img/banner/landing-home.jpg');
background-size: cover;
background-position: center;
}
@media (max-width:1280px) {
.hero-banner-home {
position: relative;
background-color: #ffeae6;
padding: 70px 0;
background-image: url('../img/banner/landing-home.jpg');
background-size: cover;
}
.hero-banner,
.hero-banner-home {
padding: 100px 0px !important;
}
}
.hero-banner-home p {
font-size: 1.3rem;
}
.hero-banner-home h1,
.hero-banner-home h2,
.hero-banner-home h3,
.hero-banner-home h4,
.hero-banner-home h5 {
color: #000;
word-break: normal;
line-height: 1.1;
}
@media (min-width:768px) {
.hero-banner,
.hero-banner-home {
padding: 150px 0
}
}
@media (min-width:1200px) {
.hero-banner,
.hero-banner-home {
padding: 160px 0;
}
}
.hero-banner-sm {
padding-top: 80px;
padding-bottom: 80px
}
.hero-banner-sm-offer {
background-color: #0D1216;
padding: 20px;
}
.title-offer {
color: #ffffff;
vertical-align: middle;
margin-top: 32px;
font-size: 2rem;
}
.logo-offer {
width: 140px;
}
.lower {
text-transform: none !important;
}
@media (min-width:992px) {
.hero-banner-sm {
padding-top: 50px;
padding-bottom: 50px;
background-color: #ffc107;
}
}
.hero-banner h1 {
color: #fff;
margin-bottom: 25px;
font-size: 28px
}
@media (min-width:768px) {
.hero-banner h1 {
font-size: 60px;
margin-bottom: 45px
}
}
.hero-banner h2 {
font-size: 22px;
color: #fff;
text-transform: uppercase;
margin-bottom: 0
}
@media (min-width:768px) {
.hero-banner h2 {
font-size: 42px
}
}
.hero-banner p {
font-size: 18px;
color: #fff;
margin-bottom: 0
}
.hero-banner-icon {
color: #fff;
display: inline-block
}
@media (min-width:768px) {
.hero-banner-icon {
margin-bottom: 10px
}
}
.hero-banner-icon i,
.hero-banner-icon span {
font-size: 35px
}
@media (min-width:768px) {
.hero-banner-icon i,
.hero-banner-icon span {
font-size: 60px
}
}
.hero-banner-icon [class^="flaticon-"]:before,
.hero-banner-icon [class*=" flaticon-"]:before,
.hero-banner-icon [class^="flaticon-"]:after,
.hero-banner-icon [class*=" flaticon-"]:after {
font-size: 35px
}
@media (min-width:768px) {
.hero-banner-icon [class^="flaticon-"]:before,
.hero-banner-icon [class*=" flaticon-"]:before,
.hero-banner-icon [class^="flaticon-"]:after,
.hero-banner-icon [class*=" flaticon-"]:after {
font-size: 60px
}
}
.banner-breadcrumb {
display: inline-block
}
.banner-breadcrumb .breadcrumb {
background: transparent;
padding: 0
}
.banner-breadcrumb .breadcrumb-item {
padding: .1rem
}
.banner-breadcrumb .breadcrumb-item a {
text-transform: capitalize;
color: #fff
}
.banner-breadcrumb .breadcrumb-item+.breadcrumb-item::before {
color: #fff;
padding-left: .2rem;
padding-right: .4rem
}
.banner-breadcrumb .breadcrumb-item.active {
color: #fff
}
.section-intro {
max-width: 640px;
margin-right: auto;
margin-left: auto
}
.section-intro__title {
text-transform: uppercase;
margin-bottom: 0
}
.section-intro h2 {
font-size: 26px
}
@media (min-width:600px) {
.section-intro h2 {
font-size: 36px
}
}
.section-intro-white>* {
color: #fff
}
.innovative-wrapper h3 {
margin-bottom: 25px
}
.innovative-wrapper p {
margin-bottom: 0
}
.clockdiv {
margin-bottom: 35px
}
.clockdiv li {
display: inline-block;
margin-right: 30px
}
@media (min-width:320px) {
.hero-banner-sm {
background-color: #ffc107;
}
}
@media (max-width:320px) {
.clockdiv li {
margin-right: 0
}
}
.clockdiv li:last-child {
margin-right: 0
}
.clockdiv h1 {
font-size: 27px;
font-weight: 500;
margin-bottom: 0;
line-height: 1;
color: #8b3dff
}
.clockdiv .smalltext {
font-size: 14px;
font-weight: 300
}
.clockdiv .clockdiv-single {
width: 130px;
height: 145px;
text-align: center;
padding-top: 45px
}
.clockdiv .clockdiv-day {
background: url(../img/home/countdown-day.png) left center no-repeat;
background-size: cover
}
.clockdiv .clockdiv-hour {
background: url(../img/home/countdown-hour.png) left center no-repeat;
background-size: cover
}
.clockdiv .clockdiv-minute {
background: url(../img/home/countdown-minute.png) left center no-repeat;
background-size: cover
}
.card-body {
}
.card-feature {
text-align: center
}
.card-feature img {
transition: 0.1s;
}
.card-feature img:hover {
transform: rotate(0deg);
transition: 0.1s;
}
@media (min-width:992px) {
.navbar-expand-lg .navbar-nav .dropdown-menu {
/* width: 320px; */
margin: 0 auto;
}
.card-feature {
max-width: 295px;
}
.card-feature img {
max-width: 295px;
transform: rotate(12deg);
}
}
.card-feature .feature-icon {
width: 99px;
height: 97px;
line-height: 97px;
margin-right: auto;
margin-left: auto;
display: block;
background: url(../img/home/feature-icon-bg.png) left center no-repeat;
background-size: cover;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
margin-bottom: 18px
}
@media (min-width:991px) {
.card-feature .feature-icon {
margin-bottom: 25px
}
}
.card-feature .feature-icon i,
.card-feature .feature-icon span {
font-size: 38px;
color: #8b3dff;
margin-top: 25px;
}
.card-feature .feature-icon [class^="flaticon-"]:before,
.card-feature .feature-icon [class*=" flaticon-"]:before {
font-size: 38px
}
.card-feature h3 {
font-size: 20px;
margin-bottom: 10px
}
@media (min-width:991px) {
.card-feature h3 {
margin-bottom: 20px
}
}
.card-feature p {
font-weight: 300
}
.card-feature:hover .feature-icon {
background: url(../img/home/feature-icon-active-bg.png) left center no-repeat;
background-size: cover
}
.card-feature:hover .feature-icon i,
.card-feature:hover .feature-icon span {
color: #fff
}
.speaker-bg {
background: url(../img/home/speaker-bg.png) left center no-repeat;
background-size: cover
}
.card-speaker {
border: 10px solid #fff;
position: relative;
overflow: hidden
}
.card-speaker .speaker-footer {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
text-align: center;
background: rgba(59, 29, 130, 0.9);
padding: 22px 5px;
z-index: 2;
transition: all .7s ease
}
.card-speaker .speaker-footer h4 {
margin-bottom: 0;
color: #fff;
font-size: 20px;
margin-bottom: 3px
}
.card-speaker .speaker-footer p {
margin-bottom: 0;
color: #fff;
font-size: 14px
}
.card-speaker .speaker-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(59, 29, 130, 0.8);
z-index: 1;
transform: translateY(-60px);
opacity: 0;
z-index: -1;
transition: all .6s ease
}
.card-speaker:hover .speaker-overlay {
opacity: 1;
z-index: 1;
transform: translateY(0)
}
.card-speaker:hover .speaker-footer {
background: rgba(234, 7, 99, 0.6)
}
.speaker-social {
position: absolute;
width: 100%;
text-align: center;
top: 50%;
left: 50%;
transform: translate(-50%, -50%)
}
.speaker-social li {
display: inline-block
}
.speaker-social li i,
.speaker-social li span {
font-size: 14px;
color: #fff;
opacity: .7
}
.speaker-social li::after {
content: "|";
color: #8b3dff;
margin-left: 9px;
margin-right: 7px
}
.speaker-social li:last-child::after {
display: none
}
.speaker-social li:hover i,
.speaker-social li:hover span {
color: #fff;
opacity: 1
}
.scheduleTab .nav {
border-bottom: 0;
justify-content: center;
margin-bottom: 40px
}
@media (min-width:992px) {
.scheduleTab .nav {
margin-bottom: 80px
}
}
.scheduleTab .nav-item {
margin-right: 10px
}
@media (min-width:992px) {
.scheduleTab .nav-item {
margin-right: 30px
}
}
.scheduleTab .nav-item:last-child {
margin-right: 0
}
.scheduleTab .nav-item a {
display: block;
padding: 8px 16px;
background: #f7f7f7;
margin-bottom: 10px;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
@media (min-width:992px) {
.scheduleTab .nav-item a {
padding: 20px 42px;
margin-bottom: 0
}
}
.scheduleTab .nav-item h4 {
font-size: 20px;
margin-bottom: 5px
}
.scheduleTab .nav-item p {
font-size: 15px;
color: #797979;
margin-bottom: 0
}
.scheduleTab .nav-item a.active {
background: #8b3dff
}
.scheduleTab .nav-item a.active>* {
color: #fff
}
.card-identity {
background: #8b3dff;
text-align: center;
padding: 35px 10px;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
.card-identity>* {
color: #fff
}
.card-identity img {
width: 80px;
height: 80px;
display: inline-block;
border-radius: 50%;
margin-bottom: 15px
}
.card-identity h3 {
margin-bottom: 5px
}
.schedule-content {
padding: 10px
}
@media (min-width:768px) {
.schedule-content {
padding: 5px 40px 5px 40px
}
}
.schedule-content .schedule-date {
font-size: 14px
}
.schedule-content .schedule-title {
display: inline-block;
margin-bottom: 8px
}
.schedule-card {
/*background: #f7f7f7;*/
background: #ffffff;
margin-bottom: 30px
}
.schedule-card p {
margin-bottom: 0
}
.schedule-card:hover .card-identity {
background: #8b3dff
}
.schedule-card:last-child {
margin-bottom: 0
}
.card-blog {
background: #f7f7f7;
border-radius: 5px;
padding: 10px;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
.card-blog .card-img {
border-radius: 5px 5px 0 0;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
.card-blog .blog-body {
padding: 35px 35px 40px 50px
}
.card-blog .blog-body h3 {
margin-bottom: 15px
}
.blog-info li {
display: inline-block;
font-size: 14px;
margin-right: 35px
}
.blog-info li>* {
color: #797979
}
.blog-info li:last-child {
margin-right: 0
}
.blog-info li i,
.blog-info li span {
font-size: 13px;
padding-right: 5px
}
.card-blog:hover {
background: #8b3dff
}
.card-blog:hover .card-img {
border-radius: 5px
}
.card-blog:hover .blog-body h3,
.card-blog:hover a,
.card-blog:hover i {
color: #fff
}
.dropdown-menu {
min-width: 200px;
}
.blogCarousel {
position: relative
}
.blogCarousel .owl-nav .owl-prev,
.blogCarousel .owl-nav .owl-next {
width: 45px;
height: 45px;
display: block;
border-radius: 50%
}
.blogCarousel .owl-nav .owl-prev i,
.blogCarousel .owl-nav .owl-prev span,
.blogCarousel .owl-nav .owl-next i,
.blogCarousel .owl-nav .owl-next span {
line-height: 45px;
font-size: 15px;
color: #8b3dff
}
.blogCarousel .owl-nav button:not(.disabled) {
background: #8b3dff
}
.blogCarousel .owl-nav button:not(.disabled) i,
.blogCarousel .owl-nav button:not(.disabled) span {
color: #fff
}
.blogCarousel .owl-nav button.disabled {
background: #f7f7f7 !important;
opacity: 1;
cursor: not-allowed
}
.blogCarousel .owl-nav button:not(.disabled):hover {
background: #8b3dff !important
}
.blogCarousel .owl-nav button:not(.disabled):hover i,
.blogCarousel .owl-nav button:not(.disabled):hover span {
color: #fff !important
}
.blogCarousel .owl-prev {
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 0
}
@media (min-width:1340px) {
.blogCarousel .owl-prev {
left: -110px
}
}
.blogCarousel .owl-next {
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 0
}
@media (min-width:1340px) {
.blogCarousel .owl-next {
right: -110px
}
}
.card-priceTable {
background: #fff;
border-radius: 4px;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
.priceTable-header {
padding: 25px 9px;
border-bottom: 1px solid #ebebeb;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
@media (min-width:768px) {
.priceTable-header {
padding: 30px 10px 30px 10px
}
}
.priceTable-header h3 {
font-size: 27px
}
.priceTable-header h1 {
margin-bottom: 0
}
.priceTable-price {
font-size: 22px
}
.steps_bienvenue {
font-size: 20px
}
.steps_block {
border: 1px dashed #e7e7e7;
border-radius: 15px;
}
.test {
position: absolute;
vertical-align: middle;
z-index: 2;
float: right;
}
@media (max-width:600px) {
.priceTable-price {
font-size: 2.5rem;
}
.steps_bienvenue {
font-size: 2.5rem;
}
.priceTable-header {
padding: 10px 20px;
}
.scheduleTab .nav-item {
margin-right: 0px;
}
.scheduleTab .nav {
border-bottom: 0;
justify-content: center;
margin-bottom: 40px;
display: block;
}
}
@media (min-width:768px) {
.priceTable-price,
.steps_bienvenue {
font-size: 60px
}
}
.priceTable-price span,
.steps_bienvenue span {
font-size: 22px;
font-family: "Poppins", sans-serif;
font-optical-sizing: auto;
display: inline-block
}
@media (min-width:768px) {
.priceTable-price span,
.steps_bienvenue span {
font-size: 40px;
position: relative;
bottom: 7px;
left: 11px
}
}
.priceTable-list {
padding: 30px 10px;
border-bottom: 1px solid #ebebeb;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
.priceTable-list li {
margin-bottom: 10px;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
.priceTable-list li:last-child {
margin-bottom: 0
}
.priceTable-list li i,
.priceTable-list li span {
font-size: 13px;
margin-right: 3px
}
.priceTable-list li i.positive,
.priceTable-list li span.positive {
color: #797979
}
.priceTable-list li i.negative,
.priceTable-list li span.negative {
color: #8b3dff
}
.priceTable-footer {
padding: 25px 9px
}
@media (min-width:768px) {
.priceTable-footer {
padding: 45px 0
}
}
.priceTable-footer .button {
border-color: #eeeeee;
background: #f7f7f7
}
.card-priceTable:hover {
background: #8b3dff
}
.card-priceTable:hover .priceTable-header {
border-color: rgba(235, 235, 235, 0.2)
}
.card-priceTable:hover .priceTable-header>* {
color: #fff
}
.card-priceTable:hover .priceTable-list {
border-color: rgba(235, 235, 235, 0.2)
}
.card-priceTable:hover .priceTable-list li {
color: #fff
}
.card-priceTable:hover .button {
background: #8b3dff;
border-color: #8b3dff;
color: #fff
}
.sponsor-bg {
background: url(../img/home/sponsor-bg.png) left center no-repeat;
background-size: cover
}
.sponsor-wrapper {
text-align: center;
max-width: 950px;
margin-right: auto;
margin-left: auto
}
.sponsor-wrapper--small {
max-width: 750px
}
.sponsor-title {
text-transform: uppercase;
font-size: 24px
}
.sponsor-single {
border: 5px solid #fff;
text-align: center;
padding: 10px;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
height: 140px;
position: relative
}
.sponsor-single img {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%)
}
.sponsor-single:hover {
box-shadow: 0px 5px 20px 0px rgba(10, 9, 13, 0.15)
}
.sponsor-wrapper--small .sponsor-single {
height: 120px
}
.sold img {
cursor: not-allowed ! important;
opacity: .3;
padding: 5px;
}
span.sold-info::after {
content: "OFFRE VICTIME DE SON SUCCÈS";
color: #708090;
position: absolute;
font-size: 22px;
font-weight: 800;
top: 5%;
left: 12%;
z-index: 1;
/*transform: rotate(20deg);
-webkit-transform: rotate(20deg);
-moz-transform: rotate(20deg);
-ms-transform: rotate(20deg);
-o-transform: rotate(20deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);*/
}
@media (max-width:600px) {
span.sold-info::after {
content: "OFFRE VICTIME DE SON SUCCÈS";
color: #708090;
position: absolute;
font-size: 15px;
font-weight: 800;
top: 5%;
left: 12%;
z-index: 1;
/*transform: rotate(20deg);
-webkit-transform: rotate(20deg);
-moz-transform: rotate(20deg);
-ms-transform: rotate(20deg);
-o-transform: rotate(20deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);*/
}
}
span.sold-info-use::after {
content: "VOUS AVEZ DÉJÀ UTILISÉ L'OFFRE DE LA SEMAINE";
color: #708090;
position: absolute;
font-size: 22px;
font-weight: 800;
top: 5%;
left: 12%;
z-index: 1;
/*transform: rotate(20deg);
-webkit-transform: rotate(20deg);
-moz-transform: rotate(20deg);
-ms-transform: rotate(20deg);
-o-transform: rotate(20deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);*/
}
@media (max-width:600px) {
span.sold-info-use::after {
content: "VOUS AVEZ DÉJÀ UTILISÉ L'OFFRE DE LA SEMAINE";
color: #708090;
position: absolute;
font-size: 15px;
font-weight: 800;
top: 5%;
left: 12%;
z-index: 1;
/*transform: rotate(20deg);
-webkit-transform: rotate(20deg);
-moz-transform: rotate(20deg);
-ms-transform: rotate(20deg);
-o-transform: rotate(20deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);*/
}
}
.gallery-bg {
background: url(../img/home/gallery-bg.png) left center no-repeat;
background-size: cover
}
.gallery-area .img-gal {
display: block
}
.gallery-area .single-imgs {
position: relative;
overflow: hidden
}
.gallery-area .single-imgs .overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
/*background: #8b3dff;
transform: translateY(60px);
opacity: 0;
z-index: -1;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s*/
}
.gallery-area .single-imgs .overlay-content {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.overlay-content h2,
.overlay-content h3 {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #ffffff;
text-align: center;
width: 200px;
}
.overlay-content h2,
.overlay-content h3 a {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #ffffff !important;
text-align: center;
width: 200px;
}
.gallery-area .single-imgs .overlay-icon {
width: 60px;
height: 60px;
display: block;
border-radius: 50%;
background: rgba(234, 7, 99, 0.8);
text-align: center
}
.gallery-area .single-imgs .overlay-icon i,
.gallery-area .single-imgs .overlay-icon span {
font-size: 20px;
color: #fff;
line-height: 60px
}
.gallery-area .single-imgs:hover .overlay {
transform: translateY(0);
opacity: 1;
z-index: 1
}
.contact-info {
margin-bottom: 12px
}
.contact-info__icon {
margin-right: 20px
}
.contact-info__icon i,
.contact-info__icon span {
color: #8f9195;
font-size: 27px
}
.contact-info .media-body h3 {
font-size: 16px;
margin-bottom: 0
}
.contact-info .media-body h3 a {
color: #242424
}
.contact-info .media-body p {
color: #999999
}
.contact-title {
font-size: 27px;
font-weight: 600;
margin-bottom: 20px
}
.form-contact label {
color: #8b3dff;
font-size: 14px
}
.form-contact .form-group {
margin-bottom: 30px
}
.form-contact .form-control {
border: 1px solid #f0e9ff;
border-radius: 5px;
height: 48px;
padding-left: 18px;
font-size: 13px;
background: transparent
}
.form-contact .form-control:focus {
outline: 0;
box-shadow: none
}
.form-contact .form-control::placeholder {
font-weight: 300;
color: #999999
}
.form-contact textarea {
border-radius: 12px;
height: 100% !important
}
.l_blog_item .l_blog_text .date {
margin-top: 24px;
margin-bottom: 15px
}
.l_blog_item .l_blog_text .date a {
font-size: 12px
}
.l_blog_item .l_blog_text h4 {
font-size: 18px;
color: #242424;
border-bottom: 1px solid #eeeeee;
margin-bottom: 0px;
padding-bottom: 20px;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
.l_blog_item .l_blog_text h4:hover {
color: #8b3dff
}
.l_blog_item .l_blog_text p {
margin-bottom: 0px;
padding-top: 20px
}
.causes_slider .owl-dots {
text-align: center;
margin-top: 80px
}
.causes_slider .owl-dots .owl-dot {
height: 14px;
width: 14px;
background: #eeeeee;
display: inline-block;
margin-right: 7px
}
.causes_slider .owl-dots .owl-dot:last-child {
margin-right: 0px
}
.causes_slider .owl-dots .owl-dot.active {
background: #8b3dff
}
.causes_item {
background: #fff
}
.causes_item .causes_img {
position: relative
}
.causes_item .causes_img .c_parcent {
position: absolute;
bottom: 0px;
width: 100%;
left: 0px;
height: 3px;
background: rgba(255, 255, 255, 0.5)
}
.causes_item .causes_img .c_parcent span {
width: 70%;
height: 3px;
background: #8b3dff;
position: absolute;
left: 0px;
bottom: 0px
}
.causes_item .causes_img .c_parcent span:before {
content: "75%";
position: absolute;
right: -10px;
bottom: 0px;
background: #8b3dff;
color: #fff;
padding: 0px 5px
}
.causes_item .causes_text {
padding: 30px 35px 40px 30px
}
.causes_item .causes_text h4 {
color: #242424;
font-size: 18px;
font-weight: 600;
margin-bottom: 15px;
cursor: pointer
}
.causes_item .causes_text h4:hover {
color: #8b3dff
}
.causes_item .causes_text p {
font-size: 14px;
line-height: 24px;
font-weight: 300;
margin-bottom: 0px
}
.causes_item .causes_bottom a {
width: 50%;
border: 1px solid #8b3dff;
text-align: center;
float: left;
line-height: 50px;
background: #8b3dff;
color: #fff;
font-size: 14px;
font-weight: 500
}
.causes_item .causes_bottom a+a {
border-color: #eeeeee;
background: #fff;
font-size: 14px;
color: #242424
}
.latest_blog_area {
background: #f9f9ff
}
.single-recent-blog-post {
margin-bottom: 30px
}
.single-recent-blog-post .thumb {
overflow: hidden
}
.single-recent-blog-post .thumb img {
transition: all 0.7s linear
}
.single-recent-blog-post .details {
padding-top: 30px
}
.single-recent-blog-post .details .sec_h4 {
line-height: 24px;
padding: 10px 0px 13px;
transition: all 0.3s linear
}
.single-recent-blog-post .date {
font-size: 14px;
line-height: 24px;
font-weight: 400
}
.single-recent-blog-post:hover img {
transform: scale(1.23) rotate(10deg)
}
.tags .tag_btn {
font-size: 12px;
font-weight: 500;
line-height: 20px;
border: 1px solid #eeeeee;
display: inline-block;
padding: 1px 18px;
text-align: center;
color: #242424
}
.tags .tag_btn:before {
background: #8b3dff
}
.tags .tag_btn+.tag_btn {
margin-left: 2px
}
.blog_categorie_area {
padding-top: 30px;
padding-bottom: 30px
}
@media (min-width:900px) {
.blog_categorie_area {
padding-top: 80px;
padding-bottom: 80px
}
}
@media (min-width:1100px) {
.blog_categorie_area {
padding-top: 120px;
padding-bottom: 120px
}
}
.categories_post {
position: relative;
text-align: center;
cursor: pointer
}
.categories_post img {
max-width: 100%
}
.categories_post .categories_details {
position: absolute;
top: 20px;
left: 20px;
right: 20px;
bottom: 20px;
background: rgba(34, 34, 34, 0.75);
color: #fff;
transition: all 0.3s linear;
display: flex;
align-items: center;
justify-content: center
}
.categories_post .categories_details h5 {
margin-bottom: 0px;
font-size: 18px;
line-height: 26px;
text-transform: uppercase;
color: #fff;
position: relative
}
.categories_post .categories_details p {
font-weight: 300;
font-size: 14px;
line-height: 26px;
margin-bottom: 0px
}
.categories_post .categories_details .border_line {
margin: 10px 0px;
background: #fff;
width: 100%;
height: 1px
}
.categories_post:hover .categories_details {
background: rgba(222, 99, 32, 0.85)
}
.the-welcome-offer-flash {
position: absolute;
top: 0rem;
left: 0px;
z-index: 1;
}
.blog_item {
margin-bottom: 50px
}
.blog_details {
padding: 30px 0 20px 10px;
box-shadow: 0px 10px 20px 0px rgba(221, 221, 221, 0.3)
}
@media (min-width:768px) {
.blog_details {
padding: 60px 30px 35px 35px
}
}
.blog_details p {
margin-bottom: 30px
}
.blog_details h2 {
font-size: 18px;
font-weight: 600;
margin-bottom: 8px
}
@media (min-width:768px) {
.blog_details h2 {
font-size: 24px;
margin-bottom: 15px
}
}
.blog-info-link li {
float: left;
font-size: 14px
}
.blog-info-link li a {
color: #999999
}
.blog-info-link li i,
.blog-info-link li span {
font-size: 13px;
margin-right: 5px
}
.blog-info-link li::after {
content: "|";
padding-left: 10px;
padding-right: 10px
}
.blog-info-link li:last-child::after {
display: none
}
.blog-info-link::after {
content: "";
display: block;
clear: both;
display: table
}
.blog_item_img {
position: relative
}
.blog_item_img .blog_item_date {
position: absolute;
bottom: -10px;
left: 10px;
display: block;
color: #fff;
background: #8b3dff;
padding: 8px 15px;
border-radius: 5px
}
@media (min-width:768px) {
.blog_item_img .blog_item_date {
bottom: -20px;
left: 40px;
padding: 13px 30px
}
}
.blog_item_img .blog_item_date h3 {
font-size: 22px;
font-weight: 600;
color: #fff;
margin-bottom: 0;
line-height: 1.2
}
@media (min-width:768px) {
.blog_item_img .blog_item_date h3 {
font-size: 30px
}
}
.blog_item_img .blog_item_date p {
margin-bottom: 0
}
@media (min-width:768px) {
.blog_item_img .blog_item_date p {
font-size: 18px
}
}
/*===== EXPIRE OFFER =======*/
.status_expire {
background-color: slategrey !important;
}
.blog_item_date_expire {
position: absolute;
bottom: -50px;
left: 50px;
display: block;
color: #fff;
background: #000000;
padding: 8px 15px;
border-radius: 5px
}
@media (min-width:768px) {
.blog_item_date_expire {
bottom: 190px;
left: 300px;
padding: 13px 30px;
}
}
.blog_item_date_expire h3 {
font-size: 22px;
font-weight: 600;
color: #fff;
margin-bottom: 0;
line-height: 1.2
}
@media (min-width:768px) {
.blog_item_date_expire h3 {
font-size: 30px
}
}
.blog_item_date_expire p {
margin-bottom: 0
}
@media (min-width:768px) {
.blog_item_date_expire p {
font-size: 18px
}
}
/*===== END EXPIRE OFFER =======*/
.form_landing .widget_title,
.votre_offre_bienvenue {
font-size: 25px;
margin-bottom: 20px;
}
.form_landing .widget_title::after {
content: "";
display: block;
padding-top: 15px;
border-bottom: 1px solid #f0e9ff
}
.form_landing .single_sidebar_widget {
/*background: #fbf9ff;*/
background: #0D1216;
padding: 30px;
margin-bottom: 30px
}
.form_landing .search_widget .form-control {
height: 50px;
border-color: #f0e9ff;
font-size: 13px;
color: #999999;
padding-left: 20px;
border-radius: 0;
/*border-right: 0*/
}
.form_landing .search_widget .form-control::placeholder {
color: #999999
}
.form_landing .search_widget .form-control:focus {
border-color: #f0e9ff;
outline: 0;
box-shadow: none
}
.form_landing .search_widget .input-group button {
background: #fff;
border-left: 0;
border: 1px solid #f0e9ff;
padding: 4px 15px;
border-left: 0
}
.form_landing .search_widget .input-group button i,
.form_landing .search_widget .input-group button span {
font-size: 14px;
color: #999999
}
.form_landing .newsletter_widget .form-control {
height: 50px;
border-color: #f0e9ff;
font-size: 13px;
color: #999999;
padding-left: 20px;
border-radius: 0
}
.form_landing .newsletter_widget .form-control::placeholder {
color: #999999
}
.form_landing .newsletter_widget .form-control:focus {
border-color: #f0e9ff;
outline: 0;
box-shadow: none
}
.form_landing .newsletter_widget .input-group button {
background: #fff;
border-left: 0;
border: 1px solid #f0e9ff;
padding: 4px 15px;
border-left: 0
}
.form_landing .newsletter_widget .input-group button i,
.form_landing .newsletter_widget .input-group button span {
font-size: 14px;
color: #999999
}
.form_landing .post_category_widget .cat-list li {
border-bottom: 1px solid #f0e9ff;
transition: all 0.3s ease 0s;
padding-bottom: 12px
}
.form_landing .post_category_widget .cat-list li:last-child {
border-bottom: 0
}
.form_landing .post_category_widget .cat-list li a {
font-size: 14px;
line-height: 20px;
color: #888888
}
.form_landing .post_category_widget .cat-list li a p {
margin-bottom: 0px
}
.form_landing .post_category_widget .cat-list li+li {
padding-top: 15px
}
.form_landing .post_category_widget .cat-list li:hover a {
color: #8b3dff
}
.form_landing .popular_post_widget .post_item .media-body {
justify-content: center;
align-self: center;
padding-left: 20px
}
.form_landing .popular_post_widget .post_item .media-body h3 {
font-size: 16px;
line-height: 20px;
margin-bottom: 6px;
transition: all 0.3s linear
}
.form_landing .popular_post_widget .post_item .media-body h3:hover {
color: #8b3dff
}
.form_landing .popular_post_widget .post_item .media-body p {
font-size: 14px;
line-height: 21px;
margin-bottom: 0px
}
.form_landing .popular_post_widget .post_item+.post_item {
margin-top: 20px
}
.form_landing .tag_cloud_widget ul li {
display: inline-block
}
.form_landing .tag_cloud_widget ul li a {
display: inline-block;
border: 1px solid #eeeeee;
background: #fff;
padding: 4px 20px;
margin-bottom: 8px;
margin-right: 5px;
transition: all 0.3s ease 0s;
color: #888888;
font-size: 13px
}
.form_landing .tag_cloud_widget ul li a:hover {
background: #8b3dff;
color: #fff
}
.form_landing .instagram_feeds .instagram_row {
display: flex;
margin-right: -6px;
margin-left: -6px
}
.form_landing .instagram_feeds .instagram_row li {
width: 33.33%;
float: left;
padding-right: 6px;
padding-left: 6px;
margin-bottom: 15px
}
.form_landing .br {
width: 100%;
height: 1px;
background: #eee;
margin: 30px 0px
}
.blog-pagination {
margin-top: 80px
}
.blog-pagination .page-link {
font-size: 14px;
position: relative;
display: block;
padding: 0;
text-align: center;
margin-left: -1px;
line-height: 45px;
width: 45px;
height: 45px;
border-radius: 0 !important;
color: #8a8a8a;
border: 1px solid #f0e9ff;
margin-right: 10px
}
.blog-pagination .page-link i,
.blog-pagination .page-link span {
font-size: 13px
}
.blog-pagination .page-link:hover {
background-color: #fbf9ff
}
.blog-pagination .page-item.active .page-link {
background-color: #fbf9ff;
border-color: #f0e9ff;
color: #888888
}
.blog-pagination .page-item:last-child .page-link {
margin-right: 0
}
.description-offer>p {
font-size: .8rem;
color: #888888;
line-height: 16px;
}
.description-upload {
font-size: .8rem;
color: #888888;
line-height: 16px;
}
.single-post-area .blog_details {
box-shadow: none;
padding: 0
}
.single-post-area .social-links {
padding-top: 10px
}
.single-post-area .social-links li {
display: inline-block;
margin-bottom: 10px
}
.single-post-area .social-links li a {
color: #cccccc;
padding: 7px;
font-size: 14px;
transition: all 0.2s linear
}
.single-post-area .social-links li a:hover {
color: #242424
}
.single-post-area .blog_details {
padding-top: 26px
}
.single-post-area .blog_details p {
margin-bottom: 20px
}
.single-post-area .quote-wrapper {
background: rgba(130, 139, 178, 0.1);
padding: 15px;
line-height: 1.733;
color: #888888;
font-style: italic;
margin-top: 25px;
margin-bottom: 25px
}
@media (min-width:768px) {
.single-post-area .quote-wrapper {
padding: 30px
}
}
.single-post-area .quotes {
background: #fff;
padding: 15px 15px 15px 20px;
border-left: 2px solid #8b3dff
}
@media (min-width:768px) {
.single-post-area .quotes {
padding: 25px 25px 25px 30px
}
}
.single-post-area .arrow {
position: absolute
}
.single-post-area .arrow .lnr {
font-size: 20px;
font-weight: 600
}
.single-post-area .thumb .overlay-bg {
background: rgba(0, 0, 0, 0.8)
}
.single-post-area .navigation-top {
padding-top: 15px;
border-top: 1px solid #f0e9ff
}
.single-post-area .navigation-top p {
margin-bottom: 0
}
.single-post-area .navigation-top .like-info {
font-size: 14px
}
.single-post-area .navigation-top .like-info i,
.single-post-area .navigation-top .like-info span {
font-size: 16px;
margin-right: 5px
}
.single-post-area .navigation-top .comment-count {
font-size: 14px
}
.single-post-area .navigation-top .comment-count i,
.single-post-area .navigation-top .comment-count span {
font-size: 16px;
margin-right: 5px
}
.single-post-area .navigation-top .social-icons li {
display: inline-block;
margin-right: 15px
}
.single-post-area .navigation-top .social-icons li:last-child {
margin: 0
}
.single-post-area .navigation-top .social-icons li i,
.single-post-area .navigation-top .social-icons li span {
font-size: 14px;
color: #999999
}
.single-post-area .navigation-top .social-icons li:hover i,
.single-post-area .navigation-top .social-icons li:hover span {
color: #8b3dff
}
.single-post-area .blog-author {
padding: 40px 30px;
background: #fbf9ff;
margin-top: 50px
}
@media (max-width:600px) {
.single-post-area .blog-author {
padding: 20px 8px
}
}
.single-post-area .blog-author img {
width: 90px;
height: 90px;
border-radius: 50%;
margin-right: 30px
}
@media (max-width:600px) {
.single-post-area .blog-author img {
margin-right: 15px;
width: 45px;
height: 45px
}
}
.single-post-area .blog-author a {
display: inline-block
}
.single-post-area .blog-author p {
margin-bottom: 0
}
.single-post-area .blog-author h4 {
font-size: 16px
}
.single-post-area .navigation-area {
border-bottom: 1px solid #eee;
padding-bottom: 30px;
margin-top: 55px
}
.single-post-area .navigation-area p {
margin-bottom: 0px
}
.single-post-area .navigation-area h4 {
font-size: 18px;
line-height: 25px;
color: #242424
}
.single-post-area .navigation-area .nav-left {
text-align: left
}
.single-post-area .navigation-area .nav-left .thumb {
margin-right: 20px;
background: #000
}
.single-post-area .navigation-area .nav-left .thumb img {
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
.single-post-area .navigation-area .nav-left .lnr {
margin-left: 20px;
opacity: 0;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
.single-post-area .navigation-area .nav-left:hover .lnr {
opacity: 1
}
.single-post-area .navigation-area .nav-left:hover .thumb img {
opacity: .5
}
@media (max-width:767px) {
.single-post-area .navigation-area .nav-left {
margin-bottom: 30px
}
}
.single-post-area .navigation-area .nav-right {
text-align: right
}
.single-post-area .navigation-area .nav-right .thumb {
margin-left: 20px;
background: #000
}
.single-post-area .navigation-area .nav-right .thumb img {
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
.single-post-area .navigation-area .nav-right .lnr {
margin-right: 20px;
opacity: 0;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
.single-post-area .navigation-area .nav-right:hover .lnr {
opacity: 1
}
.single-post-area .navigation-area .nav-right:hover .thumb img {
opacity: .5
}
@media (max-width:991px) {
.single-post-area .sidebar-widgets {
padding-bottom: 0px
}
}
.comments-area {
background: transparent;
border-top: 1px solid #eee;
padding: 45px 0;
margin-top: 50px
}
@media (max-width:414px) {
.comments-area {
padding: 50px 8px
}
}
.comments-area h4 {
margin-bottom: 35px;
color: #242424;
font-size: 18px
}
.comments-area h5 {
font-size: 16px;
margin-bottom: 0px
}
.comments-area a {
color: #242424
}
.comments-area .comment-list {
padding-bottom: 48px
}
.comments-area .comment-list:last-child {
padding-bottom: 0px
}
.comments-area .comment-list.left-padding {
padding-left: 25px
}
@media (max-width:413px) {
.comments-area .comment-list .single-comment h5 {
font-size: 12px
}
.comments-area .comment-list .single-comment .date {
font-size: 11px
}
.comments-area .comment-list .single-comment .comment {
font-size: 10px
}
}
.comments-area .thumb {
margin-right: 20px
}
.comments-area .thumb img {
width: 70px;
height: 70px;
border-radius: 50%
}
.comments-area .date {
font-size: 14px;
color: #cccccc;
margin-bottom: 0;
margin-left: 20px
}
.comments-area .comment {
margin-bottom: 10px;
color: #777777
}
.comments-area .btn-reply {
background-color: transparent;
color: #888888;
padding: 5px 18px;
font-size: 14px;
display: block;
font-weight: 400
}
.comment-form {
border-top: 1px solid #eee;
padding-top: 45px;
margin-top: 50px;
margin-bottom: 20px
}
.comment-form .form-group {
margin-bottom: 30px
}
.comment-form h4 {
margin-bottom: 40px;
font-size: 18px;
line-height: 22px;
color: #242424
}
.comment-form .name {
padding-left: 0px
}
@media (max-width:767px) {
.comment-form .name {
padding-right: 0px;
margin-bottom: 1rem
}
}
.comment-form .email {
padding-right: 0px
}
@media (max-width:991px) {
.comment-form .email {
padding-left: 0px
}
}
.comment-form .form-control {
border: 1px solid #f0e9ff;
border-radius: 5px;
height: 48px;
padding-left: 18px;
font-size: 13px;
background: transparent
}
.comment-form .form-control:focus {
outline: 0;
box-shadow: none
}
.comment-form .form-control::placeholder {
font-weight: 300;
color: #999999
}
.comment-form .form-control::placeholder {
color: #777777
}
.comment-form textarea {
padding-top: 18px;
border-radius: 12px;
height: 100% !important
}
.comment-form::-webkit-input-placeholder {
font-size: 13px;
color: #777
}
.comment-form::-moz-placeholder {
font-size: 13px;
color: #777
}
.comment-form:-ms-input-placeholder {
font-size: 13px;
color: #777
}
.comment-form:-moz-placeholder {
font-size: 13px;
color: #777
}
.button {
font-family: "Poppins", sans-serif;
display: inline-block;
/* border:1px solid transparent; */
font-size: 1.275rem;
font-weight: 600;
padding: 1.2rem 2rem;
border-radius: 0.75rem;
color: #242424;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
@media (max-width:767px) {
.button {
font-size: 13px;
padding: 9px 24px
}
}
.button:hover {
background: #4caf50;
color: #fff;
border-radius: 0.75rem;
transition: 0.1s;
transform: scale(1.1);
}
.button-link {
letter-spacing: 0;
color: #8b3dff;
border: 0;
padding: 0
}
.button-link:hover {
background: transparent;
color: #8b3dff
}
.button-header {
background: #8b3dff;
color: #fff;
border-color: #8b3dff;
}
.button-header:hover {
background: #ff1d41;
color: #fff
}
.bg-home {
background-color: #ffffff;
border-radius: 15px 15px 5px 5px;
padding: 20px;
}
.button-home {
background: #4caf50;
color: #fff;
font-family: "Poppins", sans-serif;
display: inline-block;
border: 1px solid transparent;
font-size: 15px;
font-weight: 500;
padding: 1.2rem 2.5rem;
border-radius: 0.75rem;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.button-home:hover {
background: #4caf50;
color: #fff;
transform: scale(1.1);
}
.button-offer {
background: #8b3dff;
color: #fff;
border-radius: 40px;
border: 3px solid #0D1216;
font-size: 1.2rem;
}
.button-offer:hover {
background: #8b3dff;
color: #fff
}
.button-contactForm {
background: #4caf50;
color: #fff;
border: 1px solid transparent;
}
.button-contactForm:hover {
background: #4caf50;
color: #fff
}
.button-contactForm-send {
border: 1px solid #8b3dff;
background: transparent;
color: #8b3dff;
}
.button-contactForm-send:hover {
background: #8b3dff;
color: #fff
}
.button-contactForm-error,
.button-contactForm-error:hover,
.button-contactForm-send-error,
.button-contactForm-send-error:hover {
width: 100%;
}
.button-contactForm-error {
background: #8b3dff;
color: #fff;
border-color: #8b3dff
}
.button-contactForm-error:hover {
border-color: #8b3dff;
background: #8b3dff;
color: #fff
}
.button-contactForm-send-error {
border: 1px solid #8b3dff;
background: transparent;
color: #8b3dff;
}
.button-contactForm-send-error:hover {
background: #8b3dff;
color: #fff
}
.footer-area {
background: #fff;
padding-top: 60px
}
@media (min-width:1000px) {
.footer-area {
padding-top: 110px
}
}
.footer-area .footer-nav li {
margin-top: 18px
}
.footer-area .footer-nav li a {
color: #fff
}
.footer-area .footer-nav li a:hover {
color: #8b3dff
}
.footer-area .primary-btn {
background-color: #8b3dff;
line-height: 42px;
padding-left: 30px;
padding-right: 60px;
border-radius: 25px;
border: none;
color: #fff;
display: inline-block;
font-weight: 500;
position: relative;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
cursor: pointer;
text-transform: uppercase;
position: relative
}
.footer-area .primary-btn:focus {
outline: none
}
.footer-area .primary-btn span {
color: #fff;
position: absolute;
top: 50%;
transform: translateY(-60%);
right: 30px;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
.footer-area .primary-btn:hover {
background-color: #8b3dff;
box-shadow: none;
color: #fff
}
.footer-area .primary-btn:hover span {
color: #fff;
right: 20px
}
.footer-area .primary-btn.white {
border: 1px solid #fff;
color: #fff
}
.footer-area .primary-btn.white span {
color: #fff
}
.footer-area .primary-btn.white:hover {
background: #fff;
color: #8b3dff
}
.footer-area .primary-btn.white:hover span {
color: #8b3dff
}
.footer-area h6 {
text-transform: uppercase;
color: #282828;
margin-bottom: 25px;
font-size: 20px;
font-weight: 700
}
.copy-right-text i,
.copy-right-text a {
color: #8b3dff
}
.instafeed {
margin: -5px
}
.instafeed li {
overflow: hidden;
width: 25%;
margin-bottom: 0 !important
}
.instafeed li img {
margin: 5px
}
.footer-social {
text-align: right
}
.footer-social a {
width: 20px;
width: 40px;
display: inline-table;
height: 40px;
text-align: center;
padding-top: 10px;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
.footer-social a:hover i {
color: #8b3dff
}
.footer-social i,
.footer-social span {
font-size: 18px;
color: rgba(221, 221, 221, 0.5);
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
@media (max-width:991.98px) {
.footer-social {
text-align: left;
margin-top: 20px
}
}
.single-footer-widget {
color: #fff
}
.single-footer-widget input {
line-height: 38px;
border: none;
background: #fff;
border: 1px solid #fff;
font-weight: 400;
color: #999999;
padding-left: 20px;
width: 80%;
font-size: 14px
}
.single-footer-widget input::placeholder {
font-weight: 400
}
.single-footer-widget .bb-btn {
background-color: #cf4d49;
color: #fff;
font-size: 13px;
font-weight: 300;
border-radius: 0;
cursor: pointer
}
@media (max-width:960px) {
.single-footer-widget .nw-btn {
margin-top: 20px
}
.single-footer-widget .newsletter {
padding-bottom: 40px
}
}
.single-footer-widget .info {
position: absolute;
margin-top: 3px;
color: #fff;
font-size: 14px
}
.single-footer-widget .info.valid {
color: green
}
.single-footer-widget .info.error {
color: #8b3dff
}
.single-footer-widget::-moz-selection {
background-color: #8b3dff;
color: #797979
}
.single-footer-widget::selection {
background-color: #8b3dff;
color: #797979
}
.single-footer-widget::-webkit-input-placeholder {
color: #797979;
font-weight: 300
}
.single-footer-widget:-moz-placeholder {
color: #797979;
opacity: 1;
font-weight: 300
}
.single-footer-widget::-moz-placeholder {
color: #797979;
opacity: 1;
font-weight: 300
}
.single-footer-widget:-ms-input-placeholder {
color: #797979;
font-weight: 300
}
.single-footer-widget::-ms-input-placeholder {
color: #797979;
font-weight: 300
}
@media (max-width:991.98px) {
.single-footer-widget {
margin-bottom: 45px
}
}
.single-footer-widget p {
color: #666
}
.single-footer-widget ul li {
margin-bottom: 10px
}
.single-footer-widget ul li a {
color: #666;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
.single-footer-widget ul li a:hover {
color: #c20e1a
}
.footer-bottom {
padding: 20px 0;
margin-top: 30px;
border-top: 1px solid rgba(255, 255, 255, 0.1)
}
@media (min-width:1000px) {
.footer-bottom {
margin-top: 70px
}
}
.footer-text a,
.footer-text i {
color: #8b3dff
}
.opacity {
opacity: 0;
}
.label_conditions {
font-size: 0.8rem;
}
.border_dashed {
border: 1px dashed slategrey;
}
.card-feature p.text-justify {
text-align-last: center;
}
/* Card Modal */
.input-group-addon {
background-color: transparent;
border-left: 0;
position: absolute;
left: 80%;
top: 35%;
}
.one-card>div {
height: 150px;
background-position: center center;
background-repeat: no-repeat;
}
.cvc-preview {
background-image: url(../img/csv_popup.png);
}
/* Payment form */
.payment_form {
padding: 0px;
background-color: transparent;
}
.form-control {
height: 40px;
border-color: #f0e9ff;
font-size: 13px;
color: #999999;
padding-left: 20px;
border-radius: 0;
/* border-right: 0; */
}
/* Date Picker */
.gj-datepicker-bootstrap [role=right-icon] button .gj-icon,
.gj-datepicker-bootstrap [role=right-icon] button .material-icons {
top: 11px !important;
left: 8px !important;
font-size: 24px !important;
vertical-align: middle !important;
}
/* Desaturate IMG */
/*.hero-banner-home, .saturation {
-webkit-filter: grayscale(40%); /* Safari 6.0 - 9.0 */
/*filter: grayscale(40%);*/
/*}*/
.gallery-area .single-imgs .overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
/*background: #8b3dff;
transform: translateY(60px);
opacity: 0;
z-index: -1;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s*/
}
.gallery-area .single-imgs .overlay-content {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.overlay-content h2,
.overlay-content h3 {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #ffffff;
text-align: center;
width: 200px;
}
.overlay-content h2 a,
.overlay-content h3 a {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #ffffff !important;
text-align: center;
width: 200px;
font-size: 2rem;
text-shadow: 2px 2px 2px #000000;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
.overlay-content h2 a:hover,
.overlay-content h3 a:hover {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #ffffff !important;
text-align: center;
width: 200px;
font-size: 2rem;
text-shadow: 2px 2px 5px #000000;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s
}
#page_li {
min-height: 500px;
}
@media (max-width:480px) {
.alert.h5 {
font-size: .85rem !important;
}
.logo_h img {
width: 200px;
height: auto;
}
.hero-banner-home p {
font-size: 14px !important;
}
.month_price {
width: 250px !important;
}
.container-home {
width: 300px !important;
margin: 0 auto;
}
.hero-banner-home h1,
h1,
.h1 {
font-size: 2.4rem;
}
.section-error-connection {
margin: 0px;
padding: 0px;
}
/* Solve overflow for long sentences */
.btn {
white-space: inherit;
padding: 5% !important;
}
.header_area .navbar-collapse {
max-height: 100vh;
}
.blog_item_date {
position: absolute;
bottom: 10px !important;
left: 10px !important;
display: block;
color: #fff;
background: #8b3dff;
padding: 8px 15px;
border-radius: 5px;
}
/* Date info organized */
.blog_item_date_expire {
position: absolute;
bottom: 55px !important;
left: 10px !important;
display: block;
color: #fff;
background: #000000;
padding: 8px 15px;
border-radius: 2px;
font-size: .5rem;
}
.blog_item_date {
position: absolute;
bottom: 10px !important;
left: 10px !important;
display: block;
color: #fff;
background: #8b3dff;
padding: 8px 15px;
border-radius: 2px;
}
.blog_item_date>h3,
.blog_item_date>p {
font-size: .6rem !important;
}
}
/* Table member */
@media only screen and (max-width:800px) {
/* Force table to not be like tables anymore */
#no-more-tables table,
#no-more-tables thead,
#no-more-tables tbody,
#no-more-tables th,
#no-more-tables td,
#no-more-tables tr {
display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
#no-more-tables thead tr {
position: absolute;
top: -9999px;
left: -9999px;
}
#no-more-tables tr {
border: 1px solid #ccc;
}
#no-more-tables td {
/* Behave  like a "row" */
border: none;
border-bottom: 1px solid #eee;
position: relative;
padding-left: 50%;
white-space: normal;
text-align: left;
}
#no-more-tables td:before {
/* Now like a table header */
position: absolute;
/* Top/left values mimic padding */
top: 6px;
left: 6px;
width: 45%;
padding-right: 10px;
white-space: nowrap;
text-align: left;
font-weight: bold;
}
/*
Label the data
*/
#no-more-tables td:before {
content: attr(data-title);
}
}
/*Extra bootstrap css*/
.w-25 {
width: 25% !important;
}
.w-50 {
width: 50% !important;
}
.w-75 {
width: 75% !important;
}
.w-100 {
width: 100% !important;
}
.h-25 {
height: 25% !important;
}
.h-50 {
height: 50% !important;
}
.h-75 {
height: 75% !important;
}
.h-100 {
height: 100% !important;
}
.mw-100 {
max-width: 100% !important;
}
.mh-100 {
max-height: 100% !important;
}
.m-0 {
margin: 0 !important;
}
.mt-0,
.my-0 {
margin-top: 0 !important;
}
.mr-0,
.mx-0 {
margin-right: 0 !important;
}
.mb-0,
.my-0 {
margin-bottom: 0 !important;
}
.ml-0,
.mx-0 {
margin-left: 0 !important;
}
.m-1 {
margin: 0.25rem !important;
}
.mt-1,
.my-1 {
margin-top: 0.25rem !important;
}
.mr-1,
.mx-1 {
margin-right: 0.25rem !important;
}
.mb-1,
.my-1 {
margin-bottom: 0.25rem !important;
}
.ml-1,
.mx-1 {
margin-left: 0.25rem !important;
}
.m-2 {
margin: 0.5rem !important;
}
.mt-2,
.my-2 {
margin-top: 0.5rem !important;
}
.mr-2,
.mx-2 {
margin-right: 0.5rem !important;
}
.mb-2,
.my-2 {
margin-bottom: 0.5rem !important;
}
.ml-2,
.mx-2 {
margin-left: 0.5rem !important;
}
.m-3 {
margin: 1rem !important;
}
.mt-3,
.my-3 {
margin-top: 1rem !important;
}
.mr-3,
.mx-3 {
margin-right: 1rem !important;
}
.mb-3,
.my-3 {
margin-bottom: 1rem !important;
}
.ml-3,
.mx-3 {
margin-left: 1rem !important;
}
.m-4 {
margin: 1.5rem !important;
}
.mt-4,
.my-4 {
margin-top: 1.5rem !important;
}
.mr-4,
.mx-4 {
margin-right: 1.5rem !important;
}
.mb-4,
.my-4 {
margin-bottom: 1.5rem !important;
}
.ml-4,
.mx-4 {
margin-left: 1.5rem !important;
}
.m-5 {
margin: 3rem !important;
}
.mt-5,
.my-5 {
margin-top: 3rem !important;
}
.mr-5,
.mx-5 {
margin-right: 3rem !important;
}
.mb-5,
.my-5 {
margin-bottom: 3rem !important;
}
.ml-5,
.mx-5 {
margin-left: 3rem !important;
}
.p-0 {
padding: 0 !important;
}
.pt-0,
.py-0 {
padding-top: 0 !important;
}
.pr-0,
.px-0 {
padding-right: 0 !important;
}
.pb-0,
.py-0 {
padding-bottom: 0 !important;
}
.pl-0,
.px-0 {
padding-left: 0 !important;
}
.p-1 {
padding: 0.25rem !important;
}
.pt-1,
.py-1 {
padding-top: 0.25rem !important;
}
.pr-1,
.px-1 {
padding-right: 0.25rem !important;
}
.pb-1,
.py-1 {
padding-bottom: 0.25rem !important;
}
.pl-1,
.px-1 {
padding-left: 0.25rem !important;
}
.p-2 {
padding: 0.5rem !important;
}
.pt-2,
.py-2 {
padding-top: 0.5rem !important;
}
.pr-2,
.px-2 {
padding-right: 0.5rem !important;
}
.pb-2,
.py-2 {
padding-bottom: 0.5rem !important;
}
.pl-2,
.px-2 {
padding-left: 0.5rem !important;
}
.p-3 {
padding: 1rem !important;
}
.pt-3,
.py-3 {
padding-top: 1rem !important;
}
.pr-3,
.px-3 {
padding-right: 1rem !important;
}
.pb-3,
.py-3 {
padding-bottom: 1rem !important;
}
.pl-3,
.px-3 {
padding-left: 1rem !important;
}
.p-4 {
padding: 1.5rem !important;
}
.pt-4,
.py-4 {
padding-top: 1.5rem !important;
}
.pr-4,
.px-4 {
padding-right: 1.5rem !important;
}
.pb-4,
.py-4 {
padding-bottom: 1.5rem !important;
}
.pl-4,
.px-4 {
padding-left: 1.5rem !important;
}
.p-5 {
padding: 3rem !important;
}
.pt-5,
.py-5 {
padding-top: 3rem !important;
}
.pr-5,
.px-5 {
padding-right: 3rem !important;
}
.pb-5,
.py-5 {
padding-bottom: 3rem !important;
}
.pl-5,
.px-5 {
padding-left: 3rem !important;
}
.m-auto {
margin: auto !important;
}
.mt-auto,
.my-auto {
margin-top: auto !important;
}
.mr-auto,
.mx-auto {
margin-right: auto !important;
}
.mb-auto,
.my-auto {
margin-bottom: auto !important;
}
.ml-auto,
.mx-auto {
margin-left: auto !important;
}
@media (min-width: 576px) {
.m-sm-0 {
margin: 0 !important;
}
.mt-sm-0,
.my-sm-0 {
margin-top: 0 !important;
}
.mr-sm-0,
.mx-sm-0 {
margin-right: 0 !important;
}
.mb-sm-0,
.my-sm-0 {
margin-bottom: 0 !important;
}
.ml-sm-0,
.mx-sm-0 {
margin-left: 0 !important;
}
.m-sm-1 {
margin: 0.25rem !important;
}
.mt-sm-1,
.my-sm-1 {
margin-top: 0.25rem !important;
}
.mr-sm-1,
.mx-sm-1 {
margin-right: 0.25rem !important;
}
.mb-sm-1,
.my-sm-1 {
margin-bottom: 0.25rem !important;
}
.ml-sm-1,
.mx-sm-1 {
margin-left: 0.25rem !important;
}
.m-sm-2 {
margin: 0.5rem !important;
}
.mt-sm-2,
.my-sm-2 {
margin-top: 0.5rem !important;
}
.mr-sm-2,
.mx-sm-2 {
margin-right: 0.5rem !important;
}
.mb-sm-2,
.my-sm-2 {
margin-bottom: 0.5rem !important;
}
.ml-sm-2,
.mx-sm-2 {
margin-left: 0.5rem !important;
}
.m-sm-3 {
margin: 1rem !important;
}
.mt-sm-3,
.my-sm-3 {
margin-top: 1rem !important;
}
.mr-sm-3,
.mx-sm-3 {
margin-right: 1rem !important;
}
.mb-sm-3,
.my-sm-3 {
margin-bottom: 1rem !important;
}
.ml-sm-3,
.mx-sm-3 {
margin-left: 1rem !important;
}
.m-sm-4 {
margin: 1.5rem !important;
}
.mt-sm-4,
.my-sm-4 {
margin-top: 1.5rem !important;
}
.mr-sm-4,
.mx-sm-4 {
margin-right: 1.5rem !important;
}
.mb-sm-4,
.my-sm-4 {
margin-bottom: 1.5rem !important;
}
.ml-sm-4,
.mx-sm-4 {
margin-left: 1.5rem !important;
}
.m-sm-5 {
margin: 3rem !important;
}
.mt-sm-5,
.my-sm-5 {
margin-top: 3rem !important;
}
.mr-sm-5,
.mx-sm-5 {
margin-right: 3rem !important;
}
.mb-sm-5,
.my-sm-5 {
margin-bottom: 3rem !important;
}
.ml-sm-5,
.mx-sm-5 {
margin-left: 3rem !important;
}
.p-sm-0 {
padding: 0 !important;
}
.pt-sm-0,
.py-sm-0 {
padding-top: 0 !important;
}
.pr-sm-0,
.px-sm-0 {
padding-right: 0 !important;
}
.pb-sm-0,
.py-sm-0 {
padding-bottom: 0 !important;
}
.pl-sm-0,
.px-sm-0 {
padding-left: 0 !important;
}
.p-sm-1 {
padding: 0.25rem !important;
}
.pt-sm-1,
.py-sm-1 {
padding-top: 0.25rem !important;
}
.pr-sm-1,
.px-sm-1 {
padding-right: 0.25rem !important;
}
.pb-sm-1,
.py-sm-1 {
padding-bottom: 0.25rem !important;
}
.pl-sm-1,
.px-sm-1 {
padding-left: 0.25rem !important;
}
.p-sm-2 {
padding: 0.5rem !important;
}
.pt-sm-2,
.py-sm-2 {
padding-top: 0.5rem !important;
}
.pr-sm-2,
.px-sm-2 {
padding-right: 0.5rem !important;
}
.pb-sm-2,
.py-sm-2 {
padding-bottom: 0.5rem !important;
}
.pl-sm-2,
.px-sm-2 {
padding-left: 0.5rem !important;
}
.p-sm-3 {
padding: 1rem !important;
}
.pt-sm-3,
.py-sm-3 {
padding-top: 1rem !important;
}
.pr-sm-3,
.px-sm-3 {
padding-right: 1rem !important;
}
.pb-sm-3,
.py-sm-3 {
padding-bottom: 1rem !important;
}
.pl-sm-3,
.px-sm-3 {
padding-left: 1rem !important;
}
.p-sm-4 {
padding: 1.5rem !important;
}
.pt-sm-4,
.py-sm-4 {
padding-top: 1.5rem !important;
}
.pr-sm-4,
.px-sm-4 {
padding-right: 1.5rem !important;
}
.pb-sm-4,
.py-sm-4 {
padding-bottom: 1.5rem !important;
}
.pl-sm-4,
.px-sm-4 {
padding-left: 1.5rem !important;
}
.p-sm-5 {
padding: 3rem !important;
}
.pt-sm-5,
.py-sm-5 {
padding-top: 3rem !important;
}
.pr-sm-5,
.px-sm-5 {
padding-right: 3rem !important;
}
.pb-sm-5,
.py-sm-5 {
padding-bottom: 3rem !important;
}
.pl-sm-5,
.px-sm-5 {
padding-left: 3rem !important;
}
.m-sm-auto {
margin: auto !important;
}
.mt-sm-auto,
.my-sm-auto {
margin-top: auto !important;
}
.mr-sm-auto,
.mx-sm-auto {
margin-right: auto !important;
}
.mb-sm-auto,
.my-sm-auto {
margin-bottom: auto !important;
}
.ml-sm-auto,
.mx-sm-auto {
margin-left: auto !important;
}
}
@media (min-width: 768px) {
.m-md-0 {
margin: 0 !important;
}
.mt-md-0,
.my-md-0 {
margin-top: 0 !important;
}
.mr-md-0,
.mx-md-0 {
margin-right: 0 !important;
}
.mb-md-0,
.my-md-0 {
margin-bottom: 0 !important;
}
.ml-md-0,
.mx-md-0 {
margin-left: 0 !important;
}
.m-md-1 {
margin: 0.25rem !important;
}
.mt-md-1,
.my-md-1 {
margin-top: 0.25rem !important;
}
.mr-md-1,
.mx-md-1 {
margin-right: 0.25rem !important;
}
.mb-md-1,
.my-md-1 {
margin-bottom: 0.25rem !important;
}
.ml-md-1,
.mx-md-1 {
margin-left: 0.25rem !important;
}
.m-md-2 {
margin: 0.5rem !important;
}
.mt-md-2,
.my-md-2 {
margin-top: 0.5rem !important;
}
.mr-md-2,
.mx-md-2 {
margin-right: 0.5rem !important;
}
.mb-md-2,
.my-md-2 {
margin-bottom: 0.5rem !important;
}
.ml-md-2,
.mx-md-2 {
margin-left: 0.5rem !important;
}
.m-md-3 {
margin: 1rem !important;
}
.mt-md-3,
.my-md-3 {
margin-top: 1rem !important;
}
.mr-md-3,
.mx-md-3 {
margin-right: 1rem !important;
}
.mb-md-3,
.my-md-3 {
margin-bottom: 1rem !important;
}
.ml-md-3,
.mx-md-3 {
margin-left: 1rem !important;
}
.m-md-4 {
margin: 1.5rem !important;
}
.mt-md-4,
.my-md-4 {
margin-top: 1.5rem !important;
}
.mr-md-4,
.mx-md-4 {
margin-right: 1.5rem !important;
}
.mb-md-4,
.my-md-4 {
margin-bottom: 1.5rem !important;
}
.ml-md-4,
.mx-md-4 {
margin-left: 1.5rem !important;
}
.m-md-5 {
margin: 3rem !important;
}
.mt-md-5,
.my-md-5 {
margin-top: 3rem !important;
}
.mr-md-5,
.mx-md-5 {
margin-right: 3rem !important;
}
.mb-md-5,
.my-md-5 {
margin-bottom: 3rem !important;
}
.ml-md-5,
.mx-md-5 {
margin-left: 3rem !important;
}
.p-md-0 {
padding: 0 !important;
}
.pt-md-0,
.py-md-0 {
padding-top: 0 !important;
}
.pr-md-0,
.px-md-0 {
padding-right: 0 !important;
}
.pb-md-0,
.py-md-0 {
padding-bottom: 0 !important;
}
.pl-md-0,
.px-md-0 {
padding-left: 0 !important;
}
.p-md-1 {
padding: 0.25rem !important;
}
.pt-md-1,
.py-md-1 {
padding-top: 0.25rem !important;
}
.pr-md-1,
.px-md-1 {
padding-right: 0.25rem !important;
}
.pb-md-1,
.py-md-1 {
padding-bottom: 0.25rem !important;
}
.pl-md-1,
.px-md-1 {
padding-left: 0.25rem !important;
}
.p-md-2 {
padding: 0.5rem !important;
}
.pt-md-2,
.py-md-2 {
padding-top: 0.5rem !important;
}
.pr-md-2,
.px-md-2 {
padding-right: 0.5rem !important;
}
.pb-md-2,
.py-md-2 {
padding-bottom: 0.5rem !important;
}
.pl-md-2,
.px-md-2 {
padding-left: 0.5rem !important;
}
.p-md-3 {
padding: 1rem !important;
}
.pt-md-3,
.py-md-3 {
padding-top: 1rem !important;
}
.pr-md-3,
.px-md-3 {
padding-right: 1rem !important;
}
.pb-md-3,
.py-md-3 {
padding-bottom: 1rem !important;
}
.pl-md-3,
.px-md-3 {
padding-left: 1rem !important;
}
.p-md-4 {
padding: 1.5rem !important;
}
.pt-md-4,
.py-md-4 {
padding-top: 1.5rem !important;
}
.pr-md-4,
.px-md-4 {
padding-right: 1.5rem !important;
}
.pb-md-4,
.py-md-4 {
padding-bottom: 1.5rem !important;
}
.pl-md-4,
.px-md-4 {
padding-left: 1.5rem !important;
}
.p-md-5 {
padding: 3rem !important;
}
.pt-md-5,
.py-md-5 {
padding-top: 3rem !important;
}
.pr-md-5,
.px-md-5 {
padding-right: 3rem !important;
}
.pb-md-5,
.py-md-5 {
padding-bottom: 3rem !important;
}
.pl-md-5,
.px-md-5 {
padding-left: 3rem !important;
}
.m-md-auto {
margin: auto !important;
}
.mt-md-auto,
.my-md-auto {
margin-top: auto !important;
}
.mr-md-auto,
.mx-md-auto {
margin-right: auto !important;
}
.mb-md-auto,
.my-md-auto {
margin-bottom: auto !important;
}
.ml-md-auto,
.mx-md-auto {
margin-left: auto !important;
}
}
@media (min-width: 992px) {
.m-lg-0 {
margin: 0 !important;
}
.mt-lg-0,
.my-lg-0 {
margin-top: 0 !important;
}
.mr-lg-0,
.mx-lg-0 {
margin-right: 0 !important;
}
.mb-lg-0,
.my-lg-0 {
margin-bottom: 0 !important;
}
.ml-lg-0,
.mx-lg-0 {
margin-left: 0 !important;
}
.m-lg-1 {
margin: 0.25rem !important;
}
.mt-lg-1,
.my-lg-1 {
margin-top: 0.25rem !important;
}
.mr-lg-1,
.mx-lg-1 {
margin-right: 0.25rem !important;
}
.mb-lg-1,
.my-lg-1 {
margin-bottom: 0.25rem !important;
}
.ml-lg-1,
.mx-lg-1 {
margin-left: 0.25rem !important;
}
.m-lg-2 {
margin: 0.5rem !important;
}
.mt-lg-2,
.my-lg-2 {
margin-top: 0.5rem !important;
}
.mr-lg-2,
.mx-lg-2 {
margin-right: 0.5rem !important;
}
.mb-lg-2,
.my-lg-2 {
margin-bottom: 0.5rem !important;
}
.ml-lg-2,
.mx-lg-2 {
margin-left: 0.5rem !important;
}
.m-lg-3 {
margin: 1rem !important;
}
.mt-lg-3,
.my-lg-3 {
margin-top: 1rem !important;
}
.mr-lg-3,
.mx-lg-3 {
margin-right: 1rem !important;
}
.mb-lg-3,
.my-lg-3 {
margin-bottom: 1rem !important;
}
.ml-lg-3,
.mx-lg-3 {
margin-left: 1rem !important;
}
.m-lg-4 {
margin: 1.5rem !important;
}
.mt-lg-4,
.my-lg-4 {
margin-top: 1.5rem !important;
}
.mr-lg-4,
.mx-lg-4 {
margin-right: 1.5rem !important;
}
.mb-lg-4,
.my-lg-4 {
margin-bottom: 1.5rem !important;
}
.ml-lg-4,
.mx-lg-4 {
margin-left: 1.5rem !important;
}
.m-lg-5 {
margin: 3rem !important;
}
.mt-lg-5,
.my-lg-5 {
margin-top: 3rem !important;
}
.mr-lg-5,
.mx-lg-5 {
margin-right: 3rem !important;
}
.mb-lg-5,
.my-lg-5 {
margin-bottom: 3rem !important;
}
.ml-lg-5,
.mx-lg-5 {
margin-left: 3rem !important;
}
.p-lg-0 {
padding: 0 !important;
}
.pt-lg-0,
.py-lg-0 {
padding-top: 0 !important;
}
.pr-lg-0,
.px-lg-0 {
padding-right: 0 !important;
}
.pb-lg-0,
.py-lg-0 {
padding-bottom: 0 !important;
}
.pl-lg-0,
.px-lg-0 {
padding-left: 0 !important;
}
.p-lg-1 {
padding: 0.25rem !important;
}
.pt-lg-1,
.py-lg-1 {
padding-top: 0.25rem !important;
}
.pr-lg-1,
.px-lg-1 {
padding-right: 0.25rem !important;
}
.pb-lg-1,
.py-lg-1 {
padding-bottom: 0.25rem !important;
}
.pl-lg-1,
.px-lg-1 {
padding-left: 0.25rem !important;
}
.p-lg-2 {
padding: 0.5rem !important;
}
.pt-lg-2,
.py-lg-2 {
padding-top: 0.5rem !important;
}
.pr-lg-2,
.px-lg-2 {
padding-right: 0.5rem !important;
}
.pb-lg-2,
.py-lg-2 {
padding-bottom: 0.5rem !important;
}
.pl-lg-2,
.px-lg-2 {
padding-left: 0.5rem !important;
}
.p-lg-3 {
padding: 1rem !important;
}
.pt-lg-3,
.py-lg-3 {
padding-top: 1rem !important;
}
.pr-lg-3,
.px-lg-3 {
padding-right: 1rem !important;
}
.pb-lg-3,
.py-lg-3 {
padding-bottom: 1rem !important;
}
.pl-lg-3,
.px-lg-3 {
padding-left: 1rem !important;
}
.p-lg-4 {
padding: 1.5rem !important;
}
.pt-lg-4,
.py-lg-4 {
padding-top: 1.5rem !important;
}
.pr-lg-4,
.px-lg-4 {
padding-right: 1.5rem !important;
}
.pb-lg-4,
.py-lg-4 {
padding-bottom: 1.5rem !important;
}
.pl-lg-4,
.px-lg-4 {
padding-left: 1.5rem !important;
}
.p-lg-5 {
padding: 3rem !important;
}
.pt-lg-5,
.py-lg-5 {
padding-top: 3rem !important;
}
.pr-lg-5,
.px-lg-5 {
padding-right: 3rem !important;
}
.pb-lg-5,
.py-lg-5 {
padding-bottom: 3rem !important;
}
.pl-lg-5,
.px-lg-5 {
padding-left: 3rem !important;
}
.m-lg-auto {
margin: auto !important;
}
.mt-lg-auto,
.my-lg-auto {
margin-top: auto !important;
}
.mr-lg-auto,
.mx-lg-auto {
margin-right: auto !important;
}
.mb-lg-auto,
.my-lg-auto {
margin-bottom: auto !important;
}
.ml-lg-auto,
.mx-lg-auto {
margin-left: auto !important;
}
}
@media (min-width: 1200px) {
.m-xl-0 {
margin: 0 !important;
}
.mt-xl-0,
.my-xl-0 {
margin-top: 0 !important;
}
.mr-xl-0,
.mx-xl-0 {
margin-right: 0 !important;
}
.mb-xl-0,
.my-xl-0 {
margin-bottom: 0 !important;
}
.ml-xl-0,
.mx-xl-0 {
margin-left: 0 !important;
}
.m-xl-1 {
margin: 0.25rem !important;
}
.mt-xl-1,
.my-xl-1 {
margin-top: 0.25rem !important;
}
.mr-xl-1,
.mx-xl-1 {
margin-right: 0.25rem !important;
}
.mb-xl-1,
.my-xl-1 {
margin-bottom: 0.25rem !important;
}
.ml-xl-1,
.mx-xl-1 {
margin-left: 0.25rem !important;
}
.m-xl-2 {
margin: 0.5rem !important;
}
.mt-xl-2,
.my-xl-2 {
margin-top: 0.5rem !important;
}
.mr-xl-2,
.mx-xl-2 {
margin-right: 0.5rem !important;
}
.mb-xl-2,
.my-xl-2 {
margin-bottom: 0.5rem !important;
}
.ml-xl-2,
.mx-xl-2 {
margin-left: 0.5rem !important;
}
.m-xl-3 {
margin: 1rem !important;
}
.mt-xl-3,
.my-xl-3 {
margin-top: 1rem !important;
}
.mr-xl-3,
.mx-xl-3 {
margin-right: 1rem !important;
}
.mb-xl-3,
.my-xl-3 {
margin-bottom: 1rem !important;
}
.ml-xl-3,
.mx-xl-3 {
margin-left: 1rem !important;
}
.m-xl-4 {
margin: 1.5rem !important;
}
.mt-xl-4,
.my-xl-4 {
margin-top: 1.5rem !important;
}
.mr-xl-4,
.mx-xl-4 {
margin-right: 1.5rem !important;
}
.mb-xl-4,
.my-xl-4 {
margin-bottom: 1.5rem !important;
}
.ml-xl-4,
.mx-xl-4 {
margin-left: 1.5rem !important;
}
.m-xl-5 {
margin: 3rem !important;
}
.mt-xl-5,
.my-xl-5 {
margin-top: 3rem !important;
}
.mr-xl-5,
.mx-xl-5 {
margin-right: 3rem !important;
}
.mb-xl-5,
.my-xl-5 {
margin-bottom: 3rem !important;
}
.ml-xl-5,
.mx-xl-5 {
margin-left: 3rem !important;
}
.p-xl-0 {
padding: 0 !important;
}
.pt-xl-0,
.py-xl-0 {
padding-top: 0 !important;
}
.pr-xl-0,
.px-xl-0 {
padding-right: 0 !important;
}
.pb-xl-0,
.py-xl-0 {
padding-bottom: 0 !important;
}
.pl-xl-0,
.px-xl-0 {
padding-left: 0 !important;
}
.p-xl-1 {
padding: 0.25rem !important;
}
.pt-xl-1,
.py-xl-1 {
padding-top: 0.25rem !important;
}
.pr-xl-1,
.px-xl-1 {
padding-right: 0.25rem !important;
}
.pb-xl-1,
.py-xl-1 {
padding-bottom: 0.25rem !important;
}
.pl-xl-1,
.px-xl-1 {
padding-left: 0.25rem !important;
}
.p-xl-2 {
padding: 0.5rem !important;
}
.pt-xl-2,
.py-xl-2 {
padding-top: 0.5rem !important;
}
.pr-xl-2,
.px-xl-2 {
padding-right: 0.5rem !important;
}
.pb-xl-2,
.py-xl-2 {
padding-bottom: 0.5rem !important;
}
.pl-xl-2,
.px-xl-2 {
padding-left: 0.5rem !important;
}
.p-xl-3 {
padding: 1rem !important;
}
.pt-xl-3,
.py-xl-3 {
padding-top: 1rem !important;
}
.pr-xl-3,
.px-xl-3 {
padding-right: 1rem !important;
}
.pb-xl-3,
.py-xl-3 {
padding-bottom: 1rem !important;
}
.pl-xl-3,
.px-xl-3 {
padding-left: 1rem !important;
}
.p-xl-4 {
padding: 1.5rem !important;
}
.pt-xl-4,
.py-xl-4 {
padding-top: 1.5rem !important;
}
.pr-xl-4,
.px-xl-4 {
padding-right: 1.5rem !important;
}
.pb-xl-4,
.py-xl-4 {
padding-bottom: 1.5rem !important;
}
.pl-xl-4,
.px-xl-4 {
padding-left: 1.5rem !important;
}
.p-xl-5 {
padding: 3rem !important;
}
.pt-xl-5,
.py-xl-5 {
padding-top: 3rem !important;
}
.pr-xl-5,
.px-xl-5 {
padding-right: 3rem !important;
}
.pb-xl-5,
.py-xl-5 {
padding-bottom: 3rem !important;
}
.pl-xl-5,
.px-xl-5 {
padding-left: 3rem !important;
}
.m-xl-auto {
margin: auto !important;
}
.mt-xl-auto,
.my-xl-auto {
margin-top: auto !important;
}
.mr-xl-auto,
.mx-xl-auto {
margin-right: auto !important;
}
.mb-xl-auto,
.my-xl-auto {
margin-bottom: auto !important;
}
.ml-xl-auto,
.mx-xl-auto {
margin-left: auto !important;
}
}
.w-16-h-16 {
width: 4rem;
height: 4rem;
}
.step-box {
background: #fff;
border-radius: 20px;
padding: 30px;
position: relative;
overflow: hidden;
box-shadow: 0 5px 20px rgba(0,0,0,0.08);
}
.step-top-bar {
position: absolute;
top: 0;
left: 0;
height: 6px;
width: 100%;
}
.step { background: #4caf50; }
.step-number {
width: 64px;
height: 64px;
border-radius: 16px;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 20px;
color: #fff;
font-weight: bold;
font-size: 22px;
background: #4caf50;
box-shadow: 0 4px 12px rgba(0,0,0,0.12);
}
.step-bg { background: #4caf50; }
.step-title {
font-size: 20px;
font-weight: bold;
color: #333;
margin-bottom: 15px;
}
.step-text {
color: #666;
font-size: 14px;
margin-bottom: 20px;
}
.step-list li {
font-size: 13px;
margin-bottom: 6px;
color: #333;
}
.example-box {
border-left: 4px solid #4caf50;
border-radius: 8px;
background: #f9f9f9;
padding: 12px;
margin-top: 18px;
}
.step-border { border-color: #4caf50 !important; }
.example-box p { margin: 0; font-size: 13px; color: #555; }
.example-box strong { display: block; margin-bottom: 4px; color: #333; }
.icon-box {
width: 80px;
height: 80px;
color: #fff;
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 15px;
}
.icon-box i {
font-size: 32px;
}
.themes-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 24px;
}
.theme-card {
background: #fff;
border-radius: 14px;
overflow: hidden;
box-shadow: rgba(0, 0, 0, 0.15) 0px 3px 3px 0px;
text-align: center;
padding-bottom: 16px;
cursor: pointer;
transition: 0.25s ease;
}
.theme-card:hover {
transform: translateY(-5px);
box-shadow: rgba(0, 0, 0, 0.19) 0px 3px 3px 0px;
}
.theme-image {
height: 160px;
background: #EAEAEA;
}
.theme-title {
font-size: 18px;
font-weight: 600;
margin-top: 16px;
}
.theme-card-locked {
position: relative;
pointer-events: none;
opacity: 0.7;
cursor: not-allowed;
transition: transform 0.3s ease, opacity 0.3s ease;
box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}
.theme-card-locked:hover {
transform: scale(1.02);
opacity: 0.8;
box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}
/* Imagen contenedora */
.theme-card-locked .theme-image {
position: relative;
display: inline-block;
}
/* Capa de candado */
.theme-card-locked .lock-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.4);
display: flex;
align-items: center;
justify-content: center;
border-radius: 10px;
}
.theme-card-locked .lock-overlay i {
color: #fff;
font-size: 2.5rem;
}
/* Estilos calculadora */
.calculateur-container {
max-width: auto;
margin: 0 auto;
background-color: #cee5ff;
}
.calculateur-box {
padding: 0.9rem !important;
}
.calculateur-box h3, .calculateur-container h3 {
font-weight: bold;
}
.calculateur-box h3 {
font-size: 1.6rem;
}
.calculateur-container h3 {
font-size: 1.4rem;
}
.calculateur-container p,
.calculateur-box small {
font-size: 0.9rem;
}
.calculateur-result {
padding: 0.8rem !important;
}
.calculateur-box {
border: 1px solid #e5e5e5;
border-radius: 1rem;
padding: 1.25rem;
background-color: #fff;
transition: all 0.25s ease;
}
.calculateur-box:hover {
border-color: #4caf50;
background-color: #f9fdf9;
transform: translateY(-3px);
}
.calculateur-result {
background-color: #f9f9f9;
border: 1px solid #e5e5e5;
}
.shadow-inner {
box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.05);
}