@import url(https://fonts.googleapis.com/css?family=Roboto:400,700);

body, ul, li, p, h1, h2, form, input { margin: 0; padding: 0; }

li { list-style-type: none; }

body { background-color: rgb(60,60,60); color: rgb(160,160,160); font-family: 'Roboto', sans-serif; font-size: 13px; text-align: center; }
img { display: block; border: 0 none; }
.speedbar img { display: inline; }
a { color: rgb(48,48,176); text-decoration: underline; transition: 0.1s ease; }
a:hover { text-decoration: none; }

h1 { margin: 18px 5px 0 5px; color: rgb(0,0,0); text-transform: uppercase; font-size: 26px; line-height: 28px; }
h2 { margin: 18px 5px 0 5px; color: rgb(0,0,0); font-size: 24px; line-height: 26px; }

.main-wrapper { background-color: rgb(229,173,0); color: rgb(0,0,0); box-shadow: 0 5px 15px -7px rgb(0,0,0); margin: 0 auto; width: 96%; text-align: center; }

.head { padding: 0 0 10px 0; }
.logo { display: inline-block; vertical-align: middle; margin: 10px 5px 0 5px; }
.logo a { color: rgb(0,0,0); text-decoration: none; display: inline-block; height: 30px; line-height: 30px; font-size: 29px; text-transform: uppercase; font-weight: bold; }
.logo a span { color: rgb(255,255,255); text-shadow: 1px 1px 0 rgb(20,20,20);}
.head-calendar-day { color: rgb(40,40,40); line-height: 18px; }
.head-calendar-day a { color: rgb(20,20,20); line-height: 18px; height: auto; font-size: 13px; text-transform: capitalize; font-weight: normal; display: inline; text-decoration: underline; }
.head-calendar-day a:hover { color: rgb(48,48,176); }
.head-right-bl { display: inline-block; vertical-align: middle; margin: 10px 5px 0 5px; }
.head-right-bl a { display: block; margin: 0; }
.head-right-bl a img { width: 100%; max-width: 720px; height: auto; }

.top-menu { background-color: rgb(40,40,40); background: linear-gradient(to bottom,rgb(60,60,60),rgb(20,20,20)); overflow: hidden; padding: 0 0 10px 0;}
.top-menu ul { font-size: 0; }
.top-menu li { display: inline-block; vertical-align: top; text-transform: uppercase; margin: 10px 5px 0 5px; height: 25px; line-height: 25px; font-size: 12px; border: 1px solid rgb(70,70,70); }
.top-menu li a { color: rgb(255,255,255); text-decoration: none; display: block; padding: 0 5px; }
.top-menu li a:hover { background-color: rgb(80,80,80); }
.top-menu li.submit-story a { background-color: rgb(98,155,64); background: linear-gradient(to bottom,rgb(118,175,84),rgb(78,135,44)); font-weight: bold; transition: none; }
.top-menu li.submit-story a:hover { background: rgb(68,125,34); }

.content-left { padding: 0 10px 20px 10px; }
.bookmark-block { margin: 20px 0 0 0; padding-bottom: 15px; border-bottom: 1px solid rgb(209,153,0); box-shadow: 0 1px 0 0 rgb(249,193,20); }
.bookmark-us-link { display: inline-block; vertical-align: middle; margin: 5px 5px 0 5px; font-weight: bold; line-height: 20px; } 
.bookmark-buttons { display: inline-block; vertical-align: middle; margin: 5px 5px 0 5px; line-height: 20px; }
.bookmark-our { display: inline-block; vertical-align: middle; margin: 0 5px; line-height: 20px; }
.bookmark-block .addthis_toolbox { display: inline-block; vertical-align: middle; margin: 5px 5px 0 5px; line-height: 20px; }
.bookmark-block .addthis_toolbox a { float: none; display: inline-block; vertical-align: top; } 

.main-top-desc { line-height: 22px; }
.main-top-desc p { margin: 20px 0 0 0; clear: both; }
.main-top-desc-bold { font-weight: bold; }

.other-desc { border-top: 1px solid rgb(249,193,20); box-shadow: 0 -1px 0 0 rgb(209,153,0); margin: 20px 5px 0 5px; line-height: 22px; font-weight: bold; font-size: 16px; text-transform: uppercase; }
.other-desc p { margin: 15px 0 0 0; clear: both; }
.other-desc-top { border: 0 none; box-shadow: none; margin-top: 0; }

.select-category-form { border-top: 1px solid rgb(249,193,20); box-shadow: 0 -1px 0 0 rgb(209,153,0); margin: 20px 0 0 0; padding: 20px 0 0 0; }
.select-category-form select { cursor: pointer; font-family: 'Roboto', sans-serif; display: block; outline-color: rgb(48,48,176); height: 30px; line-height: 30px; border-radius: 5px; border: 1px solid rgb(190,190,190); width: 100%; }

.sort-block { border-top: 1px solid rgb(249,193,20); box-shadow: 0 -1px 0 0 rgb(209,153,0); margin: 20px 0 0 0; }
.sort-stories { font-size: 0; }
.sort-stories a { border-right: 1px solid rgb(209,153,0); box-shadow: 1px 0 0 0 rgb(249,193,20); color: rgb(40,40,40); text-decoration: none; line-height: 16px; font-size: 14px; font-weight: bold; display: inline-block; vertical-align: top; margin: 15px 5px 0 5px; padding-right: 10px; }
.sort-stories a:hover, .sort-stories a.active { color: rgb(48,48,176); } 

.story-short-block { border-top: 1px solid rgb(249,193,20); box-shadow: 0 -1px 0 0 rgb(209,153,0); padding-top: 15px; margin: 20px 5px 0 5px; line-height: 20px; }
.story-short-title-bl { overflow: hidden; }
.story-short-title-bl a, .story-short-title-bl span { display: inline-block; vertical-align: middle; margin: 0 5px; }
.story-short-title-bl a.story-short-title { display: block; font-weight: bold; font-size: 16px; margin: 0; }
.story-short-title-bl span { font-weight: bold; }
.story-short-block p { margin: 5px 0 0 0; clear: both; }  

.story-short-info { overflow: hidden; font-size: 0; }
.story-short-info-bl { font-size: 13px; background-color: rgb(232,181,25); border: 1px solid rgb(209,153,0); color: rgb(40,40,40); display: inline-block; vertical-align: top; border-radius: 3px; height: 25px; line-height: 25px; padding: 0 10px; margin: 5px 5px 0 5px; }
.story-short-info-bl span { color: rgb(40,40,40); }
.story-short-info-category { padding: 0; background: none; border: 0 none; overflow: hidden; }
.story-short-info-category span { display: block; float: left; color: rgb(20,20,20); text-transform: uppercase; margin-right: 5px; }
.story-short-info-category a { display: block; float: left; background-color: rgb(237,209,127); border: 1px solid rgb(40,40,40); color: rgb(20,20,20); line-height: 23px; text-decoration: none; padding: 0 10px; border-radius: 3px; }
.story-short-info-category a:hover { background-color: rgb(48,48,176); color: rgb(255,255,255); }

.read-full-story { font-size: 13px; display: inline-block; vertical-align: top; border-radius: 3px; height: 25px; line-height: 25px; margin: 5px 5px 0 5px; }
.read-full-story a { display: block; background-color: rgb(40,40,40); color: rgb(255,255,255); text-decoration: none; padding: 0 10px; border-radius: 3px; }
.read-full-story a:hover { background-color: rgb(48,48,176); }

.hori-bl { border-top: 1px solid rgb(249,193,20); box-shadow: 0 -1px 0 0 rgb(209,153,0); padding-top: 20px; margin: 20px 5px 0 5px; text-align: center; }
.hori-bl a { display: inline-block; vertical-align: top; }
.hori-bl img { width: 100%; max-width: 720px; height: auto; }

.content-right { background-color: rgb(219,163,0); box-shadow: inset 0 5px 15px -10px rgb(119,63,0); color: rgb(0,0,0); padding: 10px 5px 20px 5px; }

.search-form { display: inline-block; vertical-align: top; margin: 10px 5px 0 5px; }
.search-form-title { color: rgb(40,40,40); display: block; font-size: 14px; font-weight: bold; text-transform: uppercase; }
.search-form form { height: 30px; line-height: 30px; overflow: hidden; border-radius: 3px; width: 100%; max-width: 198px; border: 1px solid rgb(40,40,40); }
.search-form input, .search-form button  { font-family: 'Roboto', sans-serif; font-size: 14px; border: 0 none; height: 30px; line-height: 30px; display: block;  }
.search-form input { background-color: rgb(255,255,255); color: rgb(40,40,40); outline-color: rgb(48,48,176); width: 80%; float: left; }
.search-form button { background-color: rgb(40,40,40); color: rgb(255,255,255); text-align: center; width: 20%; cursor: pointer; float: right; }
.search-form button:hover { background-color: rgb(48,48,176); }
.search-form input.full-text-input { float: none; display: inline; height: auto; line-height: auto; width: auto; }

.right-block { display: block; margin: 20px 5px 0 5px; border-top: 1px solid rgb(249,193,20); box-shadow: 0 -1px 0 0 rgb(199,143,0); padding-top: 15px; font-size: 13px; }
.right-block-title { color: rgb(20,20,20); display: block; font-size: 14px; font-weight: bold; text-transform: uppercase; }
.right-block-first { border: 0 none; box-shadow: none; padding-top: 0; }
.right-block p { margin: 5px 0 0 0; }
.right-vert-bn { display: none; text-align: center; }
.right-vert-bn a { display: inline-block; vertical-align: top; }

.right-block-cats-list {display: block; margin: 20px 5px 0 5px; border-top: 1px solid rgb(249,193,20); box-shadow: 0 -1px 0 0 rgb(199,143,0); padding-top: 15px; font-size: 0; }
.right-block-cats-list li { display: inline-block; vertical-align: top; margin: 10px 5px 0 5px; font-size: 12px; }
.right-block-cats-list li a { background-color: rgb(237,209,127); border-radius: 3px; color: rgb(40,40,40); height: 25px; line-height: 25px; text-decoration: none; display: block; padding: 0 8px; }
.right-block-cats-list li a:hover { background-color: rgb(48,48,176); color: rgb(255,255,255); }

.random-read-more { text-align: right; }

.story-top-block { margin: 20px 0 0 0; overflow: hidden; }
.speedbar { font-weight: bold; }
.story-top-block h1 { display: inline-block; vertical-align: top; }
.story-parts { color: rgb(129,73,0); font-size: 16px; line-height: 28px; display: block; margin-top: 0; }

.story-info { overflow: hidden; margin-top: 15px; }
.story-info-bl { font-size: 13px; background-color: rgb(232,181,25); border: 1px solid rgb(209,153,0); color: rgb(40,40,40); display: inline-block; vertical-align: top; border-radius: 3px; height: 25px; line-height: 25px; padding: 0 10px; margin: 5px 5px 0 5px; }
.story-info-bl img { margin: 6px 0 7px 0 }

.story-info-bl5 { font-size: 18px; background-color: rgb(232,181,25); border: 1px solid rgb(209,153,0); color: rgb(40,40,40); display: inline-block; vertical-align: top; border-radius: 3px; height: 40px; line-height: 25px; padding: 0 7px; margin: -5px 5px 0 5px; }
.story-info-bl5 img { margin: 6px 0 7px 0 }


.story-block { margin: 20px 5px 0 5px; border-top: 1px solid rgb(249,193,20); box-shadow: 0 -1px 0 0 rgb(209,153,0); }
.story-block p { margin: 15px 0 0 0; line-height: 20px; }

.share-block { overflow: hidden; margin: 15px 0 0 0; }
.share-block .addthis_toolbox a { display: inline-block; vertical-align: top;  float: none; }

.pages {  font-size: 16px; font-weight: bold; text-transform: uppercase; margin: 20px 5px 0 5px; padding: 15px 0 0 0; border-top: 1px solid rgb(249,193,20); box-shadow: 0 -1px 0 0 rgb(209,153,0); }

.forms { margin: 20px 0 0 0; border-top: 1px solid rgb(249,193,20); box-shadow: 0 -1px 0 0 rgb(199,143,0); padding-top: 15px; }
.review-title { color: rgb(40,40,40); text-transform: uppercase; font-size: 16px; line-height: 18px; font-weight: bold; margin: 0 5px; }
.review-more-links { margin: 5px 5px 0 5px; font-size: 13px; line-height: 25px; }
.review-more-links a { margin-left: 5px; margin-right: 5px; }

.form-fields { overflow: hidden; margin: 20px 0 0 0; font-size: 0; }
.form-fields-bl { display: inline-block; vertical-align: top; margin: 0 2%; width: 46%; max-width: 240px; font-size: 14px; }
.form-fields-bl input { display: block; padding: 0 2%; width: 96%; border: 1px solid rgb(209,153,0); outline-color: rgb(48,48,176); background-color: rgb(255,255,255); font-family: 'Roboto', sans-serif; color: rgb(115,115,115); border-radius: 3px; height: 30px; line-height: 30px; font-size: 14px; }
.forms textarea { margin: 20px 0 0 0; padding: 10px; width: 96%; max-width: 640px; height: 100px; max-height: 320px; border: 1px solid rgb(209,153,0); outline-color: rgb(48,48,176); background-color: rgb(255,255,255); font-family: 'Roboto', sans-serif; color: rgb(115,115,115); border-radius: 3px;  }

.form-fields button { background-color: rgb(40,40,40); color: rgb(255,255,255); border-radius: 3px; cursor: pointer; transition: 0.1s ease; font-family: 'Roboto', sans-serif;  font-size: 13px; font-weight: bold; display: inline-block; vertical-align: top; margin: 0 2%; width: 46%; max-width: 240px; text-align: center; border: 0 none; height: 30px; line-height: 30px; }
.form-fields button:hover { background-color: rgb(48,48,176); }


.previews-block { font-size: 0; padding: 5px 0 0 0; }
.preview-bl { background-color: rgb(232,181,25); border: 1px solid rgb(209,153,0); width: 46%; display: inline-block; vertical-align: top; margin: 10px 5px 0 5px; font-size: 12px; padding-bottom: 10px; }
.preview-bl a { display: inline-block; vertical-align: top; overflow: hidden; font-size: 13px; margin: 10px 10px 0 10px; }
.preview-bl img { margin: 5px auto 0 auto; }
.preview-info { margin: 5px 10px 0 10px; color: rgb(132,81,0); }
.preview-info span { color: rgb(20,20,20); }

.preview-bl-stories a { font-weight: bold; font-size: 14px; } 

.preview-bl-links { width: 98%; }
.preview-bl-links .preview-info { height: 30px; overflow: hidden; line-height: 15px; }
.preview-bl-links a { color: rgb(40,40,40); text-transform: uppercase; font-size: 15px; font-weight: bold; }
.preview-bl-links a i, .preview-bl-links a:hover { color: rgb(48,48,176); }

.review-block { margin: 20px 5px 0 5px; border-top: 1px solid rgb(249,193,20); box-shadow: 0 -1px 0 0 rgb(209,153,0); padding-top: 15px; }
.review-author { color: rgb(129,73,0); margin-bottom: 5px; }







.footer { text-align: center; margin: 0 auto; padding: 0 0 20px 0; font-size: 13px; }
.footer p { margin: 20px 0 0 0; }
.footer-submit-story { font-size: 14px; color: rgb(78,135,44); font-weight: bold; text-transform: uppercase; }
.footer a { color: rgb(255,255,255); }
.bottom-bn { margin: 20px 0 0 0; }
.bottom-bn a { display: inline-block; vertical-align: top; }

.sites-link-block { border-top: 1px solid rgb(249,193,20); box-shadow: 0 -1px 0 0 rgb(209,153,0); padding-top: 15px; margin: 20px 5px 0 5px; line-height: 20px; }


.control-form { border-top: 1px solid rgb(249,193,20); box-shadow: 0 -1px 0 0 rgb(209,153,0); margin: 20px 5px 0 5px; }
.control-block { margin: 15px 0 0 0; overflow: hidden; }
.control-block span { display: block; margin-bottom: 3px; }
.control-block span.control-block-small { font-size: 12px; }
.control-block input, .control-block button { display: inline-block; vertical-align: top; padding: 0 1%; width: 98%; max-width: 300px; border: 1px solid rgb(209,153,0); outline-color: rgb(48,48,176); background-color: rgb(255,255,255); font-family: 'Roboto', sans-serif; color: rgb(115,115,115); border-radius: 3px; height: 30px; line-height: 30px; font-size: 14px; }
.control-block button { margin-top: 10px; background-color: rgb(40,40,40); color: rgb(255,255,255); cursor: pointer; border: 0 none; transition: 0.1s ease; }
.control-block button:hover { background-color: rgb(48,48,176); }

.control-block select { height: 30px; line-height: 30px; border-radius: 3px; border-color: rgb(200,200,200); } 

.control-block-add-story input, .control-block-add-story button { max-width: 600px; }
.control-block-add-story span { font-weight: bold; }
.control-block-add-story textarea { display: inline-block; vertical-align: top; padding: 1%; width: 98%; max-width: 600px; border-color: rgb(200,200,200); border-radius: 3px; outline-color: rgb(48,48,176); }

.user-area { overflow: hidden; }
.story-edit { font-size: 12px; margin: 5px 0 0 0; }


.profile-info { color: rgb(112,61,0); }
.profile-info span, .profile-info a { font-weight: bold; }
.profile-info span { color: rgb(20,20,20); }

.profile-share { border-bottom: 0 none; box-shadow: 0 -1px 0 0 rgb(209,153,0); border-top: 1px solid rgb(249,193,20); padding-top: 15px; }
.profile-share .bookmark-our { text-transform: uppercase; font-weight: bold; font-size: 12px; }

.user-stories { box-shadow: 0 -1px 0 0 rgb(209,153,0); border-top: 1px solid rgb(249,193,20); }
.user-stories .story-short-block { border: 0 none; box-shadow: none; padding: 0; margin-top: 20px; }


.profile-rate-author { margin: 20px 5px 0 5px; box-shadow: 0 -1px 0 0 rgb(209,153,0); border-top: 1px solid rgb(249,193,20); padding-top: 17px; line-height: 30px; text-transform: uppercase; font-weight: bold; font-size: 12px; }
.profile-rate-author select { border-radius: 3px; border-color: rgb(209,153,0); margin-left: 5px; }
.profile-rate-author input { background-color: rgb(40,40,40); color: rgb(255,255,255); border-radius: 3px; border: 0 none; height: 19px; outline: none; margin-left: 5px; cursor: pointer; padding: 0 10px; }
.profile-rate-author input:hover { background-color: rgb(48,48,176); }




@media screen and (min-width: 400px) {
.preview-bl-links { width: 46%; }
}


@media screen and (min-width: 600px) {
.preview-bl { width: 29%; }
.preview-bl-links { width: 46%; }
}



@media screen and (min-width: 1015px) {
body { font-size: 15px; }
h1, h2 { margin: 18px 0 0 0; }
.head { display: table; width: 960px; padding: 20px; }
.logo { display: table-cell; text-align: left; }

.head-right-bl { display: table-cell; text-align: right;  }
.head-right-bl a { display: inline-block; vertical-align: middle; margin: 0; }
.main-wrapper { width: 1000px; }
.top-menu { padding: 0; }
.top-menu li { display: block; float: left; margin: 0; border: 0 none; border-right: 1px solid rgb(70,70,70); height: 40px; line-height: 40px; font-size: 10px; }
.top-menu li a { padding: 0 5px; }
.top-menu li.submit-story { float: right; border-right: 0 none; border-left: 1px solid rgb(70,70,70); }
.head-calendar-day a { font-size: 15px; }
.content { display: table; width: 100%; }
.content-left { display: table-cell; vertical-align: top; padding: 0 20px 20px 20px; text-align: justify; }
.bookmark-block { overflow: hidden; }
.bookmark-us-link { display: block; float: left; margin-left: 0; margin-right: 10px; }
.bookmark-buttons { display: block; float: left; overflow: hidden; margin-left: 0; }
.bookmark-our { display: block; float: left; margin-left: 0; }
.bookmark-block .addthis_toolbox { overflow: hidden; margin: 0 5px 0 -2px; }
.bookmark-block .addthis_toolbox a { float: left; display: block; }
.sort-stories a { margin: 15px 10px 0 0; }
.story-short-block { margin: 20px 0 0 0; }
.story-short-title-bl a, .story-short-title-bl span { display: inline-block; vertical-align: middle; margin: 0 0 0 10px;; }
.story-short-title-bl a.story-short-title { display: inline-block; vertical-align: middle; font-size: 18px; }
.story-short-info-bl { margin: 5px 10px 0 0; }
.read-full-story { float: right; margin: 5px 0 0 10px; }
.previews-block { text-align: left; }
.preview-bl { margin: 10px 10px 0 0; width: 31%; }
.preview-bl img { margin: 5px 10px 0 8px; }
.preview-bl-links { width: 46%; }
.pages { margin: 20px 0 0 0; }
.content-right { box-shadow: inset 5px 0 15px -10px rgb(130,130,130);  display: table-cell; vertical-align: top; padding: 0 20px 20px 20px; width: 200px; text-align: center; }

.search-form { display: block; margin: 20px 0 0 0; }
.search-form-title, .right-block-title { text-align: left; }
.right-block { text-align: justify; }
.right-vert-bn { display: block; text-align: center; }
.right-block-cats-list li { display: block; margin: 10px 0 0 0; text-align: left; }
.right-block-cats-list li a { padding: 0; background: none; height: auto; line-height: 15px; }
.right-block-cats-list li a i { color: rgb(48,48,176); }
.right-block-cats-list li a:hover { background: none; color: rgb(48,48,176); }
.story-info-bl { margin: 5px 10px 0 0; }
.story-parts { display: inline-block; vertical-align: middle; margin-top: 18; }
.story-block { margin: 20px 0 0 0; }
.share-block { margin: 15px 0 0 -2px; }
.share-block .addthis_toolbox a { display: block; float: left; margin: 0 10px 0 0; }
.review-title { margin: 0; }
.review-more-links { margin: 10px 0 0 0; }
.form-fields-bl, .form-fields button  { width: 240px; margin: 0 5px 0 0; }
.footer { width: 1000px; }

.review-block { margin: 20px 0 0 0; }
.sites-link-block { margin: 20px 0 0 0; }
.other-desc { margin: 20px 0 0 0; }
.control-form { margin: 20px 0 0 0; }
.profile-rate-author { margin: 20px 0 0 0; }
}

@media screen and (min-width: 1265px) {
.head { width: 1210px; }
.top-menu li { font-size: 12px; }
.top-menu li a { padding: 0 10px; }
.main-wrapper { width: 1250px; }
.preview-bl { width: 23%; }
.preview-bl-links { width: 23%; }
.footer { width: 1250px; }
}

.wrapper-enter { max-width: 900px; }
.wrapper-enter .head { max-width: 860px; text-align: center; paddign: 10px 20px; }
.wrapper-enter .head .logo { display: inline-block; margin: 0; }
.enter-page-large { font-size: 20px; font-weight: bold; }
.wrapper-enter .main-top-desc textarea { border-radius: 3px; border-color: rgb(200,200,200); width: 96%; max-width: 600px; margin: 0 auto; }
.enter-middle { margin: 25px 20px 0 20px; border-top: 1px solid rgb(249,193,20); box-shadow: 0 -1px 0 0 rgb(209,153,0); }
.enter-button { background-color: rgb(40,40,40); color: rgb(255,255,255); display: inline-block; vertical-align: top; padding: 0 60px; height: 50px; line-height: 50px; font-size: 22px; text-transform: uppercase; text-decoration: none; }
.enter-button:hover { background-color: rgb(48,48,176); }
.enter-top { margin-top: 0; }