@import “bourbon/bourbon”; @import “base/base”; @import “neat/neat”;

body {

margin: 0;

}

nav.Webrake {

background-color: $blue;
padding: 1.5em 2em 1.5em 1em;

h1 {
  float: right;
  font-size: 1em;
  margin-bottom: 0;
  color: $light-gray;

  a {
    color: $light-blue;
  }
}

&::after {
  content: "";
  display: table;
  clear: both;
}

}

h2.Introduction {

font-size: 1.5em;

}

section.Container {

@include outer-container;

margin: 2em 0;

}

div.Wrapper {

@include span-columns(8);
@include shift(2);

}

.Task {

@include outer-container;

margin-bottom: 1em;

}

.Task:nth-child(even) {

background-color: $light-blue;

}

.Task_header {

@include fill-parent();
@include row(table);

}

.Task_name {

@include span-columns(4);
@include pad();

}

.Task_description {

@include span-columns(8);
@include reset-display;
@include pad();

}

.Task_actions {

fieldset {
  legend {
    font-size: 1.6em;
  }

  .Task_action-input {
    font-size: 1.5em;
  }
}

}

.Task_actions-button {

@include span-columns(12);
@include reset-display;
@include pad();

}

.Task_output {

overflow: scroll;
border-radius: 5px;
background-color: $dark-gray;
padding: 1em 2em;
color: $light-blue;

xmp {
  margin: 0;
  padding: 0;
  line-height: 0;
}

}

.Task_output-contentError {

color: $red;

}