body{
    font-family: Helvetica, Arial!important;
    color: #424D61;
    background: #F2F2F2;
}

#top_counter {
    padding: 10px;
    margin-top: 3px;
    margin-bottom: 10px;
}
#box[placeholder]:empty:before {
    content: attr(placeholder);
    color: #aaa;
}
#box {
    overflow-y: auto;
}
#box-readonly, #for_textarea {
    padding: 6px 12px;
    color: #555;
    overflow: auto;
    display:none;
    border: 1px solid #ccc;
    white-space: pre-wrap;
    border-radius: 4px;
    background-color: white;
}
.navbar-default .navbar-brand {
    color: #ecf0f1;
}


#revert_icon{
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}
.navbar-default .navbar-nav > li > a {
    color: #ecf0f1;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
    color: #ceefff;
    background-color: #2a6496;
}
.navbar-default .navbar-nav > .dropdown > a .caret {
    border-top-color: #ecf0f1;
    border-bottom-color: #ecf0f1;
}
.navbar-default .navbar-nav > .dropdown > a:hover .caret,
.navbar-default .navbar-nav > .dropdown > a:focus .caret {
    border-top-color: #ceefff;
    border-bottom-color: #ceefff;
}

.navbar-default .navbar-toggle {
    border-color: #2a6496;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
    background-color: #2a6496;
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #ecf0f1;
}
.navbar-default .navbar-nav>li>a {
    color: #F2F2F2;
}
@media (max-width: 767px) {
    .navbar-default .navbar-nav .open .dropdown-menu > li > a {
        color: #ecf0f1;
    }
    .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
    .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
        color: #ceefff;
    }
}
.panel-heading .accordion-toggle:after {
    /* symbol for "opening" panels */
    font-family: 'Glyphicons Halflings'; /* essential for enabling glyphicon */
    content: "\e114"; /* adjust as needed, taken from bootstrap.css */
    float: right; /* adjust as needed */
    color: grey; /* adjust as needed */
}

.panel-heading .accordion-toggle.collapsed:after {
    /* symbol for "collapsed" panels */
    content: "\e080"; /* adjust as needed, taken from bootstrap.css */
}

.panel-heading {
    padding:5px
}

