@charset "UTF-8";
/*=======================================================*/
/*                                                       */
/* Timedoor CSS Preset Library                           */
/* v. 1.05 - last update 27/05/2019                      */
/*                                                       */
/*=======================================================*/
/*                                                       */
/* Table oif Content                                     */
/*                                                       */
/* Col 20% ------------------------------------- [COL20] */
/* Column Position ---------------------------- [COLPOS] */
/* Content Position --------------------------- [CONPOS] */
/* Display Class -------------------------------- [DISP] */
/* Margin --------------------------------------- [MARG] */
/* Padding --------------------------------------- [PAD] */
/* Font Size ------------------------------------ [FONT] */
/*                                                       */
/*=======================================================*/
/*=======================================================*/
/* Col 20% ------------------------------------- [COL20] */
/*=======================================================*/
.col-xs-20 {
  float: left;
  width: 20%;
  padding-left: 15px;
  padding-right: 15px;
}

@media (min-width: 768px) {
  .col-sm-20 {
    float: left;
    width: 20%;
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media (min-width: 992px) {
  .col-md-20 {
    float: left;
    width: 20%;
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media (min-width: 1200px) {
  .col-lg-20 {
    float: left;
    width: 20%;
    padding-left: 15px;
    padding-right: 15px;
  }
}
/*=======================================================*/
/* Column Position ---------------------------- [COLPOS] */
/*=======================================================*/
.row.tmdr {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.row.tmdr:before, .row.tmdr:after {
  width: 100%;
}
.row.tmdr.x-left {
  -webkit-box-pack: flex-start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: flex-start;
  justify-content: flex-start;
}
.row.tmdr.x-center {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.row.tmdr.x-right {
  -webkit-box-pack: flex-end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: flex-end;
  justify-content: flex-end;
}
.row.tmdr.y-top {
  -webkit-box-align: flex-start;
  -moz-box-align: flex-start;
  -ms-flex-align: flex-start;
  -webkit-align-items: flex-start;
  align-items: flex-start;
}
.row.tmdr.y-center {
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}
.row.tmdr.y-bottom {
  -webkit-box-align: flex-end;
  -moz-box-align: flex-end;
  -ms-flex-align: flex-end;
  -webkit-align-items: flex-end;
  align-items: flex-end;
}

/*=======================================================*/
/* Content Position --------------------------- [CONPOS] */
/*=======================================================*/
.middle-item {
  display: table;
  width: 100%;
  height: 100%;
}
.middle-item .middle-item-content {
  display: table-cell;
  vertical-align: middle;
}

/*=======================================================*/
/* Display Class -------------------------------- [DISP] */
/*=======================================================*/
.display-xs-block {
  display: block !important;
}

.display-xs-inline {
  display: inline !important;
}

.display-xs-inline-block {
  display: inline-block !important;
}

@media (min-width: 768px) {
  .display-sm-block {
    display: block !important;
  }

  .display-sm-inline {
    display: inline !important;
  }

  .display-sm-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 992px) {
  .display-md-block {
    display: block !important;
  }

  .display-md-inline {
    display: inline !important;
  }

  .display-md-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 1200px) {
  .display-lg-block {
    display: block !important;
  }

  .display-lg-inline {
    display: inline !important;
  }

  .display-lg-inline-block {
    display: inline-block !important;
  }
}
/*=======================================================*/
/* Margin --------------------------------------- [MARG] */
/*=======================================================*/
.m-0 {
  margin: 0px !important;
}

.m-5 {
  margin: 5px !important;
}

.m-10 {
  margin: 10px !important;
}

.m-15 {
  margin: 15px !important;
}

.m-20 {
  margin: 20px !important;
}

.m-25 {
  margin: 25px !important;
}

.m-30 {
  margin: 30px !important;
}

.m-35 {
  margin: 35px !important;
}

.m-40 {
  margin: 40px !important;
}

.m-45 {
  margin: 45px !important;
}

.m-50 {
  margin: 50px !important;
}

.m-55 {
  margin: 55px !important;
}

.m-60 {
  margin: 60px !important;
}

.m-65 {
  margin: 65px !important;
}

.m-70 {
  margin: 70px !important;
}

.m-75 {
  margin: 75px !important;
}

.m-80 {
  margin: 80px !important;
}

.m-85 {
  margin: 85px !important;
}

.m-90 {
  margin: 90px !important;
}

.m-95 {
  margin: 95px !important;
}

.m-100 {
  margin: 100px !important;
}

.my-0 {
  margin-top: 0px !important;
  margin-bottom: 0px !important;
}

.my-5 {
  margin-top: 5px !important;
  margin-bottom: 5px !important;
}

.my-10 {
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}

.my-15 {
  margin-top: 15px !important;
  margin-bottom: 15px !important;
}

.my-20 {
  margin-top: 20px !important;
  margin-bottom: 20px !important;
}

.my-25 {
  margin-top: 25px !important;
  margin-bottom: 25px !important;
}

.my-30 {
  margin-top: 30px !important;
  margin-bottom: 30px !important;
}

.my-35 {
  margin-top: 35px !important;
  margin-bottom: 35px !important;
}

.my-40 {
  margin-top: 40px !important;
  margin-bottom: 40px !important;
}

.my-45 {
  margin-top: 45px !important;
  margin-bottom: 45px !important;
}

.my-50 {
  margin-top: 50px !important;
  margin-bottom: 50px !important;
}

.my-55 {
  margin-top: 55px !important;
  margin-bottom: 55px !important;
}

.my-60 {
  margin-top: 60px !important;
  margin-bottom: 60px !important;
}

.my-65 {
  margin-top: 65px !important;
  margin-bottom: 65px !important;
}

.my-70 {
  margin-top: 70px !important;
  margin-bottom: 70px !important;
}

.my-75 {
  margin-top: 75px !important;
  margin-bottom: 75px !important;
}

.my-80 {
  margin-top: 80px !important;
  margin-bottom: 80px !important;
}

.my-85 {
  margin-top: 85px !important;
  margin-bottom: 85px !important;
}

.my-90 {
  margin-top: 90px !important;
  margin-bottom: 90px !important;
}

.my-95 {
  margin-top: 95px !important;
  margin-bottom: 95px !important;
}

.my-100 {
  margin-top: 100px !important;
  margin-bottom: 100px !important;
}

.mx-0 {
  margin-right: 0px !important;
  margin-left: 0px !important;
}

.mx-5 {
  margin-right: 5px !important;
  margin-left: 5px !important;
}

.mx-10 {
  margin-right: 10px !important;
  margin-left: 10px !important;
}

.mx-15 {
  margin-right: 15px !important;
  margin-left: 15px !important;
}

.mx-20 {
  margin-right: 20px !important;
  margin-left: 20px !important;
}

.mx-25 {
  margin-right: 25px !important;
  margin-left: 25px !important;
}

.mx-30 {
  margin-right: 30px !important;
  margin-left: 30px !important;
}

.mx-35 {
  margin-right: 35px !important;
  margin-left: 35px !important;
}

.mx-40 {
  margin-right: 40px !important;
  margin-left: 40px !important;
}

.mx-45 {
  margin-right: 45px !important;
  margin-left: 45px !important;
}

.mx-50 {
  margin-right: 50px !important;
  margin-left: 50px !important;
}

.mx-55 {
  margin-right: 55px !important;
  margin-left: 55px !important;
}

.mx-60 {
  margin-right: 60px !important;
  margin-left: 60px !important;
}

.mx-65 {
  margin-right: 65px !important;
  margin-left: 65px !important;
}

.mx-70 {
  margin-right: 70px !important;
  margin-left: 70px !important;
}

.mx-75 {
  margin-right: 75px !important;
  margin-left: 75px !important;
}

.mx-80 {
  margin-right: 80px !important;
  margin-left: 80px !important;
}

.mx-85 {
  margin-right: 85px !important;
  margin-left: 85px !important;
}

.mx-90 {
  margin-right: 90px !important;
  margin-left: 90px !important;
}

.mx-95 {
  margin-right: 95px !important;
  margin-left: 95px !important;
}

.mx-100 {
  margin-right: 100px !important;
  margin-left: 100px !important;
}

.mt-0 {
  margin-top: 0px !important;
}

.mt-5 {
  margin-top: 5px !important;
}

.mt-10 {
  margin-top: 10px !important;
}

.mt-15 {
  margin-top: 15px !important;
}

.mt-20 {
  margin-top: 20px !important;
}

.mt-25 {
  margin-top: 25px !important;
}

.mt-30 {
  margin-top: 30px !important;
}

.mt-35 {
  margin-top: 35px !important;
}

.mt-40 {
  margin-top: 40px !important;
}

.mt-45 {
  margin-top: 45px !important;
}

.mt-50 {
  margin-top: 50px !important;
}

.mt-55 {
  margin-top: 55px !important;
}

.mt-60 {
  margin-top: 60px !important;
}

.mt-65 {
  margin-top: 65px !important;
}

.mt-70 {
  margin-top: 70px !important;
}

.mt-75 {
  margin-top: 75px !important;
}

.mt-80 {
  margin-top: 80px !important;
}

.mt-85 {
  margin-top: 85px !important;
}

.mt-90 {
  margin-top: 90px !important;
}

.mt-95 {
  margin-top: 95px !important;
}

.mt-100 {
  margin-top: 100px !important;
}

.ml-0 {
  margin-left: 0px !important;
}

.ml-5 {
  margin-left: 5px !important;
}

.ml-10 {
  margin-left: 10px !important;
}

.ml-15 {
  margin-left: 15px !important;
}

.ml-20 {
  margin-left: 20px !important;
}

.ml-25 {
  margin-left: 25px !important;
}

.ml-30 {
  margin-left: 30px !important;
}

.ml-35 {
  margin-left: 35px !important;
}

.ml-40 {
  margin-left: 40px !important;
}

.ml-45 {
  margin-left: 45px !important;
}

.ml-50 {
  margin-left: 50px !important;
}

.ml-55 {
  margin-left: 55px !important;
}

.ml-60 {
  margin-left: 60px !important;
}

.ml-65 {
  margin-left: 65px !important;
}

.ml-70 {
  margin-left: 70px !important;
}

.ml-75 {
  margin-left: 75px !important;
}

.ml-80 {
  margin-left: 80px !important;
}

.ml-85 {
  margin-left: 85px !important;
}

.ml-90 {
  margin-left: 90px !important;
}

.ml-95 {
  margin-left: 95px !important;
}

.ml-100 {
  margin-left: 100px !important;
}

.mb-0 {
  margin-bottom: 0px !important;
}

.mb-5 {
  margin-bottom: 5px !important;
}

.mb-10 {
  margin-bottom: 10px !important;
}

.mb-15 {
  margin-bottom: 15px !important;
}

.mb-20 {
  margin-bottom: 20px !important;
}

.mb-25 {
  margin-bottom: 25px !important;
}

.mb-30 {
  margin-bottom: 30px !important;
}

.mb-35 {
  margin-bottom: 35px !important;
}

.mb-40 {
  margin-bottom: 40px !important;
}

.mb-45 {
  margin-bottom: 45px !important;
}

.mb-50 {
  margin-bottom: 50px !important;
}

.mb-55 {
  margin-bottom: 55px !important;
}

.mb-60 {
  margin-bottom: 60px !important;
}

.mb-65 {
  margin-bottom: 65px !important;
}

.mb-70 {
  margin-bottom: 70px !important;
}

.mb-75 {
  margin-bottom: 75px !important;
}

.mb-80 {
  margin-bottom: 80px !important;
}

.mb-85 {
  margin-bottom: 85px !important;
}

.mb-90 {
  margin-bottom: 90px !important;
}

.mb-95 {
  margin-bottom: 95px !important;
}

.mb-100 {
  margin-bottom: 100px !important;
}

.mr-0 {
  margin-right: 0px !important;
}

.mr-5 {
  margin-right: 5px !important;
}

.mr-10 {
  margin-right: 10px !important;
}

.mr-15 {
  margin-right: 15px !important;
}

.mr-20 {
  margin-right: 20px !important;
}

.mr-25 {
  margin-right: 25px !important;
}

.mr-30 {
  margin-right: 30px !important;
}

.mr-35 {
  margin-right: 35px !important;
}

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

.mr-45 {
  margin-right: 45px !important;
}

.mr-50 {
  margin-right: 50px !important;
}

.mr-55 {
  margin-right: 55px !important;
}

.mr-60 {
  margin-right: 60px !important;
}

.mr-65 {
  margin-right: 65px !important;
}

.mr-70 {
  margin-right: 70px !important;
}

.mr-75 {
  margin-right: 75px !important;
}

.mr-80 {
  margin-right: 80px !important;
}

.mr-85 {
  margin-right: 85px !important;
}

.mr-90 {
  margin-right: 90px !important;
}

.mr-95 {
  margin-right: 95px !important;
}

.mr-100 {
  margin-right: 100px !important;
}

/*=======================================================*/
/* Padding --------------------------------------- [PAD] */
/*=======================================================*/
.p-0 {
  padding: 0px !important;
}

.p-5 {
  padding: 5px !important;
}

.p-10 {
  padding: 10px !important;
}

.p-15 {
  padding: 15px !important;
}

.p-20 {
  padding: 20px !important;
}

.p-25 {
  padding: 25px !important;
}

.p-30 {
  padding: 30px !important;
}

.p-35 {
  padding: 35px !important;
}

.p-40 {
  padding: 40px !important;
}

.p-45 {
  padding: 45px !important;
}

.p-50 {
  padding: 50px !important;
}

.p-55 {
  padding: 55px !important;
}

.p-60 {
  padding: 60px !important;
}

.p-65 {
  padding: 65px !important;
}

.p-70 {
  padding: 70px !important;
}

.p-75 {
  padding: 75px !important;
}

.p-80 {
  padding: 80px !important;
}

.p-85 {
  padding: 85px !important;
}

.p-90 {
  padding: 90px !important;
}

.p-95 {
  padding: 95px !important;
}

.p-100 {
  padding: 100px !important;
}

.py-0 {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

.py-5 {
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}

.py-10 {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.py-15 {
  padding-top: 15px !important;
  padding-bottom: 15px !important;
}

.py-20 {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

.py-25 {
  padding-top: 25px !important;
  padding-bottom: 25px !important;
}

.py-30 {
  padding-top: 30px !important;
  padding-bottom: 30px !important;
}

.py-35 {
  padding-top: 35px !important;
  padding-bottom: 35px !important;
}

.py-40 {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

.py-45 {
  padding-top: 45px !important;
  padding-bottom: 45px !important;
}

.py-50 {
  padding-top: 50px !important;
  padding-bottom: 50px !important;
}

.py-55 {
  padding-top: 55px !important;
  padding-bottom: 55px !important;
}

.py-60 {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
}

.py-65 {
  padding-top: 65px !important;
  padding-bottom: 65px !important;
}

.py-70 {
  padding-top: 70px !important;
  padding-bottom: 70px !important;
}

.py-75 {
  padding-top: 75px !important;
  padding-bottom: 75px !important;
}

.py-80 {
  padding-top: 80px !important;
  padding-bottom: 80px !important;
}

.py-85 {
  padding-top: 85px !important;
  padding-bottom: 85px !important;
}

.py-90 {
  padding-top: 90px !important;
  padding-bottom: 90px !important;
}

.py-95 {
  padding-top: 95px !important;
  padding-bottom: 95px !important;
}

.py-100 {
  padding-top: 100px !important;
  padding-bottom: 100px !important;
}

.px-0 {
  padding-right: 0px !important;
  padding-left: 0px !important;
}

.px-5 {
  padding-right: 5px !important;
  padding-left: 5px !important;
}

.px-10 {
  padding-right: 10px !important;
  padding-left: 10px !important;
}

.px-15 {
  padding-right: 15px !important;
  padding-left: 15px !important;
}

.px-20 {
  padding-right: 20px !important;
  padding-left: 20px !important;
}

.px-25 {
  padding-right: 25px !important;
  padding-left: 25px !important;
}

.px-30 {
  padding-right: 30px !important;
  padding-left: 30px !important;
}

.px-35 {
  padding-right: 35px !important;
  padding-left: 35px !important;
}

.px-40 {
  padding-right: 40px !important;
  padding-left: 40px !important;
}

.px-45 {
  padding-right: 45px !important;
  padding-left: 45px !important;
}

.px-50 {
  padding-right: 50px !important;
  padding-left: 50px !important;
}

.px-55 {
  padding-right: 55px !important;
  padding-left: 55px !important;
}

.px-60 {
  padding-right: 60px !important;
  padding-left: 60px !important;
}

.px-65 {
  padding-right: 65px !important;
  padding-left: 65px !important;
}

.px-70 {
  padding-right: 70px !important;
  padding-left: 70px !important;
}

.px-75 {
  padding-right: 75px !important;
  padding-left: 75px !important;
}

.px-80 {
  padding-right: 80px !important;
  padding-left: 80px !important;
}

.px-85 {
  padding-right: 85px !important;
  padding-left: 85px !important;
}

.px-90 {
  padding-right: 90px !important;
  padding-left: 90px !important;
}

.px-95 {
  padding-right: 95px !important;
  padding-left: 95px !important;
}

.px-100 {
  padding-right: 100px !important;
  padding-left: 100px !important;
}

.pt-0 {
  padding-top: 0px !important;
}

.pt-5 {
  padding-top: 5px !important;
}

.pt-10 {
  padding-top: 10px !important;
}

.pt-15 {
  padding-top: 15px !important;
}

.pt-20 {
  padding-top: 20px !important;
}

.pt-25 {
  padding-top: 25px !important;
}

.pt-30 {
  padding-top: 30px !important;
}

.pt-35 {
  padding-top: 35px !important;
}

.pt-40 {
  padding-top: 40px !important;
}

.pt-45 {
  padding-top: 45px !important;
}

.pt-50 {
  padding-top: 50px !important;
}

.pt-55 {
  padding-top: 55px !important;
}

.pt-60 {
  padding-top: 60px !important;
}

.pt-65 {
  padding-top: 65px !important;
}

.pt-70 {
  padding-top: 70px !important;
}

.pt-75 {
  padding-top: 75px !important;
}

.pt-80 {
  padding-top: 80px !important;
}

.pt-85 {
  padding-top: 85px !important;
}

.pt-90 {
  padding-top: 90px !important;
}

.pt-95 {
  padding-top: 95px !important;
}

.pt-100 {
  padding-top: 100px !important;
}

.pl-0 {
  padding-left: 0px !important;
}

.pl-5 {
  padding-left: 5px !important;
}

.pl-10 {
  padding-left: 10px !important;
}

.pl-15 {
  padding-left: 15px !important;
}

.pl-20 {
  padding-left: 20px !important;
}

.pl-25 {
  padding-left: 25px !important;
}

.pl-30 {
  padding-left: 30px !important;
}

.pl-35 {
  padding-left: 35px !important;
}

.pl-40 {
  padding-left: 40px !important;
}

.pl-45 {
  padding-left: 45px !important;
}

.pl-50 {
  padding-left: 50px !important;
}

.pl-55 {
  padding-left: 55px !important;
}

.pl-60 {
  padding-left: 60px !important;
}

.pl-65 {
  padding-left: 65px !important;
}

.pl-70 {
  padding-left: 70px !important;
}

.pl-75 {
  padding-left: 75px !important;
}

.pl-80 {
  padding-left: 80px !important;
}

.pl-85 {
  padding-left: 85px !important;
}

.pl-90 {
  padding-left: 90px !important;
}

.pl-95 {
  padding-left: 95px !important;
}

.pl-100 {
  padding-left: 100px !important;
}

.pb-0 {
  padding-bottom: 0px !important;
}

.pb-5 {
  padding-bottom: 5px !important;
}

.pb-10 {
  padding-bottom: 10px !important;
}

.pb-15 {
  padding-bottom: 15px !important;
}

.pb-20 {
  padding-bottom: 20px !important;
}

.pb-25 {
  padding-bottom: 25px !important;
}

.pb-30 {
  padding-bottom: 30px !important;
}

.pb-35 {
  padding-bottom: 35px !important;
}

.pb-40 {
  padding-bottom: 40px !important;
}

.pb-45 {
  padding-bottom: 45px !important;
}

.pb-50 {
  padding-bottom: 50px !important;
}

.pb-55 {
  padding-bottom: 55px !important;
}

.pb-60 {
  padding-bottom: 60px !important;
}

.pb-65 {
  padding-bottom: 65px !important;
}

.pb-70 {
  padding-bottom: 70px !important;
}

.pb-75 {
  padding-bottom: 75px !important;
}

.pb-80 {
  padding-bottom: 80px !important;
}

.pb-85 {
  padding-bottom: 85px !important;
}

.pb-90 {
  padding-bottom: 90px !important;
}

.pb-95 {
  padding-bottom: 95px !important;
}

.pb-100 {
  padding-bottom: 100px !important;
}

.pr-0 {
  padding-right: 0px !important;
}

.pr-5 {
  padding-right: 5px !important;
}

.pr-10 {
  padding-right: 10px !important;
}

.pr-15 {
  padding-right: 15px !important;
}

.pr-20 {
  padding-right: 20px !important;
}

.pr-25 {
  padding-right: 25px !important;
}

.pr-30 {
  padding-right: 30px !important;
}

.pr-35 {
  padding-right: 35px !important;
}

.pr-40 {
  padding-right: 40px !important;
}

.pr-45 {
  padding-right: 45px !important;
}

.pr-50 {
  padding-right: 50px !important;
}

.pr-55 {
  padding-right: 55px !important;
}

.pr-60 {
  padding-right: 60px !important;
}

.pr-65 {
  padding-right: 65px !important;
}

.pr-70 {
  padding-right: 70px !important;
}

.pr-75 {
  padding-right: 75px !important;
}

.pr-80 {
  padding-right: 80px !important;
}

.pr-85 {
  padding-right: 85px !important;
}

.pr-90 {
  padding-right: 90px !important;
}

.pr-95 {
  padding-right: 95px !important;
}

.pr-100 {
  padding-right: 100px !important;
}

/*=======================================================*/
/* Font Size ------------------------------------ [FONT] */
/*=======================================================*/
.font8 {
  font-size: 8px !important;
}

.font10 {
  font-size: 10px !important;
}

.font12 {
  font-size: 12px !important;
}

.font14 {
  font-size: 14px !important;
}

.font16 {
  font-size: 16px !important;
}

.font18 {
  font-size: 18px !important;
}

.font20 {
  font-size: 20px !important;
}

.font22 {
  font-size: 22px !important;
}

.font24 {
  font-size: 24px !important;
}

.font26 {
  font-size: 26px !important;
}

.font28 {
  font-size: 28px !important;
}

.font30 {
  font-size: 30px !important;
}

.font32 {
  font-size: 32px !important;
}

.font34 {
  font-size: 34px !important;
}

.font36 {
  font-size: 36px !important;
}

.font38 {
  font-size: 38px !important;
}

.font40 {
  font-size: 40px !important;
}

.font42 {
  font-size: 42px !important;
}

.font44 {
  font-size: 44px !important;
}

.font46 {
  font-size: 46px !important;
}

.font48 {
  font-size: 48px !important;
}

.font50 {
  font-size: 50px !important;
}

.font52 {
  font-size: 52px !important;
}

.font54 {
  font-size: 54px !important;
}

.font56 {
  font-size: 56px !important;
}

.font58 {
  font-size: 58px !important;
}

.font60 {
  font-size: 60px !important;
}

.font62 {
  font-size: 62px !important;
}

.font64 {
  font-size: 64px !important;
}

.font66 {
  font-size: 66px !important;
}

.font68 {
  font-size: 68px !important;
}

.font70 {
  font-size: 70px !important;
}

.font72 {
  font-size: 72px !important;
}

/*=======================================================*/
/* ADDITIONAL */
/*=======================================================*/
@media (max-width: 479px) {
  .col-xxs-1 {
    width: 8.3333333333% !important;
  }

  .col-xxs-2 {
    width: 16.6666666667% !important;
  }

  .col-xxs-3 {
    width: 25% !important;
  }

  .col-xxs-4 {
    width: 33.3333333333% !important;
  }

  .col-xxs-5 {
    width: 41.6666666667% !important;
  }

  .col-xxs-6 {
    width: 50% !important;
  }

  .col-xxs-7 {
    width: 58.3333333333% !important;
  }

  .col-xxs-8 {
    width: 66.6666666667% !important;
  }

  .col-xxs-9 {
    width: 75% !important;
  }

  .col-xxs-10 {
    width: 83.3333333333% !important;
  }

  .col-xxs-11 {
    width: 91.6666666667% !important;
  }

  .col-xxs-12 {
    width: 100% !important;
  }
}
@font-face {
  font-family: "Ooredoo";
  font-weight: 400;
  src: url("../fonts/ooredoo-Regular.eot");
  src: url("../fonts/ooredoo-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/ooredoo-Regular.woff2") format("woff2"), url("../fonts/ooredoo-Regular.woff") format("woff"), url("../fonts/ooredoo-Regular.ttf") format("truetype"), url("../fonts/ooredoo-Regular.svg#ooredoo-Regular") format("svg");
}
@font-face {
  font-family: "Ooredoo";
  font-weight: 600;
  src: url("../fonts/ooredoo-Bold.eot");
  src: url("../fonts/ooredoo-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/ooredoo-Bold.woff2") format("woff2"), url("../fonts/ooredoo-Bold.woff") format("woff"), url("../fonts/ooredoo-Bold.ttf") format("truetype"), url("../fonts/ooredoo-Bold.svg#ooredoo-Bold") format("svg");
}
@font-face {
  font-family: "Ooredoo";
  font-weight: 700;
  src: url("../fonts/Ooredoo-Heavy.eot");
  src: url("../fonts/Ooredoo-Heavy.eot?#iefix") format("embedded-opentype"), url("../fonts/Ooredoo-Heavy.woff2") format("woff2"), url("../fonts/Ooredoo-Heavy.woff") format("woff"), url("../fonts/Ooredoo-Heavy.ttf") format("truetype"), url("../fonts/Ooredoo-Heavy.svg#Ooredoo-Heavy") format("svg");
}
.checkbox {
  padding: 0;
}
.checkbox label {
  display: inline-block;
  position: relative;
  padding-left: 35px;
  line-height: 24px;
}
.checkbox label::before {
  content: "";
  display: inline-block;
  position: absolute;
  width: 24px;
  height: 24px;
  left: 0;
  top: 0;
  border: 2px solid #221e20;
  border-radius: 3px;
  background-color: transparent;
  -webkit-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
  -o-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
  transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
}
.checkbox label::after {
  display: inline-block;
  position: absolute;
  width: 22px;
  height: 22px;
  left: 0;
  top: 0;
  padding-left: 3px;
  padding-top: 1px;
  font-size: 24px;
  line-height: 24px;
  color: #Ed1c24;
}
.checkbox input[type=checkbox] {
  opacity: 0;
  margin-left: 0;
}
.checkbox input[type=checkbox]:focus + label::before {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
.checkbox input[type=checkbox]:checked + label::after {
  font-family: "FontAwesome";
  content: "";
}
.checkbox input[type=checkbox]:disabled + label {
  opacity: 0.65;
}
.checkbox input[type=checkbox]:disabled + label::before {
  background-color: #eeeeee;
  cursor: not-allowed;
}
.checkbox.checkbox-circle label::before {
  border-radius: 50%;
}
.checkbox.checkbox-inline {
  margin-top: 0;
}

.radio {
  padding: 0;
}
.radio label {
  display: block;
  position: relative;
  padding: 10px 30px 10px 40px;
}
.radio label::before {
  content: " ";
  display: inline-block;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  width: 17px;
  height: 17px;
  border: 1px solid #cccccc;
  border-radius: 50%;
  background-color: #fff;
  -webkit-transition: border 0.15s ease-in-out;
  transition: border 0.15s ease-in-out;
}
.radio label::after {
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 3px;
  content: " ";
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background-color: #fff;
  -webkit-transform: scale(0, 0);
  -ms-transform: scale(0, 0);
  -o-transform: scale(0, 0);
  transform: scale(0, 0);
  -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
  -moz-transition: -moz-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
  -o-transition: -o-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
  transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
}
.radio input[type=radio] {
  opacity: 0;
}
.radio input[type=radio]:checked + label::before {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
  background-color: #000;
}
.radio input[type=radio]:checked + label::after {
  -webkit-transform: scale(1, 1) translate(0, -50%);
  -ms-transform: scale(1, 1) translate(0, -50%);
  -o-transform: scale(1, 1) translate(0, -50%);
  transform: scale(1, 1) translate(0, -50%);
}
.radio input[type=radio]:disabled + label {
  opacity: 0.65;
}
.radio input[type=radio]:disabled + label::before {
  cursor: not-allowed;
}
.radio.radio-inline {
  margin-top: 0;
}

/*
===========================
BASIC
===========================
*/
body {
  padding-right: 0 !important;
  position: relative;
  background-color: #ffd500;
  color: #221e20;
  font-weight: 400;
  font-family: "Noto Sans", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  word-wrap: break-word;
  background-image: url("../img/bubble-corner.svg");
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 400px 240px;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  font-size: inherit;
}

.img-responsive {
  width: 100% !important;
  max-width: none !important;
}

.transition-default, .radio-feedback label, .info-popleft, .modal .close, .btn, .radio {
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.img-logo {
  width: 180px;
}

.content-wrapper {
  min-height: 100vh;
}

footer {
  position: relative;
  z-index: 0;
}

/*
===========================
BOX
===========================
*/
.row-sm {
  margin-left: -5px;
  margin-right: -5px;
}
.row-sm > div {
  padding-left: 5px;
  padding-right: 5px;
}

.box-mid-out {
  height: 100%;
  display: table;
  width: 100%;
}
.box-mid-in {
  display: table-cell;
  vertical-align: middle;
}
.box-white, .box-form {
  background-color: #fff;
}
.box-shadow, .radio-answer:hover, .tutorial-info-left, .tutorial-info-top, .box-test, .modal .close:hover, .box-form, .radio label::after {
  box-shadow: 0px 10px 19px 0px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0px 10px 19px 0px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0px 10px 19px 0px rgba(0, 0, 0, 0.2);
}
.box-shadow-top, .tutorial-info-bottom {
  box-shadow: 0px -10px 19px 0px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0px -10px 19px 0px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0px -10px 19px 0px rgba(0, 0, 0, 0.2);
}
.box-form {
  border-radius: 8px;
}
.box-form > div + div {
  border-top: 1px solid #ddd;
}
.box-form-content {
  padding: 30px;
}
.box-border-orange {
  border-radius: 8px;
  border: 2px solid #ea9600;
  overflow: hidden;
}

/*
===========================
TEXT
===========================
*/
.title-outline {
  text-shadow: -1px -1px 0 #ffd500, 1px -1px 0 #ffd500, -1px 1px 0 #ffd500, 1px 1px 0 #ffd500;
}
.title-main, .title-sub, .title-white {
  display: block;
  font-family: "Ooredoo", sans-serif;
  font-weight: 700;
}
.title-main {
  color: #Ed1c24;
}
.title-sub {
  color: #221e20;
}
.title-white {
  color: #fff;
}

.text-red {
  color: #Ed1c24;
}
.text-bold {
  font-weight: 700 !important;
}
.text-white {
  color: #fff;
}

/*
===========================
BUTTON
===========================
*/
.btn-black, .btn-standard, .btn-bordered {
  padding: 15px 30px;
  min-width: 150px;
  border-radius: 50px;
  font-family: "Ooredoo", sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 1;
}
.btn-black:focus, .btn-standard:focus, .btn-bordered:focus {
  outline: none !important;
}
.btn-standard, .btn-standard:focus {
  border: 1px solid #Ed1c24;
  background-color: #Ed1c24;
  color: #fff;
}
.btn-standard:hover, .btn-standard:active, .btn-standard:focus:hover, .btn-standard:focus:active {
  color: #Ed1c24;
  background-color: #ffd500;
}
.btn-standard.disabled:hover, .btn-standard:focus.disabled:hover {
  background-color: #Ed1c24;
  color: #fff;
}
.btn-bordered, .btn-bordered:focus {
  border: 1px solid #Ed1c24;
  background-color: transparent;
  color: #Ed1c24;
}
.btn-bordered:hover, .btn-bordered:active, .btn-bordered:focus:hover, .btn-bordered:focus:active {
  color: #Ed1c24;
  background-color: #ffd500;
}
.btn-bordered.disabled:hover, .btn-bordered:focus.disabled:hover {
  background-color: transparent;
  color: #Ed1c24;
}
.btn-black {
  border: 1px solid #221e20;
  background-color: #221e20;
  color: #fff;
}
.btn-black:hover, .btn-black:active {
  color: #Ed1c24;
  background-color: #ffd500;
  border: 1px solid #Ed1c24;
}
.btn-black:focus {
  border: 1px solid #221e20;
  background-color: #221e20;
  color: #fff;
}
.btn-circle {
  min-width: 0;
  padding: 0 !important;
  width: 46px;
  height: 46px;
  text-align: center;
}
.btn-pulse {
  animation: shadow-pulse 1s infinite;
}

@keyframes shadow-pulse {
  0% {
    box-shadow: 0 0 0 0px rgba(237, 28, 36, 0.8);
  }
  100% {
    box-shadow: 0 0 0 35px rgba(237, 28, 36, 0);
  }
}
/*
===========================
FORM
===========================
*/
.seamless-input-group {
  position: relative;
}
.seamless-input-group .seamless-addon-left {
  position: absolute;
  top: 50%;
  right: auto;
  bottom: auto;
  left: 5px;
  width: 45px;
  text-align: center;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
}
.seamless-input-group .seamless-addon-left ~ input {
  padding-left: 50px;
}

.input-radius {
  border-radius: 50px;
}
.input-lg {
  font-size: 16px;
}

div.btn-group.bootstrap-select.form-control,
.selectpicker-lg .bootstrap-select > .btn {
  height: 46px;
}

.form-group {
  margin-bottom: 25px;
}

.required:after {
  content: "*";
  color: #Ed1c24;
}

textarea {
  resize: vertical;
}

.form-control {
  font-size: 16px;
}

/*
===========================
WELCOME
===========================
*/
.box-warning {
  position: relative;
  border-radius: 8px;
  padding-left: 50px !important;
  background-color: #ffd500;
  line-height: 1.4;
}
.box-warning-white {
  background-color: #fff;
}
.box-warning:after {
  content: "";
  position: absolute;
  top: 50%;
  right: auto;
  bottom: auto;
  left: 0;
  width: 50px;
  color: #Ed1c24;
  text-align: center;
  font-size: 18px;
  font-family: FontAwesome;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
}

.subtest-thumb {
  margin-bottom: 10px;
  background-color: #fff;
}
.subtest-thumb span {
  line-height: 1.3;
}

/*
===========================
BUTTONS AND THEIR MODALS
===========================
*/
.modal-body {
  padding: 30px;
}
.modal-icon {
  display: inline-block;
  border-radius: 50px;
  color: #fff;
  background-color: #Ed1c24;
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
}
.modal .close {
  position: absolute;
  top: -25px;
  right: -25px;
  bottom: auto;
  left: auto;
  width: 50px;
  height: 50px;
  opacity: 1;
  z-index: 1;
  outline: none !important;
  border-radius: 50px;
}
.fix-rb {
  position: fixed;
  bottom: 30px;
  right: 15px;
  z-index: 1;
}

.fix-rm {
  position: fixed;
  z-index: 1;
}

/*
===========================
TOOLTIP
===========================
*/
.info-popleft {
  display: none;
  border-radius: 5px;
  position: absolute;
  top: 50%;
  right: auto;
  bottom: auto;
  left: -5px;
  transform: translate(-100%, -50%);
  -webkit-transform: translate(-100%, -50%);
  -moz-transform: translate(-100%, -50%);
  -ms-transform: translate(-100%, -50%);
  -o-transform: translate(-100%, -50%);
  padding: 3px 5px;
  background-color: rgba(0, 0, 0, 0.9);
  color: #fff;
  font-weight: 700;
  font-size: 12px;
  text-align: center;
  min-width: 120px;
}

.info-pop-holder {
  position: relative;
  margin: 10px;
}
.info-pop-holder:hover .info-popleft {
  display: block;
}

/*
===========================
CKEDITOR
===========================
*/
.cke-result h1 {
  font-weight: 700;
  margin-bottom: 5px;
}
.cke-result h2 {
  font-weight: 700;
  margin-bottom: 5px;
}
.cke-result h3 {
  font-weight: 700;
  margin-bottom: 5px;
}
.cke-result h4 {
  font-weight: 700;
  margin-bottom: 5px;
}
.cke-result h5 {
  font-weight: 700;
  margin-bottom: 5px;
}
.cke-result h6 {
  font-weight: 700;
  margin-bottom: 5px;
}
.cke-result p {
  margin-bottom: 15px;
}
.cke-result ul {
  padding-left: 25px !important;
}
.cke-result li {
  margin-bottom: 8px;
}
.cke-result img {
  max-width: 100% !important;
  height: auto;
}

/*
===========================
CAMERA
===========================
*/
.camera-canvas {
  height: 350px;
  background-color: #b9bcbf;
}

.img-permission {
  border: 1px solid #ddd;
  max-width: 400px !important;
  margin-left: auto;
  margin-right: auto;
}

/*
===========================
ALERT
===========================
*/
.alert-indosat {
  border: 2px solid #Ed1c24;
  background-color: #ffd500;
}

/*
===========================
TERMS CONDITIONS
===========================
*/
.terms-content {
  max-height: 400px;
  overflow-y: auto;
}

/*
===========================
TEST INSTRUCTIONS
===========================
*/
.instruction-title {
  padding-left: 60px;
  min-height: 50px;
  position: relative;
}

.test-icon {
  position: absolute;
  top: 50%;
  right: auto;
  bottom: auto;
  left: 0;
  width: 50px;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
}

.list-test-info li {
  display: inline-block;
  line-height: 1;
}
.list-test-info li + li {
  padding-left: 10px;
  margin-left: 10px;
  border-left: 2px solid #ea9600;
}

/*
===========================
TUTORIAL N TEST
===========================
*/
.box-test {
  border-radius: 8px;
  position: relative;
  background-color: #fff;
}
.box-test-paragraph {
  padding: 30px 15px;
  overflow-y: auto;
  background-color: #fff;
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
}
.box-test-question {
  border-left: 1px solid #ddd;
}
.box-test-question > div + div {
  border-top: 1px solid #ddd;
}
.box-test-question > div:first-child {
  border-top-right-radius: 8px;
}
.box-test-question > div:last-child {
  border-bottom-right-radius: 8px;
}
.box-test-small {
  margin-left: auto;
  margin-right: auto;
  max-width: 600px;
}
.box-test-small > div + div {
  border-top: 1px solid #ddd;
}
.box-test-small > div:first-child {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
.box-test-small > div:last-child {
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}
.box-test-head {
  padding: 15px;
  background-color: #fff;
}
.box-test-body, .box-test-footer {
  padding: 15px;
  background-color: #fff;
}

.tutorial-spot-holder {
  position: relative;
}
.tutorial-spot-holder.active {
  z-index: 5;
}
.tutorial-spot-holder.active.tutorial-info, .tutorial-spot-holder.active .tutorial-info {
  display: block;
}

.tutorial-spot {
  position: relative;
}

.tutorial-layer {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 15px;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 4;
}

.tutorial-info {
  padding: 15px;
  width: 250px;
  border-radius: 8px;
  background-color: #fff;
  text-align: center;
  z-index: 4;
  display: none;
}
.tutorial-info-top {
  position: absolute;
  top: -10px;
  right: auto;
  bottom: auto;
  left: 50%;
  transform: translate(-50%, -100%);
  -webkit-transform: translate(-50%, -100%);
  -moz-transform: translate(-50%, -100%);
  -ms-transform: translate(-50%, -100%);
  -o-transform: translate(-50%, -100%);
}
.tutorial-info-top:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0;
  height: 0;
  border: 12px solid transparent;
  border-top-color: #fff;
  border-bottom: 0;
  margin-left: -12px;
  margin-bottom: -12px;
}
.tutorial-info-left {
  position: absolute;
  top: 50%;
  right: auto;
  bottom: auto;
  left: -10px;
  transform: translate(-100%, -50%);
  -webkit-transform: translate(-100%, -50%);
  -moz-transform: translate(-100%, -50%);
  -ms-transform: translate(-100%, -50%);
  -o-transform: translate(-100%, -50%);
}
.tutorial-info-left:before {
  content: " ";
  position: absolute;
  right: 0;
  top: 50%;
  width: 0;
  height: 0;
  border: 12px solid transparent;
  border-left-color: #fff;
  border-right: 0;
  margin-top: -12px;
  margin-right: -12px;
}
.tutorial-info-bottom {
  position: absolute;
  top: auto;
  right: auto;
  bottom: -10px;
  left: 50%;
  transform: translate(-50%, 100%);
  -webkit-transform: translate(-50%, 100%);
  -moz-transform: translate(-50%, 100%);
  -ms-transform: translate(-50%, 100%);
  -o-transform: translate(-50%, 100%);
}
.tutorial-info-bottom:before {
  content: " ";
  position: absolute;
  top: 0;
  right: auto;
  bottom: auto;
  left: 50%;
  width: 0;
  height: 0;
  border: 12px solid transparent;
  border-bottom-color: #ffffff;
  border-top: 0;
  margin-left: -12px;
  margin-top: -12px;
}

.test-numb-holder {
  line-height: 1.2;
}

.radio-answer {
  margin-bottom: 20px;
  border: 1px solid #ddd;
  border-radius: 8px;
}
.radio-answer label {
  padding-top: 20px;
  padding-bottom: 20px;
  padding-left: 45px;
}
.radio-answer label::before {
  left: 10px;
  width: 24px;
  height: 24px;
}
.radio-answer label::after {
  left: 14px;
  width: 16px;
  height: 16px;
}
.test-title {
  max-width: 230px;
  margin-left: auto;
}

.written-test {
  padding: 10px;
  margin-bottom: 20px;
  background-color: #efefef;
}
.written-test span {
  padding: 0 3px 25px 3px;
  display: inline-block;
  text-decoration: underline;
  font-weight: 700;
  position: relative;
}
.written-test span:after {
  position: absolute;
  top: auto;
  right: 0;
  bottom: 5px;
  left: 0;
  text-align: center;
}
.written-test .opt-a:after {
  content: "A";
}
.written-test .opt-b:after {
  content: "B";
}
.written-test .opt-c:after {
  content: "C";
}
.written-test .opt-d:after {
  content: "D";
}

.list-question {
  padding: 5px !important;
}
.list-question .btn {
  width: 100%;
  display: block;
  height: 44px;
  padding: 0;
  line-height: 40px;
  text-align: center;
  border: 2px solid #ddd;
  background-color: #efefef;
}
.list-question .btn.done {
  background-color: #fff;
  border-color: #99cc00;
  color: #99cc00;
}

.list-nav-info li {
  margin: 3px 10px;
  display: inline-block;
  line-height: 1;
  font-weight: 700;
}
.list-nav-info li span {
  display: inline-block;
  line-height: 14px;
}
.list-nav-info li .empty-sign,
.list-nav-info li .done-sign {
  width: 14px;
  height: 14px;
  border: 1px solid #ddd;
  border-radius: 2px;
}
.list-nav-info li .empty-sign {
  background-color: #efefef;
}
.list-nav-info li .done-sign {
  background-color: #99cc00;
}

/*
===========================
FEEDBACK
===========================
*/
.radio-feedback {
  margin: 5px 7px;
  display: inline-block;
}
.radio-feedback label {
  padding: 2px;
  border-radius: 50%;
  border: 5px solid #b9bcbf;
  opacity: 0.5;
}
.radio-feedback label::after, .radio-feedback label::before {
  display: none;
}
.radio-feedback label:hover {
  opacity: 1;
}
.radio-feedback input[type=radio] {
  bottom: 0;
}
.radio-feedback input[type=radio]:checked + label {
  opacity: 1;
  border-color: #65c4db;
}

@media (min-width: 1200px) {
  .subtest-thumb {
    border-radius: 100%;
    width: 190px;
    height: 190px;
    text-align: center;
  }
  .subtest-thumb .title-main {
    margin-bottom: 5px;
  }

  .subtest-thumb-img {
    margin-bottom: 10px;
  }
}
@media (min-width: 768px) {
  .fix-rm {
    top: 50%;
    right: 0;
    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
  }

  .modal {
    text-align: center;
    padding: 0 !important;
  }
  .modal:before {
    content: "";
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -4px;
  }
  .modal-dialog {
    display: inline-block;
    text-align: left;
    vertical-align: middle;
  }

  .fix-rm-tuts-top {
    padding: 5px 10px;
    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
  }

  .fix-rm-tuts-bot {
    padding: 5px 10px;
    transform: translate(0, 50%);
    -webkit-transform: translate(0, 50%);
    -moz-transform: translate(0, 50%);
    -ms-transform: translate(0, 50%);
    -o-transform: translate(0, 50%);
  }
}
@media (max-width: 767px) and (min-width: 480px) {
  .tutorial-timer {
    left: auto;
    right: 0;
    transform: translate(0, 100%);
    -webkit-transform: translate(0, 100%);
    -moz-transform: translate(0, 100%);
    -ms-transform: translate(0, 100%);
    -o-transform: translate(0, 100%);
  }
  .tutorial-timer:before {
    left: auto;
    right: 30px;
    transform: translateX(0);
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    -ms-transform: translateX(0);
  }
}
@media (min-width: 480px) {
  .test-title h1 {
    margin-top: 15px;
  }

  .tutorial-timer-reading {
    left: auto;
    right: 0;
    transform: translate(0, 100%);
    -webkit-transform: translate(0, 100%);
    -moz-transform: translate(0, 100%);
    -ms-transform: translate(0, 100%);
    -o-transform: translate(0, 100%);
  }
  .tutorial-timer-reading:before {
    left: auto;
    right: 30px;
    transform: translateX(0);
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    -ms-transform: translateX(0);
  }
}
@media (max-width: 1199px) {
  .subtest-thumb {
    padding: 15px 15px 15px 70px;
    border-radius: 8px;
    position: relative;
  }

  .subtest-thumb-img {
    position: absolute;
    top: 50%;
    right: auto;
    bottom: auto;
    left: 10px;
    width: 50px;
    text-align: center;
    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
    line-height: 40px;
  }
  .subtest-thumb-img img {
    width: 30px;
  }
}
@media (max-width: 991px) {
  .font36 {
    font-size: 32px !important;
  }

  .font32 {
    font-size: 28px !important;
  }

  .font28 {
    font-size: 24px !important;
  }

  .img-logo {
    width: 170px;
  }

  body {
    background-size: 320px 191px;
  }

  .box-test-paragraph {
    padding: 10px;
    border-radius: 0;
  }

  .box-test-large .box-test-question {
    border: none;
  }
  .box-test-large .box-test-question .box-test-head {
    border-top-left-radius: 8px;
  }
  .box-test-large .box-test-question .box-test-footer {
    border-bottom-left-radius: 8px;
  }
}
@media (max-width: 767px) {
  .font36 {
    font-size: 28px !important;
  }

  .font32 {
    font-size: 24px !important;
  }

  .font28 {
    font-size: 22px !important;
  }

  .container-sm {
    margin-left: auto;
    margin-right: auto;
    max-width: 480px;
  }

  .text-center-sm {
    text-align: center !important;
  }

  .modal-dialog {
    margin: 30px;
  }

  .modal-question-list .modal-content {
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
  }

  .list-question-holder {
    max-width: 320px;
    margin-left: auto;
    margin-right: auto;
  }

  .fix-rm {
    bottom: 10px;
    right: 0;
  }

  .info-pop-holder {
    margin: 0;
    padding: 3px 0;
  }
  .info-pop-holder .btn-circle {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }

  .fix-rm-tuts-bot .btn-circle,
.fix-rm-tuts-top .btn-circle {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }

  .fix-rm-tuts-bot {
    bottom: 15px;
  }
  .fix-rm-tuts-bot .tutorial-info {
    top: auto;
    bottom: 0;
    transform: translate(-100%, 0);
    -webkit-transform: translate(-100%, 0);
    -moz-transform: translate(-100%, 0);
    -ms-transform: translate(-100%, 0);
    -o-transform: translate(-100%, 0);
  }
  .fix-rm-tuts-bot .tutorial-info:before {
    top: auto;
    bottom: 10px;
  }

  .fix-rm-tuts-top {
    bottom: 70px;
  }

  .radio-feedback {
    margin: 3px;
  }
  .radio-feedback label img {
    max-width: 30px;
  }
}
@media (max-width: 479px) {
  .font36 {
    font-size: 24px !important;
  }

  .radio-answer label {
    padding-top: 10px;
    padding-bottom: 10px;
    padding-right: 10px;
  }

  .text-center-xs {
    text-align: center !important;
  }

  .text-left-xs {
    text-align: left !important;
  }

  .text-right-xs {
    text-align: right !important;
  }

  .checkbox-xs-left label:after {
    top: 3px;
  }
  .checkbox-xs-left label:before {
    top: 3px;
  }

  .modal-dialog {
    margin: 10px;
  }

  .modal-body {
    padding: 30px 10px;
  }

  .modal .close {
    top: -10px;
    right: -10px;
  }

  .box-form-content {
    padding: 30px 10px;
  }

  .fix-rb {
    bottom: 10px;
    right: 0;
  }

  .camera-canvas {
    height: 300px;
  }

  .img-logo {
    width: 130px;
  }

  body {
    background-size: 250px 149px;
  }

  .no-push-pull-xxs {
    left: 0 !important;
  }

  .test-title span {
    font-size: 18px !important;
  }
}

/*# sourceMappingURL=style.css.map */