@import url(http://fonts.googleapis.com/css?family=Roboto:100,200,300,400,500);
body,
html,
div,
ul,
h1,
h2,
h3 { margin: 0; padding: 0; font-family: Roboto; -webkit-tap-highlight-color: rgba(0,
	0,
	0,
	0);
	div,
	ul { overflow: hidden; }
-webkit-tap-highlight-color: transparent; }
li { list-style: none; }
ul,
li { margin: 0; padding: 0; }
.actionLayer { width: 100%; height: 100%; position: fixed; z-index: 1; left: 0; top: 0; }
.verticalActions { width: 50px; height: auto; float: left; background: #171717; position: fixed; left: 0; top: 0; z-index: 3; }
.verticalActions li { width: 100%; height: 50px; background: url(../img/movingon/seperator-hor.jpg)left bottom repeat-x; cursor: pointer; text-align: center; line-height: 50px; }
.verticalActions > li:last-child { background: none; }
li a { display: inline-block; width: 100%; height: 100%; }
.verticalActions ul { width: 100%; }
.notification { width: 50px; height: 50px; overflow: hidden; }
.notification .mskLogo { background: #252626; display: block }
.notification .mskNot { background: #32AB1A; display: none; }
.notification .userNot { background: #E75E34; }
.notification .mskLogo img { width: 36px; margin: 16px 0 0 2px }
.notification h3 { color: #FFF; line-height: 50px; }
.verticalActions li.droid img { width: 18px; }
.horizontalActions { width: 100%; height: 50px; float: left; color: #FFF; line-height: 50px; position: fixed; left: 50px; top: 0; z-index: 3 }
.horizontalActions li { display: inline-block; }
.horizontalActions .welcome { padding: 0 20px; background: #171717; float: left; }
.horizontalActions .welcome strong { text-transform: lowercase }
/*.horizontalActions .btns {display: none;}*/
.horizontalActions .btns a { padding: 0 15px; text-align: center; font-weight: bold; float: left; }
.horizontalActions .btns .login { background: #2493E1 }
.horizontalActions .btns .write { background: #EF9B16; }
.horizontalActions .settingsBar { position: absolute; right: 50px; top: 0; background: #171717; height: 50px; overflow: hidden; }
.horizontalActions .settingsBar li { float: right; background: url(../img/movingon/seperator-ver.jpg)right top repeat-y; }
.horizontalActions .settingsBar li:first-child { background: none; }
.settingsBar .search .search-icon { width: 50px; float: right; text-align: center; line-height: 56px; cursor: pointer; }
.settingsBar .search .searchbox { float: right; transition: 0.25s ease-in; overflow: hidden; width: 225px; }
.settingsBar .search .searchbox input { height: 30px; border-radius: 0; background: none; border: 1px solid #222; text-align: left; margin-left: 10px; font-style: italic; color: #CCC; }
.settingsBar .filterBy { font-family: Roboto; font-weight: 200; padding: 0 20px 0 20px; background: url(../img/movingon/icon-down.png) no-repeat 130px; cursor: pointer; }
.settingsBar .filterBy img { margin-left: 5px; }
.horizontalActions .settingsBar .logout { text-align: center; line-height: 57px; height: 50px; width: 50px; }
.horizontalActions .settingsBar .logout img { width: 21px; }
.storyListContainer { width: 90%; position: absolute; left: 80px; top: 80px; z-index: 1; }
.storyListContainer .mskLogoContainer { width: 100%; margin-top: 20%; margin-bottom: 70px }
.storyListContainer .mskLogoContainer .mskLogo { width: 70%; margin: 0 auto; position: relative; display: block; left: -7%; }
.storyListContainer .storyList { width: 100%; overflow: auto; margin-bottom: 10px }
.storyListContainer .storyList ul { overflow: auto }
.storyListContainer .storyList li { background-color: #FFF; width: 40%; padding: 30px; box-shadow: 1px 1px 8px -2px #000; margin: 20px; float: left; }
.storyListContainer .storyList li span { display: block; width: 100%; font-weight: 100; text-decoration: none; color: #737373 }
.storyListContainer .storyList li span.storyHeader { font-size: 2.25em; display: block; height: 55px; overflow: hidden; }
.storyListContainer .storyList li span.fewlines { font-size: 1.2em; margin-top: 10px; display: block; height: 100px; overflow: hidden; }
.storyListContainer .storyList li span.timestamp { font-size: 1.2em; text-align: right; margin-top: 20px; display: block }
.storyListContainer .storyList li.loading span.storyHeader { font-size: 1.5em; color: rgba(255, 255, 255, .8); text-align: center; }
.storyListContainer .storyList li.loading { background: none; }
#containerHeader { text-align: left; margin-left: 20px; font-family: Roboto; font-variant: normal; color: #FFF; font-weight: 200; font-size: 38px; line-height: 30px; }
#containerHeader span { font-size: 18px; }
.splashPage { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: black; }
.splashIcon { position: fixed; top: 50%; margin-top: -200px; left: 50%; margin-left: -200px; }
.horizontalSlideOut { width: 100%; height: 200px; background: #171717; position: fixed; z-index: 2; margin-top: -200px; -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; transition: .25s ease-in-out; }
.horizontalSlideOut .top50pxPadding { width: 100%; height: 52px; background: url(../img/movingon/seperator-hor.jpg)left bottom repeat-x; }
.horizontalSlideOut .left50pxPadding { width: 52px; height: 148px; background: url(../img/movingon/seperator-ver.jpg)right top repeat-y; float: left; }
.horizontalSlideOut .slideoutContent { width: 90%; float: left; height: 100%; padding: 10px }
.horizontalSlideOut .loginBlock { float: left; width: 100%; display: none; }
.horizontalSlideOut .filtersBlock { float: right; width: 100%; height: 120px; margin-right: 37px; display: none; }
.horizontalSlideOut .filtersBlock ul { float: right; background: url(../img/movingon/seperator-ver.jpg)right top repeat-y; width: 180px; height: 120px; }
.horizontalSlideOut .filtersBlock li { display: block; text-align: right; padding-right: 20px; color: #FFF; height: 30px; font-style: italic; font-weight: 300; font-size: 15px; font-family: Roboto; cursor: pointer; }
.loginBlock .login { width: 245px; margin: -5px 0 0 20px; float: left; width: 550px; }
#loginForm { margin: 0; }
#loginForm input,
.register input,
.newUserBlock input { background: none; border-bottom: 2px solid #F2F2F2; border-radius: 0; font-family: Roboto; text-align: left; height: 40px; font-size: 18px; font-weight: 300; color: #FFF; }
input:focus { box-shadow: none; border: none; border-bottom: 2px solid #F2F2F2 }
#loginBtn { width: 50px; height: 50px !important; background: #32AB1A !important; border: none !important; display: none; }
#forgotPasscode { width: 100%; overflow: hidden; font-size: 11px; color: #666; margin-top: 9px; text-align: right; }
.storyPage { width: 800px; left: 50%; margin-left: -400px; margin-top: 40px; }
.storyPage .storyList { width: 700px; float: left; }
.storyPage .storyBox { width: 600px !important; }
.storyPage .storyBox.author { border-top: 5px solid #ff6600; }
.storyPage .storyHeader { height: auto !important; margin-bottom: 20px; }
.storyPage .fewlines { height: auto !important; font-weight: 300 !important; line-height: 1.7em; }
.storyPage .showResponse { cursor: pointer; background-color: rgba(255, 255, 255, .9) !important; }
.storyPage .showResponse h2 { font-size: 1.687em; font-weight: 100; text-align: center; color: #333; }
.storyBtns { width: 100px; float: right; position: fixed; margin-top: 50px }
.storyBtns span { display: block; margin-top: 7px }
.storyBtns img { width: 60px; cursor: pointer }
.pageShade { width: 100%; height: 100%; background: #000; position: fixed; opacity: .6; z-index: 1; }
.page-story .horizontalActions { background: #171717 }
.storyBox.addComment { overflow: hidden; width: 620px !important; padding-bottom: 10px !important; padding-right: 10px !important; }
.storyBox.addComment { border: 2px dashed #FFF; background: rgba(255, 255, 255, .1) !important }
.storyBox.addComment .commentBox { background: none; color: #FFF; width: 100%; height: 200px; border: none; resize: none; font-family: Roboto; font-weight: 300; font-size: 20px; }
.storyBox.addComment .commentBox:focus { outline: none !important; border: none !important; }
.storyBox.addComment .doneBtn { cursor: pointer }
.storyBox.addComment .doneBtn img { width: 60px; float: right; }
::-webkit-input-placeholder { color: #CCC; }
:-moz-placeholder { /* Firefox 18- */ color: #CCC; }
::-moz-placeholder { /* Firefox 19+ */   color: #CCC; }
:-ms-input-placeholder { color: #CCC; }
#theMask { }
#postingZone { margin: 100px auto; float: none; height: 360px; overflow: hidden; }
#captchaSpace { background: url(../img/dragInstruction.png) 373px 56px no-repeat; }
#forgotPasscode span { display: inline-block; float: left; }
#forgotPasscode span.right { float: right; }
/* Register */
.register { float: left; overflow: hidden; }
.register span { color: #FFF; text-transform: uppercase; float: left; font-size: 15px; margin-top: 50px; }
.register input { margin-top: 35px; margin-left: 25px; float:; }
.newUserBlock { margin-left: 10px; overflow: hidden; display: none; width: 100%; }
.newUserBlock input { margin-right: 45px; float: left; }
.newUserBlock a { margin-right: 45px; float: left; margin-top: 3px; }
.newUserBlock a img { width: 60px; cursor: pointer; }
/* LoginPanel Overwrite */
#loginPanel { width: 245px; float: left; }
button.msk-go-anon { border: none; background: #EF9B16; color: #FFF; padding: 15px 20px; font-size: 15px; margin: 35px; cursor: pointer; }
.slide-out-block-info { color: #AFA6A6; padding-bottom: 10px; padding-top: 10px; }
@media all and (max-width:699px) {
	.horizontalSlideOut .slideoutContent { width: initial; float: left; }
	.horizontalSlideOut { width: 1000px; }
	.horizontalSlideOut .slideoutContent > * { float: left; }
}
/* Me Page */
#myStories a { height: initial; }
#dataContainer #homeHeader { display: none; }
#myBookmarks { display: none; }
.mePanel { float: right; }
#notifier { display: none; }
#helloUser { margin-left: 0; }
#meSpace #userBar { margin-right: 95px; }
#meSpace #leftPanel { float: none !important; margin: 0 auto; background: none !important; }
#meSpace #userName > span { position: relative; }
#meSpace #settingSubmenu { position: absolute; right: 0; }
.shareButtons { display: block; width: 100%; text-align: center; }
.shareButtons a { margin-right: 5px; width: auto; }
#helloUser { }
#myStories { max-width: 550px; margin: 0 auto; width: 100%; }
#myStories li { float: none; width: 85%; margin-left: 0; border-left: 10px solid #CCC; text-align: center; font-weight: 200 }
#myStories li .storyHeader { margin-bottom: 5px; font-weight: 300 }
#myStories li#helloUser { border-color: #fff; }
#myStories li.happy { border-color: #3498DB; }
#myStories li.sad { border-color: #7F8C8D; }
#myStories li.excited { border-color: #F39C12; }
#myStories li.angry { border-color: #C0392B; }
#myStories li.depressed { border-color: #2C3E50; }
#myStories li.scared { border-color: #16A085; }
#myStories li.tender { border-color: #E2413E; }
#myStories li.neutral { border-color: #9B1881 }
#myStories a { display: block; }
#helloUser li { background: transparent; width: auto; padding: 0; box-shadow: none; margin: 0; float: none; display: inline-block; text-align: center; margin: 20px 15px; font-size: 13px; margin-bottom: 0; border: none; }
#myStories .me-count { background: red; width: 70px; height: 70px; line-height: 70px; color: #FFF; font-size: 30px; }
#myStories .me-count.stories { background: #1488C8; }
#myStories .me-count.loves { background: #E2413E; }
#myStories .me-count.responses { background: #F7E041; }
#myStories .me-count.responded { background: #1F518B; }
.story-stat img { margin-left: 20px; margin-right: 5px; position: relative; top: 3px; }
.spread-love { background: #E2413E !important; border-color: #E2413E !important; }
.spread-love h2 { color: #FFF; text-align: center; font-size: 32px; font-weight: 100; margin-bottom: 20px; }
.spread-love span { color: #FFF !important; text-align: center; }
.me-post-type { text-align: left; position: relative; left: -20px; top: 20px; }
.pinned { background-image: url(../img/msk-pinned.jpg); background-repeat: no-repeat; background-position: right top; }
.storyPage .showResponse.you { background-image: url(../img/msk-you.jpg); background-repeat: no-repeat; background-position: left bottom }
.me > a,
.loved > a,
.droid> a , .shop > a{ position: relative; }
.new { display:none; position: absolute; top: 7px; line-height: 10px; color: #FFF; background: #1488C8; font-size: 10px; text-transform: uppercase; right: -23px; padding: 3px; }
.updated { right: -46px; background: #C0392B; }


/* added by me for spritz */
#startSpritz {cursor:pointer;}
.spritzer-wrapper {display:none;text-align:center;}
.spritzer-dropdown-menu li {padding:0px !important;margin:0px !important;width:auto !important; box-shadow: none !important;}

.shop .new{display: block;
background: none repeat scroll 0% 0% #F60;
left: 40px;
width: 70px;
top: 15px;}

/*.showComment, #love-me {display: none;}*/
