html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}
body {font-size:12.8px; font-family:'Baloo 2', sans-serif; font-weight:300; line-height: normal; height:100%; background:#fff; color:#2D3242;}
html, #root, #site-wrap {height:100%; background:#fff;}
* {-webkit-font-smoothing: antialiased; font-size: 1rem}
a {text-decoration: none; color:#FFCC33; cursor: pointer}
a:hover {color:#FFD75D;}
h1 {font-size:1.5rem; padding-bottom: 20px; font-weight: 700;}
h2 {font-size:1.5rem; padding-bottom: 20px; font-weight: 700;}
h3 {font-size:1.5rem; padding-bottom: 10px; font-weight: 700;}
button {background:#FFCC33; color: #2D3242; font-weight: 600; cursor:pointer; outline:none; border:none; }
button:hover {background: #FFD75D; cursor: pointer;}
input {outline:none;}
strong {font-weight: bold}
div, input, textarea, select {box-sizing: border-box;}

#focus { text-align: center; background:#101316 url("../background.jpg"); background-size:cover; min-height:100%; color:#fff }
#focus-header {padding:12px 0 120px 12px; text-align: left;}
#focus-header h1 { color:#fff; text-align: left; font-size:1.2rem;}
.focus-wrap {border-radius: 8px; margin:3% auto 0 auto; max-width:500px; padding-bottom: 20px}
.focus-wrap h2 {border-bottom: none; padding: 0 3.5% 18px 3.5%; font-weight: bold}
.focus-wrap a span {color:#777}
.focus-wrap .error-message {text-align:left; padding-top:2px}
.main {padding: 0 0 60px 0; font-weight: 400;}
.main-wrap {max-width:990px; margin: 0 auto; padding: 0 1.5%; box-sizing:border-box;}
.content-wrap {margin: 28px; background:#fefefe; border: solid 1px #EAECF4; padding-bottom: 20px; clear:both}
.content-narrow {width:500px; margin: 50px auto 20px auto; }
.content-wrap-clear {margin: 28px;}
.content-wrap-narrow {width:49%; margin: 0 2% 20px 0; float:left; box-sizing: border-box; clear:none}
.content-wrap-last {margin-right:0}
.content-wrap-middle {margin-bottom: 0}

.box-header {padding: 10px 3.5%; background: #101316; color: #fff;}
.box-header h2 {padding-bottom: 0}
.header-button {float:right; display:block; color:#fc3; padding: 0 12px; margin-left:25px; font-size:1rem; background:#333}
.header-button:hover {color:#FFD75D}
.header-info {float:right; display:block; font-size: 1rem;}

#nav {width:220px; height:100%; background:#CFCFD0; position:fixed; left:0; color:#fff}
#nav-logo {width: 100%; text-align: center; padding:18px 0; background:#101316; height:66px;}
#menu {padding-top:0; }
#menu li {display: block; padding-top:14px;}
#menu li a {display: block; padding: 18px 10px; cursor: pointer; color:#101316;}
#menu li a.selected {background: #565859; color:#FFCC33}
#menu li a.selected span {color:#fff}
#menu li a:hover {background: #999;}
#menu li i {display: block; font-size: 1.5rem; float:left; padding: 0 15px 0 5px; margin-top:0; width: 42px; text-align: center;}
#menu li span {display: block; color:#101316; font-size: 1rem;}
#nav-last {position: absolute; bottom: 0; width:100%; }
#nav-version {border-bottom:solid 1px #999; color:#101316; padding: 0 0 5px 30px; color:#999}
#nav-last a {color:#101316; padding: 18px 0 18px 30px; display: block; box-sizing: border-box;}
#nav-last a:hover {color:#FFCC33; background: #999;}
#nav-last i {float:right; color:#101316; padding: 2px 30px 0 0 }
#nav-last a:hover i {color:#FFCC33}

#header {width:100%; background: #F8F8F8; padding-left:30px; box-sizing: border-box; height:67px; border-bottom: solid 1px #EAECF4}
#header a {display: block;}
#header h1 {font-weight:700; font-size: 1.28rem; color:#2D3242; display: block; padding-top: 19px }
#header h1 .alt {font-weight: 700}
#header span {float:right; padding: 22px 30px 0 0; font-size: 1rem;}

.form-item {display: block; padding: 12px 3.5% 15px 3.5%;}
.focus-wrap .form-item label {color:#fff}
.form-item label {font-size: 0.9rem; color:#111; text-align: left; display: block; text-transform: uppercase; margin-bottom: 10px;}
.form-item label span {font-size:0.8rem; color:#777; text-transform: none;}
.form-info {font-size:1rem; text-align: left; font-weight: bold; display: block;}
#focus .form-item label {margin-bottom: 10px; border: none }
.form-item input {width:100%; font-size: 1rem; padding: 12px 2%; color:#111; background:#f3f3f3; border:none}
.form-item input::placeholder {color:#bbb}
.form-item textarea {width:100%; font-size: 1rem; padding: 5px 2%; border: none; background:#f3f3f3; color:#111; height:120px; line-height: 1.5rem;}
.form-item textarea.Shorter {height:60px;}
.form-item input:focus, .form-item textarea:focus {border: solid 1px #007eff; outline:none}
.form-item button {width:100%; padding: 16px 0; font-size: 1rem; margin-top: 16px;}
.form-item button i {padding-right:10px;}
.form-item span.ReferenceInput {width:98%; font-size: 1.2rem; padding: 5px 1%; border: solid 1px #777; background: #fff; display: block; text-align: left; color:#777; border-radius: 5px}
.form-item select {width:100%; font-size: 1rem; padding: 8px 2%; border: solid 1px #EAECF4; color:#111;}
.form-item input[type=file] {font-size:1rem;}
.form-item .disabled {color:#999}
.form-item .NumberBox {width:96%; display: block; font-size: 1.2rem; padding: 5px 2%; border: solid 1px #777; color:#111; border-radius: 5px; background:#f0f0f0;}
.form-item p {margin-bottom: 10px;}
.form-itemGap {padding-bottom: 30px;}
.form-item-first {padding-top:24px;}
.form-item .react-daterange-picker .react-daterange-picker__inputGroup {background:#f3f3f3; padding: 0 10px 5px 15px}
.form-item .react-daterange-picker input.react-daterange-picker__inputGroup__input {padding: 3px 0px; box-sizing: content-box; background:none}
.form-item .react-daterange-picker__wrapper {border:none}
.form-item .react-daterange-picker button {padding: 3px; margin-top: 0;}
.form-item .react-daterange-picker button svg {stroke:#333}
.form-item .react-daterange-picker__range-divider {display: inline-block; padding: 9px 5px 0 5px}
.form-prompt {font-size:1rem;}
.form-prompt a span {color:#ccc}

.table-list-simple {box-sizing:border-box; width: 93%; font-size: 1rem; margin:15px 0 10px 0; border-bottom: solid 1px #1B1E20; margin-left:3.5%;}
.table-list-simple td {text-align: center; border-bottom: solid 1px #EAECF4; vertical-align: top; padding: 0; font-size: 0.9rem; text-align: left}
.table-list-simple th {color:#101316; padding: 8px 0; text-align: left;}
.table-list-simple th.last {text-align: right}
.table-list-simple tr:hover {background:#fcfcfc}
.table-list-simple td.important {font-weight: bold;}
.table-list-simple td.highlight {color:#FA6C39;}
.table-list-simple td.last {text-align: right;}
.table-list-simple td a {width:100%; color:#2D3242; display:block; padding: 25px 0}
.table-list-simple td.slim {padding: 15px 0}
.table-list-small {box-sizing:border-box; width: 86%; font-size: 1rem; margin:15px 0 10px 0; border-bottom: solid 1px #1B1E20; margin-left:7%;}
.table-list-small td {text-align: center; border-bottom: solid 1px #EAECF4; vertical-align: top; padding: 10px 0; font-size: 0.9rem; text-align: left}
.table-list-small th {color:#777; padding: 8px 0; text-align: left}
.table-list-small td:hover {color:#25376c; cursor: pointer;}
.table-list-simple td a.status-active {color:#0DBD2A}
.table-list-simple td a.status-exception {color:#BD0D0D; font-weight: 700}
.table-list-simple td a.status-complete {color:#0D50BD}
.table-list-simple tr.distance-alert td a {color:#BD0D0D; font-weight: 700}
.task-button {padding: 3px 10px; background:#999; }
.table-list-simple .table-edit-button {padding:12px 2px 7px 0; box-sizing: border-box; font-size: 1.2rem;}
.table-list-simple .table-edit-button:hover {color:#FA6C39}
.table-list-simple .table-edit-text {padding: 15px 0 5px 0; display: block;}

.box-list {display:block; padding: 30px 3.5%; clear:both}
.box-list li {display:block; float:left; width: 31.3%; box-sizing: border-box; padding: 38px 20px; background: #fff; margin-right:2%; margin-bottom: 20px; text-align: center; border: solid 1px #E7E8F2}
.box-list li:hover {border-color:#FFCC33}
.box-list strong {color:#101316; display: block; font-size: 1.2rem; height:58px;}
.box-list span {color:#777; display: block; font-size: 0.8rem; padding-bottom: 8px}
.box-list em {color:#101316; display: block; font-size: 0.8rem;}

.dashboard-list {display:block; padding: 30px 3.5% 20px 3.5%; clear:both}
.dashboard-list li {display:block; float:left; width: 32%; box-sizing: border-box; padding: 20px; background: #F8F8F8; margin-right:2%; text-align: center; margin-bottom: 20px}
.dashboard-list li:last-child {margin-right:0}
.dashboard-list strong {color:#101316; display: block; font-size: 1.2rem; }
.dashboard-list em {color:#FA6C39; display: block; font-size: 2rem; padding: 8px 0; min-height: 48px; line-height: 1.6rem;}
.dashboard-list em.shorter {font-size:1.2rem; padding: 8px 0; line-height: 1.2rem;}
.avatar {height:80px;}

.map-pin {width:10px; height:15px;}
.map-box {padding: 0 3.5%; width:100%; height:225px; clear:both}
.map-box-alt {width:68.3%; clear:left}
.graph-box {padding: 0 3.5%; width:100%; height:270px; margin-top:20px; }
.graph-box>div {background: #F8F8F8; padding: 10px}
.box-sms-message {margin: 0 3.5% 18px 3.5%; padding: 18px; width:93%; background:#f0f0f0; font-size: 1rem; box-sizing: border-box;}
.box-sms-message strong {margin-right: 10px;}
.box-sms-message em {margin-left: 10px; color:#FA6C39; word-break: break-all;}
.box-sms-message span {word-break:break-all;}
.box-sms-message-alt {float:right; width:29.7%; margin: 0 3.5% 18px 0; padding: 25px 20px}
.campaign-box {margin: 18px 3.5% 18px 3.5%; padding: 18px; width:93%; background:#f8f8f8; font-size: 1rem; text-align: center;}
.campaign-box a {color:#FA6C39}
.campaign-box a:hover {color:#FFCC33}
.note-box {margin: 18px 3.5% 18px 3.5%; padding: 18px; width:93%; background:#f8f8f8; font-size: 1rem;}

hr.break {clear:both; width:100%; height:0; border:0; padding:0; margin:0}
/* ---- */
#modal {text-align: center; padding-top: 500px; height:100%; box-sizing: border-box; background:#323b57; color:#fff;}
#modal h1 { text-align: center; font-size: 3rem; color:#fff;}
#loading {text-align: center; padding: 100px 0 50px 0; font-size: 2rem; }
.empty-data {width: 100%; box-sizing: border-box; padding: 20px 0; text-align: center; font-size: 1rem}

#footer {width:100%; background: #12182a; border-top: solid 3px #444C63;}
#footer-wrap {max-width:990px; margin: 0 auto; padding: 50px 1.5% 30px 1.5%; font-size: 1rem; box-sizing:border-box;}
#footer-links {float:right; display:block; color:#fff; font-size: 0.85rem;}
#footer-links a {display: block; float: left; margin-left:20px}
#footer a {color:#fff;}
#footer a:hover {color:#fcd448; cursor: pointer;}

#language {float:right; font-size: 1rem; padding: 20px 33px 0 0}
#language em {display: inline-block; }
#language a {display:inline-block; margin-left: 10px; cursor:pointer; color:#FA6C39; font-weight: 400}

#home {background:#323b57; color:#fff;}
#home-header {background:#12182a; border-bottom: solid 2px #444C63}
#home-header-wrap {padding:10px 1.5%; max-width:990px; margin: 0 auto; box-sizing:border-box;}
#home-header a {float:right; color:#fff; font-size: 1rem;}
#home-header h1 {padding-bottom: 0; font-size: 1rem; font-weight: bold;}
#home-header a i {display: block; float:right; padding-top:3.8px; padding-left:7px; font-size: 0.9rem; color:#eee}
#home-header a:hover {color:#fcd448; cursor: pointer;}
#hero {border-bottom: solid 2px #444C63; background:#051030;
    background: -moz-linear-gradient(330deg, #051030 25%, #25376c 75%);
    background: -webkit-linear-gradient(330deg, #051030 25%, #25376c 75%);
    background: linear-gradient(330deg, #051030 25%, #25376c 75%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#1e2949', endColorstr='#25376c', GradientType=1 );}
#hero-wrap {padding:120px 1.5%; max-width:990px; margin: 0 auto; box-sizing:border-box; }
#hero h1, #hero h2 {font-size: 2rem; font-weight: 600; padding-bottom: 50px;}
#hero span {display: block; font-weight: 200;}
#hero a {background:#fcd448; color: #12182a; padding: 10px 25px 12px 25px; font-size: 1rem; display: inline-block; font-weight: 600; cursor:pointer; outline:none; border:none; border-radius: 3px}
#hero a:hover {background: #fde288;}

#filter-search {float:right; margin-right:10px}
#filter-search input {font-size:0.8rem; padding: 4px 5px; margin-right: 5px}
#filter-search button {font-size:0.8rem; padding: 5px 10px; border-radius: 3px; font-weight: normal; background: #777;}

.auth-hint {font-size: 1rem; color:#999; display: block; padding-bottom: 5px;}

.list-footer {text-align: right; display: block; padding: 0 3.5% 20px 3.5%}
.empty-list {text-align:center; font-size: 1rem; color:#999; padding: 100px 20px;}

.main .Omega h2 {border-bottom: none; margin-bottom: 1px}
.main h2.AltTitle, .main h3.AltTitle, .main-alt h2.AltTitle {border-bottom: none; padding-bottom: 0;}
.main h3 { font-size: 1.0rem; margin: 15px 0px 0 0px; border-bottom:none }

#content { margin-left: 220px;}
#content-clear {margin: 28px; }

#content h2 {font-weight:400; font-size: 1rem; font-weight: bold; }

.header-info {float:right;}
.focus-wrap .form-item .SubmitButton {width:100%; float: none}
.text-box {width:50%; font-size: 1.2rem; padding: 5px 2%; border: solid 1px #999; color:#111; margin-top:10px}
.text-box::placeholder {color:#bbb}
.form-rule {border-top: solid 1px #EAECF4; margin-top:20px; padding-top:20px;}
.form-item .light-button {clear:both; display: block; padding: 16px 0; color:#2D3242; background:#EAECF4; font-size: 1rem; text-align: center;}
.form-item .light-button:hover {background: #fde288;}
.error input {border-color: red;}
.StripeElement {box-sizing: border-box; padding: 12px 2%; border: 1px solid #EAECF4; border-radius: 3px; background-color: white; box-shadow: 0 1px 3px 0 #f3f3f3;}
.payment-info {font-size:1rem; color:#999; padding-top:10px;}
.payment-info img {width:150px; padding-top:10px;}
#import-wrap {clear:both; overflow: auto; padding:0 3.5%}
.import-item {float:left; width:33%; font-size: 1.1rem; padding: 10px 0;}
.import-item label {display: inline-block; font-weight: bold; margin-right: 5px;}

.content-details {padding: 30px 3.5%; box-sizing: border-box; font-size: 1rem; display: block;}
.content-details dt {font-weight: bold; padding-bottom: 8px;}
.content-details dd {padding-bottom: 28px; overflow: hidden;}
.content-details p {line-height: 1.5rem; padding-bottom: 18px;}
.content-details a {color:#FA6C39}
.content-details ol, .content-details ul {padding-bottom:18px;}
.content-details ol li {list-style-type:decimal; padding-left:10px; margin-left:25px}
.content-details ul li {list-style-type:disc; padding-left:10px; margin-left:25px}
.content-details h3 {padding-top:20px;}

.info-sub {text-align: right; padding-top: 10px; font-size: 0.8rem; color:#777; display: block;}
.instructions {padding: 10px; background:#FFE3CC; font-size:0.8rem; text-align: center; margin: 10px 3.5% 0 3.5%}

hr {border:none; border-bottom: solid 1px #EAECF4; height:1px; padding:0; margin:0; clear:both }

#tool-belt {padding: 30px 3.5%; clear:both; width:93%; }
#tool-belt a {display: block; float:left; padding: 10px 10px; text-align: center; border:solid 1px #FA6C39; border-radius: 8px; margin-right: 4%; width: 22%; box-sizing: border-box;}
#tool-belt a.light-button {border:solid 1px #999; color:#777}
#tool-belt a.important {font-weight: bold}
#tool-belt a.light-button:hover {border:solid 1px #FA6C39; color:#FA6C39; background: transparent}
#tool-belt a:hover {background: #FA6C39; color:#fff}
#tool-belt a:last-child {margin-right:0}

#confirm-icon {color:#5ec739; font-size: 12rem; margin: 50px auto 20px auto; display: block; text-align: center;}
#confirm-text {text-align: center; font-size:1rem; }
.box-confirm-header {text-align: center;}

.error-message {color:#FA6C39}
#message {color:#FA6C39; padding: 20px 7% 0 7%; font-size:1.2rem;}
.form-item .react-phone-number-input__icon {height:2.9em; width:3.9em; border:none}
.form-item .react-phone-number-input__country-select-arrow {border-width:0.6em 0.3em 0 0.3em}

.pagination {padding: 10px 3.5%; text-align: right}
.pagination li { display:inline-block}
.pagination li a {display: block; padding: 3px 5px; background:#999; color:#fff; font-size: 0.9rem; margin-left: 2px; min-width: 20px; text-align: center;}
.avatar-uploader > .ant-upload { width: 128px; height: 128px; }
.avatar-small {height:30px; border-radius:3px;}

@media screen and (max-width:900px) {
  .standard-list li {font-size: 1.1em;}
}

@media screen and (max-width:800px) {
  #hero-wrap {padding:60px 1.5%;}
  #hero h1, #hero h2 {font-size: 1.8rem; }
  #hero span {font-size:1.5rem;}
  .benefit-list {padding:30px 0 80px 0;}
  .benefit-list li.sub {padding-top:48px;}
  .benefit-list i {padding-top:15px; font-size:2.5rem;}
  .benefit-list strong {padding-top:10px; font-size: 1.2rem; }
  .benefit-list span {font-size: 0.9rem; padding:0 22px;}
  .pane h1 {font-size:1.5rem;}
}

@media screen and (max-width:700px) {
  .benefit-list {padding:30px 0 80px 0;}
  .benefit-list li.sub {padding-top:38px;}
  .benefit-list i {padding-top:15px; font-size:1.5rem;}
  .benefit-list strong {padding-top:10px; font-size: 1rem; }
  .benefit-list span {font-size: 0.8rem; padding:0 18px;}
  .standard-list li {width:30%; margin-bottom:15px; margin-right:5%; font-size:1.2rem;}
  .standard-list li:nth-child(3) {margin-right: 0}
  .pane .action-wrap {padding-bottom: 50px;}
}

@media screen and (max-width:600px) {
  #hero-wrap {padding:60px 5%;}
  #hero h1, #hero h2 {font-size: 1.6rem; }
  .benefit-list {float:none; padding-bottom: 50px;}
  .benefit-list li.item {width:50%; margin:0 auto 20px auto; float:none; height:47vw; clear:both; max-height:none;}
  .benefit-list li.sub {display:none}
  .benefit-list i {padding-top:35px; font-size:3rem;}
  .benefit-list strong {font-size: 1.8rem; }
  .benefit-list span {font-size:1rem;}
  .package-list li {margin-right:0; width:100%; margin-bottom: 20px;}
}

@media screen and (max-width:420px) {
  #home-header a, #home-header h1 {font-size:0.8rem;}
  #home-header a i {padding-top:3px}
  .benefit-list li.item {width:60%; height:57vw; min-width:200px; min-height: 200px;}
  .benefit-list i {padding-top:35px; font-size:2.8rem;}
  .benefit-list strong {font-size: 1.4rem; }
  .benefit-list span {font-size:0.9rem;}
  .standard-list li {width:100%; margin-bottom:15px; margin-right:0%; min-height:auto; padding: 20px 0}
  #footer-links {float:none; padding-top:10px;}
  #footer a {float:none; font-size:1rem; padding-left:5%; padding-bottom: 15px; margin-left:0}

}