/*
Theme Name: Sea Sell Realty Blog
Description: Sea Sell Realty Blog Template
Version: 1
Author: kikaDESIGN
Author URI: http://www.kikawebdesign.com
*/

/******* LANDING PAGE *******/
#auth_info {
	background: #f5f5f5;
padding: 5%;
}
.photo {
float: left;
width: 150px;
border: 1px solid #333;
height: 200px;
margin: 0 1em 0 0;

}
.navigation {
	float: left;
margin-top: 2em;
font-size: 80%;
}
#breadcrumbs {
	font-size:90%;
}
.tag-list:after {
	content:', ';
}
.tag-list:last-of-type:after {
	content:' ';
}
#sidebar > li#widget_sp_image-3 {
border: .25em solid #404d79;
padding:0;	
}
.photo.jflores {
background: url(images/Jim_Head-Shot.jpg);
background-size: contain;
background-repeat: no-repeat;
}

.photo.aflores {
	background: url(images/amy_head-shot.jpg);
background-size: contain;
background-repeat: no-repeat;
}
#top-image-wrap {
float:left;
position:relative;
width:100%;
}
/** NEW CODE FOR CONTACT FORM **/
.contact-form h1 {
font-size: 2em;
margin-bottom: .5em;
text-shadow: -.15em 0em .6em #5d6c89;
color:#FFF;
}
.contact-form a {
background: #2c619a;
color: #FFF;
font-size: .75em;
padding: .5em;
border-radius: .25em;
border: 1px solid #FFF;
box-shadow: 0px 0px 20px #000;
}
.contact-form {
width: 60%;
height: 60%;
overflow: auto;
margin: auto;
position: absolute;
line-height:.9em;
top: 0;
left: 0;
bottom: 0;
right: 0;
z-index: 2;
text-align: center;
text-transform: uppercase;
font-size: 2em;
border-radius: .25em;
padding: .5em;
}
.contact-form form p {
margin: .5em 0 0;
color: #2c619a;
}
/** END NEW CODE **/

/** ORIGINAL CODE FOR CONTACT FORM
.contact-form {
position: absolute;
right: 10%;
background: #fbe4cd;
padding: 1em;
margin-top: 2em;
z-index: 999;
border: .4em solid #f4c6b5;
}
.contact-form form p {
margin: .5em 0 0;
color: #2c619a;
}
 / END ORIGINAL CODE **/
#box-holder {
width: 25%;
text-align: center;
margin: 0 0 2em;
float:left;
}
.tri-box,
.Htri-box {
display: block;
width: 89%;
margin: 1em 0;
text-align: left;
border: 1px solid #2b609a;
border-top: .5em solid #2b609a;
padding: 5%;
background: #d1dee8;
}
.tri-box:first-child,
.Htri-box {
margin-left:0;
}
.tri-box:last-child,
.Htri-box {
margin-right:0;
}
.tri-box h3 {
text-shadow: .15em .05em .5em #aaa;
}
.tri-box h3 span {
color:#2b609a;
text-shadow:none;
}
.tri-box p {
margin:0;
font-size: .9em;
}
#top-image-wrap .widget_sp_image {
max-width:100%;
width:100%;
border:0;
margin:0;
line-height:inherit;
display:block;
max-height:100%;
} 
#right_content {
float:right;
width:70%;
}
#right_content h2 {
color:#f4c7b5;
text-align:left;
}
#right_content h2 span {
color:#2c619a;
}
#fam_fp-wrap {
width: 100%;
float: left;
background: #fce5cc;
border-top: .35em solid #f4c7b5;
padding: 2em 0;
border-bottom: .35em solid #f4c7b5;
}
#fam_fp {
max-width:1024px;
display:block;
margin:0 auto;
}
#fam_fp h2 {
margin:0 0 2%;
}
#fam_fp #widget_sp_image-6 {
float: left;
margin: 0 1% 0 0;
}
#fam_fp #execphp-6 {
float: right;
width: 65%;
text-align: justify;
}
#fam_fp #execphp-6 .widget-title {
color: #FFF;
text-shadow: 1px 1px 2px #333;
}
.pier-bowl-events,
.always-pier-bowl-events {
margin:1em 0;
}
.always-pier-bowl-events {
width: 100%;
padding: 0%;
clear:both;
}
.pier-bowl-events li,
.always-pier-bowl-events li {
border-bottom:1px solid #d2dee8;
margin:.5em 0 1em; 
}
.pier-bowl-events li:last-child,
.always-pier-bowl-events li:last-child {
border-bottom:none;
}
.pier-bowl-events h4,
.always-pier-bowl-events h4 {
color:#2c619a;
}
.pier-bowl-events h4,
.pier-bowl-events h5,
.always-pier-bowl-events h4,
.always-pier-bowl-events h5 {
text-transform:uppercase;
margin:0;
}
.pier-bowl-events h5,
.always-pier-bowl-events h5 {
color:#717d95;
display:inline-block;
}
.pier-bowl-events p,
.always-pier-bowl-events p {
font-size: .75em;
}
.pier-bowl-events img,
.always-pier-bowl-events img {
float: left;
max-height: 100px;
border: .25em #fce4cc solid;
margin: 0 1em 0 0;
}
#right_content h2.ongoing-e {
margin: 0 30%;
background-color: #FFF;
width: auto;
position: relative;
text-align:center;
}
.special-hr {
border:0;
background-color:#ddd;
height:1px;
width:70%;	
margin-top: -1.15em;
margin-bottom:2em;
}
hr {
	background-color: #ccc;
border: none;
height: 1px;
margin: .2em 0 1em;
}
#agents-info_wrap {
float:left;
width:100%;
margin:2em 0;
}
#agents-info {
max-width:1024px;
display:block;
margin:0 auto;
margin-bottom:2em;
}
.widget_sp_image  {
display: inline-block;
max-width: 300px;
margin: 5% 1%;
border: .25em solid #717d95;
overflow: hidden;
line-height: .1em;
max-height: 200px;
position:relative;
}
.widget_sp_image img {
width: 100%;
min-width: 100%;
}
.widget_sp_image .widget-title {
color: #FFF;
text-transform: uppercase;
text-align: left;
position: absolute;
right: 0;
bottom: 2em;
background: #717c95;
padding: 3%;
font-size: 1.25em;
max-width:65%;
}

