﻿html, body, form
{
	margin: 0px;
	padding: 0px;
	height: 100%;
	width: 100%;
	font-family:  Arial, Verdana, Tahoma, Sans-serif;
	font-size: 12px;
	color: #666666; /*#404040*/
	font-weight: normal;
	/*overflow: hidden;*/
	max-height: 100%;
	max-width: 100%;
}
#mainDiv, #bodyTbl
{
	height: 100%;
	width: 100%;
	max-height: 100%;
	max-width: 100%;
	margin: 0px;
	padding: 0px;
	border: none 0px transparent;
	border-collapse: collapse;
	vertical-align: top;
	table-layout: fixed;
}

#bodyTbl .tdMenu
{
	width: 150px;
	background-color: #E8E8EA;
}

.tdMenu, .tdDetail
{
	margin: 0px;
	padding: 0px;
	border: none 0px transparent;
	vertical-align: top;
}

textarea, input, select, button
{
	font-family:  Arial, Verdana, Tahoma, Sans-serif;
	font-size: 11px;
	color: #666666; /*#404040*/
	font-weight: normal;
}

input[type="text"], input[type="password"], select
{
	width: 130px;
	display: inline-block;
	padding: 3px;
	border: solid 1px #7F9DB9;
}

input[type="image"], img
{
	border-width: 0px;
	border-style: none;
	border-color: transparent;
	background-color: transparent;
}

a
{
	text-decoration: none;
	color: #335BBC;
	border-width: 0px;
	border-style: none;
	border-color: transparent;
}

a:Hover
{
	text-decoration: underline;
	color: #F6C000;
}

/*** MainGrid ***/

.mainGrid
{
	width: 100%;
	color: #666;
}

.mainGrid th, .mainGrid td
{
	font-size: 11px;
}

.mainGrid TH
{
	font-weight: bold;
	letter-spacing: 0px;
	/*text-align: left;*/
	padding: 5px;
	color: #2353B2;
	border-bottom: solid 2px #bbd9ee;
}

.mainGrid TH A
{
	text-decoration: none;
	padding-right: 18px;
	color: #0066cc;
}

.mainGrid .gdrow TD
{
	padding: 6px 8px;
	border-bottom: solid 1px #bbd9ee;
}

.mainGrid .gdrow:hover
{
	background-color: #FFF3DB;
	color: #000;
}

.mainGrid .gdrow TD.first
{
	padding-left: 10px;
}
.mainGrid TH.first
{
	padding-left: 10px;
}
.mainGrid .gdrow:hover .first
{
	background-repeat: no-repeat;
	background-image: url(../img/bullet.gif);
}

.subGrid
{
	font-size: 12px;
	text-align: left;
}

.subGrid th, .subGrid td
{
	font-size: 12px; /*text-align:left;*/
}

.EmptyGridStyle
{
	color: #666666;
	font-weight: bold;
}

.greyBorder
{
	border-color: #E4E4E4;
	border-style: solid;
	border-width: 1px;
    padding:15px;
}

.blueBorder
{
	border-color: #2983BB;
	border-style: solid;
	border-width: 1px;
}

.yellowBorder
{
	border-color: #FFF5CC;
	border-style: solid;
	border-width: 2px;
}

.title
{
	color: #666666;
	font-size: 18px;
	font-weight: bold;
	padding-left: 5px;
}

.message
{
	font-size: 11px; /*color:#404040; #CC0000;*/
	padding-left: 25px;
}

.message-error
{
	font-size: 11px;
	font-weight: bold;
	color: #404040; /*#CC0000;*/
	width: 100%;
	background: #FFEEEE url(../img/warning.png) no-repeat 5px 5px;
	min-height: 20px;
	padding: 6px 0px 5px 0px;
	text-align: left;
}

.message-success
{
	background-color: #FFF3DB;
	font-size: 11px;
	font-weight: bold;
	color: #404040; /*#1AA108;*/
	width: 100%;
	background: #E6F8DD url(../img/success.png) no-repeat 5px 5px;
	min-height: 20px;
	padding: 5px 0px 5px 0px;
	text-align: left;
}

.message-notice
{
	color: #CC0000;
	font-size: 11px; /*width:99%;*/
	background: url(../img/notice.png) no-repeat 5px 5px; /* DDF0F8, CCECFF*/
	min-height: 20px;
	padding: 6px 0px 5px 0px;
	text-align: left;
}

.message-warning
{
	background-color: #FFF3DB;
	font-size: 11px;
	color: #335BBC;
	width: 100%;
	background: #FFF5CC url(../img/warning1.png) no-repeat 5px 5px;
	min-height: 20px;
	padding: 6px 0px 5px 0px;
	text-align: left;
}