/* Style definition file generated by highlight 3.7, http://www.andre-simon.de/ */
/* Highlighting theme: vim kellys */
.num { color:#d1c79e; }
.esc { color:#9ab2c8; }
.str { color:#d1c79e; }
.pps { color:#d1c79e; }
.slc { color:#67686b; }
.com { color:#67686b; }
.ppc { color:#77cf63; }
.opt { color:#e1e0e5; }
.lin { color:#ffff99; }
.kwa { color:#62acce; }
.kwb { color:#e6ac32; }
.kwc { color:#cf8563; }
.kwd { color:#bb63cf; }

/*!
* Copyright 2013 Twitter, Inc under the Creative Commons license (https://creativecommons.org/licenses/by/3.0/)
*/
/*
* Callouts
*
* Not quite alerts, but custom and helpful notes for folks reading the docs.
* Requires a base and modifier class.
*/
.bs-callout {
    margin: 20px 0;
    padding: 20px;
    border-left: 3px solid #eeeeee;
}
.bs-callout h4 {
    margin-top: 0;
    margin-bottom: 5px;
}
.bs-callout p:last-child {
    margin-bottom: 0;
}
.bs-callout-danger {
    background-color: #fdf7f7;
    border-color: #eed3d7;
}
.bs-callout-danger h4 {
    color: #b94a48;
}
.bs-callout-warning {
    background-color: #faf8f0;
    border-color: #faebcc;
}
.bs-callout-warning h4 {
    color: #c09853;
}
.bs-callout-info {
    background-color: #f4f8fa;
    border-color: #bce8f1;
}
.bs-callout-info h4 {
    color: #3a87ad;
}
.highlight {
    background-color: #FFFF88;
}
.counted { font-weight: bold; }
/*
ins {
    background-color: #c6ffc6;
    text-decoration: none;
}

del {
    background-color: #ffc6c6;
}

div, table, h3, input, label {
    margin: 10px;
}

table th {
    width: 30%;
}
*/
ul.sprite {
    list-style-type: none;
    padding-left: 28px;
}
ul.sprite li:before {
    background-image:url(sprites.png);
}
ul.sprite li {
    padding-top:5px;
}
li.facebook:before {
    background-position: -133px -1px;
    width: 24px;
    height: 24px;
    left: 13px;
    display:block;
    position:absolute;
    content: " ";
}
li.chrome:before{
    background-position: -157px -1px;
    width: 24px;
    height: 24px;
    left: 13px;
    display:block;
    position:absolute;
    content: " ";
}
li.google:before{
    background-position: -109px -1px;
    width: 24px;
    height: 24px;
    left: 13px;
    display:block;
    position:absolute;
    content: " ";
}
li.ios:before{
    background-position: -84px 0;
    width: 24px;
    height: 24px;
    left: 13px;
    display:block;
    position:absolute;
    content: " ";
}
li.logo:before{
    background-position: 0 0;
    width: 36px;
    height: 36px;
    left: 13px;
    display:block;
    position:absolute;
    content: " ";
}
li.twitter:before{
    background-position: -61px -1px;
    width: 24px;
    height: 24px;
    left: 13px;
    display:block;
    position:absolute;
    content: " ";
}
li.wordpress:before{
    background-position: -37px -1px;
    width: 24px;
    height: 24px;
    left: 13px;
    display:block;
    position:absolute;
    content: " ";
}
div.grippie {
    background:#EEEEEE url(grippie.png) no-repeat scroll center 2px;
    border:1px solid #DDDDDD;
    border-width:0pt 1px 1px;
    cursor:s-resize;
    height:9px;
    overflow:hidden;
}
.resizable-textarea textarea {
    display:block;
    margin-bottom:0pt;
    width:100%;
    height: 20%;
}

.auth-clients{
    display: block !important;
    margin-bottom: 5px;
}

.auth-clients li a.google,
.auth-clients li a.twitter,
.auth-clients li a.facebook{
    background: url(../images/scfacebook.png) no-repeat;
    width: 162px !important;
    height: 31px;
    display: block;
    /*float: none;*/
}

.auth-clients li a.google{
    background: url(../images/scgoogle.png) no-repeat;
}

.auth-clients li a.twitter{
    background: url(../images/sctwitter.png) no-repeat;
}
.auth-clients li a .auth-title,
.auth-clients li a span{
    display: none !important;
}

.auth-clients li a:hover{

}

.auth-clients .auth-client .auth-link{
    width: auto;
}
.mb20{ margin-bottom: 20px; }
.mb10{ margin-bottom: 10px; }
.mt10{ margin-top: 10px; }
.mb0{ margin-bottom: 0; }
.mt0{ margin-top: 0 !important; }
.mr10{ margin-right: 10px; }
.ml10{ margin-left: 10px; }
.pr0{ padding-right: 0 !important; }
.pl0{ padding-left: 0 }
.box-center{ float: none !important; margin-left: auto; margin-right: auto; }

#revisions, #simple_version, #options, #original_version, #version-btn, #share-btn{
    -webkit-transition: all 500ms;
    -moz-transition: all 500ms;
    -o-transition: all 500ms;
    transition: all 500ms;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}
#version-btn.advanced .glyphicon-new-window {
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: 'FlipH';
    -ms-filter: "FlipH";
}
#btn-save-to-drive{
    -webkit-transition: all 500ms;
    -moz-transition: all 500ms;
    -o-transition: all 500ms;
    transition: all 500ms;
}
#revisions.active,
#btn-save-to-drive.success{
    background: rgba(88, 218, 134, 0.59);
}
#btn-save-to-drive.success>span:before{
    content: "\e013";
}
#btn-save-to-drive.loading>span:before{
    content: "\e031";
    -webkit-animation: glyphicon-spin 2s infinite linear;
    animation: glyphicon-spin 2s infinite linear;
}
.btn {
    padding: 4px 6px;
}
#speed, #print, #speech { border-left: none; }
.bootstrap-switch { margin-left: 1px; }
.openOptionTab{ cursor: pointer; }
.glyphicon-spin{
    -webkit-animation: glyphicon-spin 2s infinite linear;
    animation: glyphicon-spin 2s infinite linear;
}

#speed1 {
    border: 1px solid #CCCCCC;
    padding: 2px 8px 2px 8px;
    text-align: center;
    display: none;
    background-color: #fff;
}

@-webkit-keyframes glyphicon-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}
@keyframes glyphicon-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}
.option-tab{
    margin-top: 20px;
}
#details_buttons {
    position: relative;
}
#details ul{
    list-style-type: none;
}
.share_item{
    font-size: 9.4px;
}
.goal_embed {
    position: absolute;
    top: 7px;
    right: 17px;
    font-size: 18px;
}
#share_item_text,
#share_item_character,
#share_item_sentence,
#share_item_paragraph,
#share_item_page,
#share_item_line,
#share_item_reading-level {
    font-size: 100%;
    position: absolute;
    left: 4px;
    top: 6px;
    border-radius: 10px;
    margin-top: -3px;
}
#share_item_reading-level {
    margin-top: -1px;
}
#share-item-goal-link {
    position: absolute;
    top: 7px;
    right: 37px;
    font-size: 18px;
}
#share-item-speed-link {
    position: absolute;
    top: -6px;
    right: -1px;
    font-size: 26px;
}
.share_this_link, .goal_embed {
    color: #777777;
}
#goalQty, .goalQty{
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right: none;
}
#goalQty {
    padding-right: 7px;
}
.goalQty {
    padding-right: 3px;
}
#goalLengthType, .edit_goal_button{
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.edit_goal_button{
    height: 34px;
}
.goalLengthType{
    border-radius: 0;
    border-right: none;
}
#goalType, .goalType{
    border-radius: 0;
    border-right: none;
}
#goalViewBox{
    float: left;
    background: #ffffff;
    border: 1px solid #CCCCCC;
    border-left: 0;
    padding: 2px 20px 1px 10px;
    height: 37px;
    position: relative;
    width: 233px;
}
#goalViewBox>#disableGoal{
    position: absolute;
    right: 5px;
    top: 5px;
    font-size: 10px;
    color: #E21414;
    cursor: pointer;
}
#goalViewBox>.title{
    font-size: 12px;
    display: block;
    margin-bottom: -3px;
}
#goalViewBox>.duration{
    font-size: 9.4px;
    width: 165px;
    text-align: center;
    display: inline-block;
    line-height: 1.1;
}
#goalViewBox.riche.maximum{
    background: #FFAAAA;
    border-color: #ee9999;
}
#set-goal-btn {
    margin-top: 2px;
}
.execution-btns{ float: right;}
.progress{
    margin-bottom: -2px;
    height: 14%;
    width: 165px;
}
.panel-heading{
    overflow: inherit !important;
}
.task-list li {
    list-style-type: none !important;
    overflow: hidden;
}
#playingGame>div:not(:first-child){
    opacity: 0;
    z-index: -111;
}
#sb-slider{
    height: 400px !important;
    width: 335px !important;
    margin-bottom: 35px;
}
#sb-slider li{
    max-height: 376px !important;
    max-width: 335px !important;
}
#sb-slider li img{
    max-height: 400px;
    width: 100%;
}
#nav-arrows > a[disabled] span.glyphicon:before,
#skip > a[disabled] span.glyphicon:before{
    font-family: 'Glyphicons Halflings';
    content: "\e031";
    -webkit-animation: glyphicon-spin 2s infinite linear;
    animation: glyphicon-spin 2s infinite linear;
}
.loading-content>span{ font-size: 46px; }
.sb-slider img{
    -webkit-box-shadow: 0px 37px 34px -39px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 37px 34px -39px rgba(0,0,0,0.75);
    box-shadow: 0px 37px 34px -39px rgba(0,0,0,0.75);
}
#shirt-text{ transition: all 400ms; }
#shirt-text.danger{ border: 1px solid red; }
.mb100{
    margin-bottom: 100px;
}
.alert{
    text-align: center;
}
#word_count_block{
    margin-top: 50px;
}
.total-word-count{
    font-weight: 800;
    font-size: 18px;
}
.duplicated-keywords > tbody > tr > td{ padding: 1px; }



