.website-type{padding:80px 100px;text-align:center}.img-container{margin-top:40px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:50px}.img-box{position:relative;display:flex;align-items:center;justify-content:center}.selectbtn{display:none;background-color:#000;border:none;border-radius:30px;padding:16px 64px;color:#fff}.selectbtn:hover{background-color:#000}.preview-icon{display:none;width:30px;filter:brightness(0) saturate(100%) invert(100%)}.img-box:hover>.selectbtn{display:block;position:absolute}.img-box:hover>.preview-icon{display:block;position:absolute;right:20px;top:20px}.type-img{max-width:100%;max-height:100%}.preview-screen{background-color:#000;z-index:1;position:absolute;width:90vw;height:90vh;left:5vw;top:5vh;padding:40px 80px}.hidden{display:none}.close-icon{width:30px;filter:brightness(0) saturate(100%) invert(100%);position:absolute;right:50px;top:50px}.header{padding:20px 100px;background-color:#000;display:flex;align-items:center;justify-content:space-between}.logo{font-size:40px;font-weight:700;color:#e6e6e6}.menu-container{display:flex;align-items:center;justify-content:center;gap:40px}.menu-ul{display:flex;gap:20px;text-decoration:none}.menu-items{list-style-type:none;color:#e6e6e6;text-decoration:none}.helpbtn{background-color:#e6e6e6;border:none;border-radius:30px;padding:16px 64px;color:#000}.choose-colors{padding:60px 100px;text-align:center}.palette-filter-container{margin-top:60px;display:grid;grid-template-columns:200px 1fr}.color-palette-container{display:grid;grid-template-columns:1fr 1fr;gap:20px;justify-items:center}.color-palete{height:80px;display:flex;justify-content:center;align-items:center;width:600px;transition:border .3s ease}.color-palete:hover{border:2px solid blue}.color{flex-grow:1;height:100%;display:flex;align-items:center;justify-content:center;color:#fff}.filter-container{display:flex;flex-direction:column}.filterbtn{background-color:#fff;border:none;padding:16px 64px;border-radius:30px}.filterbtn:hover{background-color:#f7f7f7}.select-fonts{padding:60px 100px}.fonts-preview-box{margin:40px 0;display:flex;flex-direction:column;gap:30px}.font-select-btn-container{display:flex;gap:30px}.select-fonts-input{padding:16px 32px;background-color:#e6e6e6;color:#000;font-size:14px;border:none;border-radius:30px}.font-size-container{margin-top:30px}.font-name-container{margin-top:30px;display:grid;gap:20px;grid-template-columns:1fr 1fr 1fr 1fr 1fr}.font-size-container th{padding:16px 32px;min-width:140px;background-color:#ccc}.font-size-container td{padding:16px 32px;min-width:140px;background-color:#e6e6e6}.font-size-container table{margin-top:30px}.create-mockup{padding:0}.mockup-pages-menu-container{padding:30px 100px;display:flex;justify-content:center;gap:20px;background-color:#e6e6e6}.mockup-components-menu-container{background-color:#e6e6e6;display:flex;flex-direction:column;gap:16px;width:max-content;right:0;top:88px;padding:50px;height:100%;overflow:scroll;overflow-x:hidden;overflow-y:scroll}.mockup-img-container{width:380px;padding:20px;background-color:#e6e6e6;display:flex;flex-direction:column;gap:20px;height:100%;overflow:scroll;overflow-x:hidden;overflow-y:scroll}.mockup-img-menu{width:100%}.editor-grid-container{justify-items:center;display:grid;grid-template-columns:380px 1fr max-content;gap:20px;height:80vh}.mockup-canvas{padding:20px;display:flex;flex-direction:column;gap:5px;background-color:#ccc;width:1000px;height:100%;overflow:scroll;overflow-x:hidden;overflow-y:scroll}.mockup-individual-img-container img{width:100%}.mockup-individual-menu-img-box{display:flex;position:relative;justify-content:center;align-items:center}.approved-for-usa-box{position:absolute;right:0;top:0;background-color:#000;color:#fff;font-size:12px;padding:10px;border-radius:5px}.addbtn{height:50px;width:50px;padding:0;display:none;align-items:center;justify-content:center;background-color:#ffffff70;border:1px solid #000000;position:absolute}.btn-img{max-width:25px}.mockup-individual-menu-img-box:hover>.addbtn{display:flex}.mockup-individual-img-container{display:flex;position:relative;justify-content:center;align-items:center}.removebtn{height:50px;width:50px;padding:0;display:none;align-items:center;justify-content:center;background-color:#ffffff70;border:1px solid #000000;position:absolute}.mockup-individual-img-container:hover>.removebtn{display:flex}.mockup-individual-img-container:hover>.up-down-btn-container{display:flex}.downbtn,.upbtn{height:50px;width:50px;padding:0;display:flex;align-items:center;justify-content:center;background-color:#ffffff70;border:1px solid #000000}.up-down-btn-container{display:none;align-items:center;justify-content:center;position:absolute;gap:20px;background-color:transparent;top:20px;right:20px}.normal-button{background-color:transparent;color:#000;padding:5px 20px}.normal-button:hover,.normal-button-selected,.normal-button-selected:hover{background-color:#000;color:#fff;padding:5px 20px}.mockup-form{display:flex;flex-direction:column}.mockup-form-section{display:flex;justify-content:center;align-items:center;padding:60px 100px}.mockup-upload-form{display:flex;flex-direction:column;gap:20px;min-width:600px}.submit-reset-btn-box{display:grid;gap:20px;grid-template-columns:1fr 1fr}.mockup-upload-form input,.mockup-upload-form select,.mockup-upload-form textarea{padding:10px 32px;min-height:50px;font-size:16px;border:none;border-radius:30px;background-color:#f7f7f7}.label-input-field-container{margin-top:0;display:flex;flex-direction:column;gap:20px}.color-form{display:flex;justify-content:center;align-items:center;padding:60px 100px}.color-upload-form{display:flex;flex-direction:column;gap:20px;min-width:600px}.color-upload-form input{padding:10px 32px;min-height:50px;font-size:16px;border:none;border-radius:30px;background-color:#f7f7f7}.create-mockup-dashboard-section{padding:80px 6%}.mockup-dahsboard-heading-container{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}.mockup-dahsboard-heading-container button{background-color:#000;border:2px solid black;color:#fff}.mockup-dahsboard-heading-container button:hover{background-color:transparent;border:2px solid black;color:#000}.mockup-dashboard-items-container{display:flex;flex-direction:column;gap:10px}.mockup-dashboard-items-header{display:grid;grid-template-columns:60px 1fr 1fr 120px 1fr 1fr 100px 100px 100px;gap:10px}.mockup-dashboard-items{display:flex;flex-direction:column;gap:10px}.mockup-dashboard-form{display:grid;grid-template-columns:60px 1fr 1fr 120px 1fr 1fr 100px 100px 100px;gap:10px;align-items:center;padding:5px;background-color:#ececec}.mockup-dashboard-form input,.mockup-dashboard-form select,.mockup-dashboard-form textarea{padding:5px}.mockup-dashboard-form button{background-color:#000;border:2px solid black;color:#fff;display:flex;align-items:center;justify-content:center;box-sizing:border-box}.mockup-dashboard-form button:hover{background-color:transparent;color:#000}.mockup-dashboard-image-box{display:flex;flex-direction:column;gap:10px}.mockup-dashboard-img{max-width:100%}*{margin:0;padding:0;box-sizing:border-box}button{padding:16px 32px;background-color:transparent;color:#000;font-size:14px;border:none;border-radius:30px}button:hover{background-color:#f7f7f7}
