/**
 * Name: layout.css
 *	
 *	-
 *
 *	T.O.C
 *	
 *	#General Layout 
 *		#Header
 *		#Content
 *		#Footer
 *	#Page Styles
 *		#Index
 *		#About
 *		#Services
 *		#Contact
 *	#Responsive
  *		#Footer Bottom
 *		#Large Display
 *		#Smaller then 1024px width	
 *		#Tablet (Portrait)
 *		#Mobile (Portrait and Landscape )
 *		#Mobile ( Landscape )
 */

/* ==========================================================================
   #General Layout 
   ========================================================================== */


	#wrap {
		position: relative;
		background-color: #fff;
	}
	section{
		position: relative;
		z-index: 10;
	}
	.fullwidthbanner {visibility: hidden}

	header h1, header h2 {
		 font-size: 1px;
	    height: 1px;
	    line-height: 0;
	    margin: 0;
	    padding: 0;
	    text-indent: -9999px;
	}


	.text-red{
		color:red;
	}
	.text-slate{
		color:var(--brandColorSlate);
	}
	.text-blue{
		color:var(--brandColorBlue);
	}
	.text-slate a{
		color:var(--brandColorSlate);
		text-decoration: underline;
	}
	.text-grey{
		color:var(--brandColorGrey);
	}
	.text-black{
		color:var(--brandColorBlack);
	}

