.glow-on-hover {
  height: 50px;
  border: none;
  outline: none;
  color: #f0d4a9;
  background: #3280c7;
  cursor: pointer;
  position: relative;
  font-size: 17px;
  font-weight: 600;
  z-index: 0;
  border-radius: 10px;
}

.glow-on-hover:before {
  content: '';
  background: linear-gradient(45deg, #0043ff, #0073ff, #00fbff, #00ff48, #00ffd5, #002bff, #3a00ff,#0000ff);
  position: absolute;
  top: -2px;
  left:-2px;
  background-size: 400%;
  z-index: -1;
  filter: blur(5px);
  width: calc(100% + 4px);
  height: calc(100% + 4px);
  animation: glowing 20s linear infinite;
  opacity: 0;
  transition: opacity .3s ease-in-out;
  border-radius: 10px;
}

.glow-on-hover:active {
  color: #fff
}

.glow-on-hover:active:after {
  background: transparent;
}

.glow-on-hover:hover:before {
  opacity: 1;
}

.glow-on-hover:after {
  z-index: -1;
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  background: #1a8af1;
  left: 0;
  top: 0;
  border-radius: 10px;
}

@keyframes glowing {
  0% { background-position: 0 0; }
  50% { background-position: 400% 0; }
  100% { background-position: 0 0; }
}


/*------------------------------------  Index ------------------------------------------*/

.sec1 {
  background-image: url('../images/index_background1.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: inset 0px -5px 33px #4d5d6d;
  transition: background-image 0.6s ease-out;
  background-color: #555555;
  background-attachment: fixed;
}

#installButton {
  position: absolute;
  z-index: 55555;
  top: 33px;
  left: 38%;
  font-size: 11px;
  border: none;
  border-radius: 5px;
  color: #fff;
  background-color: #3ea0d9;
  padding: 10px;
  cursor: pointer;
}


#button-ios {
    position: absolute;
    z-index: 55555;
    top: 34px;
    left: 380px;
    font-size: 20px;
    border: none;
    border-radius: 5px;
    color: #fff;
    background-color: #4ea0d9;
    padding: 10px;
    cursor: pointer;
}

#sec1{
  position: relative;
}

.black_back_deco_first {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  filter: brightness(0.5);
  top: 0;
  z-index: 200;
  background-color: #42424266;
  background-position: center;
  background-size: contain;
}


.welcome-div_cont{
  position: relative;
  z-index: 500;
}

.img_back2_deco {
  background-image: url('../images/index_background3.jpg');
  transition: background-image 0.6s ease-out;
  background-color: #333333;
}

.img_back3_deco {
  background-image: url('../images/index_background4.jpg');
  transition: background-image 0.6s ease-out;
  background-color: #101010;
}

.img_back4_deco{
  background-image: url('../images/index_background9.jpg');
  transition: background-image 0.6s ease-out;
  background-color: #101010;
}

h4 {
  font-size: 45px;
  color: #ffffff;
  border-radius: 5px;
  padding: 5px;
  text-shadow: 1px 1px 8px #000;
  margin: 0;
  -webkit-text-stroke: 2px #000;
}

.back_f_p {
  font-size: 50px;
  color: #f91f1f;
  border-radius: 5px;
  padding: 5px;
  margin: 0;
  padding: 3px;
  margin-top: 10px;
  text-shadow: 1px 1px 5px #000;
}

.join-us_btn {
    padding: 5px;
    border: none;
    border-radius: 5px;
    font-size: 30px;
    margin: 15px;
    background-color: #ad1515;
    color: #f0d4a9;
    transition: 0.5s;
}

.deco_img1:hover {
  height: 330px;
  width: 600px;
  transition: 0.5s;
}

.f_h3{
  font-size: 50px;
  margin: 0;
  text-align: center;
  color: #243a4a;
}

.center2{
  display: flex;
  justify-content: center;
  max-width: 544px;
}

.inline-block {
  display: inline-block;
}

.f_p {
  display: inline-block;
  margin: 0;
  font-size: 18px;
  text-align: justify;
  width: 265px;
  position: relative;
  top: 107px;
  left: -12px;
}

.noti_inp{
  display: block;
  width: 445px;
  height: 45px;
  margin-bottom: 10px;
  border: 2px solid #3f85a5;
  border-radius: 5px;
  font-size: 20px;
  padding: 0 5px;
  background-color: #ffefd7;
}

.noti_form {
  /*margin: 0px 220px 10px 20px;*/
  margin: 0px 20px 0px 355px;
}

.inp_cont{
  margin-left: 37px;
}

