.main-wrapper,footer{height:100%;background:#f7f7f7}.main-wrapper .container,footer .container{width:100%;padding:20px;box-shadow:0 5px 15px rgba(0,0,0,.1);background:#fff}*{margin:0;padding:0;box-sizing:border-box;font-family:Moderustic,sans-serif}.main-wrapper{width:100%;min-height:80vh;display:flex;flex-direction:row;justify-content:center;align-items:center;padding:20px}.main-wrapper .container{position:relative;max-width:960px;border-radius:14px}.main-wrapper .container .background__controll_section{display:flex;flex-direction:row;flex-wrap:wrap}.main-wrapper .container .background__controll_section .backgroundControll__attribute_area{width:100%;flex-basis:35%;flex-flow:1;flex-grow:1;padding-right:20px;position:relative}.main-wrapper .container .background__controll_section .backgroundControll__attribute_area .upload__filed{width:100%;border:1.5px dashed #0064e0;border-radius:5px;min-height:120px;display:flex;justify-content:center;align-items:center}.main-wrapper .container .background__controll_section .backgroundControll__attribute_area .upload__filed input{visibility:hidden;display:none}.main-wrapper .container .background__controll_section .backgroundControll__attribute_area .upload__filed i{font-size:1.9rem;opacity:.6}.main-wrapper .container .background__controll_section .backgroundControll__attribute_area .progress__bar{margin-top:5px;width:80%;background:#0064e0;height:15px;border-radius:50px;transition:.2s ease-out;display:none;text-align:center;position:absolute;top:90px;left:7%}.main-wrapper .container .background__controll_section .backgroundControll__attribute_area .progress__bar span{display:block;position:relative;font-size:.7rem;text-align:center;color:#fff;transition:.2s ease-out}.main-wrapper .container .background__controll_section .backgroundControll__attribute_area h2{margin-top:10px;font-size:1.5rem;margin-bottom:10px}.main-wrapper .container .background__controll_section .backgroundControll__attribute_area .attributes{padding-top:10px}.main-wrapper .container .background__controll_section .backgroundControll__attribute_area .attributes .items{display:flex;flex-direction:row;align-items:center;justify-content:space-between;margin-bottom:10px}.main-wrapper .container .background__controll_section .backgroundControll__attribute_area .attributes .items label{font-size:1rem}.main-wrapper .container .background__controll_section .backgroundControll__attribute_area .attributes .items select{text-transform:capitalize;padding:3px 8px;border-radius:3px;outline:0}.main-wrapper .container .background__controll_section .background__preview__area{width:100%;flex-basis:65%;min-height:320px;max-height:320px;flex-flow:1;flex-grow:1;box-shadow:inset 0 1px 5px rgba(0,0,0,.1);border-radius:14px;overflow:hidden;transition:.2s ease-in-out}.main-wrapper .container .background__control_cssAttributes{padding-top:30px;width:100%;position:relative}.main-wrapper .container .background__control_cssAttributes button{position:absolute;right:30px;top:90px;outline:0;cursor:pointer;font-size:1rem;width:35px;height:35px;background:#000;border:none;border-radius:5px;color:#fff;transform:scale(.8);transition:.2s ease-in-out}.main-wrapper .container .background__control_cssAttributes button:hover{transform:scale(1)}.main-wrapper .container .background__control_cssAttributes h2{font-size:1.5rem;margin-bottom:10px}.main-wrapper .container .background__control_cssAttributes .cssCode_values{background:#f7f7f7;width:100%;height:100%;min-height:200px;border-radius:14px;overflow:hidden;padding:30px;box-shadow:inset 0 1px 5px rgba(0,0,0,.1)}.main-wrapper .container .background__control_cssAttributes .cssCode_values li{list-style:none;color:#1f8fcf}footer{width:100%;min-height:20vh;padding:20px;display:flex;flex-direction:row;justify-content:center;align-items:center}footer .container{max-width:580px;border-radius:14px;display:flex;align-items:center;justify-content:space-between;color:#343333}footer .container h2{font-size:1.1rem;line-height:1.7rem}footer .container p{font-size:.9rem}footer .container p span{font-weight:700}footer .container a{text-decoration:none;color:#343333}footer .container a i{margin-right:10px}@media (max-width:770px){h2{font-size:1.1rem!important}.background__controll_section .backgroundControll__attribute_area{padding-right:0!important}.background__controll_section label{font-size:.9rem!important}.background__preview__area{width:100%;flex-basis:100%!important;order:-1!important;min-height:280px!important;margin-bottom:20px}}@media (max-width:560px){h2{font-size:1.1rem!important}footer .container{padding:15px!important}footer .container a,footer .container h2{font-size:.8rem!important}footer .container p{font-size:.7rem!important}}