/* menu */
/* switch-a-rooneies */
/*desktop*/
@media only screen and (min-width: 600px) {
  	#mobileNav, .mobile-menu-link, #mobileTitle, #MobilefilterTitle, .mobile-bk-2-port-text  { display: none!important; }
    #desktabletNav, .bk-2-port-text { display: block;}
}

@media only screen and (max-width: 600px) {
	#mobileTitle, MobilefilterTitle, .mobile-bk-2-port-text {display: block;}
  #mobileNav, .mobile-menu-link, #desktabletNav, .bk-2-port-text  { display: none; }
 
}

/* mobile menu styles*/
@media only screen and (max-width: 600px) {
	
	/* hack see style.css 294 */ #page-launcher {margin: 0px auto 10px;}
	
	a.mobile-menu-link {
   display: block;
   text-indent: -20000px;
   background: url(../img/icons/mob-menu-close.png) center left no-repeat;
   background-size: 100%;
   width: 2rem;
   z-index: 10;
   float: right;
   position: absolute;
   right: 11px;
   top: 13px;
  }
	a.mobile-menu-link.active {
		 background: url(../img/icons/mob-menu.png) center left no-repeat;
    background-size: 100%;
		
	} 
	#mobileNav   {}
	#mobileNav  ul {}
	#mobileNav  ul li {
   	 	display: block;
    	padding: 1rem 0;
    
	}
	#mobileNav ul li a {
   
	}
	
	
	#mobileNav.nav.active {
		display: block;
		max-height: 100%;
		z-index: 2;
		position: relative;
		left: 0;
		right: 0;
		top: 5px;
		/* background-color: rgba(0, 0, 0, 1); */
		overflow: initial;
		bottom: 0;
		height: 100%;
		}
  	#mobileNav.nav.active ul {
   		 height: 100%;
   		 max-height: inherit;
    	 overflow: visible;
	}
	
	
	
}

/* header */

@media only screen and (max-width: 600px) {
	.header {
    margin: 0px auto 0px auto;
    padding: 14px 0 10px 0;
 }  

	.header h1.mobile-title {
   	 font-family: 'Raleway', sans-serif;
    letter-spacing: 0.5rem;
    padding: 0;
    margin: 0;
    color: black;
    font-size: 1.4em;
	}  
}

/* portfolio filters */
 
@media only screen and (max-width: 600px) { 

	a.mobile-filter-title {
    text-transform: uppercase;
    font-size: 1.2rem;
    color: black;
    margin: 10px 0;
    display: block;
    /* display: inline-block; */
}
	a.mobile-filter-title span {
	font-size: 2rem;
	}
	#options {
    width: 100%;
}
	#filters {display: none}
	#filters.active {display: block;/* display: inline; */}
	ul#filters {}
	ul#filters li {
    margin: 1rem 0;
}
	ul#filters li a {}
}

/* PROJECT PAGE */
@media only screen and (max-width: 600px) { 
	
	#slides {
    min-height: auto;
    height: auto;
}
	#slides .pane {
    width: auto;
    height: auto;
    margin: 0;
}
	#slides ul.scrollable {
		position: relative;
		width: 100%;
		height: auto;
	}
	#slides ul.scrollable li {
    float: none;
}
	#slides ul.scrollable li .media {}
	#slides .scrollable .slide .text {
    font-size: 1rem;
    height: auto;
    margin-bottom: 2rem;
}
	#slides .arrow {display:none}

}
/* last slide */
@media only screen and (max-width: 600px) { 
	#bk2port {margin-top: 0!important;}
	#bk2port h1 {display: none;}
	#bk2portImg {
	display: none;
	}
	.bk-2-port-text { }
	text.mobile-bk-2-port-text {}
	.mobile-bk-2-port-text a {
		color:
		black;
		margin: 2rem 0;
		display: block;
		}
	.mobile-bk-2-port-text span {
    font-size: 2rem;
	}
}
 
/* clients */
@media only screen and (max-width: 600px) { 
#post-398 .column-group p {
    font-size: 0.8rem;
    line-height: 1.3rem;
}
	#post-398 .column-group img {
    margin-top:2rem
}
}

/*about*/
@media only screen and (max-width: 600px) { 
.about section {
    background-position: center bottom;
}
.about article {width:100%;padding-bottom: 13rem;padding-top: 2rem;}
}
/*clients */
@media only screen and (max-width: 600px) { 
 
section#clientList {
  width: 100%;
}
#clientList article {
 width: 100%;
}
li.client-name {}
h3.project-tax {}
.projects4client {}
}

/* columns  see styles.css 302 */
@media only screen and (max-width: 600px) { 
.column-group {
	width: 100%;
	overflow: hidden;
}

.column {
	float: left;
	margin-right: 5%;
	width: 100%;
}

.column-group > br,
.column-group > p {
	display: none;
}

.column.last {
	margin-right: 0;
}

.columns-2 .column { width: 100%; } /* ( 100 - $margin * ( $num_cols - 1 ) ) / $num_cols */
.columns-3 .column { width: 100%; }
.columns-4 .column { width: 100%; }

.columns-3 .column-span-2 { width: 100%; } /* $width * $span + $margin * ( $span - 1 ) */
.columns-4 .column-span-2 { width: 100%; }
.columns-4 .column-span-3 { width: 100%; }
}