.my-framework .button:before, .my-framework .button:after, .my-framework button:before, .my-framework button:after, .clearfix:before, .clearfix:after, p.description:before, p.description:after, .menu:before, .menu:after, .menu-list:before, .menu-list:after, .submenu:before, .submenu:after, .breadcrumb:before, .breadcrumb:after, .list:before, .list:after, .input-wrapper:before, .input-wrapper:after, .message:before, .message:after, .message-thin:before, .message-thin:after, .message-warning:before, .message-warning:after, .message-error:before, .message-error:after, .message-alert:before, .message-alert:after, .message-info:before, .message-info:after, .message-ok:before, .message-ok:after, .message-neutral:before, .message-neutral:after, .message-modal:before, .message-modal:after, .message-tooltip:before, .message-tooltip:after, .message-in-box:before, .message-in-box:after, .flyer:before, .flyer:after, .flyer > .content:before, .flyer > .content:after, .box > .content:before, .box > .content:after, .container:before, .container:after, table:before, table:after, .table:before, .table:after, .table .cols:before, .table .cols:after, .comment:before, .comment:after, .reveal:before, .reveal:after, .reveal aside:before, .reveal aside:after, .feedback:before, .feedback:after, .feedback-right:before, .feedback-right:after, .table.pricing .packages:before, .table.pricing .packages:after, .button-group:before, .button-group:after, .pagination:before, .pagination:after, aside.element:before, aside.element:after, .content > p:before, .content > p:after, .controls > .item:before, .controls > .item:after, .controls-horizontal > .item:before, .controls-horizontal > .item:after {
  content: " ";
  display: table;
}

.my-framework .button:after, .my-framework button:after, .clearfix:after, p.description:after, .menu:after, .menu-list:after, .submenu:after, .breadcrumb:after, .list:after, .input-wrapper:after, .message:after, .message-thin:after, .message-warning:after, .message-error:after, .message-alert:after, .message-info:after, .message-ok:after, .message-neutral:after, .message-modal:after, .message-tooltip:after, .message-in-box:after, .flyer:after, .flyer > .content:after, .box > .content:after, .container:after, table:after, .table:after, .table .cols:after, .comment:after, .reveal:after, .reveal aside:after, .feedback:after, .feedback-right:after, .table.pricing .packages:after, .button-group:after, .pagination:after, aside.element:after, .content > p:after, .controls > .item:after, .controls-horizontal > .item:after {
  clear: both;
}

.my-framework .button, .my-framework button, .clearfix, p.description, .menu, .menu-list, .submenu, .breadcrumb, .list, .input-wrapper, .message, .message-thin, .message-warning, .message-error, .message-alert, .message-info, .message-ok, .message-neutral, .message-modal, .message-tooltip, .message-in-box, .flyer, .flyer > .content, .box > .content, .container, table, .table, .table .cols, .comment, .reveal, .reveal aside, .feedback, .feedback-right, .table.pricing .packages, .button-group, .pagination, aside.element, .content > p, .controls > .item, .controls-horizontal > .item {
  *zoom: 1;
}

/* ==========================================================================
   html5 Boilerplate styles - h5bp.com (generated via initializr.com)
   ========================================================================== */
html,
button,
input,
select,
textarea {
  color: hsla(240, 8%, 39%, 1);
}

body {
  font-size: 1em;
  line-height: 1.4;
}

::-moz-selection {
  background: hsla(172, 72%, 43%, 1);
  color: hsla(0, 0%, 100%, 1);
  text-shadow: none;
  -moz-text-shadow: none;
  -webkit-text-shadow: none;
  -o-text-shadow: none;
}

::selection {
  background: hsla(172, 72%, 43%, 1);
  color: hsla(0, 0%, 100%, 1);
  text-shadow: none;
  -moz-text-shadow: none;
  -webkit-text-shadow: none;
  -o-text-shadow: none;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid hsla(0, 0%, 80%, 1);
  margin: 1em 0;
  padding: 0;
}

img {
  vertical-align: middle;
}

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

textarea {
  resize: vertical;
}

.chromeframe {
  margin: 0.2em 0;
  background: hsla(0, 0%, 80%, 1);
  color: hsla(0, 0%, 0%, 1);
  padding: 0.2em 0;
}

/* =========================================================================
   Framework Elements
   ========================================================================= */
/*
   =========================================================================
*/
/* Defaults */
* {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

body {
  font-family: "Nunito", sans-serif;
  font-size: 18px;
  line-height: 1.5;
  font-weight: 200;
  margin: 0;
  padding: 0;
  color: hsla(240, 8%, 39%, 1);
  background-color: hsla(0, 0%, 96%, 1);
  outline: none;
  -moz-outline: none;
  -webkit-outline: none;
}

h1, h2, h3, h4, h5, h6, strong {
  margin: 0;
}

strong {
  font-weight: 700;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Nunito", sans-serif;
  font-weight: 300;
}

h1 {
  font-size: 49.5px;
}

h2 {
  font-size: 44.35714px;
}

h3 {
  font-size: 39.21429px;
}

h4 {
  font-size: 34.07143px;
}

h5 {
  font-size: 28.92857px;
}

h6 {
  font-size: 23.78571px;
}

p {
  margin: 1em 0;
  position: relative;
  line-height: 1.75;
}
#myDocument p:first-child {
  margin-top: 0;
}
p:last-child {
  margin-bottom: 0;
}
p img {
  margin: 0.75em;
}
p img.right {
  margin: 0 0 0.75em 0.75em;
}
p img.left {
  margin: 0 0.75em 0.75em 0;
}
p .remark {
  position: relative;
  display: inline-block;
  left: -2em;
  margin: 0 1em 1em 1em;
  padding: 1em;
  width: auto;
  max-width: 320px;
  font-size: 125%;
  float: left;
  background-color: hsla(0, 0%, 100%, 1);
}
p .remark.right {
  float: right;
  left: auto;
  right: -2em;
}
p .remark .title {
  display: block;
  font-size: 125%;
  font-weight: 700;
  margin-bottom: 0.25em;
}
p .remark .details {
  display: block;
  margin: 0.5em 0 1em;
}
p .remark img {
  margin: 0;
}

span img {
  margin: 0.75em;
}
span img.right {
  margin: 0 0 0.75em 0.75em;
}
span img.left {
  margin: 0 0.75em 0.75em 0;
}

pre {
  margin: 0.5em 0;
  font-weight: 700;
  color: hsla(80, 76%, 53%, 1);
}

small {
  font-size: 85%;
}

dd {
  margin-left: 0;
}
dd + dt {
  margin-top: 1em;
}

dt {
  font-weight: 400;
}

code {
  color: hsla(215, 16%, 23%, 1);
  background-color: hsla(220, 33%, 98%, 1);
  border: 0.0833em solid hsla(220, 33%, 98%, 1);
  padding: 0.25em;
}

img, .img {
  width: auto;
  height: auto;
  max-width: 100%;
}
img.border, .img.border {
  border-color: hsla(0, 0%, 100%, 1);
}

a {
  color: hsla(172, 72%, 43%, 1);
  text-decoration: none;
  line-height: 1.5;
  outline: none;
  -moz-outline: none;
  -webkit-outline: none;
}
a.img {
  display: inline-block;
}
a.content {
  display: block;
  background-color: hsla(0, 0%, 100%, 1);
}
#myDocument a.content:hover, #myDocument a.content:active {
  color: hsla(240, 8%, 39%, 1);
}
#myDocument .invert a.content:hover, #myDocument .invert a.content:active {
  background-color: hsla(240, 8%, 39%, 1);
  color: hsla(0, 0%, 100%, 1) !important;
}
a:focus {
  outline: none;
  -moz-outline: none;
  -webkit-outline: none;
}

ol, ul {
  padding: 0;
}

audio, canvas, video {
  width: auto;
  max-width: 100%;
  height: auto;
}

.video-wrapper {
  position: relative;
}

canvas {
  width: auto;
}

svg, object, embed {
  width: auto;
  max-width: 100%;
  height: auto;
}

header {
  padding: 0 1em;
  line-height: 2;
}

footer {
  padding: 0.5em 1em;
  color: hsla(0, 0%, 100%, 0.5);
  background-color: hsla(215, 16%, 23%, 1);
}

/*
   =========================================================================
*/
/*
   =========================================================================
*/
/* Forms */
.my-framework form label {
  display: block;
  margin-top: 0.75em;
}
.my-framework form label.error {
  display: inline-block;
  margin-top: 0;
  color: hsla(351, 66%, 48%, 1);
}
.my-framework form label:first-child {
  margin-top: 0;
}
.my-framework form label + span {
  margin-left: 1em;
}
.my-framework form label + .username, .my-framework form label + .password, .my-framework form label + .email {
  margin-left: 0;
}
.my-framework form fieldset {
  margin-bottom: 1em;
}
.my-framework form fieldset:last-child {
  margin-bottom: 0;
}
.my-framework form.form-validate fieldset .wrapper {
  margin-bottom: 0.5em;
}
.my-framework form.form-validate fieldset .wrapper:last-child {
  margin-bottom: 0;
}
.my-framework form.form-validate fieldset .wrapper .checkbox {
  display: inline-block;
  margin-left: 0.5em;
}
.my-framework form.form-validate fieldset .wrapper label {
  display: inline-block;
}
.my-framework form.form-validate fieldset .wrapper label.error {
  min-height: inherit;
  min-width: inherit;
  padding: 0 0.5em 0 0;
  cursor: default;
  background-color: transparent;
}
.my-framework form input[type="text"], .my-framework form input[type="password"], .my-framework form .input.text, .my-framework form textarea, .my-framework form select {
  margin-right: 1em;
  outline: none;
  -moz-outline: none;
  -webkit-outline: none;
}
.my-framework form input[type="search"] input[type="search"].input, .my-framework form .input.search {
  padding-left: 3em;
  padding-right: 3em;
  margin-right: 0;
}
.my-framework form input[type="search"] input[type="search"].input + .close, .my-framework form .input.search + .close {
  margin-top: 0;
  margin-right: 0;
}
.my-framework form .input-wrapper input[type="text"], .my-framework form .input-wrapper input[type="password"], .my-framework form .input-wrapper .input.text {
  margin-right: 0;
}
.my-framework form .group {
  margin-bottom: 0.75em;
}
.my-framework form .group label {
  margin-top: 0;
}
.my-framework form .group:last-child {
  margin-bottom: 0;
}
.my-framework form a {
  margin-top: 1em;
}

/*
   =========================================================================
*/
/*
   =========================================================================
*/
/* ELEMENTS AND COMPONENTS */
/* Various Behavior */
* > span.title {
  float: left;
}
* > span.title + * {
  clear: none;
}

/* Lists and Menus */
.my-framework .list, .my-framework .list-enumerated {
  margin: 0;
}
.my-framework .list .item, .my-framework .list-enumerated .item {
  list-style-type: none;
}
.my-framework .list .item .link, .my-framework .list-enumerated .item .link {
  padding: 0.25em 0.5em;
  line-height: 1.5;
}
.my-framework .list.with-bullet .item, .my-framework .list-enumerated.with-bullet .item {
  list-style-type: circle;
  list-style-position: inside;
}
.menu .my-framework .list .item .link, .menu .my-framework .list-enumerated .item .link {
  padding: 0.25em 0.5em;
}
.my-framework .list.cols > .item, .my-framework .list-enumerated.cols > .item {
  float: left;
}
.my-framework .list.pagination .item, .my-framework .list-enumerated.pagination .item {
  list-style-type: none;
  float: left;
  display: block;
}
.my-framework .list.pagination .item .button, .my-framework .list-enumerated.pagination .item .button {
  border-left: none;
}
.my-framework .list.pagination .item .link, .my-framework .list-enumerated.pagination .item .link {
  padding: 0.25em 0.5em;
}
.my-framework .list.pagination .item.active .link, .my-framework .list.pagination .item.active .button, .my-framework .list-enumerated.pagination .item.active .link, .my-framework .list-enumerated.pagination .item.active .button {
  cursor: default;
  background-color: transparent;
  border: none;
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  -o-box-shadow: none;
  color: hsla(240, 8%, 39%, 1);
}
.my-framework .list.pagination .item.active .button, .my-framework .list-enumerated.pagination .item.active .button {
  padding: 0.5833em 1em;
}
.my-framework .list.pagination .item.disabled .button, .my-framework .list.pagination .item.disabled .button:hover, .my-framework .list.pagination .item.disabled .button:active, .my-framework .list-enumerated.pagination .item.disabled .button, .my-framework .list-enumerated.pagination .item.disabled .button:hover, .my-framework .list-enumerated.pagination .item.disabled .button:active {
  opacity: 0.75;
  -moz-opacity: 0.75;
  -webkit-opacity: 0.75;
  filter: alpha(opacity=75);
  -ms-filter: "alpha(opacity=75)";
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
  cursor: default;
  top: 0;
  margin-bottom: 0;
  border-bottom-width: 0.1666em;
  background-color: hsla(172, 72%, 43%, 1);
  color: hsla(0, 0%, 100%, 0.85);
}
.my-framework .list.pagination .item.disabled .link, .my-framework .list.pagination .item.disabled .link:hover, .my-framework .list.pagination .item.disabled .link:active, .my-framework .list-enumerated.pagination .item.disabled .link, .my-framework .list-enumerated.pagination .item.disabled .link:hover, .my-framework .list-enumerated.pagination .item.disabled .link:active {
  opacity: 0.75;
  -moz-opacity: 0.75;
  -webkit-opacity: 0.75;
  filter: alpha(opacity=75);
  -ms-filter: "alpha(opacity=75)";
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
  cursor: default;
}

