static/style.css

h1{

margin:0;
}

h3{
color:  #5b2c6f;
}

b{
color:  #5b2c6f;
}



div[class = "flex-container"]{
display : flex;
flex-direction: row;

}


div[id = "actual map"]{
margin-top: 10px;
}

div[id = "floor plan"]{
margin-top: 10px;
}

.flex-container > div[class = "column1"]{
display : flex;
flex-direction: row;
flex-wrap: wrap;
width: 75%;
height: 100%;
text-align: center;
background-color: grey;
margin-right: 10px;
margin-left: 1px;
margin-bottom : 10px;
}

.flex-container > div[class = "column2"]{
width: 25%;
height: 100%;
text-align: center;
background-color:  #b3b6b7;
margin-right: 10px;

}

.column1 > div[id = "googleMap"]{


  width : 50%;
  height : 250px;
  'margin-right: 1px;
  padding: 10px;
  'border: 3px solid grey;
}



.column1 > div[id = "maps"]{
  width : 50%;
  height : 250px;
  'margin-right: 1px;
  padding: 10px;
  'border: 3px solid grey;
}

.column1 > div[id = "map2"]{
  width : 50%;
  height : 250px;
  'margin-right: 1px;
  padding: 10px;
  'border: 3px solid grey;
}


img[id= "map"] {
  border: 5px solid #ddd;


  'padding-right: 1px;
  padding-left: 5px;

  padding-top: 5px;
  width: 360px;
  height: 200px;
  left-margin: 50px;
}

img[id= "map2"] {
  border: 5px solid #ddd;
  'padding-right: 1px;
  padding-left: 5px;

  padding-top: 5px;
  width: 360px;
  height: 200px;
  right-margin: 50px;
}


div[id = "camdiv"]{


}

img[id= "cam0"] {
  border: 5px solid #ddd;

  'padding-right: 1px;
  padding-left: 5px;
  'padding-bottom: 5px;
  padding-top: 5px;
  width: 290px;
  height: 130px;
  margin-left: 50px;

  'background-color: #ddd;
}

img[id= "cam1"] {
  border: 5px solid #ddd;
  'border-radius: 5px;
  'padding-right: 1px;
  'padding-left: 1px;
  'padding-bottom: 5px;
  padding-top: 5px;
  width: 290px;
  height: 130px;

  'background-color: #ddd;
}

img[id= "cam2"] {
  border: 5px solid #ddd;
  'border-radius: 5px;
  'padding-right: 1px;
  'padding-left: 1px;
  'padding-bottom: 5px;
  padding-top: 5px;
  width: 290px;
  height: 130px;
  'background-color: #ddd;

}

img[id= "alt0"] {
  border: 5px solid #ddd;
  'padding-right: 1px;
  padding-left: 5px;
  'padding-bottom: 5px;
  padding-top: 5px;
  margin-left: 50px;
  width: 290px;
  height: 130px;



  'background-color: #ddd;
}

img[id= "alt1"] {
   border: 5px solid #ddd;
  'border-radius: 5px;
  'padding-right: 1px;
  'padding-left: 1px;
  'padding-bottom: 5px;
  padding-top: 5px;
  width: 290px;
  height: 130px;

  'background-color: #ddd;
}

img[id= "alt2"] {
  border: 5px solid #ddd;
  'border-radius: 5px;
  'padding-right: 1px;
  'padding-left: 1px;
  'padding-bottom: 5px;
  padding-top: 5px;
  width: 290px;
  height: 130px;
  'background-color: #ddd;

}
input[name = "enter"]{
  margin-top: 20px;
  margin-bottom: 20px;
  padding: 5px;
  width: 100px;
  height: 40px;
}

button[name = "reset"]{
margin-top: 20px;
  margin-bottom: 20px;
  padding: 5px;
  width: 100px;
  height: 40px;
}