* { margin:0px; padding:0px; }
body {
    box-sizing:border-box;
    background:#0054A6;
    background-image: none!important;
}
ul , li { text-decoration:none; list-style:none; }

.bg-epic {  background-size:cover; width:100%; }
img.uae-logo {
    position: absolute; width:74px; 
    right: 34px; bottom:17%;
}
input:focus {
    outline: none;
}
.thanks ul li:first-child .input_div {
    float: right;
}
.dtlogo{
    display: flex;
    width: 100%;
    justify-content: center;
    padding-top: 50px;
    padding-bottom: 30px;
}
.dtlogo a img{
    width: 240px;
}
.header-logo.logo {
    position:relative;
    text-align: center;
    padding:0px;
    float: left;
    width: 100%;
    display:block;
    background: #00468a;
    background-image:url("../img/header-new-2.webp");
}
.header-logo.logo img {
    width: 141px;
    height: auto;
    display: inline-block;
}
.language.uae-logo {
    cursor: pointer;
    display: block;
    font-size: 24px;
    position: absolute;
    right: 23px;
    color: white;
    top: 28px;
}
.language.uae-logo span {
    font-size: 20px;
    position: relative;
    right: 0px;
    top: 0px;
    color: white;
}
.container {
    margin-right: auto;
    margin-left: auto;    
}
.dt-mobile {
    width: 100%;
    height: auto;
    float: left;
}
input#otp-input {
    background: #fff;
    height: 50px;
    border-radius: 5px;
    width: 30%;
    text-align: center;
    padding: 0px 18px;
    margin-bottom: 10px;
    /* margin-top: 30px; */
}
.thanks {
    text-align: center;
    /*padding: 78px 0 0px 0;*/
}
.etisalad-js{
    padding-bottom: 15px;
    text-align: center;
    width: 100%;
}
i.fa.fa-check {
    border-radius: 50%;
    color: #7a8281;
    background: #161a1b;
    width: 104px;
    height: 104px;
    text-align: center;
    line-height: 104px;
    font-size: 50px;
    /* font-weight: normal; */
}

.wrapper { position:relative; float:left; width:100%; background: #0054A6;}

input:focus {
    outline: none;
}
.thanks h1 {
    color: #fff;
    font-size: 60px;
    text-align: center;
    padding: 51px 0 69px 0;
    text-transform: uppercase;
}
.thanks p {
    color: #fff;
    padding: 0px 29%;
    text-align: center;
    font-size: 17px;
}
input.otp_input {
    background: none;
    border: none;
        border-bottom-color: currentcolor;
        border-bottom-style: none;
        border-bottom-width: medium;
    border-bottom-color: currentcolor;
    border-bottom-style: none;
    border-bottom-width: medium;
    padding: 0px;
    width: calc(100% - 104px);
    color: #000;
    font-size: 19px;
    text-align: left;
    height: 50px;
    line-height: 50px;
}

input.subscription {
    background: none;
    border: none;
    border-bottom: 1px solid #c0c2c1;
    padding: 20px 0 7px 0px;
    width: 100%;
    color: #fff; position:relative;
    font-size: 19px;
}

.subscription:before {
    content:"\f073";
    position:absolute; 
    top:0px; font-family: fontawesome;
    right:0px;
    color:#fff; 
}


/*input:placeholder { color:#fff;}*/
input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #818a89;
  opacity: 1; /* Firefox */
}

input:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #818a89;
}

input::-ms-input-placeholder { /* Microsoft Edge */
  color: #818a89;
}


p.sub-text {
    padding: 50px 0 25px 0;
    color: #b9b9b9;
}

button.subscribe {
    background: #e40909;
    border: none;
    color: #fff;
    padding: 15px 100px;
    border-radius: 40px;
    font-size: 20px;
    margin-bottom: 29px;
}
button.subscribe:hover {
    background: #f33636;
}

button.close_button {
    border: 1px solid #f7ec13;
    color: #f7ec13;
    cursor: pointer;
    font-size: 14px!important;
    text-align: center;
    padding: 8px 26px;
    background: transparent;
    transition: 0.3s;
    border-radius: 100px;
    text-transform: uppercase;
}
button.close_button:hover {
    background: #f26b21;
}

