/* 右键菜单CSS */
.menu2 {
  display: none;
  position: absolute;
  opacity: 0;
  margin: 0;
  padding: 8px 0;
  z-index: 999;
  box-shadow: 0 5px 5px -3px rgba(0, 0, 0, .2), 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12);
  list-style: none;
  background-color: #ffffff;
  border-radius: 4px;
}

.menu2-item {
  display: block;
  position: relative;
  min-width: 60px;
  margin: 0;
  padding: 6px 16px;
  font: bold 12px sans-serif;
  color: rgba(0, 0, 0, .87);
  cursor: pointer;
}

.menu2-item::before {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  pointer-events: none;
  content: "";
  width: 100%;
  height: 100%;
  background-color: #000000;
}

.menu2-item:hover::before {
  opacity: .04;
}

.menu2 .menu2 {
  top: -8px;
  left: 100%;
}

.show-menu2, .menu2-item:hover > .menu2 {
  display: block;
  opacity: 1;
}
/* 缩放工具 */
.zoomSlider {
  position: absolute;
  padding: 0;
  opacity: .75;
  z-index: 99;
  width: 125px;
  height: 25px;
  top: 0px;
  left: 0px;
}

.zoomButton {
  display: inline-block;
  vertical-align: top;
  text-align: center;
  padding: 0;
  transition: opacity .2s;
}

.zoomRangeContainer {
  display: inline-block;
  vertical-align: top;
  padding: 0;
}

.zoomRangeInput {
  margin: 0;
  padding: 0;
  outline: none;
  transition: opacity .2s;
  background: transparent;
  -webkit-appearance: none;
}

/* Set up additional styling to ensure consistenty across browsers */
.zoomRangeInput::-webkit-slider-runnable-track {
  box-sizing: border-box;
  border: none;
  width: 100%;
  height: 3px;
  background: #ccc;
}
.zoomRangeInput::-moz-range-track {
  box-sizing: border-box;
  border: none;
  width: 100%;
  height: 3px;
  background: #ccc;
}
.zoomRangeInput::-ms-track {
  box-sizing: border-box;
  border: none;
  width: 100%;
  height: 3px;
  background: #ccc;
  color: transparent;
}
.zoomRangeInput::-webkit-slider-thumb {
  -webkit-appearance: none;
  margin-top: -3.33px;
  box-sizing: border-box;
  border: none;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #444;
}
.zoomRangeInput::-moz-range-thumb {
  box-sizing: border-box;
  border: none;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #444;
}
.zoomRangeInput::-ms-thumb {
  margin-top: 0;
  box-sizing: border-box;
  border: none;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #444;
}
.zoomRangeInput::-ms-tooltip,
.zoomRangeInput::-ms-fill-lower,
.zoomRangeInput::-ms-fill-upper {
  display: none;
}
.code{
    line-height:20px;
    overflow: hidden;
    max-height: 30px;
    white-space: pre-wrap;
    display: none;
}
body{
    margin:0px;
    content-zooming:none;
    font-family: arial;
}
input {
    font-size: 20px;
}

select {
    font-size: 20px;
}
textarea {
    font-size: 20px;
}
button.btnDelete {
    border-radius: 8px;
    background-color: #f44336;
    font-size: 22px;
    padding: 2px 8px;
}
table1 thead {
    background-color: #33aaff;
    color: yellow;
}
/* drag objects */
.redips-drag {
    cursor: move;
    margin: auto;
    background-color: white;
    text-align: center;
    font-size: 22pt; 
	padding:1px;
    height: 35px;
    line-height: 35px;
	position: relative;display: inline-block;
    /* round corners */
    border-radius: 12px; /* Opera, Chrome */
    -moz-border-radius: 4px; /* FF */
    -webkit-user-select: none;
}


.fa {
	color:#33aa33;
}

.content a {
    font-size:22px;
}

/* tables */
table.drag {
    background-color: #ddd;
    border-collapse: collapse;
    margin: 0px;
}
table#table2 td{
    width:120px;
}
table.drag td {
    border: 1px white solid;
    height: 50px;
    line-height:0px;
    text-align: center;
    font-size: 10pt;
    -webkit-user-select: none;
}
 
table.login td {
    border: 0px white solid;
	
	height: 20px;
	
    text-align: center;
    font-size: 10pt;
}
 

