@charset "utf-8";
/* CSS Document */
@import url(https://fonts.googleapis.com/css2?family=Roboto&display=swap);

#loading {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  z-index: 9999;
  zoom: 75%;
  background: url(../upload/imagebyme/please_wait.gif) 50% 50% no-repeat
    rgb(200, 200, 200, 0.9);
}

/* cystom toottip css , start*/
.myToolTip {
  position: relative;
  text-decoration: none;
  z-index: 1000;
}

.myToolTip::before,
.myToolTip::after {
  position: absolute;
  left: 50%;
  opacity: 0;
  transition: all 0.4s ease-in-out;
  text-align: center;
}

.myToolTip::before {
  content: "";
  width: 0;
  height: 0;
  border-top: 10px solid orange;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  margin-left: -4px;
  top: -9px;
}
.myToolTip::after {
  content: attr(myToolTipText);
  top: -8px;
  min-width: 150px;
  margin-left: -75px;
  padding: 5px;
  font-size: 13px;
  font-weight: bold;
  background-color: orange;
  color: black;
  border-radius: 4px;
  transform: translate3d(0, -100%, 0);
  pointer-events: none;
  word-wrap: break-word;
}

/* 4 tooltip positions */
.myToolTipLeft::before {
  margin-left: -42px;
  top: 12px;
  transform: rotate(-90deg);
}

.myToolTipLeft::after {
  transform: translate3d(-74%, 0, 0);
}

.myToolTipRight::before {
  margin-left: 15px;
  top: 12px;
  transform: rotate(90deg);
}

.myToolTipRight::after {
  transform: translate3d(69%, 0, 0);
}

.myToolTipBottom::before {
  margin-left: -4px;
  top: 25px;
  transform: rotate(-180deg);
}

.myToolTipBottom::after {
  transform: translate3d(0, 86%, 0);
}

/* end of 4 tooltip positions */

.myToolTip:hover::before,
.myToolTip:hover::after {
  opacity: 1;
}
/* end of 4 tooltip positions */

/* cystom toottip css , end*/

.pac-container {
  z-index: 10000 !important; /* to work google addreees in bootstarp model */
}

.stars {
  color: #28a745;
}

.ui-autocomplete {
  max-height: 200px;
  overflow-y: auto;
  overflow-x: hidden;
}

.form-control {
  height: unset !important;
}

.clear {
  clear: both;
}

.line-divider-job {
  margin-top: 0;
}

.show_job_details_div P {
  color: #7c7c7c;
}

.testimonials {
  padding-top: 7rem;

  padding-bottom: 7rem;
}

.testimonials .testimonial-item {
  max-width: 18rem;
}

.testimonials .testimonial-item img {
  max-width: 12rem;

  box-shadow: 0 5px 5px 0 #adb5bd;
}

.top-header {
  width: 100%;

  background: #fff;

  z-index: 10;

  background-color: #ffffff;

  padding: 0px 0;

  position: fixed;

  top: 0px;

  height: auto;

  box-sizing: border-box;

  border-bottom: 1px solid rgba(51, 51, 51, 0.25);
}

.item-testimonial {
  padding: 35px;

  background-color: white;

  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);

  margin: 0 3px;
}

.item-testimonial .testi-img {
  position: absolute;

  top: -50px;

  left: 0;

  right: 0;

  margin: 0 auto;

  width: 110px;

  height: 110px;

  padding: 5px;

  background: #fff;

  box-shadow: 0 3px 14px rgba(0, 0, 0, 0.5);

  border-radius: 50%;
}

.item-testimonial .testi-img img {
  width: 100px;

  height: 100px;

  border-radius: 50%;
}

.item-testimonial .testi-desc {
  padding: 42px 0;

  position: relative;
}

.item-testimonial .testi-desc:before,
.item-testimonial .testi-desc:after {
  position: absolute;

  font-family: FontAwesome;

  font-size: 26px;

  color: #ff3115;
}

.item-testimonial .testi-desc:before {
  content: "\f10d";

  top: 0;

  left: 0;
}

