body{
    TEXT-ALIGN: center;
    BACKGROUND-COLOR: #ccffff;
    FONT-STYLE: italic;
    FONT-FAMILY: Tahoma;
    COLOR: #1207fb;
	max-width: 100%;
	-webkit-box-pack: centre;
	-ms-flex-align: centre;
}
html
{
    SCROLLBAR-FACE-COLOR : #ccffff;
    SCROLLBAR-ARROW-COLOR : #ccffff;
    SCROLLBAR-TRACK-COLOR : #ccffff;
	scrollbar-Shadow-Color: #1207fb;
}
::-webkit-scrollbar {
    width: 15px;
}
::-webkit-scrollbar-face {
 	background: #ccffff;
}
::-webkit-scrollbar-track {
 	background: #ccffff;
}
::-webkit-scrollbar-arrow {
 	background: #ccffff;
}
::-webkit-scrollbar-shabow {
 	background: #ccffff;
}
::-webkit-scrollbar-thumb:window-inactive {
	background: rgba(250,85,4,0.4); 
}
 ::-webkit-scrollbar-thumb {
    border-radius: 10px;
	background: #ccffff;
	border: 1px solid #1207fb;
}
*{
	margin:0px;
	padding:0px;
}

/*div to clear both eliments*/
.clear{
	clear:both;
}

.scroll{
	HEIGHT: 400px;
	OVERFLOW: auto;
}
header,footer,nav,section{
	display:flex;
	display:-moz-flex;
	display:-webkit-flex;
	justify-content:center;
}
footer{
	height: 350px;
}
nav  li{
	display:inline-flex;
	display:-moz-inline-flex;
	display:-webkit-inline-flex;
	justify-content:center;
}
article  li{
	display:inline-flex;
	display:-moz-inline-flex;
	display:-webkit-inline-flex;
	justify-content:center;
}
header li{
	padding:5px; /*top left bottom right*/
	list-style-type:none;
}

#button{
	margin:0px 5px 10px 5px;
}

section{
	flex-direction:row;
	-moz-flex-direction:row;
	-webkit-flex-direction:row;
	flex:1;
	-moz-flex:1;
	-webkit-flex:1;
	justify-content:center;	
}
article{
	flex:6
	-moz-flex:6;
	-webkit-flex:6;
	order:2;
	-moz-order:2;
	-webkit-order:2;
	justify-content:center;
	border:5;
}
aside{
	flex:4;
	-moz-flex:4;
	-webkit-flex:4;
	order:1;
	-moz-order:1;
	-webkit-order:1;
	justify-content:center;
}
#dhtmltooltip{
	position: absolute;
	left: -300px;
	width: 300px;
	border: 1px solid black;
	padding: 2px;
	background-color: lightyellow;
	visibility: hidden;
	z-index: 100;
	/*Remove below line to remove shadow. Below line should always appear last within this CSS*/
	filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135);
}
#dhtmlpointer{
	position:absolute;
	left: -300px;
	z-index: 101;
	visibility: hidden;
}
.flex-container {
	display: -webkit-flex;
	display: flex;
	width: 400px;
	height: 250px;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}
.flex-item {
	width: 170px;
	height: 120px;
	margin: 10px;
	}
.flex-item1 {
	width: 300px;
	height: 20px;
	margin: 10px;
}
.flex-item2 {
	width: 200px;
	height: 190px;
}