.keywordsBox .table-data{
    max-height: 350px;
    overflow-y: auto;
}
.keywordsBox .table-data::-webkit-scrollbar {
    width: 14px;
}

.keywordsBox .table-data::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    -webkit-border-radius: 2px;
    border-radius: 2px;
}
.keywordsBox #box.table-data {
    max-height: none;
}
@media screen and (max-width: 767px) {
    .execution-btns{ float: none; }
    #word_count_block{
        margin-top: 85px;
    }
    .introduction {
        padding-right: 0;
    }
    .introduction .well {
        margin-bottom: 10px;
        margin-top: 20px;
    }
    .introduction:last-of-type .well{
        margin-top: 10px;
    }
    .introduction:last-of-type .well:last-of-type{
        margin-bottom: 20px;
    }
    .page_margins .col-sm-3 {
        margin-bottom: 15px;
        padding-right: 0;
    }
    .page_margins .col-sm-3:last-of-type{
        margin-bottom: 0;
    }
    .form-group {
        padding: 0 15px!important;
    }
    .style_buttons{
        width: 100%!important;
    }
}

@media screen and (max-width: 479px) {
    #goalViewBox>.duration,
    #goalViewBox>.title{
        font-size: 10px;
        text-align: center;
        display: inline-block;
        width: 160px;
    }
    #goalViewBox{ margin-top: 10px; margin-bottom: 10px; }
    #copy{ margin-bottom: 10px; }
}
.button-more-box {
    float: left;
    background: #ffffff;
    border: 1px solid #CCCCCC;
    border-left: 0;
    padding: 2px 20px 2px 10px;
    height: 37px;
    transition: all 500ms;
    position: relative;
}
#close-typing-speed, #close-read{
    position: absolute;
    right: 5px;
    top: 5px;
    font-size: 10px;
    color: #E21414;
    cursor: pointer;
}
.time-block{
    font-size: 12px;
    display: block;
    margin-bottom: 6px;
    line-height: 0px;
    margin-top: 8px;
}
.speed-block{
    font-size: 12px;
}
.button-more-box a {
    margin-top:1px;
}
.pdl0{
    padding-left: 0px;
}
.pdr0{
    padding-right: 0px;
}
@media screen and (max-width: 992px) {
    .execution-btns{
        float: left;
    }
}
.glyphicon-spin {
    -webkit-animation: spin 1000ms infinite linear;
    animation: spin 1000ms infinite linear;
    margin-left: 45%;
}