.blue
{
	font-size: 12px; /*11px;*/
	color: #335BBC; /*#2353B2;*/
	font-weight: bold;
}

.red
{
	font-size: 13px;
	color: red; /*font-weight:bold;*/
    margin:0px;
}

.black
{
	font-size: x-small;
	color: #404040; /*#2353B2;*/ /*font-weight:bold;*/
}

.subtitle
{
	color: #555;
	font-size: 13px;
	font-weight: bold;
	padding-left: 3px;
}

.highlightLightBlue
{
	background-color: #E3F0F9;
	vertical-align: middle;
}

.highlightBlue
{
	background-color: #C6E1FF; /*#F0F8FF*/
	vertical-align: middle;
}

.highlightYellow
{
	background-color: #FFF5CC;
	vertical-align: middle;
}

.highlightGrey
{
	background-color:#F9F9F9; /*#E3E3E3; #E9EBF5;*/
	vertical-align: middle;
}


.roundedPanel
{
	background-color: #F0F0F0; /*#E3F0F9;*/
	font-weight: normal;
}

.note
{
	font-size: 12px;
	color: #EB9317; /*#2353B2;*/
	background: url(../img/bullet1.gif) no-repeat left;
	padding-left: 15px;
}

.button
{
	display: inline-block;
	padding: 5px;
	font-family:  Arial, Verdana, Tahoma, Sans-serif;
	font-size: 13px;
	border: outset 1px #EEEEEE;
	background-color: #E0E0E0; /*2869BB, 5CAAD0,1073DA */
	color: #0078B7;
	/*width: 80px;*/
}

#header
{
    padding-top:5px;
    padding-left:15px;
	background-color: #E3F0F9; /*background: url( '../img/bluegrad1.png' ) repeat-x top;*/ /*padding-left: 50px; 	padding-right: 50px; 	padding-top: 0px; 	padding-bottom: 0px; */ /*border-bottom: solid 2px #0078B7;*/ /*height: 110px;*/
}

.content
{
	/*background-color: #FFFFFF; */ /*width: 1000px;*/
	min-height: 500px;
	text-align: left;
	padding: 10px;
}

.topMenu
{
	/*background-color: #DCDCDC; /*#0078B7;*/
	text-align: right;
	color: White;
	padding: 5px;
	z-index: 1000;
	position: relative; /*margin: 0px 5px 0px 5px;*/
}

.topMenuItem
{
	color: #0078B7;
	font-size: 12px; /*font-weight: bold;*/ /*border-left:solid 2px #E0E0E0;*/
	padding-left: 2px;
	padding-right: 7px; /*padding-top: 5px;*/
	z-index: 1001;
}


.topMenuItem img 
{
  width: 15px;
  height: 15px;
}

.topMenuItem a:hover
{
	text-decoration: none;
	color: #EB9317;
}

.topMenuSelected
{
	color: #EB9317; /*border-left:solid 2px #F6C000;-*/
}
.topMenuHover
{
	color: #0078B7; /*border-left:solid 2px #F6C000;*/
}

.leftMenuItem
{
	background: #E3F0F9 url('../img/yellow_arrow.png' ) no-repeat right;
	 background-size: 15px 15px;
	background-color: #E3F0F9;
	color: #0078B7;
	padding: 8px;
	border-bottom: solid 2px #EB9317;
}

.leftBullet
{
	padding-right: 10px;
}

#footer
{
	background: url(  '../img/Footer3.jpg' ) repeat-x top;
	height: 40px; /*color:#0078B7;*/
	font-size: 10px;
	width: 100%;
	font-family: Verdana;
}

.RedStar
{
	font-size: medium;
	font-weight: bold;
	color: Red;
}

.SectionHeaderStyle
{
	font-size: large;
	background-color: gainsboro;
	width: 100%;
}

.lblOfInput
{
	font-weight: bold;
}

.TableStyleGeneral tbody tr:hover
{
	background-color: #FFF3DB;
	color: #000;
}

.plusMinusIconCellStyle
{
	width: 18px;
}

#menuDivControl
{
	padding: 0px;
	margin: 0px;
	border: none 0px transparent;
	height: 300px;
	overflow: hidden;
	direction: rtl;
}
/*#menuDivControl:hover
{
	height: 470px;
}*/

#menuHelper
{
	padding: 0px;
	margin: 0px;
	border: none 0px transparent;
	direction: ltr;
	margin-left: 0px;
	margin-right: auto;
}

