/*
Theme Name: Beacon Family Law
Version: 1.0
*/



* { margin: 0; padding: 0; }
html { background: url(img/bg.png) repeat; }
body { font-size: 62.5%; font-family: 'Cardo', serif; background: url(img/top.png) top left repeat-x; padding: 0 24px 30px 24px; border-top: 4px solid #8f001e;}

body#page { background: url(img/top_short.png) top left repeat-x; }

#container { position: relative; background: #FFF; margin: 0 auto 50px auto; max-width: 1140px; box-shadow: 0 1px 2px rgba(0,0,0,.4); border-bottom: 3px solid #F7F7F7; z-index: 500; }

/*---------------------------------------

	HEADER

-----------------------------------------*/

#header_wrap { position: relative; margin: 0 auto; max-width: 1140px; z-index: 1000; } 
#header { position: relative; width: 100%; height: 160px; z-index: 3; }
#logo { position: absolute; bottom: 17px; left: 30px; display: block; width: 148px; height: 102px; background: url(img/logo.png) no-repeat; }

@media only screen and (-webkit-min-device-pixel-ratio: 2) {
     #logo {
          background: url(img/logo_m@2x.png) no-repeat;
     }
}

#tagline { position: absolute; top: 68px; left: 220px; font-size: 17px; font-family: 'Cardo', serif; font-style: italic; width: 500px; border-bottom: 1px solid #ecece9; padding-bottom: 8px; }
#phone { position: absolute; bottom: 22px; right: 30px; text-align: right; font-size: 19px; font-family: 'Cardo', serif; font-style: italic; color: #8f001e; margin: 0; line-height: normal; }
#toggle_nav { display: none; }
#nav { position: absolute; bottom: 4px; left: 220px; width: 640px; list-style: none; }
#nav li { position: relative; display: inline-block; zoom: 1; *display: inline; font-size: 16px; margin-right: 24px; padding-bottom: 20px; }
#nav li.active a:link, #nav li.active a:visited { color: #8f001e; text-decoration: none; }
#nav a:link, #nav a:visited { color: #797664; text-decoration: none; }
#nav a:hover, #nav a:active { color: #8f001e; text-decoration: none; }

#nav .current_page_item a:link, #nav .current_page_item a:visited { color: #8f001e; text-decoration: none; }

#nav ul { position: absolute; top: 32px; left: -10px; width: 200px; background: #FFF; list-style: none; border-top: 4px solid #8f001e; box-shadow: 0 2px 1px rgba(0,0,0,.2); -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; display: none; }
#nav ul::after { content:""; position: absolute; top: -7px; left: 30px; display: block; width: 12px; height: 12px; background: #8f001e; -webkit-transform:rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); z-index: -1; }

#nav ul li { display: block; margin: 0; padding: 0; font-size: 13px; border-bottom: 1px solid #ecece9; }

#nav ul li:last-child { border: none; }
#nav ul a { display: block; padding: 6px 10px; }

#nav ul a:link, #nav ul a:visited { color: #797664; text-decoration: none; }
#nav ul a:hover, #nav ul a:active { color: #8f001e; text-decoration: none; background: #ecece9; }

#nav .current_page_item ul a:link, #nav .current_page_item ul a:visited { color: #797664; text-decoration: none; }

#nav > li:hover ul {  }

.social { list-style: none; position: absolute; bottom: 66px; right: 30px; width: 200px; text-align: right; }
.social li { display: inline-block; zoom: 1; *display: inline; width: 28px; height: 28px; margin-left: 4px; }
.social a { display: block; width: 28px; height: 28px; }

.social_fb { background: url(img/facebook.png) no-repeat; }
.social_tw { background: url(img/twitter.png) no-repeat; }
.social_gp { background: url(img/googleplus.png) no-repeat; }

/*---------------------------------------

	BANNER

-----------------------------------------*/

#slideshow_wrap { position: relative; background: #f1f2f0; z-index: 2; }
#slideshow { position: relative; margin: 0 auto; z-index: 2; overflow: hidden; }

.slide { }
.slide img { position: relative; display: block; max-width: 100%; height: auto; z-index: 1; }
.slide div { position: absolute; bottom: 30px; left: 30px; right: 30px; z-index: 2; }