.item-testimonial .testi-desc .testi-name {
  font-size: 20px;

  margin-bottom: 15px;
}

.item-testimonial .testi-desc p {
  font-size: 16px;

  line-height: 26px;

  margin-bottom: 0;
}

.item-testimonial .testi-desc:after {
  content: "\f10e";

  bottom: 0;

  right: 0;
}

.owl-stage-outer {
  padding-top: 55px;

  padding-bottom: 7px;
}

/* css for the common footer start date 27 aug 2021 */

.footer-bg .quick-links {
  padding: 0px;
  margin: 0px;
}

.footer-bg .quick-links li {
  list-style-type: none;
}

.footer-bg p {
  font-size: 14px;
}

.footer-bg .quick-links li a {
  color: #333333;
  font-size: 14px;
}

.footer-bg .quick-links li a:hover {
  color: #000000;
  font-weight: bold;
}

.how_it_workk_bg {
  background: url(../img/blue_white_image_bg.png);
  padding: 100px 0px 20px 0px;
}

/* css for the common footer end date 27 aug 2021 */

.new_topsubject_block {
  width: 654px;

  float: left;

  margin: 0 20px 0 0;

  padding: 0;

  display: block;

  overflow: hidden;
}

h3.foottitle {
  font-size: 16px;

  font-weight: 600;

  color: #dbdbdb;

  margin: 0 0 15px;

  padding: 0;

  display: block;
}

/*custom radio button*/

.custom-radio {
  display: block;

  position: relative;

  padding-left: 35px;

  margin-bottom: 12px;

  cursor: pointer;

  font-size: 22px;

  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  user-select: none;
}

/* Hide the browser's default radio button */

.custom-radio input {
  position: absolute;

  opacity: 0;

  cursor: pointer;
}

/* Create a custom radio button */

.checkmark {
  position: absolute;

  top: 0;

  left: 0;

  height: 25px;

  width: 25px;

  background-color: #eee;

  border-radius: 0;
}

/* On mouse-over, add a grey background color */

.custom-radio:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */

