 /* ==========================================================================
   Main
   ========================================================================== */
/* Base */

.ic * {
    font-family: "Avenir Next", Arial, sans-serif;
}
[class^="icon-"] {
    font-family: FontAwesome;
}
.btn, .btn-small, .btn-huge, .btn-mini {
    font-family: "Avenir Next Medium", Arial, sans-serif;
}
@media screen {
    [class*="span"] {
        border: 0px solid rgba(0,0,0,0);
        margin-left: 2.85715%;
        margin-right: -3px; /* Necessary to get rid of inline whitespace */
        padding: 0;
        display: inline-block;
        vertical-align: top;
    }
    [class*="span"]:first-child {
        margin-left: 0;
    }
    .section-nav {
        margin-left: 0;
    }
}
.span1 { width: 5.714285714286%; }
.span2 { width: 14.28571%; }
.span3 { width: 22.85714%; }
.span4, .span_side { width: 31.42857%; }
.span5 { width: 40%; }
.span6 { width: 48.57142%; }
.span7 { width: 57.14285%; }
.span8, .span_main { width: 65.71428%; }
.span9 { width: 74.28571%; }
.span10 { width: 82.85714%; }
.span11 { width: 91.42857%; }
.span12 { margin-left: 0; width: 100%; }

.idea-home {
    overflow: auto;
    overflow-y:hidden;
    overflow-x:hidden;
}

input[type="text"],
textarea[type="text"] {
    padding: 0.25em;
    border: 1px solid #75787B; /* Gray */
    -webkit-border-radius: 0;
       -moz-border-radius: 0;
            border-radius: 0;
    margin: 0;
    vertical-align: top;
}

.selectize-input.input-active,
input:focus,
input.focus,
textarea:focus,
textarea.focus {
    border: 1px solid #0072CE; /* Pacific */
    border-radius: 0;
    outline: 1px solid #0072CE; /* Pacific */
    outline-offset: 0;
    -webkit-box-shadow: none;
            box-shadow: none;
}

.selectize-control.input-error .selectize-input,
input.input-error,
textarea.input-error {
    border: 1px solid #D12124; /* Red Orange */
    outline: 1px solid #D12124; /* Red Orange */
}

input.populated,
textarea.populated {
    color: #888;
}

/* Improve readability when focused and hovered in all browsers: h5bp.com/h */
.ic a:hover,
.ic a:active {
    outline: 0;
}

/* Header */
.project-header .row {
    margin-bottom: 1.5em;
}
.project-header .row p {
    margin: 0;
}
.logo a,
.logo a:hover {
    text-decoration: none;
}

.project-header .info {
    margin-top: 20px;
    margin-bottom: 10px;
    font: 100%/1.375 Georgia, "Times New Roman", serif; /* 16px font size */
}
.project-title {
    margin-top: 0;
    position: relative;
}
.project-title a {
    color: #0072CE;
    border-bottom: 1px dotted;
    line-height: 1em;
    display: inline-block;
    margin-left: 1em;
}

.project-title a:hover,
.project-title a:focus,
.project-title a:active {
    border-bottom-style: solid;
}
.project-title a:before{
    content: " Back to ";
    right: 100%;
}
.project-title:before {
    font-family: FontAwesome, "Avenir Next Medium", Arial, sans-serif;
    content: "\f053";
    position: absolute;
    border: none;
    color: #0072CE;
}

.project-add-idea {
    margin-bottom: 2.5em;
}
.project-description {
    color: #000;
    font-size: 187.5%; /* 30px */
    font-weight: 600;
    line-height: 0.88;
    margin-bottom: 0.5em;
}
.project-prompt {
    color: #999;
    font-size: 100%; /* 16px */
    font-weight: bold;
    margin-top: 0.5em;
    text-align: left;
    text-transform: uppercase;
}