.success_for_facebook_share .glyphicon-spin {
    margin-left: 28%;
}
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}
@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}
.thesaurus_error{
    color: #FA384F;
    text-align: center;
    display: block;
}
.uppercase_word{
    text-transform: uppercase;
}
.padding_left{
    padding-left: 35px!important;
}
#options-modal .tab-content {
    overflow-y: auto;
    max-height: 400px;
    overflow-x: hidden;
}
.record i {
    -webkit-animation: 1s infinite;
}

@-webkit-keyframes record {
    70% {
        color: #5cb85c;
    }
}

#select_language, #select_dialect, #words_per_minut_speaking, #words_per_minut_reading, #letters_per_minute {
    height: 28px;
    padding: 0 3px;
    display: inline-block;
}
#select_language, #select_dialect {
    width: 40%;
}
#read_voices {
    width: 61%;
}
#read_volume, #read_rate, #read_pitch{
    width: 20%;
}
#words_per_minut_reading, #words_per_minut_speaking, #letters_per_minute{
    width: 40%;
}
.label_width_for_words_per_minut, .label_width_for_letters_per_minute {
    width: 51%;
}
.label_width_for_read {
    width: 12%;
}
#collapseForRead, #collapseForSpeech {
    width: 99%;
}
.label_width_for_speech {
    width: 15%;
}
.valid_values{
    display: inline;
    margin-left: 5px;
}
#hide-or-show-vdb-player-link {
    position: absolute;
    top: 7px;
    left: 90px;
}
#hide-or-show-vdb-player-link.hide_advertisement {
    color: #90C6DE;
}
#hide-or-show-vdb-player-link.hide_advertisement:hover {
    color: #309ACA;
}
#details_container{
    border-top: 10px solid transparent;
    border-radius: 3px;
    background-color: transparent;
    padding-left: 2px;
    padding-right: 2px;
}
.fa-caret-left,.fa-caret-right {
    position: absolute;
    top: -40px;
    font-size: 53px;
    color: transparent;
}
.fa-caret-left {
    left: -17px;
}
.fa-caret-right {
    right: -16px;
}