.SubMenuStyle
{
	z-index: 999 !important;
	
}

.AccessDeniedStyle
{
	font-size: 2em; 
	color: red;
	display: inline-block;
	width: 85%;
}

.lblMsgStyle
{
	color: Red;
}

/*-------------------------------------------------------------------------------------*/
.customCalloutStyle div, .customCalloutStyle td
{
	border: solid 1px #E4E4E4;
	background-color: #FFF3DB;
	color: #CC0000;
	font-size: 12px;
}
.customCalloutStyle .ajax__validatorcallout_popup_table
{
	display: none;
	border: none;
	background-color: transparent;
	padding: 0px;
}
.customCalloutStyle .ajax__validatorcallout_popup_table_row
{
	vertical-align: top;
	height: 100%;
	background-color: transparent;
	padding: 0px;
}
.customCalloutStyle .ajax__validatorcallout_callout_cell
{
	width: 20px;
	height: 100%;
	text-align: right;
	vertical-align: top;
	border: none;
	background-color: transparent;
	padding: 0px;
}
.customCalloutStyle .ajax__validatorcallout_callout_table
{
	height: 100%;
	border: none;
	background-color: transparent;
	padding: 0px;
}
.customCalloutStyle .ajax__validatorcallout_callout_table_row
{
	background-color: transparent;
	padding: 0px;
}
.customCalloutStyle .ajax__validatorcallout_callout_arrow_cell
{
	padding: 8px 0px 0px 0px;
	text-align: right;
	vertical-align: top;
	font-size: 1px;
	border: none;
	background-color: transparent;
}
.customCalloutStyle .ajax__validatorcallout_callout_arrow_cell .ajax__validatorcallout_innerdiv
{
	font-size: 1px;
	position: relative;
	left: 1px;
	border-bottom: none;
	border-right: none;
	border-left: none;
	width: 15px;
	background-color: transparent;
	padding: 0px;
}
.customCalloutStyle .ajax__validatorcallout_callout_arrow_cell .ajax__validatorcallout_innerdiv div
{
	height: 1px;
	overflow: hidden;
	border-top: none;
	border-bottom: none;
	border-right: none;
	padding: 0px;
	margin-left: auto;
}
.customCalloutStyle .ajax__validatorcallout_error_message_cell
{
	font-family: Verdana;
	font-size: 10px;
	padding: 5px;
	border-right: none;
	border-left: none;
	width: 100%;
}
.customCalloutStyle .ajax__validatorcallout_icon_cell
{
	width: 20px;
	padding: 5px;
	border-right: none;
}
.customCalloutStyle .ajax__validatorcallout_close_button_cell
{
	vertical-align: top;
	padding: 0px;
	text-align: right;
	border-left: none;
}
.customCalloutStyle .ajax__validatorcallout_close_button_cell .ajax__validatorcallout_innerdiv
{
	border: none;
	text-align: center;
	width: 10px;
	padding: 2px;
	cursor: pointer;
}
/*-------------------------------------------------------------------------------------*/

/*** Tabs Style ***/

.tabStyle {
    display:inline-block;
    width:100%;
}

.tabStyle .ajax__tab_header
{
    font-family: "Helvetica Neue" , Arial, Sans-Serif;
    font-size: 14px;
    font-weight:bold;
    display: block;
    /*border-bottom:solid 2px #E8E8E8;*/
}
.tabStyle .ajax__tab_header .ajax__tab_outer
{
    border:0;
    padding-left: 10px;
    margin-right: 3px;
}
.tabStyle .ajax__tab_header .ajax__tab_inner
{
    border:0;
    padding: 3px 10px 2px 0px;
    color:#335BBC;
    font-weight:normal;
    font-size:12px;
}
.tabStyle .ajax__tab_hover .ajax__tab_outer
{
    background-color:#fff;
}
.tabStyle .ajax__tab_hover .ajax__tab_inner
{
    color: #F6C000;
    background-color:#fff;
}
.tabStyle .ajax__tab_active .ajax__tab_outer
{
    border:0;
    border-bottom:solid 3px #EB9317;
    background-color: transparent;
    font-size:14px;
}
.tabStyle .ajax__tab_active .ajax__tab_inner
{
    border-color: #333;
    color:#666;
    font-weight:bold;
}
.tabStyle .ajax__tab_body
{
    font-family: verdana,tahoma,helvetica;
    font-size: 10pt;
    background-color: transparent;
    border-top-width: 0;
    border: 0;
    padding-top:10px;
}

/******************/

