all repos — site @ 8255492f90543fdcf7a1043610157443a88d0c53

source for my site, found at icyphox.sh

static/style.css (view raw)

 1
 2
 3
 4
 5
 6
 7
 8
 9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
 100
 101
 102
 103
 104
 105
 106
 107
 108
 109
 110
 111
 112
 113
 114
 115
 116
 117
 118
 119
 120
 121
 122
 
		html,
		body {
			background: #021012;
		}

		a {
			color: white;
			display: inline-block;
			margin: 0 20px;
			position: relative;
			text-decoration: none;
		}

		a:after {
			content: "";
			height: 1px;
			background: white;
			position: absolute;
			pointer-events: none;
			bottom: -5px;
			left: 0;
			right: 0;
			opacity: 0;
			transform: scale(0, 1);
			transition: all 200ms;
		}

		a:hover:after {
			opacity: 1;
			transform: scale(1, 1);
		}

		.container {
			position: absolute;
			overflow: hidden;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			color: white;
			font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;

			-webkit-animation: fadein 2s;
			   -moz-animation: fadein 2s;
			    -ms-animation: fadein 2s;
			     -o-animation: fadein 2s;
			        animation: fadein 2s;
		}

		@keyframes fadein {
			from { opacity: 0; }
			to   { opacity: 1; }
		}

		@-moz-keyframes fadein {
			from { opacity: 0; }
			to   { opacity: 1; }
		}

		@-webkit-keyframes fadein {
			from { opacity: 0; }
			to   { opacity: 1; }
		}

		.introduction {
			position: absolute;
			top: 50%;
			transform: translateY(-50%);
			width: 100%;
		}

		.logo {
			width: 250px;
		}

		.footer {
			color: #666;
			bottom: 20px;
			font-size: 14px;
			position: absolute;
			width: 100%;
			text-align: center;
			margin-bottom: 20px;
		}

		.footer a {
			color: #666;
			margin: 0;
			transition: all 200ms;
		}

		.footer a:hover {
			color: white;
		}

		.left {
			display: inline-block;
			margin-bottom: 30px;
			margin-left: 0;
			margin-right: 30px;
		}

		.right {
			display: inline-block;
		}

		.right a {
			display: inline-block;
			margin-right: 30px;
		}

		@media only screen and (max-width: 40em) {
			.left {
				display: block;
				margin-right: 0;
			}
			.right {
				display: block;
			}
			.right a:last-child {
				margin-right: 0;
			}