/* CSS Document */
/***** Fonts CSS *****/
@font-face { font-family: 'Boston Thin'; font-style: normal; font-weight: normal; src: local('Boston Thin'), url('../fonts/fonts/BostonThin.woff') format('woff'); }
@font-face { font-family: 'Boston ExtraLight'; font-style: normal; font-weight: normal; src: local('Boston ExtraLight'), url('../fonts/fonts/BostonExtraLight.woff') format('woff'); }
@font-face { font-family: 'Boston Light'; font-style: normal; font-weight: normal; src: local('Boston Light'), url('../fonts/fonts/BostonLight.woff') format('woff'); }
@font-face { font-family: 'Boston Regular'; font-style: normal; font-weight: normal; src: local('Boston Regular'), url('../fonts/fonts/BostonRegular.woff') format('woff'); }
@font-face { font-family: 'Boston SemiBold'; font-style: normal; font-weight: normal; src: local('Boston SemiBold'), url('../fonts/fonts/BostonSemiBold.woff') format('woff'); }
@font-face { font-family: 'Boston Bold'; font-style: normal; font-weight: normal; src: local('Boston Bold'), url('../fonts/fonts/BostonBold.woff') format('woff'); }
@font-face { font-family: 'Boston Black'; font-style: normal; font-weight: normal; src: local('Boston Black'), url('../fonts/fonts/BostonBlack.woff') format('woff'); }
@font-face { font-family: 'Boston Heavy'; font-style: normal; font-weight: normal; src: local('Boston Heavy'), url('../fonts/fonts/BostonHeavy.woff') format('woff'); }
/***** Caros Fonts *****/
@font-face { font-family: 'CarosLight'; src: url('../fonts/fonts/Caros/CarosLight.eot?#iefix') format('embedded-opentype'), url('../fonts/fonts/Caros/CarosLight.otf') format('opentype'), url('../fonts/fonts/Caros/CarosLight.woff') format('woff'), url('../fonts/fonts/Caros/CarosLight.ttf') format('truetype'), url('../fonts/fonts/Caros/CarosLight.svg#CarosLight') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'Caros'; src: url('../fonts/fonts/fonts/Caros/Caros.eot?#iefix') format('embedded-opentype'), url('../fonts/fonts/Caros/Caros.otf') format('opentype'), url('../fonts/fonts/Caros/Caros.woff') format('woff'), url('../fonts/fonts/Caros/Caros.ttf') format('truetype'), url('../fonts/fonts/Caros/Caros.svg#Caros') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'CarosLight'; src: url('../fonts/fonts/Caros/CarosLight.eot?#iefix') format('embedded-opentype'), url('../fonts/fonts/Caros/CarosLight.otf') format('opentype'), url('../fonts/fonts/Caros/CarosLight.woff') format('woff'), url('../fonts/fonts/Caros/CarosLight.ttf') format('truetype'), url('../fonts/fonts/Caros/CarosLight.svg#CarosLight') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'CarosMedium'; src: url('../fonts/fonts/Caros/CarosMedium.eot?#iefix') format('embedded-opentype'), url('../fonts/fonts/Caros/CarosMedium.otf') format('opentype'), url('../fonts/fonts/Caros/CarosMedium.woff') format('woff'), url('../fonts/fonts/Caros/CarosMedium.ttf') format('truetype'), url('../fonts/fonts/Caros/CarosMedium.svg#CarosMedium') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'CarosBold'; src: url('../fonts/fonts/Caros/CarosBold.eot?#iefix') format('embedded-opentype'), url('../fonts/fonts/Caros/CarosBold.otf') format('opentype'), url('../fonts/fonts/Caros/CarosBold.woff') format('woff'), url('../fonts/fonts/Caros/CarosBold.ttf') format('truetype'), url('../fonts/fonts/Caros/CarosBold.svg#CarosBold') format('svg'); font-weight: normal; font-style: normal; }
/***** Common CSS *****/
body { background: #fff; font-family: 'Caros'; font-size: 15px; overflow-x: hidden; color: #7e7e7e; margin: 0 auto !important; }
a, a:focus, a:hover { color: #004a98; text-decoration: none; }
a, a:focus, a:hover, a:active, a.active:hover, a.active:focus, select, option, select:focus, button, button:focus { outline: none; }
.aligncenter { margin: 0 auto; display: inline-block; }
.transition { transition: all .8s ease; -webkit-transition: all .8s ease; -ms-transition: all .8s ease; -o-transition: all .8s ease; -moz-transition: all .8s ease; }
.no-padding { padding-left: 0; padding-right: 0; }
.no-left-pad { padding-left: 0; }
.no-right-pad { padding-right: 0; }
.less-pad { padding-left: 5px; padding-right: 5px; }
a, abbr, .d-inline { display: inline-block; }
.d-block { display: block; }
.list { list-style: none; padding: 0; margin: 0; line-height: normal; margin-bottom: 20px; }
.list li { position: relative; padding: 3px 5px 3px 20px; }
.list li:before { content: '\f101'; color: #f5a81c; position: absolute; left: 0; top: 4px; font-size: 20px; vertical-align: middle; font-family: 'Fontawesome'; }
.order-list { counter-reset: item; list-style-type: none; margin: 0; padding: 0 }
.order-list li { counter-increment: item; display: table; margin-bottom: 10px }
.order-list li a { color: #f5a81c; text-decoration: none; }
.order-list li a:hover { text-decoration: underline; }
.order-list li:before { color: #004a98; content: counters(item, ".", decimal) "."; display: table-cell; font-size: 16px; padding-right: 5px; }
.order-list li li { margin: 5px 0 }
.order-list li li:before { color: #004a98; content: counters(item, ".", decimal) "."; font-size: 15px; }
.order-list p { margin-bottom: 10px }
.no-margin { margin: 0 !important; }
.row-flex { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; align-items: center; }
.row-eq-height { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; }
.relative { position: relative; }
.no-display { display: none; }
/***** Common Spacing CSS *****/
.padding10x { padding: 10px; }
.padding20x { padding: 20px; }
.padding1x { padding-top: 10px; padding-bottom: 10px; }
.padding2x { padding-top: 20px; padding-bottom: 20px; }
.padding3x { padding-top: 30px; padding-bottom: 30px; }
.padding4x { padding-top: 40px; padding-bottom: 40px; }
.padding5x { padding-top: 50px; padding-bottom: 50px; }
.padding6x { padding-top: 60px; padding-bottom: 60px; }
.paddingtop1x { padding-top: 10px; }
.paddingtop2x { padding-top: 20px; }
.paddingtop3x { padding-top: 30px; }
.paddingtop4x { padding-top: 40px; }
.paddingtop5x { padding-top: 50px; }
.paddingtop6x { padding-top: 60px; }
.paddingtop7x { padding-top: 70px; }
.paddingtop8x { padding-top: 80px; }
.paddingbottom1x { padding-bottom: 10px; }
.paddingbottom2x { padding-bottom: 20px; }
.paddingbottom3x { padding-bottom: 30px; }
.paddingbottom4x { padding-bottom: 40px; }
.paddingbottom5x { padding-bottom: 50px; }
.paddingbottom6x { padding-bottom: 60px; }
.paddingbottom7x { padding-bottom: 70px; }
.paddingbottom8x { padding-bottom: 80px; }
.spacetop-xs { margin-top: 5px; }
.spacetop1x { margin-top: 10px; }
.spacetop2x { margin-top: 20px; }
.spacetop3x { margin-top: 30px; }
.spacetop4x { margin-top: 40px; }
.spacetop5x { margin-top: 50px; }
.spacetop6x { margin-top: 60px; }
.spacetop7x { margin-top: 70px; }
.spacetop8x { margin-top: 80px; }
.spacebottom1x { margin-bottom: 10px; }
.spacebottom2x { margin-bottom: 20px; }
.spacebottom3x { margin-bottom: 30px; }
.spacebottom4x { margin-bottom: 40px; }
.spacebottom5x { margin-bottom: 50px; }
.spacebottom6x { margin-bottom: 60px; }
/***** Common Heading CSS Style *****/
.lg-heading, .medium-heading, .small-heading, .xs-heading { position: relative; }
.lg-heading, .page-heading, .medium-heading, .small-heading, .xs-heading { font-family: 'CarosBold'; font-size: 26px; color: #f5a81c; margin-top: 0; margin-bottom: 8px; text-transform: uppercase; line-height: 22px; }
.page-heading { font-size: 26px; color: #004a98; margin-bottom: 20px; }
.medium-heading { font-family: 'CarosMedium'; font-size: 22px; margin-top: 0; margin-bottom: 10px; line-height: 20px; }
.small-heading { font-family: 'CarosMedium'; font-size: 20px; margin-top: 10px; margin-bottom: 10px; line-height: 18px; }
.xs-heading { font-family: 'Caros'; font-size: 16px; color: #f5a81c; margin-top: 0; margin-bottom: 12px; line-height: 12px; }
.bold { font-family: 'CarosBold'; }
.sm-text { font-size: 12px; }
.lg-text { font-size: 18px; }
/***** Header CSS*****/
.omantel-logo img { float: right; }
/***** Navigation CSS*****/
.main-header { background: #fff; padding: 5px 0; width: 100%; position: sticky; position: -webkit-sticky; top: 0; box-shadow: 0px 0px 6px 4px rgba(210, 210, 210, 0.4); z-index: 3; }
.main-menu .navbar-collapse, .language-dropdown .navbar-collapse { padding-right: 0; padding-left: 0; }
.main-menu { position: relative; padding: 0; }
.main-menu .navbar-default { background-image: none; box-shadow: none; background-color: transparent; border-color: transparent; padding: 0; margin-bottom: 0; min-height: auto; }
.main-menu .navbar { position: relative; min-height: auto; margin-bottom: 0px; border: 0 solid transparent; float: right; }
.main-menu .navbar-collapse { padding: 0 }
.main-menu .navbar-default .navbar-nav li { transition: all .5s ease; -webkit-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; -moz-transition: all .5s ease; }
.main-menu .navbar-default .navbar-nav > li.active, .main-menu .navbar-default .navbar-nav > li:hover, .main-menu .navbar-default .navbar-nav > li:focus, .main-menu .navbar-default .navbar-nav > li.current-menu-parent { color: #f5a81c; }
.main-menu .navbar-default .navbar-nav li.current-menu-parent > a { color: #f5a81c; }
.main-menu .nav li a { position: relative; display: flex; align-items: center; justify-content: center; min-height: auto; padding: 10px 20px; font-size: 14px; text-shadow: none; transition: all .5s ease; -webkit-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; -moz-transition: all .5s ease; }
.main-menu .navbar-default .navbar-nav li a { color: #777; }
.main-menu .navbar-default .navbar-nav li a:focus, .main-menu .navbar-default .navbar-nav li a:hover { color: #f5a81c; background: transparent; outline: 0; outline-offset: 0; text-shadow: none; }
.main-menu .navbar-default .navbar-nav .active a, .main-menu .navbar-default .navbar-nav .active a:focus, .main-menu .navbar-default .navbar-nav .active a:hover { color: #f5a81c; background: transparent; }
.main-menu ul.sub-menu { background: #fff; border-radius: 0; top: 90px; border: none; min-width: 180px; text-align: left; margin: 0; padding: 0; box-shadow: none; box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); }
.main-menu ul.sub-menu li a { color: #000; font-size: 13px; min-height: auto; padding: 8px 10px 8px 16px; border-bottom: 1px solid #dedede; justify-content: inherit; text-transform: inherit; }
.main-menu ul.sub-menu li:last-child a { border-bottom: none; }
.main-menu ul.sub-menu li.active a, .main-menu ul.sub-menu li:hover a, .main-menu ul.sub-menu li a:hover, .main-menu ul.sub-menu li a:focus { color: #fff; background: #28b3b8; padding: 8px 10px 8px 20px; }
.main-menu .nav li a .caret { display: none; }
.main-menu ul.sub-menu ul.sub-menu { left: 100%; top: 0; }
.main-menu ul.sub-menu ul.sub-menu li a { background: #fff; color: #000; }
.main-menu ul.sub-menu ul.sub-menu li a:hover, .main-menu ul.sub-menu ul.sub-menu li a:focus { background: #f5a81c; color: #fff; }
.main-menu .navbar-default .navbar-nav li:last-child ul.sub-menu { left: auto; right: 0; }
/***** Language Switcher*****/
.username { padding: 0 6px; }
.language-dropdown>ul { position: relative; padding: 0; margin: 0; text-align: center; list-style-type: none; }
.language-dropdown>ul li a { color: #777; }
.language-dropdown>ul li .clip-world { color: #f5a81c; }
.language-dropdown .lang-submenu { background: #fff; border: 1px solid #b9b9b9; position: absolute; top: 100%; right: 0; left: 0; padding: 5px 9px; margin: 0; list-style-type: none; text-align: left; -webkit-box-shadow: 0px 0px 5px 0px rgba(207,207,207,1); -moz-box-shadow: 0px 0px 5px 0px rgba(207,207,207,1); box-shadow: 0px 0px 5px 0px rgba(207,207,207,1); visibility: hidden; z-index: 101; }
.language-dropdown .lang-submenu li a { display: block; color: #777; font-size: 14px; min-height: auto; padding: 8px 0; border-bottom: 1px solid #dedede; justify-content: inherit; text-transform: inherit; transition: all .5s ease; -webkit-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; -moz-transition: all .5s ease; }
.language-dropdown .lang-submenu li:last-child a { border-bottom: none; }
.language-dropdown .lang-submenu li a:hover, .language-dropdown .lang-submenu li a:focus { color: #f5a81c; padding: 8px 0 8px 8px; }
.language-dropdown .lang-submenu li a img { display: inline-block; padding-right: 5px; }
.language-dropdown ul li.dropdown:hover .lang-submenu, .language-dropdown ul li.dropdown:focus .lang-submenu { visibility: visible; }
/***** Form CSS *****/
.form-group { position: relative; margin-bottom: 18px; }
.form-group label { font-size: 14px; position: relative; display: block; width: 100%; font-weight: normal; font-family: 'CarosMedium'; color: #7c7c7c; margin-bottom: 5px; }
.form-control, .form-control:focus, textarea.form-control { background: transparent; border-width: 1px; border-color: #bbbbbb; border-style: solid; border-radius: 6px; color: #444444; height: 36px; position: relative; float: none !important; font-size: 14px; padding: 6px 10px; box-shadow: none !important; }
.form-control.country-code { text-align: center; border-width: 1px !important; }
.form-control.full-border { border-width: 1px !important; }
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control { background-color: transparent; color: #848484 !important; }
textarea.form-control, textarea.form-control:focus { height: 80px; }
.form-group .input-group-addon { padding: 9px 12px; font-size: 16px; line-height: 1; color: #bbbbbb; text-align: center; background-color: transparent; border-radius: 6px 0 0 6px; border-width: 1px 0 1px 1px; border-color: #bbbbbb; border-style: solid; height: 36px; }
.form-group .input-group { align-items: center; }
.pswrd-eye { background: none; position: absolute; top: 9px; right: 9px; color: #004a98; padding: 0; border: none; font-size: 12px; cursor: pointer; z-index: 2; }
.pswrd-eye i { font-size: 15px; padding-right: 2px; }
.form-error { position: absolute; margin: 0; font-size: 11px; bottom: -16px; left: 0; color: #de0400 !important; width: 100%; text-align: right; }
.form-error.ontop { top: -15px; bottom: 0; }
.success-msg { background: #e5ffe9; padding: 0; margin: 0 0 15px; position: relative; text-align: center; border: 1px solid #75c582; color: #75c582; border-radius: 6px; }
.msg-header { position: relative; }
.msg-header .small-heading { color: #3a7543; padding-top: 12px; }
.close-btn { margin-top: 0px; position: absolute; z-index: 1; right: -10px; top: -12px; text-shadow: none; background: #75c582; color: #fff; opacity: 1; line-height: 0; padding: 12px 7px; border-radius: 20px; font-size: 18px; border: none; }
.msg-body { padding: 8px 20px; }
.success-msg .msg-body { padding: 8px 6px; }
.success-msg.error-msg { background: #ffd7d7; border: 1px solid #ce0000; color: #ce0000; }
.error-msg .msg-header .small-heading { color: #ce0000; font-size: 20px; }
.error-msg .close-btn { background: #ce0000; }
.captcha-box { text-align: center; }
.alert-text { color: #ce0000 !important; }
.forgot-pass-alert { position: absolute; width: 100%; top: 0; left: 0; }
.success-text { color: #75c582 !important; }
/***** Placeholder ******/
.form-control::placeholder {
 color: #898989;
 opacity: 1;
}
.form-control:-ms-input-placeholder {
 color: #898989;
}
.form-control::-ms-input-placeholder {
 color: #898989;
}
/***** Checbox CSS Style ******/
/*** Custom checkbox ***/
.custom-control label { font-family: 'Caros'; font-size: 14px; margin-bottom: 12px; }
.custom-control-input:checked ~ .custom-control-label::before { border-color: #004a98; background-color: #004a98; }
.custom-control-label::before { border: #7b7b7b solid 1px; }
/******/
.checkbox { margin-bottom: 8px !important; }
.form-group .checkbox label { font-size: 14px; padding-left: 0; }
.checkbox label:after { content: ''; display: table; clear: both; }
.checkbox .cr { position: relative; color: #004a98; display: inline-block; border: 1px solid #bbbbbb; border-radius: 2px; width: 1em; height: 1em; float: left; margin-right: 8px; margin-top: 2px; }
.checkbox .cr .cr-icon { position: absolute; font-size: 12px; line-height: 0; top: 50%; left: 2%; }
.checkbox .acceptance { padding-left: 0; color: #fff; float: left; display: inline-block; width: 93%; }
/*.checkbox label input[type="checkbox"] { display: none; }*/
.checkbox label input[type="checkbox"] { opacity: 0; }
.checkbox label input[type="checkbox"] + .cr > .cr-icon { transform: scale(3) rotateZ(-20deg); opacity: 0; transition: all .3s ease-in; }
.checkbox label input[type="checkbox"]:checked + .cr > .cr-icon { transform: scale(1) rotateZ(0deg); opacity: 1; }
.checkbox label input[type="checkbox"]:disabled + .cr { opacity: .5; }
/***** Checbox div *****/
/*<div class="form-group">
  <div class="checkbox">
    <label>
      <input type="checkbox" value="">
      <span class="cr"><i class="cr-icon fa fa-check"></i></span>
      <span class="acceptance">Text here</span>
      </label>
  </div>
</div>*/
/***** Radio Box ******/
.form-group .radio-btns { font-size: 13px; display: block; position: relative; padding-left: 26px; margin-bottom: 12px; font-family: 'CarosLight'; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; line-height: 16px; }
.radio-btns input { position: absolute; opacity: 0; cursor: pointer; }
.checkmark { position: absolute; top: 3px; left: 0; height: 16px; width: 16px; border-color: #9a9a9a; border-width: 1px; border-style: solid; border-radius: 50%; }
.radio-btns:hover input ~ .checkmark { background-color: #ccc; }
.radio-btns input:checked ~ .checkmark { background-color: #004a98; border-color: #004a98; }
.checkmark:after { content: ""; position: absolute; display: none; }
.radio-btns input:checked ~ .checkmark:after { display: block; }
.radio-btns .checkmark:after { top: 4px; left: 4px; width: 6px; height: 6px; border-radius: 50%; background: white; }
/***** Radio div *****/
/*<div class="form-group">
  <div class="form-check">
    <label class="radio-btns">Text Here
      <input type="radio" checked="checked" name="radio">
      <span class="checkmark"></span> </label>
  </div>
</div>*/
/***** Modal CSS Style *****/
.modal-open .modal.common-modal, .modal-open .modal, .modal-open .common-modal { padding-right: 0 !important; }
.modal-backdrop, .common-modal { background: rgba(0,0,0,0.7); text-align: center; overflow-y: scroll; }
.common-modal:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; }
.common-modal .modal-dialog { width: 92%; margin: 30px auto; max-width: 700px; display: inline-block; vertical-align: middle; }
.common-modal .modal-content { border-radius: 6px; box-shadow: none; border: none; }
.common-modal .modal-header { padding: 20px 10px 0; border-bottom: none; position: relative; min-height: auto; }
.common-modal .close { margin-top: 0px; position: absolute; z-index: 1; right: -12px; top: -12px; text-shadow: none; background: #f5a81c; color: #fff; opacity: 1; line-height: 0; padding: 12px 6px; border-radius: 20px; }
.common-modal .modal-body { padding: 20px; color: #000; }
.common-modal .modal-body p { margin: 0 0 15px; font-size: 14px; }
.common-modal .message-box { margin-bottom: 0; }
.common-modal .message-box .msg-icon { font-size: 80px; }
.common-modal .modal-footer { background: #fff; text-align: center; border: none; padding: 0 0 15px; margin-top: -15px; }
.pop-close-btn { background: #f2a900; font-size: 16px; padding: 8px 28px; color: #fff !important; border-radius: 4px; border: none; outline: none; position: relative; text-transform: uppercase; transition: all 0.8s ease; -webkit-transition: all 0.8s ease; }
.pop-close-btn:hover, .pop-close-btn:focus { background: #004a98; color: #fff; }
.modal-discliamer { background: #3a3a3a; padding: 15px 0; display: flex; align-items: center; color: #a5a5a5; font-size: 13px; border-radius: 0 0 4px 4px; }
.bullet-list { list-style: none; padding: 0; margin: 0; line-height: normal; margin-bottom: 20px; }
.bullet-list li { position: relative; padding: 4px 5px 4px 20px; }
.bullet-list li:before { content: '\f101'; color: #f5a81c; position: absolute; left: 0; top: 3px; font-size: 18px; vertical-align: middle; font-family: 'Fontawesome'; }
/***** Before Login Pages *****/
.heading-wrap { background: #004a98; padding: 12px 20px; color: #fff; border-radius: 8px 8px 0 0; }
.body-bg { background-image: url(/assets/images/bg-new.jpg); background-color: #eeeeee; background-repeat: no-repeat; background-position: center; background-size: cover; background-attachment: fixed; }
.login-section { width: 100%; display: table; height: 100%; position: absolute; top: 0; left: 0; padding: 0; margin: 0; }
.login-section .container { padding-top: 0; padding-left: 15px; padding-right: 15px; }
.center-box { padding: 0; margin: 0; display: table-cell; vertical-align: middle; }
.login-box { width: 30%; padding: 0; margin: 0 auto; }
.login-box.register-box { width: 38%; }
.login-body { background: #fff; padding: 0; height: 100%; position: relative; border-radius: 8px; -webkit-box-shadow: 0px 0px 40px 12px rgba(210, 210, 210, 1); -moz-box-shadow: 0px 0px 40px 12px rgba(210, 210, 210, 1); box-shadow: 0px 0px 40px 12px rgba(210, 210, 210, 1); }
.form-wrap { padding: 12px 25px 15px; position: relative; }
.login-section .form-control, .before-login .form-control:focus, .before-login textarea.form-control { border-top-right-radius: 6px !important; border-bottom-right-radius: 6px !important; border-width: 1px 1px 1px 0; }
.useful-link { text-align: center; }
.useful-link a { padding-right: 8px; padding-left: 8px; font-size: 13px; color: #7e7e7e; border-right: 1px solid #7e7e7e; transition: all .8s ease; -webkit-transition: all .8s ease; -ms-transition: all .8s ease; -o-transition: all .8s ease; -moz-transition: all .8s ease; }
.useful-link a:focus, .useful-link a:hover { color: #f5a81c; }
.useful-link a:last-child { padding-right: 0; border-right: none; }
.blue-btn, .yellow-btn { background: #004a98; font-family: 'CarosBold'; font-size: 18px; padding: 6px 35px; color: #fff !important; border-radius: 4px; border: none; outline: none; position: relative; text-transform: uppercase; transition: all 0.8s ease; -webkit-transition: all 0.8s ease; }
.yellow-btn { background: #f2a900; }
.blue-btn:hover, .blue-btn:focus, .yellow-btn:hover, .yellow-btn:focus { background: #f2a900; color: #fff; }
.yellow-btn:hover, .yellow-btn:focus { background: #004a98; }
.info-text { position: relative; font-size: 11px; color: #9d9d9d; line-height: 14px; margin-top: 2px; letter-spacing: 0.3px; }
.blue-text { color: #004a98; }
.black-text { color: #000 !important; }
/***** Login Page *****/
.login-page-wrap .login-box { width: 100%; }
.login-page-wrap .heading-wrap { border-radius: 8px 0 0 0; padding-top: 24px; padding-bottom: 24px; }
.login-page-wrap .login-body { border-radius: 8px 0 0 8px; }
.login-page-wrap .login-frame { padding-left: 0; padding-right: 0; }
.login-page-wrap .login-img-wrap { background-image: url(/assets/images/login-page-img.jpg); background-color: #fff; background-repeat: no-repeat; background-position: center; background-size: cover; padding-left: 0; border-radius: 0 8px 8px 0; }
.login-img-box { padding: 32px 15px 32px 30px; color: #fff; text-align: center; }
.login-page-wrap .login-frame .lg-heading { margin-bottom: 0; }
.login-page-wrap .medium-heading { font-family: 'CarosBold'; font-size: 24px; color: #f2a900; margin-bottom: 20px; line-height: 26px; }
.login-page-wrap .form-wrap { padding-bottom: 22px; }
.login-page-wrap .login-frame .form-group.top { margin-bottom: 34px; }
.login-img-box .yellow-btn:hover, .login-img-box .yellow-btn:focus { background: #fff; color: #f2a900 !important; }
/***** Footer *****/
.login-footer { background: #fff; position: fixed; bottom: 0; font-size: 12px; padding: 5px 15px; width: 100%; box-shadow: 0px 0px 6px 4px rgba(210, 210, 210, 0.4); z-index: 3; }
.powered-by { text-align: right; }
.footer-links { display: inline-block; list-style: none; padding: 0; margin: 0; }
.footer-links li { display: inline-block; padding: 0 10px; border-right: 1px solid #7e7e7e; }
.footer-links li:last-child { border-right: none; }
.footer-links li a { color: #7e7e7e; font-size: 12px; text-decoration: none; }
.footer-links li a:hover, .footer-links li a:focus { color: #f5a81c; }
#chat-widget-container { bottom: 46px !important; }
/***** FAQ *****/
.faq-wrap .panel-group .panel, .faq-wrap .panel-group .panel + .panel { border-radius: 0; box-shadow: none; margin-top: 15px; border-color: #dedede; }
.faq-wrap .panel-group .panel:first-child { margin-top: 0; }
.faq-wrap .panel-heading .panel-title { margin: 0 auto; padding: 0; }
.faq-wrap .panel-group .panel .panel-body { padding: 0 15px 15px; border-top: none; }
.faq-wrap .panel-group .panel .panel-body p { margin: 0 auto; }
.faq-wrap .panel-group .panel .panel-body a { color: #004a98; }
.faq-wrap .panel-default .panel-heading { background: transparent; padding: 10px 15px; border-color: #dedede; border-radius: 0; }
.faq-wrap .panel-heading a.collapsed { color: #494949; }
.faq-wrap .panel-heading a { display: block; line-height: normal; position: relative; text-decoration: none; color: #004a98; font-family: 'CarosMedium'; font-size: 15px; }
.faq-wrap .panel-title > a:before { float: right !important; font-family: FontAwesome; content: "\f102"; font-size: 20px; padding: 0; color: #004a98; }
.faq-wrap .panel-title > a.collapsed:before { float: right !important; content: "\f103"; color: #f2a900; }
/***** Common Table CSS Style *****/
.common-table .table { margin-bottom: 0; border: 1px solid #ddd; }
.common-table .table thead th { background: #ccc; color: #000; font-size: 15px; padding: 12px 12px; border-bottom: none; border-right: 1px solid #f3f3f3; text-transform: capitalize; letter-spacing: 0.5px; }
.common-table .table thead th:last-child { border-right: none; }
.common-table .table thead th, .common-table .table tbody td { vertical-align: middle; }
.common-table .table tbody td { padding: 10px 12px; border-right: 1px solid #ddd; }
.common-table .table tbody td a { color: #004a98; }
.common-table .table tbody td:last-child { border-right: none; }
.common-table.form-table .table tr td:first-child { background: #f1f1f1; width: 80%; font-size: 16px; letter-spacing: 0.5px; }
.common-table.form-table .table tr td:last-child { text-align: center; }
.common-table.form-table .table tr td i { padding-right: 6px; color: #ad0000; }
/***** Outer Page CSS *****/
.main-wrap { background: #fff; padding-top: 20px; padding-bottom: 30px; }
.inner-common-wrap { padding-top: 20px; padding-bottom: 20px; padding-left: 20px; padding-right: 20px; }
.breadcrum-wrap { background: #004a98; padding: 12px 20px; }
.breadcrumb-list { display: inline-block; list-style: none; padding: 0; margin: 0; }
.breadcrumb-list li { display: inline-block; padding: 0 15px; color: #fff; border-right: 1px solid #fff; }
.breadcrumb-list li:first-child { padding-left: 0; }
.breadcrumb-list li.active { font-family: 'CarosMedium'; color: #f5a81c; }
.breadcrumb-list li:last-child { border-right: none; }
.breadcrumb-list li a { color: #fff; font-size: 14px; text-decoration: none; }
.breadcrumb-list li a:hover, .footer-links li a:focus { color: #f5a81c; }
/***** Tariff Page CSS *****/
.note-wrap .success-msg { padding: 8px 15px; margin: 0; font-size: 18px; }
/***** Contact Page CSS *****/
.info-icon-box { padding: 40px 18px 25px; border: 1px solid #ccc; height: 100%; transition: all .8s ease; -webkit-transition: all .8s ease; -ms-transition: all .8s ease; -o-transition: all .8s ease; -moz-transition: all .8s ease; }
.info-icon-box:hover { background: #004a98; }
.info-icon-box .small-heading { color: #000; margin: 0 0 15px; font-family: 'CarosMedium'; letter-spacing: 0; font-size: 20px; text-transform: inherit; }
.info-icon-box .icon { width: 80px; height: 80px; margin: 0 auto 20px; background: #f5a81c; border-radius: 100%; font-size: 40px; color: #fff; display: flex; justify-content: center; align-items: center; transition: all .8s ease; -webkit-transition: all .8s ease; -ms-transition: all .8s ease; -o-transition: all .8s ease; }
.info-icon-box .icon a { color: #7e7e7e; }
.info-icon-box:hover .small-heading { color: #f5a81c; }
.info-icon-box:hover p, .info-icon-box:hover a, .info-icon-box:hover a:hover, .info-icon-box:hover a:focus, .info-icon-box:hover a:visited { color: #fff; }

/***** RESPONSIVE CSS *****/
@media screen and (min-width:1368px) and (max-width:1440px) {
/***** Before Login Pages *****/
.login-box { width: 32%; }
.login-box.register-box { width: 45%; }
}
@media screen and (min-width:1301px) and (max-width:1367px) {
/***** Before Login Pages *****/
.login-box { width: 34%; }
.login-box.register-box { width: 48%; }
}
@media screen and (min-width:1201px) and (max-width:1300px) {
/***** Before Login Pages *****/
.login-box { width: 36%; }
.login-box.register-box { width: 54%; }
}
@media all and (max-width: 1280px) {
.language-switcher { padding: 0; }
}
@media all and (max-width: 1200px) {
/***** Before Login Pages *****/
.login-box { width: 38%; }
.login-box.register-box { width: 60%; }
.login-section.forgot-user-id { margin: 4% 0; }
}
@media all and (max-width: 1024px) {
.login-section.forgot-user-id { margin: 5% 0; }
}
@media screen and (min-width:1024px) and (max-width:1180px) {
/***** Before Login Pages *****/
.login-box { width: 42%; }
.login-box.register-box { width: 60%; }
.login-section.forgot-user-id { margin: 6% 0; }
}
@media screen and (min-width:992px) and (max-width:1023px) {
/***** Before Login Pages *****/
.login-box { width: 44%; }
.login-box.register-box { width: 62%; }
}
@media all and (max-width: 991px) {
/***** Menu CSS ******/
.main-menu ul.sub-menu { right: 0; }
.main-menu .navbar { margin-bottom: 0; }
.navbar-header { float: left; display: inline-block; }
.main-menu .navbar-toggle { display: block; border-color: transparent; border-radius: 0; background: transparent !important; margin: 0; margin-bottom: 0; padding: 0; }
.main-menu .navbar-toggle .icon-bar { background-color: #f5a81c; width: 22px; transition: all .2s }
.main-menu .navbar-toggle .top-bar { transform: rotate(45deg); transform-origin: 10% 10% }
.main-menu .navbar-toggle .middle-bar { opacity: 0 }
.main-menu .navbar-toggle .bottom-bar { transform: rotate(-45deg); transform-origin: 10% 90% }
.main-menu .navbar-toggle.collapsed .top-bar { transform: rotate(0deg); }
.main-menu .navbar-toggle.collapsed .middle-bar { opacity: 1; }
.main-menu .navbar-toggle.collapsed .bottom-bar { transform: rotate(0deg); }
.main-menu .navbar-collapse.collapse { display: none!important; border-color: transparent; }
.main-menu .collapse.in { display: block!important; border-color: transparent }
#navbar-collapse { overflow: scroll!important; border-color: transparent; }
ul.navbar-nav.primary-menu { margin: 0!important; background: #fff; padding: 0; display: block; width: 100%; }
.main-menu .navbar-collapse { float: none; text-align: center; background: #fff; position: absolute; padding: 0; width: 100%; top: 28px; left: auto; right: 0; box-shadow: 0 0 10px #cfcfcf; -webkit-box-shadow: 0 0 10px #cfcfcf; z-index: 1; }
.main-menu .navbar-nav li { float: none; display: block; background: #fff; clear: both; padding: 0; }
.main-menu .navbar-default .navbar-nav > li.active, .main-menu .navbar-default .navbar-nav > li:hover, .main-menu .navbar-default .navbar-nav > li:focus, .main-menu .navbar-default .navbar-nav > li.current-menu-parent { background: #f5a81c; color: #fff; }
.main-menu .navbar-default .navbar-nav li.current-menu-parent > a { background: #f5a81c; color: #fff; }
.main-menu .navbar-default .navbar-nav li a, .top-left-menu .navbar-default .navbar-nav li:first-child a { padding: 10px 15px; width: 100%; margin: 0 auto; min-height: inherit; letter-spacing: 1px; text-align: left; border-bottom: 1px solid #d2d2d2; text-transform: uppercase; font-family: 'CarosMedium'; font-size: 14px; }
.main-menu .nav li a { justify-content: inherit; }
.site-header.shrunk .main-menu .nav > li > a { min-height: auto; }
.main-menu .navbar-nav li .dropdown-menu { display: block!important; position: relative; width: 100%; background: #fff; clear: both; top: 0 !important; padding: 6px 10px 8px; box-shadow: none; border-bottom: 1px solid #d2d2d2; }
.main-menu .navbar-nav li .dropdown-menu li a { font-size: 13px; color: #000; padding: 6px 15px; width: 100%; margin: 0 auto; border-bottom: 1px solid #cfcfcf; letter-spacing: 1px; text-transform: capitalize; }
.main-menu .navbar-nav li .dropdown-menu li:last-child a { border-bottom: none; }
.main-menu .dropdown-menu .active a, .top-left-menu .dropdown-menu .active a:focus, .top-left-menu .dropdown-menu .active a:hover { background: #cfcfcf; color: #000!important; }
.main-menu .navbar-collapse { width: 240px; max-height: 447px!important; }
.main-menu .navbar-collapse .navbar-nav { float: none; margin: 0; }
.main-menu .navbar-default .navbar-nav .active a, .main-menu .navbar-default .navbar-nav .active a:focus, .main-menu .navbar-default .navbar-nav .active a:hover, .main-menu .navbar-default .navbar-nav li a:focus, .main-menu .navbar-default .navbar-nav li a:hover { color: #fff; }
.main-menu ul.sub-menu li { background: transparent; border: none; padding: 0; border-top: none !important; }
.main-menu .nav li a.dropdown-toggle:after { position: absolute; right: 14px; top: 5px; color: #fff; font-size: 15px; }
.main-menu .navbar-default .navbar-nav .active .sub-menu li a { color: #000; }
.main-menu ul.sub-menu ul.sub-menu { left: 0%; top: 0; padding: 2px 0 2px 10px; }
/***** Other CSS *****/
.login-img-box { padding: 18px 15px 17px 30px; }
/***** Footer *****/
.footer-links li { padding: 0 6px; }
}
 @media screen and (min-width:768px) and (max-width:991px) {
/***** Header CSS ******/
.main-header { position: relative; }
/***** Before Login Pages *****/
.login-section, .login-section.forgot-user-id { position: relative; margin: 3% 0 0; }
.login-box { width: 56%; }
.login-box.register-box { width: 82%; }
.login-footer { position: relative; text-align: center; padding: 8px 15px; margin: 4% auto 0; }
}
@media all and (max-width: 767px) {
.row-flex, .row-eq-height { flex-wrap: wrap; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; }
.row-eq-height { display: -webkit-box; display: -webkit-box; display: -ms-box; flex-wrap: wrap; }
/***** Header CSS ******/
.main-header { position: relative; padding: 6px 0; }
.language-switcher { margin-top: 10px; margin-bottom: 10px; padding: 0 15px; order: 3; }
.header-navigation { margin-top: 10px; margin-bottom: 10px; order: 4; }
.language-dropdown>ul { text-align: left; }
.header-navigation, .language-switcher { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; }
.ismart-logo, .omantel-logo { -ms-flex: 0 0 49%; flex: 0 0 49%; max-width: 49%; display: inline-block; }
/***** Before Login Pages *****/
.login-section, .login-section.forgot-user-id { position: relative; margin: 3% 0 0; }
.captcha-box { margin-top: 10px; }
.info-icon-box { margin-top: 10px; }
.login-page-wrap .login-frame { padding-left: 15px; padding-right: 15px; }
.login-page-wrap .login-body { border-radius: 8px; margin-bottom: 10px; }
.login-page-wrap .heading-wrap { border-radius: 8px 8px 0 0; }
.login-img-box { padding: 38px 15px 38px 15px; background-image: url(/assets/images/login-page-img.jpg); background-color: #fff; background-repeat: no-repeat; background-position: center; background-size: cover; border-radius: 8px; }
.login-page-wrap .login-img-wrap { background-image: none; background-color: transparent; padding-left: 15px; border-radius: 0; }
.login-page-wrap .medium-heading { font-size: 21px; line-height: 24px; }
/***** Footer CSS *****/
.login-footer { position: relative; text-align: center; padding: 8px 15px; margin: 4% auto 0; }
.powered-by { text-align: center; order: 1; }
.copyright { order: 3; margin-top: 10px; }
.legal-links { margin-top: 10px; margin-bottom: 10px; order: 2; }
#chat-widget-container { bottom: 0 !important; }
}
@media screen and (min-width:680px) and (max-width:767px) {
/***** Before Login Pages *****/
.login-box, .login-box.register-box { width: 62%; }
}
@media screen and (min-width:561px) and (max-width:679px) {
/***** Before Login Pages *****/
.login-box, .login-box.register-box { width: 75%; }
}
@media all and (max-width: 560px) {
/***** Before Login Pages *****/
.login-box, .login-box.register-box { width: 82%; }
.custom-control label { line-height: 17px; }
}
@media all and (max-width: 480px) {
.col-xxs { width: 100%; }
.pad-group .no-right-pad { padding-right: 15px; }
.pad-group .no-left-pad { padding-left: 15px; }
.mbl-mrgn { margin-top: 10px; }
/***** Before Login Pages *****/
.login-box, .login-box.register-box { width: 85%; }
.form-wrap { padding: 20px 15px; }
.verify-wrap ..col-xxs.no-right-pad {
padding-right: 15px;
}
}
@media all and (max-width: 425px) {
/***** Before Login Pages *****/
.login-box, .login-box.register-box { width: 95%; }
.useful-link { text-align: center; }
.useful-link a { display: block; padding-right: 0; padding-left: 0; padding-bottom: 2px; border-right: none; }
.footer-links li { padding: 0 8px; }
}
@media all and (max-width: 376px) {
/***** Before Login Pages *****/
.login-box, .login-box.register-box { width: 92%; }
}
@media all and (max-width: 360px) {
.login-footer { font-size: 13px; }
.login-page-wrap .medium-heading { font-size: 22px; }
}