.my-framework .list .submenu, .my-framework .menu .submenu, .my-framework .menu-list .submenu {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.my-framework .list .submenu.with-separator, .my-framework .menu .submenu.with-separator, .my-framework .menu-list .submenu.with-separator {
  padding: 0.5em 0;
  background-color: hsla(0, 0%, 100%, 1);
}
.my-framework .list .submenu.with-separator .separator, .my-framework .menu .submenu.with-separator .separator, .my-framework .menu-list .submenu.with-separator .separator {
  margin: 0.5em 0;
}
.my-framework .list .submenu .item, .my-framework .menu .submenu .item, .my-framework .menu-list .submenu .item {
  list-style-type: none;
}
.my-framework .menu.with-separator, .my-framework .menu-list.with-separator, .my-framework .submenu.with-separator {
  background-color: hsla(172, 72%, 43%, 1);
}
.my-framework ol.list .item, .my-framework ol.list.with-bullet .item {
  list-style-type: decimal;
}
.my-framework .list-enumerated .item, .my-framework .enumerated .item {
  display: inline;
  margin-right: 0.5em;
  margin-bottom: 0;
}
.my-framework .list-enumerated .item {
  display: inline-block;
  margin-bottom: 0.5em;
}
.my-framework .submenu {
  margin: 0;
  list-style-type: none;
  position: relative;
  z-index: 996;
}
.my-framework .submenu .item {
  float: none;
}

/* Horizontal Terms */
.my-framework .horizontal-terms dt {
  float: left;
  clear: both;
  min-width: 120px;
  width: 36.7%;
  margin-top: 1em;
}
.my-framework .horizontal-terms dd {
  float: left;
  margin-left: 3%;
  width: 60.3%;
  margin-top: 1em;
}
.my-framework .horizontal-terms dt:first-child {
  margin-top: 0;
}
.my-framework .horizontal-terms dt:first-child + dd {
  margin-top: 0;
}

/* Pagination */
.my-framework .pagination .item, .my-framework .pagination li {
  list-style-type: none;
  float: left;
  display: block;
}
.my-framework .pagination .item .button, .my-framework .pagination li .button {
  border-left: none;
}
.my-framework .pagination .item .link, .my-framework .pagination .item a, .my-framework .pagination .item span, .my-framework .pagination li .link, .my-framework .pagination li a, .my-framework .pagination li span {
  padding: 0.25em 0.5em;
}
.my-framework .pagination .item .button, .my-framework .pagination li .button {
  padding: 0.5em 1em;
}
.my-framework .pagination .item.active .link, .my-framework .pagination .item.active .button, .my-framework .pagination li.active .link, .my-framework .pagination li.active .button {
  cursor: default;
  background-color: transparent;
  border: none;
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  -o-box-shadow: none;
  color: hsla(240, 8%, 39%, 1);
}
.my-framework .pagination .item.active .button, .my-framework .pagination li.active .button {
  padding: 0.5833em 1em;
}
.my-framework .pagination .item.disabled .button, .my-framework .pagination .item.disabled .button:hover, .my-framework .pagination .item.disabled .button:active, .my-framework .pagination li.disabled .button, .my-framework .pagination li.disabled .button:hover, .my-framework .pagination li.disabled .button:active {
  opacity: 0.75;
  -moz-opacity: 0.75;
  -webkit-opacity: 0.75;
  filter: alpha(opacity=75);
  -ms-filter: "alpha(opacity=75)";
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
  cursor: default;
  top: 0;
  margin-bottom: 0;
  border-bottom-width: 0.1666em;
  background-color: hsla(172, 72%, 43%, 1);
  color: hsla(0, 0%, 100%, 0.85);
}
.my-framework .pagination .item.disabled .link, .my-framework .pagination .item.disabled .link:hover, .my-framework .pagination .item.disabled .link:active, .my-framework .pagination li.disabled .link, .my-framework .pagination li.disabled .link:hover, .my-framework .pagination li.disabled .link:active {
  opacity: 0.75;
  -moz-opacity: 0.75;
  -webkit-opacity: 0.75;
  filter: alpha(opacity=75);
  -ms-filter: "alpha(opacity=75)";
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
  cursor: default;
}

/* Horizontal Rules */
.my-framework .hr, .my-framework .hr-dotted, .my-framework .hr-dashed, .my-framework .hr-thick, .my-framework .hr-stripes {
  display: block;
  border-bottom: 0.0833em solid hsla(214, 20%, 93%, 1);
  margin: 0.5em 0;
}
.my-framework .hr-dotted {
  border-bottom-style: dotted;
}
.my-framework .hr-dashed {
  border-bottom-style: dashed;
}
.my-framework .hr-thick, .my-framework .thick {
  border-bottom-width: 0.25em;
}
.my-framework .hr-stripes {
  height: 10px;
  background: transparent url(../../component-manager/assets/img/base/stripes.png) repeat-x;
  border-bottom: none;
}

/* HELPERS */
/* Icons and Images */
#myDocument .my-framework .icon.with-background, #myDocument .my-framework .icon-default.with-background {
  display: inline-block;
  padding: 0.3333em;
  min-width: 1.5em;
  min-height: 1.5em;
  color: hsla(0, 0%, 100%, 1);
}
#myDocument .my-framework .icon.box-shadow, #myDocument .my-framework .icon-default.box-shadow {
  box-shadow: 0 0.0833em 0 hsla(0, 0%, 0%, 0.1);
  -moz-box-shadow: 0 0.0833em 0 hsla(0, 0%, 0%, 0.1);
  -webkit-box-shadow: 0 0.0833em 0 hsla(0, 0%, 0%, 0.1);
  -o-box-shadow: 0 0.0833em 0 hsla(0, 0%, 0%, 0.1);
}
#myDocument .my-framework img.icon {
  margin: 0;
  width: 128px;
  height: 128px;
}
#myDocument .my-framework img.icon.x-small {
  width: 64px;
  height: 64px;
}
#myDocument .my-framework img.icon.small {
  width: 96px;
  height: 96px;
}
#myDocument .my-framework img.icon.medium {
  width: 180px;
  height: 180px;
}
#myDocument .my-framework img.icon.x-medium {
  width: 240px;
  height: 240px;
}
#myDocument .my-framework img.icon.big {
  width: 320px;
  height: 320px;
}
#myDocument .my-framework img.icon.x-big {
  width: 480px;
  height: 480px;
}
#myDocument .my-framework img.map {
  min-height: inherit;
}
#myDocument .my-framework img.retina {
  height: 115px;
}
#myDocument .my-framework img.retina.x-small {
  height: 57px;
}
#myDocument .my-framework img.retina.small {
  height: 85px;
}
#myDocument .my-framework img.retina.medium {
  height: 160px;
}
#myDocument .my-framework img.retina.x-medium {
  height: 213px;
}
#myDocument .my-framework img.retina.big {
  height: 284px;
}
#myDocument .my-framework img.retina.x-big {
  height: 426px;
}

/* Various */
#myDocument .my-framework .left {
  float: left;
}
#myDocument .my-framework .right {
  float: right;
}
#myDocument .my-framework .spaced {
  margin: 1.5em 0;
}
#myDocument .my-framework .spaced .item {
  margin: 1.5em 0;
}
#myDocument .my-framework .no-margin {
  margin: 0;
}
#myDocument .my-framework .no-padding {
  padding: 0;
}
#myDocument .my-framework .full-width {
  width: 100%;
}
#myDocument .my-framework .third-width {
  width: 75%;
}
#myDocument .my-framework .half-width {
  width: 50%;
}
#myDocument .my-framework .quarter-width {
  width: 25%;
}
#myDocument .my-framework .small-width {
  width: 15%;
}
#myDocument .my-framework .x-small {
  font-size: 50%;
}
#myDocument .my-framework .small {
  font-size: 75%;
}
#myDocument .my-framework .medium {
  font-size: 150%;
}
#myDocument .my-framework .x-medium {
  font-size: 200%;
}
#myDocument .my-framework .big {
  font-size: 300%;
}
#myDocument .my-framework .x-big {
  font-size: 400%;
}
#myDocument .my-framework .description {
  display: block;
  font-size: 85%;
}
#myDocument .my-framework .close {
  color: hsla(0, 0%, 100%, 1) !important;
  float: right;
  display: inline-block;
  margin: 0.1666em -0.25em 0 0;
  padding: 0.3333em 0.5em;
  background: hsla(0, 0%, 100%, 0.1);
}
#myDocument .my-framework .close:hover, #myDocument .my-framework .close:active {
  color: hsla(0, 0%, 100%, 1);
  background: hsla(351, 66%, 48%, 1);
}
#myDocument .my-framework .closed {
  display: none !important;
}
#myDocument .my-framework .message .close {
  color: hsla(0, 0%, 0%, 0.25);
  background-color: hsla(0, 0%, 0%, 0.05);
}
#myDocument .my-framework .message .close:hover, #myDocument .my-framework .message .close:active {
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(0, 0%, 0%, 0.15);
}
#myDocument .my-framework .collapse {
  color: hsla(0, 0%, 100%, 1) !important;
  float: right;
  display: inline-block;
  margin: 0.1666em -0.25em 0 0;
  padding: 0.3333em 0.5em;
}
#myDocument .my-framework .rounded {
  border-radius: 0.25em;
  -moz-border-radius: 0.25em;
  -webkit-border-radius: 0.25em;
}
#myDocument .my-framework .round {
  border-radius: 5em;
  -moz-border-radius: 5em;
  -webkit-border-radius: 5em;
}
#myDocument .my-framework .indented {
  text-indent: 1em;
}
#myDocument .my-framework .overflowed {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#myDocument .my-framework .more-content {
  display: block;
  text-align: center;
  font-size: 200%;
  margin: 0;
}
#myDocument .my-framework .with-tag {
  position: relative;
}
#myDocument .my-framework .with-tag .tag {
  display: block;
  position: absolute;
  background-color: hsla(351, 66%, 48%, 1) !important;
  color: hsla(0, 0%, 100%, 1);
  right: -0.75em;
  top: -0.75em;
  padding: 0.3333em 0.25em 0.25em;
  font-size: 75%;
  text-align: center;
  min-width: 1.25em;
  line-height: 1;
  z-index: 998;
  border-radius: 1em;
  -moz-border-radius: 1em;
  -webkit-border-radius: 1em;
}
#myDocument .my-framework .with-tag .tag.bottom {
  top: auto;
  bottom: -0.75em;
}
#myDocument .my-framework .with-tag .tag.left {
  right: inherit;
  left: -0.75em;
}
#myDocument .my-framework .with-tag .tag.left-bottom {
  top: auto;
  bottom: -0.75em;
  right: auto;
  left: -0.75em;
}
#myDocument .my-framework .with-background {
  background-color: hsla(172, 72%, 43%, 1);
  color: hsla(0, 0%, 100%, 1);
  padding: 0 0.5em;
}
#myDocument .my-framework .label {
  display: inline-block;
  padding: 0.25em 0.5em;
  margin: 0.5em;
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(172, 72%, 43%, 1);
}
#myDocument .my-framework .with-label {
  display: inline-block;
  margin: 0 1.5em;
}
#myDocument .my-framework .with-label.left {
  margin-left: 0;
}
#myDocument .my-framework .with-label.right {
  margin-right: 0;
}
#myDocument .my-framework .with-label img {
  margin: 0;
  padding: 0;
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  -o-box-shadow: none;
}
#myDocument .my-framework .with-label .label {
  display: block;
  margin: 0;
  width: 100%;
  font-style: italic;
  text-align: right;
  font-size: 85%;
}
#myDocument .my-framework .drop-caps {
  min-height: 4.75em;
}
#myDocument .my-framework .drop-caps:first-letter, #myDocument .my-framework .drop-caps::first-letter {
  float: left;
  font-size: 500%;
  line-height: 2;
  padding-top: 0.125em;
  padding-right: 0.125em;
  color: hsla(172, 72%, 43%, 1);
}
#myDocument .my-framework.chrome .drop-caps:first-letter, #myDocument .my-framework.chrome .drop-caps::first-letter, #myDocument .my-framework.webkit .drop-caps:first-letter, #myDocument .my-framework.webkit .drop-caps::first-letter {
  line-height: 0.75;
}
#myDocument .my-framework .highlighted {
  background-color: hsla(172, 72%, 43%, 1);
  color: hsla(0, 0%, 100%, 1);
}
#myDocument .my-framework .underlined {
  border-bottom: 0.1666em solid hsla(172, 72%, 43%, 1);
}
#myDocument .my-framework .stroked {
  text-decoration: line-through;
}
#myDocument .my-framework .colored {
  color: hsla(172, 72%, 43%, 1);
}
#myDocument .my-framework .quote, #myDocument .my-framework blockquote {
  display: block;
  background-color: hsla(0, 0%, 100%, 1);
  border-left: 0.4166em solid transparent;
  padding: 1em;
  font-style: italic;
}
#myDocument .my-framework .quote .icon, #myDocument .my-framework blockquote .icon {
  margin-top: 0.25em;
}
#myDocument .my-framework .eye-popping {
  font-size: 150%;
  font-family: "Nunito", sans-serif;
  font-style: italic;
  margin-top: 0.75em;
}
#myDocument .my-framework .tag {
  padding: 0.25em 0.75em;
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(172, 72%, 43%, 1);
}
#myDocument .my-framework .ribbon, #myDocument .my-framework .ribbon-left, #myDocument .my-framework .ribbon-right {
  color: hsla(0, 0%, 100%, 0.85);
  position: absolute;
  background-color: hsla(351, 66%, 48%, 1);
  padding: 0.5em 0.75em;
  clear: both;
  z-index: 990;
  font-weight: 700;
  transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
}
#myDocument .my-framework .ribbon:hover, #myDocument .my-framework .ribbon-left:hover, #myDocument .my-framework .ribbon-right:hover {
  opacity: 0.15;
  -moz-opacity: 0.15;
  -webkit-opacity: 0.15;
  filter: alpha(opacity=15);
  -ms-filter: "alpha(opacity=15)";
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=15)";
  cursor: default;
}
#myDocument .my-framework *:hover > .ribbon, #myDocument .my-framework *:hover > .ribbon-left, #myDocument .my-framework *:hover > .ribbon-right {
  opacity: 0.15;
  -moz-opacity: 0.15;
  -webkit-opacity: 0.15;
  filter: alpha(opacity=15);
  -ms-filter: "alpha(opacity=15)";
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=15)";
  cursor: default;
}
#myDocument .my-framework .ribbon {
  width: 100%;
  text-align: center;
  margin-left: -0.75em;
  box-sizing: content-box;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
}
#myDocument .my-framework .ribbon::before {
  display: block;
  width: 1em;
  height: 0;
  position: absolute;
  bottom: -0.75em;
  left: -1%;
  content: "";
  border-bottom: 0.75em solid transparent;
  border-right: 0.75em solid hsla(0, 0%, 0%, 0.2);
}
#myDocument .my-framework .ribbon::after {
  display: block;
  width: 1em;
  height: 0;
  position: absolute;
  bottom: -1.25em;
  right: -0.5em;
  content: "";
  transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -webkit-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  border-bottom: 0.75em solid transparent;
  border-right: 0.75em solid hsla(0, 0%, 0%, 0.2);
}
#myDocument .my-framework .ribbon-left {
  margin-left: -0.75em;
  float: left;
}
#myDocument .my-framework .ribbon-left::before {
  display: block;
  width: 1em;
  height: 0;
  position: absolute;
  bottom: -0.75em;
  left: -1em;
  content: "";
  border-bottom: 0.75em solid transparent;
  border-right: 0.75em solid hsla(0, 0%, 0%, 0.2);
}
#myDocument .my-framework .ribbon-right {
  margin-right: -0.75em;
  float: right;
  right: 0;
}
#myDocument .my-framework .ribbon-right::after {
  display: block;
  width: 1em;
  height: 0;
  position: absolute;
  bottom: -1.25em;
  right: -0.5em;
  content: "";
  transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -webkit-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  border-bottom: 0.75em solid transparent;
  border-right: 0.75em solid hsla(0, 0%, 0%, 0.2);
}
#myDocument .my-framework .hidden-text {
  text-indent: -999em;
}
#myDocument .my-framework .transparency {
  opacity: 0.5;
  -moz-opacity: 0.5;
  -webkit-opacity: 0.5;
  filter: alpha(opacity=50);
  -ms-filter: "alpha(opacity=50)";
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
}
#myDocument .my-framework .border {
  border: 0.0833em solid hsla(214, 20%, 93%, 1);
}
#myDocument .my-framework .disabled {
  opacity: 0.5;
  -moz-opacity: 0.5;
  -webkit-opacity: 0.5;
  filter: alpha(opacity=50);
  -ms-filter: "alpha(opacity=50)";
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  cursor: default;
}
#myDocument .my-framework .moving-right, #myDocument .my-framework .moving-left {
  /* Since we mostly all are LTR readers */
  position: relative;
  float: none;
  cursor: default;
}
#myDocument .my-framework .moving-right:hover {
  margin-left: 1.5em;
}
#myDocument .my-framework .moving-left:hover {
  margin-left: -1.5em;
}
#myDocument .my-framework .scrollable {
  max-height: 200px;
  overflow: auto;
}
#myDocument .my-framework .rotate {
  transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
}
#myDocument .my-framework .rotate-45 {
  transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
}
#myDocument .my-framework .rotate-90 {
  transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
}
#myDocument .my-framework .rotate-135 {
  transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
}
#myDocument .my-framework .rotate-180 {
  transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
}
#myDocument .my-framework .rotate-270 {
  transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -webkit-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
}
#myDocument .my-framework .scale-full {
  transform: scale(1);
  -moz-transform: scale(1);
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
}
#myDocument .my-framework .scale-third {
  transform: scale(0.75);
  -moz-transform: scale(0.75);
  -webkit-transform: scale(0.75);
  -ms-transform: scale(0.75);
}
#myDocument .my-framework .scale-half {
  transform: scale(0.5);
  -moz-transform: scale(0.5);
  -webkit-transform: scale(0.5);
  -ms-transform: scale(0.5);
}
#myDocument .my-framework .scale-quarter {
  transform: scale(0.25);
  -moz-transform: scale(0.25);
  -webkit-transform: scale(0.25);
  -ms-transform: scale(0.25);
}
#myDocument .my-framework .scale-double {
  transform: scale(2);
  -moz-transform: scale(2);
  -webkit-transform: scale(2);
  -ms-transform: scale(2);
}
#myDocument .my-framework .rotate-horizontal {
  transform: scaleX(-1);
  -moz-transform: scaleX(-1);
  -webkit-transform: scaleX(-1);
  -ms-transform: scaleX(-1);
}
#myDocument .my-framework .translate-XY {
  transform: translate(50%, 50%);
  -moz-transform: translate(50%, 50%);
  -webkit-transform: translate(50%, 50%);
  -ms-transform: translate(50%, 50%);
}
#myDocument .my-framework .translate-right {
  transform: translateX(50%);
  -moz-transform: translateX(50%);
  -webkit-transform: translateX(50%);
  -ms-transform: translateX(50%);
}
#myDocument .my-framework .translate-left {
  transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}
