Merge branch 'testing' of https://github.com/virtual-labs/exp-free-vi…

…bration-iiith into main

experiment/simulation/css/main.css

@@ -1,31 +1,114 @@
-.page {
-	overflow-x: scroll;
-	overflow-y: scroll;
+.v-datalist-container {
+  min-height: 24.25rem;
+  height: 60vh;
+  width: 100%;
+  margin-left: 0.5rem;
+  margin-right: 0.5rem;
+}/*.page {
+	
+	overflow-y: hidden;
+overflow-x: hidden;
+}*/
+.vr{
+  width:3px;
+  display:table-cell;
+  background-color:black;
+  height:100%;
+
 }
+.v-canvas-container {
+	width: 100%;
+	/*height: 100%;*/
+	/*background-color: #b3ecff;*/
+	border: 0.2rem solid #97d23d !important;
+	border-radius: 25px;
 
-.main {
-	width: 85%;
-	height: 85%;
-	background-color: #A4C652;
 }
 
-.action-button {
-	color: white;
-	text-align: center;
-	background-color: #288EC8;
-	border-radius: 16px;
-	padding: 10px 20px;
-	border: none;
-	font-size: 120%;
+.v-datalist-container {
+	height: 100%;
+}
+
+#container{
+	height: 400px;
+}
+#border-radius{
+	border-radius: 1px;
+}
+#radio-style{
+	justify-content: left;
+	padding: 0.4em;
+	margin-left: 0.4em;
+}
 
+#slider-left{
+	justify-content: left;
 }
 
-.action-button:hover {
-	background-color: #A9A9A9;
+
+
+g {
+	outline-color: solid 10px black;
 }
 
-.graph {
-	margin-left: 7.5%;
+.apparatus {
+	order: 1;
 }
 
+.simulation {
+	order: 2;
+}
+
+.observations {
+	order: 3;
+}
+
+@media screen and (max-width: 1023px) {
+	.apparatus {
+		order: 1;
+	}
+
+	.simulation {
+		order: 3;
+	}
 
+	.observations {
+		order: 2;
+
+	}
+}
+.v-tabs {
+  /*overflow: hidden;
+  border: 1px solid #ccc;*/
+ /* background-color: #f1f1f1;*/
+}
+
+/* Style the tabs inside the tab */
+.v-tabs ul {
+  background-color: inherit;
+  /*float: left;
+  border: none;
+  outline: none;
+  cursor: pointer;
+  padding: 14px 16px;*/
+  transition: 0.3s;
+  font-size: 17px;
+}
+
+/* Change background color of tab on hover */
+.v-tabs ul li:hover {
+  background-color: #fff;
+}
+
+/* Create an active/current tablink class */
+.v-tabs ul li.active {
+  background-color: #fff;
+}
+
+/* Style the tab content */
+.graphcontent {
+  display: none;
+  padding-top: 0px;  
+  padding-left: 76px;
+
+}