/*
===================================================
=
= WordPress basics styles
=
=====================================================================
*/

// Edit link 

span.edit-link a {
    
    font-size: 13px;
    text-transform:uppercase;
    font-weight:bold;
    letter-spacing:0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}

span.edit-link a:before {

    content:'-';
    display:inline-block;
    margin-right:3px;
}

// sticky

.sticky,
.bypostauthor {

    background:transparent; // wp recommeded classes, does nothing
}



/*
===================================================
=
= Wp skip to button
=
=====================================================================
*/

.screen-reader-shortcut {

    box-shadow:none !important;
    font-size: 16px;
    font-weight:400;
}


/*
===================================================
=
= WordPress Gallery
=
=====================================================================
*/


.gallery {

    margin-bottom: 1.5em;
    margin-left: -2%;
}

.gallery-item {

    display: inline-block;
    text-align: center;
    vertical-align: top;
    width: 100%;
    margin-bottom: 3%;
    margin-left: 2%;
}

.site-main .gallery a img {

    max-width: none;
    width: 100%;
}

.gallery-columns-2 .gallery-item {

    max-width: 47%;
}

.gallery-columns-3 .gallery-item {

    max-width: 31.33%;
}

.gallery-columns-4 .gallery-item {

    max-width: 23%;
}

.gallery-columns-5 .gallery-item {

    max-width: 18%;
}

.gallery-columns-6 .gallery-item {

    max-width: 14.66%;
}

.gallery-columns-7 .gallery-item {

    max-width: 12.28%;
}

.gallery-columns-8 .gallery-item {

    max-width: 10.5%;
}

.gallery-columns-9 .gallery-item {

    max-width: 9.11%;
}

.gallery-caption {

    display: block;
}



/*
===================================================
=
= WordPress comment box
=
=====================================================================
*/

 .comments-area {

    margin: 0;
}

 .comments-area textarea {

    padding:20px;
 }

  .comments-area textarea,
  .comments-area input {
    
    margin-bottom:30px;
}

.comments-area .comments-title,
.comment-respond .comment-reply-title {

    font-size: 24px;
    margin: 0 0 15px;
}

.comments-area ol {

    margin: 0;
    padding: 0;
    list-style: none;
}

.comments-area .comment-list {

    background: transparent;
    padding: 0;
    border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -webkit-border-radius: 0;
    -o-border-radius: 0;
    margin:30px 0;
}

.comments-area .comment-body {
    
    display:block;
    overflow: hidden;
    margin: 0 0 30px;
    padding: 30px;
}

.comments-area .children {

    margin-left: 25px;
}

.comments-area .children li {
    
    position: relative;
    margin-bottom:30px;
    
}

.comments-area .children li.depth-2,
.comments-area .children li.depth-3,
.comments-area .children li.depth-4,
.comments-area .children li.depth-5,
.comments-area .children li.depth-6    {

    padding-left:25px;
}

.comments-area .comment-body .comment-meta {

    background:transparent;
    padding: 0;
    margin:0;
    padding-bottom: 10px;
    margin-bottom: 15px;
}

.comments-area .comment-body .comment-meta img {

    border-radius: 100%;
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0 2px 8px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 2px 8px rgba(0,0,0,0.2);
    -o-box-shadow: 0 2px 8px rgba(0,0,0,0.2);
    -ms-box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}

.comments-area .comment-body .fn,
.comments-area .comment-body .fn a {
    
    display: block;
    font-size: 17px;
    font-weight:500;
    line-height: 21px;
    letter-spacing:0;
    text-transform:capitalize;
    margin:15px 0 5px 0;
}

.comments-area .comment-body .fn a {

    display:inline-block;
}

.comments-area .comment-body .fn a:hover,
.comments-area .comment-body .fn a:focus {

    text-decoration: none;
}

.comments-area .comment-body .says {

    display: none;
}


.comments-area .comment-body .comment-metadata a {
    
    display:inline-block;
    font-style:italic;
    font-size:13px;
    font-weight:normal;
}