#myDocument .my-framework .translate-top {
  transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
#myDocument .my-framework .translate-bottom {
  transform: translateY(50%);
  -moz-transform: translateY(50%);
  -webkit-transform: translateY(50%);
  -ms-transform: translateY(50%);
}
#myDocument .my-framework .position-top, #myDocument .my-framework .position-bottom, #myDocument .my-framework .position-left, #myDocument .my-framework .position-right {
  position: absolute;
}
#myDocument .my-framework .position-top {
  top: 0;
}
#myDocument .my-framework .position-bottom {
  bottom: 0;
}
#myDocument .my-framework .position-left {
  left: 0;
}
#myDocument .my-framework .position-right {
  right: 0;
}
#myDocument .my-framework .red, #myDocument .my-framework .red-color, #myDocument .my-framework .icon.error {
  color: hsla(351, 66%, 48%, 1);
}
#myDocument .my-framework .green, #myDocument .my-framework .green-color, #myDocument .my-framework .icon.ok {
  color: hsla(172, 72%, 43%, 1);
}
#myDocument .my-framework .blue, #myDocument .my-framework .blue-color {
  color: hsla(189, 83%, 45%, 1);
}
#myDocument .my-framework .yellow, #myDocument .my-framework .yellow-color {
  color: hsla(41, 96%, 57%, 1);
}
#myDocument .my-framework .orange, #myDocument .my-framework .orange-color {
  color: hsla(22, 85%, 57%, 1);
}
#myDocument .my-framework .pink, #myDocument .my-framework .pink-color {
  color: hsla(329, 73%, 49%, 1);
}
#myDocument .my-framework .purple, #myDocument .my-framework .purple-color {
  color: hsla(268, 16%, 36%, 1);
}
#myDocument .my-framework .brown, #myDocument .my-framework .brown-color {
  color: hsla(12, 49%, 35%, 1);
}
#myDocument .my-framework .background {
  background-color: hsla(172, 72%, 43%, 1);
  color: hsla(0, 0%, 100%, 1);
}
#myDocument .my-framework .background-neutral, #myDocument .my-framework .background-neutral > .content {
  background-color: hsla(0, 0%, 98%, 1);
  color: hsla(240, 8%, 39%, 1);
}
#myDocument .my-framework .background-grey, #myDocument .my-framework .background-grey > .content {
  background-color: hsla(240, 8%, 39%, 1);
  color: hsla(0, 0%, 100%, 1);
}
#myDocument .my-framework .background-grey img, #myDocument .my-framework .background-grey > .content img {
  border: 0.3333em solid hsla(0, 0%, 0%, 0.15);
}
#myDocument .my-framework .background-red, #myDocument .my-framework .background-red > .content {
  background-color: hsla(351, 66%, 48%, 1) !important;
  color: hsla(0, 0%, 100%, 1) !important;
}
#myDocument .my-framework .background-red img, #myDocument .my-framework .background-red > .content img {
  border: 0.3333em solid hsla(0, 0%, 0%, 0.15);
}
#myDocument .my-framework .background-green, #myDocument .my-framework .background-green > .content {
  background-color: hsla(170, 100%, 40%, 1) !important;
  color: hsla(0, 0%, 100%, 1) !important;
}
#myDocument .my-framework .background-green img, #myDocument .my-framework .background-green > .content img {
  border: 0.3333em solid hsla(0, 0%, 0%, 0.15);
}
#myDocument .my-framework .background-blue, #myDocument .my-framework .background-blue > .content {
  background-color: hsla(199, 64%, 45%, 1) !important;
  color: hsla(0, 0%, 100%, 1) !important;
}
#myDocument .my-framework .background-blue img, #myDocument .my-framework .background-blue > .content img {
  border: 0.3333em solid hsla(0, 0%, 0%, 0.15);
}
#myDocument .my-framework .background-yellow, #myDocument .my-framework .background-yellow > .content {
  background-color: hsla(41, 96%, 57%, 1) !important;
  color: hsla(0, 0%, 100%, 1) !important;
}
#myDocument .my-framework .background-yellow img, #myDocument .my-framework .background-yellow > .content img {
  border: 0.3333em solid hsla(0, 0%, 0%, 0.15);
}
#myDocument .my-framework .background-orange, #myDocument .my-framework .background-orange > .content {
  background-color: hsla(359, 100%, 65%, 1) !important;
  color: hsla(0, 0%, 100%, 1) !important;
}
#myDocument .my-framework .background-orange img, #myDocument .my-framework .background-orange > .content img {
  border: 0.3333em solid hsla(0, 0%, 0%, 0.15);
}
#myDocument .my-framework .background-pink, #myDocument .my-framework .background-pink > .content {
  background-color: hsla(329, 73%, 49%, 1) !important;
  color: hsla(0, 0%, 100%, 1) !important;
}
#myDocument .my-framework .background-pink img, #myDocument .my-framework .background-pink > .content img {
  border: 0.3333em solid hsla(0, 0%, 0%, 0.15);
}
#myDocument .my-framework .background-purple, #myDocument .my-framework .background-purple > .content {
  background-color: hsla(268, 16%, 36%, 1) !important;
  color: hsla(0, 0%, 100%, 1) !important;
}
#myDocument .my-framework .background-purple img, #myDocument .my-framework .background-purple > .content img {
  border: 0.3333em solid hsla(0, 0%, 0%, 0.15);
}
#myDocument .my-framework .background-brown, #myDocument .my-framework .background-brown > .content {
  background-color: hsla(12, 49%, 35%, 1) !important;
  color: hsla(0, 0%, 100%, 1) !important;
}
#myDocument .my-framework .background-brown img, #myDocument .my-framework .background-brown > .content img {
  border: 0.3333em solid hsla(0, 0%, 0%, 0.15);
}
#myDocument .my-framework .hr-neutral, #myDocument .my-framework .border-neutral {
  border-color: hsla(0, 0%, 98%, 1);
}
#myDocument .my-framework .hr-grey, #myDocument .my-framework .border-grey {
  border-color: hsla(240, 8%, 39%, 1);
}
#myDocument .my-framework .hr-red, #myDocument .my-framework .border-red {
  border-color: hsla(351, 66%, 48%, 1);
}
#myDocument .my-framework .hr-green, #myDocument .my-framework .border-green {
  border-color: hsla(172, 72%, 43%, 1);
}
#myDocument .my-framework .hr-blue, #myDocument .my-framework .border-blue {
  border-color: hsla(189, 83%, 45%, 1);
}
#myDocument .my-framework .hr-yellow, #myDocument .my-framework .border-yellow {
  border-color: hsla(41, 96%, 57%, 1);
}
#myDocument .my-framework .hr-orange, #myDocument .my-framework .border-orange {
  border-color: hsla(22, 85%, 57%, 1);
}
#myDocument .my-framework .hr-pink, #myDocument .my-framework .border-pink {
  border-color: hsla(329, 73%, 49%, 1);
}
#myDocument .my-framework .hr-purple, #myDocument .my-framework .border-purple {
  border-color: hsla(268, 16%, 36%, 1);
}
#myDocument .my-framework .hr-brown, #myDocument .my-framework .border-brown {
  border-color: hsla(12, 49%, 35%, 1);
}
#myDocument .my-framework .loading {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: hsla(0, 0%, 0%, 0.75);
  z-index: 999;
  text-align: center;
}
#myDocument .my-framework .loading .icon {
  position: absolute;
  top: 50%;
  font-size: 500%;
  color: hsla(0, 0%, 100%, 1);
  animation: rotate 0.75s infinite linear;
  -moz-animation: rotate 0.75s infinite linear;
  -webkit-animation: rotate 0.75s infinite linear;
}
#myDocument .my-framework .loading-icon {
  animation: rotate 0.75s infinite linear;
  -moz-animation: rotate 0.75s infinite linear;
  -webkit-animation: rotate 0.75s infinite linear;
}

.my-framework .fixed, .my-framework .fixed-bottom {
  display: block;
  width: 100%;
  z-index: 998;
  position: fixed;
  top: 0;
  opacity: 0.95;
  -moz-opacity: 0.95;
  -webkit-opacity: 0.95;
  filter: alpha(opacity=95);
  -ms-filter: "alpha(opacity=95)";
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=95)";
}
.my-framework .fixed:hover, .my-framework .fixed-bottom:hover {
  opacity: 1;
  -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "alpha(opacity=100)";
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.my-framework .fixed-bottom {
  top: auto;
  bottom: 0;
}

/* Buttons and Controls */
.my-framework .button, .my-framework button {
  display: inline-block;
  text-decoration: none;
  padding: 0.5em 1em;
  color: hsla(0, 0%, 100%, 0.75);
  background-color: hsla(172, 72%, 43%, 0.85);
  text-align: center;
  border: none;
  position: relative;
  transition: none;
  -moz-transition: none;
  -webkit-transition: none;
}
.my-framework .button.small, .my-framework button.small {
  font-size: 78.6%;
  text-shadow: none;
  -moz-text-shadow: none;
  -webkit-text-shadow: none;
  -o-text-shadow: none;
}
#myDocument .my-framework .button.big, #myDocument .my-framework button.big {
  font-size: 150%;
}
#myDocument .my-framework .button.thin, #myDocument .my-framework button.thin {
  padding-top: 0.25em;
  padding-bottom: 0.25em;
}
.my-framework .button:hover, .my-framework button:hover {
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(172, 72%, 43%, 1);
}
#myDocument .my-framework .button:active, #myDocument .my-framework .button.uk-active, #myDocument .my-framework button:active, #myDocument .my-framework button.uk-active {
  color: hsla(0, 0%, 100%, 0.5);
  background-color: hsla(172, 72%, 43%, 1);
  transition: none;
  -moz-transition: none;
  -webkit-transition: none;
}
.my-framework .button.only-icon .icon, .my-framework button.only-icon .icon {
  margin: 0;
}
.my-framework .button.processing:active, .my-framework .button.processing.active, .my-framework button.processing:active, .my-framework button.processing.active {
  opacity: 0.75;
  -moz-opacity: 0.75;
  -webkit-opacity: 0.75;
  filter: alpha(opacity=75);
  -ms-filter: "alpha(opacity=75)";
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
}
.my-framework .button.processing:active .icon, .my-framework .button.processing.active .icon, .my-framework button.processing:active .icon, .my-framework button.processing.active .icon {
  display: inline-block;
  animation: rotate 0.75s infinite linear;
  -moz-animation: rotate 0.75s infinite linear;
  -webkit-animation: rotate 0.75s infinite linear;
}
.my-framework .button.processing .icon, .my-framework button.processing .icon {
  display: none;
  font-size: 150%;
  margin-top: 2px;
}
#myDocument .my-framework .button.disabled, #myDocument .my-framework .button.disabled:hover, #myDocument .my-framework .button.disabled:active, #myDocument .my-framework .button.processing:active, #myDocument .my-framework .button.processing.active, #myDocument .my-framework button.disabled, #myDocument .my-framework button.disabled:hover, #myDocument .my-framework button.disabled:active, #myDocument .my-framework button.processing:active, #myDocument .my-framework button.processing.active {
  opacity: 0.5;
  -moz-opacity: 0.5;
  -webkit-opacity: 0.5;
  filter: alpha(opacity=50);
  -ms-filter: "alpha(opacity=50)";
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  cursor: default;
  top: 0;
  margin-bottom: 0;
  border-bottom-width: 0.25em;
  background-color: hsla(172, 72%, 43%, 1);
  color: hsla(0, 0%, 100%, 0.85);
}
.my-framework .button .icon, .my-framework button .icon {
  margin-top: 0.25em;
  margin-left: 0.25em;
  margin-right: 0.25em;
}
.my-framework .button-group .item {
  float: left;
}