/* #Header
   ========================================================================== */	
	header{
		position: relative;
		border-top: 4px solid var(--brandColorBlue); 
		border-bottom: 4px solid var(--brandColorBlue);
		height:140px;		 
	}
	#header,
	#admin-header {
		display:flex;
		flex-wrap: wrap;
		box-sizing: border-box;
	}
	.header-item{
		flex:1 1 auto;
		xborder:1px solid red;
	}
	.header-item:nth-child(2){
		flex:0 0 60%;
		text-align:right;
		xborder:1px solid blue;
	}	
	.header-item:nth-child(3){
		flex:0 0 100%;
		text-align:center;
		xborder:1px solid green;
	}	

		@media screen and (max-width:1230px){
			.header-item{
				flex:1 1 auto;
				align-self: center;
			}
			.header-item:nth-child(2){
				flex:1 1 auto;
				text-align:right;
			}
			.img-border-radius-small {
			  width: 150px;
			}			
		}

	/* Logo */

	#logo { 
		display: block;
		float:left;
		margin-top:20px;
	}
	
	#logo img { display: block; max-width:350px }
		
	#topnav{
		display: flex;
		justify-content: flex-end;
		width:100%;
		margin-top:5px;
		margin-bottom: 5px;
		
	}
	#topnav a{
		font-size:.875em;
		color:var(--primaryTextfade);
		text-align: right;
		flex:0 0 90px;
		white-space: nowrap;
		xborder:1px solid red;
	}	
	#topnav a:nth-child(2){
		flex:0 0 135px;
	}
	#topnav a:nth-child(3){
		flex:0 0 50px;
	}
	#topnav a.active{
		color: var(--brandColorBlack);
		text-decoration: underline !important;
	}	
	#topnav a:hover{
		text-decoration: underline !important;
	}	
	#contact-callout{
		display: flex;
		justify-content: flex-end;
		align-content: center;
		align-items: center;

	}
	#contact-callout a{
		color:var(--brandColorBlue);

	}
	#contact-callout div:first-child a{
		margin:0px 20px 0px 0px;
		font-size:1.625em;		
	}
	#contact-callout a:hover{
		text-decoration: none;
	}

	#slide-content{
		position: relative;
		top:-10px;
		left:50px;
		color:var(--brandColorBlack);
		width:500px;
	}
	#slide-content em{
		color:var(--primaryText);
	}
	#slide-content ul{
		margin-bottom:30px;
	}

	@media screen and (max-height:915px){
		#slide-content{
			top:10px;
			width:45vw;
		}
		#slide-content ul{
			xmargin-bottom:15px;
		}		
		#slide-content ul.fill-circle li {
		  	margin-bottom: 5px;
		}
		#slide-content p span{
			display:none;
		}		
	}
	@media screen and (max-height:800px){
		#slide-content ul{
			display:none;
		}
	}
	@media screen and (max-width: 1180px){
		#slide-content{
			left:0px;
		}
		#slide-content ul{
			display:none;
		}
	}
	@media screen and (max-width:980px) and (max-height:980px){
		#slide-content{
			top:0px;
			width:100%;
			max-width:480px !important;
		}
		#slide-content br,
		#slide-content p span{
			display:none;
		}
		#slide-content p{
			margin-bottom: 10px;
			line-height: 1.5;
		}
		#slide-content p:first-child{
			margin-bottom: 0px;
		}

	}

	/* Menu basics */

	.sf-menu,
	.sf-menu ul {
		padding: 0;
		margin: 0;
		list-style: none;
		position: relative;
		z-index: 100;
	}
	
	.sf-menu > li { 
		float: left;
		margin-right: 0;
	}

	.sf-menu > li > a {
		position: relative;
		display: block;
		font-weight: 600;
	}
	
	.sf-menu .sf-mega,
	.sf-menu li.dropdown ul {
		position: absolute;
		z-index: 210;
		top: 100%;
		left: 0;
		display: none;
	}
	
	.sf-menu li.dropdown { position: relative; }
	
	.sf-menu li.dropdown ul ul {
		top: -1px;
		left: 100%;
	}
	
	.sf-menu li:hover > .sf-mega,
	.sf-menu li.sfHover > .sf-mega,
	.sf-menu li.dropdown:hover > ul,
	.sf-menu li.dropdown.sfHover > ul { display: block; }

	/* Menu Skin */
	
	.sf-menu { 
		display: flex;
		justify-content: center;
		align-content: center;
		margin:20px auto 10px;
		/*width: 100%;*/
	} 
	
	.sf-menu a {
		display: block;
		font: .875em 'Mulish', sans-serif;
		color: var(--brandColorBlack); 
		text-decoration: none;
	}
	
	.sf-menu > li > a,
	.sf-menu > li.dropdown > a {
		color: var(--brandColorBlack);
		font-size: .875em;
		text-align: center;
		text-transform: uppercase;	
	}
	
	.sf-menu > li > a span,
	.sf-menu > li.dropdown > a span {
		display: inline-block;
		padding: 5px 15px;
		border: 1px solid transparent;
	}
	
	.sf-menu > li a i { margin-right: 5px; }
	
	.sf-menu > li.current > a span{
		color: var(--brandColorBlue);
		text-decoration: underline !important;
	}
	
	.sf-menu > li > a:hover span{ text-decoration: underline !important;}

	/**
 	 * 1. allow long menu items to determine submenu width
 	 */
	
	.sf-menu li.dropdown ul {
		min-width: 210px; /* 1 */
		border: 1px solid #d7d7d7;
		background-color: #fff;			
	}

	.sf-menu > li.dropdown ul { padding: 10px 0; }
	
	.sf-menu li.dropdown ul li a {
		position: relative;
		padding: 10px;
		text-transform: uppercase;
	}
	
	.sf-menu li.dropdown ul li a:before {
		position: relative;
		top: -3px;
		width: 10px;
		height: 10px;
		padding: 2px;
		border: 1px solid transparent;
		border-radius: 50%;
		margin-right: 15px;
		color: #e18f5f;
		font-family: 'FontAwesome';
		font-size: 6px;
		line-height: 6px;
		font-style: normal;
		content: "";
	}
	
	.sf-menu li.dropdown ul li a:hover:before { border-color: #e18f5f; }
	
	.sf-menu li.dropdown ul li a:hover:after {
		position: absolute;
		top: 50%;
		left: 20px;
		width: 10px;
		border-top: 1px solid #e18f5f;
		content: "";
	}
	
	.sf-menu li.dropdown ul li a:hover { color: #e18f5f; }
		
	/* arrows */
	
	/* styling for both css and generated arrows */
	
	.sf-arrows .sf-with-ul:after {
		position: absolute;
		top: 50%;
		right: 0;
		height: 0;
		width: 0;
		/* order of following 3 rules important for fallbacks to work */
		border: 5px solid transparent;
		border-top-color: rgba(0, 0, 0, 0.5);
		margin-top: -3px;
		content: "";
	}
		
	.sf-arrows > li > .sf-with-ul:focus:after,
	.sf-arrows > li:hover > .sf-with-ul:after,
	.sf-arrows > .sfHover > .sf-with-ul:after {
		border-top-color: rgba(0, 0, 0, 0.7); 
	}
	
	/* styling for right-facing arrows */
	
	.sf-arrows ul .sf-with-ul:after {
		border-color: transparent;
		border-left-color: rgba(0 ,0, 0, 0.5);
		margin-top: -5px;
		margin-right: -3px;
	}
	
	.sf-arrows ul li > .sf-with-ul:focus:after,
	.sf-arrows ul li:hover > .sf-with-ul:after,
	.sf-arrows ul .sfHover > .sf-with-ul:after {
		border-left-color: rgba(0, 0, 0, 0.7);
	}
	
	/* Mobile Menu  */
			
	#mobile-menu {
		z-index: 20;
		margin-bottom: 0;
	}
	
	#mobile-menu li {	
		display: block;
		margin: 0;
		background-color: #204473;
	}
	
	#mobile-menu li a small { display: none; }
		
	#mobile-menu > li > ul, 
	#mobile-menu > li > ul > li > ul {
		display: none;
		margin-left: 0;
	}
	
	#mobile-menu li a {
		position: relative;
		display: block;
		padding: 15px 25px 15px 45px;
		border-top: 1px solid #325282;
		color: #fff;
		font-size: 1em;
		text-align: left;
		text-decoration: none;
	}
	
	#mobile-menu ul a { padding-left: 65px; }
	
	#mobile-menu ul li ul a  { padding-left: 65px; }
	
	#mobile-menu .mobile-menu-submenu-arrow {
		position: absolute;
		top: 0;
		right: 0;
		height: 100%;
		width: 70px;
		border-left: 1px solid #325282;
		color: #69675b;
		font-size: 20px;
		line-height: 50px;
		text-align: center;
		cursor: pointer;
	}
	
	#mobile-menu .mobile-menu-submenu-arrow:hover { 
		background-color: #6e7f91;
		color: #fff; 
	}
	
	#mobile-menu li a:hover {background-color: #000000}
	
	#mobile-menu { display: none; }
	
	/* Mobile menu trigger  */
				
	#mobile-menu-trigger { 
		float: right;
		display: none; 
	}	
	#mobile-menu-trigger img{
		width:40px;
		height:40px;
	}	
	.mobile-menu-element{
		display: none; 
	}		
	
