/* colors
text;
dark red : #e64a58;
dark Blue : #1a3257;
soft Blue : #7c91b2;
border : #d4ebf9;
blue : #1f85d9;

Grad;
soft to dark blue : #87c8fe -> #193694;
white to soft blue : #ffffff -> #f1f8fe;
*/

/* General *********************/

body {
	font-family: 'Noto Sans Arabic', sans-serif;
  font-style: normal;
  background: #ffffff;
  color: #5c5c5c;
  font-weight: 500;
  /* -webkit-user-select: none;
   -khtml-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; */
  position: relative;
}
img {
  	-webkit-user-drag: none;
  	-khtml-user-drag: none;
  	-moz-user-drag: none;
  	-o-user-drag: none;
  	user-drag: none;
}
a {
	-webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -ms-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}

p {
  font-weight: 300;
  font-size: 1.1rem;
}
.bk-color {
  color: #292929;
}
.rd-color {
  color: #d81324;
}
.bared {
  text-decoration: line-through;
}
.w-f {
  width: 100%;
}
@keyframes glowing-red {
  0% {
    background-color: #d81324;
    box-shadow: 0 0 5px #d81324;
  }
  50% {
    background-color: #bc1b29;
    box-shadow: 0 0 20px #bc1b29;
  }
  100% {
    background-color: #d81324;
    box-shadow: 0 0 5px #d81324;
  }
}
.flashbtns-red {
    -webkit-animation: glowing-red 1500ms infinite;
    -moz-animation: glowing-red 1500ms infinite;
    -o-animation: glowing-red 1500ms infinite;
    animation: glowing-red 1500ms infinite;
}
/**********************************************************************/
.header-section {
  background: url(../img/slider1.png) no-repeat bottom center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  padding-top: 50px;
  color: #ffffff;
  position: relative;
}

.bottom-border {
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
}
.product-img {
  width: 100%;
  height: auto;
}

.top-seller-img {
  max-width: 80%;
  margin-bottom: 20px;
}

.price-tag {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: center;
  margin-top: 15px;
  margin-bottom: 15px;
}
.price-tag .price {
  color: #d81324;
  font-size: 8rem;
  margin-bottom: 0px;
  line-height: .8;
}

.form-section {
  margin-top: -100px;
  margin-bottom: 30px;
}

.form-section .content {
  padding-top: 120px;
}
.form-section .item-img {
  width: 100px;
  height: 100px;
}

.form-block {
  width: 100%;
  border-radius: 5px;
  background: #ffffff;
  overflow: hidden;
  -webkit-box-shadow: 0px 0px 15px 0px rgb(50 50 50 / 50%);
  -moz-box-shadow: 0px 0px 15px 0px rgba(50, 50, 50, 0.5);
  box-shadow: 0px 0px 15px 0px rgb(50 50 50 / 50%);
  margin-bottom: 15px;
}
.form-block .tlt {
  background: #d81324;
  color: #ffffff;
  padding: 30px 15px;
  text-align: center;
}
.form-block .ctx {
  padding: 30px 15px;
}
.form-block .form-control {
  text-align: right;
  border: 1px solid #c8c8c8;
  padding-top: 15px;
  padding-bottom: 15px;
  height: auto;
}
.form-block .form-control:focus {
  outline: none;
  border: 1px solid #d81324;
  box-shadow: none;
}
.form-block .form-control::placeholder {
  color: #c8c8c8;
  font-weight: 300;
}

.btn-radio {
  width: 100%;
  border: 1px solid #c8c8c8;
  border-radius: 5px;
  background: #ffffff;
  margin-top: 15px;
  display: flex;
  flex-direction: row;
  align-items: center;
  cursor: pointer;
  padding-top: 15px;
  padding-bottom: 15px;
}
.btn-radio.active,
.btn-radio:focus {
  border-color: #d81324;
  box-shadow: none;
}
.btn-radio .lf-side {
  text-align: left;
  width: 50%;
}
.btn-radio .rt-side {
  text-align: right;
  width: 50%;
}

.btn-act {
  cursor: pointer;
  width: 100%;
  padding-top: 15px;
  padding-bottom: 15px;
  background: #d81324;
  color: #ffffff;
  margin-top: 15px;
  border-radius: 5px;
}
.btn-act:hover,
.btn-act:focus {
  color: #ffffff;
}

