#home{margin:0 0 40px 0;}



.file-upload-wrapper{margin-bottom:20px;}
.file-upload-wrapper label{
    background-color:#0066a1;color:#f8f2de;padding:10px 20px;border-radius:6px;
    cursor:pointer;font-weight:600;transition:background-color 0.3s ease;display:inline-block;
}
.file-upload-wrapper label:hover{background-color:#219ee7;}
.file-upload-wrapper .item{}
.file-upload-wrapper .item input[type="file"]{display:none;}
.file-upload-wrapper #fileCountLabel{font-size:14px;color:#333;}
.file-upload-wrapper .dosyasayi{margin:4px 0;}
.file-upload-wrapper .info{}


#home .sect20{margin:40px 0 0 0;}
#home .sect20 .grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;}
#home .sect20 .grid .s{
    display:grid;grid-template-rows:subgrid;grid-row:span 3;gap:10px;
}
#home .sect20 .grid .s.s1{}
#home .sect20 .grid .s.s2{}
#home .sect20 .grid .s.s3{}
#home .sect20 .grid .s.s3 .content{grid-row:span 3;align-self:center;}
#home .sect20 .grid .s.s3 p{margin:0 0 10px 0;}
#home .sect20 .grid .s.s3 p:nth-last-of-type(1){margin:0;}
#home .sect20 .grid .s.tip1{
    padding:15px;background:#0066a1;border-radius:10px;
}
#home .sect20 .grid .s.tip2{}
#home .sect20 .grid .s .itembox{
    padding:15px;background:#f6f2e5;border-radius:10px;
}
#home .sect20 .grid .s .itembox label.title{font-family:'fonttip1_semibold',Arial,sans-serif;}
#home .sect20 .grid .s .itembox .item{}
#home .sect20 .grid .s .itembox .explain{
    font-family:'fonttip1_italic',Arial,sans-serif;font-size:.9rem;color:#aaa;
}
#home .sect20 .islebutonu{margin:20px 0 0 0;}
#home .sect20 .islebutonu button{
    padding:10px 30px;background:#0066a1;color:white;border:none;border-radius:5px;cursor:pointer;
    font-size:1rem;font-family:'fonttip1_semibold',Arial,sans-serif;transition:background-color 0.3s ease;
}
#home .sect20 .islebutonu button:hover{background-color:#007BFF;}
#output{margin:20px 0 0 0;
    display:grid;grid-template-columns:repeat(6,1fr);gap:10px;
}
#output .box{padding:5px 5px 10px 5px;border-radius:5px;background:#0066a1;color:#fff;text-align:center;}
#output .box img{display:block;width:100%;height:150px;object-fit:contain;}
#output .box a{
    display:inline-block;padding:5px 10px;background:#ecdfb4;color:#0066a1;border-radius:5px;
    transition:all 0.3s;
}
#output .box a:hover{background:#fff;}