/*
    Right and Left Chevron classes with appropriate underlines
*/
.chevron-right {
    position: relative;
}
.chevron-right:after {
        font-family: FontAwesome, "Avenir Next Medium", Arial, sans-serif;
        content: "\f054";
        position: absolute;
        left: 100%;
        top: 0;
        margin-left: .15em;
        border-bottom: none;
}
.chevron-left {
    position: relative;
}
.chevron-left:before {
        font-family: FontAwesome, "Avenir Next Medium", Arial, sans-serif;
        content: "\f053";
        position: absolute;
        right: 100%;
        top: 0;
        margin-right: .15em;
        border-bottom: none;
}

.search-form input[type="text"],
.search-form textarea {
    height: 2em;
    width: 80%;
}
/* Navigation */
h2.section a {
    font-family: "Avenir Next Demi", Arial, sans-serif;
    text-transform: none;
    font-weight: normal;
}
ul.section-nav {
    border-bottom: 1px solid #000;
    padding-left: 0;
    margin-top: 0;
    margin-bottom: 0;
    list-style: none;
    overflow: auto;
    overflow-y:hidden;
    overflow-x:hidden;
}
ul.section-nav li {
    display: inline-block;
    margin-right: 0.5em;
    border-bottom-width: 0;
}
ul.section-nav li a {
    display: inline-block;
    padding: 0.625em 1em 0.5em;
    background: #e4e2e0;
    color: #000;
    font-family: "Avenir Next Demi", Arial, sans-serif;
    font-size: 0.875em;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-decoration: none;
    border-bottom-width: 0;
}

ul.section-nav li a:hover,
ul.section-nav li a:focus {
    background: #bcb6b2;
}
ul.section-nav li.active a {
    background: #2cb34a;
    color: #FFF;
}

/* Content */
.idea-entry {
    border-top: 1px solid #000;
    padding: 20px 20px 20px 0;
}
.idea-entry:first-child {
    border-top: 0;
}
.no-results {
    padding: 2.5em 0;
}
.idea-single .idea-votes {
    width: 6.9%; /* 72 px */
    text-align: center;
}
.idea-entry .idea-votes {
    text-align: center;
}
.idea-votes .count {
    font-size: 2.125em;
    line-height: 0.3;
    padding-top: 0.475em;
    vertical-align: none;
}
.idea-votes .phrase {
    font-size: .875em;
    display: block;
    font-family: "Avenir Next Demi", Arial, sans-serif;
    padding-top: 1em;
    text-transform: uppercase;
}
.idea-votes .action {
    margin-top: .75em;
}
.idea-title {
    padding-right: 1.875em;
}
.idea-banner {
    font-size: 1.125em;
    display: inline-block;
    font-family: 'Avenir Next Medium', Arial, sans-serif;
}
.idea-banner a {
    font-family: 'Avenir Next Medium', Arial, sans-serif;
}
.idea-description {
    font-family: Georgia, "Times New Roman", serif;
    margin: 1em 0;
}
.idea-footer {
    font-size: 16px;
}
.idea-info .suggested {
    color: #63666a;
    margin-left: .5em;
}
.idea-info .commented {
    color: #63666a;
    margin-right: .5em;
}

