/*
Theme Name: Soliman Law
Theme URI: https://www.solimanlaw.com/
Author: Sean Callahan
Author URI: http://www.vireo.us/
Description: Bespoke WordPress theme designed for Soliman Law, P.A.
Version: 1.0
Text Domain: solimanlaw
*/

/* ==== RESET CSS ==== */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0;	padding: 0;	border: 0; font-size: 100%;	font: inherit; vertical-align: baseline; box-sizing: border-box; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table {	border-collapse: collapse; border-spacing: 0;}

/* ==== BASIC STYLES ==== */

body {
    background-color: #eee;
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
}

a {
    color: #426fc3;
}

a:hover {
    text-decoration: none;
}

.container {
    width: 100%;
}

.container-inner {
    box-shadow: 0 5px 10px 0 #333;
}

h1 {
    font-size: 1.75em;
    line-height: 1.25;
    font-weight: bold;
}

h2 {
    font-size: 1.75em;
    line-height: 1;
}

h3 {
    font-size: 1.25em;
    line-height: 1;
}

p {
    line-height: 1.75;
    margin-top: 2em;
}

strong {
    font-weight: bold;
    color: #264fa1;
}

em {
    font-style: italic;
}

.contrast-a {
    background: #fff;
}

.contrast-b {
    background: #ddd;
}

.button, .ccf-submit-button, #respond input.submit {
    display: inline-block;
    width: 100%;
    border: 3px solid #264fa1;
    background: #fff;
    color: #264fa1;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
    line-height: 3em;
    text-decoration: none;
}

.button-primary, .ccf-submit-button {
    background: #426fc3;
    color: #fff;
}

/* ==== HEADER STYLES ==== */

.header-logo {
    background: #fff;
}

.header-logo p {
    width: 40%;
    margin: 0;
    padding: 5% 5% 0;
}

.header-logo p.slogan {
    padding: 0 5% 5%;
    text-align: center;
    font-weight: bold;
    color: #264fa1;
}

.site-logo {
    max-width: 100%;
    height: auto;
}

.nav {
    background: #264fa1;
    position: relative;
    z-index: 1000;
}

.nav ul {
    width: 100%;
}

.nav ul li {
    display: inline-block;
    width: 90%;
    margin: 5% 5% 0;
    text-align: center;
    text-transform: uppercase;
    font-size: 0.9em;
}

.nav ul li:last-child {
    margin-bottom: 5%;
}

.nav ul li a {
    display: block;
    width: 100%;
    height: 100%;
    border: 3px solid #766442;
    background: #d9b06f;
    color: #766442;
    font-weight: bold;
    text-decoration: none;
    line-height: 3em;
}

.callout {
    padding: 15% 5%;
}

.callout a {
    color: #fff;
}

.callout-news {
    background: url('img/news.jpg');
    background-size: cover;
    background-position: center center;
}

/*
.callout-home {
    background: url('../img/building.jpg');
    background-size: cover;    
    background-position: center center;
}

.callout-attorney-profile {
    background: url('../img/attorney-profile.jpg');
    background-size: cover;
    background-position: center center;
}

.callout-contact {
    background: url('../img/contact-us.jpg');
    background-size: cover;
    background-position: center center;
}

.callout-practice-areas {
    background: url('../img/practice-areas.jpg');
    background-size: cover;    
    background-position: center center;
}

.callout-community-association {
    background: url('../img/community-association.jpg');
    background-size: cover;
    background-position: center center;
}

.callout-business-and-corporate {
    background: url('../img/business-and-corporate-law.jpg');
    background-size: cover;
    background-position: center center;
}

.callout-real-estate-transactions {
    background: url('../img/real-estate-transactions.jpg');
    background-size: cover;
    background-position: center center;
}

.callout-real-estate-litigation {
    background: url('../img/real-estate-litigation.jpg');
    background-size: cover;
    background-position: center center;
}

.callout-estate-planning {
    background: url('../img/estate-planning.jpg');
    background-size: cover;
    background-position: center center;
}

.callout-immigration-law {
    background: url('../img/immigration-law.jpg');
    background-size: cover;
    background-position: center center;
}

*/

.callout-text {
    width: 100%;
    padding: 5%;
    background: black;
    background: rgba(0,0,0,0.75);
    color: #fff;
}

.callout-text p {
    margin-top: 0.75em;
}

/* ==== FOOTER ==== */

.footer, .copyright {
    width: 95%;
    margin: 0 auto;
    font-size: 0.75em;
}

