*{box-sizing:border-box !important;outline:none}html{margin:0;height:100%;display:flex;justify-content:center;font-family:Camphor, Open Sans, Segoe UI, sans-serif}html body{margin:0;height:100%;display:flex;justify-content:center;padding-left:2vw;padding-right:2vw;background-color:#161616;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 800 800'%3E%3Cg fill='none' stroke='%23292929' stroke-width='1'%3E%3Cpath d='M769 229L1037 260.9M927 880L731 737 520 660 309 538 40 599 295 764 126.5 879.5 40 599-197 493 102 382-31 229 126.5 79.5-69-63'/%3E%3Cpath d='M-31 229L237 261 390 382 603 493 308.5 537.5 101.5 381.5M370 905L295 764'/%3E%3Cpath d='M520 660L578 842 731 737 840 599 603 493 520 660 295 764 309 538 390 382 539 269 769 229 577.5 41.5 370 105 295 -36 126.5 79.5 237 261 102 382 40 599 -69 737 127 880'/%3E%3Cpath d='M520-140L578.5 42.5 731-63M603 493L539 269 237 261 370 105M902 382L539 269M390 382L102 382'/%3E%3Cpath d='M-222 42L126.5 79.5 370 105 539 269 577.5 41.5 927 80 769 229 902 382 603 493 731 737M295-36L577.5 41.5M578 842L295 764M40-201L127 80M102 382L-261 269'/%3E%3C/g%3E%3Cg fill='%23444444'%3E%3Ccircle cx='769' cy='229' r='5'/%3E%3Ccircle cx='539' cy='269' r='5'/%3E%3Ccircle cx='603' cy='493' r='5'/%3E%3Ccircle cx='731' cy='737' r='5'/%3E%3Ccircle cx='520' cy='660' r='5'/%3E%3Ccircle cx='309' cy='538' r='5'/%3E%3Ccircle cx='295' cy='764' r='5'/%3E%3Ccircle cx='40' cy='599' r='5'/%3E%3Ccircle cx='102' cy='382' r='5'/%3E%3Ccircle cx='127' cy='80' r='5'/%3E%3Ccircle cx='370' cy='105' r='5'/%3E%3Ccircle cx='578' cy='42' r='5'/%3E%3Ccircle cx='237' cy='261' r='5'/%3E%3Ccircle cx='390' cy='382' r='5'/%3E%3C/g%3E%3C/svg%3E");z-index:-2}@media (max-width: 832px){html body{padding-left:1vw;padding-right:1vw}}.main{display:flex;flex:1}.character-container{display:flex}.character-list{display:flex;flex:1;flex-wrap:wrap;align-items:center;justify-content:center}.close-icon{font-size:20px;position:absolute;right:7.5px;top:7.5px;cursor:pointer}.character-card-info{display:flex;flex-direction:column;padding-right:0.4em;padding-left:0.4em;margin-top:0.4em;width:100%;align-items:center;text-align:center;justify-content:space-between}.character-card-title{font-size:20px;font-weight:600;height:40px;margin:0}.character-card-details{display:flex;flex-direction:column;width:100%;margin-top:1em}.character-card-details-row{display:flex;flex-direction:row;width:100%;justify-content:space-between;margin-bottom:1em}.character-card-details-row .detail-type{margin:0;font-size:0.8em;color:#c6c6c6}.character-card-details-row .detail-value{margin:0;text-align:right}.character-card-details-row .detail-click{cursor:pointer;border-style:solid;border-width:0;border-bottom-width:1px;border-color:orange}.pagination-buttons{width:100%;display:flex;margin-top:10px;margin-bottom:20px;align-items:center;justify-content:center}.pagination-buttons button{border-radius:5px;border-color:#575757;color:white;background-color:#575757;height:30px;width:50px;display:flex;align-items:center;justify-content:center;margin-right:20px;-webkit-box-shadow:0 4px 6px rgba(50,50,93,0.11),0 1px 3px rgba(0,0,0,0.08);box-shadow:0 4px 6px rgba(50,50,93,0.11),0 1px 3px rgba(0,0,0,0.08);transition:all 0.15s ease;opacity:0.9}.pagination-buttons button:hover{opacity:1;transform:translateY(-1px);-webkit-box-shadow:0 13px 27px -5px rgba(50,50,93,0.25),0 8px 16px -8px rgba(0,0,0,0.3),0 -6px 16px -6px rgba(0,0,0,0.025);box-shadow:0 7px 14px rgba(50,50,93,0.1),0 3px 6px rgba(0,0,0,0.08)}.pagination-buttons button p{font-size:20px;margin:0;text-align:center;vertical-align:middle}.banner{display:flex;height:100px;justify-content:center;align-items:center;width:100%}.banner-title{font-size:30px;font-weight:800;color:white;text-align:center}

.character-card{display:flex;position:relative;flex-direction:column;justify-content:space-between;width:250px;padding-bottom:0.5em;background:#575757;color:white;border-radius:5px;margin-bottom:3vh;margin-left:2vw;margin-right:2vw;-webkit-box-shadow:0 4px 6px rgba(50,50,93,0.11),0 1px 3px rgba(0,0,0,0.08);box-shadow:0 4px 6px rgba(50,50,93,0.11),0 1px 3px rgba(0,0,0,0.08);transition:all 0.15s ease;opacity:0.9;height:auto}.character-card:hover{opacity:1;transform:translateY(-1px);-webkit-box-shadow:0 13px 27px -5px rgba(50,50,93,0.25),0 8px 16px -8px rgba(0,0,0,0.3),0 -6px 16px -6px rgba(0,0,0,0.025);box-shadow:0 7px 14px rgba(50,50,93,0.1),0 3px 6px rgba(0,0,0,0.08)}.character-card-image{width:100%;height:250px;border-top-right-radius:5px;border-top-left-radius:5px}.character-card-read-more{cursor:pointer;opacity:0.8}.character-card-read-more .read-more-text{font-size:14px;margin:0;color:#c6c6c6}.character-card-read-more .read-more-icon{border:solid white;border-width:0 3px 3px 0;display:inline-block;padding:3px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.character-card-read-more:hover{opacity:1}.character-card-loading{position:absolute;border-radius:5px;height:100%;width:100%}.character-card-loading-modal{position:absolute;height:100%;width:100%;background-color:#212121;opacity:1}.character-card-loading-modal-text{font-size:20px;color:white;opacity:1;position:absolute;left:50%;top:50%;transform:translate(-50%, 0)}

.character-details-modal{position:absolute;top:50%;left:50%;right:auto;bottom:auto;margin-right:-50%;transform:translate(-50%, -50%);width:700px;height:375px;display:flex;opacity:1;border-radius:5px;background-color:#575757;color:white;padding-left:20px;padding-right:20px;flex-direction:row;align-items:center}@media (max-width: 724px){.character-details-modal{padding-top:20px;flex-direction:column;width:60%;height:auto}.character-details-modal .detail-value{flex-wrap:wrap}}@media (max-width: 570px){.character-details-modal{width:85%}}@media (max-width: 402px){.character-details-modal{width:95%}}.character-details-overlay{position:fixed;width:100%;height:100%;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.5)}.character-details-modal-image{height:330px;width:50%;margin-right:.5em}@media (max-width: 724px){.character-details-modal-image{width:60%;height:30%}}.episode-list{display:flex;flex-wrap:wrap}.episode-list .detail-type{margin-right:50px}.episode-list .detail-value{margin-left:10px;margin-top:5px}.episode-list .episode-list-numbers{display:flex;flex-wrap:wrap}

.location-details-modal{position:absolute;top:50%;left:50%;right:auto;z-index:3;bottom:auto;margin-right:-50%;transform:translate(-50%, -50%);width:300px;height:200px;display:flex;opacity:1;border-radius:5px;background-color:#575757;color:white;padding-left:20px;padding-right:20px}.location-details-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.5)}.location-title{margin-bottom:5px;font-size:1em;text-align:center}