/* #Content
   ========================================================================== */
   		
	#content { 
		min-height: 500px; 
		padding-bottom:0px;  
	}

	
	p{
		 line-height: 1.8;
		 text-align: justify;
	}
	p.subtitle{
		color:var(--brandColorGrey);
		text-align: left;
		font-style: italic;
		margin-bottom: 0px;
		font-size:1.2rem;
		line-height:.5;
	}

	.radius-img{
		border:5px solid var(--brandColorSlate);
		border-radius: 30px 0px 30px 0px;
	}

	a.arrow-link{
	  transition: all .3s;
	  display: inline-block;
	  position: relative;
	  text-decoration: none;
	}
	a.arrow-link:after{
		content: url(/images/arrow-link.svg);
		width:15px;
		height:15px;
		position: absolute;
		left:98%;
		top:-3px;
		transform-origin: center;
		transition: rotate 5s;		
		transform: rotate(0deg);
	}
	a.arrow-link:hover{
		color:var(--brandColorSlate);
	}
	a.arrow-link:hover:after {
		left:101%;	
		top:-5px;	
		position: absolute;
		transform-origin: center;
		transform: rotate(45deg);
	}
	.image-half-l:before {
	  background-repeat:no-repeat;
	  background-position: center top;
	  background-size: cover;
	  width: 48%;
	  bottom: 0;
	  content: "";
	  opacity: 1;
	  position: absolute;
	  left: 0;
	  top: 0;
	  background-image:;
	}
	.two-flex {
	  display: flex;
	  flex-direction: row;
	  flex-wrap: nowrap;
	  justify-content: space-between;
	  align-content: center;
	  align-items: center;
	  margin: 0px auto;
	  position: relative;
	}	
	.two-flex .two-flex-mod {
	  -webkit-flex: 0 0 50%;
	  -ms-flex: 0 0 50%;
	  flex: 0 0 50%;
	  position: relative;
	}	
	.two-flex .two-flex-mod img {
	  margin: 50px auto 0px;
	}
    .two-flex-mod-text {
	    padding-left: 20px;
	    padding-right: 8vw;
	}

	.gallery {
	    display: flex;
	    flex-direction: row;
	    flex-wrap: nowrap;
	    width: 100%;
	    xpadding:60px 0px;
	}
	.gallery [class*="span"]{
		flex-grow: 2;
	    width: 50%;
	    max-width: 50%;		
	}
	.gallery img {
	    width: 90%;
	    height: auto; /* use this to display responsive image */
	}
	#categories div.service-topics{
		border:1px solid red;
	}
	#categories b{
		color:var(--brandColorBlue);
		font-size: 1.25em;
		line-height: 1;	
	}

	#bg-living-will{
		background:#f6f6f6 url(/images/estate-planning-paperwork.jpg) no-repeat left center;
		margin:80px 0px;
		padding:50px 0px;
		background-size:45% 100%;
	}
	#bg-entrepreneurs{
		background:#f6f6f6 url(/images/business-entrepreneurs.webp) no-repeat left center;
		margin:80px 0px;
		padding:50px 0px;
		background-size:45% auto;		
	}
	#bg-shaking-hands{
		background:#f6f6f6 url(/images/business-agreement.webp) no-repeat left center;
		margin:80px 0px;
		padding:50px 0px;
		background-size:45% 100%;		
	}	
	#bg-real-estate{
		background:#f6f6f6 url(/images/real-estate-paperwork.webp) no-repeat left center;
		margin:80px 0px;
		padding:50px 0px;
		background-size:45% 100%;		
	}
	#bg-real-estate-search{
		background:#f6f6f6 url(/images/document-search.webp?version=214) no-repeat left center;
		margin:80px 0px;
		padding:50px 0px;
		background-size:45% 100%;	
	}	
	#bg-man-rutter{
		background:#f6f6f6 url(/images/man-rutter-bg.jpg) no-repeat left center;
		margin:0px;
		padding:0px 0px 50px;
		background-size:cover;		
	}

	@media screen and (max-width:1480px){
		#bg-living-will,
		#bg-entrepreneurs,
		#bg-real-estate,
		#bg-shaking-hands,
		#bg-real-estate-search{
			background-image:none;
		}
	}
	@media screen and (max-width:1280px){
		#bg-living-will{
			xpadding:50px 0;
		}		
		.gallery{
			max-width: 85vw;
    		margin: 0px auto;
			flex-direction:column;
		}
		.gallery [class*="span"]{
		    width: 100%;
		    max-width: 100%;		
		}
		.gallery [class*="span"]:first-child{
			display:flex;
			margin-bottom:30px;
		}
		.gallery img {
		  width: 100%;
		}
		#categories .row-fluid [class*="span"],
		#bg-living-will [class*="span"],
		#bg-entrepreneurs [class*="span"],
		#bg-real-estate [class*="span"],
		#bg-real-estate-search [class*="span"],
		#bg-shaking-hands [class*="span"],
		#bg-7 [class*="span"],
		#bg-8 [class*="span"]{
			float:none;
			margin-left:0px;
			width:100%;
			display:block;

		}
		#bg-living-will img,
		#bg-entrepreneurs img,
		#bg-real-estate img,
		#bg-real-estate-search img,
		#bg-shaking-hands img{
			margin-bottom:40px;
		}
	}
	@media screen and (max-width:1080px){
		.intro-w-image [class*="span"]{
			float:none;
			margin-left:0px;
			width:100%;
			display:block;
		}

	}

	/* Page Header */
	
	#page-header {
		position: relative;
		height:350px;
		background:url(/images/page-header.jpg) no-repeat center center;
		background-size: cover;
		margin-bottom:50px;
	}
	
	#page-header h3 {
		margin-top: 100px;
		margin-bottom: 0;
		line-height: 1;
	}

	.vertical-middle{
		display:flex;
		align-items: center;
		height:100px;
	}
	@media screen and (max-width:1480px){
		#bg-living-will,
		#bg-entrepreneurs,
		#bg-real-estate,
		#bg-shaking-hands,
		#bg-real-estate-search{
			margin:40px 0 !important;
		}
	}	
	@media screen and (max-width:1440px){
		#page-header {
			position: relative;
			height:250px;			
			margin-bottom:30px;
		}
		#page-header h3 {
		  margin-top: 60px;
		  font-size: 2.125em;
		}		
	}

	@media screen and (max-width:1280px){
		.hidden-spacer{
			display:none !important;
		}
	}
	@media screen and (max-width:980px){
		#page-header {
			position: relative;
			height:150px;
		}
		 #page-header h3 {
		    margin-top: 50px;
		 }
	}	

		