.show-all {
  position: relative;
  overflow: hidden;
}
.show-all > .trigger {
  position: absolute;
  bottom: 0;
}
.my-framework .show-all > .trigger:active {
  top: inherit;
}
.show-all.active > .trigger {
  position: relative;
  margin-top: 1em;
}

.show-more > .trigger {
  margin-top: 1em;
}

.tabs {
  list-style-type: none;
}
.tabs .item {
  display: inline-block;
}

.my-framework .trigger {
  top: auto;
  margin-bottom: 0;
}
.my-framework .trigger:active {
  border: none;
}

/* Menus */
.menu-plain {
  min-height: 240px;
  max-height: 100%;
  height: auto;
}

.my-framework .menu, .my-framework .menu-list {
  z-index: 998;
  margin: 0;
}
.my-framework .menu.breadcrumb .item .link, .my-framework .menu-list.breadcrumb .item .link {
  display: inline;
  padding: 0;
  line-height: 1.5;
}
.my-framework .menu.breadcrumb .item .link, .my-framework .menu.breadcrumb .item .link:hover, .my-framework .menu.breadcrumb .item .link:active, .my-framework .menu-list.breadcrumb .item .link, .my-framework .menu-list.breadcrumb .item .link:hover, .my-framework .menu-list.breadcrumb .item .link:active {
  background: transparent;
}
.my-framework .menu.breadcrumb .item .link:hover, .my-framework .menu.breadcrumb .item .link:active, .my-framework .menu-list.breadcrumb .item .link:hover, .my-framework .menu-list.breadcrumb .item .link:active {
  color: hsla(351, 66%, 48%, 1);
}
.my-framework .menu.breadcrumb .item .icon, .my-framework .menu-list.breadcrumb .item .icon {
  font-size: 65%;
  margin-left: 1em;
}
.my-framework .menu.breadcrumb .item.active .link, .my-framework .menu.breadcrumb .item.active span, .my-framework .menu-list.breadcrumb .item.active .link, .my-framework .menu-list.breadcrumb .item.active span {
  color: hsla(351, 66%, 48%, 1);
}
.my-framework .menu.breadcrumb .item.active span, .my-framework .menu-list.breadcrumb .item.active span {
  cursor: default;
}
.my-framework .menu.breadcrumb > .item, .my-framework .menu-list.breadcrumb > .item {
  margin: 0 1em 0 0;
}
.my-framework .menu > .item, .my-framework .menu-list > .item {
  float: left;
}
.my-framework .menu.vertical > .item, .my-framework .menu-list.vertical > .item {
  float: none;
}
.my-framework .menu .item .link, .my-framework .menu-list .item .link {
  display: block;
  padding: 0.75em 1em;
  color: hsla(240, 8%, 39%, 1);
}
.my-framework .menu .item .link:hover, .my-framework .menu .item .link:active, .my-framework .menu-list .item .link:hover, .my-framework .menu-list .item .link:active {
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(172, 72%, 43%, 0.9);
}
.my-framework .menu .separator .hr, .my-framework .menu-list .separator .hr {
  margin: 0;
  border: none;
  padding: 0.1666em 0 0;
  background-color: hsla(0, 0%, 100%, 0.1);
}
.my-framework .menu.list .item .link, .my-framework .menu-list.list .item .link {
  background-color: transparent;
}
.my-framework .menu.list .item .link:hover, .my-framework .menu.list .item .link:active, .my-framework .menu-list.list .item .link:hover, .my-framework .menu-list.list .item .link:active {
  color: hsla(172, 72%, 43%, 1);
}
.my-framework .menu.list .item.active .link, .my-framework .menu.list .item.active .link:hover, .my-framework .menu.list .item.active .link:active, .my-framework .menu-list.list .item.active .link, .my-framework .menu-list.list .item.active .link:hover, .my-framework .menu-list.list .item.active .link:active {
  color: hsla(172, 72%, 43%, 1);
}
.my-framework .menu.plain .item .link, .my-framework .menu-list.plain .item .link {
  padding: 0.25em 1em;
  background-color: transparent;
}
.my-framework .menu.plain .item .link:hover, .my-framework .menu.plain .item .link:active, .my-framework .menu-list.plain .item .link:hover, .my-framework .menu-list.plain .item .link:active {
  background-color: transparent;
}
.my-framework .menu.vertical > .item, .my-framework .menu-list.vertical > .item {
  float: none;
  max-width: 100%;
}
.my-framework .menu.vertical > .item > .link, .my-framework .menu-list.vertical > .item > .link {
  max-width: 100%;
}
.my-framework .menu.vertical.docked > .item, .my-framework .menu-list.vertical.docked > .item {
  width: 48px;
}
.my-framework .menu.vertical.docked > .item > .link, .my-framework .menu-list.vertical.docked > .item > .link {
  text-indent: -999em;
  text-transform: uppercase;
}
.my-framework .menu.vertical.docked > .item > .link .icon, .my-framework .menu-list.vertical.docked > .item > .link .icon {
  text-indent: 0;
  display: none;
}
.my-framework .menu.vertical.docked > .item > .link .icon.main, .my-framework .menu-list.vertical.docked > .item > .link .icon.main {
  font-size: 150%;
  display: inline-block;
  margin-top: 0;
}
.my-framework .menu.vertical.docked > .item > .link .icon-default, .my-framework .menu-list.vertical.docked > .item > .link .icon-default {
  text-indent: 0;
  font-size: 150%;
  margin-top: 1px;
  margin-right: 0.5em;
}
.my-framework .menu.vertical.docked > .item > .link .title, .my-framework .menu-list.vertical.docked > .item > .link .title {
  display: inline-block;
  text-indent: -999em;
  float: none;
}
.my-framework .menu.vertical.docked > .item.active, .my-framework .menu-list.vertical.docked > .item.active {
  width: 100%;
}
.my-framework .menu.vertical.docked > .item.active > .link, .my-framework .menu-list.vertical.docked > .item.active > .link {
  width: 100%;
  text-indent: 0;
}
.my-framework .menu.vertical.docked > .item.active > .link .title, .my-framework .menu.vertical.docked > .item.active > .link .icon, .my-framework .menu-list.vertical.docked > .item.active > .link .title, .my-framework .menu-list.vertical.docked > .item.active > .link .icon {
  display: inline-block;
  text-indent: 0;
}
.my-framework .menu.vertical.docked > .item:hover, .my-framework .menu-list.vertical.docked > .item:hover {
  width: 100%;
}
.my-framework .menu.vertical.docked > .item:hover > .link, .my-framework .menu-list.vertical.docked > .item:hover > .link {
  text-indent: 0;
  width: 100%;
}
.my-framework .menu.vertical.docked > .item:hover > .link .icon, .my-framework .menu.vertical.docked > .item:hover > .link .title, .my-framework .menu-list.vertical.docked > .item:hover > .link .icon, .my-framework .menu-list.vertical.docked > .item:hover > .link .title {
  display: inline-block;
}
.my-framework .menu.vertical.docked > .item:hover > .link .title, .my-framework .menu-list.vertical.docked > .item:hover > .link .title {
  display: inline-block;
  text-indent: 0;
}
.my-framework .menu.vertical.plain, .my-framework .menu-list.vertical.plain {
  position: relative;
}
.my-framework .menu.vertical.plain > .item, .my-framework .menu-list.vertical.plain > .item {
  max-width: 100%;
}
.my-framework .menu.vertical.plain > .item > .link, .my-framework .menu-list.vertical.plain > .item > .link {
  max-width: 100%;
}
.my-framework .menu.list.vertical > .item, .my-framework .menu-list.list.vertical > .item {
  max-width: 100%;
}
.my-framework .menu.list.vertical > .item > .link, .my-framework .menu-list.list.vertical > .item > .link {
  max-width: 100%;
  text-transform: uppercase;
}
.my-framework .menu.list.vertical > .item > .link .icon.main, .my-framework .menu-list.list.vertical > .item > .link .icon.main {
  display: none;
}
.my-framework .menu.horizontal .submenu .link, .my-framework .menu-list.horizontal .submenu .link {
  max-width: 100% !important;
}

.my-framework .menu-list .item .link {
  background-color: transparent;
}
.my-framework .menu-list .item .link:hover, .my-framework .menu-list .item .link:active {
  color: hsla(172, 72%, 43%, 1);
  background-color: transparent;
}
.my-framework .menu-list .item.active .link, .my-framework .menu-list .item.active .link:hover, .my-framework .menu-list .item.active .link:active {
  color: hsla(172, 72%, 43%, 1);
}
.my-framework .menu-list .item > .link {
  text-transform: uppercase;
}
.my-framework .menu-list.vertical > .item {
  max-width: 100%;
}
.my-framework .menu-list.vertical > .item > .link {
  max-width: 100%;
  text-transform: uppercase;
}
.my-framework .menu-list.vertical > .item > .link .icon.main {
  display: none;
}
.my-framework .menu-list > .item > .link {
  font-weight: 700;
}

.my-framework .breadcrumb .item {
  float: left;
}
.my-framework .breadcrumb .item .link {
  display: inline;
  padding: 0;
  line-height: 1.5;
}
.my-framework .breadcrumb .item .link, .my-framework .breadcrumb .item .link:hover, .my-framework .breadcrumb .item .link:active {
  background: transparent !important;
}
.my-framework .breadcrumb .item .icon {
  font-size: 65%;
}
.my-framework .breadcrumb .item.active .link, .my-framework .breadcrumb .item.active span {
  color: hsla(351, 66%, 48%, 1);
}
.my-framework .breadcrumb .item.active span {
  cursor: default;
}
.my-framework .breadcrumb > .item {
  margin: 0 1em 0 0;
}

.submenu.vertical > .item {
  max-width: 100%;
  width: 100%;
  float: none;
}
.submenu.vertical > .item > .link {
  max-width: 50%;
}
.submenu.list.vertical > .item {
  max-width: 100%;
}

.fixed-nav .menu.vertical.plain {
  background-color: transparent;
  color: hsla(0, 0%, 100%, 1);
  padding: 0;
}

.fixed-nav > .menu, .fixed-nav .submenu {
  background: none;
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  -o-box-shadow: none;
}

.fixed-nav > .trigger {
  padding: 0 0.25em;
}

.fixed-nav > .trigger.active {
  background-color: hsla(240, 8%, 39%, 1);
}

.fixed-nav .menu .item .link {
  background-color: hsla(240, 8%, 39%, 1);
  color: hsla(172, 72%, 43%, 1);
}

.fixed .menu .item .link:hover, .fixed .menu .item .link:active {
  background-color: hsla(172, 72%, 43%, 1);
  color: hsla(0, 0%, 100%, 1);
}

/* Inputs */
.my-framework input[type='text'], .my-framework textarea {
  padding: 0.75em 1em;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  outline: none;
  -moz-outline: none;
  -webkit-outline: none;
  background-color: hsla(0, 0%, 100%, 1);
  border: 0.1666em solid hsla(220, 33%, 98%, 1);
  color: hsla(240, 8%, 39%, 1);
  cursor: text;
  transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
}
.my-framework input[type='text'].values, .my-framework textarea.values {
  background: none;
  padding: 0;
  margin-bottom: 0.5em;
  border: none;
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  -o-box-shadow: none;
}
.my-framework input[type='text']:focus, .my-framework textarea:focus {
  color: hsla(215, 16%, 23%, 1);
  border-color: hsla(172, 72%, 43%, 1);
  background-color: hsla(0, 0%, 100%, 1);
}
.my-framework select {
  padding: 0.75em 1em;
  background-color: hsla(0, 0%, 100%, 1);
  border: none;
  -webkit-appearance: none;
}
.my-framework input[type='file'] {
  position: absolute;
  margin: 0;
  padding: 0;
  position: static;
  cursor: pointer;
}
.input-wrapper .my-framework input[type='file'] {
  position: absolute;
  top: 0;
  right: 0;
  text-indent: -999em;
}
.my-framework input:disabled {
  cursor: default;
}
.my-framework textarea.editable {
  resize: none;
}
.my-framework label {
  padding-right: 0.5em;
  cursor: pointer;
}

.my-framework .input {
  outline: none;
  -moz-outline: none;
  -webkit-outline: none;
}
.my-framework .input.text, .my-framework .input.editable:focus {
  padding: 0.75em 1em;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  background-color: hsla(0, 0%, 100%, 1);
  border: 0.1666em solid hsla(220, 33%, 98%, 1);
  color: hsla(240, 8%, 39%, 1);
  cursor: text;
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  -o-box-shadow: none;
  transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
  min-width: 15em;
}
.my-framework .input.text:focus {
  color: hsla(215, 16%, 23%, 1);
  border-color: hsla(172, 72%, 43%, 1);
  background-color: hsla(0, 0%, 100%, 1);
}
.my-framework .input.text.disabled {
  cursor: default;
  opacity: 0.75;
  -moz-opacity: 0.75;
  -webkit-opacity: 0.75;
  filter: alpha(opacity=75);
  -ms-filter: "alpha(opacity=75)";
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
}
.my-framework .input.text.error {
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(351, 66%, 48%, 1);
  border-color: transparent !important;
  /* Chrome Placeholder Fix */
}
.my-framework .input.text.error + .icon {
  color: hsla(0, 0%, 100%, 0.35);
}
.my-framework .input.text.error::-webkit-input-placeholder {
  color: hsla(0, 0%, 100%, 0.5);
}
.my-framework .input.text.ok {
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(172, 72%, 43%, 1);
  border-color: transparent !important;
  /* Chrome Placeholder Fix */
}
.my-framework .input.text.ok + .icon {
  color: hsla(0, 0%, 100%, 0.35);
}
.my-framework .input.text.ok::-webkit-input-placeholder {
  color: hsla(0, 0%, 100%, 0.5);
}
.my-framework .input.text.thin {
  padding-top: 0.25em;
  padding-bottom: 0.25em;
}
.my-framework .input.number {
  padding: 0.75em 0.25em 0.75em 1em;
}
.my-framework .input.text.datepicker {
  cursor: default;
}
.my-framework .input.blocknote {
  background: transparent;
  border: none;
  border-bottom: 0.1666em solid hsla(220, 33%, 98%, 1);
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  -o-box-shadow: none;
  padding-left: 0;
  padding-right: 0;
  padding-bottom: 0.25em;
}
.my-framework .input.editable {
  background-color: transparent;
  border: 0.1666em solid transparent;
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  -o-box-shadow: none;
  cursor: default;
}
.my-framework .input.editable:hover {
  border: 0.1666em solid hsla(220, 33%, 98%, 1);
}
.my-framework .input.expanding {
  width: 240px;
  min-width: 240px;
  transition: width 0.2s linear;
  -moz-transition: width 0.2s linear;
  -webkit-transition: width 0.2s linear;
}
.my-framework .input.expanding:focus {
  width: 100%;
}
.my-framework .input.radio {
  margin-right: 0.5em;
}
.my-framework .input.radio.custom {
  display: none;
}
.my-framework .input.radio.custom + label {
  display: inline-block;
  padding: 0.5em 0.75em;
  background-color: hsla(0, 0%, 100%, 1);
  cursor: pointer;
  margin-left: -0.25em;
  min-width: 16px;
  min-height: 16px;
  font-weight: 700;
  transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
}
.my-framework .input.radio.custom:checked + label {
  background-color: hsla(172, 72%, 43%, 1);
  color: hsla(0, 0%, 100%, 1);
}
.my-framework .input.radio.custom.alt + label {
  background-color: hsla(0, 0%, 100%, 1);
  padding: 0.5em 0.75em;
  border: 0.1666em solid transparent;
}
.my-framework .input.radio.custom.alt:checked + label {
  background-color: hsla(172, 72%, 43%, 1);
  color: hsla(0, 0%, 100%, 1);
  border-color: hsla(0, 0%, 0%, 0.15);
}
.my-framework .input.checkbox {
  margin-right: 0.5em;
}
.my-framework .input.checkbox.custom {
  display: none;
}
.my-framework .input.checkbox.custom + label {
  display: inline-block;
  padding: 0.5em 1em;
  background-color: hsla(0, 0%, 100%, 1);
  cursor: pointer;
  min-width: 16px;
  min-height: 16px;
  transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
}
.my-framework .input.checkbox.custom + label .icon {
  margin: 0;
}
.my-framework .input.checkbox.custom:checked + label {
  background-color: hsla(172, 72%, 43%, 1);
  color: hsla(0, 0%, 100%, 1);
}
.my-framework .input.checkbox.custom:checked + label .icon {
  margin: 0;
}
.my-framework .input.select {
  padding: 0.75em 1em;
  background-color: hsla(0, 0%, 100%, 1);
  border: none;
}
.my-framework .input.select.multiple {
  min-height: 6.75em;
}