.end-content {
    width: calc(100% - 200px);
    padding-left: 100px;
    padding-right: 100px;
    margin-top: 15px;
    /* margin-bottom: 50px; */
    float: left;
}
.end-content h3 {
    padding-bottom: 10px;
    margin-top: 0px;
    margin-bottom: 0px;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5px;
    letter-spacing: normal;
    text-align: center;
    color: #fff;
    position: relative;
    border-bottom: 1px solid #fff;
    width: fit-content;
    margin: 0 auto 10px;
}
.end-content ul li {
    color: #fff; 
    position: relative;
    list-style: none;
    padding: 0px 0 0px 24px;
    font-size: 14px;
    line-height: 1.5;
    text-align: left;  
    width:100%;
    float:left;  
}
.end-content ul li.rtl {
    direction: rtl;
    text-align: right;
    padding: 0px 35px 0px 0px;
}

.end-content ul li:before {
    content: '';
    background: url(../img/tick-3.png);
    width: 15px;
    height: 12px;
    float: left;
    display: inline-block;
    padding: 0px 10px;
    background-repeat: no-repeat;
    top: 5px;
    left: 0px;
    position: absolute;
}
.end-content ul li.rtl:before {
    right: 0;
}

.end-content ul.arabic li::before {
    right: 0px;
}

.end-content h3.arabic {
    padding-bottom: 40px;
    margin-top: 0px;
    margin-bottom: 0px;
    font-size: 17px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 17px;
    letter-spacing: normal;
    text-align: center;
    color: #042b2c;
    position: relative;;
}
.end-content h3.arabic:before{
    width: 374px;
}
.end-content ul.arabic li {
    padding: 0px 40px 20px 0px;
    text-align: right;
}

.input_div  {
    position: relative;
    margin-bottom:20px !important;
}
.du-js {
    padding-bottom: 30px;
    text-align: center;
    width: 100%;
    clear: both;
    float: left;
}
button.close_button:focus {
    outline: 0;
}
.input_div.subscribe {
    margin-bottom: 53px;
    position: relative;
}

.input_div span {
    /* position: absolute;
    top: 23px; */
    color: #818a89;
    font-size: 18px;
    border-right: 1px solid #fff;
    /* padding-right: 9px;
    left: 4px; */
}
.input_div.subscribe:before {
    content: "\f073";
    position: absolute;
    left: 67%;
    color: #fff;
    font-family: fontawesome;
    top: 27px;
}

.input_div.subscribe:before {
    content: "\f073";
    position: absolute;
    left: 67%;
    color: #fff;
    font-family: fontawesome;
    top: 27px;
}


.cd-popup-trigger {
  display: inline-block;
  text-align: center;
  color: #FFF;
  font-weight: bold;
  text-transform: uppercase;
  border-radius: 50em;
  box-shadow: 0 3px 0 rgba(0, 0, 0, 0.07);
  border: none;
}
.thanks ul{width:90%;margin:0px auto 15px auto;}
.thanks ul li {
    float: left;
    width: calc(50% - 40px);
    padding: 0px 20px;
}
.radio_section p {
    float: left;
    width: 33%;
    display: inline-block;
    padding: 0;
}
/* add for single plan */
/*.radio_section p {
    display: inline-block;
    padding: 0;
}*/
/* # add for single plan */
.radio_section {
    text-align:center;
    width: 100%;
}

p.dt-error-messgae {
    text-align: center;
    color: red;
}
#mobile_number-error {
    display: block;
    text-align: left;
    padding: 10px 0px 0px 0px;
    color: red;
    /* position: absolute; */
}

#otp-error {
    display: block;
    padding: 10px 0;
    color: red;
    /* Page Disturb handled */
    position: absolute;
    left: auto;
    text-align: center;
    width: 100%;
    /* Page Disturb handled */
}
#otp-input-error {
    display: block;
    padding: 10px 0;
    color: red;
    /* position: absolute; */
    left: auto;
    text-align: center;
    width: 100%;
}


/*radio button active */
[type="radio"]:checked,
[type="radio"]:not(:checked) {
    position: absolute;
    /*left: -9999px;*/
}
[type="radio"]:checked + label,
[type="radio"]:not(:checked) + label
{
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
    color: #fff;
    font-size: 14px;
    font-weight: normal;    
}
label.input-label {
color: #fff;
font-weight: normal;
position: absolute;
}
/*[type="radio"]:checked + label:before,
[type="radio"]:not(:checked) + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 18px;
    height: 18px;
    border: 1px solid #000;
    border-radius: 100%;
    background: #fff;
}*/

