Renew design
Former-commit-id: 9ab2bcb826eaba89f86497c00d82650767370cd3 [formerly c316949da5dc69fc2409af15185770d99eb82df3] Former-commit-id: df9e90fb55585d1bf164a8a57d59fb11420be236
7
.gitignore
vendored
Normal file
|
@ -0,0 +1,7 @@
|
||||||
|
assets/solid-state/
|
||||||
|
*.swp
|
||||||
|
**.swp
|
||||||
|
*.tmp
|
||||||
|
*.directory
|
||||||
|
**.tmp
|
||||||
|
**.directory
|
163
assets/css/ie8.css
Normal file
|
@ -0,0 +1,163 @@
|
||||||
|
/*
|
||||||
|
Solid State by HTML5 UP
|
||||||
|
html5up.net | @ajlkn
|
||||||
|
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
|
*/
|
||||||
|
|
||||||
|
/* Basic */
|
||||||
|
|
||||||
|
body {
|
||||||
|
-ms-behavior: url("assets/js/backgroundsize.min.htc");
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Type */
|
||||||
|
|
||||||
|
h1.major, h2.major, h3.major, h4.major, h5.major, h6.major {
|
||||||
|
border-bottom: solid 2px #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
blockquote {
|
||||||
|
border-left: solid 4px #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
code {
|
||||||
|
border: solid 2px #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
hr {
|
||||||
|
border-bottom: solid 2px #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Button */
|
||||||
|
|
||||||
|
input[type="submit"],
|
||||||
|
input[type="reset"],
|
||||||
|
input[type="button"],
|
||||||
|
button,
|
||||||
|
.button {
|
||||||
|
position: relative;
|
||||||
|
-ms-behavior: url("assets/js/ie/PIE.htc");
|
||||||
|
border: solid 2px #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type="submit"].special,
|
||||||
|
input[type="reset"].special,
|
||||||
|
input[type="button"].special,
|
||||||
|
button.special,
|
||||||
|
.button.special {
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Form */
|
||||||
|
|
||||||
|
input[type="text"],
|
||||||
|
input[type="password"],
|
||||||
|
input[type="email"],
|
||||||
|
input[type="tel"],
|
||||||
|
select,
|
||||||
|
textarea {
|
||||||
|
position: relative;
|
||||||
|
-ms-behavior: url("assets/js/ie/PIE.htc");
|
||||||
|
background: transparent;
|
||||||
|
border: solid 2px #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Table */
|
||||||
|
|
||||||
|
table tbody tr {
|
||||||
|
border: solid 1px #ffffff;
|
||||||
|
border-left: 0;
|
||||||
|
border-right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
table.alt tbody tr td {
|
||||||
|
border: solid 1px #ffffff;
|
||||||
|
border-left-width: 0;
|
||||||
|
border-top-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
table.alt tbody tr td:first-child {
|
||||||
|
border-left-width: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
table.alt tbody tr:first-child td {
|
||||||
|
border-top-width: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
table.alt thead {
|
||||||
|
border-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
table.alt tfoot {
|
||||||
|
border-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Features */
|
||||||
|
|
||||||
|
.features article {
|
||||||
|
-ms-behavior: url("assets/js/ie/PIE.htc");
|
||||||
|
position: relative;
|
||||||
|
width: 44%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.features article .image {
|
||||||
|
margin-top: 0;
|
||||||
|
margin-left: 0;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Menu */
|
||||||
|
|
||||||
|
#menu {
|
||||||
|
background: #2e3141;
|
||||||
|
}
|
||||||
|
|
||||||
|
#menu h2 {
|
||||||
|
border-bottom: solid 2px #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Header */
|
||||||
|
|
||||||
|
#header {
|
||||||
|
background-color: #353849;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Wrapper */
|
||||||
|
|
||||||
|
.wrapper {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wrapper:before, .wrapper:after {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wrapper.spotlight .image {
|
||||||
|
-ms-behavior: url("assets/js/ie/PIE.htc");
|
||||||
|
}
|
||||||
|
|
||||||
|
.wrapper.spotlight .image img {
|
||||||
|
position: relative;
|
||||||
|
-ms-behavior: url("assets/js/ie/PIE.htc");
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Banner */
|
||||||
|
|
||||||
|
#banner .logo .icon {
|
||||||
|
border: solid 2px #ffffff;
|
||||||
|
-ms-behavior: url("assets/js/ie/PIE.htc");
|
||||||
|
}
|
||||||
|
|
||||||
|
#banner h2 {
|
||||||
|
border-bottom: solid 2px #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Footer */
|
||||||
|
|
||||||
|
#footer .inner .copyright {
|
||||||
|
border-top: solid 2px #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
#footer .inner .copyright li {
|
||||||
|
border-left: solid 2px #ffffff;
|
||||||
|
}
|
|
@ -1,35 +1,89 @@
|
||||||
/*
|
/*
|
||||||
Dimension by HTML5 UP
|
Solid State by HTML5 UP
|
||||||
html5up.net | @ajlkn
|
html5up.net | @ajlkn
|
||||||
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/* BG */
|
/* Basic */
|
||||||
|
|
||||||
#bg:before {
|
body {
|
||||||
background: rgba(19, 21, 25, 0.5);
|
background-color: #2e3141;
|
||||||
|
background-image: url("../../images/bg.jpg");
|
||||||
|
background-size: cover;
|
||||||
|
background-attachment: fixed;
|
||||||
|
background-position: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Header */
|
body:before {
|
||||||
|
background: rgba(46, 49, 65, 0.8);
|
||||||
#header .logo {
|
content: '';
|
||||||
margin: 0 auto;
|
display: block;
|
||||||
|
height: 100%;
|
||||||
|
left: 0;
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#header .content {
|
body > * {
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Features */
|
||||||
|
|
||||||
|
.features article {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
width: 45%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#header nav ul {
|
/* Menu */
|
||||||
|
|
||||||
|
#menu .inner {
|
||||||
|
margin: 4em auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Wrapper */
|
||||||
|
|
||||||
|
#wrapper > header {
|
||||||
|
background: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wrapper.spotlight .inner {
|
||||||
|
text-align: left !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wrapper.spotlight .image {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
margin: 0 3em 2em 0 !important;
|
||||||
|
vertical-align: middle;
|
||||||
|
width: 24%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#header nav ul li {
|
.wrapper.spotlight .content {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
width: 70%;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Main */
|
/* Banner */
|
||||||
|
|
||||||
#main article {
|
#banner {
|
||||||
margin: 0 auto;
|
background: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Footer */
|
||||||
|
|
||||||
|
#footer {
|
||||||
|
background: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#footer .inner form {
|
||||||
|
display: inline-block;
|
||||||
|
width: 45%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#footer .inner .contact {
|
||||||
|
display: inline-block;
|
||||||
|
width: 45%;
|
||||||
}
|
}
|
7
assets/css/images/close.svg
Normal file
|
@ -0,0 +1,7 @@
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 64 64">
|
||||||
|
<style>
|
||||||
|
line { stroke: #ffffff; stroke-width: 2px; }
|
||||||
|
</style>
|
||||||
|
<line x1="20" y1="20" x2="44" y2="44" />
|
||||||
|
<line x1="20" y1="44" x2="44" y2="20" />
|
||||||
|
</svg>
|
After Width: | Height: | Size: 246 B |
3765
assets/css/main.css
|
@ -1,12 +0,0 @@
|
||||||
/*
|
|
||||||
Dimension by HTML5 UP
|
|
||||||
html5up.net | @ajlkn
|
|
||||||
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
|
||||||
*/
|
|
||||||
|
|
||||||
/* Main */
|
|
||||||
|
|
||||||
#main article {
|
|
||||||
opacity: 1;
|
|
||||||
margin: 4rem 0 0 0;
|
|
||||||
}
|
|
Before Width: | Height: | Size: 1.1 KiB |
BIN
assets/images/pic04.jpg
Normal file
After Width: | Height: | Size: 5.5 KiB |
BIN
assets/images/pic05.jpg
Normal file
After Width: | Height: | Size: 5.8 KiB |
BIN
assets/images/pic06.jpg
Normal file
After Width: | Height: | Size: 5.7 KiB |
BIN
assets/images/pic07.jpg
Normal file
After Width: | Height: | Size: 6.2 KiB |
BIN
assets/images/pic08.jpg
Normal file
After Width: | Height: | Size: 9.8 KiB |
96
assets/js/ie/PIE.htc
Normal file
|
@ -0,0 +1,96 @@
|
||||||
|
<!--
|
||||||
|
PIE: CSS3 rendering for IE
|
||||||
|
Version 1.0.0
|
||||||
|
http://css3pie.com
|
||||||
|
Dual-licensed for use under the Apache License Version 2.0 or the General Public License (GPL) Version 2.
|
||||||
|
-->
|
||||||
|
<PUBLIC:COMPONENT lightWeight="true">
|
||||||
|
<!-- saved from url=(0014)about:internet -->
|
||||||
|
<PUBLIC:ATTACH EVENT="oncontentready" FOR="element" ONEVENT="init()" />
|
||||||
|
<PUBLIC:ATTACH EVENT="ondocumentready" FOR="element" ONEVENT="init()" />
|
||||||
|
<PUBLIC:ATTACH EVENT="ondetach" FOR="element" ONEVENT="cleanup()" />
|
||||||
|
|
||||||
|
<script type="text/javascript">
|
||||||
|
var doc = element.document;var f=window.PIE;
|
||||||
|
if(!f){f=window.PIE={F:"-pie-",nb:"Pie",La:"pie_",Ac:{TD:1,TH:1},cc:{TABLE:1,THEAD:1,TBODY:1,TFOOT:1,TR:1,INPUT:1,TEXTAREA:1,SELECT:1,OPTION:1,IMG:1,HR:1},fc:{A:1,INPUT:1,TEXTAREA:1,SELECT:1,BUTTON:1},Gd:{submit:1,button:1,reset:1},aa:function(){}};try{doc.execCommand("BackgroundImageCache",false,true)}catch(aa){}for(var ba=4,Z=doc.createElement("div"),ca=Z.getElementsByTagName("i"),ga;Z.innerHTML="<!--[if gt IE "+ ++ba+"]><i></i><![endif]--\>",ca[0];);f.O=ba;if(ba===6)f.F=f.F.replace(/^-/,"");f.ja=
|
||||||
|
doc.documentMode||f.O;Z.innerHTML='<v:shape adj="1"/>';ga=Z.firstChild;ga.style.behavior="url(#default#VML)";f.zc=typeof ga.adj==="object";(function(){var a,b=0,c={};f.p={Za:function(d){if(!a){a=doc.createDocumentFragment();a.namespaces.add("css3vml","urn:schemas-microsoft-com:vml")}return a.createElement("css3vml:"+d)},Ba:function(d){return d&&d._pieId||(d._pieId="_"+ ++b)},Eb:function(d){var e,g,j,i,h=arguments;e=1;for(g=h.length;e<g;e++){i=h[e];for(j in i)if(i.hasOwnProperty(j))d[j]=i[j]}return d},
|
||||||
|
Rb:function(d,e,g){var j=c[d],i,h;if(j)Object.prototype.toString.call(j)==="[object Array]"?j.push([e,g]):e.call(g,j);else{h=c[d]=[[e,g]];i=new Image;i.onload=function(){j=c[d]={h:i.width,f:i.height};for(var k=0,n=h.length;k<n;k++)h[k][0].call(h[k][1],j);i.onload=null};i.src=d}}}})();f.Na={gc:function(a,b,c,d){function e(){k=j>=90&&j<270?b:0;n=j<180?c:0;m=b-k;p=c-n}function g(){for(;j<0;)j+=360;j%=360}var j=d.sa;d=d.zb;var i,h,k,n,m,p,r,t;if(d){d=d.coords(a,b,c);i=d.x;h=d.y}if(j){j=j.jd();g();e();
|
||||||
|
if(!d){i=k;h=n}d=f.Na.tc(i,h,j,m,p);a=d[0];d=d[1]}else if(d){a=b-i;d=c-h}else{i=h=a=0;d=c}r=a-i;t=d-h;if(j===void 0){j=!r?t<0?90:270:!t?r<0?180:0:-Math.atan2(t,r)/Math.PI*180;g();e()}return{sa:j,xc:i,yc:h,td:a,ud:d,Wd:k,Xd:n,rd:m,sd:p,kd:r,ld:t,rc:f.Na.dc(i,h,a,d)}},tc:function(a,b,c,d,e){if(c===0||c===180)return[d,b];else if(c===90||c===270)return[a,e];else{c=Math.tan(-c*Math.PI/180);a=c*a-b;b=-1/c;d=b*d-e;e=b-c;return[(d-a)/e,(c*d-b*a)/e]}},dc:function(a,b,c,d){a=c-a;b=d-b;return Math.abs(a===0?
|
||||||
|
b:b===0?a:Math.sqrt(a*a+b*b))}};f.ea=function(){this.Gb=[];this.oc={}};f.ea.prototype={ba:function(a){var b=f.p.Ba(a),c=this.oc,d=this.Gb;if(!(b in c)){c[b]=d.length;d.push(a)}},Ha:function(a){a=f.p.Ba(a);var b=this.oc;if(a&&a in b){delete this.Gb[b[a]];delete b[a]}},xa:function(){for(var a=this.Gb,b=a.length;b--;)a[b]&&a[b]()}};f.Oa=new f.ea;f.Oa.Rd=function(){var a=this,b;if(!a.Sd){b=doc.documentElement.currentStyle.getAttribute(f.F+"poll-interval")||250;(function c(){a.xa();setTimeout(c,b)})();
|
||||||
|
a.Sd=1}};(function(){function a(){f.L.xa();window.detachEvent("onunload",a);window.PIE=null}f.L=new f.ea;window.attachEvent("onunload",a);f.L.ta=function(b,c,d){b.attachEvent(c,d);this.ba(function(){b.detachEvent(c,d)})}})();f.Qa=new f.ea;f.L.ta(window,"onresize",function(){f.Qa.xa()});(function(){function a(){f.mb.xa()}f.mb=new f.ea;f.L.ta(window,"onscroll",a);f.Qa.ba(a)})();(function(){function a(){c=f.kb.md()}function b(){if(c){for(var d=0,e=c.length;d<e;d++)f.attach(c[d]);c=0}}var c;if(f.ja<9){f.L.ta(window,
|
||||||
|
"onbeforeprint",a);f.L.ta(window,"onafterprint",b)}})();f.lb=new f.ea;f.L.ta(doc,"onmouseup",function(){f.lb.xa()});f.he=function(){function a(h){this.Y=h}var b=doc.createElement("length-calc"),c=doc.body||doc.documentElement,d=b.style,e={},g=["mm","cm","in","pt","pc"],j=g.length,i={};d.position="absolute";d.top=d.left="-9999px";for(c.appendChild(b);j--;){d.width="100"+g[j];e[g[j]]=b.offsetWidth/100}c.removeChild(b);d.width="1em";a.prototype={Kb:/(px|em|ex|mm|cm|in|pt|pc|%)$/,ic:function(){var h=
|
||||||
|
this.Jd;if(h===void 0)h=this.Jd=parseFloat(this.Y);return h},yb:function(){var h=this.ae;if(!h)h=this.ae=(h=this.Y.match(this.Kb))&&h[0]||"px";return h},a:function(h,k){var n=this.ic(),m=this.yb();switch(m){case "px":return n;case "%":return n*(typeof k==="function"?k():k)/100;case "em":return n*this.xb(h);case "ex":return n*this.xb(h)/2;default:return n*e[m]}},xb:function(h){var k=h.currentStyle.fontSize,n,m;if(k.indexOf("px")>0)return parseFloat(k);else if(h.tagName in f.cc){m=this;n=h.parentNode;
|
||||||
|
return f.n(k).a(n,function(){return m.xb(n)})}else{h.appendChild(b);k=b.offsetWidth;b.parentNode===h&&h.removeChild(b);return k}}};f.n=function(h){return i[h]||(i[h]=new a(h))};return a}();f.Ja=function(){function a(e){this.X=e}var b=f.n("50%"),c={top:1,center:1,bottom:1},d={left:1,center:1,right:1};a.prototype={zd:function(){if(!this.ac){var e=this.X,g=e.length,j=f.v,i=j.qa,h=f.n("0");i=i.na;h=["left",h,"top",h];if(g===1){e.push(new j.ob(i,"center"));g++}if(g===2){i&(e[0].k|e[1].k)&&e[0].d in c&&
|
||||||
|
e[1].d in d&&e.push(e.shift());if(e[0].k&i)if(e[0].d==="center")h[1]=b;else h[0]=e[0].d;else if(e[0].W())h[1]=f.n(e[0].d);if(e[1].k&i)if(e[1].d==="center")h[3]=b;else h[2]=e[1].d;else if(e[1].W())h[3]=f.n(e[1].d)}this.ac=h}return this.ac},coords:function(e,g,j){var i=this.zd(),h=i[1].a(e,g);e=i[3].a(e,j);return{x:i[0]==="right"?g-h:h,y:i[2]==="bottom"?j-e:e}}};return a}();f.Ka=function(){function a(b,c){this.h=b;this.f=c}a.prototype={a:function(b,c,d,e,g){var j=this.h,i=this.f,h=c/d;e=e/g;if(j===
|
||||||
|
"contain"){j=e>h?c:d*e;i=e>h?c/e:d}else if(j==="cover"){j=e<h?c:d*e;i=e<h?c/e:d}else if(j==="auto"){i=i==="auto"?g:i.a(b,d);j=i*e}else{j=j.a(b,c);i=i==="auto"?j/e:i.a(b,d)}return{h:j,f:i}}};a.Kc=new a("auto","auto");return a}();f.Ec=function(){function a(b){this.Y=b}a.prototype={Kb:/[a-z]+$/i,yb:function(){return this.ad||(this.ad=this.Y.match(this.Kb)[0].toLowerCase())},jd:function(){var b=this.Vc,c;if(b===undefined){b=this.yb();c=parseFloat(this.Y,10);b=this.Vc=b==="deg"?c:b==="rad"?c/Math.PI*180:
|
||||||
|
b==="grad"?c/400*360:b==="turn"?c*360:0}return b}};return a}();f.Jc=function(){function a(c){this.Y=c}var b={};a.Qd=/\s*rgba\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d+|\d*\.\d+)\s*\)\s*/;a.Fb={aliceblue:"F0F8FF",antiquewhite:"FAEBD7",aqua:"0FF",aquamarine:"7FFFD4",azure:"F0FFFF",beige:"F5F5DC",bisque:"FFE4C4",black:"000",blanchedalmond:"FFEBCD",blue:"00F",blueviolet:"8A2BE2",brown:"A52A2A",burlywood:"DEB887",cadetblue:"5F9EA0",chartreuse:"7FFF00",chocolate:"D2691E",coral:"FF7F50",cornflowerblue:"6495ED",
|
||||||
|
cornsilk:"FFF8DC",crimson:"DC143C",cyan:"0FF",darkblue:"00008B",darkcyan:"008B8B",darkgoldenrod:"B8860B",darkgray:"A9A9A9",darkgreen:"006400",darkkhaki:"BDB76B",darkmagenta:"8B008B",darkolivegreen:"556B2F",darkorange:"FF8C00",darkorchid:"9932CC",darkred:"8B0000",darksalmon:"E9967A",darkseagreen:"8FBC8F",darkslateblue:"483D8B",darkslategray:"2F4F4F",darkturquoise:"00CED1",darkviolet:"9400D3",deeppink:"FF1493",deepskyblue:"00BFFF",dimgray:"696969",dodgerblue:"1E90FF",firebrick:"B22222",floralwhite:"FFFAF0",
|
||||||
|
forestgreen:"228B22",fuchsia:"F0F",gainsboro:"DCDCDC",ghostwhite:"F8F8FF",gold:"FFD700",goldenrod:"DAA520",gray:"808080",green:"008000",greenyellow:"ADFF2F",honeydew:"F0FFF0",hotpink:"FF69B4",indianred:"CD5C5C",indigo:"4B0082",ivory:"FFFFF0",khaki:"F0E68C",lavender:"E6E6FA",lavenderblush:"FFF0F5",lawngreen:"7CFC00",lemonchiffon:"FFFACD",lightblue:"ADD8E6",lightcoral:"F08080",lightcyan:"E0FFFF",lightgoldenrodyellow:"FAFAD2",lightgreen:"90EE90",lightgrey:"D3D3D3",lightpink:"FFB6C1",lightsalmon:"FFA07A",
|
||||||
|
lightseagreen:"20B2AA",lightskyblue:"87CEFA",lightslategray:"789",lightsteelblue:"B0C4DE",lightyellow:"FFFFE0",lime:"0F0",limegreen:"32CD32",linen:"FAF0E6",magenta:"F0F",maroon:"800000",mediumauqamarine:"66CDAA",mediumblue:"0000CD",mediumorchid:"BA55D3",mediumpurple:"9370D8",mediumseagreen:"3CB371",mediumslateblue:"7B68EE",mediumspringgreen:"00FA9A",mediumturquoise:"48D1CC",mediumvioletred:"C71585",midnightblue:"191970",mintcream:"F5FFFA",mistyrose:"FFE4E1",moccasin:"FFE4B5",navajowhite:"FFDEAD",
|
||||||
|
navy:"000080",oldlace:"FDF5E6",olive:"808000",olivedrab:"688E23",orange:"FFA500",orangered:"FF4500",orchid:"DA70D6",palegoldenrod:"EEE8AA",palegreen:"98FB98",paleturquoise:"AFEEEE",palevioletred:"D87093",papayawhip:"FFEFD5",peachpuff:"FFDAB9",peru:"CD853F",pink:"FFC0CB",plum:"DDA0DD",powderblue:"B0E0E6",purple:"800080",red:"F00",rosybrown:"BC8F8F",royalblue:"4169E1",saddlebrown:"8B4513",salmon:"FA8072",sandybrown:"F4A460",seagreen:"2E8B57",seashell:"FFF5EE",sienna:"A0522D",silver:"C0C0C0",skyblue:"87CEEB",
|
||||||
|
slateblue:"6A5ACD",slategray:"708090",snow:"FFFAFA",springgreen:"00FF7F",steelblue:"4682B4",tan:"D2B48C",teal:"008080",thistle:"D8BFD8",tomato:"FF6347",turquoise:"40E0D0",violet:"EE82EE",wheat:"F5DEB3",white:"FFF",whitesmoke:"F5F5F5",yellow:"FF0",yellowgreen:"9ACD32"};a.prototype={parse:function(){if(!this.Ua){var c=this.Y,d;if(d=c.match(a.Qd)){this.Ua="rgb("+d[1]+","+d[2]+","+d[3]+")";this.Yb=parseFloat(d[4])}else{if((d=c.toLowerCase())in a.Fb)c="#"+a.Fb[d];this.Ua=c;this.Yb=c==="transparent"?0:
|
||||||
|
1}}},U:function(c){this.parse();return this.Ua==="currentColor"?c.currentStyle.color:this.Ua},fa:function(){this.parse();return this.Yb}};f.ha=function(c){return b[c]||(b[c]=new a(c))};return a}();f.v=function(){function a(c){this.$a=c;this.ch=0;this.X=[];this.Ga=0}var b=a.qa={Ia:1,Wb:2,z:4,Lc:8,Xb:16,na:32,K:64,oa:128,pa:256,Ra:512,Tc:1024,URL:2048};a.ob=function(c,d){this.k=c;this.d=d};a.ob.prototype={Ca:function(){return this.k&b.K||this.k&b.oa&&this.d==="0"},W:function(){return this.Ca()||this.k&
|
||||||
|
b.Ra}};a.prototype={de:/\s/,Kd:/^[\+\-]?(\d*\.)?\d+/,url:/^url\(\s*("([^"]*)"|'([^']*)'|([!#$%&*-~]*))\s*\)/i,nc:/^\-?[_a-z][\w-]*/i,Yd:/^("([^"]*)"|'([^']*)')/,Bd:/^#([\da-f]{6}|[\da-f]{3})/i,be:{px:b.K,em:b.K,ex:b.K,mm:b.K,cm:b.K,"in":b.K,pt:b.K,pc:b.K,deg:b.Ia,rad:b.Ia,grad:b.Ia},fd:{rgb:1,rgba:1,hsl:1,hsla:1},next:function(c){function d(p,r){p=new a.ob(p,r);if(!c){k.X.push(p);k.Ga++}return p}function e(){k.Ga++;return null}var g,j,i,h,k=this;if(this.Ga<this.X.length)return this.X[this.Ga++];for(;this.de.test(this.$a.charAt(this.ch));)this.ch++;
|
||||||
|
if(this.ch>=this.$a.length)return e();j=this.ch;g=this.$a.substring(this.ch);i=g.charAt(0);switch(i){case "#":if(h=g.match(this.Bd)){this.ch+=h[0].length;return d(b.z,h[0])}break;case '"':case "'":if(h=g.match(this.Yd)){this.ch+=h[0].length;return d(b.Tc,h[2]||h[3]||"")}break;case "/":case ",":this.ch++;return d(b.pa,i);case "u":if(h=g.match(this.url)){this.ch+=h[0].length;return d(b.URL,h[2]||h[3]||h[4]||"")}}if(h=g.match(this.Kd)){i=h[0];this.ch+=i.length;if(g.charAt(i.length)==="%"){this.ch++;
|
||||||
|
return d(b.Ra,i+"%")}if(h=g.substring(i.length).match(this.nc)){i+=h[0];this.ch+=h[0].length;return d(this.be[h[0].toLowerCase()]||b.Lc,i)}return d(b.oa,i)}if(h=g.match(this.nc)){i=h[0];this.ch+=i.length;if(i.toLowerCase()in f.Jc.Fb||i==="currentColor"||i==="transparent")return d(b.z,i);if(g.charAt(i.length)==="("){this.ch++;if(i.toLowerCase()in this.fd){g=function(p){return p&&p.k&b.oa};h=function(p){return p&&p.k&(b.oa|b.Ra)};var n=function(p,r){return p&&p.d===r},m=function(){return k.next(1)};
|
||||||
|
if((i.charAt(0)==="r"?h(m()):g(m()))&&n(m(),",")&&h(m())&&n(m(),",")&&h(m())&&(i==="rgb"||i==="hsa"||n(m(),",")&&g(m()))&&n(m(),")"))return d(b.z,this.$a.substring(j,this.ch));return e()}return d(b.Xb,i)}return d(b.na,i)}this.ch++;return d(b.Wb,i)},D:function(){return this.X[this.Ga-- -2]},all:function(){for(;this.next(););return this.X},ma:function(c,d){for(var e=[],g,j;g=this.next();){if(c(g)){j=true;this.D();break}e.push(g)}return d&&!j?null:e}};return a}();var ha=function(a){this.e=a};ha.prototype=
|
||||||
|
{Z:0,Od:function(){var a=this.qb,b;return!a||(b=this.o())&&(a.x!==b.x||a.y!==b.y)},Td:function(){var a=this.qb,b;return!a||(b=this.o())&&(a.h!==b.h||a.f!==b.f)},hc:function(){var a=this.e,b=a.getBoundingClientRect(),c=f.ja===9,d=f.O===7,e=b.right-b.left;return{x:b.left,y:b.top,h:c||d?a.offsetWidth:e,f:c||d?a.offsetHeight:b.bottom-b.top,Hd:d&&e?a.offsetWidth/e:1}},o:function(){return this.Z?this.Va||(this.Va=this.hc()):this.hc()},Ad:function(){return!!this.qb},cb:function(){++this.Z},hb:function(){if(!--this.Z){if(this.Va)this.qb=
|
||||||
|
this.Va;this.Va=null}}};(function(){function a(b){var c=f.p.Ba(b);return function(){if(this.Z){var d=this.$b||(this.$b={});return c in d?d[c]:(d[c]=b.call(this))}else return b.call(this)}}f.B={Z:0,ka:function(b){function c(d){this.e=d;this.Zb=this.ia()}f.p.Eb(c.prototype,f.B,b);c.$c={};return c},j:function(){var b=this.ia(),c=this.constructor.$c;return b?b in c?c[b]:(c[b]=this.la(b)):null},ia:a(function(){var b=this.e,c=this.constructor,d=b.style;b=b.currentStyle;var e=this.wa,g=this.Fa,j=c.Yc||(c.Yc=
|
||||||
|
f.F+e);c=c.Zc||(c.Zc=f.nb+g.charAt(0).toUpperCase()+g.substring(1));return d[c]||b.getAttribute(j)||d[g]||b.getAttribute(e)}),i:a(function(){return!!this.j()}),H:a(function(){var b=this.ia(),c=b!==this.Zb;this.Zb=b;return c}),va:a,cb:function(){++this.Z},hb:function(){--this.Z||delete this.$b}}})();f.Sb=f.B.ka({wa:f.F+"background",Fa:f.nb+"Background",cd:{scroll:1,fixed:1,local:1},fb:{"repeat-x":1,"repeat-y":1,repeat:1,"no-repeat":1},sc:{"padding-box":1,"border-box":1,"content-box":1},Pd:{top:1,right:1,
|
||||||
|
bottom:1,left:1,center:1},Ud:{contain:1,cover:1},eb:{Ma:"backgroundClip",z:"backgroundColor",da:"backgroundImage",Pa:"backgroundOrigin",S:"backgroundPosition",T:"backgroundRepeat",Sa:"backgroundSize"},la:function(a){function b(s){return s&&s.W()||s.k&k&&s.d in t}function c(s){return s&&(s.W()&&f.n(s.d)||s.d==="auto"&&"auto")}var d=this.e.currentStyle,e,g,j,i=f.v.qa,h=i.pa,k=i.na,n=i.z,m,p,r=0,t=this.Pd,v,l,q={M:[]};if(this.wb()){e=new f.v(a);for(j={};g=e.next();){m=g.k;p=g.d;if(!j.P&&m&i.Xb&&p===
|
||||||
|
"linear-gradient"){v={ca:[],P:p};for(l={};g=e.next();){m=g.k;p=g.d;if(m&i.Wb&&p===")"){l.color&&v.ca.push(l);v.ca.length>1&&f.p.Eb(j,v);break}if(m&n){if(v.sa||v.zb){g=e.D();if(g.k!==h)break;e.next()}l={color:f.ha(p)};g=e.next();if(g.W())l.db=f.n(g.d);else e.D()}else if(m&i.Ia&&!v.sa&&!l.color&&!v.ca.length)v.sa=new f.Ec(g.d);else if(b(g)&&!v.zb&&!l.color&&!v.ca.length){e.D();v.zb=new f.Ja(e.ma(function(s){return!b(s)},false))}else if(m&h&&p===","){if(l.color){v.ca.push(l);l={}}}else break}}else if(!j.P&&
|
||||||
|
m&i.URL){j.Ab=p;j.P="image"}else if(b(g)&&!j.$){e.D();j.$=new f.Ja(e.ma(function(s){return!b(s)},false))}else if(m&k)if(p in this.fb&&!j.bb)j.bb=p;else if(p in this.sc&&!j.Wa){j.Wa=p;if((g=e.next())&&g.k&k&&g.d in this.sc)j.ub=g.d;else{j.ub=p;e.D()}}else if(p in this.cd&&!j.bc)j.bc=p;else return null;else if(m&n&&!q.color)q.color=f.ha(p);else if(m&h&&p==="/"&&!j.Xa&&j.$){g=e.next();if(g.k&k&&g.d in this.Ud)j.Xa=new f.Ka(g.d);else if(g=c(g)){m=c(e.next());if(!m){m=g;e.D()}j.Xa=new f.Ka(g,m)}else return null}else if(m&
|
||||||
|
h&&p===","&&j.P){j.Hb=a.substring(r,e.ch-1);r=e.ch;q.M.push(j);j={}}else return null}if(j.P){j.Hb=a.substring(r);q.M.push(j)}}else this.Bc(f.ja<9?function(){var s=this.eb,o=d[s.S+"X"],u=d[s.S+"Y"],x=d[s.da],y=d[s.z];if(y!=="transparent")q.color=f.ha(y);if(x!=="none")q.M=[{P:"image",Ab:(new f.v(x)).next().d,bb:d[s.T],$:new f.Ja((new f.v(o+" "+u)).all())}]}:function(){var s=this.eb,o=/\s*,\s*/,u=d[s.da].split(o),x=d[s.z],y,z,B,E,D,C;if(x!=="transparent")q.color=f.ha(x);if((E=u.length)&&u[0]!=="none"){x=
|
||||||
|
d[s.T].split(o);y=d[s.S].split(o);z=d[s.Pa].split(o);B=d[s.Ma].split(o);s=d[s.Sa].split(o);q.M=[];for(o=0;o<E;o++)if((D=u[o])&&D!=="none"){C=s[o].split(" ");q.M.push({Hb:D+" "+x[o]+" "+y[o]+" / "+s[o]+" "+z[o]+" "+B[o],P:"image",Ab:(new f.v(D)).next().d,bb:x[o],$:new f.Ja((new f.v(y[o])).all()),Wa:z[o],ub:B[o],Xa:new f.Ka(C[0],C[1])})}}});return q.color||q.M[0]?q:null},Bc:function(a){var b=f.ja>8,c=this.eb,d=this.e.runtimeStyle,e=d[c.da],g=d[c.z],j=d[c.T],i,h,k,n;if(e)d[c.da]="";if(g)d[c.z]="";if(j)d[c.T]=
|
||||||
|
"";if(b){i=d[c.Ma];h=d[c.Pa];n=d[c.S];k=d[c.Sa];if(i)d[c.Ma]="";if(h)d[c.Pa]="";if(n)d[c.S]="";if(k)d[c.Sa]=""}a=a.call(this);if(e)d[c.da]=e;if(g)d[c.z]=g;if(j)d[c.T]=j;if(b){if(i)d[c.Ma]=i;if(h)d[c.Pa]=h;if(n)d[c.S]=n;if(k)d[c.Sa]=k}return a},ia:f.B.va(function(){return this.wb()||this.Bc(function(){var a=this.e.currentStyle,b=this.eb;return a[b.z]+" "+a[b.da]+" "+a[b.T]+" "+a[b.S+"X"]+" "+a[b.S+"Y"]})}),wb:f.B.va(function(){var a=this.e;return a.style[this.Fa]||a.currentStyle.getAttribute(this.wa)}),
|
||||||
|
qc:function(){var a=0;if(f.O<7){a=this.e;a=""+(a.style[f.nb+"PngFix"]||a.currentStyle.getAttribute(f.F+"png-fix"))==="true"}return a},i:f.B.va(function(){return(this.wb()||this.qc())&&!!this.j()})});f.Vb=f.B.ka({wc:["Top","Right","Bottom","Left"],Id:{thin:"1px",medium:"3px",thick:"5px"},la:function(){var a={},b={},c={},d=false,e=true,g=true,j=true;this.Cc(function(){for(var i=this.e.currentStyle,h=0,k,n,m,p,r,t,v;h<4;h++){m=this.wc[h];v=m.charAt(0).toLowerCase();k=b[v]=i["border"+m+"Style"];n=i["border"+
|
||||||
|
m+"Color"];m=i["border"+m+"Width"];if(h>0){if(k!==p)g=false;if(n!==r)e=false;if(m!==t)j=false}p=k;r=n;t=m;c[v]=f.ha(n);m=a[v]=f.n(b[v]==="none"?"0":this.Id[m]||m);if(m.a(this.e)>0)d=true}});return d?{J:a,Zd:b,gd:c,ee:j,hd:e,$d:g}:null},ia:f.B.va(function(){var a=this.e,b=a.currentStyle,c;a.tagName in f.Ac&&a.offsetParent.currentStyle.borderCollapse==="collapse"||this.Cc(function(){c=b.borderWidth+"|"+b.borderStyle+"|"+b.borderColor});return c}),Cc:function(a){var b=this.e.runtimeStyle,c=b.borderWidth,
|
||||||
|
d=b.borderColor;if(c)b.borderWidth="";if(d)b.borderColor="";a=a.call(this);if(c)b.borderWidth=c;if(d)b.borderColor=d;return a}});(function(){f.jb=f.B.ka({wa:"border-radius",Fa:"borderRadius",la:function(b){var c=null,d,e,g,j,i=false;if(b){e=new f.v(b);var h=function(){for(var k=[],n;(g=e.next())&&g.W();){j=f.n(g.d);n=j.ic();if(n<0)return null;if(n>0)i=true;k.push(j)}return k.length>0&&k.length<5?{tl:k[0],tr:k[1]||k[0],br:k[2]||k[0],bl:k[3]||k[1]||k[0]}:null};if(b=h()){if(g){if(g.k&f.v.qa.pa&&g.d===
|
||||||
|
"/")d=h()}else d=b;if(i&&b&&d)c={x:b,y:d}}}return c}});var a=f.n("0");a={tl:a,tr:a,br:a,bl:a};f.jb.Dc={x:a,y:a}})();f.Ub=f.B.ka({wa:"border-image",Fa:"borderImage",fb:{stretch:1,round:1,repeat:1,space:1},la:function(a){var b=null,c,d,e,g,j,i,h=0,k=f.v.qa,n=k.na,m=k.oa,p=k.Ra;if(a){c=new f.v(a);b={};for(var r=function(l){return l&&l.k&k.pa&&l.d==="/"},t=function(l){return l&&l.k&n&&l.d==="fill"},v=function(){g=c.ma(function(l){return!(l.k&(m|p))});if(t(c.next())&&!b.fill)b.fill=true;else c.D();if(r(c.next())){h++;
|
||||||
|
j=c.ma(function(l){return!l.W()&&!(l.k&n&&l.d==="auto")});if(r(c.next())){h++;i=c.ma(function(l){return!l.Ca()})}}else c.D()};a=c.next();){d=a.k;e=a.d;if(d&(m|p)&&!g){c.D();v()}else if(t(a)&&!b.fill){b.fill=true;v()}else if(d&n&&this.fb[e]&&!b.repeat){b.repeat={f:e};if(a=c.next())if(a.k&n&&this.fb[a.d])b.repeat.Ob=a.d;else c.D()}else if(d&k.URL&&!b.src)b.src=e;else return null}if(!b.src||!g||g.length<1||g.length>4||j&&j.length>4||h===1&&j.length<1||i&&i.length>4||h===2&&i.length<1)return null;if(!b.repeat)b.repeat=
|
||||||
|
{f:"stretch"};if(!b.repeat.Ob)b.repeat.Ob=b.repeat.f;a=function(l,q){return{t:q(l[0]),r:q(l[1]||l[0]),b:q(l[2]||l[0]),l:q(l[3]||l[1]||l[0])}};b.slice=a(g,function(l){return f.n(l.k&m?l.d+"px":l.d)});if(j&&j[0])b.J=a(j,function(l){return l.W()?f.n(l.d):l.d});if(i&&i[0])b.Da=a(i,function(l){return l.Ca()?f.n(l.d):l.d})}return b}});f.Ic=f.B.ka({wa:"box-shadow",Fa:"boxShadow",la:function(a){var b,c=f.n,d=f.v.qa,e;if(a){e=new f.v(a);b={Da:[],Bb:[]};for(a=function(){for(var g,j,i,h,k,n;g=e.next();){i=g.d;
|
||||||
|
j=g.k;if(j&d.pa&&i===",")break;else if(g.Ca()&&!k){e.D();k=e.ma(function(m){return!m.Ca()})}else if(j&d.z&&!h)h=i;else if(j&d.na&&i==="inset"&&!n)n=true;else return false}g=k&&k.length;if(g>1&&g<5){(n?b.Bb:b.Da).push({fe:c(k[0].d),ge:c(k[1].d),blur:c(k[2]?k[2].d:"0"),Vd:c(k[3]?k[3].d:"0"),color:f.ha(h||"currentColor")});return true}return false};a(););}return b&&(b.Bb.length||b.Da.length)?b:null}});f.Uc=f.B.ka({ia:f.B.va(function(){var a=this.e.currentStyle;return a.visibility+"|"+a.display}),la:function(){var a=
|
||||||
|
this.e,b=a.runtimeStyle;a=a.currentStyle;var c=b.visibility,d;b.visibility="";d=a.visibility;b.visibility=c;return{ce:d!=="hidden",nd:a.display!=="none"}},i:function(){return false}});f.u={R:function(a){function b(c,d,e,g){this.e=c;this.s=d;this.g=e;this.parent=g}f.p.Eb(b.prototype,f.u,a);return b},Cb:false,Q:function(){return false},Ea:f.aa,Lb:function(){this.m();this.i()&&this.V()},ib:function(){this.Cb=true},Mb:function(){this.i()?this.V():this.m()},sb:function(a,b){this.vc(a);for(var c=this.ra||
|
||||||
|
(this.ra=[]),d=a+1,e=c.length,g;d<e;d++)if(g=c[d])break;c[a]=b;this.I().insertBefore(b,g||null)},za:function(a){var b=this.ra;return b&&b[a]||null},vc:function(a){var b=this.za(a),c=this.Ta;if(b&&c){c.removeChild(b);this.ra[a]=null}},Aa:function(a,b,c,d){var e=this.rb||(this.rb={}),g=e[a];if(!g){g=e[a]=f.p.Za("shape");if(b)g.appendChild(g[b]=f.p.Za(b));if(d){c=this.za(d);if(!c){this.sb(d,doc.createElement("group"+d));c=this.za(d)}}c.appendChild(g);a=g.style;a.position="absolute";a.left=a.top=0;a.behavior=
|
||||||
|
"url(#default#VML)"}return g},vb:function(a){var b=this.rb,c=b&&b[a];if(c){c.parentNode.removeChild(c);delete b[a]}return!!c},kc:function(a){var b=this.e,c=this.s.o(),d=c.h,e=c.f,g,j,i,h,k,n;c=a.x.tl.a(b,d);g=a.y.tl.a(b,e);j=a.x.tr.a(b,d);i=a.y.tr.a(b,e);h=a.x.br.a(b,d);k=a.y.br.a(b,e);n=a.x.bl.a(b,d);a=a.y.bl.a(b,e);d=Math.min(d/(c+j),e/(i+k),d/(n+h),e/(g+a));if(d<1){c*=d;g*=d;j*=d;i*=d;h*=d;k*=d;n*=d;a*=d}return{x:{tl:c,tr:j,br:h,bl:n},y:{tl:g,tr:i,br:k,bl:a}}},ya:function(a,b,c){b=b||1;var d,e,
|
||||||
|
g=this.s.o();e=g.h*b;g=g.f*b;var j=this.g.G,i=Math.floor,h=Math.ceil,k=a?a.Jb*b:0,n=a?a.Ib*b:0,m=a?a.tb*b:0;a=a?a.Db*b:0;var p,r,t,v,l;if(c||j.i()){d=this.kc(c||j.j());c=d.x.tl*b;j=d.y.tl*b;p=d.x.tr*b;r=d.y.tr*b;t=d.x.br*b;v=d.y.br*b;l=d.x.bl*b;b=d.y.bl*b;e="m"+i(a)+","+i(j)+"qy"+i(c)+","+i(k)+"l"+h(e-p)+","+i(k)+"qx"+h(e-n)+","+i(r)+"l"+h(e-n)+","+h(g-v)+"qy"+h(e-t)+","+h(g-m)+"l"+i(l)+","+h(g-m)+"qx"+i(a)+","+h(g-b)+" x e"}else e="m"+i(a)+","+i(k)+"l"+h(e-n)+","+i(k)+"l"+h(e-n)+","+h(g-m)+"l"+i(a)+
|
||||||
|
","+h(g-m)+"xe";return e},I:function(){var a=this.parent.za(this.N),b;if(!a){a=doc.createElement(this.Ya);b=a.style;b.position="absolute";b.top=b.left=0;this.parent.sb(this.N,a)}return a},mc:function(){var a=this.e,b=a.currentStyle,c=a.runtimeStyle,d=a.tagName,e=f.O===6,g;if(e&&(d in f.cc||d==="FIELDSET")||d==="BUTTON"||d==="INPUT"&&a.type in f.Gd){c.borderWidth="";d=this.g.w.wc;for(g=d.length;g--;){e=d[g];c["padding"+e]="";c["padding"+e]=f.n(b["padding"+e]).a(a)+f.n(b["border"+e+"Width"]).a(a)+(f.O!==
|
||||||
|
8&&g%2?1:0)}c.borderWidth=0}else if(e){if(a.childNodes.length!==1||a.firstChild.tagName!=="ie6-mask"){b=doc.createElement("ie6-mask");d=b.style;d.visibility="visible";for(d.zoom=1;d=a.firstChild;)b.appendChild(d);a.appendChild(b);c.visibility="hidden"}}else c.borderColor="transparent"},ie:function(){},m:function(){this.parent.vc(this.N);delete this.rb;delete this.ra}};f.Rc=f.u.R({i:function(){var a=this.ed;for(var b in a)if(a.hasOwnProperty(b)&&a[b].i())return true;return false},Q:function(){return this.g.Pb.H()},
|
||||||
|
ib:function(){if(this.i()){var a=this.jc(),b=a,c;a=a.currentStyle;var d=a.position,e=this.I().style,g=0,j=0;j=this.s.o();var i=j.Hd;if(d==="fixed"&&f.O>6){g=j.x*i;j=j.y*i;b=d}else{do b=b.offsetParent;while(b&&b.currentStyle.position==="static");if(b){c=b.getBoundingClientRect();b=b.currentStyle;g=(j.x-c.left)*i-(parseFloat(b.borderLeftWidth)||0);j=(j.y-c.top)*i-(parseFloat(b.borderTopWidth)||0)}else{b=doc.documentElement;g=(j.x+b.scrollLeft-b.clientLeft)*i;j=(j.y+b.scrollTop-b.clientTop)*i}b="absolute"}e.position=
|
||||||
|
b;e.left=g;e.top=j;e.zIndex=d==="static"?-1:a.zIndex;this.Cb=true}},Mb:f.aa,Nb:function(){var a=this.g.Pb.j();this.I().style.display=a.ce&&a.nd?"":"none"},Lb:function(){this.i()?this.Nb():this.m()},jc:function(){var a=this.e;return a.tagName in f.Ac?a.offsetParent:a},I:function(){var a=this.Ta,b;if(!a){b=this.jc();a=this.Ta=doc.createElement("css3-container");a.style.direction="ltr";this.Nb();b.parentNode.insertBefore(a,b)}return a},ab:f.aa,m:function(){var a=this.Ta,b;if(a&&(b=a.parentNode))b.removeChild(a);
|
||||||
|
delete this.Ta;delete this.ra}});f.Fc=f.u.R({N:2,Ya:"background",Q:function(){var a=this.g;return a.C.H()||a.G.H()},i:function(){var a=this.g;return a.q.i()||a.G.i()||a.C.i()||a.ga.i()&&a.ga.j().Bb},V:function(){var a=this.s.o();if(a.h&&a.f){this.od();this.pd()}},od:function(){var a=this.g.C.j(),b=this.s.o(),c=this.e,d=a&&a.color,e,g;if(d&&d.fa()>0){this.lc();a=this.Aa("bgColor","fill",this.I(),1);e=b.h;b=b.f;a.stroked=false;a.coordsize=e*2+","+b*2;a.coordorigin="1,1";a.path=this.ya(null,2);g=a.style;
|
||||||
|
g.width=e;g.height=b;a.fill.color=d.U(c);c=d.fa();if(c<1)a.fill.opacity=c}else this.vb("bgColor")},pd:function(){var a=this.g.C.j(),b=this.s.o();a=a&&a.M;var c,d,e,g,j;if(a){this.lc();d=b.h;e=b.f;for(j=a.length;j--;){b=a[j];c=this.Aa("bgImage"+j,"fill",this.I(),2);c.stroked=false;c.fill.type="tile";c.fillcolor="none";c.coordsize=d*2+","+e*2;c.coordorigin="1,1";c.path=this.ya(0,2);g=c.style;g.width=d;g.height=e;if(b.P==="linear-gradient")this.bd(c,b);else{c.fill.src=b.Ab;this.Nd(c,j)}}}for(j=a?a.length:
|
||||||
|
0;this.vb("bgImage"+j++););},Nd:function(a,b){var c=this;f.p.Rb(a.fill.src,function(d){var e=c.e,g=c.s.o(),j=g.h;g=g.f;if(j&&g){var i=a.fill,h=c.g,k=h.w.j(),n=k&&k.J;k=n?n.t.a(e):0;var m=n?n.r.a(e):0,p=n?n.b.a(e):0;n=n?n.l.a(e):0;h=h.C.j().M[b];e=h.$?h.$.coords(e,j-d.h-n-m,g-d.f-k-p):{x:0,y:0};h=h.bb;p=m=0;var r=j+1,t=g+1,v=f.O===8?0:1;n=Math.round(e.x)+n+0.5;k=Math.round(e.y)+k+0.5;i.position=n/j+","+k/g;i.size.x=1;i.size=d.h+"px,"+d.f+"px";if(h&&h!=="repeat"){if(h==="repeat-x"||h==="no-repeat"){m=
|
||||||
|
k+1;t=k+d.f+v}if(h==="repeat-y"||h==="no-repeat"){p=n+1;r=n+d.h+v}a.style.clip="rect("+m+"px,"+r+"px,"+t+"px,"+p+"px)"}}})},bd:function(a,b){var c=this.e,d=this.s.o(),e=d.h,g=d.f;a=a.fill;d=b.ca;var j=d.length,i=Math.PI,h=f.Na,k=h.tc,n=h.dc;b=h.gc(c,e,g,b);h=b.sa;var m=b.xc,p=b.yc,r=b.Wd,t=b.Xd,v=b.rd,l=b.sd,q=b.kd,s=b.ld;b=b.rc;e=h%90?Math.atan2(q*e/g,s)/i*180:h+90;e+=180;e%=360;v=k(r,t,h,v,l);g=n(r,t,v[0],v[1]);i=[];v=k(m,p,h,r,t);n=n(m,p,v[0],v[1])/g*100;k=[];for(h=0;h<j;h++)k.push(d[h].db?d[h].db.a(c,
|
||||||
|
b):h===0?0:h===j-1?b:null);for(h=1;h<j;h++){if(k[h]===null){m=k[h-1];b=h;do p=k[++b];while(p===null);k[h]=m+(p-m)/(b-h+1)}k[h]=Math.max(k[h],k[h-1])}for(h=0;h<j;h++)i.push(n+k[h]/g*100+"% "+d[h].color.U(c));a.angle=e;a.type="gradient";a.method="sigma";a.color=d[0].color.U(c);a.color2=d[j-1].color.U(c);if(a.colors)a.colors.value=i.join(",");else a.colors=i.join(",")},lc:function(){var a=this.e.runtimeStyle;a.backgroundImage="url(about:blank)";a.backgroundColor="transparent"},m:function(){f.u.m.call(this);
|
||||||
|
var a=this.e.runtimeStyle;a.backgroundImage=a.backgroundColor=""}});f.Gc=f.u.R({N:4,Ya:"border",Q:function(){var a=this.g;return a.w.H()||a.G.H()},i:function(){var a=this.g;return a.G.i()&&!a.q.i()&&a.w.i()},V:function(){var a=this.e,b=this.g.w.j(),c=this.s.o(),d=c.h;c=c.f;var e,g,j,i,h;if(b){this.mc();b=this.wd(2);i=0;for(h=b.length;i<h;i++){j=b[i];e=this.Aa("borderPiece"+i,j.stroke?"stroke":"fill",this.I());e.coordsize=d*2+","+c*2;e.coordorigin="1,1";e.path=j.path;g=e.style;g.width=d;g.height=c;
|
||||||
|
e.filled=!!j.fill;e.stroked=!!j.stroke;if(j.stroke){e=e.stroke;e.weight=j.Qb+"px";e.color=j.color.U(a);e.dashstyle=j.stroke==="dashed"?"2 2":j.stroke==="dotted"?"1 1":"solid";e.linestyle=j.stroke==="double"&&j.Qb>2?"ThinThin":"Single"}else e.fill.color=j.fill.U(a)}for(;this.vb("borderPiece"+i++););}},wd:function(a){var b=this.e,c,d,e,g=this.g.w,j=[],i,h,k,n,m=Math.round,p,r,t;if(g.i()){c=g.j();g=c.J;r=c.Zd;t=c.gd;if(c.ee&&c.$d&&c.hd){if(t.t.fa()>0){c=g.t.a(b);k=c/2;j.push({path:this.ya({Jb:k,Ib:k,
|
||||||
|
tb:k,Db:k},a),stroke:r.t,color:t.t,Qb:c})}}else{a=a||1;c=this.s.o();d=c.h;e=c.f;c=m(g.t.a(b));k=m(g.r.a(b));n=m(g.b.a(b));b=m(g.l.a(b));var v={t:c,r:k,b:n,l:b};b=this.g.G;if(b.i())p=this.kc(b.j());i=Math.floor;h=Math.ceil;var l=function(o,u){return p?p[o][u]:0},q=function(o,u,x,y,z,B){var E=l("x",o),D=l("y",o),C=o.charAt(1)==="r";o=o.charAt(0)==="b";return E>0&&D>0?(B?"al":"ae")+(C?h(d-E):i(E))*a+","+(o?h(e-D):i(D))*a+","+(i(E)-u)*a+","+(i(D)-x)*a+","+y*65535+","+2949075*(z?1:-1):(B?"m":"l")+(C?d-
|
||||||
|
u:u)*a+","+(o?e-x:x)*a},s=function(o,u,x,y){var z=o==="t"?i(l("x","tl"))*a+","+h(u)*a:o==="r"?h(d-u)*a+","+i(l("y","tr"))*a:o==="b"?h(d-l("x","br"))*a+","+i(e-u)*a:i(u)*a+","+h(e-l("y","bl"))*a;o=o==="t"?h(d-l("x","tr"))*a+","+h(u)*a:o==="r"?h(d-u)*a+","+h(e-l("y","br"))*a:o==="b"?i(l("x","bl"))*a+","+i(e-u)*a:i(u)*a+","+i(l("y","tl"))*a;return x?(y?"m"+o:"")+"l"+z:(y?"m"+z:"")+"l"+o};b=function(o,u,x,y,z,B){var E=o==="l"||o==="r",D=v[o],C,F;if(D>0&&r[o]!=="none"&&t[o].fa()>0){C=v[E?o:u];u=v[E?u:
|
||||||
|
o];F=v[E?o:x];x=v[E?x:o];if(r[o]==="dashed"||r[o]==="dotted"){j.push({path:q(y,C,u,B+45,0,1)+q(y,0,0,B,1,0),fill:t[o]});j.push({path:s(o,D/2,0,1),stroke:r[o],Qb:D,color:t[o]});j.push({path:q(z,F,x,B,0,1)+q(z,0,0,B-45,1,0),fill:t[o]})}else j.push({path:q(y,C,u,B+45,0,1)+s(o,D,0,0)+q(z,F,x,B,0,0)+(r[o]==="double"&&D>2?q(z,F-i(F/3),x-i(x/3),B-45,1,0)+s(o,h(D/3*2),1,0)+q(y,C-i(C/3),u-i(u/3),B,1,0)+"x "+q(y,i(C/3),i(u/3),B+45,0,1)+s(o,i(D/3),1,0)+q(z,i(F/3),i(x/3),B,0,0):"")+q(z,0,0,B-45,1,0)+s(o,0,1,
|
||||||
|
0)+q(y,0,0,B,1,0),fill:t[o]})}};b("t","l","r","tl","tr",90);b("r","t","b","tr","br",0);b("b","r","l","br","bl",-90);b("l","b","t","bl","tl",-180)}}return j},m:function(){if(this.ec||!this.g.q.i())this.e.runtimeStyle.borderColor="";f.u.m.call(this)}});f.Tb=f.u.R({N:5,Md:["t","tr","r","br","b","bl","l","tl","c"],Q:function(){return this.g.q.H()},i:function(){return this.g.q.i()},V:function(){this.I();var a=this.g.q.j(),b=this.g.w.j(),c=this.s.o(),d=this.e,e=this.uc;f.p.Rb(a.src,function(g){function j(s,
|
||||||
|
o,u,x,y){s=e[s].style;var z=Math.max;s.width=z(o,0);s.height=z(u,0);s.left=x;s.top=y}function i(s,o,u){for(var x=0,y=s.length;x<y;x++)e[s[x]].imagedata[o]=u}var h=c.h,k=c.f,n=f.n("0"),m=a.J||(b?b.J:{t:n,r:n,b:n,l:n});n=m.t.a(d);var p=m.r.a(d),r=m.b.a(d);m=m.l.a(d);var t=a.slice,v=t.t.a(d),l=t.r.a(d),q=t.b.a(d);t=t.l.a(d);j("tl",m,n,0,0);j("t",h-m-p,n,m,0);j("tr",p,n,h-p,0);j("r",p,k-n-r,h-p,n);j("br",p,r,h-p,k-r);j("b",h-m-p,r,m,k-r);j("bl",m,r,0,k-r);j("l",m,k-n-r,0,n);j("c",h-m-p,k-n-r,m,n);i(["tl",
|
||||||
|
"t","tr"],"cropBottom",(g.f-v)/g.f);i(["tl","l","bl"],"cropRight",(g.h-t)/g.h);i(["bl","b","br"],"cropTop",(g.f-q)/g.f);i(["tr","r","br"],"cropLeft",(g.h-l)/g.h);i(["l","r","c"],"cropTop",v/g.f);i(["l","r","c"],"cropBottom",q/g.f);i(["t","b","c"],"cropLeft",t/g.h);i(["t","b","c"],"cropRight",l/g.h);e.c.style.display=a.fill?"":"none"},this)},I:function(){var a=this.parent.za(this.N),b,c,d,e=this.Md,g=e.length;if(!a){a=doc.createElement("border-image");b=a.style;b.position="absolute";this.uc={};for(d=
|
||||||
|
0;d<g;d++){c=this.uc[e[d]]=f.p.Za("rect");c.appendChild(f.p.Za("imagedata"));b=c.style;b.behavior="url(#default#VML)";b.position="absolute";b.top=b.left=0;c.imagedata.src=this.g.q.j().src;c.stroked=false;c.filled=false;a.appendChild(c)}this.parent.sb(this.N,a)}return a},Ea:function(){if(this.i()){var a=this.e,b=a.runtimeStyle,c=this.g.q.j().J;b.borderStyle="solid";if(c){b.borderTopWidth=c.t.a(a)+"px";b.borderRightWidth=c.r.a(a)+"px";b.borderBottomWidth=c.b.a(a)+"px";b.borderLeftWidth=c.l.a(a)+"px"}this.mc()}},
|
||||||
|
m:function(){var a=this.e.runtimeStyle;a.borderStyle="";if(this.ec||!this.g.w.i())a.borderColor=a.borderWidth="";f.u.m.call(this)}});f.Hc=f.u.R({N:1,Ya:"outset-box-shadow",Q:function(){var a=this.g;return a.ga.H()||a.G.H()},i:function(){var a=this.g.ga;return a.i()&&a.j().Da[0]},V:function(){function a(C,F,O,H,M,P,I){C=b.Aa("shadow"+C+F,"fill",d,j-C);F=C.fill;C.coordsize=n*2+","+m*2;C.coordorigin="1,1";C.stroked=false;C.filled=true;F.color=M.U(c);if(P){F.type="gradienttitle";F.color2=F.color;F.opacity=
|
||||||
|
0}C.path=I;l=C.style;l.left=O;l.top=H;l.width=n;l.height=m;return C}var b=this,c=this.e,d=this.I(),e=this.g,g=e.ga.j().Da;e=e.G.j();var j=g.length,i=j,h,k=this.s.o(),n=k.h,m=k.f;k=f.O===8?1:0;for(var p=["tl","tr","br","bl"],r,t,v,l,q,s,o,u,x,y,z,B,E,D;i--;){t=g[i];q=t.fe.a(c);s=t.ge.a(c);h=t.Vd.a(c);o=t.blur.a(c);t=t.color;u=-h-o;if(!e&&o)e=f.jb.Dc;u=this.ya({Jb:u,Ib:u,tb:u,Db:u},2,e);if(o){x=(h+o)*2+n;y=(h+o)*2+m;z=x?o*2/x:0;B=y?o*2/y:0;if(o-h>n/2||o-h>m/2)for(h=4;h--;){r=p[h];E=r.charAt(0)==="b";
|
||||||
|
D=r.charAt(1)==="r";r=a(i,r,q,s,t,o,u);v=r.fill;v.focusposition=(D?1-z:z)+","+(E?1-B:B);v.focussize="0,0";r.style.clip="rect("+((E?y/2:0)+k)+"px,"+(D?x:x/2)+"px,"+(E?y:y/2)+"px,"+((D?x/2:0)+k)+"px)"}else{r=a(i,"",q,s,t,o,u);v=r.fill;v.focusposition=z+","+B;v.focussize=1-z*2+","+(1-B*2)}}else{r=a(i,"",q,s,t,o,u);q=t.fa();if(q<1)r.fill.opacity=q}}}});f.Pc=f.u.R({N:6,Ya:"imgEl",Q:function(){var a=this.g;return this.e.src!==this.Xc||a.G.H()},i:function(){var a=this.g;return a.G.i()||a.C.qc()},V:function(){this.Xc=
|
||||||
|
j;this.Cd();var a=this.Aa("img","fill",this.I()),b=a.fill,c=this.s.o(),d=c.h;c=c.f;var e=this.g.w.j(),g=e&&e.J;e=this.e;var j=e.src,i=Math.round,h=e.currentStyle,k=f.n;if(!g||f.O<7){g=f.n("0");g={t:g,r:g,b:g,l:g}}a.stroked=false;b.type="frame";b.src=j;b.position=(d?0.5/d:0)+","+(c?0.5/c:0);a.coordsize=d*2+","+c*2;a.coordorigin="1,1";a.path=this.ya({Jb:i(g.t.a(e)+k(h.paddingTop).a(e)),Ib:i(g.r.a(e)+k(h.paddingRight).a(e)),tb:i(g.b.a(e)+k(h.paddingBottom).a(e)),Db:i(g.l.a(e)+k(h.paddingLeft).a(e))},
|
||||||
|
2);a=a.style;a.width=d;a.height=c},Cd:function(){this.e.runtimeStyle.filter="alpha(opacity=0)"},m:function(){f.u.m.call(this);this.e.runtimeStyle.filter=""}});f.Oc=f.u.R({ib:f.aa,Mb:f.aa,Nb:f.aa,Lb:f.aa,Ld:/^,+|,+$/g,Fd:/,+/g,gb:function(a,b){(this.pb||(this.pb=[]))[a]=b||void 0},ab:function(){var a=this.pb,b;if(a&&(b=a.join(",").replace(this.Ld,"").replace(this.Fd,","))!==this.Wc)this.Wc=this.e.runtimeStyle.background=b},m:function(){this.e.runtimeStyle.background="";delete this.pb}});f.Mc=f.u.R({ua:1,
|
||||||
|
Q:function(){return this.g.C.H()},i:function(){var a=this.g;return a.C.i()||a.q.i()},V:function(){var a=this.g.C.j(),b,c,d=0,e,g;if(a){b=[];if(c=a.M)for(;e=c[d++];)if(e.P==="linear-gradient"){g=this.vd(e.Wa);g=(e.Xa||f.Ka.Kc).a(this.e,g.h,g.f,g.h,g.f);b.push("url(data:image/svg+xml,"+escape(this.xd(e,g.h,g.f))+") "+this.dd(e.$)+" / "+g.h+"px "+g.f+"px "+(e.bc||"")+" "+(e.Wa||"")+" "+(e.ub||""))}else b.push(e.Hb);a.color&&b.push(a.color.Y);this.parent.gb(this.ua,b.join(","))}},dd:function(a){return a?
|
||||||
|
a.X.map(function(b){return b.d}).join(" "):"0 0"},vd:function(a){var b=this.e,c=this.s.o(),d=c.h;c=c.f;var e;if(a!=="border-box")if((e=this.g.w.j())&&(e=e.J)){d-=e.l.a(b)+e.l.a(b);c-=e.t.a(b)+e.b.a(b)}if(a==="content-box"){a=f.n;e=b.currentStyle;d-=a(e.paddingLeft).a(b)+a(e.paddingRight).a(b);c-=a(e.paddingTop).a(b)+a(e.paddingBottom).a(b)}return{h:d,f:c}},xd:function(a,b,c){var d=this.e,e=a.ca,g=e.length,j=f.Na.gc(d,b,c,a);a=j.xc;var i=j.yc,h=j.td,k=j.ud;j=j.rc;var n,m,p,r,t;n=[];for(m=0;m<g;m++)n.push(e[m].db?
|
||||||
|
e[m].db.a(d,j):m===0?0:m===g-1?j:null);for(m=1;m<g;m++)if(n[m]===null){r=n[m-1];p=m;do t=n[++p];while(t===null);n[m]=r+(t-r)/(p-m+1)}b=['<svg width="'+b+'" height="'+c+'" xmlns="http://www.w3.org/2000/svg"><defs><linearGradient id="g" gradientUnits="userSpaceOnUse" x1="'+a/b*100+'%" y1="'+i/c*100+'%" x2="'+h/b*100+'%" y2="'+k/c*100+'%">'];for(m=0;m<g;m++)b.push('<stop offset="'+n[m]/j+'" stop-color="'+e[m].color.U(d)+'" stop-opacity="'+e[m].color.fa()+'"/>');b.push('</linearGradient></defs><rect width="100%" height="100%" fill="url(#g)"/></svg>');
|
||||||
|
return b.join("")},m:function(){this.parent.gb(this.ua)}});f.Nc=f.u.R({T:"repeat",Sc:"stretch",Qc:"round",ua:0,Q:function(){return this.g.q.H()},i:function(){return this.g.q.i()},V:function(){var a=this,b=a.g.q.j(),c=a.g.w.j(),d=a.s.o(),e=b.repeat,g=e.f,j=e.Ob,i=a.e,h=0;f.p.Rb(b.src,function(k){function n(Q,R,U,V,W,Y,X,S,w,A){K.push('<pattern patternUnits="userSpaceOnUse" id="pattern'+G+'" x="'+(g===l?Q+U/2-w/2:Q)+'" y="'+(j===l?R+V/2-A/2:R)+'" width="'+w+'" height="'+A+'"><svg width="'+w+'" height="'+
|
||||||
|
A+'" viewBox="'+W+" "+Y+" "+X+" "+S+'" preserveAspectRatio="none"><image xlink:href="'+v+'" x="0" y="0" width="'+r+'" height="'+t+'" /></svg></pattern>');J.push('<rect x="'+Q+'" y="'+R+'" width="'+U+'" height="'+V+'" fill="url(#pattern'+G+')" />');G++}var m=d.h,p=d.f,r=k.h,t=k.f,v=a.Dd(b.src,r,t),l=a.T,q=a.Sc;k=a.Qc;var s=Math.ceil,o=f.n("0"),u=b.J||(c?c.J:{t:o,r:o,b:o,l:o});o=u.t.a(i);var x=u.r.a(i),y=u.b.a(i);u=u.l.a(i);var z=b.slice,B=z.t.a(i),E=z.r.a(i),D=z.b.a(i);z=z.l.a(i);var C=m-u-x,F=p-o-
|
||||||
|
y,O=r-z-E,H=t-B-D,M=g===q?C:O*o/B,P=j===q?F:H*x/E,I=g===q?C:O*y/D;q=j===q?F:H*u/z;var K=[],J=[],G=0;if(g===k){M-=(M-(C%M||M))/s(C/M);I-=(I-(C%I||I))/s(C/I)}if(j===k){P-=(P-(F%P||P))/s(F/P);q-=(q-(F%q||q))/s(F/q)}k=['<svg width="'+m+'" height="'+p+'" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">'];n(0,0,u,o,0,0,z,B,u,o);n(u,0,C,o,z,0,O,B,M,o);n(m-x,0,x,o,r-E,0,E,B,x,o);n(0,o,u,F,0,B,z,H,u,q);if(b.fill)n(u,o,C,F,z,B,O,H,M||I||O,q||P||H);n(m-x,o,x,F,r-E,B,E,H,x,P);n(0,
|
||||||
|
p-y,u,y,0,t-D,z,D,u,y);n(u,p-y,C,y,z,t-D,O,D,I,y);n(m-x,p-y,x,y,r-E,t-D,E,D,x,y);k.push("<defs>"+K.join("\n")+"</defs>"+J.join("\n")+"</svg>");a.parent.gb(a.ua,"url(data:image/svg+xml,"+escape(k.join(""))+") no-repeat border-box border-box");h&&a.parent.ab()},a);h=1},Dd:function(){var a={};return function(b,c,d){var e=a[b],g;if(!e){e=new Image;g=doc.createElement("canvas");e.src=b;g.width=c;g.height=d;g.getContext("2d").drawImage(e,0,0);e=a[b]=g.toDataURL()}return e}}(),Ea:f.Tb.prototype.Ea,m:function(){var a=
|
||||||
|
this.e.runtimeStyle;this.parent.gb(this.ua);a.borderColor=a.borderStyle=a.borderWidth=""}});f.kb=function(){function a(l,q){l.className+=" "+q}function b(l){var q=v.slice.call(arguments,1),s=q.length;setTimeout(function(){if(l)for(;s--;)a(l,q[s])},0)}function c(l){var q=v.slice.call(arguments,1),s=q.length;setTimeout(function(){if(l)for(;s--;){var o=q[s];o=t[o]||(t[o]=new RegExp("\\b"+o+"\\b","g"));l.className=l.className.replace(o,"")}},0)}function d(l){function q(){if(!U){var w,A,L=f.ja,T=l.currentStyle,
|
||||||
|
N=T.getAttribute(g)==="true",da=T.getAttribute(i)!=="false",ea=T.getAttribute(h)!=="false";S=T.getAttribute(j);S=L>7?S!=="false":S==="true";if(!R){R=1;l.runtimeStyle.zoom=1;T=l;for(var fa=1;T=T.previousSibling;)if(T.nodeType===1){fa=0;break}fa&&a(l,p)}J.cb();if(N&&(A=J.o())&&(w=doc.documentElement||doc.body)&&(A.y>w.clientHeight||A.x>w.clientWidth||A.y+A.f<0||A.x+A.h<0)){if(!Y){Y=1;f.mb.ba(q)}}else{U=1;Y=R=0;f.mb.Ha(q);if(L===9){G={C:new f.Sb(l),q:new f.Ub(l),w:new f.Vb(l)};Q=[G.C,G.q];K=new f.Oc(l,
|
||||||
|
J,G);w=[new f.Mc(l,J,G,K),new f.Nc(l,J,G,K)]}else{G={C:new f.Sb(l),w:new f.Vb(l),q:new f.Ub(l),G:new f.jb(l),ga:new f.Ic(l),Pb:new f.Uc(l)};Q=[G.C,G.w,G.q,G.G,G.ga,G.Pb];K=new f.Rc(l,J,G);w=[new f.Hc(l,J,G,K),new f.Fc(l,J,G,K),new f.Gc(l,J,G,K),new f.Tb(l,J,G,K)];l.tagName==="IMG"&&w.push(new f.Pc(l,J,G,K));K.ed=w}I=[K].concat(w);if(w=l.currentStyle.getAttribute(f.F+"watch-ancestors")){w=parseInt(w,10);A=0;for(N=l.parentNode;N&&(w==="NaN"||A++<w);){H(N,"onpropertychange",C);H(N,"onmouseenter",x);
|
||||||
|
H(N,"onmouseleave",y);H(N,"onmousedown",z);if(N.tagName in f.fc){H(N,"onfocus",E);H(N,"onblur",D)}N=N.parentNode}}if(S){f.Oa.ba(o);f.Oa.Rd()}o(1)}if(!V){V=1;L<9&&H(l,"onmove",s);H(l,"onresize",s);H(l,"onpropertychange",u);ea&&H(l,"onmouseenter",x);if(ea||da)H(l,"onmouseleave",y);da&&H(l,"onmousedown",z);if(l.tagName in f.fc){H(l,"onfocus",E);H(l,"onblur",D)}f.Qa.ba(s);f.L.ba(M)}J.hb()}}function s(){J&&J.Ad()&&o()}function o(w){if(!X)if(U){var A,L=I.length;F();for(A=0;A<L;A++)I[A].Ea();if(w||J.Od())for(A=
|
||||||
|
0;A<L;A++)I[A].ib();if(w||J.Td())for(A=0;A<L;A++)I[A].Mb();K.ab();O()}else R||q()}function u(){var w,A=I.length,L;w=event;if(!X&&!(w&&w.propertyName in r))if(U){F();for(w=0;w<A;w++)I[w].Ea();for(w=0;w<A;w++){L=I[w];L.Cb||L.ib();L.Q()&&L.Lb()}K.ab();O()}else R||q()}function x(){b(l,k)}function y(){c(l,k,n)}function z(){b(l,n);f.lb.ba(B)}function B(){c(l,n);f.lb.Ha(B)}function E(){b(l,m)}function D(){c(l,m)}function C(){var w=event.propertyName;if(w==="className"||w==="id")u()}function F(){J.cb();for(var w=
|
||||||
|
Q.length;w--;)Q[w].cb()}function O(){for(var w=Q.length;w--;)Q[w].hb();J.hb()}function H(w,A,L){w.attachEvent(A,L);W.push([w,A,L])}function M(){if(V){for(var w=W.length,A;w--;){A=W[w];A[0].detachEvent(A[1],A[2])}f.L.Ha(M);V=0;W=[]}}function P(){if(!X){var w,A;M();X=1;if(I){w=0;for(A=I.length;w<A;w++){I[w].ec=1;I[w].m()}}S&&f.Oa.Ha(o);f.Qa.Ha(o);I=J=G=Q=l=null}}var I,K,J=new ha(l),G,Q,R,U,V,W=[],Y,X,S;this.Ed=q;this.update=o;this.m=P;this.qd=l}var e={},g=f.F+"lazy-init",j=f.F+"poll",i=f.F+"track-active",
|
||||||
|
h=f.F+"track-hover",k=f.La+"hover",n=f.La+"active",m=f.La+"focus",p=f.La+"first-child",r={background:1,bgColor:1,display:1},t={},v=[];d.yd=function(l){var q=f.p.Ba(l);return e[q]||(e[q]=new d(l))};d.m=function(l){l=f.p.Ba(l);var q=e[l];if(q){q.m();delete e[l]}};d.md=function(){var l=[],q;if(e){for(var s in e)if(e.hasOwnProperty(s)){q=e[s];l.push(q.qd);q.m()}e={}}return l};return d}();f.supportsVML=f.zc;f.attach=function(a){f.ja<10&&f.zc&&f.kb.yd(a).Ed()};f.detach=function(a){f.kb.m(a)}};
|
||||||
|
var $=element;function init(){if(doc.media!=="print"){var a=window.PIE;a&&a.attach($)}}function cleanup(){if(doc.media!=="print"){var a=window.PIE;if(a){a.detach($);$=0}}}$.readyState==="complete"&&init();
|
||||||
|
</script>
|
||||||
|
</PUBLIC:COMPONENT>
|
7
assets/js/ie/backgroundsize.min.htc
Normal file
|
@ -0,0 +1,7 @@
|
||||||
|
<component lightWeight="true">
|
||||||
|
<attach event="onpropertychange" onevent="handlePropertychange()" />
|
||||||
|
<attach event="ondetach" onevent="restore()" />
|
||||||
|
<attach event="onresize" for="window" onevent="handleResize()" />
|
||||||
|
<script type="text/javascript">
|
||||||
|
var rsrc=/url\(["']?(.*?)["']?\)/,positions={top:0,left:0,bottom:1,right:1,center:0.5},doc=element.document;init(); function init(){var b=doc.createElement("div"),a=doc.createElement("img"),c,d;b.style.position="absolute";b.style.zIndex=-1;b.style.top=0;b.style.right=0;b.style.left=0;b.style.bottom=0;b.style.overflow="hidden";a.style.position="absolute";a.style.width=a.style.width="auto";b.appendChild(a);element.insertBefore(b,element.firstChild);d=[element.currentStyle.backgroundPositionX,element.currentStyle.backgroundPositionY];element.bgsExpando=c={wrapper:b,img:a,backgroundSize:element.currentStyle["background-size"], backgroundPositionX:positions[d[0]]||parseFloat(d[0])/100,backgroundPositionY:positions[d[1]]||parseFloat(d[1])/100};"auto"==element.currentStyle.zIndex&&(element.style.zIndex=0);"static"==element.currentStyle.position&&(element.style.position="relative");refreshDisplay(element,c)&&(refreshDimensions(element,c),refreshBackgroundImage(element,c,function(){updateBackground(element,c)}))} function refreshDisplay(b,a){var c=b.currentStyle.display;c!=a.display&&(a.display=c,a.somethingChanged=!0);return"none"!=c}function refreshDimensions(b,a){var c=b.offsetWidth-(parseFloat(b.currentStyle.borderLeftWidth)||0)-(parseFloat(b.currentStyle.borderRightWidth)||0),d=b.offsetHeight-(parseFloat(b.currentStyle.borderTopWidth)||0)-(parseFloat(b.currentStyle.borderBottomWidth)||0);if(c!=a.innerWidth||d!=a.innerHeight)a.innerWidth=c,a.innerHeight=d,a.somethingChanged=!0} function refreshBackgroundImage(b,a,c){var d=a.img,e=(rsrc.exec(b.currentStyle.backgroundImage)||[])[1];if(e&&e!=a.backgroundSrc){a.backgroundSrc=e;a.somethingChanged=!0;d.onload=function(){var b=d.width,e=d.height;1==b&&1==e||(a.imgWidth=b,a.imgHeight=e,a.constrain=!1,c(),d.style.visibility="visible",d.onload=null)};d.style.visibility="hidden";d.src=a.backgroundSrc;if(d.readyState||d.complete)d.src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==",d.src=a.backgroundSrc;a.ignoreNextPropertyChange= !0;b.style.backgroundImage="none"}else c()} function updateBackground(b,a){if(a.somethingChanged){var c=a.img,d=a.innerWidth/a.innerHeight,e=a.imgWidth/a.imgHeight,f=a.constrain;"contain"==a.backgroundSize?e>d?(a.constrain=d="width",e=Math.floor((a.innerHeight-a.innerWidth/e)*a.backgroundPositionY),c.style.top=e+"px",d!=f&&(c.style.width="100%",c.style.height="auto",c.style.left=0)):(a.constrain=d="height",e=Math.floor((a.innerWidth-a.innerHeight*e)*a.backgroundPositionX),c.style.left=e+"px",d!=f&&(c.style.width="auto",c.style.height="100%", c.style.top=0)):"cover"==a.backgroundSize&&(e>d?(a.constrain=d="height",e=Math.floor((a.innerHeight*e-a.innerWidth)*a.backgroundPositionX),c.style.left=-e+"px",d!=f&&(c.style.width="auto",c.style.height="100%",c.style.top=0)):(a.constrain=d="width",e=Math.floor((a.innerWidth/e-a.innerHeight)*a.backgroundPositionY),c.style.top=-e+"px",d!=f&&(c.style.width="100%",c.style.height="auto",c.style.left=0)));a.somethingChanged=!1}} function handlePropertychange(){var b=element.bgsExpando;b.ignoreNextPropertyChange?b.ignoreNextPropertyChange=!1:refreshDisplay(element,b)&&(refreshDimensions(element,b),refreshBackgroundImage(element,b,function(){updateBackground(element,b)}))}function handleResize(){var b=element.bgsExpando;"none"!=b.display&&(refreshDimensions(element,b),updateBackground(element,b))} function restore(){var b=element.bgsExpando;try{element.style.backgroundImage="url('"+b.backgroundSrc+"')",element.removeChild(b.wrapper),element.bgsExpando=null}catch(a){}};
|
||||||
|
</script>
|
8
assets/js/ie/html5shiv.js
vendored
Normal file
|
@ -0,0 +1,8 @@
|
||||||
|
/*
|
||||||
|
HTML5 Shiv v3.6.2 | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed
|
||||||
|
*/
|
||||||
|
(function(l,f){function m(){var a=e.elements;return"string"==typeof a?a.split(" "):a}function i(a){var b=n[a[o]];b||(b={},h++,a[o]=h,n[h]=b);return b}function p(a,b,c){b||(b=f);if(g)return b.createElement(a);c||(c=i(b));b=c.cache[a]?c.cache[a].cloneNode():r.test(a)?(c.cache[a]=c.createElem(a)).cloneNode():c.createElem(a);return b.canHaveChildren&&!s.test(a)?c.frag.appendChild(b):b}function t(a,b){if(!b.cache)b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag();
|
||||||
|
a.createElement=function(c){return!e.shivMethods?b.createElem(c):p(c,a,b)};a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+m().join().replace(/\w+/g,function(a){b.createElem(a);b.frag.createElement(a);return'c("'+a+'")'})+");return n}")(e,b.frag)}function q(a){a||(a=f);var b=i(a);if(e.shivCSS&&!j&&!b.hasCSS){var c,d=a;c=d.createElement("p");d=d.getElementsByTagName("head")[0]||d.documentElement;c.innerHTML="x<style>article,aside,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}mark{background:#FF0;color:#000}</style>";
|
||||||
|
c=d.insertBefore(c.lastChild,d.firstChild);b.hasCSS=!!c}g||t(a,b);return a}var k=l.html5||{},s=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,r=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,j,o="_html5shiv",h=0,n={},g;(function(){try{var a=f.createElement("a");a.innerHTML="<xyz></xyz>";j="hidden"in a;var b;if(!(b=1==a.childNodes.length)){f.createElement("a");var c=f.createDocumentFragment();b="undefined"==typeof c.cloneNode||
|
||||||
|
"undefined"==typeof c.createDocumentFragment||"undefined"==typeof c.createElement}g=b}catch(d){g=j=!0}})();var e={elements:k.elements||"abbr article aside audio bdi canvas data datalist details figcaption figure footer header hgroup main mark meter nav output progress section summary time video",version:"3.6.2",shivCSS:!1!==k.shivCSS,supportsUnknownElements:g,shivMethods:!1!==k.shivMethods,type:"default",shivDocument:q,createElement:p,createDocumentFragment:function(a,b){a||(a=f);if(g)return a.createDocumentFragment();
|
||||||
|
for(var b=b||i(a),c=b.frag.cloneNode(),d=0,e=m(),h=e.length;d<h;d++)c.createElement(e[d]);return c}};l.html5=e;q(f)})(this,document);
|
6
assets/js/ie/respond.min.js
vendored
Normal file
|
@ -0,0 +1,6 @@
|
||||||
|
/*! Respond.js v1.4.2: min/max-width media query polyfill
|
||||||
|
* Copyright 2014 Scott Jehl
|
||||||
|
* Licensed under MIT
|
||||||
|
* http://j.mp/respondjs */
|
||||||
|
|
||||||
|
!function(a){"use strict";a.matchMedia=a.matchMedia||function(a){var b,c=a.documentElement,d=c.firstElementChild||c.firstChild,e=a.createElement("body"),f=a.createElement("div");return f.id="mq-test-1",f.style.cssText="position:absolute;top:-100em",e.style.background="none",e.appendChild(f),function(a){return f.innerHTML='­<style media="'+a+'"> #mq-test-1 { width: 42px; }</style>',c.insertBefore(e,d),b=42===f.offsetWidth,c.removeChild(e),{matches:b,media:a}}}(a.document)}(this),function(a){"use strict";function b(){v(!0)}var c={};a.respond=c,c.update=function(){};var d=[],e=function(){var b=!1;try{b=new a.XMLHttpRequest}catch(c){b=new a.ActiveXObject("Microsoft.XMLHTTP")}return function(){return b}}(),f=function(a,b){var c=e();c&&(c.open("GET",a,!0),c.onreadystatechange=function(){4!==c.readyState||200!==c.status&&304!==c.status||b(c.responseText)},4!==c.readyState&&c.send(null))},g=function(a){return a.replace(c.regex.minmaxwh,"").match(c.regex.other)};if(c.ajax=f,c.queue=d,c.unsupportedmq=g,c.regex={media:/@media[^\{]+\{([^\{\}]*\{[^\}\{]*\})+/gi,keyframes:/@(?:\-(?:o|moz|webkit)\-)?keyframes[^\{]+\{(?:[^\{\}]*\{[^\}\{]*\})+[^\}]*\}/gi,comments:/\/\*[^*]*\*+([^/][^*]*\*+)*\//gi,urls:/(url\()['"]?([^\/\)'"][^:\)'"]+)['"]?(\))/g,findStyles:/@media *([^\{]+)\{([\S\s]+?)$/,only:/(only\s+)?([a-zA-Z]+)\s?/,minw:/\(\s*min\-width\s*:\s*(\s*[0-9\.]+)(px|em)\s*\)/,maxw:/\(\s*max\-width\s*:\s*(\s*[0-9\.]+)(px|em)\s*\)/,minmaxwh:/\(\s*m(in|ax)\-(height|width)\s*:\s*(\s*[0-9\.]+)(px|em)\s*\)/gi,other:/\([^\)]*\)/g},c.mediaQueriesSupported=a.matchMedia&&null!==a.matchMedia("only all")&&a.matchMedia("only all").matches,!c.mediaQueriesSupported){var h,i,j,k=a.document,l=k.documentElement,m=[],n=[],o=[],p={},q=30,r=k.getElementsByTagName("head")[0]||l,s=k.getElementsByTagName("base")[0],t=r.getElementsByTagName("link"),u=function(){var a,b=k.createElement("div"),c=k.body,d=l.style.fontSize,e=c&&c.style.fontSize,f=!1;return b.style.cssText="position:absolute;font-size:1em;width:1em",c||(c=f=k.createElement("body"),c.style.background="none"),l.style.fontSize="100%",c.style.fontSize="100%",c.appendChild(b),f&&l.insertBefore(c,l.firstChild),a=b.offsetWidth,f?l.removeChild(c):c.removeChild(b),l.style.fontSize=d,e&&(c.style.fontSize=e),a=j=parseFloat(a)},v=function(b){var c="clientWidth",d=l[c],e="CSS1Compat"===k.compatMode&&d||k.body[c]||d,f={},g=t[t.length-1],p=(new Date).getTime();if(b&&h&&q>p-h)return a.clearTimeout(i),i=a.setTimeout(v,q),void 0;h=p;for(var s in m)if(m.hasOwnProperty(s)){var w=m[s],x=w.minw,y=w.maxw,z=null===x,A=null===y,B="em";x&&(x=parseFloat(x)*(x.indexOf(B)>-1?j||u():1)),y&&(y=parseFloat(y)*(y.indexOf(B)>-1?j||u():1)),w.hasquery&&(z&&A||!(z||e>=x)||!(A||y>=e))||(f[w.media]||(f[w.media]=[]),f[w.media].push(n[w.rules]))}for(var C in o)o.hasOwnProperty(C)&&o[C]&&o[C].parentNode===r&&r.removeChild(o[C]);o.length=0;for(var D in f)if(f.hasOwnProperty(D)){var E=k.createElement("style"),F=f[D].join("\n");E.type="text/css",E.media=D,r.insertBefore(E,g.nextSibling),E.styleSheet?E.styleSheet.cssText=F:E.appendChild(k.createTextNode(F)),o.push(E)}},w=function(a,b,d){var e=a.replace(c.regex.comments,"").replace(c.regex.keyframes,"").match(c.regex.media),f=e&&e.length||0;b=b.substring(0,b.lastIndexOf("/"));var h=function(a){return a.replace(c.regex.urls,"$1"+b+"$2$3")},i=!f&&d;b.length&&(b+="/"),i&&(f=1);for(var j=0;f>j;j++){var k,l,o,p;i?(k=d,n.push(h(a))):(k=e[j].match(c.regex.findStyles)&&RegExp.$1,n.push(RegExp.$2&&h(RegExp.$2))),o=k.split(","),p=o.length;for(var q=0;p>q;q++)l=o[q],g(l)||m.push({media:l.split("(")[0].match(c.regex.only)&&RegExp.$2||"all",rules:n.length-1,hasquery:l.indexOf("(")>-1,minw:l.match(c.regex.minw)&&parseFloat(RegExp.$1)+(RegExp.$2||""),maxw:l.match(c.regex.maxw)&&parseFloat(RegExp.$1)+(RegExp.$2||"")})}v()},x=function(){if(d.length){var b=d.shift();f(b.href,function(c){w(c,b.href,b.media),p[b.href]=!0,a.setTimeout(function(){x()},0)})}},y=function(){for(var b=0;b<t.length;b++){var c=t[b],e=c.href,f=c.media,g=c.rel&&"stylesheet"===c.rel.toLowerCase();e&&g&&!p[e]&&(c.styleSheet&&c.styleSheet.rawCssText?(w(c.styleSheet.rawCssText,e,f),p[e]=!0):(!/^([a-zA-Z:]*\/\/)/.test(e)&&!s||e.replace(RegExp.$1,"").split("/")[0]===a.location.host)&&("//"===e.substring(0,2)&&(e=a.location.protocol+e),d.push({href:e,media:f})))}x()};y(),c.update=y,c.getEmValue=u,a.addEventListener?a.addEventListener("resize",b,!1):a.attachEvent&&a.attachEvent("onresize",b)}}(this);
|
2
assets/js/jquery.scrollex.min.js
vendored
Normal file
|
@ -0,0 +1,2 @@
|
||||||
|
/* jquery.scrollex v0.2.1 | (c) @ajlkn | github.com/ajlkn/jquery.scrollex | MIT licensed */
|
||||||
|
!function(t){function e(t,e,n){return"string"==typeof t&&("%"==t.slice(-1)?t=parseInt(t.substring(0,t.length-1))/100*e:"vh"==t.slice(-2)?t=parseInt(t.substring(0,t.length-2))/100*n:"px"==t.slice(-2)&&(t=parseInt(t.substring(0,t.length-2)))),t}var n=t(window),i=1,o={};n.on("scroll",function(){var e=n.scrollTop();t.map(o,function(t){window.clearTimeout(t.timeoutId),t.timeoutId=window.setTimeout(function(){t.handler(e)},t.options.delay)})}).on("load",function(){n.trigger("scroll")}),jQuery.fn.scrollex=function(l){var s=t(this);if(0==this.length)return s;if(this.length>1){for(var r=0;r<this.length;r++)t(this[r]).scrollex(l);return s}if(s.data("_scrollexId"))return s;var a,u,h,c,p;switch(a=i++,u=jQuery.extend({top:0,bottom:0,delay:0,mode:"default",enter:null,leave:null,initialize:null,terminate:null,scroll:null},l),u.mode){case"top":h=function(t,e,n,i,o){return t>=i&&o>=t};break;case"bottom":h=function(t,e,n,i,o){return n>=i&&o>=n};break;case"middle":h=function(t,e,n,i,o){return e>=i&&o>=e};break;case"top-only":h=function(t,e,n,i,o){return i>=t&&n>=i};break;case"bottom-only":h=function(t,e,n,i,o){return n>=o&&o>=t};break;default:case"default":h=function(t,e,n,i,o){return n>=i&&o>=t}}return c=function(t){var i,o,l,s,r,a,u=this.state,h=!1,c=this.$element.offset();i=n.height(),o=t+i/2,l=t+i,s=this.$element.outerHeight(),r=c.top+e(this.options.top,s,i),a=c.top+s-e(this.options.bottom,s,i),h=this.test(t,o,l,r,a),h!=u&&(this.state=h,h?this.options.enter&&this.options.enter.apply(this.element):this.options.leave&&this.options.leave.apply(this.element)),this.options.scroll&&this.options.scroll.apply(this.element,[(o-r)/(a-r)])},p={id:a,options:u,test:h,handler:c,state:null,element:this,$element:s,timeoutId:null},o[a]=p,s.data("_scrollexId",p.id),p.options.initialize&&p.options.initialize.apply(this),s},jQuery.fn.unscrollex=function(){var e=t(this);if(0==this.length)return e;if(this.length>1){for(var n=0;n<this.length;n++)t(this[n]).unscrollex();return e}var i,l;return(i=e.data("_scrollexId"))?(l=o[i],window.clearTimeout(l.timeoutId),delete o[i],e.removeData("_scrollexId"),l.options.terminate&&l.options.terminate.apply(this),e):e}}(jQuery);
|
|
@ -1,29 +1,27 @@
|
||||||
/*
|
/*
|
||||||
Dimension by HTML5 UP
|
Solid State by HTML5 UP
|
||||||
html5up.net | @ajlkn
|
html5up.net | @ajlkn
|
||||||
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
*/
|
*/
|
||||||
|
|
||||||
(function($) {
|
(function($) {
|
||||||
|
|
||||||
|
"use strict";
|
||||||
|
|
||||||
skel.breakpoints({
|
skel.breakpoints({
|
||||||
xlarge: '(max-width: 1680px)',
|
xlarge: '(max-width: 1680px)',
|
||||||
large: '(max-width: 1280px)',
|
large: '(max-width: 1280px)',
|
||||||
medium: '(max-width: 980px)',
|
medium: '(max-width: 980px)',
|
||||||
small: '(max-width: 736px)',
|
small: '(max-width: 736px)',
|
||||||
xsmall: '(max-width: 480px)',
|
xsmall: '(max-width: 480px)'
|
||||||
xxsmall: '(max-width: 360px)'
|
|
||||||
});
|
});
|
||||||
|
|
||||||
$(function() {
|
$(function() {
|
||||||
|
|
||||||
var $window = $(window),
|
var $window = $(window),
|
||||||
$body = $('body'),
|
$body = $('body'),
|
||||||
$wrapper = $('#wrapper'),
|
|
||||||
$header = $('#header'),
|
$header = $('#header'),
|
||||||
$footer = $('#footer'),
|
$banner = $('#banner');
|
||||||
$main = $('#main'),
|
|
||||||
$main_articles = $main.children('article');
|
|
||||||
|
|
||||||
// Disable animations/transitions until the page has loaded.
|
// Disable animations/transitions until the page has loaded.
|
||||||
$body.addClass('is-loading');
|
$body.addClass('is-loading');
|
||||||
|
@ -37,371 +35,130 @@
|
||||||
// Fix: Placeholder polyfill.
|
// Fix: Placeholder polyfill.
|
||||||
$('form').placeholder();
|
$('form').placeholder();
|
||||||
|
|
||||||
// Fix: Flexbox min-height bug on IE.
|
// Prioritize "important" elements on medium.
|
||||||
if (skel.vars.IEVersion < 12) {
|
skel.on('+medium -medium', function() {
|
||||||
|
$.prioritize(
|
||||||
var flexboxFixTimeoutId;
|
'.important\\28 medium\\29',
|
||||||
|
skel.breakpoint('medium').active
|
||||||
$window.on('resize.flexbox-fix', function() {
|
);
|
||||||
|
|
||||||
clearTimeout(flexboxFixTimeoutId);
|
|
||||||
|
|
||||||
flexboxFixTimeoutId = setTimeout(function() {
|
|
||||||
|
|
||||||
if ($wrapper.prop('scrollHeight') > $window.height())
|
|
||||||
$wrapper.css('height', 'auto');
|
|
||||||
else
|
|
||||||
$wrapper.css('height', '100vh');
|
|
||||||
|
|
||||||
}, 250);
|
|
||||||
|
|
||||||
}).triggerHandler('resize.flexbox-fix');
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
// Nav.
|
|
||||||
var $nav = $header.children('nav'),
|
|
||||||
$nav_li = $nav.find('li');
|
|
||||||
|
|
||||||
// Add "middle" alignment classes if we're dealing with an even number of items.
|
|
||||||
if ($nav_li.length % 2 == 0) {
|
|
||||||
|
|
||||||
$nav.addClass('use-middle');
|
|
||||||
$nav_li.eq( ($nav_li.length / 2) ).addClass('is-middle');
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
// Main.
|
|
||||||
var delay = 325,
|
|
||||||
locked = false;
|
|
||||||
|
|
||||||
// Methods.
|
|
||||||
$main._show = function(id, initial) {
|
|
||||||
|
|
||||||
var $article = $main_articles.filter('#' + id);
|
|
||||||
|
|
||||||
// No such article? Bail.
|
|
||||||
if ($article.length == 0)
|
|
||||||
return;
|
|
||||||
|
|
||||||
// Handle lock.
|
|
||||||
|
|
||||||
// Already locked? Speed through "show" steps w/o delays.
|
|
||||||
if (locked || (typeof initial != 'undefined' && initial === true)) {
|
|
||||||
|
|
||||||
// Mark as switching.
|
|
||||||
$body.addClass('is-switching');
|
|
||||||
|
|
||||||
// Mark as visible.
|
|
||||||
$body.addClass('is-article-visible');
|
|
||||||
|
|
||||||
// Deactivate all articles (just in case one's already active).
|
|
||||||
$main_articles.removeClass('active');
|
|
||||||
|
|
||||||
// Hide header, footer.
|
|
||||||
$header.hide();
|
|
||||||
$footer.hide();
|
|
||||||
|
|
||||||
// Show main, article.
|
|
||||||
$main.show();
|
|
||||||
$article.show();
|
|
||||||
|
|
||||||
// Activate article.
|
|
||||||
$article.addClass('active');
|
|
||||||
|
|
||||||
// Unlock.
|
|
||||||
locked = false;
|
|
||||||
|
|
||||||
// Unmark as switching.
|
|
||||||
setTimeout(function() {
|
|
||||||
$body.removeClass('is-switching');
|
|
||||||
}, (initial ? 1000 : 0));
|
|
||||||
|
|
||||||
return;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
// Lock.
|
|
||||||
locked = true;
|
|
||||||
|
|
||||||
// Article already visible? Just swap articles.
|
|
||||||
if ($body.hasClass('is-article-visible')) {
|
|
||||||
|
|
||||||
// Deactivate current article.
|
|
||||||
var $currentArticle = $main_articles.filter('.active');
|
|
||||||
|
|
||||||
$currentArticle.removeClass('active');
|
|
||||||
|
|
||||||
// Show article.
|
|
||||||
setTimeout(function() {
|
|
||||||
|
|
||||||
// Hide current article.
|
|
||||||
$currentArticle.hide();
|
|
||||||
|
|
||||||
// Show article.
|
|
||||||
$article.show();
|
|
||||||
|
|
||||||
// Activate article.
|
|
||||||
setTimeout(function() {
|
|
||||||
|
|
||||||
$article.addClass('active');
|
|
||||||
|
|
||||||
// Window stuff.
|
|
||||||
$window
|
|
||||||
.scrollTop(0)
|
|
||||||
.triggerHandler('resize.flexbox-fix');
|
|
||||||
|
|
||||||
// Unlock.
|
|
||||||
setTimeout(function() {
|
|
||||||
locked = false;
|
|
||||||
}, delay);
|
|
||||||
|
|
||||||
}, 25);
|
|
||||||
|
|
||||||
}, delay);
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
// Otherwise, handle as normal.
|
|
||||||
else {
|
|
||||||
|
|
||||||
// Mark as visible.
|
|
||||||
$body
|
|
||||||
.addClass('is-article-visible');
|
|
||||||
|
|
||||||
// Show article.
|
|
||||||
setTimeout(function() {
|
|
||||||
|
|
||||||
// Hide header, footer.
|
|
||||||
$header.hide();
|
|
||||||
$footer.hide();
|
|
||||||
|
|
||||||
// Show main, article.
|
|
||||||
$main.show();
|
|
||||||
$article.show();
|
|
||||||
|
|
||||||
// Activate article.
|
|
||||||
setTimeout(function() {
|
|
||||||
|
|
||||||
$article.addClass('active');
|
|
||||||
|
|
||||||
// Window stuff.
|
|
||||||
$window
|
|
||||||
.scrollTop(0)
|
|
||||||
.triggerHandler('resize.flexbox-fix');
|
|
||||||
|
|
||||||
// Unlock.
|
|
||||||
setTimeout(function() {
|
|
||||||
locked = false;
|
|
||||||
}, delay);
|
|
||||||
|
|
||||||
}, 25);
|
|
||||||
|
|
||||||
}, delay);
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
};
|
|
||||||
|
|
||||||
$main._hide = function(addState) {
|
|
||||||
|
|
||||||
var $article = $main_articles.filter('.active');
|
|
||||||
|
|
||||||
// Article not visible? Bail.
|
|
||||||
if (!$body.hasClass('is-article-visible'))
|
|
||||||
return;
|
|
||||||
|
|
||||||
// Add state?
|
|
||||||
if (typeof addState != 'undefined'
|
|
||||||
&& addState === true)
|
|
||||||
history.pushState(null, null, '#');
|
|
||||||
|
|
||||||
// Handle lock.
|
|
||||||
|
|
||||||
// Already locked? Speed through "hide" steps w/o delays.
|
|
||||||
if (locked) {
|
|
||||||
|
|
||||||
// Mark as switching.
|
|
||||||
$body.addClass('is-switching');
|
|
||||||
|
|
||||||
// Deactivate article.
|
|
||||||
$article.removeClass('active');
|
|
||||||
|
|
||||||
// Hide article, main.
|
|
||||||
$article.hide();
|
|
||||||
$main.hide();
|
|
||||||
|
|
||||||
// Show footer, header.
|
|
||||||
$footer.show();
|
|
||||||
$header.show();
|
|
||||||
|
|
||||||
// Unmark as visible.
|
|
||||||
$body.removeClass('is-article-visible');
|
|
||||||
|
|
||||||
// Unlock.
|
|
||||||
locked = false;
|
|
||||||
|
|
||||||
// Unmark as switching.
|
|
||||||
$body.removeClass('is-switching');
|
|
||||||
|
|
||||||
// Window stuff.
|
|
||||||
$window
|
|
||||||
.scrollTop(0)
|
|
||||||
.triggerHandler('resize.flexbox-fix');
|
|
||||||
|
|
||||||
return;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
// Lock.
|
|
||||||
locked = true;
|
|
||||||
|
|
||||||
// Deactivate article.
|
|
||||||
$article.removeClass('active');
|
|
||||||
|
|
||||||
// Hide article.
|
|
||||||
setTimeout(function() {
|
|
||||||
|
|
||||||
// Hide article, main.
|
|
||||||
$article.hide();
|
|
||||||
$main.hide();
|
|
||||||
|
|
||||||
// Show footer, header.
|
|
||||||
$footer.show();
|
|
||||||
$header.show();
|
|
||||||
|
|
||||||
// Unmark as visible.
|
|
||||||
setTimeout(function() {
|
|
||||||
|
|
||||||
$body.removeClass('is-article-visible');
|
|
||||||
|
|
||||||
// Window stuff.
|
|
||||||
$window
|
|
||||||
.scrollTop(0)
|
|
||||||
.triggerHandler('resize.flexbox-fix');
|
|
||||||
|
|
||||||
// Unlock.
|
|
||||||
setTimeout(function() {
|
|
||||||
locked = false;
|
|
||||||
}, delay);
|
|
||||||
|
|
||||||
}, 25);
|
|
||||||
|
|
||||||
}, delay);
|
|
||||||
|
|
||||||
|
|
||||||
};
|
|
||||||
|
|
||||||
// Articles.
|
|
||||||
$main_articles.each(function() {
|
|
||||||
|
|
||||||
var $this = $(this);
|
|
||||||
|
|
||||||
// Close.
|
|
||||||
$('<div class="close">Close</div>')
|
|
||||||
.appendTo($this)
|
|
||||||
.on('click', function() {
|
|
||||||
location.hash = '';
|
|
||||||
});
|
});
|
||||||
|
|
||||||
// Prevent clicks from inside article from bubbling.
|
// Header.
|
||||||
$this.on('click', function(event) {
|
if (skel.vars.IEVersion < 9)
|
||||||
|
$header.removeClass('alt');
|
||||||
|
|
||||||
|
if ($banner.length > 0
|
||||||
|
&& $header.hasClass('alt')) {
|
||||||
|
|
||||||
|
$window.on('resize', function() { $window.trigger('scroll'); });
|
||||||
|
|
||||||
|
$banner.scrollex({
|
||||||
|
bottom: $header.outerHeight(),
|
||||||
|
terminate: function() { $header.removeClass('alt'); },
|
||||||
|
enter: function() { $header.addClass('alt'); },
|
||||||
|
leave: function() { $header.removeClass('alt'); }
|
||||||
|
});
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// Menu.
|
||||||
|
var $menu = $('#menu');
|
||||||
|
|
||||||
|
$menu._locked = false;
|
||||||
|
|
||||||
|
$menu._lock = function() {
|
||||||
|
|
||||||
|
if ($menu._locked)
|
||||||
|
return false;
|
||||||
|
|
||||||
|
$menu._locked = true;
|
||||||
|
|
||||||
|
window.setTimeout(function() {
|
||||||
|
$menu._locked = false;
|
||||||
|
}, 350);
|
||||||
|
|
||||||
|
return true;
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
$menu._show = function() {
|
||||||
|
|
||||||
|
if ($menu._lock())
|
||||||
|
$body.addClass('is-menu-visible');
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
$menu._hide = function() {
|
||||||
|
|
||||||
|
if ($menu._lock())
|
||||||
|
$body.removeClass('is-menu-visible');
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
$menu._toggle = function() {
|
||||||
|
|
||||||
|
if ($menu._lock())
|
||||||
|
$body.toggleClass('is-menu-visible');
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
$menu
|
||||||
|
.appendTo($body)
|
||||||
|
.on('click', function(event) {
|
||||||
|
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
});
|
|
||||||
|
|
||||||
});
|
// Hide.
|
||||||
|
$menu._hide();
|
||||||
|
|
||||||
// Events.
|
})
|
||||||
$body.on('click', function(event) {
|
.find('.inner')
|
||||||
|
.on('click', '.close', function(event) {
|
||||||
|
|
||||||
// Article visible? Hide.
|
event.preventDefault();
|
||||||
if ($body.hasClass('is-article-visible'))
|
event.stopPropagation();
|
||||||
$main._hide(true);
|
event.stopImmediatePropagation();
|
||||||
|
|
||||||
});
|
// Hide.
|
||||||
|
$menu._hide();
|
||||||
|
|
||||||
$window.on('keyup', function(event) {
|
})
|
||||||
|
.on('click', function(event) {
|
||||||
|
event.stopPropagation();
|
||||||
|
})
|
||||||
|
.on('click', 'a', function(event) {
|
||||||
|
|
||||||
switch (event.keyCode) {
|
var href = $(this).attr('href');
|
||||||
|
|
||||||
case 27:
|
|
||||||
|
|
||||||
// Article visible? Hide.
|
|
||||||
if ($body.hasClass('is-article-visible'))
|
|
||||||
$main._hide(true);
|
|
||||||
|
|
||||||
break;
|
|
||||||
|
|
||||||
default:
|
|
||||||
break;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
$window.on('hashchange', function(event) {
|
|
||||||
|
|
||||||
// Empty hash?
|
|
||||||
if (location.hash == ''
|
|
||||||
|| location.hash == '#') {
|
|
||||||
|
|
||||||
// Prevent default.
|
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
|
|
||||||
// Hide.
|
// Hide.
|
||||||
$main._hide();
|
$menu._hide();
|
||||||
|
|
||||||
}
|
// Redirect.
|
||||||
|
window.setTimeout(function() {
|
||||||
// Otherwise, check for a matching article.
|
window.location.href = href;
|
||||||
else if ($main_articles.filter(location.hash).length > 0) {
|
}, 350);
|
||||||
|
|
||||||
// Prevent default.
|
|
||||||
event.preventDefault();
|
|
||||||
event.stopPropagation();
|
|
||||||
|
|
||||||
// Show article.
|
|
||||||
$main._show(location.hash.substr(1));
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
// Scroll restoration.
|
$body
|
||||||
// This prevents the page from scrolling back to the top on a hashchange.
|
.on('click', 'a[href="#menu"]', function(event) {
|
||||||
if ('scrollRestoration' in history)
|
|
||||||
history.scrollRestoration = 'manual';
|
|
||||||
else {
|
|
||||||
|
|
||||||
var oldScrollPos = 0,
|
event.stopPropagation();
|
||||||
scrollPos = 0,
|
event.preventDefault();
|
||||||
$htmlbody = $('html,body');
|
|
||||||
|
|
||||||
$window
|
// Toggle.
|
||||||
.on('scroll', function() {
|
$menu._toggle();
|
||||||
|
|
||||||
oldScrollPos = scrollPos;
|
|
||||||
scrollPos = $htmlbody.scrollTop();
|
|
||||||
|
|
||||||
})
|
})
|
||||||
.on('hashchange', function() {
|
.on('keydown', function(event) {
|
||||||
$window.scrollTop(oldScrollPos);
|
|
||||||
});
|
|
||||||
|
|
||||||
}
|
// Hide on escape.
|
||||||
|
if (event.keyCode == 27)
|
||||||
|
$menu._hide();
|
||||||
|
|
||||||
// Initialize.
|
|
||||||
|
|
||||||
// Hide main, articles.
|
|
||||||
$main.hide();
|
|
||||||
$main_articles.hide();
|
|
||||||
|
|
||||||
// Initial article.
|
|
||||||
if (location.hash != ''
|
|
||||||
&& location.hash != '#')
|
|
||||||
$window.on('load', function() {
|
|
||||||
$main._show(location.hash.substr(1), true);
|
|
||||||
});
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
///
|
///
|
||||||
/// Dimension by HTML5 UP
|
/// Solid State by HTML5 UP
|
||||||
/// html5up.net | @ajlkn
|
/// html5up.net | @ajlkn
|
||||||
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
///
|
///
|
||||||
|
@ -11,6 +11,11 @@
|
||||||
width: device-width;
|
width: device-width;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// MSIE: Prevents scrollbar from overlapping content.
|
||||||
|
body {
|
||||||
|
-ms-overflow-style: scrollbar;
|
||||||
|
}
|
||||||
|
|
||||||
// Ensures page width is always >=320px.
|
// Ensures page width is always >=320px.
|
||||||
@include breakpoint(xsmall) {
|
@include breakpoint(xsmall) {
|
||||||
html, body {
|
html, body {
|
||||||
|
@ -19,16 +24,26 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
background: _palette(bg);
|
background-color: _palette(bg);
|
||||||
|
|
||||||
|
background-image: linear-gradient(to top, transparentize(_palette(bg), 0.2), transparentize(_palette(bg), 0.2)),
|
||||||
|
url('../../images/bg.jpg');
|
||||||
|
|
||||||
|
background-size: auto,
|
||||||
|
cover;
|
||||||
|
|
||||||
|
background-attachment: fixed,
|
||||||
|
fixed;
|
||||||
|
|
||||||
|
background-position: center,
|
||||||
|
center;
|
||||||
|
|
||||||
// Prevents animation/transition "flicker" on page load.
|
// Prevents animation/transition "flicker" on page load.
|
||||||
// Automatically added/removed by js/main.js.
|
// Automatically added/removed by js/main.js.
|
||||||
&.is-loading,
|
&.is-loading {
|
||||||
&.is-switching {
|
|
||||||
*, *:before, *:after {
|
*, *:before, *:after {
|
||||||
@include vendor('animation', 'none !important');
|
@include vendor('animation', 'none !important');
|
||||||
@include vendor('transition', 'none !important');
|
@include vendor('transition', 'none !important');
|
||||||
@include vendor('transition-delay', 'none !important');
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,47 +1,88 @@
|
||||||
///
|
///
|
||||||
/// Dimension by HTML5 UP
|
/// Solid State by HTML5 UP
|
||||||
/// html5up.net | @ajlkn
|
/// html5up.net | @ajlkn
|
||||||
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
///
|
///
|
||||||
|
|
||||||
/* Type */
|
/* Type */
|
||||||
|
|
||||||
html {
|
body, input, select, textarea {
|
||||||
font-size: 16pt;
|
color: _palette(fg);
|
||||||
|
font-family: _font(family);
|
||||||
|
font-size: 16.5pt;
|
||||||
|
font-weight: _font(weight);
|
||||||
|
line-height: 1.65;
|
||||||
|
|
||||||
@include breakpoint(xlarge) {
|
@include breakpoint(xlarge) {
|
||||||
|
font-size: 13pt;
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(large) {
|
||||||
|
font-size: 12pt;
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(medium) {
|
||||||
font-size: 12pt;
|
font-size: 12pt;
|
||||||
}
|
}
|
||||||
|
|
||||||
@include breakpoint(small) {
|
@include breakpoint(small) {
|
||||||
font-size: 11pt;
|
font-size: 12pt;
|
||||||
}
|
}
|
||||||
|
|
||||||
@include breakpoint(xxsmall) {
|
@include breakpoint(xsmall) {
|
||||||
font-size: 10pt;
|
font-size: 12pt;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
body, input, select, textarea {
|
|
||||||
color: _palette(fg);
|
|
||||||
font-family: _font(family);
|
|
||||||
font-weight: _font(weight);
|
|
||||||
font-size: 1rem;
|
|
||||||
line-height: 1.65;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
a {
|
||||||
@include vendor('transition', (
|
@include vendor('transition', 'color #{_duration(transition)} ease-in-out, border-bottom-color #{_duration(transition)} ease-in-out');
|
||||||
'color #{_duration(transition)} ease-in-out',
|
|
||||||
'background-color #{_duration(transition)} ease-in-out',
|
|
||||||
'border-bottom-color #{_duration(transition)} ease-in-out'
|
|
||||||
));
|
|
||||||
border-bottom: dotted 1px _palette(fg-light);
|
border-bottom: dotted 1px _palette(fg-light);
|
||||||
|
color: _palette(fg-bold);
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
color: inherit;
|
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
border-bottom-color: transparent;
|
border-bottom-color: transparent;
|
||||||
|
color: _palette(fg-bold) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.special:not(.button) {
|
||||||
|
@include icon;
|
||||||
|
border-bottom: 0;
|
||||||
|
display: block;
|
||||||
|
font-family: _font(family-heading);
|
||||||
|
font-size: 0.8em;
|
||||||
|
font-weight: _font(weight-heading-bold);
|
||||||
|
letter-spacing: _font(kern-heading);
|
||||||
|
margin: 0 0 _size(element-margin) 0;
|
||||||
|
text-transform: uppercase;
|
||||||
|
|
||||||
|
&:before {
|
||||||
|
@include vendor('transition', 'background-color #{_duration(transition)} ease-in-out');
|
||||||
|
border-radius: 100%;
|
||||||
|
border: solid 2px _palette(border);
|
||||||
|
content: '\f105';
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 1.25em;
|
||||||
|
height: 2em;
|
||||||
|
line-height: 1.65em;
|
||||||
|
margin-right: 0.85em;
|
||||||
|
text-align: center;
|
||||||
|
text-indent: 0.15em;
|
||||||
|
vertical-align: middle;
|
||||||
|
width: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
&:before {
|
||||||
|
background-color: _palette(border-bg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
&:before {
|
||||||
|
background-color: _palette(border2-bg);
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -60,82 +101,71 @@
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 {
|
h1, h2, h3, h4, h5, h6 {
|
||||||
color: _palette(fg-bold);
|
color: _palette(fg-bold);
|
||||||
font-weight: _font(weight-bold);
|
font-family: _font(family-heading);
|
||||||
line-height: 1.5;
|
font-weight: _font(weight-heading-bold);
|
||||||
|
letter-spacing: _font(kern-heading);
|
||||||
margin: 0 0 (_size(element-margin) * 0.5) 0;
|
margin: 0 0 (_size(element-margin) * 0.5) 0;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
letter-spacing: _font(letter-spacing);
|
|
||||||
|
|
||||||
a {
|
a {
|
||||||
color: inherit;
|
color: inherit;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.major {
|
span {
|
||||||
border-bottom: solid _size(border-width) _palette(border);
|
font-weight: _font(weight-heading);
|
||||||
width: -moz-max-content;
|
|
||||||
width: -webkit-max-content;
|
|
||||||
width: -ms-max-content;
|
|
||||||
width: max-content;
|
|
||||||
padding-bottom: 0.5rem;
|
|
||||||
margin: 0 0 (_size(element-margin) * 1) 0;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
h1 {
|
&.major {
|
||||||
font-size: 2.25rem;
|
padding-bottom: 1em;
|
||||||
line-height: 1.3;
|
border-bottom: solid 2px _palette(border);
|
||||||
letter-spacing: _font(letter-spacing-heading);
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
h2 {
|
h2 {
|
||||||
font-size: 1.5rem;
|
font-size: 1.2em;
|
||||||
line-height: 1.4;
|
|
||||||
letter-spacing: _font(letter-spacing-heading);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
h3 {
|
h3 {
|
||||||
font-size: 1rem;
|
font-size: 0.9em;
|
||||||
}
|
}
|
||||||
|
|
||||||
h4 {
|
h4 {
|
||||||
font-size: 0.8rem;
|
font-size: 0.7em;
|
||||||
}
|
}
|
||||||
|
|
||||||
h5 {
|
h5 {
|
||||||
font-size: 0.7rem;
|
font-size: 0.7em;
|
||||||
}
|
}
|
||||||
|
|
||||||
h6 {
|
h6 {
|
||||||
font-size: 0.6rem;
|
font-size: 0.7em;
|
||||||
}
|
}
|
||||||
|
|
||||||
@include breakpoint(small) {
|
@include breakpoint(small) {
|
||||||
h1 {
|
h2 {
|
||||||
font-size: 1.75rem;
|
font-size: 1em;
|
||||||
line-height: 1.4;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
h2 {
|
h3 {
|
||||||
font-size: 1.25em;
|
font-size: 0.8em
|
||||||
line-height: 1.5;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
sub {
|
sub {
|
||||||
font-size: 0.8rem;
|
font-size: 0.8em;
|
||||||
position: relative;
|
position: relative;
|
||||||
top: 0.5rem;
|
top: 0.5em;
|
||||||
}
|
}
|
||||||
|
|
||||||
sup {
|
sup {
|
||||||
font-size: 0.8rem;
|
font-size: 0.8em;
|
||||||
position: relative;
|
position: relative;
|
||||||
top: -0.5rem;
|
top: -0.5em;
|
||||||
}
|
}
|
||||||
|
|
||||||
blockquote {
|
blockquote {
|
||||||
border-left: solid (_size(border-width) * 4) _palette(border);
|
border-left: solid 4px _palette(border);
|
||||||
font-style: italic;
|
font-style: italic;
|
||||||
margin: 0 0 _size(element-margin) 0;
|
margin: 0 0 _size(element-margin) 0;
|
||||||
padding: (_size(element-margin) / 4) 0 (_size(element-margin) / 4) _size(element-margin);
|
padding: (_size(element-margin) / 4) 0 (_size(element-margin) / 4) _size(element-margin);
|
||||||
|
@ -144,30 +174,35 @@
|
||||||
code {
|
code {
|
||||||
background: _palette(border-bg);
|
background: _palette(border-bg);
|
||||||
border-radius: _size(border-radius);
|
border-radius: _size(border-radius);
|
||||||
|
border: solid 2px _palette(border);
|
||||||
font-family: _font(family-fixed);
|
font-family: _font(family-fixed);
|
||||||
font-size: 0.9rem;
|
font-size: 0.9em;
|
||||||
margin: 0 0.25rem;
|
margin: 0 0.25em;
|
||||||
padding: 0.25rem 0.65rem;
|
padding: 0.25em 0.65em;
|
||||||
}
|
}
|
||||||
|
|
||||||
pre {
|
pre {
|
||||||
-webkit-overflow-scrolling: touch;
|
-webkit-overflow-scrolling: touch;
|
||||||
font-family: _font(family-fixed);
|
font-family: _font(family-fixed);
|
||||||
font-size: 0.9rem;
|
font-size: 0.9em;
|
||||||
margin: 0 0 _size(element-margin) 0;
|
margin: 0 0 _size(element-margin) 0;
|
||||||
|
|
||||||
code {
|
code {
|
||||||
display: block;
|
display: block;
|
||||||
line-height: 1.75;
|
line-height: 1.75em;
|
||||||
padding: 1rem 1.5rem;
|
padding: 1em 1.5em;
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
hr {
|
hr {
|
||||||
border: 0;
|
border: 0;
|
||||||
border-bottom: solid _size(border-width) _palette(border);
|
border-bottom: solid 2px _palette(border);
|
||||||
margin: (_size(element-margin) * 1.375) 0;
|
margin: (_size(element-margin) * 1.25) 0;
|
||||||
|
|
||||||
|
&.major {
|
||||||
|
margin: (_size(element-margin) * 2) 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.align-left {
|
.align-left {
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
///
|
///
|
||||||
/// Dimension by HTML5 UP
|
/// Solid State by HTML5 UP
|
||||||
/// html5up.net | @ajlkn
|
/// html5up.net | @ajlkn
|
||||||
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
///
|
///
|
||||||
|
@ -8,7 +8,7 @@
|
||||||
|
|
||||||
.box {
|
.box {
|
||||||
border-radius: _size(border-radius);
|
border-radius: _size(border-radius);
|
||||||
border: solid _size(border-width) _palette(border);
|
border: solid 2px _palette(border);
|
||||||
margin-bottom: _size(element-margin);
|
margin-bottom: _size(element-margin);
|
||||||
padding: 1.5em;
|
padding: 1.5em;
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
///
|
///
|
||||||
/// Dimension by HTML5 UP
|
/// Solid State by HTML5 UP
|
||||||
/// html5up.net | @ajlkn
|
/// html5up.net | @ajlkn
|
||||||
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
///
|
///
|
||||||
|
@ -12,21 +12,21 @@
|
||||||
button,
|
button,
|
||||||
.button {
|
.button {
|
||||||
@include vendor('appearance', 'none');
|
@include vendor('appearance', 'none');
|
||||||
@include vendor('transition', 'background-color #{_duration(transition)} ease-in-out, color #{_duration(transition)} ease-in-out');
|
@include vendor('transition', 'background-color #{_duration(transition)} ease-in-out');
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
border-radius: _size(border-radius);
|
border-radius: _size(border-radius);
|
||||||
border: 0;
|
border: 0;
|
||||||
box-shadow: inset 0 0 0 _size(border-width) _palette(border);
|
box-shadow: inset 0 0 0 2px _palette(border);
|
||||||
color: _palette(fg-bold) !important;
|
color: _palette(fg-bold) !important;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
font-size: 0.8rem;
|
font-family: _font(family-heading);
|
||||||
font-weight: _font(weight);
|
font-size: 0.8em;
|
||||||
height: _size(element-height);
|
font-weight: _font(weight-heading-bold);
|
||||||
letter-spacing: _font(letter-spacing);
|
height: 3.75em;
|
||||||
line-height: _size(element-height);
|
letter-spacing: _font(kern-heading);
|
||||||
outline: 0;
|
line-height: 3.75em;
|
||||||
padding: 0 1.25rem 0 (1.25rem + (_font(letter-spacing) * 0.5));
|
padding: 0 2.25em;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
|
@ -37,12 +37,32 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
&:active {
|
&:active {
|
||||||
background-color: _palette(border-bg-alt);
|
background-color: _palette(border2-bg);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.icon {
|
&.icon {
|
||||||
&:before {
|
&:before {
|
||||||
margin-right: 0.5em;
|
margin-right: 0.5em;
|
||||||
|
color: _palette(fg-light);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.special {
|
||||||
|
background-color: _palette(accent);
|
||||||
|
box-shadow: none;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: desaturate(lighten(_palette(accent), 3), 1.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
background-color: saturate(darken(_palette(accent), 3), 1.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.icon {
|
||||||
|
&:before {
|
||||||
|
color: mix(_palette(fg-bold), _palette(accent), 25%);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -52,29 +72,20 @@
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.special {
|
&.small {
|
||||||
background-color: _palette(fg-bold);
|
font-size: 0.6em;
|
||||||
color: _palette(bg) !important;
|
|
||||||
font-weight: _font(weight-bold);
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&:active {
|
&.big {
|
||||||
}
|
font-size: 1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.disabled,
|
&.disabled,
|
||||||
&:disabled {
|
&:disabled {
|
||||||
@include vendor('pointer-events', 'none');
|
|
||||||
cursor: default;
|
|
||||||
opacity: 0.25;
|
opacity: 0.25;
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
input[type="submit"],
|
@include breakpoint(xsmall) {
|
||||||
input[type="reset"],
|
padding: 0;
|
||||||
input[type="button"],
|
}
|
||||||
button {
|
|
||||||
line-height: calc(#{_size(element-height)} - 2px);
|
|
||||||
}
|
}
|
71
assets/sass/components/_features.scss
Normal file
|
@ -0,0 +1,71 @@
|
||||||
|
///
|
||||||
|
/// Solid State by HTML5 UP
|
||||||
|
/// html5up.net | @ajlkn
|
||||||
|
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
|
///
|
||||||
|
|
||||||
|
/* Features */
|
||||||
|
|
||||||
|
.features {
|
||||||
|
@include vendor('display', 'flex');
|
||||||
|
@include vendor('flex-wrap', 'wrap');
|
||||||
|
margin: 0 0 _size(element-margin) 0;
|
||||||
|
|
||||||
|
article {
|
||||||
|
@include padding(1.75em, 1.75em);
|
||||||
|
background-color: desaturate(lighten(_palette(bg), 3), 1.5);
|
||||||
|
border-radius: _size(border-radius);
|
||||||
|
margin: (_size(section-spacing, large) * 0.5) _size(section-spacing, large) (_size(section-spacing, large) * 0.5) 0;
|
||||||
|
width: calc(50% - #{_size(section-spacing, large) * 0.5});
|
||||||
|
|
||||||
|
&:nth-child(2n) {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.image {
|
||||||
|
border-radius: _size(border-radius) _size(border-radius) 0 0;
|
||||||
|
display: block;
|
||||||
|
margin-bottom: 1.75em;
|
||||||
|
margin-left: -1.75em;
|
||||||
|
margin-top: -1.75em;
|
||||||
|
position: relative;
|
||||||
|
width: calc(100% + #{3.5em});
|
||||||
|
|
||||||
|
img {
|
||||||
|
border-radius: _size(border-radius) _size(border-radius) 0 0;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(medium) {
|
||||||
|
article {
|
||||||
|
margin: (_size(section-spacing, medium) * 0.5) _size(section-spacing, medium) (_size(section-spacing, medium) * 0.5) 0;
|
||||||
|
width: calc(50% - #{_size(section-spacing, medium) * 0.5});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(small) {
|
||||||
|
article {
|
||||||
|
@include padding(1.5em, 1.5em);
|
||||||
|
margin: (_size(section-spacing, small) * 0.5) _size(section-spacing, small) (_size(section-spacing, small) * 0.5) 0;
|
||||||
|
width: calc(50% - #{_size(section-spacing, small) * 0.5} - 1px);
|
||||||
|
|
||||||
|
.image {
|
||||||
|
margin-bottom: 1.5em;
|
||||||
|
margin-left: -1.5em;
|
||||||
|
margin-top: -1.5em;
|
||||||
|
width: calc(100% + #{3em});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(xsmall) {
|
||||||
|
display: block;
|
||||||
|
|
||||||
|
article {
|
||||||
|
width: 100%;
|
||||||
|
margin: 0 0 _size(element-margin) 0 !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,5 +1,5 @@
|
||||||
///
|
///
|
||||||
/// Dimension by HTML5 UP
|
/// Solid State by HTML5 UP
|
||||||
/// html5up.net | @ajlkn
|
/// html5up.net | @ajlkn
|
||||||
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
///
|
///
|
||||||
|
@ -7,69 +7,35 @@
|
||||||
/* Form */
|
/* Form */
|
||||||
|
|
||||||
form {
|
form {
|
||||||
$gutter: _size(element-margin) * 0.75;
|
margin: 0 0 _size(element-margin) 0;
|
||||||
|
|
||||||
margin: 0 0 (_size(element-margin) * 1.25) 0;
|
|
||||||
|
|
||||||
.field {
|
.field {
|
||||||
margin: 0 0 ($gutter * 1) 0;
|
margin: 0 0 _size(element-margin) 0;
|
||||||
|
|
||||||
&.half {
|
label {
|
||||||
width: 50%;
|
margin-top: _size(element-margin) * -0.75;
|
||||||
float: left;
|
}
|
||||||
padding: 0 0 0 ($gutter * 1 * 0.5);
|
|
||||||
|
|
||||||
&.first {
|
&:first-child {
|
||||||
padding: 0 ($gutter * 1 * 0.5) 0 0;
|
label {
|
||||||
|
margin-top: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
> .actions {
|
> :last-child {
|
||||||
margin: ($gutter * 1.25) 0 0 0 !important;
|
margin-bottom: 0;
|
||||||
}
|
|
||||||
|
|
||||||
@include breakpoint(small) {
|
|
||||||
.field {
|
|
||||||
margin: 0 0 ($gutter * 0.75) 0;
|
|
||||||
|
|
||||||
&.half {
|
|
||||||
padding: 0 0 0 ($gutter * 0.75 * 0.5);
|
|
||||||
|
|
||||||
&.first {
|
|
||||||
padding: 0 ($gutter * 0.75 * 0.5) 0 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
> .actions {
|
|
||||||
margin: ($gutter * 1) 0 0 0 !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@include breakpoint(xsmall) {
|
|
||||||
.field {
|
|
||||||
&.half {
|
|
||||||
width: 100%;
|
|
||||||
float: none;
|
|
||||||
padding: 0;
|
|
||||||
|
|
||||||
&.first {
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
label {
|
label {
|
||||||
color: _palette(fg-bold);
|
color: _palette(fg-bold);
|
||||||
display: block;
|
display: block;
|
||||||
font-size: 0.8rem;
|
font-family: _font(family-heading);
|
||||||
font-weight: _font(weight);
|
font-size: 0.8em;
|
||||||
letter-spacing: _font(letter-spacing);
|
font-weight: _font(weight-heading-bold);
|
||||||
line-height: 1.5;
|
letter-spacing: _font(kern-heading);
|
||||||
margin: 0 0 (_size(element-margin) * 0.5) 0;
|
margin: 0 0 (_size(element-margin) * 0.35) 0;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -80,18 +46,14 @@
|
||||||
select,
|
select,
|
||||||
textarea {
|
textarea {
|
||||||
@include vendor('appearance', 'none');
|
@include vendor('appearance', 'none');
|
||||||
@include vendor('transition', (
|
background: _palette(border-bg);
|
||||||
'border-color #{_duration(transition)} ease-in-out',
|
|
||||||
'box-shadow #{_duration(transition)} ease-in-out',
|
|
||||||
'background-color #{_duration(transition)} ease-in-out'
|
|
||||||
));
|
|
||||||
background: transparent;
|
|
||||||
border-radius: _size(border-radius);
|
border-radius: _size(border-radius);
|
||||||
border: solid _size(border-width) _palette(border);
|
border: none;
|
||||||
|
border: solid 2px _palette(border);
|
||||||
color: inherit;
|
color: inherit;
|
||||||
display: block;
|
display: block;
|
||||||
outline: 0;
|
outline: 0;
|
||||||
padding: 0 1rem;
|
padding: 0 1em;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
|
@ -100,16 +62,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
&:focus {
|
&:focus {
|
||||||
background: _palette(border-bg);
|
border-color: desaturate(lighten(_palette(accent), 6), 3);
|
||||||
border-color: _palette(fg-bold);
|
|
||||||
box-shadow: 0 0 0 _size(border-width) _palette(fg-bold);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
select {
|
|
||||||
option {
|
|
||||||
background: _palette(bg);
|
|
||||||
color: _palette(fg);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -120,11 +73,10 @@
|
||||||
|
|
||||||
&:before {
|
&:before {
|
||||||
color: _palette(border);
|
color: _palette(border);
|
||||||
content: '\f107';
|
content: '\f078';
|
||||||
display: block;
|
display: block;
|
||||||
height: _size(element-height);
|
height: _size(element-height);
|
||||||
//line-height: _size(element-height);
|
line-height: _size(element-height);
|
||||||
line-height: calc(#{_size(element-height)} + 0em);
|
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 0;
|
right: 0;
|
||||||
|
@ -138,6 +90,13 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
select {
|
||||||
|
option {
|
||||||
|
color: _palette(fg-bold);
|
||||||
|
background: _palette(bg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
input[type="text"],
|
input[type="text"],
|
||||||
input[type="password"],
|
input[type="password"],
|
||||||
input[type="email"],
|
input[type="email"],
|
||||||
|
@ -146,7 +105,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
textarea {
|
textarea {
|
||||||
padding: 0.75rem 1rem;
|
padding: 0.75em 1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type="checkbox"],
|
input[type="checkbox"],
|
||||||
|
@ -154,59 +113,53 @@
|
||||||
@include vendor('appearance', 'none');
|
@include vendor('appearance', 'none');
|
||||||
display: block;
|
display: block;
|
||||||
float: left;
|
float: left;
|
||||||
margin-right: -2rem;
|
margin-right: -2em;
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
width: 1rem;
|
width: 1em;
|
||||||
z-index: -1;
|
z-index: -1;
|
||||||
|
|
||||||
& + label {
|
& + label {
|
||||||
@include icon;
|
@include icon;
|
||||||
@include vendor('user-select', 'none');
|
|
||||||
color: _palette(fg);
|
color: _palette(fg);
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
font-size: 0.8rem;
|
font-size: 1em;
|
||||||
|
font-family: _font(family);
|
||||||
|
text-transform: none;
|
||||||
|
letter-spacing: 0;
|
||||||
font-weight: _font(weight);
|
font-weight: _font(weight);
|
||||||
margin: 0 0 (_size(element-margin) * 0.25) 0;
|
padding-left: (_size(element-height) * 0.6) + 0.75em;
|
||||||
padding-left: (_size(element-height) * 0.6) + 1rem;
|
padding-right: 0.75em;
|
||||||
padding-right: 0.75rem;
|
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
&:before {
|
&:before {
|
||||||
@include vendor('transition', (
|
background: _palette(border-bg);
|
||||||
'border-color #{_duration(transition)} ease-in-out',
|
|
||||||
'box-shadow #{_duration(transition)} ease-in-out',
|
|
||||||
'background-color #{_duration(transition)} ease-in-out'
|
|
||||||
));
|
|
||||||
border-radius: _size(border-radius);
|
border-radius: _size(border-radius);
|
||||||
border: solid _size(border-width) _palette(border);
|
border: solid 2px _palette(border);
|
||||||
content: '';
|
content: '';
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
height: (_size(element-height) * 0.6);
|
height: (_size(element-height) * 0.6);
|
||||||
left: 0;
|
left: 0;
|
||||||
//line-height: (_size(element-height) * 0.575);
|
line-height: (_size(element-height) * 0.575);
|
||||||
line-height: calc(#{_size(element-height) * 0.575} + 0em);
|
|
||||||
position: absolute;
|
position: absolute;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
top: -0.125rem;
|
top: 0;
|
||||||
width: (_size(element-height) * 0.6);
|
width: (_size(element-height) * 0.6);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&:checked + label {
|
&:checked + label {
|
||||||
&:before {
|
&:before {
|
||||||
background: _palette(fg-bold) !important;
|
background: _palette(fg-bold);
|
||||||
border-color: _palette(fg-bold) !important;
|
border-color: _palette(fg-bold);
|
||||||
color: _palette(bg);
|
|
||||||
content: '\f00c';
|
content: '\f00c';
|
||||||
|
color: _palette(bg);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&:focus + label {
|
&:focus + label {
|
||||||
&:before {
|
&:before {
|
||||||
background: _palette(border-bg);
|
border-color: _palette(accent);
|
||||||
border-color: _palette(fg-bold);
|
|
||||||
box-shadow: 0 0 0 _size(border-width) _palette(fg-bold);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -247,7 +200,7 @@
|
||||||
opacity: 1.0;
|
opacity: 1.0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.formerize-placeholder {
|
.polyfill-placeholder {
|
||||||
color: _palette(fg-light) !important;
|
color: _palette(fg-light) !important;
|
||||||
opacity: 1.0;
|
opacity: 1.0;
|
||||||
}
|
}
|
|
@ -1,5 +1,5 @@
|
||||||
///
|
///
|
||||||
/// Dimension by HTML5 UP
|
/// Solid State by HTML5 UP
|
||||||
/// html5up.net | @ajlkn
|
/// html5up.net | @ajlkn
|
||||||
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
///
|
///
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
///
|
///
|
||||||
/// Dimension by HTML5 UP
|
/// Solid State by HTML5 UP
|
||||||
/// html5up.net | @ajlkn
|
/// html5up.net | @ajlkn
|
||||||
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
///
|
///
|
||||||
|
@ -12,21 +12,6 @@
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
&:before {
|
|
||||||
@include vendor('pointer-events', 'none');
|
|
||||||
background-image: url('../../images/overlay.png');
|
|
||||||
background-color: _palette(bg-overlay);
|
|
||||||
border-radius: _size(border-radius);
|
|
||||||
content: '';
|
|
||||||
display: block;
|
|
||||||
height: 100%;
|
|
||||||
left: 0;
|
|
||||||
opacity: 0.5;
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
img {
|
img {
|
||||||
border-radius: _size(border-radius);
|
border-radius: _size(border-radius);
|
||||||
display: block;
|
display: block;
|
||||||
|
@ -65,23 +50,11 @@
|
||||||
|
|
||||||
&.main {
|
&.main {
|
||||||
display: block;
|
display: block;
|
||||||
margin: (_size(element-margin) * 1.25) 0;
|
margin: 0 0 (_size(element-margin) * 1.5) 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
img {
|
img {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@include breakpoint(small) {
|
|
||||||
&.main {
|
|
||||||
margin: (_size(element-margin) * 1) 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@include breakpoint(xsmall) {
|
|
||||||
&.main {
|
|
||||||
margin: (_size(element-margin) * 0.75) 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
|
@ -1,5 +1,5 @@
|
||||||
///
|
///
|
||||||
/// Dimension by HTML5 UP
|
/// Solid State by HTML5 UP
|
||||||
/// html5up.net | @ajlkn
|
/// html5up.net | @ajlkn
|
||||||
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
///
|
///
|
||||||
|
@ -30,7 +30,7 @@
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
|
|
||||||
li {
|
li {
|
||||||
border-top: solid _size(border-width) _palette(border);
|
border-top: solid 1px _palette(border);
|
||||||
padding: 0.5em 0;
|
padding: 0.5em 0;
|
||||||
|
|
||||||
&:first-child {
|
&:first-child {
|
||||||
|
@ -47,27 +47,15 @@
|
||||||
|
|
||||||
li {
|
li {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
padding: 0 0.75em 0 0;
|
padding: 0 1em 0 0;
|
||||||
|
|
||||||
&:last-child {
|
&:last-child {
|
||||||
padding-right: 0;
|
padding-right: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
.icon {
|
||||||
border-radius: 100%;
|
&:before {
|
||||||
box-shadow: inset 0 0 0 _size(border-width) _palette(border);
|
font-size: 1.25em;
|
||||||
display: inline-block;
|
|
||||||
height: 2.25rem;
|
|
||||||
line-height: 2.25rem;
|
|
||||||
text-align: center;
|
|
||||||
width: 2.25rem;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: _palette(border-bg);
|
|
||||||
}
|
|
||||||
|
|
||||||
&:active {
|
|
||||||
background-color: _palette(border-bg-alt);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -161,12 +149,6 @@
|
||||||
> * {
|
> * {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin: 0 !important;
|
margin: 0 !important;
|
||||||
|
|
||||||
&.icon {
|
|
||||||
&:before {
|
|
||||||
margin-left: -2em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -181,6 +163,110 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&.contact {
|
||||||
|
list-style: none;
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
li {
|
||||||
|
@include icon;
|
||||||
|
margin: (_size(element-margin) * 1.25) 0 0 0;
|
||||||
|
padding: 0 0 0 3.25em;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
&:before {
|
||||||
|
border-radius: 100%;
|
||||||
|
border: solid 2px _palette(border);
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 0.8em;
|
||||||
|
height: 2.5em;
|
||||||
|
left: 0;
|
||||||
|
line-height: 2.35em;
|
||||||
|
position: absolute;
|
||||||
|
text-align: center;
|
||||||
|
top: 0;
|
||||||
|
width: 2.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:first-child {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(small) {
|
||||||
|
li {
|
||||||
|
margin: (_size(element-margin) * 0.75) 0 0 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.pagination {
|
||||||
|
cursor: default;
|
||||||
|
list-style: none;
|
||||||
|
padding-left: 0;
|
||||||
|
|
||||||
|
li {
|
||||||
|
display: inline-block;
|
||||||
|
padding-left: 0;
|
||||||
|
vertical-align: middle;
|
||||||
|
|
||||||
|
> .page {
|
||||||
|
@include vendor('transition', (
|
||||||
|
'background-color #{_duration(transition)} ease-in-out',
|
||||||
|
'color #{_duration(transition)} ease-in-out'
|
||||||
|
));
|
||||||
|
border-bottom: 0;
|
||||||
|
border-radius: _size(border-radius);
|
||||||
|
display: inline-block;
|
||||||
|
height: 1.5em;
|
||||||
|
line-height: 1.5em;
|
||||||
|
margin: 0 0.125em;
|
||||||
|
min-width: 1.5em;
|
||||||
|
padding: 0 0.5em;
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: _palette(border-bg);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
background-color: _palette(accent);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:first-child {
|
||||||
|
padding-right: 0.75em;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
padding-left: 0.75em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(xsmall) {
|
||||||
|
li {
|
||||||
|
&:nth-child(n+2):nth-last-child(n+2) {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:first-child {
|
||||||
|
width: calc(50% - 2px);
|
||||||
|
text-align: left;
|
||||||
|
padding-right: 0.325em;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
width: calc(50% - 2px);
|
||||||
|
text-align: right;
|
||||||
|
padding-left: 0.325em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
dl {
|
dl {
|
||||||
|
|
13
assets/sass/components/_section.scss
Normal file
|
@ -0,0 +1,13 @@
|
||||||
|
///
|
||||||
|
/// Solid State by HTML5 UP
|
||||||
|
/// html5up.net | @ajlkn
|
||||||
|
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
|
///
|
||||||
|
|
||||||
|
/* Section/Article */
|
||||||
|
|
||||||
|
section, article {
|
||||||
|
&.special {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,5 +1,5 @@
|
||||||
///
|
///
|
||||||
/// Dimension by HTML5 UP
|
/// Solid State by HTML5 UP
|
||||||
/// html5up.net | @ajlkn
|
/// html5up.net | @ajlkn
|
||||||
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
///
|
///
|
||||||
|
@ -17,7 +17,7 @@
|
||||||
|
|
||||||
tbody {
|
tbody {
|
||||||
tr {
|
tr {
|
||||||
border: solid _size(border-width) _palette(border);
|
border: solid 1px _palette(border);
|
||||||
border-left: 0;
|
border-left: 0;
|
||||||
border-right: 0;
|
border-right: 0;
|
||||||
|
|
||||||
|
@ -40,11 +40,11 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
thead {
|
thead {
|
||||||
border-bottom: solid (_size(border-width) * 2) _palette(border);
|
border-bottom: solid 2px _palette(border);
|
||||||
}
|
}
|
||||||
|
|
||||||
tfoot {
|
tfoot {
|
||||||
border-top: solid (_size(border-width) * 2) _palette(border);
|
border-top: solid 2px _palette(border);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.alt {
|
&.alt {
|
||||||
|
@ -53,18 +53,18 @@
|
||||||
tbody {
|
tbody {
|
||||||
tr {
|
tr {
|
||||||
td {
|
td {
|
||||||
border: solid _size(border-width) _palette(border);
|
border: solid 1px _palette(border);
|
||||||
border-left-width: 0;
|
border-left-width: 0;
|
||||||
border-top-width: 0;
|
border-top-width: 0;
|
||||||
|
|
||||||
&:first-child {
|
&:first-child {
|
||||||
border-left-width: _size(border-width);
|
border-left-width: 1px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&:first-child {
|
&:first-child {
|
||||||
td {
|
td {
|
||||||
border-top-width: _size(border-width);
|
border-top-width: 1px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
190
assets/sass/ie8.scss
Normal file
|
@ -0,0 +1,190 @@
|
||||||
|
@import 'libs/vars';
|
||||||
|
@import 'libs/functions';
|
||||||
|
@import 'libs/mixins';
|
||||||
|
@import 'libs/skel';
|
||||||
|
|
||||||
|
/*
|
||||||
|
Solid State by HTML5 UP
|
||||||
|
html5up.net | @ajlkn
|
||||||
|
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
|
*/
|
||||||
|
|
||||||
|
/* Basic */
|
||||||
|
|
||||||
|
body {
|
||||||
|
-ms-behavior: url('assets/js/backgroundsize.min.htc');
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Type */
|
||||||
|
|
||||||
|
h1, h2, h3, h4, h5, h6 {
|
||||||
|
&.major {
|
||||||
|
border-bottom: solid 2px _palette(fg-bold);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
blockquote {
|
||||||
|
border-left: solid 4px _palette(fg-bold);
|
||||||
|
}
|
||||||
|
|
||||||
|
code {
|
||||||
|
border: solid 2px _palette(fg-bold);
|
||||||
|
}
|
||||||
|
|
||||||
|
hr {
|
||||||
|
border-bottom: solid 2px _palette(fg-bold);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Button */
|
||||||
|
|
||||||
|
input[type="submit"],
|
||||||
|
input[type="reset"],
|
||||||
|
input[type="button"],
|
||||||
|
button,
|
||||||
|
.button {
|
||||||
|
position: relative;
|
||||||
|
-ms-behavior: url('assets/js/ie/PIE.htc');
|
||||||
|
border: solid 2px _palette(fg-bold);
|
||||||
|
|
||||||
|
&.special {
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Form */
|
||||||
|
|
||||||
|
input[type="text"],
|
||||||
|
input[type="password"],
|
||||||
|
input[type="email"],
|
||||||
|
input[type="tel"],
|
||||||
|
select,
|
||||||
|
textarea {
|
||||||
|
position: relative;
|
||||||
|
-ms-behavior: url('assets/js/ie/PIE.htc');
|
||||||
|
background: transparent;
|
||||||
|
border: solid 2px _palette(fg-bold);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Table */
|
||||||
|
|
||||||
|
table {
|
||||||
|
tbody {
|
||||||
|
tr {
|
||||||
|
border: solid 1px _palette(fg-bold);
|
||||||
|
border-left: 0;
|
||||||
|
border-right: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.alt {
|
||||||
|
tbody {
|
||||||
|
tr {
|
||||||
|
td {
|
||||||
|
border: solid 1px _palette(fg-bold);
|
||||||
|
border-left-width: 0;
|
||||||
|
border-top-width: 0;
|
||||||
|
|
||||||
|
&:first-child {
|
||||||
|
border-left-width: 1px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:first-child {
|
||||||
|
td {
|
||||||
|
border-top-width: 1px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
thead {
|
||||||
|
border-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
tfoot {
|
||||||
|
border-top: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Features */
|
||||||
|
|
||||||
|
.features {
|
||||||
|
article {
|
||||||
|
-ms-behavior: url('assets/js/ie/PIE.htc');
|
||||||
|
position: relative;
|
||||||
|
width: 44%;
|
||||||
|
|
||||||
|
.image {
|
||||||
|
margin-top: 0;
|
||||||
|
margin-left: 0;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Menu */
|
||||||
|
|
||||||
|
#menu {
|
||||||
|
background: _palette(bg);
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
border-bottom: solid 2px _palette(fg-bold);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Header */
|
||||||
|
|
||||||
|
#header {
|
||||||
|
background-color: desaturate(lighten(_palette(bg), 3), 1.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Wrapper */
|
||||||
|
|
||||||
|
.wrapper {
|
||||||
|
&:before, &:after {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
margin: 0;
|
||||||
|
|
||||||
|
&.spotlight {
|
||||||
|
.image {
|
||||||
|
-ms-behavior: url('assets/js/ie/PIE.htc');
|
||||||
|
|
||||||
|
img {
|
||||||
|
position: relative;
|
||||||
|
-ms-behavior: url('assets/js/ie/PIE.htc');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Banner */
|
||||||
|
|
||||||
|
#banner {
|
||||||
|
.logo {
|
||||||
|
.icon {
|
||||||
|
border: solid 2px _palette(fg-bold);
|
||||||
|
-ms-behavior: url('assets/js/ie/PIE.htc');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
border-bottom: solid 2px _palette(fg-bold);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Footer */
|
||||||
|
|
||||||
|
#footer {
|
||||||
|
.inner {
|
||||||
|
.copyright {
|
||||||
|
border-top: solid 2px _palette(fg-bold);
|
||||||
|
|
||||||
|
li {
|
||||||
|
border-left: solid 2px _palette(fg-bold);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -4,45 +4,103 @@
|
||||||
@import 'libs/skel';
|
@import 'libs/skel';
|
||||||
|
|
||||||
/*
|
/*
|
||||||
Dimension by HTML5 UP
|
Solid State by HTML5 UP
|
||||||
html5up.net | @ajlkn
|
html5up.net | @ajlkn
|
||||||
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/* BG */
|
/* Basic */
|
||||||
|
|
||||||
|
body {
|
||||||
|
background-color: _palette(bg);
|
||||||
|
background-image: url('../../images/bg.jpg');
|
||||||
|
background-size: cover;
|
||||||
|
background-attachment: fixed;
|
||||||
|
background-position: center;
|
||||||
|
|
||||||
#bg {
|
|
||||||
&:before {
|
&:before {
|
||||||
background: _palette(bg-overlay);
|
background: transparentize(_palette(bg), 0.2);
|
||||||
|
content: '';
|
||||||
|
display: block;
|
||||||
|
height: 100%;
|
||||||
|
left: 0;
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
> * {
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Header */
|
/* Features */
|
||||||
|
|
||||||
#header {
|
.features {
|
||||||
.logo {
|
article {
|
||||||
margin: 0 auto;
|
display: inline-block;
|
||||||
|
width: 45%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Menu */
|
||||||
|
|
||||||
|
#menu {
|
||||||
|
.inner {
|
||||||
|
margin: 4em auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Wrapper */
|
||||||
|
|
||||||
|
#wrapper {
|
||||||
|
> header {
|
||||||
|
background: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.wrapper {
|
||||||
|
&.spotlight {
|
||||||
|
.inner {
|
||||||
|
text-align: left !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.image {
|
||||||
|
display: inline-block;
|
||||||
|
margin: 0 _size(section-spacing, large) _size(element-margin) 0 !important;
|
||||||
|
vertical-align: middle;
|
||||||
|
width: 24%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
width: 70%;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
nav {
|
/* Banner */
|
||||||
ul {
|
|
||||||
|
#banner {
|
||||||
|
background: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Footer */
|
||||||
|
|
||||||
|
#footer {
|
||||||
|
background: none !important;
|
||||||
|
|
||||||
|
.inner {
|
||||||
|
form {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
width: 45%;
|
||||||
|
}
|
||||||
|
|
||||||
li {
|
.contact {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
width: 45%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
/* Main */
|
|
||||||
|
|
||||||
#main {
|
|
||||||
article {
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
}
|
|
140
assets/sass/layout/_banner.scss
Normal file
|
@ -0,0 +1,140 @@
|
||||||
|
///
|
||||||
|
/// Solid State by HTML5 UP
|
||||||
|
/// html5up.net | @ajlkn
|
||||||
|
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
|
///
|
||||||
|
|
||||||
|
/* Banner */
|
||||||
|
|
||||||
|
#banner {
|
||||||
|
@include padding(10em, 0, (0, 0, _size(wrapper-edges, large) * -0.5, 0));
|
||||||
|
|
||||||
|
.inner {
|
||||||
|
margin: 0 auto;
|
||||||
|
width: _size(inner);
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
@include vendor('transition', (
|
||||||
|
'opacity 2s ease',
|
||||||
|
'transform 1s ease',
|
||||||
|
));
|
||||||
|
@include vendor('transform', 'translateY(0)');
|
||||||
|
opacity: 1;
|
||||||
|
margin: 0 0 (_size(element-margin) * 0.65) 0;
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
border-radius: 100%;
|
||||||
|
border: solid 2px _palette(border);
|
||||||
|
cursor: default;
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 2em;
|
||||||
|
height: 2.25em;
|
||||||
|
line-height: 2.25em;
|
||||||
|
text-align: center;
|
||||||
|
width: 2.25em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
@include vendor('transition', (
|
||||||
|
'opacity 0.5s ease',
|
||||||
|
'transform 0.5s ease',
|
||||||
|
'filter 0.25s ease',
|
||||||
|
));
|
||||||
|
@include vendor('transform', 'translateX(0)');
|
||||||
|
@include vendor('transition-delay', '0.65s');
|
||||||
|
@include vendor('filter', 'blur(0)');
|
||||||
|
opacity: 1;
|
||||||
|
border-bottom: solid 2px _palette(border);
|
||||||
|
font-size: 2.25em;
|
||||||
|
margin-bottom: _size(element-margin) * 0.4;
|
||||||
|
padding-bottom: _size(element-margin) * 0.2;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
@include vendor('transition', (
|
||||||
|
'opacity 0.5s ease',
|
||||||
|
'transform 0.5s ease',
|
||||||
|
'filter 0.25s ease',
|
||||||
|
));
|
||||||
|
@include vendor('transform', 'translateX(0)');
|
||||||
|
@include vendor('transition-delay', '0.8s');
|
||||||
|
@include vendor('filter', 'blur(0)');
|
||||||
|
opacity: 1;
|
||||||
|
font-family: _font(family-heading);
|
||||||
|
font-size: 1em;
|
||||||
|
font-weight: _font(weight-heading);
|
||||||
|
letter-spacing: _font(kern-heading);
|
||||||
|
line-height: 2;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(large) {
|
||||||
|
@include padding(7em, 0, (0, 0, _size(wrapper-edges, large) * 0.5, 0));
|
||||||
|
|
||||||
|
background-color: _palette(bg);
|
||||||
|
|
||||||
|
background-image: linear-gradient(to top, transparentize(_palette(bg), 0.2), transparentize(_palette(bg), 0.2)),
|
||||||
|
url('../../images/bg.jpg');
|
||||||
|
|
||||||
|
background-size: auto,
|
||||||
|
cover;
|
||||||
|
|
||||||
|
background-position: center,
|
||||||
|
center;
|
||||||
|
|
||||||
|
margin-bottom: (_size(wrapper-edges, large) * -1);
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(medium) {
|
||||||
|
@include padding(12em, 3em, (0, 0, _size(wrapper-edges, medium) * 0.5, 0));
|
||||||
|
|
||||||
|
margin-bottom: (_size(wrapper-edges, medium) * -1);
|
||||||
|
|
||||||
|
.inner {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(small) {
|
||||||
|
@include padding(5em, 2em, (0, 0, _size(wrapper-edges, small) * 0.5, 0));
|
||||||
|
|
||||||
|
margin-bottom: (_size(wrapper-edges, small) * -1);
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
margin: 0 0 (_size(element-margin) * 0.5) 0;
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
font-size: 1.5em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-size: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-size: 0.8em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
body.is-loading & {
|
||||||
|
.logo {
|
||||||
|
@include vendor('transform', 'translateY(0.5em)');
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
opacity: 0;
|
||||||
|
@include vendor('transform', 'translateX(0.25em)');
|
||||||
|
@include vendor('filter', 'blur(2px)');
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
opacity: 0;
|
||||||
|
@include vendor('transform', 'translateX(0.5em)');
|
||||||
|
@include vendor('filter', 'blur(2px)');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,68 +0,0 @@
|
||||||
///
|
|
||||||
/// Dimension by HTML5 UP
|
|
||||||
/// html5up.net | @ajlkn
|
|
||||||
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
|
||||||
///
|
|
||||||
|
|
||||||
/* BG */
|
|
||||||
|
|
||||||
#bg {
|
|
||||||
@include vendor('transform', 'scale(1.0)');
|
|
||||||
-webkit-backface-visibility: hidden;
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100vh;
|
|
||||||
z-index: 1;
|
|
||||||
|
|
||||||
&:before, &:after {
|
|
||||||
content: '';
|
|
||||||
display: block;
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
@include vendor('transition', 'background-color #{_duration(bg)} ease-in-out');
|
|
||||||
@include vendor('transition-delay', '#{_duration(intro)}');
|
|
||||||
background-image: linear-gradient(to top, #{_palette(bg-overlay)}, #{_palette(bg-overlay)}),
|
|
||||||
url('../../images/overlay.png');
|
|
||||||
background-size: auto,
|
|
||||||
256px 256px;
|
|
||||||
background-position: center,
|
|
||||||
center;
|
|
||||||
background-repeat: no-repeat,
|
|
||||||
repeat;
|
|
||||||
z-index: 2;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:after {
|
|
||||||
@include vendor('transform', 'scale(1.125)');
|
|
||||||
@include vendor('transition', (
|
|
||||||
'transform #{_duration(article)} ease-in-out',
|
|
||||||
'filter #{_duration(article)} ease-in-out'
|
|
||||||
));
|
|
||||||
background-image: url('../../images/bg.jpg');
|
|
||||||
background-position: center;
|
|
||||||
background-size: cover;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
body.is-article-visible & {
|
|
||||||
&:after {
|
|
||||||
@include vendor('transform', 'scale(1.0825)');
|
|
||||||
@include vendor('filter', 'blur(0.2rem)');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
body.is-loading & {
|
|
||||||
&:before {
|
|
||||||
background-color: _palette(bg-alt);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,5 +1,5 @@
|
||||||
///
|
///
|
||||||
/// Dimension by HTML5 UP
|
/// Solid State by HTML5 UP
|
||||||
/// html5up.net | @ajlkn
|
/// html5up.net | @ajlkn
|
||||||
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
///
|
///
|
||||||
|
@ -7,31 +7,137 @@
|
||||||
/* Footer */
|
/* Footer */
|
||||||
|
|
||||||
#footer {
|
#footer {
|
||||||
@include vendor('transition', (
|
.inner {
|
||||||
'transform #{_duration(article)} ease-in-out',
|
@include padding(5em, 0);
|
||||||
'filter #{_duration(article)} ease-in-out',
|
@include vendor('display', 'flex');
|
||||||
'opacity #{_duration(article)} ease-in-out',
|
@include vendor('flex-direction', 'row');
|
||||||
));
|
@include vendor('flex-wrap', 'wrap');
|
||||||
|
margin: 0 auto;
|
||||||
|
width: _size(inner);
|
||||||
|
|
||||||
|
> * {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
max-width: 100%;
|
}
|
||||||
margin-top: 2rem;
|
|
||||||
text-align: center;
|
form {
|
||||||
|
margin: 0 _size(section-spacing, large) 0 0;
|
||||||
|
width: calc(50% - #{_size(section-spacing, large) * 0.5});
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact {
|
||||||
|
width: calc(50% - #{_size(section-spacing, large) * 0.5});
|
||||||
|
}
|
||||||
|
|
||||||
.copyright {
|
.copyright {
|
||||||
letter-spacing: _font(letter-spacing);
|
border-top: solid 2px _palette(border);
|
||||||
font-size: 0.6rem;
|
list-style: none;
|
||||||
opacity: 0.75;
|
margin: (_size(element-margin) * 2) 0 _size(element-margin) 0;
|
||||||
margin-bottom: 0;
|
padding: _size(element-margin) 0 0 0;
|
||||||
text-transform: uppercase;
|
width: 100%;
|
||||||
|
|
||||||
|
li {
|
||||||
|
border-left: solid 2px _palette(border);
|
||||||
|
color: _palette(fg-light);
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 0.9em;
|
||||||
|
line-height: 1;
|
||||||
|
margin-left: 1em;
|
||||||
|
padding: 0;
|
||||||
|
padding-left: 1em;
|
||||||
|
|
||||||
|
&:first-child {
|
||||||
|
border-left: 0;
|
||||||
|
margin-left: 0;
|
||||||
|
padding-left: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
body.is-article-visible & {
|
a {
|
||||||
@include vendor('transform', 'scale(0.95)');
|
color: inherit;
|
||||||
@include vendor('filter', 'blur(0.1rem)');
|
}
|
||||||
opacity: 0;
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
body.is-loading & {
|
@include breakpoint(large) {
|
||||||
opacity: 0;
|
|
||||||
|
background-color: _palette(bg);
|
||||||
|
|
||||||
|
background-image: linear-gradient(to top, transparentize(_palette(bg), 0.2), transparentize(_palette(bg), 0.2)),
|
||||||
|
url('../../images/bg.jpg');
|
||||||
|
|
||||||
|
background-size: auto,
|
||||||
|
cover;
|
||||||
|
|
||||||
|
background-position: center,
|
||||||
|
center;
|
||||||
|
|
||||||
|
margin-top: (_size(wrapper-edges, large) * -1);
|
||||||
|
padding-top: _size(wrapper-edges, large);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(medium) {
|
||||||
|
margin-top: (_size(wrapper-edges, medium) * -1);
|
||||||
|
padding-top: _size(wrapper-edges, medium);
|
||||||
|
|
||||||
|
.inner {
|
||||||
|
@include padding(3em, 3em);
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
form {
|
||||||
|
width: 100%;
|
||||||
|
margin: 0 0 (_size(element-margin) * 2) 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact {
|
||||||
|
width: 100%;
|
||||||
|
margin: 0 0 (_size(element-margin) * 2) 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.copyright {
|
||||||
|
margin: (_size(element-margin) * 2) 0 _size(element-margin) 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(small) {
|
||||||
|
margin-top: (_size(wrapper-edges, small) * -1);
|
||||||
|
padding-top: _size(wrapper-edges, small);
|
||||||
|
|
||||||
|
.inner {
|
||||||
|
@include padding(2em, 2em);
|
||||||
|
|
||||||
|
form {
|
||||||
|
margin: 0 0 (_size(element-margin) * 1.5) 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact {
|
||||||
|
margin: 0 0 (_size(element-margin) * 1.5) 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(xsmall) {
|
||||||
|
.inner {
|
||||||
|
.copyright {
|
||||||
|
li {
|
||||||
|
border-left: 0;
|
||||||
|
display: block;
|
||||||
|
margin: 1em 0 0 0;
|
||||||
|
padding-left: 0;
|
||||||
|
|
||||||
|
&:first-child {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(xxsmall) {
|
||||||
|
.inner {
|
||||||
|
@include padding(2em, 1.5em);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -1,5 +1,5 @@
|
||||||
///
|
///
|
||||||
/// Dimension by HTML5 UP
|
/// Solid State by HTML5 UP
|
||||||
/// html5up.net | @ajlkn
|
/// html5up.net | @ajlkn
|
||||||
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
///
|
///
|
||||||
|
@ -7,253 +7,132 @@
|
||||||
/* Header */
|
/* Header */
|
||||||
|
|
||||||
#header {
|
#header {
|
||||||
@include vendor('display', 'flex');
|
@include vendor('transition', 'background-color #{_duration(transition)} ease-in-out');
|
||||||
@include vendor('flex-direction', 'column');
|
background-color: transparentize(desaturate(lighten(_palette(bg), 3), 1.5), 0.05);
|
||||||
@include vendor('align-items', 'center');
|
height: 3.5em;
|
||||||
|
left: 0;
|
||||||
|
line-height: 3.5em;
|
||||||
|
padding: 0 1.25em;
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
z-index: _misc(z-index-base);
|
||||||
|
|
||||||
|
h1 {
|
||||||
@include vendor('transition', (
|
@include vendor('transition', (
|
||||||
'transform #{_duration(article)} ease-in-out',
|
'opacity #{_duration(transition)} ease-in-out',
|
||||||
'filter #{_duration(article)} ease-in-out',
|
'visibility #{_duration(transition)}'
|
||||||
'opacity #{_duration(article)} ease-in-out',
|
|
||||||
));
|
));
|
||||||
background-image: -moz-radial-gradient(rgba(0,0,0,0.25) 25%, rgba(0,0,0,0) 55%);
|
border-bottom: 0;
|
||||||
background-image: -webkit-radial-gradient(rgba(0,0,0,0.25) 25%, rgba(0,0,0,0) 55%);
|
font-size: 0.8em;
|
||||||
background-image: -ms-radial-gradient(rgba(0,0,0,0.25) 25%, rgba(0,0,0,0) 55%);
|
|
||||||
background-image: radial-gradient(rgba(0,0,0,0.25) 25%, rgba(0,0,0,0) 55%);
|
|
||||||
max-width: 100%;
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
@include vendor('transition', 'opacity #{_duration(article)} ease-in-out');
|
|
||||||
position: relative;
|
|
||||||
margin-top: 3.5rem;
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
content: '';
|
|
||||||
display: block;
|
|
||||||
position: absolute;
|
|
||||||
top: calc(-3.5rem - 1px);
|
|
||||||
left: calc(50% - #{_size(border-width) * 1});
|
|
||||||
width: _size(border-width);
|
|
||||||
height: calc(3.5rem + 1px);
|
|
||||||
background: _palette(border);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
> :first-child {
|
|
||||||
margin-top: 0;
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.logo {
|
|
||||||
width: 5.5rem;
|
|
||||||
height: 5.5rem;
|
|
||||||
line-height: 5.5rem;
|
|
||||||
border: solid _size(border-width) _palette(border);
|
|
||||||
border-radius: 100%;
|
|
||||||
|
|
||||||
.icon {
|
|
||||||
&:before {
|
|
||||||
font-size: 2rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.content {
|
|
||||||
border-style: solid;
|
|
||||||
border-color: _palette(border);
|
|
||||||
border-top-width: _size(border-width);
|
|
||||||
border-bottom-width: _size(border-width);
|
|
||||||
max-width: 100%;
|
|
||||||
|
|
||||||
.inner {
|
|
||||||
@include vendor('transition', (
|
|
||||||
'max-height #{_duration(intro)} ease',
|
|
||||||
'padding #{_duration(intro)} ease',
|
|
||||||
'opacity #{_duration(article)} ease-in-out'
|
|
||||||
));
|
|
||||||
@include vendor('transition-delay', '0.25s');
|
|
||||||
padding: 3rem 2rem;
|
|
||||||
max-height: 40rem;
|
|
||||||
overflow: hidden;
|
|
||||||
|
|
||||||
> :last-child {
|
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
opacity: 1;
|
||||||
}
|
visibility: visible;
|
||||||
|
|
||||||
p {
|
a {
|
||||||
text-transform: uppercase;
|
border: 0;
|
||||||
letter-spacing: _font(letter-spacing);
|
|
||||||
font-size: 0.8rem;
|
|
||||||
line-height: 2;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
nav {
|
nav {
|
||||||
ul {
|
font-family: _font(family-heading);
|
||||||
@include vendor('display', 'flex');
|
font-size: 0.8em;
|
||||||
margin-bottom: 0;
|
font-weight: _font(weight-heading-bold);
|
||||||
list-style: none;
|
height: 3em;
|
||||||
padding-left: 0;
|
letter-spacing: _font(kern-heading);
|
||||||
border: solid _size(border-width) _palette(border);
|
line-height: 3em;
|
||||||
border-radius: _size(border-radius);
|
position: absolute;
|
||||||
|
right: 0.7em;
|
||||||
li {
|
text-transform: uppercase;
|
||||||
padding-left: 0;
|
top: 0.7em;
|
||||||
border-left: solid _size(border-width) _palette(border);
|
|
||||||
|
|
||||||
&:first-child {
|
|
||||||
border-left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
a {
|
||||||
display: block;
|
border: 0;
|
||||||
min-width: 7.5rem;
|
display: inline-block;
|
||||||
height: 2.75rem;
|
padding: 0 1em;
|
||||||
line-height: 2.75rem;
|
|
||||||
padding: 0 1.25rem 0 (1.25rem + _font(letter-spacing));
|
&:before {
|
||||||
text-transform: uppercase;
|
float: right;
|
||||||
letter-spacing: _font(letter-spacing);
|
margin-left: 0.75em;
|
||||||
font-size: 0.8rem;
|
}
|
||||||
border-bottom: 0;
|
|
||||||
|
&[href="#menu"] {
|
||||||
|
@include icon;
|
||||||
|
@include vendor('transition', 'background-color #{_duration(transition)} ease-in-out');
|
||||||
|
border-radius: _size(border-radius);
|
||||||
|
box-shadow: inset 0 0 0 2px _palette(border);
|
||||||
|
padding: 0 1.35em;
|
||||||
|
|
||||||
|
&:before {
|
||||||
|
content: '\f0c9';
|
||||||
|
}
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: _palette(border-bg);
|
background-color: _palette(border-bg);
|
||||||
}
|
}
|
||||||
|
|
||||||
&:active {
|
&:active {
|
||||||
background-color: _palette(border-bg-alt);
|
background-color: _palette(border2-bg);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.use-middle {
|
&.alt {
|
||||||
&:after {
|
background-color: transparent;
|
||||||
content: '';
|
|
||||||
display: block;
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: calc(50% - #{_size(border-width) * 1});
|
|
||||||
width: _size(border-width);
|
|
||||||
height: 100%;
|
|
||||||
background: _palette(border);
|
|
||||||
}
|
|
||||||
|
|
||||||
ul {
|
h1 {
|
||||||
li {
|
|
||||||
&.is-middle {
|
|
||||||
border-left: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
body.is-article-visible & {
|
|
||||||
@include vendor('transform', 'scale(0.95)');
|
|
||||||
@include vendor('filter', 'blur(0.1rem)');
|
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
visibility: hidden;
|
||||||
|
|
||||||
body.is-loading & {
|
|
||||||
> * {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
@include vendor('filter', 'blur(0.125rem)');
|
|
||||||
|
|
||||||
.content {
|
|
||||||
.inner {
|
|
||||||
max-height: 0;
|
|
||||||
padding-top: 0;
|
|
||||||
padding-bottom: 0;
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@include breakpoint(medium) {
|
|
||||||
.content {
|
|
||||||
p {
|
|
||||||
br {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@include breakpoint(small) {
|
@include breakpoint(small) {
|
||||||
> * {
|
height: 2.75em;
|
||||||
margin-top: 2rem;
|
line-height: 2.75em;
|
||||||
|
|
||||||
&:before {
|
nav {
|
||||||
top: calc(-2rem - 1px);
|
top: 0;
|
||||||
height: calc(2rem + 1px);
|
right: 0;
|
||||||
}
|
height: inherit;
|
||||||
}
|
line-height: inherit;
|
||||||
|
|
||||||
.logo {
|
a {
|
||||||
width: 4.75rem;
|
height: inherit;
|
||||||
height: 4.75rem;
|
line-height: inherit;
|
||||||
line-height: 4.75rem;
|
|
||||||
|
|
||||||
.icon {
|
&[href="#menu"] {
|
||||||
&:before {
|
box-shadow: none;
|
||||||
font-size: 1.75rem;
|
padding: 0 1em;
|
||||||
}
|
border-radius: 0;
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.content {
|
&:hover, &:active {
|
||||||
.inner {
|
background-color: inherit;
|
||||||
padding: 2.5rem 1rem;
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
p {
|
|
||||||
line-height: 1.875;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@include breakpoint(xsmall) {
|
@include breakpoint(xsmall) {
|
||||||
padding: 1.5rem 0;
|
|
||||||
|
|
||||||
.content {
|
|
||||||
.inner {
|
|
||||||
padding: 2.5rem 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
nav {
|
nav {
|
||||||
ul {
|
|
||||||
@include vendor('flex-direction', 'column');
|
|
||||||
min-width: 10rem;
|
|
||||||
max-width: 100%;
|
|
||||||
|
|
||||||
li {
|
|
||||||
border-left: 0;
|
|
||||||
border-top: solid _size(border-width) _palette(border);
|
|
||||||
|
|
||||||
&:first-child {
|
|
||||||
border-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
a {
|
||||||
height: 3rem;
|
&[href="#menu"] {
|
||||||
line-height: 3rem;
|
width: 4em;
|
||||||
min-width: 0;
|
white-space: nowrap;
|
||||||
width: 100%;
|
text-indent: 4em;
|
||||||
}
|
position: relative;
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.use-middle {
|
&:before {
|
||||||
&:after {
|
width: inherit;
|
||||||
display: none;
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
text-indent: 0;
|
||||||
|
text-align: right;
|
||||||
|
margin-left: 0;
|
||||||
|
padding-right: 1.25em;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,102 +0,0 @@
|
||||||
///
|
|
||||||
/// Dimension by HTML5 UP
|
|
||||||
/// html5up.net | @ajlkn
|
|
||||||
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
|
||||||
///
|
|
||||||
|
|
||||||
/* Main */
|
|
||||||
|
|
||||||
#main {
|
|
||||||
@include vendor('flex-grow', '1');
|
|
||||||
@include vendor('flex-shrink', '1');
|
|
||||||
@include vendor('display', 'flex');
|
|
||||||
@include vendor('align-items', 'center');
|
|
||||||
@include vendor('justify-content', 'center');
|
|
||||||
@include vendor('flex-direction', 'column');
|
|
||||||
position: relative;
|
|
||||||
max-width: 100%;
|
|
||||||
z-index: 3;
|
|
||||||
|
|
||||||
article {
|
|
||||||
@include vendor('transform', 'translateY(0.25rem)');
|
|
||||||
@include vendor('transition', (
|
|
||||||
'opacity #{_duration(article)} ease-in-out',
|
|
||||||
'transform #{_duration(article)} ease-in-out'
|
|
||||||
));
|
|
||||||
@include padding(2.5rem, 2.5rem, (2rem, 0, 1rem, 0));
|
|
||||||
position: relative;
|
|
||||||
width: 40rem;
|
|
||||||
max-width: 100%;
|
|
||||||
background-color: transparentize(_palette(bg), 0.15);
|
|
||||||
border-radius: _size(border-radius);
|
|
||||||
opacity: 0;
|
|
||||||
|
|
||||||
&.active {
|
|
||||||
@include vendor('transform', 'translateY(0)');
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.close {
|
|
||||||
display: block;
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
right: 0;
|
|
||||||
width: 4rem;
|
|
||||||
height: 4rem;
|
|
||||||
cursor: pointer;
|
|
||||||
text-indent: 4rem;
|
|
||||||
overflow: hidden;
|
|
||||||
white-space: nowrap;
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
@include vendor('transition', 'background-color #{_duration(transition)} ease-in-out');
|
|
||||||
content: '';
|
|
||||||
display: block;
|
|
||||||
position: absolute;
|
|
||||||
top: 0.75rem;
|
|
||||||
left: 0.75rem;
|
|
||||||
width: 2.5rem;
|
|
||||||
height: 2.5rem;
|
|
||||||
border-radius: 100%;
|
|
||||||
background-position: center;
|
|
||||||
background-image: svg-url('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20px" height="20px" viewBox="0 0 20 20" zoomAndPan="disable"><style>line { stroke: #{_palette(border)}; stroke-width: 1; }</style><line x1="2" y1="2" x2="18" y2="18" /><line x1="18" y1="2" x2="2" y2="18" /></svg>');
|
|
||||||
background-size: 20px 20px;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
&:before {
|
|
||||||
background-color: _palette(border-bg);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:active {
|
|
||||||
&:before {
|
|
||||||
background-color: _palette(border-bg-alt);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@include breakpoint(small) {
|
|
||||||
article {
|
|
||||||
@include padding(2rem, 2rem, (1.5rem, 0, 0.5rem, 0));
|
|
||||||
|
|
||||||
.close {
|
|
||||||
&:before {
|
|
||||||
top: 0.875rem;
|
|
||||||
left: 0.875rem;
|
|
||||||
width: 2.25rem;
|
|
||||||
height: 2.25rem;
|
|
||||||
background-size: 14px 14px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@include breakpoint(xsmall) {
|
|
||||||
article {
|
|
||||||
@include padding(2rem, 1.5rem, (1rem, 0, 0.5rem, 0));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
127
assets/sass/layout/_menu.scss
Normal file
|
@ -0,0 +1,127 @@
|
||||||
|
///
|
||||||
|
/// Solid State by HTML5 UP
|
||||||
|
/// html5up.net | @ajlkn
|
||||||
|
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
|
///
|
||||||
|
|
||||||
|
/* Menu */
|
||||||
|
|
||||||
|
#page-wrapper {
|
||||||
|
@include vendor('transition', 'filter 0.25s ease');
|
||||||
|
}
|
||||||
|
|
||||||
|
#menu {
|
||||||
|
@include vendor('align-items', 'center');
|
||||||
|
@include vendor('display', 'flex');
|
||||||
|
@include vendor('justify-content', 'center');
|
||||||
|
@include vendor('pointer-events', 'none');
|
||||||
|
@include vendor('transition', ('opacity #{_duration(menu)} ease', 'visibility #{_duration(menu)}'));
|
||||||
|
-moz-user-select: none;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
-ms-user-select: none;
|
||||||
|
user-select: none;
|
||||||
|
-webkit-tap-highlight-color: rgba(0,0,0,0);
|
||||||
|
background: transparentize(_palette(bg), 0.2);
|
||||||
|
cursor: default;
|
||||||
|
height: 100%;
|
||||||
|
left: 0;
|
||||||
|
opacity: 0;
|
||||||
|
position: fixed;
|
||||||
|
text-align: center;
|
||||||
|
top: 0;
|
||||||
|
visibility: hidden;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
.inner {
|
||||||
|
@include padding(2.5em, 1.5em);
|
||||||
|
@include vendor('transform', 'translateY(0.5em)');
|
||||||
|
@include vendor('transition', ('opacity #{_duration(menu)} ease','transform #{_duration(menu)} ease'));
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
background: _palette(accent);
|
||||||
|
border-radius: _size(border-radius);
|
||||||
|
display: block;
|
||||||
|
max-width: 100%;
|
||||||
|
opacity: 0;
|
||||||
|
position: relative;
|
||||||
|
width: 18em;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
border-bottom: solid 2px _palette(border);
|
||||||
|
padding-bottom: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.close {
|
||||||
|
background-image: url('images/close.svg');
|
||||||
|
background-position: 75% 25%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: 2em 2em;
|
||||||
|
border: 0;
|
||||||
|
content: '';
|
||||||
|
display: block;
|
||||||
|
height: 4em;
|
||||||
|
overflow: hidden;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
text-align: center;
|
||||||
|
text-indent: 4em;
|
||||||
|
top: 0;
|
||||||
|
width: 4em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.links {
|
||||||
|
list-style: none;
|
||||||
|
margin-bottom: (_size(element-margin) - 0.5em);
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
li {
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
a {
|
||||||
|
border-radius: _size(border-radius);
|
||||||
|
border: 0;
|
||||||
|
display: block;
|
||||||
|
font-family: _font(family-heading);
|
||||||
|
font-size: 0.8em;
|
||||||
|
font-weight: _font(weight-heading);
|
||||||
|
letter-spacing: _font(kern-heading);
|
||||||
|
line-height: 1.85em;
|
||||||
|
padding: 0.75em 0;
|
||||||
|
text-transform: uppercase;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: saturate(darken(_palette(accent), 3), 1.5);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(small) {
|
||||||
|
.inner {
|
||||||
|
max-height: 100%;
|
||||||
|
overflow-y: auto;
|
||||||
|
overflow-x: hidden;
|
||||||
|
|
||||||
|
.close {
|
||||||
|
background-size: 1.5em 1.5em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
body.is-menu-visible {
|
||||||
|
#page-wrapper {
|
||||||
|
@include vendor('filter', 'blur(1.5px)');
|
||||||
|
}
|
||||||
|
|
||||||
|
#menu {
|
||||||
|
@include vendor('pointer-events', 'auto');
|
||||||
|
opacity: 1;
|
||||||
|
visibility: visible;
|
||||||
|
|
||||||
|
.inner {
|
||||||
|
@include vendor('transform', 'translateY(0)');
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,36 +1,303 @@
|
||||||
///
|
///
|
||||||
/// Dimension by HTML5 UP
|
/// Solid State by HTML5 UP
|
||||||
/// html5up.net | @ajlkn
|
/// html5up.net | @ajlkn
|
||||||
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
///
|
///
|
||||||
|
|
||||||
/* Wrapper */
|
/* Wrapper */
|
||||||
|
|
||||||
#wrapper {
|
/// Sets the colors of the wrapper's top/bottom edges.
|
||||||
@include vendor('display', 'flex');
|
/// @param {string} $color Color.
|
||||||
@include vendor('flex-direction', 'column');
|
@mixin wrapper-edges-color($color: black) {
|
||||||
@include vendor('align-items', 'center');
|
&:before, &:after {
|
||||||
@include vendor('justify-content', 'space-between');
|
background-image: svg-url('<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100" preserveAspectRatio="none"><polygon points="0,100 100,0 100,100" style="fill:#{$color};" /></svg>');
|
||||||
position: relative;
|
|
||||||
min-height: 100vh;
|
|
||||||
width: 100%;
|
|
||||||
padding: 4rem 2rem;
|
|
||||||
z-index: 3;
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
content: '';
|
|
||||||
display: block;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@include breakpoint(xlarge) {
|
&:before {
|
||||||
padding: 3rem 2rem;
|
box-shadow: inset 0 -1px 0 0 $color, 0 1px 0 0 $color;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:after {
|
||||||
|
box-shadow: inset 0 -1px 0 0 $color, 0 1px 0 0 $color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#wrapper {
|
||||||
|
> header {
|
||||||
|
@include padding(7.5em, 0, (3.5em, 0, _size(wrapper-edges, large) * -0.5, 0));
|
||||||
|
|
||||||
|
.inner {
|
||||||
|
margin: 0 auto;
|
||||||
|
width: _size(inner);
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
border-bottom: solid 2px _palette(border);
|
||||||
|
font-size: 2em;
|
||||||
|
margin-bottom: _size(element-margin) * 0.4;
|
||||||
|
padding-bottom: _size(element-margin) * 0.2;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-family: _font(family-heading);
|
||||||
|
font-size: 1em;
|
||||||
|
font-weight: _font(weight-heading);
|
||||||
|
letter-spacing: _font(kern-heading);
|
||||||
|
line-height: 2;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(large) {
|
||||||
|
> header {
|
||||||
|
@include padding(5em, 0, (4em, 0, _size(wrapper-edges, large) * 0.5, 0));
|
||||||
|
|
||||||
|
background-color: _palette(bg);
|
||||||
|
|
||||||
|
background-image: linear-gradient(to top, transparentize(_palette(bg), 0.2), transparentize(_palette(bg), 0.2)),
|
||||||
|
url('../../images/bg.jpg');
|
||||||
|
|
||||||
|
background-size: auto,
|
||||||
|
cover;
|
||||||
|
|
||||||
|
background-position: center,
|
||||||
|
0% 30%;
|
||||||
|
|
||||||
|
margin-bottom: (_size(wrapper-edges, large) * -1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(medium) {
|
||||||
|
> header {
|
||||||
|
@include padding(7em, 3em, (4em, 0, _size(wrapper-edges, medium) * 0.5, 0));
|
||||||
|
|
||||||
|
background-size: auto,
|
||||||
|
cover;
|
||||||
|
|
||||||
|
background-position: center,
|
||||||
|
0% 0%;
|
||||||
|
|
||||||
|
margin-bottom: (_size(wrapper-edges, medium) * -1);
|
||||||
|
|
||||||
|
.inner {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@include breakpoint(small) {
|
@include breakpoint(small) {
|
||||||
padding: 2rem 1rem;
|
> header {
|
||||||
|
@include padding(3.75em, 2em, (2.75em, 0, _size(wrapper-edges, small) * 0.5, 0));
|
||||||
|
|
||||||
|
background-size: auto,
|
||||||
|
125%;
|
||||||
|
|
||||||
|
margin-bottom: (_size(wrapper-edges, small) * -1);
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-size: 1.25em;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-size: 0.8em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.wrapper {
|
||||||
|
background-color: _palette(bg);
|
||||||
|
margin: _size(wrapper-edges, large) 0;
|
||||||
|
position: relative;
|
||||||
|
@include wrapper-edges-color(_palette(bg));
|
||||||
|
|
||||||
|
&:before, &:after {
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
content: '';
|
||||||
|
display: block;
|
||||||
|
height: _size(wrapper-edges, large);
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:before {
|
||||||
|
left: 0;
|
||||||
|
top: (_size(wrapper-edges, large) * -1);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:after {
|
||||||
|
@include vendor('transform', 'scaleY(-1)');
|
||||||
|
bottom: (_size(wrapper-edges, large) * -1);
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.alt {
|
||||||
|
&:before {
|
||||||
|
@include vendor('transform', 'scaleX(-1)');
|
||||||
|
}
|
||||||
|
|
||||||
|
&:after {
|
||||||
|
@include vendor('transform', 'scaleY(-1) scaleX(-1)');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.inner {
|
||||||
|
@include padding(3em, 0);
|
||||||
|
margin: 0 auto;
|
||||||
|
width: _size(inner);
|
||||||
|
}
|
||||||
|
|
||||||
|
@for $i from 2 through _misc(max-wrapper-styles) {
|
||||||
|
$j: 3 * ($i - 1);
|
||||||
|
$color: desaturate(lighten(_palette(bg), $j), $j * 0.5);
|
||||||
|
|
||||||
|
&.style#{$i} {
|
||||||
|
background-color: $color;
|
||||||
|
@include wrapper-edges-color($color);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.spotlight {
|
||||||
|
@include wrapper-edges-color(_palette(accent));
|
||||||
|
background-color: _palette(accent);
|
||||||
|
|
||||||
|
.inner {
|
||||||
|
@include vendor('display', 'flex');
|
||||||
|
@include vendor('align-items', 'center');
|
||||||
|
@include vendor('flex-direction', 'row');
|
||||||
|
}
|
||||||
|
|
||||||
|
.image {
|
||||||
|
border-radius: 100%;
|
||||||
|
margin: 0 _size(section-spacing, large) _size(element-margin) 0;
|
||||||
|
width: 22em;
|
||||||
|
overflow: hidden;
|
||||||
|
-ms-flex: 1;
|
||||||
|
|
||||||
|
img {
|
||||||
|
border-radius: 100%;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
width: 100%;
|
||||||
|
-ms-flex: 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:nth-child(2n - 1) {
|
||||||
|
.inner {
|
||||||
|
@include vendor('flex-direction', 'row-reverse');
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.image {
|
||||||
|
margin: 0 0 _size(element-margin) _size(section-spacing, large);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@for $i from 2 through _misc(max-wrapper-styles) {
|
||||||
|
$j: 3 * ($i - 1);
|
||||||
|
$color: saturate(darken(_palette(accent), $j), $j * 0.5);
|
||||||
|
|
||||||
|
&.style#{$i} {
|
||||||
|
background-color: $color;
|
||||||
|
@include wrapper-edges-color($color);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(medium) {
|
||||||
|
margin: _size(wrapper-edges, medium) 0;
|
||||||
|
|
||||||
|
&:before, &:after {
|
||||||
|
height: _size(wrapper-edges, medium);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:before {
|
||||||
|
top: (_size(wrapper-edges, medium) * -1);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:after {
|
||||||
|
bottom: (_size(wrapper-edges, medium) * -1);
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.inner {
|
||||||
|
@include padding(3em, 3em);
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.spotlight {
|
||||||
|
.image {
|
||||||
|
margin: 0 _size(section-spacing, medium) _size(element-margin) 0;
|
||||||
|
width: 32em;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:nth-child(2n - 1) {
|
||||||
|
.image {
|
||||||
|
margin: 0 0 _size(element-margin) _size(section-spacing, medium);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(small) {
|
||||||
|
margin: _size(wrapper-edges, small) 0;
|
||||||
|
|
||||||
|
&:before, &:after {
|
||||||
|
height: _size(wrapper-edges, small);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:before {
|
||||||
|
top: (_size(wrapper-edges, small) * -1);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:after {
|
||||||
|
bottom: (_size(wrapper-edges, small) * -1);
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.inner {
|
||||||
|
@include padding(2em, 2em);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.spotlight {
|
||||||
|
.inner {
|
||||||
|
@include vendor('align-items', 'flex-start');
|
||||||
|
}
|
||||||
|
|
||||||
|
.image {
|
||||||
|
width: 19em;
|
||||||
|
margin: 0 _size(section-spacing, small) _size(element-margin) 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:nth-child(2n - 1) {
|
||||||
|
.image {
|
||||||
|
margin: 0 0 _size(element-margin) _size(section-spacing, small);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@include breakpoint(xsmall) {
|
@include breakpoint(xsmall) {
|
||||||
padding: 1rem;
|
&.spotlight {
|
||||||
|
.inner {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.image {
|
||||||
|
margin: 0 0 (_size(element-margin) * 0.5) 0 !important;
|
||||||
|
max-width: 85%;
|
||||||
|
width: 12em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include breakpoint(xxsmall) {
|
||||||
|
.inner {
|
||||||
|
@include padding(2em, 1.5em);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -1,43 +1,54 @@
|
||||||
// Misc.
|
// Misc.
|
||||||
$misc: (
|
$misc: (
|
||||||
z-index-base: 10000
|
z-index-base: 10000,
|
||||||
|
max-wrapper-styles: 6
|
||||||
);
|
);
|
||||||
|
|
||||||
// Duration.
|
// Duration.
|
||||||
$duration: (
|
$duration: (
|
||||||
transition: 0.2s,
|
menu: 0.35s,
|
||||||
bg: 2.5s,
|
transition: 0.2s
|
||||||
intro: 0.75s,
|
|
||||||
article: 0.325s
|
|
||||||
);
|
);
|
||||||
|
|
||||||
// Size.
|
// Size.
|
||||||
$size: (
|
$size: (
|
||||||
border-radius: 4px,
|
border-radius: 5px,
|
||||||
border-width: 1px,
|
element-height: 2.75em,
|
||||||
element-height: 2.75rem,
|
element-margin: 2em,
|
||||||
element-margin: 2rem
|
inner: 55em,
|
||||||
|
section-spacing: (
|
||||||
|
large: 3em,
|
||||||
|
medium: 2em,
|
||||||
|
small: 1.75em
|
||||||
|
),
|
||||||
|
wrapper-edges: (
|
||||||
|
large: 6.5em,
|
||||||
|
medium: 4.75em,
|
||||||
|
small: 2.5em
|
||||||
|
)
|
||||||
);
|
);
|
||||||
|
|
||||||
// Font.
|
// Font.
|
||||||
$font: (
|
$font: (
|
||||||
family: ('Source Sans Pro', sans-serif),
|
family: ('Source Sans Pro', Helvetica, sans-serif),
|
||||||
family-fixed: ('Courier New', monospace),
|
family-fixed: ('Courier New', monospace),
|
||||||
|
family-heading: (Raleway, Helvetica, sans-serif),
|
||||||
weight: 300,
|
weight: 300,
|
||||||
weight-bold: 600,
|
weight-bold: 600,
|
||||||
letter-spacing: 0.2rem,
|
weight-heading: 200,
|
||||||
letter-spacing-heading: 0.5rem
|
weight-heading-bold: 700,
|
||||||
|
kern-heading: 0.1em
|
||||||
);
|
);
|
||||||
|
|
||||||
// Palette.
|
// Palette.
|
||||||
$palette: (
|
$palette: (
|
||||||
bg: #1b1f22,
|
bg: #2e3141,
|
||||||
bg-alt: #000000,
|
|
||||||
bg-overlay: rgba(19,21,25,0.5),
|
|
||||||
fg: #ffffff,
|
fg: #ffffff,
|
||||||
fg-bold: #ffffff,
|
fg-bold: #ffffff,
|
||||||
fg-light: rgba(255,255,255,0.5),
|
fg-light: rgba(255,255,255,0.35),
|
||||||
border: #ffffff,
|
border: rgba(255,255,255,0.125),
|
||||||
border-bg: rgba(255,255,255,0.075),
|
border-bg: rgba(255,255,255,0.025),
|
||||||
border-bg-alt: rgba(255,255,255,0.175)
|
border2: rgba(255,255,255,0.25),
|
||||||
|
border2-bg: rgba(255,255,255,0.075),
|
||||||
|
accent: #4c5c96
|
||||||
);
|
);
|
|
@ -3,10 +3,10 @@
|
||||||
@import 'libs/mixins';
|
@import 'libs/mixins';
|
||||||
@import 'libs/skel';
|
@import 'libs/skel';
|
||||||
@import 'font-awesome.min.css';
|
@import 'font-awesome.min.css';
|
||||||
@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:300italic,600italic,300,600');
|
@import url('https://fonts.googleapis.com/css?family=Raleway:200,700|Source+Sans+Pro:300,600,300italic,600italic');
|
||||||
|
|
||||||
/*
|
/*
|
||||||
Dimension by HTML5 UP
|
Solid State by HTML5 UP
|
||||||
html5up.net | @ajlkn
|
html5up.net | @ajlkn
|
||||||
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
*/
|
*/
|
||||||
|
@ -16,13 +16,19 @@
|
||||||
large: '(max-width: 1280px)',
|
large: '(max-width: 1280px)',
|
||||||
medium: '(max-width: 980px)',
|
medium: '(max-width: 980px)',
|
||||||
small: '(max-width: 736px)',
|
small: '(max-width: 736px)',
|
||||||
xsmall: '(max-width: 480px)',
|
xsmall: '(max-width: 640px)',
|
||||||
xxsmall: '(max-width: 360px)'
|
xxsmall: '(max-width: 360px)'
|
||||||
));
|
));
|
||||||
|
|
||||||
@include skel-layout((
|
@include skel-layout((
|
||||||
reset: 'full',
|
reset: 'full',
|
||||||
boxModel: 'border'
|
boxModel: 'border',
|
||||||
|
grid: ( gutters: 1.75em ),
|
||||||
|
breakpoints: (
|
||||||
|
small: (
|
||||||
|
grid: ( gutters: 1.25em )
|
||||||
|
)
|
||||||
|
)
|
||||||
));
|
));
|
||||||
|
|
||||||
// Base.
|
// Base.
|
||||||
|
@ -32,6 +38,7 @@
|
||||||
|
|
||||||
// Component.
|
// Component.
|
||||||
|
|
||||||
|
@import 'components/section';
|
||||||
@import 'components/form';
|
@import 'components/form';
|
||||||
@import 'components/box';
|
@import 'components/box';
|
||||||
@import 'components/icon';
|
@import 'components/icon';
|
||||||
|
@ -39,11 +46,12 @@
|
||||||
@import 'components/list';
|
@import 'components/list';
|
||||||
@import 'components/table';
|
@import 'components/table';
|
||||||
@import 'components/button';
|
@import 'components/button';
|
||||||
|
@import 'components/features';
|
||||||
|
|
||||||
// Layout.
|
// Layout.
|
||||||
|
|
||||||
@import 'layout/bg';
|
|
||||||
@import 'layout/wrapper';
|
|
||||||
@import 'layout/header';
|
@import 'layout/header';
|
||||||
@import 'layout/main';
|
@import 'layout/menu';
|
||||||
|
@import 'layout/banner';
|
||||||
|
@import 'layout/wrapper';
|
||||||
@import 'layout/footer';
|
@import 'layout/footer';
|
|
@ -1,19 +0,0 @@
|
||||||
@import 'libs/vars';
|
|
||||||
@import 'libs/functions';
|
|
||||||
@import 'libs/mixins';
|
|
||||||
@import 'libs/skel';
|
|
||||||
|
|
||||||
/*
|
|
||||||
Dimension by HTML5 UP
|
|
||||||
html5up.net | @ajlkn
|
|
||||||
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
|
||||||
*/
|
|
||||||
|
|
||||||
/* Main */
|
|
||||||
|
|
||||||
#main {
|
|
||||||
article {
|
|
||||||
opacity: 1;
|
|
||||||
margin: (_size(element-margin) * 2) 0 0 0;
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -6,3 +6,5 @@ Das C3 Waffel Operation Center möchte die ganze Welt mit Waffeln versorgen!
|
||||||
|
|
||||||
Daher haben wir es uns zum Ziel gesetzt zufällig an verschiedenen Chaosevents, in Hackerspacen und bei Chaostreffs aufzutauchen und Waffeln zu machen.
|
Daher haben wir es uns zum Ziel gesetzt zufällig an verschiedenen Chaosevents, in Hackerspacen und bei Chaostreffs aufzutauchen und Waffeln zu machen.
|
||||||
Notfalls auch mit Waffelgewalt.
|
Notfalls auch mit Waffelgewalt.
|
||||||
|
---
|
||||||
|
_template: home.html
|
||||||
|
|
79
templates/home.html
Normal file
|
@ -0,0 +1,79 @@
|
||||||
|
{% extends "layout.html" %}
|
||||||
|
{% block title %}{{ this.title }}{% endblock %}
|
||||||
|
{% block body %}
|
||||||
|
<!-- One -->
|
||||||
|
<section id="one" class="wrapper spotlight style1">
|
||||||
|
<div class="inner">
|
||||||
|
<a href="#" class="image"><img src="images/pic01.jpg" alt="" /></a>
|
||||||
|
<div class="content">
|
||||||
|
<h2 class="major">Magna arcu feugiat</h2>
|
||||||
|
<p>Lorem ipsum dolor sit amet, etiam lorem adipiscing elit. Cras turpis ante, nullam sit amet turpis non, sollicitudin posuere urna. Mauris id tellus arcu. Nunc vehicula id nulla dignissim dapibus. Nullam ultrices, neque et faucibus viverra, ex nulla cursus.</p>
|
||||||
|
<a href="#" class="special">Learn more</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Two -->
|
||||||
|
<section id="two" class="wrapper alt spotlight style2">
|
||||||
|
<div class="inner">
|
||||||
|
<a href="#" class="image"><img src="images/pic02.jpg" alt="" /></a>
|
||||||
|
<div class="content">
|
||||||
|
<h2 class="major">Tempus adipiscing</h2>
|
||||||
|
<p>Lorem ipsum dolor sit amet, etiam lorem adipiscing elit. Cras turpis ante, nullam sit amet turpis non, sollicitudin posuere urna. Mauris id tellus arcu. Nunc vehicula id nulla dignissim dapibus. Nullam ultrices, neque et faucibus viverra, ex nulla cursus.</p>
|
||||||
|
<a href="#" class="special">Learn more</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Three -->
|
||||||
|
<section id="three" class="wrapper spotlight style3">
|
||||||
|
<div class="inner">
|
||||||
|
<a href="#" class="image"><img src="images/pic03.jpg" alt="" /></a>
|
||||||
|
<div class="content">
|
||||||
|
<h2 class="major">Nullam dignissim</h2>
|
||||||
|
<p>Lorem ipsum dolor sit amet, etiam lorem adipiscing elit. Cras turpis ante, nullam sit amet turpis non, sollicitudin posuere urna. Mauris id tellus arcu. Nunc vehicula id nulla dignissim dapibus. Nullam ultrices, neque et faucibus viverra, ex nulla cursus.</p>
|
||||||
|
<a href="#" class="special">Learn more</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Four -->
|
||||||
|
<section id="four" class="wrapper alt style1">
|
||||||
|
<div class="inner">
|
||||||
|
<h2 class="major">Vitae phasellus</h2>
|
||||||
|
<p>Cras mattis ante fermentum, malesuada neque vitae, eleifend erat. Phasellus non pulvinar erat. Fusce tincidunt, nisl eget mattis egestas, purus ipsum consequat orci, sit amet lobortis lorem lacus in tellus. Sed ac elementum arcu. Quisque placerat auctor laoreet.</p>
|
||||||
|
<section class="features">
|
||||||
|
<article>
|
||||||
|
<a href="#" class="image"><img src="images/pic04.jpg" alt="" /></a>
|
||||||
|
<h3 class="major">Sed feugiat lorem</h3>
|
||||||
|
<p>Lorem ipsum dolor sit amet, consectetur adipiscing vehicula id nulla dignissim dapibus ultrices.</p>
|
||||||
|
<a href="#" class="special">Learn more</a>
|
||||||
|
</article>
|
||||||
|
<article>
|
||||||
|
<a href="#" class="image"><img src="images/pic05.jpg" alt="" /></a>
|
||||||
|
<h3 class="major">Nisl placerat</h3>
|
||||||
|
<p>Lorem ipsum dolor sit amet, consectetur adipiscing vehicula id nulla dignissim dapibus ultrices.</p>
|
||||||
|
<a href="#" class="special">Learn more</a>
|
||||||
|
</article>
|
||||||
|
<article>
|
||||||
|
<a href="#" class="image"><img src="images/pic06.jpg" alt="" /></a>
|
||||||
|
<h3 class="major">Ante fermentum</h3>
|
||||||
|
<p>Lorem ipsum dolor sit amet, consectetur adipiscing vehicula id nulla dignissim dapibus ultrices.</p>
|
||||||
|
<a href="#" class="special">Learn more</a>
|
||||||
|
</article>
|
||||||
|
<article>
|
||||||
|
<a href="#" class="image"><img src="images/pic07.jpg" alt="" /></a>
|
||||||
|
<h3 class="major">Fusce consequat</h3>
|
||||||
|
<p>Lorem ipsum dolor sit amet, consectetur adipiscing vehicula id nulla dignissim dapibus ultrices.</p>
|
||||||
|
<a href="#" class="special">Learn more</a>
|
||||||
|
</article>
|
||||||
|
</section>
|
||||||
|
<ul class="actions">
|
||||||
|
<li><a href="#" class="button">Browse All</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
{% endblock %}
|
|
@ -1,55 +1,104 @@
|
||||||
<!doctype html>
|
<!DOCTYPE HTML>
|
||||||
|
<!--
|
||||||
|
Solid State by HTML5 UP
|
||||||
|
html5up.net | @ajlkn
|
||||||
|
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||||
|
-->
|
||||||
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8">
|
<title>{% block title %}Startseite{% endblock %}</title>
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<!--[if lte IE 8]><script src="{{ '/js/ie/html5shiv.js'|url }}"></script><![endif]-->
|
||||||
<link rel="stylesheet" href="{{ '/css/main.css'|url }}" />
|
<link rel="stylesheet" href="{{ '/css/main.css'|url }}" />
|
||||||
<!--[if lte IE 9]><link rel="stylesheet" href="{{ '/css/ie9.css'|url }}" /><![endif]-->
|
<!--[if lte IE 9]><link rel="stylesheet" href="{{ '/css/ie9.css'|url }}" /><![endif]-->
|
||||||
<noscript><link rel="stylesheet" href="{{ '/css/noscript.css'|url }}" /></noscript>
|
<!--[if lte IE 8]><link rel="stylesheet" href="{{ '/css/ie8.css'|url }}" /><![endif]-->
|
||||||
<title>{% block title %}Welcome{% endblock %} c3woc</title>
|
<link rel="icon" href="{{ '/images/favicon.png'|url }}" type="image/png">
|
||||||
<!-- Quellcode: https://git.see-base.de/l3d/c3woc -->
|
<style>
|
||||||
|
.active a{
|
||||||
|
color: red;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
<div id="wrapper">
|
<!-- Page Wrapper -->
|
||||||
<header id="header">
|
<div id="page-wrapper">
|
||||||
<div class="logo">
|
|
||||||
<span class="icon fa-heart"></span>
|
<!-- Header -->
|
||||||
</div>
|
<header id="header" class="alt">
|
||||||
<div class="content">
|
<h1><a href="index.html">c3WOC</a></h1>
|
||||||
<div class="inner">
|
|
||||||
<img style="width: 100%; margin-top: -23px;" src="{{ '/images/logo/c3woc.svg'|url }}" />
|
|
||||||
<p>Das C3 Waffel Operation Center. <br/>Wir machen Waffeln.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<nav>
|
<nav>
|
||||||
<ul class="nav navbar-nav">
|
<a href="#menu">Menu</a>
|
||||||
<li{% if this._path == '/' %} class="active"{% endif
|
|
||||||
%}><a href="{{ '/'|url }}#Cyber">Willkommen</a></li>
|
|
||||||
{% for href, title in [
|
|
||||||
['/blog', 'Blog'],
|
|
||||||
['/projects', 'Projekte'],
|
|
||||||
['/about', 'Impressum']
|
|
||||||
]
|
|
||||||
%}
|
|
||||||
<li{% if this.is_child_of(href) %} class="active"{% endif
|
|
||||||
%}><a href="{{ href|url }}#Cyber">{{ title }}</a></li>
|
|
||||||
{% endfor %}
|
|
||||||
</ul>
|
|
||||||
</nav>
|
</nav>
|
||||||
</header>
|
</header>
|
||||||
<div id="main">
|
|
||||||
<article id="Cyber">
|
<!-- Menu -->
|
||||||
|
<nav id="menu">
|
||||||
|
<div class="inner">
|
||||||
|
<h2>Menu</h2>
|
||||||
|
<ul class="links">
|
||||||
|
<li{% if this._path == '/' %} class="active"{% endif
|
||||||
|
%}><a href="{{ '/'|url }}">Home</a></li>{%
|
||||||
|
for href, title in [
|
||||||
|
['/blog', 'Neuigkeiten'],
|
||||||
|
['/projects', 'Projekte'],
|
||||||
|
['/impressum', 'Kontakt']
|
||||||
|
] %}
|
||||||
|
<li{% if this.is_child_of(href) %} class="active"{% endif
|
||||||
|
%}><a href="{{ href|url }}">{{ title }}</a></li>{%
|
||||||
|
endfor %}
|
||||||
|
</ul>
|
||||||
|
<a href="#" class="close">Close</a>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<!-- Banner -->
|
||||||
|
<section id="banner">
|
||||||
|
<div class="inner">
|
||||||
|
<div class="logo"><span class="icon fa-heart"></span></div>
|
||||||
|
<h2>C3WOC</h2>
|
||||||
|
<p>C3 Waffel Operation Center <span class="icon fa-heart"></span> Wir machen Waffeln</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<!-- Wrapper -->
|
||||||
|
<section id="wrapper">
|
||||||
|
<!-- Main -->
|
||||||
{% block body %}{% endblock %}
|
{% block body %}{% endblock %}
|
||||||
</article>
|
</section>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Footer -->
|
||||||
|
<section id="footer">
|
||||||
|
<div class="inner">
|
||||||
|
<h2 class="major">Wir <span class="icon fa-heart"></span> Waffeln, du auch?</h2>
|
||||||
|
<p>Das c3WOC besteht aus Chaoten überall im Chaos. Nimm doch mal mit uns Kontakt auf und lass uns zusammen Waffeln machen!</p>
|
||||||
|
<form>
|
||||||
|
<img src="{{ '/images/logo/c3woc.svg'|url }}" style="width: 100%;"></img>
|
||||||
|
</form>
|
||||||
|
<ul class="contact">
|
||||||
|
{% for icon, link, name in [
|
||||||
|
['fa-envelope', 'mailto:waffel@c3woc.de', 'waffel@c3woc.de'],
|
||||||
|
['fa-hashtag', 'ircs://irc.hackint.org/#waffel', 'irc.hackint.org/#waffel'],
|
||||||
|
['fa-hashtag', 'https://webirc.hackint.org/#irc://irc.hackint.org/#waffel', 'webirc.hackint.org'],
|
||||||
|
['fa-twitter', 'https://twitter.com/@c3WOC', '@c3WOC'],
|
||||||
|
['fa-comments', 'https://chaos.social/@c3WOC', 'c3WOC@chaos.social'],
|
||||||
|
] %}
|
||||||
|
<li class="{{ icon }}"><a href="{{ link }}">{{ name }}</a></li>{%
|
||||||
|
endfor %}
|
||||||
|
</ul>
|
||||||
|
<ul class="copyright">
|
||||||
|
<li>© by L3D.</li><li><a href="{{ '/impressum/'|url }}">Impressum</a></li><li>Design inspired by: <a href="http://html5up.net">HTML5 UP</a></li>
|
||||||
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<footer id="footer">
|
</section>
|
||||||
© Copyright 2018 by L3D | News <a href="{{ '/feed.xml'|url }}" title="RSS Feed" class="icon fa-rss" style="font-size: 1.2em; padding-left: 5px;"></a>
|
|
||||||
</footer>
|
|
||||||
</div>
|
</div>
|
||||||
<div id="bg"></div>
|
|
||||||
<!-- Scripts -->
|
<!-- Scripts -->
|
||||||
<script src="{{ '/js/jquery.min.js'|url }}"></script>
|
|
||||||
<script src="{{ '/js/skel.min.js'|url }}"></script>
|
<script src="{{ '/js/skel.min.js'|url }}"></script>
|
||||||
|
<script src="{{ '/js/jquery.min.js'|url }}"></script>
|
||||||
|
<script src="{{ '/js/jquery.scrollex.min.js'|url }}"></script>
|
||||||
<script src="{{ '/js/util.js'|url }}"></script>
|
<script src="{{ '/js/util.js'|url }}"></script>
|
||||||
|
<!--[if lte IE 8]><script src="{{ '/js/ie/respond.min.js'|url }}"></script><![endif]-->
|
||||||
<script src="{{ '/js/main.js'|url }}"></script>
|
<script src="{{ '/js/main.js'|url }}"></script>
|
||||||
</body>
|
</body>
|
||||||
|
</html>
|
||||||
|
|