all repos — site @ a1989f5d2193733abd9c6644ff5f337209085f48

source for my site, found at icyphox.sh

static/style.css (view raw)

  1html,
  2body {
  3	background: #021012;
  4}
  5
  6a {
  7	color: white;
  8	display: inline-block;
  9	margin: 0 20px;
 10	position: relative;
 11	text-decoration: none;
 12}
 13
 14a:after {
 15	content: "";
 16	height: 1px;
 17	background: white;
 18	position: absolute;
 19	pointer-events: none;
 20	bottom: -5px;
 21	left: 0;
 22	right: 0;
 23	opacity: 0;
 24	transform: scale(0, 1);
 25	transition: all 200ms;
 26}
 27
 28a:hover:after {
 29	opacity: 1;
 30	transform: scale(1, 1);
 31}
 32
 33.container {
 34	position: absolute;
 35	overflow: hidden;
 36	top: 0;
 37	bottom: 0;
 38	left: 0;
 39	right: 0;
 40	color: white;
 41	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
 42
 43	-webkit-animation: fadein 2s;
 44	   -moz-animation: fadein 2s;
 45	    -ms-animation: fadein 2s;
 46	     -o-animation: fadein 2s;
 47	        animation: fadein 2s;
 48}
 49
 50@keyframes fadein {
 51	from { opacity: 0; }
 52	to   { opacity: 1; }
 53}
 54
 55@-moz-keyframes fadein {
 56	from { opacity: 0; }
 57	to   { opacity: 1; }
 58}
 59
 60@-webkit-keyframes fadein {
 61	from { opacity: 0; }
 62	to   { opacity: 1; }
 63}
 64
 65.introduction {
 66	position: absolute;
 67	top: 50%;
 68	transform: translateY(-50%);
 69	width: 100%;
 70}
 71
 72.logo {
 73	width: 250px;
 74}
 75
 76.footer {
 77	color: #666;
 78	bottom: 20px;
 79	font-size: 14px;
 80	position: absolute;
 81	width: 100%;
 82	text-align: center;
 83	margin-bottom: 20px;
 84}
 85
 86.footer a {
 87	color: #666;
 88	margin: 0;
 89	transition: all 200ms;
 90}
 91
 92.footer a:hover {
 93	color: white;
 94}
 95
 96.left {
 97	display: inline-block;
 98	margin-bottom: 30px;
 99	margin-left: 0;
100	margin-right: 30px;
101}
102
103.right {
104	display: inline-block;
105}
106
107.right a {
108	display: inline-block;
109	margin-right: 30px;
110}
111
112@media only screen and (max-width: 40em) {
113	.left {
114		display: block;
115		margin-right: 0;
116	}
117	.right {
118		display: block;
119	}
120	.right a:last-child {
121		margin-right: 0;
122	}