.footer-contact, .footer-sitemap {
    float: left;
    width: 50%;
}

.footer p, .footer li {
    line-height: 1.25;
}

.footer strong {
    line-height: 2;
}

.footer-sitemap {
    text-align: right;
}

.copyright {
    clear: both;
    padding-top: 2%;
}

/* ==== PAGE SPECIFIC ==== */

.home-feature, .home-practice-areas, .practice-areas, .practice-area-detail, .contact-today, .attorney-profile-detail, .contact-detail, .news-detail, .news-comments, .news-archive-detail {
    padding: 15% 5%;
}

.home-feature h2, .home-practice-areas h2, .home-practice-areas h3 {
    text-align: center;
    color: #264fa1;
}

.home-feature-image, .profile-image {
    width: 75%;
    margin: 2em auto 0;
}

.home-feature-image, .profile-image img {
    max-width: 100%;
    height: auto !important;
}

.home-feature-second-p {
    display: none;
}

.practice-area-info {
    width: 100%;
}

.practice-areas .practice-area-info {
    display: table;
    margin-bottom: 20%;
}

.practice-areas .practice-area-info:last-child {
    margin-bottom: 0;
}

.practice-area-info h3 {
    display: inline-block;
    width: 100%;
    border: 3px solid #264fa1;
    background: #fff;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
    font-size: 0.9em;
    line-height: 1.25em;
}

.practice-area-info h3 a {
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none;
    color: #264fa1;
    padding: 3%;
}

.practice-areas .practice-area-info h3 {
    display: table-cell;
    width: 75%;
    border: none;
    vertical-align: middle;
    text-align: left;
    font-size: 1.2em;
}

.practice-areas .practice-area-info h3 a {
    padding: 0 0 0 10%;
}

.practice-area-img {
    width: 50%;
    margin: 15% auto 0;
    text-align: center;
}

.practice-areas .practice-area-img {
    display: table-cell;
    width: 25%;
    margin: 0;
    padding: 0;
    vertical-align: middle;
}

.practice-area-img img {
    max-width: 100%;
}

.practice-area-desc, .practice-area-link {
    display: none;
}

.practice-area-detail .headline, .attorney-profile-detail .headline, .contact-detail .headline, .ccf-form-wrapper .form-title, .news-detail h2 {
    font-size: 1.5em;
    font-weight: bold;
    color: #264fa1;
    margin-top: 0;
}

.news-detail h2 a {
    text-decoration: none;
}

.news-detail h2 a:hover {
    text-decoration: underline;
}

.attorney-profile-detail .subheadline {
    margin-top: 0;
}

.attorney-profile-detail h2 {
    margin-top: 1.5em;
    font-size: 1.25em;
    font-weight: bold;
    color: #264fa1;
}

.practice-area-detail ul, .attorney-profile-detail ul, .news-detail ul, .comment ul {
    list-style-type: disc;
    margin: 2% 0 2% 15%;
}

.news-detail ol, .comment ol {
    list-style-type: upper-roman;
    margin: 2% 0 2% 15%;
}

.comment ol.children {
    list-style: none;
}

.practice-area-detail ul li, .attorney-profile-detail ul li, .news-detail ul li, .news-detail ol li, .comment ul li, .comment ol li {
    margin: 5% 0;
    line-height: 1.25em;
}

.contact-address-detail p {
    line-height: 1.75;
    margin-top: 0;
}

.contact-address-detail p.headline {
    line-height: 2;
    margin-top: 5%;
}

.contact-form p {
    margin-top: 2%;
}

.contact-form p.headline {
    line-height: 2;
    margin-top: 5%;
}

.contact-form input {
    width: 100%;
    height: 1.5em;
}

.contact-form textarea {
    width: 100%;
    height: 6em;
}

.contact-form input.button {
    height: 3.25em;
}

.contact-today p {
    margin-top: 0;
    text-align: center;
    font-size: 1.5em;
}

.google-maps {
    position: relative;
    padding-bottom: 75%;
    height: 0;
    overflow: hidden;
}

.google-maps iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}

.ccf-form-wrapper {
    width: 100%;
}

.ccf-form-wrapper .field label.main-label {
    font-weight: normal;
}

.ccf-form-wrapper .field input {
    padding: 5px;
    font-family: 'Open Sans', sans-serif;
}

.news-detail p {
    line-height: 1.5em;
    margin-top: 1em;
}

