:root{--Soft-blue:hsl(215,51%,70%);--Cyan:hsl(178,100%,50%);--main-bg:hsl(217,54%,11%);--card-bg:hsl(216,50%,16%);--Very-dark-blue:hsl(215,32%,27%);--White:hsl(0,0%,100%);--border-radius:12px}body{font-family:'Outfit',sans-serif;background-color:hsl(217,54%,11%);background-color:var(--main-bg);margin-top:2em;margin-bottom:5em}.card{width:90%;margin-left:auto;margin-right:auto;background-color:hsl(216,50%,16%);background-color:var(--card-bg);border-radius:12px;border-radius:var(--border-radius);padding:1.5em}@media screen and (min-width:768px){.card{width:50%}}@media screen and (min-width:1024px){body{height:100vh;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:0;overflow:hidden}.card{width:25%}}.card__img{display:block;max-width:100%;border-radius:12px;border-radius:var(--border-radius);z-index:0}.icon__active{display:none}@media screen and (min-width:1024px){.card__img{cursor:pointer;opacity:1;-webkit-transition:opacity 0.5s;transition:opacity 0.5s}.card__top{border-radius:12px;border-radius:var(--border-radius);position:relative;background-image:url('../images/icon-view.svg');background-repeat:no-repeat;background-position:center;-webkit-transition:background-color 0.5s;transition:background-color 0.5s}}.card__body{padding-bottom:1em;font-size:18px;border-bottom:1px solid hsl(215,32%,27%);border-bottom:1px solid var(--Very-dark-blue)}.card__title{color:hsl(0,0%,100%);color:var(--White);font-size:1.5rem;font-weight:600}.card__text{font-size:1rem;width:95%;color:hsl(215,32%,27%);color:var(--Very-dark-blue);font-weight:400}.card__info{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.text__gray,.text__green{font-size:0.9rem}.text__green{color:hsl(178,100%,50%);color:var(--Cyan)}.text__gray{color:hsl(215,51%,70%);color:var(--Soft-blue)}.card__icon{-webkit-transform:translateY(20%);transform:translateY(20%)}.card__footer{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:spaace-evenly;-ms-flex-pack:spaace-evenly;justify-content:spaace-evenly;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-top:0.5em}.footer__img{max-width:12.5%;border-radius:50%;border:1px solid hsl(0,0%,100%);border:1px solid var(--White)}.footer__name{display:inline-block;margin-left:10px;margin-right:5px;color:hsl(215,51%,70%);color:var(--Soft-blue)}.text__white{color:hsl(0,0%,100%);color:var(--White)}@media (hover:hover){.card__title:hover,.footer__name:hover{cursor:pointer;color:hsl(178,100%,50%);color:var(--Cyan)}.card__top:hover{background-color:rgba(0,255,247,0.8)}.card__img:hover{opacity:0.5}}