/*
Theme Name: Divi child rSpeak
Theme URI: http://mydomain.com/
Version: 1.0
Description: A customized version of Divi which adds a number of tiny features I need.
Author: Your Name
Author URI: http://www.yourwebsite.com
Template: Divi
*/



/* general */
.header-content h1 {
    line-height: 2em;
}
.et_pb_fullwidth_header .et_pb_fullwidth_header_container.center .header-content {
    width: 100%;
    max-width: 1000px;
    margin: 20px auto;
}

/* MENU HOVER */
#top-menu a:hover {
    color: #2850a0;
}
.et_header_style_left .et-fixed-header #et-top-navigation nav > ul > li > a:hover {
    color: #a336ea !important;
}

/* ziofix form */
.ziofix-form textarea#voice-demo-text {
    display: block;
    width: 50%;
    float: left;
    min-height: 0px!important;
    height: 75px!important;
    margin-top: 9px;
    border: 3px solid #ffffff;
    border-radius: 5px;
    margin-right: 50px;
}
.ziofix-form .language-select {
    display: block;
    float: left;
    margin-right: 50px;
}
.ziofix-form label.noshow {
    display: none;
}
.ziofix-form input#rspeak-voice-demo-submit {
    margin-top: 5px;
    background: #ffffff;
    color: #3264c8;
    border: 3px solid #ffffff;
    border-radius: 10px;
    -webkit-transition: border 0.3s;
    -moz-transition: border 0.3s;
    transition: border 0.3s;
}
.ziofix-form input#rspeak-voice-demo-submit:hover {
    border-color: #3264c8;
}
.ziofix-form {
    padding: 0px 0px 50px 0px;
}
.ziofix-form select#voice-demo-lang {
    border: 3px solid #ffffff;
    border-radius: 5px;
}
.ziofix-form .voice-demo-terms {
    float: left;
}
.home-header {
    padding-bottom: 0px;
}
.ziofix-form .header-content-container.center {
    padding-left: 63px;
}

/* rs-button*/
#readspeaker_button-296,
#readspeaker_button-285,
#readspeaker_button-799,
#readspeaker_button-812,
#readspeaker_button-820,
#readspeaker_button-283,
#readspeaker_button-289,
#readspeaker_button-394 {
    position: absolute;
    top: 30px;
        left: 120px;
}

.entry-content {
    position: relative;
}
/*title*/
.bold-title-space h4 {
    line-height: 2.5em;
}
.bold-title-space-blue h4 {
    line-height: 2.5em;
    color: #3264c8;
}
.bold-title-space h3 {
    line-height: 2.5em;
}
.black-title h2 {
    line-height: 2.5em;
}

/*News*/
.post {
    border-bottom: 1px solid #CCC;
    margin-bottom: 0.5em;
}
a.more-link {
    margin-top: 10px;
}
.et_pb_post.et_pb_no_thumb.post.type-post.status-publish.format-standard.hentry {
    display: inline-block;
}

.et_pb_post.et_pb_no_thumb h2.entry-title {
    font-weight: 700;
    font-size: 20px;
    color: #3264c8;
}
.et_pb_post.et_pb_no_thumb p.post-meta {
    font-size: 12px!important;
}
/*
.et_pb_post.et_pb_no_thumb.post.type-post.status-publish.format-standard.hentry .rsbtn {
    display: none;
}
*/
.et_pb_post.et_pb_no_thumb.post.type-post.status-publish.format-standard.hentry {
    padding: 15px 30px;
}

/* ASK A QUESTION IMG */
.et_pb_section.no-bottom {
    padding-bottom: 0px;
}
.no-bottom .et_pb_module.et-waypoint.et_pb_image.et_pb_animation_off.et_pb_image_0.et_always_center_on_mobile.et-animated {
    margin-bottom: 0px;
}
.no-bottom .et_pb_row {
    padding-bottom: 0px;
}

/* btn listen */
body #page-container .et_pb_button.et_pb_module.active, body #page-container .et_pb_more_button.et_pb_button.active {
    background: #3264c8;
    color: #ffffff !important;
}

/* HOME SLIDERS */
.et_pb_section.char-sliders.et_pb_section_1.et_pb_with_background.et_section_regular img.active {
    height: 170px;
}
.et_pb_section.char-sliders.et_pb_section_1.et_pb_with_background.et_section_regular .et_pb_slide_description {
    padding: 20px !important;
}