.custom-radio input:checked ~ .checkmark {
  background-color: #2196f3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */

.checkmark:after {
  content: "";

  position: absolute;

  display: none;
}

/* Show the indicator (dot/circle) when checked */

.custom-radio input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */

.custom-radio {
  display: block;

  position: relative;

  padding-left: 35px;

  margin-bottom: 12px;

  margin-right: 40px;

  cursor: pointer;

  font-size: 18px;

  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  user-select: none;
}

/* Hide the browser's default radio button */

.custom-radio input {
  position: absolute;

  opacity: 0;

  cursor: pointer;
}

/* Create a custom radio button */

.checkmark {
  position: absolute;

  top: 0;

  left: 0;

  height: 25px;

  width: 25px;

  background-color: #eee;

  border-radius: 0px;
}

/* On mouse-over, add a grey background color */

.custom-radio:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */

.custom-radio input:checked ~ .checkmark {
  background-color: #2196f3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */

.checkmark:after {
  content: "";

  position: absolute;

  display: none;
}

/* Show the indicator (dot/circle) when checked */

.custom-radio input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */

.custom-radio .checkmark:after {
  top: 9px;

  left: 9px;

  width: 8px;

  height: 8px;

  border-radius: 50%;

  background: white;
}

.checkbox-spacing {
  width: 24%;

  padding: 0px;

  margin: 0px;
}

.req-container .modal-header {
  background: #458bff;

  padding: 10px;

  text-align: center;
}

.req-container .modal-header h4 {
  color: #fff;
}

.signup-heading-popup {
  background: #fff !important;

  border: none;
}

.signupBody-popup {
  color: #458bff !important;

  font-size: 20px;

  text-align: center;
}

/* 30-10-18 css */

.t-registration-form label {
  display: inline-block;
  color: #000000;
  margin-bottom: -4px;
  margin-top: 12px;
}

.t-registration-form input {
  display: block;

  border: 1px solid #ccc;
}

.t-registration-form legend {
  font-size: 22px;
  color: #f00;
  margin-top: 0px;
  text-align: center;
}

/* The custom checkmark css */

.container-checkmark {
  /* display: block; */

  font-weight: normal;

  position: relative;

  padding-left: 35px;

  margin-bottom: 12px;

  cursor: pointer;

  font-size: 14px;

  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  user-select: none;
}

/* Hide the browser's default checkbox */

.container-checkmark input {
  position: absolute;

  opacity: 0;

  cursor: pointer;

  height: 0;

  width: 0;
}

/* Create a custom checkbox */

.container-checkmark .checkmark {
  position: absolute;

  top: 0;

  left: 0;

  height: 22px;

  width: 22px;

  background-color: #eee;

  border-radius: 3px;
}

/* On mouse-over, add a grey background color */

.container-checkmark:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */

.container-checkmark input:checked ~ .checkmark {
  background-color: #2196f3;
}

/* Create the checkmark/indicator (hidden when not checked) */

.checkmark:after {
  content: "";

  position: absolute;

  display: none;
}

/* Show the checkmark when checked */

.container-checkmark input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */

.container-checkmark .checkmark:after {
  left: 9px;

  top: 5px;

  width: 5px;

  height: 10px;

  border: solid white;

  border-width: 0 3px 3px 0;

  -webkit-transform: rotate(45deg);

  -ms-transform: rotate(45deg);

  transform: rotate(45deg);
}

.checkmark-outline {
  border: solid 6px #e4e4e4;

  padding: 0px 0px 15px 5px;

  border-radius: 10px;

  margin-top: 15px;
}

.checkmark-outline .row {
  margin: 5px 0px;
}

.blackText label {
  color: #000 !important;

  margin: 20px 0px 0px 0px;
}

.yes-radio {
  margin-right: 40px !important;
}

.dashboard-container {
  display: flex;
  margin-top: -10px;
}

.dashboard-left {
  float: left;
  width: 20%;
  border-right: solid 1px #e4e4e4;
}

.dashboard-right {
  float: right;
  width: 80%;
}

.dashboard-left ul.dashboard-sidebar {
  width: 100%;
  padding: 0px;
}

.dashboard-left h3 {
  margin: 0px !important;

  width: 100%;

  padding: 15px;

  border-bottom: solid 1px #e8e8e8;

  font-size: 18px;

  color: #606060;
}

.dashboard-container .dashboard-left ul.dashboard-sidebar li {
  display: block;

  border-bottom: solid 1px #eaeaea;

  font-size: 13px;

  color: rgb(153, 153, 153);

  list-style-type: none;

  position: relative;

  width: 100%;
}

.dashboard-container .dashboard-left ul.dashboard-sidebar li a {
  display: inline-block;

  width: 100%;

  padding: 10px 15px;

  color: #565656;
}

.dashboard-container .dashboard-left ul.dashboard-sidebar li a:hover {
  text-decoration: none;

  background-color: #458bff;

  color: #fff;
}

a.active-sb {
  background-color: #458bff;

  color: #fff !important;
}

.hide-div {
  display: none;
}

.mob-db-btn {
  display: none;
}

.dashboard-icons {
  background: #eff5ff;

  width: 100%;
}

.margin-top {
  margin-top: 20px;
}

.t-registration-form textarea.form-control {
  height: 90px !important;
}

.t-registration-form .form-control {
  padding: 0.375rem 5px;
  font-size: 13px;
  height: 36px !important;
}
.outline-padding {
  padding: 10px 20px;
}

.outline-padding .col {
  padding-top: 0px;
}

.center-block {
  display: flex;

  justify-content: center;

  display: block;

  margin: 0px auto;
}

.no-margin {
  margin: 0px !important;
}

.imageupload.panel-default {
  width: 200px;
  display: block;
  text-align: center;
}

.imageupload.panel-default .thumbnail {
  margin: 10px auto;
}

.imageupload .file-tab .thumbnail {
  max-width: 100% !important;
}

a.already-ac {
  display: block;
  text-align: center;
  margin: 0px auto 40px auto;
  color: #000;
  text-decoration: none;
}

a.already-ac:hover {
  text-decoration: none;
}

.red {
  color: #f00;
  font-weight: bold;
}

.profile-scrolling-box p {
  color: #666;
  margin: 5px 0px;
  padding: 0px;
}

.education-details h4 {
  padding: 5px;
}

.btn-margin-evn {
  margin-top: 25px;
  margin-bottom: 5px;
  width: 170px;
}

.profile-border {
  border-bottom: solid 1px #ccc;
}

.t-registration-form .profile-border label {
  margin-bottom: 10px;
}

/* don's delate below it as it has been used in file upoad css */
.t-registration-form .fileupload .thumbnail {
  text-align: center;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 3px 10px 0 rgba(0, 0, 0, 0.1);
  padding: 0px;
  border: 0.5px solid rgba(8, 8, 8, 0.377);
  margin: 0.7em;
  border-radius: 7px;
}

.t-registration-form .fileupload {
  margin-bottom: 20px;
}

.t-registration-form .fileupload .btn-file {
  background: #377cec;
  color: #fff;
  padding: 4px 8px;
  font-size: 13px;
}

.t-registration-form a.btn-light-grey {
  background: #f00;
  color: #fff;
  padding: 4px 8px;
  font-size: 13px;
}

.mobile-padding {
  padding: 0px 15px;
}

#frmSte8 h5 {
  color: #666;
  font-size: 13px;
  line-height: 18px;
  font-family: Verdana, sans-serif;
  padding: 2px 0px 0px 15px;
}

#frmSte8 h4 {
  padding: 10px 0px 2px 15px;
  font-size: 18px;
}

