/* General features */
.center {
 text-align:center;
}
.right {
 text-align:right;
}
.left {
 text-align:left;
}
.padl {
 padding-left:4px;
}
.padt {
 padding:3px;
}
.red {
 color:#d00912;
 font-weight:normal;
}
.minor {
 font-size:0.8em;
}
.bigtext {
 font-size:1.3em;
 font-weight:bolder;
}
.cloudbody,
.mobilecloudbody {
 font-family:"Trebuchet MS","Verdana","Arial",sans-serif;
}
.fondoC {
 background-color:#eef3f9;
}
.fondoO {
 background-color:#e6edf7;
}
.fitter {
 width:90%;
 margin-left:auto;
 margin-right:auto;
}
.spacer {
 margin:0 10px;
}
.cloudvspacer {
 margin:10px auto;
}
.separator {
 color:navy;
 background-color:navy;
 height:0.09em;
 border:0;
}
a.link, a.link:visited {
 color: #065ab8;
 text-decoration:none;
}
a.link:hover {
 color: green;	
 text-decoration:none;
}
.button {
 padding:1.2em 1.4em;
 width:230px;
 font-variant:normal;
 text-transform:uppercase;
 letter-spacing:0.06em;
 border-radius:999px;
 border:1px solid #d7deea;
 background:linear-gradient(180deg,#ffffff 0%,#f3f6fb 100%);
 color:#c94040;
 font-size:0.95em;
 font-weight:600;
 box-shadow:0 6px 16px rgba(27,20,100,0.1);
}
.cloudlist {
 list-style-type: circle;
 padding-left:0px;
}
.sublist {
 padding-top:2px;
 padding-left:30px;
 padding-bottom:4px;	
}
.bannerlogo {
 max-width: 500px;
 max-height: 80px;
}
.partnerlogo {
 max-width: 260px;
 max-height: 80px;
}


/* --------------------------- */
.cloudbody {
 height:3300px;
 width:100%;
 margin:0 auto;
 background-color:#a3b0c9;
 background-image:linear-gradient(180deg,#bac4d7 0%,#93a6c2 100%);
 color:#5f6b84;
}
.isobody {
 background-color:#ddd6c2;
 background-image:linear-gradient(180deg,#e6decf 0%,#d2c8b3 100%);
}
.localbody {
 background-color:#cccbd9;
 background-image:linear-gradient(180deg,#dadae8 0%,#bdbdcd 100%);
}
.extwrapper {
 width:1100px;
 margin:auto;
 border:1px solid #d6dde8;
 text-align:center;
 background:#fff;
 padding-bottom:20px;
 color:#5f6b84;
 border-radius:18px;
 box-shadow:0 16px 38px rgba(27,20,100,0.16);
}
.extwrapper > .cloudvspacer:first-of-type {
 margin-top:14px;
 margin-bottom:14px;
}
.extwrapper > .cloudvspacer:first-of-type .gendatatable {
 border-color:#f4f7fb;
 box-shadow:0 -2px 10px rgba(27,20,100,0.16), 0 20px 44px rgba(27,20,100,0.28);
}
.extwrapper > .cloudvspacer:first-of-type .cellmini {
 padding-top:12px;
 padding-bottom:12px;
}
.extwrapper > .cloudvspacer:first-of-type .datumA {
 color:#5f6b84 !important;
 font-weight:400;
}
.extwrapper > .cloudvspacer:first-of-type .gendatatable td.cellmini.datumA {
 color:#5f6b84 !important;
}
.gendata-main td.cellmini.datumA {
 color:#5f6b84 !important;
}
.gendata-main .datumA {
 color:#5f6b84 !important;
}
.gendata-main .cellmini {
 padding-top:12px !important;
 padding-bottom:12px !important;
}
.extiso {
 border:1px solid;
 border-color: olivedrab;
}
.extlocal {
 border:1px solid;
 border-color: purple;
}
.topheader {
 width:94%;
 margin:auto;
 padding-bottom:5px;
}
.gendatatable {
 width:90%;
 border:1px solid #d6dde8;
 border-radius:14px;
 border-collapse:separate;
 border-spacing:0;
 margin:auto;
 padding:0px;
 background:#fff;
 box-shadow:0 18px 40px rgba(27,20,100,0.2);
}
.chartimg {
 height:268px;
 width:688px;
 border:1px solid rgba(120,140,170,0.12);
 border-radius:10px;
}
.qrimg {
 padding: 0px;
 border:1px solid;
 border-style: groove;
 -border-radius:1px;
 -webkit-border-radius:1px;
}
.qrlabel {
 width:20%;
 margin:20px 60px;
 padding:20px;
}
.prtimgcontainer {
 max-width:190px;
 margin:0 auto;
 overflow:hidden;
}
.prtimgw {
 max-width:190px;
}
.prtimgh {
 max-height:120px;
 max-width:160px;
} 
.ratestable {
 height:290px;
 border:1px solid #eef2f7;
 border-radius:12px;
 margin-left:3px; 
 padding:10px 8px 6px;
 background:#fff;
 box-shadow:0 16px 34px rgba(27,20,100,0.18);
}
.rtwidth {
 width :285px;
}
.cloudchart {
 margin:0px; 
}
.cloudcharttitle {
 font-size:1.1em;
 font-weight:500;
 text-transform:uppercase;
 color:#5f6b84;
 margin:6px 0 10px;
 padding-top:4px;
}
#dashboard .cloudcharttitle {
 font-size:1.2em !important;
}
#dashboard {
 height:320px;
}
#chartsdiv {
 margin-bottom:16px;
}
#chartsdiv .ratestable {
 height:320px;
}
#chartsdiv .ratestable.cloudchart {
 padding:3px;
}
#chartsdiv .ratestable.cloudchart .cloudcharttitle {
 font-size:1em;
 margin:0 0 6px;
 padding-top:0;
}
#cloudchartnetlessdiv {
  margin-bottom:14px;
}
.cloudchartextra {
 color:#5f6b84;
 text-align:left;
 margin-left:30px;
 font-size:1.0em;
 z-index:200;
}
.cloudoff {
 left:20px;
}
.cloudchartcontrolsdiv {
 display:block;
 margin:auto;
 font-size:1.0em;
 color: #5f6b84;
 width:580px;
}
.cloudchartcontrolsdiv .goog-menu-button-outer-box {
 border:0px; 
 background-color: white;
}
.cloudchartcontrolsdiv .goog-menu-button-inner-box {
  border:1px solid #bac0ca; 
  border-radius:12px;
  font-size:0.9em;
  color: #41495a;
  padding:6px !important;
}
.cloudchartcontrols {
 float:left;
 margin:14px 2px 2px 2px;
 width:180px;
}
#totals {
 accent-color:#31a1d3;
}
.alertstable {
 width:90%;
 border:1px solid #e6bcbc;
 border-radius:12px;
 margin:auto;
 padding:1px 1px 4px 1px;
 background:#fff;
 box-shadow:0 16px 34px rgba(180,60,60,0.22);
}
.alertstableicons {
 height:16px;
 vertical-align:middle;
 margin:0 3px 0 8px;
}
.alertopen {
 color:red;
}
.constable {
 width:90%; 
 border:1px solid #d6dde8; 
 border-radius:12px;
 margin:16px auto; 
 padding:1px 1px 10px 1px;
 background:#fff;
 box-shadow:0 18px 40px rgba(27,20,100,0.2);
}
#consumdiv {
 margin-top:48px;
}
.maxconstableicons {
 height:60px;
 vertical-align:middle;
 margin:0px;
}
.constableicons {
 height:20px;
 vertical-align:middle;
 margin:0px;
}
.miniconstableicons {
 height:15px;
 vertical-align:middle;
 margin:0px;
}
.singlechartwrap {
 height:24px;
} 
.doublechartwrap {
 width:90.5%;
 height:30px;
 border:0;
 margin:16px auto; 
 padding:0;
}
.doublechart {
 width:100%;
 height:100%;
 padding:0;
 margin:0;
}
.doublechart td {
 border:1px solid #d6dde8;
 border-radius:10px;
 box-shadow:0 14px 28px rgba(27,20,100,0.16);
 background:#fff;
}
.miniicons{
 height:6px;
 vertical-align:middle;
}
.ratestableicons {
 height:20px;
 vertical-align:middle;
 margin:0px;
}
.iconsspacer {
 margin:4px 6px;
}
.tonerimg {
 border-radius:6px;
 border:1px solid #aeb1b4;
}
.consbar {
 width:5px;
 height:14px;
 margin:0;
 border-radius:6px;
 border:1px solid #eef2f7;
 box-shadow:none;
}
.consbar.black {
 background:linear-gradient(180deg,#2f2f2f 0%,#0f0f0f 100%);
}
.consbar.cyan {
 background:linear-gradient(180deg,#76e6ef 0%,#24c6d3 100%);
}
.consbar.magenta {
 background:linear-gradient(180deg,#e98ad0 0%,#c64aa3 100%);
}
.consbar.yellow {
 background:linear-gradient(180deg,#ffe58a 0%,#f2c94c 100%);
}
.consbar.grey {
 background:linear-gradient(180deg,#9aa3ad 0%,#6e7682 100%);
}
.black {
 background:black;
 color:white;
}
.cyan {
 background:cyan;
}
.magenta {
 background:magenta;
 color:white;
}
.yellow {
 background:yellow;
}
.grey {
 background:#666;
}
.color {
 background:url(/panel/images/cloud/tricolor.png);
 background-size:contain;
}
.cellmini {
	margin-bottom:0;
	padding:8px 12px;
	border:0;
	border-top:1px solid #dfe6f1;
	text-align:left;
}
.gendatatable tr:first-child .cellmini {
	border-top:0;
}
#inventdiv .cellmini {
	border-top:1px solid #d6dde8;
}
.cellminicons {
	padding:1px 6px;
	border:0px solid #ebebeb;
	text-align:center;
}
.constable tr:not(:first-child) td {
	border-top:1px solid #dfe6f1;
	color:#3e4a5f;
}
.constable .tclist {
	display:inline-block;
	padding:6px 10px;
}
.cellcompr {
 	margin:0px;
        padding:0px 2px;
	text-align:left;
	color:#3e4a5f;
}
.cloudinner {
	padding-left:40px;
}
.lightinner {
	padding-left:20px;
}
.celltitle {
	text-align:center;
	background-color:#e6edf7;
  text-transform:uppercase;
	color:#2e3440;
	font-size:0.75em;
  padding:6px 8px;
  /*border-bottom:1px solid #d6dde8;*/
}
.constable tr:first-child .celltitle:first-child {
	border-top-left-radius:12px;
}
.constable tr:first-child .celltitle:last-child {
	border-top-right-radius:12px;
}
.constable tr:first-child .celltitle:first-child,
.constable tr td.cellminicons:first-child {
 width:20%;
}
.datumA {
	font-size:0.9em;
	font-weight:600;
	color:#1a2745;
}
.datumB {
	font-size:0.82em;
	text-transform:uppercase;
	letter-spacing:0.02em;
	color:#5b6780;
}
.datum {
	color:#4b586f;
	font-weight:600;
}
#inventdiv .datum {
	font-size:0.82em;
}
.cloudindex {
 width:100%;
 height:1100px;
 background:white;
 margin:0;
 padding-top:60px;
 text-align:center;
}
.indexwrapper {
 margin:auto;
 width:50%;
 padding-top:20px;
}
.indexsearch {
 width: 20em;
 height: 2em;
 font-size: 1.2em;
 text-align:center;
}
.indexbut {
 padding:0.5em;
 margin:auto;
 margin-top:10px;
 margin-bottom:30px;
}
.cloudindextitle {
 color: #1a4a77;
 font-size: 1.4em;
 margin:auto;
 margin-top:40px;
}
.cloudfooter {
 color: #1a4a77;
 font-size: 12px;
 text-align:center;
 width:50%;
 margin:auto;
 margin-top:20px;
}
.cloudpoweredtext {
 color: #4b586f;
}
.cloudpoweredimg {
 margin-right:8px;
 width:75px;

}
/* Services */
.svcbox {
 padding-top:20px;
 margin:8px auto;
}
.serviceselect
{
 width:340px;
 padding:12px 14px;
 border:1px solid #d7deea;
 text-align:left;
 background:white;
 border-radius:12px;
 box-shadow:0 10px 22px rgba(27,20,100,0.12);
}
.selh1 {
 height:120px;
}
.selh2 {
 height:78px;
}
.servicesoption {
 margin:6px 0;
 font-size:0.9em;
}
.servicesdiv {
 background:#eef3f9;
 border-radius:12px;
 box-shadow:0 18px 38px rgba(27,20,100,0.2);
 border:1px solid #d6dde8;
 color:#2e3440;
}
.servicesdiv,
.confirm_dialog,
.alertres_dialog {
 color:#4b586f;
 font-family:inherit;
}
#services3 .servicesdiv {
 max-width:420px;
 min-height:120px;
 margin-left:auto;
 margin-right:auto;
 padding-top:22px;
 padding-bottom:22px;
}
.servicesdiv .button,
#services .button,
#buts .button {
 color:#4b586f !important;
 padding:1.2em 1.4em !important;
}
.servicesdiv .cloudvspacer {
 text-align:center;
}
.servicesdiv .serviceselect {
 text-align:left;
}
#conslist {
 text-align:left;
}
.servicesbutton {
 padding:0.5em 0.9em;
 width:130px;
 font-variant:normal !important;
 text-transform:uppercase !important;
 letter-spacing:0.04em;
 display:inline-block;
 margin:0 6px;
 border-radius:999px;
 border:1px solid #c1ccdd;
 background:#f7f9fc;
 color:#4b586f;
 font-weight:600;
 box-shadow:0 6px 14px rgba(27,20,100,0.12);
}
.servicesdiv input[type="button"],
.confirm_dialog input[type="button"],
.alertres_dialog input[type="button"] {
 font-variant:normal !important;
 text-transform:uppercase !important;
 letter-spacing:0.04em;
 color:#4b586f;
}
.serviceselected {
 background-color:#ffff99;
 width:90%;
 margin:2px auto;
 border-radius:8px;
}
.serviceselect,
#conslist {
 border-radius:14px;
}
.confirm_dialog {
  position:absolute;
  top:300px;
  left:50%;
  z-index:500;
  background:linear-gradient(180deg,#ffffff 0%,#f7f9fc 100%);
  border:1px solid #d7deea;
  border-radius:18px;
  width:36%;
  max-width:calc(100% - 40px);
  box-sizing:border-box;
  transform:translateX(-50%);
  margin:auto;
  padding:24px 22px;
  box-shadow:0 24px 54px rgba(27,20,100,0.22);
  color:#4b586f;
  font-size:0.95em;
}
.alertres_dialog {
  position:absolute;
  top:280px;
  left:50%;
  z-index:500;
  background:linear-gradient(180deg,#fff9d6 0%,#fff2b8 100%);
  border:1px solid #e8dc8f;
  border-radius:18px;
  width:30%;
  max-width:calc(100% - 40px);
  box-sizing:border-box;
  transform:translateX(-50%);
  margin:auto;
  padding:24px 26px;
  box-shadow:0 24px 54px rgba(27,20,100,0.22);
  color:#4b586f;
  font-size:0.95em;
}
.helpbox.ui-dialog {
 border:1px solid #d7deea;
 border-radius:18px;
 box-shadow:0 28px 66px rgba(27,20,100,0.24);
 background:#fff;
}
.helpbox .ui-dialog-titlebar {
 background:linear-gradient(180deg,#ffffff 0%,#969aa3 100%) !important;
 border:0;
 border-bottom:1px solid #e1e8f2;
 border-top-left-radius:18px;
 border-top-right-radius:18px;
 padding:12px 16px;
}
.helpbox .ui-dialog-title {
 color:#2e3440;
 font-weight:700;
 letter-spacing:0.02em;
 font-size:1.05em;
}
.helpbox .ui-dialog-titlebar-close {
 border:1px solid #d7deea;
 border-radius:999px;
 background:#fff;
}
.helpbox .ui-dialog-content {
 padding:18px 22px;
 color:#4b586f;
 font-family:inherit;
 font-size:0.95em;
 line-height:1.5;
}
#cloudguide > div {
 font-weight:700;
 color:#2e3440;
 margin-top:16px;
}
#cloudguide .guide {
 margin:8px 0 0 0;
 padding-left:18px;
}
#cloudguide .guide li {
 margin:6px 0;
 color:#4b586f;
}
.confirm_dialog input[type="text"],
.confirm_dialog select,
.confirm_dialog textarea,
.servicesdiv input[type="text"],
.servicesdiv select,
.servicesdiv textarea {
 color:#4b586f;
}
.confirm_dialog input[type="text"],
.confirm_dialog select,
.confirm_dialog textarea,
.servicesdiv input[type="text"],
.servicesdiv select,
.servicesdiv textarea {
 font-family:inherit;
 font-size:0.95em;
 color:#2e3440;
 background:#fff;
 border:1px solid #d7deea;
 border-radius:10px;
 padding:6px 8px;
 box-shadow:inset 0 1px 2px rgba(27,20,100,0.05);
}
.vls_dialog {
 top:780px;left:500px;
}
.toparrow {
 float:right;
 margin-right:4px;
 font-size:1.1em;
 font-weight:bold;
}