.clock {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
.clock .column {
  margin-left: 10px;
  margin-right: 10px;
}
.clock .timer {
  font-size: 3rem;
  line-height: 1;
  color: #d81324;
}

.img-section {
  background: url(../img/slider2.jpg) no-repeat bottom center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  padding-top: 50px;
  padding-bottom: 50px;
  color: #ffffff;
  position: relative;
  margin-bottom: 50px;
}
.icons {
  margin-top: 40px;
  margin-bottom: 20px;
}
.icons .icon {
  width: 120px;
  height: 120px;
  margin-bottom: 15px;
}
.icons .tlt {
  font-weight: 300;
}

.img-section .act-holder {
  position: absolute;
  padding: 0px 15px;
  left: 0px;
  bottom: -25px;
  width: 100%;
}
.post {
  margin-top: 15px;
  text-align: center;
}

.post .img {
  width: 100%;
  height: auto;
  margin-bottom: 15px;
  border-radius: 5px;
  max-height: 180px;
}

.home-section {
  padding-top: 50px;
  padding-bottom: 50px;
}
.home-section.bg-grey {
  background: #f5f5f5;
}

.vid-holder {
  position:relative;
  padding-top:50.25%;
}
.vid-holder .vid {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  z-index: 10;
}

.ftr-section {
  padding-top: 50px;
  
}

.ftr-section .bg-image-ftr {
  background: url(../img/slider3.jpg) no-repeat bottom center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  margin-top: 50px;
  padding-top: 80px;
  padding-bottom: 100px;
  color: #ffffff;
  position: relative;
}

.ftr-section .bg-image-ftr .quote {
  position: absolute;
  width: 120px;
  height: 120px;
  top: -50px;
  left: calc(50% - 60px);
  z-index: 10;
}
.ftr-section .bg-image-ftr .top-border {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
}
.quote-section {
  margin-top: -100px;
}
.quote-block {
  padding: 15px;
  background: #ffffff;
  border-radius: 5px;
  margin-bottom: 15px;
  -webkit-box-shadow: 0px 0px 15px 0px rgb(50 50 50 / 50%);
  -moz-box-shadow: 0px 0px 15px 0px rgba(50, 50, 50, 0.5);
  box-shadow: 0px 0px 15px 0px rgb(50 50 50 / 50%);
}

.quote-block .stars {
  height: 15px;
  width: auto;
}

.quote-block .separator {
  width: 100%;
  height: 1px;
  background: #c8c8c8;
  margin-top: 15px;
  margin-bottom: 15px;
}

.imgs-holder {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  flex-wrap: wrap;
  position: relative;
  padding-left: 40px;
}

.imgs-holder .img-min {
  width: 80px;
  height: 80px;
  margin-left: 5px;
  margin-bottom: 5px;
}

.imgs-holder .quote-icon {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 30px;
  height: 30px;
}

.stk-act {
  position: fixed;
  bottom: 0px;
  width: 100%;
  height: 80px;
  z-index: 999;
  background: #ffffff;
  border-top-right-radius: 5px;
  border-top-left-radius: 5px;
  padding: 10px;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -ms-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
  -webkit-box-shadow: 0px 0px 15px 0px rgb(50 50 50 / 50%);
  -moz-box-shadow: 0px 0px 15px 0px rgba(50, 50, 50, 0.5);
  box-shadow: 0px 0px 15px 0px rgb(50 50 50 / 50%);
}
.stk-act .btn-act {
  margin-top: 0px;
  padding-top: 8px;
  padding-bottom: 8px;
}

.img-form {
  width: 100%;
  height: auto;
}

/**********************************************************/
.header-thank {
  background: url(../img/slider1.png) no-repeat bottom center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  padding-top: 50px;
  padding-bottom: 100px;
  color: #ffffff;
  position: relative;
}

.header-thank .bottom-border {
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
}
.header-thank .check-img {
  position: absolute;
  width: 140px;
  height: 140px;
  bottom: -70px;
  left: calc(50% - 70px);
}

.thank-section {
  padding-top: 100px;
  padding-bottom: 100px;
}

.imagepreview {
  width: 100%;
  height: auto;
  border-radius: 5px;
}

.imgs-holder .img-min {
  width: 80px;
  height: 80px;
  margin-left: 5px;
  margin-bottom: 5px;
  border-radius: 5px;
  overflow: hidden;
  cursor: pointer;
}

.imgs-holder .img-min img {
  max-width: 100%;
  max-height: 100%;
  width: 100%;
  height: 100%;
}

.btn-radio {
  padding: 0px;
  overflow: hidden;
  border-width: 2px;
}
.btn-radio .item-option {
  width: 100%;
  height: auto;
}

.how-to-use {
  width: 100%;
  height: auto;
}

.thank-you-page {
  width: 100%;
  height: auto;
}