/* Comments */
.comments {
    position: relative;
}
.comments h4 {
    font-size: 100%;
    font-family: "Avenir Next Demi", Arial, sans-serif;
    line-height: 1.66;
    min-height: 1.75em;
    text-transform: uppercase;
}
.comment-meta {
    font-size: 16px;
}
.comment-form {
    padding: 0 0 2.8em;
    margin: 1.5625em 0 0;
}
.comment-form textarea {
    height: 6.25em;
    margin-bottom: 0.5em;
    width: 99%;
}
.comment-form form {
    position: relative;
}
.comment-form .comment-label {
    color: #666;
    position: absolute;
    left: .25em;
}
.comment-form #id_is_anonymous {
    vertical-align: middle;
}
.comment-list {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
.single-idea-entry {
    width: 90%; /* slightly smaller than span11 due to wide idea-votes */
}
.single-idea-entry .body {
    margin-top: 1.5em;
}
.single-idea-entry .idea-entry-content h4 {
    font-family: "Avenir Next Medium", Arial, sans-serif;
}
.single-idea-entry .idea-entry-content .detail {
    margin-top: 1.5em;
}
.single-idea-entry .idea-entry-content p {
    margin-top: .5em;
}
.single-idea-entry .idea-entry-content .edit-separator {
    padding: 0em .5em;
}
.comment-date {
    color: #666;
    font-weight: normal;
}
.comment {
    padding: 1em 0 1em;
    border-bottom: 1px solid #ccc;
}

.comment .comment {
    padding: .5em 0 .5em;
    margin-left: 2.5em;
    border-top: 1px solid #ccc;
    border-bottom: 0;
}

/* Sidebar */

.sidebar ul {
    list-style-type: square;
    padding-left: 1.5em;
}
.ic-add-tags,
.sidebar-nav {
    margin-bottom: 2.5em;
}
.challenge-banner {
    margin: 1.25em 0;
    background-color: #DBEDD4;
    padding: 1.25em;
}
.sidebar a,
#challenge-link a {
    border-bottom-width: 1px;
}

#date-range {
    margin-top: 20px;
}
.challenge-banner #challenge-link {
    margin-top: 1.5em;
    margin-bottom: 0;
}

.banners {
    margin-bottom: 1.25em;
}
.banners .challenge {
    margin: .5em 0;
}
.challenge_view_all a{
    position:relative;
}
.challenge_view_all a:after {
    content: "\f054";
    font-family: FontAwesome, "Avenir Next", Arial, sans-serif;
    margin-left: .25em;
    border: none;
    position: absolute;
    left: 100%;
    top:0;
}
.list_current_challenges {
     padding-top: 1.5em;
}
.list_past_challenges {
     padding-top: 2.5em;
}
.list_current_challenges .current_banners ul {
    list-style: none;
    padding-left: 0;
}
.list_past_challenges .past_banners ul {
    list-style: none;
    padding-left: 0;
}
.current_banner_list_item {
    padding-bottom: 1.0em;
}
.past_banner_list_item {
    padding-bottom:1.0em;
}
.voters {
    margin-bottom: 2.5em;
}
.tags .tag {
    display: block;
    margin: 0 0.5em 0.75em -0.5em;
}
.tags .tag:before {
    position: relative;
    left: -0.75em;
}
.tags .tag a {
    font-family: "Avenir Next Demi", Arial, sans-serif;
}
.sidebar .tags form input[type="text"] {
    width: 11em;
}
.ic-add-tags .help-text {
    font-size: 87.5%;
} .sidebar-nav a {
    font-size: 87.5%; /* 14px */
}

/* Add View */
.project-add {
    margin: 1.5em 0 0;
}
.project-add form > div {
    margin: 1em 0;
    position: relative;
}
.project-add form textarea {
    height: 5.25em;
    max-width: 48.57142%;
    padding-bottom: 1.25em;
}
.project-add form textarea#id_text {
    height: 8.25em;
}
.project-add label {
    display: block;
    position: relative;
}
.project-add input#id_title,
.project-add select#id_banner,
.project-add textarea#id_text,
.project-add textarea#id_summary,
.project-add input#id_tags,
.selectize-control {
    width: 48.57142%;
    display: block;
    margin: 0;
}
.project-add .textAreaCountMessage {
    width: 48.57142%;
    position: relative;
}
.project-add span[id$="textcount"] {
    font-style: italic;
    background-color: #FFF;
    line-height: 1em;
    font-size: 0.875em;
    position: absolute;
    bottom: 2px;
    right: 0.75em;
    margin-right: .25em;
    text-align: right;
}
.project-add .banner {
    margin-top: 0;
}
.project-add .challenge-checkbox {
    margin-bottom: 0;
    margin-right: .5em;
}
.project-add .is_anonymous {
    padding-bottom: 1em;
}
.project-add .is_anonymous label,
.project-add .challenge-checkbox label {
    display: inline-block;
    vertical-align: middle;
}
.project-add .is_anonymous input,
.project-add .challenge-checkbox input {
    display: inline-block;
    vertical-align: middle;
}
.project-add select#id_banner {
    visibility: hidden;
}
.project-add select#id_banner.active {
    visibility: visible;
}
.form-field-footer {
    position: relative;
}
.project-add .help_text {
    margin: 0;
    font-style: italic;
    width: 48.57142%;
    font-size: 0.875em;
    visibility: hidden;
    display: block;
}
.errorlist {
    list-style: none;
    padding: 0;
}
.errorlist li {
    position: absolute;
    top: 0;
    left: 2px;
    margin: 0;
    padding: 0;
}
.project-add span#submit-buttons {
    display: block;
    margin-top: 1.375em;
}
.project-add span#submit-buttons input {
    vertical-align: middle;
}
.project-add #add-idea-btn,
.project-add .secondary-action {
    margin-top: 1.625em;
    margin-bottom: 2em;
}
.idea-hero {
    margin: 0 0 0 0;
}
.main-content a {
    border-bottom-width: 1px;
}

