styles.css

/*
	WebPlotDigitizer - http://arohatgi.info/WebPlotDigitizer
	
	Copyright 2010-2014 Ankit Rohatgi <ankitrohatgi@hotmail.com>

	This file is part of WebPlotDigitizer.

    WebPlotDigitizer is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    WebPlotDigitizer is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with WebPlotDigitizer.  If not, see <http://www.gnu.org/licenses/>.


*/
html {
	height:100%;
	width:100%;
	padding:0;
	margin:0;
}

body {
	margin: 0;
	padding: 0;
	width: 100%;
	height:100%;
	font: 14px Verdana, sans-serif;
    line-height: 150%; 
	background: white;
    overflow: hidden;
}

tr,td {
	margin:0;
	padding:0;
}

#allContainer {
    width: 100%;
    height: 100%;
    margin-left: 5px;
}

#mainContainer {
    float: left;
}

#topContainer {
    width: 100%;
    height: 40px;
}

#menuButtonsContainer {
    padding-top: 4px;
    padding-left: 5px;
    padding-right: 5px;
    display: inline-block;
}

#topToolbarContainer {
    display: inline-block;
}

#graphicsContainer {
    overflow: auto;
}

#sidebarContainer {
    float: right;
    width: 270px;
    height: 100%;
}

#canvasDiv {
	height:400px; /* temporary */
    width:600px; /* temporary */
	background: white;
	padding:0;
	margin:0;
}

#mainCanvas {
	background: white;
}

#canvasDiv:hover {
	cursor: crosshair;
}

.canvasLayers {
	background: transparent;
    position: absolute;
    top: 0px;
    left: 0px;
}

.zoomLayers {
    border: thin grey solid;
    margin: 0;
    padding: 0;
}

#zoomDiv {
	margin:0px;
	margin-bottom:5px;
	padding:0px;
	width:251px;
	text-align:center;
}

#cursorPosition {
    padding:0px 0px;
	margin:0;
	margin-top:-5px;
	background:white;
	width:250px;
	top:0px;
	font-size:12px;
	text-align:center;
}

select {
	height: 20px;
	font-size:13px;
	font-family: Verdana, Sans Serif;
	border: thin grey solid;
}

.standardToolbar {
	height:25px;
	padding: 0 0px;
	margin: 0 0px;
}

.toolbar {
    padding: 0 10px;
    margin: 0;
    height: 25px;
    position: absolute;
    top:-15px;
    left:5px;
    visibility: hidden;
    z-index:4;
}

.toolbar p { padding:0; margin:0; }

.popupheading {
    font-size:14px;
    text-align: left;
    cursor: move;
    background-color: gold;
    color: black;
    margin:0 -5px 0 -5px;
    padding: 5px;
}

.popup {	
	padding:0px 5px 12px 5px;
	margin:0;
	border: thin #444444 solid;
	background:white;
	z-index:100;
	position:absolute;
	top:0;
	left:0;
	visibility:hidden;
}

.popup p { padding:0; margin: 5px 5px;}

.popup-drag-mask {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: none;
    z-index: 5000;
    display: none;
}

.sidebar-title {
    padding-bottom: 10px;
    font-weight: bold;
}

.sidebar {
	padding:0px 0px;
	margin:0;
	background:white;
	width:250px;
	display: none;
	font-size:13px;
    overflow: auto;
}

.sidebar p { padding: 0; margin: 1px 1px; font-size:13px;}

.footnote {font-size: 10px;}

.leftIndent {margin-left:10px;}

#zoom-settings-container {
    position: absolute;
    top: 5px;
    right: 20px;
    z-index: 3;
}

#zoom-settings-button {
    width: 20px;
    height: 20px;
    font-size:14px;
    padding: 0px;
}

.colorOptionBox {
    display: inline-block;
    height: 20px;
    width: 20px;
    border: thin black solid;
    margin-left: 5px;
}

.largeColorBox {
    display: inline-block;
    height:40px;
    width: 40px;
    border: thin black solid;
}

#wait {
    position:absolute; 
    top:0px; 
    left:300px; 
    background: #666666; 
    color: lightgreen; 
    width:200px; 
    margin: 0px; 
    display:inline-block;
    padding: 0px; 
    z-index:100;
}

#wait p {
    margin: 3px;
    padding: 0px;
}