.custInfo {
    clear:both;
    overflow:auto;
    background-color:#F9F9F9;
    width:99%;
    margin:3px;
}

#dslProfile #walletInfo {
    clear:both;
    overflow:auto;
    margin:3px;
    margin-top:10px;
    padding:15px;
    border:solid 1px #E8E8E8;
}

#dslProfile #walletInfo .hdr{
    background-image:url("../img/wallet.png");
    background-repeat:no-repeat;
    background-position:left;
    padding-left:30px;
}

#dslProfile #walletInfo .body {
    margin-left:30px;
    margin-top:10px;
}

.walletBalance {
    font-size:18px;
    font-weight:normal;
    color: #335BBC;
    margin-left:10px;
    margin-right:10px;
}

.status {
    margin-left:10px;
    margin-right:10px;
    text-transform:uppercase;
}

#dslProfile #conns {
    
    padding:15px;
    margin:3px;
    border:solid 1px #E8E8E8;
    height:100%;
}

#dslProfile #conns .hdr {
    clear:both;
    overflow:auto;
    background-color:#F9F9F9;
    margin-top:10px;
    width:100%;
}

#dslProfile #conns .hdr-left{
    float:left;
    padding:5px;
    width:45%;
}

#dslProfile #conns .hdr-right{
    float:right;
    padding:5px;
}

#dslProfile .trafficMeter {
    float:left;
    width:20%;
    padding:15px;
    border:solid 1px #E8E8E8;
    margin:3px;
    height:85%;
    position:relative;
    padding-right:0px;
}

#dslProfile .lnkAddVolume {
    clear:both;
    overflow:auto;
    width:100%;
    text-align:center;
    position:absolute;
    bottom:0;
    margin-bottom:15px;
    margin-left:-15px;
}

#dslProfile #logs {
    width:100%;
    margin:0;
    padding:0;
    margin-left:5px;
}

.form {
    padding: 15px;
    border: 1px solid #CCC;
    display:inline-block;
    /*min-width:700px;*/
    min-height:300px;
    width:95%;
    overflow:auto;
    clear:both;
    margin:3px;
}

.form  div + div {
    margin-top:10px;
}

.form .label {
    display: inline-block;
    width: 90px;
    /*text-align: right;*/
}

.form .textarea {
    width: 300px;
    box-sizing: border-box;
    border: 1px solid #999;
    vertical-align: top;
}

/*.form .button {
    margin-left: 95px;
}*/

.menu-horizontal {
    margin:25px 5px 25px 5px;
}

.menu-horizontal a {
    border:0;
    padding: 5px 10px 5px 10px;
    color:#335BBC;
    font-weight:normal;
    font-size:12px;
}

.menu-horizontal a:hover {
    color: #F6C000;
    background-color:#fff;
    text-decoration:none;
}

.menu-horizontal a:active {
    margin-top:3px;
}

.menu-horizontal .selected {
    border:0;
    border-bottom:solid 3px #EB9317;
    background-color: transparent;
    color:#666;
    font-weight:bold;
}

.floatLeft {
    float:left;
}

.floatRight {
    float:right;
}

.alignLeft {
    text-align:left;
}

.alignRight {
    text-align:right;
}

.alignCenter {
    text-align:center;
}

.padding-3 {
    padding:3px;
}

.padding-10 {
    padding:10px;
}

.padding-20 {
    padding:20px;
}

.margin-3 {
    margin:3px;
}

.margin-5 {
    margin:5px;
}

.margin-15 {
    margin:15px;
}

.margin-left-95 {
    margin-left:95px;
}

.bold {
    font-weight:bold;
}

.italic {
    font-style:italic;
}

.lightGray {
    color:#A9A9A9;
}

.gray {
    color:#666666;
}

.font-12 {
    font-size:12px;
}

.font-16 {
    font-size:16px;
}

.font-18 {
    font-size:18px;
}

.font-24 {
    font-size:24px;
}

.inline-block {
    display:inline-block;
}

.PermissionChk {
    display:block;
}