/* Single View */
.challenge-info p.challenge-entry-content,
.single-idea-entry .idea-entry-content p {
    font: 100%/1.375 Georgia, "Times New Roman", serif; /* 16px font size */
}

.challenge-info  p.challenge-entry-content {
    margin: .5em 0;
}
.idea-add,
.idea-single,
.idea-banner-single {
    padding-top: 1.5em;
}
.idea-single .main-content {
    padding-top: 1.5em;
}
.idea-single .comments {
    border-top: 3px solid #f2f2f2;
    margin-top: 2.5em;
    padding-top: 1.5625em;
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

/* Style help */
.border-bottom {
    border-bottom: 3px solid #000;
}
#work_tag_submit_btn {
    margin-top: .5em;
}

.btn-voted {
    color: #75787B;
    background-color: #E3E4E5;
    cursor: default;
}
.btn-voted:focus{
    outline: none;

}

input.btn-voted:hover {
    background-color: #919395;
    color: #fff;
    cursor: default;
}

input.btn-voted:active, input.btn-voted:focus {
    background-color: #75787b;
    color: #fff;
    cursor: default;
    outline-width: 0;
}

input.btn,
input.btn:link,
input.btn:visited {
  display: inline-block;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0.64285714em 1em;
  border: 0;
  border-radius: 0.28571429em;
  margin: 0;
  vertical-align: middle;
  font-family: "Avenir Next Medium", Arial, sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 0.875em;
  line-height: normal;
  text-decoration: none;
  cursor: pointer;
  -webkit-transition: .1s;
  transition: .1s;
  -webkit-appearance: none;
}
.lt-ie9 .btn,
.lt-ie9 .btn:link,
.lt-ie9 .btn:visited {
  font-weight: normal !important;
}


.idea-add .alert {
    color: #d14124;
    display: block;
    margin-top: 1.6em;
    text-align: center;
    text-transform: uppercase;
}
.idea-add a .alert {
    color: #d14124;
    text-decoration: none;
}
.idea-add a:hover .alert,
.idea-add a:focus .alert {
    border-color: #d14124 !important;
}
.idea-add .alert .down {
    background: url(../img/alert-arrow.png) 0 50% no-repeat;
    height: 22px;
    padding: 0.6875em;
    width: 22px;
}
.idea-add .alert-none {
    background-color: #f2f2f2;
    border: 3px solid #999;
    box-sizing: border-box;
    color: #999;
    display: block;
    margin: 1.25em 0;
    padding: 0.5em 1em ;
    text-align: center;
    text-transform: uppercase;
}
.idea-add .alert-none .down {
    background: url(../img/alert-check.png) 0 50% no-repeat;
    height: 22px;
    padding: 0.6875em;
    width: 22px;
}
.idea-add .alert .alert-content,
.idea-add .alert-none p {
     display: block;
     margin-bottom: 0.25em;
}
.result-number {
    font-weight: bold;
}

