/************************\ DEFAULT /************************/
body { margin: 0; padding: 0; line-height: 25px; overflow-x: hidden; }
body.cover { background-size:cover;} body.repeat { background-repeat: repeat;} body.repeat-x { background-repeat: repeat-x;} body.repeat-y { background-repeat: repeat-y;}
a { text-decoration: none; word-break: break-word; -webkit-transition:Color .3s ease-in-out; -moz-transition:Color .3s ease-in-out; -o-transition:Color .3s ease-in-out; transition:Color .3s ease-in-out;}
blockquote { padding-left: 10px; margin: 15px;}
p { word-break: break-word;}
img { max-width: 100%;}
form { padding: 0; margin: 0;}
input { border: none; width: 100%; padding: 5px; }
.none { display:none}
.clear { clear:both;}
/************************\ END DEFAULT /************************/

/************************\ PACKAGE /************************/
#wrap { margin: 0 auto; -webkit-animation: fade 3s 1 ease-in-out; -moz-animation: fade 3s 1 ease-in-out;-o-animation: fade 3s 1 ease-in-out;}
#content { margin: 0 auto;}
#menu { z-index: 999; max-width: 25%; margin:0 ; text-align: center; font-weight: lighter; padding: 2em; position: fixed; left: 0; overflow: hidden; top: 0;}
#navigator { width: 150px; margin: 10em auto 0; padding: 15px 0; text-align:center;}

#foot { margin: 10px auto 70px;}
 .credit { max-width: 300px; margin: 0 auto; text-align: center; border-top: 1px solid #000; padding: 20px 0; opacity:.5;}
/************************\ END PACKAGE /************************/

/************************\ CENTERBAR /************************/

.title {display: inline-block; -webkit-transform: translate(0px, 0px); -moz-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out;}

.title:hover {-webkit-transform: translate(0px, 5px); -moz-transform: translate(0px, 5px); -ms-transform: translate(0px, 5px); transform: translate(0px, 5px);}

.title h1{ margin:15px 0; padding:0; font-size: 3em; font-weight: 900; line-height: 90%; letter-spacing: 2px; text-transform: uppercase; -webkit-transition: all 0s ease; -moz-transition: all 0s ease; -o-transition: all 0s ease; transition: all 0s ease;}

.desc{ margin:0; padding:0; text-align: justify; word-break: break-word;}
/*********************ERBAR /************************/

/************************\ MENU /************************/

.links { margin: 2em auto; padding: 0;}
.links ul { padding-left: 10px;}
.links ul, .links ul li { margin:0; padding:0; list-style:none;}
.links ul li { display: inline-block;}
.links ul li a { display: inline-block; text-align:center; text-transform:uppercase; font-weight:900; font-size:1em; margin:0; padding:5px 10px;}
.links ul li a:hover { background: transparent;}
.links ul li a,.links ul li a:hover { -webkit-transition: all 0s ease; -moz-transition: all 0s ease; -ms-transition: all 0s ease; -o-transition: all 0s ease; transition: all 0s ease;}
/************************\ END MENU /************************/

/************************\ SEARCH /************************/
.search { height:25px; margin: 0 auto; padding:0; text-align:center; display: inline-block;}
.search form { margin: 0; padding: 0;}
.search fieldset { margin: 0; padding: 0; border: none;}
.search input { width: 100%; outline: none; display: inline-block; text-align:center; text-transform:uppercase; font-weight:900; font-size:1em; margin:0; padding:5px 10px;}
#sbmt { display:none; }
/************************\ END SEARCH /************************/

/************************\ POST /************************/
.post { position:relative; padding: 5px; vertical-align: middle; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease;}

.music { position:relative;}
.music img { height: 80%; position: absolute; right: 0; z-index: 2; padding: 15px 25px; background: #000;}
.box { background-color: #000; z-index:2;}
.player { height: 150px;}
c
.permalink { margin-top:10px; text-align: left;}

.ask { float: left; width:100%; padding:0 10px; margin-left: 24px;margin-top: -24px;}}
.ask p {padding:0; margin:0;}
.asker_img { float: left; }
.chat { margin: 0; padding: 0 0 15px; list-style: none;}
.label { font-weight: 900; }

.link { text-decoration:underline; font-weight:900;}
/************************\ END POST /************************/

#infscr-loading { position: fixed; bottom: 10px; left: 10px; padding: 5px 10px; background: #FFF; z-index: 99999;}
#infscr-loading img { float: left; width: 25px;}
#infscr-loading div { float: left; line-height: 25px; margin-left: 5px;}

#load { cursor:pointer; font-size: 15px; font-weight: 900; line-height: 90%; text-transform: uppercase; -webkit-transition: all 0s ease; -moz-transition: all 0s ease;     -o-transition: all 0s ease; transition: all 0s ease; }
#scroll-top { display:none; position:fixed; bottom:10px; right:10px; padding: 10px 7px;}

@-webkit-keyframes fade { from{ opacity:0;} to { opacity:1;}}
@-moz-keyframes fade { from{ opacity:0;} to { opacity:1;} }
@-o-keyframes fade { from{ opacity:0;} to { opacity:1;} }
@keyframes fade { from{ opacity:0;} tp{ opacity:1;}}
@-webkit-keyframes cssAnimation { from { -webkit-transform: translate(-100%); } to { -webkit-transform: translate(0); } }
@-moz-keyframes cssAnimation { from { -moz-transform: translate(-100%); }
to { -moz-transform: translate(0); } }
@-o-keyframes cssAnimation { from { -o-transform: translate(-100%); } to { -o-transform: translate(0); } }
@-webkit-keyframes post { from { -webkit-transform: opacity:0; }to { -webkit-transform: opacity:1; } }
@-moz-keyframes post { from { -moz-transform: opacity:0; } to { -moz-transform: opacity:1; } }
@-o-keyframes post { from { -o-transform:opacity:0); } to { -o-transform: opacity:1; } }

/************************\ RESPONSIVE STYLE /************************/
@media only screen and (max-width: 695px){ #foot,.side {position:relative; max-width:330px;} #menu { position:relative!important; max-width:100%;} #content {margin: 0;} .post{width:100%; margin:10px 0;} .text {padding:2em 2em 4em;}.photo {width:100%!important;}}
@media only screen and (min-width: 700px) and (max-width: 999px){ #content {margin-left: 2.1%;} #menu { position:relative!important; max-width: 100%!important;} .links { left: -50%; right: -50%; } #foot { max-width:600px;}}
@media only screen and (min-width: 1000px){ #wrap { max-width: 100%;} #foot,#content{margin-left: 30.7%;} #menu {min-height:100%;} .links {position: absolute; width: 100%; left: 0;} .links ul li,.links ul li a { display: block; margin: 1px 0;} .search{display:block!important;} #menu {-webkit-animation: cssAnimation 2.5s 1 ease-in-out; -moz-animation: cssAnimation 2.5s 1 ease-in-out;-o-animation: cssAnimation 2.5s 1 ease-in-out;} .post {-webkit-animation: post 2.5s 1 ease-in-out; -moz-animation: post 2.5s 1 ease-in-out;-o-animation: post 2.5s 1 ease-in-out;}} 
@media only screen and (max-width: 1000px){ #notes { margin-left: 100px;}}
/************************\ END RESPONSIVE STYLE /************************/