Index: ow/static/______css/__forms.css
===================================================================
--- ow/static/______css/__forms.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/______css/__forms.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,184 @@
+
+/*
+  Styles for the forms
+*/
+
+/* Basic/common styles for buttons */
+
+.button {
+  box-sizing: border-box;
+  display: inline-block;
+  position: relative;
+  max-width: 100%;
+  text-align: center;
+  vertical-align: middle;
+  cursor: pointer;
+  border: 1px solid transparent;
+  text-decoration: none;
+  white-space: nowrap;
+  margin: 0;
+  padding: 0.5em 1em;
+  border-radius: 4px;
+  overflow: hidden;
+  background: none;
+  color: black;
+  font-family: inherit;
+  font-style: normal;
+  font-size: 1em;
+  line-height: 1.25;
+  text-overflow: ellipsis;
+  text-transform: uppercase;
+}
+
+.button-normal {
+  letter-spacing: 0.02em;
+  font-weight: 300;
+}
+
+.button-normal:hover {
+  text-decoration: none;
+}
+
+.button-normal {
+  background-image: linear-gradient(to top, #f1f1f1, white);
+  color: #252525;
+  border-color: #bebebe;
+}
+
+.button-normal:hover {
+  background: #f1f1f1;
+}
+
+.button-neutral {
+  background-color: #bebebe;
+  color: white;
+}
+
+.button-neutral:hover {
+  background-color: #323232;
+}
+
+.button-action {
+  background-image: linear-gradient(to top, #F89507, #fbbb60);
+  color: white;
+  border-color: #e48906;
+}
+
+.button-action:hover {
+  background: #F89507;
+}
+
+.button-important {
+  background-image: linear-gradient(to top, #c35857, #d07d7d);
+  color: white;
+  border-color: #aa3e3d;
+}
+
+.button-important:hover {
+  background: #c35857;
+}
+
+.button-alt {
+  background-color: #c35857;
+  color: white;
+}
+
+.button-alt:hover {
+  background-color: #aa3e3d;
+}
+
+.button-important {
+  background-color: #E45759;
+  color: white;
+}
+
+.button-important:hover {
+  background-color: #b81d20;
+}
+
+.button-s {
+  font-size: 13px;
+  font-size: 0.8125rem;
+  font-weight: 700;
+}
+
+
+/* Edit profile form */
+
+.ow-forms form {
+    width:100%;
+    max-width:40%
+}
+
+.ow-forms ul.error {
+    margin: 0px;
+    margin-bottom: 5px;
+    padding: 0px;
+    list-style-type:none;
+}
+
+.ow-forms ul.error li {
+    border: 1px solid red;
+    width:100%;
+    padding:.5em .75em;
+    border:1px solid #EE4056;
+    border-radius:2px
+}
+
+.ow-forms legend {
+    display:none
+}
+
+.ow-forms fieldset {
+    border:none;
+    border-bottom: 2px solid #e1e1e1;
+}
+
+.ow-forms fieldset>div {
+    margin-bottom:1.5em
+}
+
+.ow-forms input {
+    width:100%;
+    padding:.5em .75em;
+    border:1px solid #e1e1e1;
+    border-radius:2px
+}
+
+.ow-forms input.number {
+    /* width up to three characters */
+    width: 3em;
+}
+
+.ow-forms input.date {
+    /* width up to 10 characters */
+    width: 7em;
+}
+
+.ow-forms input.time {
+    /* width up to 6 characters */
+    width: 5em;
+}
+
+.ow-forms input:focus {
+    border-color: #333333;
+}
+
+.ow-forms input.button {
+    width: 20%;
+}
+
+.ow-forms label {
+    display:block;
+    font-size:14px;
+    font-size:.875rem;
+    color:#959595;
+    margin-bottom:.25em
+}
+
+.ow-forms div.input-container {
+    display: flex;
+    flex-flow: row wrap;
+    justify-content: space-between;
+    align-items: center;
+}
Index: ow/static/______css/__main.css
===================================================================
--- ow/static/______css/__main.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/______css/__main.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,837 @@
+img,legend {
+    border:0
+}
+
+legend,td,th {
+    padding:0
+}
+
+.add-workout,.button,sub,sup {
+    position:relative
+}
+
+.button,.header-content a,.workout-resume ul a,.workout-title a {
+    text-decoration:none
+}
+
+@font-face {
+    font-family:'Open Sans';
+    font-style:normal;
+    font-weight:300;
+    src:local('Open Sans Light'),local('OpenSans-Light'),url(http://fonts.gstatic.com/s/opensans/v13/DXI1ORHCpsQm3Vp6mXoaTYnF5uFdDttMLvmWuJdhhgs.ttf) format('truetype')
+}
+
+@font-face {
+    font-family:'Open Sans';
+    font-style:normal;
+    font-weight:400;
+    src:local('Open Sans'),local('OpenSans'),url(http://fonts.gstatic.com/s/opensans/v13/cJZKeOuBrn4kERxqtaUH3aCWcynf_cDxXwCLxiixG1c.ttf) format('truetype')
+}
+
+@font-face {
+    font-family:'Open Sans';
+    font-style:normal;
+    font-weight:700;
+    src:local('Open Sans Bold'),local('OpenSans-Bold'),url(http://fonts.gstatic.com/s/opensans/v13/k3k702ZOKiLJc3WVjuplzInF5uFdDttMLvmWuJdhhgs.ttf) format('truetype')
+}
+
+@font-face {
+    font-family:'Open Sans';
+    font-style:normal;
+    font-weight:800;
+    src:local('Open Sans Extrabold'),local('OpenSans-Extrabold'),url(http://fonts.gstatic.com/s/opensans/v13/EInbV5DfGHOiMmvb1Xr-honF5uFdDttMLvmWuJdhhgs.ttf) format('truetype')
+}
+
+@font-face {
+    font-family:'Open Sans';
+    font-style:italic;
+    font-weight:300;
+    src:local('Open Sans Light Italic'),local('OpenSansLight-Italic'),url(http://fonts.gstatic.com/s/opensans/v13/PRmiXeptR36kaC0GEAetxrfB31yxOzP-czbf6AAKCVo.ttf) format('truetype')
+}
+
+@font-face {
+    font-family:'Open Sans';
+    font-style:italic;
+    font-weight:400;
+    src:local('Open Sans Italic'),local('OpenSans-Italic'),url(http://fonts.gstatic.com/s/opensans/v13/xjAJXh38I15wypJXxuGMBp0EAVxt0G0biEntp43Qt6E.ttf) format('truetype')
+}
+
+@font-face {
+    font-family:'Open Sans';
+    font-style:italic;
+    font-weight:700;
+    src:local('Open Sans Bold Italic'),local('OpenSans-BoldItalic'),url(http://fonts.gstatic.com/s/opensans/v13/PRmiXeptR36kaC0GEAetxp_TkvowlIOtbR7ePgFOpF4.ttf) format('truetype')
+}
+
+html {
+    font-family:sans-serif;
+    -ms-text-size-adjust:100%;
+    -webkit-text-size-adjust:100%;
+    box-sizing:border-box
+}
+
+article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary {
+    display:block
+}
+
+audio,canvas,progress,video {
+    display:inline-block;
+    vertical-align:baseline
+}
+
+audio:not([controls]) {
+    display:none;
+    height:0
+}
+
+.hide,[hidden],template {
+    display:none
+}
+
+a {
+    background-color:transparent
+}
+
+a:active,a:hover {
+    outline:0
+}
+
+abbr[title] {
+    border-bottom:1px dotted
+}
+
+b,optgroup,strong {
+    font-weight:700
+}
+
+dfn {
+    font-style:italic
+}
+
+h1 {
+    font-size:2em;
+    margin:.67em 0
+}
+
+mark {
+    background:#ff0;
+    color:#000
+}
+
+small {
+    font-size:80%
+}
+
+sub,sup {
+    font-size:75%;
+    line-height:0;
+    vertical-align:baseline
+}
+
+sup {
+    top:-.5em
+}
+
+sub {
+    bottom:-.25em
+}
+
+svg:not(:root) {
+    overflow:hidden
+}
+
+figure {
+    margin:1em 40px
+}
+
+hr {
+    box-sizing:content-box;
+    height:0
+}
+
+pre,textarea {
+    overflow:auto
+}
+
+code,kbd,pre,samp {
+    font-family:monospace,monospace;
+    font-size:1em
+}
+
+button,input,optgroup,select,textarea {
+    color:inherit;
+    font:inherit;
+    margin:0
+}
+
+button {
+    overflow:visible
+}
+
+button,select {
+    text-transform:none
+}
+
+button,html input[type=button],input[type=reset],input[type=submit] {
+    -webkit-appearance:button;
+    cursor:pointer
+}
+
+button[disabled],html input[disabled] {
+    cursor:default
+}
+
+button::-moz-focus-inner,input::-moz-focus-inner {
+    border:0;
+    padding:0
+}
+
+input {
+    line-height:normal
+}
+
+input[type=checkbox],input[type=radio] {
+    box-sizing:border-box;
+    padding:0
+}
+
+input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button {
+    height:auto
+}
+
+input[type=search] {
+    -webkit-appearance:textfield;
+    box-sizing:content-box
+}
+
+input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration {
+    -webkit-appearance:none
+}
+
+fieldset {
+    border:1px solid silver;
+    margin:0 2px;
+    padding:.35em .625em .75em
+}
+
+table {
+    border-collapse:collapse;
+    border-spacing:0
+}
+
+body {
+    margin:0;
+    font-family:'Open Sans',sans-serif
+}
+
+*,:after,:before {
+    box-sizing:inherit
+}
+
+.button {
+    box-sizing:border-box;
+    display:inline-block;
+    text-align:center;
+    vertical-align:middle;
+    cursor:pointer;
+    border:1px solid transparent;
+    font-style:normal;
+    white-space:nowrap;
+    text-overflow:ellipsis;
+    padding:.3em 1em;
+    margin:0;
+    overflow:hidden;
+    background:#e1e1e1;
+    color:#151515;
+    font-size:1em;
+    line-height:1.25;
+    max-width:100%
+}
+
+.login-content {
+    background-image:url(../media/img/back-01.jpg);
+    background-size:cover;
+    display:-webkit-flex;
+    display:-ms-flexbox;
+    display:flex;
+    -webkit-justify-content:center;
+    -ms-flex-pack:center;
+    justify-content:center;
+    -webkit-align-items:center;
+    -ms-flex-align:center;
+    align-items:center;
+    min-height:300px;
+    padding:1em 0;
+    transition:all 250ms ease-in-out
+}
+
+@media (min-width:1024px) {
+    .login-content {
+	min-height:550px
+    }
+
+
+}
+
+@media (min-width:1440px) {
+    .login-content {
+	min-height:650px
+    }
+
+
+}
+
+.login-content .message {
+    padding:.5em;
+    margin:0;
+    text-align:center;
+    font-size:13px;
+    font-size:.8125rem
+}
+
+.login-content .message.message-error {
+    color:#fff;
+    background-color:red
+}
+
+.login-content form {
+    width:100%;
+    max-width:350px
+}
+
+.login-content legend {
+    display:none
+}
+
+.login-content fieldset {
+    border:none;
+    background-color:rgba(21,21,21,.6);
+    border-radius:6px;
+    padding:2em
+}
+
+.login-content fieldset>div {
+    margin-bottom:1.5em
+}
+
+.login-content input {
+    width:100%;
+    padding:.5em .75em;
+    border:1px solid transparent;
+    border-radius:2px
+}
+
+.login-content input:focus {
+    border-color:#EE4056
+}
+
+.login-content label {
+    display:block;
+    font-size:14px;
+    font-size:.875rem;
+    color:#959595;
+    margin-bottom:.25em
+}
+
+.login-content .button {
+    transition:all .5s ease-in-out;
+    background-color:#EE4056;
+    color:#fff;
+    margin-bottom:1em;
+    text-transform:uppercase
+}
+
+.login-content .button:hover {
+    background-color:#e6152f
+}
+
+.signup-content {
+    background-image:url(../media/img/signup-01.jpg);
+    background-size:cover;
+    display:-webkit-flex;
+    display:-ms-flexbox;
+    display:flex;
+    -webkit-justify-content:center;
+    -ms-flex-pack:center;
+    justify-content:center;
+    -webkit-align-items:center;
+    -ms-flex-align:center;
+    align-items:center;
+    min-height:300px;
+    padding:1em 0;
+    transition:all 250ms ease-in-out
+}
+
+@media (min-width:1024px) {
+    .signup-content {
+	min-height:550px
+    }
+
+
+}
+
+@media (min-width:1440px) {
+    .signup-content {
+	min-height:650px
+    }
+
+
+}
+
+.signup-content form {
+    width:100%;
+    max-width:40%
+}
+
+.signup-content ul.error li {
+    color:#fff;
+    background-color:red
+}
+
+.signup-content legend {
+    display:none
+}
+
+.signup-content fieldset {
+    border:none;
+    background-color:rgba(21,21,21,.6);
+    border-radius:6px;
+    padding:2em
+}
+
+.signup-content fieldset>div {
+    margin-bottom:1.5em
+}
+
+.signup-content input {
+    width:100%;
+    padding:.5em .75em;
+    border:1px solid transparent;
+    border-radius:2px
+}
+
+.signup-content input:focus {
+    border-color:#EE4056
+}
+
+.signup-content label {
+    display:block;
+    font-size:14px;
+    font-size:.875rem;
+    color:#959595;
+    margin-bottom:.25em
+}
+
+.signup-content .button {
+    transition:all .5s ease-in-out;
+    background-color:#EE4056;
+    color:#fff;
+    margin-bottom:1em;
+    text-transform:uppercase
+}
+
+.logo span,.workout-title:before {
+    transition:all 250ms ease-in-out
+}
+
+.logo-open,.logo:hover span {
+    color:#EE4056
+}
+
+.header-content .description,.logo {
+    margin:0
+}
+
+.signup-content .button:hover {
+    background-color:#e6152f
+}
+
+.header-content {
+    padding:1em 1.5em
+}
+
+.logo {
+    font-size:24px;
+    font-size:1.5rem;
+    line-height:1em;
+    font-weight:800;
+    text-transform:uppercase;
+    display:inline-block
+}
+
+.logo-open {
+    display:block
+}
+
+.logo-outs,.logo-work {
+    color:#f8b5be
+}
+
+.nav-site {
+    font-size:13px;
+    font-size:.8125rem
+}
+
+.nav-site ul {
+    list-style-type:none;
+    padding:0;
+    margin:0;
+    display:-webkit-flex;
+    display:-ms-flexbox;
+    display:flex;
+    -webkit-flex-direction:row;
+    -ms-flex-direction:row;
+    flex-direction:row;
+    -webkit-justify-content:space-between;
+    -ms-flex-pack:justify;
+    justify-content:space-between
+}
+
+.nav-site li {
+    border-left:1px solid #e1e1e1;
+    -webkit-flex-grow:1;
+    -ms-flex-positive:1;
+    flex-grow:1;
+    text-align:center
+}
+
+.nav-site a {
+    color:#959595;
+    padding:1.25em;
+    display:block
+}
+
+.nav-site .is-active a,.nav-site a:hover {
+    color:#151515
+}
+
+.add-workout>a {
+    color:#EE4056
+}
+
+.add-workout>a:before {
+    content:"+";
+    font-weight:800;
+    font-size:32px;
+    font-size:2rem;
+    line-height:0;
+    position:relative;
+    top:8px
+}
+
+.add-workout:hover:after,.bike:before {
+    content:""
+}
+
+.add-workout>a span {
+    display:none
+}
+
+.add-workout>a:hover {
+    background-color:#EE4056;
+    color:#fff
+}
+
+.add-workout:hover:after {
+    position:absolute;
+    background-color:#fff;
+    bottom:-1px;
+    width:100%;
+    height:1px;
+    display:block;
+    z-index:20
+}
+
+.add-workout:hover ul {
+    display:inline-block
+}
+
+.add-workout ul {
+    display:none;
+    -webkit-flex-direction:column;
+    -ms-flex-direction:column;
+    flex-direction:column;
+    position:absolute;
+    background-color:rgba(255,255,255,.95);
+    right:-1px;
+    border:1px solid #e1e1e1;
+    width:153px;
+    z-index:10;
+}
+
+.add-workout ul li {
+    border-left:transparent;
+    text-align:left
+}
+
+.add-workout ul a:hover {
+    background-color:#fbfbfb
+}
+
+.description {
+    font-size:14px;
+    font-size:.875rem;
+    font-weight:300;
+    letter-spacing:.025em;
+    color:#959595
+}
+
+.is-login .header-content {
+    border-bottom:1px solid #e1e1e1;
+    display:-webkit-flex;
+    display:-ms-flexbox;
+    display:flex;
+    padding:0 1.5em;
+    -webkit-justify-content:space-between;
+    -ms-flex-pack:justify;
+    justify-content:space-between;
+    -webkit-align-items:center;
+    -ms-flex-align:center;
+    align-items:center
+}
+
+.is-login .description {
+    display:none
+}
+
+.is-login .logo-open {
+    display:inline-block
+}
+
+.workout-content {
+    padding:2em 1em
+}
+
+@media (min-width:480px) {
+    .workout-content {
+	padding:2em 6em
+    }
+
+
+}
+
+.workout-list {
+    margin-right:2em
+}
+
+.workout-list>h2 {
+    font-weight:300;
+    margin:0 0 1.5em
+}
+
+.workout-resume {
+    max-width:540px;
+    padding:1.5em 0;
+    position:relative
+}
+
+@media (min-width:800px) {
+    .workout-content {
+	display:-webkit-flex;
+	display:-ms-flexbox;
+	display:flex;
+	-webkit-justify-content:space-between;
+	-ms-flex-pack:justify;
+	justify-content:space-between
+    }
+
+    .workout-resume {
+	padding-left:2em;
+	border-left:1px solid #e1e1e1;
+	transition:all 250ms ease-in-out
+    }
+
+
+}
+
+.workout-resume:hover {
+    border-color:#151515
+}
+
+.workout-resume:hover .workout-title:before {
+    color:#151515
+}
+
+.workout-resume ul {
+    padding:0;
+    list-style-type:none;
+    font-size:13px;
+    font-size:.8125rem
+}
+
+.workout-resume ul a {
+    display:block
+}
+
+.bike:before {
+    display:block;
+    width:30px;
+    height:30px;
+    background-image:url(../media/img/bike.svg);
+    background-size:100%
+}
+
+.workout-title {
+    font-size:14px;
+    font-size:.875rem;
+    margin:0;
+    position:relative
+}
+
+.workout-title:before {
+    content:"▶";
+    position:absolute;
+    left:-3.25em;
+    top:.35em;
+    color:#e1e1e1;
+    font-size:10px;
+    font-size:.625rem
+}
+
+.workout-title a {
+    color:#151515
+}
+
+.workout-title a:hover {
+    color:#EE4056
+}
+
+.workout-info {
+    display:-webkit-flex;
+    display:-ms-flexbox;
+    display:flex;
+    -webkit-align-items:center;
+    -ms-flex-align:center;
+    align-items:center;
+    margin:.25em 0
+}
+
+.workout-info li {
+    color:#959595
+}
+
+.workout-info li:after {
+    content:"|";
+    margin:0 .5em
+}
+
+.workout-info li:last-child:after {
+    content:"";
+    margin:0
+}
+
+.workout-intro {
+    font-size:13px;
+    font-size:.8125rem;
+    color:#151515
+}
+
+.workout-options {
+    display:inline-block;
+    border:1px solid #e1e1e1;
+    margin-bottom:0;
+    border-radius:4px
+}
+
+.workout-options li {
+    display:inline-block;
+    border-right:1px solid #e1e1e1
+}
+
+.workout-options li:last-child {
+    border-right:none
+}
+
+.workout-options a {
+    color:#959595;
+    padding:.5em .75em
+}
+
+.workout-options a:hover {
+    color:#151515
+}
+
+.owo-del a:hover {
+    color:red
+}
+
+.workout-aside {
+    width:100%
+}
+
+.workout-activity-tree {
+    padding:0;
+    list-style-type: none;
+    transition:all 250ms ease-in-out
+                   list-style-type:none;
+    font-size:13px;
+    font-size:.8125rem;
+    color: #959595;
+}
+
+.workout-activity-tree a {
+    text-decoration: none;
+    background-color: transparent;
+    outline: 0;
+    color: #959595;
+}
+
+
+.workout-activity-tree li a.viewing-year {
+    font-size: 17px;
+    color: #151515;
+}
+
+.workout-activity-tree ul.hidden {
+    display: none;
+}
+
+.workout-activity-tree-year {
+    list-style-type: none;
+    padding: 0;
+    padding-left: 15px;
+    font-size:13px;
+    font-size:.8125rem;
+    color: #959595;
+}
+
+.workout-activity-tree-year a {
+    text-decoration: none;
+    background-color: transparent;
+    outline: 0;
+    color: #959595;
+}
+
+
+.workout-activity-tree-year li a.viewing-month {
+    font-size: 17px;
+    color: #151515;
+}
+
+.workout-activity-tree-month {
+    list-style-type: none;
+    padding: 0;
+    padding-left: 15px;
+    font-size:13px;
+    font-size:.8125rem
+    color: #959595;
+}
+
+.workout-activity-tree-month a {
+    text-decoration: none;
+    background-color: transparent;
+    outline: 0;
+    color: #959595;
+}
+
+
+
+@media (min-width:800px) {
+    .workout-aside {
+	max-width:300px;
+	padding-left:1.5em;
+	border-left:1px solid #e1e1e1
+    }
+
+
+}
Index: ow/static/______css/__main.min.css
===================================================================
--- ow/static/______css/__main.min.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/______css/__main.min.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,1 @@
+img,legend{border:0}legend,td,th{padding:0}.add-workout,.button,sub,sup{position:relative}.button,.header-content a,.workout-resume ul a,.workout-title a{text-decoration:none}@font-face{font-family:'Open Sans';font-style:normal;font-weight:300;src:local('Open Sans Light'),local('OpenSans-Light'),url(http://fonts.gstatic.com/s/opensans/v13/DXI1ORHCpsQm3Vp6mXoaTYnF5uFdDttMLvmWuJdhhgs.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:400;src:local('Open Sans'),local('OpenSans'),url(http://fonts.gstatic.com/s/opensans/v13/cJZKeOuBrn4kERxqtaUH3aCWcynf_cDxXwCLxiixG1c.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:700;src:local('Open Sans Bold'),local('OpenSans-Bold'),url(http://fonts.gstatic.com/s/opensans/v13/k3k702ZOKiLJc3WVjuplzInF5uFdDttMLvmWuJdhhgs.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:800;src:local('Open Sans Extrabold'),local('OpenSans-Extrabold'),url(http://fonts.gstatic.com/s/opensans/v13/EInbV5DfGHOiMmvb1Xr-honF5uFdDttMLvmWuJdhhgs.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:italic;font-weight:300;src:local('Open Sans Light Italic'),local('OpenSansLight-Italic'),url(http://fonts.gstatic.com/s/opensans/v13/PRmiXeptR36kaC0GEAetxrfB31yxOzP-czbf6AAKCVo.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:italic;font-weight:400;src:local('Open Sans Italic'),local('OpenSans-Italic'),url(http://fonts.gstatic.com/s/opensans/v13/xjAJXh38I15wypJXxuGMBp0EAVxt0G0biEntp43Qt6E.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:italic;font-weight:700;src:local('Open Sans Bold Italic'),local('OpenSans-BoldItalic'),url(http://fonts.gstatic.com/s/opensans/v13/PRmiXeptR36kaC0GEAetxp_TkvowlIOtbR7ePgFOpF4.ttf) format('truetype')}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;box-sizing:border-box}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}.hide,[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,optgroup,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre,textarea{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}table{border-collapse:collapse;border-spacing:0}body{margin:0;font-family:'Open Sans',sans-serif}*,:after,:before{box-sizing:inherit}.button{box-sizing:border-box;display:inline-block;text-align:center;vertical-align:middle;cursor:pointer;border:1px solid transparent;font-style:normal;white-space:nowrap;text-overflow:ellipsis;padding:.3em 1em;margin:0;overflow:hidden;background:#e1e1e1;color:#151515;font-size:1em;line-height:1.25;max-width:100%}.login-content{background-image:url(../media/img/back-01.jpg);background-size:cover;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;min-height:300px;padding:1em 0;transition:all 250ms ease-in-out}@media (min-width:1024px){.login-content{min-height:550px}}@media (min-width:1440px){.login-content{min-height:650px}}.login-content .message{padding:.5em;margin:0;text-align:center;font-size:13px;font-size:.8125rem}.login-content .message.message-error{color:#fff;background-color:red}.login-content form{width:100%;max-width:350px}.login-content legend{display:none}.login-content fieldset{border:none;background-color:rgba(21,21,21,.6);border-radius:6px;padding:2em}.login-content fieldset>div{margin-bottom:1.5em}.login-content input{width:100%;padding:.5em .75em;border:1px solid transparent;border-radius:2px}.login-content input:focus{border-color:#EE4056}.login-content label{display:block;font-size:14px;font-size:.875rem;color:#959595;margin-bottom:.25em}.login-content .button{transition:all .5s ease-in-out;background-color:#EE4056;color:#fff;margin-bottom:1em;text-transform:uppercase}.login-content .button:hover{background-color:#e6152f}.signup-content{background-image:url(../media/img/signup-01.jpg);background-size:cover;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;min-height:300px;padding:1em 0;transition:all 250ms ease-in-out}@media (min-width:1024px){.signup-content{min-height:550px}}@media (min-width:1440px){.signup-content{min-height:650px}}.signup-content form{width:100%;max-width:40%}.signup-content ul.error li{color:#fff;background-color:red}.signup-content legend{display:none}.signup-content fieldset{border:none;background-color:rgba(21,21,21,.6);border-radius:6px;padding:2em}.signup-content fieldset>div{margin-bottom:1.5em}.signup-content input{width:100%;padding:.5em .75em;border:1px solid transparent;border-radius:2px}.signup-content input:focus{border-color:#EE4056}.signup-content label{display:block;font-size:14px;font-size:.875rem;color:#959595;margin-bottom:.25em}.signup-content .button{transition:all .5s ease-in-out;background-color:#EE4056;color:#fff;margin-bottom:1em;text-transform:uppercase}.logo span,.workout-title:before{transition:all 250ms ease-in-out}.logo-open,.logo:hover span{color:#EE4056}.header-content .description,.logo{margin:0}.signup-content .button:hover{background-color:#e6152f}.header-content{padding:1em 1.5em}.logo{font-size:24px;font-size:1.5rem;line-height:1em;font-weight:800;text-transform:uppercase;display:inline-block}.logo-open{display:block}.logo-outs,.logo-work{color:#f8b5be}.nav-site{font-size:13px;font-size:.8125rem}.nav-site ul{list-style-type:none;padding:0;margin:0;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between}.nav-site li{border-left:1px solid #e1e1e1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;text-align:center}.nav-site a{color:#959595;padding:1.25em;display:block}.nav-site .is-active a,.nav-site a:hover{color:#151515}.add-workout>a{color:#EE4056}.add-workout>a:before{content:"+";font-weight:800;font-size:32px;font-size:2rem;line-height:0;position:relative;top:8px}.add-workout:hover:after,.bike:before{content:""}.add-workout>a span{display:none}.add-workout>a:hover{background-color:#EE4056;color:#fff}.add-workout:hover:after{position:absolute;background-color:#fff;bottom:-1px;width:100%;height:1px;display:block;z-index:20}.add-workout:hover ul{display:inline-block}.add-workout ul{display:none;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;position:absolute;background-color:rgba(255,255,255,.95);right:-1px;border:1px solid #e1e1e1;width:153px}.add-workout ul li{border-left:transparent;text-align:left}.add-workout ul a:hover{background-color:#fbfbfb}.description{font-size:14px;font-size:.875rem;font-weight:300;letter-spacing:.025em;color:#959595}.is-login .header-content{border-bottom:1px solid #e1e1e1;display:-webkit-flex;display:-ms-flexbox;display:flex;padding:0 1.5em;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.is-login .description{display:none}.is-login .logo-open{display:inline-block}.workout-content{padding:2em 1em}@media (min-width:480px){.workout-content{padding:2em 6em}}.workout-list{margin-right:2em}.workout-list>h2{font-weight:300;margin:0 0 1.5em}.workout-resume{max-width:540px;padding:1.5em 0;position:relative}@media (min-width:800px){.workout-content{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between}.workout-resume{padding-left:2em;border-left:1px solid #e1e1e1;transition:all 250ms ease-in-out}}.workout-resume:hover{border-color:#151515}.workout-resume:hover .workout-title:before{color:#151515}.workout-resume ul{padding:0;list-style-type:none;font-size:13px;font-size:.8125rem}.workout-resume ul a{display:block}.bike:before{display:block;width:30px;height:30px;background-image:url(../media/img/bike.svg);background-size:100%}.workout-title{font-size:14px;font-size:.875rem;margin:0;position:relative}.workout-title:before{content:"▶";position:absolute;left:-3.25em;top:.35em;color:#e1e1e1;font-size:10px;font-size:.625rem}.workout-title a{color:#151515}.workout-title a:hover{color:#EE4056}.workout-info{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;margin:.25em 0}.workout-info li{color:#959595}.workout-info li:after{content:"|";margin:0 .5em}.workout-info li:last-child:after{content:"";margin:0}.workout-intro{font-size:13px;font-size:.8125rem;color:#151515}.workout-options{display:inline-block;border:1px solid #e1e1e1;margin-bottom:0;border-radius:4px}.workout-options li{display:inline-block;border-right:1px solid #e1e1e1}.workout-options li:last-child{border-right:none}.workout-options a{color:#959595;padding:.5em .75em}.workout-options a:hover{color:#151515}.owo-del a:hover{color:red}.workout-aside{width:100%}@media (min-width:800px){.workout-aside{max-width:300px;padding-left:1.5em;border-left:1px solid #e1e1e1}}
Index: ow/static/______css/__openworkouts.css
===================================================================
--- ow/static/______css/__openworkouts.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/______css/__openworkouts.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,46 @@
+
+#map {
+    height: 360px;
+    z-index: 0;
+}
+
+#ow-analysis {
+    float: left;
+    width: 98%;
+    padding: 10px;
+    font-size: 0.8em;
+    background-color: #eeeeee;
+}
+
+/* dashboard, weekly stats */
+
+span.week_totals_left {
+    padding-right: 5px;
+    border-right: 1px solid #e1e1e1;
+}
+
+span.week_totals_right {
+    padding-left: 5px;
+}
+
+.x-axis path, .x-axis line {
+    fill: none;
+    stroke: none;
+}
+
+.bar {
+    fill: #f8b5be;
+}
+
+.bar:hover {
+    fill: #ee4056;
+}
+
+.current {
+    fill: #ee4056;
+}
+
+text.label {
+    font-size: 0.6em;
+    text-anchor: middle;
+}
Index: ow/static/______css/common.css
===================================================================
--- ow/static/______css/common.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/______css/common.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,13 @@
+body {
+    font-family: 'Open Sans', sans-serif;
+}
+
+html {
+	box-sizing: border-box;
+}
+*,
+*:before,
+*:after {
+	box-sizing: inherit;
+}
+
Index: ow/static/______css/main.css
===================================================================
--- ow/static/______css/main.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/______css/main.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,21 @@
+/* google fonts */
+@import "http://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,700,700italic,800";
+
+/* normalize */
+@import "vendors/normalize.css";
+
+/* Variables */
+@import "variables.css";
+
+/* UI */
+@import "ui/form.css";
+@import "ui/buttons.css";
+
+/* Common styles */
+@import "common.css";
+
+/* Modules */
+@import "modules/header.css";
+
+/* Pages */
+@import "pages/login.css";
Index: ow/static/______css/modules/header.css
===================================================================
--- ow/static/______css/modules/header.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/______css/modules/header.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,134 @@
+/* ==========================================================================
+   Header
+   ========================================================================== */
+
+.header-content {
+    border-bottom: 1px solid var(--color-main-light);
+    display: flex;
+    padding: 0em 1.5em;
+    justify-content: space-between;
+    align-items: center;
+}
+.
+.header-content a {
+    text-decoration: none;
+}
+
+
+/* Logo
+   ========================================================================== */
+.logo {
+    display: inline-block;
+    font-size: 24px;
+    line-height: 1em;
+    font-weight: 800;
+    text-transform: uppercase;
+    margin: 0;
+}
+.logo a {
+    text-decoration: none;
+}
+
+.logo:hover span{
+    color: var(--color-app);
+}
+
+.logo-open {
+    display: block;
+    color: var(--color-app);
+}
+.logo-work,
+.logo-outs {
+    color: var(--color-app-light);
+}
+
+.description {
+    font-size: 14px;
+    font-weight: 300;
+    letter-spacing: .025em;
+    color: var(--color-main-medium);
+}
+
+/* Navigation
+   ========================================================================== */
+.nav-site {
+    font-size: 13px;
+}
+.nav-site ul {
+    list-style-type: none;
+    padding: 0;
+    margin: 0;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+}
+.nav-site li {
+    border-left: 1px solid var(--color-main-light);
+    flex-grow: 1;
+    text-align: center;
+}
+.nav-site a {
+    display: block;
+    padding: 1.25rem;
+    color: var(--color-main-medium);
+    text-decoration: none;
+}
+.nav-site a:hover,
+.nav-site .is-active a {
+    color: var(--color-main);
+}
+
+
+/* Add workout button with submenu -------------------------------------------*/
+.add-workout {
+    position: relative;
+}
+.add-workout::before{
+    content: "+";
+    font-weight: 800;
+    font-size: 32px;
+    line-height: 0;
+    position: relative;
+    top: .75em;color: var(--color-app);
+}
+.add-workout span{
+    display: none;
+}
+
+.add-workout:hover::after{
+        content: "";
+        position: absolute;
+        background-color: white;
+        width: 100%;
+        height: 1px;
+        display: block;
+        z-index: 20;
+}
+.add-workout:hover ul{
+    display: inline-block;
+}
+
+/* submenu -------------------------------------------------------------- */
+.add-workout ul{
+    display: none;
+    flex-direction: column;
+    position: absolute;
+    right: -1px;
+    border: 1px solid var(--color-main-light);
+    width: 150px;
+}
+.add-workout ul li{
+    border-left:transparent;
+    text-align: left;
+}
+.add-workout ul a:hover{
+    background-color: var(--color-main-xtralight);
+}
+
+/* States -------------------------------------------------------------- */
+.is-login .description {
+    display: none;
+}
+.is-login .logo-open {
+    display: inline-block;
+}
Index: ow/static/______css/pages/login.css
===================================================================
--- ow/static/______css/pages/login.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/______css/pages/login.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,58 @@
+/* ==========================================================================
+   Login page
+   ========================================================================== */
+
+.login-content {
+    background-image: url("../../media/img/back-01.jpg");
+    background-size: cover;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    min-height: calc(100vh - 98px);
+    padding: 1em 0;
+}
+
+.login-content form {
+    max-width: 380px;
+    background-color: rgba(0,0,0,0.8);
+    border-radius: 6px;
+    padding: 2em  1.5em;
+}
+
+
+.login-content label {
+    color: white;
+}
+
+.login-content a {
+    color: var(--color-main-light);
+    font-size: 13px;
+    text-decoration: none;
+    margin-right: .75em;
+}
+
+.login-content a:hover {
+    color: white;
+}
+
+
+
+
+
+
+
+
+/* Provisional */
+.message {
+    padding: .5em;
+    margin: 0;
+    border-radius: 4px;
+    text-align: center;
+    font-size: 13px;
+}
+
+.message.message-error{
+    background-color: var(--color-app-dark);
+    color: white;
+    margin-bottom: .5em;
+}
Index: ow/static/______css/ui/buttons.css
===================================================================
--- ow/static/______css/ui/buttons.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/______css/ui/buttons.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,27 @@
+.button {
+    box-sizing: border-box;
+    display: inline-block;
+    text-align: center;
+    vertical-align: middle;
+    cursor: pointer;
+    border: 1px solid transparent;
+    text-decoration: none;
+    font-style: normal;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    margin: 0;
+    position: relative;
+    overflow: hidden;
+    font-size: 1em;
+    line-height: 1.25rem;
+    max-width: 100%;
+}
+
+.button.button-action {
+    background: var(--color-app);
+    color: white;
+}
+
+.button.button-action:hover {
+    background-color: var(--color-app-dark);
+}
Index: ow/static/______css/ui/form.css
===================================================================
--- ow/static/______css/ui/form.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/______css/ui/form.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,28 @@
+/* Generic default forms */
+form{
+    width: 100%;
+}
+
+legend {
+    display: none;
+}
+
+fieldset {
+    border: none;
+    padding: 0;
+}
+fieldset > div {
+    margin-bottom: 1.5em;
+}
+
+label {
+    display: block;
+    font-size: 13px;
+    margin-bottom: .25em;
+}
+input {
+    width: 100%;
+    padding: .5em .75em;
+    border: 1px solid transparent;
+    border-radius: 2px;
+}
Index: ow/static/______css/variables.css
===================================================================
--- ow/static/______css/variables.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/______css/variables.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,22 @@
+:root {
+
+    /* colors */
+    --color-main: #151515;
+    --color-main-dark: #454545;
+    --color-main-medium: #999;
+    --color-main-light: #ccc;
+    --color-main-xtralight: #f5f5f5;
+
+    --color-app-dark: #e81029;
+    --color-app: #EE4056;
+    --color-app-medium: #ee0000;
+    --color-app-light: #ee9999;
+
+	/* Media queries */
+	--screen-xs: 320px;
+	--screen-s: 480px;
+	--screen-m: 800px;
+	--screen-l: 1024px;
+	--screen-xl: 1440px;
+
+}
Index: ow/static/______css/vendors/normalize.css
===================================================================
--- ow/static/______css/vendors/normalize.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/______css/vendors/normalize.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,349 @@
+/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
+
+/* Document
+   ========================================================================== */
+
+/**
+ * 1. Correct the line height in all browsers.
+ * 2. Prevent adjustments of font size after orientation changes in iOS.
+ */
+
+html {
+  line-height: 1.15; /* 1 */
+  -webkit-text-size-adjust: 100%; /* 2 */
+}
+
+/* Sections
+   ========================================================================== */
+
+/**
+ * Remove the margin in all browsers.
+ */
+
+body {
+  margin: 0;
+}
+
+/**
+ * Render the `main` element consistently in IE.
+ */
+
+main {
+  display: block;
+}
+
+/**
+ * Correct the font size and margin on `h1` elements within `section` and
+ * `article` contexts in Chrome, Firefox, and Safari.
+ */
+
+h1 {
+  font-size: 2em;
+  margin: 0.67em 0;
+}
+
+/* Grouping content
+   ========================================================================== */
+
+/**
+ * 1. Add the correct box sizing in Firefox.
+ * 2. Show the overflow in Edge and IE.
+ */
+
+hr {
+  box-sizing: content-box; /* 1 */
+  height: 0; /* 1 */
+  overflow: visible; /* 2 */
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+pre {
+  font-family: monospace, monospace; /* 1 */
+  font-size: 1em; /* 2 */
+}
+
+/* Text-level semantics
+   ========================================================================== */
+
+/**
+ * Remove the gray background on active links in IE 10.
+ */
+
+a {
+  background-color: transparent;
+}
+
+/**
+ * 1. Remove the bottom border in Chrome 57-
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+ */
+
+abbr[title] {
+  border-bottom: none; /* 1 */
+  text-decoration: underline; /* 2 */
+  text-decoration: underline dotted; /* 2 */
+}
+
+/**
+ * Add the correct font weight in Chrome, Edge, and Safari.
+ */
+
+b,
+strong {
+  font-weight: bolder;
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+code,
+kbd,
+samp {
+  font-family: monospace, monospace; /* 1 */
+  font-size: 1em; /* 2 */
+}
+
+/**
+ * Add the correct font size in all browsers.
+ */
+
+small {
+  font-size: 80%;
+}
+
+/**
+ * Prevent `sub` and `sup` elements from affecting the line height in
+ * all browsers.
+ */
+
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+sup {
+  top: -0.5em;
+}
+
+/* Embedded content
+   ========================================================================== */
+
+/**
+ * Remove the border on images inside links in IE 10.
+ */
+
+img {
+  border-style: none;
+}
+
+/* Forms
+   ========================================================================== */
+
+/**
+ * 1. Change the font styles in all browsers.
+ * 2. Remove the margin in Firefox and Safari.
+ */
+
+button,
+input,
+optgroup,
+select,
+textarea {
+  font-family: inherit; /* 1 */
+  font-size: 100%; /* 1 */
+  line-height: 1.15; /* 1 */
+  margin: 0; /* 2 */
+}
+
+/**
+ * Show the overflow in IE.
+ * 1. Show the overflow in Edge.
+ */
+
+button,
+input { /* 1 */
+  overflow: visible;
+}
+
+/**
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
+ * 1. Remove the inheritance of text transform in Firefox.
+ */
+
+button,
+select { /* 1 */
+  text-transform: none;
+}
+
+/**
+ * Correct the inability to style clickable types in iOS and Safari.
+ */
+
+button,
+[type="button"],
+[type="reset"],
+[type="submit"] {
+  -webkit-appearance: button;
+}
+
+/**
+ * Remove the inner border and padding in Firefox.
+ */
+
+button::-moz-focus-inner,
+[type="button"]::-moz-focus-inner,
+[type="reset"]::-moz-focus-inner,
+[type="submit"]::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+/**
+ * Restore the focus styles unset by the previous rule.
+ */
+
+button:-moz-focusring,
+[type="button"]:-moz-focusring,
+[type="reset"]:-moz-focusring,
+[type="submit"]:-moz-focusring {
+  outline: 1px dotted ButtonText;
+}
+
+/**
+ * Correct the padding in Firefox.
+ */
+
+fieldset {
+  padding: 0.35em 0.75em 0.625em;
+}
+
+/**
+ * 1. Correct the text wrapping in Edge and IE.
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
+ * 3. Remove the padding so developers are not caught out when they zero out
+ *    `fieldset` elements in all browsers.
+ */
+
+legend {
+  box-sizing: border-box; /* 1 */
+  color: inherit; /* 2 */
+  display: table; /* 1 */
+  max-width: 100%; /* 1 */
+  padding: 0; /* 3 */
+  white-space: normal; /* 1 */
+}
+
+/**
+ * Add the correct vertical alignment in Chrome, Firefox, and Opera.
+ */
+
+progress {
+  vertical-align: baseline;
+}
+
+/**
+ * Remove the default vertical scrollbar in IE 10+.
+ */
+
+textarea {
+  overflow: auto;
+}
+
+/**
+ * 1. Add the correct box sizing in IE 10.
+ * 2. Remove the padding in IE 10.
+ */
+
+[type="checkbox"],
+[type="radio"] {
+  box-sizing: border-box; /* 1 */
+  padding: 0; /* 2 */
+}
+
+/**
+ * Correct the cursor style of increment and decrement buttons in Chrome.
+ */
+
+[type="number"]::-webkit-inner-spin-button,
+[type="number"]::-webkit-outer-spin-button {
+  height: auto;
+}
+
+/**
+ * 1. Correct the odd appearance in Chrome and Safari.
+ * 2. Correct the outline style in Safari.
+ */
+
+[type="search"] {
+  -webkit-appearance: textfield; /* 1 */
+  outline-offset: -2px; /* 2 */
+}
+
+/**
+ * Remove the inner padding in Chrome and Safari on macOS.
+ */
+
+[type="search"]::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+/**
+ * 1. Correct the inability to style clickable types in iOS and Safari.
+ * 2. Change font properties to `inherit` in Safari.
+ */
+
+::-webkit-file-upload-button {
+  -webkit-appearance: button; /* 1 */
+  font: inherit; /* 2 */
+}
+
+/* Interactive
+   ========================================================================== */
+
+/*
+ * Add the correct display in Edge, IE 10+, and Firefox.
+ */
+
+details {
+  display: block;
+}
+
+/*
+ * Add the correct display in all browsers.
+ */
+
+summary {
+  display: list-item;
+}
+
+/* Misc
+   ========================================================================== */
+
+/**
+ * Add the correct display in IE 10+.
+ */
+
+template {
+  display: none;
+}
+
+/**
+ * Add the correct display in IE 10.
+ */
+
+[hidden] {
+  display: none;
+}
Index: ow/static/css/forms.css
===================================================================
--- ow/static/css/forms.css	(revision 5cf5787d1c21f5eedd38c23d588cc1906e4bef1d)
+++ 	(revision )
@@ -1,184 +1,0 @@
-
-/*
-  Styles for the forms
-*/
-
-/* Basic/common styles for buttons */
-
-.button {
-  box-sizing: border-box;
-  display: inline-block;
-  position: relative;
-  max-width: 100%;
-  text-align: center;
-  vertical-align: middle;
-  cursor: pointer;
-  border: 1px solid transparent;
-  text-decoration: none;
-  white-space: nowrap;
-  margin: 0;
-  padding: 0.5em 1em;
-  border-radius: 4px;
-  overflow: hidden;
-  background: none;
-  color: black;
-  font-family: inherit;
-  font-style: normal;
-  font-size: 1em;
-  line-height: 1.25;
-  text-overflow: ellipsis;
-  text-transform: uppercase;
-}
-
-.button-normal {
-  letter-spacing: 0.02em;
-  font-weight: 300;
-}
-
-.button-normal:hover {
-  text-decoration: none;
-}
-
-.button-normal {
-  background-image: linear-gradient(to top, #f1f1f1, white);
-  color: #252525;
-  border-color: #bebebe;
-}
-
-.button-normal:hover {
-  background: #f1f1f1;
-}
-
-.button-neutral {
-  background-color: #bebebe;
-  color: white;
-}
-
-.button-neutral:hover {
-  background-color: #323232;
-}
-
-.button-action {
-  background-image: linear-gradient(to top, #F89507, #fbbb60);
-  color: white;
-  border-color: #e48906;
-}
-
-.button-action:hover {
-  background: #F89507;
-}
-
-.button-important {
-  background-image: linear-gradient(to top, #c35857, #d07d7d);
-  color: white;
-  border-color: #aa3e3d;
-}
-
-.button-important:hover {
-  background: #c35857;
-}
-
-.button-alt {
-  background-color: #c35857;
-  color: white;
-}
-
-.button-alt:hover {
-  background-color: #aa3e3d;
-}
-
-.button-important {
-  background-color: #E45759;
-  color: white;
-}
-
-.button-important:hover {
-  background-color: #b81d20;
-}
-
-.button-s {
-  font-size: 13px;
-  font-size: 0.8125rem;
-  font-weight: 700;
-}
-
-
-/* Edit profile form */
-
-.ow-forms form {
-    width:100%;
-    max-width:40%
-}
-
-.ow-forms ul.error {
-    margin: 0px;
-    margin-bottom: 5px;
-    padding: 0px;
-    list-style-type:none;
-}
-
-.ow-forms ul.error li {
-    border: 1px solid red;
-    width:100%;
-    padding:.5em .75em;
-    border:1px solid #EE4056;
-    border-radius:2px
-}
-
-.ow-forms legend {
-    display:none
-}
-
-.ow-forms fieldset {
-    border:none;
-    border-bottom: 2px solid #e1e1e1;
-}
-
-.ow-forms fieldset>div {
-    margin-bottom:1.5em
-}
-
-.ow-forms input {
-    width:100%;
-    padding:.5em .75em;
-    border:1px solid #e1e1e1;
-    border-radius:2px
-}
-
-.ow-forms input.number {
-    /* width up to three characters */
-    width: 3em;
-}
-
-.ow-forms input.date {
-    /* width up to 10 characters */
-    width: 7em;
-}
-
-.ow-forms input.time {
-    /* width up to 6 characters */
-    width: 5em;
-}
-
-.ow-forms input:focus {
-    border-color: #333333;
-}
-
-.ow-forms input.button {
-    width: 20%;
-}
-
-.ow-forms label {
-    display:block;
-    font-size:14px;
-    font-size:.875rem;
-    color:#959595;
-    margin-bottom:.25em
-}
-
-.ow-forms div.input-container {
-    display: flex;
-    flex-flow: row wrap;
-    justify-content: space-between;
-    align-items: center;
-}
Index: ow/static/css/main.css
===================================================================
--- ow/static/css/main.css	(revision 5cf5787d1c21f5eedd38c23d588cc1906e4bef1d)
+++ ow/static/css/main.css	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -1,841 +1,1080 @@
-img,legend {
-    border:0
-}
-
-legend,td,th {
-    padding:0
-}
-
-.add-workout,.button,sub,sup {
-    position:relative
-}
-
-.button,.header-content a,.workout-resume ul a,.workout-title a {
-    text-decoration:none
-}
-
 @font-face {
-    font-family:'Open Sans';
-    font-style:normal;
-    font-weight:300;
-    src:local('Open Sans Light'),local('OpenSans-Light'),url(http://fonts.gstatic.com/s/opensans/v13/DXI1ORHCpsQm3Vp6mXoaTYnF5uFdDttMLvmWuJdhhgs.ttf) format('truetype')
-}
-
+  font-family: 'Open Sans';
+  font-style: italic;
+  font-weight: 300;
+  src: local('Open Sans Light Italic'), local('OpenSans-LightItalic'), url(http://fonts.gstatic.com/s/opensans/v15/memnYaGs126MiZpBA-UFUKWyV9hrIqY.ttf) format('truetype');
+}
 @font-face {
-    font-family:'Open Sans';
-    font-style:normal;
-    font-weight:400;
-    src:local('Open Sans'),local('OpenSans'),url(http://fonts.gstatic.com/s/opensans/v13/cJZKeOuBrn4kERxqtaUH3aCWcynf_cDxXwCLxiixG1c.ttf) format('truetype')
-}
-
+  font-family: 'Open Sans';
+  font-style: italic;
+  font-weight: 400;
+  src: local('Open Sans Italic'), local('OpenSans-Italic'), url(http://fonts.gstatic.com/s/opensans/v15/mem6YaGs126MiZpBA-UFUK0Zdcg.ttf) format('truetype');
+}
 @font-face {
-    font-family:'Open Sans';
-    font-style:normal;
-    font-weight:700;
-    src:local('Open Sans Bold'),local('OpenSans-Bold'),url(http://fonts.gstatic.com/s/opensans/v13/k3k702ZOKiLJc3WVjuplzInF5uFdDttMLvmWuJdhhgs.ttf) format('truetype')
-}
-
+  font-family: 'Open Sans';
+  font-style: italic;
+  font-weight: 700;
+  src: local('Open Sans Bold Italic'), local('OpenSans-BoldItalic'), url(http://fonts.gstatic.com/s/opensans/v15/memnYaGs126MiZpBA-UFUKWiUNhrIqY.ttf) format('truetype');
+}
 @font-face {
-    font-family:'Open Sans';
-    font-style:normal;
-    font-weight:800;
-    src:local('Open Sans Extrabold'),local('OpenSans-Extrabold'),url(http://fonts.gstatic.com/s/opensans/v13/EInbV5DfGHOiMmvb1Xr-honF5uFdDttMLvmWuJdhhgs.ttf) format('truetype')
-}
-
+  font-family: 'Open Sans';
+  font-style: normal;
+  font-weight: 300;
+  src: local('Open Sans Light'), local('OpenSans-Light'), url(http://fonts.gstatic.com/s/opensans/v15/mem5YaGs126MiZpBA-UN_r8OUuhs.ttf) format('truetype');
+}
 @font-face {
-    font-family:'Open Sans';
-    font-style:italic;
-    font-weight:300;
-    src:local('Open Sans Light Italic'),local('OpenSansLight-Italic'),url(http://fonts.gstatic.com/s/opensans/v13/PRmiXeptR36kaC0GEAetxrfB31yxOzP-czbf6AAKCVo.ttf) format('truetype')
-}
-
+  font-family: 'Open Sans';
+  font-style: normal;
+  font-weight: 400;
+  src: local('Open Sans Regular'), local('OpenSans-Regular'), url(http://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFVZ0e.ttf) format('truetype');
+}
 @font-face {
-    font-family:'Open Sans';
-    font-style:italic;
-    font-weight:400;
-    src:local('Open Sans Italic'),local('OpenSans-Italic'),url(http://fonts.gstatic.com/s/opensans/v13/xjAJXh38I15wypJXxuGMBp0EAVxt0G0biEntp43Qt6E.ttf) format('truetype')
-}
-
+  font-family: 'Open Sans';
+  font-style: normal;
+  font-weight: 700;
+  src: local('Open Sans Bold'), local('OpenSans-Bold'), url(http://fonts.gstatic.com/s/opensans/v15/mem5YaGs126MiZpBA-UN7rgOUuhs.ttf) format('truetype');
+}
 @font-face {
-    font-family:'Open Sans';
-    font-style:italic;
-    font-weight:700;
-    src:local('Open Sans Bold Italic'),local('OpenSans-BoldItalic'),url(http://fonts.gstatic.com/s/opensans/v13/PRmiXeptR36kaC0GEAetxp_TkvowlIOtbR7ePgFOpF4.ttf) format('truetype')
-}
-
+  font-family: 'Open Sans';
+  font-style: normal;
+  font-weight: 800;
+  src: local('Open Sans ExtraBold'), local('OpenSans-ExtraBold'), url(http://fonts.gstatic.com/s/opensans/v15/mem5YaGs126MiZpBA-UN8rsOUuhs.ttf) format('truetype');
+}
+/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
+/* Document
+   ========================================================================== */
+/**
+ * 1. Correct the line height in all browsers.
+ * 2. Prevent adjustments of font size after orientation changes in iOS.
+ */
 html {
-    font-family:sans-serif;
-    -ms-text-size-adjust:100%;
-    -webkit-text-size-adjust:100%;
-    box-sizing:border-box
-}
-
-article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary {
-    display:block
-}
-
-audio,canvas,progress,video {
-    display:inline-block;
-    vertical-align:baseline
-}
-
-audio:not([controls]) {
-    display:none;
-    height:0
-}
-
-.hide,[hidden],template {
-    display:none
-}
-
+  line-height: 1.15;
+  /* 1 */
+  -webkit-text-size-adjust: 100%;
+  /* 2 */
+}
+/* Sections
+   ========================================================================== */
+/**
+ * Remove the margin in all browsers.
+ */
+body {
+  margin: 0;
+}
+/**
+ * Render the `main` element consistently in IE.
+ */
+main {
+  display: block;
+}
+/**
+ * Correct the font size and margin on `h1` elements within `section` and
+ * `article` contexts in Chrome, Firefox, and Safari.
+ */
+h1 {
+  font-size: 2em;
+  margin: 0.67em 0;
+}
+/* Grouping content
+   ========================================================================== */
+/**
+ * 1. Add the correct box sizing in Firefox.
+ * 2. Show the overflow in Edge and IE.
+ */
+hr {
+  box-sizing: content-box;
+  /* 1 */
+  height: 0;
+  /* 1 */
+  overflow: visible;
+  /* 2 */
+}
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+pre {
+  font-family: monospace, monospace;
+  /* 1 */
+  font-size: 1em;
+  /* 2 */
+}
+/* Text-level semantics
+   ========================================================================== */
+/**
+ * Remove the gray background on active links in IE 10.
+ */
 a {
-    background-color:transparent
-}
-
-a:active,a:hover {
-    outline:0
-}
-
+  background-color: transparent;
+}
+/**
+ * 1. Remove the bottom border in Chrome 57-
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+ */
 abbr[title] {
-    border-bottom:1px dotted
-}
-
-b,optgroup,strong {
-    font-weight:700
-}
-
-dfn {
-    font-style:italic
-}
-
-h1 {
-    font-size:2em;
-    margin:.67em 0
-}
-
-mark {
-    background:#ff0;
-    color:#000
-}
-
+  border-bottom: none;
+  /* 1 */
+  text-decoration: underline;
+  /* 2 */
+  text-decoration: underline dotted;
+  /* 2 */
+}
+/**
+ * Add the correct font weight in Chrome, Edge, and Safari.
+ */
+b,
+strong {
+  font-weight: bolder;
+}
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+code,
+kbd,
+samp {
+  font-family: monospace, monospace;
+  /* 1 */
+  font-size: 1em;
+  /* 2 */
+}
+/**
+ * Add the correct font size in all browsers.
+ */
 small {
-    font-size:80%
-}
-
-sub,sup {
-    font-size:75%;
-    line-height:0;
-    vertical-align:baseline
-}
-
+  font-size: 80%;
+}
+/**
+ * Prevent `sub` and `sup` elements from affecting the line height in
+ * all browsers.
+ */
+sub,
 sup {
-    top:-.5em
-}
-
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
 sub {
-    bottom:-.25em
-}
-
-svg:not(:root) {
-    overflow:hidden
-}
-
-figure {
-    margin:1em 40px
-}
-
-hr {
-    box-sizing:content-box;
-    height:0
-}
-
-pre,textarea {
-    overflow:auto
-}
-
-code,kbd,pre,samp {
-    font-family:monospace,monospace;
-    font-size:1em
-}
-
-button,input,optgroup,select,textarea {
-    color:inherit;
-    font:inherit;
-    margin:0
-}
-
-button {
-    overflow:visible
-}
-
-button,select {
-    text-transform:none
-}
-
-button,html input[type=button],input[type=reset],input[type=submit] {
-    -webkit-appearance:button;
-    cursor:pointer
-}
-
-button[disabled],html input[disabled] {
-    cursor:default
-}
-
-button::-moz-focus-inner,input::-moz-focus-inner {
-    border:0;
-    padding:0
-}
-
+  bottom: -0.25em;
+}
+sup {
+  top: -0.5em;
+}
+/* Embedded content
+   ========================================================================== */
+/**
+ * Remove the border on images inside links in IE 10.
+ */
+img {
+  border-style: none;
+}
+/* Forms
+   ========================================================================== */
+/**
+ * 1. Change the font styles in all browsers.
+ * 2. Remove the margin in Firefox and Safari.
+ */
+button,
+input,
+optgroup,
+select,
+textarea {
+  font-family: inherit;
+  /* 1 */
+  font-size: 100%;
+  /* 1 */
+  line-height: 1.15;
+  /* 1 */
+  margin: 0;
+  /* 2 */
+}
+/**
+ * Show the overflow in IE.
+ * 1. Show the overflow in Edge.
+ */
+button,
 input {
-    line-height:normal
-}
-
-input[type=checkbox],input[type=radio] {
-    box-sizing:border-box;
-    padding:0
-}
-
-input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button {
-    height:auto
-}
-
-input[type=search] {
-    -webkit-appearance:textfield;
-    box-sizing:content-box
-}
-
-input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration {
-    -webkit-appearance:none
-}
-
+  /* 1 */
+  overflow: visible;
+}
+/**
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
+ * 1. Remove the inheritance of text transform in Firefox.
+ */
+button,
+select {
+  /* 1 */
+  text-transform: none;
+}
+/**
+ * Correct the inability to style clickable types in iOS and Safari.
+ */
+button,
+[type="button"],
+[type="reset"],
+[type="submit"] {
+  -webkit-appearance: button;
+}
+/**
+ * Remove the inner border and padding in Firefox.
+ */
+button::-moz-focus-inner,
+[type="button"]::-moz-focus-inner,
+[type="reset"]::-moz-focus-inner,
+[type="submit"]::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+/**
+ * Restore the focus styles unset by the previous rule.
+ */
+button:-moz-focusring,
+[type="button"]:-moz-focusring,
+[type="reset"]:-moz-focusring,
+[type="submit"]:-moz-focusring {
+  outline: 1px dotted ButtonText;
+}
+/**
+ * Correct the padding in Firefox.
+ */
 fieldset {
-    border:1px solid silver;
-    margin:0 2px;
-    padding:.35em .625em .75em
-}
-
-table {
-    border-collapse:collapse;
-    border-spacing:0
-}
-
+  padding: 0.35em 0.75em 0.625em;
+}
+/**
+ * 1. Correct the text wrapping in Edge and IE.
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
+ * 3. Remove the padding so developers are not caught out when they zero out
+ *    `fieldset` elements in all browsers.
+ */
+legend {
+  box-sizing: border-box;
+  /* 1 */
+  color: inherit;
+  /* 2 */
+  display: table;
+  /* 1 */
+  max-width: 100%;
+  /* 1 */
+  padding: 0;
+  /* 3 */
+  white-space: normal;
+  /* 1 */
+}
+/**
+ * Add the correct vertical alignment in Chrome, Firefox, and Opera.
+ */
+progress {
+  vertical-align: baseline;
+}
+/**
+ * Remove the default vertical scrollbar in IE 10+.
+ */
+textarea {
+  overflow: auto;
+}
+/**
+ * 1. Add the correct box sizing in IE 10.
+ * 2. Remove the padding in IE 10.
+ */
+[type="checkbox"],
+[type="radio"] {
+  box-sizing: border-box;
+  /* 1 */
+  padding: 0;
+  /* 2 */
+}
+/**
+ * Correct the cursor style of increment and decrement buttons in Chrome.
+ */
+[type="number"]::-webkit-inner-spin-button,
+[type="number"]::-webkit-outer-spin-button {
+  height: auto;
+}
+/**
+ * 1. Correct the odd appearance in Chrome and Safari.
+ * 2. Correct the outline style in Safari.
+ */
+[type="search"] {
+  -webkit-appearance: textfield;
+  /* 1 */
+  outline-offset: -2px;
+  /* 2 */
+}
+/**
+ * Remove the inner padding in Chrome and Safari on macOS.
+ */
+[type="search"]::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+/**
+ * 1. Correct the inability to style clickable types in iOS and Safari.
+ * 2. Change font properties to `inherit` in Safari.
+ */
+::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  /* 1 */
+  font: inherit;
+  /* 2 */
+}
+/* Interactive
+   ========================================================================== */
+/*
+ * Add the correct display in Edge, IE 10+, and Firefox.
+ */
+details {
+  display: block;
+}
+/*
+ * Add the correct display in all browsers.
+ */
+summary {
+  display: list-item;
+}
+/* Misc
+   ========================================================================== */
+/**
+ * Add the correct display in IE 10+.
+ */
+template {
+  display: none;
+}
+/**
+ * Add the correct display in IE 10.
+ */
+[hidden] {
+  display: none;
+}
+.hidden,
+.hide {
+  display: none;
+}
 body {
-    margin:0;
-    font-family:'Open Sans',sans-serif
-}
-
-*,:after,:before {
-    box-sizing:inherit
-}
-
+  font-family: 'Open Sans', sans-serif;
+}
+html {
+  box-sizing: border-box;
+}
+*,
+*:before,
+*:after {
+  box-sizing: inherit;
+}
+/* Generic default forms */
+form {
+  width: 100%;
+}
+legend {
+  display: none;
+}
+fieldset {
+  border: none;
+  padding: 0;
+}
+fieldset > div {
+  margin-bottom: 1.5em;
+}
+label {
+  display: block;
+  font-size: 13px;
+  margin-bottom: 0.25em;
+}
+input {
+  width: 100%;
+  padding: 0.5em 0.75em;
+  border: 1px solid transparent;
+  border-radius: 2px;
+}
+/* Generic button */
 .button {
-    box-sizing:border-box;
-    display:inline-block;
-    text-align:center;
-    vertical-align:middle;
-    cursor:pointer;
-    border:1px solid transparent;
-    font-style:normal;
-    white-space:nowrap;
-    text-overflow:ellipsis;
-    padding:.3em 1em;
-    margin:0;
-    overflow:hidden;
-    background:#e1e1e1;
-    color:#151515;
-    font-size:1em;
-    line-height:1.25;
-    max-width:100%
-}
-
+  box-sizing: border-box;
+  display: inline-block;
+  text-align: center;
+  vertical-align: middle;
+  cursor: pointer;
+  border: 1px solid transparent;
+  text-decoration: none;
+  font-style: normal;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  padding: 0.3em 1em;
+  margin: 0;
+  position: relative;
+  overflow: hidden;
+  background: #e1e1e1;
+  color: #151515;
+  font-size: 1em;
+  line-height: 1.25;
+  max-width: 100%;
+}
+.header-content {
+  padding: 1em 1.5em;
+}
+.header-content a {
+  text-decoration: none;
+}
+.header-content .description {
+  margin: 0;
+}
+/* logo ----------------------------------------------------------------------*/
+.logo {
+  font-size: 24px;
+  font-size: 1.5rem;
+  line-height: 1em;
+  font-weight: 800;
+  text-transform: uppercase;
+  margin: 0;
+  display: inline-block;
+}
+.logo span {
+  transition: all 250ms ease-in-out;
+}
+.logo:hover span {
+  color: #EE4056;
+}
+.logo-open {
+  display: block;
+  color: #EE4056;
+}
+.logo-work,
+.logo-outs {
+  color: #f8b5be;
+}
+/* menu navigation -----------------------------------------------------------*/
+.nav-site {
+  font-size: 13px;
+  font-size: 0.8125rem;
+}
+.nav-site ul {
+  list-style-type: none;
+  padding: 0;
+  margin: 0;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+}
+.nav-site li {
+  border-left: 1px solid #e1e1e1;
+  flex-grow: 1;
+  text-align: center;
+}
+.nav-site a {
+  color: #959595;
+  padding: 1.25em;
+  display: block;
+}
+.nav-site a:hover {
+  color: #151515;
+}
+.nav-site .is-active a {
+  color: #151515;
+}
+/* Add workout button with submenu -------------------------------------------*/
+.add-workout {
+  position: relative;
+  /* submenu -------------------------------------------------------------- */
+}
+.add-workout > a {
+  color: #EE4056;
+}
+.add-workout > a:before {
+  content: "+";
+  font-weight: 800;
+  font-size: 32px;
+  font-size: 2rem;
+  line-height: 0;
+  position: relative;
+  top: 8px;
+}
+.add-workout > a span {
+  display: none;
+}
+.add-workout > a:hover {
+  background-color: #EE4056;
+  color: white;
+}
+.add-workout:hover:after {
+  content: "";
+  position: absolute;
+  background-color: white;
+  bottom: -1px;
+  width: 100%;
+  height: 1px;
+  display: block;
+  z-index: 20;
+}
+.add-workout:hover ul {
+  display: inline-block;
+}
+.add-workout ul {
+  display: none;
+  flex-direction: column;
+  position: absolute;
+  background-color: rgba(255, 255, 255, 0.95);
+  right: -1px;
+  border: 1px solid #e1e1e1;
+  width: 153px;
+}
+.add-workout ul li {
+  border-left: transparent;
+  text-align: left;
+}
+.add-workout ul a:hover {
+  background-color: #fbfbfb;
+}
+/* description ---------------------------------------------------------------*/
+.description {
+  font-size: 14px;
+  font-size: 0.875rem;
+  font-weight: 300;
+  letter-spacing: 0.025em;
+  color: #959595;
+}
+/* ------------------------------ STATES ------------------------------------ */
+/* when user is login --------------------------------------------------------*/
+.is-login .header-content {
+  border-bottom: 1px solid #e1e1e1;
+  display: flex;
+  padding: 0em 1.5em;
+  justify-content: space-between;
+  align-items: center;
+}
+.is-login .description {
+  display: none;
+}
+.is-login .logo-open {
+  display: inline-block;
+}
+.workout-content {
+  padding: 2em  1em;
+}
+@media (min-width: 480px) {
+  .workout-content {
+    padding: 2em 6em;
+  }
+}
+@media (min-width: 800px) {
+  .workout-content {
+    display: flex;
+    justify-content: space-between;
+  }
+}
+/* list mode */
+.workout-list {
+  margin-right: 2em;
+  width: 100%;
+  /* provisional layout, replace this with grid layout system based on final content */
+}
+.workout-list > h2 {
+  font-weight: 300;
+  margin: 0 0 1.5em;
+}
+/* Module resume on dashboard workouts */
+.workout-resume {
+  padding: 1.5em 0;
+  position: relative;
+  max-width: 700px;
+}
+@media (min-width: 800px) {
+  .workout-resume {
+    padding-left: 2em;
+    border-left: 1px solid #e1e1e1;
+    transition: all 250ms ease-in-out;
+  }
+}
+.workout-resume:hover {
+  border-color: #151515;
+}
+.workout-resume:hover .workout-title:before {
+  color: #151515;
+}
+.workout-resume ul {
+  padding: 0;
+  list-style-type: none;
+  font-size: 13px;
+  font-size: 0.8125rem;
+}
+.workout-resume ul a {
+  display: block;
+  text-decoration: none;
+}
+.bike:before {
+  display: block;
+  content: "";
+  width: 30px;
+  height: 30px;
+  background-image: url('../media/img/bike.svg');
+  background-size: 100%;
+}
+.workout-title {
+  font-size: 14px;
+  font-size: 0.875rem;
+  margin: 0 0 0em 0;
+  position: relative;
+}
+.workout-title:before {
+  transition: all 250ms ease-in-out;
+  content: "▶";
+  position: absolute;
+  left: -3.25em;
+  top: 0.35em;
+  color: #e1e1e1;
+  font-size: 10px;
+  font-size: 0.625rem;
+}
+.workout-title a {
+  color: #151515;
+  text-decoration: none;
+}
+.workout-title a:hover {
+  color: #EE4056;
+}
+.workout-info {
+  display: flex;
+  align-items: center;
+  margin: 0.25em 0;
+}
+.workout-info li {
+  color: #959595;
+}
+.workout-info li:after {
+  content: "|";
+  margin: 0 0.5em;
+}
+.workout-info li:last-child:after {
+  content: "";
+  margin: 0;
+}
+.workout-map {
+  margin-top: 1em;
+}
+.workout-map img {
+  width: 100%;
+}
+.workout-intro {
+  font-size: 13px;
+  font-size: 0.8125rem;
+  color: #151515;
+}
+.workout-options {
+  display: inline-block;
+  border: 1px solid #e1e1e1;
+  margin-bottom: 0;
+  border-radius: 4px;
+  padding: 0;
+}
+.workout-options li {
+  display: inline-block;
+  border-right: 1px solid #e1e1e1;
+}
+.workout-options li:last-child {
+  border-right: none;
+}
+.workout-options a {
+  display: block;
+  color: #959595;
+  padding: 0.5em 0.75em;
+  text-decoration: none;
+}
+.workout-options a:hover {
+  color: #151515;
+}
+.workout-options a.is-active {
+  background-color: #959595;
+  color: white;
+}
+.owo-del a:hover {
+  color: red;
+}
+.workout-aside {
+  width: 100%;
+}
+@media (min-width: 800px) {
+  .workout-aside {
+    max-width: 300px;
+    padding-left: 1.5em;
+    border-left: 1px solid #e1e1e1;
+  }
+}
+.aside-profile {
+  margin-bottom: 1em;
+}
+.aside-profile img {
+  width: 80px;
+  height: 80px;
+  object-fit: cover;
+  border-radius: 50%;
+}
+.aside-profile h2 {
+  font-weight: 400;
+  font-size: 18px;
+  font-size: 1.125rem;
+  margin: 0 0 0.5em 0;
+}
+.aside-profile ul {
+  list-style-type: none;
+  margin: 0;
+  padding: 0;
+  font-size: 13px;
+  font-size: 0.8125rem;
+  color: #555555;
+}
+/* Workout detail */
+#map {
+  height: 400px;
+}
+@media (min-width: 480px) {
+  #map {
+    height: calc(100vh - 380px);
+  }
+}
+.workout-detail {
+  padding: 0em  1em;
+}
+@media (min-width: 480px) {
+  .workout-detail {
+    max-width: 1280px;
+    margin: 0 auto;
+  }
+}
+@media (min-width: 800px) {
+  .workout-detail {
+    display: flex;
+    justify-content: space-between;
+  }
+}
+.workout-detail-resume {
+  max-width: 500px;
+  margin-bottom: 2em;
+  padding-top: 2em;
+}
+@media (min-width: 800px) {
+  .workout-detail-resume {
+    margin-right: 6em;
+  }
+}
+.workout-detail-resume h3 {
+  margin-top: 0;
+  margin-bottom: 0.5em;
+}
+.workout-detail-resume h3 + div {
+  font-size: 14px;
+  font-size: 0.875rem;
+  color: #959595;
+  line-height: 1.35em;
+}
+.workout-detail-resume .workout-options {
+  font-size: 13px;
+  font-size: 0.8125rem;
+}
+.workout-detail-info {
+  max-width: 600px;
+}
+@media (min-width: 800px) {
+  .workout-detail-info {
+    border-right: 1px solid #e1e1e1;
+    border-left: 1px solid #e1e1e1;
+    padding: 2em 1em 2em 2em;
+  }
+}
+.workout-detail-info ul {
+  list-style-type: none;
+  padding: 0;
+  margin: 0;
+  display: flex;
+  justify-content: space-between;
+  flex-flow: row wrap;
+}
+.workout-detail-info ul span {
+  display: block;
+  font-size: 13px;
+  font-size: 0.8125rem;
+  color: #959595;
+  margin-bottom: 0.25em;
+}
+.workout-detail-info ul span.min,
+.workout-detail-info ul span.avg,
+.workout-detail-info ul span.max {
+  display: inline-block;
+  color: white;
+  padding: 0.5em 0.85em;
+  border-radius: 3px;
+}
+.workout-detail-info ul span.max {
+  background-color: #EE4056;
+}
+.workout-detail-info ul span.min {
+  background-color: #1395CA;
+  margin-right: 0.5em;
+}
+.workout-detail-info ul span.avg {
+  background-color: #17C898;
+  margin-right: 0.5em;
+}
+.workout-detail-info li {
+  margin-bottom: 2em;
+  margin-right: 1em;
+  color: #959595;
+  font-size: 15px;
+  font-size: 0.9375rem;
+}
+.workout-detail-info li.important {
+  font-size: 21px;
+  font-size: 1.3125rem;
+  color: #151515;
+}
+/* Week report */
+.svg-cotent svg {
+  width: 100%;
+  height: 100%;
+}
+.svg-cotent .label {
+  font-size: 13px;
+  font-size: 0.8125rem;
+  text-anchor: middle;
+}
+.svg-cotent .tick {
+  font-size: 13px;
+  font-size: 0.8125rem;
+}
+/* dashboard graphics*/
+.x-axis path,
+.x-axis line {
+  fill: none;
+  stroke: none;
+}
+.bar {
+  fill: #f8b5be;
+}
+.bar:hover {
+  fill: #ee4056;
+}
+.current {
+  fill: #ee4056;
+}
+.week-stats {
+  border: 1px solid #e1e1e1;
+  background-color: rgba(225, 225, 225, 0.1);
+  padding: 0.75em;
+  border-radius: 4px;
+  margin-bottom: 2em;
+}
+.week-stats h3 {
+  margin: 0;
+  font-size: 14px;
+  font-size: 0.875rem;
+}
+.week-stats h3 + p {
+  margin: 0.25em 0 2em 0;
+  color: #959595;
+  font-size: 13px;
+  font-size: 0.8125rem;
+}
+.workout-activity-summary {
+  list-style-type: none;
+  padding: 0;
+  margin: 0;
+  background-color: rgba(21, 21, 21, 0.8);
+  margin-bottom: 0.75em;
+}
+.workout-activity-summary li {
+  color: #e1e1e1;
+  border-bottom: 1px solid #959595;
+  padding: 0.75em 1em;
+  display: flex;
+  justify-content: space-between;
+}
+.workout-activity-summary li:last-child {
+  margin-bottom: 0;
+  border: none;
+}
+.workout-activity-summary li span:first-child {
+  font-weight: bold;
+}
+.workout-activity-tree {
+  list-style-type: none;
+  padding: 0;
+  margin: 0;
+  transition: all 250ms ease-in-out;
+  font-size: 13px;
+  font-size: 0.8125rem;
+}
+.workout-activity-tree > li {
+  margin-bottom: 0.5em;
+  padding-bottom: 0.5em;
+  border-bottom: 1px solid #e1e1e1;
+}
+.workout-activity-tree a {
+  text-decoration: none;
+  display: block;
+  color: #EE4056;
+}
+.workout-activity-tree a:hover {
+  color: #151515;
+}
+.workout-activity-tree a.viewing-year {
+  color: #151515;
+  font-weight: 700;
+  margin-bottom: 0.5em;
+  font-size: 16px;
+  font-size: 1rem;
+}
+.workout-activity-tree a.viewing-month {
+  background-color: #e1e1e1;
+  color: #151515;
+  font-weight: 700;
+}
+.workout-activity-tree-year {
+  list-style-type: none;
+  padding: 0;
+  margin: 0;
+}
+.workout-activity-tree-year > li {
+  display: block;
+  margin-bottom: 0.5em;
+}
+.workout-activity-tree-year a {
+  display: flex;
+  justify-content: space-between;
+  padding: 0.5em;
+  background-color: #fbfbfb;
+  color: #555555;
+}
+.workout-activity-tree-year a:hover {
+  background-color: #e1e1e1;
+}
 .login-content {
-    background-image:url(../media/img/back-01.jpg);
-    background-size:cover;
-    display:-webkit-flex;
-    display:-ms-flexbox;
-    display:flex;
-    -webkit-justify-content:center;
-    -ms-flex-pack:center;
-    justify-content:center;
-    -webkit-align-items:center;
-    -ms-flex-align:center;
-    align-items:center;
-    min-height:300px;
-    padding:1em 0;
-    transition:all 250ms ease-in-out
-}
-
-@media (min-width:1024px) {
-    .login-content {
-	min-height:550px
+  background-image: url("../media/img/back-01.jpg");
+  background-size: cover;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  min-height: calc(100vh - 98px);
+  padding: 1em 0;
+}
+.login-content form {
+  max-width: 380px;
+  background-color: rgba(21, 21, 21, 0.6);
+  border-radius: 6px;
+  padding: 2em 1.5em;
+}
+.login-content form div {
+  margin-bottom: 1.5em;
+}
+.login-content label {
+  color: #e1e1e1;
+}
+.login-content a {
+  color: #e1e1e1;
+  font-size: 13px;
+  text-decoration: none;
+  margin-right: 0.75em;
+}
+.login-content a:hover {
+  color: white;
+}
+.login-content .button {
+  transition: all 500ms ease-in-out;
+  background-color: #EE4056;
+  color: white;
+  text-transform: uppercase;
+}
+.login-content .button:hover {
+  background-color: #e6152f;
+}
+.login-content .message {
+  padding: 0.5em;
+  margin: 0;
+  text-align: center;
+  font-size: 13px;
+  font-size: 0.8125rem;
+}
+.login-content .message.message-error {
+  color: white;
+  background-color: red;
+}
+/*
+.login-remember {
+    color: @color-main-medium;
+    .font-size(14);
+    text-decoration: none;
+    font-weight: 300;
+    &:hover{
+        color: @color-main-light;
     }
-
-
-}
-
-@media (min-width:1440px) {
-    .login-content {
-	min-height:650px
-    }
-
-
-}
-
-.login-content .message {
-    padding:.5em;
-    margin:0;
-    text-align:center;
-    font-size:13px;
-    font-size:.8125rem
-}
-
-.login-content .message.message-error {
-    color:#fff;
-    background-color:red
-}
-
-.login-content form {
-    width:100%;
-    max-width:350px
-}
-
-.login-content legend {
-    display:none
-}
-
-.login-content fieldset {
-    border:none;
-    background-color:rgba(21,21,21,.6);
-    border-radius:6px;
-    padding:2em
-}
-
-.login-content fieldset>div {
-    margin-bottom:1.5em
-}
-
-.login-content input {
-    width:100%;
-    padding:.5em .75em;
-    border:1px solid transparent;
-    border-radius:2px
-}
-
-.login-content input:focus {
-    border-color:#EE4056
-}
-
-.login-content label {
-    display:block;
-    font-size:14px;
-    font-size:.875rem;
-    color:#959595;
-    margin-bottom:.25em
-}
-
-.login-content .button {
-    transition:all .5s ease-in-out;
-    background-color:#EE4056;
-    color:#fff;
-    margin-bottom:1em;
-    text-transform:uppercase
-}
-
-.login-content .button:hover {
-    background-color:#e6152f
-}
-
-.signup-content {
-    background-image:url(../media/img/signup-01.jpg);
-    background-size:cover;
-    display:-webkit-flex;
-    display:-ms-flexbox;
-    display:flex;
-    -webkit-justify-content:center;
-    -ms-flex-pack:center;
-    justify-content:center;
-    -webkit-align-items:center;
-    -ms-flex-align:center;
-    align-items:center;
-    min-height:300px;
-    padding:1em 0;
-    transition:all 250ms ease-in-out
-}
-
-@media (min-width:1024px) {
-    .signup-content {
-	min-height:550px
-    }
-
-
-}
-
-@media (min-width:1440px) {
-    .signup-content {
-	min-height:650px
-    }
-
-
-}
-
-.signup-content form {
-    width:100%;
-    max-width:40%
-}
-
-.signup-content ul.error li {
-    color:#fff;
-    background-color:red
-}
-
-.signup-content legend {
-    display:none
-}
-
-.signup-content fieldset {
-    border:none;
-    background-color:rgba(21,21,21,.6);
-    border-radius:6px;
-    padding:2em
-}
-
-.signup-content fieldset>div {
-    margin-bottom:1.5em
-}
-
-.signup-content input {
-    width:100%;
-    padding:.5em .75em;
-    border:1px solid transparent;
-    border-radius:2px
-}
-
-.signup-content input:focus {
-    border-color:#EE4056
-}
-
-.signup-content label {
-    display:block;
-    font-size:14px;
-    font-size:.875rem;
-    color:#959595;
-    margin-bottom:.25em
-}
-
-.signup-content .button {
-    transition:all .5s ease-in-out;
-    background-color:#EE4056;
-    color:#fff;
-    margin-bottom:1em;
-    text-transform:uppercase
-}
-
-.logo span,.workout-title:before {
-    transition:all 250ms ease-in-out
-}
-
-.logo-open,.logo:hover span {
-    color:#EE4056
-}
-
-.header-content .description,.logo {
-    margin:0
-}
-
-.signup-content .button:hover {
-    background-color:#e6152f
-}
-
-.header-content {
-    padding:1em 1.5em
-}
-
-.logo {
-    font-size:24px;
-    font-size:1.5rem;
-    line-height:1em;
-    font-weight:800;
-    text-transform:uppercase;
-    display:inline-block
-}
-
-.logo-open {
-    display:block
-}
-
-.logo-outs,.logo-work {
-    color:#f8b5be
-}
-
-.nav-site {
-    font-size:13px;
-    font-size:.8125rem
-}
-
-.nav-site ul {
-    list-style-type:none;
-    padding:0;
-    margin:0;
-    display:-webkit-flex;
-    display:-ms-flexbox;
-    display:flex;
-    -webkit-flex-direction:row;
-    -ms-flex-direction:row;
-    flex-direction:row;
-    -webkit-justify-content:space-between;
-    -ms-flex-pack:justify;
-    justify-content:space-between
-}
-
-.nav-site li {
-    border-left:1px solid #e1e1e1;
-    -webkit-flex-grow:1;
-    -ms-flex-positive:1;
-    flex-grow:1;
-    text-align:center
-}
-
-.nav-site a {
-    color:#959595;
-    padding:1.25em;
-    display:block
-}
-
-.nav-site .is-active a,.nav-site a:hover {
-    color:#151515
-}
-
-.add-workout>a {
-    color:#EE4056
-}
-
-.add-workout>a:before {
-    content:"+";
-    font-weight:800;
-    font-size:32px;
-    font-size:2rem;
-    line-height:0;
-    position:relative;
-    top:8px
-}
-
-.add-workout:hover:after,.bike:before {
-    content:""
-}
-
-.add-workout>a span {
-    display:none
-}
-
-.add-workout>a:hover {
-    background-color:#EE4056;
-    color:#fff
-}
-
-.add-workout:hover:after {
-    position:absolute;
-    background-color:#fff;
-    bottom:-1px;
-    width:100%;
-    height:1px;
-    display:block;
-    z-index:20
-}
-
-.add-workout:hover ul {
-    display:inline-block
-}
-
-.add-workout ul {
-    display:none;
-    -webkit-flex-direction:column;
-    -ms-flex-direction:column;
-    flex-direction:column;
-    position:absolute;
-    background-color:rgba(255,255,255,.95);
-    right:-1px;
-    border:1px solid #e1e1e1;
-    width:153px;
-    z-index:10;
-}
-
-.add-workout ul li {
-    border-left:transparent;
-    text-align:left
-}
-
-.add-workout ul a:hover {
-    background-color:#fbfbfb
-}
-
-.description {
-    font-size:14px;
-    font-size:.875rem;
-    font-weight:300;
-    letter-spacing:.025em;
-    color:#959595
-}
-
-.is-login .header-content {
-    border-bottom:1px solid #e1e1e1;
-    display:-webkit-flex;
-    display:-ms-flexbox;
-    display:flex;
-    padding:0 1.5em;
-    -webkit-justify-content:space-between;
-    -ms-flex-pack:justify;
-    justify-content:space-between;
-    -webkit-align-items:center;
-    -ms-flex-align:center;
-    align-items:center
-}
-
-.is-login .description {
-    display:none
-}
-
-.is-login .logo-open {
-    display:inline-block
-}
-
-.workout-content {
-    padding:2em 1em
-}
-
-@media (min-width:480px) {
-    .workout-content {
-	padding:2em 6em
-    }
-
-
-}
-
-.workout-list {
-    margin-right:2em
-}
-
-.workout-list>h2 {
-    font-weight:300;
-    margin:0 0 1.5em
-}
-
-.workout-resume {
-    max-width:540px;
-    padding:1.5em 0;
-    position:relative
-}
-
-@media (min-width:800px) {
-    .workout-content {
-	display:-webkit-flex;
-	display:-ms-flexbox;
-	display:flex;
-	-webkit-justify-content:space-between;
-	-ms-flex-pack:justify;
-	justify-content:space-between
-    }
-
-    .workout-resume {
-	padding-left:2em;
-	border-left:1px solid #e1e1e1;
-	transition:all 250ms ease-in-out
-    }
-
-
-}
-
-.workout-resume:hover {
-    border-color:#151515
-}
-
-.workout-resume:hover .workout-title:before {
-    color:#151515
-}
-
-.workout-resume ul {
-    padding:0;
-    list-style-type:none;
-    font-size:13px;
-    font-size:.8125rem
-}
-
-.workout-resume ul a {
-    display:block
-}
-
-.bike:before {
-    display:block;
-    width:30px;
-    height:30px;
-    background-image:url(../media/img/bike.svg);
-    background-size:100%
-}
-
-.workout-title {
-    font-size:14px;
-    font-size:.875rem;
-    margin:0;
-    position:relative
-}
-
-.workout-title:before {
-    content:"▶";
-    position:absolute;
-    left:-3.25em;
-    top:.35em;
-    color:#e1e1e1;
-    font-size:10px;
-    font-size:.625rem
-}
-
-.workout-title a {
-    color:#151515
-}
-
-.workout-title a:hover {
-    color:#EE4056
-}
-
-.workout-info {
-    display:-webkit-flex;
-    display:-ms-flexbox;
-    display:flex;
-    -webkit-align-items:center;
-    -ms-flex-align:center;
-    align-items:center;
-    margin:.25em 0
-}
-
-.workout-info li {
-    color:#959595
-}
-
-.workout-info li:after {
-    content:"|";
-    margin:0 .5em
-}
-
-.workout-info li:last-child:after {
-    content:"";
-    margin:0
-}
-
-.workout-intro {
-    font-size:13px;
-    font-size:.8125rem;
-    color:#151515
-}
-
-.workout-options {
-    display:inline-block;
-    border:1px solid #e1e1e1;
-    margin-bottom:0;
-    border-radius:4px
-}
-
-.workout-options li {
-    display:inline-block;
-    border-right:1px solid #e1e1e1
-}
-
-.workout-options li:last-child {
-    border-right:none
-}
-
-.workout-options a {
-    color:#959595;
-    padding:.5em .75em
-}
-
-.workout-options a:hover {
-    color:#151515
-}
-
-.workout-map img {
-    width: 100%;
-}
-
-.owo-del a:hover {
-    color:red
-}
-
-.workout-aside {
-    width:100%
-}
-
-.workout-activity-tree {
-    padding:0;
-    list-style-type: none;
-    transition:all 250ms ease-in-out
-                   list-style-type:none;
-    font-size:13px;
-    font-size:.8125rem;
-    color: #959595;
-}
-
-.workout-activity-tree a {
-    text-decoration: none;
-    background-color: transparent;
-    outline: 0;
-    color: #959595;
-}
-
-
-.workout-activity-tree li a.viewing-year {
-    font-size: 17px;
-    color: #151515;
-}
-
-.workout-activity-tree ul.hidden {
-    display: none;
-}
-
-.workout-activity-tree-year {
-    list-style-type: none;
-    padding: 0;
-    padding-left: 15px;
-    font-size:13px;
-    font-size:.8125rem;
-    color: #959595;
-}
-
-.workout-activity-tree-year a {
-    text-decoration: none;
-    background-color: transparent;
-    outline: 0;
-    color: #959595;
-}
-
-
-.workout-activity-tree-year li a.viewing-month {
-    font-size: 17px;
-    color: #151515;
-}
-
-.workout-activity-tree-month {
-    list-style-type: none;
-    padding: 0;
-    padding-left: 15px;
-    font-size:13px;
-    font-size:.8125rem
-    color: #959595;
-}
-
-.workout-activity-tree-month a {
-    text-decoration: none;
-    background-color: transparent;
-    outline: 0;
-    color: #959595;
-}
-
-
-
-@media (min-width:800px) {
-    .workout-aside {
-	max-width:300px;
-	padding-left:1.5em;
-	border-left:1px solid #e1e1e1
-    }
-
-
-}
+}
+<a class="login-remember" href="#">Forgot your password?</a>
+*/
+.user-profile .workout-options {
+  font-size: 13px;
+  font-size: 0.8125rem;
+}
+.user-profile-account {
+  background-color: #fbfbfb;
+  padding: 2em  1em;
+}
+@media (min-width: 480px) {
+  .user-profile-account {
+    padding: 2em 6em;
+  }
+}
+.user-profile-account img {
+  width: 140px;
+  height: 140px;
+  object-fit: cover;
+  border-radius: 50%;
+  margin-bottom: 0.5em;
+}
+.user-profile-account h2 {
+  margin: 0 0 0.15em 0;
+  font-size: 21px;
+  font-size: 1.3125rem;
+}
+.user-profile-account p {
+  color: #555555;
+  font-size: 14px;
+  font-size: 0.875rem;
+  margin: 0;
+}
+.user-profile-account p span {
+  color: #959595;
+}
+.total-workouts {
+  font-size: 13px;
+  font-size: 0.8125rem;
+  font-weight: bold;
+}
+.profile-data {
+  list-style-type: none;
+  padding: 0;
+  font-size: 14px;
+  font-size: 0.875rem;
+}
+.profile-data li {
+  margin-bottom: 0.25em;
+}
+.profile-bio {
+  margin: 1em 0;
+}
+.month-stats,
+.latest-workouts {
+  max-width: 40vw;
+  margin: 0 auto;
+}
+.latest-workouts h4 {
+  margin: 0;
+}
+.latest-workouts h4 a {
+  color: #151515;
+  text-decoration: none;
+}
+.latest-workouts > span {
+  font-size: 13px;
+  font-size: 0.8125rem;
+}
+.latest-workouts p {
+  margin-top: 0.25em;
+  color: #959595;
+  font-size: 13px;
+  font-size: 0.8125rem;
+}
Index: ow/static/css/main.min.css
===================================================================
--- ow/static/css/main.min.css	(revision 5cf5787d1c21f5eedd38c23d588cc1906e4bef1d)
+++ 	(revision )
@@ -1,1 +1,0 @@
-img,legend{border:0}legend,td,th{padding:0}.add-workout,.button,sub,sup{position:relative}.button,.header-content a,.workout-resume ul a,.workout-title a{text-decoration:none}@font-face{font-family:'Open Sans';font-style:normal;font-weight:300;src:local('Open Sans Light'),local('OpenSans-Light'),url(http://fonts.gstatic.com/s/opensans/v13/DXI1ORHCpsQm3Vp6mXoaTYnF5uFdDttMLvmWuJdhhgs.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:400;src:local('Open Sans'),local('OpenSans'),url(http://fonts.gstatic.com/s/opensans/v13/cJZKeOuBrn4kERxqtaUH3aCWcynf_cDxXwCLxiixG1c.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:700;src:local('Open Sans Bold'),local('OpenSans-Bold'),url(http://fonts.gstatic.com/s/opensans/v13/k3k702ZOKiLJc3WVjuplzInF5uFdDttMLvmWuJdhhgs.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:800;src:local('Open Sans Extrabold'),local('OpenSans-Extrabold'),url(http://fonts.gstatic.com/s/opensans/v13/EInbV5DfGHOiMmvb1Xr-honF5uFdDttMLvmWuJdhhgs.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:italic;font-weight:300;src:local('Open Sans Light Italic'),local('OpenSansLight-Italic'),url(http://fonts.gstatic.com/s/opensans/v13/PRmiXeptR36kaC0GEAetxrfB31yxOzP-czbf6AAKCVo.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:italic;font-weight:400;src:local('Open Sans Italic'),local('OpenSans-Italic'),url(http://fonts.gstatic.com/s/opensans/v13/xjAJXh38I15wypJXxuGMBp0EAVxt0G0biEntp43Qt6E.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:italic;font-weight:700;src:local('Open Sans Bold Italic'),local('OpenSans-BoldItalic'),url(http://fonts.gstatic.com/s/opensans/v13/PRmiXeptR36kaC0GEAetxp_TkvowlIOtbR7ePgFOpF4.ttf) format('truetype')}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;box-sizing:border-box}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}.hide,[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,optgroup,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre,textarea{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}table{border-collapse:collapse;border-spacing:0}body{margin:0;font-family:'Open Sans',sans-serif}*,:after,:before{box-sizing:inherit}.button{box-sizing:border-box;display:inline-block;text-align:center;vertical-align:middle;cursor:pointer;border:1px solid transparent;font-style:normal;white-space:nowrap;text-overflow:ellipsis;padding:.3em 1em;margin:0;overflow:hidden;background:#e1e1e1;color:#151515;font-size:1em;line-height:1.25;max-width:100%}.login-content{background-image:url(../media/img/back-01.jpg);background-size:cover;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;min-height:300px;padding:1em 0;transition:all 250ms ease-in-out}@media (min-width:1024px){.login-content{min-height:550px}}@media (min-width:1440px){.login-content{min-height:650px}}.login-content .message{padding:.5em;margin:0;text-align:center;font-size:13px;font-size:.8125rem}.login-content .message.message-error{color:#fff;background-color:red}.login-content form{width:100%;max-width:350px}.login-content legend{display:none}.login-content fieldset{border:none;background-color:rgba(21,21,21,.6);border-radius:6px;padding:2em}.login-content fieldset>div{margin-bottom:1.5em}.login-content input{width:100%;padding:.5em .75em;border:1px solid transparent;border-radius:2px}.login-content input:focus{border-color:#EE4056}.login-content label{display:block;font-size:14px;font-size:.875rem;color:#959595;margin-bottom:.25em}.login-content .button{transition:all .5s ease-in-out;background-color:#EE4056;color:#fff;margin-bottom:1em;text-transform:uppercase}.login-content .button:hover{background-color:#e6152f}.signup-content{background-image:url(../media/img/signup-01.jpg);background-size:cover;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;min-height:300px;padding:1em 0;transition:all 250ms ease-in-out}@media (min-width:1024px){.signup-content{min-height:550px}}@media (min-width:1440px){.signup-content{min-height:650px}}.signup-content form{width:100%;max-width:40%}.signup-content ul.error li{color:#fff;background-color:red}.signup-content legend{display:none}.signup-content fieldset{border:none;background-color:rgba(21,21,21,.6);border-radius:6px;padding:2em}.signup-content fieldset>div{margin-bottom:1.5em}.signup-content input{width:100%;padding:.5em .75em;border:1px solid transparent;border-radius:2px}.signup-content input:focus{border-color:#EE4056}.signup-content label{display:block;font-size:14px;font-size:.875rem;color:#959595;margin-bottom:.25em}.signup-content .button{transition:all .5s ease-in-out;background-color:#EE4056;color:#fff;margin-bottom:1em;text-transform:uppercase}.logo span,.workout-title:before{transition:all 250ms ease-in-out}.logo-open,.logo:hover span{color:#EE4056}.header-content .description,.logo{margin:0}.signup-content .button:hover{background-color:#e6152f}.header-content{padding:1em 1.5em}.logo{font-size:24px;font-size:1.5rem;line-height:1em;font-weight:800;text-transform:uppercase;display:inline-block}.logo-open{display:block}.logo-outs,.logo-work{color:#f8b5be}.nav-site{font-size:13px;font-size:.8125rem}.nav-site ul{list-style-type:none;padding:0;margin:0;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between}.nav-site li{border-left:1px solid #e1e1e1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;text-align:center}.nav-site a{color:#959595;padding:1.25em;display:block}.nav-site .is-active a,.nav-site a:hover{color:#151515}.add-workout>a{color:#EE4056}.add-workout>a:before{content:"+";font-weight:800;font-size:32px;font-size:2rem;line-height:0;position:relative;top:8px}.add-workout:hover:after,.bike:before{content:""}.add-workout>a span{display:none}.add-workout>a:hover{background-color:#EE4056;color:#fff}.add-workout:hover:after{position:absolute;background-color:#fff;bottom:-1px;width:100%;height:1px;display:block;z-index:20}.add-workout:hover ul{display:inline-block}.add-workout ul{display:none;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;position:absolute;background-color:rgba(255,255,255,.95);right:-1px;border:1px solid #e1e1e1;width:153px}.add-workout ul li{border-left:transparent;text-align:left}.add-workout ul a:hover{background-color:#fbfbfb}.description{font-size:14px;font-size:.875rem;font-weight:300;letter-spacing:.025em;color:#959595}.is-login .header-content{border-bottom:1px solid #e1e1e1;display:-webkit-flex;display:-ms-flexbox;display:flex;padding:0 1.5em;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.is-login .description{display:none}.is-login .logo-open{display:inline-block}.workout-content{padding:2em 1em}@media (min-width:480px){.workout-content{padding:2em 6em}}.workout-list{margin-right:2em}.workout-list>h2{font-weight:300;margin:0 0 1.5em}.workout-resume{max-width:540px;padding:1.5em 0;position:relative}@media (min-width:800px){.workout-content{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between}.workout-resume{padding-left:2em;border-left:1px solid #e1e1e1;transition:all 250ms ease-in-out}}.workout-resume:hover{border-color:#151515}.workout-resume:hover .workout-title:before{color:#151515}.workout-resume ul{padding:0;list-style-type:none;font-size:13px;font-size:.8125rem}.workout-resume ul a{display:block}.bike:before{display:block;width:30px;height:30px;background-image:url(../media/img/bike.svg);background-size:100%}.workout-title{font-size:14px;font-size:.875rem;margin:0;position:relative}.workout-title:before{content:"▶";position:absolute;left:-3.25em;top:.35em;color:#e1e1e1;font-size:10px;font-size:.625rem}.workout-title a{color:#151515}.workout-title a:hover{color:#EE4056}.workout-info{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;margin:.25em 0}.workout-info li{color:#959595}.workout-info li:after{content:"|";margin:0 .5em}.workout-info li:last-child:after{content:"";margin:0}.workout-intro{font-size:13px;font-size:.8125rem;color:#151515}.workout-options{display:inline-block;border:1px solid #e1e1e1;margin-bottom:0;border-radius:4px}.workout-options li{display:inline-block;border-right:1px solid #e1e1e1}.workout-options li:last-child{border-right:none}.workout-options a{color:#959595;padding:.5em .75em}.workout-options a:hover{color:#151515}.owo-del a:hover{color:red}.workout-aside{width:100%}@media (min-width:800px){.workout-aside{max-width:300px;padding-left:1.5em;border-left:1px solid #e1e1e1}}
Index: ow/static/css/openworkouts.css
===================================================================
--- ow/static/css/openworkouts.css	(revision 5cf5787d1c21f5eedd38c23d588cc1906e4bef1d)
+++ 	(revision )
@@ -1,46 +1,0 @@
-
-#map {
-    height: 360px;
-    z-index: 0;
-}
-
-#ow-analysis {
-    float: left;
-    width: 98%;
-    padding: 10px;
-    font-size: 0.8em;
-    background-color: #eeeeee;
-}
-
-/* dashboard, weekly stats */
-
-span.week_totals_left {
-    padding-right: 5px;
-    border-right: 1px solid #e1e1e1;
-}
-
-span.week_totals_right {
-    padding-left: 5px;
-}
-
-.x-axis path, .x-axis line {
-    fill: none;
-    stroke: none;
-}
-
-.bar {
-    fill: #f8b5be;
-}
-
-.bar:hover {
-    fill: #ee4056;
-}
-
-.current {
-    fill: #ee4056;
-}
-
-text.label {
-    font-size: 0.6em;
-    text-anchor: middle;
-}
Index: ow/static/js/ow.js
===================================================================
--- ow/static/js/ow.js	(revision 5cf5787d1c21f5eedd38c23d588cc1906e4bef1d)
+++ ow/static/js/ow.js	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -148,5 +148,6 @@
          */
         var chart = d3.select(chart_selector),
-            margin = {top: 20, right: 20, bottom: 30, left: 50},
+            margin = {top: 17, right: 0, bottom: 20, left: 0},
+
             width = +chart.attr("width") - margin.left - margin.right,
             height = +chart.attr("height") - margin.top - margin.bottom,
@@ -211,6 +212,13 @@
 	        })
 	        .attr("y", function (d) {
-                    return y(Number(d.distance) + 5);
-	        })
+                    /*
+                      Get the value for the current bar, then get the maximum
+                      value to be displayed in the bar, which is used to
+                      calculate the proper position of the label for this bar,
+                      relatively to its height (1% above the bar)
+                     */
+                    var max = y.domain()[1];
+                    return y(d.distance + y.domain()[1] * 0.02);
+            })
                 .text(function(d) {
                     if (Number(d.distance) > 0) {
Index: ow/static/less/common.less
===================================================================
--- ow/static/less/common.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/less/common.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,10 @@
+body {
+    font-family: 'Open Sans', sans-serif;
+}
+
+html {
+	box-sizing: border-box;
+}
+*, *:before, *:after {
+	box-sizing: inherit;
+}
Index: ow/static/less/main.less
===================================================================
--- ow/static/less/main.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/less/main.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,26 @@
+// Import google font open sans 300 400, 700, 800
+@import "http://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,700,700italic,800";
+
+// Normalize
+@import "vendors/normalize.less";
+
+// Variables
+@import "variables.less";
+
+// Mixins
+@import "mixins/mixins.less";
+
+// Common styles
+@import "common.less";
+
+// ui
+@import "ui/form.less";
+@import "ui/buttons.less";
+
+// Modules
+@import "modules/header.less";
+@import "modules/workout.less";
+
+// Pages
+@import "pages/login.less";
+@import "pages/profile.less";
Index: ow/static/less/mixins/mixins.less
===================================================================
--- ow/static/less/mixins/mixins.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/less/mixins/mixins.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,12 @@
+
+.font-size(@sizeValue) {
+    @remValue: @sizeValue / 16;
+    @pxValue: (@sizeValue);
+    font-size: ~"@{pxValue}px";
+    font-size: ~"@{remValue}rem";
+}
+
+.hidden,
+.hide{
+	display: none;
+}
Index: ow/static/less/modules/header.less
===================================================================
--- ow/static/less/modules/header.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/less/modules/header.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,154 @@
+.header-content {
+    padding:1em 1.5em;
+    a{
+        text-decoration: none;
+    }
+    .description{
+        margin: 0;
+    }
+}
+
+
+/* logo ----------------------------------------------------------------------*/
+.logo {
+    .font-size(24);
+    line-height: 1em;
+    font-weight: 800;
+    text-transform: uppercase;
+    margin: 0;
+    display: inline-block;
+    span{
+        transition: all 250ms ease-in-out;
+    }
+    &:hover{
+        span{
+            color: @color-app;
+        }
+    }
+}
+.logo-open {
+    display: block;
+    color: @color-app;
+}
+.logo-work,
+.logo-outs {
+    color: @color-app-light;
+}
+
+/* menu navigation -----------------------------------------------------------*/
+.nav-site{
+    .font-size (13);
+
+    ul {
+        list-style-type: none;
+        padding: 0;
+        margin: 0;
+        display: flex;
+        flex-direction: row;
+        justify-content: space-between;
+    }
+    li{
+        border-left: 1px solid @color-main-light;
+        flex-grow: 1;
+        text-align: center;
+    }
+    a{
+        color: @color-main-medium;
+        padding: 1.25em;
+        display: block;
+        &:hover {
+            color: @color-main;
+        }
+    }
+    .is-active {
+        a {
+            color: @color-main;
+        }
+    }
+}
+
+/* Add workout button with submenu -------------------------------------------*/
+.add-workout {
+    position: relative;
+    >a{
+        color: @color-app;
+        &:before{
+            content: "+";
+            font-weight: 800;
+            .font-size(32);
+            line-height: 0;
+            position: relative;
+            top: 8px;
+        }
+        span{
+            display: none;
+        }
+        &:hover{
+            background-color: @color-app;
+            color:white;
+        }
+    }
+    &:hover{
+        &:after{
+            content: "";
+            position: absolute;
+            background-color: white;
+            bottom: -1px;
+            width: 100%;
+            height: 1px;
+            display: block;
+            z-index: 20;
+        }
+        ul{
+            display: inline-block;
+        }
+    }
+
+    /* submenu -------------------------------------------------------------- */
+    ul{
+        display: none;
+        flex-direction: column;
+        position: absolute;
+        background-color: fade(white, 95%);
+        right: -1px;
+        border: 1px solid @color-main-light;
+        width: 153px;
+        li{
+            border-left:transparent;
+            text-align: left;
+        }
+        a{
+            &:hover{
+                background-color: @color-main-xtralight;
+            }
+        }
+    }
+}
+
+/* description ---------------------------------------------------------------*/
+.description {
+    .font-size(14);
+    font-weight: 300;
+    letter-spacing: .025em;
+    color: @color-main-medium;
+}
+
+
+/* ------------------------------ STATES ------------------------------------ */
+
+/* when user is login --------------------------------------------------------*/
+.is-login {
+    .header-content {
+        border-bottom: 1px solid @color-main-light;
+        display: flex;
+        padding: 0em 1.5em;
+        justify-content: space-between;
+        align-items: center;
+    }
+    .description {
+        .hide;
+    }
+    .logo-open {
+        display: inline-block;
+    }
+}
Index: ow/static/less/modules/workout.less
===================================================================
--- ow/static/less/modules/workout.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/less/modules/workout.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,416 @@
+.workout-content {
+    padding: 2em  1em;
+    @media (min-width: @screen-s){
+        padding: 2em 6em;
+    }
+     @media (min-width: @screen-m){
+        display: flex;
+        justify-content:space-between;
+    }
+}
+
+/* list mode */
+.workout-list {
+    margin-right: 2em;
+    width: 100%;
+    >h2{
+        font-weight: 300;
+        margin: 0 0 1.5em;
+    }
+    /* provisional layout, replace this with grid layout system based on final content */
+}
+
+/* Module resume on dashboard workouts */
+.workout-resume {
+    padding: 1.5em 0;
+    position: relative;
+    max-width: 700px;
+    @media (min-width: @screen-m){
+        padding-left: 2em;
+        border-left: 1px solid @color-main-light;
+        transition: all 250ms ease-in-out;
+    }
+    &:hover{
+        border-color: @color-main;
+        .workout-title{
+            &:before{
+                color: @color-main;
+            }
+        }
+    }
+    ul{
+        padding: 0;
+        list-style-type: none;
+        .font-size(13);
+        a{
+            display: block;
+            text-decoration: none;
+        }
+    }
+}
+.bike{
+    &:before{
+        display: block;
+        //position: absolute;
+        content: "";
+        width: 30px;
+        height: 30px;
+        //left:-3.25em;
+        //top: 1.6em;
+        background-image: url('../media/img/bike.svg');
+        background-size: 100%;
+    }
+}
+
+.workout-title{
+    .font-size(14);
+    margin: 0 0 0em 0;
+    position: relative;
+    &:before{
+        transition: all 250ms ease-in-out;
+        content: "▶";
+        position: absolute;
+        left: -3.25em;
+        top:.35em;
+        color:@color-main-light;
+        .font-size(10);
+    }
+    a{
+        color: @color-main;
+        text-decoration: none;
+        &:hover {
+            color: @color-app;
+        }
+    }
+}
+
+.workout-info {
+    display: flex;
+    align-items:center;
+    margin: .25em 0;
+    li{
+        color: @color-main-medium;
+        &:after{
+            content: "|";
+            margin:0 .5em;
+        }
+        &:last-child{
+            &:after{
+                content: "";
+                margin:0;
+            }
+        }
+    }
+}
+
+.workout-map {
+    margin-top: 1em;
+    img {
+        width: 100%;
+    }
+}
+
+.workout-intro {
+    .font-size(13);
+    color: @color-main;
+}
+
+.workout-options{
+    display: inline-block;
+    border:1px solid @color-main-light;
+    margin-bottom: 0;
+    border-radius: 4px;
+    padding: 0;
+    li{
+        display: inline-block;
+        border-right: 1px solid @color-main-light;
+        &:last-child{
+            border-right:none;
+        }
+    }
+    a{
+        display: block;
+        color: @color-main-medium;
+        padding: .5em .75em;
+        text-decoration: none;
+        &:hover{
+            color: @color-main;
+        }
+        &.is-active {
+            background-color: @color-main-medium;
+            color: white;
+        }
+    }
+}
+
+.owo-del{
+    a{
+        &:hover{
+            color: red;
+        }
+    }
+}
+
+.workout-aside{
+    width: 100%;
+    @media (min-width: @screen-m){
+        max-width: 300px;
+        padding-left: 1.5em;
+        border-left:1px solid @color-main-light;
+    }
+}
+
+
+
+.aside-profile {
+    margin-bottom: 1em;
+    img {
+        width: 80px;
+        height: 80px;
+        object-fit: cover;
+        border-radius: 50%;
+    }
+    h2 {
+        font-weight: 400;
+        .font-size(18);
+         margin: 0 0 .5em 0;
+    }
+    ul {
+        list-style-type: none;
+        margin:0;
+        padding:0;
+        .font-size(13);
+        color: @color-main-dark;
+    }
+}
+
+
+
+/* Workout detail */
+#map {
+    height: 400px;
+    @media (min-width: @screen-s){
+        height: calc(100vh - 380px);
+    }
+}
+
+.workout-detail {
+    padding: 0em  1em;
+    @media (min-width: @screen-s){
+        max-width: 1280px;
+        margin: 0 auto;
+    }
+     @media (min-width: @screen-m){
+        display: flex;
+        justify-content:space-between;
+    }
+}
+
+.workout-detail-resume {
+    max-width: 500px;
+    margin-bottom: 2em;
+    padding-top: 2em;
+    @media (min-width: @screen-m){
+        margin-right: 6em;
+    }
+    h3 {
+        margin-top: 0;
+        margin-bottom: .5em;
+        & + div {
+            .font-size(14);
+            color: @color-main-medium;
+            line-height: 1.35em;
+        }
+    }
+    .workout-options {
+        .font-size(13);
+    }
+}
+
+.workout-detail-info {
+    max-width: 600px;
+    @media (min-width: @screen-m){
+        border-right: 1px solid @color-main-light;
+        border-left: 1px solid @color-main-light;
+        padding:2em 1em 2em 2em;
+    }
+    ul {
+        list-style-type: none;
+        padding:0;
+        margin: 0;
+        display: flex;
+        justify-content:space-between;
+        flex-flow: row wrap;
+        span {
+            display: block;
+            .font-size(13);
+            color: @color-main-medium;
+            margin-bottom: .25em;
+            &.min,
+            &.avg,
+            &.max {
+                display: inline-block;
+                color: white;
+                padding: .5em .85em;
+                border-radius: 3px;
+            }
+            &.max {
+                background-color: @color-app;
+            }
+            &.min {
+                background-color: #1395CA;
+                margin-right: .5em;
+            }
+
+            &.avg {
+                background-color: #17C898;
+                margin-right: .5em;
+            }
+        }
+    }
+    li {
+        margin-bottom: 2em;
+        margin-right: 1em;
+        color: @color-main-medium;
+        .font-size(15);
+        &.important {
+            .font-size(21);
+            color: @color-main;
+        }
+    }
+}
+
+
+
+/* Week report */
+.svg-cotent {
+    svg {
+        width: 100%;
+        height: 100%;
+    }
+
+    .label {
+        .font-size(13);
+        text-anchor: middle;
+    }
+    .tick {
+        .font-size(13);
+    }
+
+}
+
+/* dashboard graphics*/
+.x-axis path, .x-axis line {
+    fill: none;
+    stroke: none;
+}
+
+.bar {
+    fill: #f8b5be;
+    &:hover {
+        fill: #ee4056;
+    }
+}
+
+.current {
+    fill: #ee4056;
+}
+
+
+
+.week-stats {
+    border: 1px solid @color-main-light;
+    background-color: fade(@color-main-light, 10%);
+    padding: .75em;
+    border-radius: 4px;
+    margin-bottom: 2em;
+    h3 {
+        margin: 0;
+        .font-size(14);
+        & + p {
+            margin: .25em 0 2em 0;
+            color: @color-main-medium;
+            .font-size(13);
+        }
+    }
+}
+
+.workout-activity-summary {
+    list-style-type: none;
+    padding: 0;
+    margin: 0;
+    background-color: fade(@color-main, 80%);
+    margin-bottom: .75em;
+    li {
+        color: @color-main-light;
+        border-bottom: 1px solid @color-main-medium;
+        padding: .75em 1em;
+        display: flex;
+        justify-content: space-between;
+        &:last-child {
+            margin-bottom: 0;
+            border: none;
+        }
+        span {
+            &:first-child {
+                font-weight: bold;
+            }
+        }
+    }
+}
+
+.workout-activity-tree {
+    list-style-type: none;
+    padding: 0;
+    margin: 0;
+    transition:all 250ms ease-in-out;
+    .font-size(13);
+    >li {
+        margin-bottom: .5em;
+        padding-bottom: .5em;
+        border-bottom: 1px solid @color-main-light;
+    }
+    a {
+        text-decoration: none;
+        display: block;
+        color: @color-app;
+        &:hover{
+            color: @color-main;
+        }
+
+        &.viewing-year {
+            color: @color-main;
+            font-weight: 700;
+            margin-bottom: .5em;
+            .font-size(16);
+        }
+        &.viewing-month {
+            background-color: @color-main-light;
+            color: @color-main;
+            font-weight: 700;
+        }
+    }
+}
+
+
+.workout-activity-tree-year {
+    list-style-type: none;
+    padding: 0;
+    margin: 0;
+    >li {
+        display: block;
+        margin-bottom: .5em;
+    }
+    a {
+        display: flex;
+        justify-content: space-between;
+        padding: .5em;
+        background-color: @color-main-xtralight;
+        color: @color-main-dark;
+        &:hover {
+            background-color: @color-main-light;
+        }
+    }
+}
+
+
Index: ow/static/less/pages/login.less
===================================================================
--- ow/static/less/pages/login.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/less/pages/login.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,67 @@
+.login-content {
+    background-image: url("@{path-img}/back-01.jpg");
+    background-size: cover;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    min-height: calc(100vh - 98px);
+    padding: 1em 0;
+
+
+    form{
+        max-width: 380px;
+        background-color: fadeout(@color-main, 40%);
+        border-radius: 6px;
+        padding: 2em  1.5em;
+        div {
+            margin-bottom: 1.5em;
+        }
+    }
+
+    label {
+        color: @color-main-light;
+    }
+    a {
+        color: @color-main-light;
+        font-size: 13px;
+        text-decoration: none;
+        margin-right: .75em;
+        &:hover {
+            color: white;
+        }
+    }
+
+    .button {
+        transition: all 500ms ease-in-out;
+        background-color: @color-app;
+        color: white;
+        text-transform: uppercase;
+        &:hover {
+            background-color: darken(@color-app, 10%);
+        }
+    }
+
+    .message {
+        padding: .5em;
+        margin: 0;
+        text-align: center;
+        .font-size(13);
+        &.message-error{
+            color: white;
+            background-color: red;
+        }
+    }
+}
+
+/*
+.login-remember {
+    color: @color-main-medium;
+    .font-size(14);
+    text-decoration: none;
+    font-weight: 300;
+    &:hover{
+        color: @color-main-light;
+    }
+}
+<a class="login-remember" href="#">Forgot your password?</a>
+*/
Index: ow/static/less/pages/profile.less
===================================================================
--- ow/static/less/pages/profile.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/less/pages/profile.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,73 @@
+.user-profile {
+    .workout-options {
+    	.font-size(13);
+    }
+}
+
+.user-profile-account {
+	background-color: @color-main-xtralight;
+    padding: 2em  1em;
+    @media (min-width: @screen-s){
+        padding: 2em 6em;
+    }
+    img {
+        width: 140px;
+        height: 140px;
+        object-fit: cover;
+        border-radius: 50%;
+        margin-bottom: .5em;
+    }
+	h2 {
+		margin: 0 0 .15em 0;
+		.font-size(21);
+	}
+	p{
+		color: @color-main-dark;
+		.font-size(14);
+		margin: 0;
+		span {
+			color: @color-main-medium;
+		}
+	}
+}
+.total-workouts {
+	.font-size(13);
+	font-weight: bold;
+}
+
+.profile-data {
+	list-style-type: none;
+	padding: 0;
+	.font-size(14);
+	li {
+		margin-bottom: .25em;
+	}
+}
+
+.profile-bio {
+	margin: 1em 0;
+}
+
+.month-stats,
+.latest-workouts {
+	max-width: 40vw;
+	margin: 0 auto;
+}
+
+.latest-workouts {
+	h4 {
+		margin:0;
+		a {
+			color: @color-main;
+			text-decoration: none;
+		}
+	}
+	>span {
+		.font-size(13);
+	}
+	p {
+		margin-top: .25em;
+		color: @color-main-medium;
+		.font-size(13);
+	}
+}
Index: ow/static/less/ui/buttons.less
===================================================================
--- ow/static/less/ui/buttons.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/less/ui/buttons.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,22 @@
+/* Generic button */
+.button {
+    box-sizing: border-box;
+    display: inline-block;
+    text-align: center;
+    vertical-align: middle;
+    cursor: pointer;
+    border: 1px solid transparent;
+    text-decoration: none;
+    font-style: normal;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    padding: 0.3em 1em;
+    margin: 0;
+    position: relative;
+    overflow: hidden;
+    background: @color-main-light;
+    color: @color-main;
+    font-size: 1em;
+    line-height: 1.25;
+    max-width: 100%;
+}
Index: ow/static/less/ui/form.less
===================================================================
--- ow/static/less/ui/form.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/less/ui/form.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,28 @@
+/* Generic default forms */
+form{
+    width: 100%;
+}
+
+legend {
+    display: none;
+}
+
+fieldset {
+    border: none;
+    padding: 0;
+}
+fieldset > div {
+    margin-bottom: 1.5em;
+}
+
+label {
+    display: block;
+    font-size: 13px;
+    margin-bottom: .25em;
+}
+input {
+    width: 100%;
+    padding: .5em .75em;
+    border: 1px solid transparent;
+    border-radius: 2px;
+}
Index: ow/static/less/variables.less
===================================================================
--- ow/static/less/variables.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/less/variables.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,22 @@
+// colors:
+@color-main: #151515;
+@color-main-dark: lighten(@color-main, 25%);
+@color-main-medium: lighten(@color-main, 50%);
+@color-main-light: lighten(@color-main, 80%);
+@color-main-xtralight: lighten(@color-main, 90%);
+
+@color-app: #EE4056;
+@color-app-medium: lighten(@color-app, 15%);
+@color-app-light: lighten(@color-app, 25%);
+
+
+// Img paths
+@path-img: "../media/img";
+
+
+// Media queries
+@screen-xs: 320px;
+@screen-s: 480px;
+@screen-m: 800px;
+@screen-l: 1024px;
+@screen-xl: 1440px;
Index: ow/static/less/vendors/normalize.less
===================================================================
--- ow/static/less/vendors/normalize.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/less/vendors/normalize.less	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,349 @@
+/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
+
+/* Document
+   ========================================================================== */
+
+/**
+ * 1. Correct the line height in all browsers.
+ * 2. Prevent adjustments of font size after orientation changes in iOS.
+ */
+
+html {
+  line-height: 1.15; /* 1 */
+  -webkit-text-size-adjust: 100%; /* 2 */
+}
+
+/* Sections
+   ========================================================================== */
+
+/**
+ * Remove the margin in all browsers.
+ */
+
+body {
+  margin: 0;
+}
+
+/**
+ * Render the `main` element consistently in IE.
+ */
+
+main {
+  display: block;
+}
+
+/**
+ * Correct the font size and margin on `h1` elements within `section` and
+ * `article` contexts in Chrome, Firefox, and Safari.
+ */
+
+h1 {
+  font-size: 2em;
+  margin: 0.67em 0;
+}
+
+/* Grouping content
+   ========================================================================== */
+
+/**
+ * 1. Add the correct box sizing in Firefox.
+ * 2. Show the overflow in Edge and IE.
+ */
+
+hr {
+  box-sizing: content-box; /* 1 */
+  height: 0; /* 1 */
+  overflow: visible; /* 2 */
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+pre {
+  font-family: monospace, monospace; /* 1 */
+  font-size: 1em; /* 2 */
+}
+
+/* Text-level semantics
+   ========================================================================== */
+
+/**
+ * Remove the gray background on active links in IE 10.
+ */
+
+a {
+  background-color: transparent;
+}
+
+/**
+ * 1. Remove the bottom border in Chrome 57-
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+ */
+
+abbr[title] {
+  border-bottom: none; /* 1 */
+  text-decoration: underline; /* 2 */
+  text-decoration: underline dotted; /* 2 */
+}
+
+/**
+ * Add the correct font weight in Chrome, Edge, and Safari.
+ */
+
+b,
+strong {
+  font-weight: bolder;
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+code,
+kbd,
+samp {
+  font-family: monospace, monospace; /* 1 */
+  font-size: 1em; /* 2 */
+}
+
+/**
+ * Add the correct font size in all browsers.
+ */
+
+small {
+  font-size: 80%;
+}
+
+/**
+ * Prevent `sub` and `sup` elements from affecting the line height in
+ * all browsers.
+ */
+
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+sup {
+  top: -0.5em;
+}
+
+/* Embedded content
+   ========================================================================== */
+
+/**
+ * Remove the border on images inside links in IE 10.
+ */
+
+img {
+  border-style: none;
+}
+
+/* Forms
+   ========================================================================== */
+
+/**
+ * 1. Change the font styles in all browsers.
+ * 2. Remove the margin in Firefox and Safari.
+ */
+
+button,
+input,
+optgroup,
+select,
+textarea {
+  font-family: inherit; /* 1 */
+  font-size: 100%; /* 1 */
+  line-height: 1.15; /* 1 */
+  margin: 0; /* 2 */
+}
+
+/**
+ * Show the overflow in IE.
+ * 1. Show the overflow in Edge.
+ */
+
+button,
+input { /* 1 */
+  overflow: visible;
+}
+
+/**
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
+ * 1. Remove the inheritance of text transform in Firefox.
+ */
+
+button,
+select { /* 1 */
+  text-transform: none;
+}
+
+/**
+ * Correct the inability to style clickable types in iOS and Safari.
+ */
+
+button,
+[type="button"],
+[type="reset"],
+[type="submit"] {
+  -webkit-appearance: button;
+}
+
+/**
+ * Remove the inner border and padding in Firefox.
+ */
+
+button::-moz-focus-inner,
+[type="button"]::-moz-focus-inner,
+[type="reset"]::-moz-focus-inner,
+[type="submit"]::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+/**
+ * Restore the focus styles unset by the previous rule.
+ */
+
+button:-moz-focusring,
+[type="button"]:-moz-focusring,
+[type="reset"]:-moz-focusring,
+[type="submit"]:-moz-focusring {
+  outline: 1px dotted ButtonText;
+}
+
+/**
+ * Correct the padding in Firefox.
+ */
+
+fieldset {
+  padding: 0.35em 0.75em 0.625em;
+}
+
+/**
+ * 1. Correct the text wrapping in Edge and IE.
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
+ * 3. Remove the padding so developers are not caught out when they zero out
+ *    `fieldset` elements in all browsers.
+ */
+
+legend {
+  box-sizing: border-box; /* 1 */
+  color: inherit; /* 2 */
+  display: table; /* 1 */
+  max-width: 100%; /* 1 */
+  padding: 0; /* 3 */
+  white-space: normal; /* 1 */
+}
+
+/**
+ * Add the correct vertical alignment in Chrome, Firefox, and Opera.
+ */
+
+progress {
+  vertical-align: baseline;
+}
+
+/**
+ * Remove the default vertical scrollbar in IE 10+.
+ */
+
+textarea {
+  overflow: auto;
+}
+
+/**
+ * 1. Add the correct box sizing in IE 10.
+ * 2. Remove the padding in IE 10.
+ */
+
+[type="checkbox"],
+[type="radio"] {
+  box-sizing: border-box; /* 1 */
+  padding: 0; /* 2 */
+}
+
+/**
+ * Correct the cursor style of increment and decrement buttons in Chrome.
+ */
+
+[type="number"]::-webkit-inner-spin-button,
+[type="number"]::-webkit-outer-spin-button {
+  height: auto;
+}
+
+/**
+ * 1. Correct the odd appearance in Chrome and Safari.
+ * 2. Correct the outline style in Safari.
+ */
+
+[type="search"] {
+  -webkit-appearance: textfield; /* 1 */
+  outline-offset: -2px; /* 2 */
+}
+
+/**
+ * Remove the inner padding in Chrome and Safari on macOS.
+ */
+
+[type="search"]::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+/**
+ * 1. Correct the inability to style clickable types in iOS and Safari.
+ * 2. Change font properties to `inherit` in Safari.
+ */
+
+::-webkit-file-upload-button {
+  -webkit-appearance: button; /* 1 */
+  font: inherit; /* 2 */
+}
+
+/* Interactive
+   ========================================================================== */
+
+/*
+ * Add the correct display in Edge, IE 10+, and Firefox.
+ */
+
+details {
+  display: block;
+}
+
+/*
+ * Add the correct display in all browsers.
+ */
+
+summary {
+  display: list-item;
+}
+
+/* Misc
+   ========================================================================== */
+
+/**
+ * Add the correct display in IE 10+.
+ */
+
+template {
+  display: none;
+}
+
+/**
+ * Add the correct display in IE 10.
+ */
+
+[hidden] {
+  display: none;
+}
Index: ow/static/media/img/bike.svg
===================================================================
--- ow/static/media/img/bike.svg	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
+++ ow/static/media/img/bike.svg	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 17.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="100px" height="100px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve">
+<path fill="#CCCCCC" d="M78.793,38.432c-2.427,0-4.751,0.444-6.896,1.249l-3.136-11.032l-0.915,0.281l-1.12-3.832h5.952
+	c1.878,0,4.498,0.56,4.498,2.51s-1.167,2.333-3.047,2.333h-1.472v1.938h1.83c3.094,0,4.476-1.574,4.476-4.358
+	c0-3.431-3.548-4.358-5.926-4.358h-8.96l1.604,6.333l-0.826,0.215l0.186,0.795l-28.429,1.839l-2.915-9.619l0.096-0.156
+	c0,0,0.355-1.911,1.936-1.911s4.744-1.122,4.744-1.682c0-0.561-0.816-0.682-0.816-0.682S23.24,17.907,23.24,18.978
+	c0,1.071,2.698,2.04,4.329,2.04s1.07,0.459,2.6,1.784c0.666,0.577,1.322,0.786,1.852,0.84l3.008,9.991l-4.446,7.179
+	c-2.785-1.516-5.979-2.377-9.375-2.377C10.362,38.434,1.572,47.226,1.572,58.07s8.79,19.636,19.636,19.636
+	c7.901,0,14.708-4.669,17.823-11.397c1.106,1.606,2.984,2.512,5.114,2.512c3.246,0,5.899-2.074,6.138-5.948h4.062
+	c0.571,0,1.035-0.397,1.035-0.968s-0.464-0.968-1.035-0.968h-4.256c-0.169,0-0.433-1.035-0.781-1.567l17.96-21.019l0.891,3.175
+	c-5.414,3.497-9.001,9.599-9.001,16.523c0,10.844,8.79,19.646,19.636,19.646s19.635-8.787,19.635-19.631
+	C98.429,47.219,89.639,38.432,78.793,38.432z M21.207,72.268c-7.842,0-14.199-6.357-14.199-14.199S13.364,43.87,21.207,43.87
+	s14.199,6.357,14.199,14.199C35.406,65.913,29.048,72.268,21.207,72.268z M40.833,57.721c-0.116-6.639-3.521-12.475-8.66-15.941
+	l3.584-5.786l6.511,21.052C41.756,57.207,41.277,57.437,40.833,57.721z M46.305,57.303c-0.673-0.253-1.365-0.231-1.37-0.231
+	L38.31,35.084l27.455-1.853l0.24,0.881L46.305,57.303z M78.793,72.268c-7.842,0-14.199-6.357-14.199-14.199
+	S70.951,43.87,78.793,43.87s14.199,6.357,14.199,14.199C92.993,65.913,86.637,72.268,78.793,72.268z"/>
+</svg>
Index: ow/templates/base_anonymous.pt
===================================================================
--- ow/templates/base_anonymous.pt	(revision 5cf5787d1c21f5eedd38c23d588cc1906e4bef1d)
+++ ow/templates/base_anonymous.pt	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -25,5 +25,5 @@
 
     <link rel="stylesheet"
-          href="${request.static_url('ow:static/css/main.min.css')}" />
+          href="${request.static_url('ow:static/css/main.css')}" />
 
   </head>
@@ -37,5 +37,5 @@
           <a href="#" tal:attributes="href request.resource_url(request.root)">
             <span class="logo-open">Open</span><span class="logo-work">work</span><span class="logo-outs">outs</span>
-        </a>
+          </a>
         </h1>
         <p class="description">tracking your workouts openly</p>
Index: ow/templates/dashboard.pt
===================================================================
--- ow/templates/dashboard.pt	(revision 5cf5787d1c21f5eedd38c23d588cc1906e4bef1d)
+++ ow/templates/dashboard.pt	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -25,8 +25,6 @@
       <section class="workout-list">
 
-        <h2 tal:content="context.fullname"></h2>
-
         <h3>
-            (<tal:n tal:content="len(workouts)"></tal:n>/<tal:n tal:content="context.num_workouts"></tal:n>) <tal:t i18n:translate="">workouts</tal:t>
+           <tal:n tal:content="len(workouts)"></tal:n> <tal:t i18n:translate="">Activities</tal:t>
         </h3>
 
@@ -110,4 +108,37 @@
 
       <aside class="workout-aside">
+        <div class="aside-profile">
+          <tal:c tal:condition="getattr(context, 'picture', None)">
+            <img tal:attributes="src request.resource_path(context, 'picture')"
+                 width="450" />
+          </tal:c>
+          <h2 tal:content="context.fullname"></h2>
+          <ul>
+            <Li>
+              <tal:n tal:content="context.num_workouts"></tal:n> <tal:t i18n:translate="">workouts</tal:t>
+            </Li>
+          </ul>
+        </div>
+          <div class="week-stats js-week-stats">
+            <h3><tal:t i18n:translate="">This week</tal:t></h3>
+            <p tal:define="totals context.week_totals">
+              <span class="week-stats-distance">
+                <tal:d tal:content="round(totals['distance'])"></tal:d>
+                <tal:t i18n:translate="">kms</tal:t>
+              </span>
+              <span class="week-stats-time">
+                <tal:hms tal:define="hms timedelta_to_hms(totals['time'])">
+                  <tal:h tal:content="str(hms[0]).zfill(2)"></tal:h>
+                  <tal:t i18n:translate="">hours</tal:t>,
+                  <tal:h tal:content="str(hms[1]).zfill(2)"></tal:h>
+                  <tal:t i18n:translate="">min.</tal:t>
+                </tal:hms>
+              </span>
+            </p>
+            <div class="svg-cotent">
+              <svg width="300" height="200" viewBox="0 0 300 200"></svg>
+            </div>
+          </div>
+
           <tal:activity_tree tal:condition="context.num_workouts > 0">
               <ul class="workout-activity-tree" tal:define="tree context.activity_dates_tree">
@@ -118,21 +149,39 @@
                                              class 'js-year viewing-year' if is_viewing_year  else 'js-year'">
                           </a>
+                          <ul tal:define="stats context.stats(year)" tal:attributes="class 'workout-activity-summary' if is_viewing_year  else 'workout-activity-summary hidden'">
+                            <li>
+                              <span i18n:translate="">Workouts:</span>
+                              <span tal:content="stats['workouts']"></span>
+                            </li>
+                            <li>
+                              <span i18n:translate="">Distance:</span>
+                              <span> <tal:kms tal:content="round(stats['distance'])"></tal:kms> km</span>
+                            </li>
+                            <li>
+                              <span i18n:translate="">Time:</span>
+                              <tal:hms tal:define="hms timedelta_to_hms(stats['time'])">
+                                <span>
+                                  <tal:h tal:content="str(hms[0]).zfill(2)"></tal:h>
+                                  <tal:t i18n:translate="">hours</tal:t>,
+                                  <tal:h tal:content="str(hms[1]).zfill(2)"></tal:h>
+                                  <tal:t i18n:translate="">min.</tal:t>
+                                </span>
+                              </tal:hms>
+                            </li>
+                            <li>
+                              <span i18n:translate="">Elevation:</span>
+                              <span> <tal:m tal:content="stats['elevation']"></tal:m> m</span>
+                            </li>
+                          </ul>
                           <ul class="workout-activity-tree-year"
                               tal:attributes="class 'workout-activity-tree-year' if is_viewing_year  else 'workout-activity-tree-year hidden'">
                               <tal:months tal:repeat="month sorted(tree[year].keys())">
                                   <li tal:define="is_viewing_month is_viewing_year and month == viewing_month">
-                                      <a href="" tal:content="month_name[month]"
+                                      <a href=""
                                          tal:attributes="href request.resource_url(context, query={'year': year, 'month': month});
                                                          class 'viewing-month' if is_viewing_month else ''">
+                                           <span tal:content="month_name[month]"></span>
+                                           <span tal:content="sum([tree[year][month][sport] for sport in tree[year][month]])"></span>
                                       </a>
-                                      <ul class="workout-activity-tree-month">
-                                          <tal:sports tal:repeat="sport sorted(tree[year][month].keys())">
-                                              <li>
-                                                  <a href="#">
-                                                      <tal:sport tal:content="sport"></tal:sport> (<tal:workouts tal:content="tree[year][month][sport]"></tal:workouts>)
-                                                  </a>
-                                              </li>
-                                          </tal:sports>
-                                      </ul>
                                   </li>
                               </tal:months>
@@ -142,60 +191,4 @@
               </ul>
           </tal:activity_tree>
-
-          <tal:stats>
-
-            <div class="week-stats js-week-stats">
-              <h3><tal:t i18n:translate="">This week</tal:t></h3>
-              <h4 tal:define="totals context.week_totals">
-                <span class="week_totals_left">
-                  <tal:d tal:content="round(totals['distance'])"></tal:d>
-                  <tal:t i18n:translate="">kms</tal:t>
-                </span>
-                <span class="week_totals_right">
-                  <tal:hms tal:define="hms timedelta_to_hms(totals['time'])">
-                    <tal:h tal:content="str(hms[0]).zfill(2)"></tal:h>
-                    <tal:t i18n:translate="">hours</tal:t>,
-                    <tal:h tal:content="str(hms[1]).zfill(2)"></tal:h>
-                    <tal:t i18n:translate="">min.</tal:t>
-                  </tal:hms>
-                </span>
-              </h4>
-              <svg width="300" height="200"></svg>
-              <style>
-
-              </style>
-            </div>
-
-            <div class="user-stats">
-              <tal:year-stats tal:repeat="year context.activity_years">
-                <h3><a href="" tal:content="year"></a></h3>
-                <ul tal:define="stats context.stats(year)">
-                  <li>
-                    <span i18n:translate="">Workouts:</span>
-                    <span tal:content="stats['workouts']"></span>
-                  </li>
-                  <li>
-                    <span i18n:translate="">Distance:</span>
-                    <span tal:content="round(stats['distance'])"></span> kms
-                  </li>
-                  <li>
-                    <span i18n:translate="">Time:</span>
-                    <tal:hms tal:define="hms timedelta_to_hms(stats['time'])">
-                      <span>
-                        <tal:h tal:content="str(hms[0]).zfill(2)"></tal:h>
-                        <tal:t i18n:translate="">hours</tal:t>,
-                        <tal:h tal:content="str(hms[1]).zfill(2)"></tal:h>
-                        <tal:t i18n:translate="">min.</tal:t>
-                      </span>
-                    </tal:hms>
-                  </li>
-                  <li>
-                    <span i18n:translate="">Elevation:</span>
-                    <span tal:content="stats['elevation']"></span> m
-                  </li>
-                </ul>
-              </tal:year-stats>
-            </div>
-          </tal:stats>
 
       </aside>
Index: ow/templates/login.pt
===================================================================
--- ow/templates/login.pt	(revision 5cf5787d1c21f5eedd38c23d588cc1906e4bef1d)
+++ ow/templates/login.pt	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -34,7 +34,9 @@
                      type="password" i18n:attributes="placeholder">
             </div>
-            <input class="button" type="submit" name="submit" value="Login">
+            <div>
+              <input class="button button-action" type="submit" name="submit" value="Login">
+            </div>
             <a class="login-remember" href="#" i18n:translate="">
-              Forgot your password?</a> |
+              Forgot your password?</a>
             <a class="join-now" href="" i18n:translate=""
                tal:attributes="href request.resource_url(context, 'signup')">
Index: ow/templates/profile.pt
===================================================================
--- ow/templates/profile.pt	(revision 5cf5787d1c21f5eedd38c23d588cc1906e4bef1d)
+++ ow/templates/profile.pt	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -15,27 +15,22 @@
 
     <div class="user-profile">
-      <tal:c tal:condition="getattr(context, 'picture', None)">
-        <img tal:attributes="src request.resource_path(context, 'picture')"
-             width="450" />
-      </tal:c>
-      <h2>
-          <tal:fullname tal:content="context.fullname"></tal:fullname>
+      <div class="user-profile-account">
+        <tal:c tal:condition="getattr(context, 'picture', None)">
+          <img tal:attributes="src request.resource_path(context, 'picture')"
+               width="450" />
+        </tal:c>
+        <h2>
+            <tal:fullname tal:content="context.fullname"></tal:fullname>
+        </h2>
+        <p>
           <tal:has-nickname tal:condition="context.nickname">
-              (<tal:nickname tal:content="context.nickname"></tal:nickname>)
-          </tal:has-nickname>
-      </h2>
-      <h3>
-        <tal:email tal:content="context.email"></tal:email>
-      </h3>
-      <h4>
-        <a href=""
-           tal:attributes="href request.resource_url(context, 'edit')"
-           i18n:translate="">edit profile</a> |
-        <a href=""
-           tal:attributes="href request.resource_url(context, 'passwd')"
-           i18n:translate="">change password</a>
-      </h4>
-      <div class="profile-info">
-        <ul>
+              <tal:nickname tal:content="context.nickname"></tal:nickname>
+          </tal:has-nickname> |
+          <span><tal:email tal:content="context.email"></tal:email></span>
+        </p>
+
+        <div class="profile-bio" tal:content="getattr(context, 'bio', '')"></div>
+
+        <ul class="profile-data">
           <li>
             <tal:t i18n:translate="">Gender:</tal:t>
@@ -57,24 +52,33 @@
           </li>
         </ul>
+        <ul class="workout-options">
+          <li><a href=""
+             tal:attributes="href request.resource_url(context, 'edit')"
+             i18n:translate="">edit profile</a></li>
+          <li><a href=""
+             tal:attributes="href request.resource_url(context, 'passwd')"
+             i18n:translate="">change password</a></li>
+        </ul>
       </div>
 
-      <div class="profile-bio" tal:content="getattr(context, 'bio', '')"></div>
-
-      <div class="profile-workouts">
-        <tal:t i18n:translate="">Total number of workouts</tal:t>:
+      <div class="total-workouts">
         <tal:w tal:replace="context.num_workouts"></tal:w>
+        <tal:t i18n:translate="">workouts</tal:t>
       </div>
 
       <div class="month-stats js-month-stats">
-        <svg width="600" height="300"></svg>
-        <div class="filters js-filters">
-          <a href="#" class="js-distance" i18n:translate="">distance</a>
-          <a href="#" class="js-time" i18n:translate="">time</a>
-          <a href="#" class="js-elevation" i18n:translate="">elevation</a>
+        <div class="svg-cotent">
+          <svg width="800" height="180" viewBox="0 0 800 180"></svg>
         </div>
-        <div class="switcher js-switcher">
-          <a href="#" class="js-weekly" i18n:translate="">weekly</a>
-          <a href="#" class="js-monthly" i18n:translate="">monthly</a>
-        </div>
+        <ul class="workout-options filters js-filters">
+          <li><a href="#" class="js-distance is-active" i18n:translate="">distance</a></li>
+          <li><a href="#" class="js-time" i18n:translate="">time</a></li>
+          <li><a href="#" class="js-elevation" i18n:translate="">elevation</a></li>
+        </ul>
+
+        <ul class="workout-options switcher js-switcher">
+          <li><a href="#" class="js-weekly" i18n:translate="">weekly</a></li>
+          <li><a href="#" class="js-monthly is-active" i18n:translate="">monthly</a></li>
+        </ul>
       </div>
 
@@ -138,5 +142,4 @@
 
       </tal:r>
-
     </div>
 
@@ -156,7 +159,7 @@
 
      var year_chart = owjs.year_chart({
-         chart_selector: 'div.js-month-stats svg',
-         filters_selector: 'div.js-month-stats div.js-filters a',
-         switcher_selector: 'div.js-month-stats div.js-switcher a',
+         chart_selector: '.js-month-stats svg',
+         filters_selector: '.js-month-stats .js-filters a',
+         switcher_selector: '.js-month-stats .js-switcher a',
          urls: {"monthly": "${request.resource_url(context, 'monthly')}",
                 "weekly": "${request.resource_url(context, 'weekly')}"},
Index: ow/templates/signup.pt
===================================================================
--- ow/templates/signup.pt	(revision 5cf5787d1c21f5eedd38c23d588cc1906e4bef1d)
+++ ow/templates/signup.pt	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -12,5 +12,5 @@
       <!-- Login -->
 
-      <div class="signup-content">
+      <div class="login-content">
 
         <form method="post" name="signup" action="">
@@ -57,5 +57,5 @@
           </fieldset>
 
-          <input class="button" type="submit" name="submit" value="Sign up!">
+          <input class="button button-action" type="submit" name="submit" value="Sign up!">
 
         </form>
Index: ow/templates/workout.pt
===================================================================
--- ow/templates/workout.pt	(revision 5cf5787d1c21f5eedd38c23d588cc1906e4bef1d)
+++ ow/templates/workout.pt	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -26,4 +26,80 @@
   <metal:content metal:fill-slot="content">
 
+
+    <div class="workout-detail" id="workout">
+      <div class="workout-detail-resume">
+        <h3 tal:content="context.title"></h3>
+        <div id="" tal:content="context.notes"
+             tal:attributes="id 'workout-' + context.workout_id + '-notes'">
+        </div>
+        <ul class="workout-options">
+          <li>
+            <a href="" i18n:translate=""
+             tal:attributes="href request.resource_url(context, 'edit')">
+            edit workout
+            </a>
+          </li>
+          <li>
+            <a href="" i18n:translate=""
+             tal:attributes="href request.resource_url(context, 'update-from-file')">
+            update with tracking file
+            </a>
+          </li>
+          <li class="owo-del"><a href="" i18n:translate=""
+             tal:attributes="href request.resource_url(context, 'delete')">
+            delete
+            </a>
+          </li>
+        </ul>
+      </div>
+      <div class="workout-detail-info">
+        <ul id="" tal:attributes="id 'workout-' + context.workout_id + '-details'"
+            tal:define="hr context.hr; cad context.cad; atemp context.atemp; timezone context.owner.timezone">
+          <li class="important" tal:condition="context.distance">
+            <span><tal:t i18n:translate="">Distance</tal:t></span>
+            <tal:c tal:content="context.rounded_distance"></tal:c> km
+          </li>
+          <li class="important">
+            <span><tal:t i18n:translate="">Duration</tal:t></span>
+            <!--! use the properly formatted duration instead of the timedelta object -->
+            <tal:c tal:content="context._duration"></tal:c>
+          </li>
+          <li class="important">
+            <span><tal:t i18n:translate="">Start</tal:t></span>
+            <tal:c tal:content="context.start_in_timezone(timezone)"></tal:c>
+          </li>
+          <li tal:condition="context.speed">
+            <span><tal:t i18n:translate="">Speed</tal:t></span>
+            <span class="avg"><tal:t i18n:translate="">Avg.</tal:t>
+            <tal:c tal:content="round(context.speed['avg'], 1)"></tal:c>km/h</span>
+            <span class="max"><tal:t i18n:translate="">Max.</tal:t>
+            <tal:c tal:content="round(context.speed['max'], 1)"></tal:c>km/h</span>
+          </li>
+          <li tal:condition="hr">
+            <span><tal:t i18n:translate="">Heart Rate</tal:t></span>
+            <span class="avg"><tal:t i18n:translate="">Avg.</tal:t>
+            <tal:c tal:content="hr['avg']"></tal:c>bpm</span>
+            <span class="max"><tal:t i18n:translate="">Max.</tal:t>
+            <tal:c tal:content="hr['max']"></tal:c> bpm</span>
+          </li>
+          <li tal:condition="cad">
+            <span><tal:t i18n:translate="">Cadence</tal:t></span>
+            <span class="avg"><tal:t i18n:translate="">Avg.</tal:t>
+            <tal:c tal:content="cad['avg']"></tal:c></span>
+            <span class="max"><tal:t i18n:translate="">Max.</tal:t>
+            <tal:c tal:content="cad['max']"></tal:c></span>
+          </li>
+          <li tal:condition="atemp">
+            <span><tal:t i18n:translate="">Temperature</tal:t></span>
+            <span class="min"><tal:t i18n:translate="">Min.</tal:t>
+            <tal:c tal:content="atemp['min']"></tal:c>℃</span>
+            <span class="avg"><tal:t i18n:translate="">Avg.</tal:t>
+            <tal:c tal:content="atemp['avg']"></tal:c>℃</span>
+            <span class="max"><tal:t i18n:translate="">Max.</tal:t>
+            <tal:c tal:content="atemp['max']"></tal:c>℃</span>
+          </li>
+        </ul>
+      </div>
+    </div>
     <!--! Track map -->
     <div id="map" tal:condition="context.has_gpx"></div>
@@ -49,81 +125,4 @@
       </tal:r>
 
-    </div>
-
-    <div id="workout">
-      <h3 tal:content="context.title"></h3>
-      <h4>
-        <a href="" i18n:translate=""
-           tal:attributes="href request.resource_url(context, 'edit')">
-          (edit workout)
-        </a> |
-        <a href="" i18n:translate=""
-           tal:attributes="href request.resource_url(context, 'update-from-file')">
-          (update with tracking file)
-        </a> |
-        <a href="" i18n:translate=""
-           tal:attributes="href request.resource_url(context, 'delete')">
-          (delete)
-        </a>
-      </h4>
-
-      <ul id="" tal:attributes="id 'workout-' + context.workout_id + '-details'"
-          tal:define="hr context.hr; cad context.cad; atemp context.atemp; timezone context.owner.timezone">
-        <li>
-          <tal:t i18n:translate="">Start:</tal:t>
-          <tal:c tal:content="context.start_in_timezone(timezone)"></tal:c>
-        </li>
-        <li>
-          <tal:t i18n:translate="">End:</tal:t>
-          <tal:c tal:content="context.end_in_timezone(timezone)"></tal:c>
-        </li>
-        <li>
-          <tal:t i18n:translate="">Duration:</tal:t>
-          <!--! use the properly formatted duration instead of the timedelta object -->
-          <tal:c tal:content="context._duration"></tal:c>
-        </li>
-        <li tal:condition="context.distance">
-          <tal:t i18n:translate="">Distance:</tal:t>
-          <tal:c tal:content="context.rounded_distance"></tal:c> km
-        </li>
-        <li tal:condition="context.speed">
-          <tal:t i18n:translate="">Speed:</tal:t>
-          <tal:t i18n:translate="">Avg.</tal:t>
-          <tal:c tal:content="round(context.speed['avg'], 1)"></tal:c> km/h |
-          <tal:t i18n:translate="">Max.</tal:t>
-          <tal:c tal:content="round(context.speed['max'], 1)"></tal:c> km/h
-        </li>
-        <li tal:condition="hr">
-          <tal:t i18n:translate="">Heart Rate:</tal:t>
-          <tal:t i18n:translate="">Min.</tal:t>
-          <tal:c tal:content="hr['min']"></tal:c> bpm |
-          <tal:t i18n:translate="">Avg.</tal:t>
-          <tal:c tal:content="hr['avg']"></tal:c> bpm |
-          <tal:t i18n:translate="">Max.</tal:t>
-          <tal:c tal:content="hr['max']"></tal:c> bpm
-        </li>
-        <li tal:condition="cad">
-          <tal:t i18n:translate="">Cadence:</tal:t>
-          <tal:t i18n:translate="">Min.</tal:t>
-          <tal:c tal:content="cad['min']"></tal:c> |
-          <tal:t i18n:translate="">Avg.</tal:t>
-          <tal:c tal:content="cad['avg']"></tal:c> |
-          <tal:t i18n:translate="">Max.</tal:t>
-          <tal:c tal:content="cad['max']"></tal:c>
-        </li>
-        <li tal:condition="atemp">
-          <tal:t i18n:translate="">Temperature:</tal:t>
-          <tal:t i18n:translate="">Min.</tal:t>
-          <tal:c tal:content="atemp['min']"></tal:c> |
-          <tal:t i18n:translate="">Avg.</tal:t>
-          <tal:c tal:content="atemp['avg']"></tal:c> |
-          <tal:t i18n:translate="">Max.</tal:t>
-          <tal:c tal:content="atemp['max']"></tal:c>
-        </li>
-
-      </ul>
-      <div id="" tal:content="context.notes"
-           tal:attributes="id 'workout-' + context.workout_id + '-notes'">
-      </div>
     </div>
   </metal:content>
Index: ow/views/user.py
===================================================================
--- ow/views/user.py	(revision 5cf5787d1c21f5eedd38c23d588cc1906e4bef1d)
+++ ow/views/user.py	(revision 6993c72dd26b4d7afd587ce77eb4d08ed1347caf)
@@ -331,6 +331,5 @@
                 query={'year': str(week[0]),
                        'month': str(week[1]),
-                       'week': str(week[2])},
-                anchor='workouts')
+                       'week': str(week[2])})
         }
         json_stats.append(week_stats)
