tab1 { padding-left: 4em; }
#bloc1, #bloc2
{
    display:inline;
}
div.side{
 display:inline;
}
form{
display:inline;
}
#bloc2{
	    padding-right: 12px;
	float:right;
}
div.buys{
	color:#1b880a;
	padding-bottom:5px;
}
div.sells{
	color: #d00000;
	padding-bottom:5px;
}
div.middle{
	padding-left:10px;
}
BODY
{
	margin: 0px;
	font-family: Tahoma;
	font-size: 14px;
	background: #F8F8F8;
}

H1,H2,H3
{
	color: #224e77/*#274*/;
	font-family: "Open Sans",sans-serif,Tahoma;
	width:100%;
}
H1{
	margin-top:0;
}
H2
{
	background: #aad0ee;
    border-top: 1px #000 solid;
    border-bottom: 1px #000 solid;
    padding: 4px 4px;
}

H3
{
	padding-bottom: 2px;
	border-bottom: 1px #224e77/*#274*/ solid;
}

TABLE
{
	border-collapse: collapse;
	font-family: Tahoma;
	font-size: 14px;
}

DIV.ToggleContainer
{
	cursor:pointer;
	display:inline-block;
	width:54px;
	position:relative;
	height:21px;
}

DIV.ToggleOuter
{
	position:relative;
	width:40px;
	height:10px;
	border-radius:5px;
	background:#DDD;
	border: 1px solid #AAA;
	top: 5px;
	left:6px;
}

DIV.ToggleInner
{
	position: absolute;
	top: -5px;
	width:18px;
	height:18px;
	border-radius:10px;
	overflow:hidden;
	box-shadow: 0 0 1px 0 #666;
}

DIV.ToggleInnerOn
{
	right:-6px;
	background:#6CF;
	border: 1px solid #268;
}

DIV.ToggleInnerOff
{
	left:-6px;
	background:#CCC;
	border: 1px solid #777;
}

SPAN.SpanLink
{
	text-decoration: underline;
	color: #00A;
	cursor:pointer;
}

.TickSpan
{
	background: #AAFFCC;
	border: 1px solid #228855;
	color: #004422;
	border-radius:3px;
	display:inline-block;
	margin:2px 2px 2px 2px;
	padding: 2px 2px 2px 2px;
}

.CrossSpan
{
	background: #FFBBBB;
	border: 1px solid #883333;
	color: #550000;
	border-radius:3px;
	display:inline-block;
	margin:2px 2px 2px 2px;
	padding: 2px 2px 2px 2px;
}

.InfoSpan
{
	background: #CCFFEE;
	border: 1px solid #338866;
	color: #003088;
	border-radius:3px;
	display:inline-block;
	margin:2px 2px 2px 2px;
	padding: 2px 2px 2px 2px;
}

.WarningSpan
{
	background: #FFFFCC;
	border: 1px solid #888833;
	color: #FF0000;
	border-radius:3px;
	display:inline-block;
	margin:2px 2px 2px 2px;
	padding: 2px 2px 2px 2px;
}

.WarningSpan IMG, .InfoSpan IMG, .TickSpan IMG, .CrossSpan IMG
{
	vertical-align:top;
	/*float:left;*/
	/*padding-right:4px;*/
}


.SubNote
{
	font-size:11px;
	color:#AAA;
}


TABLE.GenTable
{
	border-collapse: collapse;

	border-top: none;
	border-left: 1px solid #444;
	border-right: none;
	border-bottom: 1px solid #444;

	margin-right:6px;
	background: #F8F8F8;
}

TABLE.GenTable TR TD
{
	border-right: 1px solid #444;
	border-bottom: 1px solid #444;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-right: 3px;
	padding-left: 3px;
	vertical-align: top;
}

TABLE.GenTable TR.T_Shaded_TR
{
	background: #EEE;
}

TABLE.GenTable TR TH
{
	background: #aac4ee/*#AEC*/;
	border-top: 1px solid #444;
	border-bottom: 1px solid #444;
	border-right: 1px solid #444;
	padding-right: 3px;
	padding-left: 3px;
	vertical-align: top;
	font-weight: bold;
}

/*TABLE.GenTable TR.GenTable_Footer_TR TH
{
	border-top: none;
}*/

IMG.ExchIcon
{
	width:24px;
	height:24px;
	vertical-align: middle;
	margin: 4px 0;
}

DIV.TopNavCon
{
	display: flex;
	flex-wrap: wrap;
}

DIV.TopNavCon > *
{
	flex: 0 1 auto;
}