#Table_01 {
line-height: .1em;
max-width: 993px;
display: block;
margin: 0 auto;
}
#Table_01 img {
max-width:100%;
}
.left-agents {
float:left;
width:58%;
}
.left-agents h3 {
font-size: 2em;
color: #91b0d5
}
.left-agents h3 span {
color:#2c619a;
}
.right-agents {
float:right;
width:40%;
}
.right-agents li {
width: 45%;
display: inline-block;
margin: 0 2%;
}
.right-agents li img {
width:100%;
border:.25em solid #2c619a;
}
/** MAIN **/
body {
margin:0;
padding:0;
font-family: 'Lato', sans-serif;
}
#page-wrap {
width: 100%;
margin: 0 auto;
float:left;
}
#page {
margin: 0 auto;
width:100%;
max-width:1024px;
}
#content {
float: left;
width: 65%;
}
/** HEADER **/

#header-wrap {
float:left;
width:100%;
margin:0;
}
#header {
display: block;
margin: 0em auto;
max-width: 1024px;
padding: 0;
}
/** CONTACT BAR **/

#contact_bar_wrap {
width: 98%;
float: left;
background: #2c609a;
padding: 1%;
}
#contact_bar {
width:100%;
display:block;
margin:0 auto;
max-width:1024px;
} 

#contact_bar ul {
margin:0;
padding: 0;
text-align:center;
}
#contact_bar ul li {
display: inline-block;
width: 65%;
vertical-align: top;
text-align: left;
max-width: 65%;
padding-right: 4%;
text-transform: uppercase;
}

#contact_bar ul li:last-child {
padding-right:0;
max-width:30%;
text-align: right;
}
#contact_bar ul li h3 {
font-size:1.75em;
}
#contact_bar ul li h4, 
#contact_bar ul li h5 {
margin:0;
padding:0;
color:#fff;
text-transform:uppercase;
}
#contact_bar .fa {
color: #2c619a;
background: #fff;
border-radius: 50%;
padding: .5em;
min-width: 1em;
text-align: center;
border: .15em solid #ddd;
margin: 2% 2% 0;
}
/** LOGO **/
#logo {
width: 300px;
height:125px;
float:left;
background:url(images/PH_logo.jpg);
background-position:top left;
background-repeat:no-repeat;
}
#logo a {
height:100%;
display:block;
text-decoration:none;
color:#FFF;
font-size:3em;
}
#logo a span {
display:none;
}
/** NAV **/
#nav {
padding: 0;
margin-top: 1.75em;
width: 68%;
float: right;
} 
#nav ul {
margin:0 auto;
list-style:none;
padding:0;
text-align:right;
}
#nav ul li {
display: inline-block;
margin: 0 .5em;
font-size: 1.2em;
min-width: 90px;
text-align: center;
}
#nav ul li a {
text-decoration:none;
color:#000;
text-transform:uppercase;
font-family: 'Oswald', sans-serif;
font-weight:100;
}
#nav ul li a:hover {
color: #e6b838;
}

/* FlexSlider Necessary Styles
*********************************/ 
.flexslider {width: 100%; margin: 0; padding: 0;}
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flex-pauseplay span {text-transform: capitalize;}

