Template:Amoy/css/LinkDemoCss

@font-face { font-weight: normal; font-style: normal; font-family: 'codropsicons'; src:url('../fonts/codropsicons/codropsicons.eot'); src:url('../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'), url('../fonts/codropsicons/codropsicons.woff') format('woff'), url('../fonts/codropsicons/codropsicons.ttf') format('truetype'), url('../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg'); }

• , *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.clearfix:before, .clearfix:after { content: ; display: table; } .clearfix:after { clear: both; }

body { background: #fff; color: #ecf0f1; font-size: 100%; line-height: 1.25; font-family: 'Lato', Arial, sans-serif; }

a { color: #95a5a6; text-decoration: none; outline: none; }

a:hover, a:focus { color: #fff; }

.codrops-header { margin: 0 auto; padding: 2em; text-align: center; }

.codrops-header h1 { margin: 0; font-weight: 300; font-size: 2.5em; }

.codrops-header h1 span { display: block; padding: 0 0 0.6em 0.1em; font-size: 0.6em; opacity: 0.7; }

/* To Navigation Style */ .codrops-top { width: 100%; text-transform: uppercase; font-weight: 700; font-size: 0.69em; line-height: 2.2; }

.codrops-top a { display: inline-block; padding: 0 1em; text-decoration: none; letter-spacing: 1px; }

.codrops-top span.right { float: right; }

.codrops-top span.right a { display: block; float: left; }

.codrops-icon:before { margin: 0 4px; text-transform: none; font-weight: normal; font-style: normal; font-variant: normal; font-family: 'codropsicons'; line-height: 1; speak: none; -webkit-font-smoothing: antialiased; }

.codrops-icon-drop:before { content: "\e001"; }

.codrops-icon-prev:before { content: "\e004"; }

section { padding: 4em 2em; text-align: center; }

section h2 { font-weight: 300; font-size: 2em; padding: 1em 0; }

.codrops-header + section { padding-top: 1.5em; }

.related p { font-size: 1.5em; }

.related > a { background: rgba(0,0,0,0.05); display: inline-block; text-align: center; margin: 20px 10px; padding: 25px; -webkit-transition: color 0.3s, background-color 0.3s; transition: color 0.3s, background-color 0.3s; }

.related a:hover { background-color: rgba(0,0,0,0.4); }

.related a img { max-width: 100%; opacity: 0.8; -webkit-transition: opacity 0.3s; transition: opacity 0.3s; }

.related a:hover img, .related a:active img { opacity: 1; }

.related a h3 { margin: 0; padding: 0.5em 0 0.3em; max-width: 300px; text-align: left; }

@media screen and (max-width: 25em) {

.codrops-icon span { display: none; }

}