/*
.margin_1 {
  margin-left: 205px;
}*/

.f_h5 {
  font-size: 36px;
  margin: 0;
  color: #1b425e;
}

.h5_cont {
  max-width: 400px;
}

.p_cont {
  max-width: 460px;
}

.sec2_cont {
  display: inline-block;
  margin-left: 90px;
  margin-top: 90px;
}

.form_cont{
  display: inline-block;
}

.deco_img_cont {
  display: inline-block;
  position: absolute;
  margin-top: 58px;
  right: 100px;
  box-shadow: 4px -2px 8px 0px #19212f;
}
/*
.deco_img1{
  width: 560px;
  height: 300px;
}*/

.black_back{
  background-color: #101010;
  transition: background-color 0.7s ease-in-out;

}


.vicios2{
  background-image: url(../images/vicios2.jpg);
  transition: background-image 0.7s ease-in-out;
  width: 560px;
  height: 300px;
  background-size: cover;
  transition: 0.5s;
}
.vicios3{
  background-image: url(../images/vicios3.jpg);
  transition: background-image 0.7s ease-in-out;
  width: 560px;
  height: 300px;
  background-size: cover;
  transition: 0.5s;
}
.vicios4{
  background-image: url(../images/vicios4.jpg);
  transition: background-image 0.7s ease-in-out;
  width: 560px;
  height: 300px;
  background-size: cover;
  transition: 0.5s;
}
.vicios1{
  background-image: url(../images/vicios1.jpg);
  transition: background-image 0.7s ease-in-out;
  width: 560px;
  height: 300px;
  background-size: cover;
  transition: 0.5s;
}

.deco_img1{
  background-image: url(../images/index_background5.jpg);
  transition: background-image 0.7s ease-in-out;
  width: 560px;
  height: 300px;
  background-size: cover;
  transition: 0.5s;
}

.deco_img2{
  background-image: url(../images/index_background6.jpg);
  transition: background-image 0.7s ease-in-out;
  width: 560px;
  height: 300px;
  transition: 0.5s;
}

.deco_img2:hover{
  transition: 0.5s;
}


.deco_img3:hover{
  transition: 0.5s;
}

.deco_img4:hover{
  transition: 0.5s;
}

.deco_img3{
  background-image: url(../images/index_background7.jpg);
  transition: background-image 0.7s ease-in-out;
  width: 560px;
  height: 300px;
  transition: 0.5s;
}

.join-us_btn:hover {
  background-color: #37405a;
  color: #fff;
  font-size: 40px;
  transition: 0.5s;
}

.deco_img4{
  background-image: url(../images/index_background8.jpg);
  transition: background-image 0.7s ease-in-out;
  width: 560px;
  height: 300px;
  transition: 0.5s;
}

.submit_cont{
  margin-left: 37px;
  width: 460px;
}

.white_back2{
  background-color: #fff;
  /*
  background-position: 100px -570px;
    width: 100%;
    height: 132px;*/
    /*filter: brightness(0.5);*/
}

.borders_back .center {
  height: 132px;
}

.borders_back{
  border-top: 10px solid #fff;
  border-bottom: 10px solid #fff;
}

.white_div_2{
  background-color: #fff;
  width: 100%;
  height: 50px;
}

.noti_title{
  font-size: 40px;
  color: #4d72a5;
}

.img_deco_back2 {
  background-image: url(../images/index_background8.jpg);
  background-size: cover;
  background-position: center;
  box-shadow: inset 0px 0px 12px 1px #000;
}

.sec2{
  margin-bottom: 60px;
}

.img_back {
  background-image: url(../images/index_background2.jpg);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  opacity: 0.1;
  position: absolute;
  width: 100%;
  height: 340px;
  left: 0;
}

.h3_scores{
  font-size: 100px;
  color: #0072ff;
  padding: 0 7px;
  border-bottom: 5px dashed  #0072ff;
  margin-bottom: 0;
  width: 224px;
}

.dark_back{
  background-color: #101010;
}

.flex_spbt {
  display: flex;
  justify-content: space-between;
  padding: 10px 65px;
}



.p_scores {
  font-size: 16px;
  color: #fff;
  width: 224px;
}

.ftr_li{
  display: inline-block;
  color: #00adff;
}

.no_margin{
  margin: 0;
  font-size: 65px;
}

.steps_cont {/*
  display: grid;
  grid-template-columns: 25% 25% 25% 25%;
  grid-auto-rows: 780px;*/
  display: flex;
}


.step_cont {
    display: grid;
    margin: 0 10px;
    padding: 5px 10px;
    background-color: #151c22;
    border-radius: 10px;
    height: 100%;
}