.flexslider .slides img {
width: 100%;
display: block;
}

/* Clearfix for the .slides element */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 
html[xmlns] .slides {display: block;} 
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}


/* FlexSlider Default Theme
*********************************/
.flexslider {background: #fff; position: relative; line-height: 5px; zoom: 1;}
.flexslider .slides {zoom: 1;}
.flexslider .slides > li {position: relative;}
/* Suggested container for "Slide" animation setups. Can replace this with your own, if you wish */
.flex-container {zoom: 1; position: relative;}

/* Caption style */
/* IE rgba() hack */
.flex-caption {background:none; -ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000); zoom: 1;}
.flex-caption {width: 50%; padding: 2%; position: absolute; right: 4em; bottom: 3em; background: #333; color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.3); font-size: 14px; line-height: 18px;}
.flex-caption h3 {
color:#FFF;
font-size:1.75em;
}
/* Direction Nav */
.flex-direction-nav li a {width: 52px; height: 52px; margin: -13px 0 0; display: block;  position: absolute; top: 50%; cursor: pointer; text-indent: -9999px;}
.flex-direction-nav li .next {background-position: -52px 0; right: -24px;}
.flex-direction-nav li .prev {left: -17px;}
.flex-direction-nav li .disabled {opacity: .3; filter:alpha(opacity=30); cursor: default;}

/* Control Nav */
.flex-control-nav {width: 100%; position: absolute; bottom: -30px; text-align: center;}
.flex-control-nav li {margin: 0 0 0 5px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-nav li:first-child {margin: 0;}
.flex-control-nav li a {width: 13px; height: 13px; display: block; cursor: pointer; text-indent: -9999px;}
.flex-control-nav li a:hover {background-position: 0 -13px;}
.flex-control-nav li a.active {background-position: 0 -26px; cursor: default;}

/** FORMATTING **/
p {
text-align:justify;
}
.alignleft {
float:left;
margin-right:2em;
margin-bottom:1em;
}
iframe {
width:98%;
margin:0 auto;
display:block;
min-height:300px;
}
ul {
margin:0;
padding:0;
}
li {
list-style:none;
}

/** SIDEBAR **/
#sidebar {
float:right;
width:30%;
}
#sidebar .execphpwidget li {
background: #94b1d3;
margin: .25em 0;
padding: 1em 0;
text-align: center;
border-radius: .5em;
color: #fff;
text-transform: uppercase;
font-size: 80%;
border: .25em solid #2c619a;
}
#sidebar li#execphp-2 {
	border:0;
	padding:0;
}
#sidebar li {
border:0;
padding:0;	
}
#sidebar > li {
	border:1px solid #ddd;
padding:5%;	
margin:0 0 1em;
}
#sidebar > li a {
	color:#fff;
	display:block;
}
#sidebar .execphpwidget li:hover a {
	color:#333;
	display:block;
}
#sidebar .execphpwidget li:hover {
	background-color: #fbf7f2;
color: #333;
display: block;
border: .25em solid #fce4cc;
}
#sidebar img {
display: block;
margin: 0 auto;
}
.widget-title {
color: #b54b24;
text-transform: uppercase;
text-align: left;
}
.widget-title a {
color: #b54b24;
text-decoration:none;
}
#auth_info h5 {
	text-transform: uppercase;
font-size: 100%;
margin-bottom: 0;
color: #2c619a;
}
#auth_info a:hover {
color:#94b1d3;	
}
/** FOOTER **/

#footer_wrap {
float: left;
width: 100%;
background: #2c619a;
border-top: .2em solid #94b1d3;
}
#footer {
clear: both;
margin: 1em auto;
padding-bottom: 1.5em;
max-width: 1024px;
text-align: center;
padding-top: 1em;
}
#footer div {
vertical-align: top;
margin: 0;
color:#FFF;
}
#footer p {
margin:0;
}
#footer .f-right ul {
text-align:center;
}
#footer .f-right li {
display:inline-block;
}
#footer .f-right h2 {
margin:0;
color:#FFF;
}
#footer .fa {
background: #FFF;
border-radius: 50%;
min-width: 1em;
padding: .5em;
color: #94b1d3;
border: .15em solid #94b1d3;
text-align: center;
margin: 5% 2% 0;
}
#footer .fa:hover {
color:#40404b;
}
.f-left {
width:40%;
display:inline-block;

}
.f-right {
width:35%;
display:inline-block;
}
.f-left img {
margin:0 auto;
display:block;
}
.f-mid {
width:20%;
display:inline-block;
}

#menu-footer-menu {
-moz-column-count:3; 
-webkit-column-count:3; 
column-count:3;

