:root{--very-light-grayish-blue:hsl(240, 78%, 98%);--light-grayish-blue:hsl(234, 14%, 74%);--grayish-blue:hsl(233, 13%, 49%);--dark-grayish-blue:hsl(232, 13%, 33%);--color-primary:hsl(236, 72%, 79%);--color-secondary:hsl(237, 63%, 64%)}html{font-family:Montserrat,sans-serif}body{background-color:var(--very-light-grayish-blue);position:relative}body::after,body::before{content:'';background-size:cover;background-repeat:no-repeat;position:absolute;z-index:-1}body::before{background-image:url(../images/bg-top.svg);width:12rem;height:41rem;top:0;right:0}body::after{background-image:url(../images/bg-bottom.svg);width:18rem;height:15rem;bottom:0;left:0}.btn{display:inline-block;background-image:linear-gradient(90deg,var(--color-primary),var(--color-secondary));border:thin solid transparent;letter-spacing:2px;font-size:.7rem;border-radius:5px}.btn:hover{background-image:none;background-color:transparent;opacity:1;border:thin solid var(--color-secondary);color:var(--color-secondary)}@media screen and (min-width:64rem){body{height:100vh}body::before{width:24rem}}.switch::after,.switch::before{position:absolute;top:.5rem;font-weight:700;opacity:.3}.switch::before{content:'Montly';left:-4.5rem}.switch::after{content:'Annually';right:-5.5rem}.card{border-radius:10px}.card-title>h2{font-size:3rem}.card:nth-child(2){background-image:linear-gradient(90deg,var(--color-primary),var(--color-secondary))}.card:nth-child(2) .btn{color:var(--color-secondary);background-image:none;background-color:#fff}.card:nth-child(2) .btn:hover{background-color:transparent;color:#fff;border-color:#fff}@media screen and (min-width:64rem){.cards>.container{justify-content:space-between;align-items:center}.card{flex:1}main{flex:1;justify-content:center}}.attribution{background-color:var(--color-secondary)}.attribution a{color:var(--color-primary)}