.my-framework .input-wrapper {
  position: relative;
  display: inline-block;
}
.my-framework .input-wrapper > .icon, .my-framework .input-wrapper > a.uk-form-password-toggle {
  position: absolute;
  right: 0.62em;
  top: 0.5em;
  margin: 0;
  font-size: 150%;
  color: hsla(172, 72%, 43%, 1);
}
.my-framework .input-wrapper > .icon.close {
  right: 0.6666em;
  top: 0.5833em;
  font-size: 100%;
  color: hsla(240, 8%, 39%, 1);
}
.my-framework .input-wrapper > .icon.close:hover, .my-framework .input-wrapper > .icon.close:active {
  color: hsla(172, 72%, 43%, 1);
  background-color: transparent;
}
.my-framework .input-wrapper.date-picker > .icon {
  font-size: 100%;
  top: 1em;
  right: 1em;
}
.my-framework .input-wrapper.date-picker .range-datepicker {
  cursor: default;
}
.my-framework .input-wrapper.with-icon .input {
  padding-right: 3em;
}
.my-framework .input-wrapper.with-icon .input.error + .icon {
  color: hsla(0, 0%, 100%, 0.35);
}
.my-framework .input-wrapper.with-icon .input.ok + .icon {
  color: hsla(0, 0%, 100%, 0.35);
}
.my-framework .input-wrapper .button, .my-framework .input-wrapper button {
  display: block;
  float: right;
  line-height: 1.5;
  padding-top: 0.75em;
  padding-bottom: 0.75em;
}
.my-framework .input-wrapper .button:active, .my-framework .input-wrapper button:active {
  margin-bottom: 0;
  top: 0;
}
.my-framework .input-wrapper .input, .my-framework .input-wrapper input[type="text"] {
  float: left;
  margin: 0;
}
.my-framework .input-wrapper label {
  margin: 0;
}
.my-framework .input-wrapper.multiple {
  display: block;
}
.my-framework .input-wrapper.multiple .button, .my-framework .input-wrapper.multiple button {
  width: 20%;
}
.my-framework .input-wrapper.multiple .input, .my-framework .input-wrapper.multiple input[type="text"], .my-framework .input-wrapper.multiple .input:focus, .my-framework .input-wrapper.multiple input[type="text"]:focus {
  width: 80%;
}
.my-framework .input-wrapper.multiple .input.expanding, .my-framework .input-wrapper.multiple input[type="text"].expanding {
  width: auto;
}
.my-framework .input-wrapper.multiple .input.expanding:focus, .my-framework .input-wrapper.multiple input[type="text"].expanding:focus {
  width: 100%;
}
.my-framework .wrapper {
  display: block;
}

/* Alerts and Warnings */
.my-framework .message, .my-framework .message-thin, .my-framework .message-warning, .my-framework .message-error, .my-framework .message-alert, .my-framework .message-info, .my-framework .message-ok, .my-framework .message-neutral, .my-framework .message-modal, .my-framework .message-tooltip, .my-framework .message-in-box, .my-framework .uk-notify-message {
  display: block;
  padding: 0.75em 1em;
  text-align: center;
  border: 0.0833em solid transparent;
}
.my-framework .message a, .my-framework .message-thin a, .my-framework .message-warning a, .my-framework .message-error a, .my-framework .message-alert a, .my-framework .message-info a, .my-framework .message-ok a, .my-framework .message-neutral a, .my-framework .message-modal a, .my-framework .message-tooltip a, .my-framework .message-in-box a, .my-framework .uk-notify-message a {
  color: inherit;
  border-bottom: 0.0833em dotted;
}
.my-framework .message .icon.tooltip, .my-framework .message-thin .icon.tooltip, .my-framework .message-warning .icon.tooltip, .my-framework .message-error .icon.tooltip, .my-framework .message-alert .icon.tooltip, .my-framework .message-info .icon.tooltip, .my-framework .message-ok .icon.tooltip, .my-framework .message-neutral .icon.tooltip, .my-framework .message-modal .icon.tooltip, .my-framework .message-tooltip .icon.tooltip, .my-framework .message-in-box .icon.tooltip, .my-framework .uk-notify-message .icon.tooltip {
  margin-top: 0;
}
.my-framework .message-thin {
  padding: 0 1em;
  line-height: 2.25;
}
.my-framework .message-warning, .my-framework .message-modal.warning, .my-framework .uk-notify .uk-notify-message-warning {
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(22, 85%, 57%, 1);
}
.my-framework .message-warning .icon, .my-framework .message-modal.warning .icon, .my-framework .uk-notify .uk-notify-message-warning .icon {
  color: hsla(0, 0%, 100%, 0.35);
}
.my-framework .message-error, .my-framework .message-alert, .my-framework .message-modal.error, .my-framework .message-modal.alert, .my-framework .uk-notify .uk-notify-message-danger {
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(351, 66%, 48%, 1);
}
.my-framework .message-error .icon, .my-framework .message-alert .icon, .my-framework .message-modal.error .icon, .my-framework .message-modal.alert .icon, .my-framework .uk-notify .uk-notify-message-danger .icon {
  color: hsla(0, 0%, 100%, 0.35);
}
.my-framework .message-error .icon.tooltip, .my-framework .message-alert .icon.tooltip, .my-framework .message-modal.error .icon.tooltip, .my-framework .message-modal.alert .icon.tooltip, .my-framework .uk-notify .uk-notify-message-danger .icon.tooltip {
  margin-top: 0.1666em;
}
.my-framework .message-info, .my-framework .message-modal.info, .my-framework .uk-notify .uk-notify-message-info {
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(189, 83%, 45%, 1);
}
.my-framework .message-info .icon, .my-framework .message-modal.info .icon, .my-framework .uk-notify .uk-notify-message-info .icon {
  color: hsla(0, 0%, 100%, 0.35);
}
.my-framework .message-ok, .my-framework .message-modal.ok, .my-framework .uk-notify .uk-notify-message-success {
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(172, 72%, 43%, 1);
}
.my-framework .message-ok .icon, .my-framework .message-modal.ok .icon, .my-framework .uk-notify .uk-notify-message-success .icon {
  color: hsla(0, 0%, 100%, 0.35);
}
.my-framework .message, .my-framework .message-neutral, .my-framework .message-modal.neutral {
  color: hsla(240, 8%, 39%, 1);
  background-color: hsla(0, 0%, 100%, 1);
}
.my-framework .message-modal {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  margin: 0;
  z-index: 996;
}
.my-framework .message-modal .icon {
  cursor: pointer;
  padding: 0.3333em 0.5em;
  margin-top: 0;
  background-color: hsla(0, 0%, 0%, 0.05);
  color: hsla(0, 0%, 100%, 0.35);
}
.my-framework .message-modal .icon:hover {
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(0, 0%, 0%, 0.15);
}
.my-framework .message-in-box {
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  -o-box-shadow: none;
}
.my-framework .message.with-icon .icon, .my-framework .message-alert.with-icon .icon, .my-framework .message-error.with-icon .icon, .my-framework .message-info.with-icon .icon, .my-framework .message-warning.with-icon .icon, .my-framework .message-ok.with-icon .icon {
  font-size: 150%;
  margin-top: 0;
}
.my-framework .tooltip {
  cursor: default;
  padding: 0.25em 0.5em;
}

/* Boxes, Containers and Controls */
.my-framework .modal {
  display: none;
}
.my-framework .box {
  background-color: hsla(0, 0%, 100%, 1);
}
.flyer .my-framework .box {
  background-color: transparent;
}
.my-framework .box.modal {
  display: block;
}

.my-framework .pane {
  background-color: hsla(0, 0%, 100%, 1);
  position: relative;
  left: 0;
  top: 0;
}
.my-framework .pane.docking {
  width: 100%;
}
.my-framework .pane.right {
  left: inherit;
  right: 0;
}
.my-framework .pane .content {
  padding: 0;
}
.my-framework .pane .content section {
  padding: 1em;
}

#myDocument .my-framework .controls, #myDocument .my-framework .controls-horizontal, #myDocument .my-framework .floating-nav {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: auto;
  margin: 0;
}
#myDocument .my-framework .controls > .item, #myDocument .my-framework .controls-horizontal > .item, #myDocument .my-framework .floating-nav > .item {
  list-style-type: none;
  text-align: center;
}
#myDocument .my-framework .controls > .item.close, #myDocument .my-framework .controls-horizontal > .item.close, #myDocument .my-framework .floating-nav > .item.close {
  margin: 0;
  padding: 0;
  float: none;
  color: inherit;
  background-color: transparent;
}
#myDocument .my-framework .controls > .item .icon, #myDocument .my-framework .controls-horizontal > .item .icon, #myDocument .my-framework .floating-nav > .item .icon {
  margin-top: 0;
  min-width: 16px;
}
#myDocument .my-framework .controls .docking .trigger, #myDocument .my-framework .controls-horizontal .docking .trigger, #myDocument .my-framework .floating-nav .docking .trigger {
  display: block;
  padding: 0.1666em 0.1666em 0.2em;
  margin-top: 0;
  font-size: 150%;
  color: hsla(172, 72%, 43%, 1);
  background-color: hsla(0, 0%, 100%, 1);
}
#myDocument .my-framework .controls .docking .trigger:hover, #myDocument .my-framework .controls-horizontal .docking .trigger:hover, #myDocument .my-framework .floating-nav .docking .trigger:hover {
  background-color: hsla(215, 16%, 23%, 1);
  color: hsla(0, 0%, 100%, 1);
}
#myDocument .my-framework .controls .docking .trigger .icon, #myDocument .my-framework .controls-horizontal .docking .trigger .icon, #myDocument .my-framework .floating-nav .docking .trigger .icon {
  display: block;
  text-indent: 0;
  padding: 0.5em;
  margin-top: 0;
}
#myDocument .my-framework .controls > .item.close:before, #myDocument .my-framework .controls-horizontal > .item.close:before, #myDocument .my-framework .floating-nav > .item.close:before {
  content: " ";
}
.docking:hover #myDocument .my-framework .controls, .pane:hover #myDocument .my-framework .controls, .docking:hover #myDocument .my-framework .controls-horizontal, .pane:hover #myDocument .my-framework .controls-horizontal, .docking:hover #myDocument .my-framework .floating-nav, .pane:hover #myDocument .my-framework .floating-nav {
  display: block;
}
#myDocument .my-framework .controls.left, #myDocument .my-framework .controls-horizontal.left, #myDocument .my-framework .floating-nav.left {
  right: auto;
  left: 0;
}
#myDocument .my-framework .controls-horizontal {
  right: 0;
  top: 0;
}
#myDocument .my-framework .controls-horizontal .item {
  display: inline-block;
}
#myDocument .my-framework .controls > .item a, #myDocument .my-framework .controls-horizontal > .item a {
  padding: 0.5em 0.75em;
}
#myDocument .my-framework .controls > .item > a, #myDocument .my-framework .controls-horizontal > .item > a {
  display: block;
}
#myDocument .my-framework .controls.left > .item > a, #myDocument .my-framework .controls-horizontal.left > .item > a {
  float: left;
  min-width: 42px;
}
#myDocument .my-framework .controls-horizontal > .item > a {
  margin-left: -0.3333em;
}
#myDocument .my-framework .controls-horizontal > .item:first-child > a {
  margin-left: 0;
}
#myDocument .my-framework header .controls, #myDocument .my-framework header .controls-horizontal {
  margin-top: 0.3333em;
}
#myDocument .my-framework header .controls .item a, #myDocument .my-framework header .controls-horizontal .item a {
  color: hsla(0, 0%, 100%, 1);
}

.my-framework .floating-nav {
  display: none;
  position: fixed;
  top: 50%;
}
.my-framework .floating-nav > * {
  font-size: 100%;
  display: block;
  padding: 0.75em 1em;
  width: 7.5em;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: hsla(0, 0%, 100%, 1) !important;
  background-color: hsla(172, 72%, 43%, 0.5);
}
.my-framework .floating-nav > * .description {
  color: hsla(0, 0%, 100%, 1);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  text-align: right;
}
.my-framework .floating-nav > *:hover, .my-framework .floating-nav > *:active {
  font-size: 150%;
  width: auto;
  overflow: visible;
  white-space: normal;
  text-overflow: clip;
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(172, 72%, 43%, 1);
}
.my-framework .floating-nav > *:hover .description, .my-framework .floating-nav > *:active .description {
  overflow: visible;
  white-space: normal;
  text-overflow: clip;
}
.my-framework .floating-nav > * .icon {
  font-size: 200%;
  margin-left: 0.5em;
  margin-top: 0.1666em;
}
.my-framework .floating-nav.left .description {
  text-align: left;
}
.my-framework .floating-nav.left .icon {
  margin-left: 0;
  margin-right: 0.5em;
}