[type="radio"]:checked + label:before, [type="radio"]:not(:checked) + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 26px;
    height: 26px;
    border: 1px solid #e40909;
    border-radius: 100%;
    background: #fff;
    /* border: inset; */
    background: #000;
}

[type="radio"]:checked + label:after,
[type="radio"]:not(:checked) + label:after {
    content: '';
    width: 12px;
    height: 12px;
    background: #e40909;
    position: absolute;
    top: 3px;
    left: 3px;
    border-radius: 100%;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
[type="radio"]:not(:checked) + label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
[type="radio"]:checked + label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}

.radio_section form {
    width: 45%;
    margin: 0 auto;
}
select#aioConceptName {
    outline: none;
    -moz-appearance: none; 
    appearance: none;    
    background: #000;
    border: none;
    color: #7d8888;
    width: 100%;
    padding: 10px 0 7px 10px;
    border-bottom: 1px solid #c0c2c1;
    margin-top: 11px;
    font-size: 18px;
    -webkit-margin-before: 16px;
}

.radio_section input[type="radio"] {
    visibility: visible;
    display: none;
    position: relative;
    z-index: 9999;
    opacity: 0;
    cursor: pointer;
    top: 21px;
    width: 100%;
}
form#dtotp .etisalad-js {
    margin-top: 60px;
}
input.otp_input::placeholder {
    font-size: 17px;
}
p.sub_p {
    font-size: 17px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 17px;
    letter-spacing: normal;
    text-align: center;
    color: #edcc3d;
    border: 1px dashed #edcc3d;
    clear: both;
    padding: 17px 23px;
    display:inline-block;
}
a.subscribe.cd-popup-trigger:hover {
    color: #000;
    text-decoration: none;
}
.sub{ margin:0px 8px;}
.sub_close {margin:0px 8px;}

.footer_text {
    float: left;
    width: 100%;
    text-align: center;
    /*padding: 20px 0;*/
}
#plans {
    margin: 0 auto;
}
@media  only screen and (max-width:1024px) { .thanks ul li { width:45%; }

.radio_section form { padding-left: 24px;  margin: 0 auto;}
}

@media  only screen and (max-width:820px) { .radio_section form {width:100%; padding-left: 0px;}
.thanks ul li { float: left;width: 100%; margin:0px;padding:0px;}
.language.uae-logo {
    top: 17px;
}

 }

@media  only screen and ( max-width:740px ) { img.uae-logo { top: 17px;}
#mobile_number-error {
    font-size: 12px;
    width: calc(100% + 60px);
    left: 0px;
    padding: 10px 0px 0px 5px;
}
.language.uae-logo {
    top: 10px;
    font-size: 18px;
}
.language.uae-logo a {
    color: #fff;
}
.thanks p { padding:0px 2%;  }
.end-content-ar { margin-left: 0px; padding: 0px 15px;}
.end-content-ar ul li {text-align: right;margin-right: 29px;}
.end-content-ar h3 { padding-right: 0px;}
input.subscription{ width:100%; font-size:14px;}
.input_div.subscribe:before {left: 95%;}
p.sub-text {padding: 40px 10px 25px 10px; color: #b9b9b9; font-size:14px;}
.sub-text-top { padding: 0px 20px 0px 20px !important; }
.thanks ul{width:100%;margin:15px auto;}
.radio_section p{margin-bottom:0px;}
#plans {width: 100%;}
#plans li {
   display:inline-block;
}
#plans li p {
    padding: 0px 2px;
}
[type="radio"]:checked + label, [type="radio"]:not(:checked) + label{font-size:12px;padding-left:20px}
[type="radio"]:checked + label:before, [type="radio"]:not(:checked) + label:before{top: 2px;width: 14px;height: 14px;}
[type="radio"]:checked + label:after, [type="radio"]:not(:checked) + label:after{ width: 14px;height: 14px;top: 8px;left: 8px;}

