html{
}
body {margin: 0 auto;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;background-position: center;background-repeat: no-repeat;min-height: 100%;font: 400 14px/1.42857143 Roboto,sans-serif;padding-top: 0;box-sizing: border-box;margin: 0 auto;margin-bottom: 410px;background: white;background-size: cover;}
.fiche_produit ::-webkit-scrollbar {
width: 5px;
height:40px;
}
.fiche_produit ::-webkit-scrollbar-thumb {
background: #ffb610;
}
#page_content_inner {
padding: 0px 10px 100px;
}
.footer_fix{
background: #ffffff;
height: 97px;
width: 100%;
position: fixed;
bottom: 0;
left: 0;
border-top: 3px solid #fa6800;
}
.prod_l{position: fixed;bottom: 2px;left: 5px;height: 144px;}
.shake{
/* Start the shake animation and make the animation last for 0.5 seconds */
animation: shake 0.9s;
/* When the animation is finished, start again */
animation-iteration-count: 3;
}
@keyframes shake {
from,
to {
transform: translate3d(0, 0, 0)
}
10%,
30%,
50%,
70%,
90% {
transform: translate3d(-10px, 0, 0)
}
20%,
40%,
60%,
80% {
transform: translate3d(10px, 0, 0)
}
}
@keyframes headShake {
0% {
transform: translateX(0)
}
6.5% {
transform: translateX(-6px) rotateY(-9deg)
}
18.5% {
transform: translateX(5px) rotateY(7deg)
}
31.5% {
transform: translateX(-3px) rotateY(-5deg)
}
43.5% {
transform: translateX(2px) rotateY(3deg)
}
50% {
transform: translateX(0)
}
}
.headShake {
animation-timing-function: ease-in-out;
animation-name: headShake
}
#left_btn{
position: fixed;
bottom: 12px;
right: 30px;
background: #FFC312;
padding: 4px;
color: white;
text-align: center;
height: 24px;
border-radius: 7px 7px 7px 7px;
box-shadow: 0 1px 3px rgba(39, 38, 38, 0.52), 0 1px 2px rgb(74, 74, 74);
background: linear-gradient(60deg, #ffd316 10%,#fa6800, #FFC312);
min-width: 122px;
width: 130px;
text-decoration: none;
line-height: 26px;
cursor: pointer;
font-size: 20px !important;
height: 36px;
font-family: Cairo, sans-serif !important;
}
#left_btn_w{
position: fixed;
bottom: 54px;
right: 30px;
background: #FFC312;
padding: 5px;
color: white;
text-align: center;
border-radius: 7px 7px 7px 7px;
box-shadow: 0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(23, 22, 22, 0.99);
background: linear-gradient(60deg, #009688 10%,#009688, #009688);
min-width: 122px;
width: 130px;
text-decoration: none;
line-height: 26px;
cursor: pointer;
font-size: 20px !important;
height: 36px;
font-family: Cairo, sans-serif !important;
}
@-webkit-keyframes spin_btn { 100% {font-size: 26px !important; box-shadow: 0 1px 3px rgb(6, 6, 6), 0 1px 2px rgb(4, 4, 4) !important;} }
@keyframes spin_btn { 100% {font-size: 20px; box-shadow: 0 1px 3px rgba(6, 6, 6, 0.26), 0 1px 2px rgba(4, 4, 4, 0.2) ;} }
.new-logo{
width: 60px;
margin: 0px;
border: none;
background: #ffffff;
margin-top: 2px;
margin-bottom: 1px;
box-shadow: 1px 1px 1px 1px rgb(255, 184, 11);
border-radius: 9px;
padding: 6px;
}
.div-new-logo {
text-align: center;
margin-bottom: 2px;
padding-top: 5px;
}
.div_logo_onsa{
background:white;
width:100%;
padding: 7px;
text-align: center;
}
.div_logo_onsa img{
padding: 3px;
height: 250px;
}
.div_stars{
background:white;
width:100%;
padding: 7px;
text-align: center;
}
.div_stars img{
padding: 3px;
width: auto;
}
.div_logo_shp{
background:white;
width:100%;
padding: 7px;
text-align: center;
}
.div_logo_shp img{
padding: 3px;
height: 55px;
}
.content_fiche_p{
width:100%;
float: left;
overflow: auto;
margin-top: 50px;
}
.nom_prod {
text-align: center;
letter-spacing: 2px;
color: #FF9800;
background: #ffffff;
padding: 5px;
text-shadow: 1px 2px 2px #efefef;
margin-bottom: 5px;
font-size: 30px;
font-style: normal;
font-weight: 400;
line-height: 1.10909;
text-transform: unset;
font-family: 'Caveat';
width: 90%;
margin: 0 auto;
border-radius: 6px;
margin-bottom: 5px;
border: 1px solid #FF9800;
margin-top: 3px;
}
.fiche_produit{
width: 100%;
float: left;
min-height: 500px;
overflow: auto;
margin-bottom: 130px;
}
.text_des_prod{
width: 90%;
background: #ffffffe0;
border: 1px solid #5a585a;
padding: 17px;
margin-right: 11px;
float: right;
border-radius: 8px;
margin-top: 1px;
max-height: 240px;
overflow: auto;
box-shadow: 2px 1px 1px 1px #ffffff69;
margin-bottom: 3px;
text-shadow: 1px 1px 1px #e4e2e2;
color: #2f2e2e;
font-size: 16px;
direction: rtl;
text-align: right;
font-family: Cairo, sans-serif !important;
}
.form_cl{
background: #ffffffcf;
width: 100%;
padding: 10px;
margin-top: 0px;
border-radius: 6px;
min-width: 277px;
height: 100%;
padding-top: 0px;
}
.form_cl label{
height: 26px;
width: 23%;
padding: 2px;
padding-right: 7px;
max-width: 110px;
margin-top: 3px;
color:#383535;
text-align: right;
direction: rtl;
float: right;
font-family: 'Amiri', serif !important;
}
.form_cl input,.form_cl select{
padding: 2px;
margin-top: 8px;
text-align-last: center;
position: relative;
display: block;
outline: 0;
width: 90%;
min-width: 260px;
height: 32px;
line-height: 80px;
margin: 0 auto;
background: #fff;
color: #222;
text-indent: 15px;
font-size: 18px;
text-align: center;
font-family: "DINRoundPro", Helvetica, sans-serif;
margin-bottom: 14px;
border-radius: 10px;
box-shadow: inset 0px -3px 3px 1px #0000002b;
border: 1px solid #c1c1c1;
}
.full_w{
width: 100%;
float: left;
}
.h2_fiche{
float: right;
padding: 9px;
margin: auto;
border-radius: 8px;
border: 1px solid #ffffff;
margin-right: 5px;
width: 90%;
color: white;
text-align: right;
padding-right: 10px;
font-size: 19px;
font-family: 'Amiri', serif !important;
cursor: pointer;
box-shadow: 0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(0,0,0,.24);
margin-bottom: 4px;
background-image: linear-gradient(288.1deg,#fc8205 28.5%,#ffcb14 99.18%);
line-height: 19px;
font-family: Cairo, sans-serif !important;
}
.h2_fiche i{
float: right;
margin-left: 9px;
}
.des_prod i{
float: right;
margin-left: 9px;
}
.div_qte{
border-top: 2px solid #8d8d8d;
}
.div_qte p{
text-align: center;
font-size: 19px;
margin: 6px;
padding: 0;
color: #707070;
border-radius: 6px;
float: right;
min-width: 100px;
margin-top: 8px;
width: 45%;
height: 32px;
direction: rtl;
}
.div_qte select{
min-width:60px;
margin-bottom: 0px;
padding: 0;
margin-top: 8px;
width: 45%;
max-width: 70px;
float: right;
}
#cmd_btn{
margin-top: 10px;
padding: 5px;
width: 80%;
margin-left: 10%;
background: #febe11;
background: linear-gradient(60deg, #ffd316 10%,#fa6800, #FFC312);
color: white;
font-size: 20px;
border-radius: 12px;
box-shadow: 0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(218, 218, 218, 0.99);
font-family: 'Amiri', serif !important;
height: 40px;
cursor: pointer;
}
#cmd_btn:hover{
background: linear-gradient(60deg, #FFC107 10%,#fa6800, #b78d11);
}
#DateCountdown{margin: 0 auto;border-radius: 13px;height: 59px;width: 240px;padding: 7px;margin-bottom: 10px;}
/**
* This element is created inside your target element
* It is used so that your own element will not need to be altered
**/
.el-timer {
width: 370px;
margin: 0 auto;
}
.time_circles {
position: relative;
width: 100%;
height: 100%;
margin: 0 auto;
text-align: center;
background: transparent;
padding: 0;
}
/**
* This is all the elements used to house all text used
* in time circles
**/
.time_circles > div {
position: absolute;
text-align: center;
}
/**
* Titles (Days, Hours, etc)
**/
.time_circles > div > h4 {
margin: 0px;
padding: 0px;
text-align: center;
text-transform: uppercase;
color: #fff;
}
.el-timer2 .time_circles > div > h4 {
color: #a1e019;
}
/**
* Time numbers, ie: 12
**/
.time_circles > div > span {
display: block;
width: 100%;
text-align: center;
font-size: 300%;
margin-top: 0.4em;
font-weight: 400;
color: #fff;
}
.el-timer2 .time_circles > div > span {
color: #FFC107;
}
.time_center{
font-family: 'DINRoundPro-Bold';
font-size: 18px;
line-height: 18px;
color: #fff;
text-align: center;
background: #8dc53e;
background-image: linear-gradient(288.1deg,#6daf14 28.5%,#9dde3c 99.18%);
border-top: 2px solid #6aa513;
border-bottom: 2px solid #68922b;
background-size: cover;
border-radius: 10px;
height: 100%;
min-height: 270px;
width: 90%;
margin: 0 auto;
margin-bottom: 5px;
padding: 10px;
}
.time_center p{
padding-bottom: 4px;
margin: 4px;
font-size: 24px;
background: #ffffff40;
line-height: 38px;
margin-bottom: 0px;
border-radius: 4px;
font-family: Cairo, sans-serif !important;
}
#center_btn{
position: relative;
background: #FFC312;
background-image: linear-gradient(to bottom, #fdcf00, #ffb000);
padding: 1px;
color: #f5f5f5;
text-align: center;
height: 18px;
border-radius: 7px;
min-width: 200px;
width: 80%;
margin-left: 7%;
cursor: pointer;
font-size: 25px !important;
font-family: 'Amiri', serif !important;
text-decoration: none;
float: left;
border-bottom: 5px solid #d59300;
box-shadow: 0 16px 13px -8px rgba(0, 0, 0, 0.2);
margin-top: 3px;
height: 55px;
line-height: 25px;
padding-top: 0;
font-family: Cairo, sans-serif !important;
}
#center_btn i{
line-height: 21px;
margin-left: 8px;
font-size: 21px;
margin-top: 6px;
}
.full_w_marg{
width: 100%;
float: left;
margin-top: 5px;
}
.products_count {
margin: 10px 0 0 0;
padding-bottom: 10px;
font-family: 'DINRoundPro-Bold';
font-size: 18px;
text-align: center;
color: #FF9800;
background: #ffffffeb;
width: 90%;
float: right;
padding-top: 7px;
margin-right: 5px;
font-family: Cairo, sans-serif !important;
}
.products_count span {
display: inline-block;
vertical-align: middle;
margin: 0px 3px 0 3px;
padding: 1px 8px;
height: 28px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
font-size: 18px;
color: #fff;
background: #ffb300;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
background-image: -webkit-linear-gradient(top,#f9cb00,#ffb200);
background-image: -moz-linear-gradient(top,#f9cb00,#ffb200);
background-image: -ms-linear-gradient(top,#f9cb00,#ffb200);
background-image: -o-linear-gradient(top,#f9cb00,#ffb200);
background-image: linear-gradient(to bottom,#f9cb00,#ffb200);
border-bottom: 2px solid #d59300;
}
/*---------- */
.blue1 {
background: #2d3f9c;
color: #fff;
border-top: 2px solid #1774bd;
border-bottom: 2px solid #1764a0;
background-image: linear-gradient(288.1deg,#2196F3 28.5%,#8ad2f9 99.18%);
margin: 0;
padding: 0;
}
.pad_bot30 {
padding-bottom: 14px;
border-radius: 10px;
width: 90%;
margin: 0 auto;
margin-bottom: 8px;
padding: 6px;
margin-top: 5px;
float: right;
margin-right: 5px;
}
h2.title_white {
text-align: center;
color: #fff;
font-size: 25px;
line-height: 21px;
text-transform: uppercase;
padding: 3px;
margin-bottom: 0px;
margin-top: 0px;
font-family: Cairo, sans-serif !important;
}
h2.title_white:after {
content: '';
display: block;
width: 110px;
height: 9px;
background: url(../img/title_white.png) center top no-repeat;
position: relative;
left: 50%;
bottom: -18px;
margin-left: -55px;
}
.addreview {
text-align: center;
background: #fff;
margin: 0 9px;
padding: 6px;
border-radius: 10px;
color: #222;
}
.addreview .reviews_test {
display: inline-block;
position: relative;
}
.addreview .reviews_test:after {
content: '';
display: block;
width: 100%;
height: 22px;
position: absolute;
left: 0;
background-size: contain;
}
.addreview .review_radio {
width: 100%;
height: 45px;
line-height: 41px;
display: inline-block;
cursor: pointer;
margin-bottom: 0px;
border-radius: 45px;
border: 2px solid #000;
}
.addreview .review_radio.green_radio {
border-color: #f2f2f2;
}
.addreview .review_radio.red_radio {
border-color: #f2f2f2;
}
.addreview .review_radio.blue_radio {
border-color: #f2f2f2;
}
.addreview .review_radio:before {
width: 12px;
height: 12px;
margin: 10px;
display: inline-block;
content: "";
border: 4px solid #000;
border-radius: 20px;
float: right;
}
.addreview .review_radio.green_radio:before {
border-color: #51c23b;
}
.addreview .review_radio.red_radio:before {
border-color: #ff5e5e;
}
.addreview .review_radio.blue_radio:before {
border-color: #45b9f6;
}
.addreview .review_radio.green_radio.active:before {
background: #00c04a;
}
.addreview .review_radio.red_radio.active:before {
background: #de3437;
}
.addreview .review_radio.blue_radio.active:before {
background: #00b0f4;
}
.addreview .review_radio input[type=radio] {
display: none;
}
.addreview .review_radio span {
display: inline-block;
float: right;
font-size: 16px;
font-family: Cairo, sans-serif !important;
}
.addreview .review_box {
background: #e1e1e1;
padding: 20px 35px;
width: 100%;
max-width: 415px;
display: inline-block;
}
.addreview_title {
text-align: center;
font-weight: 900;
text-transform: uppercase;
margin-bottom: 10px;
font-size: 16px;
}
.addreview input,
.addreview textarea {
background: #fff;
border: 1px solid #c2c2c2;
border-radius: 3px;
font-size: 16px;
margin-bottom: 10px;
}
.addreview textarea {
width: 100%;
height: 140px;
overflow-y: auto;
float: left;
text-align: left;
padding: 10px 20px;
}
.addreview .min_input {
width: 100%;
float: left;
}
.addreview .min_input input[type="text"] {
width: 180px;
height: 32px;
}
.addreview .min_input a.button {
height: 32px;
width: 150px;
float: right;
line-height: 32px;
font-size: 16px;
text-transform: inherit;
padding: 0 10px;
}
.addreview .min_input input[type="file"] {
display: none;
}
.addreview .result {
width: 345px;
display: inline-block;
}
.addreview .review_result {
display: inline-block;
width: 100%;
display: none;
float: left;
}
.addreview .review_result p {
text-align: left;
padding: 2px 9px 0px;
font-size: 15px;
font-weight: bold;
margin: 5px;
text-align: right;
font-family: Cairo, sans-serif !important;
}
.addreview .review_result .line {
height: 30px;
border-top-left-radius:5px;
border-bottom-left-radius:5px;
float: left;
min-width: 20px;
}
/* owmen17 */
.addreview .review_result .result_item {
display: inline-block;
float: right;
line-height: 30px;
font-size: 13px;
color: #999;
font-weight: bold;
}
.addreview .review_result .line.green_result {
background: #51c23b;
}
.addreview .review_result .line.red_result {
background: #ff5e5e;
}
.addreview .review_result .line.blue_result {
background: #45b9f6;
}
.widthpoll {
height: auto;
overflow: hidden;
border-radius: 5px;
background: #eee;
padding-right: 21px;
}
.addreview .review_result p.votenum {
text-align: center !important;
margin-top: 20px;
}
.addreview .review_result p span {
background: #00c0ff;
padding: 5px 10px;
border-radius: 4px;
color: #fff;
font-size: 18px;
margin-left: 8px;
}
@-webkit-keyframes green_view {
0% {
width: 0;
}
100% {
width: 68%;
}
}
@keyframes green_view {
0% {
width: 0;
}
100% {
width: 68%;
}
}
.green_view {/* bizlife_inc */
-webkit-animation: green_view 2s 1 ease-out;
-moz-animation: green_view 2s 1 ease-out;
-ms-animation: green_view 2s 1 ease-out;
-o-animation: green_view 2s 1 ease-out;
animation: green_view 2s 1 ease-out;
-webkit-animation-fill-mode: forwards;
-moz-animation-fill-mode: forwards;
-ms-animation-fill-mode: forwards;
-o-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
@-webkit-keyframes red_view {
0% {
width: 0;
}
100% {
width: 2%;
}
}
@keyframes red_view {
0% {
width: 0;
}
100% {
width: 2%;
}
}
.red_view {
-webkit-animation: red_view 2s 1 ease-out;
-moz-animation: red_view 2s 1 ease-out;
-ms-animation: red_view 2s 1 ease-out;
-o-animation: red_view 2s 1 ease-out;
animation: red_view 2s 1 ease-out;
-webkit-animation-fill-mode: forwards;
-moz-animation-fill-mode: forwards;
-ms-animation-fill-mode: forwards;
-o-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
@-webkit-keyframes blue_view {
0% {
width: 0;
}
100% {
width: 22%;
}
}
@keyframes blue_view {
0% {
width: 0;
}
100% {
width: 22%;
}
}
.blue_view {
-webkit-animation: blue_view 2s 1 ease-out;
-moz-animation: blue_view 2s 1 ease-out;
-ms-animation: blue_view 2s 1 ease-out;
-o-animation: blue_view 2s 1 ease-out;
animation: blue_view 2s 1 ease-out;
-webkit-animation-fill-mode: forwards;
-moz-animation-fill-mode: forwards;
-ms-animation-fill-mode: forwards;
-o-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
.b1 .price .old {
float: left;
width: 30%;
padding-right: 18px;
font-size: 11px;
line-height: 16px;
text-align: right;
font-family: Cairo, sans-serif !important;
}
.b1 .price .sale {
float: left;
width: 30%;
font-size: 16px;
line-height: 16px;
text-transform: uppercase;
padding-top: 2px;
text-shadow: 1px 1px 1px #00000026;
font-family: Cairo, sans-serif !important;
}
.b1 .price {
color: #fff;
font-family: 'DINRoundPro-Medi';
height: 70px;
width: 100%;
background: #ffffff0a;
padding-top: 7px;
padding-bottom: 5px;
border-radius: 6px;
box-shadow: 1px 1px 1px 2px #629818;
max-width: 280px;
margin: 0 auto;
}
.b1 .price .old div {
font-size: 18px;
line-height: 43px;
text-decoration: line-through;
font-family: Cairo, sans-serif !important;
}
.b1 .price .sale div {
font-size: 18px;
line-height: 36px;
background: #ff5e5e;
border-radius: 3px 5px 6px 6px;
border: 1px solid #ffffff;
height: 35px;
width: 50px;
padding-top: 4px;
text-align: center;
margin: 0 auto;
margin-top: 6px;
padding: 3px;
border-top: 3px solid #b53838;
}
.b1 .price .new div {
font-family: 'DINRoundPro-Bold';
font-size: 18px;
line-height: 43px;
}
.b1 .price .new {
float: right;
font-size: 14px;
line-height: 16px;
text-align: left;
width: 30%;
font-family: Cairo, sans-serif !important;
}
.t_right{
direction: rtl;
text-align: center;
font-size: 15px;
}
.bg_succ_cmd{
background: white;
padding: 15px;
overflow: hidden;
border-radius: 24px;
border: 2px solid #a9dfea;
margin-top: 6px;
}
.bg_succ_cmd h4{
color: green;
background: #c7ffc7;
padding: 5px;
border: 1px solid #65de65;
border-radius: 7px;
}
.carousel {
height: 190px;
width: 90%;
padding: 3px;
margin: 0 auto;
margin-bottom: 14px;
background: transparent;
border: 1px solid #ffffffb5;
border-radius: 10px;
}
.carousel-control{
text-shadow: 0 1px 2px rgba(255, 254, 254, 0.98);
}
.glyphicon-chevron-left:before {
color: #fc8105;
}
.glyphicon-chevron-right:before {
color: #fc8105;
}
.carousel-inner {
max-height: 200px;
background: transparent;
text-align: center;
align-items: center;
align-content: center;
margin: 0 auto;
height: 180px;
}
.carousel-inner img {
max-height: 200px;
text-align: center;
margin: 0 auto;
height: 180px !important;
border-radius: 10px;
}
.carousel-indicators{
display: none;
}
.carousel-control.right{
background: transparent;
}
.carousel-control.left{
background: transparent;
}
.carousel-control.right{
background: transparent;
}
.carousel-control .glyphicon-chevron-right, .carousel-control .icon-next {
right: 25%;
margin-right: -10px;
}
.carousel-control .glyphicon-chevron-left, .carousel-control .icon-prev {
left: 25%;
margin-left: -10px;
}
.modal-content{
float: left;
width: 100%;
padding: 5px;
max-width: 370px;
}
.modal-header {
padding: 5px;
border-bottom: 1px solid #f9f9f9;
text-align: center;
}
.modal-body{
float: left;
width: 100%;
padding-top: 2px;
}
.modal-footer{
padding: 0;
padding-top: 2px;
padding-bottom: 2px;
border: none;
}
.liste_produits{
width: 100%;
float: left;
position: relative;
margin: 0 auto;
}
.row_produit{width: 100%;float: left;margin-left: 0;margin-top: 14px;margin-right: 0;}
.div_a_propos{
background: #ffffff69;
padding: 6px;
border-radius: 4px;
width: 100%;
float: left;
margin-bottom: 7px;
color: white;
text-align: center;
}
.div_a_propos h2{
font-size: 17px;
font-weight: bold;
}
.row_produit img{border-radius: 6px;max-height: 210px;width: auto;max-width: 260px;}
.card-img-top{
text-align: center;
margin: 0 auto;
}
.name_product{
margin-top: 7px;
float: left;
width: 100%;
}
.name_product a{
color: #55595c;
}
.add_to_cart{
background: #FF9800;
background: linear-gradient(60deg, #ffd316 10%,#fa6800, #FFC312);
margin-top: 6px;
box-shadow: 2px 1px 2px 2px #9696964a;
color: white;
box-shadow: 0 0 0 0 #FFC107;
-webkit-animation: hello 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
-moz-animation: hello 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
-ms-animation: hello 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
animation: hello 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
width: 100%;
margin: 0 auto;
margin-top: 8px;
float: left;
height: 40px;
font-size: 20px;
line-height: 40px;
font-family: Cairo, sans-serif !important;
text-align: center;
border-radius: 6px;
border: 1px solid #ffaf0e;
}
.add_to_cart:hover{
color: #fffcf5;
text-decoration: unset;
background: #ffa501;
}
.add_to_cart2{
background: #FF9800;
background: linear-gradient(60deg, #ffd316 10%,#fa6800, #FFC312);
background: white;
margin-top: 6px;
box-shadow: 2px 1px 2px 2px #9696964a;
color: #fc8707;
box-shadow: 0 0 0 0 #FFC107;
-webkit-animation: hello 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
-moz-animation: hello 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
-ms-animation: hello 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
animation: hello 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
width: 100%;
margin: 0 auto;
margin-top: 8px;
float: left;
height: 40px;
font-size: 20px;
line-height: 40px;
font-family: Cairo, sans-serif !important;
text-align: center;
border-radius: 6px;
border: 1px solid #ffaf0e;
}
.add_to_cart2:hover{
color: #fffcf5;
text-decoration: unset;
background: #ffa501;
}
animation: hello 1.5s infinite cubic-bezier(0.66, 0, 0, 1);}
@-webkit-keyframes hello {to {box-shadow: 0 0 0 20px rgba(232, 76, 61, 0);}}
@-moz-keyframes hello {to {box-shadow: 0 0 0 20px rgba(232, 76, 61, 0);}}
@-ms-keyframes hello {to {box-shadow: 0 0 0 20px rgba(232, 76, 61, 0);}}
@keyframes hello {to {box-shadow: 0 0 0 20px rgba(232, 76, 61, 0);}}
.elm_produit{
background: white;
padding: 26px;
float: left;
width: 90%;
margin-left: 5%;
margin-right: 5%;
margin-bottom: 12px;
box-shadow: 2px 1px 2px 2px #c7c6c6;
border-radius: 10px;
padding-top: 10px;
padding-bottom: 10px;
}
.logo_fix{
padding: 10px;
color: #ffffff;
background: #ffa000;
font-size: 30px;
text-shadow: 1px 2px 2px #303233;
font-family: inherit;
margin: 0;
border-bottom: 1px solid #a7790d;
background: linear-gradient(to right, #FF9800, #ffd863);
z-index: 99;
width: 100%;
float: left;
}
.logo_fix a{color: #FFFFFF;font-family: "Cairo", Sans-serif;font-size: 18px;font-weight: 600;}
.container_fix{
width: 100%;
margin-top: 40px;
}
.produit_prix{
float: left;
color: #fd9809;
font-weight: bold;
font-size: 25px;
}
.produit_prix_old{
text-decoration: line-through;
color: #F44336;
float: right;
font-size: 25px;
}
.btn_whats_fix{
position: fixed;
bottom: 8px;
right: 18px;
}
.bg_div_header{
transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
background-size: cover;
background-repeat: no-repeat;
background-color: #FFD06008;
background-image: url(../img/bg_div_header.jpeg);
position: relative;
min-height: 380px;
padding: 40px;
}
.bg_div_header_container{
background-color: transparent;
background-image: linear-gradient(
360deg, #ECA42D 4%, #003B54 44%);
opacity: 0.56;
transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
min-height: 445px;
width: 100%;
top: 0;
left: 0;
position: absolute;
padding: 60px;
}
.white_text{
color: #fff !important;
}
.text-center{
text-align:center;
}
.text-rtl{
direction:rtl;
}
.heading-title {
color: #FFFFFF;
font-size: 22px;
font-weight: 600;
font-style: normal;
line-height: 1.6em;
font-family: "Droid Arabic Kufi", Sans-serif;
padding: 13px;
margin: 22px;
}
.content-title {
width: 100%;
max-width: 1140px;
margin: auto;
text-align: center;
font-family: "Droid Arabic Kufi", Sans-serif;
font-size: 20px;
font-weight: 500;
color: #7A7A7A;
}
.html5-video-container{
margin-top: 44px;
width: 100%;
height: ;
}
.btn_shop_now{
background: orange;
padding: 25px;
position: relative;
margin-top: 23px;
font-size: 24px;
text-align: center;
border-radius: 50px;
float: right;
}
.btn_shop_now i{
float: right;
color: white;
}
.btn_shop_now span{
float: right;
color: white;
line-height: 22px;
}
.section_content1{
width: 100%;
float: left;
background: white;
}
.text-orange{
font-weight: 700 !important;
color: orange !important;
}
.section_content1 h2{
color: #54595f;
font-family: "Droid Arabic Kufi", Sans-serif;
font-size: 35px;
font-weight: 600;
text-align: center;
padding-bottom: 26px;
direction: revert;
}
.section_content1 h3{
padding-bottom: 26px;
color: #54595F;
font-family: "Droid Arabic Kufi", Sans-serif;
font-size: 24px;
font-weight: 400;
text-align: center;
}
.intense_couv {float: left;width: 100%;}
.intense_img{
}
.intense_couv img{
float: left;
width: auto;
max-height: 310px;
border-radius: 12px;
margin-top: 8px;
margin-bottom: 17px;
}
.div_galerie{
padding: 17px;
margin: 8px;
border: 1px solid #edecec;
border-radius: 12px;
}
.div_galerie img{
border-radius:12px;
width: auto;
max-width: 284px;
min-width: 280px;
}
.text_orange{
text-align: center;
color: #F08F19;
font-family: "Droid Arabic Kufi", Sans-serif;
font-size: 29px;
font-weight: 400;
}
.intense_img img{float: right;width: auto;max-height: 430px;border-radius: 12px;margin-top: 8px;}
.div_trait{background: white;width: 100%;height: 2px;margin-bottom: 24px;float: left;margin-top: 20px;}
.div_trait_after{
height: 2px;
background:orange;
margin-left: 20%;
margin-right: 20%;
}
.btn_whats_fix i{font-size: 44px;color: #ffffff;text-align: center;border-radius: 50%;padding: 3px;background: #009688;}
.btn_whats_fix span{color: white;background: #009688bd;float: left;padding: 7px;min-width: 134px;text-align: center;margin-top: 10px;margin-right: 4px;border: 1px solid white;border-radius: 5px;}
.div_full_width{
width:100%;
float:left;
}
.btn_valid{
background: #F08F19;
width: 100%;
padding: 7px;
font-size: 22px;
color: white;
border: none;
border-radius: 18px;
font-family: "Droid Arabic Kufi", Sans-serif;
font-weight: 800;
}
.btn_shop_now_center{
background: orange;
color: white;
padding: 25px;
line-height: 42px;
font-size: 18px;
border-radius: 21px;
margin-bottom: 41px;
direction: rtl;
text-align: right;}
.btn_shop_now_center:hover{
color:white;
}
.div_shop_now_center{
margin-bottom: 41px;
}
@media only screen and (max-width: 600px) {
/* css mobile only */
.bg_div_header{
padding: 14px;
}
.div_logo_onsa img {
padding: 3px;
height: auto;
width: auto;
max-height: 200px;
}
.div_stars img {
padding: 3px;
height: auto;
width: auto;
max-height: 60px;
}
.intense_couv {
width:100%;
margin:0 auto;
}
.intense_couv img {
float: none;
min-height:auto;
max-width: 300px;
width:auto;
}
.html5-video-container iframe{
margin-top:18px;
width:100% !important;
min-height: 280px !important;
margin-left:auto;
margin-right:auto;
min-width: 280px;
}
.intense_img img{
float:none !important;
}
.btn_shop_now span {
float: none;
color: white;
line-height: 9px !important;
font-size: 16px !important;
}
.btn_shop_now{
font-size: 16px !important;
padding: 18px;
}
.content-title{
font-size: 16px !important;
}
.div_shop_now_center{
margin-bottom: 2px;
}
.section_content1 h2 {
font-size: 18px;
margin: 4px;
padding: 5px;
}
.heading-title {
font-size: 14px;
}
.html5-video-container {
float: left;
width: 100%;
margin: auto;
margin-top: 10px;
}
}
html{
}
body {margin: 0 auto;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;background-position: center;background-repeat: no-repeat;min-height: 100%;font: 400 14px/1.42857143 Roboto,sans-serif;padding-top: 0;box-sizing: border-box;margin: 0 auto;margin-bottom: 410px;background: white;background-size: cover;}
.fiche_produit ::-webkit-scrollbar {
width: 5px;
height:40px;
}
.fiche_produit ::-webkit-scrollbar-thumb {
background: #ffb610;
}
#page_content_inner {
padding: 0px 10px 100px;
}
.footer_fix{
background: #ffffff;
height: 97px;
width: 100%;
position: fixed;
bottom: 0;
left: 0;
border-top: 3px solid #fa6800;
}
.prod_l{position: fixed;bottom: 2px;left: 5px;height: 144px;}
.shake{
/* Start the shake animation and make the animation last for 0.5 seconds */
animation: shake 0.9s;
/* When the animation is finished, start again */
animation-iteration-count: 3;
}
@keyframes shake {
from,
to {
transform: translate3d(0, 0, 0)
}
10%,
30%,
50%,
70%,
90% {
transform: translate3d(-10px, 0, 0)
}
20%,
40%,
60%,
80% {
transform: translate3d(10px, 0, 0)
}
}
@keyframes headShake {
0% {
transform: translateX(0)
}
6.5% {
transform: translateX(-6px) rotateY(-9deg)
}
18.5% {
transform: translateX(5px) rotateY(7deg)
}
31.5% {
transform: translateX(-3px) rotateY(-5deg)
}
43.5% {
transform: translateX(2px) rotateY(3deg)
}
50% {
transform: translateX(0)
}
}
.headShake {
animation-timing-function: ease-in-out;
animation-name: headShake
}
#left_btn{
position: fixed;
bottom: 12px;
right: 30px;
background: #FFC312;
padding: 4px;
color: white;
text-align: center;
height: 24px;
border-radius: 7px 7px 7px 7px;
box-shadow: 0 1px 3px rgba(39, 38, 38, 0.52), 0 1px 2px rgb(74, 74, 74);
background: linear-gradient(60deg, #ffd316 10%,#fa6800, #FFC312);
min-width: 122px;
width: 130px;
text-decoration: none;
line-height: 26px;
cursor: pointer;
font-size: 20px !important;
height: 36px;
font-family: Cairo, sans-serif !important;
}
#left_btn_w{
position: fixed;
bottom: 54px;
right: 30px;
background: #FFC312;
padding: 5px;
color: white;
text-align: center;
border-radius: 7px 7px 7px 7px;
box-shadow: 0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(23, 22, 22, 0.99);
background: linear-gradient(60deg, #009688 10%,#009688, #009688);
min-width: 122px;
width: 130px;
text-decoration: none;
line-height: 26px;
cursor: pointer;
font-size: 20px !important;
height: 36px;
font-family: Cairo, sans-serif !important;
}
@-webkit-keyframes spin_btn { 100% {font-size: 26px !important; box-shadow: 0 1px 3px rgb(6, 6, 6), 0 1px 2px rgb(4, 4, 4) !important;} }
@keyframes spin_btn { 100% {font-size: 20px; box-shadow: 0 1px 3px rgba(6, 6, 6, 0.26), 0 1px 2px rgba(4, 4, 4, 0.2) ;} }
.new-logo{
width: 60px;
margin: 0px;
border: none;
background: #ffffff;
margin-top: 2px;
margin-bottom: 1px;
box-shadow: 1px 1px 1px 1px rgb(255, 184, 11);
border-radius: 9px;
padding: 6px;
}
.div-new-logo {
text-align: center;
margin-bottom: 2px;
padding-top: 5px;
}
.div_logo_onsa{
background:white;
width:100%;
padding: 7px;
text-align: center;
}
.div_logo_onsa img{
padding: 3px;
height: 250px;
}
.div_stars{
background:white;
width:100%;
padding: 7px;
text-align: center;
}
.div_stars img{
padding: 3px;
width: auto;
}
.div_logo_shp{
background:white;
width:100%;
padding: 7px;
text-align: center;
}
.div_logo_shp img{
padding: 3px;
height: 55px;
}
.content_fiche_p{
width:100%;
float: left;
overflow: auto;
margin-top: 50px;
}
.nom_prod {
text-align: center;
letter-spacing: 2px;
color: #FF9800;
background: #ffffff;
padding: 5px;
text-shadow: 1px 2px 2px #efefef;
margin-bottom: 5px;
font-size: 30px;
font-style: normal;
font-weight: 400;
line-height: 1.10909;
text-transform: unset;
font-family: 'Caveat';
width: 90%;
margin: 0 auto;
border-radius: 6px;
margin-bottom: 5px;
border: 1px solid #FF9800;
margin-top: 3px;
}
.fiche_produit{
width: 100%;
float: left;
min-height: 500px;
overflow: auto;
margin-bottom: 130px;
}
.text_des_prod{
width: 90%;
background: #ffffffe0;
border: 1px solid #5a585a;
padding: 17px;
margin-right: 11px;
float: right;
border-radius: 8px;
margin-top: 1px;
max-height: 240px;
overflow: auto;
box-shadow: 2px 1px 1px 1px #ffffff69;
margin-bottom: 3px;
text-shadow: 1px 1px 1px #e4e2e2;
color: #2f2e2e;
font-size: 16px;
direction: rtl;
text-align: right;
font-family: Cairo, sans-serif !important;
}
.form_cl{
background: #ffffffcf;
width: 100%;
padding: 10px;
margin-top: 0px;
border-radius: 6px;
min-width: 277px;
height: 100%;
padding-top: 0px;
}
.form_cl label{
height: 26px;
width: 23%;
padding: 2px;
padding-right: 7px;
max-width: 110px;
margin-top: 3px;
color:#383535;
text-align: right;
direction: rtl;
float: right;
font-family: 'Amiri', serif !important;
}
.form_cl input,.form_cl select{
padding: 2px;
margin-top: 8px;
text-align-last: center;
position: relative;
display: block;
outline: 0;
width: 90%;
min-width: 260px;
height: 32px;
line-height: 80px;
margin: 0 auto;
background: #fff;
color: #222;
text-indent: 15px;
font-size: 18px;
text-align: center;
font-family: "DINRoundPro", Helvetica, sans-serif;
margin-bottom: 14px;
border-radius: 10px;
box-shadow: inset 0px -3px 3px 1px #0000002b;
border: 1px solid #c1c1c1;
}
.full_w{
width: 100%;
float: left;
}
.h2_fiche{
float: right;
padding: 9px;
margin: auto;
border-radius: 8px;
border: 1px solid #ffffff;
margin-right: 5px;
width: 90%;
color: white;
text-align: right;
padding-right: 10px;
font-size: 19px;
font-family: 'Amiri', serif !important;
cursor: pointer;
box-shadow: 0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(0,0,0,.24);
margin-bottom: 4px;
background-image: linear-gradient(288.1deg,#fc8205 28.5%,#ffcb14 99.18%);
line-height: 19px;
font-family: Cairo, sans-serif !important;
}
.h2_fiche i{
float: right;
margin-left: 9px;
}
.des_prod i{
float: right;
margin-left: 9px;
}
.div_qte{
border-top: 2px solid #8d8d8d;
}
.div_qte p{
text-align: center;
font-size: 19px;
margin: 6px;
padding: 0;
color: #707070;
border-radius: 6px;
float: right;
min-width: 100px;
margin-top: 8px;
width: 45%;
height: 32px;
direction: rtl;
}
.div_qte select{
min-width:60px;
margin-bottom: 0px;
padding: 0;
margin-top: 8px;
width: 45%;
max-width: 70px;
float: right;
}
#cmd_btn{
margin-top: 10px;
padding: 5px;
width: 80%;
margin-left: 10%;
background: #febe11;
background: linear-gradient(60deg, #ffd316 10%,#fa6800, #FFC312);
color: white;
font-size: 20px;
border-radius: 12px;
box-shadow: 0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(218, 218, 218, 0.99);
font-family: 'Amiri', serif !important;
height: 40px;
cursor: pointer;
}
#cmd_btn:hover{
background: linear-gradient(60deg, #FFC107 10%,#fa6800, #b78d11);
}
#DateCountdown{margin: 0 auto;border-radius: 13px;height: 59px;width: 240px;padding: 7px;margin-bottom: 10px;}
/**
* This element is created inside your target element
* It is used so that your own element will not need to be altered
**/
.el-timer {
width: 370px;
margin: 0 auto;
}
.time_circles {
position: relative;
width: 100%;
height: 100%;
margin: 0 auto;
text-align: center;
background: transparent;
padding: 0;
}
/**
* This is all the elements used to house all text used
* in time circles
**/
.time_circles > div {
position: absolute;
text-align: center;
}
/**
* Titles (Days, Hours, etc)
**/
.time_circles > div > h4 {
margin: 0px;
padding: 0px;
text-align: center;
text-transform: uppercase;
color: #fff;
}
.el-timer2 .time_circles > div > h4 {
color: #a1e019;
}
/**
* Time numbers, ie: 12
**/
.time_circles > div > span {
display: block;
width: 100%;
text-align: center;
font-size: 300%;
margin-top: 0.4em;
font-weight: 400;
color: #fff;
}
.el-timer2 .time_circles > div > span {
color: #FFC107;
}
.time_center{
font-family: 'DINRoundPro-Bold';
font-size: 18px;
line-height: 18px;
color: #fff;
text-align: center;
background: #8dc53e;
background-image: linear-gradient(288.1deg,#6daf14 28.5%,#9dde3c 99.18%);
border-top: 2px solid #6aa513;
border-bottom: 2px solid #68922b;
background-size: cover;
border-radius: 10px;
height: 100%;
min-height: 270px;
width: 90%;
margin: 0 auto;
margin-bottom: 5px;
padding: 10px;
}
.time_center p{
padding-bottom: 4px;
margin: 4px;
font-size: 24px;
background: #ffffff40;
line-height: 38px;
margin-bottom: 0px;
border-radius: 4px;
font-family: Cairo, sans-serif !important;
}
#center_btn{
position: relative;
background: #FFC312;
background-image: linear-gradient(to bottom, #fdcf00, #ffb000);
padding: 1px;
color: #f5f5f5;
text-align: center;
height: 18px;
border-radius: 7px;
min-width: 200px;
width: 80%;
margin-left: 7%;
cursor: pointer;
font-size: 25px !important;
font-family: 'Amiri', serif !important;
text-decoration: none;
float: left;
border-bottom: 5px solid #d59300;
box-shadow: 0 16px 13px -8px rgba(0, 0, 0, 0.2);
margin-top: 3px;
height: 55px;
line-height: 25px;
padding-top: 0;
font-family: Cairo, sans-serif !important;
}
#center_btn i{
line-height: 21px;
margin-left: 8px;
font-size: 21px;
margin-top: 6px;
}
.full_w_marg{
width: 100%;
float: left;
margin-top: 5px;
}
.products_count {
margin: 10px 0 0 0;
padding-bottom: 10px;
font-family: 'DINRoundPro-Bold';
font-size: 18px;
text-align: center;
color: #FF9800;
background: #ffffffeb;
width: 90%;
float: right;
padding-top: 7px;
margin-right: 5px;
font-family: Cairo, sans-serif !important;
}
.products_count span {
display: inline-block;
vertical-align: middle;
margin: 0px 3px 0 3px;
padding: 1px 8px;
height: 28px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
font-size: 18px;
color: #fff;
background: #ffb300;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
background-image: -webkit-linear-gradient(top,#f9cb00,#ffb200);
background-image: -moz-linear-gradient(top,#f9cb00,#ffb200);
background-image: -ms-linear-gradient(top,#f9cb00,#ffb200);
background-image: -o-linear-gradient(top,#f9cb00,#ffb200);
background-image: linear-gradient(to bottom,#f9cb00,#ffb200);
border-bottom: 2px solid #d59300;
}
/*---------- */
.blue1 {
background: #2d3f9c;
color: #fff;
border-top: 2px solid #1774bd;
border-bottom: 2px solid #1764a0;
background-image: linear-gradient(288.1deg,#2196F3 28.5%,#8ad2f9 99.18%);
margin: 0;
padding: 0;
}
.pad_bot30 {
padding-bottom: 14px;
border-radius: 10px;
width: 90%;
margin: 0 auto;
margin-bottom: 8px;
padding: 6px;
margin-top: 5px;
float: right;
margin-right: 5px;
}
h2.title_white {
text-align: center;
color: #fff;
font-size: 25px;
line-height: 21px;
text-transform: uppercase;
padding: 3px;
margin-bottom: 0px;
margin-top: 0px;
font-family: Cairo, sans-serif !important;
}
h2.title_white:after {
content: '';
display: block;
width: 110px;
height: 9px;
background: url(../img/title_white.png) center top no-repeat;
position: relative;
left: 50%;
bottom: -18px;
margin-left: -55px;
}
.addreview {
text-align: center;
background: #fff;
margin: 0 9px;
padding: 6px;
border-radius: 10px;
color: #222;
}
.addreview .reviews_test {
display: inline-block;
position: relative;
}
.addreview .reviews_test:after {
content: '';
display: block;
width: 100%;
height: 22px;
position: absolute;
left: 0;
background-size: contain;
}
.addreview .review_radio {
width: 100%;
height: 45px;
line-height: 41px;
display: inline-block;
cursor: pointer;
margin-bottom: 0px;
border-radius: 45px;
border: 2px solid #000;
}
.addreview .review_radio.green_radio {
border-color: #f2f2f2;
}
.addreview .review_radio.red_radio {
border-color: #f2f2f2;
}
.addreview .review_radio.blue_radio {
border-color: #f2f2f2;
}
.addreview .review_radio:before {
width: 12px;
height: 12px;
margin: 10px;
display: inline-block;
content: "";
border: 4px solid #000;
border-radius: 20px;
float: right;
}
.addreview .review_radio.green_radio:before {
border-color: #51c23b;
}
.addreview .review_radio.red_radio:before {
border-color: #ff5e5e;
}
.addreview .review_radio.blue_radio:before {
border-color: #45b9f6;
}
.addreview .review_radio.green_radio.active:before {
background: #00c04a;
}
.addreview .review_radio.red_radio.active:before {
background: #de3437;
}
.addreview .review_radio.blue_radio.active:before {
background: #00b0f4;
}
.addreview .review_radio input[type=radio] {
display: none;
}
.addreview .review_radio span {
display: inline-block;
float: right;
font-size: 16px;
font-family: Cairo, sans-serif !important;
}
.addreview .review_box {
background: #e1e1e1;
padding: 20px 35px;
width: 100%;
max-width: 415px;
display: inline-block;
}
.addreview_title {
text-align: center;
font-weight: 900;
text-transform: uppercase;
margin-bottom: 10px;
font-size: 16px;
}
.addreview input,
.addreview textarea {
background: #fff;
border: 1px solid #c2c2c2;
border-radius: 3px;
font-size: 16px;
margin-bottom: 10px;
}
.addreview textarea {
width: 100%;
height: 140px;
overflow-y: auto;
float: left;
text-align: left;
padding: 10px 20px;
}
.addreview .min_input {
width: 100%;
float: left;
}
.addreview .min_input input[type="text"] {
width: 180px;
height: 32px;
}
.addreview .min_input a.button {
height: 32px;
width: 150px;
float: right;
line-height: 32px;
font-size: 16px;
text-transform: inherit;
padding: 0 10px;
}
.addreview .min_input input[type="file"] {
display: none;
}
.addreview .result {
width: 345px;
display: inline-block;
}
.addreview .review_result {
display: inline-block;
width: 100%;
display: none;
float: left;
}
.addreview .review_result p {
text-align: left;
padding: 2px 9px 0px;
font-size: 15px;
font-weight: bold;
margin: 5px;
text-align: right;
font-family: Cairo, sans-serif !important;
}
.addreview .review_result .line {
height: 30px;
border-top-left-radius:5px;
border-bottom-left-radius:5px;
float: left;
min-width: 20px;
}
/* owmen17 */
.addreview .review_result .result_item {
display: inline-block;
float: right;
line-height: 30px;
font-size: 13px;
color: #999;
font-weight: bold;
}
.addreview .review_result .line.green_result {
background: #51c23b;
}
.addreview .review_result .line.red_result {
background: #ff5e5e;
}
.addreview .review_result .line.blue_result {
background: #45b9f6;
}
.widthpoll {
height: auto;
overflow: hidden;
border-radius: 5px;
background: #eee;
padding-right: 21px;
}
.addreview .review_result p.votenum {
text-align: center !important;
margin-top: 20px;
}
.addreview .review_result p span {
background: #00c0ff;
padding: 5px 10px;
border-radius: 4px;
color: #fff;
font-size: 18px;
margin-left: 8px;
}
@-webkit-keyframes green_view {
0% {
width: 0;
}
100% {
width: 68%;
}
}
@keyframes green_view {
0% {
width: 0;
}
100% {
width: 68%;
}
}
.green_view {/* bizlife_inc */
-webkit-animation: green_view 2s 1 ease-out;
-moz-animation: green_view 2s 1 ease-out;
-ms-animation: green_view 2s 1 ease-out;
-o-animation: green_view 2s 1 ease-out;
animation: green_view 2s 1 ease-out;
-webkit-animation-fill-mode: forwards;
-moz-animation-fill-mode: forwards;
-ms-animation-fill-mode: forwards;
-o-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
@-webkit-keyframes red_view {
0% {
width: 0;
}
100% {
width: 2%;
}
}
@keyframes red_view {
0% {
width: 0;
}
100% {
width: 2%;
}
}
.red_view {
-webkit-animation: red_view 2s 1 ease-out;
-moz-animation: red_view 2s 1 ease-out;
-ms-animation: red_view 2s 1 ease-out;
-o-animation: red_view 2s 1 ease-out;
animation: red_view 2s 1 ease-out;
-webkit-animation-fill-mode: forwards;
-moz-animation-fill-mode: forwards;
-ms-animation-fill-mode: forwards;
-o-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
@-webkit-keyframes blue_view {
0% {
width: 0;
}
100% {
width: 22%;
}
}
@keyframes blue_view {
0% {
width: 0;
}
100% {
width: 22%;
}
}
.blue_view {
-webkit-animation: blue_view 2s 1 ease-out;
-moz-animation: blue_view 2s 1 ease-out;
-ms-animation: blue_view 2s 1 ease-out;
-o-animation: blue_view 2s 1 ease-out;
animation: blue_view 2s 1 ease-out;
-webkit-animation-fill-mode: forwards;
-moz-animation-fill-mode: forwards;
-ms-animation-fill-mode: forwards;
-o-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
.b1 .price .old {
float: left;
width: 30%;
padding-right: 18px;
font-size: 11px;
line-height: 16px;
text-align: right;
font-family: Cairo, sans-serif !important;
}
.b1 .price .sale {
float: left;
width: 30%;
font-size: 16px;
line-height: 16px;
text-transform: uppercase;
padding-top: 2px;
text-shadow: 1px 1px 1px #00000026;
font-family: Cairo, sans-serif !important;
}
.b1 .price {
color: #fff;
font-family: 'DINRoundPro-Medi';
height: 70px;
width: 100%;
background: #ffffff0a;
padding-top: 7px;
padding-bottom: 5px;
border-radius: 6px;
box-shadow: 1px 1px 1px 2px #629818;
max-width: 280px;
margin: 0 auto;
}
.b1 .price .old div {
font-size: 18px;
line-height: 43px;
text-decoration: line-through;
font-family: Cairo, sans-serif !important;
}
.b1 .price .sale div {
font-size: 18px;
line-height: 36px;
background: #ff5e5e;
border-radius: 3px 5px 6px 6px;
border: 1px solid #ffffff;
height: 35px;
width: 50px;
padding-top: 4px;
text-align: center;
margin: 0 auto;
margin-top: 6px;
padding: 3px;
border-top: 3px solid #b53838;
}
.b1 .price .new div {
font-family: 'DINRoundPro-Bold';
font-size: 18px;
line-height: 43px;
}
.b1 .price .new {
float: right;
font-size: 14px;
line-height: 16px;
text-align: left;
width: 30%;
font-family: Cairo, sans-serif !important;
}
.t_right{
direction: rtl;
text-align: center;
font-size: 15px;
}
.bg_succ_cmd{
background: white;
padding: 15px;
overflow: hidden;
border-radius: 24px;
border: 2px solid #a9dfea;
margin-top: 6px;
}
.bg_succ_cmd h4{
color: green;
background: #c7ffc7;
padding: 5px;
border: 1px solid #65de65;
border-radius: 7px;
}
.carousel {
height: 190px;
width: 90%;
padding: 3px;
margin: 0 auto;
margin-bottom: 14px;
background: transparent;
border: 1px solid #ffffffb5;
border-radius: 10px;
}
.carousel-control{
text-shadow: 0 1px 2px rgba(255, 254, 254, 0.98);
}
.glyphicon-chevron-left:before {
color: #fc8105;
}
.glyphicon-chevron-right:before {
color: #fc8105;
}
.carousel-inner {
max-height: 200px;
background: transparent;
text-align: center;
align-items: center;
align-content: center;
margin: 0 auto;
height: 180px;
}
.carousel-inner img {
max-height: 200px;
text-align: center;
margin: 0 auto;
height: 180px !important;
border-radius: 10px;
}
.carousel-indicators{
display: none;
}
.carousel-control.right{
background: transparent;
}
.carousel-control.left{
background: transparent;
}
.carousel-control.right{
background: transparent;
}
.carousel-control .glyphicon-chevron-right, .carousel-control .icon-next {
right: 25%;
margin-right: -10px;
}
.carousel-control .glyphicon-chevron-left, .carousel-control .icon-prev {
left: 25%;
margin-left: -10px;
}
.modal-content{
float: left;
width: 100%;
padding: 5px;
max-width: 370px;
}
.modal-header {
padding: 5px;
border-bottom: 1px solid #f9f9f9;
text-align: center;
}
.modal-body{
float: left;
width: 100%;
padding-top: 2px;
}
.modal-footer{
padding: 0;
padding-top: 2px;
padding-bottom: 2px;
border: none;
}
.liste_produits{
width: 100%;
float: left;
position: relative;
margin: 0 auto;
}
.row_produit{width: 100%;float: left;margin-left: 0;margin-top: 14px;margin-right: 0;}
.div_a_propos{
background: #ffffff69;
padding: 6px;
border-radius: 4px;
width: 100%;
float: left;
margin-bottom: 7px;
color: white;
text-align: center;
}
.div_a_propos h2{
font-size: 17px;
font-weight: bold;
}
.row_produit img{border-radius: 6px;max-height: 210px;width: auto;max-width: 260px;}
.card-img-top{
text-align: center;
margin: 0 auto;
}
.name_product{
margin-top: 7px;
float: left;
width: 100%;
}
.name_product a{
color: #55595c;
}
.add_to_cart{
background: #FF9800;
background: linear-gradient(60deg, #ffd316 10%,#fa6800, #FFC312);
margin-top: 6px;
box-shadow: 2px 1px 2px 2px #9696964a;
color: white;
box-shadow: 0 0 0 0 #FFC107;
-webkit-animation: hello 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
-moz-animation: hello 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
-ms-animation: hello 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
animation: hello 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
width: 100%;
margin: 0 auto;
margin-top: 8px;
float: left;
height: 40px;
font-size: 20px;
line-height: 40px;
font-family: Cairo, sans-serif !important;
text-align: center;
border-radius: 6px;
border: 1px solid #ffaf0e;
}
.add_to_cart:hover{
color: #fffcf5;
text-decoration: unset;
background: #ffa501;
}
.add_to_cart2{
background: #FF9800;
background: linear-gradient(60deg, #ffd316 10%,#fa6800, #FFC312);
background: white;
margin-top: 6px;
box-shadow: 2px 1px 2px 2px #9696964a;
color: #fc8707;
box-shadow: 0 0 0 0 #FFC107;
-webkit-animation: hello 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
-moz-animation: hello 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
-ms-animation: hello 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
animation: hello 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
width: 100%;
margin: 0 auto;
margin-top: 8px;
float: left;
height: 40px;
font-size: 20px;
line-height: 40px;
font-family: Cairo, sans-serif !important;
text-align: center;
border-radius: 6px;
border: 1px solid #ffaf0e;
}
.add_to_cart2:hover{
color: #fffcf5;
text-decoration: unset;
background: #ffa501;
}
animation: hello 1.5s infinite cubic-bezier(0.66, 0, 0, 1);}
@-webkit-keyframes hello {to {box-shadow: 0 0 0 20px rgba(232, 76, 61, 0);}}
@-moz-keyframes hello {to {box-shadow: 0 0 0 20px rgba(232, 76, 61, 0);}}
@-ms-keyframes hello {to {box-shadow: 0 0 0 20px rgba(232, 76, 61, 0);}}
@keyframes hello {to {box-shadow: 0 0 0 20px rgba(232, 76, 61, 0);}}
.elm_produit{
background: white;
padding: 26px;
float: left;
width: 90%;
margin-left: 5%;
margin-right: 5%;
margin-bottom: 12px;
box-shadow: 2px 1px 2px 2px #c7c6c6;
border-radius: 10px;
padding-top: 10px;
padding-bottom: 10px;
}
.logo_fix{
padding: 10px;
color: #ffffff;
background: #ffa000;
font-size: 30px;
text-shadow: 1px 2px 2px #303233;
font-family: inherit;
margin: 0;
border-bottom: 1px solid #a7790d;
background: linear-gradient(to right, #FF9800, #ffd863);
z-index: 99;
width: 100%;
float: left;
}
.logo_fix a{color: #FFFFFF;font-family: "Cairo", Sans-serif;font-size: 18px;font-weight: 600;}
.container_fix{
width: 100%;
margin-top: 40px;
}
.produit_prix{
float: left;
color: #fd9809;
font-weight: bold;
font-size: 25px;
}
.produit_prix_old{
text-decoration: line-through;
color: #F44336;
float: right;
font-size: 25px;
}
.btn_whats_fix{
position: fixed;
bottom: 8px;
right: 18px;
}
.bg_div_header{
transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
background-size: cover;
background-repeat: no-repeat;
background-color: #FFD06008;
background-image: url(../img/bg_div_header.jpeg);
position: relative;
min-height: 380px;
padding: 40px;
}
.bg_div_header_container{
background-color: transparent;
background-image: linear-gradient(
360deg, #ECA42D 4%, #003B54 44%);
opacity: 0.56;
transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
min-height: 445px;
width: 100%;
top: 0;
left: 0;
position: absolute;
padding: 60px;
}
.white_text{
color: #fff !important;
}
.text-center{
text-align:center;
}
.text-rtl{
direction:rtl;
}
.heading-title {
color: #FFFFFF;
font-size: 22px;
font-weight: 600;
font-style: normal;
line-height: 1.6em;
font-family: "Droid Arabic Kufi", Sans-serif;
padding: 13px;
margin: 22px;
}
.content-title {
width: 100%;
max-width: 1140px;
margin: auto;
text-align: center;
font-family: "Droid Arabic Kufi", Sans-serif;
font-size: 20px;
font-weight: 500;
color: #7A7A7A;
}
.html5-video-container{
margin-top: 44px;
width: 100%;
height: ;
}
.btn_shop_now{
background: orange;
padding: 25px;
position: relative;
margin-top: 23px;
font-size: 24px;
text-align: center;
border-radius: 50px;
float: right;
}
.btn_shop_now i{
float: right;
color: white;
}
.btn_shop_now span{
float: right;
color: white;
line-height: 22px;
}
.section_content1{
width: 100%;
float: left;
background: white;
}
.text-orange{
font-weight: 700 !important;
color: orange !important;
}
.section_content1 h2{
color: #54595f;
font-family: "Droid Arabic Kufi", Sans-serif;
font-size: 35px;
font-weight: 600;
text-align: center;
padding-bottom: 26px;
direction: revert;
}
.section_content1 h3{
padding-bottom: 26px;
color: #54595F;
font-family: "Droid Arabic Kufi", Sans-serif;
font-size: 24px;
font-weight: 400;
text-align: center;
}
.intense_couv {float: left;width: 100%;}
.intense_img{
}
.intense_couv img{
float: left;
width: auto;
max-height: 310px;
border-radius: 12px;
margin-top: 8px;
margin-bottom: 17px;
}
.div_galerie{
padding: 17px;
margin: 8px;
border: 1px solid #edecec;
border-radius: 12px;
}
.div_galerie img{
border-radius:12px;
width: auto;
max-width: 284px;
min-width: 280px;
}
.text_orange{
text-align: center;
color: #F08F19;
font-family: "Droid Arabic Kufi", Sans-serif;
font-size: 29px;
font-weight: 400;
}
.intense_img img{float: right;width: auto;max-height: 430px;border-radius: 12px;margin-top: 8px;}
.div_trait{background: white;width: 100%;height: 2px;margin-bottom: 24px;float: left;margin-top: 20px;}
.div_trait_after{
height: 2px;
background:orange;
margin-left: 20%;
margin-right: 20%;
}
.btn_whats_fix i{font-size: 44px;color: #ffffff;text-align: center;border-radius: 50%;padding: 3px;background: #009688;}
.btn_whats_fix span{color: white;background: #009688bd;float: left;padding: 7px;min-width: 134px;text-align: center;margin-top: 10px;margin-right: 4px;border: 1px solid white;border-radius: 5px;}
.div_full_width{
width:100%;
float:left;
}
.btn_valid{
background: #F08F19;
width: 100%;
padding: 7px;
font-size: 22px;
color: white;
border: none;
border-radius: 18px;
font-family: "Droid Arabic Kufi", Sans-serif;
font-weight: 800;
}
.btn_shop_now_center{
background: orange;
color: white;
padding: 25px;
line-height: 42px;
font-size: 18px;
border-radius: 21px;
margin-bottom: 41px;
direction: rtl;
text-align: right;}
.btn_shop_now_center:hover{
color:white;
}
.div_shop_now_center{
margin-bottom: 41px;
}
@media only screen and (max-width: 600px) {
/* css mobile only */
.bg_div_header{
padding: 14px;
}
.div_logo_onsa img {
padding: 3px;
height: auto;
width: auto;
max-height: 200px;
}
.div_stars img {
padding: 3px;
height: auto;
width: auto;
max-height: 60px;
}
.intense_couv {
width:100%;
margin:0 auto;
}
.intense_couv img {
float: none;
min-height:auto;
max-width: 300px;
width:auto;
}
.html5-video-container iframe{
margin-top:18px;
width:100% !important;
min-height: 280px !important;
margin-left:auto;
margin-right:auto;
min-width: 280px;
}
.intense_img img{
float:none !important;
}
.btn_shop_now span {
float: none;
color: white;
line-height: 9px !important;
font-size: 16px !important;
}
.btn_shop_now{
font-size: 16px !important;
padding: 18px;
}
.content-title{
font-size: 16px !important;
}
.div_shop_now_center{
margin-bottom: 2px;
}
.section_content1 h2 {
font-size: 18px;
margin: 4px;
padding: 5px;
}
.heading-title {
font-size: 14px;
}
.html5-video-container {
float: left;
width: 100%;
margin: auto;
margin-top: 10px;
}
}