/* button color */
.et_pb_sum, .et_pb_pricing li a, .et_pb_pricing_table_button, .et_overlay:before, .et_pb_member_social_links a:hover, .woocommerce-page #content input.button:hover .et_pb_widget li a:hover, .et_pb_bg_layout_light .et_pb_promo_button, .et_pb_bg_layout_light.et_pb_module.et_pb_button, .et_pb_bg_layout_light .et_pb_more_button, .et_pb_filterable_portfolio .et_pb_portfolio_filters li a.active, .et_pb_filterable_portfolio .et_pb_portofolio_pagination ul li a.active, .et_pb_gallery .et_pb_gallery_pagination ul li a.active, .et_pb_contact_submit, .et_pb_bg_layout_light .et_pb_newsletter_button {
    color: #3366cc;
}

/* Contact form */
.et_pb_text.et_pb_module.et_pb_bg_layout_light.et_pb_text_align_left.contact-form.et_pb_text_1 {
    background: #f7f7f7;
    padding: 40px;
}
#contactform #submitbutton {
    background: none repeat scroll 0 0 #ffffff !important;
    border-radius: 10px !important;
    border: 2px solid #3264c8 !important;
    padding: 11px!important;
    font-size: 18px !important;
    color: #3264c8 !important;
}
#contactform #submitbutton:hover, #contactform #submitbutton:active, #contactform #submitbutton:focus {
    background: none repeat scroll 0 0 #3264c8 !important;
    color: #ffffff !important;
}



/*                  RESPONSIVE                 */
@media (min-width:1120px) and (max-width:1169px) {
#et_top_search {
    margin: 0 -20px 0 0;
}
}
@media (min-width:991px) and (max-width:1119px) {

#readspeaker_button-296,
#readspeaker_button-285,
#readspeaker_button-799,
#readspeaker_button-812,
#readspeaker_button-820,
#readspeaker_button-283,
#readspeaker_button-289,
#readspeaker_button-394 {
    top: 70px !important;
    left: 90px !important;
}
#et_top_search {
    margin: -125px 0 0 0;
}

}

/* ==========================================================================
   Forms
   ========================================================================== */


.hs-form-required {
    display: none;
}

.hs-form-field {
    position: relative;
    margin: 5px 0 15px 0;
}

.hs-form fieldset.form-columns-1 .hs-input {
    width: 100% !important;
}


.hs-form fieldset.form-columns-2 .input {
    margin-right: 8px;
    height: 40px;
    font-size: 12px;
    color:black;
}

.hs-form .hs-form-field input:not([type='checkbox']) {
    width: 100%;
    cursor: initial;
    outline: none;
    padding: 0 10px 0 10px;
    height: 40px;
    border: 1px solid rgba(0,0,0,0.2);
    border-radius: {{ generalBorderRadius }};
    background: rgba(255,255,255,1);
    box-shadow: none;
    font-weight: 300;
    -webkit-transition: border 0.3s;
    -moz-transition: border 0.3s;
    transition: border 0.3s;
    font-size: 12px !important;
    color:black !important;

}

.hs-form .hs-form-field select {
    -webkit-appearance: none;
    -webkit-box-align: initial;
    -webkit-align-items: center;
    -ms-flex-align: initial;
    padding: 0 24px 0 10px;
    height: 40px;
    background: rgba(255,255,255,1) url("http://www.rspeak.com/wp-content/uploads/2015/12/dropdown-icon.png");
    background-repeat: no-repeat;
    background-position: 96% center;
    outline: none;
    width: 100%;
    border: 1px solid rgba(0,0,0,0.2);
    border-radius: {{ generalBorderRadius }};
    -webkit-border-radius: {{ generalBorderRadius }};
    -moz-appearance: inherit;
    -webkit-appearance: none;
    -moz-user-select: inherit;
    -webkit-user-select: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
    outline: none;
    overflow: hidden;
    text-indent: .01px;
    text-overflow: '';
    font-weight: 300;
    -webkit-transition: border 0.3s;
    -moz-transition: border 0.3s;
    transition: border 0.3s;
    font-size: 12px;

}

.hs-form textarea {
    width: 100% !important;
    min-height: 110px;
    border: 1px solid rgba(0,0,0,0.2);
    border-radius: {{ generalBorderRadius }};
    background: rgba(255,255,255,1);
    padding: 10px;
    font-weight: 300;
    outline: none;
    -webkit-transition: border 0.3s;
    -moz-transition: border 0.3s;
    transition: border 0.3s;
    font-size: 12px;
}

.hs-form ul.inputs-list {
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 12px;

}

.hs-form ul.inputs-list input {
    margin-right: 8px;
    font-size: 12px;
}

.hs_submit {
    margin-right: 8px;
    max-width:475px;
}

