Blame - css/style.css - blissroms.github.io

blob: 97a662f9abfb1dae68c82d07ab7351c7f9bc5d50 [file] [log] [blame]

Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	1	* {
				2	box-sizing: border-box; }
				3
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	4	img {
				5	width: 100%; }
				6
				7	body {
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	8	font-family: "Comfortaa", Helvetica, Arial, sans-serif;
Henri Koivuneva	468d169	2017-08-12 16:24:41 +0300	[diff] [blame]	9	line-height: 1.4;
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	10	background-color: #0080ff;
Henri Koivuneva	5c411dd	2017-08-25 22:59:59 +0300	[diff] [blame]	11	}
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	12
Henri Koivuneva	468d169	2017-08-12 16:24:41 +0300	[diff] [blame]	13	h1, .h1,
				14	h2, .h2,
				15	h3, .h3,
				16	h4, .h4,
				17	h5, .h5,
				18	h6, .h6 {
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	19	font-family: "Comfortaa", Helvetica, Arial, sans-serif;
Henri Koivuneva	468d169	2017-08-12 16:24:41 +0300	[diff] [blame]	20	line-height: 1.4;
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	21	color: #07374a; }
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	22	h1, .h1 {font-size: 64px;}
				23	h2, .h2 {font-size: 42px;}
				24	h4, .h4 {font-weight: bolder;}
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	25
				26	p {
				27	font-family: "Comfortaa", sans-serif;
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	28	color: #ffffff;
				29	margin: 0 0 30px; }
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	30
Henri Koivuneva	0f98819	2017-08-12 15:28:05 +0300	[diff] [blame]	31	a, .btn {
Henri Koivuneva	f70ddbc	2017-08-12 15:36:36 +0300	[diff] [blame]	32	-webkit-transition: color .2s ease 0s, border-color .2s ease 0s, background-color .2s ease 0s;
				33	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]	34	}
				35
Henri Koivuneva	7f26602	2017-08-12 15:25:19 +0300	[diff] [blame]	36	a:hover, a:focus, a:active {text-decoration: none;}
				37
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	38	body > .container-fluid {
Henri Koivuneva	28ce8c6	2017-08-13 03:01:23 +0300	[diff] [blame]	39	padding: 0; }
Henri Koivuneva	7edca39	2017-08-12 16:23:52 +0300	[diff] [blame]	40
Henri Koivuneva	f63e2a9	2017-08-12 16:37:49 +0300	[diff] [blame]	41	#portfolio > .container {
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	42	padding-left: 30px;
				43	padding-right: 30px;
				44	}
				45	#portfolio > div > div > div {padding-right: 0;padding-left: 0}
Henri Koivuneva	f63e2a9	2017-08-12 16:37:49 +0300	[diff] [blame]	46
Unknown	e3cf16e	2017-11-04 16:32:52 -0400	[diff] [blame]	47	#family-lt > .container {
				48	padding-left: 30px;
				49	padding-right: 30px;
				50	}
				51	#family-lt > div > div > div {padding-right: 0;padding-left: 0}
				52
Henri Koivuneva	bcf672a	2017-08-12 16:25:03 +0300	[diff] [blame]	53	.row,
				54	.container-fluid>.navbar-collapse,
				55	.container-fluid>.navbar-header,
				56	.container>.navbar-collapse,
				57	.container>.navbar-header {
Henri Koivuneva	17653c5	2017-08-12 18:12:07 +0300	[diff] [blame]	58	margin:auto;
				59	}
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	60
				61	.container-fluid .text-muted {
				62	margin: 20px 0; }
				63
				64	.btn:focus, a:focus {
				65	outline: none !important; }
				66
				67	.navbar {
				68	height: 70px;
				69	background-color: transparent;
				70	background: transparent;
				71	border: none;
				72	color: #ffffff;
				73	z-index: 100;
				74	margin-bottom: 0;
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	75	padding-left: 30px;
				76	padding-right: 30px;
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	77	border-radius: 0;
Henri Koivuneva	f70ddbc	2017-08-12 15:36:36 +0300	[diff] [blame]	78	-webkit-transition: background-color .2s ease 0s;
Unknown	2e345c4	2017-08-14 18:25:38 -0400	[diff] [blame]	79	transition: background-color .2s ease 0s; }
Henri Koivuneva	3de908d	2017-08-13 02:43:42 +0300	[diff] [blame]	80	.navbar > .container {padding: 4px 0 0 0;width: 100%;margin-top:2px;}
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	81	.navbar-brand {
Henri Koivuneva	e184123	2017-08-12 21:55:21 +0300	[diff] [blame]	82	opacity: 0;
Henri Koivuneva	3de908d	2017-08-13 02:43:42 +0300	[diff] [blame]	83	margin-top: 5px;
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	84	padding: 15px 0;
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	85	color: #ffffff;
				86	font-weight: 400; }
				87
				88	.navbar-default .navbar-nav > li > a {
				89	color: #ffffff;
				90	font-weight: 500;
				91	font-size: 1em;
				92	text-transform: lowercase;
Henri Koivuneva	3de908d	2017-08-13 02:43:42 +0300	[diff] [blame]	93	margin: 3px 5px;
Henri Koivuneva	c93da97	2017-08-12 15:18:06 +0300	[diff] [blame]	94	border: 1px solid transparent;
Henri Koivuneva	4d964cb	2017-08-12 15:22:55 +0300	[diff] [blame]	95	border-radius: 5px;
Henri Koivuneva	f70ddbc	2017-08-12 15:36:36 +0300	[diff] [blame]	96	-webkit-transition: color .2s ease 0s, border-color .2s ease 0s;
				97	transition: color .2s ease 0s, border-color .2s ease 0s; }
