Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 1 | img { |
| 2 | width: 100%; } |
| 3 | |
| 4 | body { |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 5 | font-family: "Comfortaa", Helvetica, Arial, sans-serif; |
Henri Koivuneva | 468d169 | 2017-08-12 16:24:41 +0300 | [diff] [blame] | 6 | line-height: 1.4; |
Unknown | 62c1a40 | 2018-10-02 10:32:07 -0400 | [diff] [blame] | 7 | /* background-color: #0080ff; */ |
| 8 | background: url("../images/web_bg_1280.png") no-repeat center center fixed; |
| 9 | -webkit-background-size: cover; |
| 10 | -moz-background-size: cover; |
| 11 | -o-background-size: cover; |
| 12 | background-size: cover; |
Unknown | 9fd4764 | 2018-10-02 10:36:28 -0400 | [diff] [blame] | 13 | |
Henri Koivuneva | 5c411dd | 2017-08-25 22:59:59 +0300 | [diff] [blame] | 14 | } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 15 | |
Unknown | 62c1a40 | 2018-10-02 10:32:07 -0400 | [diff] [blame] | 16 | #bg { |
| 17 | position: fixed; |
| 18 | top: -50%; |
| 19 | left: -50%; |
| 20 | width: 200%; |
| 21 | height: 200%; |
| 22 | } |
| 23 | #bg img { |
| 24 | position: absolute; |
| 25 | top: 0; |
| 26 | left: 0; |
| 27 | right: 0; |
| 28 | bottom: 0; |
| 29 | margin: auto; |
| 30 | min-width: 50%; |
| 31 | min-height: 50%; |
| 32 | } |
| 33 | |
Henri Koivuneva | 468d169 | 2017-08-12 16:24:41 +0300 | [diff] [blame] | 34 | h1, .h1, |
| 35 | h2, .h2, |
| 36 | h3, .h3, |
| 37 | h4, .h4, |
| 38 | h5, .h5, |
| 39 | h6, .h6 { |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 40 | font-family: "Comfortaa", Helvetica, Arial, sans-serif; |
Henri Koivuneva | 468d169 | 2017-08-12 16:24:41 +0300 | [diff] [blame] | 41 | line-height: 1.4; |
Unknown | a2d5443 | 2018-10-02 09:15:22 -0400 | [diff] [blame] | 42 | color: #222222; } |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 43 | h1, .h1 {font-size: 64px;} |
| 44 | h2, .h2 {font-size: 42px;} |
| 45 | h4, .h4 {font-weight: bolder;} |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 46 | |
| 47 | p { |
| 48 | font-family: "Comfortaa", sans-serif; |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 49 | color: #ffffff; |
| 50 | margin: 0 0 30px; } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 51 | |
Henri Koivuneva | 0f98819 | 2017-08-12 15:28:05 +0300 | [diff] [blame] | 52 | a, .btn { |
Henri Koivuneva | f70ddbc | 2017-08-12 15:36:36 +0300 | [diff] [blame] | 53 | -webkit-transition: color .2s ease 0s, border-color .2s ease 0s, background-color .2s ease 0s; |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 54 | -moz-transition: color .2s ease 0s, border-color .2s ease 0s, background-color .2s ease 0s; |
| 55 | -o-transition: color .2s ease 0s, border-color .2s ease 0s, background-color .2s ease 0s; |
Henri Koivuneva | f70ddbc | 2017-08-12 15:36:36 +0300 | [diff] [blame] | 56 | transition: color .2s ease 0s, border-color .2s ease 0s, background-color .2s ease 0s; |
Henri Koivuneva | 0f98819 | 2017-08-12 15:28:05 +0300 | [diff] [blame] | 57 | } |
| 58 | |
Henri Koivuneva | 7f26602 | 2017-08-12 15:25:19 +0300 | [diff] [blame] | 59 | a:hover, a:focus, a:active {text-decoration: none;} |
| 60 | |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 61 | body > .container-fluid { |
Henri Koivuneva | 28ce8c6 | 2017-08-13 03:01:23 +0300 | [diff] [blame] | 62 | padding: 0; } |
Henri Koivuneva | 7edca39 | 2017-08-12 16:23:52 +0300 | [diff] [blame] | 63 | |
Henri Koivuneva | f63e2a9 | 2017-08-12 16:37:49 +0300 | [diff] [blame] | 64 | #portfolio > .container { |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 65 | padding-left: 30px; |
| 66 | padding-right: 30px; |
| 67 | } |
| 68 | #portfolio > div > div > div {padding-right: 0;padding-left: 0} |
Henri Koivuneva | f63e2a9 | 2017-08-12 16:37:49 +0300 | [diff] [blame] | 69 | |
Unknown | e3cf16e | 2017-11-04 16:32:52 -0400 | [diff] [blame] | 70 | #family-lt > .container { |
| 71 | padding-left: 30px; |
| 72 | padding-right: 30px; |
Unknown | b60d942 | 2017-11-27 19:40:08 -0500 | [diff] [blame] | 73 | font-size: 18px; |
Unknown | e3cf16e | 2017-11-04 16:32:52 -0400 | [diff] [blame] | 74 | } |
| 75 | #family-lt > div > div > div {padding-right: 0;padding-left: 0} |
| 76 | |
Henri Koivuneva | bcf672a | 2017-08-12 16:25:03 +0300 | [diff] [blame] | 77 | .row, |
| 78 | .container-fluid>.navbar-collapse, |
| 79 | .container-fluid>.navbar-header, |
| 80 | .container>.navbar-collapse, |
| 81 | .container>.navbar-header { |
Henri Koivuneva | 17653c5 | 2017-08-12 18:12:07 +0300 | [diff] [blame] | 82 | margin:auto; |
| 83 | } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 84 | |
| 85 | .container-fluid .text-muted { |
| 86 | margin: 20px 0; } |
| 87 | |
| 88 | .btn:focus, a:focus { |
| 89 | outline: none !important; } |
| 90 | |
| 91 | .navbar { |
| 92 | height: 70px; |
| 93 | background-color: transparent; |
| 94 | background: transparent; |
| 95 | border: none; |
| 96 | color: #ffffff; |
| 97 | z-index: 100; |
| 98 | margin-bottom: 0; |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 99 | padding-left: 30px; |
| 100 | padding-right: 30px; |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 101 | border-radius: 0; |
Henri Koivuneva | f70ddbc | 2017-08-12 15:36:36 +0300 | [diff] [blame] | 102 | -webkit-transition: background-color .2s ease 0s; |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 103 | -moz-transition: background-color .2s ease 0s; |
| 104 | -o-transition: background-color .2s ease 0s; |
Unknown | 2e345c4 | 2017-08-14 18:25:38 -0400 | [diff] [blame] | 105 | transition: background-color .2s ease 0s; } |
Henri Koivuneva | 3de908d | 2017-08-13 02:43:42 +0300 | [diff] [blame] | 106 | .navbar > .container {padding: 4px 0 0 0;width: 100%;margin-top:2px;} |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 107 | .navbar-brand { |
Henri Koivuneva | e184123 | 2017-08-12 21:55:21 +0300 | [diff] [blame] | 108 | opacity: 0; |
Henri Koivuneva | 3de908d | 2017-08-13 02:43:42 +0300 | [diff] [blame] | 109 | margin-top: 5px; |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 110 | padding: 15px 0; |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 111 | color: #ffffff; |
| 112 | font-weight: 400; } |
| 113 | |
| 114 | .navbar-default .navbar-nav > li > a { |
| 115 | color: #ffffff; |
| 116 | font-weight: 500; |
| 117 | font-size: 1em; |
| 118 | text-transform: lowercase; |
Henri Koivuneva | 3de908d | 2017-08-13 02:43:42 +0300 | [diff] [blame] | 119 | margin: 3px 5px; |
Henri Koivuneva | c93da97 | 2017-08-12 15:18:06 +0300 | [diff] [blame] | 120 | border: 1px solid transparent; |
Henri Koivuneva | 4d964cb | 2017-08-12 15:22:55 +0300 | [diff] [blame] | 121 | border-radius: 5px; |
Henri Koivuneva | f70ddbc | 2017-08-12 15:36:36 +0300 | [diff] [blame] | 122 | -webkit-transition: color .2s ease 0s, border-color .2s ease 0s; |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 123 | -moz-transition: color .2s ease 0s, border-color .2s ease 0s; |
| 124 | -o-transition: color .2s ease 0s, border-color .2s ease 0s; |
Henri Koivuneva | f70ddbc | 2017-08-12 15:36:36 +0300 | [diff] [blame] | 125 | transition: color .2s ease 0s, border-color .2s ease 0s; } |
Henri Koivuneva | bcf672a | 2017-08-12 16:25:03 +0300 | [diff] [blame] | 126 | .navbar-default .navbar-nav > li:last-child > a {margin-right: 0} |
Henri Koivuneva | c93da97 | 2017-08-12 15:18:06 +0300 | [diff] [blame] | 127 | .navbar-default .navbar-nav > li > a:hover { |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 128 | color: #ffffff; |
| 129 | border: 1px solid #ffffff; } |
Henri Koivuneva | c93da97 | 2017-08-12 15:18:06 +0300 | [diff] [blame] | 130 | .navbar-default .navbar-nav > li > a:active, |
| 131 | .navbar-default .navbar-nav > li > a:focus, |
| 132 | .navbar.solid .navbar-nav > li > a:active, .navbar.solid .navbar-nav > li > a:focus { |
| 133 | color: rgba(255,255,255,0.8); |
| 134 | border: 1px solid rgba(255,255,255,0.8); } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 135 | .navbar-default .navbar-nav > li > a:visited { |
| 136 | color: #ffffff; |
| 137 | text-decoration: none; } |
Henri Koivuneva | c93da97 | 2017-08-12 15:18:06 +0300 | [diff] [blame] | 138 | .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover { |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 139 | background-color: transparent; |
| 140 | color: #ffffff; } |
Henri Koivuneva | c93da97 | 2017-08-12 15:18:06 +0300 | [diff] [blame] | 141 | .navbar-default .navbar-nav > .active > a:focus, |
| 142 | .navbar.solid .navbar-nav > li > a:active, |
| 143 | .navbar.solid .navbar-nav > li > a:focus { |
| 144 | background-color: transparent; |
| 145 | color: rgba(255,255,255,0.8); } |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 146 | .navbar-toggle {margin-right:0;padding:15px;} |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 147 | .navbar-default .navbar-toggle { |
| 148 | border-color: #ffffff; } |
| 149 | .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus { |
Unknown | a2d5443 | 2018-10-02 09:15:22 -0400 | [diff] [blame] | 150 | background-color: #222222; |
Henri Koivuneva | 17653c5 | 2017-08-12 18:12:07 +0300 | [diff] [blame] | 151 | } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 152 | .navbar-default .navbar-toggle .icon-bar { |
| 153 | color: #ffffff; |
| 154 | background-color: #ffffff; } |
Henri Koivuneva | 6b7c796 | 2017-08-12 21:54:58 +0300 | [diff] [blame] | 155 | .navbar-default .navbar-collapse.collapse.in ul { |
Unknown | a2d5443 | 2018-10-02 09:15:22 -0400 | [diff] [blame] | 156 | background-color: #222222; |
Henri Koivuneva | 17653c5 | 2017-08-12 18:12:07 +0300 | [diff] [blame] | 157 | } |
Henri Koivuneva | 6b7c796 | 2017-08-12 21:54:58 +0300 | [diff] [blame] | 158 | .navbar-collapse.collapsing { |
Unknown | a2d5443 | 2018-10-02 09:15:22 -0400 | [diff] [blame] | 159 | background-color: #222222; |
Henri Koivuneva | 5e6ed7a | 2017-08-12 18:14:02 +0300 | [diff] [blame] | 160 | } |
| 161 | .navbar-default .navbar-toggle .icon-bar { |
| 162 | color: #ffffff; |
| 163 | background-color: #ffffff; } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 164 | .navbar-default .navbar-collapse.collapse.in ul { |
Unknown | a2d5443 | 2018-10-02 09:15:22 -0400 | [diff] [blame] | 165 | background-color: #222222; |
Henri Koivuneva | 5e6ed7a | 2017-08-12 18:14:02 +0300 | [diff] [blame] | 166 | } |
Unknown | 94e4caa | 2017-08-12 10:48:07 -0400 | [diff] [blame] | 167 | .navbar-collapse.collapse.collapsing { |
Unknown | a2d5443 | 2018-10-02 09:15:22 -0400 | [diff] [blame] | 168 | background-color: #222222; |
Henri Koivuneva | 17653c5 | 2017-08-12 18:12:07 +0300 | [diff] [blame] | 169 | } |
nilac8991 | c165503 | 2017-08-19 12:37:44 +0200 | [diff] [blame] | 170 | |
Henri Koivuneva | 5e6ed7a | 2017-08-12 18:14:02 +0300 | [diff] [blame] | 171 | .navbar-collapse.collapse.show { |
Unknown | a2d5443 | 2018-10-02 09:15:22 -0400 | [diff] [blame] | 172 | background-color: #222222; |
Henri Koivuneva | 17653c5 | 2017-08-12 18:12:07 +0300 | [diff] [blame] | 173 | -webkit-transition: background-color .2s ease 0s; |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 174 | -moz-transition: background-color .2s ease 0s; |
| 175 | -o-transition: background-color .2s ease 0s; |
Henri Koivuneva | 17653c5 | 2017-08-12 18:12:07 +0300 | [diff] [blame] | 176 | transition: background-color .2s ease 0s; |
Henri Koivuneva | e15afea | 2017-08-12 18:23:45 +0300 | [diff] [blame] | 177 | -webkit-border-bottom-left-radius: 4px; |
| 178 | -webkit-border-bottom-right-radius: 4px; |
| 179 | border-bottom-left-radius: 4px; |
| 180 | border-bottom-right-radius: 4px; |
Henri Koivuneva | 17653c5 | 2017-08-12 18:12:07 +0300 | [diff] [blame] | 181 | } |
Henri Koivuneva | 936cb39 | 2017-08-12 18:49:20 +0300 | [diff] [blame] | 182 | |
| 183 | .navbar-collapse .navbar-nav > li > a, |
| 184 | .navbar-collapse .navbar-nav > li > a:hover, |
| 185 | .navbar-collapse .navbar-nav > li > a:focus, |
| 186 | .navbar-collapse .navbar-nav > li > a:active { |
| 187 | border-color: transparent !important; |
| 188 | } |
| 189 | |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 190 | /* Solid class attached on scroll past first section */ |
| 191 | .navbar.solid { |
Unknown | a2d5443 | 2018-10-02 09:15:22 -0400 | [diff] [blame] | 192 | background-color: #222222; |
Unknown | 2e345c4 | 2017-08-14 18:25:38 -0400 | [diff] [blame] | 193 | top: 0; |
Henri Koivuneva | 5c411dd | 2017-08-25 22:59:59 +0300 | [diff] [blame] | 194 | width: 100%; |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 195 | margin: 0; |
| 196 | box-shadow: 0 7px 8px 0 rgba(0,0,0,0.3); |
| 197 | -webkit-transition: background-color .2s ease 0s, box-shadow .2s ease 0s; |
| 198 | -moz-transition: background-color .2s ease 0s, box-shadow .2s ease 0s; |
| 199 | -o-transition: background-color .2s ease 0s, box-shadow .2s ease 0s; |
| 200 | transition: background-color .2s ease 0s, box-shadow .2s ease 0s; |
Henri Koivuneva | 5c411dd | 2017-08-25 22:59:59 +0300 | [diff] [blame] | 201 | } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 202 | .navbar.solid .navbar-brand { |
Henri Koivuneva | e184123 | 2017-08-12 21:55:21 +0300 | [diff] [blame] | 203 | opacity: 1; |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 204 | display: inline-block; |
| 205 | color: #ffffff; |
Henri Koivuneva | e184123 | 2017-08-12 21:55:21 +0300 | [diff] [blame] | 206 | -webkit-transition: color .2s ease 0s, border-color .2s ease 0s, opacity .2s ease 0s; |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 207 | -moz-transition: color .2s ease 0s, border-color .2s ease 0s, opacity .2s ease 0s; |
| 208 | -o-transition: color .2s ease 0s, border-color .2s ease 0s, opacity .2s ease 0s; |
Henri Koivuneva | e184123 | 2017-08-12 21:55:21 +0300 | [diff] [blame] | 209 | transition: color .2s ease 0s, border-color .2s ease 0s, opacity .2s ease 0s; } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 210 | .navbar.solid .navbar-nav > li > a { |
| 211 | color: #ffffff; |
Henri Koivuneva | f70ddbc | 2017-08-12 15:36:36 +0300 | [diff] [blame] | 212 | -webkit-transition: color .2s ease 0s, border-color .2s ease 0s; |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 213 | -moz-transition: color .2s ease 0s, border-color .2s ease 0s; |
| 214 | -o-transition: color .2s ease 0s, border-color .2s ease 0s; |
Henri Koivuneva | f70ddbc | 2017-08-12 15:36:36 +0300 | [diff] [blame] | 215 | transition: color .2s ease 0s, border-color .2s ease 0s; } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 216 | |
| 217 | .cover { |
Henri Koivuneva | 28ce8c6 | 2017-08-13 03:01:23 +0300 | [diff] [blame] | 218 | padding: 6% 0 8% 0; } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 219 | .cover.top { |
Henri Koivuneva | 0752d23 | 2017-08-12 18:08:32 +0300 | [diff] [blame] | 220 | padding: 10vh 0 15vh 0; |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 221 | height: 100vh; |
| 222 | display: -webkit-box; |
| 223 | display: -ms-flexbox; |
| 224 | display: flex; |
Unknown | 62c1a40 | 2018-10-02 10:32:07 -0400 | [diff] [blame] | 225 | /* background-color: #0080ff;*/ |
| 226 | background: url(images/web_bg_1280.png) no-repeat center center fixed; |
| 227 | -webkit-background-size: cover; |
| 228 | -moz-background-size: cover; |
| 229 | -o-background-size: cover; |
| 230 | background-size: cover; |
| 231 | } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 232 | .cover.bottom { |
Henri Koivuneva | 28ce8c6 | 2017-08-13 03:01:23 +0300 | [diff] [blame] | 233 | padding: 6% 0 5.5% 0; } |
| 234 | body > .cover.bottom:nth-child(4) {padding: 6% 0 5.5% 0 !important} |
Henri Koivuneva | 0479747 | 2017-08-12 18:35:39 +0300 | [diff] [blame] | 235 | @media (max-width: 550px) { |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 236 | .cover, .cover.bottom {padding: 17.5% 30px 17.5% 30px; } } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 237 | |
| 238 | .headline { |
| 239 | padding-top: 6.25em; } |
Henri Koivuneva | 0752d23 | 2017-08-12 18:08:32 +0300 | [diff] [blame] | 240 | body > div.container-fluid > div.row.cover.top > div > .row > .headline > img { |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 241 | max-width: 1600px; |
| 242 | width: 100%; |
Henri Koivuneva | 0752d23 | 2017-08-12 18:08:32 +0300 | [diff] [blame] | 243 | margin: 0 auto; |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 244 | padding-right: 30px; |
| 245 | padding-left: 30px; |
Henri Koivuneva | 0752d23 | 2017-08-12 18:08:32 +0300 | [diff] [blame] | 246 | display: block; } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 247 | @media screen and (min-width: 768px) { |
| 248 | .headline { |
| 249 | padding-top: 3.75em; } } |
| 250 | @media screen and (min-width: 992px) { |
| 251 | .headline { |
| 252 | padding-top: 1.5625em; } } |
| 253 | @media screen and (min-width: 1200px) { |
| 254 | .headline { |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 255 | padding-top: 0; } } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 256 | |
| 257 | #about { |
Unknown | a2d5443 | 2018-10-02 09:15:22 -0400 | [diff] [blame] | 258 | background-color: #222222; } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 259 | #about h2 { |
| 260 | color: #0080ff; } |
Henri Koivuneva | 28ce8c6 | 2017-08-13 03:01:23 +0300 | [diff] [blame] | 261 | #about > div > div.row.break > div > p {margin-bottom: 15px} |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 262 | |
| 263 | .profile-img { |
| 264 | margin-bottom: 15px; |
| 265 | width: 120px; } |
| 266 | |
| 267 | .about, .about-info, .about-tools, .about-last { |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 268 | padding: 4% 30px 1% 30px; |
| 269 | font-size: 18px; } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 270 | .about-tools { |
| 271 | padding-top: 4.375em; |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 272 | font-size: 18px; } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 273 | @media screen and (min-width: 992px) { |
| 274 | .about-tools { |
| 275 | padding-top: 5.625em; } } |
| 276 | .about-tools ul:first-child { |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 277 | padding-left: 0; } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 278 | .about-tools ul { |
| 279 | color: #0080ff; |
| 280 | list-style: none; } |
| 281 | .about-tools ul li { |
| 282 | padding-top: 0.75em; } |
| 283 | .about-last { |
| 284 | padding-top: 3.125em; |
| 285 | padding-bottom: 0; |
| 286 | font-size: 1.125em; } |
| 287 | @media screen and (min-width: 992px) { |
| 288 | .about-last { |
| 289 | padding-top: 0; } } |
| 290 | .about-last p { |
| 291 | color: #0080ff; } |
| 292 | |
| 293 | #portfolio { |
| 294 | background-color: #0080ff; } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 295 | |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 296 | .portfolio-projects--btn { |
| 297 | background: transparent; |
Unknown | a2d5443 | 2018-10-02 09:15:22 -0400 | [diff] [blame] | 298 | color: #222222; |
| 299 | border: 1px solid #222222; |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 300 | border-radius: 5px; |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 301 | margin-bottom: 1.25em; |
| 302 | font-size: 18px; |
Henri Koivuneva | af9a0dc | 2017-11-23 04:10:52 +0200 | [diff] [blame] | 303 | margin: 8px; } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 304 | .portfolio-projects--btn:hover { |
Unknown | a2d5443 | 2018-10-02 09:15:22 -0400 | [diff] [blame] | 305 | background: #222222; |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 306 | color: #ffffff; } |
Henri Koivuneva | d8283ac | 2017-08-12 15:05:35 +0300 | [diff] [blame] | 307 | .portfolio-projects--btn:focus, |
| 308 | .portfolio-projects--btn:active { |
Unknown | a2d5443 | 2018-10-02 09:15:22 -0400 | [diff] [blame] | 309 | background: #111111; |
Henri Koivuneva | d8283ac | 2017-08-12 15:05:35 +0300 | [diff] [blame] | 310 | color: #ffffff; } |
Henri Koivuneva | 9d598a5 | 2017-11-23 01:56:48 +0200 | [diff] [blame] | 311 | @media (max-width:650px) { |
| 312 | .portfolio-projects--btn {font-size:16px;} |
| 313 | } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 314 | .portfolio-projects--image { |
| 315 | margin-bottom: 1.875em; |
| 316 | padding-top: 5%; } |
| 317 | |
Henri Koivuneva | be19c19 | 2017-11-22 22:14:33 +0200 | [diff] [blame] | 318 | .about-tools ul li, .contact-social-icons ul a li { |
| 319 | text-align: center; } |
| 320 | |
| 321 | .centered { |
| 322 | float: none; |
| 323 | margin-left: auto; |
| 324 | margin-right: auto; } |
| 325 | |
| 326 | |
| 327 | .vcenter { |
| 328 | display: inline-block; |
| 329 | vertical-align: middle; |
| 330 | float: none; } |
| 331 | |
| 332 | .break { |
| 333 | clear: both; |
| 334 | margin-top: 10px; } |
| 335 | |
| 336 | @media (min-width: 360px) { |
Henri Koivuneva | 5c411dd | 2017-08-25 22:59:59 +0300 | [diff] [blame] | 337 | #team > .container .row > div {width: 100%;margin: 0;} |
| 338 | } |
| 339 | |
Henri Koivuneva | be19c19 | 2017-11-22 22:14:33 +0200 | [diff] [blame] | 340 | @media (min-width: 768px) { |
| 341 | .pull-right-sm { |
| 342 | float: right !important; } |
| 343 | .pull-left-sm { |
| 344 | float: left !important; } |
| 345 | .container {width: 768px} |
| 346 | .navbar-right {margin-right: 0;} |
| 347 | .navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand {margin-left: 0;padding-left: 15px} |
| 348 | } |
| 349 | @media (min-width: 992px) { |
| 350 | .pull-right-md { |
| 351 | float: right !important; } |
| 352 | .pull-left-md { |
| 353 | float: left !important; } |
| 354 | .container {width: 94%;} |
| 355 | } |
| 356 | @media (min-width: 1200px) { |
| 357 | .pull-right-lg { |
| 358 | float: right !important; } |
| 359 | .pull-left-lg { |
| 360 | float: left !important; } |
| 361 | .container {width: 1170px;} |
| 362 | .portfolio-projects .col-lg-6 {width: 100%} |
| 363 | .navbar > .container {max-width: 1170px} |
| 364 | } |
| 365 | @media (min-width: 1366px) { |
| 366 | #portfolio > .container, #about > .row {width: 90%;max-width: 1600px;margin-left:auto;margin-right: auto;} |
| 367 | .navbar > .container {max-width: 1170px} |
| 368 | } |
| 369 | |
Henri Koivuneva | af9a0dc | 2017-11-23 04:10:52 +0200 | [diff] [blame] | 370 | @media (max-width:768px) { |
| 371 | .portfolio-projects--desc { |
| 372 | margin-top: 30px; |
| 373 | margin-bottom: 30px; |
| 374 | font-size: 16px; } |
| 375 | } |
Henri Koivuneva | be19c19 | 2017-11-22 22:14:33 +0200 | [diff] [blame] | 376 | @media (min-width: 768px) { |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 377 | .portfolio-projects { |
| 378 | margin-top: 0.625em; } } |
| 379 | .portfolio-projects--title { |
| 380 | margin-top: 0.9375em; |
| 381 | font-size: 20px; } |
Henri Koivuneva | be19c19 | 2017-11-22 22:14:33 +0200 | [diff] [blame] | 382 | @media (min-width: 768px) { |
Henri Koivuneva | af9a0dc | 2017-11-23 04:10:52 +0200 | [diff] [blame] | 383 | .portfolio-projects .col-lg-6:first-child .portfolio-projects--title {font-size: 21px;margin-top:0rem;} |
| 384 | .portfolio-projects .col-lg-6:nth-child(2) .portfolio-projects--title {font-size: 21px;margin-top:-2.5rem;} |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 385 | .portfolio-projects--desc { |
| 386 | margin-top: 30px; |
| 387 | margin-bottom: 30px; |
| 388 | font-size: 16px; } |
| 389 | .portfolio-projects--btn {font-size: 14px;margin:0 4px 16px 4px;} |
| 390 | #portfolio > div > div > div:nth-child(1) > div > div.col-sm-5.text-center, |
| 391 | #portfolio > div > div > div:nth-child(2) > div > div.col-sm-7.text-center.pull-right-sm {padding-left:0;} |
| 392 | #portfolio > div > div > div:nth-child(1) > div > div.col-sm-7.text-center, |
| 393 | #portfolio > div > div > div:nth-child(2) > div > div.col-sm-5.text-center.pull-right-sm {padding-right: 0;} } |
| 394 | @media screen and (min-width: 992px) { |
Henri Koivuneva | c250353 | 2017-11-23 04:00:26 +0200 | [diff] [blame] | 395 | .portfolio-projects .col-lg-6:first-child .portfolio-projects--title {font-size: 21px;margin-top:0rem;} |
| 396 | .portfolio-projects .col-lg-6:nth-child(2) .portfolio-projects--title {font-size: 21px;margin-top:-1.5rem;} |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 397 | #portfolio > div > div > div:nth-child(2) > div > div.col-sm-5.text-center.pull-right-sm > a:nth-child(4) {margin-left:-8px;} |
| 398 | #portfolio > div > div > div:nth-child(2) > div > div.col-sm-5.text-center.pull-right-sm > a:nth-child(5) {margin-right:-8px;} } |
| 399 | @media screen and (min-width: 1080px) { |
Henri Koivuneva | c250353 | 2017-11-23 04:00:26 +0200 | [diff] [blame] | 400 | .portfolio-projects .col-lg-6:first-child .portfolio-projects--title {font-size: 21px;margin-top:3.75rem;} |
| 401 | .portfolio-projects .col-lg-6:nth-child(2) .portfolio-projects--title {font-size: 21px;margin-top:1.125rem;} |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 402 | } |
| 403 | @media screen and (min-width: 1200px) { |
Henri Koivuneva | c250353 | 2017-11-23 04:00:26 +0200 | [diff] [blame] | 404 | .portfolio-projects .col-lg-6:first-child .portfolio-projects--title {font-size: 24px;margin-top:2.5rem;} |
| 405 | .portfolio-projects .col-lg-6:nth-child(2) .portfolio-projects--title {font-size: 24px;margin-top:1.25rem;} |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 406 | .portfolio-projects--desc { |
Henri Koivuneva | c250353 | 2017-11-23 04:00:26 +0200 | [diff] [blame] | 407 | margin-top: 24px; |
| 408 | margin-bottom: 24px; |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 409 | font-size: 18px; } |
| 410 | .portfolio-projects .col-lg-6 + .col-lg-6 + .col-lg-6 {margin-top:40px} |
Henri Koivuneva | c250353 | 2017-11-23 04:00:26 +0200 | [diff] [blame] | 411 | .portfolio-projects--btn {font-size: 18px;margin:8px;} } |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 412 | @media screen and (min-width: 1366px) { |
Henri Koivuneva | c250353 | 2017-11-23 04:00:26 +0200 | [diff] [blame] | 413 | .portfolio-projects .col-lg-6:first-child .portfolio-projects--title {margin-top:7.5rem;} |
| 414 | .portfolio-projects .col-lg-6:nth-child(2) .portfolio-projects--title {margin-top:6rem;} |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 415 | } |
| 416 | @media (min-width: 1500px) { |
Henri Koivuneva | c250353 | 2017-11-23 04:00:26 +0200 | [diff] [blame] | 417 | .portfolio-projects .col-lg-6:first-child .portfolio-projects--title {font-size: 28px;margin-top:11rem;} |
| 418 | .portfolio-projects .col-lg-6:nth-child(2) .portfolio-projects--title {font-size: 28px;margin-top:9.5rem;} |
| 419 | .portfolio-projects--btn {font-size: 18px;} |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 420 | } |
Henri Koivuneva | af9a0dc | 2017-11-23 04:10:52 +0200 | [diff] [blame] | 421 | .portfolio-projects--image-title {margin-top:-3rem;margin-bottom:6rem;} |
| 422 | @media (max-width: 768px) { |
| 423 | .portfolio-projects--image-title {margin-top:-3rem;margin-bottom:3rem;} |
| 424 | } |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 425 | |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 426 | #contact { |
Unknown | a2d5443 | 2018-10-02 09:15:22 -0400 | [diff] [blame] | 427 | background-color: #222222; |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 428 | padding-left: 15px; |
| 429 | padding-right: 15px } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 430 | #contact h2 { |
| 431 | color: #0080ff; } |
| 432 | |
| 433 | .contact-social-icons p { |
| 434 | color: #0080ff; } |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 435 | .contact-social-icons > ul {padding:0;margin:0 auto;} |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 436 | .contact-social-icons ul a { |
| 437 | color: #0080ff; |
| 438 | list-style: none; } |
Henri Koivuneva | d8283ac | 2017-08-12 15:05:35 +0300 | [diff] [blame] | 439 | .contact-social-icons ul a:hover, |
Henri Koivuneva | bef78a6 | 2017-08-12 22:32:07 +0300 | [diff] [blame] | 440 | .team-links-list a:hover, |
| 441 | .family-links-list a:hover { |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 442 | color: #ffffff; } |
Henri Koivuneva | d8283ac | 2017-08-12 15:05:35 +0300 | [diff] [blame] | 443 | .contact-social-icons ul a:focus, |
| 444 | .contact-social-icons ul a:active, |
| 445 | .team-links-list a:focus, |
Henri Koivuneva | bef78a6 | 2017-08-12 22:32:07 +0300 | [diff] [blame] | 446 | .team-links-list a:active, |
| 447 | .family-links-list a:focus, |
| 448 | .family-links-list a:active { |
Henri Koivuneva | d8283ac | 2017-08-12 15:05:35 +0300 | [diff] [blame] | 449 | color: rgba(255,255,255,0.8); } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 450 | .contact-social-icons ul a li { |
| 451 | display: inline-block; |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 452 | padding: 1.25%; |
| 453 | font-size: 16px } |
Henri Koivuneva | 1623418 | 2017-08-13 03:09:43 +0300 | [diff] [blame] | 454 | @media (max-width: 1200px) { |
Henri Koivuneva | c9c6ac6 | 2017-08-13 03:12:28 +0300 | [diff] [blame] | 455 | #family > div > div.row > div.center > div {margin:1.5em 4% 3em 4%;width:42%;float:left;} |
Henri Koivuneva | 1623418 | 2017-08-13 03:09:43 +0300 | [diff] [blame] | 456 | #family > div > div.row > div.center > div:last-child {margin-bottom: 0} |
| 457 | } |
| 458 | @media (max-width: 720px) { |
| 459 | #family > div > div.row > div.center > div {margin:1.5em 4% 3em 4%;width:92%;} |
| 460 | } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 461 | |
| 462 | .footer { |
Henri Koivuneva | 28ce8c6 | 2017-08-13 03:01:23 +0300 | [diff] [blame] | 463 | padding-top: 1em; |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 464 | bottom: 0; |
| 465 | width: 100%; |
| 466 | /* Set the fixed height of the footer here */ |
Unknown | a2d5443 | 2018-10-02 09:15:22 -0400 | [diff] [blame] | 467 | background-color: #111111; |
Unknown | f0310a8 | 2017-08-12 19:32:49 -0400 | [diff] [blame] | 468 | |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 469 | color: #ffffff; } |
electrikjesus | 34f27d1 | 2017-08-12 17:13:35 -0400 | [diff] [blame] | 470 | .footer-role, .footer-name, .footer-description { |
| 471 | color: #FFFFFF; |
| 472 | } |
| 473 | .footer-description { |
| 474 | color: #fff; |
| 475 | font-size: 18px; |
| 476 | } |
| 477 | .footer-role h4, .footer-links-list a { |
| 478 | color: #0080ff; |
| 479 | } |
| 480 | .footer-header h4 { |
| 481 | color: #0080ff; |
| 482 | } |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 483 | #scrollIcon, #scrollTopIcon { |
Henri Koivuneva | 6f33f84 | 2017-11-23 03:27:31 +0200 | [diff] [blame] | 484 | margin-top: 4vh; |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 485 | padding: 10px; |
| 486 | font-size: 1.5em; |
Unknown | a2d5443 | 2018-10-02 09:15:22 -0400 | [diff] [blame] | 487 | color: #222222; |
| 488 | border: solid 2px #222222; |
Unknown | 8e40a3b | 2017-07-30 14:47:14 -0400 | [diff] [blame] | 489 | border-radius: 50%; } |
| 490 | |
| 491 | #scrollTopIcon { |
| 492 | margin-top: 10px; |
| 493 | font-size: 1em; |
| 494 | color: #ffffff; |
| 495 | border-color: #ffffff; } |
| 496 | |
| 497 | .back-to-top { |
| 498 | display: none; } |
| 499 | .back-to-top.visible { |
| 500 | display: block; } |
Unknown | 423f034 | 2017-07-30 16:44:34 -0400 | [diff] [blame] | 501 | |
| 502 | /* our team section */ |
Henri Koivuneva | bef78a6 | 2017-08-12 22:32:07 +0300 | [diff] [blame] | 503 | #team, #family { |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 504 | background-color: #0080ff; |
Unknown | 2175d33 | 2017-08-13 19:28:40 -0400 | [diff] [blame] | 505 | /*font-weight: 700; |
| 506 | font-size: 21px; */ |
Unknown | 423f034 | 2017-07-30 16:44:34 -0400 | [diff] [blame] | 507 | } |
| 508 | .hr.invisible_hr { |
| 509 | height: 0; |
| 510 | padding: 0; |
| 511 | } |
| 512 | .hr.big_size_hr { |
| 513 | margin: 30px 0; |
| 514 | } |
| 515 | .hr { |
| 516 | clear: both; |
| 517 | display: block; |
| 518 | font-size: 0; |
| 519 | height: 24px; |
| 520 | margin: 20px 0; |
| 521 | overflow: hidden; |
| 522 | padding: 2px 0; |
| 523 | position: relative; |
| 524 | text-align: center; |
| 525 | width: 100%; |
| 526 | } |
| 527 | .highlight_secondary { |
| 528 | color: #FFFFFF; |
| 529 | } |
Henri Koivuneva | 984bf52 | 2017-08-12 14:51:57 +0300 | [diff] [blame] | 530 | .team-role, .team-name, .team-links-list a { |
Unknown | a2d5443 | 2018-10-02 09:15:22 -0400 | [diff] [blame] | 531 | color: #222222; |
nilac8991 | c165503 | 2017-08-19 12:37:44 +0200 | [diff] [blame] | 532 | text-align: center; |
Henri Koivuneva | 5c411dd | 2017-08-25 22:59:59 +0300 | [diff] [blame] | 533 | white-space: normal; |
| 534 | width: 100%; |
Unknown | 4f1903e | 2017-07-30 19:40:03 -0400 | [diff] [blame] | 535 | } |
nilac8991 | c165503 | 2017-08-19 12:37:44 +0200 | [diff] [blame] | 536 | .team-name, .family-name { |
| 537 | font-size: 21px; |
| 538 | text-align: center; |
| 539 | white-space: nowrap; |
| 540 | } |
Henri Koivuneva | bef78a6 | 2017-08-12 22:32:07 +0300 | [diff] [blame] | 541 | .team-links, .family-links { |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 542 | padding-top: .75em; |
Unknown | a2d5443 | 2018-10-02 09:15:22 -0400 | [diff] [blame] | 543 | color: #222222; |
nilac8991 | c165503 | 2017-08-19 12:37:44 +0200 | [diff] [blame] | 544 | text-align: center; |
Henri Koivuneva | 984bf52 | 2017-08-12 14:51:57 +0300 | [diff] [blame] | 545 | } |
Henri Koivuneva | bef78a6 | 2017-08-12 22:32:07 +0300 | [diff] [blame] | 546 | .team-image img, .family-image img { |
Henri Koivuneva | c5e99ce | 2017-08-12 15:59:30 +0300 | [diff] [blame] | 547 | max-width:150px; |
| 548 | max-height: 150px; |
| 549 | margin:0 auto; |
Henri Koivuneva | 4c86650 | 2017-08-12 17:14:37 +0300 | [diff] [blame] | 550 | } |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 551 | #team > .container .row > div { |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 552 | min-height: 0; |
Henri Koivuneva | 5e8fc3b | 2017-08-13 01:59:45 +0300 | [diff] [blame] | 553 | padding-left: 0; |
| 554 | padding-right: 0; |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 555 | /* display: flex; */ |
| 556 | /* flex-wrap: wrap; */ |
| 557 | /* justify-content: flex-start; */ |
| 558 | } |
| 559 | @media (min-width: 768px) { |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 560 | #team > .container .row > div {min-height: 0;} |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 561 | #team .col-sm-4 { |
| 562 | width: 100%; |
| 563 | margin: 0; |
| 564 | } |
| 565 | } |
| 566 | @media (min-width: 992px) { |
| 567 | #team .col-md-2 { |
| 568 | width: 100%; |
| 569 | margin: 0; |
| 570 | } |
| 571 | } |
| 572 | @media (min-width: 1200px) { |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 573 | #team > .container .row > div {min-height: 0;} |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 574 | } |
| 575 | @media (max-width: 700px) { |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 576 | #team > .container .row > div {min-height: 0;} |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 577 | #team .col-xs-6 {width: 42%;margin:4%;} |
| 578 | } |
| 579 | @media (max-width: 500px) { |
| 580 | #team > .container .row > div {min-height: 250px;} |
| 581 | #team .col-xs-6 {width: 92%;margin:4%;} |
| 582 | } |
| 583 | #team > .container .row > .row, #team > .container {padding-left:0;padding-right: 0} |
| 584 | |
| 585 | /* Bliss family section */ |
| 586 | #family { |
Unknown | a2d5443 | 2018-10-02 09:15:22 -0400 | [diff] [blame] | 587 | background-color: #222222; |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 588 | } |
| 589 | #family > div > div.row > div {font-size: 18px} |
| 590 | .family-role, .family-name, .family-description { |
| 591 | color: #FFFFFF; |
| 592 | } |
| 593 | .family-description { |
| 594 | color: #fff; |
| 595 | font-size: 18px; |
| 596 | } |
| 597 | .family-role h4, .family-links-list a { |
| 598 | color: #0080ff; |
| 599 | } |
| 600 | .family-header h2 { |
| 601 | color: #0080ff; |
| 602 | } |
| 603 | #family .about-tools { |
| 604 | font-size: 20px; |
| 605 | } |
| 606 | .family-image img { |
| 607 | max-width:150px; |
| 608 | max-height: 150px; |
| 609 | margin:0 auto; |
| 610 | } |
| 611 | .family-projects--btn { |
| 612 | background: transparent; |
Unknown | 7e529f8 | 2017-11-04 16:44:32 -0400 | [diff] [blame] | 613 | color: #0080ff; |
| 614 | border: 1px solid #0080ff; |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 615 | border-radius: 5px; |
| 616 | margin-bottom: 1.25em; |
| 617 | font-weight: 700; |
| 618 | font-size: 21px; } |
| 619 | .family-projects--btn:hover { |
Unknown | 7e529f8 | 2017-11-04 16:44:32 -0400 | [diff] [blame] | 620 | background: #0080ff; |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 621 | color: #ffffff; } |
| 622 | .family-projects--btn:focus, |
| 623 | .family-projects--btn:active { |
Unknown | 7e529f8 | 2017-11-04 16:44:32 -0400 | [diff] [blame] | 624 | background: #0080ff; |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 625 | color: #ffffff; } |
| 626 | |
Henri Koivuneva | 3492c6c | 2017-11-23 04:45:03 +0200 | [diff] [blame] | 627 | |
| 628 | @media (min-height: 880px) { |
Henri Koivuneva | 6f33f84 | 2017-11-23 03:27:31 +0200 | [diff] [blame] | 629 | #scrollIcon, #scrollTopIcon {margin-top: 4vh;} |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 630 | } |
Henri Koivuneva | 3492c6c | 2017-11-23 04:45:03 +0200 | [diff] [blame] | 631 | @media (min-height: 900px) { |
| 632 | #scrollIcon, #scrollTopIcon {margin-top: 6vh;} |
| 633 | } |
| 634 | @media (min-height: 960px) { |
| 635 | #scrollIcon, #scrollTopIcon {margin-top: 10vh;} |
| 636 | } |
| 637 | @media (min-height: 980px) { |
| 638 | #scrollIcon, #scrollTopIcon {margin-top: 12vh;} |
| 639 | } |
| 640 | @media (min-height: 1020px) { |
| 641 | #scrollIcon, #scrollTopIcon {margin-top: 14vh;} |
| 642 | } |
| 643 | @media (min-height: 1090px) { |
| 644 | #scrollIcon, #scrollTopIcon {margin-top: 16vh;} |
| 645 | } |
| 646 | @media (max-height: 880px) { |
Henri Koivuneva | 6f33f84 | 2017-11-23 03:27:31 +0200 | [diff] [blame] | 647 | #scrollIcon, #scrollTopIcon {margin-top: 2vh;} |
Henri Koivuneva | 3492c6c | 2017-11-23 04:45:03 +0200 | [diff] [blame] | 648 | } |
| 649 | @media (max-height: 850px) { |
| 650 | #scrollIcon, #scrollTopIcon {margin-top: 0vh;} |
| 651 | } |
| 652 | @media (max-height: 820px) { |
Henri Koivuneva | d27df02 | 2017-11-23 05:12:58 +0200 | [diff] [blame] | 653 | #scrollIcon, #scrollTopIcon {margin-top: -2vh;} |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 654 | .cover.top {padding: 7.5vh 0 12.5vh 0;} |
| 655 | } |
| 656 | @media (max-height: 750px) { |
Henri Koivuneva | d27df02 | 2017-11-23 05:12:58 +0200 | [diff] [blame] | 657 | #scrollIcon, #scrollTopIcon {margin-top: -8vh;} |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 658 | } |
| 659 | @media (max-height: 720px) { |
Henri Koivuneva | d27df02 | 2017-11-23 05:12:58 +0200 | [diff] [blame] | 660 | #scrollIcon, #scrollTopIcon {margin-top: -8vh;} |
Henri Koivuneva | 0d2da12 | 2017-11-23 01:22:34 +0200 | [diff] [blame] | 661 | } |
| 662 | @media (max-height: 690px) { |
Henri Koivuneva | d27df02 | 2017-11-23 05:12:58 +0200 | [diff] [blame] | 663 | #scrollIcon, #scrollTopIcon {margin-top: -10vh;} |
Henri Koivuneva | 0d2da12 | 2017-11-23 01:22:34 +0200 | [diff] [blame] | 664 | .animation {margin-top:-6vh !important;} |
| 665 | } |
| 666 | @media (max-height: 670px) { |
Henri Koivuneva | d27df02 | 2017-11-23 05:12:58 +0200 | [diff] [blame] | 667 | #scrollIcon, #scrollTopIcon {margin-top: -14vh;} |
Henri Koivuneva | 0d2da12 | 2017-11-23 01:22:34 +0200 | [diff] [blame] | 668 | .animation {margin-top:-7vh !important;} |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 669 | } |
| 670 | @media (max-height: 650px) { |
Henri Koivuneva | f259ace | 2017-11-23 04:28:03 +0200 | [diff] [blame] | 671 | #scrollIcon, #scrollTopIcon {margin-top: -14vh;} |
Henri Koivuneva | 0d2da12 | 2017-11-23 01:22:34 +0200 | [diff] [blame] | 672 | .animation {margin-top:-8vh !important;} |
| 673 | .cover.top {padding: 6vh 0 5vh 0;} |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 674 | body > div.container-fluid > div.row.cover.top > div > .row > .headline > img {max-height: 42vh;} |
| 675 | } |
Henri Koivuneva | 0d2da12 | 2017-11-23 01:22:34 +0200 | [diff] [blame] | 676 | @media (max-height: 630px) { |
Henri Koivuneva | d27df02 | 2017-11-23 05:12:58 +0200 | [diff] [blame] | 677 | #scrollIcon, #scrollTopIcon {margin-top: -19vh;} |
Henri Koivuneva | 0d2da12 | 2017-11-23 01:22:34 +0200 | [diff] [blame] | 678 | .animation {margin-top:-10vh !important;} |
| 679 | .cover.top {padding: 6vh 0 5vh 0;} |
| 680 | } |
| 681 | @media (max-height: 600px) { |
Henri Koivuneva | d27df02 | 2017-11-23 05:12:58 +0200 | [diff] [blame] | 682 | #scrollIcon, #scrollTopIcon {margin-top: -20vh;} |
Henri Koivuneva | 0d2da12 | 2017-11-23 01:22:34 +0200 | [diff] [blame] | 683 | .animation {margin-top:-13vh !important;} |
| 684 | .cover.top {padding: 6vh 0 5vh 0;} |
| 685 | } |
Henri Koivuneva | d27df02 | 2017-11-23 05:12:58 +0200 | [diff] [blame] | 686 | @media (max-height: 600px) and (orientation:landscape) { |
| 687 | #scrollIcon, #scrollTopIcon {margin-top: -20vh;display: none;} |
| 688 | } |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 689 | @media (max-height: 550px) { |
Henri Koivuneva | 0d2da12 | 2017-11-23 01:22:34 +0200 | [diff] [blame] | 690 | #scrollIcon, #scrollTopIcon {display:none} |
| 691 | .cover.top {padding: 6vh 0 3vh 0;} |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 692 | .headline {padding-top:3vh;} |
| 693 | body > div.container-fluid > div.row.cover.top > div > .row > .headline > img {max-height: 32vh;} |
| 694 | } |
| 695 | @media (max-height: 480px) { |
| 696 | #scrollIcon, #scrollTopIcon {margin-top: 0} |
| 697 | .cover.top {padding: 3vh 0 3vh 0;} |
| 698 | .headline {padding-top:1.5vh;} |
| 699 | body > div.container-fluid > div.row.cover.top > div > .row > .headline > img {max-height: 32vh;} |
| 700 | } |
| 701 | @media (max-height: 320px) { |
| 702 | .cover.top {padding: 1vh 0 3vh 0;} |
| 703 | .headline {padding-top:1vh;} |
| 704 | body > div.container-fluid > div.row.cover.top > div > .row > .headline > img {max-height: 25vh;} |
| 705 | } |
| 706 | @media (max-width: 768px) { |
| 707 | .container-fluid {padding:30px 0 !important;} |
| 708 | .h1, .h2, .h3, h1, h2, h3 { |
| 709 | margin-top: 10px; |
| 710 | margin-bottom: 10px; |
| 711 | } |
| 712 | .lead, .about, .about-info, .about-tools, .about-last {font-size: 16px} |
| 713 | .row.cover.top .lead { |
| 714 | max-width: 350px; |
| 715 | margin-left:auto; |
| 716 | margin-right: auto |
| 717 | } |
| 718 | .h4, h4 {font-size: 20px} |
| 719 | #portfolio h2 {padding-bottom: 0} |
| 720 | #portfolio > .container {padding-right: 0;padding-left: 0} |
Henri Koivuneva | af9a0dc | 2017-11-23 04:10:52 +0200 | [diff] [blame] | 721 | .portfolio-projects--btn {margin-top:0;margin-left: 4px;margin-right: 4px} |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 722 | #portfolio > div > div > div:nth-child(2) > div > div.col-sm-5.text-center.pull-right-sm > a:nth-child(4) {margin-right: 4px} |
| 723 | #portfolio > div > div > div:nth-child(2) > div > div.col-sm-5.text-center.pull-right-sm > a:nth-child(5) {margin-left: 4px} |
Henri Koivuneva | f259ace | 2017-11-23 04:28:03 +0200 | [diff] [blame] | 724 | #scrollIcon, #scrollTopIcon {font-size: 1em;} |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 725 | } |
Henri Koivuneva | 9d598a5 | 2017-11-23 01:56:48 +0200 | [diff] [blame] | 726 | @media (max-width:480px) {.row.cover.top .lead {max-width:180px}} |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 727 | @media (max-device-height: 480px) and (orientation: landscape) { |
| 728 | .navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse { |
| 729 | max-height: 240px; |
| 730 | } |
| 731 | .navbar-nav>li>a { |
| 732 | padding-top: 6px; |
| 733 | padding-bottom: 6px; |
| 734 | } |
| 735 | } |
| 736 | @media (max-width: 360px) { |
| 737 | .h1, h1 {font-size: 32px;} |
| 738 | .cover, .cover.bottom { |
| 739 | padding-left: 15px; |
| 740 | padding-right: 15px; |
| 741 | } |
| 742 | } |
| 743 | |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 744 | h1 { |
| 745 | color: #fff; |
| 746 | cursor: default; |
| 747 | } |
| 748 | |
| 749 | h1 span:nth-of-type(1) { |
| 750 | font-size: 1em; |
| 751 | line-height: 0.5em; |
| 752 | } |
| 753 | h1 span:nth-of-type(2) { |
| 754 | font-size: .4em; |
| 755 | font-weight: 400; |
| 756 | line-height: 3.65em; |
| 757 | color: #0080ff; |
| 758 | background-color: #282828; |
| 759 | padding: 3px 10px; |
| 760 | box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.6); |
| 761 | } |
| 762 | h1 span:nth-of-type(3) { |
| 763 | font-size: 1.5em; |
| 764 | line-height: .85em; |
| 765 | } |
| 766 | |
| 767 | .space { |
| 768 | will-change: transform; |
| 769 | position: relative; |
| 770 | left:-25; |
| 771 | top:auto; |
| 772 | bottom:auto; |
| 773 | margin-top:15%; |
| 774 | margin-bottom:25%; |
| 775 | margin-left: 35%; |
Henri Koivuneva | be19c19 | 2017-11-22 22:14:33 +0200 | [diff] [blame] | 776 | margin-right: auto; |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 777 | -webkit-transform: perspective(1000px) rotateX(65deg) rotateY(0deg) rotateZ(-45deg) scale(0.90); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 778 | -moz-transform: perspective(1000px) rotateX(65deg) rotateY(0deg) rotateZ(-45deg) scale(0.90); |
| 779 | -o-transform: perspective(1000px) rotateX(65deg) rotateY(0deg) rotateZ(-45deg) scale(0.90); |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 780 | transform: perspective(1000px) rotateX(65deg) rotateY(0deg) rotateZ(-45deg) scale(0.90); |
| 781 | -webkit-transition: all 600ms; |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 782 | -moz-transition: all 600ms; |
| 783 | -o-transition: all 600ms; |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 784 | transition: all 600ms; |
| 785 | } |
| 786 | |
| 787 | .space-hover { |
| 788 | position: relative; |
| 789 | left:-25; |
| 790 | top:auto; |
| 791 | bottom:auto; |
| 792 | margin-top:30%; |
| 793 | margin-bottom:25%; |
| 794 | margin-left: 45%; |
Henri Koivuneva | be19c19 | 2017-11-22 22:14:33 +0200 | [diff] [blame] | 795 | margin-right: auto; |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 796 | -webkit-transform: perspective(1000px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(0.90); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 797 | -moz-transform: perspective(1000px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(0.90); |
| 798 | -o-transform: perspective(1000px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(0.90); |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 799 | transform: perspective(1000px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(0.90); |
| 800 | } |
| 801 | |
| 802 | .phone-container { |
| 803 | width: 11.2em; |
| 804 | height: 23.33em; |
| 805 | position: absolute; |
| 806 | top: 0; |
| 807 | bottom: 0; |
| 808 | left: 0; |
| 809 | right: 0; |
| 810 | margin: auto; |
| 811 | -webkit-transform-style: preserve-3d; |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 812 | -moz-transform-style: preserve-3d; |
| 813 | -o-transform-style: preserve-3d; |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 814 | transform-style: preserve-3d; |
| 815 | -webkit-transform: translateX(-80%); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 816 | -moz-transform: translateX(-80%); |
| 817 | -o-transform: translateX(-80%); |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 818 | transform: translateX(-80%); |
| 819 | border-radius: 2.0em; |
| 820 | } |
| 821 | |
| 822 | .phone-front { |
| 823 | will-change: transform; |
| 824 | width: 11.2em; |
| 825 | height: 23.33em; |
| 826 | position: absolute; |
| 827 | top: 0; |
| 828 | bottom: 0; |
| 829 | left: 0; |
| 830 | right: 0; |
| 831 | margin: auto; |
| 832 | background-image: url("../images/phone_front.svg"); |
| 833 | background-repeat: no-repeat; |
| 834 | background-position: -.53em 0; |
| 835 | background-size: 12.3em 23.36em; |
| 836 | border-radius: 2.0em; |
| 837 | box-shadow: -20px 27px 13px 10px rgba(0, 0, 0, 0.5); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 838 | -webkit-transition: -webkit-transform 600ms, box-shadow 450ms; |
| 839 | -moz-transition: transform 600ms, box-shadow 450ms; |
| 840 | -o-transition: transform 600ms, box-shadow 450ms; |
| 841 | transition: transform 600ms, box-shadow 450ms; |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 842 | } |
| 843 | |
| 844 | .just-phone-front { |
| 845 | will-change: transform; |
| 846 | width: 11.2em; |
| 847 | height: 23.33em; |
| 848 | position: absolute; |
| 849 | right: 0; |
| 850 | margin: auto; |
| 851 | left:-25; |
| 852 | top:0; |
| 853 | bottom:auto; |
| 854 | margin-top:10%; |
| 855 | margin-bottom:15%; |
| 856 | margin-left: 35%; |
| 857 | margin-right: auto; |
| 858 | background-image: url("../images/phone_front.svg"); |
| 859 | background-repeat: no-repeat; |
| 860 | background-position: -.53em 0; |
| 861 | background-size: 12.3em 23.36em; |
| 862 | border-radius: 2.0em; |
| 863 | box-shadow: -10px 13px 7px 5px rgba(0, 0, 0, 0.5); |
| 864 | -webkit-transform: scale(0.90); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 865 | -moz-transform: scale(0.90); |
| 866 | -o-transform: scale(0.90); |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 867 | transform: scale(0.90); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 868 | -webkit-transition: -webkit-transform 600ms, box-shadow 450ms; |
| 869 | -moz-transition: transform 600ms, box-shadow 450ms; |
| 870 | -o-transition: transform 600ms, box-shadow 450ms; |
| 871 | transition: transform 600ms, box-shadow 450ms; |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 872 | } |
| 873 | |
| 874 | .phone-front-hover { |
| 875 | box-shadow: 0 12px 13px 10px rgba(0, 0, 0, 0.5); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 876 | -webkit-transition: -webkit-transform 600ms, box-shadow 450ms; |
| 877 | -moz-transition: transform 600ms, box-shadow 450ms; |
| 878 | -o-transition: transform 600ms, box-shadow 450ms; |
| 879 | transition: transform 600ms, box-shadow 450ms; |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 880 | } |
| 881 | |
| 882 | .phone-screen { |
| 883 | width: 10.5em; |
| 884 | height: 19.3em; |
| 885 | position: relative; |
| 886 | left: 0; |
| 887 | right: 0; |
| 888 | top: 2.283em; |
| 889 | margin: auto; |
| 890 | background-color: #000; |
| 891 | overflow: hidden; |
| 892 | } |
| 893 | .phone-screen::before { |
| 894 | content: ""; |
| 895 | position: absolute; |
| 896 | width: 100%; |
| 897 | height: 100%; |
| 898 | box-shadow: inset 13px 0 10px -5px rgba(250, 250, 250, 0.17), inset -13px 0 10px -5px rgba(250, 250, 250, 0.17); |
| 899 | background-image: url("../images/bliss_screens.gif"); |
| 900 | background-repeat: no-repeat; |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 901 | background-position: 50% 0; |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 902 | background-size: cover; |
| 903 | -webkit-transform: scale(1); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 904 | -moz-transform: scale(1); |
| 905 | -o-transform: scale(1); |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 906 | transform: scale(1); |
| 907 | } |
| 908 | .phone-screen::after { |
| 909 | content: ""; |
| 910 | position: absolute; |
| 911 | width: 100%; |
| 912 | height: 100%; |
| 913 | background-color: rgba(250, 250, 250, 0.1); |
| 914 | } |
| 915 | |
| 916 | .phone-side { |
| 917 | will-change: transform; |
| 918 | width: 13.33em; |
| 919 | height: 25em; |
| 920 | position: absolute; |
| 921 | top: 0; |
| 922 | bottom: 0; |
| 923 | left: 0; |
| 924 | right: 0; |
| 925 | margin: auto; |
| 926 | border-radius: 1.66em; |
| 927 | background-repeat: no-repeat; |
| 928 | background-position: 2.2em .5em; |
| 929 | background-size: 13.33em 24.73em; |
| 930 | -webkit-transform-style: preserve-3d; |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 931 | -moz-transform-style: preserve-3d; |
| 932 | -o-transform-style: preserve-3d; |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 933 | transform-style: preserve-3d; |
| 934 | -webkit-transform: skew(-1deg) translateX(-15.5%) translateY(1.2%) scaleX(0.95) scaleY(0.96) rotate(-1deg); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 935 | -moz-transform: skew(-1deg) translateX(-15.5%) translateY(1.2%) scaleX(0.95) scaleY(0.96) rotate(-1deg); |
| 936 | -o-transform: skew(-1deg) translateX(-15.5%) translateY(1.2%) scaleX(0.95) scaleY(0.96) rotate(-1deg); |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 937 | transform: skew(-1deg) translateX(-15.5%) translateY(1.2%) scaleX(0.95) scaleY(0.96) rotate(-1deg); |
| 938 | -webkit-transition: all 350ms; |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 939 | -moz-transition: all 350ms; |
| 940 | -o-transition: all 350ms; |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 941 | transition: all 350ms; |
| 942 | } |
| 943 | |
| 944 | .phone-side-hover { |
| 945 | -webkit-transform: skew(-1deg) translateX(-13.4%) translateY(1.05%) scaleX(0.83) scaleY(0.83) rotate(-1deg); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 946 | -moz-transform: skew(-1deg) translateX(-13.4%) translateY(1.05%) scaleX(0.83) scaleY(0.83) rotate(-1deg); |
| 947 | -o-transform: skew(-1deg) translateX(-13.4%) translateY(1.05%) scaleX(0.83) scaleY(0.83) rotate(-1deg); |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 948 | transform: skew(-1deg) translateX(-13.4%) translateY(1.05%) scaleX(0.83) scaleY(0.83) rotate(-1deg); |
| 949 | -webkit-transition: all 350ms; |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 950 | -moz-transition: all 350ms; |
| 951 | -o-transition: all 350ms; |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 952 | } |
| 953 | |
| 954 | @-webkit-keyframes figure-anim { |
| 955 | from { |
| 956 | border-radius: 50%; |
| 957 | -webkit-transform: rotate(0deg) scale(1); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 958 | -moz-transform: rotate(0deg) scale(1); |
| 959 | -o-transform: rotate(0deg) scale(1); |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 960 | transform: rotate(0deg) scale(1); |
| 961 | } |
| 962 | to { |
| 963 | border-radius: 30%; |
| 964 | -webkit-transform: rotate(360deg) scale(0.5); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 965 | -moz-transform: rotate(360deg) scale(0.5); |
| 966 | -o-transform: rotate(360deg) scale(0.5); |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 967 | transform: rotate(360deg) scale(0.5); |
| 968 | } |
| 969 | } |
| 970 | |
| 971 | @keyframes figure-anim { |
| 972 | from { |
| 973 | border-radius: 50%; |
| 974 | -webkit-transform: rotate(0deg) scale(1); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 975 | -moz-transform: rotate(0deg) scale(1); |
| 976 | -o-transform: rotate(0deg) scale(1); |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 977 | transform: rotate(0deg) scale(1); |
| 978 | } |
| 979 | to { |
| 980 | border-radius: 30%; |
| 981 | -webkit-transform: rotate(360deg) scale(0.5); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 982 | -moz-transform: rotate(360deg) scale(0.5); |
| 983 | -o-transform: rotate(360deg) scale(0.5); |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 984 | transform: rotate(360deg) scale(0.5); |
| 985 | } |
| 986 | } |
| 987 | @-webkit-keyframes figure-container-anim { |
| 988 | from { |
| 989 | -webkit-transform: rotate(0deg); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 990 | -moz-transform: rotate(0deg); |
| 991 | -o-transform: rotate(0deg); |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 992 | transform: rotate(0deg); |
| 993 | } |
| 994 | to { |
| 995 | -webkit-transform: rotate(360deg); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 996 | -moz-transform: rotate(360deg); |
| 997 | -o-transform: rotate(360deg); |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 998 | transform: rotate(360deg); |
| 999 | } |
| 1000 | } |
| 1001 | @keyframes figure-container-anim { |
| 1002 | from { |
| 1003 | -webkit-transform: rotate(0deg); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 1004 | -moz-transform: rotate(0deg); |
| 1005 | -o-transform: rotate(0deg); |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 1006 | transform: rotate(0deg); |
| 1007 | } |
| 1008 | to { |
| 1009 | -webkit-transform: rotate(360deg); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 1010 | -moz-transform: rotate(360deg); |
| 1011 | -o-transform: rotate(360deg); |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 1012 | transform: rotate(360deg); |
| 1013 | } |
| 1014 | } |
| 1015 | |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 1016 | @media (min-width: 1200px) { |
| 1017 | .pull-right-lg { |
| 1018 | float: right !important; } |
| 1019 | .pull-left-lg { |
| 1020 | float: left !important; } |
Henri Koivuneva | 9c1e243 | 2017-11-22 22:01:33 +0200 | [diff] [blame] | 1021 | .pull-left-md { |
| 1022 | float: left !important; } |
| 1023 | .container {max-width: 1170px;} |
Henri Koivuneva | 87bdef3 | 2017-08-25 23:50:22 +0300 | [diff] [blame] | 1024 | .portfolio-projects .col-lg-6 {width: 100%} |
| 1025 | .navbar > .container {max-width: 1170px} |
| 1026 | } |
| 1027 | @media (min-width: 1366px) { |
| 1028 | #portfolio > .container, #about > .row {width: 90%;max-width: 1600px;margin-left:auto;margin-right: auto;} |
| 1029 | .navbar > .container {max-width: 1170px} |
| 1030 | } |
Unknown | e3cf16e | 2017-11-04 16:32:52 -0400 | [diff] [blame] | 1031 | |
| 1032 | /* The alert message box */ |
| 1033 | .alert { |
| 1034 | padding: 20px; |
| 1035 | background-color: #f44336; /* Red */ |
| 1036 | color: white; |
| 1037 | margin-bottom: 15px; |
| 1038 | } |
Henri Koivuneva | c250353 | 2017-11-23 04:00:26 +0200 | [diff] [blame] | 1039 | .alert a {color: #fff;font-weight:bolder;padding-bottom:2px;margin-bottom:-2px;box-shadow: 0 2px} |
Henri Koivuneva | af9a0dc | 2017-11-23 04:10:52 +0200 | [diff] [blame] | 1040 | @media (max-width:768px) {.alert {width:90%;margin: 0 auto;}} |
Henri Koivuneva | c250353 | 2017-11-23 04:00:26 +0200 | [diff] [blame] | 1041 | @media (max-width:1200px) {.alert {margin-top:3rem}} |
Unknown | e3cf16e | 2017-11-04 16:32:52 -0400 | [diff] [blame] | 1042 | /* The close button */ |
| 1043 | .closebtn { |
| 1044 | margin-left: 15px; |
| 1045 | color: white; |
| 1046 | font-weight: bold; |
| 1047 | float: right; |
| 1048 | font-size: 22px; |
| 1049 | line-height: 20px; |
| 1050 | cursor: pointer; |
| 1051 | transition: 0.3s; |
| 1052 | } |
| 1053 | |
Unknown | b60d942 | 2017-11-27 19:40:08 -0500 | [diff] [blame] | 1054 | /* The alert message box */ |
| 1055 | .alert2 { |
| 1056 | padding: 20px; |
| 1057 | background-color: #17c13f; /* green */ |
| 1058 | color: white; |
| 1059 | margin-bottom: 15px; |
| 1060 | } |
| 1061 | .alert2 a {color: #fff;font-weight:bolder;padding-bottom:2px;margin-bottom:-2px;box-shadow: 0 2px} |
| 1062 | @media (max-width:768px) {.alert {width:90%;margin: 0 auto;}} |
| 1063 | @media (max-width:1200px) {.alert {margin-top:3rem}} |
| 1064 | /* The close button */ |
| 1065 | .closebtn { |
| 1066 | margin-left: 15px; |
| 1067 | color: white; |
| 1068 | font-weight: bold; |
| 1069 | float: right; |
| 1070 | font-size: 22px; |
| 1071 | line-height: 20px; |
| 1072 | cursor: pointer; |
| 1073 | transition: 0.3s; |
| 1074 | } |
| 1075 | |
Unknown | e3cf16e | 2017-11-04 16:32:52 -0400 | [diff] [blame] | 1076 | /* When moving the mouse over the close button */ |
| 1077 | .closebtn:hover { |
| 1078 | color: black; |
Unknown | b60d942 | 2017-11-27 19:40:08 -0500 | [diff] [blame] | 1079 | } |
Unknown | 5503061 | 2017-11-04 20:28:12 -0400 | [diff] [blame] | 1080 | |
| 1081 | .vcenter { |
| 1082 | display: inline-block; |
| 1083 | position: absolute; |
| 1084 | left: 50%; |
| 1085 | top: 50%; |
| 1086 | -webkit-transform: translate(-50%, -50%); |
| 1087 | transform: translate(-50%, -50%); |
Unknown | b60d942 | 2017-11-27 19:40:08 -0500 | [diff] [blame] | 1088 | } |
Unknown | 5503061 | 2017-11-04 20:28:12 -0400 | [diff] [blame] | 1089 | |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 1090 | /* Anim |
Unknown | b60d942 | 2017-11-27 19:40:08 -0500 | [diff] [blame] | 1091 | width: 378px; |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 1092 | height: 290px; |
| 1093 | */ |
Unknown | 5503061 | 2017-11-04 20:28:12 -0400 | [diff] [blame] | 1094 | .animation { |
| 1095 | display: inline-block; |
| 1096 | position: relative; |
Unknown | b60d942 | 2017-11-27 19:40:08 -0500 | [diff] [blame] | 1097 | width: 64rem; |
| 1098 | height: 42rem; |
Henri Koivuneva | 0d2da12 | 2017-11-23 01:22:34 +0200 | [diff] [blame] | 1099 | margin: -2vh auto 0 auto; |
Unknown | 5503061 | 2017-11-04 20:28:12 -0400 | [diff] [blame] | 1100 | vertical-align: middle; |
| 1101 | } |
Henri Koivuneva | 0d2da12 | 2017-11-23 01:22:34 +0200 | [diff] [blame] | 1102 | @media (max-width:720px) { |
| 1103 | .animation {margin-left:-30rem;margin-right:-30rem;} |
| 1104 | } |
| 1105 | @media (max-width:450px) { |
| 1106 | .animation {width:58rem;height:38rem;} |
| 1107 | } |
Henri Koivuneva | 9d598a5 | 2017-11-23 01:56:48 +0200 | [diff] [blame] | 1108 | @media (max-width:450px) { |
| 1109 | .animation {width:58rem;height:38rem;} |
| 1110 | } |
Henri Koivuneva | 0d2da12 | 2017-11-23 01:22:34 +0200 | [diff] [blame] | 1111 | @media (max-width:400px) { |
| 1112 | .animation {width:55rem;height:36rem;} |
| 1113 | } |
| 1114 | @media (max-width:380px) { |
| 1115 | .animation {width:50rem;height:33rem;} |
| 1116 | } |
| 1117 | @media (max-width:340px) { |
| 1118 | .animation {width:47rem;height:31rem;} |
| 1119 | } |
Henri Koivuneva | 9d598a5 | 2017-11-23 01:56:48 +0200 | [diff] [blame] | 1120 | @media (max-width:320px) { |
| 1121 | .animation {width:42rem;height:28rem;} |
| 1122 | } |
| 1123 | @media (max-height:650px) { |
Henri Koivuneva | 39d1e2f | 2017-11-23 04:30:54 +0200 | [diff] [blame] | 1124 | .animation {margin-top: -7vh !important;margin-bottom: 10vh !important;} |
Henri Koivuneva | 6f33f84 | 2017-11-23 03:27:31 +0200 | [diff] [blame] | 1125 | } |
| 1126 | @media (min-height:651px) { |
| 1127 | .animation {margin-top: -8vh !important;margin-bottom: 10vh !important;} |
| 1128 | } |
| 1129 | @media (min-height:670px) { |
| 1130 | .animation {margin-top: -6.5vh !important;margin-bottom: 10vh !important;} |
| 1131 | } |
| 1132 | @media (min-height:720px) { |
Henri Koivuneva | f259ace | 2017-11-23 04:28:03 +0200 | [diff] [blame] | 1133 | .animation {margin-top: -2vh !important;margin-bottom: 10vh !important;overflow-y:visible} |
Henri Koivuneva | 6f33f84 | 2017-11-23 03:27:31 +0200 | [diff] [blame] | 1134 | } |
| 1135 | @media (min-height:800px) { |
| 1136 | .animation {margin-top: 0 !important;margin-bottom: 10vh !important;overflow-y:visible} |
Henri Koivuneva | 9d598a5 | 2017-11-23 01:56:48 +0200 | [diff] [blame] | 1137 | } |
Unknown | 5503061 | 2017-11-04 20:28:12 -0400 | [diff] [blame] | 1138 | .animation .device { |
| 1139 | position: absolute; |
| 1140 | width: 100%; |
| 1141 | height: 100%; |
| 1142 | left: 50%; |
| 1143 | top: 50%; |
| 1144 | background: #111; |
| 1145 | -webkit-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); |
| 1146 | -moz-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); |
| 1147 | -ms-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); |
| 1148 | transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); |
| 1149 | -moz-transform: translate(-50%, -50%); |
| 1150 | -ms-transform: translate(-50%, -50%); |
| 1151 | -webkit-transform: translate(-50%, -50%); |
| 1152 | transform: translate(-50%, -50%); |
| 1153 | } |
| 1154 | .animation .device .phone-home-button, |
| 1155 | .animation .device .tablet-home-button { |
| 1156 | position: absolute; |
| 1157 | border-radius: 50%; |
| 1158 | background: #444; |
| 1159 | opacity: 0; |
| 1160 | z-index: 1; |
| 1161 | -webkit-transition: all 0.4s ease; |
| 1162 | -moz-transition: all 0.4s ease; |
| 1163 | -ms-transition: all 0.4s ease; |
| 1164 | transition: all 0.4s ease; |
| 1165 | } |
| 1166 | .animation .device .phone-home-button { |
| 1167 | width: 16px; |
| 1168 | height: 16px; |
| 1169 | margin-top: -8px; |
| 1170 | right: 11px; |
| 1171 | top: 50%; |
| 1172 | } |
| 1173 | .animation .device .tablet-home-button { |
| 1174 | width: 12px; |
| 1175 | height: 12px; |
| 1176 | margin-left: -6px; |
| 1177 | bottom: 7px; |
| 1178 | left: 50%; |
| 1179 | } |
| 1180 | .animation .device .screen-stand { |
| 1181 | position: absolute; |
| 1182 | width: 100%; |
| 1183 | margin-left: -10px; |
| 1184 | margin-top: -1px; |
| 1185 | top: 60%; |
| 1186 | opacity: 0; |
| 1187 | z-index: 1; |
| 1188 | -webkit-transition: all 0.4s ease-out; |
| 1189 | -moz-transition: all 0.4s ease-out; |
| 1190 | -ms-transition: all 0.4s ease-out; |
| 1191 | transition: all 0.4s ease-out; |
| 1192 | } |
| 1193 | .animation .device .screen-stand .leg { |
| 1194 | position: absolute; |
| 1195 | width: 12px; |
| 1196 | height: 16px; |
| 1197 | left: 50%; |
| 1198 | top: 0; |
| 1199 | margin-left: -6px; |
| 1200 | background: #111; |
| 1201 | } |
| 1202 | .animation .device .screen-stand .foot { |
| 1203 | position: absolute; |
| 1204 | width: 120px; |
| 1205 | height: 4px; |
| 1206 | left: 50%; |
| 1207 | top: 15px; |
| 1208 | margin-left: -60px; |
| 1209 | border-top-left-radius: 2px; |
| 1210 | border-top-right-radius: 2px; |
| 1211 | background: #111; |
| 1212 | } |
| 1213 | .animation .device .display { |
| 1214 | position: relative; |
| 1215 | width: 100%; |
| 1216 | height: 100%; |
| 1217 | overflow: hidden; |
| 1218 | background: #34495e; |
| 1219 | z-index: 3; |
| 1220 | } |
| 1221 | .animation .device .display div { |
| 1222 | position: absolute; |
| 1223 | width: 100%; |
| 1224 | height: 100%; |
| 1225 | left: 100%; |
| 1226 | white-space: nowrap; |
| 1227 | -webkit-transition: all 0.4s ease; |
| 1228 | -moz-transition: all 0.4s ease; |
| 1229 | -ms-transition: all 0.4s ease; |
| 1230 | transition: all 0.4s ease; |
| 1231 | } |
| 1232 | .animation .device .display div div { |
| 1233 | position: absolute; |
| 1234 | width: 100%; |
| 1235 | left: 0; |
| 1236 | top: 50%; |
| 1237 | margin-top: -14px; |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 1238 | font-size: 20px; |
Unknown | 5503061 | 2017-11-04 20:28:12 -0400 | [diff] [blame] | 1239 | text-align: center; |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 1240 | /* color: #0080ff;*/ |
Unknown | 5503061 | 2017-11-04 20:28:12 -0400 | [diff] [blame] | 1241 | } |
Henri Koivuneva | 0d2da12 | 2017-11-23 01:22:34 +0200 | [diff] [blame] | 1242 | @media (max-width:450px) { |
| 1243 | .animation .device .display div div {width:100%;max-width:100%;font-size:12px !important;} |
| 1244 | } |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 1245 | .animation .device .display .slide1 div {margin-top:0px;} |
Unknown | 5503061 | 2017-11-04 20:28:12 -0400 | [diff] [blame] | 1246 | .animation .device .display div div em { |
| 1247 | font-weight: bold; |
| 1248 | } |
| 1249 | .animation .device .display .slide1 { |
Unknown | d5655a2 | 2018-02-25 12:18:43 -0500 | [diff] [blame] | 1250 | /* background: #000; */ |
| 1251 | background: url("https://i.imgur.com/wCp0xpe.jpg"); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 1252 | background-size: cover; |
| 1253 | background-repeat: no-repeat; |
| 1254 | background-position: center center; |
| 1255 | text-shadow: 1px 1px 2px #1f1f1f, -1px -1px 2px #1f1f1f, -1px 0 2px #1f1f1f, 0 -1px 2px #1f1f1f, 1px 0 2px #1f1f1f, 0 1px 2px #1f1f1f, 1px -1px 2px #1f1f1f, -1px 1px 2px #1f1f1f, |
| 1256 | 2px 2px 2px #1f1f1f, -2px -2px 2px #1f1f1f, -2px 0 2px #1f1f1f, 0 -2px 2px #1f1f1f, 2px 0 2px #1f1f1f, 0 2px 2px #1f1f1f, 2px -2px 2px #1f1f1f, -2px 2px 2px #1f1f1f, |
| 1257 | 3px 3px 2px #1f1f1f, -3px -3px 2px #1f1f1f, -3px 0 2px #1f1f1f, 0 -3px 2px #1f1f1f, 3px 0 2px #1f1f1f, 0 3px 2px #1f1f1f, 3px -3px 2px #1f1f1f, -3px 3px 2px #1f1f1f, |
| 1258 | 4px 4px 4px #1f1f1f, -4px -4px 4px #1f1f1f, -4px 0 4px #1f1f1f, 0 -4px 4px #1f1f1f, 4px 0 4px #1f1f1f, 0 4px 4px #1f1f1f, 4px -4px 4px #1f1f1f, -4px 4px 4px #1f1f1f; |
| 1259 | color:white; |
Unknown | 5503061 | 2017-11-04 20:28:12 -0400 | [diff] [blame] | 1260 | } |
| 1261 | .animation .device .display .slide2 { |
Unknown | d5655a2 | 2018-02-25 12:18:43 -0500 | [diff] [blame] | 1262 | /* background: #000; */ |
| 1263 | background: url("https://i.imgur.com/KfArkPZ.jpg"); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 1264 | background-size: cover; |
| 1265 | background-repeat: no-repeat; |
| 1266 | background-position: center center; |
| 1267 | text-shadow: 1px 1px 2px #fff, -1px -1px 2px #fff, -1px 0 2px #fff, 0 -1px 2px #fff, 1px 0 2px #fff, 0 1px 2px #fff, 1px -1px 2px #fff, -1px 1px 2px #fff, |
| 1268 | 2px 2px 2px #fff, -2px -2px 2px #fff, -2px 0 2px #fff, 0 -2px 2px #fff, 2px 0 2px #fff, 0 2px 2px #fff, 2px -2px 2px #fff, -2px 2px 2px #fff, |
| 1269 | 3px 3px 2px #fff, -3px -3px 2px #fff, -3px 0 2px #fff, 0 -3px 2px #fff, 3px 0 2px #fff, 0 3px 2px #fff, 3px -3px 2px #fff, -3px 3px 2px #fff, |
| 1270 | 4px 4px 4px #fff, -4px -4px 4px #fff, -4px 0 4px #fff, 0 -4px 4px #fff, 4px 0 4px #fff, 0 4px 4px #fff, 4px -4px 4px #fff, -4px 4px 4px #fff; |
| 1271 | color:#0080ff; |
Unknown | 5503061 | 2017-11-04 20:28:12 -0400 | [diff] [blame] | 1272 | } |
| 1273 | .animation .device .display .slide3 { |
Unknown | d5655a2 | 2018-02-25 12:18:43 -0500 | [diff] [blame] | 1274 | /* background: #000; */ |
| 1275 | background: url("https://i.imgur.com/c55mey7.jpg"); |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 1276 | background-size: cover; |
| 1277 | background-repeat: no-repeat; |
| 1278 | background-position: center center; |
| 1279 | text-shadow: 1px 1px 2px #000, -1px -1px 2px #000, -1px 0 2px #000, 0 -1px 2px #000, 1px 0 2px #000, 0 1px 2px #000, 1px -1px 2px #000, -1px 1px 2px #000, |
| 1280 | 2px 2px 2px #000, -2px -2px 2px #000, -2px 0 2px #000, 0 -2px 2px #000, 2px 0 2px #000, 0 2px 2px #000, 2px -2px 2px #000, -2px 2px 2px #000, |
| 1281 | 3px 3px 2px #000, -3px -3px 2px #000, -3px 0 2px #000, 0 -3px 2px #000, 3px 0 2px #000, 0 3px 2px #000, 3px -3px 2px #000, -3px 3px 2px #000, |
| 1282 | 4px 4px 4px #000, -4px -4px 4px #000, -4px 0 4px #000, 0 -4px 4px #000, 4px 0 4px #000, 0 4px 4px #000, 4px -4px 4px #000, -4px 4px 4px #000; |
| 1283 | color:white; |
Unknown | 5503061 | 2017-11-04 20:28:12 -0400 | [diff] [blame] | 1284 | } |
| 1285 | .animation[data-animation-step="1"] .device { |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 1286 | width: 87%; |
| 1287 | height: 90%; |
Unknown | 5503061 | 2017-11-04 20:28:12 -0400 | [diff] [blame] | 1288 | padding: 10px; |
| 1289 | border-radius: 4px; |
| 1290 | } |
| 1291 | .animation[data-animation-step="1"] .device .slide1 { |
| 1292 | left: 0%; |
| 1293 | } |
| 1294 | .animation[data-animation-step="1"] .device .screen-stand { |
| 1295 | opacity: 1; |
| 1296 | top: 100%; |
| 1297 | } |
| 1298 | .animation[data-animation-step="2"] .device { |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 1299 | width: 74%; |
| 1300 | height: 75%; |
| 1301 | padding: 16px; |
Unknown | 5503061 | 2017-11-04 20:28:12 -0400 | [diff] [blame] | 1302 | border-radius: 10px; |
| 1303 | } |
| 1304 | .animation[data-animation-step="2"] .device .slide1 { |
| 1305 | left: -100%; |
| 1306 | } |
| 1307 | .animation[data-animation-step="2"] .device .slide2 { |
| 1308 | left: 0%; |
| 1309 | } |
| 1310 | .animation[data-animation-step="2"] .device .tablet-home-button { |
| 1311 | opacity: 1; |
| 1312 | } |
| 1313 | .animation[data-animation-step="3"] .device { |
Henri Koivuneva | 60a0856 | 2017-11-23 00:43:58 +0200 | [diff] [blame] | 1314 | width: 27%; |
| 1315 | height: 75%; |
Henri Koivuneva | 1cdd2cd | 2017-11-23 02:12:44 +0200 | [diff] [blame] | 1316 | padding: 16px 4px; |
Unknown | 5503061 | 2017-11-04 20:28:12 -0400 | [diff] [blame] | 1317 | border-radius: 6px; |
| 1318 | } |
| 1319 | .animation[data-animation-step="3"] .device .slide1, |
| 1320 | .animation[data-animation-step="3"] .device .slide2 { |
| 1321 | left: -100%; |
| 1322 | } |
| 1323 | .animation[data-animation-step="3"] .device .slide3 { |
| 1324 | left: 0%; |
| 1325 | } |
| 1326 | .animation[data-animation-step="3"] .device .phone-home-button { |
| 1327 | opacity: 1; |
| 1328 | } |
Henri Koivuneva | 6f33f84 | 2017-11-23 03:27:31 +0200 | [diff] [blame] | 1329 | @media (min-height:800px) { |
| 1330 | .animation[data-animation-step="1"] .device {width:87%; height:90%;} |
| 1331 | .animation[data-animation-step="2"] .device {width:80%; height:80%;} |
| 1332 | .animation[data-animation-step="3"] .device {width:28%; height:80%;} |
| 1333 | } |
Henri Koivuneva | 0d2da12 | 2017-11-23 01:22:34 +0200 | [diff] [blame] | 1334 | @media (max-height:720px) { |
| 1335 | .animation[data-animation-step="1"] .device {width:72%; height:75%;} |
| 1336 | .animation[data-animation-step="2"] .device {width:59%; height:60%;} |
Henri Koivuneva | 9f8af43 | 2017-11-23 05:00:30 +0200 | [diff] [blame] | 1337 | .animation[data-animation-step="3"] .device {width:22%; height:63%;} |
Henri Koivuneva | 0d2da12 | 2017-11-23 01:22:34 +0200 | [diff] [blame] | 1338 | .animation .device .display div div {font-size:16px;} |
| 1339 | } |
| 1340 | @media (max-height:650px) { |
| 1341 | .animation[data-animation-step="1"] .device {width:62%; height:65%;} |
| 1342 | .animation[data-animation-step="2"] .device {width:54%; height:55%;} |
Henri Koivuneva | d27df02 | 2017-11-23 05:12:58 +0200 | [diff] [blame] | 1343 | .animation[data-animation-step="3"] .device {width:22%; height:63%;} |
Henri Koivuneva | 0d2da12 | 2017-11-23 01:22:34 +0200 | [diff] [blame] | 1344 | .animation .device .display div div {font-size:15px;} |
| 1345 | } |
Henri Koivuneva | 9d598a5 | 2017-11-23 01:56:48 +0200 | [diff] [blame] | 1346 | @media (max-width:560px) { |
Henri Koivuneva | bd03c01 | 2017-11-23 02:20:26 +0200 | [diff] [blame] | 1347 | .animation[data-animation-step="1"] .device {margin-top:1%;width:72%; height:75%;} |
| 1348 | .animation[data-animation-step="2"] .device {margin-top:1%;width:65%; height:66%;} |
| 1349 | .animation[data-animation-step="3"] .device {margin-top:1%;width:28%; height:80%;} |
Henri Koivuneva | 9d598a5 | 2017-11-23 01:56:48 +0200 | [diff] [blame] | 1350 | .animation .device .display div div {font-size:15px;} |
| 1351 | } |
| 1352 | @media (max-width:520px) { |
| 1353 | .animation[data-animation-step="1"] .device {margin-top:0%;width:66%; height:69%;} |
| 1354 | .animation[data-animation-step="2"] .device {margin-top:0%;width:62%; height:63%;} |
Henri Koivuneva | bd03c01 | 2017-11-23 02:20:26 +0200 | [diff] [blame] | 1355 | .animation[data-animation-step="3"] .device {margin-top:0%;width:28%; height:80%;} |
Henri Koivuneva | 9d598a5 | 2017-11-23 01:56:48 +0200 | [diff] [blame] | 1356 | .animation .device .display div div {font-size:15px;} |
| 1357 | } |
| 1358 | @media (max-width:460px) { |
| 1359 | .animation[data-animation-step="1"] .device {margin-top:0%;width:58%; height:61%;} |
| 1360 | .animation[data-animation-step="2"] .device {margin-top:0%;width:54%; height:55%;} |
Henri Koivuneva | 0e02df6 | 2017-11-23 04:33:04 +0200 | [diff] [blame] | 1361 | .animation[data-animation-step="3"] .device {margin-top:0%;width:25%; height:72%;} |
Henri Koivuneva | 9d598a5 | 2017-11-23 01:56:48 +0200 | [diff] [blame] | 1362 | .animation .device .display div div {font-size:15px;} |
| 1363 | } |
Henri Koivuneva | 0d2da12 | 2017-11-23 01:22:34 +0200 | [diff] [blame] | 1364 | @media (max-width:350px) { |
| 1365 | .animation[data-animation-step="1"] .device {margin-top:3%;width:62%; height:65%;} |
| 1366 | .animation[data-animation-step="2"] .device {margin-top:3%;width:58%; height:60%;} |
| 1367 | .animation[data-animation-step="3"] .device {margin-top:9%;width:30%; height:80%;} |
| 1368 | .animation .device .display div div {font-size:15px;} |
| 1369 | } |
Henri Koivuneva | 9d598a5 | 2017-11-23 01:56:48 +0200 | [diff] [blame] | 1370 | @media (max-width:320px) { |
| 1371 | .animation[data-animation-step="1"] .device {margin-top:6%;width:62%; height:65%;} |
| 1372 | .animation[data-animation-step="2"] .device {margin-top:6%;width:58%; height:60%;} |
| 1373 | .animation[data-animation-step="3"] .device {margin-top:12%;width:30%; height:80%;} |
| 1374 | .animation .device .display div div {font-size:15px;} |
| 1375 | } |
Henri Koivuneva | 9c1e243 | 2017-11-22 22:01:33 +0200 | [diff] [blame] | 1376 | |
| 1377 | /* More media queries */ |
| 1378 | @media (max-width: 430px) { |
| 1379 | h2, .h2 {font-size: 30px;} |
Unknown | b60d942 | 2017-11-27 19:40:08 -0500 | [diff] [blame] | 1380 | } |