/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */
	
/* Color Scheme
==================================================

.BLUE {color: #0079C2}
.SILVER {color: #A7A9AC}
.WHITE {color: #FFFFFF}

	
*/

/* #Site Styles
================================================== */

* { -moz-box-sizing: border-box; 	-webkit-box-sizing: border-box; box-sizing: border-box; 	}

img {max-width: 100%;}

html{height:100%}




/* sticky header - home
================================================== */
div.header {position: fixed;top: 0;left: 0;width: 100%;padding: 0;z-index: 10000;transition: all 0.2s ease-in-out;height: auto;background: rgba(255, 255, 255, 0.75);line-height: 40px; -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 1.0); -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);}
div.header.active {background: rgba(255, 255, 255, 1.00);  -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 1.0); -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);}

/* # bands / containers - 
================================================== */

.band {padding: 0; margin:0}
.navigation { padding: 0 0; background:white }
.logo p {margin:15px 0 0 0}

/* # about section
================================================== */

div.about {padding:150px 0 50px 0; background:  #A7A9AC; margin-bottom:300px }
div.about p {color:#FFF; font-size: 22px; line-height:30px}
div.about h1 {text-align:center; color:white}

/* # attorney-bio section
================================================== */

div.attorney-bio {padding:175px 0 50px 0; background:  #FFF;  }
div.attorney-bio p { }
div.attorney-bio h1 {color: #0079C2; text-transform:none;}

div.attorney-bio .bio-sidebar img {margin-bottom:20px}
div.attorney-bio .bio-sidebar p {margin:0}
div.attorney-bio .bio-sidebar i {margin-right:8px}


/* # attorneys section
================================================== */
div.attorneys {padding:120px 0 50px 0; background:  #EDEDED; margin-bottom:0; }
div.attorneys p {color:#FFF; font-size: 22px; line-height:30px}
div.attorneys h1 {text-align:center; color:#0079C2}

.callout {background:#F7F7F7; padding: 50px; color:#0079C2; font-size: 24px; line-height: 32px; text-align:center; border: 1px solid #CCC}

/* # split screen - hero image
================================================== */

.split-screen {  width: 100%; height:800px;}
.split-screen article { position: relative; top: 55%;left: 50%;transform: translate(-50%, -50%); }
section.split-screen .left-half {  background: rgba(0, 121, 194, 0.80);  float: left;  width: 40%;  height:100%}
section.split-screen .right-half {background: transparent; float: left;  width: 60%; height:100%}

.text-container {padding: 30px 0; width:75%; margin: 0 0 0 20%}
.text-container h1 {  color:white}
p.subtext {color:white; font-size: 22px; line-height:30px}



/* # practice areas section 40/60 boxes home page
================================================== */

@media  (min-width: 500px) {
	
.flex-container {
width: 100%;
padding-top:100px;
min-height:570px;
display: -webkit-flex; /* Safari */		
display: flex; /* Standard syntax */
}

.flex-container-footer {
width: 100%;
padding-top:150px;
min-height:470px;
display: -webkit-flex; /* Safari */		
display: flex; /* Standard syntax */
}

.column-40 {
width:40%;
-webkit-flex: 1; /* Safari */
-ms-flex: 1; /* IE 10 */
flex: 1; /* Standard syntax */
}

.bg-option-1 {background: rgba(0, 121, 194, 1.00);}
.bg-option-2 {background: rgba(255, 255, 255, 1.00); }
.bg-option-3 {background: rgba(0, 121, 194, 0.70);}


.column-40 .padding {padding: 150px 60px 80px 0px}
.column-40 p {margin-bottom:10px; text-align:right}
.column-40 h2 {color:#FFF; text-align:right; font-size: 36px; text-transform: uppercase; line-height: 44px;}

.column-60 {width:60%;}
.column-60  .padding {padding: 80px 50px 80px 50px}
.column-60  h3 {color: #0079C2; font-size: 16px; text-transform:uppercase}

.bottom .column-40 .padding {padding: 100px 60px 80px 80px}
.bottom .column-60  .padding {padding: 105px 50px 80px 50px}
.bottom .column-60  h3 {color: #FFF; font-size: 16px; text-transform:uppercase; text-align:left}
.bottom .column-60 address, .bottom .column-60 p {text-align:left; color:white}
 }
 

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 499px) {
	
.flex-container {
width: 100%;
}

column-40 {
width:100%;
color:white; 

}

.column-40 .padding {padding: 50px 0 30px 0}
.column-40 h2 {color:#FFF; text-align:center}

.column-60 {width:100%; text-align:center; background:white; height:750px }
.column-60 .padding {padding: 80px 10px 50px 10px}
.column-60 h3 {font-size: 20px; color: #0079C2;}
.column-60 p {text-align:center}

.bg-option-1 {background: rgba(0, 121, 194, 1.00);}
.bg-option-2 {background: white }

 }

/* page bottom
================================================== */

.bottom {background: url("http://www.farnanlaw.com/images/bg/shutterstock_333083990.jpg") no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; padding: 80px 0 80px 0; text-align:left; color:white }

.bottom h2 {color:white; color:#FFF; text-align:left; font-size: 36px; text-transform: uppercase; line-height: 44px}
.bottom h3 {color:white; text-transfrom:uppercase; font-size: 16px}

.bottom address {margin-bottom:0px; font-style:normal}
.bottom hr {border-top: 1px solid #FFF; }
.band.bottom a {color:#9DACB9; text-decoration: underline; font-size: 13px}
.band.bottom a:hover {color:#FFF; text-decoration:none;  font-size: 13px}






.section-title {
  font-size: 40px;
  color: #000;
  text-transform: uppercase;
  position: relative;
  padding-bottom: 40px;
  margin: 0 0 50px 0;
}
.section-title:before {
  content: "";
  position: absolute;
  width: 140px;
  bottom: 0;
  left: 50%;
  margin-left: -70px;
  height: 1px;
  background: #0079C2;
}
.section-title:after {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  bottom: -14px;
  left: 50%;
  margin-left: -12px;
  border: 5px solid #fff;
  border-radius: 20px;
  background: #0079C2;
}

.column-title {
  margin-top: 0;
  padding-bottom: 15px;
  border-bottom: 2px solid #DDD;
  margin-bottom: 15px;
  position: relative;
}
.column-title:after {
  content: " ";
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 50%;
  border-bottom: 2px solid #000;
}

/* misc
================================================== */

address {padding-bottom:10px; margin-bottom: 10px; font-style:normal}
.margin-top-zero {margin-top:0; }
.center {text-align:center}
.mobile-only {display:none}
i {margin-right:6px}




/* call now button - footer
================================================== */
#callnowbutton {display:none;} 
@media screen and (max-width:650px){
#callnowbutton {display:block; background:#e19927; width:100%;position:fixed; bottom:0; text-decoration:none;  z-index:9999; padding: 10px 5px; border-top: 1px solid #FFF}
#callnowbutton p {margin:0; text-align: center; color:white; font-size: 18px; text-transform:uppercase}
#callnowbutton p a {color:white; text-decoration:none}
#callnowbutton p a:hover {color:white; text-decoration:none}
#callnowbutton i {color:white}
}


/* responsive google map 
================================================== */
iframe, object, embed {max-width: 100%;}


/* #navigation
================================================== */

nav.primary ul {float:right; font-family: 'Open Sans', sans-serif; font-weight:400; margin: 45px 0 0 0; text-align:center; }
nav.primary ul li {	 }
nav.primary select {	display: none;	width:  100%;	margin:0;}
nav.primary ul li {	display: inline;	text-align:left;	position: relative;}
nav.primary ul li a {display: inline-block;padding:  0px 20px ;color: #858585;font-size:16px;text-transform: uppercase;text-decoration: none; border-right: 1px solid #c4e9ff}
nav.primary ul li a:hover {color:333}
nav.primary ul li:hover > a{ color:#333}

/*selected tabs*/



/*active links / pages*/
#home ul li a.home { }
#about ul li a.about { background:#FFF; color:#8E793E; }
#gun-rights ul li a.gun-rights { }
#blog ul li a.blog { background:#FFF; color:#8E793E; }
#contact ul li a.contact { background:#FFF; color:#8E793E; }




/*drop down menu*/

nav.primary ul ul {opacity: 0; filter: alpha(opacity=0);position: absolute;top:100%;left: 0;z-index: 999;background: #8E793E;margin-top:11px;padding-left:0px;height: 0px;overflow: hidden;	width: 257.5px;}
nav.primary ul li span {display: none;}
nav.primary ul li:hover ul {opacity: 10; filter: alpha(opacity=100); height: auto;overflow: auto; }
nav.primary ul ul li {display: list-item;list-style-type: none;border-bottom: 1px solid #806d38;text-align:left; margin:0; line-height: 24px}
nav.primary ul ul li a {display: block;text-transform: none;color:#FFF; padding:  6px 12px ; font-weight:400}
nav.primary ul ul li a:hover {border-bottom: 0;background:#AD974F;color:#FFF;}



/* #Media Queries
================================================== */



/* iPad  Landscape */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {

div.header {position:relative; }

nav.primary ul {margin:15px 0 0 0;}
nav.primary ul li a {padding:  6px 15px ;font-size:16px;text-transform: none;text-decoration: none; }

.split-screen {  width: 100%; height:400px;}
.split-screen article { position: relative; top: 50%;left: 50%;transform: translate(-50%, -50%); }
section.split-screen .left-half {  background: rgba(0, 121, 194, 0.80);  float: none;  width: 100%;  height:100%}
section.split-screen .right-half {background: transparent; float: none;  width: 100%; height:100%}	

.text-container {padding: 30px 50px; width:100%; margin: 0 0 0 0}
.text-container h1 {  color:white; text-align:center}
p.subtext {color:white; font-size: 22px; line-height:30px; text-align:center}


}

/* iPad  Portrait */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) { 

div.header {position:relative; }
.logo p {text-align:center; margin:10px 0 0 0}

.navigation {padding:20px 0 20px 0}
nav.primary select {display: block; margin: 0 0 15px 0; }
nav.primary ul {display: none;}

.split-screen {  width: 100%; height:400px;}
.split-screen article { position: relative; top: 50%;left: 50%;transform: translate(-50%, -50%); }
section.split-screen .left-half {  background: rgba(0, 121, 194, 0.80);  float: none;  width: 100%;  height:100%}
section.split-screen .right-half {background: transparent; float: none;  width: 100%; height:100%}	

.text-container {padding: 30px 50px; width:100%; margin: 0 0 0 0}
.text-container h1 {  color:white; text-align:center}
p.subtext {color:white; font-size: 22px; line-height:30px; text-align:center}

.bottom, .bottom h2, .bottom h3, .bottom address, .bottom p {text-align:center}


 }
 




/* Mobile Landscape Size to Tablet Portrait (devices and browsers) mobile landscape 480x320, small tablet portrait 600x800*/
@media only screen and (min-width: 480px) and (max-width: 767px) {
	
div.header {position:relative}
.logo p {text-align:center; margin:0 0 20px 0}

.navigation {padding:20px 0 20px 0}
nav.primary select {display: block; margin: 0 0 15px 0; }
nav.primary ul {display: none;}

.split-screen {  width: 100%; height:600px;}
.split-screen article { position: relative; top: 50%;left: 50%;transform: translate(-50%, -50%); }
section.split-screen .left-half {  background: rgba(0, 121, 194, 0.80);  float: none;  width: 100%;  height:100%}
section.split-screen .right-half {background: transparent; float: none;  width: 100%; height:100%}		

.mobile-only {display:block}	
.desktop-only {display:none}	
div.attorney-bio {padding:80px 0 50px 0; background:  #FFF;  }
div.attorney-bio h1 {color: #0079C2; text-transform:none; font-size: 22px; text-align:center}
.bio-sidebar {margin-bottom: 30px}

div.attorney-bio .bio-sidebar {text-align:center}
div.attorney-bio .bio-sidebar img {margin-bottom:20px}
div.attorney-bio .bio-sidebar p {margin:0}
div.attorney-bio .bio-sidebar i {margin-right:2px}


.bottom, .bottom h2, .bottom h3, .bottom address, .bottom p {text-align:center}

}










/* iPhone 6 Plus - Portrait & Landscape*/
@media only screen 
and (min-device-width : 414px) 
and (max-device-width : 736px) { 
	
div.header {position:relative}
.logo p {text-align:center; margin:0 0 20px 0}

.navigation {padding:20px 0 20px 0}
nav.primary select {display: block; margin: 0 0 15px 0; }
nav.primary ul {display: none;}

.split-screen {  width: 100%; height:600px;}
.split-screen article { position: relative; top: 50%;left: 50%;transform: translate(-50%, -50%); }
section.split-screen .left-half {  background: rgba(0, 121, 194, 0.80);  float: none;  width: 100%;  height:100%}
section.split-screen .right-half {background: transparent; float: none;  width: 100%; height:100%}		

.mobile-only {display:block}	
.desktop-only {display:none}	
div.attorney-bio {padding:80px 0 50px 0; background:  #FFF;  }
div.attorney-bio h1 {color: #0079C2; text-transform:none; font-size: 22px; text-align:center}
.bio-sidebar {margin-bottom: 30px}

div.attorney-bio .bio-sidebar {text-align:center}
div.attorney-bio .bio-sidebar img {margin-bottom:20px}
div.attorney-bio .bio-sidebar p {margin:0}
div.attorney-bio .bio-sidebar i {margin-right:2px}


.bottom, .bottom h2, .bottom h3, .bottom address, .bottom p {text-align:center}


}



/* iPhone 6 - Portrait & Landscape*/
@media only screen 
and (min-device-width : 0px) 
and (max-device-width : 667px) { 
	
div.header {position:relative}
.logo p {text-align:center; margin:0 0 20px 0}

.navigation {padding:20px 0 20px 0}
nav.primary select {display: block; margin: 0 0 15px 0; }
nav.primary ul {display: none;}

.split-screen {  width: 100%; height:600px;}
.split-screen article { position: relative; top: 50%;left: 50%;transform: translate(-50%, -50%); }
section.split-screen .left-half {  background: rgba(0, 121, 194, 0.80);  float: none;  width: 100%;  height:100%}
section.split-screen .right-half {background: transparent; float: none;  width: 100%; height:100%}		

.mobile-only {display:block}	
.desktop-only {display:none}	
div.attorney-bio {padding:80px 0 50px 0; background:  #FFF;  }
div.attorney-bio h1 {color: #0079C2; text-transform:none; font-size: 22px; text-align:center}
.bio-sidebar {margin-bottom: 30px}

div.attorney-bio .bio-sidebar {text-align:center}
div.attorney-bio .bio-sidebar img {margin-bottom:20px}
div.attorney-bio .bio-sidebar p {margin:0}
div.attorney-bio .bio-sidebar i {margin-right:2px}


.bottom, .bottom h2, .bottom h3, .bottom address, .bottom p {text-align:center}

}









/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
		
	
div.header {position:relative}
.logo p {text-align:center; margin:0 0 20px 0}

.navigation {padding:20px 0 20px 0}
nav.primary select {display: block; margin: 0 0 15px 0; }
nav.primary ul {display: none;}

.split-screen {  width: 100%; height:600px;}
.split-screen article { position: relative; top: 50%;left: 50%;transform: translate(-50%, -50%); }
section.split-screen .left-half {  background: rgba(0, 121, 194, 0.80);  float: none;  width: 100%;  height:100%}
section.split-screen .right-half {background: transparent; float: none;  width: 100%; height:100%}		

.mobile-only {display:block}	
.desktop-only {display:none}	
div.attorney-bio {padding:80px 0 50px 0; background:  #FFF;  }
div.attorney-bio h1 {color: #0079C2; text-transform:none; font-size: 22px; text-align:center}
.bio-sidebar {margin-bottom: 30px}

div.attorney-bio .bio-sidebar {text-align:center}
div.attorney-bio .bio-sidebar img {margin-bottom:20px}
div.attorney-bio .bio-sidebar p {margin:0}
div.attorney-bio .bio-sidebar i {margin-right:2px}

.bottom, .bottom h2, .bottom h3, .bottom address, .bottom p {text-align:center}

	}