.steps_img {
  width: 75%;
  border-radius: 10px;
}

.step_text {
  display: inline-block;
  position: relative;
  font-size: 20px;
  color: #fff;
  margin-top: 2px;
}

.download_title{
  color: #1f1f1f;
  font-size: 50px;
  margin: 5px 0;
}


/*------------------------------- carrusel ------------------------------------*/

.swiper {
  width: 80%;
  height: 500px;
}

.title_cont_comment {
  display: flex;
  justify-content: center;
}


.swiper-buttons {
  color: #ffffff !important;
  font-weight: 600;
  background-color: #6ab3cf;
  padding: 5px;
  border-radius: 5px;
}

.comment_title {
  color: #1f1f1f;
  font-size: 35px;
  margin-bottom: 0;
}

.swiper-slide{
  background-position: center;
  background-size: cover;
  width: 300px !important;
  height: 415px !important;
  margin: 10px !important;
  background-color: #dfdfdf;
  border-radius: 10px;
}

.image_inside {
  height: 170px;
}

.username {
  font-size: 22px;
  color: #1d1d1d;
  text-transform: capitalize;
  margin-bottom: 0;
  text-shadow: none;
  -webkit-text-stroke: 0;
}

.star_image {
  width: 25px;
}

.rate_cont {
  display: flex;
  justify-content: center;
}

.rate_cont2 {
  display: flex;
  justify-content: center;
}

.rate_specify {
  margin-top: 4px;
}

.name_cont {
  display: flex;
  justify-content: center;
}

.comments_sec{
  position: relative;
  width: 100%;
  display: flex;
  justify-content: center;
  background-color: #12549a;
}

.text {
  padding: 10px;
  margin: 0;
  text-align: center;
  font-size: 15px;
}


.octopus_img {
  width: 180px;
}

.swiper-slide-active {
  background-color: #fff !important;
  transition: 0.5s !important;
  border-radius: 10px;
  box-shadow: 3px 3px 12px -2px;
  filter: none !important;
  height: 430px !important;
}

.swiper-wrapper{
  align-items: center;
}

/*-----------------------------------------------------------------------------*/

.img-logo_sec {
  width: 420px;
  border: 2px solid #000;
}

.sec1-info {
  display: grid;
  grid-template-columns: 40% 60%;
  margin: 15px;
}

.sec1-info_title {
  font-size: 40px;
  margin: 5px 0;
  color: #181818;
}

.sec1-info_text {
    display: flex;
  font-size: 38px;
}

.see-more {
  font-size: 34px;
  color: #f00;
}


@media screen and (max-width: 1000px) {
  .f_p {
    width: 380px;
    margin: 35px 0;
    top: 0;
    font-size: 22px;
}

.step_text {
  font-size: 26px;
}

.steps_cont {
  display: grid;
  grid-template-columns: 50% 50%;
}

.steps_img {
  width: 100%;
}

.step_cont {
  height: 98%;
}

.sec1 {
  background-size: 100% 50%;
  background-position: 0px -250px;
}

.f_p {
  font-size: 25px;
  width: 560px;
  margin-top: 10px;
  margin-bottom: 10px;
  left: -20px;
}

.sec1-info_text {
  font-size: 28px;
}

.sec1-info {
  grid-template-columns: 50% 50%;
}

.img-logo_sec {
  width: 90%;
  border: 2px solid #000;
  height: 76%;
}

#installButton {
    top: 30px;
    left: 55%;
    font-size: 22px;
}


.banner-cont {
  width: 100%;
  height: 550px;
}

.banner-div {
  width: 100%;
  background-size: cover;
  height: 100%;
  background-image: url(images/banner1-index.jpg);
}

.noti_inp {
    width: 480px;
    height: 55px;
    font-size: 30px;
}

.back_f_p {
  font-size: 60px;
  max-width: 900px;
  text-align: center;
}

.deco_img1 {
    width: 500px;
    height: 270px;
}

.deco_img1:hover{
  width: 500px;
  height: 270px;
}

.deco_img_cont{
  right: 10px;
  width: 500px;
  height: 270px;

}

.sec2_cont {
  margin-left: 25px;
}

.p_cont {
  max-width: 401px;
  font-size: 23px;
}

.h5_cont {
  max-width: 436px;
}

.f_h5 {
  font-size: 42px;
}

.join-us_btn{
  font-size: 50px;
}

.p_scores {
  font-size: 21px;
  width: 235px;
}


.navbar:hover > #button-ios{
  display: none;
}
  
.navbar:hover > #installButton{
  display: none;
}

}