.news-detail p.news-metadata {
    margin-top: 0;
    margin-bottom: 2em;
}

.news-detail blockquote, .comment blockquote {
    width: 75%;
    margin: 0 auto;
    padding: 20px;
    border: 1px solid black;
    background: #eee;
    margin-top: 1em;
}

.news-detail blockquote p, .comment blockquote p {
    margin-top: 0;
}

.news-detail blockquote cite, .comment blockquote cite {
    display: block;
    font-size: 0.8em;
    font-weight: bold;
    text-align: right;
}

.news-content {
    margin-bottom: 30px;
}

.news-content h1, .news-content h2, .news-content h3, .news-content h4, .news-content h5, .news-content h6, .comment h1, .comment h2, .comment h3, .comment h4, .comment h5, .comment h6 {
    line-height: 1.5em;
    margin-top: 20px;
    border-bottom: 1px solid black;
}

.news-content table, .comment table {
    border: 1px solid black;
    margin: 20px auto;
}

.news-content thead {
    background: #eee;
}

.comment thead {
    background: #fff;
}

.news-content table tr, .comment table tr {
    border: 1px solid black;
}

.news-content table tr td, .news-content table tr th, .comment table tr td, .comment table tr th {
    border: 1px solid black;
    padding: 10px;
}

.news-content table tr th {
    background: #eee;
}

.comment table tr th {
    background: #fff;
}

.news-content dl dt, .comment dl dt {
    text-decoration: underline;
    font-weight: bold;
    line-height: 2em;
}

.news-content dl dd, .comment dl dd {
    margin-left: 4%;
    margin-bottom: 20px;
}

.news-content .alignleft {
    float: left;
    margin-right: 2%;
    margin-top: 2%;
}

.news-content .alignright {
    float: right;
    margin-left: 2%;
    margin-top: 2%;
}

.news-content .aligncenter {
    text-align: center;
    margin: 20px auto;
}

.news-detail img, .news-content img, .news-content div {
    max-width: 100%;
    height: auto;
}

.news-content div {
    margin: 20px auto;
}

.news-content .wp-caption-text {
    font-size: 0.8em;
    font-style: italic;
    margin-top: 0;
}

.news-featured-image {
    text-align: center;
    max-width: 100%;
    height: auto;
}

.news-feature-image img {
    max-width: 100%;
    height: auto;
}

.older-posts {
    float: left;
}

.newer-posts {
    float: right;
}

.comment-listing {
    text-align: center;
    font-size: 0.8em;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    padding: 10px;
}

.news-archive-detail ul {
    list-style: none;
}

.news-archive-detail ul li {
    margin: 20px auto;
}

.archives-link {
    text-align: center;
    font-size: 0.8em;
}

/* ==== COMMENT STYLING ==== */

.news-comments h2.comments-title {
    font-size: 1em;
    font-weight: bold;
    margin-bottom: 20px;
}

.comment {
    padding: 20px;
    border: 1px solid #333;
    background: #eee;
    margin-bottom: 10px;
}

.comment-author {
    margin: 0 0 5px;
    font-weight: bold;
    line-height: 1.5em;
}

.comment-author img {
    float: left;
    margin-right: 10px;
}

.comment-meta {
    font-size: 0.8em;
    margin-bottom: 20px;
}

.comment h1 {
    font-size: 1.75em;
}

.comment h2 {
    font-size: 1.5em;
    font-weight: bold;
}

.comment h3 {
    font-size: 1.25em;
    font-weight: bold;
}

.comment h4, .comment h5, .comment h6 {
    font-weight: bold;
}

.comment .depth-2, .comment .depth-4 {
    background: #ccc;
    border: none;
}

.comment .depth-3, .comment .depth-5 {
    border: none;
}

.bypostauthor {
    background: #cce;
}

.pingback {
    margin: 15px auto;
    font-size: 0.8em;
}

#respond {
    margin: 20px auto;
    padding: 10px;
    background: #fff;
    border: 1px solid #333;
}

#respond h3 {
    font-weight: bold;
}

#respond .logged-in-as, #respond .comment-notes {
    margin-top: 0;
    font-size: 0.8em;
    margin-bottom: 20px;
}

#respond .comment-form-comment, #respond .comment-form-author, #respond .comment-form-email, #respond .comment-form-url {
    display: table-row;
}

#respond label {
    width: 25%;
    display: table-cell;
    vertical-align: top;
}

