body {
	background-color:#252525;
    background-repeat: repeat;
    background-attachment: fixed;
	background-image: url(../images/3px-tile.png);
	margin:0px;
	padding:0px;
	margin-left: auto;
	margin-right: auto;
	min-width: 100%;
}

#container {
	width:100%;
	max-width:100%;
	min-width:100%;
	/*font-size: 1.3vw;*/
	margin-left: auto;
	margin-right: auto;
/* 	background-color: green; */
}
.logo a img {width:15.6vw;padding-top:5%;}
#content {width:100%;margin:0px;padding:0px;}
#footer {width:100%;margin:0px;	padding:0px; }
#container::-webkit-scrollbar {display: none;}
}

th { text-align: left;}

h1, h2, h3, h4, h5, h6 {color: #2e2e2e;}
h1,h2,h3 {	text-align: center;}
h4 h5 {font-family: Titillium Web;}

div#header {height:6.3vw;width:100%;margin-left:auto;margin-right:auto;}
.header-logo-left {margin-top:1.6vw;margin-left:0%;font-family: Rubik Mono One;}
.header-logo-right {float:right;margin-top:2%;margin-right:2%;}
#logout {float:right;text-align:center;}
#logout a i {color:white; ;font-size:xx-large; padding-top:0.35em;padding-left:0.25em;padding-right:0.25em;}
#logout a i:hover {	color:#30b5ff;}

#customer-id a i:hover {text-decoration: underline;}
#customer-id {margin-top:0px; text-align: right;}
#customer-id h4 {margin:0;padding:0;font-size: 120%;font-family: Titillium Web;color:white;}
#customer-id h5 {margin:0;padding:0;font-size: 110%;font-family: Titillium Web;color:white;}

#logout-button {float:right;}

.font-rmo {	font-family: Rubik Mono One; }
.font-fjallaone { font-family: Fjalla One; } /* Dialer */
.font-slabo27x {font-family: 'Slabo 27px', serif;}
.font-droidsans {font-family: 'Droid Sans', sans-serif; font-weight: bold;}
.font-titlium {font-family: Titillium Web;}


.inline-block {	display: inline-block;}
.inline {display: inline;}

/* Font Sizes */

.largecenter { text-align: center; font-size:60px; }
.smallcenter { text-align: center; font-size:0.5em;}

.larger { font-size:2.5vw; }
.x-large { font-size:2.9vw; }
.xx-large { font-size:3.8vw;}
.xxx-large { font-size:4.4vw; }
.x-small { 	font-size:x-small; }
.smaller { 	font-size:smaller; }
.smallish { font-size:2.1vw; }

.button {
	width:20.8vw;
	height:4.2vw;
	padding:1.7vw 3.3vw;
	border: black 0.2vw solid;
	border-radius: 0.5vw;
	background-color: white;
	opacity:0.75;
}

.button:hover {
	border: #30b5ff 0.2vw solid;
	border-radius: 0.5vw;
	background-color: black;
	opacity:0.75;
}

.button-oval {
/* 	width:200px; */
/* 	height:40px; */
	padding: 0.8vw 1.7vw;
	border: #30b5ff 0.2vw solid;
	border-radius: 2.6vw;
	background-color: white;
	opacity:0.75;
}

.button-oval:hover {
	border: #30b5ff 0.2vw solid;
	border-radius: 2.6vw;
/* 	background-color: black; */
	opacity:0.75;
		-moz-box-shadow: 0vw 0.3vw 0.3vw #ededed;
	-webkit-box-shadow: 0vw 0.3vw 0.3vw #ededed;
	box-shadow-bottom: 0.5vw #000;
}

.orange {color:#f88100;}
.font-colour-two {color:#30b5ff;}
.green {color:#477a01;}
.red {color:#c01000;}
.border-colour-one {color:#969696;}
.yellow {color: #f8be00;}
.font-colour-one {color:white;}
.ppblue {color:#006db6;}
.black {color:000}

.bg-progress {background-color:#969696;}

.main-nav-active {
	display:none;
	font-size:3.2vw;
	color:#30b5ff;
	text-align: center;
	font-family: Rubik Mono One;
}

.main-nav-inactive {
	display:inline;
	font-size:2.5vw;
    text-align: center;
    color: white;
    font-family: Rubik Mono One;
}

.logo { font-family: Rubik Mono One; }
.index_number {color:#30b5ff;}
.footer-copyright, .footer-link, .footer-rev {text-align: center;color:white;}

.h31 {height:2.2vw; font-size:2.2vw;}
.h41 {height:3.1vw; font-size:3.1vw;}
.h50 {height:5.2vw; width:5.2vw; font-size:5.2vw;}

.mp0 {margin:0vw; padding:0vw;}

.ml1 {margin-left:1vw}
.ml2 {margin-left:2vw}
.ml5 {margin-left:5vw}
.ml10 {margin-left:10vw}

.mr1 {margin-right:1vw;}
.mr2 {margin-right:2vw;}
.mr3-5 {margin-right:3.5vw;}
.mr5 {margin-right:5vw;}

.mb1 {margin-bottom:1vw;}
.mb2 {margin-bottom:2vw;}
.mb3-5 {margin-bottom:3.5vw;}
.mb5 {margin-bottom:5vw;}
.mb10 {margin-bottom:10vw;}
.mb15 {margin-bottom:15vw;}

.mt1 {margin-top:1vw;}
.mt2 {margin-top:2vw;}
.mt3-5 {margin-top:3.5vw;}
.mt5 {margin-top:5vw;}
.mt6 {margin-top:6vw;}
.mt7-5 {margin-top:7.5vw;}
.mt10 {margin-top:10vw;}
.mt15  {margin-top:15vw;}
.mt20 {margin-top:20vw;}
.mt25 {margin-top:25vw;}
.mt30 {margin-top:30vw;}

.p3p {padding:3vw;}
.pt1 {padding-top:1vw;}
.pt2 {padding-top:2vw;}
.pt3-5 {padding-top:3.5vw}
.pt5 {padding-top:5vw;}
.pt6 {padding-top:6vw;}
.pt10 {padding-top:10vw;}
.pt15 {padding-top:15vw;}
.pt20 {padding-top:20vw;}

.pb1 {padding-bottom:1vw;}
.pb2 {padding-bottom:2vw;}
.pb3-5 {padding-bottom:3.5vw;}
.pb5 {padding-bottom:5vw;}
.pb10 {padding-bottom:10vw;}
.pb20 {padding-bottom:20vw;}

.pl1 {padding-left:1vw;}
.pl2 {padding-left:2vw;}
.pl3 {padding-left:3vw;}
.pl3-5 {padding-left:3.5vw;}
.pl5 {padding-left:5vw;}
.pl10 {padding-left:10vw;}
.pl15 {padding-left:15vw;}
.pl20 {padding-left:20vw;}

.pr1 {padding-right:1vw;}
.pr2 {padding-right:2vw;}
.pr5 {padding-right:5vw;}
.pr3-5 {padding-right:3.5vw;}
.pr10 {padding-right:10vw;}
.pr20 {padding-right:20vw;}

.forgot-password {margin-bottom:1vm;}
.forgot-password a{font-size:smaller;margin-top:0.5vm;}

.center { text-align: center;}
.align-left {text-align: left;}
.align-right {text-align: right;}
.margin-auto { margin-left: auto; margin-right: auto; }
.right { text-align: right; }
.float-right { 	float: right; }
.float-left { float: left; }
.float-none {float:none;}
.noborders tr td { border: 0px;}

a:hover {color:#999999; text-decoration: none;}
a:visited {color:#03a9f4; text-decoration: none;}
/*a:link {color:#03a9f4;text-decoration: none;}*/
a:active {color:#03a9f4;text-decoration: none;}

.hover-orange h4:hover {color:#f88100; }
.hover-orange h3 a:hover {color:#f88100; }
.hover-orange:hover {color:#f88100; }

.hover-one h4:hover {color:#30b5ff; }
.hover-one h3 a:hover {color:#30b5ff; }
.hover-one:hover {color:#30b5ff; }


.footer-rev {font-size:10px; font-style: normal;}

/*input[type=text] {
    width: 80%;
    padding: 1.3vw 2.1vw;
    margin: 0.8vw 0;
    box-sizing: border-box;
    font-size: 1.2em;
}
*/
.signup input[type=text] {
    width: 100%;
    padding: 0.6vw 1vw;
    margin: 0.4vw 0;
    box-sizing: border-box;
    font-size: 1.75em;
    font-weight: 600;
   	font-family: Maven Pro;
}

@media (max-width: 52vw) {
.input-small input[type=text] {
	width:100%;
    padding: 1.3vw 2.1vw;
    margin: 0.8vw 0;
    box-sizing: border-box;
    font-size: 1.2em;
    font-weight: 600;
   	font-family: Maven Pro;
}
}

@media (min-width: 52vw) {
.input-small input[type=text] {
	width:100%;
    padding: 0.6vw 1vw;
    margin: 0.4vw 0;
    box-sizing: border-box;
    font-size: 0.75em;
    font-weight: 600;
   	font-family: Maven Pro;
}
}

@media (min-width: 100vw) {
.input-small input[type=password] {
	width:100%;
    padding: 1.3vw 2.1vw;
    margin: 0.8vw 0;
    box-sizing: border-box;
    font-size: 1.2em;
    font-weight: 600;
   	font-family: Maven Pro;
}
  }

@media (max-width: 100vw) {
.input-small input[type=password] {
	width:100%;
    padding: 0.6vw 1vw;
    margin: 0.4vw 0;
    box-sizing: border-box;
    font-size: 0.75em;
    font-weight: 600;
   	font-family: Maven Pro;
	}
}

/*input[type=password] {
    width: 80%;
    padding: 1.3vw 2.1vw;
    margin: 0.8vw 0;
    box-sizing: border-box;
    font-size: 1.2em;
}*/

/*textarea#notes {
	width: 78%;
	height: 25vw;
	border: 2px solid #cccccc;
	border-radius: 0.5vw;
    padding: 0.6vw 1vw;
    font-family: Maven Pro;
    font-weight: 600;
    font-size: 1.2em;
	background-position: bottom right;
	background-repeat: no-repeat;
    box-shadow: 0.5vw 0.5vw 0.5vw #888888;
}*/
/*
textarea#reply_msg {
	height: 25vw;
	border: 0.2vw solid #cccccc;
	border-radius: 0.5vw;
    padding: 0.6vw 1vw;
    font-family: Maven Pro;
    font-weight: 600;
    font-size: 1.2em;
	background-position: bottom right;
	background-repeat: no-repeat;
    box-shadow: 0.5vw 0.5vw 0.5vw #888888;
}*/

textarea#reply_msg_id {
	border: 0.2vw solid #cccccc;
	border-radius: 0.5vw;
    font-family: Maven Pro;
    font-weight: 500;
    font-size: 1.2em;
	background-position: bottom right;
	background-repeat: no-repeat;
    box-shadow: 0.5vw 0.5vw 0.5vw #888888;
}

textarea {
	width: 98vw;
	height: 25vw;
	border: 0.2vw solid #cccccc;
	border-radius: 0.5vw;
    padding: 0.6vw 1vw;
    font-family: Maven Pro;
    font-weight: 500;
    font-size: 1.2em;
	background-position: bottom right;
	background-repeat: no-repeat;
    box-shadow: 0.5vw 0.5vw 0.5vw #888888;
}

.four_fifth {width:72vw;}
.one_fifth {width:28vw;}

.italic {font-style: italic;}

.full-width { width:99vw; }
.full-width-a-little-less { width:95vw; }
.half-width {width: 49vw;}
.three-quarter {width: 73vw;}
.one-quarter {width: 23vw;}

.w9p {width: 9vw;}
.w10p {width: 10vw;}
.w18p {width: 18vw;}
.w24p {width: 24vw;}
.w25p {width: 25vw;}
.w50p {width: 50vw;}
.w80p {width: 80vw;}
.w85p {width: 85vw;}
.w90p {width: 90vw;}
.w95p {width: 95vw;}
.w98p {width: 98vw;}


.w200 { width:20.1vw;}
.w280 { width:29.2vw;}
.w300 { width:31.3vw;}
.w320 { width:33.3vw;}
.w460 { width:47.9vw;}
.w640 { width:66.7vw;}
.w820 { width:85.4vw;}

#mainselection select {
   border: 0;
   color: #EEE;
   background: transparent;
   font-weight: bold;
   padding: 0.2vw 1vw;
   width: 50.8vw;
   *width: 47.9vw;
   *background: #ededed;
   -webkit-appearance: none;
   color:white;
   font-family: Maven Pro;
   font-size: 1.1em;
}

#mainselection {
   overflow:hidden;
   width:100%;
   -moz-border-radius: 0.3vw 0.3vw 0.3vw 0.3vw;
   -webkit-border-radius: 0.3vw 0.3vw 0.3vw 0.3vw;
   border-radius: 0.3vw 0.3vw 0.3vw 0.3vw;
   box-shadow: 0.1vw 0.1vw 0.3vw #330033;
   background: #ededed url(../images/select-caret-down.png) no-repeat scroll 425px center;
   color:white;
   font-family: Maven Pro;
   font-size: 1.1em;
}

.border-slim {border: solid #cccccc 0.3vw; border-radius:0.5pvw;}
.border-medium {border: solid #cccccc 0.3vw;border-radius:0.5vw;}
.border-wide {border: solid #cccccc 0.9vw;border-radius:0.5vw;}
.border-top {padding-top:2vw;padding-bottom:2vw;margin-top:2vw;border-top: solid #acacac 1vw !important;}
.border-bottom {padding-top:0vw;padding-bottom:0vw;margin-top:0vw;border-bottom: solid #acacac 0.2vw !important;}

.border-top-slim {padding-top:2vw;padding-bottom:2vw;margin-top:2vw;border-top: solid #acacac 0.2vw !important;}
.border-bottom-slim {padding-top:2vw;padding-bottom:2vw;margin-top:2vw;border-bottom: solid #acacac 0.2vw !important;}


.border-left {padding-top:0vw;padding-left:0vw;margin-top:0vw;border-left: solid #acacac 0.2vw !important;}

.border-medium {border: solid #30b5ff 0.3vw;border-radius:1.6vw;padding-left:2vw;padding-right:2vw;}

.border-blue-medium {border: solid #30b5ff 0.5vw; border-radius:2.6vw;}

.border-top-blue {padding-top:2vw;padding-bottom:2vw;margin-top:2vw;border-radius:2.6vw; border-top: solid #30b5ff 0.5vw !important;}

table { border-collapse:collapse; }

.newborder {border: grey solid 1vw;}

.mylist {padding-left:8vw; padding-top:5vw;padding-bottom:2vw;}
.mylist li {display: inline;text-decoration: none;padding: 2vw;}
#duty {float:right;text-align:center;}
#duty a i {font-size:xx-large;	padding-top:1.3vw;padding-left:0.5em;padding-right:0em;}
#duty a i:hover {	color:#30b5ff;}

ul {padding:0;margin:0;}
a { outline: 0; }

:focus { outline: none !important; }
::-moz-focus-inner { border: 0 !important; }

.bg-msg {background-color: white;}
.bg-green {background-color:#477a01;}
.border-radius5 {border-radius:0.5vw;}
.border-radius25 {border-radius:2.6vw;}
.border-radius50 {border-radius:5.2vw;}
.border-radius200 {border-radius:20.8vw;}
.box-shadow5 {box-shadow: 0.5vw 0.5vw 0.5vw #888888;}

.tpr75 {filter: alpha(opacity=75);opacity: 0.75;}
.tpr25 {filter: alpha(opacity=25);opacity: 0.25;}
.icon-font-size {
/*     position: absolute; */
    	width: 2.6vw;
		height: 2.6vw;
		margin-bottom:-0.5vw;
/*     left: 50%; */
/*     margin-left:-256px; */
}

#fsize	{
/* 	padding-top: 10px; */
/* 	margin-top: 20px; */
/* 	background-color: green; */
	margin-bottom: -2.1vw;
}

#fmedium	{
/*     	background-image: url(../images/font-size-medium.png); */
/*    		width: 30px; */
/* 		height: 30px; */
	    background: rgba(0,0,0,.0);
	    position: relative;
	    display: inline;
}

#flarge	{
/*     	background-image: url(../images/font-size-large.png); */
/*     	width: 30px; */
/* 		height: 30px; */
		background: rgba(0,0,0,.0);
	    position: relative;
   	    display: inline;
}

#fsmall {
/*     	background-image: url(../images/font-size-large.png); */
/*    		width: 30px; */
/* 		height: 30px; */
		background: rgba(0,0,0,.0);
	    position: relative;
	    display: inline;
}

.cb {clear: both;}

.pricing-table tr td {
	padding-top:3vw;
	padding-bottom:3vw;
	padding-left:3vw;
}

.pricing-table tr th {
	padding-top:3vw;
	padding-bottom:3vw;
	padding-left:3vw;
	color:#006db6;
	font-family: Rubik Mono One;
}

.pricing-table {}

.test-content {width:100vw;background-color: white;box-shadow: 0.5vw 0.5vw 0.5vw 0.5vw #888888;}
.dropdown {position: relative;}

select {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;       /* remove default arrow */
/*    background-image: url(...);   add custom arrow */
   padding:1vw;
   font-size:1.3em;
   background-color: #efefef;
   text-align: center;
   border-radius:0.5vw;
   filter: alpha(opacity=5);
   opacity: 0.5;
}

.bold {font-weight: bolder;}
.dialer tr td { padding-top:2vw; padding-bottom:2vw;}
.bg-tpr25 {filter: alpha(opacity=25); opacity: 0.25;}

/* #dialog {font-size: 200%;} */
#dialog {width:100vw;}
.dialog {width:37.5vw;}
.ui-dialog {width:37.5vw; height: inherit;}
.ui-dialog div div a {color:black;}
.ui-widget {width:37.5vw; /*height: inherit;*/}
.ui-dialog-title {color:#30b5ff;}
.ui-dialog-titlebar {background-color: black;}


.underline {text-decoration: underline;}
span {padding:0px;margin:0px; overflow: scroll;}

.ui-dialog-titlebar {font-size:2.6vw;color:black;}
.ui-dialog-titlebar-close { min-height: 2.6vw;min-width: 2.6vw;color:black;}

button.ui-button.ui-corner-all.ui-widget.ui-button-icon-only.ui-dialog-titlebar-close {background-image: url("../images/X-23x23.png"); }

label input {
  visibility: hidden;/* <-- hide the default checkbox, the rest is to hide and alllow tabbing, which display:none prevents */
  display:block;
  height:0;
  width:0;
  position:absolute;
  overflow:hidden;
}
label span {/* <-- style the artificial checkbox */
  height: 2.3vw;
  width: 2.3vw;
  border: 0.5vw solid #30b5ff;
  display: inline-block;
  border-radius: 5.2vw 5.2vw;
}
[type=checkbox]:checked + span {/* <-- style its checked state */
  background: #30b5ff;

.noliststyle {list-style-type: none;}

font a:link {color:black;}
font a:active {color:black;}
font a:hover {color:#30b5ff;}
font a:visited {color:black;}


.ellipsis {font-size: 5.2vw;}
.form-login {min-width: 31.3vw;width:37.5vw;max-width:43.8vw;margin-left: auto;margin-right: auto; }