Spaces:
Sleeping
Sleeping
body{ | |
background-image:url("../static/Images/Background.jpg"); | |
background-repeat: no-repeat; | |
background-size: cover; | |
} | |
:root { | |
--dl-color-gray-500: #595959; | |
--dl-color-gray-700: #999999; | |
--dl-color-gray-900: #d9d9d9; | |
--dl-size-size-large: 144px; | |
--dl-size-size-small: 48px; | |
--dl-color-danger-300: #a22020; | |
--dl-color-danger-500: #bf2626; | |
--dl-color-danger-700: #e14747; | |
--dl-color-gray-black: #000000; | |
--dl-color-gray-white: #ffffff; | |
--dl-size-size-medium: 96px; | |
--dl-size-size-xlarge: 192px; | |
--dl-size-size-xsmall: 16px; | |
--dl-space-space-unit: 16px; | |
--dl-color-primary-100: #003eb3; | |
--dl-color-primary-300: #0074f0; | |
--dl-color-primary-500: #14a9ff; | |
--dl-color-primary-700: #85dcff; | |
--dl-color-success-300: #199033; | |
--dl-color-success-500: #32a94c; | |
--dl-color-success-700: #4cc366; | |
--dl-size-size-xxlarge: 288px; | |
--dl-size-size-maxwidth: 1400px; | |
--dl-radius-radius-round: 50%; | |
--dl-space-space-halfunit: 8px; | |
--dl-space-space-sixunits: 96px; | |
--dl-space-space-twounits: 32px; | |
--dl-radius-radius-radius2: 2px; | |
--dl-radius-radius-radius4: 4px; | |
--dl-radius-radius-radius8: 8px; | |
--dl-space-space-fiveunits: 80px; | |
--dl-space-space-fourunits: 64px; | |
--dl-space-space-threeunits: 48px; | |
--dl-space-space-oneandhalfunits: 24px; | |
} | |
.button { | |
color: var(--dl-color-gray-black); | |
display: inline-block; | |
padding: 0.5rem 1rem; | |
border-color: var(--dl-color-gray-black); | |
border-width: 1px; | |
border-radius: 4px; | |
background-color: var(--dl-color-gray-white); | |
} | |
.input { | |
color: var(--dl-color-gray-black); | |
cursor: auto; | |
padding: 0.5rem 1rem; | |
border-color: var(--dl-color-gray-black); | |
border-width: 1px; | |
border-radius: 4px; | |
background-color: var(--dl-color-gray-white); | |
} | |
.textarea { | |
color: var(--dl-color-gray-black); | |
cursor: auto; | |
padding: 0.5rem; | |
border-color: var(--dl-color-gray-black); | |
border-width: 1px; | |
border-radius: 4px; | |
background-color: var(--dl-color-gray-white); | |
} | |
.list { | |
width: 100%; | |
margin: 1em 0px 1em 0px; | |
display: block; | |
padding: 0px 0px 0px 1.5rem; | |
list-style-type: none; | |
list-style-position: outside; | |
} | |
.list-item { | |
display: list-item; | |
} | |
.teleport-show { | |
display: flex ; | |
transform: none ; | |
} | |
.Heading { | |
font-size: 32px; | |
font-family: Inter; | |
font-weight: 700; | |
line-height: 1.15; | |
text-transform: none; | |
text-decoration: none; | |
} | |
.Content { | |
font-size: 16px; | |
font-family: Inter; | |
font-weight: 400; | |
line-height: 1.15; | |
text-transform: none; | |
text-decoration: none; | |
} | |
body { | |
margin: 0; | |
padding: 0; | |
font-family: Arial, sans-serif; | |
} | |
.container { | |
white-space: nowrap; | |
display: flex; | |
align-items: center; | |
justify-content: center; | |
max-width: 1000px; | |
margin: auto; | |
margin-top: 0px; | |
overflow: hidden; | |
margin-top: 50px; | |
} | |
.box { | |
height: 500px; | |
width: 570px; | |
background-color: #f2f2f2; | |
overflow-y: scroll; | |
border: 1px solid gray; | |
display: inline-block; | |
border-radius: 6px; | |
} | |
.box1 { | |
height: 500px; | |
width: 570px; | |
background-color: #f2f2f2; | |
overflow-y: scroll; | |
border: 1px solid gray; | |
display: inline-block; | |
border-radius: 6px; | |
} | |
.box::-webkit-scrollbar { | |
width: 10px; | |
height: 10px; | |
} | |
.box::-webkit-scrollbar-track { | |
background-color: #f2f2f2; | |
} | |
.box::-webkit-scrollbar-thumb { | |
background-color: #888; | |
border-radius: 5px; | |
} | |
.box::-webkit-scrollbar-thumb:hover { | |
background-color: #555; | |
} | |
.box1::-webkit-scrollbar { | |
width: 10px; | |
height: 10px; | |
} | |
.box1::-webkit-scrollbar-track { | |
background-color: #f2f2f2; | |
} | |
.box1::-webkit-scrollbar-thumb { | |
background-color: #888; | |
border-radius: 5px; | |
} | |
.box1::-webkit-scrollbar-thumb:hover { | |
background-color: #555; | |
} | |
.textarea { | |
height: 100%; | |
width: 100%; | |
padding: 10px; | |
box-sizing: border-box; | |
border: none; | |
font-size: 16px; | |
resize: none; | |
} | |
.textarea1 { | |
height: 100%; | |
width: 100%; | |
padding: 10px; | |
box-sizing: border-box; | |
border: none; | |
font-size: 16px; | |
resize: none; | |
} | |
.title { | |
text-align: center; | |
padding: 20px; | |
font-size: 62px; | |
font-weight: bold; | |
color: rgb(10, 10, 10); | |
} | |
.message { | |
text-align: center; | |
padding: 0px; | |
font-size: 24px; | |
color: rgb(92, 88, 88); | |
margin-top: -30px; | |
} | |
.logo { | |
height: 250px; | |
width: 250px; | |
margin-right: 150px; | |
} | |
.home-image { | |
max-width: 100%; | |
max-height: 100%; | |
} | |
.ClearBtn { | |
display: flex; | |
justify-content: center; | |
align-items: center; | |
background-color: whitesmoke; | |
color: black; | |
padding: 20px 30px; | |
border: none; | |
border-radius: 5px; | |
font-size: 20px; | |
cursor: pointer; | |
margin-left:-20px; | |
width: 110px; | |
height: 40px; | |
border: 1px solid black; | |
margin-left: 0px; | |
display: flex; | |
justify-content: center; | |
align-items: center; | |
text-align: center; | |
margin-top: 15px; | |
} | |
.ViewBtn { | |
width: 150px; | |
height: 40px; | |
display: flex; | |
justify-content: center; | |
align-items: center; | |
background-color: #555; | |
color: #fff; | |
padding: 20px 30px; | |
border: none; | |
border-radius: 5px; | |
font-size: 20px; | |
cursor: pointer; | |
display: flex; | |
justify-content: center; | |
align-items: center; | |
text-align: center; | |
margin-left: 800px; | |
margin-top: -40px; | |
margin-right:-20px; | |
width: 150px; | |
height: 40px; | |
} | |
.GenerateBtn { | |
width: 150px; | |
height: 40px; | |
display: flex; | |
justify-content: center; | |
align-items: center; | |
background-color: #555; | |
color: #fff; | |
padding: 20px 30px; | |
border: none; | |
border-radius: 5px; | |
font-size: 20px; | |
cursor: pointer; | |
display: flex; | |
justify-content: center; | |
align-items: center; | |
text-align: center; | |
margin-left: 1000px; | |
margin-top: -40px; | |
margin-right:-20px; | |
width: 150px; | |
height: 40px; | |
} | |
.BackBtnContainer { | |
display: flex; | |
justify-content: end; | |
align-items: end; | |
padding: 0 20px; | |
margin-top: 20px; | |
} | |
.BackBtn { | |
background-color: #555; | |
color: #fff; | |
padding: 10px 20px; | |
border: none; | |
border-radius: 5px; | |
font-size: 16px; | |
cursor: pointer; | |
margin-right: 150px; | |
width: 110px; | |
height: 40px; | |
} | |
@media screen and (max-width: 600px) { | |
.box { | |
height: 400px; | |
width: 90%; | |
margin: 10px auto; | |
} | |
} | |