DIV.TopNavLink
{
	border: 1px #274 solid;
	display: inline-block;
	margin: 0 10px 18px;
	padding: 4px 8px;
	background: #DFE;
	font-weight: bold;
	text-decoration: none;
	font-size: 15px;
	color: #274;
	box-shadow: 0 3px 5px -3px #555;
}

DIV.TopNavLink A
{
	/*line-height:29px;*/
}

DIV.ExSelCalc
{
	display: inline-block;
	border: 1px #DDD solid;
	margin: 6px;
	padding: 6px;
	vertical-align: top;
	background: #FFF;
	box-shadow: 0 3px 5px -3px #555;
}

DIV.GenCon
{
	display: inline-block;
	border: 1px #DDD solid;
	margin: 9px;
	
	padding: 12px;
	vertical-align: top;
	background: #FFF;
	box-shadow: 0 3px 5px -3px #555;
}
DIV.top
{
	width: 765px;
	border: 1px #DDD solid;
	margin: 9px;
	padding: 12px;
	vertical-align: top;
	background: #FFF;
	box-shadow: 0 3px 5px -3px #555;

}

DIV.ActionStep
{
	/*border-top: 1px #DDD dotted;*/
	margin: 4px 0px;
	padding: 4px 4px;
	vertical-align: top;
	background: #f4f9f6;
}

IMG.WarnIcon
{
	/*cursor:pointer;*/
	vertical-align:middle;
	width:16px;
	height:16px;
	/*opacity: 0.6;*/
}
/*IMG.WarnIcon:hover
{
	opacity: 1;
}*/
IMG.FlagIcon
{
	width:32px;
	height:32px;
	vertical-align: middle;
	/*margin: 2px 0;*/
}

INPUT
{
	/*background:#F0FFF8;
	border:#274 1px solid;
	color:#274;*/
	font-size:14px;
	    width: 72px;
}

INPUT[type="button"], INPUT[type="submit"], BUTTON
{
	/*padding: 4px 6px;
	box-shadow: 0 3px 5px -3px #555;*/
	font-size:14px;
	background-color: #aad0ee;
}

/*INPUT:checked
{
	outline: 2px solid #AEC;
}*/

INPUT[type="text"], INPUT[type="tel"], INPUT[type="password"]
{
	border-top:none;
	border-left:none;
	border-right:none;
	padding: 3px 2px 1px;
}

INPUT:focus
{
	background: #DFE;
}
th, td {
    padding: 15px !important;
    text-align: left;
}
th.buy{
	background-color: #7dce7d!important;
}
th.sell{
	background-color:#f76d6d !important;
}





.switch {
  position: relative;
  display: inline-block;
  width: 90px;
  height: 34px;
}

.switch input {display:none;}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ca2222;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2ab934;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(55px);
  -ms-transform: translateX(55px);
  transform: translateX(55px);
}

/*------ ADDED CSS ---------*/
.on
{
  display: none;
}

.on, .off
{
  color: white;
  position: absolute;
  transform: translate(-50%,-50%);
  top: 50%;
  left: 50%;
  font-size: 10px;
  font-family: Verdana, sans-serif;
}

input:checked+ .slider .on
{display: block;}

input:checked + .slider .off
{display: none;}

/*--------- END --------*/

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;}
  
  
  
  
  
.switch {
  position: relative;
  display: inline-block;
  width: 90px;
  height: 34px;
}

.switch input {display:none;}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ca2222;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #5cb85c;
}

input:focus + .slider {
  box-shadow: 0 0 1px #c14c4c;
}

input:checked + .slider:before {
  -webkit-transform: translateX(55px);
  -ms-transform: translateX(55px);
  transform: translateX(55px);
}

/*------ ADDED CSS ---------*/
.on
{
  display: none;
}

.on, .off
{
  color: white;
  position: absolute;
  transform: translate(-50%,-50%);
  top: 50%;
  left: 60%;
  font-size: 16px;
  font-family: Verdana, sans-serif;
}

input:checked+ .slider .on
{display: block;
	left: 40%;
	}

input:checked + .slider .off
{display: none;}

/*--------- END --------*/

/* Rounded sliders */
.slider.round {
  border-radius: 5px;
}

.slider.round:before {
  border-radius: 10%;}
  
  
  
  /* Customize the label (the container) */
.container {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
}

/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.container input:checked ~ .checkmark {
  background-color: #2196F3;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.container .checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}




/* The switch - the box around the slider */
.switch2 {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

/* Hide default HTML checkbox */
.switch2 input {
  opacity: 0;