@media (min-width: 768px) and (max-width: 991px) {
  .already-ac {
    display: block;
    text-align: left;
    margin: 7px auto;
    float: none;
  }

  .dashboard-left {
    width: 30%;
  }

  .dashboard-right {
    width: 70%;
  }
}

@media (max-width: 767px) {
  #frmStep6 {
    width: 100% !important;
  }

  body {
    padding-top: 60px;
  }

  .checkmark-outline .row {
    margin: 0px 0px;
  }

  .blackText label {
    color: #000 !important;
    margin: 10px 0px 9px 0px;
  }

  .checkmark-outline .container-checkmark {
    margin-bottom: 15px;
  }

  .custom-radio {
    font-size: 14px;
    padding-left: 30px;
  }

  .checkmark {
    height: 15px;
    width: 15px;
  }

  .custom-radio .checkmark:after {
    top: 4px;
    left: 4px;
  }

  .img-fluid {
    width: 200px;
  }

  .top-header {
    height: auto;
  }

  .top-header .container {
    display: flex;
    padding: 0 5px;
  }

  header .container-fluid {
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.25);
    display: flex;
    padding: 0px 5px;
  }
}

@media only screen and (max-width: 500px) {
  .checkmark-outline {
    padding: 15px 0px;
  }

  #frmSte8 {
    width: 100% !important;
    margin: 0px !important;
  }
}

/*.table td,*/
/*.table th {*/
/*  border: none !important;*/
/*}*/

body.drawer {
  padding-top: 72px;
}

@media only screen and (max-width: 767px) {
  body.drawer {
    padding-top: 60px;
  }
}

.checkmark-outline .verify-email {
  max-width: 220px;
}

@media only screen and (min-width: 768px) {
  .menuforsmallscreen {
    display: none;
  }
}

/* CSS BELOW BY  CUSTOMIZED BY RAUSHAN */

.text_shadow_white{
      text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white;}
.text_shadow_black {
      text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px black;
}

/* zoom image oin click ,start*/
#zoomImageModalBody {
  position: relative;
}
#zoomImageModalClose {
  position: absolute;
  right: 0;
  top: 0;
}
.modal.fade .modal-dialog.modal-dialog-zoom {
  -webkit-transform: translate(0, 0) scale(0.5);
  transform: translate(0, 0) scale(0.5);
}
.modal.show .modal-dialog.modal-dialog-zoom {
  -webkit-transform: translate(0, 0) scale(1);
  transform: translate(0, 0) scale(1);
}
.zoomImageStyle {
  width: 100%;
  height: auto;
  border-radius: 7px;
}
/* zoom image oin click ,end*/