/* since 2021-05-28 by Yuri */
@media all and (max-width: 780px){
    #details_container {padding-left: 15px; padding-right: 15px;}
    .fa-caret-left {left: 0;}
    .fa-caret-right {right: 0;}
}
/* End */

#editor_container, #details_container {
    -webkit-transition:0.3s;
    transition:0.3s;
}
#editor_container.clicked {
    margin-right: 1%;
    width: 95%;
}
#details_container.clicked {
    width: 4%;
}
.hide_button {
    border-radius: 3px;
    position: absolute;
    top: -30px;
    font-size: 16px;
    right: 0px;
    padding: 4px 4px 4px 0;
    background-color: transparent;
    font-weight: bold;
    height: 29px;
}
.hide_button:hover {
    cursor: pointer;
}
#only_details {
    display: none;
    text-align: center;
}
#details_panel1 .badge, #kwd-density1 .badge {
    border-radius: 2px;
}
#only_details .panel-heading {
    height: 37px;
    padding: 10px;
    border-bottom: none;
}
#only_details li {
    padding: 4px;
}
#accordion {
    /* overflow: hidden; */
}
.popover .popover-content {
    padding: 3px;
}
#goal_embed_link {
    position: absolute;
    top: -1px;
    right: 18px;
    font-size: 12px;
    width: 56px;
    text-align: center;
    line-height: 12px;
    height: 36px;
    word-wrap: break-word;
}

.user_goal, .user_record {
    background-color: #EEEEEE;
    border-radius: 6px;
    margin: 2px;
    padding: 5px;
}
.pdt5 {
    padding-top: 5px;
}
.full_width{
    width: 100%!important;
    margin-right: 0!important;
}

.icons_for_share_fb, .icons_for_share_tw {
    font-size: 100px;
    display: block;
    margin: 5px 0;
    transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
}
.icons_for_share_fb {
    color: #2a6597;
}
.icons_for_share_tw {
    color: #53d2f7;
}
.icons_for_share_fb:hover {
    color: #084375;
}
.icons_for_share_tw:hover {
    color: #31b0d5;
}

.share_component a:hover, .share_component a:active, .share_component a:focus {
    text-decoration: none;
}