.comments-area .comment-body .comment-metadata a:hover,
.comments-area .comment-body .comment-metadata a:focus {

    text-decoration: none;
}

.comments-area .comment-body .comment-metadata .edit-link {

    padding-left:15px;
}

.comments-area .comment-body .comment-metadata .edit-link:before {

    content:'\f365';
    font-family: "Ionicons";
    padding-right:5px;

}

.comments-area .comment-body .reply a {

    text-decoration: none;
    font-style:italic;
    font-size:13px;
    letter-spacing:0.15px;
    text-transform:capitalize;
    font-weight:500;
}

.comments-area .comment-body .reply a:hover,
.comments-area .comment-body .reply a:focus {

    text-decoration: none;
}

.comments-area .comment-body .comment-content {
    
    font-size: 16px;
    margin-bottom:20px;
}

.comments-area .comment-body .comment-content p {

    margin: 0 0 10px;
}


// Comment respond 

.comment-respond {
    padding: 30px;
    margin-bottom:30px;
}

.comment-respond .comment-form {

    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: stretch;
    align-content: stretch;
}

.comment-respond .comment-form-comment,
.comment-respond .comment-form-email,
.comment-respond .comment-form-url,
.comment-respond .comment-form-cookies-consent,
.comment-respond .form-submit,
.comment-respond .comment-notes,
.comment-respond .comment-subscription-form,
.comment-respond .comment-subscription-form,
.comment-respond .mc4wp-checkbox-wp-comment-form {

    width:100%;
}

.comment-form .comment-form-author,
.comment-form .comment-form-email {
    
    width:50%;
}

.comment-respond .comment-notes {

    margin-bottom:20px;
}

.comment-form .comment-form-author {

    padding-right:15px;
}

.comment-form .comment-form-email  {

    padding-left:15px;
}

.comment-respond .comment-form-cookies-consent,
.comment-respond .comment-subscription-form,
.comment-respond .mc4wp-checkbox-wp-comment-form {

    margin-bottom:30px;
    display: flex;
    align-items: flex-start;
}

.comment-respond .comment-form-cookies-consent input[type="checkbox"],
.comment-respond .comment-subscription-form input[type="checkbox"],
.comment-respond .mc4wp-checkbox-wp-comment-form input[type="checkbox"] {

    display:inline-block;
    margin:0;
    line-height:21px;
}

.comment-respond .comment-form-comment label,
.comment-respond .comment-form-author label,
.comment-respond .comment-form-email label,
.comment-respond .comment-form-url label {
    
    display:block;
    padding-left:3px;
    margin-bottom: 5px;
    font-weight:400;
}

.comment-respond .comment-form-cookies-consent label,
.comment-respond .comment-subscription-form label,
.comment-respond .mc4wp-checkbox-wp-comment-form label {

    line-height:21px;
    padding-left:5px;
    margin-top: -5px;
    margin-bottom:0;
}

.comment-respond .form-submit input {

    margin-bottom:0;
    padding-left: 40px;
    padding-right: 40px;
    height: 45px;
    @include border-radius(25px);
}

.akismet_comment_form_privacy_notice {

    display:none;
}


// Media Query for Comment box only


@media ( max-width:1024px ) {

    .comment-respond {

        padding:40px;
    }
}

@media ( max-width:992px ) {

    .comment-respond {

        padding:30px;
    }
}

@media ( max-width:768px ) {


    .comments-area .children,
    .comments-area .children li,
    .comments-area .children li.depth-2,
    .comments-area .children li.depth-3,
    .comments-area .children li.depth-4, 
    .comments-area .children li.depth-5, 
    .comments-area .children li.depth-6,
    .comments-area .children li.depth-7,
    .comments-area .children li.depth-8,
    .comments-area .children li.depth-9,
    .comments-area .children li.depth-10 {

        padding-left:0;
        margin-left:0;
    }

    .comment-form .comment-form-author, 
    .comment-form .comment-form-email {
    
        width:100%;
    }

    .comment-form .comment-form-author {

        padding-right:0;
    }

    .comment-form .comment-form-email {

        padding-left:0;
    }

    .comment-respond .comment-form-cookies-consent,
    .comment-respond .comment-subscription-form,
    .comment-respond .mc4wp-checkbox-wp-comment-form  {

        display:none;
    }
}