/* #Forms
   ========================================================================== */	

	.input100 {
    	width: 100% !important;
	}
	.input75 {
	    width: 75% !important;
	}
	.input50 {
	    width: 50% !important;
	}
	.input25 {
	    width: 25% !important;
	}
	.required{
		color:#ff0000;
	}
	#contact-form .check-groups{display:block;text-align: left;}
	#contact-form .check-groups ul{
		width:100%;
		list-style-type: none;
	}
	#contact-form .check input[type="checkbox"], 
	#contact-form .check input[type="radio"]{float:left;display:inline;margin-top:5px;margin-right:10px;margin-left:0px;padding-left:0px;}

	#contact-form{box-sizing: border-box;}
	#contact-form h5{margin-bottom:15px;}
	#contact-form ul{list-style:none;margin-left:0px !important;margin-bottom: 0px !important;display:table;}
	#contact-form ol{padding-left:15px;}

	#contact-form li{margin-bottom: 5px !important;margin-left:0px !important;border:1px solid transparent;}
	#contact-form li span{display:block !important;border:1px solid transparent;}
	#contact-form .row-fluid{margin-bottom:5px;}

	#contact-form .check-groups input{display:inline;}
	#contact-form .check-groups input:first-child{margin-left:0px !important;}
	#contact-form .inline-input{display:inline !important;}
	#contact-form .label-inline{padding-right:0px !important;}

	#contact-form .row, #contact-form .row-fluid{margin-bottom:12px;}
	#contact-form .row.row div{margin-bottom:0px !important;}

	#contact-form .inline-all label, 
	.inline-all input{display:inline-block !important;vertical-align: middle}
	#contact-form .inline-all label{width:50%;text-align: left}
	#contact-form .hr{margin: 15px 0;}