.deliver {
 cursor:pointer;
 font-size:0.9em;
}
.incourse {
  cursor:pointer;
  width:28px;
  height:28px;
  padding:2px;
  background:url(/cloud/images/tracking.png); 
  background-repeat:no-repeat;
  background-position:center;
  background-size:75%;
  background-color:transparent;
  border:1px solid #0776b8;
}

/* Cloud Top Bar */
.cloudbar {
  width:96%;
  margin:0 auto;
  padding:0 10px;
  background:#fff;
  border-bottom:1px solid #e5ebf3;
  border-top-left-radius:16px;
  border-top-right-radius:16px;
}
.cloudbartext {
  font-size:0.8em;
  color:#5b6780; /* also in tt */
}

/* -------------- */
/*  Mobile Cloud  */
/* -------------- */
.mobilecloudbody {
 height:5800px;
 width:100%;
 margin:0 auto;
 color:#1b1464;
 font-size:2.3em; 
 background:white;
}
.mobileextwrapper {
 width:1500px; 
 height:100%;
 margin:auto;
 text-align:center;
 background:white; 
 padding:0;
}
.mobgendatatable {
 width:100%;
 margin:auto;
}
.mobprtimg {
 max-width:660px;
 max-height:500px;
}
.mobconsdiv {
 width:100%; 
 margin-top:120px;
 padding-bottom:20px; 
}
.mobconstable {
 width:100%; 
 margin:auto;
 border-collapse:collapse;
 font-size:1.9em;
}
.mobpageschart {
 width:100%;
 margin:auto;
}
.mobcharttable {
 width:100%; 
 margin-top:50px;
}
.mobchartdiv {
 width:96%;
 padding-bottom:36px;
 margin:auto;
 margin-top:40px;
 margin-bottom:30px;
 border:4px solid #48afdb;
 -border-radius:15px; 
 -webkit-border-radius:15px;
 box-shadow: 12px 12px #aaa;
}
.lightbg {
 background:white;
}
.mobcell {
 padding:6px 10px;
 border:1px solid #48afdb;
 border-collapse:collapse;
 border-style:inset;
 text-align:left;
 background:white;
}
.mobcellmain {
 background:#48afdb;
 padding:120px 20px;
 border-top:2px solid white;
 font-size:2.4em;
 color:white;
}
.mobcellgen { 
 width:50%;
 background:white;
 padding:60px 10px;
 border-bottom:2px solid #48afdb;
 border-left:1px dotted #48afdb;
 border-right:1px dotted #48afdb;
 font-size:2.2em;
 color:#48afdb;
}
.mobcellcons {
 padding:32px 20px;
 border-top:1px dotted #48afdb;
 border-bottom:1px dotted #48afdb;
 text-align:center;
}
.mobconsbar {
 width:5px;
 height:42px;
 margin:0;
}
.mobdatum  {
 color: #1b1464;
}
.mobdatumA {
 font-weight:normal;
}
.mobcelltitle {
 text-align:center;
 color:#48afdb;
 padding:26px 4px;
}
.mobdashbtitle {
  font-size:1.2em;
  padding-top:20px !important;
  padding-bottom:30px !important;
}
.mobcelltitleB {
 text-align:center;
 background:#48afdb;
 color:white;
 padding:26px 4px;
}
.mobcheck {
 vertical-align:middle;
 zoom:4;
}
.mobbig {
 font-size:2.0em;
}
.mobminus {
 font-size:0.8em;
}
.mobmessage {
 margin:14px auto;
 padding:10px 24px;
 border:1px solid #aaa; 
 width:86%;
 background:#eee;
 opacity:0.5;
 font-size:1.2em;
 text-align:left;
}