Spaces:
Running
Running
html { | |
height: 100%; | |
} | |
body { | |
height: 100%; | |
margin: 0px; | |
} | |
.center .description .clock { | |
color: #000000; | |
font-size: 20px; | |
padding-top: 5px; | |
padding-bottom: 5px; | |
} | |
.center { | |
font-family: 'Montserrat', sans-serif; | |
text-align: center; | |
margin: 0px; | |
width: 100%; | |
color: #222; | |
z-index: 1; | |
padding-top: 150px; | |
} | |
.center h1 { | |
font-size: 4rem; | |
} | |
.center .description { | |
font-family: monospace; | |
line-height: 22px; | |
font-size: 18px; | |
width: 370px; | |
margin: auto; | |
margin-top: 10px; | |
margin-bottom: 25px; | |
} | |
.center .description a { | |
text-decoration: none; | |
color: #111; | |
text-style: bold; | |
} | |
.select { | |
display: inline-block; | |
margin-right: 10px; | |
position: relative; | |
} | |
select { | |
transition: background-color 200ms ease; | |
font-size: 14px; | |
padding: 10px; | |
-webkit-appearance: none; | |
-moz-appearance: none; | |
appearance: none; | |
box-sizing: border-box; | |
border-radius: 3px; | |
font-family: monospace; | |
padding-right: 30px; | |
position: relative; | |
outline: 0px; | |
background: #fff; | |
cursor: pointer; | |
} | |
.select:after { | |
content: "▼"; | |
padding: 14px 8px; | |
position: absolute; | |
right: 13px; | |
top: 0; | |
z-index: 1; | |
text-align: center; | |
width: 10%; | |
height: 100%; | |
pointer-events: none; | |
box-sizing: border-box; | |
font-size: 9px; | |
} | |
button { | |
transition: background-color 200ms ease; | |
font-size: 14px; | |
padding: 10px 12px; | |
-webkit-appearance: none; | |
-moz-appearance: none; | |
appearance: none; | |
box-sizing: border-box; | |
border-radius: 3px; | |
border: 1px solid #aaa; | |
background: #fff; | |
font-family: monospace; | |
cursor: pointer; | |
outline: 0px; | |
} | |
button:hover, | |
select:hover { | |
background-color: #eee; | |
} | |
.center .links { | |
padding-top: 10px; | |
font-family: monospace; | |
letter-spacing: 0.3px; | |
font-size: 14px; | |
} | |
.center .links a { | |
text-decoration: none; | |
margin-left: 0px; | |
margin-right: 100px; | |
color: #111; | |
} | |
.center .links a:hover { | |
text-decoration: underline; | |
} | |
.center .grid { | |
display: grid; | |
column-gap: 50px; | |
} | |
.center .grid hr { | |
border-top: 1px dashed gray; | |
} | |
.center .grid-item { | |
font-family: monospace; | |
letter-spacing: 0.3px; | |
font-size: 14px; | |
padding-bottom: 20px; | |
} | |
.center .grid-item a { | |
float: left; | |
text-decoration: none; | |
margin-left: 10px; | |
margin-right: 10px; | |
color: #111; | |
} | |
footer{ | |
color: #000; | |
text-align: center; | |
padding-bottom: 10px; | |
} | |
iframe { | |
margin-left: 14px; | |
margin-bottom: -5px; | |
} | |
@media (max-width: 900px) { | |
.center h1 { | |
font-size: 50px; | |
} | |
.center .links a, | |
.center .links iframe { | |
display: block; | |
margin: auto; | |
margin-bottom: 12px; | |
} | |
.divider { | |
display: none; | |
} | |
} | |
@media (max-width: 400px) { | |
.center h1 { | |
font-size: 26px; | |
} | |
.center .description { | |
font-size: 14px; | |
width: 100%; | |
padding-left: 40px; | |
padding-right: 40px; | |
box-sizing: border-box; | |
} | |
} | |
table { | |
width: 100%; | |
border-collapse: collapse; | |
} | |
th, td { | |
padding: 8px; | |
text-align: left; | |
border-bottom: 1px solid #ddd; | |
} | |
th { | |
background-color: #f2f2f2; | |
} | |
a { | |
color: blue; | |
text-decoration: none; | |
} | |
a:hover { | |
text-decoration: underline; | |
} | |
.user-chat:empty { | |
background-color: transparent; | |
pointer-events: none; | |
} | |
.chat-container { | |
background-color: var(--primary); | |
color: #000; | |
padding: 10px; | |
border-radius: 5px; | |
height: 300px; | |
overflow-y: scroll; | |
} | |
.user-chat { | |
background-color: #dcf8c6; | |
color: #000; | |
padding: 5px; | |
margin-bottom: 10px; | |
border-radius: 5px; | |
} | |
.bot-chat { | |
background-color: #ffffff; | |
color: #000; | |
padding: 5px; | |
margin-bottom: 10px; | |
border-radius: 5px; | |
} | |
.live-chat-input { | |
display: flex; | |
align-items: center; | |
justify-content: space-between; | |
background-color: #f5f5f5; | |
border: 1px solid #ddd; | |
border-radius: 20px; | |
padding: 10px; | |
} | |
#inputText { | |
flex: 1; | |
border: none; | |
outline: none; | |
margin-right: 10px; | |
font-size: 16px; | |
} | |
#submitBtn { | |
background-color: #4CAF50; | |
color: #fff; | |
border: none; | |
outline: none; | |
padding: 8px 20px; | |
border-radius: 20px; | |
cursor: pointer; | |
font-size: 16px; | |
} | |
#submitBtn:hover { | |
background-color: #45a049; | |
} | |
} | |