-moz-column-gap:2em; 
-webkit-column-gap:2em; 
column-gap:2em; 
font-size:75%;
}
#footer a, 
#footer a span {
color:#94b1d3;
}
/****** HEADERS *******/
h1,
h2,
h3,
h4,
h5 {
line-height:1em;
font-family:'Oswald', sans-seif;
font-weight:100;
}
h1 {
font-size: 2.7em;
text-align: center;
text-transform: uppercase;
margin-bottom:0;
color:#2c619a;
}
h1 span {
color:#f4c7b5;
}
h2 {
font-size: 2.25em;
color: #2c619a;
text-transform: uppercase;
margin: 0;
text-align: left;
}
h3 {
font-size:1.5em;
color:#FFF;
text-transform:uppercase;
margin:0;
text-decoration:none;
}
h3 a {
text-decoration:none;
color:#404d79;
}

h4 {
text-transform: none;
font-size: 1.2em;
margin: 0 ;
padding: 0;
}

/******* GENERIC STYLES ********/
.alignright {
float:right;
margin-left:3em;
}
.aligncenter {
float:none;
display:block;
margin:0 auto;
}
.alignleft {
float:left;
margin-right:3em;
}
#content div.wpcf7-mail-sent-ok {
border: 2px solid #404d79;
background: #404d79;
border-radius: .25em;
color: #FFF;
text-transform: uppercase;
text-align: center;
}
.read {
	clear:both;
	float:right;
}
.first-blog {
	float: left;
background: #faf3eb;
padding: 5%;
margin-bottom: 1em;
}
.blog { 
float: left;
border-bottom: 1px solid #d2dfe9;
margin-bottom: 1em;
}
.blog:last-of-type {
	border-bottom:0;
	margin-bottom:0;
}
/******* FORMS and INPUTS ********/
legend {
text-transform: uppercase;
padding: 0 .5em;
font-size: 1em;
margin-bottom: .5em;
}
fieldset {
margin-top: 1em;
border: .2em solid #404d79;
padding: .5em 2em;
}
fieldset p {
margin-top:0;
}
textarea {
width:100%;
}
input {
width: 95%;
padding: .25em;
}
input[type="radio"] {
width:auto;
}
input[type="submit"] {
background: #2c619a;
border: 0;
padding: .5em 2em;
border-radius: .25em;
color: #FFF;
text-transform: uppercase;
font-size: 1em;
font-family: 'Oswald', sans-seif;
width: 100%;
}
.wpcf7-captchar {
width:auto;
}
p span.wpcf7-form-control-wrap {
text-align:left;
}
/******* ULs and LIs ********/

/******* LINKS ********/
a {
text-decoration:none;
color:#2c619a;
}
/******* CUSTOM SIDEBARS ********/



/********************** RESPONSIVE DESIGN **********************/
@-ms-viewport {
	width: device-width;
}
@viewport {
	width: device-width;
}
@media (max-width:1023px) { /* ipad portrait */
#page-wrap {
width: 96%;
}
#nav ul li {
margin: 0 .5em;
font-size: 1.25em;
}
.flex-caption {
position: absolute;
margin-left: auto;
margin-right: auto;
left: 0;
right: 0;
bottom: 2em;
max-width: 85%;
font-size: .8em;
padding: 1em;
width: 85%;
height: auto;
}
.flex-caption p {
margin:0;
}
.flexslider img[class*="align"], .flexslider img[class*="wp-image-"], .flexslider img[class*="attachment-"] {
max-width: 100%;
}
#contact_bar ul li {
font-size: .7em;
}
#contact_bar ul li:first-child {
margin-left:1em;
}
#contact_bar ul li.OB_or h4 {
font-size: .5em;
}
#nav {
width: 62%;
font-size: .75em;
}
#nav ul li {
min-width: 60px;
}

}
@media (max-width:767px) {

#contact_bar_wrap {
display:none;
}

#page {
float: left;
width:100%;
margin: 0;
}
#content {
float: none;
width: 100%;
}
#content img {
margin: 0 auto;
display: block;
clear: both;
width: auto;
padding: 0;
float: none;
max-width:100%;
}
#nav {
width: 95%;
font-size: inherit;
margin: 0 auto 3em;
display: block;
float: none;
}
#sidebar {
float: none;
width: 100%;
display:block;
}
#sidebar img {
display: block;
margin: 0 auto;
}
#logo {
height: 150px;
margin: 0 auto;
display: block;
float: none;
}

.f-left,
.f-mid,
.f-right {
width: 90%;
display: block;
padding:0 0 1em;
margin:0 auto;
}
#footer div {
margin:0 auto;
}
#footer p {
text-align: center;
}
#footer {
padding-bottom:0;
}
}
@media (max-width:600px) {

}