oobVariables{ 
    $templatePath: '../templates/frontend';
}
.desktop {
    display: none!important;
}
body, html {
    width: 100%;
    padding:0.1%;
    overflow-x: hidden;
}
html {
    overflow-y:auto;
}
body {
    overflow-y: hidden;
}
.rightmenu {
    font-size: 108%;
    font-weight: 300;
}
.leftmenu {
    font-size: 108%;
    font-weight: 300;
}
.gotoindex {}
.index #leftcolumn {
    width:100%;
    height:54vh;
    overflow:hidden;
    position: relative;
}
.index #rightcolumn {
    /*height:57vh !important;*/
    width:100%;
    position: relative;
}
.index #insideleft {
    position: absolute;
    bottom: 0;
    height:70%;
    width:100%;
}
.index #insideright {
    background: rgb(103,96,94);
    width:100%;             
}
.index .pool {
    opacity:1;
    overflow: hidden;
    height:100%;
    text-align: right;
}
.index .bar {
    opacity:0;
    display:none;
}
.index .bar  img, 
.index .pool   img{
    width:100%;
    height: auto;
}
.index .semiwhite {
    background: rgb(255,255,255);
    width:100%;
    display:block;
    opacity:1;
}
.index .words {
    display:none;
    height: 0em;
    opacity:0;
}
.index .tellingtag {
    text-transform:uppercase;
    font-size:2em;
    background: rgba(200,200,200,0.2);
}
.index .showingtag {
    position: relative;
    background: rgba(33,33,33,0.4);
    text-transform:uppercase;
    text-align: right;
    font-size:2em;
    margin-top:-1.2em;
}
.index .rightmenu {
    display:none;
}
.index .leftmenu {
    display:none;
}
.index .tower {
    display:none;
}
.index .container {
    display:none;
}
.telling #leftcolumn {
    width:100%;
    vertical-align: middle;
}
.telling #rightcolumn {
    width:100%;
    display: inline-block;
}
.telling #insideleft {
    width:100%;
}
.telling #insideright {
    width:100%;               
}
.telling .pool,
.telling .bar{
    display: inline-block;
    margin-right: -4px;
}
.telling .bar {
    opacity:1;
}
.telling .bar img, 
.telling .pool img{
    max-width: 100%;
}
.telling .semiwhite {
    display:none;
    opacity:0;
    height:0;
}
.telling .words {
    display:block;
    padding-left:1em;
    width:91%;
    text-align: justify;
    height:50%;
    opacity:1;
}
.telling .afterText .contact{
    font-size: 1em;
    line-height: 1em;
}
.telling .tellingtag {
    font-size:2em;
}
.telling .showingtag {
    display:none;
}
.telling .rightmenu {
    text-align: right;
    background: rgba(255,255,255,0.2);
    opacity:1;
    height: 0;
    overflow: hidden;
    transition:  height 1s;
    margin-bottom: 15px;
}
.telling .rightmenu a{
    display: block;
    padding: 6px 8px;
}
.telling .leftmenu {
    display:none;
}
.showing #leftcolumn {
    width:100%;
}
.showing #rightcolumn {
    height:0 !important;
    width:100%;
}
.showing #insideleft {
    width:100%;
}
.showing #insideright {
    width:100%;               
}
.showing .pool {
    display:none;
}
.showing .bar {
    display:none;
}
.showing .bar  img, 
.showing .pool   img{
    display:none;
}
.showing .semiwhite {
    display:none;
}
.showing .words {
    display:block;
    padding-left:1em;
    width:94%;
    text-align: justify;
    opacity:1;
}
.showing .words p {
    max-height: 10em;
    overflow-y: scroll;
    padding-right: 0.5em;
}
.showing .tellingtag {
    display:none;
}
.showing .showingtag {
    display:none;
}
.showing .rightmenu {
    display:none;
}
.showing .leftmenu,
.project .leftmenu {
    text-align: right;
    background: rgba(255,255,255,0.2);
    opacity:1;
    height: 0;
    overflow: hidden;
    transition:  height 1s;
}
.showing .leftmenu a,
.project .leftmenu a{
    padding: 8px;
    display: none;
}
.showing .leftmenu:not(.showingCategories) a.showing,
.showing .leftmenu.showingCategories a.showingCategories,
.project .leftmenu a:not(.more){
    display: block;
}
.showing .tower,
.telling .tower{
    display: inline-block;
    vertical-align: top;
    width: 48% !important;
    margin-left:0.5%;
    margin-right:0.5%;
}
.showing #scroll .categoryImages > div{
    width: 48.5%; 
    display: inline-block; 
    vertical-align: top;
}
.showing .tower>*{
    display: inline-block;
    vertical-align: top;
}
.showing .tower:nth-child(0),
.showing .tower:nth-child(2){
    margin-left:0.5%!important;
}
.showing .tower:nth-child(1)
.showing .tower:nth-child(3){
    margin-right:1%!important;
}
/*.showing .tower:nth-child(odd),
.telling .tower:nth-child(odd){
    float:left;
    margin-left:0.7%!important;
}
.showing .tower:nth-child(even),
.telling .tower:nth-child(even){
    float:right;
    margin-right:1%!important;
}*/
.telling #insideleft .publications > * {
    display:inline-block;
    margin: 0 0.5em 1em 0.2em;
}
.showing .container {
    display:none;
}
.contact #leftcolumn {
    width:100%;
    vertical-align: middle;
    display: inline-block;
}
.contact #rightcolumn {
    vertical-align: middle;
    width:100%;
    height:30% !important;
}
.contact #insideleft {
    width:100%;
}
.contact #insideright {
    width:100%;               
}
.contact .pool {
    display:none;
}
.contact .bar {
    display:none;
}
.contact .bar  img, 
.contact .pool   img{
    display:none;
}
.contact .semiwhite {
    display:none;
}
.contact .words {
    display:block;
    width:100%;
    height:80%;
    opacity:1;
}
.contact .tellingtag {
    font-size:2em;
}
.contact .showingtag {
    display:none;
}
.contact .rightmenu {
    margin-top:5em;
    margin-bottom:-6em;
    opacity:0;
}
.contact .leftmenu {
    margin-top:5em;
    margin-bottom:-6em;
    opacity:0;
}
.contact .tower {
    display: none;
}
.contact .container {
    display:none;
}
.project #leftcolumn {
    width:100%;
}
.project #rightcolumn {
    height:0 !important;
    width:100%;
}
.project #insideleft {
    width:100%;
}
.project #insideright, .telling #insideright.publication {
    background: rgba(22,22,22,0.8);
    position: fixed;
    z-index: 100;
    bottom:0;
    width:100%;               
}
.project .pool {
    display:none;
}
.project .bar {
    display:none;
}
.project .bar  img, 
.project .pool   img{
    display:none;
}
.project .semiwhite {
    display:none;
}
.project .words, 
.telling .words{
    display:block;
    padding-top: 0.5em;
    opacity:1;
}
.project .words{
    width:100%;
}
.project .words .bored,
.telling .words .bored {
    display: inline-block;
    height: 1em;
    margin-left: 0.5em;
}
.project .tellingtag {
    display:none;
}
.project .showingtag {
    display:none;
}
.project .rightmenu {
    display:none;
}
.project .tower {
    display: none;
}
.project .container, .telling .container {
    position: relative;
    width:100%;
    height:120%;
    background: rgba(255,255,255,0.2);
    margin-top: 30px;
}
#slides2 img {  width:100%; height:auto!important; }
#slides2 {
    display: none;
}
.slidesjs-pagination li a {
    display: block;
    width: 6px;
    height: 1px;
    padding-top: 5px;
    background-image: url(../../../../templates/images/inactive2.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    float: left;
    overflow: hidden;
    margin-left: 10px;
    z-index: 11;
}
.slidesjs-pagination {
    float: right;
    list-style: none;
    position: absolute;
    right: 0.5em;
    top: -2.1em;
}
.slidesjs-pagination li {
    float: right;
    margin: 3px 1px;
}
.slidesjs-pagination li a:hover { background-image: url(../../../../templates/images/hover2.png) }
.navbar { overflow: hidden }

/*SlidesJS Optional: If you'd like to use this design*/
#slides .slidesjs-navigation { margin-top: 3px }
#slides .slidesjs-previous {
    margin-right: 5px;
    float: left;
}
#slides .slidesjs-next {
    margin-right: 5px;
    float: left;
}
.slidesjs-pagination {
    margin-top: 0.3em;
    float: right;
    list-style: none;
    margin-right: 2%;
    margin-bottom: 0;
}
.companyName{
    font-size:1.2em;
}
.lightCompanyName{
    font-weight: lighter
}
.companytitle{
    margin-left:1em;
    /*padding-top:1em;*/
    margin-bottom:1em;
    position: relative;
}
.project .companytitle{
    padding-top:0.5em;
}
.leftear {
    width: 21%;
    left:4em;
    bottom:2em;
}
.rightear {
    width: 21%;
    right:4em;
    top:2em;
}
.tagline {
    font-weight: lighter;
    font-size: 1em;
    padding: 6%;
    margin-left: -6%;
}
.anystyle {
    font-size: 200%;
}
.info {
    height:1em;
    vertical-align: middle;
    padding-left:1em;
    padding-bottom:3em;
    /*padding-top:2em;*/
}
#rightcolumn .info #phoneAndEmail{
    font-size: 0.8em;
    line-height: 1em;
    max-width: 74%;
    padding-left: 0;
    padding-right: 0;
    vertical-align: top;
}
#rightmenuhandle {
    opacity:0;
}
.backLink{
    padding-top: 1em;
}
.showing #leftmenuhandle,
.animating #leftmenuhandle,
.animating #rightmenuhandle,
.telling #rightmenuhandle,
.index #leftmenuhandle,
.index #rightmenuhandle,
.project #leftmenuhandle{
    position: absolute;
    top: 10px;
    right: 15px;
    width: 30px;
    filter: alpha(opacity=30);
    opacity: 0.3;
    display:inline-block;
}
.animating #leftmenuhandle,
.animating #rightmenuhandle,
.showing .info,
.project #rightmenuhandle,
.index #leftmenuhandle,
.index #rightmenuhandle{
    display: none;
}
.animating #rightmenuhandle{
    z-index: 1111;
}
.tower img {
    width: 99%;
    vertical-align: bottom;
}
.residence {
    position: relative;
    display: block;
    text-align: left;
    margin-bottom: 3%;
}
.showingkeywords {
    display: none;
}
.uparrow {
    background-image: url(../../../../templates/images/uparrow.png);
    background-size:  40% auto;
    background-repeat: no-repeat;
    background-position: center;
}
.downarrow {
    background-image: url(../../../../templates/images/downarrow.png);
    background-size:  40% auto;
    background-repeat: no-repeat;
    background-position: center;
}
.projdesc {
    /*max-height: 0;*/
    height: 0;
    display:block;
    margin:3%;
    overflow: hidden;
    transition: height 1s;
}
#contactform {
    width: 99%; 
}
#contactform input {
    width:90%; 
}
.contactinfo {
    margin-right: 1em;
    margin-top: 1.8em;
}
.contactinfo .contactText {
    margin-right: 0;
}
.submit {
    font-size:300%;   
}
#contactform {
    margin-top: 1%;
    margin-bottom: 1%;
    display: inline-block;
}
input {
    border-radius: 0 !important;
    margin: 1em;
}
input:hover,input:focus { 
    border-color: white;
}
textarea {
    border-radius: 0 !important;
    margin: 1em;
}
doesnotexist:-o-prefocus, textarea {
    background-color: rgba(255,255,255,0.1);
    color: black;
}
.submit{
    padding-left:0.3em;
}
doesnotexist:-o-prefocus, submit {
    font-weight: 500;
}
.submit:hover,
.submit.bright { 
    opacity: 0.8 
}
.contactinfo {
    line-height: 115%;
    display: block;
}
textarea {
    width:90%; 
}
.animating .pool .img {
    display: none;
}
.animating .bar .img {
    display: none;
}
.jspPane {
    position: relative;
    /*margin: 0 -3.5% -7%;*/
    width:100% !important;
}
.moreless{
    display: block; 
    padding: 1%; 
    width:22px; 
    height:22px; 
    margin-right: 0.5em; 
    float:right;   
}
.telling .details #magazineTitle{
    display: none;
}