.my-framework .caption {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 0.5em 0.75em;
  width: auto;
  background-color: hsla(0, 0%, 100%, 0.75);
  color: hsla(215, 16%, 23%, 1);
  font-weight: 700;
  width: auto;
}
.my-framework .img {
  display: inline-block;
  position: relative;
  background-color: transparent;
}
.my-framework .img .caption {
  text-transform: uppercase;
}
.my-framework .img.with-border .caption, .my-framework .img.with-border .overlay {
  left: 1px;
  right: 1px;
  bottom: 1px;
}
.my-framework .img.with-border .overlay {
  left: 0;
}
.my-framework .thumb {
  max-width: 120px;
  border: 0.4166em solid hsla(0, 0%, 0%, 0.1);
}
.my-framework a .thumb {
  display: block;
}
.my-framework .thumbs .item {
  float: left;
  padding: 0 0.5em 1em 0;
}
.my-framework .thumbs .item a {
  display: block;
}
.my-framework .thumbs .item .thumb {
  max-width: 120px;
  border: 0.4166em solid hsla(0, 0%, 0%, 0.1);
}
.my-framework .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: hsla(0, 0%, 100%, 1);
  opacity: 0;
  -moz-opacity: 0;
  -webkit-opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "alpha(opacity=0)";
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
a.img:hover .my-framework .overlay {
  background-color: hsla(0, 0%, 100%, 0.5);
  z-index: 990;
  opacity: 1;
  -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "alpha(opacity=100)";
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  transition: opacity 0.4s linear;
  -moz-transition: opacity 0.4s linear;
  -webkit-transition: opacity 0.4s linear;
}
.my-framework .overlay .icon {
  color: hsla(240, 8%, 39%, 1);
  background-color: hsla(0, 0%, 100%, 0.75);
  font-size: 200%;
  position: absolute;
  right: 0.5em;
  top: 0.5em;
  padding: 0.25em 0.3333em;
  margin-top: 0;
}
.my-framework .overlay .icon:hover {
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(172, 72%, 43%, 1);
}

/* Box */
.my-framework .box {
  position: relative;
}
.my-framework .box .content {
  padding: 1em;
}
.my-framework .box > header, .my-framework .box > footer {
  padding: 0.75em 1em;
  line-height: 2;
}
.my-framework .box > header {
  font-size: 125%;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
}
.my-framework .box > header > .trigger {
  padding: 0.5em;
}
.my-framework .box > header, .my-framework .box.slide.active > header {
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(172, 72%, 43%, 1);
}
.my-framework .box > footer {
  padding-top: 0.25em;
  padding-bottom: 0.25em;
  color: hsla(0, 0%, 100%, 0.5);
  background-color: hsla(215, 16%, 23%, 1);
}
.my-framework .box .scroll {
  max-height: 10em;
}
.my-framework .box.slide header {
  cursor: default;
}

/* Asides */
.my-framework .aside.left, .my-framework aside.left {
  margin: 0 1em 1em 0;
}
.my-framework .aside.right, .my-framework aside.right {
  margin: 0 0 1em 1em;
}

/* Content Header */
.my-framework .content > header {
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(172, 72%, 43%, 1);
  padding: 0.75em 1em;
  font-size: 125%;
}

/* Tables */
.my-framework {
  /* Classic Tables */
  /* List Tables*/
}
.my-framework table.stripes tbody tr:nth-child(even) {
  background-color: hsla(0, 0%, 100%, 1);
}
.my-framework table td, .my-framework table th {
  padding: 0.5em 1em;
  border: 0.0833em solid hsla(220, 33%, 98%, 1);
}
.my-framework table th {
  color: hsla(215, 16%, 23%, 1);
  background-color: hsla(220, 33%, 98%, 1);
}
.my-framework table caption {
  background-color: hsla(172, 72%, 43%, 1);
  color: hsla(0, 0%, 100%, 1);
  padding: 0.5em 1em;
  font-size: 125%;
  font-weight: 700;
  text-transform: uppercase;
}
.my-framework table tfoot td {
  background-color: hsla(214, 20%, 93%, 1);
  border-top: none;
}
.my-framework table.center {
  text-align: center;
}
.my-framework table.right {
  text-align: right;
}
.my-framework table.condensed td, .my-framework table.condensed th {
  padding-top: 0.25em;
  padding-bottom: 0.25em;
}
.my-framework .table {
  display: table;
  width: auto;
  position: relative;
}
.my-framework .table header {
  width: auto;
  line-height: 2;
  display: table-header-group;
}
.my-framework .table footer {
  width: auto;
  display: table-footer-group;
  line-height: 2;
}
.my-framework .table header .title, .my-framework .table footer .title {
  display: block;
  padding-left: 1em;
  padding-right: 1em;
  float: none;
}
.my-framework .table .list {
  float: left;
  display: block;
}
.my-framework .table .list:last-child, .my-framework .table .list.col {
  border-bottom: 0.0833em solid hsla(220, 33%, 98%, 1);
}
.my-framework .table .item {
  border: 0.0833em solid hsla(220, 33%, 98%, 1);
  border-left: none;
  border-bottom: none;
}
.my-framework .table .item .title {
  display: block;
  padding: 0.5em 1em;
  float: none;
}
.my-framework .table .col .item, .my-framework .table .row .item:first-child, .my-framework .table .col .item:first-child {
  border-left: 0.0833em solid hsla(220, 33%, 98%, 1);
}
.my-framework .table .col .item {
  border-left: none;
}
.my-framework .table .row:first-child .item, .my-framework .table .col:first-child .item {
  border-left: 0.0833em solid hsla(220, 33%, 98%, 1);
}
.my-framework .table .rows {
  display: table-row-group;
}
.my-framework .table .rows .list {
  width: auto;
  margin: 0;
}
.my-framework .table .rows .list .item {
  display: table-cell;
}
.my-framework .table .rows.stripes .list:nth-child(even), .my-framework .table .cols.stripes .list:nth-child(even) {
  background-color: hsla(0, 0%, 100%, 1);
}
.my-framework .table .list {
  display: block;
  width: auto;
  float: left;
  margin: 0;
}
.my-framework .table .list .item {
  display: block;
}
.my-framework .table .list .item.header {
  color: hsla(215, 16%, 23%, 1);
  background-color: hsla(0, 0%, 100%, 1);
  font-weight: 700;
}
.my-framework .table .list .item.footer {
  color: hsla(215, 16%, 23%, 1);
  background-color: hsla(0, 0%, 100%, 1);
  font-weight: 700;
}
.my-framework .table.stripes .list .item:nth-child(even) .title {
  background-color: hsla(0, 0%, 100%, 1);
}

/* Sections */
.my-framework .section, .my-framework .section-freee, .my-framework .section-padded, .my-framework .section-vertical, .my-framework .section-horizontal, .my-framework .section-left, .my-framework .section-right, .my-framework .section-top, .my-framework .section-bottom {
  position: relative;
  margin: 1.5em;
}
.my-framework .section-free {
  margin: 0;
}
.my-framework .section-padded {
  padding: 1em;
}
.my-framework .section-vertical {
  margin-left: 0;
  margin-right: 0;
}
.my-framework .section-horizontal {
  margin-top: 0;
  margin-bottom: 0;
}
.my-framework .section-left {
  margin-left: 0;
}
.my-framework .section-right {
  margin-right: 0;
}
.my-framework .section-top {
  margin-top: 0;
}
.my-framework .section-bottom {
  margin-bottom: 0;
}
.my-framework .section-full {
  width: 100%;
  margin: 1.5em 0;
  padding: 0;
}

/* BEHAVIORS */
/* Sliding Behavior */
.my-framework .slide {
  /* Action Class */
}
.my-framework .slide > .content {
  display: none;
}
.my-framework .slide > * > .trigger, .my-framework .slide > .trigger > .icon {
  cursor: pointer;
  margin-left: 0;
  margin-top: 0;
  padding: 0.5em;
}

/* Content Behavior inside Active State */
.my-framework .active .content {
  display: block;
}

/* Icons Behavior */
.my-framework .icon, .my-framework .icon-default {
  float: none;
  margin-top: 0.1666em;
}
.my-framework .icon.left, .my-framework .icon-default.left {
  float: left;
  margin-right: 6px;
}
.my-framework .icon.right, .my-framework .icon-default.right {
  float: right;
  margin-left: 16px;
}
.my-framework .icon.medium, .my-framework .medium .icon, .my-framework .icon-default.medium, .my-framework .medium .icon-default {
  margin-top: 0.3333em;
}
.my-framework .content > .icon, .my-framework .content > .icon-default {
  margin-top: 0;
}

/* COMPONENTS */
/* Timeline */
.my-framework .timeline {
  position: relative;
  margin: 5em 0;
}
.my-framework .timeline .bar {
  padding: 0 3em;
  height: auto;
  max-height: 1em;
  background-color: hsla(0, 0%, 100%, 1);
}
.my-framework .timeline .list .item {
  display: block;
  padding-right: 1em;
  float: left;
  width: auto;
  min-width: 10em;
  position: relative;
}
.my-framework .timeline .list .item span {
  display: block;
  position: relative;
}
.my-framework .timeline .list .item .datetime {
  top: -4em;
}
.my-framework .timeline .list .item .content {
  display: none;
  position: absolute;
  top: 4em;
  padding: 0.75em;
  min-height: 3em;
  background-color: hsla(0, 0%, 100%, 1);
  width: auto;
  min-width: 300%;
  z-index: 996;
}
.my-framework .timeline .list .item .dot {
  position: absolute;
  top: -0.25em;
  width: 1.5833em;
  height: 1.5833em;
  background-color: hsla(172, 72%, 43%, 1);
  cursor: default;
}
.my-framework .timeline .list .item img.dot {
  width: 4.7499em;
  height: 4.7499em;
  top: -1.75em;
  border: 0.25em solid hsla(172, 72%, 43%, 1);
  border-radius: 5em;
  -moz-border-radius: 5em;
  -webkit-border-radius: 5em;
}
.my-framework .timeline .list .item:hover .content {
  display: block;
}
.my-framework .timeline .list .item:hover .dot {
  background-color: hsla(172, 72%, 43%, 0.9);
}
.my-framework .timeline.vertical {
  margin: 0 2em;
}
.my-framework .timeline.vertical .bar {
  max-height: inherit;
  max-width: 1em;
  width: auto;
  padding: 3em 0;
  margin: 0 auto;
}
.my-framework .timeline.vertical .list .item {
  padding-right: 0;
  padding-bottom: 1em;
  min-height: 10em;
  min-width: inherit;
  float: none;
}
.my-framework .timeline.vertical .list .item .dot {
  top: 0;
  left: -0.3em;
}
.my-framework .timeline.vertical .list .item img.dot {
  width: 4.7499em;
  height: 4.7499em;
  left: -1.75em;
  max-width: inherit;
}
.my-framework .timeline.vertical .list .item .datetime, .my-framework .timeline.vertical .list .item .title {
  top: 0;
  left: -16.5em;
  text-align: right;
  min-width: 180px;
}
.my-framework .timeline.vertical .list .item .datetime {
  top: 1.5em;
}
.my-framework .timeline.vertical .list .item .title {
  display: none;
  padding: 0.5em 0.75em;
  text-align: left;
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(172, 72%, 43%, 1);
}
.my-framework .timeline.vertical .list .item .content {
  position: relative;
  top: -4em;
  left: 4em;
  min-width: 480px;
  display: none;
}
.my-framework .timeline.vertical .list .item:hover .content, .my-framework .timeline.vertical .list .item:hover .title {
  display: inline-block;
}
.my-framework .timeline.vertical .list .item:hover .datetime {
  top: 0;
}
.my-framework .timeline.static .list .item .content, .my-framework .timeline.static .list .item .title {
  display: inline-block;
}
.my-framework .timeline.static .list .item .content {
  position: relative;
}
.my-framework .timeline.static .list .item .datetime {
  top: 0;
}

/* Flyer */
.my-framework .flyer {
  position: relative;
}
.my-framework .flyer .content {
  display: block;
  background-color: hsla(0, 0%, 100%, 1);
}
.my-framework .flyer .action {
  position: relative;
  bottom: 0;
  left: 0;
  width: 100%;
  border: none;
  font-weight: 700;
  font-size: 125%;
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  -o-box-shadow: none;
}
#myDocument .my-framework .flyer .action:active {
  top: 0;
  margin-bottom: 0;
}

/* Tags */
.my-framework .tags {
  margin: 0;
}
.my-framework .tags .item {
  float: left;
  display: block;
  margin-right: 0.5em;
  margin-bottom: 0.5em;
}
.my-framework .tags .item:last-child {
  margin-right: 0;
}
.my-framework .tags .item .tag {
  display: block;
  text-transform: uppercase;
  font-weight: 200;
  font-size: 85%;
  color: hsla(0, 0%, 100%, 1);
}
.my-framework .tags .item .tag:hover, .my-framework .tags .item .tag:active {
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(215, 16%, 23%, 1);
}

/* Elements Revealer */
.my-framework .reveal .visible-element, .my-framework .reveal .hidden-element {
  width: 50%;
  float: left;
}
.my-framework .reveal .visible-element {
  width: 100%;
}
.my-framework .reveal .hidden-element {
  display: none;
}