/* #Footer
   ========================================================================== */		
		
	#footer {position: relative;}
	#footer-top{
		position: relative;
		height:20px;
		background-color: #f6f6f6;
	}
	#footer-middle{
		padding-top:120px;
		font-size:.875em;
		color:var(--brandColorSlate);
	}
	#footer-middle li a{
		color:var(--brandColorSlate);
	}
	#footer-middle ul{
		font-weight: 600;
		list-style-type: none;
	}
	#footer-middle h6{
		font-family: 'Playfair BoldIt', serif;
		color:var(--brandColorBlue);
		text-transform: uppercase;
		margin-bottom: 10px;
	}
	.footer-contact{
		display: flex;
		flex-direction: column;
	}
	.footer-contact div{
		display: flex;
		flex-direction: row;
		margin-bottom: 10px;		
	}
	.footer-contact span:first-child{
		width:130px;
	}
	.footer-contact span:nth-child(2){
		font-weight:700;
		color:var(--brandColorBlack);
	}
	.footer-socials *{
		display:inline-block;
	}
	.footer-socials h6{margin-right:15px}
	.footer-socials a{
		margin:20px 10px 10px 0px;
		color:var(--borderColor) !important;
	}
	#footer-logo{
		 max-width:440px;
		 display:flex;
		 flex-direction: column;
		 align-content:center;
		 align-items: center;
		 margin-top:30px;
	}
	#footer-logo img{
		margin-bottom: 10px;
	}
	#footer-cite {
		padding: 10px 0 5px;
		background-color: var(--brandColorBlue);
		color: #e4e4e4;
		font-size:.75em;
	}
	#footer-cite a{
		color: #e4e4e4;
	}
	#keywords{
		margin: 20px 0px 30px;
	}

/* ==========================================================================
   #Page Styles
   ========================================================================== */


/* #About
   ========================================================================== */

   .flex-widescreen{
   		position: relative;
   		display:flex;
   		flex-flow: row nowrap;
   		justify-content: center;
   		align-items: center;
   }
   .flex-widescreen-cellgroup-1,
   .flex-widescreen-cellgroup-2{
   		position: relative;
   		width:100%;
   }
   .flex-widescreen-cell-1{
   		position: relative;
   		width:100%;
   }

	@media screen and (max-width:1780px){
		#bg-2 .span1{
			display:none !important;
		}
		#bg-2 .span10 .span6{
			width:55%;
			xborder:1px border blue;
		}
		#bg-2 .span10{
			width:100%;
			float:none;
			margin-left:0px;
			xborder:1px solid red;
		}		
   }
   @media screen and (max-width:1180px){
		#bg-2 .span10,
		#bg-2 .span5{
			width:100%;
			float:none;
			margin-left:0px;
		}
		#bg-2 .span5 .text-right{
			text-align: left;
		}
	   #bg-2 .row-fluid:first-child [class*="span"]{
	   	display: block;
	   	float:none;
	   	width:100%;
	   	margin-left:0px;
	   }
	   #bg-2 .img-align-center{
	   	margin-top:0px;
	   }
   }



/* #Practice Areas
   ========================================================================== */
   .service{
   	display:flex;
   	flex-direction: column;
   }
   .service-item{
   	display:flex;
   	color:var(--brandColorSlate);
		xborder:1px solid green;
   }
   .service-element:nth-child(1){
   	flex:0 0 55%;
   	padding-right:80px;
   	xborder:1px solid red;
   }
   .service-topics{
   	display:flex;
   	justify-content: space-between;
   }

   .service-item h5{
   	margin-bottom: 15px;
   }
   .service-item ul{
   		position: relative;
	   	flex:1 1 auto;
	   	list-style-type: none;
	   	font-weight:700;
	   	margin-bottom: 30px;
	   	color:var(--brandColorBlack);
   }

   .service-item ul li,
   .service-item ul li a{
   		position: relative;
   		margin-bottom: 5px;
   }
    .service-item ul:nth-child(2){
    	margin-left:40px;
    }

   #bg-4 .row-fluid{
   		display: flex;
   		flex-wrap: wrap;
   		justify-content:center;
   }
   .practice-area{
   		flex: 0 0 33%;
   		max-width:370px;
   }
   .practice-area:nth-child(2){
   		margin:0px 20px;
   }
   .practice-area:last-child{
   		margin-left:20px;
   }

   #bg-5 .service-topics,
   #bg-7 .service-topics{
   	display:flex;
   	justify-content: center;
   	max-width: 80vw;
   	margin:0px auto;
   }   
   #bg-5 .service-item ul,
   #bg-7 .service-item ul{
	   	flex:1 1 100%;
	   	list-style-type: none;
	   	font-weight:700;
	   	margin-bottom: 0px;
	   	color:var(--brandColorBlack) !important;
	   	padding:0px 40px;
   }
   #bg-7 ul{
   		color:var(--brandColorBlack) !important;
   		font-weight:700;
   }
   #bg-5 .service-item ul.fill-circle,
   #bg-7 .service-item ul.check{
   		margin-left: 0px;
   }  
     
    @media (max-width: 1366px) {
	    .practice-area{
	   		margin:0px 20px !important;
	    }
	    .practice-area:last-child{
	   		xmargin-left:20px;
	    }   		
	}
	@media (max-width: 1180px) {
		.practice-area{
   			flex: 0 0 48%;
   			max-width:auto;
   		}
		.service-item ul{
			flex:1 1 auto;
			margin-bottom:0px;
		}
		.service-topics{
			flex-direction: column;
			xborder:1px solid red;
		}
	    .service-item ul:nth-child(2){
	    	margin-left:0px;
	    }	
	   .service-contact{
	   		margin-top:20px;
	   }
	   .service-item ul li{
	   		line-height: 1.5;
	   }	

	}
	@media screen and (max-width:980px){
		.practice-area{
   			flex: 0 0 90%;
   			max-width:auto;
   		}
   		#bg-4 {
		    padding: 80px 0 80px 0;
		  }   		
	}
	@media screen and (max-width:768px){
		.service{
			flex-wrap: wrap;
		}
		.service-item{
			display:block;
		}
		.tabs-container .tabs{
			min-height: 1px;
		}
		.service-element:nth-child(1){
			flex: 0 0 100%;
			padding-right:0px;
		}
		.practice-area{
   			flex: 0 0 100%;
   		}
   		#bg-5 .service-item ul, #bg-7 .service-item ul{
   			padding: 0px 10px;
   		}

	}
   
