-
Notifications
You must be signed in to change notification settings - Fork 6
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Afnizar Nur Ghifari
committed
Jan 31, 2017
0 parents
commit fc7b0ff
Showing
37 changed files
with
10,942 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,252 @@ | ||
/* | ||
* Saturn HTML Template by @flamekaizar - http://afnizar.com | ||
* License - http://license.afnizar.com/ (MIT License) | ||
*/ | ||
|
||
body { margin-bottom: 50px } | ||
a { font-family: "Open Sans", sans-serif } | ||
.container { | ||
margin: auto; | ||
max-width: 662px; | ||
padding: 0 20px; | ||
} | ||
/* Navigation */ | ||
.main-nav { | ||
padding-top: 30px; | ||
padding-bottom: 25px; | ||
background-color: #FFF; | ||
-moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1); | ||
-webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1); | ||
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1); | ||
z-index: 10; | ||
position: relative; | ||
} | ||
.group.top-nav { margin-bottom: -20px } | ||
.group.top-nav nav a { text-decoration: none } | ||
.group.top-nav nav a:hover { | ||
color: #FF6C40; -webkit-transition: all .25s ease-in-out; | ||
-moz-transition: all .2s ease-in-out; | ||
-ms-transition: all .2s ease-in-out; | ||
-o-transition: all .2s ease-in-out; | ||
transition: all .2s ease-in-out; | ||
} | ||
/* Created by @flamekaizar */ | ||
.top-nav a.logo, | ||
.logo { | ||
font-family: 'Open Sans', sans-serif; | ||
font-weight: 700; | ||
font-size: 27px; | ||
color: #000; | ||
letter-spacing: -2px; | ||
} | ||
.navigation-toggle .logo { | ||
font-size: 20px; | ||
text-transform: capitalize; | ||
} | ||
.top-nav .item-nav li.active a { color: #FF6C40 } | ||
.top-nav .item-nav li a { | ||
font-family: "Lato", sans-serif; | ||
font-size: 15px; | ||
font-weight: 500; | ||
color: #A4A4A4; | ||
} | ||
.intro { | ||
width: 100%; | ||
height: 272px; | ||
padding-top: 117px; | ||
background: url(../img/head-bg.jpg) #F7F7F7 center top; | ||
} | ||
p.p-intro { | ||
color: #E85F37; | ||
font-family: "Open Sans", sans-serif; | ||
font-size: 13px; | ||
letter-spacing: 2px; | ||
font-weight: 700; | ||
text-transform: uppercase; | ||
padding: 10px 25px; | ||
background-color: #FFF; | ||
border: 1px solid #DC5227; | ||
-moz-border-radius: 5px; | ||
-webkit-border-radius: 5px; | ||
border-radius: 5px; | ||
box-shadow: inset 0 -3px 0 #ffcfbc; | ||
position: relative; | ||
-webkit-animation: smooth-entry-btn 1s; | ||
-moz-animation: smooth-entry-btn 1s; | ||
animation: smooth-entry-btn 1s; | ||
} | ||
p.p-intro:after { | ||
content: ''; | ||
position: absolute; | ||
border-style: solid; | ||
border-width: 9px 9px 9px 0; | ||
border-color: transparent #FFFFFF; | ||
display: block; | ||
width: 0; | ||
z-index: 1; | ||
left: -9px; | ||
top: 12px; | ||
} | ||
p.p-intro:before { | ||
content: ''; | ||
position: absolute; | ||
border-style: solid; | ||
border-width: 11px 10px 11px 0; | ||
border-color: transparent #DC5227; | ||
display: block; | ||
width: 0; | ||
z-index: 1; | ||
left: -10px; | ||
top: 10px; | ||
} | ||
img.img-intro { | ||
border-radius: 100px; | ||
width: 47px; | ||
background-color: #EF3A3A; | ||
border: 1px solid #DC5227; | ||
-moz-box-shadow: inset 0.5px 0.9px 5px rgba(0, 0, 0, 0.05); | ||
-webkit-box-shadow: inset 0.5px 0.9px 5px rgba(0, 0, 0, 0.05); | ||
box-shadow: inset 0.5px 0.9px 5px rgba(0, 0, 0, 0.05); | ||
-webkit-animation: smooth-entry-btn 1s; | ||
-moz-animation: smooth-entry-btn 1s; | ||
animation: smooth-entry-btn 1s; | ||
} | ||
.content { padding-top: 75px } | ||
.post { margin-bottom: 80px } | ||
.content .post a { text-decoration: none } | ||
.content .post h1 { | ||
color: #000; | ||
font-family: "Lato", sans-serif; | ||
font-size: 22px; | ||
font-weight: 400; | ||
position: relative; | ||
} | ||
|
||
/* Created by @flamekaizar */ | ||
.content .post a h1:hover{ | ||
color: #FF6C40; | ||
-webkit-transition: all .2s ease-in-out; | ||
-moz-transition: all .2s ease-in-out; | ||
-ms-transition: all .2s ease-in-out; | ||
-o-transition: all .2s ease-in-out; | ||
transition: all .2s ease-in-out; | ||
} | ||
.content .post p { | ||
color: #535353; | ||
font-family: "Open Sans", sans-serif; | ||
font-size: 15px; | ||
font-weight: 400; | ||
} | ||
.content .post img { margin-bottom: 20px } | ||
.content .post hr { | ||
content: url(../img/separator.png); | ||
width: 66px; | ||
height: 7px; | ||
float: left; | ||
border: none; | ||
} | ||
.content .post h1:before { | ||
content: url(../img/separator.png); | ||
position: absolute; | ||
top: -35px; | ||
left: 1px; | ||
} | ||
.in-content { margin-top: 55px } | ||
a.read-more { | ||
padding: 5px 10px; | ||
background-color: #FFF; | ||
border: 1px solid #E85F37; | ||
-moz-border-radius: 5px; | ||
-webkit-border-radius: 5px; | ||
border-radius: 5px; | ||
color: #E85F37; | ||
font-size: 13px; /* Created by @flamekaizar */ | ||
font-weight: 700; | ||
text-transform: uppercase; | ||
text-decoration: none; | ||
letter-spacing: 2px; | ||
} | ||
|
||
a.read-more:hover { | ||
background-color: #FF6C40; | ||
color: #fff; | ||
-webkit-transition: all .25s ease-in-out; | ||
-moz-transition: all .25s ease-in-out; | ||
-ms-transition: all .25s ease-in-out; | ||
-o-transition: all .25s ease-in-out; | ||
transition: all .25s ease-in-out; | ||
} | ||
.foot-post { | ||
position: relative; | ||
margin-top: 60px; | ||
color: #535353; | ||
font-family: "Open Sans", sans-serif; | ||
font-size: 12px; | ||
font-weight: 700; | ||
text-transform: uppercase; | ||
} | ||
.foot-post a { | ||
font-weight: 400; | ||
text-decoration: none; | ||
color: #535353; | ||
} | ||
.foot-post a:hover { | ||
border-bottom: 1px dotted #ccc | ||
} | ||
.foot-post:before { | ||
content: url(../img/separator.png); | ||
position: absolute; | ||
top: -40px; | ||
left: 1px; | ||
} | ||
/* Footer */ | ||
footer .btn { | ||
color: #FFF; | ||
font-size: 13px; | ||
font-family: "Open Sans"; | ||
font-weight: 700; | ||
letter-spacing: 2px; | ||
} | ||
footer .social li { | ||
display: inline; | ||
margin-left: 10px; | ||
margin-right: 10px; | ||
} | ||
footer .social li a { color: #a5a5a5 } | ||
footer .social li a:hover { | ||
color: #e85f37; | ||
} | ||
.foot-cp { padding-top: 40px } | ||
.foot-cp a { | ||
color: #A5A5A5; | ||
font-family: "Lato", sans-serif; | ||
font-size: 15px; | ||
font-weight: 400; | ||
text-transform: uppercase; | ||
text-decoration: none; | ||
letter-spacing: 3px; | ||
} | ||
|
||
@-webkit-keyframes smooth-entry{0%{opacity:0;-webkit-transform:translateY(-1.4em)}100%{opacity:1;-webkit-transform:translateY(0)}}@-moz-keyframes smooth-entry{0%{opacity:0;-moz-transform:translateY(-1.4em)}100%{opacity:1;-moz-transform:translateY(0)}}@keyframes smooth-entry{0%{opacity:0;-webkit-transform:translateY(-1.4em);-moz-transform:translateY(-1.4em);-ms-transform:translateY(-1.4em);-o-transform:translateY(-1.4em);transform:translateY(-1.4em)}100%{opacity:1;-webkit-transform:translateY(0);-moz-transform:translateY(0);-ms-transform:translateY(0);-o-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes smooth-entry-reverse{0%{opacity:0;-webkit-transform:translateY(2em)}100%{opacity:1;-webkit-transform:translateY(0)}}@-moz-keyframes smooth-entry-reverse{0%{opacity:0;-moz-transform:translateY(2em)}100%{opacity:1;-moz-transform:translateY(0)}}@keyframes smooth-entry-reverse{0%{opacity:0;-webkit-transform:translateY(2em);-moz-transform:translateY(2em);-ms-transform:translateY(2em);-o-transform:translateY(2em);transform:translateY(2em)}100%{opacity:1;-webkit-transform:translateY(0);-moz-transform:translateY(0);-ms-transform:translateY(0);-o-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes smooth-entry-title{0%{opacity:0;-webkit-transform:translateY(-0.6em)}50%{opacity:0;-webkit-transform:translateY(-0.6em)}100%{opacity:1;-webkit-transform:translateY(0)}}@-moz-keyframes smooth-entry-title{0%{opacity:0;-moz-transform:translateY(-0.6em)}50%{opacity:0;-moz-transform:translateY(-0.6em)}100%{opacity:1;-moz-transform:translateY(0)}}@keyframes smooth-entry-title{0%{opacity:0;-webkit-transform:translateY(-0.6em);-moz-transform:translateY(-0.6em);-ms-transform:translateY(-0.6em);-o-transform:translateY(-0.6em);transform:translateY(-0.6em)}50%{opacity:0;-webkit-transform:translateY(-0.6em);-moz-transform:translateY(-0.6em);-ms-transform:translateY(-0.6em);-o-transform:translateY(-0.6em);transform:translateY(-0.6em)}100%{opacity:1;-webkit-transform:translateY(0);-moz-transform:translateY(0);-ms-transform:translateY(0);-o-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes smooth-entry-btn{0%{opacity:0;-webkit-transform:translateY(0.6em)}70%{opacity:0;-webkit-transform:translateY(0.6em)}100%{opacity:1;-webkit-transform:translateY(0)}}@-moz-keyframes smooth-entry-btn{0%{opacity:0;-moz-transform:translateY(0.6em)}70%{opacity:0;-moz-transform:translateY(0.6em)}100%{opacity:1;-moz-transform:translateY(0)}}@keyframes smooth-entry-btn{0%{opacity:0;-webkit-transform:translateY(0.6em);-moz-transform:translateY(0.6em);-ms-transform:translateY(0.6em);-o-transform:translateY(0.6em);transform:translateY(0.6em)}70%{opacity:0;-webkit-transform:translateY(0.6em);-moz-transform:translateY(0.6em);-ms-transform:translateY(0.6em);-o-transform:translateY(0.6em);transform:translateY(0.6em)}100%{opacity:1;-webkit-transform:translateY(0);-moz-transform:translateY(0);-ms-transform:translateY(0);-o-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes fof-alien{0%,100%{-webkit-transform:translateY(0)}50%{-webkit-transform:translateY(-30px)}}@-moz-keyframes fof-alien{0%,100%{-moz-transform:translateY(0)}50%{-moz-transform:translateY(-30px)}}@keyframes fof-alien{0%,100%{-webkit-transform:translateY(0);-moz-transform:translateY(0);-ms-transform:translateY(0);-o-transform:translateY(0);transform:translateY(0)}50%{-webkit-transform:translateY(-30px);-moz-transform:translateY(-30px);-ms-transform:translateY(-30px);-o-transform:translateY(-30px);transform:translateY(-30px)}}@-webkit-keyframes fof-shadow{0%,100%{-webkit-transform:scale(1)}50%{-webkit-transform:scale(0.8)}}@-moz-keyframes fof-shadow{0%,100%{-moz-transform:scale(1)}50%{-moz-transform:scale(0.8)}}@keyframes fof-shadow{0%,100%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(0.8);-moz-transform:scale(0.8);-ms-transform:scale(0.8);-o-transform:scale(0.8);transform:scale(0.8)}} | ||
/* Responsive */ | ||
@media only screen and (max-width: 767px) { | ||
.intro { padding-top: 50px } | ||
img.img-intro { | ||
display: block; | ||
margin-left: auto; | ||
margin-right: auto; | ||
} | ||
.logo-w { display: none } | ||
.main-nav { | ||
padding-top: 20px; | ||
padding-bottom: 20px; | ||
} | ||
.top-nav .item-nav li { padding-bottom: 10px } | ||
footer .btn { | ||
display: block; | ||
margin-left: auto; | ||
margin-right: auto; | ||
} | ||
footer .social { text-align: center } | ||
.foot-cp { padding-top: 10px } | ||
} |
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
Large diffs are not rendered by default.
Oops, something went wrong.
Oops, something went wrong.