Book a Demo!
CoCalc Logo Icon
StoreFeaturesDocsShareSupportNewsAboutPoliciesSign UpSign In
OutRed
GitHub Repository: OutRed/artclass
 Path: blob/main/static/styles/page.css
595 views
1
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;700&family=Press+Start+2P&family=Source+Code+Pro&display=swap');

2


3
body {

4
  background: #111;

5
  text-align: center;

6
  overflow: none;

7
  color: white;

8
}

9


10
#loadingdiv {

11
  display: flex;

12
  flex-direction: column;

13
  justify-content: center;

14
  min-height: 100vh;

15
  margin: 0px;

16
  align-items: center;

17
}

18


19
.msg {

20
  display: flex;

21
  justify-content: center;

22
  align-items: center;

23
  flex-direction: column;

24
}

25


26
p {

27
  font-family: "DM Sans";

28
}

29


30
.info {

31
  color: #FFF;

32
  max-width: 600px;

33
  text-align: center;

34
  margin: 35px 0px 0px 0px;

35
}

36


37
.lds-dual-ring {

38
  display: inline-block;

39
  width: 160px;

40
  height: 160px;

41
}

42


43
.lds-dual-ring:after {

44
  content: " ";

45
  display: block;

46
  width: 128px;

47
  height: 128px;

48
  margin: 16px;

49
  border-radius: 50%;

50
  border: 12px solid #fff;

51
  border-color: #fff transparent #fff transparent;

52
  animation: lds-dual-ring 1.2s linear infinite;

53
}

54


55
@keyframes lds-dual-ring {

56
  0% {

57
    transform: rotate(0deg);

58
  }

59


60
  100% {

61
    transform: rotate(360deg);

62
  }

63
}

64


65
#caption {

66
  font-size: 11px;

67
}

68


69
#theframe {

70
  border: none;

71
  position: absolute;

72
  top: 0;

73
  right: 0;

74
  bottom: 0;

75
  left: 0;

76
  height: 100%;

77
  width: 100%;

78
  margin: 0;

79
  padding: 0;

80
}

81


82


83


84
a {

85
  text-decoration: none;

86
  color: white;

87
  text-align: center;

88
}

89


90
#buttons {

91
  position: absolute;

92
  bottom: 0;

93
  right: 0;

94
  padding: 10px;

95
}

96


97
.pagebutton {

98
  height: 50px;

99
  width: 50px;

100
  background-color: white;

101
  color: black;

102
  opacity: 0.6;

103
  border: none;

104
  border-radius: 5px;

105
  transition: all 0.6s;

106
}

107


108
.pagebutton:hover {

109
  opacity: 1;

110
  scale: 1.06;

111
  cursor: pointer;

112
}

113


114
footer {

115
  position: absolute;

116
  bottom: 10px;

117
  text-align: center;

118
  width: 50%;

119
  margin-left: 25%;

120
  margin-right: auto;

121
  font-family: Verdana;

122
  font-size: 14px;

123
}

124


125
.link2 {

126
  color: #fff;

127
  text-decoration: none;

128
  font-size: 20px;

129
  padding: 10px;

130
  font-family: "DM Sans";

131
  transition: all 0.6s;

132
  border-radius: 5px;

133
  margin-bottom: 10px;

134
}

135
.link2:hover {

136
  color: #333;

137
  background-color: #fff;

138
}

139


140
.spinn {

141
  animation: rotation 4s infinite linear;

142
}

143


144
@keyframes rotation {

145
  from {

146
    transform: rotate(0deg);

147
  }

148
  to {

149
    transform: rotate(359deg);

150
  }

151
}

152


153


154