/* #History - News
   ========================================================================== */

	.split-screen{
		position: relative;
		height:100%;
		min-height:670px;
		overflow: hidden;
		clear:both;
		box-sizing: border-box;
	}
	.split {
		min-height:670px;
	  	height: 100%;
	  	width: 50%;
	  	position: relative;
	  	float:left;
	  	z-index: 1;
	  	top: 0;
	  	bottom:0;
		box-sizing: border-box;
		padding:80px 0px 60px 50px;
		xoverflow: visible;
	}

	.history {
	  left: 0;
	  background:#dce5ee url(/images/bg-history.jpg) no-repeat bottom left;
	  color:var(--brandColorBlack);
	  font-weight: 600;
	  line-height: 1.1;
	}

	.news {
	  right:0;
	  background:transparent url(/images/bg-news.png) no-repeat;
	  background-position:110% 100%;
	  background-size: 70%;
	  height:100%;
	}

	.split-content {
	  min-height: 600px;
	  position: relative;
	}
	.split-screen h3,
	#team h3{
		font-size: 1.875em;
		margin-bottom: 30px;
	}

	.history-item{
		display: flex;
		flex-direction: column;
		width:85%;
		margin-bottom: 20px;
	}
	.history-year-title{
		position: relative;
		font-size: 1.375em;
		line-height: 1.8;
		font-weight:700;
		color:var(--brandColorBlack);
	}
	.history-year-title:before{
		position: absolute;
		left:-30px;
		content: "\2014";
		width:30px;
		color:var(--brandColorWhite);
	}
	.history-year-title span{
		color:var(--brandColorBlue);
	}
	.history-summary p,.news-summary p
	{
		font-weight:700;
		line-height: 1.4 !important;
		margin-bottom: 10px;
	}

	.news-item{
		padding-bottom:20px;
		margin-bottom: 20px;
		margin-top:10px;
	}
	.news-item{
		border-bottom:2px solid var(--borderColor2);
	}
	.news-item:last-child{
		border-bottom:none !important;
		margin-bottom:0px;
	}
	.news-date{
		font-size: 0.875em;
		color:var(--brandColorGrey);
		line-height: .875;
		margin-bottom:10px;
	}
	.news-date-details{
		font-size: 1em;
		color:var(--brandColorGrey);
		line-height: 1.2;
		margin-bottom:15px;
	}
	.news-title{
		font-size: 1.375em;
		line-height: 1.3;
		font-weight:700;
		margin-bottom:5px;
		color:var(--brandColorBlack);
	}
	.news-summary{
		color:var(--brandColorSlate);
	}
	.read-more{
		color:var(--primaryText) !important;
		font-weight:700;
		font-size: .875em;
	}
	.read-more:hover{
		color:var(--brandColorSlate) !important;
		text-decoration: none;
	}
	.vert-truncate {
	  text-overflow: ellipsis;
	  -o-text-overflow: ellipsis;
	  overflow: hidden;
	  xmax-height: 50px;
	  display: -webkit-box;
	  -webkit-line-clamp:5;
	  -webkit-box-orient: vertical;
	  position: relative;
	}