.goal_button .progress {
    position: relative;
    height: 21px;
    width: 165px;
    margin-top: 4px;
    color: black;
    border-radius: 4px 4px 4px 4px;
    -moz-border-radius: 4px 4px 4px 4px;
    -webkit-border-radius: 4px 4px 4px 4px;
    border: 1px solid #337AB7;
    background-color: #fff;
}
.progress #percent_text, .progress-bar div {
    line-height: 20px;
    font-size: 13px;
}
.progress #percent_text {
    width: 100%;
    white-space: nowrap;
    color: #448bc8;
    text-align: center;
}
.progress-bar div{
    white-space: nowrap;
    width: 165px;
}
#goalViewBox .goal_button {
    margin-top: 1px;
}
#goalViewBox {
    line-height:1.2;
}
#kwd-density .keyword_density_consecutive {
    font-size:80%;
    text-decoration: underline
}
#kwd-density .active_consecutive {
    color: #115895;
    font-size: 90%;
    font-weight: bold;
}

.message_for_empty_panel {
    margin: 10px 0;
    font-style: italic;
    text-align: center;
}

div.btn-group {
    margin-left: -1px;
}

.top-btns-panel .btn-group button, #goalViewBox, #top_counter button, #text-to-speech-controls, #copy {
    border-radius: 4px!important;
}

#general .dropdown label {
    margin-top: 10px;
}
#existing_records .well {
    margin-bottom: 0;
}
div#wc_footer a {
    color: #ffffff;
}
#wc_footer {
    color: white;
    padding: 20px;
}
#wc_footer a {
    color: #aaa;
}
#wc_footer a:hover{
    color: #fff;
}
#wc_footer h5 span {
    font-size: 16px;
    border-bottom: 1px solid #ccc;
}

#replace_container {
    position: fixed;
    border: 2px solid #aaa;
    background-color: #fafafa;
    border-radius: 4px;
    width: 36%;
    z-index: 99999;
    left: 32%;
    right: 32%;
    display: none;
    padding: 10px;
    text-align: center;
    top: 60px;
}
#replace_container button {
    margin-left: 10px;
}
#embed_goal_buton_area {
    background-color: #d9edf7;
    margin-bottom: 15px;
}
#keywordDensityAmount, #keywordDensityConsecutive {
    display: inline-block;
    width: 60px;
}

#share-details-modal label, #details_buttons label {
    display: inline;
}
#share-details-modal input[type="checkbox"] {
    margin-top: 10px;
}

#date_format_dropdown_hidden, #time_format_dropdown_hidden{
    display: none;
}

#reading-level-link, #reading_time_tooltip, #speaking_time_tooltip, #hand_writing_time_tooltip, #words_manuscript_tooltip {
    opacity: 0.2;
}
#reading-level-link:hover, #reading_time_tooltip:hover, #speaking_time_tooltip:hover, #hand_writing_time_tooltip:hover, #words_manuscript_tooltip:hover {
    opacity: 1;
}

.share_modal_header{
    color: #ffffff;
    padding: 5px 10px;
}

#wc_navshare li:nth-child(2) {
    margin-left:30px
}


#wc_navshare li:last-child {
    margin-left:15px;
    height:20px;
}


@media only screen and (max-width: 768px) {

    /*#wc_navshare li:nth-child(2), #wc_navshare li:last-child {
        margin:0px;
    }*/

    #wc_navshare li:last-child {
        margin-top: -12px;
        vertical-align: middle;
    }

    #wc_navshare {
        padding: 0px;
        padding-right: 30px;
        text-align: right;
    }

    #wc_navshare li:first-child {
        margin-top: -12px;
        vertical-align: middle;
    }

    #wc_navshare li:nth-child(2) {
        width: 65px;
        margin:0px;
        margin-left: 8px;
    }

    #wc_navshare li:last-child {
        margin:0px;
        margin-top:-12px;
    }

    #wc_navshare li {
        display: inline-block;
        padding: 0px;
        margin: 0px;
    }
}