#respond textarea, #respond input {
    display: table-cell;
    width: 100%;
    border: 1px solid #333;
    padding: 5px;
    margin-bottom: 10px;
}

#respond input.submit {
    display: block;
    width: 25%;
}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

/* ==== BREAKPOINT - 480px ==== */

@media (min-width: 480px) {

    .home-practice-areas {
        text-align: center;
    }

    .practice-area-info {
        display: inline-block;
        vertical-align: top;
        width: 45%;
        margin: 2%;
    }
    
    .practice-area-info h3 {
        border: none;
        background: none;
    }
    
    .practice-areas .practice-area-info {
        display: inline-block;
        margin-bottom: 10%;
    }
    
    .practice-areas .practice-area-img {
        display: block;
        width: 50%;
        margin: 0 auto 5%;
    }
    
    .practice-areas .practice-area-info h3 {
        display: block;
        width: 100%;
        text-align: center;
    }
    
    .practice-areas .practice-area-info h3 a {
        padding: 0;
    }
    
}

/* ==== BREAKPOINT - 568px (LANDSCAPE ONLY) ==== */

@media (min-width: 568px) and (orientation: landscape) {
 
    .home-feature-image, .profile-image {
        float: left;
        width: 35%;
        margin-right: 5%;
    }
    
    .home-feature-text {
        float: left;
        width: 60%;
    }
    
    .clearfix:after {
      content: "";
      display: table;
      clear: both;
    }

}

/* ==== BREAKPOINT - 600px ==== */

@media (min-width: 600px) {
    
    .header-logo {
        background: url(img/skyline.jpg);
        background-size: cover;
        background-position: center center;
        padding: 0;
    }
    
    .header-logo-inner {
        padding: 0 0 75px 40px;
    }
    
    .header-logo-inner p {
        width: 180px;
        padding: 2% 2% 1% 2%;
        background: white;
        position: relative;
    }
    
    .header-logo-inner p.slogan {
        padding: 0 2% 2%;
        text-align: center;
        font-weight: bold;
        font-size: 1em;
        color: #264fa1;
    }
    
    .nav {
        background: none;
        position: relative;
        z-index: 1000;
    }

    .nav ul {
        display: table;
        width: 100%;
    }

    .nav ul li {
        display: table-cell;
        width: 20%;
        padding: 2%;
        margin: 0;
        background: #d9b06f;
        vertical-align: middle;
        text-align: center;
        text-transform: uppercase;
        font-size: 0.9em;
        border-width: 3px 3px 3px 0;
        border-style: solid;
        border-color: #766442;
    }

    .nav ul li:last-child {
        margin-bottom: 0;
        border-width: 3px 0;
    }

    .nav ul li a {
        display: block;
        width: 100%;
        height: 100%;
        border: none;
        background: none;
        color: #766442;
        padding: 0;
        font-weight: bold;
        text-decoration: none;
        line-height: 1em;
    }
    
    .home-feature, .home-practice-areas, .callout, .practice-areas, .practice-area-detail, .contact-today, .attorney-profile-detail, .contact-detail, .news-detail, .news-comments, .news-archive-detail {
        padding: 5%;
    }
    
    .home-feature-image, .profile-image {
        width: 40%;
    }
    
    .home-feature-second-p {
        display: block;
    }

}

/* ==== BREAKPOINT - 768px ==== */

@media (min-width: 768px) {
 
    .callout {
        padding: 5% 40% 5% 0;
    }
    
    .home-feature-image, .profile-image {
        float: left;
        margin-right: 5%;
        width: 35%;
    }
    
    .home-feature-text {
        float: left;
        width: 60%;
    }
    
    .clearfix:after {
      content: "";
      display: table;
      clear: both;
    }
        
    .practice-area-info h3 {
        text-transform: none;
        font-weight: normal;
        font-size: 1.1em;
    }
    
    .practice-area-desc, .practice-area-link {
        display: inherit;
    }
    
    .practice-area-desc {
        margin-top: 0;
        font-size: 0.8em;
    }
    
    .practice-area-link {
        width: 100%;
        font-size: 0.9em;
    }
    
    .practice-area-link a {
        padding: 0.5%;
    }
    
    .practice-areas .practice-area-info {
        width: 100%;
    }
    
    .practice-areas .practice-area-img {
        display: inline;
        float: left;
        width: 25%;
        margin: 0 5% 0 0;
    }
    
    .practice-areas .practice-area-info h3 {
        float: left;
        display: inline-block;
        width: 70%;
        margin-bottom: 2%;
    }
    
    .practice-areas .practice-area-desc {
        display: inline-block;
        float: left;
        width: 70%;
        padding: 0;
    }
    
    .practice-areas .practice-area-link {
        float: right;
        display: inline-block;
        width: 70%;
    }
    
    .practice-areas .practice-area-link a {
        padding: 0;
        line-height: 2.5em;
    }
    
    .practice-area-detail ul, .attorney-profile-detail ul, .news-detail ul, .news-detail ol, .comment ul, .comment ol {
        margin-left: 8%;   
    }
    .practice-area-detail ul li, .attorney-profile-detail ul li, .news-detail ul li, .news-detail ol li, .comment ul li, .comment ol li {
        margin: 1% 0;
    }
}