Henri Koivuneva	bcf672a	2017-08-12 16:25:03 +0300	[diff] [blame]	98	.navbar-default .navbar-nav > li:last-child > a {margin-right: 0}
Henri Koivuneva	c93da97	2017-08-12 15:18:06 +0300	[diff] [blame]	99	.navbar-default .navbar-nav > li > a:hover {
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	100	color: #ffffff;
				101	border: 1px solid #ffffff; }
Henri Koivuneva	c93da97	2017-08-12 15:18:06 +0300	[diff] [blame]	102	.navbar-default .navbar-nav > li > a:active,
				103	.navbar-default .navbar-nav > li > a:focus,
				104	.navbar.solid .navbar-nav > li > a:active, .navbar.solid .navbar-nav > li > a:focus {
				105	color: rgba(255,255,255,0.8);
				106	border: 1px solid rgba(255,255,255,0.8); }
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	107	.navbar-default .navbar-nav > li > a:visited {
				108	color: #ffffff;
				109	text-decoration: none; }
Henri Koivuneva	c93da97	2017-08-12 15:18:06 +0300	[diff] [blame]	110	.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover {
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	111	background-color: transparent;
				112	color: #ffffff; }
Henri Koivuneva	c93da97	2017-08-12 15:18:06 +0300	[diff] [blame]	113	.navbar-default .navbar-nav > .active > a:focus,
				114	.navbar.solid .navbar-nav > li > a:active,
				115	.navbar.solid .navbar-nav > li > a:focus {
				116	background-color: transparent;
				117	color: rgba(255,255,255,0.8); }
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	118	.navbar-toggle {margin-right:0px;padding:15px;}
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	119	.navbar-default .navbar-toggle {
				120	border-color: #ffffff; }
				121	.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
Henri Koivuneva	17653c5	2017-08-12 18:12:07 +0300	[diff] [blame]	122	background-color: #07374a;
				123	}
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	124	.navbar-default .navbar-toggle .icon-bar {
				125	color: #ffffff;
				126	background-color: #ffffff; }
Henri Koivuneva	6b7c796	2017-08-12 21:54:58 +0300	[diff] [blame]	127	.navbar-default .navbar-collapse.collapse.in ul {
Henri Koivuneva	17653c5	2017-08-12 18:12:07 +0300	[diff] [blame]	128	background-color: #07374a;
				129	}
Henri Koivuneva	6b7c796	2017-08-12 21:54:58 +0300	[diff] [blame]	130	.navbar-collapse.collapsing {
Henri Koivuneva	17653c5	2017-08-12 18:12:07 +0300	[diff] [blame]	131	background-color: #07374a;
Henri Koivuneva	5e6ed7a	2017-08-12 18:14:02 +0300	[diff] [blame]	132	}
				133	.navbar-default .navbar-toggle .icon-bar {
				134	color: #ffffff;
				135	background-color: #ffffff; }
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	136	.navbar-default .navbar-collapse.collapse.in ul {
nilac8991	c165503	2017-08-19 12:37:44 +0200	[diff] [blame]	137	background-color: #07374a;
Henri Koivuneva	5e6ed7a	2017-08-12 18:14:02 +0300	[diff] [blame]	138	}
Unknown	94e4caa	2017-08-12 10:48:07 -0400	[diff] [blame]	139	.navbar-collapse.collapse.collapsing {
				140	background-color: #07374a;
Henri Koivuneva	17653c5	2017-08-12 18:12:07 +0300	[diff] [blame]	141	}
nilac8991	c165503	2017-08-19 12:37:44 +0200	[diff] [blame]	142
Henri Koivuneva	5e6ed7a	2017-08-12 18:14:02 +0300	[diff] [blame]	143	.navbar-collapse.collapse.show {
Henri Koivuneva	17653c5	2017-08-12 18:12:07 +0300	[diff] [blame]	144	background-color: #07374a;
				145	-webkit-transition: background-color .2s ease 0s;
				146	transition: background-color .2s ease 0s;
Henri Koivuneva	e15afea	2017-08-12 18:23:45 +0300	[diff] [blame]	147	-webkit-border-bottom-left-radius: 4px;
				148	-webkit-border-bottom-right-radius: 4px;
				149	border-bottom-left-radius: 4px;
				150	border-bottom-right-radius: 4px;
Henri Koivuneva	17653c5	2017-08-12 18:12:07 +0300	[diff] [blame]	151	}
Henri Koivuneva	936cb39	2017-08-12 18:49:20 +0300	[diff] [blame]	152
				153	.navbar-collapse .navbar-nav > li > a,
				154	.navbar-collapse .navbar-nav > li > a:hover,
				155	.navbar-collapse .navbar-nav > li > a:focus,
				156	.navbar-collapse .navbar-nav > li > a:active {
				157	border-color: transparent !important;
				158	}
				159
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	160	/* Solid class attached on scroll past first section */
				161	.navbar.solid {
				162	background-color: #07374a;
Unknown	2e345c4	2017-08-14 18:25:38 -0400	[diff] [blame]	163	top: 0;
Henri Koivuneva	5c411dd	2017-08-25 22:59:59 +0300	[diff] [blame]	164	width: 100%;
				165	margin: 0px 0%;
Unknown	2e345c4	2017-08-14 18:25:38 -0400	[diff] [blame]	166	box-shadow: 0 7px 8px 0px rgba(0,0,0,0.3);
Henri Koivuneva	f70ddbc	2017-08-12 15:36:36 +0300	[diff] [blame]	167	-webkit-transition: background-color .2s ease 0s;
				168	transition: background-color .2s ease 0s;
Unknown	2e345c4	2017-08-14 18:25:38 -0400	[diff] [blame]	169	-webkit-transition: box-shadow .2s ease 0s;
Henri Koivuneva	5c411dd	2017-08-25 22:59:59 +0300	[diff] [blame]	170	transition: box-shadow .2s ease 0s;
				171	}
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	172	.navbar.solid .navbar-brand {
Henri Koivuneva	e184123	2017-08-12 21:55:21 +0300	[diff] [blame]	173	opacity: 1;
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	174	display: inline-block;
				175	color: #ffffff;
Henri Koivuneva	e184123	2017-08-12 21:55:21 +0300	[diff] [blame]	176	-webkit-transition: color .2s ease 0s, border-color .2s ease 0s, opacity .2s ease 0s;
				177	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]	178	.navbar.solid .navbar-nav > li > a {
				179	color: #ffffff;
Henri Koivuneva	f70ddbc	2017-08-12 15:36:36 +0300	[diff] [blame]	180	-webkit-transition: color .2s ease 0s, border-color .2s ease 0s;
				181	transition: color .2s ease 0s, border-color .2s ease 0s; }
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	182
				183	.cover {
Henri Koivuneva	28ce8c6	2017-08-13 03:01:23 +0300	[diff] [blame]	184	padding: 6% 0 8% 0; }
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	185	.cover.top {
Henri Koivuneva	0752d23	2017-08-12 18:08:32 +0300	[diff] [blame]	186	padding: 10vh 0 15vh 0;
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	187	height: 100vh;
				188	display: -webkit-box;
				189	display: -ms-flexbox;
				190	display: flex;
				191	background-color: #0080ff; }
				192	.cover.bottom {
Henri Koivuneva	28ce8c6	2017-08-13 03:01:23 +0300	[diff] [blame]	193	padding: 6% 0 5.5% 0; }
				194	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]	195	@media (max-width: 550px) {
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	196	.cover, .cover.bottom {padding: 17.5% 30px 17.5% 30px; } }
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	197
				198	.headline {
				199	padding-top: 6.25em; }
Henri Koivuneva	0752d23	2017-08-12 18:08:32 +0300	[diff] [blame]	200	body > div.container-fluid > div.row.cover.top > div > .row > .headline > img {
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	201	max-width: 1600px;
				202	width: 100%;
Henri Koivuneva	0752d23	2017-08-12 18:08:32 +0300	[diff] [blame]	203	margin: 0 auto;
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	204	padding-right: 30px;
				205	padding-left: 30px;
Henri Koivuneva	0752d23	2017-08-12 18:08:32 +0300	[diff] [blame]	206	display: block; }
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	207	@media screen and (min-width: 768px) {
				208	.headline {
				209	padding-top: 3.75em; } }
				210	@media screen and (min-width: 992px) {
				211	.headline {
				212	padding-top: 1.5625em; } }
				213	@media screen and (min-width: 1200px) {
				214	.headline {
				215	padding-top: 0px; } }
				216
				217	#about {
				218	background-color: #07374a; }
				219	#about h2 {
				220	color: #0080ff; }
Henri Koivuneva	28ce8c6	2017-08-13 03:01:23 +0300	[diff] [blame]	221	#about > div > div.row.break > div > p {margin-bottom: 15px}
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	222
				223	.profile-img {
				224	margin-bottom: 15px;
				225	width: 120px; }
				226
				227	.about, .about-info, .about-tools, .about-last {
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	228	padding: 4% 30px 1% 30px;
				229	font-size: 18px; }
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	230	.about-tools {
				231	padding-top: 4.375em;
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	232	font-size: 18px; }
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	233	@media screen and (min-width: 992px) {
				234	.about-tools {
				235	padding-top: 5.625em; } }
				236	.about-tools ul:first-child {
				237	padding-left: 0px; }
				238	.about-tools ul {
				239	color: #0080ff;
				240	list-style: none; }
				241	.about-tools ul li {
				242	padding-top: 0.75em; }
				243	.about-last {
				244	padding-top: 3.125em;
				245	padding-bottom: 0;
				246	font-size: 1.125em; }
				247	@media screen and (min-width: 992px) {
				248	.about-last {
				249	padding-top: 0; } }
				250	.about-last p {
				251	color: #0080ff; }
				252
				253	#portfolio {
				254	background-color: #0080ff; }
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	255
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	256	.portfolio-projects--btn {
				257	background: transparent;
				258	color: #07374a;
				259	border: 1px solid #07374a;
				260	border-radius: 5px;
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	261	margin-bottom: 1.25em;
				262	font-size: 18px;
				263	margin: 0 8px; }
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	264	.portfolio-projects--btn:hover {
				265	background: #07374a;
				266	color: #ffffff; }
Henri Koivuneva	d8283ac	2017-08-12 15:05:35 +0300	[diff] [blame]	267	.portfolio-projects--btn:focus,
				268	.portfolio-projects--btn:active {
				269	background: #052a38;
				270	color: #ffffff; }
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	271	.portfolio-projects--image {
				272	margin-bottom: 1.875em;
				273	padding-top: 5%; }
				274
Henri Koivuneva	be19c19	2017-11-22 22:14:33 +0200	[diff] [blame^]	275	.about-tools ul li, .contact-social-icons ul a li {
				276	text-align: center; }
				277
				278	.centered {
				279	float: none;
				280	margin-left: auto;
				281	margin-right: auto; }
				282
				283
				284	.vcenter {
				285	display: inline-block;
				286	vertical-align: middle;
				287	float: none; }
				288
				289	.break {
				290	clear: both;
				291	margin-top: 10px; }
				292
				293	@media (min-width: 360px) {
Henri Koivuneva	5c411dd	2017-08-25 22:59:59 +0300	[diff] [blame]	294	#team > .container .row > div {width: 100%;margin: 0;}
				295	}
				296
Henri Koivuneva	be19c19	2017-11-22 22:14:33 +0200	[diff] [blame^]	297	@media (min-width: 768px) {
				298	.pull-right-sm {
				299	float: right !important; }
				300	.pull-left-sm {
				301	float: left !important; }
				302	.container {width: 768px}
				303	.navbar-right {margin-right: 0;}
				304	.navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand {margin-left: 0;padding-left: 15px}
				305	}
				306	@media (min-width: 992px) {
				307	.pull-right-md {
				308	float: right !important; }
				309	.pull-left-md {
				310	float: left !important; }
				311	.container {width: 94%;}
				312	}
				313	@media (min-width: 1200px) {
				314	.pull-right-lg {
				315	float: right !important; }
				316	.pull-left-lg {
				317	float: left !important; }
				318	.container {width: 1170px;}
				319	.portfolio-projects .col-lg-6 {width: 100%}
				320	.navbar > .container {max-width: 1170px}
				321	}
				322	@media (min-width: 1366px) {
				323	#portfolio > .container, #about > .row {width: 90%;max-width: 1600px;margin-left:auto;margin-right: auto;}
				324	.navbar > .container {max-width: 1170px}
				325	}
				326
				327	@media (min-width: 768px) {
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	328	.portfolio-projects {
				329	margin-top: 0.625em; } }
				330	.portfolio-projects--title {
				331	margin-top: 0.9375em;
				332	font-size: 20px; }
Henri Koivuneva	be19c19	2017-11-22 22:14:33 +0200	[diff] [blame^]	333	@media (min-width: 768px) {
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	334	.portfolio-projects--title {
				335	margin-top: 0;
				336	font-size: 21px; }
				337	.portfolio-projects--desc {
				338	margin-top: 30px;
				339	margin-bottom: 30px;
				340	font-size: 16px; }
				341	.portfolio-projects--btn {font-size: 14px;margin:0 4px 16px 4px;}
				342	#portfolio > div > div > div:nth-child(1) > div > div.col-sm-5.text-center,
				343	#portfolio > div > div > div:nth-child(2) > div > div.col-sm-7.text-center.pull-right-sm {padding-left:0;}
				344	#portfolio > div > div > div:nth-child(1) > div > div.col-sm-7.text-center,
				345	#portfolio > div > div > div:nth-child(2) > div > div.col-sm-5.text-center.pull-right-sm {padding-right: 0;} }
				346	@media screen and (min-width: 992px) {
				347	.portfolio-projects--title {
				348	margin-top: 15%;
				349	font-size: 30px; }
				350	#portfolio > div > div > div:nth-child(2) > div > div.col-sm-5.text-center.pull-right-sm > a:nth-child(4) {margin-left:-8px;}
				351	#portfolio > div > div > div:nth-child(2) > div > div.col-sm-5.text-center.pull-right-sm > a:nth-child(5) {margin-right:-8px;} }
				352	@media screen and (min-width: 1080px) {
				353	.portfolio-projects--title {
				354	margin-top: 24%;
				355	font-size: 21px; }
				356	}
				357	@media screen and (min-width: 1200px) {
				358	.portfolio-projects--title {
				359	margin-top: 24%;
				360	font-size: 24px; }
				361	.portfolio-projects--desc {
				362	margin-top: 30px;
				363	margin-bottom: 30px;
				364	font-size: 18px; }
				365	.portfolio-projects .col-lg-6 + .col-lg-6 + .col-lg-6 {margin-top:40px}
				366	.portfolio-projects--btn {font-size: 18px;margin:0 8px;} }
				367	@media screen and (min-width: 1366px) {
				368	.portfolio-projects--title {margin-top:28%;}
				369	}
				370	@media (min-width: 1500px) {
				371	.portfolio-projects--title {font-size: 28px;margin-top:31%;}
				372	.portfolio-projects--btn {font-size: 21px}
				373	}
				374
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	375	#contact {
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	376	background-color: #07374a;
				377	padding-left: 15px;
				378	padding-right: 15px }
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	379	#contact h2 {
				380	color: #0080ff; }
				381
				382	.contact-social-icons p {
				383	color: #0080ff; }
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	384	.contact-social-icons > ul {padding:0;margin:0 auto;}
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	385	.contact-social-icons ul a {
				386	color: #0080ff;
				387	list-style: none; }
Henri Koivuneva	d8283ac	2017-08-12 15:05:35 +0300	[diff] [blame]	388	.contact-social-icons ul a:hover,
Henri Koivuneva	bef78a6	2017-08-12 22:32:07 +0300	[diff] [blame]	389	.team-links-list a:hover,
				390	.family-links-list a:hover {
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	391	color: #ffffff; }
Henri Koivuneva	d8283ac	2017-08-12 15:05:35 +0300	[diff] [blame]	392	.contact-social-icons ul a:focus,
				393	.contact-social-icons ul a:active,
				394	.team-links-list a:focus,
Henri Koivuneva	bef78a6	2017-08-12 22:32:07 +0300	[diff] [blame]	395	.team-links-list a:active,
				396	.family-links-list a:focus,
				397	.family-links-list a:active {
Henri Koivuneva	d8283ac	2017-08-12 15:05:35 +0300	[diff] [blame]	398	color: rgba(255,255,255,0.8); }
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	399	.contact-social-icons ul a li {
				400	display: inline-block;
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	401	padding: 1.25%;
				402	font-size: 16px }
Henri Koivuneva	1623418	2017-08-13 03:09:43 +0300	[diff] [blame]	403	@media (max-width: 1200px) {
Henri Koivuneva	c9c6ac6	2017-08-13 03:12:28 +0300	[diff] [blame]	404	#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]	405	#family > div > div.row > div.center > div:last-child {margin-bottom: 0}
				406	}
				407	@media (max-width: 720px) {
				408	#family > div > div.row > div.center > div {margin:1.5em 4% 3em 4%;width:92%;}
				409	}
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	410
				411	.footer {
Henri Koivuneva	28ce8c6	2017-08-13 03:01:23 +0300	[diff] [blame]	412	padding-top: 1em;
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	413	bottom: 0;
				414	width: 100%;
				415	/* Set the fixed height of the footer here */
Unknown	f0310a8	2017-08-12 19:32:49 -0400	[diff] [blame]	416	background-color: #052a38;
				417
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	418	color: #ffffff; }
electrikjesus	34f27d1	2017-08-12 17:13:35 -0400	[diff] [blame]	419	.footer-role, .footer-name, .footer-description {
				420	color: #FFFFFF;
				421	}
				422	.footer-description {
				423	color: #fff;
				424	font-size: 18px;
				425	}
				426	.footer-role h4, .footer-links-list a {
				427	color: #0080ff;
				428	}
				429	.footer-header h4 {
				430	color: #0080ff;
				431	}
Unknown	8e40a3b	2017-07-30 14:47:14 -0400	[diff] [blame]	432	#scrollIcon, #scrollTopIcon {
				433	margin-top: 200px;
				434	padding: 10px;
				435	font-size: 1.5em;
				436	color: #07374a;
				437	border: solid 2px #07374a;
				438	border-radius: 50%; }
				439
				440	#scrollTopIcon {
				441	margin-top: 10px;
				442	font-size: 1em;
				443	color: #ffffff;
				444	border-color: #ffffff; }
				445
				446	.back-to-top {
				447	display: none; }
				448	.back-to-top.visible {
				449	display: block; }
Unknown	423f034	2017-07-30 16:44:34 -0400	[diff] [blame]	450
				451	/* our team section */
Henri Koivuneva	bef78a6	2017-08-12 22:32:07 +0300	[diff] [blame]	452	#team, #family {
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	453	background-color: #0080ff;
Unknown	2175d33	2017-08-13 19:28:40 -0400	[diff] [blame]	454	/*font-weight: 700;
				455	font-size: 21px; */
Unknown	423f034	2017-07-30 16:44:34 -0400	[diff] [blame]	456	}
				457	.hr.invisible_hr {
				458	height: 0;
				459	padding: 0;
				460	}
				461	.hr.big_size_hr {
				462	margin: 30px 0;
				463	}
				464	.hr {
				465	clear: both;
				466	display: block;
				467	font-size: 0;
				468	height: 24px;
				469	margin: 20px 0;
				470	overflow: hidden;
				471	padding: 2px 0;
				472	position: relative;
				473	text-align: center;
				474	width: 100%;
				475	}
				476	.highlight_secondary {
				477	color: #FFFFFF;
				478	}
Henri Koivuneva	984bf52	2017-08-12 14:51:57 +0300	[diff] [blame]	479	.team-role, .team-name, .team-links-list a {
Unknown	423f034	2017-07-30 16:44:34 -0400	[diff] [blame]	480	color: #07374a;
nilac8991	c165503	2017-08-19 12:37:44 +0200	[diff] [blame]	481	text-align: center;
Henri Koivuneva	5c411dd	2017-08-25 22:59:59 +0300	[diff] [blame]	482	white-space: normal;
				483	width: 100%;
Unknown	4f1903e	2017-07-30 19:40:03 -0400	[diff] [blame]	484	}
nilac8991	c165503	2017-08-19 12:37:44 +0200	[diff] [blame]	485	.team-name, .family-name {
				486	font-size: 21px;
				487	text-align: center;
				488	white-space: nowrap;
				489	}
Henri Koivuneva	bef78a6	2017-08-12 22:32:07 +0300	[diff] [blame]	490	.team-links, .family-links {
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	491	padding-top: .75em;
Unknown	2175d33	2017-08-13 19:28:40 -0400	[diff] [blame]	492	color: #07374a;
nilac8991	c165503	2017-08-19 12:37:44 +0200	[diff] [blame]	493	text-align: center;
Henri Koivuneva	984bf52	2017-08-12 14:51:57 +0300	[diff] [blame]	494	}
Henri Koivuneva	bef78a6	2017-08-12 22:32:07 +0300	[diff] [blame]	495	.team-image img, .family-image img {
Henri Koivuneva	c5e99ce	2017-08-12 15:59:30 +0300	[diff] [blame]	496	max-width:150px;
				497	max-height: 150px;
				498	margin:0 auto;
Henri Koivuneva	4c86650	2017-08-12 17:14:37 +0300	[diff] [blame]	499	}
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	500	#team > .container .row > div {
Henri Koivuneva	5c411dd	2017-08-25 22:59:59 +0300	[diff] [blame]	501	min-height: 0px;
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	502	padding-left: 0;
				503	padding-right: 0;
Henri Koivuneva	87bdef3	2017-08-25 23:50:22 +0300	[diff] [blame]	504	/* display: flex; */
				505	/* flex-wrap: wrap; */
				506	/* justify-content: flex-start; */
				507	}
				508	@media (min-width: 768px) {
				509	#team > .container .row > div {min-height: 0px;}
				510	#team .col-sm-4 {
				511	width: 100%;
				512	margin: 0;
				513	}
				514	}
				515	@media (min-width: 992px) {
				516	#team .col-md-2 {
				517	width: 100%;
				518	margin: 0;
				519	}
				520	}
				521	@media (min-width: 1200px) {
				522	#team > .container .row > div {min-height: 0px;}
				523	}
				524	@media (max-width: 700px) {
				525	#team > .container .row > div {min-height: 0px;}
				526	#team .col-xs-6 {width: 42%;margin:4%;}
				527	}
				528	@media (max-width: 500px) {
				529	#team > .container .row > div {min-height: 250px;}
				530	#team .col-xs-6 {width: 92%;margin:4%;}
				531	}
				532	#team > .container .row > .row, #team > .container {padding-left:0;padding-right: 0}
				533
				534	/* Bliss family section */
				535	#family {
				536	background-color: #07374a;
				537	}
				538	#family > div > div.row > div {font-size: 18px}
				539	.family-role, .family-name, .family-description {
				540	color: #FFFFFF;
				541	}
				542	.family-description {
				543	color: #fff;
				544	font-size: 18px;
				545	}
				546	.family-role h4, .family-links-list a {
				547	color: #0080ff;
				548	}
				549	.family-header h2 {
				550	color: #0080ff;
				551	}
				552	#family .about-tools {
				553	font-size: 20px;
				554	}
				555	.family-image img {
				556	max-width:150px;
				557	max-height: 150px;
				558	margin:0 auto;
				559	}
				560	.family-projects--btn {
				561	background: transparent;
Unknown	7e529f8	2017-11-04 16:44:32 -0400	[diff] [blame]	562	color: #0080ff;
				563	border: 1px solid #0080ff;
Henri Koivuneva	87bdef3	2017-08-25 23:50:22 +0300	[diff] [blame]	564	border-radius: 5px;
				565	margin-bottom: 1.25em;
				566	font-weight: 700;
				567	font-size: 21px; }
				568	.family-projects--btn:hover {
Unknown	7e529f8	2017-11-04 16:44:32 -0400	[diff] [blame]	569	background: #0080ff;
Henri Koivuneva	87bdef3	2017-08-25 23:50:22 +0300	[diff] [blame]	570	color: #ffffff; }
				571	.family-projects--btn:focus,
				572	.family-projects--btn:active {
Unknown	7e529f8	2017-11-04 16:44:32 -0400	[diff] [blame]	573	background: #0080ff;
Henri Koivuneva	87bdef3	2017-08-25 23:50:22 +0300	[diff] [blame]	574	color: #ffffff; }
				575
				576	@media (max-height: 880px) {
				577	#scrollIcon, #scrollTopIcon {margin-top: 15vh}
				578	}
				579	@media (max-height: 800px) {
				580	#scrollIcon, #scrollTopIcon {margin-top: 10vh}
				581	.cover.top {padding: 7.5vh 0 12.5vh 0;}
				582	}
				583	@media (max-height: 750px) {
				584	#scrollIcon, #scrollTopIcon {margin-top: 8vh}
				585	}
				586	@media (max-height: 720px) {
				587	#scrollIcon, #scrollTopIcon {margin-top: 5vh}
				588	.cover.top {padding: 5vh 0 10vh 0;}
				589	}
				590	@media (max-height: 650px) {
				591	#scrollIcon, #scrollTopIcon {margin-top: 5vh}
				592	.cover.top {padding: 2.5vh 0 5vh 0;}
				593	body > div.container-fluid > div.row.cover.top > div > .row > .headline > img {max-height: 42vh;}
				594	}
				595	@media (max-height: 550px) {
				596	#scrollIcon, #scrollTopIcon {margin-top: 5vh}
				597	.cover.top {padding: 1.5vh 0 3vh 0;}
				598	.headline {padding-top:3vh;}
				599	body > div.container-fluid > div.row.cover.top > div > .row > .headline > img {max-height: 32vh;}
				600	}
				601	@media (max-height: 480px) {
				602	#scrollIcon, #scrollTopIcon {margin-top: 0}
				603	.cover.top {padding: 3vh 0 3vh 0;}
				604	.headline {padding-top:1.5vh;}
				605	body > div.container-fluid > div.row.cover.top > div > .row > .headline > img {max-height: 32vh;}
				606	}
				607	@media (max-height: 320px) {
				608	.cover.top {padding: 1vh 0 3vh 0;}
				609	.headline {padding-top:1vh;}
				610	body > div.container-fluid > div.row.cover.top > div > .row > .headline > img {max-height: 25vh;}
				611	}
				612	@media (max-width: 768px) {
				613	.container-fluid {padding:30px 0 !important;}
				614	.h1, .h2, .h3, h1, h2, h3 {
				615	margin-top: 10px;
				616	margin-bottom: 10px;
				617	}
				618	.lead, .about, .about-info, .about-tools, .about-last {font-size: 16px}
				619	.row.cover.top .lead {
				620	max-width: 350px;
				621	margin-left:auto;
				622	margin-right: auto
				623	}
				624	.h4, h4 {font-size: 20px}
				625	#portfolio h2 {padding-bottom: 0}
				626	#portfolio > .container {padding-right: 0;padding-left: 0}
				627	.portfolio-projects--btn {margin-top:1.25em;margin-left: auto;margin-right: auto}
				628	#portfolio > div > div > div:nth-child(2) > div > div.col-sm-5.text-center.pull-right-sm > a:nth-child(4) {margin-right: 4px}
				629	#portfolio > div > div > div:nth-child(2) > div > div.col-sm-5.text-center.pull-right-sm > a:nth-child(5) {margin-left: 4px}
				630	#scrollIcon, #scrollTopIcon {font-size: 1em}
				631	}
				632	@media (max-device-height: 480px) and (orientation: landscape) {
				633	.navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse {
				634	max-height: 240px;
				635	}
				636	.navbar-nav>li>a {
				637	padding-top: 6px;
				638	padding-bottom: 6px;
				639	}
				640	}
				641	@media (max-width: 360px) {
				642	.h1, h1 {font-size: 32px;}
				643	.cover, .cover.bottom {
				644	padding-left: 15px;
				645	padding-right: 15px;
				646	}
				647	}
				648
				649	/* --- Mock-up Setting --- */
				650	/* Paste link to your image 310x550px */
				651	/* Screen Setting */
				652	/* --- --- */
				653	/* --- Animation Setting --- */
				654	/* --- --- */
				655
				656	h1 {
				657	color: #fff;
				658	cursor: default;
				659	}
				660
				661	h1 span:nth-of-type(1) {
				662	font-size: 1em;
				663	line-height: 0.5em;
				664	}
				665	h1 span:nth-of-type(2) {
				666	font-size: .4em;
				667	font-weight: 400;
				668	line-height: 3.65em;
				669	color: #0080ff;
				670	background-color: #282828;
				671	padding: 3px 10px;
				672	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.6);
				673	}
				674	h1 span:nth-of-type(3) {
				675	font-size: 1.5em;
				676	line-height: .85em;
				677	}
				678
				679	.space {
				680	will-change: transform;
				681	position: relative;
				682	left:-25;
				683	top:auto;
				684	bottom:auto;
				685	margin-top:15%;
				686	margin-bottom:25%;
				687	margin-left: 35%;
Henri Koivuneva	be19c19	2017-11-22 22:14:33 +0200	[diff] [blame^]	688	margin-right: auto;
Henri Koivuneva	87bdef3	2017-08-25 23:50:22 +0300	[diff] [blame]	689	-webkit-transform: perspective(1000px) rotateX(65deg) rotateY(0deg) rotateZ(-45deg) scale(0.90);
				690	transform: perspective(1000px) rotateX(65deg) rotateY(0deg) rotateZ(-45deg) scale(0.90);
				691	-webkit-transition: all 600ms;
				692	transition: all 600ms;
				693	}
				694
				695	.space-hover {
				696	position: relative;
				697	left:-25;
				698	top:auto;
				699	bottom:auto;
				700	margin-top:30%;
				701	margin-bottom:25%;
				702	margin-left: 45%;
Henri Koivuneva	be19c19	2017-11-22 22:14:33 +0200	[diff] [blame^]	703	margin-right: auto;
Henri Koivuneva	87bdef3	2017-08-25 23:50:22 +0300	[diff] [blame]	704	-webkit-transform: perspective(1000px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(0.90);
				705	transform: perspective(1000px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(0.90);
				706	}
				707
				708	.phone-container {
				709	width: 11.2em;
				710	height: 23.33em;
				711	position: absolute;
				712	top: 0;
				713	bottom: 0;
				714	left: 0;
				715	right: 0;
				716	margin: auto;
				717	-webkit-transform-style: preserve-3d;
				718	transform-style: preserve-3d;
				719	-webkit-transform: translateX(-80%);
				720	transform: translateX(-80%);
				721	border-radius: 2.0em;
				722	}
				723
				724	.phone-front {
				725	will-change: transform;
				726	width: 11.2em;
				727	height: 23.33em;
				728	position: absolute;
				729	top: 0;
				730	bottom: 0;
				731	left: 0;
				732	right: 0;
				733	margin: auto;
				734	background-image: url("../images/phone_front.svg");
				735	background-repeat: no-repeat;
				736	background-position: -.53em 0;
				737	background-size: 12.3em 23.36em;
				738	border-radius: 2.0em;
				739	box-shadow: -20px 27px 13px 10px rgba(0, 0, 0, 0.5);
				740	-webkit-transition: -webkit-transform 600ms;
				741	transition: -webkit-transform 600ms;
				742	transition: transform 600ms;
				743	transition: transform 600ms, -webkit-transform 600ms;
				744	-webkit-transition: box-shadow 450ms;
				745	transition: box-shadow 450ms;
				746	}
				747
				748	.just-phone-front {
				749	will-change: transform;
				750	width: 11.2em;
				751	height: 23.33em;
				752	position: absolute;
				753	right: 0;
				754	margin: auto;
				755	left:-25;
				756	top:0;
				757	bottom:auto;
				758	margin-top:10%;
				759	margin-bottom:15%;
				760	margin-left: 35%;
				761	margin-right: auto;
				762	background-image: url("../images/phone_front.svg");
				763	background-repeat: no-repeat;
				764	background-position: -.53em 0;
				765	background-size: 12.3em 23.36em;
				766	border-radius: 2.0em;
				767	box-shadow: -10px 13px 7px 5px rgba(0, 0, 0, 0.5);
				768	-webkit-transform: scale(0.90);
				769	transform: scale(0.90);
				770	-webkit-transition: -webkit-transform 600ms;
				771	transition: -webkit-transform 600ms;
				772	transition: transform 600ms;
				773	transition: transform 600ms, -webkit-transform 600ms;
				774	-webkit-transition: box-shadow 450ms;
				775	transition: box-shadow 450ms;
				776	}
				777
				778	.phone-front-hover {
				779	box-shadow: 0 12px 13px 10px rgba(0, 0, 0, 0.5);
				780	-webkit-transition: -webkit-transform 600ms;
				781	transition: -webkit-transform 600ms;
				782	transition: transform 600ms;
				783	transition: transform 600ms, -webkit-transform 600ms;
				784	-webkit-transition: box-shadow 450ms;
				785	transition: box-shadow 450ms;
				786	}
				787
				788	.phone-screen {
				789	width: 10.5em;
				790	height: 19.3em;
				791	position: relative;
				792	left: 0;
				793	right: 0;
				794	top: 2.283em;
				795	margin: auto;
				796	background-color: #000;
				797	overflow: hidden;
				798	}
				799	.phone-screen::before {
				800	content: "";
				801	position: absolute;
				802	width: 100%;
				803	height: 100%;
				804	box-shadow: inset 13px 0 10px -5px rgba(250, 250, 250, 0.17), inset -13px 0 10px -5px rgba(250, 250, 250, 0.17);
				805	background-image: url("../images/bliss_screens.gif");
				806	background-repeat: no-repeat;
				807	background-position: 50% 0px;
				808	background-size: cover;
				809	-webkit-transform: scale(1);
				810	transform: scale(1);
				811	}
				812	.phone-screen::after {
				813	content: "";
				814	position: absolute;
				815	width: 100%;
				816	height: 100%;
				817	background-color: rgba(250, 250, 250, 0.1);
				818	}
				819
				820	.phone-side {
				821	will-change: transform;
				822	width: 13.33em;
				823	height: 25em;
				824	position: absolute;
				825	top: 0;
				826	bottom: 0;
				827	left: 0;
				828	right: 0;
				829	margin: auto;
				830	border-radius: 1.66em;
				831	background-repeat: no-repeat;
				832	background-position: 2.2em .5em;
				833	background-size: 13.33em 24.73em;
				834	-webkit-transform-style: preserve-3d;
				835	transform-style: preserve-3d;
				836	-webkit-transform: skew(-1deg) translateX(-15.5%) translateY(1.2%) scaleX(0.95) scaleY(0.96) rotate(-1deg);
				837	transform: skew(-1deg) translateX(-15.5%) translateY(1.2%) scaleX(0.95) scaleY(0.96) rotate(-1deg);
				838	-webkit-transition: all 350ms;
				839	transition: all 350ms;
				840	}
				841
				842	.phone-side-hover {
				843	-webkit-transform: skew(-1deg) translateX(-13.4%) translateY(1.05%) scaleX(0.83) scaleY(0.83) rotate(-1deg);
				844	transform: skew(-1deg) translateX(-13.4%) translateY(1.05%) scaleX(0.83) scaleY(0.83) rotate(-1deg);
				845	-webkit-transition: all 350ms;
				846	transition: all 350ms;
				847	}
				848
				849	@-webkit-keyframes figure-anim {
				850	from {
				851	border-radius: 50%;
				852	-webkit-transform: rotate(0deg) scale(1);
				853	transform: rotate(0deg) scale(1);
				854	}
				855	to {
				856	border-radius: 30%;
				857	-webkit-transform: rotate(360deg) scale(0.5);
				858	transform: rotate(360deg) scale(0.5);
				859	}
				860	}
				861
				862	@keyframes figure-anim {
				863	from {
				864	border-radius: 50%;
				865	-webkit-transform: rotate(0deg) scale(1);
				866	transform: rotate(0deg) scale(1);
				867	}
				868	to {
				869	border-radius: 30%;
				870	-webkit-transform: rotate(360deg) scale(0.5);
				871	transform: rotate(360deg) scale(0.5);
				872	}
				873	}
				874	@-webkit-keyframes figure-container-anim {
				875	from {
				876	-webkit-transform: rotate(0deg);
				877	transform: rotate(0deg);
				878	}
				879	to {
				880	-webkit-transform: rotate(360deg);
				881	transform: rotate(360deg);
				882	}
				883	}
				884	@keyframes figure-container-anim {
				885	from {
				886	-webkit-transform: rotate(0deg);
				887	transform: rotate(0deg);
				888	}
				889	to {
				890	-webkit-transform: rotate(360deg);
				891	transform: rotate(360deg);
				892	}
				893	}
				894
Henri Koivuneva	87bdef3	2017-08-25 23:50:22 +0300	[diff] [blame]	895	@media (min-width: 1200px) {
				896	.pull-right-lg {
				897	float: right !important; }
				898	.pull-left-lg {
				899	float: left !important; }
Henri Koivuneva	9c1e243	2017-11-22 22:01:33 +0200	[diff] [blame]	900	.pull-left-md {
				901	float: left !important; }
				902	.container {max-width: 1170px;}
Henri Koivuneva	87bdef3	2017-08-25 23:50:22 +0300	[diff] [blame]	903	.portfolio-projects .col-lg-6 {width: 100%}
				904	.navbar > .container {max-width: 1170px}
				905	}
				906	@media (min-width: 1366px) {
				907	#portfolio > .container, #about > .row {width: 90%;max-width: 1600px;margin-left:auto;margin-right: auto;}
				908	.navbar > .container {max-width: 1170px}
				909	}
				910	* {
				911	box-sizing: border-box; }
				912
				913	html {
				914	/* position: relative; */
				915	/* height: 100%; */
				916	/* width: 100%; */
				917	}
				918
				919	img {
				920	width: 100%; }
				921
				922	body {
				923	/* height: 100%; */
				924	font-family: "Comfortaa", Helvetica, Arial, sans-serif;
				925	line-height: 1.4;
				926	background-color: #0080ff;
				927	/* Margin bottom by footer height */
				928	/* margin-bottom: 60px; */
				929	}
				930
				931	h1, .h1,
				932	h2, .h2,
				933	h3, .h3,
				934	h4, .h4,
				935	h5, .h5,
				936	h6, .h6 {
				937	font-family: "Comfortaa", Helvetica, Arial, sans-serif;
				938	line-height: 1.4;
				939	color: #07374a; }
				940	h1, .h1 {font-size: 64px;}
				941	h2, .h2 {font-size: 42px;}
				942	h4, .h4 {font-weight: bolder;}
				943
				944	p {
				945	font-family: "Comfortaa", sans-serif;
				946	color: #ffffff;
				947	margin: 0 0 30px; }
				948
				949	a, .btn {
				950	-webkit-transition: color .2s ease 0s, border-color .2s ease 0s, background-color .2s ease 0s;
				951	transition: color .2s ease 0s, border-color .2s ease 0s, background-color .2s ease 0s;
				952	}
				953
				954	a:hover, a:focus, a:active {text-decoration: none;}
				955
				956	body > .container-fluid {
				957	padding: 0; }
				958
				959	#portfolio > .container {
				960	padding-left: 30px;
				961	padding-right: 30px;
				962	}
				963	#portfolio > div > div > div {padding-right: 0;padding-left: 0}
				964
				965	.row,
				966	.container-fluid>.navbar-collapse,
				967	.container-fluid>.navbar-header,
				968	.container>.navbar-collapse,
				969	.container>.navbar-header {
				970	margin:auto;
				971	}
				972
				973	.container-fluid .text-muted {
				974	margin: 20px 0; }
				975
				976	.btn:focus, a:focus {
				977	outline: none !important; }
				978
				979	.navbar {
				980	height: 70px;
				981	background-color: transparent;
				982	background: transparent;
				983	border: none;
				984	color: #ffffff;
				985	z-index: 100;
				986	margin-bottom: 0;
				987	padding-left: 30px;
				988	padding-right: 30px;
				989	border-radius: 0;
				990	-webkit-transition: background-color .2s ease 0s;
				991	transition: background-color .2s ease 0s; }
				992	.navbar > .container {padding: 4px 0 0 0;width: 100%;margin-top:2px;}
				993	.navbar-brand {
				994	opacity: 0;
				995	margin-top: 5px;
				996	padding: 15px 0;
				997	color: #ffffff;
				998	font-weight: 400; }
				999
				1000	.navbar-default .navbar-nav > li > a {
				1001	color: #ffffff;
				1002	font-weight: 500;
				1003	font-size: 1em;
				1004	text-transform: lowercase;
				1005	margin: 3px 5px;
				1006	border: 1px solid transparent;
				1007	border-radius: 5px;
				1008	-webkit-transition: color .2s ease 0s, border-color .2s ease 0s;
				1009	transition: color .2s ease 0s, border-color .2s ease 0s; }
				1010	.navbar-default .navbar-nav > li:last-child > a {margin-right: 0}
				1011	.navbar-default .navbar-nav > li > a:hover {
				1012	color: #ffffff;
				1013	border: 1px solid #ffffff; }
				1014	.navbar-default .navbar-nav > li > a:active,
				1015	.navbar-default .navbar-nav > li > a:focus,
				1016	.navbar.solid .navbar-nav > li > a:active, .navbar.solid .navbar-nav > li > a:focus {
				1017	color: rgba(255,255,255,0.8);
				1018	border: 1px solid rgba(255,255,255,0.8); }
				1019	.navbar-default .navbar-nav > li > a:visited {
				1020	color: #ffffff;
				1021	text-decoration: none; }
				1022	.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover {
				1023	background-color: transparent;
				1024	color: #ffffff; }
				1025	.navbar-default .navbar-nav > .active > a:focus,
				1026	.navbar.solid .navbar-nav > li > a:active,
				1027	.navbar.solid .navbar-nav > li > a:focus {
				1028	background-color: transparent;
				1029	color: rgba(255,255,255,0.8); }
				1030	.navbar-toggle {margin-right:0px;padding:15px;}
				1031	.navbar-default .navbar-toggle {
				1032	border-color: #ffffff; }
				1033	.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
				1034	background-color: #07374a;
				1035	}
				1036	.navbar-default .navbar-toggle .icon-bar {
				1037	color: #ffffff;
				1038	background-color: #ffffff; }
				1039	.navbar-default .navbar-collapse.collapse.in ul {
				1040	background-color: #07374a;
				1041	}
				1042	.navbar-collapse.collapsing {
				1043	background-color: #07374a;
				1044	}
				1045	.navbar-default .navbar-toggle .icon-bar {
				1046	color: #ffffff;
				1047	background-color: #ffffff; }
				1048	.navbar-default .navbar-collapse.collapse.in ul {
				1049	background-color: #07374a;
				1050	}
				1051	.navbar-collapse.collapse.collapsing {
				1052	background-color: #07374a;
				1053	}
				1054
				1055	.navbar-collapse.collapse.show {
				1056	background-color: #07374a;
				1057	-webkit-transition: background-color .2s ease 0s;
				1058	transition: background-color .2s ease 0s;
				1059	-webkit-border-bottom-left-radius: 4px;
				1060	-webkit-border-bottom-right-radius: 4px;
				1061	border-bottom-left-radius: 4px;
				1062	border-bottom-right-radius: 4px;
				1063	}
				1064
				1065	.navbar-collapse .navbar-nav > li > a,
				1066	.navbar-collapse .navbar-nav > li > a:hover,
				1067	.navbar-collapse .navbar-nav > li > a:focus,
				1068	.navbar-collapse .navbar-nav > li > a:active {
				1069	border-color: transparent !important;
				1070	}
				1071
				1072	/* Solid class attached on scroll past first section */
				1073	.navbar.solid {
				1074	background-color: #07374a;
				1075	top: 0;
				1076	width: 100%;
				1077	margin: 0px 0%;
				1078	box-shadow: 0 7px 8px 0px rgba(0,0,0,0.3);
				1079	-webkit-transition: background-color .2s ease 0s;
				1080	transition: background-color .2s ease 0s;
				1081	-webkit-transition: box-shadow .2s ease 0s;
				1082	transition: box-shadow .2s ease 0s;
				1083	}
				1084	.navbar.solid .navbar-brand {
				1085	opacity: 1;
				1086	display: inline-block;
				1087	color: #ffffff;
				1088	-webkit-transition: color .2s ease 0s, border-color .2s ease 0s, opacity .2s ease 0s;
				1089	transition: color .2s ease 0s, border-color .2s ease 0s, opacity .2s ease 0s; }
				1090	.navbar.solid .navbar-nav > li > a {
				1091	color: #ffffff;
				1092	-webkit-transition: color .2s ease 0s, border-color .2s ease 0s;
				1093	transition: color .2s ease 0s, border-color .2s ease 0s; }
				1094
				1095	.cover {
				1096	padding: 6% 0 8% 0; }
				1097	.cover.top {
				1098	padding: 10vh 0 15vh 0;
				1099	height: 100vh;
				1100	display: -webkit-box;
				1101	display: -ms-flexbox;
				1102	display: flex;
				1103	background-color: #0080ff; }
				1104	.cover.bottom {
				1105	padding: 6% 0 5.5% 0; }
				1106	body > .cover.bottom:nth-child(4) {padding: 6% 0 5.5% 0 !important}
				1107	@media (max-width: 550px) {
				1108	.cover, .cover.bottom {padding: 17.5% 30px 17.5% 30px; } }
				1109
				1110	.headline {
				1111	padding-top: 6.25em; }
				1112	body > div.container-fluid > div.row.cover.top > div > .row > .headline > img {
				1113	max-width: 1600px;
				1114	width: 100%;
				1115	margin: 0 auto;
				1116	padding-right: 30px;
				1117	padding-left: 30px;
				1118	display: block; }
				1119	@media screen and (min-width: 768px) {
				1120	.headline {
				1121	padding-top: 3.75em; } }
				1122	@media screen and (min-width: 992px) {
				1123	.headline {
				1124	padding-top: 1.5625em; } }
				1125	@media screen and (min-width: 1200px) {
				1126	.headline {
				1127	padding-top: 0px; } }
				1128
				1129	#about {
				1130	background-color: #07374a; }
				1131	#about h2 {
				1132	color: #0080ff; }
				1133	#about > div > div.row.break > div > p {margin-bottom: 15px}
				1134
				1135	.profile-img {
				1136	margin-bottom: 15px;
				1137	width: 120px; }
				1138
				1139	.about, .about-info, .about-tools, .about-last {
				1140	padding: 4% 30px 1% 30px;
				1141	font-size: 18px; }
				1142	.about-tools {
				1143	padding-top: 4.375em;
				1144	font-size: 18px; }
				1145	@media screen and (min-width: 992px) {
				1146	.about-tools {
				1147	padding-top: 5.625em; } }
				1148	.about-tools ul:first-child {
				1149	padding-left: 0px; }
				1150	.about-tools ul {
				1151	color: #0080ff;
				1152	list-style: none; }
				1153	.about-tools ul li {
				1154	padding-top: 0.75em; }
				1155	.about-last {
				1156	padding-top: 3.125em;
				1157	padding-bottom: 0;
				1158	font-size: 1.125em; }
				1159	@media screen and (min-width: 992px) {
				1160	.about-last {
				1161	padding-top: 0; } }
				1162	.about-last p {
				1163	color: #0080ff; }
				1164
				1165	#portfolio {
				1166	background-color: #0080ff; }
				1167
				1168	.portfolio-projects--btn {
				1169	background: transparent;
				1170	color: #07374a;
				1171	border: 1px solid #07374a;
				1172	border-radius: 5px;
				1173	margin-bottom: 1.25em;
				1174	font-size: 18px;
				1175	margin: 0 8px; }
				1176	.portfolio-projects--btn:hover {
				1177	background: #07374a;
				1178	color: #ffffff; }
				1179	.portfolio-projects--btn:focus,
				1180	.portfolio-projects--btn:active {
				1181	background: #052a38;
				1182	color: #ffffff; }
Unknown	e40fbec	2017-10-09 14:44:15 -0400	[diff] [blame]	1183
Unknown	2361745	2017-09-02 22:36:59 -0400	[diff] [blame]	1184	.portfolio-projects--btn-sm {
				1185	background: transparent;
				1186	color: #07374a;
				1187	border: 1px solid #07374a;
				1188	border-radius: 5px;
				1189	margin-bottom: 1.25em;
				1190	font-size: 12px;
				1191	margin: 0 8px; }
				1192	.portfolio-projects--btn-sm:hover {
				1193	background: #07374a;
				1194	color: #ffffff; }
				1195	.portfolio-projects--btn-sm:focus,
				1196	.portfolio-projects--btn-sm:active {
				1197	background: #052a38;
				1198	color: #ffffff; }
Unknown	e40fbec	2017-10-09 14:44:15 -0400	[diff] [blame]	1199
Henri Koivuneva	87bdef3	2017-08-25 23:50:22 +0300	[diff] [blame]	1200	.portfolio-projects--image {
				1201	margin-bottom: 1.875em;
				1202	padding-top: 5%; }
				1203
				1204	@media screen and (min-width: 360px) {
				1205	#team > .container .row > div {width: 100%;margin: 0;}
				1206	}
				1207
				1208	@media screen and (min-width: 768px) {
				1209	.portfolio-projects {
				1210	margin-top: 0.625em; } }
				1211	.portfolio-projects--title {
				1212	margin-top: 0.9375em;
				1213	font-size: 20px; }
				1214	@media screen and (min-width: 768px) {
				1215	.portfolio-projects--title {
				1216	margin-top: 0;
				1217	font-size: 21px; }
				1218	.portfolio-projects--desc {
				1219	margin-top: 30px;
				1220	margin-bottom: 30px;
				1221	font-size: 16px; }
				1222	.portfolio-projects--btn {font-size: 14px;margin:0 4px 16px 4px;}
				1223	#portfolio > div > div > div:nth-child(1) > div > div.col-sm-5.text-center,
				1224	#portfolio > div > div > div:nth-child(2) > div > div.col-sm-7.text-center.pull-right-sm {padding-left:0;}
				1225	#portfolio > div > div > div:nth-child(1) > div > div.col-sm-7.text-center,
				1226	#portfolio > div > div > div:nth-child(2) > div > div.col-sm-5.text-center.pull-right-sm {padding-right: 0;} }
				1227	@media screen and (min-width: 992px) {
				1228	.portfolio-projects--title {
				1229	margin-top: 15%;
				1230	font-size: 30px; }
				1231	#portfolio > div > div > div:nth-child(2) > div > div.col-sm-5.text-center.pull-right-sm > a:nth-child(4) {margin-left:-8px;}
				1232	#portfolio > div > div > div:nth-child(2) > div > div.col-sm-5.text-center.pull-right-sm > a:nth-child(5) {margin-right:-8px;} }
				1233	@media screen and (min-width: 1080px) {
				1234	.portfolio-projects--title {
				1235	margin-top: 24%;
				1236	font-size: 21px; }
				1237	}
				1238	@media screen and (min-width: 1200px) {
				1239	.portfolio-projects--title {
				1240	margin-top: 24%;
				1241	font-size: 24px; }
				1242	.portfolio-projects--desc {
				1243	margin-top: 30px;
				1244	margin-bottom: 30px;
				1245	font-size: 18px; }
				1246	.portfolio-projects .col-lg-6 + .col-lg-6 + .col-lg-6 {margin-top:40px}
Karol Putra	bac14db	2017-09-02 18:16:57 +0200	[diff] [blame]	1247	.portfolio-projects--btn {font-size: 18px;} }
Henri Koivuneva	87bdef3	2017-08-25 23:50:22 +0300	[diff] [blame]	1248	@media screen and (min-width: 1366px) {
				1249	.portfolio-projects--title {margin-top:28%;}
				1250	}
				1251	@media (min-width: 1500px) {
				1252	.portfolio-projects--title {font-size: 28px;margin-top:31%;}
				1253	.portfolio-projects--btn {font-size: 21px}
				1254	}
				1255
				1256	#contact {
				1257	background-color: #07374a;
				1258	padding-left: 15px;
				1259	padding-right: 15px }
				1260	#contact h2 {
				1261	color: #0080ff; }
				1262
				1263	.contact-social-icons p {
				1264	color: #0080ff; }
				1265	.contact-social-icons > ul {padding:0;margin:0 auto;}
				1266	.contact-social-icons ul a {
				1267	color: #0080ff;
				1268	list-style: none; }
				1269	.contact-social-icons ul a:hover,
				1270	.team-links-list a:hover,
				1271	.family-links-list a:hover {
				1272	color: #ffffff; }
				1273	.contact-social-icons ul a:focus,
				1274	.contact-social-icons ul a:active,
				1275	.team-links-list a:focus,
				1276	.team-links-list a:active,
				1277	.family-links-list a:focus,
				1278	.family-links-list a:active {
				1279	color: rgba(255,255,255,0.8); }
				1280	.contact-social-icons ul a li {
				1281	display: inline-block;
				1282	padding: 1.25%;
				1283	font-size: 16px }
				1284	@media (max-width: 1200px) {
				1285	#family > div > div.row > div.center > div {margin:1.5em 4% 3em 4%;width:42%;float:left;}
				1286	#family > div > div.row > div.center > div:last-child {margin-bottom: 0}
				1287	}
				1288	@media (max-width: 720px) {
				1289	#family > div > div.row > div.center > div {margin:1.5em 4% 3em 4%;width:92%;}
				1290	}
				1291
				1292	.footer {
				1293	padding-top: 1em;
				1294	bottom: 0;
				1295	width: 100%;
				1296	/* Set the fixed height of the footer here */
				1297	background-color: #052a38;
				1298
				1299	color: #ffffff; }
				1300	.footer-role, .footer-name, .footer-description {
				1301	color: #FFFFFF;
				1302	}
				1303	.footer-description {
				1304	color: #fff;
				1305	font-size: 18px;
				1306	}
				1307	.footer-role h4, .footer-links-list a {
				1308	color: #0080ff;
				1309	}
				1310	.footer-header h4 {
				1311	color: #0080ff;
				1312	}
				1313	#scrollIcon, #scrollTopIcon {
				1314	margin-top: 200px;
				1315	padding: 10px;
				1316	font-size: 1.5em;
				1317	color: #07374a;
				1318	border: solid 2px #07374a;
				1319	border-radius: 50%; }
				1320
				1321	#scrollTopIcon {
				1322	margin-top: 10px;
				1323	font-size: 1em;
				1324	color: #ffffff;
				1325	border-color: #ffffff; }
				1326
				1327	.back-to-top {
				1328	display: none; }
				1329	.back-to-top.visible {
				1330	display: block; }
				1331
				1332	/* our team section */
				1333	#team, #family {
				1334	background-color: #0080ff;
				1335	/*font-weight: 700;
				1336	font-size: 21px; */
				1337	}
				1338	.hr.invisible_hr {
				1339	height: 0;
				1340	padding: 0;
				1341	}
				1342	.hr.big_size_hr {
				1343	margin: 30px 0;
				1344	}
				1345	.hr {
				1346	clear: both;
				1347	display: block;
				1348	font-size: 0;
				1349	height: 24px;
				1350	margin: 20px 0;
				1351	overflow: hidden;
				1352	padding: 2px 0;
				1353	position: relative;
				1354	text-align: center;
				1355	width: 100%;
				1356	}
				1357	.highlight_secondary {
				1358	color: #FFFFFF;
				1359	}
				1360	.team-role, .team-name, .team-links-list a {
				1361	color: #07374a;
				1362	text-align: center;
				1363	white-space: normal;
				1364	width: 100%;
				1365	}
				1366	.team-name, .family-name {
				1367	font-size: 21px;
				1368	text-align: center;
				1369	white-space: nowrap;
				1370	}
				1371	.team-links, .family-links {
				1372	padding-top: .75em;
				1373	color: #07374a;
				1374	text-align: center;
				1375	}
				1376	.team-image img, .family-image img {
				1377	max-width:150px;
				1378	max-height: 150px;
				1379	margin:0 auto;
				1380	}
				1381	#team > .container .row > div {
				1382	min-height: 0px;
				1383	padding-left: 0;
				1384	padding-right: 0;
				1385	/* display: flex; */
				1386	/* flex-wrap: wrap; */
				1387	/* justify-content: flex-start; */
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	1388	}
				1389	@media (min-width: 768px) {
Henri Koivuneva	5c411dd	2017-08-25 22:59:59 +0300	[diff] [blame]	1390	#team > .container .row > div {min-height: 0px;}
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	1391	#team .col-sm-4 {
Henri Koivuneva	5c411dd	2017-08-25 22:59:59 +0300	[diff] [blame]	1392	width: 100%;
				1393	margin: 0;
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	1394	}
				1395	}
				1396	@media (min-width: 992px) {
				1397	#team .col-md-2 {
Henri Koivuneva	5c411dd	2017-08-25 22:59:59 +0300	[diff] [blame]	1398	width: 100%;
				1399	margin: 0;
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	1400	}
				1401	}
				1402	@media (min-width: 1200px) {
Henri Koivuneva	5c411dd	2017-08-25 22:59:59 +0300	[diff] [blame]	1403	#team > .container .row > div {min-height: 0px;}
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	1404	}
				1405	@media (max-width: 700px) {
Henri Koivuneva	5c411dd	2017-08-25 22:59:59 +0300	[diff] [blame]	1406	#team > .container .row > div {min-height: 0px;}
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	1407	#team .col-xs-6 {width: 42%;margin:4%;}
				1408	}
				1409	@media (max-width: 500px) {
				1410	#team > .container .row > div {min-height: 250px;}
				1411	#team .col-xs-6 {width: 92%;margin:4%;}
Henri Koivuneva	9c1e243	2017-11-22 22:01:33 +0200	[diff] [blame]	1412	.animation {margin: -1em -20em;}
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	1413	}
				1414	#team > .container .row > .row, #team > .container {padding-left:0;padding-right: 0}
Henri Koivuneva	0752d23	2017-08-12 18:08:32 +0300	[diff] [blame]	1415
Henri Koivuneva	d7a7562	2017-08-12 21:53:07 +0300	[diff] [blame]	1416	/* Bliss family section */
Unknown	c8b8ae7	2017-08-12 12:20:45 -0400	[diff] [blame]	1417	#family {
Henri Koivuneva	d7a7562	2017-08-12 21:53:07 +0300	[diff] [blame]	1418	background-color: #07374a;
Unknown	c8b8ae7	2017-08-12 12:20:45 -0400	[diff] [blame]	1419	}
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	1420	#family > div > div.row > div {font-size: 18px}
Henri Koivuneva	bef78a6	2017-08-12 22:32:07 +0300	[diff] [blame]	1421	.family-role, .family-name, .family-description {
Unknown	c8b8ae7	2017-08-12 12:20:45 -0400	[diff] [blame]	1422	color: #FFFFFF;
				1423	}
				1424	.family-description {
Henri Koivuneva	bef78a6	2017-08-12 22:32:07 +0300	[diff] [blame]	1425	color: #fff;
				1426	font-size: 18px;
Unknown	c8b8ae7	2017-08-12 12:20:45 -0400	[diff] [blame]	1427	}
Henri Koivuneva	bef78a6	2017-08-12 22:32:07 +0300	[diff] [blame]	1428	.family-role h4, .family-links-list a {
Unknown	c8b8ae7	2017-08-12 12:20:45 -0400	[diff] [blame]	1429	color: #0080ff;
				1430	}
				1431	.family-header h2 {
				1432	color: #0080ff;
				1433	}
Henri Koivuneva	1086413	2017-08-12 22:35:45 +0300	[diff] [blame]	1434	#family .about-tools {
				1435	font-size: 20px;
				1436	}
Unknown	c8b8ae7	2017-08-12 12:20:45 -0400	[diff] [blame]	1437	.family-image img {
				1438	max-width:150px;
				1439	max-height: 150px;
				1440	margin:0 auto;
Unknown	1202cb9	2017-08-12 14:55:18 -0400	[diff] [blame]	1441	}
				1442	.family-projects--btn {
				1443	background: transparent;
Unknown	7e529f8	2017-11-04 16:44:32 -0400	[diff] [blame]	1444	color: #0080ff;
				1445	border: 1px solid #0080ff;
Unknown	1202cb9	2017-08-12 14:55:18 -0400	[diff] [blame]	1446	border-radius: 5px;
				1447	margin-bottom: 1.25em;
				1448	font-weight: 700;
Henri Koivuneva	5e8fc3b	2017-08-13 01:59:45 +0300	[diff] [blame]	1449	font-size: 21px; }
Unknown	1202cb9	2017-08-12 14:55:18 -0400	[diff] [blame]	1450	.family-projects--btn:hover {
Unknown	7e529f8	2017-11-04 16:44:32 -0400	[diff] [blame]	1451	background: #0080ff;
Unknown	1202cb9	2017-08-12 14:55:18 -0400	[diff] [blame]	1452	color: #ffffff; }
				1453	.family-projects--btn:focus,
				1454	.family-projects--btn:active {
Unknown	7e529f8	2017-11-04 16:44:32 -0400	[diff] [blame]	1455	background: #0080ff;
Henri Koivuneva	ac37dfe	2017-08-12 22:39:22 +0300	[diff] [blame]	1456	color: #ffffff; }
Henri Koivuneva	d7a7562	2017-08-12 21:53:07 +0300	[diff] [blame]	1457
Henri Koivuneva	0752d23	2017-08-12 18:08:32 +0300	[diff] [blame]	1458	@media (max-height: 880px) {
				1459	#scrollIcon, #scrollTopIcon {margin-top: 15vh}
				1460	}
				1461	@media (max-height: 800px) {
				1462	#scrollIcon, #scrollTopIcon {margin-top: 10vh}
				1463	.cover.top {padding: 7.5vh 0 12.5vh 0;}
				1464	}
				1465	@media (max-height: 750px) {
Henri Koivuneva	9c1e243	2017-11-22 22:01:33 +0200	[diff] [blame]	1466	#scrollIcon, #scrollTopIcon {margin-top: 6vh}
Henri Koivuneva	0752d23	2017-08-12 18:08:32 +0300	[diff] [blame]	1467	}
				1468	@media (max-height: 720px) {
				1469	#scrollIcon, #scrollTopIcon {margin-top: 5vh}
				1470	.cover.top {padding: 5vh 0 10vh 0;}
				1471	}
				1472	@media (max-height: 650px) {
				1473	#scrollIcon, #scrollTopIcon {margin-top: 5vh}
				1474	.cover.top {padding: 2.5vh 0 5vh 0;}
				1475	body > div.container-fluid > div.row.cover.top > div > .row > .headline > img {max-height: 42vh;}
				1476	}
				1477	@media (max-height: 550px) {
				1478	#scrollIcon, #scrollTopIcon {margin-top: 5vh}
				1479	.cover.top {padding: 1.5vh 0 3vh 0;}
				1480	.headline {padding-top:3vh;}
				1481	body > div.container-fluid > div.row.cover.top > div > .row > .headline > img {max-height: 32vh;}
				1482	}
				1483	@media (max-height: 480px) {
				1484	#scrollIcon, #scrollTopIcon {margin-top: 0}
Henri Koivuneva	71d1075	2017-08-12 18:37:49 +0300	[diff] [blame]	1485	.cover.top {padding: 3vh 0 3vh 0;}
Henri Koivuneva	0752d23	2017-08-12 18:08:32 +0300	[diff] [blame]	1486	.headline {padding-top:1.5vh;}
				1487	body > div.container-fluid > div.row.cover.top > div > .row > .headline > img {max-height: 32vh;}
				1488	}
Henri Koivuneva	71d1075	2017-08-12 18:37:49 +0300	[diff] [blame]	1489	@media (max-height: 320px) {
				1490	.cover.top {padding: 1vh 0 3vh 0;}
				1491	.headline {padding-top:1vh;}
				1492	body > div.container-fluid > div.row.cover.top > div > .row > .headline > img {max-height: 25vh;}
				1493	}
Henri Koivuneva	0752d23	2017-08-12 18:08:32 +0300	[diff] [blame]	1494	@media (max-width: 768px) {
				1495	.container-fluid {padding:30px 0 !important;}
				1496	.h1, .h2, .h3, h1, h2, h3 {
				1497	margin-top: 10px;
				1498	margin-bottom: 10px;
				1499	}
Henri Koivuneva	9c1e243	2017-11-22 22:01:33 +0200	[diff] [blame]	1500	.about, .about-info, .about-tools, .about-last {
				1501	padding: 4% 0px 1% 0px;
				1502	font-size: 16px;
				1503	}
Henri Koivuneva	0752d23	2017-08-12 18:08:32 +0300	[diff] [blame]	1504	.lead, .about, .about-info, .about-tools, .about-last {font-size: 16px}
Henri Koivuneva	0752d23	2017-08-12 18:08:32 +0300	[diff] [blame]	1505	.row.cover.top .lead {
				1506	max-width: 350px;
				1507	margin-left:auto;
				1508	margin-right: auto
				1509	}
				1510	.h4, h4 {font-size: 20px}
				1511	#portfolio h2 {padding-bottom: 0}
Henri Koivuneva	82de772	2017-08-13 02:11:30 +0300	[diff] [blame]	1512	#portfolio > .container {padding-right: 0;padding-left: 0}
Henri Koivuneva	9c1e243	2017-11-22 22:01:33 +0200	[diff] [blame]	1513	.portfolio-projects--btn {margin-top:0;margin-bottom:30px;margin-left: auto;margin-right: auto}
Henri Koivuneva	82de772	2017-08-13 02:11:30 +0300	[diff] [blame]	1514	#portfolio > div > div > div:nth-child(2) > div > div.col-sm-5.text-center.pull-right-sm > a:nth-child(4) {margin-right: 4px}
				1515	#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	0752d23	2017-08-12 18:08:32 +0300	[diff] [blame]	1516	#scrollIcon, #scrollTopIcon {font-size: 1em}
				1517	}
Henri Koivuneva	936cb39	2017-08-12 18:49:20 +0300	[diff] [blame]	1518	@media (max-device-height: 480px) and (orientation: landscape) {
				1519	.navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse {
				1520	max-height: 240px;
				1521	}
				1522	.navbar-nav>li>a {
				1523	padding-top: 6px;
				1524	padding-bottom: 6px;
				1525	}
				1526	}
Henri Koivuneva	0752d23	2017-08-12 18:08:32 +0300	[diff] [blame]	1527	@media (max-width: 360px) {
				1528	.h1, h1 {font-size: 32px;}
Henri Koivuneva	82de772	2017-08-13 02:11:30 +0300	[diff] [blame]	1529	.cover, .cover.bottom {
				1530	padding-left: 15px;
				1531	padding-right: 15px;
				1532	}
Henri Koivuneva	d7a7562	2017-08-12 21:53:07 +0300	[diff] [blame]	1533	}
Unknown	2175d33	2017-08-13 19:28:40 -0400	[diff] [blame]	1534
				1535	/* --- Mock-up Setting --- */
				1536	/* Paste link to your image 310x550px */
				1537	/* Screen Setting */
				1538	/* --- --- */
				1539	/* --- Animation Setting --- */
				1540	/* --- --- */
				1541
				1542	h1 {
				1543	color: #fff;
Unknown	2175d33	2017-08-13 19:28:40 -0400	[diff] [blame]	1544	cursor: default;
				1545	}
				1546
				1547	h1 span:nth-of-type(1) {
				1548	font-size: 1em;
				1549	line-height: 0.5em;
				1550	}
				1551	h1 span:nth-of-type(2) {
				1552	font-size: .4em;
				1553	font-weight: 400;
				1554	line-height: 3.65em;
				1555	color: #0080ff;
				1556	background-color: #282828;
				1557	padding: 3px 10px;
				1558	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.6);
				1559	}
				1560	h1 span:nth-of-type(3) {
				1561	font-size: 1.5em;
				1562	line-height: .85em;
				1563	}
				1564
				1565	.space {
				1566	will-change: transform;
				1567	position: relative;
Unknown	0c3ad6b	2017-08-13 23:21:16 -0400	[diff] [blame]	1568	left:-25;
				1569	top:auto;
				1570	bottom:auto;
Unknown	a3fe6cb	2017-08-13 22:41:36 -0400	[diff] [blame]	1571	margin-top:15%;
Unknown	ccfaea7	2017-08-13 20:33:17 -0400	[diff] [blame]	1572	margin-bottom:25%;
Unknown	0c3ad6b	2017-08-13 23:21:16 -0400	[diff] [blame]	1573	margin-left: 35%;
Henri Koivuneva	be19c19	2017-11-22 22:14:33 +0200	[diff] [blame^]	1574	margin-right: auto;
Unknown	0c3ad6b	2017-08-13 23:21:16 -0400	[diff] [blame]	1575	-webkit-transform: perspective(1000px) rotateX(65deg) rotateY(0deg) rotateZ(-45deg) scale(0.90);
				1576	transform: perspective(1000px) rotateX(65deg) rotateY(0deg) rotateZ(-45deg) scale(0.90);
Unknown	2175d33	2017-08-13 19:28:40 -0400	[diff] [blame]	1577	-webkit-transition: all 600ms;
				1578	transition: all 600ms;
				1579	}
				1580
				1581	.space-hover {
Unknown	0c3ad6b	2017-08-13 23:21:16 -0400	[diff] [blame]	1582	position: relative;
				1583	left:-25;
				1584	top:auto;
				1585	bottom:auto;
				1586	margin-top:30%;
Unknown	a3fe6cb	2017-08-13 22:41:36 -0400	[diff] [blame]	1587	margin-bottom:25%;
Unknown	0c3ad6b	2017-08-13 23:21:16 -0400	[diff] [blame]	1588	margin-left: 45%;
Henri Koivuneva	be19c19	2017-11-22 22:14:33 +0200	[diff] [blame^]	1589	margin-right: auto;
Unknown	0c3ad6b	2017-08-13 23:21:16 -0400	[diff] [blame]	1590	-webkit-transform: perspective(1000px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(0.90);
				1591	transform: perspective(1000px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(0.90);
Unknown	2175d33	2017-08-13 19:28:40 -0400	[diff] [blame]	1592	}
				1593
				1594	.phone-container {
Unknown	b5f9640	2017-08-13 20:14:52 -0400	[diff] [blame]	1595	width: 11.2em;
				1596	height: 23.33em;
Unknown	2175d33	2017-08-13 19:28:40 -0400	[diff] [blame]	1597	position: absolute;
				1598	top: 0;
				1599	bottom: 0;
				1600	left: 0;
				1601	right: 0;
				1602	margin: auto;
				1603	-webkit-transform-style: preserve-3d;
				1604	transform-style: preserve-3d;
				1605	-webkit-transform: translateX(-80%);
				1606	transform: translateX(-80%);
Unknown	b5f9640	2017-08-13 20:14:52 -0400	[diff] [blame]	1607	border-radius: 2.0em;
Unknown	2175d33	2017-08-13 19:28:40 -0400	[diff] [blame]	1608	}
				1609
				1610	.phone-front {
				1611	will-change: transform;
Unknown	b5f9640	2017-08-13 20:14:52 -0400	[diff] [blame]	1612	width: 11.2em;
				1613	height: 23.33em;
Unknown	2175d33	2017-08-13 19:28:40 -0400	[diff] [blame]	1614	position: absolute;
				1615	top: 0;
				1616	bottom: 0;
				1617	left: 0;
				1618	right: 0;
				1619	margin: auto;
Unknown	001b409	2017-08-13 20:55:51 -0400	[diff] [blame]	1620	background-image: url("../images/phone_front.svg");
Unknown	2175d33	2017-08-13 19:28:40 -0400	[diff] [blame]	1621	background-repeat: no-repeat;
Unknown	b5f9640	2017-08-13 20:14:52 -0400	[diff] [blame]	1622	background-position: -.53em 0;
				1623	background-size: 12.3em 23.36em;
				1624	border-radius: 2.0em;
Unknown	2175d33	2017-08-13 19:28:40 -0400	[diff] [blame]	1625	box-shadow: -20px 27px 13px 10px rgba(0, 0, 0, 0.5);
				1626	-webkit-transition: -webkit-transform 600ms;
				1627	transition: -webkit-transform 600ms;
				1628	transition: transform 600ms;
				1629	transition: transform 600ms, -webkit-transform 600ms;
				1630	-webkit-transition: box-shadow 450ms;
				1631	transition: box-shadow 450ms;
				1632	}
				1633
Unknown	b416962	2017-08-15 19:11:36 -0400	[diff] [blame]	1634	.just-phone-front {
				1635	will-change: transform;
				1636	width: 11.2em;
				1637	height: 23.33em;
				1638	position: absolute;
				1639	right: 0;
				1640	margin: auto;
				1641	left:-25;
				1642	top:0;
				1643	bottom:auto;
				1644	margin-top:10%;
				1645	margin-bottom:15%;
				1646	margin-left: 35%;
				1647	margin-right: auto;
				1648	background-image: url("../images/phone_front.svg");
				1649	background-repeat: no-repeat;
				1650	background-position: -.53em 0;
				1651	background-size: 12.3em 23.36em;
				1652	border-radius: 2.0em;
				1653	box-shadow: -10px 13px 7px 5px rgba(0, 0, 0, 0.5);
				1654	-webkit-transform: scale(0.90);
				1655	transform: scale(0.90);
				1656	-webkit-transition: -webkit-transform 600ms;
				1657	transition: -webkit-transform 600ms;
				1658	transition: transform 600ms;
				1659	transition: transform 600ms, -webkit-transform 600ms;
				1660	-webkit-transition: box-shadow 450ms;
				1661	transition: box-shadow 450ms;
				1662	}
				1663
Unknown	2175d33	2017-08-13 19:28:40 -0400	[diff] [blame]	1664	.phone-front-hover {
				1665	box-shadow: 0 12px 13px 10px rgba(0, 0, 0, 0.5);
				1666	-webkit-transition: -webkit-transform 600ms;
				1667	transition: -webkit-transform 600ms;
				1668	transition: transform 600ms;
				1669	transition: transform 600ms, -webkit-transform 600ms;
				1670	-webkit-transition: box-shadow 450ms;
				1671	transition: box-shadow 450ms;
				1672	}
				1673
				1674	.phone-screen {
Unknown	f97e9ae	2017-08-13 21:03:37 -0400	[diff] [blame]	1675	width: 10.5em;
				1676	height: 19.3em;
Unknown	2175d33	2017-08-13 19:28:40 -0400	[diff] [blame]	1677	position: relative;
				1678	left: 0;
				1679	right: 0;
Unknown	b5f9640	2017-08-13 20:14:52 -0400	[diff] [blame]	1680	top: 2.283em;
Unknown	2175d33	2017-08-13 19:28:40 -0400	[diff] [blame]	1681	margin: auto;
				1682	background-color: #000;
				1683	overflow: hidden;
				1684	}
				1685	.phone-screen::before {
				1686	content: "";
				1687	position: absolute;
				1688	width: 100%;
				1689	height: 100%;
				1690	box-shadow: inset 13px 0 10px -5px rgba(250, 250, 250, 0.17), inset -13px 0 10px -5px rgba(250, 250, 250, 0.17);
				1691	background-image: url("../images/bliss_screens.gif");
				1692	background-repeat: no-repeat;
				1693	background-position: 50% 0px;
				1694	background-size: cover;
				1695	-webkit-transform: scale(1);
				1696	transform: scale(1);
				1697	}
				1698	.phone-screen::after {
				1699	content: "";
				1700	position: absolute;
				1701	width: 100%;
				1702	height: 100%;
				1703	background-color: rgba(250, 250, 250, 0.1);
				1704	}
				1705
				1706	.phone-side {
				1707	will-change: transform;
Unknown	b5f9640	2017-08-13 20:14:52 -0400	[diff] [blame]	1708	width: 13.33em;
				1709	height: 25em;
Unknown	2175d33	2017-08-13 19:28:40 -0400	[diff] [blame]	1710	position: absolute;
				1711	top: 0;
				1712	bottom: 0;
				1713	left: 0;
				1714	right: 0;
				1715	margin: auto;
Unknown	b5f9640	2017-08-13 20:14:52 -0400	[diff] [blame]	1716	border-radius: 1.66em;
Unknown	2175d33	2017-08-13 19:28:40 -0400	[diff] [blame]	1717	background-repeat: no-repeat;
Unknown	b5f9640	2017-08-13 20:14:52 -0400	[diff] [blame]	1718	background-position: 2.2em .5em;
				1719	background-size: 13.33em 24.73em;
Unknown	2175d33	2017-08-13 19:28:40 -0400	[diff] [blame]	1720	-webkit-transform-style: preserve-3d;
				1721	transform-style: preserve-3d;
				1722	-webkit-transform: skew(-1deg) translateX(-15.5%) translateY(1.2%) scaleX(0.95) scaleY(0.96) rotate(-1deg);
				1723	transform: skew(-1deg) translateX(-15.5%) translateY(1.2%) scaleX(0.95) scaleY(0.96) rotate(-1deg);
				1724	-webkit-transition: all 350ms;
				1725	transition: all 350ms;
				1726	}
				1727
				1728	.phone-side-hover {
				1729	-webkit-transform: skew(-1deg) translateX(-13.4%) translateY(1.05%) scaleX(0.83) scaleY(0.83) rotate(-1deg);
				1730	transform: skew(-1deg) translateX(-13.4%) translateY(1.05%) scaleX(0.83) scaleY(0.83) rotate(-1deg);
				1731	-webkit-transition: all 350ms;
				1732	transition: all 350ms;
				1733	}
				1734
				1735	@-webkit-keyframes figure-anim {
				1736	from {
				1737	border-radius: 50%;
				1738	-webkit-transform: rotate(0deg) scale(1);
				1739	transform: rotate(0deg) scale(1);
				1740	}
				1741	to {
				1742	border-radius: 30%;
				1743	-webkit-transform: rotate(360deg) scale(0.5);
				1744	transform: rotate(360deg) scale(0.5);
				1745	}
				1746	}
				1747
				1748	@keyframes figure-anim {
				1749	from {
				1750	border-radius: 50%;
				1751	-webkit-transform: rotate(0deg) scale(1);
				1752	transform: rotate(0deg) scale(1);
				1753	}
				1754	to {
				1755	border-radius: 30%;
				1756	-webkit-transform: rotate(360deg) scale(0.5);
				1757	transform: rotate(360deg) scale(0.5);
				1758	}
				1759	}
				1760	@-webkit-keyframes figure-container-anim {
				1761	from {
				1762	-webkit-transform: rotate(0deg);
				1763	transform: rotate(0deg);
				1764	}
				1765	to {
				1766	-webkit-transform: rotate(360deg);
				1767	transform: rotate(360deg);
				1768	}
				1769	}
				1770	@keyframes figure-container-anim {
				1771	from {
				1772	-webkit-transform: rotate(0deg);
				1773	transform: rotate(0deg);
				1774	}
				1775	to {
				1776	-webkit-transform: rotate(360deg);
				1777	transform: rotate(360deg);
				1778	}
				1779	}
Unknown	e3cf16e	2017-11-04 16:32:52 -0400	[diff] [blame]	1780
				1781	/* The alert message box */
				1782	.alert {
				1783	padding: 20px;
				1784	background-color: #f44336; /* Red */
				1785	color: white;
				1786	margin-bottom: 15px;
				1787	}
				1788
				1789	/* The close button */
				1790	.closebtn {
				1791	margin-left: 15px;
				1792	color: white;
				1793	font-weight: bold;
				1794	float: right;
				1795	font-size: 22px;
				1796	line-height: 20px;
				1797	cursor: pointer;
				1798	transition: 0.3s;
				1799	}
				1800
				1801	/* When moving the mouse over the close button */
				1802	.closebtn:hover {
				1803	color: black;
Unknown	7e529f8	2017-11-04 16:44:32 -0400	[diff] [blame]	1804	}
Unknown	5503061	2017-11-04 20:28:12 -0400	[diff] [blame]	1805
				1806	.vcenter {
				1807	display: inline-block;
				1808	position: absolute;
				1809	left: 50%;
				1810	top: 50%;
				1811	-webkit-transform: translate(-50%, -50%);
				1812	transform: translate(-50%, -50%);
				1813	}
				1814
				1815	.animation {
				1816	display: inline-block;
				1817	position: relative;
Unknown	1ccf9c5	2017-11-04 20:21:32 -0500	[diff] [blame]	1818	width: 378px;
				1819	height: 290px;
Henri Koivuneva	9c1e243	2017-11-22 22:01:33 +0200	[diff] [blame]	1820	margin: -1.5em -10em;
Unknown	5503061	2017-11-04 20:28:12 -0400	[diff] [blame]	1821	vertical-align: middle;
				1822	}
				1823	.animation .device {
				1824	position: absolute;
				1825	width: 100%;
				1826	height: 100%;
				1827	left: 50%;
				1828	top: 50%;
				1829	background: #111;
				1830	-webkit-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
				1831	-moz-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
				1832	-ms-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
				1833	transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
				1834	-moz-transform: translate(-50%, -50%);
				1835	-ms-transform: translate(-50%, -50%);
				1836	-webkit-transform: translate(-50%, -50%);
				1837	transform: translate(-50%, -50%);
				1838	}
				1839	.animation .device .phone-home-button,
				1840	.animation .device .tablet-home-button {
				1841	position: absolute;
				1842	border-radius: 50%;
				1843	background: #444;
				1844	opacity: 0;
				1845	z-index: 1;
				1846	-webkit-transition: all 0.4s ease;
				1847	-moz-transition: all 0.4s ease;
				1848	-ms-transition: all 0.4s ease;
				1849	transition: all 0.4s ease;
				1850	}
				1851	.animation .device .phone-home-button {
				1852	width: 16px;
				1853	height: 16px;
				1854	margin-top: -8px;
				1855	right: 11px;
				1856	top: 50%;
				1857	}
				1858	.animation .device .tablet-home-button {
				1859	width: 12px;
				1860	height: 12px;
				1861	margin-left: -6px;
				1862	bottom: 7px;
				1863	left: 50%;
				1864	}
				1865	.animation .device .screen-stand {
				1866	position: absolute;
				1867	width: 100%;
				1868	margin-left: -10px;
				1869	margin-top: -1px;
				1870	top: 60%;
				1871	opacity: 0;
				1872	z-index: 1;
				1873	-webkit-transition: all 0.4s ease-out;
				1874	-moz-transition: all 0.4s ease-out;
				1875	-ms-transition: all 0.4s ease-out;
				1876	transition: all 0.4s ease-out;
				1877	}
				1878	.animation .device .screen-stand .leg {
				1879	position: absolute;
				1880	width: 12px;
				1881	height: 16px;
				1882	left: 50%;
				1883	top: 0;
				1884	margin-left: -6px;
				1885	background: #111;
				1886	}
				1887	.animation .device .screen-stand .foot {
				1888	position: absolute;
				1889	width: 120px;
				1890	height: 4px;
				1891	left: 50%;
				1892	top: 15px;
				1893	margin-left: -60px;
				1894	border-top-left-radius: 2px;
				1895	border-top-right-radius: 2px;
				1896	background: #111;
				1897	}
				1898	.animation .device .display {
				1899	position: relative;
				1900	width: 100%;
				1901	height: 100%;
				1902	overflow: hidden;
				1903	background: #34495e;
				1904	z-index: 3;
				1905	}
				1906	.animation .device .display div {
				1907	position: absolute;
				1908	width: 100%;
				1909	height: 100%;
				1910	left: 100%;
				1911	white-space: nowrap;
				1912	-webkit-transition: all 0.4s ease;
				1913	-moz-transition: all 0.4s ease;
				1914	-ms-transition: all 0.4s ease;
				1915	transition: all 0.4s ease;
				1916	}
				1917	.animation .device .display div div {
				1918	position: absolute;
				1919	width: 100%;
				1920	left: 0;
				1921	top: 50%;
				1922	margin-top: -14px;
				1923	font-size: 1.1em;
				1924	text-align: center;
				1925	color: #fff;
				1926	}
				1927	.animation .device .display div div em {
				1928	font-weight: bold;
				1929	}
				1930	.animation .device .display .slide1 {
				1931	background: #34495e;
				1932	}
				1933	.animation .device .display .slide2 {
Unknown	cdf80a2	2017-11-04 20:13:17 -0500	[diff] [blame]	1934	background: #6b15a0;
Unknown	5503061	2017-11-04 20:28:12 -0400	[diff] [blame]	1935	}
				1936	.animation .device .display .slide3 {
Unknown	cdf80a2	2017-11-04 20:13:17 -0500	[diff] [blame]	1937	background: #1c8918;
Unknown	5503061	2017-11-04 20:28:12 -0400	[diff] [blame]	1938	}
				1939	.animation[data-animation-step="1"] .device {
				1940	width: 70%;
				1941	height: 70%;
				1942	padding: 10px;
				1943	border-radius: 4px;
				1944	}
				1945	.animation[data-animation-step="1"] .device .slide1 {
				1946	left: 0%;
				1947	}
				1948	.animation[data-animation-step="1"] .device .screen-stand {
				1949	opacity: 1;
				1950	top: 100%;
				1951	}
				1952	.animation[data-animation-step="2"] .device {
				1953	width: 45%;
				1954	height: 82%;
				1955	padding: 24px;
				1956	border-radius: 10px;
				1957	}
				1958	.animation[data-animation-step="2"] .device .slide1 {
				1959	left: -100%;
				1960	}
				1961	.animation[data-animation-step="2"] .device .slide2 {
				1962	left: 0%;
				1963	}
				1964	.animation[data-animation-step="2"] .device .tablet-home-button {
				1965	opacity: 1;
				1966	}
				1967	.animation[data-animation-step="3"] .device {
				1968	width: 60%;
				1969	height: 42%;
				1970	padding: 10px 36px;
				1971	border-radius: 6px;
				1972	}
				1973	.animation[data-animation-step="3"] .device .slide1,
				1974	.animation[data-animation-step="3"] .device .slide2 {
				1975	left: -100%;
				1976	}
				1977	.animation[data-animation-step="3"] .device .slide3 {
				1978	left: 0%;
				1979	}
				1980	.animation[data-animation-step="3"] .device .phone-home-button {
				1981	opacity: 1;
				1982	}
Henri Koivuneva	9c1e243	2017-11-22 22:01:33 +0200	[diff] [blame]	1983
				1984	/* More media queries */
				1985	@media (max-width: 430px) {
				1986	h2, .h2 {font-size: 30px;}
				1987	}