.accordion { background-color:gray; color: white; cursor: pointer; padding: 8px; width: 100%; text-align: left; border: none; outline: none; transition: 0.4s; border-radius: 5px; font-family: Georgia, 'Times New Roman', Times, serif; font-size: 20px; font-style: italic; margin-left: 5px; margin-top: 60px; margin-right: 10px; } /* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */ .active, .accordion:hover { background-color:lightgrey; opacity: 0.7; } /* Style the accordion panel. Note: hidden by default */ .panel { padding: 0 18px; background-color: white; display: none; overflow: hidden; } #pagetitle{ font-family: Georgia, 'Times New Roman', Times, serif; font-size: 30px; text-align:center; padding-top: 30px; align-items: center; justify-content: center; margin-left: 40%; margin-right: -50%; color: white; } #backgroundimg{ display: block; margin-left:50% ; margin-right: 20px; margin-top: 10px; background-color: lightgrey; width:49%; height: 407px; position: absolute; } ul { list-style-type: none; margin: 0; padding: 0; width:100%; height: 50px; overflow: hidden; background-color: #333; position: fixed; z-index:999 } .selectionsProj, .selectionsProjp , .selectionsProjs{ margin-top: 18.5px ; width: 49%; height: 30px; margin-left: 5px ; font-family: Georgia, 'Times New Roman', Times, serif; font-size: 14px; border-radius: 5px; cursor: pointer; box-shadow: 2px 2px 2px gray; } #measurementselectionsid{ margin-top: 18.5px ; width: 99%; height: 30px; margin-left: 5px ; font-family: Georgia, 'Times New Roman', Times, serif; font-size: 14px; border-radius: 5px; cursor: pointer; box-shadow: 2px 2px 2px gray; } #measurementselectionsid:hover{ box-shadow: 4px 4px 4px gray; } .selectionsProj:hover, .selectionsProjp:hover , .selectionsProjs:hover{ background-color: lightgrey; box-shadow: 4px 4px 4px gray; } #measureLabel, #relvDocLabel{ font-family: Georgia, 'Times New Roman', Times, serif; margin-left: 15px ; font-size: 21px; position: absolute; margin-top: 10px; color: black; font-style: italic; } #measureCheckbox, #relvdiv,#saveOPlabel, #saveOP{ /*,.area , .pattern, .border , .length , .match{*/ font-family: Georgia, 'Times New Roman', Times, serif; margin-left: 13px ; margin-top: 20px; font-size: 20px; cursor: pointer; max-width: 50%; } #measureADRbutton{ background-color: #16c72e; border: none; padding: 10px 175px; cursor: pointer; border-radius: 7px; margin-left: 3%; font-family: Georgia, 'Times New Roman', Times, serif; font-size: 16px; color:white; } #measureADRbutton:hover{ background-color:darkseagreen; color:black; } #addicon,#donebutton{ top: 1px; width:30px; height:30px; left:97%; cursor: pointer; } #measureitemsid{ margin-top: 10px ; width: 30%; height: 30px; margin-left: 5px ; font-size: 14px; border-radius: 5px; cursor: pointer; box-shadow: 2px 2px 2px gray; font-family: Georgia, 'Times New Roman', Times, serif; } #measureitemsid:hover{ box-shadow: 4px 4px 4px gray; } #selectionsid{ margin-top: 10px ; width: 68.8%; height: 30px; font-size: 14px; border-radius: 5px; cursor: pointer; box-shadow: 2px 2px 2px gray; font-family: Georgia, 'Times New Roman', Times, serif; } #selectionsid:hover{ box-shadow: 4px 4px 4px gray; } #repeatforloop{ margin-left: 5px ; margin-top: 10px; } #text0,#text1,#text2{ font-size: 14px; width: 31.5%; height: 40px; border-radius: 5px; margin-bottom: 13px; margin-right: 0.2%; font-family: Georgia, 'Times New Roman', Times, serif; } #addmctnameid{ width:35px; height:35px; left: 96.8%; cursor: pointer; position: absolute; border: none; } #doneebackground{ top: 10px; width:30px; height:30px; left: 96%; cursor: pointer; position: relative; background-color: white; border: none; } #radio{ margin-right: 0.2%; position: relative; } #radio:hover{ cursor: pointer; } #radiolbl{ font-family: Georgia, 'Times New Roman', Times, serif; font-size: 16px; position: relative; } #nLevels{ font-family: Georgia, 'Times New Roman', Times, serif; font-size: 16px; position: relative; margin-left: 1%; } #lvlinput{ font-size: 14px; width: 15%; height: 30px; border-radius: 5px; margin-left: 1%; font-family: Georgia, 'Times New Roman', Times, serif; } #color{ margin-top: 1%; margin-left: 1%; box-shadow: 2px 2px 2px gray; } #color:hover{ cursor: pointer; box-shadow: 4px 4px 4px rgb(57, 57, 57); }