/* Profile Styles */
.profile_images a {
        display: inline-block;
        max-width: 125px;
        margin: 0 5px 10px 0;
        color: #000;
        font-family: "Avenir Next", Arial, sans-serif;
        font-size: 1em;
        line-height: 1.25;
        text-decoration: none;
        vertical-align: top;
        border:none;
}
.profile_images img {
        margin: 0 5px 10px 0;
        display: block;
        width: 125px;
        margin-bottom: 5px;
}
.profile_images a:hover {
    color: #0072CE;
}


 /* Image replacement */
.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}
.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

.add-summary {
    margin-top: 2em;
    width: 65.71428%;
}
.add-summary #submit-buttons {
    margin: 2em 0;
    text-align: center;
}
.add-summary #submit-buttons a {
    margin-right: 8em;
}

.summary-text {
    margin: 1em 0;
}
.summary-section {
    padding: 1em 0;
}
.summary-section-header {
    font-family: "Avenir Next Medium", Arial, sans-serif;
}
.summary-section-body {
    margin-top: 0.5em;
}

/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden {
    display: none !important;
    visibility: hidden;
}

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/* Hide visually and from screenreaders, but maintain layout */
.invisible {
    visibility: hidden;
}

.challenge-info {
    border-bottom: 1px solid #000;
    padding: 0;
    padding-bottom: 20px;
}
.challenge-info #start {
    margin-right: 2.5em;
}

section.main-content hr {
    background-color: #000;
    height: 3px;
    border: 0;
    padding: 0;
}

.idea-votes .btn-vote,
.idea-votes .btn-voted,
.idea-votes .btn-voted:hover,
.idea-votes .btn-voted:active,
.idea-votes .btn-voted:focus {
    padding: 0.71428571428571em 0;
    width: 4em;
    font-size: 16px;
    outline: none;
}

/* Selectize */
.selectize-input {
    border: 1px solid #919395;
    -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.15);
    -moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.15);
    box-shadow: inset 0 1px 3px rgba(0,0,0,0.15);
    -webkit-transition: border linear .2s,box-shadow linear .2s;
    -moz-transition: border linear .2s,box-shadow linear .2s;
    -ms-transition: border linear .2s,box-shadow linear .2s;
    -o-transition: border linear .2s,box-shadow linear .2s;
    transition: border linear .2s,box-shadow linear .2s;
    border-radius: 0;
    display: block;
}
.multi.selectize-control .selectize-input [data-value] {
    background: #FFCE8D;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: none;
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    text-shadow: none;
    color: #000;
    filter: none;
    font-size: 14px;
}
.selectize-input input[type="text"],
.selectize-control textarea {
    vertical-align: middle;
    font-size: 14px;
}
.selectize-control div.option span,
.selectize-control div.create span {
    margin-left: 0;
    display: inline;
}

/* Pagination */

.pagination {
    border: solid #75787b;
    border-width: 1px 0;
    margin: 20px 0;
}

.pagination ul {
    display: block;
    padding-left: 0;
    margin: 0;
    overflow: auto;
}

.pagination [class^="icon-"] {
    font-size: 0.625em;
}

.pagination ul > li {
    display: inline;
}

.pagination ul > li > a,
.pagination ul > li > span {
    padding: 4px 8px;
    float: left;
    color: #75787b;
    line-height: 20px;
    text-decoration: none;
    border-bottom-width: 0;
}

.pagination ul > li > a:hover,
.pagination ul > li > a:focus,
.pagination ul > li > a:hover > i,
.pagination ul > li > a:focus > i,
.pagination ul > .active > a,
.pagination ul > .active > span {
    color: #101820;
}

.pagination ul > .active > a,
.pagination ul > .active > span {
    font-family: "Avenir Next Demi", Arial, sans-serif;
    font-weight: bold;
    cursor: default;
}

.pagination ul > .disabled > span,