/* ==== BREAKPOINT - 1024px ==== */

@media (min-width: 1024px) {
 
    h1 { font-size: 2em; }
    
    h2 { font-size: 2.5em; }
    
    .button, #respond input.submit {
        line-height: 2.5em;
        font-size: 0.9em;
        transition: background 0.5s, color 0.5s;
    }
    
    .button:hover, #respond input.submit:hover {
        background: #264fa1;
        color: #fff;
    }
    
    .container-inner, .header-logo-inner, .footer {
        width: 960px;
    }
    
    .header-logo {
        box-shadow: 0 2px 10px 0 #999;
    }
    
    .container-inner {
        margin: -150px auto 0;
    }
    
    .header-logo-inner {
        margin: 0 auto;
        padding: 0 0 114px 0;
    }
    
    .header-logo-inner p {
        position: relative;
        z-index: 10000;
    }
    
    .home-feature h2 {
        width: 60%;
        margin-right: 0;
        margin-left: auto;
        text-align: left;
    }
    
    .home-feature .button {
        width: 25%;
    }
    
    .practice-area-info {
        width: 28%;
    }
    
    .practice-area-info h3 {
        font-size: 1em;
        font-weight: bold;
        height: 3.25em;
    }
    
    .practice-area-desc {
        text-align: left;
    }
    
    .practice-areas .practice-area-info {
        width: 28%;
    }
    
    .practice-areas .practice-area-img {
        float: none;
        display: block;
        width: 50%;
        margin: 0 auto;
    }
    
    .practice-areas .practice-area-info h3 {
        float: none;
        display: block;
        width: 100%;
    }
    
    .practice-areas .practice-area-desc {
        float: none;
        display: block;
        width: 100%;
    }
    
    .practice-areas .practice-area-link {
        float: none;
        width: 100%;
    }
    
    .practice-areas .practice-area-link a {
        line-height: 2.5em;
        padding: 0.3%;
    }
    
    .nav {
        background: #264fa1;
    }
    
    .nav ul {
        width: auto;
        display: block;
        margin-left: 225px;
    }
    
    .nav ul li {
        display: inline-block;
        width: auto;
        border: 0;
        padding: 0;
        background: none;        
        font-size: 1em;
    }
    
    .nav ul li a {
        color: #fff;        
        font-weight: normal;
        background: none;
        padding: 10px 20px;
        transition: background-color 0.5s, color 0.5s;
    }
    
    .nav ul li a:hover {
        background: #d9b06f;
        color: #766442;
    }
    
    .callout {
        padding: 15% 0 0 0;
    }
    
    .callout-home {
        padding: 10% 50% 0 0;
    }
    
    .callout-home .callout-text {
        padding: 5%;
    }
    
    .callout-text  {
        padding: 1% 5%;   
    }
    
    .contact-address-detail {
        width: 50%;
        float: left;
    }
    
    .contact-form {
        width: 50%;
        float: left;
    }
    
    .google-maps {
        padding-bottom: 50%;
    }
    
    .ccf-form-wrapper {
        width: 50%;
    }
}

/* ==== BREAKPOINT - 1350px ==== */

@media (min-width: 1350px) {
    
    .container-inner, .header-logo-inner, .footer {
        width: 1140px;
    }
    
    .nav ul li {
        font-size: 1.25em;
    }
    
    .header-logo-inner {
        padding: 0 0 110px 0;
    }
    
    .home-feature-image, .profile-image {
        width: 25%;
    }
    
    .home-feature-text {
        width: 70%;
    }
    
    .home-feature h2 {
        width: 70%;
        margin-right: 0;
        margin-left: auto;
        text-align: left;
    }
}