
.author_page_main_data {
    display: grid;
    grid-template-areas:
        'avatar name'
        'avatar about'
        'avatar social';
    gap: 10px 30px;
    grid-template-columns: 110px 1fr;
    align-items: center;
}

.author_page_avatar {
    grid-area: avatar;
    align-self: self-start;
}

.author_page_name {
    grid-area: name;
}

.author_page_short_description {
    grid-area: about;
    line-height: 2;
}

.author_page_avatar > img {
    width: 100%;
    height: auto;
    border-radius: 100%;
    box-shadow: 0px 0px 6px #00000029;
}

.author_page_name,
.author_page_caption{
    font-size: 30px;
    line-height: 1.3;
    font-weight: bold;
    color: #333333;
    margin-bottom: 0;
}

.author_page_tab_list_wrapper {
    background: #F3F3F3;
    margin: 0;
    position: sticky;
    top: 100px;
}

.atl_item {
    font-size: 18px;
    font-weight: 500;
    color: #333333;
    padding: 20px 15px;
    display: inline-block;
    position: relative;
    cursor: pointer;
}

.atl_item:before {
    transition: all 450ms;
    content: "";
    display: block;
    position: absolute;
    top: 100%;
    height: 5px;
    width: 100%;
    border-radius: 5px;
    background: #F24175;
    left: 0;
    transform: translateY(-50%);
    opacity: 0;
}

.author_page_description {
    font-size: 18px;
    color: #333333;
    line-height: 32px;
}

.author_posts_counter_wrapper {
    display: flex;
    flex-flow: row wrap;
    gap: 20px;
}

.author_post_counter {
    flex: 0 0 30%;
    box-shadow: 0px 0px 6px #00000029;
    border-radius: 5px;
    background: #333;
    display: block;
    text-align: center;
    color: #FFFFFF;
    font-size: 18px;
    padding: 15px;
    min-width: 280px;
}

._counter {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 10px;
}

.author_post_counter.--reviewed {
    background: #F3F3F3;
    color: #333;
}

.atl_item:hover {
    text-decoration: none;
    color: #f64073;
}

.atl_item:hover:before,
.--active:before{
    opacity: 1;
}

.similar_author_list {
    display: flex;
    flex-flow: row wrap;
    gap: 20px clamp(20px, 4%, 46px);
}

.similar_author_item {
    flex: 1 0 30%;
    max-width: 349px;
    box-shadow: 0px 0px 6px #00000029;
    border-radius: 30px 30px 30px 0px;
    padding: 20px;
}

.sai_header {
    display: flex;
    align-items: center;
    gap: 23px;
    margin-bottom: 28px;
}

.sai_name {
    flex: 0 1 100%;
    font: normal normal bold 24px/30px Ubuntu;
    letter-spacing: 0px;
    color: #333333;
}

.sai_avatar {
    flex: 0 0 64px;
    min-height: 64px;
    overflow: hidden;
    border-radius: 100%;
    box-shadow: 0px 0px 6px #00000029;
}

.sai_avatar > img {
    width: 100%;
    height: auto;
    
}

.sai_about {
    font: normal normal normal 18px/32px Ubuntu;
    color: #333333;
    margin-bottom: 20px;
    overflow:hidden;
    -webkit-box-orient: vertical;
    display: block;
    display: -webkit-box;
    overflow: hidden !important;
    text-overflow: ellipsis;
    -webkit-line-clamp: 7;
}

.sai_actions {
    margin-top: auto;
    text-align: right;
}

.sai_inner {
    display: flex;
    flex-flow: column;
    height: 100%;
}

.sai_inner > * {
    flex: 0 0 auto;
    width: 100%;
}

.sai_actions > a {
    background: #333333;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    width: 43px;
    height: 43px;
    border-radius: 100%;
    margin-left: auto;
    padding: 10px;
}

.sai_actions > a:hover {
    color: #f64073;
}

.similar_posts_wrapper, .author_page_description, .author_posts_counter_wrapper, .contact_form_wrapper {
    padding-bottom: clamp(35px, 5%, 55px);
}
.author_page_caption {
    margin-bottom: clamp(35px, 5%, 55px);
}

.author_contact_form {
    max-width: 870px;
    margin: auto;
}

.author_contact_form form.wpcf7-form .user-subject,
.author_contact_form form.wpcf7-form .user-message, 
.author_contact_form form.wpcf7-form .drop_down,
.author_contact_form form.wpcf7-form .user-name,
.author_contact_form form.wpcf7-form .user-email {
    margin-bottom: 20px;
}

.author_contact_form  .cf7sr-g-recaptcha {
    display: inline-block;
    float: left;
}

.author_contact_form  input.wpcf7-form-control.wpcf7-submit {
    float: right;
    margin-top: 20px;
    min-height: 50px;
    min-width: 200px;
    font-weight: 500;
}

.author_social_wrapper {
    grid-area: social;
}