#main-content {
    height:100%;
    min-height:100%;
    margin:0;
    padding:0;
    padding-top:10px;
    color:#000;
    width:80%;
    margin-left:1%;
    padding-bottom:30px;
    display:inline-block;
}

    #main-content .body  {
        width:100%;
    }

    #main-content .hdr {
        font-size:38px;
        text-transform:uppercase;
        margin-bottom:35px;
        color:#000;
        display:block;
        margin-top:0;
    }

    /*#main-content .itemBox {
        float: left;
        background-color: #E3E3E3;
        border-radius: 40px;
        padding-top: 25px;
        padding-bottom: 25px;
        padding-left: 2%;
        padding-right: 2%;
        margin-left:1%;
        margin-right:1%;
        width: 18%;
        color: #000;
        margin-bottom: 40px;
        border: solid 1px #E3E3E3;
    }
        #main-content .itemBox:hover {
            background-color: darkgray;
            border: solid 1px darkgray;
        }

        #main-content .itemBoxSelected {
            float: left;
            border-radius: 40px;
            padding-top: 25px;
            padding-bottom: 25px;
            padding-left: 2%;
            padding-right: 2%;
            margin:1%;
            width: 17%;
            color: #000;
            margin-bottom: 40px;
            background-color: #F3C72D;
            border: solid 1px #F3C72D;
        }

        #main-content .durations {
            width: 33%;
        }

        #main-content .itemBox .lbl {
            text-transform:uppercase;
            font-size:14px;
            margin-top:15px;
            margin-bottom:15px;
        }

            #main-content .cart-main .ddl {
                width:76%;
            }

            #main-content .cart-main .btn {
                width:76%;
            }*/

        #main-content .body .hdr1 {
            font-size:32px;
        }
                    
        #main-content .body .hdr2 {
            font-size:14px;
            color:rgba(128, 128, 128, 1);
            text-transform:capitalize;
        }

    #main-content .body #account-form {
        float:left;
        width:80%;
    }

        #main-content .body #account-form .column {
            float: left;
            width: 45%;
            margin-right: 5%;            
        }
 
        #main-content .body #account-form .row {
            float: left;
            clear:both;
            width:100%;
        }

        #main-content .body #account-form .field {
            padding:0;
            margin:0;
            margin-bottom:15px;
            height:50px;
            float: left;width:45%;margin-right:5%;
        }

        #main-content .body #account-form .fullfield {    
            width:45%;margin-right:5%;
            height:50px;
            margin-bottom:10px;
        }

        #main-content .body #account-form .field label {
            font-size:12px;
            text-transform:capitalize;
            padding:0;
            margin:0;
            margin-bottom:2px;
            display:normal !important;
        }

        #main-content .body #account-form .field label .required {
            color: #d43f3a;
            margin-left:2px;
            margin-right:10px;
        }

        #main-content .body #account-form .field label .note {
            color:rgba(128, 128, 128, 1);
            margin-left:10px;
            text-transform:none;
        }

        #main-content .body #account-form .field input[type='text'], .field input[type='password'], .ddl, .txtArea {
            color:#000;
            width:100%;
            padding:5px;
            border:none;
            margin-bottom:5px;
            border:solid 1px #b5b2b2;
            box-sizing: border-box;
        }

         #main-content .body #account-form .field .ddl {
            width:100%;
            padding:5px;
            box-sizing: border-box;
        }

        #main .body #account-form .field .txtArea {
            width:100%;
            padding:15px;
            height:80px;
            display:inline-block;
            box-sizing: border-box;
        }

        #main-content .body #account-form .field .validator,
        .validator  { 
            font-size:11px;
            margin-left:0px;
            text-align:left;
            color:#d43f3a;
        }

        #main-content .body #account-form .field input[type='text'].invalid, .ddl.invalid, .txtArea.invalid {
		    border:1px solid  #d43f3a;
            background: url('../images/error.png') no-repeat right;
            background-size:30px;
            background-position-x:98%;
            height:47px;
            margin-bottom:5px;
        }

        #main-content .body #account-form .field input[type='checkbox'] {
            color:rgba(128, 128, 128, 1);
            width:5%;
            float:left;
        }

        #main-content .body #account-form .btn {
            padding:0;
            margin:0;
            height:35px;
            width:100%;
            margin-top:20px;
            cursor:pointer;
        }

::placeholder /* Chrome, Firefox, Opera, Safari 10.1+ */
 { 
    /*font-family: Montserrat-LightItalic;*/
    font-style:italic;
    font-size:10px;
    color: #808080;
    text-transform:none;
    padding-left:5px;
    opacity: 1;
}

:-ms-input-placeholder /* Internet Explorer 10-11 */
 { 
    /*font-family: Montserrat-LightItalic !important;*/
    font-style:italic !important;
    font-size:10px !important;
    color:  #808080 !important;
    text-transform:none !important;
    padding-left:5px !important;
    opacity: 1 !important;
}

::-ms-input-placeholder /* Microsoft Edge */
 { 
    /*font-family: Montserrat-LightItalic;*/
    font-style:italic;
    font-size:10px;
    color: #808080;
    text-transform:none;
    padding-left:5px;
    opacity: 1;
}
