* {padding:0;margin:0;}
#container {
    margin: 10px auto;
    width: 95%;
    background-color: #eeeeee;
    border-top:1px solid black;
    border-right:1px solid black;
    border-left:1px solid black;
    border-bottom:1px solid black;
    border-radius:3px;
    box-shadow: 4px 4px 10px -2px rgba(0,0,0,0.75);
}
form {
    /*width: 600px;*/
    margin: 0 auto;
    text-align:center;
}
textarea {
    width: 60em;
    border:1px solid black;
    padding:2px;
    margin-top: 5px;
    border-radius:3px;
    box-shadow: 4px 4px 10px -2px rgba(0,0,0,0.75);
}
#nm:focus {
    outline: none !important;
    border: 2px solid #336600;;
    border-color: green;
    /* box-shadow: 0 0 10px #719ECE; */
    background-color: #ffffea;;
    box-shadow: 4px 4px 10px -2px rgba(0,0,0,0.75);
}
select {
    font-size:1.1em;
    background-color:#ffffff; 
    border-radius:3px;
    box-shadow: 4px 4px 10px -2px rgba(0,0,0,0.75);
    text-indent: 5px;
}
#box {border:0 solid black;width: 25em;margin:0 auto;padding-bottom:2px;}
body {
  font-family: helvetica, arial, sans-serif;
  /*font-size: 16px;*/
  /*font-weight: 400;*/
  /*text-rendering: optimizeLegibility;*/
}
table {
  background: white;
  border-radius:3px;
  border-collapse: collapse;
 /* height: 320px;*/
  margin: auto;
  /*padding:5px;*/
  /* box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1); */
  box-shadow: 4px 4px 10px -2px rgba(0,0,0,0.75);
  animation: float 5s infinite;
}
th {
  color:#ffffff;;
  background:#464637;
  border-bottom:4px solid #9ea7af;
  border-right: 1px solid #343a45;
  /*font-size:1em;*/
  /*font-weight: 100;*/
  padding:5px;
  text-align:left;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  vertical-align:middle;
}

th:first-child {
  border-top-left-radius:3px;
}

th:last-child {
  border-top-right-radius:3px;
  border-right:none;
}

tr {
  border-top: 1px solid #C1C3D1;
  border-bottom-: 1px solid #C1C3D1;
  color:black;/*#666B85;*/
  /*font-weight:normal;*/
  text-shadow: 0 1px 1px rgba(256, 256, 256, 0.1);
}

tr:hover td {
  background:#686859;
  color:#FFFFFF;
  border-top: 1px solid #22262e;
  border-bottom: 1px solid #22262e;
}

tr:first-child {
  border-top:none;
}

tr:last-child {
  border-bottom:none;
}

tr:nth-child(odd) td {
  background: #e6e6e6;/*#dddddd;*/
}

tr:nth-child(odd):hover td {
  background:#686859;
}

tr:last-child td:first-child {
  border-bottom-left-radius:3px;
}

tr:last-child td:last-child {
  border-bottom-right-radius:3px;
}

td {
  background:#FFFFFF;
  padding:0 5px 0 2px;
  text-align:left;
  vertical-align:middle;
  /*font-weight:300;*/
  /*font-size:1em;*/
  text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.1);
  border-right: 1px solid #C1C3D1;
}
#firstitem {color: red;}
        /* ttable {border: 1px solid black;}
            thead {background-color: #F1D4AF;}
            th, td {padding: 0 10px 0 0;}
            tbody tr:nth-child(odd){background-color: lightyellow;}
            tbody tr:nth-child(even){background-color: lightgray;}*/
/* .countx {color: red;} */
#left-label {
    float:left;
    clear: left;
    padding-left:10px;
}
#right-label {
    float:right;
    clear: right;
    padding-right:10px;
}

footer, footer p {
    background-color: lightgray; 
    font-size: .85em;
    text-align: left;
    padding: 1px;
}
/* customized button */
.myButton {
	/* box-shadow:inset 0px -3px 7px 0px #29bbff; */
    box-shadow: 4px 4px 10px -2px rgba(0,0,0,0.75);
	background:linear-gradient(to bottom, #73b9ff 5%, #0688fa 100%);
	/*background-color:#2dabf9;*/
	border-radius:3px;
	border:1px solid #0b0e07;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:15px;
	/* padding:9px 23px; */
	padding:3px;
	text-decoration:none;
	text-shadow:0px 1px 0px #263666;
    
    /* padding:7px;  */
    margin-bottom:5px; 
    margin-top:5px;
    margin-right: 2px;
    margin-left: 2px;
    width: 100px;
}
.myButton:hover {
	background:linear-gradient(to bottom, #0688fa 5%, #2dabf9 100%);
	background-color:#0688fa;
}
.myButton:active {
	position:relative;
	top:1px;
}
/* customized Run SQL button */
#exe {
    box-shadow: 4px 4px 10px -2px rgba(0,0,0,0.75);
	background:linear-gradient(to bottom, #006600 5%, #00b32d 100%);
	border-radius:3px;
	border:1px solid #0b0e07;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:15px;
	/* padding:9px 23px; */
	padding:3px;
	text-decoration:none;
	text-shadow:0px 1px 0px #264D36;
    
    /* padding:7px;  */
    margin-bottom:5px; 
    margin-top:5px;
    margin-right: 2px;
    margin-left: 2px;
    width: 100px;
}
#exe:hover {
	background:linear-gradient(to bottom, #468c00 5%, #00d9a3 100%);
	background-color:#00d936;
}
#exe:active {
	position:relative;
	top:1px;
}
/* customized Constraint button */
/* #constraints { */
    /* box-shadow: 4px 4px 10px -2px rgba(0,0,0,0.75); */
	/* background:linear-gradient(to bottom, #888888 5%, #222222 100%); */
	/* border-radius:3px; */
	/* border:1px solid #0b0e07; */
	/* display:inline-block; */
	/* cursor:pointer; */
	/* color:#ffffff; */
	/* font-family:Arial; */
	/* font-size:15px; */
	/* padding:3px; */
	/* text-decoration:none; */
	/* text-shadow:0px 1px 0px #264D36; */
    
    /* margin-bottom:5px;  */
    /* margin-top:5px; */
    /* margin-right: 2px; */
    /* margin-left: 2px; */
    /* width: 100px; */
/* } */
/* #constraints:hover { */
	/* background:linear-gradient(to bottom, #222222 5%, #aaaaaa 100%); */
	/* background-color:#222222; */
/* } */
/* #constraints:active { */
	/* position:relative; */
	/* top:1px; */
/* } */

textarea {width: 70%; height: 250px;}

@media only screen and (max-width: 600px) {

    .myButton,
    #exe {
        width: 35%;
        margin: 1%;
        box-sizing: border-box;
    }
}