/*
===================================================
=
= Contact form 7 
=
=====================================================================
*/



.wpcf7 label {

    display: block;
    margin-bottom: 15px;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="email"],
.wpcf7 input[type="url"],
.wpcf7 input[type="password"],
.wpcf7 input[type="search"],
.wpcf7 textarea,
.wpcf7 select {

    width: 100%;
    margin-top: 10px;
}

.wpcf7 input[type="submit"],
.wpcf7 input[type="button"] {

    border: none;
    text-align: center;
    text-transform: capitalize;
    padding: 15px 50px;
    font-size: 16px;
    @include transation_delay();
}

.wpcf7 input[type="submit"]:hover,
.wpcf7 input[type="button"]:hover {

    border: none;
}

.wpcf7 input[type="submit"]:focus,
.wpcf7 input[type="button"]:focus {

    outline:none;
    -moz-outline:none;
    -webkit-outline:none;
    -o-outline:none;
    -ms-outline:none;
}



/*
==================================
=
= wpform ( contact form )
=
===================================================
*/


body .wpforms-container .wpforms-form .wpforms-field-label {

    font-weight:500;
    margin: 0 0 10px 0;
}

body .wpforms-container .wpforms-form .wpforms-field-sublabel {

    margin: 10px 0 0;
}

body .wpforms-container .wpforms-form input[type=date], 
body .wpforms-container .wpforms-form input[type=datetime], 
body .wpforms-container .wpforms-form input[type=datetime-local], 
body .wpforms-container .wpforms-form input[type=email], 
body .wpforms-container .wpforms-form input[type=month], 
body .wpforms-container .wpforms-form input[type=number], 
body .wpforms-container .wpforms-form input[type=password], 
body .wpforms-container .wpforms-form input[type=range], 
body .wpforms-container .wpforms-form input[type=search], 
body .wpforms-container .wpforms-form input[type=tel], 
body .wpforms-container .wpforms-form input[type=text], 
body .wpforms-container .wpforms-form input[type=time], 
body .wpforms-container .wpforms-form input[type=url], 
body .wpforms-container .wpforms-form input[type=week], 
body .wpforms-container .wpforms-form select, 
body .wpforms-container .wpforms-form textarea {

    border-color:$border_color;
    border-radius:0;
    height: 48px;
}

body .wpforms-container .wpforms-form input[type=submit], 
body .wpforms-container .wpforms-form button[type=submit],
body .wpforms-container .wpforms-form .wpforms-page-button {

    border:none;
    padding:13px 40px;
    font-size: 16px;
    text-transform:capitalize;
}

body .wpforms-container .wpforms-form input[type=submit]:hover, 
body .wpforms-container .wpforms-form button[type=submit]:hover,
body .wpforms-container .wpforms-form .wpforms-page-button:hover {

    border:none;
}


/*
==========================================
=
= Jetpack subscription widget
=
======================================================
*/


.jetpack_subscription_widget input[type="email"] {

    margin:30px 0;
    padding-left:15px;
}


.jetpack_subscription_widget #subscribe-email input {

    width:100% !important;
    max-width:100%;
}

.jetpack_subscription_widget input[type="submit"] {

    padding:15px 40px;
    text-align: center;
    font-weight: 500;
    font-size: 16px;
    text-transform: capitalize;
    cursor: pointer;
    border:none;

}



/*
=============================
=
= Infinate scroll
=
============================================
*/


// Older / Newer Posts Navigation (always hidden) */

.infinite-scroll.neverending .site-footer {

   // Theme Footer (when set to scrolling) 

    display: none;
}


// When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before

.infinity-end.neverending .site-footer {

    display: block;
}

#infinite-footer {

    display: none;
}