/* bootstarp tootip is overridden, start */
.tooltip-inner {
  color: white !important;
  background-color: dodgerblue !important;
  font-weight: bold !important;
}
.tooltip .arrow {
  color: dodgerblue !important;
}

.tooltip.show {
  opacity: 0.98 !important;
}

.bs-tooltip-top .arrow::before {
  border-top-color: dodgerblue !important;
}
/* bootstarp tootip is overridden, end */

.center_the_child {
  display: flex;
  justify-content: center;
  align-items: center;
}

.media_border {
  width: 220px;
  height: 220px;
  background-size: cover;
  box-shadow: 0 2px 4px 0 rgb(0 0 0 / 5%), 0 3px 10px 0 rgb(0 0 0 / 5%);
  padding: 0px;
  border: 0.5px solid rgba(8, 8, 8, 0.377);
  border-radius: 6px;
}

.low_margin_list {
  margin-left: -1.5em;
}

::placeholder {
  color: #999999 !important;
  opacity: 1; /* Firefox */
  font-size: 14px !important;
}

.bold {
  font-weight: bold;
}

.hide_it {
  display: none;
}

.hideme {
  height: 0;
}

label {
  margin-bottom: unset !important;
  margin-top: 0.8em;
  font-weight: bold;
  color: #666666;
  font-size: 15px;
  letter-spacing: 0.2px;
}

.raus_br {
  display: block;
  margin: 0.5em;
}
.profile_tag_icons {
  height: 45px;
  width: 45px;
}

.list_style_tick {
  list-style: none;
}

.list_style_tick li:before {
  content: "✓";
  font-weight: bold;
}

.check_before:before {
  content: "✓";
  font-weight: bolder;
  margin-right: 4px;
}

a {
  text-decoration: none !important;
}

.validation-msg {
  margin: 10px 0px;
  border-radius: 5px;
  padding: 10px;
  background-color: #28a745;
  color: white;
  margin-bottom: 15px;
  font-weight: bold;
  letter-spacing: 0.4px;
  text-align: center;
}

.border_shadow {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  padding: 12px;
  border: 1px;
  margin: 0.7em;
  border-radius: 7px;
  background: white;
}
.no_margin {
  margin: 0;
}

/* used to hide the div content for spam honeypot start */
.hideme {
  display: none;
  visibility: hidden;
}

.demo-input {
  width: 100%;
  border-radius: 5px;
  border: #ccc 1px solid;
  padding: 6px;
  margin-top: 5px;
}

/* used to hide the div content for spam honeypot end */

.danger {
  color: red;
}

.raus_p_tag_margin,
.p_low_margin {
  margin-top: 1px;
  margin-bottom: 1px;
}

@media screen and (min-width: 768px) {
  .br_tag_when_mobile {
    display: none; /* hide the BR tag for wider screens (i.e. disable the line break) */
  }

  .show_only_in_mobile,
  .hide_when_laptop {
    display: none;
  }
}

.videowrapper {
  float: none;
  clear: both;
  width: 100%;
  position: relative;
  padding-bottom: 54.25%;
  padding-top: 12%;
  margin-left: auto;
  height: 0;
}

@media (min-width: 767px) {
  .videowrapper {
    width: 85%;
    height: 60%;
    margin-bottom: -24%;
  }
}

.embed-responsive {
  margin: auto;
  text-align: center !important;
}
@media (min-width: 767px) {
  .embed-responsive {
    width: 85%;
    height: 60%;
  }
}
.youtube_iframe {
  border-radius: 10px;
  position: absolute;
  top: 0;
  left: 0;
  width: inherit;
  height: inherit;
  /* example below
        <div class="text-center m-3 ">
                <div class="embed-responsive embed-responsive-16by9 ">
                <iframe class="youtube_iframe" src="https://www.youtube.com/embed/Oc5uOlvzP3Q" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

            </div>
        </div>
        below one is better
        <div class="videowrapper ">
            <iframe class="youtube_iframe" src="https://www.youtube.com/embed/Oc5uOlvzP3Q" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

        </div>
    */
}

