/*
 * @package VTU5 Platform
 * @author WizLab.it
 * @version 20210719.183 - Hard linked file
 */

/* Fonts */
@font-face { font-family:"OpenSans"; src:url(/css/fonts/OpenSans.woff) format("woff"); }

/* Resets */
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; }

/* General styles */
body { font-family:OpenSans,sans-serif; color:#545454; background-color:#FCFCFC; font-size:11px; line-height:1.1em; }
b, strong { font-weight:bold; }
i, em { font-style:italic; }
a, .fakeLink { color:#EF9B51; text-decoration:none; cursor:pointer; opacity:0.8; }
  a:hover, .fakeLink:hover { text-decoration:underline; opacity:1; }
  a.button:hover { color:#FFF; }
input, select, textarea { padding:4px; font-size:11px; border:1px solid #CCC; color:#666; font-family:OpenSans,sans-serif; }
  input[type=text]:focus, input[type=password]:focus, select:focus { border:1px solid #999; }
  input[type=button], input[type=submit], .button { display:inline-block; background-color:#EF9B51; border:none; color:#FFF; margin:0 0 3px; padding:4px 6px; opacity:0.8; }
    input[type=button].small, .button.small { padding:1px 2px; }
    input[type=button]:disabled, input[type=submit]:disabled { opacity:0.3; }
    input[type=button]:hover, input[type=submit]:hover, .button:hover { opacity:1; }
    input[type=button].back, .button.back { padding:3px 6px; background-color:#DDD; color:#666; }
      input[type=button].back:hover, .button.back:hover { background-color:#CCC; }
  input[type=checkbox] { vertical-align:middle; }
  .button { padding:5px 8px; text-align:center; cursor:pointer; }
    .button:hover { text-decoration:none; }
p { margin-bottom:4px; }
div { line-height:1.3em; }
img { vertical-align:middle; }
abbr { border-bottom:1px dotted #545454; cursor:help; }
pre { white-space:pre; font-family:mono; }
.clearfix:after { visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0; }
.nowrap { white-space:nowrap; }
.textCenter { text-align:center !important; }
.textRight { text-align:right !important; }
.floatRight { float:right !important; }
.clear { clear:both; }
.bold { font-weight:bold !important; }
.normal { font-weight:normal !important; }
.italic { font-style:italic !important; }
.underline { text-decoration:underline; }
.strike { text-decoration:line-through; }
.dotUnderline { border-bottom:1px dotted #666; }
.small { font-size:10px !important; }
.small2 { font-size:9px !important; }
.error { color:#FF1E1E; }
.icon { width:16px; vertical-align:middle; }
.doubleclickable { border-bottom:1px dotted #000; cursor:pointer; }
.bigBorderLeft { border-left:3px double #999 !important; }
.smallBorderLeft { border-left:1px solid #999; }
.dashedBorderLeft { border-left:1px dashed #999; }
.brand { float:left; width:30px; margin-right:10px; }
.indent1 { margin-left:5px; }
.pointer { display:inline-block; cursor:pointer; border-bottom:1px dotted #AAA; }
.gndGreen { background-color:green !important; color:#FFF; }
.gndYellow { background-color:yellow !important; }
.gndOrange { background-color:darkorange !important; color:#FFF; }
.gndRed { background-color:red !important; color:#FFF; }
.green { color:green; }
.red { color:red; }
.yellow { color:yellow; }
.rotatedLabel { overflow:hidden; width:18px; height:200px; vertical-align:bottom !important; position:relative; }
  .rotatedLabel>div { position:absolute; transform-origin:left top 0; -webkit-transform:rotate(-90deg); -moz-transform:rotate(-90deg); -ms-transform:rotate(-90deg); -o-transform:rotate(-90deg); filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3); }
#popupBackground { display:none; position:fixed; top:0; left:0; z-index:199; opacity:0.8; filter:alpha(opacity=80); background-color:#000; width:100vw; height:100vh; margin:0; padding:0; }

/* Header */
header { background-color:#575757; position:sticky; top:0; z-index:10; }
  header h1 { display:inline-block; font-size:16px; color:#FCFCFC; line-height:32px; }
    header h1 a, header h1 a:hover { margin-left:5px; color:#FCFCFC; opacity:1; }
    header h1 .logo { vertical-align:text-bottom; margin-left:5px; }
  header nav.mainmenu { float:right; }
    header nav.mainmenu .menuicon { display:none; float:right; cursor:pointer; margin-right:5px; color:#DDD; font-weight:bold; }
      header nav.mainmenu .menuicon img { margin-left:8px; }
    header nav.mainmenu #mainMenulist { float:right; background-color:#575757; z-index:10; }
      header nav.mainmenu #mainMenulist li { display:inline; }
      header nav.mainmenu #mainMenulist li a { display:inline-block; padding:10px; color:#DDD; font-weight:bold; opacity:1; }
        header nav.mainmenu #mainMenulist li a:hover, header nav.mainmenu ul li a.active { background-color:#6C777F; text-decoration:none; }
  header nav.submenu { clear:both; background-color:#5C676F; text-align:right; }
    header nav.submenu ul li { display:inline; }
    header nav.submenu ul li a, header nav.submenu ul li .a { display:inline-block; padding:5px 10px; color:#DDD; opacity:1; }
      header nav.submenu ul li a:hover { background-color:#6C777F; text-decoration:none; }

/* Content */
.content { clear:both; padding:10px; min-height:500px; }
  .content h2 { margin:0 0 14px; font-size:18px; color:#EF9B51; }
  .content h3 { margin:20px 0 10px; font-size:14px; color:#888; font-weight:bold; }
    .content h3:first-of-type { margin:0 0 10px; }
  .content h4 { margin:0 0 8px; font-size:12px; color:#888; font-weight:bold; }
  .content .filter { background-color:#E8E8E8; margin-bottom:10px; padding:10px; border-radius:5px; }
    .content .filter .filterItem { display:inline-block; margin-right:10px; line-height:28px; }
      .content .filter .filterItem input[type=text] { width:120px; padding:3px; }
      .content .filter .filterItem select { padding:2px; }

/* In-Page submenu */
.submenu { }
  .submenu .options { }
    .submenu .options li { padding:5px; font-size:12px; }

/* Footer */
footer { background-color:#ACAAA1; color:#FFF; padding:3px; text-align:center; margin-top:40px; }

/* Table::basicList */
.basicList { margin-top:30px; }
  .basicList table { width:100%; }
    .basicList table tr { border-bottom:1px solid #DDD; }
      .basicList table tr:nth-of-type(odd) { background-color:#EEE; }
      .basicList table tr:last-of-type { border-bottom:#666; }
      .basicList table tr:hover { background-color:#EAEAEA; }
      .basicList table tr th { padding:6px 3px; text-align:left; font-size:13px; font-weight:bold; background-color:#DDD; white-space:nowrap; }
      .basicList table tr td { padding:5px; }

/* Table::pagination */
.basicList .pagination { float:right; border:1px dotted #CCC; margin-top:-22px; border-radius:5px 5px 0 0; padding:3px 15px; font-size:10px; background-color:#EEE; }
  .basicList .pagination.bottom { margin-top:0; border-radius:0 0 5px 5px; }
  .basicList .pagination a { display:inline-block; }
  .basicList .pagination .currentPage { font-size:10px; font-weight:bold; width:40px; text-align:center; background-color:#F9F9F9; padding:1px; }

/* Forms */
fieldset { }
  fieldset .row { display:block; border-bottom:1px dashed #CCC; }
    fieldset .row .label { display:table-cell; width:220px; text-align:right; margin:10px 3px; float:left; font-weight:bold; }
    fieldset .row .field { display:table-cell; margin-left:10px; }
      fieldset .row .field .data { padding:6px 10px; margin:5px 0; border:1px solid #CCC; }
        fieldset .row .field span.data { }
        fieldset .row .field.error .data { border:1px solid #F00 !important; }
        fieldset .row .field span.data { display:inline-block; border:none; }
      fieldset .row .field .tip { font-size:smaller; font-style:italic; color:#999; margin-left:3px; }
        .baloon { display:inline-block; width:12px; line-height:12px; text-align:center; font-weight:normal; font-size:10px; background-color:#CCC; border-radius:5px; margin:0 2px; cursor:pointer; color:#636363; white-space:normal; }
          .baloon .message { display:none; position:absolute; width:300px; height:120px; margin:-7px 0 0 7px; border-radius:8px; background-color:#DDD; border:3px double #666; font-size:10px; text-align:left; padding:5px 8px; font-weight:normal; font-style:normal; overflow-y:auto; z-index:5; }
            .baloon:hover .message { display:block; }
fieldset.buttons { clear:both; margin:10px; text-align:right; }
  fieldset.buttons input[type=submit], fieldset.buttons input.submit { padding:8px 12px; }
  fieldset.buttons .button.back { padding:6px 10px; }

/* Messages */
.message { color:#333; padding:10px; background-color:#CEFFCE; margin-bottom:20px; line-height:1.6em; }
  .message.error { background-color:#FFCECE; }
  .message.warning { background-color:#FEE377; }
  .message h4 { font-size:18px; color:#1EFF1E; margin-bottom:10px; }
    .message.error h4 { color:#FF1E1E; }
    .message.warning h4 { color:#0F1E1E; }
  .message h5 { font-size:larger; color:#666; font-weight:bild; margin-bottom:5px; }
  .message div { margin-bottom:10px; }
  .message menu { text-align:right; }

/* Table type A (price lists, user's operators) */
table.typeA { border-collapse:collapse; }
  table.typeA tr { height:26px; }
    table.typeA tr:nth-of-type(odd) { background-color:#EEE; }
      table.typeA tr:hover { background-color:#EAEAEA; }
    table.typeA tr th { text-align:left; font-weight:bold; background-color:#E6E6E6; }
    table.typeA tr th, table.typeA tr td { border:1px solid #999; padding:3px; vertical-align:middle; white-space:nowrap; }
  table.typeA .pointer { cursor:pointer; }
  table.typeA .customizedPrice { background-color:#FF0; }
  table.typeA .priceFromParent { background-color:#FCAF3E; }
  table.typeA .valueUpdated { background-color:#FF0; color:red; text-align:right; }

/* Table type B (address book) */
table.typeB { }
  table.typeB tr:nth-of-type(odd) { background-color:#EEE; }
    table.typeB tr:hover { background-color:#EAEAEA; }
  table.typeB tr th { text-align:left; font-weight:bold; background-color:#CCC; }
  table.typeB tr th, table.typeB tr td { padding:3px; vertical-align:middle; white-space:nowrap; font-size:10px; }

/* Table type C (products) */
table.typeC { border:1px solid #666; font-size:9px; }
  table.typeC tr th { font-size:9px; padding:2px; }

/* Details box */
#detailsBox { border:3px double #AAA; background-color:#DDD; position:absolute; padding:5px; font-size:9px; display:none; overflow:hidden; }
  #detailsBox .loader { text-align:center; margin-top:20px; }
  #detailsBox h4 { font-weight:bold; font-size:11px; margin-bottom:5px; }
  #detailsBox table { width:100%; margin:0 auto; }
    #detailsBox table tr:nth-of-type(odd) { background-color:#EEE; }
    #detailsBox table th { background-color:#AAA; font-weight:bold; text-align:left; }
    #detailsBox table th, #detailsBox table td { padding:2px; }
      #detailsBox .separator { text-align:center; background-color:#888; color:#EEE; padding:2px; font-weight:bold; }

/* Login form */
.loginForm { border:1px solid #CCC; background-color:#F3F3F3; width:334px; margin:40px auto 0; padding:20px; }
  .loginForm div { padding:10px; text-align:center; }
    .loginForm div input { width:96%; padding:5px; }
      .loginForm div input[type=submit] { width:100%; height:30px; }

/* Hierarchy View */
.hierarchy { border:1px solid #AAA; text-align:center; display:inline-block; vertical-align:top; padding:10px; margin-top:10px; }
  .hierarchy.highlight { border:3px double #666; }
  .hierarchy.type1 { background-color:#EEE; }
  .hierarchy.type2 { background-color:#DDD; }
  .hierarchy.type3 { background-color:#CCC; }
  .hierarchy h2 { color:#666; font-weight:bold; margin-bottom:7px; }
    .hierarchy.highlight>h2 { color:#EF9B51; }
  .hierarchy h3 { font-style:italic; }

/* Mobile top ups */
.mobileTopupList td h4 { display:none; }
.mobileTopupList td div { padding-bottom:3px; }
.mobileTopupList td .label { display:none; font-weight:bold; }
  .mobileTopupList td .label.amount { display:inline-block; }
.mobileTopupList.review td .label { display:inline-block; }
.mobileTopupList.execute td .label { display:inline-block; }