*{box-sizing:border-box;margin:0;padding:0;font-family:Lora,serif}html,body{min-height:100vh;overflow-x:hidden}ul li:first-child{background-color:#272727}ul li:first-child a{color:#fff}a{color:#1a1a1a;text-decoration:none}.pl-logo{color:#fff;z-index:102;font-size:4em;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.overlay{z-index:100;pointer-events:none;background-color:#0000;width:100vw;height:100vh;display:flex;position:fixed}.box{z-index:101;pointer-events:none;background-color:#000;width:10vw;height:100vh}.news-container{flex-direction:column;display:flex}.news-section{grid-template:"main aside"". ."/2.8fr 1fr;grid-area:main;height:100%;display:grid}.heading{color:#1a1a1a;margin-bottom:.7rem;font-family:Lora,serif;font-size:1.5em;font-weight:400}.main-news-container{flex-direction:column;grid-area:main;gap:1em;padding:0 2em;display:flex}#top-headline-section{flex-direction:row;gap:1em;display:flex}#top-headline{flex:1;max-width:30%}.other-news{flex:2;grid-template-rows:repeat(2,1fr);grid-template-columns:repeat(3,1fr);gap:1em;display:grid}.cc0-container{flex-direction:column;display:flex}.cc1-container{max-width:250px;height:250px}.cc1-container:hover .title{text-decoration:underline}.img-container{height:70%}#news-title,.cc3-description,.cc0-description,.cc4-title{-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:.3rem 0;display:-webkit-box;overflow:hidden}.cc0-description{-webkit-line-clamp:5;margin:1rem 0;font-size:large;font-weight:500;line-height:1.5em}.cc4-title{-webkit-line-clamp:4}.cc1-description,.cc1-title{margin-bottom:1em}figure img{object-fit:cover;width:100%;height:100%}.latest-news-section{grid-area:aside;width:100%}.latest-news-container h1{color:#333;text-align:start;font-family:Lora,serif;font-size:2em}.latest-news-container hr{align-self:center;width:90%}.aside-news-card{flex-direction:row;gap:10px;height:5em;margin:10px 0;transition:transform .3s,box-shadow .3s;display:flex}.aside-news-card:hover{transform:translate(-4px);box-shadow:0 5px 5px #0000001a}.aside-news-card:hover #left-border{background-color:#f0c;animation-name:drop;animation-duration:.5s}@keyframes drop{0%{background-color:#4d4d4d;height:0%}to{background-color:#f0c;height:75%}}.time-section{flex-grow:1/9;color:#333;font-family:Lora,serif}.time-section div{background-color:#4d4d4d;border-radius:5%;width:10%;height:75%}.aside-news-title{color:#333;flex-grow:1;font-family:Lora,serif;font-weight:200}#news-title{color:#222;font-family:Lora,serif;font-size:.9rem;font-weight:600}.source,.author{color:#5e5e5e;white-space:nowrap;text-overflow:ellipsis;width:30ch;margin:1em 0;font-family:Lora,serif;font-size:1rem;font-weight:500;overflow:hidden}.separator{color:#5d5d5d}.section-seperator{color:#000;align-self:center;width:95%;margin:4em 0}.section-heading{margin-bottom:1em;font-size:1.5em}#weekend-reads-section{padding:0 2em}#weekend-reads-section .heading{margin:.5em 0;font-size:1.2em}.weekend-reads-container{flex-direction:row;gap:16px;width:100%;display:flex}.weekend-reads-container article{flex-grow:1}.cc3-description{margin-bottom:20px}.source-container{word-spacing:.1em}.time{color:#5e5e5e;font-family:Lora,serif}.more-news-container{margin:1em 2em}.more-news{justify-content:space-between;display:flex}#cc4-heading{margin:0 0 1em .9em;font-family:Lora,serif}#cc-4{width:30%;height:fit-content;max-height:10em;margin:0 auto;font-family:Lora,serif}#cc4-link{color:#1a1a1a;font-size:large;font-weight:500}.cc4-title{max-height:6em;margin-bottom:1em;overflow:hidden}#cc4-link:hover .cc4-title{text-decoration:underline}.cc4-time,#cc4-source{color:#8a8989;font-size:medium}.catalouge{justify-content:space-between;height:fit-content;margin:0 2em;display:flex}.c-section{flex-direction:column;flex-grow:1;gap:30px;max-width:300px;display:flex}.c-section #cc-4{width:100%}.c-section #heading{font-size:1.5em;font-weight:800;text-decoration:underline}#news-title{color:#1a1a1a;font-size:large;font-weight:500}.aside-news-card #news-title{font-size:1.1em}#aside-author{margin:0}.loading{background-color:#8a8989;min-height:30px}*{box-sizing:border-box;margin:0;padding:0}body{min-height:100vh;display:block}.page-container{flex-direction:column;height:100vh;display:flex}.header-container{background-color:#fff;flex-direction:column;width:100%;height:100%;display:flex}.navigation{justify-content:space-between;width:100%;height:100%;display:flex}.weather{flex-direction:column;justify-content:center;align-items:center;width:100%;line-height:1.1em;display:flex}.label{width:100%}.weather p{text-transform:capitalize}#Location-Temperature{word-spacing:1em}#temperature{word-spacing:.5em}.label{justify-content:center;align-items:center;width:100%;font-family:Lora,serif;font-size:2em;display:flex}.search-bar-container{flex-direction:row;justify-content:center;align-items:center;width:100%;display:flex}.search-bar{width:60%;height:2em;display:flex}#search{color:#000;background-color:#f1f1f1;border:none;border-radius:2px;flex-grow:7;padding:10px}.search-button{cursor:pointer;background-color:#f1f1f1;border:none;flex-grow:3}#search:focus{background-color:#fff;outline:none}#search:focus~.search-button{color:#fff;background-color:#f0c}#search:focus{border-bottom:1px solid #f0c}.search-bar:hover{box-shadow:0 2px 5px #bb5fa41a}.search-button i{cursor:pointer;font-size:medium}#search:focus~.search-button i:hover{color:#8b8b8b}.navbar{z-index:10;background-color:#fff;justify-content:center;height:4em;margin:2em 0;display:flex;position:sticky;top:0;box-shadow:0 2px 5px #0000001a}.nav-items-container{align-items:center;gap:10px;height:100%;list-style:none;display:flex}.nav-items-container li{cursor:pointer;border:1px solid #0000;padding:10px 20px}.nav-items-container li a{color:#222;font-family:Lora,serif;font-size:16px;font-weight:500;text-decoration:none;transition:color .1s}.nav-items-container li:hover{border:1px solid #ccc;animation:1s ease-in-out wrap}@keyframes wrap{0%{border:1px solid #0000}25%{border-bottom:1px solid #ccc}50%{border-bottom:1px solid #ccc;border-right:1px solid #ccc}75%{border-top:1px solid #ccc;border-bottom:1px solid #ccc;border-right:1px solid #ccc}to{border:1px solid #ccc}}li:hover a{color:#5e5e5e}.separator{color:#ccc;margin:0 10px}