.iframeTextDiv {
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgba(255, 165, 0, 1);
  border-radius: 7px;
  width: 100%;
}
.iframeText {
  padding: 5px;
  font-size: 12px;
  font-weight: bold;
}

@media (min-width: 767px) {
  .iframeText {
    font-size: 28px;
  }
}

/* this help to to target fiv / focus div better  using href=#id
     h2::before { 
    display: block; 
    content: " "; 
    margin-top: -285px; 
    height: 285px; 
    visibility: hidden; 
    pointer-events: none;
  } */

body {
  font-family: "Roboto", sans-serif !important;
  word-spacing: 0.1px !important;
  letter-spacing: 0.05px !important;
  padding-top: 72px;
  overflow-x: hidden;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Roboto", sans-serif !important;
  word-spacing: 0.1px;
  letter-spacing: 0.05px;
}
h1,
h2,
h3,
h4,
h5 {
  font-weight: bold !important;
}

h1,
h2,
h3,
h4 {
  text-align: center;
}

h1,
h2,
h3 {
  margin-bottom: 1em !important;
}

.no_left_margin_li li {
  margin-left: -1.2em;
}
.custom_p_tag_margin {
  margin: 0 5px;
}
.zoom_80 {
  zoom: 80%;
}

.zoom_90 {
  zoom: 90%;
}
p,
li {
  font-size: 1rem;
  color: #4d4d4d;
  /*color:#646464 */
}

.border_y_only_in_laptop {
  border-right: 1px solid lightgray;
}

.border_x_only_in_mobile {
  border-bottom: unset;
}

.highlight {
  background-color: orange;
  border: 1px solid red;
  border-radius: 3px;
  padding: 4px;
  transition: all 1s;
  margin: initial;
}

.noHighlight {
  background: transparent;
  /* border-color: transparent; */
}

@media (max-width: 480px) {
  html {
    font-size: 12.5px;
  }
}

@media (min-width: 480px) {
  html {
    font-size: 13px;
  }
}

@media (min-width: 768px) {
  html {
    font-size: 13.5px;
  }
}

@media (min-width: 992px) {
  html {
    font-size: 14px;
  }
}

@media (min-width: 1200px) {
  html {
    font-size: 15px;
  }
}

@media only screen and (max-width: 768px) {
  ::placeholder {
    color: #999999 !important;
    opacity: 1; /* Firefox */
    font-size: 12px !important;
  }

  .dashboard-left {
    display: none;
  }
  .dashboard-right {
    width: 100%;
  }
  .youtube_iframe {
    width: 100%;
    height: 100%;
  }

  .centered_in_mobile {
    text-align: center;
  }

  .footer-bg p {
    font-size: 12px;
  }

  .footer-bg .quick-links li a {
    font-size: 12px;
  }
  .center_when_mobile {
    text-align: center;
  }

  .border_y_only_in_laptop {
    border-right: unset;
  }

  .border_x_only_in_mobile {
    border-bottom: 1px solid lightgray;
  }

  .hide_when_mobile,
  .show_only_in_laptop {
    display: none;
  }
}
/* sweetalert css start */
.swal-footer {
  text-align: center !important; /* sweetalert css */
}
/* .swal-button {
  background-color: #059862;
} */

.swal-button:not([disabled]):hover {
  background-color: #218838;
  color: white;
}
/* sweetalert css  ned*/
/*center_when_mobile
   center_when_laptop
   hide_when_mobile    means     show_only_in_laptop   so      style :max-width 768px & display: none
   hide_when_laptop    means     show_only_in_mobile   so      style :min-width 768px & display: none

   hr_tag_in_mobile_only*/

/* H1 : whole page one title
Big heading to devide section : h2 with blackheading 
medium Title:  h3 
form title : h4 
form feild name : legend 
Defination title  : H5, Quick links of the footer etc..., ( just above the parapgrap )
Defination word  : p bold ( along the parapgrap ) */