.hs-form .hs-button {
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    width: 100%;
    background: #3366CC;
    color: #ffffff;
    padding: 20px;
    text-transform: uppercase;
    border: 1px solid #3366CC;
    border-radius: 5px;
    appearance: button;
    -moz-appearance: button;
    -webkit-appearance: button;
    -webkit-transition: background {{ baseTransitionTime }}, color {{ baseTransitionTime }}, border {{ baseTransitionTime }};
    -moz-transition: background {{ baseTransitionTime }}, color {{ baseTransitionTime }}, border {{ baseTransitionTime }};
    transition: background {{ baseTransitionTime }}, color {{ baseTransitionTime }}, border {{ baseTransitionTime }};
}

.hs-form .hs-button:hover {
    background: #113885;
    border: 1px solid #113885;
    color: #ffffff;
}

.hs-form .hs-form-field .hs-form-radio {
    margin-left: 20px;
}

.hs-form .hs-form-field .hs-form-radio input {
    width: 20px !important;
}

.hs-form .hs-form-field .hs-form-radio label span {
    margin: -34px 0 0 28px;
    display: block;
}

.hs-form .hs-form-field input:not([type='checkbox']):focus, .hs-form textarea:focus, .hs-form .hs-form-field select:focus {
    border: 1px solid black;
}

.hs-form .hs-error-msgs {
    animation-name: none;
    animation-duration: 0.5s;
}


.hs-form .hs-error-msgs label {
    background: rgba(0,0,0,0);
    width: 96%;
    padding: 0px;
    color: {{ baseOrange }};
    text-align: left;
    font-size: 14px;
}

@keyframes error-msgs {
    from {
        opacity: 0;
        top: -45px;
    }
    to {
        opacity: 1;
    }
}

.hs-form .hs-form-field .input {
    font-size: 12px !important;
    color:black !important;
    font-weight: bold !important;
}

.hs_message field hs-form-field .input {
    font-size: 12px !important;
    color:black !important;
    font-weight: bold !important;
}

/* Home page */

@media screen and (min-width: 769px) {
    #slogan {
    white-space: nowrap;
   }
}
@media screen and (min-width: 769px) {
    .slogan {
    padding-right: 100px;
   }
}
@media screen and (min-width: 769px) {
    .slogan-img {
    padding-right: 100px;
   }
}
@media screen and (max-width: 568px) {
    #slogan {
    font-size: 85%;
   }
}

/*  DEMO PLUGIN -  ALSO SEE THE CSS IN THE PAGE MODULES FOR THE DEMO STYLING */


#voice-demo-text {
  width: 95%;
  min-height: 80px;
}

#rspeak-voice-demo-submit, #rsbtn_simple_player {
  display: inline-block;
  *display: inline;
  zoom: 1;
  padding: 6px 20px;
  margin: 15px 0 0 0;
  cursor: pointer;
  border: 1px solid #bbb;
  overflow: visible;
  font: bold 13px arial, helvetica, sans-serif;
  text-decoration: none;
  white-space: nowrap;
  color: #555;
  background-color: #ddd;
  background-image: linear-gradient(top, rgba(255,255,255,1),
                                         rgba(255,255,255,0)),
                    url(data:image/png;base64,iVBORw0KGg[...]QmCC);
  transition: background-color .2s ease-out;
  background-clip: padding-box; /* Fix bleeding */
  border-radius: 3px;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .3),
              0 2px 2px -1px rgba(0, 0, 0, .5),
              0 1px 0 rgba(255, 255, 255, .3) inset;
  text-shadow: 0 1px 0 rgba(255,255,255, .9);
}

#rspeak-voice-demo-submit:hover, #rsbtn_simple_player:hover {
  background-color: #eee;
  color: #555;
}

#rspeak-voice-demo-submit:active, #rsbtn_simple_player:active {
  background: #e9e9e9;
  position: relative;
  top: 1px;
  text-shadow: none;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .3) inset;
}


#rsbtn_simple_player {
    width: 73px;
}

#contactform select, #contactform textarea {
    border: 1px solid #CCC;
    margin: 4px 0 20px 0;
    padding-left: .6em;
    height: 2.05em;
    width: 50%;
}

#contactform textarea {
    height: auto;
}
@media screen and (max-width: 767px) {
    .ziofix-form textarea#voice-demo-text {
        width: 100%;
    }
    #readspeaker_button-296,
    #readspeaker_button-285,
    #readspeaker_button-799,
    #readspeaker_button-812,
    #readspeaker_button-820,
    #readspeaker_button-283,
    #readspeaker_button-289,
    #readspeaker_button-394 {
        left: 15px;
    }
    .ziofix-form .header-content-container.center {
        padding-left: 0;
    }
}