@charset "utf-8";
/* CSS Document */

/******* Fonts Face CSS Start **********/
@font-face {
    font-family: 'Segoe UI Semilight';
    src: url('../fonts/SegoeUI-Semilight.eot');
    src: url('../fonts/SegoeUI-Semilight.eot?#iefix') format('embedded-opentype'),
        url('../fonts/SegoeUI-Semilight.woff2') format('woff2'),
        url('../fonts/SegoeUI-Semilight.woff') format('woff'),
        url('../fonts/SegoeUI-Semilight.ttf') format('truetype'),
        url('../fonts/SegoeUI-Semilight.svg#SegoeUI-Semilight') format('svg');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'Segoe UI';
    src: url('../fonts/SegoeUI.eot');
    src: url('../fonts/SegoeUI.eot?#iefix') format('embedded-opentype'),
        url('../fonts/SegoeUI.woff2') format('woff2'),
        url('../fonts/SegoeUI.woff') format('woff'),
        url('../fonts/SegoeUI.ttf') format('truetype'),
        url('../fonts/SegoeUI.svg#SegoeUI') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Segoe UI Semibold';
    src: url('../fonts/SegoeUI-Semibold.eot');
    src: url('../fonts/SegoeUI-Semibold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/SegoeUI-Semibold.woff2') format('woff2'),
        url('../fonts/SegoeUI-Semibold.woff') format('woff'),
        url('../fonts/SegoeUI-Semibold.ttf') format('truetype'),
        url('../fonts/SegoeUI-Semibold.svg#SegoeUI-Semibold') format('svg');
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: 'Segoe UI Light';
    src: url('../fonts/SegoeUI-Light.eot');
    src: url('../fonts/SegoeUI-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/SegoeUI-Light.woff2') format('woff2'),
        url('../fonts/SegoeUI-Light.woff') format('woff'),
        url('../fonts/SegoeUI-Light.ttf') format('truetype'),
        url('../fonts/SegoeUI-Light.svg#SegoeUI-Light') format('svg');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'Segoe UI Black';
    src: url('../fonts/SegoeUIBlack.eot');
    src: url('../fonts/SegoeUIBlack.eot?#iefix') format('embedded-opentype'),
        url('../fonts/SegoeUIBlack.woff2') format('woff2'),
        url('../fonts/SegoeUIBlack.woff') format('woff'),
        url('../fonts/SegoeUIBlack.ttf') format('truetype'),
        url('../fonts/SegoeUIBlack.svg#SegoeUIBlack') format('svg');
    font-weight: 900;
    font-style: normal;
}
@font-face {
    font-family: 'Segoe UI Bold';
    src: url('../fonts/SegoeUI-Bold.eot');
    src: url('../fonts/SegoeUI-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/SegoeUI-Bold.woff2') format('woff2'),
        url('../fonts/SegoeUI-Bold.woff') format('woff'),
        url('../fonts/SegoeUI-Bold.ttf') format('truetype'),
        url('../fonts/SegoeUI-Bold.svg#SegoeUI-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
}
/********* Fonts Face CSS End **********/
/* -=- variable Declaration -=- */

/******* Common Element CSS Start ******/
*, *:before, *:after        { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
html,
body                        { margin: 0px; padding: 0px; background: rgba(223, 242, 255,0.5); }
img                         { border: 0px; width: 100%; max-width: 100%; }
ul,ol                       { margin: 0px; padding: 0px; list-style: none;}
a                           { text-decoration: none; outline: none;}
textarea                    { resize: none; }
a:hover,a:focus,
a:active,a:visited              { outline: none; text-decoration: none; box-shadow: none !important; -webkit-box-shadow: none !important; }
button:focus,button:focus:active,
.form-control:hover,
.form-control:focus,
.form-control:focus:Active  { outline: none !important; box-shadow: none !important; -webkit-box-shadow: none !important; }
h1,h2,h3,h4,h5,h6,p         { font-family: 'Segoe UI'; }
h1                          { margin: 0px 0px 5px; font-size: 28px; line-height: 32px; font-family: 'Segoe UI Semibold'; text-align: center; }
h2                          { margin: 0px 0px 20px; font-size: 24px; line-height: 28px; font-family: 'Segoe UI Semibold'; text-align: center; }
h3                          { margin: 0px; font-size: 18px; line-height: 24px; color: #000;  font-family: 'Segoe UI Semibold'; }
h4                          { font-size: 17px; line-height: 22px; color: #777777; font-style: italic;  font-family: 'Segoe UI'; text-align: center; }
h5                          { margin: 0px 0px 10px; font-size: 16px; line-height: 20px; color: #000; font-family: 'Segoe UI Semibold'; text-align: center; }
h5                          {  }
h6                          {  }
h4.feedback-form-footer     { margin: 35px 0px 0px 0px; }
p                           { margin: 0px; font-size: 14px; line-height: 18px; color: #000; }
/******* Common Element CSS End *********/
/* -=- Common CSS Start -=- */
.wrapper                    { position: relative; }
.common-space               { margin: 0px auto; max-width: 86%; }
.common-shadow-box          { margin-bottom: 30px; padding: 15px 30px; box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.1); -webkit-box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.1); }
.error-msg                  { margin-top: 5px; font-size: 12px; line-height: 16px; color: #f54c42; font-family: 'Segoe UI'; }
/* -=- Header CSS Start -=- */
header nav                  { padding: 14px 14px 14px 35px; background-color: #fff; display: flex; display: -webkit-flex; justify-content: space-between; align-items: center; box-shadow: 0px 0px 16px 0px rgba(0,0,0,.2); -webkit-box-shadow: 0px 0px 16px 0px rgba(0,0,0,.2); }
.brand-logo > a             { display: block; }
.brand-logo > a img         { max-height: 55px; width: auto; display: inline-block; vertical-align: middle; }
.brand-logo > a span        { margin-left: 10px; font-size: 17px; line-height: 20px; color: #000; font-family: 'Segoe UI bold'; display: inline-block; vertical-align: middle; }
/* -=- Back Button CSS Start -=- */
.back-btn                   { display: flex; display: -webkit-flex; align-items: center; font-size: 16px; line-height: 20px; color: #000; position: absolute; top: 38px; left: 30px; }
.back-btn:hover,
.back-btn:focus             { color: #000; }     
.back-btn img               { margin-right: 5px; max-width: 16px; width: 100%; height: auto; }
/* -=- Main Section CSS Start -=- */
.wrapper                    { margin-top: 0px; padding: 38px 30px; background: #fff; -webkit-box-shadow: 0px 4px 6px -2px rgba(0,0,0,.2); box-shadow: 0px 4px 6px -2px rgba(0,0,0,.2); }
.rating-guide               { display: flex; display: -webkit-flex; justify-content: center; flex-wrap: wrap; }
.rating-guide > li          { padding: 5px 10px; width: auto; border: 1px solid #e8e8e8; flex-shrink: 0; white-space: nowrap; margin-left: 5px; margin-right: 5px; margin-bottom: 10px }
.rating-guide > li > span   { display: block; text-align: center; text-transform: uppercase; font-size: 12px; line-height: 14px; color: #ffbb00; font-family: 'Segoe UI Bold'; }
.rating-guide > li > img    { margin: 3px auto 0px; display: block; max-height: 16px; width: auto; }
.rating-des                 { padding: 20px 0px 30px; } 
/* -=- Fill The Details Section Design Start -=- */
.fill-detail-section                {  }
.common-list-view > li              { margin-bottom: 10px; padding-left: 40px; position: relative; }
.common-list-view > li:before       { content: ""; width: 30px; height: 30px; font-size: 14px; line-height: 28px; border-radius: 50px; border: 1px solid #000; color: #fff; background: #000 url("") no-repeat center center / 20px 20px; position: absolute; top: 0px; left: 0px; }
.common-list-view > li.mobile-icon:before       { background-image: url('../images/mobile-icon.svg'); }
.common-list-view > li.mail-icon:before         { background-image: url("../images/mail-icon.svg"); }
.common-list-view > li.hidden-box               { padding: 0px; }
.common-list-view > li:last-child               { margin-bottom: 0px; }
.hidden-box:before                              { display: none; }
.common-list-view b                             { font-size: 20px; line-height: 24px; font-family: 'Segoe UI Semibold'; display: block; text-align: center; }
.label-txt                                      { margin: 0px; flex-shrink: 0; min-width: 214px; font-size: 14px; line-height: 18px; color: #000; font-family: 'Segoe UI Semilight'; }
.inner-section                                  { display: flex; display: -webkit-flex; align-items: center; }
.inner-section .input-blk                       { flex-grow: 1; }
.form-control                                   { padding: 6px 18px; height: auto; border: none; border-radius: 0px; background: #f1f1f1; font-size: 14px; line-height: 18px; color: #000; font-family: 'Segoe UI light'; }
.form-control:focus                             { background-color: #f1f1f1; }
.form-control::-webkit-input-placeholder        { color: #777; font-style: italic; }
.form-control::-moz-placeholder                 { color: #777; font-style: italic; }
.form-control:-ms-input-placeholder             { color: #777; font-style: italic; }
.form-control:-moz-placeholder                  { color: #777; font-style: italic; }
.common-list-view.num-list > li                 { counter-increment: my-list-count; }
.common-list-view.num-list > li::before         { content: "0" counter(my-list-count); font-family: 'Segoe UI Semibold'; text-align: center; }
.phone-num-blk .iti                             { display: flex; display: -webkit-flex; }
.phone-num-blk .iti__flag-container             { margin-right: 5px; background: #f1f1f1; position: relative; top: auto; left: auto; right: auto; bottom: auto; }
.phone-num-blk .iti__flag-container .iti__selected-flag:focus       { outline: none; }
.phone-num-blk .iti__country-name               { max-width: 230px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: inline-block; }
.phone-num-blk .iti--allow-dropdown input       { padding-left: 18px !important; min-width: 0px; flex-grow: 1; }
.phone-num-blk .iti--separate-dial-code .iti__selected-dial-code        { font-size: 14px; line-height: 18px; color: #000; font-family: 'Segoe UI light'; }
.phone-num-blk .iti__arrow                                              { border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid #555; }
.phone-num-blk .iti__arrow.iti__arrow--up                               { border-top: none; border-bottom: 5px solid #555; }
.num-list > li:not(:last-child)                 { margin-bottom: 15px; }
.num-list .input-blk                            { margin: 10px 10px 0 0; position: relative; display: flex; display: -webkit-flex; }
.hidden-box .label-txt                          { margin-bottom: 0px; }
.num-list > li > textarea                       { margin: 15px 0px 0px 0px; width: calc(100% + 20px); display: none; }
.num-list > li .res-option                      { margin: 15px 0px 0px 0px; width: calc(100% + 20px); display: none; }
/* -=- Rating CSS Start -=- */
.rating-label                                   { font-size: 12px; line-height: 16px;  font-family: 'Segoe UI Semibold'; white-space: nowrap; }
.rating-box                                     { position: relative; display: inline-block; }
.rating-box .radio-wrap-box                     { padding: 4px 8px; position: relative; display: flex; display: -webkit-flex; align-items: center; }
.poor-rating                                    { right: 100%; }
.excellent-rating                               { left: 100%; }
.jq-ry-container                                { margin: 0px 8px; padding: 2px 4px; }
.range-slide-wrap                               { padding: 16px 14px 6px 14px; background-color: #f1f1f1;}
.radio-wrap-box                                 { display: inline-block; background-color: #f1f1f1; }
/* -=- Textarea Section CSS Start -=- */
.textarea-section                               { margin-bottom: 50px; }
.textarea-section .label-txt                    { margin-bottom: 10px; }
.btn-wrap                                       { text-align: center; }
.btn-wrap .btn                                  { padding: 8px 80px; display: inline-block; border: none; border-radius: 0px; font-size: 20px; line-height: 24px; text-transform: uppercase; font-family: 'Segoe UI Semibold'; background: #8b8b8b; color: #fff; }
.btn-wrap .btn:hover                            { background: #000; color: #fff; }
/* -=- Modal CSS Start -=- */
.thank-modal                                    {  }         
.thank-modal h1                                 { margin: 0px; font-family: 'Segoe UI Bold'; font-size: 38px; line-height: 50px; color: #000; font-style: italic; }         
.thank-modal .modal-body                        { padding: 56px 24px; border-radius: 0px; }
.thank-modal .modal-content                     { border-radius: 0px; border: 0px; }
.thank-modal .modal-dialog                      { max-width: 380px; }
.modal-logo-wrap                                { margin: 18px auto 25px; text-align: center; }
.modal-logo-wrap > span                         { font-size: 14px; line-height: 16px; color: #000; font-family: 'Segoe UI Bold'; display: :inline-block; vertical-align: middle; }
.modal-logo                                     { display: inline-block; vertical-align: middle; max-height: 42px; width: auto; } 
.thank-modal .btn                               { padding: 8px 60px; font-size: 16px; line-height: 20px; }
/* -=- no Ui Slider CSS Start -=- */
.custom-no-ui-slider.noUi-target.noUi-horizontal            { margin-bottom: 30px; width:369px; height: 8px; background: #f1f1f1; font-size:12px; } 
.custom-no-ui-slider .noUi-pips-horizontal                  { padding: 3px 0; height: auto; }
.custom-no-ui-slider.noUi-horizontal .noUi-handle           { right: -12px; cursor: pointer; border-radius: 50%; width: 18px; height: 26px; top: -10px; }
.custom-no-ui-slider .noUi-handle:before,
.custom-no-ui-slider .noUi-handle:after                     { display: none; }
.custom-no-ui-slider.noUi-horizontal .noUi-handle:focus,
.custom-no-ui-slider.noUi-horizontal .noUi-handle:focus:active              { outline: none; }
.custom-no-ui-slider .noUi-marker-horizontal.noUi-marker-large               { height: 10px; }
.custom-no-ui-slider .noUi-value-horizontal                                 { font-size: 14px; line-height: 20px; }

@media only screen and (max-device-width: 700px) {
/*Joseph: 200723*/
html, body { background: rgba(223, 242, 255,0.5);  font-size: 11px;  font-family: 'Roboto'; font-weight: 400; }
.label-txt { margin: 0px; flex-shrink: 0; min-width: 214px; font-size: 12px; line-height: 14px; color: #000; font-family: 'Segoe UI Semilight'; }
/* Mobile Screen: Styles ( Joseph: 060723 ) */
.custom-no-ui-slider.noUi-target.noUi-horizontal { margin-bottom: 15px; width:240px; height: 13px; background: #f1f1f1; font-size:11px; }
.num-list .input-blk { margin: 6px 6px 4px 3px; position: relative; display: flex; display: -webkit-flex; }
.range-slide-wrap { padding: 8px 6px 14px 6px; background-color: #f1f1f1; } 
}

.radio-btn-grp                                                                              {  }
.radio-btn-grp .btn-secondary:focus,
.radio-btn-grp .btn-secondary.focus.active,
.radio-btn-grp .btn-secondary:not(:disabled):not(.disabled).active:focus                    { box-shadow: none !important; -webkit-box-shadow: none !important; }
.custom-no-ui-slider .noUi-marker.noUi-marker-horizontal.noUi-marker-normal                 { display: none !important; }                                                             {  }
.radio-btn-grp .btn-secondary                                                               { color: #000; background-color: rgb(241,241,241); border-color: #6c757d; }
.radio-btn-grp .btn-secondary:not(:disabled):not(.disabled):active,
.radio-btn-grp .btn-secondary:not(:disabled):not(.disabled).active,
.radio-btn-grp .show > .btn-secondary.dropdown-toggle                       { background-color: #333; border-color: #333; }
.emoji-radio-btn .btn.btn-secondary                                         { margin-right: 10px; padding: 0px; background-color: transparent; border: none; box-shadow: 0px 0px 0px 3px rgba(0,0,0, 0); -webkit-box-shadow: 0px 0px 0px 2px rgba(0,0,0, 0); border-radius: 50px; }
.btn-group.emoji-radio-btn > .btn:not(:last-child):not(.dropdown-toggle)    { border-radius: 80px; }
.emoji-radio-btn .btn-secondary:not(:disabled):not(.disabled).active        { background-color: transparent; border: none; }
.emoji-radio-btn .btn img                                                   { max-width: 25px; }
.emoji-radio-btn .btn.btn-secondary:focus,
.emoji-radio-btn .btn.btn-secondary.active.focus                            { background-color: transparent; box-shadow: none; -webkit-box-shadow: none; }
.emoji-radio-btn .btn.btn-secondary.active,
.emoji-radio-btn .btn.btn-secondary.active.focus,
.emoji-radio-btn .btn.btn-secondary:hover                                   { box-shadow: 0px 0px 0px 3px rgba(255, 195, 16, 1); -webkit-box-shadow: 0px 0px 0px 3px rgba(255, 195, 16, 1); }
.emoji-radio-btn .btn.btn-secondary.angry-emoji.active,
.emoji-radio-btn .btn.btn-secondary.angry-emoji.active.focus,
.emoji-radio-btn .btn.btn-secondary.angry-emoji:hover                       { box-shadow: 0px 0px 0px 3px rgba(255 , 0, 0, 0.4); }

/* -=- category Page CSS Start -=- */
.category-wrapper                                               {  }
.category-wrapper h1                                            { margin-bottom: 30px; }
.category-wrapper h2                                            { margin-bottom: 40px; }
.cat-spacing > .row > div                                       { margin: 18px 0px; }
.cat-spacing > .row > div > a                                   { padding: 60px 10px; border-bottom: 3px solid #f0181d; text-align: center; display: block; font-size: 20px; line-height: 30px; color: #000; font-family: 'Segoe UI Semibold'; box-shadow: 0px 0px 16px 2px rgba(0,0,0,0.1); -webkit-box-shadow: 0px 0px 16px 2px rgba(0,0,0,0.1); }
.cat-spacing > .row > div > a:hover,
.cat-spacing > .row > div > a:focus                             { background-color: rgba(230,244,255, 0.52) ; box-shadow: 0px 0px 16px 2px rgba(0,0,0,0.1) !important; -webkit-box-shadow: 0px 0px 16px 2px rgba(0,0,0,0.1) !important; }

/* -=====- Responsive CSS Start -=====- */
@media(min-width: 1200px){
    
}
@media(min-width: 992px){
    .wrapper            { margin: 0px auto; padding: 38px 30px; max-width: 992px; }
}
@media(min-width: 768px) and ( max-width: 991px){  
}
@media(max-width: 767px){
    /* -=- Common Element CSS Start -=- */
    h1                          { font-size: 18px; line-height: 24px; }
    h3                          { font-size: 14px; line-height: 24px; }
    /* -=- Common CSS Start -=- */
    .wrapper                    { padding: 25px 15px; }
    .common-space               { max-width: 100%; }
    .common-shadow-box          { padding: 15px 18px; }
    .inner-section              { display: block; }
    .label-txt                  { margin-bottom: 12px; }
    /* -=- Header CSS Start -=- */
    header nav                                  { padding-left: 14px; }
    .brand-logo > a > span                      { font-size: 12px; line-height: 16px; }
    .brand-logo > a img                         { max-height: 38px; }
    /* -=- Main Area Design CSS Start -=- */
    .common-list-view > li.hidden-box                                       { margin: 6px 0px; }
    .num-list .input-blk                                                    { margin-top: 0px; }
    /* -=- modal CSS Start -=- */
    .thank-modal.modal.show .modal-dialog          { margin: 0px auto; }
}
@media(max-width: 575px){
    /* -=- Common Element CSS Start -=- */
    h2                                              { margin: 0px 0px 16px; font-size: 20px; line-height: 24px; }
    h4                                              { font-size: 14px; line-height: 18px; }
    .btm-wrap .btn                                  { font-size: 12px; line-height: 20px; padding: 6px 60px; }
    .common-shadow-box                              { margin-bottom: 20px; }
    /* -=- Header CSS Start -=- */
    header nav                                      { padding: 8px 15px; display: block; }
    header nav .dept-detail                         { margin-top: 10px; text-align: center; }
    .brand-logo > a                                 { text-align: center; }
    /* -=- Rating Guide CSS Start -=- */
    .textarea-section                               { margin-bottom: 30px; }
    .phone-num-blk .iti--separate-dial-code .iti__selected-dial-code    { font-size: 12px; }
    .phone-num-blk .iti--allow-dropdown input,
    .form-control                                                       { padding: 5px 10px !important; }
    .btn-wrap .btn                                  { padding: 6px 60px; font-size: 16px; line-height: 20px; }
    /* -=- Modal CSS Start -=- */
    .thank-modal.modal.show .modal-dialog           { padding: 0px 10px; }
    .thank-modal .modal-body                        { padding: 40px 24px; }
    .thank-modal h1                                 { font-size: 24px; line-height: 32px; }
    .thank-modal .modal-logo-wrap                   { margin: 15px auto 20px; }
    .thank-modal .modal-logo-wrap > span            { font-size: 12px; line-height: 18px; }
    .thank-modal .modal-logo                        { max-height: 34px; }
    .thank-modal .btn                               { padding: 6px 40px; font-size: 14px; line-height: 18px;  }
}
/*================= Responsive CSS End =========================*/
.kenya-prefix-0 {
  background-color: #f1f1f1;
  display: inline-block;
  padding-left: 7px;
  color: #696969;
  line-height: 1.8;
}
.phone-num-blk .iti--allow-dropdown input.kenya {
  padding-left: 5px !important;
}