.author_social_wrapper hr {
    max-width: 40%;
    margin: 0 0 30px;
}

.author_social_caption {
    margin-bottom: 10px;
    font-size: 14px;
    letter-spacing: 0px;
    color: #333333;
}

.author_page_tab_list_wrapper:not(.--inactive) + * .main-box-inside > *:first-child {
    padding-top: clamp(30px, 5%, 55px);
}

.author_social_list {
    display: flex;
    align-items: center;
    flex-flow: row wrap;
    gap: 11px;
}

a.author_social_item {
    flex: 0 0 36px;
    box-shadow: 0px 0px 6px #00000029;
    background: #fff;
    border-radius: 100%;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px;
    color: #171B20;
}

a.author_social_item > svg {
    width: 100%;
    height: auto;
    max-height: 100%;
    max-width: 15px;
}

a.author_social_item:hover {
    color: #f24175;
}

.author_page_tab_list_wrapper .container {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.author_social_wrapper hr {
    background-color: #333;
}


.author_page_tab_list_wrapper.--inactive{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    visibility: hidden;
    opacity: 0;
    transform: translateY(-100%);
    transition: position 450ms;
}

.author_page_tab_list_wrapper.--show{
    top: 0px;
    visibility: visible;
    opacity: 1;
    transform: translateY(0%);
    
}

.author_page_tab_list_wrapper.--show ~ .author_page_tab_list_wrapper{
    opacity: 0;
    visibility: hidden;
}

.admin-bar .author_page_tab_list_wrapper.--show{
    top: 32px;
}




/*      */


.blocker {
    z-index: 10000;
}
.modal.authorModal {
    padding: 12px 10px;
    max-width: 768px;
}
.modal.authorModal .contact_form_block {
    margin-bottom: 0;
}
.authorModalBtn{
    color: #F24175;
    transition: 0.3s;
}
.modalControlBlock{
    padding-top: 20px;
}
.form_icon.--caption {
    font-size: 18px;
    font-weight: bold;
}
.wpcf7-response-output.wpcf7-spam-blocked {
    border: 2px solid #ffa500;
}

.wpcf7-select.selected {
    color: #333;
}

select.wpcf7-not-valid {
    border-color: #f1c40f;
}
.contact_form_block span.wpcf7-form-control-wrap textarea{
    resize: vertical;
}
.contact_form_block span.wpcf7-form-control-wrap input, .contact_form_block span.wpcf7-form-control-wrap textarea, span.wpcf7-form-control-wrap select {
    color: #333;
}
.contact_form_block span.wpcf7-form-control-wrap input::placeholder, .contact_form_block span.wpcf7-form-control-wrap textarea::placeholder, span.wpcf7-form-control-wrap select{
    color: #757575;
}
.author-header {
    display: flex;
    gap: 10px;
}

.social_items {
    flex: 0 1 auto;
    display: flex;
    align-items: center;
}

a.author-social-link > svg {
    width: 30px;
    height: 30px;
}

a.author-social-link.--twitter {
    display: flex;
    align-items: center;
    line-height: 1;
    color: #0f0f0f;
    transition: all 450ms;
}

a.author-social-link.--twitter:hover {
    color: #2ba2ef;
}



@media(max-width: 890px){
    .similar_author_list {
        max-width: 576px;
        margin: auto;
        gap: 40px;
    }

    .similar_author_item {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media(max-width: 768px){
    .tpl-new-author .main-box{
        margin-bottom: 0;
    }
    .author_page_tab_list_wrapper {
        display: none;
    }

    .author_page_main_data {
        grid-template-areas:
            'avatar name'
            'about about'
            'social social';
        gap: 20px;
        grid-template-columns: 60px 1fr;
    }

    .author_social_wrapper hr {
        margin: 5px 0 30px;
    }

    .author_post_counter {
        flex: 0 0 100%;
    }
    .author_posts_counter_wrapper {
        gap: 40px;
    }

    .author_contact_form .cf7sr-g-recaptcha {
        float: none;
    }
    .author_contact_form input.wpcf7-form-control.wpcf7-submit {
        float: none;
        margin-left: auto;
        margin-right: auto;
        width: 100%;
        max-width: 200px;
    }

    .author_contact_form span.wpcf7-form-control-wrap.cf7sr-recaptcha {
        height: auto;
        width: 100%;
        float: none;
        clear: both;
        display: block;
    }

    .author_contact_form form.wpcf7-form {
        text-align: center;
    }
}

@media (max-width: 600px){
    .modal.authorModal .contact_form_block .wpcf7{
        padding: 20px 20px 10px;
    }

    .contact_form_block .wpcf7 > form > p{
        margin-bottom: 0;
    }
    .contact_form_block .wpcf7-form p > input[type="submit"]{
        float: none;
    }
}

@media(max-width: 450px){
    .blocker{
        padding: 0;
    }
}