/* Comments */
#myDocument .my-framework .comments {
  position: relative;
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  -o-box-shadow: none;
}
#myDocument .my-framework .comments > .list > .item {
  background-color: hsla(0, 0%, 100%, 1);
}
#myDocument .my-framework .comments > .list > .item .comment {
  position: relative;
}
#myDocument .my-framework .comments > .list > .item.replied .reply .replier {
  margin-left: 4em;
  position: relative;
}
#myDocument .my-framework .comments > .list > .item.replied .reply .replier > .icon {
  font-size: 150%;
  display: block;
  position: absolute;
  left: -1em;
  color: hsla(215, 16%, 23%, 0.25);
  transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
}
#myDocument .my-framework .comments > .list > .item.replied .reply .replier .comment-block .controls {
  display: none;
  z-index: 999;
}
#myDocument .my-framework .comments > .list > .item.replied .reply .replier + .reply {
  margin-left: 4em;
}
#myDocument .my-framework .comments > .list > .item.replied .reply:hover > .comment .controls {
  display: block;
}
#myDocument .my-framework .comments > .list > .item.replied .reply > .comment:hover .controls {
  display: block;
}
#myDocument .my-framework .comments > .list > .item:nth-child(even) {
  background-color: hsla(0, 0%, 100%, 1);
}
#myDocument .my-framework .comments > .list > .item aside {
  margin: 0;
  padding: 1em;
}
#myDocument .my-framework .comments > .list > .item aside.commenter {
  width: auto;
  max-width: 20%;
}
#myDocument .my-framework .comments > .list > .item aside.commenter .name {
  display: block;
  padding: 0.25em 0.5em;
  text-align: center;
  font-weight: 700;
  text-transform: uppercase;
  color: hsla(215, 16%, 23%, 1);
}
#myDocument .my-framework .comments > .list > .item aside.commenter img {
  width: 100%;
  max-width: 120px;
  border: 0.25em solid hsla(0, 0%, 0%, 0.1);
}
#myDocument .my-framework .comments > .list > .item aside.comment-block {
  width: 80%;
  padding-left: 0;
}
#myDocument .my-framework .comments > .list > .item aside.comment-block .controls {
  display: none;
  top: 1em;
  z-index: 999;
}
#myDocument .my-framework .comments > .list > .item aside.comment-block .controls .item {
  display: block;
}
#myDocument .my-framework .comments > .list > .item aside.comment-block .controls .item .link {
  display: block;
}
#myDocument .my-framework .comments > .list > .item aside.comment-block .controls .item .icon {
  background-color: hsla(0, 0%, 100%, 1);
  color: hsla(172, 72%, 43%, 0.25);
  display: block;
  margin-top: 0;
  padding: 0.5em 0.75em;
}
#myDocument .my-framework .comments > .list > .item aside.comment-block .controls .item .icon:hover, #myDocument .my-framework .comments > .list > .item aside.comment-block .controls .item .icon:active {
  color: hsla(172, 72%, 43%, 1);
}
#myDocument .my-framework .comments > .list > .item aside.comment-block p {
  margin-top: 0;
}
#myDocument .my-framework .comments > .list > .item > .comment:hover .controls {
  display: block;
}
#myDocument .my-framework .comments .post-comment {
  position: relative;
}
#myDocument .my-framework .comments .post-comment textarea {
  margin-top: 1em;
  width: 100%;
}
#myDocument .my-framework .comments .post-comment button {
  position: absolute;
  bottom: 0;
  top: auto;
  right: 0;
}
#myDocument .my-framework .comments .post-comment button:active {
  top: auto;
  margin-bottom: 0;
}

/* Feedback */
.my-framework .feedback .client, .my-framework .feedback-right .client {
  display: block;
  float: left;
  max-width: 120px;
  margin-right: 1.5em;
}
.my-framework .feedback .client .avatar, .my-framework .feedback .client .name, .my-framework .feedback-right .client .avatar, .my-framework .feedback-right .client .name {
  display: block;
}
.my-framework .feedback .client .avatar, .my-framework .feedback-right .client .avatar {
  max-width: 100%;
  border: 0.25em solid hsla(0, 0%, 0%, 0.1);
}
.my-framework .feedback .client .name, .my-framework .feedback-right .client .name {
  text-align: center;
  font-weight: 700;
}
.my-framework .feedback .quote, .my-framework .feedback-right .quote {
  width: auto;
  min-width: 25%;
  max-width: 75%;
  float: left;
  position: relative;
  box-shadow: 0 0.1666em 0 hsla(0, 0%, 0%, 0.1);
  -moz-box-shadow: 0 0.1666em 0 hsla(0, 0%, 0%, 0.1);
  -webkit-box-shadow: 0 0.1666em 0 hsla(0, 0%, 0%, 0.1);
  -o-box-shadow: 0 0.1666em 0 hsla(0, 0%, 0%, 0.1);
}
.my-framework .feedback .quote .icon.main, .my-framework .feedback-right .quote .icon.main {
  font-size: 150%;
  position: absolute;
  left: -0.5em;
  margin-top: 0;
  color: hsla(0, 0%, 100%, 1);
}
.my-framework .feedback-right .client {
  margin-right: 0;
  margin-left: 1.5em;
  float: left;
}
.my-framework .feedback-right .quote {
  border-left: none;
  border-right: 0.4166em solid transparent;
}
.my-framework .feedback-right .quote .icon.main {
  left: auto;
  right: -0.5em;
  margin-top: 0;
}

/* Social Icons */
.my-framework .social .item {
  float: left;
  display: block;
  text-align: center;
  margin: 0 0.25em 0.25em 0;
}
.my-framework .social .item:last-child {
  margin-right: 0;
}
.my-framework .social .item a {
  padding: 0.25em 0.6666em;
  min-width: 2.25em;
  display: block;
  text-align: center;
  color: hsla(240, 8%, 39%, 1);
}
.my-framework .social .item.facebook a:hover, .my-framework .social .item.facebook a:active {
  color: #3C599B;
}
.my-framework .social .item.twitter a:hover, .my-framework .social .item.twitter a:active {
  color: #32CCFE;
}
.my-framework .social .item.linkedin a:hover, .my-framework .social .item.linkedin a:active {
  color: #017EB4;
}
.my-framework .social .item.google-plus a:hover, .my-framework .social .item.google-plus a:active {
  color: #D95232;
}
.my-framework .social .item.github a:hover, .my-framework .social .item.github a:active {
  color: #171516;
}
.my-framework .social .item.flickr a:hover, .my-framework .social .item.flickr a:active {
  color: #FF0084;
}
.my-framework .social .item.pinterest a:hover, .my-framework .social .item.pinterest a:active {
  color: #CC2127;
}
.my-framework .social .item.foursquare a:hover, .my-framework .social .item.foursquare a:active {
  color: #156DB5;
}
.my-framework .social .item.instagram a:hover, .my-framework .social .item.instagram a:active {
  color: #A16F55;
}
.my-framework .social .item.vimeo a:hover, .my-framework .social .item.vimeo a:active {
  color: #1BB6EC;
}
.my-framework .social .item.tumblr a:hover, .my-framework .social .item.tumblr a:active {
  color: #2C4762;
}
.my-framework .social .item.youtube a:hover, .my-framework .social .item.youtube a:active {
  color: #D51D27;
}
.my-framework .social .item.stack-overflow a:hover, .my-framework .social .item.stack-overflow a:active {
  color: #FE7413;
}
.my-framework .social .item.dribbble a:hover, .my-framework .social .item.dribbble a:active {
  color: #E04C86;
}
.my-framework .social .item.skype a:hover, .my-framework .social .item.skype a:active {
  color: #01AEF2;
}
.my-framework .social .item.dropbox a:hover, .my-framework .social .item.dropbox a:active {
  color: #007EE5;
}
.my-framework .social .item.bitbucket a:hover, .my-framework .social .item.bitbucket a:active {
  color: #205081;
}
.my-framework .social.with-background {
  background-color: transparent !important;
  padding: 0;
}
.my-framework .social.with-background .item a {
  min-height: 2.25em;
  color: hsla(240, 8%, 39%, 0.25);
  background-color: hsla(0, 0%, 0%, 0.1);
}
.my-framework .social.with-background .item a:hover, .my-framework .social.with-background .item a:active {
  color: hsla(0, 0%, 100%, 1);
}
.my-framework .social.with-background .item.facebook a:hover, .my-framework .social.with-background .item.facebook a:active {
  background-color: #3C599B;
}
.my-framework .social.with-background .item.twitter a:hover, .my-framework .social.with-background .item.twitter a:active {
  background-color: #32CCFE;
}
.my-framework .social.with-background .item.linkedin a:hover, .my-framework .social.with-background .item.linkedin a:active {
  background-color: #017EB4;
}
.my-framework .social.with-background .item.google-plus a:hover, .my-framework .social.with-background .item.google-plus a:active {
  background-color: #D95232;
}
.my-framework .social.with-background .item.github a:hover, .my-framework .social.with-background .item.github a:active {
  background-color: #171516;
}
.my-framework .social.with-background .item.flickr a:hover, .my-framework .social.with-background .item.flickr a:active {
  background-color: #FF0084;
}
.my-framework .social.with-background .item.pinterest a:hover, .my-framework .social.with-background .item.pinterest a:active {
  background-color: #CC2127;
}
.my-framework .social.with-background .item.foursquare a:hover, .my-framework .social.with-background .item.foursquare a:active {
  background-color: #156DB5;
}
.my-framework .social.with-background .item.instagram a:hover, .my-framework .social.with-background .item.instagram a:active {
  background-color: #A16F55;
}
.my-framework .social.with-background .item.vimeo a:hover, .my-framework .social.with-background .item.vimeo a:active {
  background-color: #1BB6EC;
}
.my-framework .social.with-background .item.tumblr a:hover, .my-framework .social.with-background .item.tumblr a:active {
  background-color: #2C4762;
}
.my-framework .social.with-background .item.youtube a:hover, .my-framework .social.with-background .item.youtube a:active {
  background-color: #D51D27;
}
.my-framework .social.with-background .item.stack-overflow a:hover, .my-framework .social.with-background .item.stack-overflow a:active {
  background-color: #FE7413;
}
.my-framework .social.with-background .item.dribbble a:hover, .my-framework .social.with-background .item.dribbble a:active {
  background-color: #E04C86;
}
.my-framework .social.with-background .item.skype a:hover, .my-framework .social.with-background .item.skype a:active {
  background-color: #01AEF2;
}
.my-framework .social.with-background .item.dropbox a:hover, .my-framework .social.with-background .item.dropbox a:active {
  background-color: #007EE5;
}
.my-framework .social.with-background .item.bitbucket a:hover, .my-framework .social.with-background .item.bitbucket a:active {
  background-color: #205081;
}

/* Pricing Tables */
.my-framework .pricing-table thead {
  font-size: 200%;
}
.my-framework .pricing-table thead th {
  background-color: hsla(172, 72%, 43%, 1);
  color: hsla(0, 0%, 100%, 1);
  border: none;
  padding: 0;
}
.my-framework .pricing-table thead th .title {
  display: block;
  float: none;
  padding: 0.5em 1em;
  border-right: 0.0833em solid hsla(0, 0%, 100%, 1);
}
.my-framework .pricing-table thead th:last-child .title {
  border-right: none;
}
.my-framework .pricing-table thead th.features {
  background-color: transparent;
  color: hsla(172, 72%, 43%, 1);
}
.my-framework .pricing-table tbody td {
  text-align: center;
  color: hsla(240, 8%, 39%, 1);
}
.my-framework .pricing-table tbody td .icon {
  font-size: 150%;
  display: inline-block;
}
.my-framework .pricing-table tfoot td {
  padding: 0;
  background-color: transparent;
  text-align: center;
  border: none;
  color: hsla(172, 72%, 43%, 1);
}
.my-framework .pricing-table tfoot td a {
  display: block;
  margin-right: 1px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: hsla(0, 0%, 100%, 0.75);
  background-color: hsla(215, 16%, 23%, 1);
}
.my-framework .pricing-table tfoot td a:hover {
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(215, 16%, 23%, 1);
}
.my-framework .pricing-table tfoot td a:active {
  color: hsla(0, 0%, 100%, 0.5);
  background-color: hsla(215, 16%, 23%, 1);
}
.my-framework .pricing-table tfoot td:last-child a {
  margin-right: 0;
}
#myDocument .my-framework .pricing-table tfoot td.one, #myDocument .my-framework .pricing-table tfoot td.two, #myDocument .my-framework .pricing-table tfoot td.three {
  background-color: transparent;
}
.my-framework .pricing-table tfoot td .price {
  color: hsla(351, 66%, 48%, 1);
  font-size: 200%;
  display: block;
}
.my-framework .pricing-table th, .my-framework .pricing-table td {
  border: none;
}
.my-framework .pricing-table th.featured, .my-framework .pricing-table td.featured {
  background-color: hsla(351, 66%, 48%, 1);
}
.my-framework .pricing-table th.featured a, .my-framework .pricing-table td.featured a {
  background-color: hsla(351, 66%, 48%, 1);
}
.my-framework .pricing-table th.featured a:hover, .my-framework .pricing-table td.featured a:hover {
  background-color: hsla(351, 66%, 48%, 0.9);
}
.my-framework .pricing-table th.featured a:active, .my-framework .pricing-table td.featured a:active {
  background-color: hsla(351, 66%, 48%, 1);
}
.my-framework .pricing-table td.featured {
  color: hsla(351, 66%, 48%, 1);
  background-color: hsla(0, 0%, 100%, 1);
}