.input_div span{    top: 20px;    font-size: 14px!important;}
.input_div{margin-bottom: 15px !important;}
.end-content{margin-left:0px;padding:0px 12px;}
ul.input-field li:last-child .input_div {
    margin-bottom: 10px!important;
}
input.input-control.otp_input {
    width: 90%!important;
}
.extra-space {
    padding-left: 60px;
    padding-right: 60px;
}
}
[type="radio"]:checked + label, [type="radio"]:not(:checked) + label{
    font-size: 16px;
}
[type="radio"]:checked + label {
    color: #fdd13a;
}
@media  only screen and (max-width:414px) { .radio_section label { font-size: 11px;}}

@media  only screen and (max-width:360px) { 
#mobile_number-error {
    font-size: 12px;
    width: calc(100% + 60px);
    left: 0px;
    padding: 10px 0px 0px 5px;
}
.cd-popup-trigger {
  padding-left:30px;
  padding-right:30px;
}
input.otp_input::placeholder {
    font-size: 13px;
}
[type="radio"]:checked + label, [type="radio"]:not(:checked) + label{font-size:11px;}
.radio_section label {font-size: 10px;  text-align: left; font-weight: 200; padding-left: 0px; } 

}
[type="radio"]:checked + label, [type="radio"]:not(:checked) + label{
    padding-left: 43px;
    line-height: 30px;
}
.extra-space {
    padding-left: 60px;
    padding-right: 60px;
}
.sub-text-top { padding: 0px 20px 0px 20px !important; }
#plans ul {
    width: 100%;
    float: left;
    margin: 15px auto 0px;
    text-align: center;
}

.radio_section p {
    float: left;
    width: 100%;
    /* display: inline-block; */
    /* padding: 0 33px; */
    margin-bottom: 8px;
}
.radio_section ul li {
    display: inline-block;
}
.radio_section ul {
    width: 100%;
    margin: 0 auto;
    float: left;
    text-align: center;
}

.radio_section {
    text-align: center;
    width: 100%;
    /* float: left; */
}

select#aioConceptName{background:transparent!important}
/*form#dtsubscription input.otp_input {
    padding: 21px 0 10px 71px;!important;
}*/
[type="radio"]:checked + label:after, [type="radio"]:not(:checked) + label:after {
    background: #fdd13a;
    width: 14px;
    height: 14px;
    top: 8px;
    left: 8px;
}
[type="radio"]:checked + label:before, [type="radio"]:not(:checked) + label:before {
    border: 2px solid #fff;
    background: transparent;
}
input.subscribe.cd-popup-trigger {
    border: 1px solid transparent;
    color: #f26b21;
    cursor: pointer;
    font-size: 14px;
    text-align: center;
    padding: 8px 12px;
    background: #f7ec13;
    transition: 0.3s;
}
input.subscribe.cd-popup-trigger:hover {
    color: #f7ec13;
    background: #f26b21;
    border: 1px solid #f7ec13;
}

form#dtsubscription {
    margin-top: 0px;
    width: 100%;
    height: auto;
    float: left;    
}
.btn-grouping {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}


form#dtsubscription input.otp_input::Placeholder {
    color: #a5a5a5;
}
form#dtsubscription input.subscription::Placeholder {
    color: #fff;
}
select#aioConceptName {
    color: #000;
    height: 50px;
    margin: 0px;
    padding: 0px 18px;
    line-height: 50px;
}
select#aioConceptName option {
    color: #000;
    font-size: 18px;
    height: 50px;
    margin: 0px;
    padding: 0px 17px;
}
.thanks ul .input_div span{
    color: #000000;
    font-size: 17px;
    height: 100%;
    line-height: 30px;
    padding: 0px 17px;
    top: 2px;
    /*border-right: 1px solid rgba(0,0,0,0.2);*/
}
form#dtotp input.otp_input::Placeholder {
    color: #a5a5a5;
}
.text-grey{
    color: #818a89 !important;
    padding-top: 10px;
}
#plan-amt-error{
    color: red;
}
p.web-para {
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 2.06;
    letter-spacing: normal;
    text-align: center;
    color: #edcc3d;
    border: 1px dashed #edcc3d;
    clear: both;
    width: auto;
    display:none!important;
}
form#dtsubscription .input_div {
    background: #fff;
    height: 50px;
    border-radius: 5px;
    max-width: 90%;
    width: 47%;
    position: relative;
    margin: 0 auto;
}