#slideshow .slide { display: none }
#slideshow .first { display: block }

.cycle-slideshow { width: 100% }

.slide h2 { font-size: 38px; color: #FFF; font-weight: normal; line-height: 100%; margin: 0 0 8px 0; text-shadow: 0 1px 0 rgba(0,0,0,.3); }
.slide p { font-size: 16px; color: #FFF; line-height: 100%; margin: 0; }

.slide a:link, .slide a:visited { color: #FFF; text-decoration: none; }
.slide a:hover, .slide a:active { color: #FFF; text-decoration: none; }

#slideshow_pager { position: absolute; bottom: 18px; right: 20px; width: 200px; text-align: right; z-index: 10; }

#slideshow_pager a { display: inline-block; width: 12px; height: 12px; border-radius: 6px; background: rgba(255,255,255,.5); margin-left: 4px; }
#slideshow_pager a:hover, #slideshow_pager a.cycle-pager-active { background: #FFF; }



#banner_navigation h1 span { display: inline-block; width: 400px; border-bottom: 2px solid rgba(255,255,255,1); }
#banner_navigation { position: absolute; bottom: 0; left: 0; width: 100%; text-shadow: 0 1px 1px rgba(0,0,0,.1); }


#banner_navigation ul { list-style: none; width: 100%; overflow: hidden; background: #610014; }
#banner_navigation li { float: left; width: 25%; }
#banner_navigation li div { padding: 16px 30px; border-left: 1px solid rgba(255,255,255,.1); border-right: 1px solid rgba(0,0,0,.2); }
#banner_navigation li div::last-child { border-right: none; }

#banner_navigation li:hover { background: #8f001e; }

#banner_navigation h2 { font-size: 17px; color: #FFF; font-family: 'Cardo', serif; font-weight: 700; line-height: 140%; margin: 0 20px 0px 0; }

#banner_navigation p { font-size: 13px; color: #FFF; line-height: 140%; margin: 0 20px 0 0; }


/*---------------------------------------

	CONTENT

-----------------------------------------*/

#content { position: relative; width: 100%; padding: 40px 0; overflow: hidden; }

#page_body { float: left; width: 64%; }
#page_sidebar { float: right; width: 32%; border-left: 1px solid #F2F2F2; }

.container { padding: 0 30px; }
.sidebar_block { padding: 0 22px 24px 22px; margin-bottom: 24px; border-bottom: 1px solid #F2F2F2; }

#contact { width: 100%; overflow: hidden; }
#contact h1 { padding: 0 30px 12px 30px; border-bottom: 1px solid #F2F2F2; margin-bottom: 40px; }

/*---------------------------------------

	STAFF

-----------------------------------------*/

#page_body ul.staff { list-style: none; margin: 0 0 32px 0; }
#page_body ul.staff li { width: 100%; border-bottom: 1px solid #F2F2F2; padding-top: 28px; padding-bottom: 12px; overflow: hidden; }
.staff li:last-child { border-bottom: none; }
.staff img { display: block; float: left; width: 106px; margin-right: 16px; margin-bottom: 18px; }
.staff li div { display: block; float: left; width: 520px; }
.staff li p { font-size: 13px; overflow: hidden; }


/*---------------------------------------

	ARTICLES

-----------------------------------------*/

#page_body .articles { list-style: none; margin-left: 0; }
.articles li { border-bottom: 1px solid #F2F2F2; padding-bottom: 14px; margin-bottom: 18px;  }
.articles a:link, .articles a:visited { color: #8f001e; text-decoration: none; }
.articles a:hover, .articles a:active { color: #8f001e; text-decoration: underline; }

.articles h2 { margin-bottom: 2px; }
.articles p { font-size: 12px; margin-bottom: 6px; }
.articles p.meta { font-family: 'Cardo', serif; font-size: 12px; color: #999; }

.sidebar_articles { list-style: none; }
.sidebar_articles li { display: inline-block; border-bottom: 1px solid #F2F2F2; padding-bottom: 14px; margin-bottom: 18px;  }
.sidebar_articles a:link, .sidebar_articles a:visited { color: #8f001e; text-decoration: none; }
.sidebar_articles a:hover, .sidebar_articles a:active { color: #8f001e; text-decoration: underline; }

.sidebar_articles h3 { font-size: 14px; margin-bottom: 2px; }
.sidebar_articles p { font-size: 12px; margin-bottom: 6px; }
.sidebar_articles p.meta { font-family: 'Cardo', serif; font-size: 12px; color: #999; }

#page_body p.meta { font-family: 'Cardo', serif; font-size: 14px; color: #999; margin-top: -15px; }
#page_body .articles p.meta { margin-top: 0; }


/*---------------------------------------

	CALL TO ACTION

-----------------------------------------*/

#page_body .call_to_action { list-style: none; margin: 0 0 30px 0; font-family: 'Cardo', serif; line-height: normal; }
#page_body .call_to_action li { display: inline-block; zoom: 1; *display: inline; vertical-align: bottom; width: 33%; margin: 0; }
.call_to_action a { display: block; margin: 0 2px; padding: 60px 16px 16px 16px; text-align: center; border-bottom: 4px solid #8f001e; background-color: #f0f0ed; }
.call_to_action a:link, .call_to_action a:visited { color: #797664; text-decoration: none; }
.call_to_action a:hover, .call_to_action a:active { color: #8f001e; text-decoration: none; }

.call_to_action a strong { display: block; font-size: 22px; font-weight: normal; font-style: italic; color: #8f001e;}
.call_to_action a span { display: block; font-size: 14px; font-weight: normal; color: #686c6b; }

.call_to_action a.call { background-image: url(img/phone.png); background-position: center 20px; background-repeat: no-repeat; }
.call_to_action a.read { background-image: url(img/users.png); background-position: center 20px; background-repeat: no-repeat; }
.call_to_action a.help { background-image: url(img/help.png); background-position: center 20px; background-repeat: no-repeat; }

.call_to_action:hover li { opacity: 0.5; }
.call_to_action:hover li:hover { opacity: 1; }

.sidebar_block .call_to_action { margin-bottom: 0; }
.sidebar_block .call_to_action li { display: block; width: 100%; margin-bottom: 12px; }
.sidebar_block .call_to_action a { display: block; margin: 0; padding: 16px 16px 16px 60px; text-align: left; }

.sidebar_block .call_to_action a.call { background-image: url(img/phone.png); background-position: 16px center; background-repeat: no-repeat; }
.sidebar_block .call_to_action a.read { background-image: url(img/users.png); background-position: 16px center; background-repeat: no-repeat; }
.sidebar_block .call_to_action a.help { background-image: url(img/help.png); background-position: 16px center; background-repeat: no-repeat; }

/*---------------------------------------

	TYPOGRAPHY

-----------------------------------------*/

h1 { font-size: 34px; color: #8f001e; font-family: 'Cardo', serif; font-weight: normal; line-height: 110%; margin-bottom: 24px; }
h2 { font-size: 16px; color: #8f001e; font-family: 'Cardo', serif; font-weight: 700; line-height: 120%; margin-bottom: 10px; }
h3 { font-size: 14px; color: #686c6b; font-family: 'Cardo', serif; font-weight: 700; line-height: 140%; margin-bottom: 8px; }
h4 { font-size: 11px; color: #686c6b; font-family: 'Cardo', serif; font-weight: 700; line-height: 140%; margin-bottom: 14px; text-transform: uppercase; letter-spacing: 2px; }
h5 { font-size: 12px; color: #481912; font-family: 'Cardo', serif; font-weight: 700; line-height: 140%; margin-bottom: 22px; text-transform: uppercase; letter-spacing: 2px; }
h1.home_h1 { margin-right: 100px; }

#page_sidebar h4 { margin: 0 0 18px 0; }

p { font-size: 13px; color: #686c6b; font-family: 'Helvetica', serif; line-height: 140%; margin-bottom: 18px; }
p.intro { font-size: 27px; color: #8f001e; font-family: 'Cardo', serif; font-style: italic; line-height: 120%; margin-bottom: 18px; }

#page_body ol { font-size: 13px; color: #686c6b; font-family: 'Helvetica', serif; line-height: 140%; margin: 0 0 18px 24px; }
#page_body ol li { margin-bottom: 5px; }

#page_body ul { font-size: 13px; color: #686c6b; font-family: 'Helvetica', serif; line-height: 140%; margin: 0 0 18px 24px; }
#page_body ul li { margin-bottom: 5px; }


a:link, a:visited { color: #8f001e; text-decoration: underline; }
a:hover, a:active { color: #8f001e; text-decoration: underline; }

.more { display: block; font-size: 14px; }

h2 strong { display: inline-block; width: 80px; }

#page_body .search_results { list-style: none;  margin: 0 0 18px 0;}

/*---------------------------------------

	FORMS

-----------------------------------------*/


#contact_details { float: left; width: 50%; }
#contact_map { float: right; width: 50%; }

.text_field { margin: 0 3px 18px 3px; }
.text_field label { display: block; font-size: 14px; color: #666; margin-bottom: 5px; }
.text_field label em { font-size: 12px; color: #999; }
.text_field span { display: block; border: 1px solid #DEDEDE; border-radius: 3px; padding: 0 8px; box-shadow: 0 0 0 3px rgba(0,0,0,.05); }
.text_field span.required { }
.text_field input { width: 100%; padding: 10px 0; font-size: 14px; background: none; border: none; outline: none; -webkit-appearance: none; font-family: 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif; color: #666; }
.text_field textarea { width: 100%; height: 80px; padding: 10px 0; font-size: 14px; background: none; border: none; outline: none; -webkit-appearance: none; font-family: 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif; resize: none; color: #666; }
.button_field { margin: 0 3px 18px 3px; }

button { display: inline-block; background-color: #8f001e; border: none; font-size: 13px; text-align: center; text-shadow: 0 1px 0 rgba(0,0,0,.2); color: #fff; text-transform: uppercase; padding: 10px 0; width: 140px; font-family: 'Cardo', serif; cursor: pointer; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
  }

.search .text_field { position: relative; margin: 0; }
.search .search_q { max-width: 80%; color: #CCC; }
.search .search_q:focus { color: #666; }
.search_go { position: absolute; top: 9px; right: 8px; width: 20px; background: url(img/search.png) no-repeat; height: 20px; border: none; outline: none; }

.wpcf7-not-valid-tip { display: none !important; }

/*---------------------------------------

	FOOTER

-----------------------------------------*/

#footer_wrap { position: relative; margin: 0 auto 60px auto; padding: 0 30px; max-width: 1080px; z-index: 2; }
#footer { position: relative; width: 100%; overflow: hidden; }
#footer .column { float: left; width: 46%; }
#footer .two_column { float: left; width: 50%; overflow: hidden; }

#footer p { color: #797664; font-size: 13px; font-family: "Georgia"; line-height: 140%; margin-bottom: 18px; }


#footer ul { font-size: 13px; font-family: "Georgia"; line-height: 140%; }

#footer .footer_services li { display: inline-block; zoom: 1; *display: inline; width: 46%; }

#footer a:link, #footer a:visited { color: #797664; text-decoration: none; }
#footer a:hover, #footer a:active { color: #797664; text-decoration: underline; }

#copyright { border-top: 1px solid #dedad7; padding: 20px 30px; color: #797664; font-size: 12px; font-family: "Georgia"; line-height: 140%; margin: 0 auto; max-width: 1080px; }

#copyright a:link, #copyright a:visited { color: #797664; text-decoration: none; }
#copyright a:hover, #copyright a:active { color: #797664; text-decoration: underline; }

.page_options { width: 100%; overflow: hidden; }
.page_options a { display: block; width: 49.5%; height: 80px;  }
.print_page { float: left; background-color: #f0f0ed; background-image: url(img/printer.png); background-repeat: no-repeat; background-position: center center; }
.share_page { float: right; background-color: #f0f0ed; background-image: url(img/export.png); background-repeat: no-repeat; background-position: center center;}


/*---------------------------------------

	MISC

-----------------------------------------*/

a { outline: none; }
img { border: none; }