.my-framework .table.pricing .list .item {
  text-align: center;
  border: none;
}
.my-framework .table.pricing .list .item.header, .my-framework .table.pricing .list .item.footer {
  padding: 0;
}
.my-framework .table.pricing .list .item.header {
  background-color: transparent;
}
.my-framework .table.pricing .list .item.header .title {
  font-size: 200%;
  text-transform: uppercase;
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(215, 16%, 23%, 1);
  margin-right: 1px;
}
.my-framework .table.pricing .list .item.footer {
  background-color: transparent;
}
.my-framework .table.pricing .list .item.footer a {
  color: hsla(0, 0%, 100%, 0.75);
  background-color: hsla(215, 16%, 23%, 1);
  display: block;
  margin-right: 0;
  font-weight: 200;
}
.my-framework .table.pricing .list .item.footer a:hover {
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(215, 16%, 23%, 1);
}
.my-framework .table.pricing .list .item.footer a:active {
  color: hsla(0, 0%, 100%, 0.5);
  background-color: hsla(215, 16%, 23%, 1);
}
.my-framework .table.pricing .list .item .title {
  display: block;
  float: none;
  padding: 0.5em 1em;
}
.my-framework .table.pricing .list .item .title .icon {
  font-size: 150%;
  display: inline-block;
}
.my-framework .table.pricing .list .item .price {
  color: hsla(351, 66%, 48%, 1);
  font-size: 200%;
  display: block;
}
.my-framework .table.pricing .list.features {
  display: table-cell;
}
.my-framework .table.pricing .list.features .item {
  background-color: transparent;
}
.my-framework .table.pricing .list.features .item .title {
  padding-top: 0.72em;
  padding-bottom: 0.73em;
  background-color: transparent;
  color: hsla(172, 72%, 43%, 1);
}
.my-framework .table.pricing .list.features .item.header .title {
  padding-top: 0.5em;
  padding-bottom: 0.5em;
}
.my-framework .table.pricing .list.last .item.footer a, .my-framework .table.pricing .list:last-child .item.footer a {
  margin-right: 0;
}
.my-framework .table.pricing .list.last .item.header .title, .my-framework .table.pricing .list:last-child .item.header .title {
  margin-right: 0;
}
.my-framework .table.pricing .list:nth-child(even) .header .title {
  background-color: hsla(215, 16%, 23%, 1) !important;
}
.my-framework .table.pricing .list:nth-child(even) .footer a {
  background-color: hsla(215, 16%, 23%, 1);
}
.my-framework .table.pricing .list:nth-child(even) .footer a:hover {
  background-color: hsla(215, 16%, 23%, 0.9);
}
#myDocument .my-framework .table.pricing .list:nth-child(even) .footer a:active {
  background-color: hsla(215, 16%, 23%, 1);
}
.my-framework .table.pricing .list.featured {
  border: 0.25em solid hsla(0, 0%, 100%, 1);
  margin: -1em 0;
}
.my-framework .table.pricing .list.featured .item .title {
  color: hsla(351, 66%, 48%, 1);
  background-color: hsla(0, 0%, 100%, 1);
}
.my-framework .table.pricing .list.featured .header .title {
  color: hsla(0, 0%, 100%, 1);
  background-color: hsla(351, 66%, 48%, 1) !important;
}
.my-framework .table.pricing .list.featured .footer a {
  background-color: hsla(351, 66%, 48%, 1);
}
.my-framework .table.pricing .list.featured .footer a:hover {
  background-color: hsla(351, 66%, 48%, 0.9);
}
.my-framework .table.pricing .list.featured .footer a:active {
  background-color: hsla(351, 66%, 48%, 1);
}
.my-framework .table.pricing.featured-outside .list {
  opacity: 0.5;
  -moz-opacity: 0.5;
  -webkit-opacity: 0.5;
  filter: alpha(opacity=50);
  -ms-filter: "alpha(opacity=50)";
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
}
.my-framework .table.pricing.featured-outside .list:hover {
  margin: 1em -1em -1em;
  position: relative;
  z-index: 995;
  padding: 0.25em;
  font-size: 125%;
  background-color: hsla(0, 0%, 100%, 1);
  opacity: 1;
  -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "alpha(opacity=100)";
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.my-framework .table.pricing.featured-outside .list.features {
  margin: 0;
  padding: 0;
  font-size: 100%;
  background-color: transparent;
  transition: none;
  -moz-transition: none;
  -webkit-transition: none;
  opacity: 1;
  -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "alpha(opacity=100)";
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.my-framework .table.pricing .packages {
  display: table-cell;
  position: relative;
}

/* Spotlight */
.my-framework .spotlight {
  margin: 0;
  padding: 1em 0;
  text-align: center;
  background-color: hsla(215, 16%, 23%, 1);
  color: hsla(0, 0%, 100%, 1);
  border-bottom: 0.5em solid hsla(0, 0%, 100%, 0.15);
  box-shadow: inset 0 -0.5em 1.5em hsla(0, 0%, 0%, 0.85);
  -moz-box-shadow: inset 0 -0.5em 1.5em hsla(0, 0%, 0%, 0.85);
  -webkit-box-shadow: inset 0 -0.5em 1.5em hsla(0, 0%, 0%, 0.85);
  -o-box-shadow: inset 0 -0.5em 1.5em hsla(0, 0%, 0%, 0.85);
}

/*
   =========================================================================
*/
/*
   =========================================================================
*/
/* OTHERS */
/* CSS3 Special Classes */
.my-framework {
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  -o-box-shadow: none;
  text-shadow: none;
  -moz-text-shadow: none;
  -webkit-text-shadow: none;
  -o-text-shadow: none;
}
.my-framework.no-border-radius, .my-framework.no-border-radius * {
  border-radius: 0;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
}
.my-framework.no-box-shadow, .my-framework.no-box-shadow * {
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  -o-box-shadow: none;
}
.my-framework.no-transition, .my-framework.no-transition * {
  transition: none;
  -moz-transition: none;
  -webkit-transition: none;
}
.my-framework.no-text-shadow, .my-framework.no-text-shadow * {
  text-shadow: none;
  -moz-text-shadow: none;
  -webkit-text-shadow: none;
  -o-text-shadow: none;
}

/* Clearfixes */
/* Apply CSS3 Properties from Config to Delegated Elements */
.my-framework .button:before, .my-framework .button:after, .my-framework button:before, .my-framework button:after, .clearfix:before, .clearfix:after, p.description:before, p.description:after, .menu:before, .menu:after, .menu-list:before, .menu-list:after, .submenu:before, .submenu:after, .breadcrumb:before, .breadcrumb:after, .list:before, .list:after, .input-wrapper:before, .input-wrapper:after, .message:before, .message:after, .message-thin:before, .message-thin:after, .message-warning:before, .message-warning:after, .message-error:before, .message-error:after, .message-alert:before, .message-alert:after, .message-info:before, .message-info:after, .message-ok:before, .message-ok:after, .message-neutral:before, .message-neutral:after, .message-modal:before, .message-modal:after, .message-tooltip:before, .message-tooltip:after, .message-in-box:before, .message-in-box:after, .flyer:before, .flyer:after, .flyer > .content:before, .flyer > .content:after, .box > .content:before, .box > .content:after, .container:before, .container:after, table:before, table:after, .table:before, .table:after, .table .cols:before, .table .cols:after, .comment:before, .comment:after, .reveal:before, .reveal:after, .reveal aside:before, .reveal aside:after, .feedback:before, .feedback:after, .feedback-right:before, .feedback-right:after, .table.pricing .packages:before, .table.pricing .packages:after, .button-group:before, .button-group:after, .pagination:before, .pagination:after, aside.element:before, aside.element:after, .content > p:before, .content > p:after, .controls > .item:before, .controls > .item:after, .controls-horizontal > .item:before, .controls-horizontal > .item:after {
  content: " ";
  display: table;
}

.my-framework .button:after, .my-framework button:after, .clearfix:after, p.description:after, .menu:after, .menu-list:after, .submenu:after, .breadcrumb:after, .list:after, .input-wrapper:after, .message:after, .message-thin:after, .message-warning:after, .message-error:after, .message-alert:after, .message-info:after, .message-ok:after, .message-neutral:after, .message-modal:after, .message-tooltip:after, .message-in-box:after, .flyer:after, .flyer > .content:after, .box > .content:after, .container:after, table:after, .table:after, .table .cols:after, .comment:after, .reveal:after, .reveal aside:after, .feedback:after, .feedback-right:after, .table.pricing .packages:after, .button-group:after, .pagination:after, aside.element:after, .content > p:after, .controls > .item:after, .controls-horizontal > .item:after {
  clear: both;
}

.my-framework .button, .my-framework button, .clearfix, p.description, .menu, .menu-list, .submenu, .breadcrumb, .list, .input-wrapper, .message, .message-thin, .message-warning, .message-error, .message-alert, .message-info, .message-ok, .message-neutral, .message-modal, .message-tooltip, .message-in-box, .flyer, .flyer > .content, .box > .content, .container, table, .table, .table .cols, .comment, .reveal, .reveal aside, .feedback, .feedback-right, .table.pricing .packages, .button-group, .pagination, aside.element, .content > p, .controls > .item, .controls-horizontal > .item {
  *zoom: 1;
}

/* ELEMENTS WITH CSS3 PROPERTIES */
/* Text Shadow */
#myDocument .text-shadow {
  text-shadow: 0 0.1em 0 hsla(0, 0%, 100%, 0.2);
  -moz-text-shadow: 0 0.1em 0 hsla(0, 0%, 100%, 0.2);
  -webkit-text-shadow: 0 0.1em 0 hsla(0, 0%, 100%, 0.2);
  -o-text-shadow: 0 0.1em 0 hsla(0, 0%, 100%, 0.2);
}

#myDocument {
  text-shadow: 0 0.1em 0 hsla(0, 0%, 0%, 0.35);
  -moz-text-shadow: 0 0.1em 0 hsla(0, 0%, 0%, 0.35);
  -webkit-text-shadow: 0 0.1em 0 hsla(0, 0%, 0%, 0.35);
  -o-text-shadow: 0 0.1em 0 hsla(0, 0%, 0%, 0.35);
}

/* Box Shadow */
#myDocument .box-shadow, #myDocument .box, #myDocument .message, #myDocument .message-error, #myDocument .message-alert, #myDocument .message-warning, #myDocument .message-info, #myDocument .message-ok, #myDocument .message-neutral, #myDocument .comments, #myDocument .fixed, #myDocument .timeline .item .content, #myDocument .feedback .quote {
  box-shadow: 0 0.1666em 0 hsla(0, 0%, 0%, 0.1);
  -moz-box-shadow: 0 0.1666em 0 hsla(0, 0%, 0%, 0.1);
  -webkit-box-shadow: 0 0.1666em 0 hsla(0, 0%, 0%, 0.1);
  -o-box-shadow: 0 0.1666em 0 hsla(0, 0%, 0%, 0.1);
}

#myDocument .button, #myDocument button {
  box-shadow: inset 0 0 0.1em hsla(0, 0%, 100%, 0.5);
  -moz-box-shadow: inset 0 0 0.1em hsla(0, 0%, 100%, 0.5);
  -webkit-box-shadow: inset 0 0 0.1em hsla(0, 0%, 100%, 0.5);
  -o-box-shadow: inset 0 0 0.1em hsla(0, 0%, 100%, 0.5);
}

#myDocument uikit-dropdown .menu, #myDocument .select .list, #myDocument .uk-dropdown {
  box-shadow: 0.0833em 0.1666em 0 hsla(0, 0%, 0%, 0.1);
  -moz-box-shadow: 0.0833em 0.1666em 0 hsla(0, 0%, 0%, 0.1);
  -webkit-box-shadow: 0.0833em 0.1666em 0 hsla(0, 0%, 0%, 0.1);
  -o-box-shadow: 0.0833em 0.1666em 0 hsla(0, 0%, 0%, 0.1);
}

#myDocument {
  box-shadow: inset 0 0 0.1em hsla(0, 0%, 100%, 0.5), inset 0.075em 0 0 hsla(0, 0%, 0%, 0.25);
  -moz-box-shadow: inset 0 0 0.1em hsla(0, 0%, 100%, 0.5), inset 0.075em 0 0 hsla(0, 0%, 0%, 0.25);
  -webkit-box-shadow: inset 0 0 0.1em hsla(0, 0%, 100%, 0.5), inset 0.075em 0 0 hsla(0, 0%, 0%, 0.25);
  -o-box-shadow: inset 0 0 0.1em hsla(0, 0%, 100%, 0.5), inset 0.075em 0 0 hsla(0, 0%, 0%, 0.25);
}

#myDocument .input.text, #myDocument .input.editable:focus, #myDocument input[type='text'], textarea {
  box-shadow: inset 0 0.1666em 0 hsla(0, 0%, 0%, 0.025);
  -moz-box-shadow: inset 0 0.1666em 0 hsla(0, 0%, 0%, 0.025);
  -webkit-box-shadow: inset 0 0.1666em 0 hsla(0, 0%, 0%, 0.025);
  -o-box-shadow: inset 0 0.1666em 0 hsla(0, 0%, 0%, 0.025);
}

#myDocument {
  box-shadow: inset 0 0 0.5em hsla(0, 0%, 0%, 0.25);
  -moz-box-shadow: inset 0 0 0.5em hsla(0, 0%, 0%, 0.25);
  -webkit-box-shadow: inset 0 0 0.5em hsla(0, 0%, 0%, 0.25);
  -o-box-shadow: inset 0 0 0.5em hsla(0, 0%, 0%, 0.25);
}

#myDocument .button, #myDocument button {
  box-shadow: inset 0 -0.0833em 0 hsla(0, 0%, 100%, 0.1);
  -moz-box-shadow: inset 0 -0.0833em 0 hsla(0, 0%, 100%, 0.1);
  -webkit-box-shadow: inset 0 -0.0833em 0 hsla(0, 0%, 100%, 0.1);
  -o-box-shadow: inset 0 -0.0833em 0 hsla(0, 0%, 100%, 0.1);
}

/* Border Radius */
#myDocument .border-radius, #myDocument .border-radius .button, #myDocument .border-radius button, #myDocument .border-radius .quote, #myDocument .border-radius blockquote, #myDocument .border-radius .tag, #myDocument .border-radius .input.checkbox.custom + label, #myDocument .border-radius .input.text, #myDocument .border-radius input[type='text'], .border-radius textarea, #myDocument .border-radius .comments {
  border-radius: 0.25em;
  -moz-border-radius: 0.25em;
  -webkit-border-radius: 0.25em;
}

#myDocument .rounded {
  border-radius: 0.3333em;
  -moz-border-radius: 0.3333em;
  -webkit-border-radius: 0.3333em;
}

#myDocument .timeline .list .item .dot, #myDocument .round {
  border-radius: 1em;
  -moz-border-radius: 1em;
  -webkit-border-radius: 1em;
}

#myDocument .flyer.border-radius .action {
  border-radius: 0 0 0.5em 0.5em;
  -moz-border-radius: 0 0 0.5em 0.5em;
  -webkit-border-radius: 0 0 0.5em 0.5em;
}

/* Transition */
#myDocument body, #myDocument a, #myDocument .transition, #myDocument .featured-outside .list, #myDocument .moving, #myDocument .moving-left, #myDocument .moving-right {
  transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
}

#myDocument .moving, #myDocument .moving.right {
  transition: margin 0.1s linear;
  -moz-transition: margin 0.1s linear;
  -webkit-transition: margin 0.1s linear;
}

#myDocument .input.expanding {
  transition: width 0.2s linear;
  -moz-transition: width 0.2s linear;
  -webkit-transition: width 0.2s linear;
}

#myDocument .input.text, #myDocument .input.editable:focus, #myDocument input[type='text'], #myDocument textarea {
  transition: background-color 0.2s linear;
  -moz-transition: background-color 0.2s linear;
  -webkit-transition: background-color 0.2s linear;
}

#myDocument .button, #myDocument button {
  transition: none;
  -moz-transition: none;
  -webkit-transition: none;
}

/*
   =========================================================================
*/
/* ==========================================================================
   Boilerplate Helper classes
   ========================================================================== */
.ir {
  background-color: transparent;
  border: 0;
  overflow: hidden;
  *text-indent: -9999px;
}
.ir:before {
  content: "";
  display: block;
  width: 0;
  height: 150%;
}

.my-framework .hidden {
  display: none;
  visibility: hidden;
}

.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto;
}

.invisible {
  visibility: hidden;
}

/* ==========================================================================
   Boilerplate Print styles
   ========================================================================== */
@media print {
  * {
    background: transparent !important;
    color: hsla(0, 0%, 0%, 1) !important;
    /* Black prints faster: h5bp.com/s */
    box-shadow: none !important;
    text-shadow: none !important;
  }

  a,
  a:visited {
    text-decoration: underline;
  }

  a[href]:after {
    content: " (" attr(href) ")";
  }

  abbr[title]:after {
    content: " (" attr(title) ")";
  }

  /*
   * Don't show links for images, or javascript/internal links
   */
  .ir a:after,
  a[href^="javascript:"]:after,
  a[href^="#"]:after {
    content: "";
  }

  pre,
  blockquote {
    border: 1px solid hsla(0, 0%, 60%, 1);
    page-break-inside: avoid;
  }

  thead {
    display: table-header-group;
    /* h5bp.com/t */
  }

  tr,
  img {
    page-break-inside: avoid;
  }

  img {
    max-width: 100% !important;
  }

  @page {
    margin: 0.5cm;
  }
  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }

  h2,
  h3 {
    page-break-after: avoid;
  }
}

/*# sourceMappingURL=boilerplate.css.map */