/** News Detail page **/
	#news-details h4,
	#news-details h5{
		margin-bottom: 0px;
	}
	#news-details h3{
		font-size:1.8em !important;
		margin-bottom: 30px;
	}
	#news-details h5{
		margin-bottom: 0px;
		text-decoration: underline;
	}
	
	#news-details ul{
		list-style-position:outside ;
		margin-left:40px;
	}
	#news-details ul br{
		display:none;
	}
	#news-details ul li{
		margin-bottom: 10px;
	}
	#news-details a{
		color:var(--brandColorBlue);
		font-weight: 700;
	}

	@media screen and (max-width:1400px){
		.split-content .hidden-spacer{
			display:none;
		}
		.split-screen .span8{
			width:80%;
			margin-left: 15%;
		}
		.history-item{
			width: 95%;
		}		
	}
	@media screen and (max-width:1280px){
		.split-screen,.split-content{
			min-height:auto !important;
		}
		.split-screen .span8,
		.split .row-fluid [class*="span"]:first-child{
			width:80%;
			margin:0px auto;
		}
		.split-screen .split{
			float:none;
			width:100%;
			min-height:auto !important;
			padding: 50px 0px 30px 0px;
		}
		.split .row-fluid [class*="span"]{
			float:none;
		}
		.footer-contact div{
			flex-wrap: wrap;
		}

	}

      
/* #Team
   ========================================================================== */
	#team{
		text-align: center;
		padding:20px 0px 40px;
	}
	#collections{
		display: flex;
		justify-content:space-between;
		flex-wrap: wrap;
	}	
	.team,
	.team2{
		display: flex;
		justify-content: center;
	}
	.team div{
		width:200px;
		margin:0px 60px;
		border-radius: 30px 0px 30px 0px;
	}
	.team h6,.team2 h6, .collection-member h6{
		font-family: 'Playfair Bold', serif;
	}
	.team h6 span,.team2 h6 span{
		font-size:16px;
		color:var(--brandColorBlue);
	}	
	.team img{
		height:auto;
		border-radius: 30px 0px 30px 0px;
		margin-bottom: 10px;
		border:3px solid var(--brandColorSlate);
	}

	.team2 img{
		max-width: 400px;
		margin:0px 80px;
		margin-bottom: 10px;
		border-radius: 30px 0px 30px 0px;
		border:3px solid var(--brandColorSlate);
	}

	.collection-member{
		display: flex;
		flex-direction: row;
		flex: 0 0 45%;
		margin-bottom: 40px;
		background-color:#fff;	
		border-radius: 30px 0px 30px 0px;
		border:3px solid var(--brandColorSlate);
		overflow: hidden;
	}
	.collection-member div{
		padding:40px 40px 20px 10px;
		margin-left:30px;
		box-sizing: border-box;
	}
	.collection-member p{
		line-height: 1.4;
		color:var(--brandColorSlate);
	}
	.collection-member h6{
		margin-bottom: 20px;
	}
	.collection-member h6 span{
		color:var(--brandColorBlue);
	}
	@media screen and (max-width:1366px){

		.collection-member div{
			padding:40px;
			margin-left:0px;
			height:auto;
		}	
		.collection-member p{
			text-align: left;
			font-size: 1.2em;
		}	
		.collection-member{
			display: flex;
			flex-direction: row;
			flex: 0 0 100%;
		}
		.collection-member img {
		  display: block;
		  margin-bottom: -80px !important;
		}
	}
	@media screen and (max-width:1180px){
		.team div{
			margin: 0px 40px;
		}
		.service-contact h4 {
		  font-size: 1.5em;
		  margin-bottom:0px;
		}

		.team2 img{
			margin: 0px 40px;
		}

	}
	@media screen and (max-width:980px){
		.team2 div:nth-child(2){
			order:-1;
		}
		.team2,.team{
			flex-wrap: wrap;
		}	
		.team div,.team2 div{
			margin: 20px;
			
		}

	}
	@media screen and (max-width:768px){
		.collection-member{
			display: flex;
			flex-direction:column;
			flex: 0 0 100%;
		}
		.team div{
			width:90%;
			margin:0px 40px 50px;
			border-radius: 30px 0px 30px 0px;
		}		
	}

/* #CONTACT
   ========================================================================== */

	#contact-form{
		margin:20px auto 0px;
		width:50vw;
		max-width:800px;
	}

	@media screen and (max-width: 1280px) {
		#contact-form{
			margin:20px auto 0px;
			width:80vw;
		}
	}

	@media screen and (max-width: 768px) {
		#contact-form{
			margin:20px auto 0px;
			width:100vw;
		}
		#contact-form [class*="span"]{
			width:100%;
			float:none;
			margin-left:0px;
		}
		#contact-form input, 
		#contact-form select{
			padding: 15px 8px;
			height:auto;
			font: 16px Arial, sans-serif;
		}
		#contact-form input.btn-large{
			font-size:20px !important;
			padding: 15px 30px !important;
		}
		body{
			font-size:18px;
		}
		p{
			line-height: 1.6;
		}

	}	

/* ==========================================================================
   #Responsive
   ========================================================================== */

   
/* #Large Display
   ========================================================================== */

	@media screen and  (min-width: 1400px) {
		
		.sf-menu > li { margin-right: 10px; }
		.sf-menu > li:last-child { margin-right: 0; }
		
	}

