@import url(https://fonts.googleapis.com/css2?family=PT+Sans:wght@400;700&display=swap);.logo,nav{z-index:1;display:flex;transition:.25s}.logo,nav,nav ul{display:flex}.logo a,nav ul{list-style:none}.logo a,.logo h2,li a{color:#fff}.logo,li a,nav{transition:.25s}.search-form button:hover,nav{background-color:#263179}.btn,.katalog-card>a,.logo a,li a{text-decoration:none}.features-card h3,.flex-header h3,h1,li a{font-weight:700}#form input[type=submit]:hover,.search-form button{background-color:#4154f1}*{padding:0;margin:0;box-sizing:border-box;font-family:'PT Sans',sans-serif}body{overflow-x:hidden}nav{position:fixed;top:0;left:0;right:0;padding:.7em;align-items:center;justify-content:space-between;letter-spacing:1px}.logo{align-items:center;margin-left:30px}.logo img{width:2.5em;margin-right:.5em}.logo a{font-size:2em;margin-right:10px}nav ul{justify-content:space-evenly;align-items:center;width:35%;margin-right:30px}li a{padding:.65em;font-size:1.1em}li a:hover{background-color:#7f88d8;border-radius:.35em}.menu{display:none}.flex-row{min-height:100vh;max-height:fit-content;padding:5px;background-image:linear-gradient(#f2f5fc,#fff)}.flex-row#home{background-image:url('../images/hero-bg.png')}.flex-row#contact{background-image:linear-gradient(white,#f2f5fc)}.flex-content{display:flex;align-items:center;margin:75px 10%;padding:0 0 50px}.flex-content#content-home{margin:150px 10%}.flex-content#content-katalog,.flex-content#content-tambah{max-width:90vw;margin:150px 7%}.pad0{padding:0}.col-dir{flex-direction:column}.features-card,.katalog-header{align-items:center}.katalog-form img{width:640px;max-width:90vw;border-radius:10px}.flex-header{margin-bottom:2em}h1{font-size:2.75em;color:#263179;margin-bottom:.5em;padding:0 100px 0 0}h3{font-size:1.5em;font-weight:100;color:#444;margin-bottom:1.5em;padding:0 20px 0 0}.flex-header h2{font-size:1.25em;padding:.25em 0;text-align:center;color:#4154f1}.flex-header h3{text-align:center;padding:0 25px;color:#263179;margin:0}.katalog-header{display:flex;font-size:1.25em}.btn{background:#4154f1;padding:.6em 1.9em;font-weight:400;border-radius:6px;color:#fff;font-size:1.3em;transition:.5s}#group-button,.book-card,.card,.form-card{background-color:#fff}.btn:hover{background:#212b81}.flex-card{display:flex;width:100%}#form input[type=submit]{float:right;padding:10px;font-size:.9em;color:#fff;width:150px;border-radius:10px;cursor:pointer;background-color:#212b81}.card-second{display:flex;border-radius:10px;max-width:90vw}.form-card{border:1px solid #979797;margin:1em 0;padding:1.5em;width:640px}.form-card p{font-size:1.25em;margin-bottom:1em}.form-card input{padding:10px;font-size:1em;border-radius:5px}.search-form form{display:flex;justify-content:space-between;max-width:550px;margin-top:35px}.search-form input{width:200px;flex-basis:90%;padding:.5em;border-color:rgb(33,43,129,.4);border-radius:5px;margin-right:1em}.search-form button{padding:5px;cursor:pointer;flex-basis:10%;color:#fff;border-radius:5px;border:none}.katalog-card{padding:2em;box-shadow:0 0 50px rgba(128,128,128,.5);width:1156px}.katalog-card>a{background:#098a3a;padding:.6em;border-radius:6px;color:#fff;font-size:1.1em;max-width:fit-content;margin:15px 0;transition:.2s}.katalog-card>a:hover{background-color:#136633}.card{display:flex;border-radius:10px;flex-basis:33.3%;margin:0 2.5em;height:65vh;transition:.25s;box-shadow:5px 5px 10px grey}.profile-card{padding:2em;width:40vw}.profile-card:hover{transform:scale(1.025)}.features-card:hover{transform:scale(1.075);box-shadow:1px 1px 100px grey}.features-card img{width:15em;margin:20px 10px}.features-card h3{padding:0 25px;color:#263179;margin:.5em 0 0}.features-card p{padding:2em;text-align:center}.profile-card img{width:15em;height:15em;border-radius:10em;object-fit:cover;margin:0 3em 0 0;transition:.25s}.profile-card img:hover{transform:scale(1.25);border-radius:15px;box-shadow:1px 1px 100px grey}.profile-contact{margin:20px 0 0}.profile-contact img{width:30px;height:30px;margin:0 20px 0 0;border-radius:.1px}.profile-contact img:hover{transform:scale(1.5);box-shadow:1px 1px 100px grey;border-radius:0}.profile-header h3{margin:1.5em 0;padding:0;text-align:center;font-weight:700;color:#263179}.book-card{display:flex;align-items:center;margin:20px 0;width:100%;justify-content:space-between;padding:15px;border-radius:5px;transition:.25s}.book-header,.group{margin-top:30px}.book-card:hover{box-shadow:5px 5px 10px grey;background-color:rgba(65,84,241,.1)}.book-info h2{color:#212b81}.book-action{display:flex;width:150px;justify-content:space-around;margin-right:15px}.book-action button{background-color:rgba(255,255,255,0);padding:1em;border:none;border-radius:5px}.book-action button:first-child{color:#4154f1}.book-action button:first-child:hover{background-color:#4154f1;color:#fff;cursor:pointer}.book-action button:nth-child(2){color:orange}.book-action button:nth-child(2):hover{background-color:orange;color:#000;cursor:pointer}.book-action button:last-child{color:red}.book-action button:last-child:hover{background-color:red;color:#fff;cursor:pointer}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}#group-button{border:1px solid gray;padding:10px;border-radius:7px;cursor:pointer;letter-spacing:.5px}#group-button:hover{background-color:rgba(65,84,241,.1);border:1px solid #4154f1}.book-header{color:#263179}footer{background:#263179;padding:10px 0;color:#fff;text-align:center;font-size:.8em}@media screen and (max-width:1280px){.profile-header p,footer,h1{text-align:center}nav ul{position:absolute;right:0;top:0;height:100vh;width:75vw;z-index:0;flex-direction:column;background-color:#263179;transform:translateX(100%);transition:.5s;opacity:0;margin-right:0}.flex-content,.menu{flex-direction:column}nav ul.slided{transform:translateX(0);opacity:1}.logo{margin-left:0}.menu{display:flex;height:30px;margin-right:10px;justify-content:space-between;cursor:pointer}.menu span{display:block;width:45px;height:4px;border-radius:10px;background-color:#fff;transition:.25s;z-index:2}.flex-content{display:flex;margin:75px 10%;padding:50px 0}.flex-content article{display:flex;flex-direction:column;align-items:center}.flex-content#content-home{padding-top:50px}.flex-content#content-katalog,.flex-content#content-tambah{margin:60px 7%}article img#image-main{display:none}h1{font-size:2em;padding:0}h3{font-size:1.25em;margin:.5em 0 1.5em}.flex-card{flex-wrap:wrap;justify-content:space-evenly}.features-card{flex-basis:0;margin:0 10px 2em;height:fit-content}.search-form button{padding:10px 15px}.profile-card{flex-basis:0;padding:2em;align-items:center;width:fit-content;height:fit-content}.profile-card img{width:12em;height:12em;border-radius:6em;object-fit:cover;margin:0 15px}.profile-contact{display:flex;justify-content:space-evenly}.profile-contact img{width:30px;height:30px;margin:0;border-radius:.1px}.book-card{flex-direction:column;align-items:baseline}.book-action{margin-top:30px}.book-action button{padding:0}footer{position:relative;bottom:0;width:100%;background:#263179;padding:10px 0;color:#fff;font-size:.8em}}@media screen and (max-width:650px){.flex-card{justify-content:center}.features-card{flex-basis:33.3%;margin:0 0 2em}.profile-card{flex-direction:column;flex-basis:33.3%;width:100%}.profile-card img{width:14em;height:14em;border-radius:10em;object-fit:cover;margin:0}.profile-contact img{width:30px;height:30px;border-radius:.1px}}