|
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 !important; |
|
transform: none !important; |
|
} |
|
.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(15, 15, 15); |
|
} |
|
|
|
.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; |
|
} |
|
.SummarizeBtn { |
|
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; |
|
} |
|
} |
|
|