/* #Smaller then 1080px width
   ========================================================================== */
	@media screen and (max-width: 1080px) {
		#menu, #topnav,#contact-callout  div:nth-child(2){ display: none; }
		
		#mobile-menu-trigger { 
			margin-top:0px;
			display: flex;
		}

		#logo{
			margin-top:0px;
		}	
		#logo img{
			margin-top:0px;
			max-width: 350px;
		}
		#contact-callout{
			margin-top:5px;
		}
		header{
			height:auto;
			padding:0px;
		}
		#header{
			box-sizing: border-box;
			padding:10px 0px;
		}	

		   .collection-member img{
		   	margin-bottom:0px !important;
		   }
	}
	@media screen and (max-width: 980px) {
		.intro-w-image{
			padding-bottom: 50px !important;
		}
		.row-fluid [class*="span"]{
			xborder:1px solid red;
		}
		#footer h6{font-size:1em;margin-right:15px}
		
		.footer-socials a{
			margin:10px 10px 0px 0px;
		}
		#footer-logo img{
			margin-bottom: 10px;
		}
		#footer-middle .row-fluid [class*="span"],
		#footer-cite .row-fluid [class*="span"]{
			float:none;
			margin-left: 0px;
			width:100%;
		}
		#footer-middle .row-fluid p{
			margin-bottom: 0px;
		}
		.vertical-middle{
			height:auto;
		}
	  	#logo img {
	    	margin-top: 0px;
	    	max-width: 250px;
	  	}
	  	p{
	  		text-align: left;
	  	}

		h3{
			font-size: 2.125em;
		}
		h4{
			font-size: 1.5em;
		}
		h5{
			font-size: 1em;
		}	
		#footer-middle {
		  padding-top: 40px;
		  padding-bottom:30px;
		}
		#footer-middle #keywords{
			display:none;
		}	 
		#footer-logo {
		  max-width: 350px;
		} 
	}


	
/* #Mobile (Portrait and Landscape )
   ========================================================================== */
	
	@media screen and (max-width: 767px) {
	
		body { 
			background: none; 
			background-color: #fff; 
		}
		#mobile-menu-trigger { position:absolute;top:15px;right:30px; }

		#contact-callout div:first-child a{
			margin:0px 40px 0px 0px;
			font-size:1.2em;
			line-height: 1;		
		}
		#header{
			flex-direction: column;
		}
		.header-item:first-child{
			margin-bottom: 10px;
		}

		.row, .row-fluid { padding: 0 20px; }
		
		.row .row,
		.row-fluid  .row-fluid { 
			width: auto; 
			padding: 0; 
			margin: 0; 
		}
		
		p.last, 
		h1.last, 
		h2.last, 
		h3.last, 
		h4.last, 
		h5.last, 
		address.last, 
		ul.last, 
		ol.last { margin-bottom: 10px; }
		
		.text-right{ text-align: left; }

	}
	
/* #Mobile ( Landscape )
  ========================================================================== */

	@media screen and (max-width: 600px) {

		#slide-content{
			left:0;
		}
		#page-header {
			background:url(/images/page-header.jpg) no-repeat right center;
			background-size: cover;
		}
		h3 {
	    font-size:1.9em;
	   }
	   p.subtitle{
	   	font-size:.975rem;
	   }
	    #slide-content p{
   	  		display:none;
   	  	}
   	  	  #bg-1 {
		    height: 25vh;
		  }
	}	

/* #Mobile ( Portrait )
  ========================================================================== */
  	@media screen and (max-width: 480px) {
		 #logo img {
		    margin-top: 0px;
		    max-width: 180px;
		  }
		.row, .row-fluid { padding: 0 20px; }

		#content ul li{text-align: left !important;}

		#mobile-menu-trigger { top:10px;right:15px}

		.text-right { text-align: left; }
		.text-center { text-align: left; }  
		#content p{text-align: left !important}		
		.practice-area {
		    margin: 0px 0px !important;
		}
		#bg-4 .icon-box-3 ul li{
		 	font-size:.875em;
		 	line-height: 1.6;
		 }
		#bg-4 .icon-box-3{
		 	min-height: 100px;
		 }
		#bg-4 a {
			text-decoration: underline;
		}
		#bg-4 a.arrow-link:after,
		#bg-4 .hidden{
		 	display:none;
		 }
		 #bg-4 .icon-box-3 div ul {
		  text-align: left;
		  margin: 20px 10px 10px 10px;
		}		
		.toggle-item-toggle strong{
			padding-right:40px !important;
		}
  	}
  	@media screen and (max-width:420px){
  		 #slide-content p{
   	  		display:none;
   	  	}  		
  		#slide-content .btn{
  			text-align: center;
  			display:block;
  			margin-left:0px;
  		}
  		#bg-1 {
		    height: 32vh;
		  }
		 #bg-4 .row-fluid{
		 	padding:0px !important;
		 }

  	}
  	@media screen and (max-width:330px){
  		#bg-1 {
		    height: 34vh;
		  }
  	}