.dashboard .page-content .header{
    display: flex;
    gap: 15px;
    margin-top: 40px;
}
.dashboard .page-content .header label{
    position: relative;
    width: 75%;
}
.dashboard .page-content .header label i{
    position: absolute;
    top: 50%;
    left: 5px;
    color: black;
    font-size: 20px;
    transform: translate(10px, -50%);
}
.dashboard .page-content .header input{
    width: 100%;
    border-radius: 30px;
    text-align: center;
}
.dashboard .page-content .header select{
    width: 10%;
    border-radius: 30px;
}
.dashboard .page-content .header a{
    width: 15%;
    border-radius: 30px;
}
.dashboard .page-content .header a span:first-of-type{
    float: left;
    scale: 1.7;
}
.dashboard .page-content .content{
    margin-top: 40px;
}
.dashboard .page-content .content .ele:nth-of-type(1){
    position: absolute;
    top: 0px;
    left: 16rem;
}
.dashboard .page-content .content .ele:nth-of-type(2){
    position: absolute;
    top: 0;
    right: 0;
}
@media only screen and (max-width: 1366px){
    .dashboard .page-content .header {
        margin-top: 30px;
    }
    .dashboard .page-content .header label {
        width: 65%;
    }
    .dashboard .page-content .header select {
        width: 15%;
    }
    .dashboard .page-content .header a {
        width: 20%;
    }
}
@media only screen and (max-width: 1200px){
    .dashboard .page-content h1{
        font-size: 40px;
        line-height: 57px;
    }
    .dashboard .page-content .header{
        flex-wrap: wrap;
        margin-top: 20px;
    }
    .dashboard .page-content .header label{
        width: 72%;
    }
    .dashboard .page-content .header select{
        width: 25%;
    }
    .dashboard .page-content .header a{
        width: 100%;
    }
    .dashboard .page-content .content .ele:nth-of-type(1) {
        left: 14rem;
    }
}
@media only screen and (max-width: 767px){
    .dashboard .page-content .header label {
        width: 70%;
    }
    .dashboard .page-content .header select {
        width: calc(30% - 15px);
    }
}
@media only screen and (max-width: 512px){
    .dashboard .page-content h1 {
        line-height: 36px;
        font-size: 28px;
    }
    .dashboard .page-content .header label,
    .dashboard .page-content .header select{
        width: 100%;
    }
    .dashboard .page-content .header{
        gap: 10px;
        margin-top: 15px;
    }
    .dashboard .page-content .content h2{
        font-size: 32px;
    }
    .dashboard .page-content .content .ele:nth-of-type(1) {
        left: 11rem;
    }
}


.dashboard .templates{
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    row-gap: 25px;
    margin-top: 25px;
}
.dashboard .templates .template{
    width: calc(20% - 15px);
}
.dashboard .templates .template img{
    width: 100%;
    border-radius: 15px;
    border: 1px solid #BDB676;
    cursor: pointer;
    transition: all 0.3s;
}
.dashboard .templates .template img:hover{
    scale: 1.03;
}
.dashboard .templates .template h3{
    color: white;
    text-align: center;
    margin-top: 6px;
}
.dashboard .templates .template p{
    color: #CBD5E0;
    margin: 0;
    margin-top: 6px;
    font-size: 14px;
    text-align: center;
}
@media only screen and (max-width: 1366px){
    .dashboard .templates{
        margin-top: 20px;
    }
    .dashboard .templates .template {
        width: calc(25% - 12px);
    }
    .dashboard .templates .template h3{
        font-size: 17px;
    }
    .dashboard .templates .template p{
        font-size: 13px;
    }
}
@media only screen and (max-width: 1200px){
    .dashboard .templates .template {
        width: calc(33% - 8px);
    }
}
@media only screen and (max-width: 767px){
    .dashboard .templates .template {
        width: calc(50% - 8px);
    }
    .dashboard .templates .template h3 {
        font-size: 15px;
    }
    .dashboard .templates .template p {
        font-size: 11px;
    }
}
@media only screen and (max-width: 512px){
    .dashboard .templates .template img{
        border-radius: 10px;
    }
    .dashboard .templates .template h3 {
        font-size: 12px;
    }
    .dashboard .templates .template p {
        font-size: 10px;
    }
}