form#dtsubscription .input_div .otp_input {
    margin-left: 15px;
    font-family: Comic Sans MS;
    font-weight: bold;
}
form#dtsubscription .input_div .otp_input::placeholder {
    font-family: Hey-Comic  ;
    font-weight: unset;
}
form#dtsubscription .input_div img.arrow-down {
    position: absolute;
    width: 15px;
    height: 9px;
    top: 20px;
    right: 20px;
}
input{
    font-family: Hey-Comic;
}

form#dtsubscription .input_div input, form#dtsubscription .input_div select {
    border: none;
    font-family: Hey-Comic;
}   
.thanks ul li div#plan-amt {
    float: right;
} 
@media screen and (min-width: 1500px) {
    header.logo{ padding: 30px 0;}
    .thanks p{font-size: 22px;}
    .end-content h3{font-size: 22px;}
    .end-content ul li{font-size: 18px;}
    [type="radio"]:checked + label, [type="radio"]:not(:checked) + label{font-size: 21px}
    p.sub_p{font-size: 18px;}
}
@media  only screen and ( max-width:740px ) {
    [type="radio"]:checked + label:after, [type="radio"]:not(:checked) + label:after{ width: 8px;height: 8px;top: 6px;left: 4px;}
    .container {padding-left:10px;padding-right: 10px; }
    form#dtsubscription .input_div{width:100%;max-width: 100%;}
    [type="radio"]:checked + label, [type="radio"]:not(:checked) + label{
        padding-left: 23px;
        line-height: 18px;
        font-size: 14px;
    }
    #plans li{    margin: 0px 10px;}
    #plans li p{margin-bottom: 5px;}
    .footer_text {margin-top: 5px;}
    .end-content{
        padding: 0px 10px;
        width: 100%;
        margin-top:10px;
        padding-bottom: 40px;
    }
    .end-content h3{text-align: left;line-height: 27px}
    .end-content h3:before{width:100%;}
    p.sub_p{    font-size: 13px;    line-height: 17px;    padding: 8px 8px;}
    .end-content ul li {
        width: calc(100% - 35px);
        padding: 0px 0px 0px 25px;
    }
    .thanks ul .input_div span{font-size: 14px;padding: 0px 10px;}
    select#aioConceptName{font-size: 14px;}
    .thanks ul li div#plan-amt{height:38px;}
    .thanks ul .input_div span{top:0px;}
    #mobile_number-error{top:30px;}
    select#aioConceptName{height:38px;line-height: 38px;font-size: 14px;padding:0px 10px;}
    form#dtsubscription .input_div{height:38px;}
    select#aioConceptName option{font-size: 14px;}
    form#dtsubscription .input_div img.arrow-down {
    position: absolute;
    width: 10px;
    height: 6px;
    top: 17px;
    right: 13px;}
    .thanks{padding-top: 0px}
   .header-logo.logo img{width:108px;} 
   .language.uae-logo span{font-size: 14px;}
   p.dt-error-messgae{margin-bottom: 10px;height:25px;    line-height: 30px}
   [type="radio"]:checked + label:before, [type="radio"]:not(:checked) + label:before{
    border: 1px solid #fff;    width: 14px; height: 14px;
   }
   .radio_section p{padding: 0px 10px;margin-bottom: 10px;}
   form#dtotp input.input-control.otp_input{    width: calc(100% - 20px)!important;
    margin: 10px;}
    form#dtotp .etisalad-js {
    margin-top: 30px;
}
form#dtotp {
    position: relative;
}
input#otp-input {
    height: 38px;
}
label#otp-input-error {
    top: 40px;
}
input.otp_input::placeholder {
    font-size: 17px;
}
input.otp_input::placeholder {
    font-size: 13px;
}
}
@media  only screen and ( min-width:768px ) and ( max-width:1024px ){
    form#dtsubscription .input_div{ max-width: 100%;width: 80%;}
    .end-content {width: 100%;padding-left: 10px;margin: 20px auto; float: left;}
    .search-result-wrap .uk-width-1-4.eventtracker {width: 33.33%;}
    .end-content ul li {
        width: 93%;
    }
}
@media (max-width: 600px){
    .dtlogo {
        padding-bottom: 10px;
    }
    form#dtsubscription .input_div input, form#dtsubscription .input_div select {
        height: 38px;
        font-size: 16px;
    }
    .select2-container--default .select2-selection--single .select2-selection__arrow b {
        left: 66px;
    }
    .end-content ul li {
        font-size: 12px;
    }
}