/* ---------------------------------------*/
/* ---------->>> @FONT-FACE <<<-----------*/
/* ---------------------------------------*/
 @font-face {
     font-family: 'callunasans';
     src: url('fonts/callunasans.eot');
     src: url('fonts/callunasans.eot?#iefix') format('embedded-opentype'), url('fonts/callunasans.woff') format('woff'), url('fonts/callunasans.ttf') format('truetype'), url('fonts/callunasans.svg#sofia_prolight') format('svg');
     font-weight: normal;
     font-style: normal;
}
/* ------------------------------------*/
/* ---------->>> HELPERS <<<-----------*/
/* ------------------------------------*/
 .clear {
    clear: both;
}
 .clearfix:before, .clearfix:after {
     content: "\0020";
     display: block;
     height: 0;
     overflow: hidden;
}
 .clearfix:after {
     clear: both;
}
 .clearfix {
     zoom: 1;
}
 ::-moz-selection {
    background: #EB7222;
     color: #fff;
     text-shadow: none;
}
 ::selection {
    background: #EB7222;
     color: #fff;
     text-shadow: none;
}
/* -----------------------------------------*/
/* ---------->>> MOBILE FIRST <<<-----------*/
/* -----------------------------------------*/
 body {
    font-size:18px;
    font-variant-ligatures: none
}
 a, a:active, a:visited {
     color: #515151;
     text-decoration:none
}
 a:hover,a:focus,#nav ul a:hover,#nav ul a:focus, a.current {
     color: #d05d11 !important;
}
 .full {
    display:none ;
    visibility:hidden
}
 body{
    font-family:Calluna Sans, callunasans, Helvetica, Helvetica Neue, Arial, sans-serif;
    color:#4e4e4e
}
 h2 {
    text-align:center
}
 #wrapper{
    margin:30px auto;
    width:85%;
}
 header#masthead{
    padding:29px 0px 19px;
    text-align:left
}
 #logo{
    font-size:26px;
    font-weight:normal;
    color:#4e4e4e
}
 #main{
    width:100%;
    border:1px solid #eee;
}
 nav {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    text-align:center;
    z-index:50
}
 nav ul.main {
    display:none;
}
 nav ul {
    list-style:none;
    width:100%;
    margin:0;
    padding:0;
    background: #fafafa
}
 nav ul ul {
    display:none;
    list-style:none;
    margin:0;
    padding:0;
    color:#8e8e8e
}
 nav ul ul a {
    color:#8e8e8e;
}
 nav ul ul ul {
    display:none;
}
 nav ul a {
    display:block;
    padding:10px
}
 nav li {
    background:#eee;
    border-top:1px solid #aaa;
}
 nav li:first-child {
    border:none
}
 nav li li {
    background:#ccc;
}
 nav li li li {
    background:#bbb;
}
 .navbutton {
    display:block;
    color:#fff;
    cursor:pointer;
    line-height:2em
}
 .mobilenavbutton {
    height: 20px;
     text-align: left;
     color: #aaa;
     padding: 20px 25px;
     line-height: 13px;
     font-size: 1.4rem;
}
 .mobilenavbutton:before {
    content:'\2630';
}
 .no-js #js_warning {
    display:block;
    padding:5px 0;
    background:#d05d11;
    color:#fff;
    width:100%;
    text-align:center
}
 #js_warning {
    display:none
}
 .no-js #wrapper {
    margin-top: 0
}
 .no-js nav {
    position:relative
}
 .no-js nav ul.main {
    display:block;
    ;
    box-shadow:none
}
 .no-js nav ul {
    display:block
}
 .no-js nav ul ul ul {
    display:none
}
 .no-js .navbutton {
    display:none
}
 .no-js #main {
    margin-top:15px
}
 #content {
    top:0;
    right:0;
    background:#fff;
    overflow:hidden
}
 #content h1, #content h2 {
    margin:2px 0
}
 #content .project_title {
    padding: 10px;
    text-align:center;
    font-size:1.8em
}
 .photo_nav {
    display:block;
    position:relative;
    bottom:0;
    padding:6px 12px 5px;
    text-align:center;
    -moz-font-feature-settings:'tnum=1,lnum=1';
    font-size:.9em;
    color:#7d7d7d;
    z-index:27
}
 .photo_nav .prev,.photo_nav .next {
    width:50%;
    height:100%;
    display:block;
    position:absolute;
    top:0
}
 .photo_nav .prev {
    left: 0
}
 .photo_nav .next {
    right:0
}
 .floater {
    position:relative;
    z-index:10
}
 .fullimg {
    display:block;
    width:auto;
    text-align:center;
    float:left;
}
 .fullimg img {
    max-width:100%;
    max-height:275px;
    width:auto;
    height:auto;
}
 .nomore{
    color:#cecece
}
 #info_txt {
    display:none;
    position:absolute;
    background:rgba(255,255,255,.6);
    top:50px;
    left:10px;
    width:200px;
    padding:15px
}
 #info_overlay {
    width:680px;
    height:200px;
    background:#fff;
    background:rgba(253,253,253,.8);
    position:absolute;
    top:10px;
    left:190px
}
 footer{
    font-size:15px;
    color:#7c7c7c;
    padding:5px 0 0;
    overflow: hidden ;
}
 footer .colophon,footer .colophon a {
    color:#ddd
}
 footer .colophon:hover,footer .colophon a:focus {
    color:#aaa
}
 footer span {
    display:block
}
 .home .carousel_wrap {
    overflow: hidden;
}
 .home .carousel {
    overflow: hidden;
}
 .home .carousel div {
    background-repeat: no-repeat;
     background-position: center, center;
     -webkit-background-size: auto 100% !important;
     background-size: auto 100% !important;
    float: left;
}
 .home .carousel div {
    width: 90vw;
     height: 90%
}
 .project_section_links {
    display:none
}
 #content section img {
    max-width: 100%
}
 .fullimg2 {
    line-height: 0;
    padding-top: 6px;
     display: block;
}
 .fullimg2:first-of-type {
    padding-top: 0;
}
 .fullimg2 img {
    max-width:100%;
}
 .project h1.project_title {
    color: #000;
     font-size: 1.2em;
}
 .project h1.project_title a {
    color: #000
}
 .project h1.project_title:after{
    content:"";
     float:left;
     background:#d05d11;
     width:100%;
     height:3px;
     border-radius: 3px 0px 0px 3px;
     margin: 0;
     padding: 0 ;
}
 .aboutus #content, .media #content {
    padding: 10px;
}
 .project header#project_title.foo {
    position: fixed;
    top:0px
}
 .close_info {
    visibility: hidden
}
 .aboutus #content h1, .media #content h1 {
    font-size: 1.5rem;
     margin: 2px 0 0;
    color: #d05d11;
}
/* ------------------------------------------*/
/* ---------->>> MEDIA QUERIES <<<-----------*/
/* ------------------------------------------*/
/* ------------->>> TABLETS <<<--------------*/
 @media only screen and (min-width: 480px) {
     .media section.contact img {
        width: 70%
    }
    .media #main, .project #main, .aboutus #main {
      min-height: 475px
    }
}
/* -------->>> LANDSCAPE TABLET <<<----------*/
 @media only screen and (min-width: 760px) {
     .mobile {
        display:none
    }
     .full {
        display:block;
        visibility:visible
    }
     body {
        font-size:13px
    }
     footer{
        font-size:11px;
    }
     .close_info {
        visibility:visible
    }
     .project header#project_title {
        position:absolute;
        z-index:1;
        text-align:right;
        display:block
    }
     .project h1.project_title {
        padding: 8px;
         font-size: 1.2rem;
         margin: 0;
         color: #fff;
         text-shadow: 1px 1px 3px rgba(0,0,0,.45)
    }
     .project h1.project_title a {
        color: #fff
    }
     .project h1.project_title a:hover,.project h1.project_title a:focus {
        color: #fff !important
    }
     .project h1.project_title:after{
        content:"";
         float:left;
         background:#d05d11;
         width:100%;
         height:3px;
         border-radius: 3px 0px 0px 3px;
         margin: 7px -9px 0 0;
         padding: 0 0 0 9px;
    }
     .home .carousel {
    }
     .home .carousel div {
    }
     .slick-prev, .slick-next {
        text-shadow: 0px 2px 20px #555;
         z-index: 25
    }
     .slick-prev {
        left:25px !important;
    }
     .slick-next {
        right:25px !important;
    }
     .home #main {
        padding-left: 0;
        margin-left: 0;
    }
     .home .carousel div {
    }
     .home .insidewrapper {
        overflow: hidden;
    }
     .home nav ul.main {
        background: #fafafadf;
    }
     .home nav ul ul {
        background: none
    }
     footer div div {
        display: inline-block;
    }
     footer div div:before {
        content: " // "
    }
     footer div div:first-child:before {
        content: ""
    }
     .home nav {
        margin: 0
    }
     .mobilenavbutton {
        display: none;
    }
     .home nav.closed {
        transform: translateX(-250px);
    }
     .home nav.open {
        transform: translateX(0);
    }
     .home nav, .navbutton2 {
         -webkit-transition: .25s ease-in-out;
         -moz-transition: .25s ease-in-out;
         -o-transition: .25s ease-in-out;
         transition: .25s ease-in-out;
    }
     .home ul ul {
         -webkit-transition: auto;
         -moz-transition: auto;
         -o-transition: auto;
         transition: auto;
    }
     .home .navbutton2 {
        display: block;
    }
     .navbutton2 {
        display:none;
         cursor: pointer;
         position: absolute;
         color: #fff;
         font-size: 1.5rem;
         text-shadow: 0 0 2px #ddd;
         z-index: 100;
         background: #d05d11;
         border-radius: 0 0px 19px 0;
         padding: 3px 9px 6px 5px;
        width: 22px;
         text-align: center;
         height: 28px;
         line-height: 28px
    }
     .navbutton2.open {
        transform: translateX(249px);
    }
     .navbutton2.closed {
        transform: translateX(250px);
    }
     .navbutton2.closed:before {
        content:'\2630';
    }
     .navbutton2.open:before {
        content:'\276C';
        font-size: 1.2rem;
    }
     #wrapper{
        margin:0 auto;
        width:80%;
    }
     #wrapper{
        width: 700px
    }
     header#masthead{
        padding:29px 2px 19px;
        text-align:left
    }
     #logo{
        font-size:22px;
    }
     h2 {
        text-align:left
    }
     #nav{
        list-style:none;
        width:149px;
        height:418px;
         border-right: 1px solid #fcfcfc;
        position:absolute;
        top:0;
        left:0;
        margin:0;
        padding:11px 15px;
        background:#fafafa
    }
     #nav ul {
        list-style:none;
        margin:5px;
        padding:0;
        color:#8e8e8e
    }
     #nav ul a {
        color:#8e8e8e
    }
     #nav ul ul {
        margin:0px 8px 5px;
        display:none
    }
     .insidewrapper {
        position:relative;
        width:auto
    }
     nav {
        z-index:30;
        text-align:left;
        width:221px;
        padding:1px;
        height:100%
    }
     nav ul.main {
        display:block;
        box-shadow:none;
        border-right: 1px solid #fcfcfc;
        padding:0 15px 0 13px;
        background:#fafafa;
        height:100%;
    }
     .home nav ul.main {
        border: none;
    }
     nav ul ul {
        display:none;
        list-style:none;
        padding:0;
        color:#8e8e8e;
        margin:5px 8px;
    }
     nav ul ul a {
        color:#8e8e8e;
    }
     nav ul ul ul {
        display:none;
    }
     nav ul a {
        display:block;
        padding:4px
    }
     nav ul a:before {
        content: "- ";
         color: #d05d11;
         font-weight: bold
    }
     nav ul li li a:before {
        color: #8e8e8e
    }
     nav li {
        background:none;
        border:none;
    }
     nav li:first-child {
        border:none
    }
     nav li:first-child {
        padding-top: 11px
    }
     nav li li {
        background:none;
    }
     nav li li:first-child {
        padding-top: 0
    }
     #main{
        width:auto;
        height:auto;
        margin-left: 250px;
    }
     .aboutus #main {
        background: url(images/MSA-Bio.jpg) center -90px no-repeat;
        -webkit-background-size: 100% auto;
         background-size: 100% auto;
    }
     .aboutus #content {
        background: #ffffffb6;
        margin: 150px 15px 15px
    }
     .project #main {
        margin-top: -120px;
    }
     #content {
        height: auto;
        min-height:440px;
        top:0;
        right:0;
        background:#fff;
        overflow:hidden;
        position:relative;
        padding: 10px;
    }
     #content .project_title {
        display:none
    }
     #content section#photos {
        padding:0;
    }
     .photo_nav {
        display:block;
        position:absolute;
        right:313px;
        bottom:0;
        background:#fff;
        padding:6px 12px 5px;
        border-radius:5px 5px 0 0;
        text-align:center;
        -moz-font-feature-settings:'tnum=1,lnum=1';
        font-size:.9em;
        color:#7d7d7d
    }
     .photo_nav {
        display:block;
        position:absolute;
        bottom:0;
        background:#fff;
        padding:6px 12px 5px;
        text-align:center;
        -moz-font-feature-settings:'tnum=1,lnum=1';
        font-size:.9em;
        color:#7d7d7d;
        z-index:7;
        width:55px;
        left:0;
        right:0;
        margin:0 auto
    }
     .photo_nav .prev,.photo_nav .next {
        width:50%;
        height:100%;
        display:block;
        position:absolute;
        top:0
    }
     .photo_nav .prev {
        left: 0
    }
     .photo_nav .next {
        right:0
    }
     .floater {
        position:absolute;
        left:0;
        top:0;
        z-index:6;
        width:100%
    }
     .fullimg {
        float:left;
        width:auto;
        text-align:center
    }
     .fullimg img {
        max-height:450px;
    }
     .project_section_links {
        display:block;
        margin: -33px 12px 0 0;
         color: #fff;
        text-shadow: 0px 1px 2px #aaa;
    }
     .project_section_links a {
        color: #fff;
    }
     section#info,section#secondary {
        display:none;
        z-index:50;
        background:#fff;
    }
     section#info {
        background:none;
        position:absolute;
        top:0;
        left:0;
        margin-top:76px;
        overflow-y:auto;
        padding-left: 251px;
        z-index: 0;
        text-align: left;
        color: #fff
    }
     section#info .floater2 {
        background:rgba(19, 19, 19, 0.8);
        padding: 7px 31px;
        font-size: 1.02em;
        line-height: 1.3em
    }
     section#info .close_info {
        color: #fff
    }
     section#secondary {
        z-index:100
    }
     section#secondary .photo_nav {
        z-index:100
    }
     section#secondary .floater {
        background: #eee
    }
     footer {
        margin-bottom:17px;
        overflow: hidden;
        padding-bottom: 2px;
    }
     footer span {
        display:inline !important
    }
     .project header#project_title {
        position:sticky;
        z-index:1;
        text-align:right;
        display:block;
        height: 120px;
        top:0;
    }
     .project header#project_title.foo {
        position: fixed;
        top:5px;
        right:10%;
    }
     .project h1.project_title {
        position: sticky;
         display:inline-block;
        padding: 8px 10px;
         font-size: 1.5rem;
         margin: 30px auto 35px;
         color: #fff;
         text-shadow: 1px 1px 3px rgba(0,0,0,.3);
        z-index: 10;
    }
     .project h1.project_title:after{
        content:"";
         float:left;
         background:#d05d11;
         width:100%;
         height:3px;
         border-radius: 3px 0px 0px 3px;
         margin: 7px -9px 0 0;
         padding: 0 0 0 9px;
    }
     .project header#project_title {
        width:100%;
    }
     .project .fullimg2 img {
        width: 100%
    }
     .home .carousel_wrap {
    }
}
/* ---------->>> DESKTOP SCREENS <<<-----------*/
 @media only screen and (min-width: 1140px) {
     #wrapper{
        width: 952px
    }
     #content {
        min-height: inherit;
    }
     .fullimg img {
        max-height:inherit;
    }
     .project header#project_title {
    }
     .project header#project_title.foo {
        right:auto;
    }
     footer .contact {
        float: left;
    }
     footer .colophon {
        float: right;
        text-align: right;
    }
     .media section.contact {
        overflow: hidden;
    }
     .media section.contact img {
        float: right;
        width: 60%
    }
     .media section.contact div {
        float:left;
    }
     .home .carousel div {
        width: 100%;
         height: auto
    }
}
 @media only screen and (min-width: 1900px) {
     #wrapper{
        width: 1162px
    }
     .project #content {
        height: 735px
    }
     .project header#project_title {
        width:1162px;
    }
}
 @media only screen and (min-width: 2400px) {
     #wrapper{
        width: 1200px
    }
     .project #content {
        height: 1050px
    }
     .project header#project_title {
        width:1200px;
    }
}
/* ------------------------------------------*/
/* ---------->>> PRINT STYLES <<<------------*/
/* Inlined to avoid required HTTP connection */
/* ------------------------------------------*/
 @media print {
     * {
         background: transparent !important;
         color: black !important;
         text-shadow: none !important;
         filter:none !important;
         -ms-filter: none !important;
    }
     a, a:visited {
         color: #444 !important;
         text-decoration: underline;
    }
     a[href]:after {
         content: " (" attr(href) ")";
    }
     abbr[title]:after {
         content: " (" attr(title) ")";
    }
     .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after {
         content: "";
    }
     pre, blockquote {
         border: 1px solid #999;
         page-break-inside: avoid;
    }
     thead {
         display: table-header-group;
    }
     tr, img {
         page-break-inside: avoid;
    }
     @page {
         margin: 0.5cm;
    }
     p, h2, h3 {
         orphans: 3;
         widows: 3;
    }
     h2, h3{
         page-break-after: avoid;
    }
}
/* END PRINT CSS */