home background image to webp

src/main/resources/static/css/master.css

@@ -1,121 +1,101 @@
-/* .myClass {
-	color: red;
-} */
-
-
-/* https://arcusiridis.com/images/background.jpg */
-
 body {
-    background: #333;
-    color: #ffffff;
-    /* background-image: url('https://bluestnight.com/images/background_lg.jpg'); */
+  background: #333;
+  color: #ffffff;
 }
 
-
-/* #body-container {
-	margin: 0 auto 0 auto;
-	max-width: 80%;
-	vertical-align: auto; 
-} 
-*/
-
 input[type="radio"] {
-    /*position:fixed;*/
-    opacity: 0;
+  opacity: 0;
 }
 
-input[type=radio]+label {
-    font-weight: normal;
+input[type="radio"] + label {
+  font-weight: normal;
 }
 
-input[type=radio]:checked+label {
-    font-weight: bold;
-    background-color: #566069;
+input[type="radio"]:checked + label {
+  font-weight: bold;
+  background-color: #566069;
 }
 
-input[type=radio]:focus+label {
-    border: 1px dotted #000;
+input[type="radio"]:focus + label {
+  border: 1px dotted #000;
 }
 
 #home-section {
-    background-image: url('../img/home.jpg');
-    background-repeat: no-repeat;
-    background-size: cover;
-    background-attachment: fixed;
-    min-height: 900px;
-    height: auto;
+  background-image: url("../img/home.webp");
+  background-repeat: no-repeat;
+  background-size: cover;
+  background-attachment: fixed;
+  min-height: 900px;
+  height: auto;
 }
 
 #home-section .home-inner {
-    padding-top: 75px;
-    /* padding-bottom: 10px; */
-    /* background: #333; */
+  padding-top: 75px;
+  /* padding-bottom: 10px; */
+  /* background: #333; */
 }
 
-
 /* #home-section .card-form {
     opacity: 0.8;
 } */
 
 #home-section .dark-overlay {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    min-height: 900px;
-    background: rgba(0, 0, 0, 0.7);
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  min-height: 900px;
+  background: rgba(0, 0, 0, 0.7);
 }
 
 #chat-section {
-    /* background-image: url('../img/home.jpg'); */
-    background: #495561;
-    /* background-repeat: no-repeat;
+  /* background-image: url('../img/home.jpg'); */
+  background: #495561;
+  /* background-repeat: no-repeat;
     background-size: cover;
     background-attachment: fixed; */
-    min-height: 500px;
+  min-height: 500px;
 }
 
 #chat-section .chat-inner {
-    padding-top: 75px;
-    /* background: #333; */
+  padding-top: 75px;
+  /* background: #333; */
 }
 
 #chat-section .dark-overlay {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    min-height: 600px;
-    /* background: rgba(0, 0, 0, 0.7); */
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  min-height: 600px;
+  /* background: rgba(0, 0, 0, 0.7); */
 }
 
 textarea {
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
-    box-sizing: border-box;
-    width: 100%;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  width: 100%;
 }
 
 #chatTextArea {
-    min-height: 300px;
+  min-height: 300px;
 }
 
-
 /* .container {
     width: 50%;
 } */
 
 .my-form-inputs {
-    width: 80%;
+  width: 80%;
 }
 
-
 /* #login-card {
     width: 40%;
 } */
 
 @media only screen and (max-width: 600px) {
-    /* #login-card {
+  /* #login-card {
         width: 90%;
     } */
-}
+}