/*
Copyright (c) 2011, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.com/yui/license.html
version: 2.9.0
*/
html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,select,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,button,caption,cite,code,dfn,em,input,optgroup,option,select,strong,textarea,th,var{font:inherit}del,ins{text-decoration:none}li{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:baseline}sub{vertical-align:baseline}legend{color:#000}
/* End YUI CSS Reset */

*, *:before, *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

/* Custom Fonts */
@font-face {
    font-family: 'glober';
    src: url('/public/shared/fonts/fontfabric_-_globerregular-webfont.eot');
    src: url('/public/shared/fonts/fontfabric_-_globerregular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/public/shared/fonts/fontfabric_-_globerregular-webfont.woff') format('woff'),
         url('/public/shared/fonts/fontfabric_-_globerregular-webfont.ttf') format('truetype'),
         url('/public/shared/fonts/fontfabric_-_globerregular-webfont.svg#glober') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'glober';
    src: url('/public/shared/fonts/fontfabric_-_globerbold-webfont.eot');
    src: url('/public/shared/fonts/fontfabric_-_globerbold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/public/shared/fonts/fontfabric_-_globerbold-webfont.woff') format('woff'),
         url('/public/shared/fonts/fontfabric_-_globerbold-webfont.ttf') format('truetype'),
         url('/public/shared/fonts/fontfabric_-_globerbold-webfont.svg#glober') format('svg');
    font-weight: bold;
    font-style: normal;
}


html, body { height: 100%; }

body { font-family: 'glober'; }

p { margin-bottom: 1em; }

strong { font-weight: bold; }

hr { clear: both; height: 1px; margin: .5em 0; border: none; background: #CCC; }

.clear { clear: both; }

.hide { position: absolute; left: -9999px; }

h2 { font-size: 2em; font-weight: bold; padding: .5em 0; }

h3 { font-size: 1.3em; font-weight: bold; margin-bottom: .75em; }

h4 { font-size: 1.1em; font-weight: bold; margin-bottom: .75em; }

.imageFloatRight { float: right; }

.ui-datepicker select { padding: .5em; }
.ui-dialog { z-index: 10000; box-shadow: 0 .5em .5em -.5em rgba(0,0,0,0.7); }

.personNameLink { font-weight: bold; font-size: 1.2em; color: #663399; }
.personNameLink:hover { cursor: pointer; }

/* Containers */
.mainContainer { position: relative; max-width: 75em; min-width: 20em; padding: 4em 2.5em 0 2.5em; margin: 0 auto 10em auto; z-index: 1000; }

.column { float: left; width: 32%; margin-right: 1%; }

.column50 { float: left; width: 48%; margin-right: 1%; }

/* Bottom-pad the last element in an editable list to keep it from being covered by any button__popout element placed at the bottom of the page */
.column50 .showLinkHover:last-of-type { padding-bottom: 9em; }

.columnNew50 { float: left; width: 48%; margin-right: 1%; padding-bottom: 6em;}

.boxedContent, .searchResultSection {
  margin: 1em 0;
  padding: 1em;
  border: solid .1em #CCC;
  box-shadow: 0 .3em .3em -.3em rgba(0,0,0,0.5);
}
.searchResultSection:hover { cursor: pointer }

.div__scroll {
  height: 10%;
  padding-right: 1em;
  overflow-y: scroll;
}
.div__scroll--height { height: 400px; }

/* Form */
.errorMessage {
  display: block;
  width: 80%;
  margin: .5em 0;
  padding: .5em;
  border: solid .1em red;
}
.successMessage {
  display: block;
  width: 80%;
  margin: .5em 0;
  padding: .5em;
  border: solid .1em green;
}
.warnMessage {
  display: block;
  width: 80%;
  margin: .5em 0;
  padding: .5em;
  border: solid .1em orange;
}
.infoMessage {
  display: block;
  width: 80%;
  margin: .5em 0;
  padding: .5em;
  border: solid .1em #4B79CD;
}

form { margin-bottom: 2em; padding-top: 2em; font-size: 1.1em; }
form.noPad { padding-top: 0; }

label {
  position: absolute;
  top: -1em;
  left: .25em;
  padding: .25em .5em;
  background-color: #FFF;
  font-size: .8em;
  -webkit-transition: top 250ms;
  -moz-transition: top 250ms;
  transition: top 250ms;
}

label.focusedLabel {
  background-color: #34973C;
  border: solid .1em #000;
  color: #FFF;
  top: -1.25em;
}

form p { clear: both; position: relative; margin-bottom: 1.5em; }

input[type=text], input[type=password] {
  padding: .5em 1em;
  border: solid .1em #CCC;
  font-weight: normal;
  width: 80%;
  outline: none;
}

input[type=text]:focus, input[type=password]:focus, select:focus { outline: solid .1em #34973C; }

textarea { margin-bottom: 1em; padding: 1em; width: 80%; }

.normalSubmitButton, button { padding: .5em; margin: .5em 0; }

select { padding: .5em 1em; width: 80%; border: solid .1em #CCC; outline: none; }

input[type=checkbox] { float: left; margin-top: .1em; }

.checkboxQuestion { padding-bottom: 1em; }

.checkboxQuestionFloat { float: left; padding: 0 .5em; }
.checkboxQuestionFloat input { display: block; margin-top: .4em; }
.checkboxQuestionFloat label {
  position: relative;
  width: auto;
  top: 0;
  left: 0;
  padding: 0 0 0 .3em;
  background: none;
}

.checkboxList { clear: both; margin-bottom: .5em; }

.checkboxListClickable label:hover { background: #EBEBEB; cursor: pointer; }

.checkboxQuestion label, .checkboxList label {
  display: block;
  float: left;
  position: relative;
  top: 0;
  left: 0;
  width: 95%;
  padding: 0 0 0 .5em;
  background-color: inherit;
  border: none;
  color: #000;
}

.visualSave {
  position: fixed;
  left: 0;
  bottom: -3em;
  width: 100%;
  height: 3em;
  line-height: 3em;
  margin-top: 3em;
  outline: none;
  border: none;
  color: #FFF;
  font-weight: bold;
  font-size: 1.5em;
  background-color: #34973C;
  background: -moz-linear-gradient(top, #6bce29 0%, #34973c 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6bce29), color-stop(100%,#34973c)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #6bce29 0%,#34973c 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #6bce29 0%,#34973c 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #6bce29 0%,#34973c 100%); /* IE10+ */
background: linear-gradient(to bottom, #6bce29 0%,#34973c 100%); /* W3C */
  cursor: pointer;
  box-shadow: 0 -.5em .5em -.5em rgba(0,0,0,0.3);
  -webkit-transition: all 1s;
  -moz-transition: all 1s;
  transition: all 1s;
}

/* Multi select */
.multiSelectSection { margin: 1em 0; }

.multiSelectArea { float: left; width: 40%; margin: 0 1% 1em 0; }
.multiSelectAreaVertical { width: 100%; }

.multiSelectArea form, .multiSelectAreaVertical form { margin: 0; padding: 0; }

.multiSelectArea select { width: 100%; }
.multiSelectAreaVertical select { width: 88%; }

.multiSelectArea input[type=submit], .multiSelectAreaVertical input[type=submit] { margin-top: 1em; }

.multiSelectButtons { float: left; width: 5%; margin: 3em 1% 0 0; }
.multiSelectButtonsVertical { width: 300px; margin: 2em auto; font-size: 1.2em; }
.multiSelectButtonsVertical #func_allRight { margin-right: 2em; }

.multiSelectButtons input { padding: .25em; margin-bottom: 1em; }
.multiSelectButtonsVertical input { padding: .25em; }

/* Button Popout */
.button__popout {
  position: fixed;
  bottom: -105px;
  width: 100%;
  height: 100px;
  background: #F7F7F7;
  border-top: solid 1px #CCC;
  text-align: center;
  box-shadow: 0 -.5em .5em -.5em rgba(0,0,0,0.7);
  transition: all 1s;
  z-index: 1000;
}

.button__popout .column50 { text-align: center; }

.button__popout input { margin: 27px 1em 0 0; }

.button__popout--show { bottom: 0; }
.button__popout--flipArrow:after { transform: rotate(45deg) !important; }

.button__popout--interact {
  position: absolute;
  left: 46%;
  display: block;
  width: 100px;
  height: 50px;
  margin-top: -50px;
  background: #F7F7F7;
  border-top: solid 1px #CCC;
  border-right: solid 1px #CCC;
  border-left: solid 1px #CCC;
}

.button__popout--interact:after {
  content: "";
  display: block;
  position: absolute;
  width: 16px;
  height: 16px;
  border-right: solid 3px #333;
  border-bottom: solid 3px #333;
  box-shadow: 0 .5em .5em -.5em rgba(0,0,0,0.8), .5em 0 .5em -.5em rgba(0,0,0,0.8);
  top: 17px;
  left: 42px;
  z-index: 1001;
  transform: rotate(225deg);
  transition: all 1s;
}

/* Button */
.contentButton { margin: 2em 0; }

.contentButton a {
  width: auto;
  padding: .5em 1em;
  color: #000;
  text-decoration: none;
  text-align: center;
  font-weight: bold;
  border-radius: 10px;
  background: #f2f2f2; /* Old browsers */
background: -moz-linear-gradient(top, #f2f2f2 0%, #acaeb3 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f2f2), color-stop(100%,#acaeb3)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #f2f2f2 0%,#acaeb3 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #f2f2f2 0%,#acaeb3 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #f2f2f2 0%,#acaeb3 100%); /* IE10+ */
background: linear-gradient(to bottom, #f2f2f2 0%,#acaeb3 100%); /* W3C */
}

.contentButton a:hover { border: solid .1em #262626; }

/* Show Links */
.showLinkHover { display: block; position: relative; overflow: hidden; }

.showLinkHover a { display: block; text-decoration: none; color: #000; }

.showLinkProgram {
  display: block;
  float: left;
  width: 90%;
  padding: .5em 3em .5em .5em;
  -webkit-transition: background .5s;
  -moz-transition: background .5s;
  transition: background .5s;
}

.hiddenLinks {
  position: absolute;
  top: .5em;
  right: 0;
  z-index: 1001;
  -webkit-transition: opacity .75s;
  -moz-transition: opacity .75s;
  transition: opacity .75s;
}

.hiddenLinks a { display: inline; float: left; margin-right: .5em; }

.icon--complete { background-image: url('/public/images/green_check.png'); background-position: 0 50%; background-repeat: no-repeat; margin-left: 2%; padding-left: 4%; }
.icon--incomplete { background-image: url('/public/images/red_x.png'); background-position: 0 50%; background-repeat: no-repeat; margin-left: 2%; padding-left: 4%; }

/* Lists */
ul.disc { margin: 1em 0 1em 2em; }
.disc li { list-style: disc; margin-bottom: .25em; }

.email--click {
  display: block;
  margin: .5em 0;
  padding: .5em;
  color: #000;
  border: solid 1px #CCC;
  font-size: 1.2em;
  text-decoration: none;
  transition: all 500ms;
}
.email--click:hover, .email--click--hover { background: #F7F7F7; }

/* Pages */
.pageNav {
  position: relative;
  width: 33%;
  margin: 0 auto;
  text-align: center;
}

.pageNav input { position: absolute; top: 0; }

.pageNav select { width: auto; }

.pageNavLeft { left: 0; }

.pageNavRight { right: 0; }

/* Header */
header {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 3.4375em;
  background: #e5e8eb;
  z-index: 1001;
  box-shadow: 0 0 .5em rgba(0,0,0,0.5);
}

.headerStrip {
  display: block;
  float: left;
  width: 0.625em;
  height: 3.4375em;
  margin-right: 2em;
}

.breadcrumb { float: left; font-weight: bold; }

.breadcrumb ul { height: 55px; }

.breadcrumb li {
  float: left;
  height: 55px;
  line-height: 55px;
  padding-right: 1em;
  margin-right: .5em;
  background-repeat: no-repeat;
  background-position: 100% 50%;
}

.breadcrumb a { text-decoration: none; color: #000; -webkit-transition: color .5s; -moz-transition: color .5s; transition: color .5s; }

.homeIcon {
  display: block;
  width: 1.1875em;
  height: 0.9375em;
  margin-top: 1.2em;
  background-repeat: no-repeat;
}

.userInfo { float: right; height: 19px; margin: 1em 2em 0 2em; }

.userInfo a { color: #000; text-decoration: none; -webkit-transition: color .5s; -moz-transition: color .5s; transition: color .5s; }

.userInfoNameLink {
  float: left;
  background: url('/public/images/profile_icon.png') 0% 50% no-repeat;
   margin-right: 1em;
   padding-left: 1.5em;
}

.userInfoLogout { float: left; }

.userInfoLogout a {
  float: left;
  background-image: url(/public/images/logout_icon.png);
  background-position: 0% 50%;
  background-repeat: no-repeat;
  background-size: 16px 16px;
  padding-left: 1.25em;
}

.headerImage { float: right; padding: 1em; }

/* Autocomplete */
.ui-helper-hidden-accessible { position: absolute; left: -9999px; }
.ui-autocomplete { z-index: 1002; box-shadow: .2em .4em .4em rgba(0,0,0,0.2); }

/* Header Colors */
#color1 .headerStrip { background: #663399; }
#color1 .homeIcon { background-image: url('/public/images/home_purple.png'); }
#color1 .breadcrumb a:hover, #color1 .userInfo a:hover { color: #663399; }
#color1 .breadcrumb li { background-image: url('/public/images/arrow_purple.png'); }
#color1 .breadcrumb li:last-child { background-image: none; }
#color1 input[type=text]:focus, select:focus { outline: solid .1em #663399; }
#color1 label.focusedLabel { background-color: #663399; }
#color1 .ui-state-focus { background: #663399; color: #FFF; }

#color2 .headerStrip { background: #363F4B; }
#color2 .homeIcon { background-image: url('/public/images/home_grey_blue.png'); }
#color2 .breadcrumb a:hover, #color1 .userInfo a:hover { color: #363F4B; }
#color2 .breadcrumb li { background-image: url('/public/images/arrow_grey_blue.png'); }
#color2 .breadcrumb li:last-child { background-image: none; }
#color2 input[type=text]:focus, select:focus { outline: solid .1em #363F4B; }
#color2 label.focusedLabel { background-color: #363F4B; }
#color2 .ui-state-focus { background: #363F4B; color: #FFF; }

#color3 .headerStrip { background: #47B369; }
#color3 .homeIcon { background-image: url('/public/images/home_teal.png'); }
#color3 .breadcrumb a:hover, #color1 .userInfo a:hover { color: #47B369; }
#color3 .breadcrumb li { background-image: url('/public/images/arrow_teal.png'); }
#color3 .breadcrumb li:last-child { background-image: none; }
#color3 input[type=text]:focus, select:focus { outline: solid .1em #47B369; }
#color3 label.focusedLabel { background-color: #47B369; }
#color3 .ui-state-focus { background: #47B369; color: #FFF; }

#color4 .headerStrip { background: #4B79CD; }
#color4 .homeIcon { background-image: url('/public/images/home_blue.png'); }
#color4 .breadcrumb a:hover, #color1 .userInfo a:hover { color: #4B79CD; }
#color4 .breadcrumb li { background-image: url('/public/images/arrow_blue.png'); }
#color4 .breadcrumb li:last-child { background-image: none; }
#color4 input[type=text]:focus, select:focus { outline: solid .1em #4B79CD; }
#color4 label.focusedLabel { background-color: #4B79CD; }
#color4 .ui-state-focus { background: #4B79CD; color: #FFF; }

#color5 .headerStrip { background: #BD6443; }
#color5 .homeIcon { background-image: url('/public/images/home_brick.png'); }
#color5 .breadcrumb a:hover, #color1 .userInfo a:hover { color: #BD6443; }
#color5 .breadcrumb li { background-image: url('/public/images/arrow_brick.png'); }
#color5 .breadcrumb li:last-child { background-image: none; }
#color5 input[type=text]:focus, select:focus { outline: solid .1em #BD6443; }
#color5 label.focusedLabel { background-color: #BD6443; }
#color5 .ui-state-focus { background: #BD6443; color: #FFF; }

.publicHome {
  display: block;
  width: 20%;
  margin-bottom: .5em;
  background: url('/public/images/home_purple.png') 0% .2em no-repeat;
  line-height: 20px;
  padding-left: 2em;
  text-decoration: none;
  color: #663399;
}
.publicRefine {
  display: block;
  width: 20%;
  background: url('/public/images/arrow_purple.png') 0% .3em no-repeat;
  line-height: 20px;
  padding-left: 2em;
  text-decoration: none;
  color: #663399;
}
.publicHome:hover, .publicRefine:hover { font-weight: bold; cursor: pointer; }

.someMargin { margin-top: 1.15em; }

/* Footer */
footer { display: block; clear: both; }

@media screen and (max-width: 40em) {
.column, .column50 { width: 100%; }

}