.tabs-container {
    padding: 0 !important;
}

div#tabs-section {
    background: #fff;
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175) !important;
    padding: 20px 30px 50px;
    width: 100%;
    border-radius: 10px;
}

section#tab-1 {
    padding: 0px 0px 0px 20px;
}

#tabs-section ul.tab-head {
    width: 30%;
    margin-top: 15.5%;
}

section.tabs-wrapper {
    margin: 50px 0px 80px;
}

section#tab-1 {
    border-bottom: none;
}

#tabs-section button {
    background: linear-gradient(45deg, #1e55b2, #3477e8) !important;
    color: #fff;
    border: unset;
    margin-top: 15px;
    cursor: pointer;
    padding: 5px 10px;
    font-size: 16px;
}

#tabs-section h2 {
    font-size: 32px;
    font-weight: 600;
    text-transform: capitalize;
}

#tabs-section a.tab-link {
    border: none !important;
    padding: 10px;
    margin: 0 !important;
    background: #fff !important;
    font-size: 16px;
    font-weight: 500;
}

#tabs-section li {
    border: 1px solid #20a5b8 !important;
}

#tabs-section li:nth-child(4) {
    border-bottom: 1px solid #20a5b8 !important;
}

button#submit-form {
    width: 100%;
    background: linear-gradient(45deg, #1e55b2, #3477e8) !important;
    color: #fff;
    padding: 10px 30px;
    border: unset;
    border-radius: 5px;
    cursor: pointer;
    display: block;
    margin: 20px auto 0px !important;
    font-size: 20px;
    max-width: 170px;
}

.single-post #content a.active {
    background: #20a5b8 !important;
    color: #fff !important;
}

.single-post #content a:hover {
    color: #fff !important;
    background: #20a5b8 !important;
}

.form-group textarea#input-css {
    height: 201px !important;
    width: 100% !important;
    margin: 11px 0px 0px;
    padding: 0px 10px;
}

.form-group textarea#output {
    height: 200px !important;
    width: 100% !important;
}

input#fileUpload {
    font-weight: 600;
    margin: 15px 0px;
    font-size: 16px;
    max-width: 300px;
    width: 100%;
    height: 48px;
    background: #e1e1e1;
    padding: 10px;
    border-radius: 5px;
    margin-top: 15px;
    cursor: pointer;
    margin-right: 10px;
    border: 1px dashed #000;
    color: #000;
    margin: 20px auto;
    display: block;
}
section.tabs-wrapper {
    margin: 80px 0;
}
#tabs-section  #tab-1 button {
    padding: 10px 20px;
    border-radius: 5px;
    transform: scale(0.9);
    transition: 0.5s !important;
    text-transform: capitalize;
}

#tabs-section #tab-1 button:hover {
    transform: scale(1);
    color:#fff !imporatnt;
}

button#submit-form:hover {
    color: #fff !important;
}
a, a:visited {
    border: unset !important;
}
.outputshown textarea#output {
    background: #000000 !important;
    color: #fff;
    border-radius: 15px;
}

.form-group textarea#output {
    height: 300px !important;
    width: 100% !important;
    margin: 0;
}

form#form2 {
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175) !important;
    padding: 20px 20px 20px;
    width: 100%;
    border-radius: 10px;
}

.outputshown ::-webkit-scrollbar {
  width: 10px;
}


.outputshown ::-webkit-scrollbar-track {
  box-shadow: inset 10px 10px 5px black; 
}
 

.outputshown ::-webkit-scrollbar-thumb {
  background: #1f57b8; 

}

.outputshown ::-webkit-scrollbar-thumb:hover {
  background: #21a5b8; 
}
#tabs-section button#submit-form:focus {
    color: #fff !important;
}
.outputshown #form2{
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175) !important;
    padding: 15px;
    border-radius: 10px;
}

.outputshown button#copy {
    padding: 10px 20px;
    border-radius: 5px;
    text-transform: capitalize;
    margin-top: 15px;
    background: linear-gradient(45deg, #1e55b2, #3477e8) !important;
    color: #fff;
    border: unset;
    transform: scale(0.9);
    transition: 0.5s !important;
}

.outputshown button#copy:hover {
    transform: scale(1);
}
@media(min-width:1500px){
.single-tools div#sidebar-1.tools-right-widget-area {
    top: 355px !important;
}
}
@media(max-width:767px){
 #tabs-section ul.tab-head {
    width: 100%;
    margin-top: 20px;
    margin-bottom: 20px;
}
section#tab-1 {
    width: 100% !important;
}
div#tabs-section {
    display: flex;
    flex-wrap: wrap;
}

#tabs-section a.tab-link {
    height: 35px !important;
}

#tabs-section.tabs>ul li a>span.tab-label {
    display: block;
}
}
@media(min-width:1024px) and (max-width:1200px){
div#tabs-section {
    flex-wrap: wrap;
}

#tabs-section ul.tab-head {
    width: 100%;
}

ul.tab-head {
    display: flex;
    justify-content: left;
}

#tabs-section li {
    border-bottom: 1px solid #20a5b8 !important;
}
}
@media(max-width:1024px){
#tabs-section ul.tab-head {
    width: 100%;
}
div#tabs-section {
    flex-wrap: wrap;
}
#tabs-section ul.tab-head li {
    border: 0 !important;
    width: 48% !important;
    margin: 0;
}

#tabs-section ul.tab-head li a {
    border: 1px solid #20a5b8 !important;
}

ul.tab-head {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: space-between;
}    
}
#tabs-section #tab-1 button {
    border: 1px solid #ddd0 !important;
}
.single.single-tools #tabs-section #tab-2 button {
    border: 1px solid #ddd0 !important;
}
div#form2 {
    margin-bottom: 50px;
}