diff --git a/assets/css/main.css b/assets/css/main.css index f06ad26..b4a593a 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -7,51 +7,9 @@ Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) */ -/* Reset */ - - html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { - margin: 0; - padding: 0; - border: 0; - font-size: 100%; - font: inherit; - vertical-align: baseline; - } - - article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { - display: block; - } - - body { - line-height: 1; - } - - ol, ul { - list-style: none; - } - - blockquote, q { - quotes: none; - } - - blockquote:before, blockquote:after, q:before, q:after { - content: ''; - content: none; - } - - table { - border-collapse: collapse; - border-spacing: 0; - } - - body { - -webkit-text-size-adjust: none; - } - /* Box Model */ *, *:before, *:after { - -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } @@ -245,14 +203,12 @@ .row { border-bottom: solid 1px transparent; - -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } .row > * { float: left; - -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } @@ -1796,13 +1752,9 @@ } body.is-loading *, body.is-loading *:before, body.is-loading *:after { - -moz-animation: none !important; -webkit-animation: none !important; - -ms-animation: none !important; animation: none !important; - -moz-transition: none !important; -webkit-transition: none !important; - -ms-transition: none !important; transition: none !important; } @@ -1815,9 +1767,7 @@ } a { - -moz-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out; -webkit-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out; - -ms-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out; transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out; border-bottom: dotted 1px #666; color: inherit; @@ -2045,7 +1995,8 @@ input[type="email"]:invalid, select:invalid, textarea:invalid { - box-shadow: none; + -webkit-box-shadow: none; + box-shadow: none; } input[type="text"]:focus, @@ -2399,9 +2350,7 @@ } ul.major-icons li .icon { - -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); - -ms-transform: rotate(45deg); transform: rotate(45deg); border-radius: 4px; border: solid 1px rgba(144, 144, 144, 0.5); @@ -2414,9 +2363,7 @@ } ul.major-icons li .icon:before { - -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); - -ms-transform: rotate(-45deg); transform: rotate(-45deg); display: inline-block; line-height: inherit; @@ -2575,14 +2522,13 @@ -webkit-appearance: none; -ms-appearance: none; appearance: none; - -moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; -webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; - -ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; background-color: transparent; border-radius: 4px; border: 0; - box-shadow: inset 0 0 0 1px rgba(144, 144, 144, 0.5); + -webkit-box-shadow: inset 0 0 0 1px rgba(144, 144, 144, 0.5); + box-shadow: inset 0 0 0 1px rgba(144, 144, 144, 0.5); color: #555 !important; cursor: pointer; display: inline-block; @@ -2663,7 +2609,8 @@ button.special, .button.special { background-color: #555; - box-shadow: none !important; + -webkit-box-shadow: none !important; + box-shadow: none !important; color: #fff !important; } @@ -2739,7 +2686,8 @@ .main.style2 input[type="button"], .main.style2 button, .main.style2 .button { - box-shadow: inset 0 0 0 1px #ffffff; + -webkit-box-shadow: inset 0 0 0 1px #ffffff; + box-shadow: inset 0 0 0 1px #ffffff; color: #ffffff !important; } @@ -2765,7 +2713,8 @@ .main.style2 button.special, .main.style2 .button.special { background-color: #ffffff; - box-shadow: inset 0 0 0 1px #ffffff !important; + -webkit-box-shadow: inset 0 0 0 1px #ffffff !important; + box-shadow: inset 0 0 0 1px #ffffff !important; color: #333 !important; } @@ -2834,7 +2783,8 @@ #header input[type="button"], #header button, #header .button { - box-shadow: inset 0 0 0 1px #ffffff; + -webkit-box-shadow: inset 0 0 0 1px #ffffff; + box-shadow: inset 0 0 0 1px #ffffff; color: #ffffff !important; } @@ -2860,7 +2810,8 @@ #header button.special, #header .button.special { background-color: #ffffff; - box-shadow: inset 0 0 0 1px #ffffff !important; + -webkit-box-shadow: inset 0 0 0 1px #ffffff !important; + box-shadow: inset 0 0 0 1px #ffffff !important; color: #4686a0 !important; } @@ -2913,17 +2864,14 @@ } #header .inner { - -moz-transition: -moz-transform 1.5s ease, opacity 2s ease; -webkit-transition: -webkit-transform 1.5s ease, opacity 2s ease; - -ms-transition: -ms-transform 1.5s ease, opacity 2s ease; + -webkit-transition: opacity 2s ease, -webkit-transform 1.5s ease; + transition: opacity 2s ease, -webkit-transform 1.5s ease; transition: transform 1.5s ease, opacity 2s ease; - -moz-transition-delay: 0.25s; + transition: transform 1.5s ease, opacity 2s ease, -webkit-transform 1.5s ease; -webkit-transition-delay: 0.25s; - -ms-transition-delay: 0.25s; transition-delay: 0.25s; - -moz-transform: scale(1); -webkit-transform: scale(1); - -ms-transform: scale(1); transform: scale(1); opacity: 1; position: relative; @@ -2931,25 +2879,19 @@ } #header .inner .actions { - -moz-transition: -moz-transform 1.25s ease; -webkit-transition: -webkit-transform 1.25s ease; - -ms-transition: -ms-transform 1.25s ease; + transition: -webkit-transform 1.25s ease; transition: transform 1.25s ease; - -moz-transition-delay: 1s; + transition: transform 1.25s ease, -webkit-transform 1.25s ease; -webkit-transition-delay: 1s; - -ms-transition-delay: 1s; transition-delay: 1s; - -moz-transform: translateY(0); -webkit-transform: translateY(0); - -ms-transform: translateY(0); transform: translateY(0); opacity: 1; } #header:after { - -moz-transition: opacity 1s ease; -webkit-transition: opacity 1s ease; - -ms-transition: opacity 1s ease; transition: opacity 1s ease; background-image: linear-gradient(45deg, #4fa49a, #4361c2); content: ''; @@ -2962,17 +2904,13 @@ } body.is-loading #header .inner { - -moz-transform: scale(1.05); -webkit-transform: scale(1.05); - -ms-transform: scale(1.05); transform: scale(1.05); opacity: 0; } body.is-loading #header .inner .actions { - -moz-transform: translateY(30em); -webkit-transform: translateY(30em); - -ms-transform: translateY(30em); transform: translateY(30em); opacity: 0; } @@ -3019,7 +2957,8 @@ #footer input[type="button"], #footer button, #footer .button { - box-shadow: inset 0 0 0 1px #ffffff; + -webkit-box-shadow: inset 0 0 0 1px #ffffff; + box-shadow: inset 0 0 0 1px #ffffff; color: #ffffff !important; } @@ -3045,7 +2984,8 @@ #footer button.special, #footer .button.special { background-color: #ffffff; - box-shadow: inset 0 0 0 1px #ffffff !important; + -webkit-box-shadow: inset 0 0 0 1px #ffffff !important; + box-shadow: inset 0 0 0 1px #ffffff !important; color: #4686a0 !important; } @@ -3418,4 +3358,4 @@ padding: 2em 1em 2em 1em ; } - } \ No newline at end of file + } diff --git a/assets/css/reset.css b/assets/css/reset.css new file mode 100644 index 0000000..1a2c624 --- /dev/null +++ b/assets/css/reset.css @@ -0,0 +1,40 @@ +/* Reset */ + + html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; + } + + article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { + display: block; + } + + body { + line-height: 1; + } + + ol, ul { + list-style: none; + } + + blockquote, q { + quotes: none; + } + + blockquote:before, blockquote:after, q:before, q:after { + content: ''; + content: none; + } + + table { + border-collapse: collapse; + border-spacing: 0; + } + + body { + -webkit-text-size-adjust: none; + } diff --git a/images/boris-smokrovic-223509.jpg b/images/boris-smokrovic-223509.jpg new file mode 100644 index 0000000..ad36e1f Binary files /dev/null and b/images/boris-smokrovic-223509.jpg differ diff --git a/images/element5-digital-352048.jpg b/images/element5-digital-352048.jpg new file mode 100644 index 0000000..d7ae5bc Binary files /dev/null and b/images/element5-digital-352048.jpg differ diff --git a/images/green-chameleon-21532.jpg b/images/green-chameleon-21532.jpg new file mode 100644 index 0000000..9183498 Binary files /dev/null and b/images/green-chameleon-21532.jpg differ diff --git a/images/scott-webb-270034.jpg b/images/scott-webb-270034.jpg new file mode 100644 index 0000000..cdd6da9 Binary files /dev/null and b/images/scott-webb-270034.jpg differ diff --git a/index.html b/index.html index 8503f7c..fac6c69 100644 --- a/index.html +++ b/index.html @@ -10,9 +10,17 @@ + + + + + + + + @@ -42,7 +50,7 @@

Lorem ipsum dolor adipiscing

Adipiscing a commodo ante nunc accumsan et interdum mi ante adipiscing. A nunc lobortis non nisl amet vis sed volutpat aclacus nascetur ac non. Lorem curae et ante amet sapien sed tempus adipiscing id accumsan.

- +
@@ -84,7 +92,7 @@

Adipiscing amet consequat

Ante nunc accumsan et aclacus nascetur ac ante amet sapien sed.

- +

Magna feugiat lorem

Adipiscing a commodo ante nunc magna lorem et interdum mi ante nunc lobortis non amet vis sed volutpat et nascetur.

- +

Magna feugiat lorem

Adipiscing a commodo ante nunc magna lorem et interdum mi ante nunc lobortis non amet vis sed volutpat et nascetur.

- +

Magna feugiat lorem

Adipiscing a commodo ante nunc magna lorem et interdum mi ante nunc lobortis non amet vis sed volutpat et nascetur.

- - - - - - - + - \ No newline at end of file +