/* CSS styles for the tool */
.text-output {
    font-size: 24px;
    min-height: 105px;
    display: block;
}
.wbox {
    background: #fff;
    height: 250px;
    padding: 5px;
    display: block;
    width: 100%;

    resize: none;
}
.wbox:focus,
.wbox:active {
    outline: 0px !important;
    -webkit-appearance: none;
}
.sh {
    margin-top: 15px;
    display: block;
    width: 100%;
    text-align: center;
    color: #000;
    padding: 4px;
    background: #dde3e5;
}

.seperator,
.wrap {
    display: inline-block;
    max-width: 150px;
}
#custom_seperator {
    display: inline-block;
    max-width: 90px;
}
#custom_wrap_in,
#custom_wrap_out {
    display: inline-block;
    max-width: 90px;
}
.com-in-opt {
    display: inline-block;
    width: auto !important;
}
.tool-content ul {
    padding-left: 20px !important;
}
.tool-content ol {
    padding-left: 20px;
}
#custom_wrap_in,
#custom_wrap_out {
    max-width: 65px;
}
#custom_seperator,
#custom_wrap_in,
#custom_wrap_out {
    border: 1px solid #e4e4e4 !important;
}

.mobile_output {
    display: none;
    padding-bottom: 10px;
}
.input_label {
    font-size: 14px;
    padding: 10px;
    color: white;
    font-weight: 500;
}
.position-relative {
    position: relative;
}
.position-absolute {
    position: absolute;
}
#copied_message {
    padding: 8px;
}
@media only screen and (max-width: 767px) {
    div#results {
        width: 100%;
    }
    .noLRP {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
}
@media only screen and (max-width: 375px) {
    #custom_wrap_in,
    #custom_wrap_out {
        max-width: 100%;
        margin-top: 4px;
    }
    .wrap {
        min-height: 40px;
    }
    div#results {
        width: 100%;
    }
    .noLRP {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
}
.panel-green {
    border: 1px solid #34a370 !important;
}
.panel-green .panel-heading {
    background: #34a370 !important;
    border-color: #34a370 !important;
    color: #fff;
    font-size: 16px;
}
#results {
    column-count: 3;
    -moz-column-count: 3; /* Firefox */
    -webkit-column-count: 3; /* Safari and Chrome */
    margin: 0 auto;
    width: 600px;
}