/* 编辑 */
div.edit{
	padding-top: 7px;	
	padding-right: 7px;
	position: absolute;
	right: 0;
	top: 0;
	display: none;
}
div.redips-drag:hover .edit {
	display: block;
}

table.link {
    border-collapse: collapse;
	width:100%;
	height:100%;
    margin: 0px;
}
table.link td {
    border: 0px blue solid;
	height: 20px;
    text-align: center;
    font-size: 10pt;
}


/* green objects */
.green {
    border: 2px solid #499B33;
}


a {
    font-size:16px;
    white-space: nowrap;
}

/* drag objects (DIV inside table cells) */
.redips-drag {
	cursor: move;
	margin: auto;
	z-index: 10;
	text-align: center;
	font-size: 16pt; /* needed for cloned object */
	opacity: 0.7;
	filter: alpha(opacity=70);
	/* without width, IE6/7 will not apply filter/opacity to the element ?! */
	/* IE needs element layout */
	width: 200px;
	height: 35px;
	line-height: 35px;
}


/* tables */
div#redips-drag table {
	border-collapse: collapse;
	/* center tables */
	margin: 0px auto;
}
		/* timetable */
		div#redips-drag #table2 {
			/* align table to the right */
			margin-left: auto;
			width: 430px;
		}


/* table cells */
div#redips-drag table td,th {
	border-style: double;
	height: 50px;
	text-align: center;
	font-size: 10pt;
}

/* td */
div#redips-drag table td {
    border-color: #DDC5B5;
    font-weight: normal;
}

/* th */
div#redips-drag table th {
    border-width: 3px 0px 0px 3px;
    border-color: #DDC5B5;
    font-weight: normal;
}

/* upper right cell */
div#redips-drag table .upper_right {
    border-width: 0px;
}

/* lower left cell */
div#redips-drag table .lower_left {
    border-width: 0px;
}



/* 积木颜色 */
.drag_green {
    border: 2px solid #499B33;
    background-color: #499B33;
}

.drag_orange {
    border: 2px solid #BF6A30;
    background-color: #FFAA30;
}

.drag_blue {
    border: 2px solid #306ABF;
}

.drag_red {
    border: 2px solid #FF7799;
    background-color: #FF77AA;
}

/* drag container */
#main_container {
    margin: auto;
    width: 99%;
}
/* container for left and right div */
#redips-drag {
    /* make it visible */
    border: 0px dashed SteelBlue;
    width: 100%;
    height: 700px;
    padding: 3px;
}

/* container for the left table */
#main_container #left {
    width: 880px;
    height: 710px;
    float: left;
    margin-right: 20px;
    /* make it visible */
    border: 0px solid SlateGray;
    background-color: #eee;
}
/* container for the right table */
#main_container #middle {
    width: 260px;
    height: 700px;
    float: left;
    /* make it visible */
    border: 0px solid SlateGray;
    background-color: #eee;
}
/* container for the right table */
#main_container #right {
    width: 150px;
    height: 700px;
    float: right;
    /* make it visible */
    border: 0px solid SlateGray;
    background-color: #eee;
}


/* make left and right DIV container scrollable */
#main_container #left,#right,#middle{
                overflow: auto;
    position: relative;
}
.redips-row {
    width: 20px;
    margin: 2px;
    border: 2px solid LightBlue;
    background-color: SteelBlue;
    border-radius: 14px;
    -moz-border-radius: 14px;
}
.redips-rowhandler {
    background-color: #76ACDA;
}
.redips-row {
    width: 20px;
    margin: 2px;
    border: 2px solid LightBlue;
    background-color: SteelBlue;
    border-radius: 14px;
    -moz-border-radius: 14px;
}
.redips-rowhandler {
    background-color: #76ACDA;
}
textarea {
    font-size: 20px;
    font: 20px/normal 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace;
}
input {
    font-size: 16px;
}
select option[value="yellow"] {
  background: yellow;
}
select option[value="orange"] {
  background: orange;
}


select option[value="rgb(149, 225, 211)"] {
  background: rgb(149, 225, 211);
}

select option[value="rgb(172, 255, 89)"] {
  background: rgb(172, 255, 89);
}
.link {
    font-size: 12px;
}