#home .sect20 .itembox input,
#home .sect20 .itembox select{
    font-size:1rem;padding:10px;border:1px solid #ccc;border-radius:5px;width:100%;box-sizing:border-box;outline:none;
    transition:all 0.3s ease;
}
#home .sect20 .itembox input::placeholder,
#home .sect20 .itembox select::placeholder{color:#999;font-style:italic;}
#home .sect20 .itembox input:focus,
#home .sect20 .itembox select:focus{border-color:#007BFF;box-shadow:0 0 5px rgba(0,123,255,0.5);background-color:#f0f8ff;}
#home .sect20 .itembox input:active,
#home .sect20 .itembox select:active{border-color:#0056b3;}
#home .sect20 .itembox input:disabled,select:disabled{background-color:#e9ecef;border-color:#ccc;color:#6c757d;cursor:not-allowed;}
#home .sect20 .itembox input.error,
#home .sect20 .itembox select.error{border-color:#dc3545;background-color:#f8d7da;color:#721c24;}
#home .sect20 .itembox input:valid,
#home .sect20 .itembox select:valid{border-color:#b6a773;background-color:#fff;color:#7d714b;}
#home .sect20 .itembox input:hover,
#home .sect20 .itembox select:hover{border-color:#0056b3;}
#home .sect20 .itembox input:focus::placeholder,
#home .sect20 .itembox select:focus::placeholder{color:transparent;}
#home .sect20 .itembox select{padding-right:30px;}
#home .sect20 .itembox select:focus{border-color:#007BFF;box-shadow:0 0 5px rgba(0,123,255,0.5);}
#home .sect20 .itembox input[type="text"],
#home .sect20 .itembox input[type="number"],
#home .sect20 .itembox input[type="email"],
#home .sect20 .itembox select{width:100%;padding:10px;border-radius:5px;font-size:1rem;border:1px solid #ccc;}
#home .sect20 .itembox input:focus,
#home .sect20 .itembox select:focus{border-color:#007BFF;background-color:#f0f8ff;}
@media only screen and (max-width: 1000px){
    #home .sect20{margin:25px 0 0 0;}
    #home .sect20 .grid{grid-template-columns:1fr 1fr;gap:15px;}
    #home .sect20 .grid .s.s3{grid-column:span 2;}
    #output{grid-template-columns:repeat(4,1fr);gap:5px;}
    #output .box{padding:5px 5px 10px 5px;}
    #output .box img{height:130px;}
    #output .box a{padding:4px 5px;}
}
@media only screen and (max-width: 850px){
    #output{grid-template-columns:repeat(3,1fr);gap:5px;}
}
@media only screen and (max-width: 700px){
    #home .sect20 .grid{column-gap:10px;row-gap:20px;}
    #home .sect20 .grid .s.s3{grid-column:span 2;}
}
@media only screen and (max-width: 600px){
    #output{grid-template-columns:repeat(2,1fr);}
}
@media only screen and (max-width: 550px){
    #home .sect20 .grid{grid-template-columns:1fr;gap:15px;}
    #home .sect20 .grid .s.s3{grid-column:span 1;}
}






#home .sect40{margin:70px 0 0 0;}
#home .sect40 .content hr{border:1px solid #ddd;}
#home .sect40 .content b,
#home .sect40 .content strong{font-weight:normal;font-family:'fonttip1_semibold';}
#home .sect40 .content img{max-width:100%;height:auto!important;
    border-radius:15px;
    box-shadow: 0 0 5px 0px #aaa;
}
#home .sect40 .content p{padding:8px 0;}
#home .sect40 .content p:nth-of-type(1){padding-top:0;}
#home .sect40 .content table{border:none;max-width:100%!important;overflow:auto;}
#home .sect40 .content table tr{}
#home .sect40 .content table tr td{padding:4px 6px;border:1px solid #ddd;}
#home .sect40 .content h1{margin:0 0 8px 0;font-size:2.1rem;font-family:'fonttip2';}
#home .sect40 .content h2{margin:0 0 8px 0;font-size:1.9rem;font-family:'fonttip2';}
#home .sect40 .content h3{margin:0 0 8px 0;font-size:1.7rem;font-family:'fonttip2';}
#home .sect40 .content h4{margin:0 0 8px 0;font-size:1.5rem;font-family:'fonttip2';}
#home .sect40 .content h5{margin:0 0 8px 0;font-size:1.3rem;font-family:'fonttip2';}
#home .sect40 .content h6{margin:0 0 8px 0;font-size:1.1rem;font-family:'fonttip2';}
#home .sect40 .content h1 strong,
#home .sect40 .content h1 b,
#home .sect40 .content h2 strong,
#home .sect40 .content h2 b,
#home .sect40 .content h3 strong,
#home .sect40 .content h3 b,
#home .sect40 .content h4 strong,
#home .sect40 .content h4 b,
#home .sect40 .content h5 strong,
#home .sect40 .content h5 b,
#home .sect40 .content h6 strong,
#home .sect40 .content h6 b{
    font-weight:normal;font-family:'fonttip2';
}
#home .sect40 .content iframe{max-width: 100%;}
#home .sect40 .content:after{content:"";display:block;clear:both;}
@media only screen and (max-width: 900px){
    #home .sect40{margin:25px 0 0 0;}
}