Quiz and Answer

Posts

@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600&display=swap"); $lime: #9db858; @media print { @page { margin: 0; size: A4; } * { -webkit-print-color-adjust: exact; } } * { font-family: "Montserrat", sans-serif; margin: 0px; padding: 0px; box-sizing: border-box; } body { background: rgb(95, 99, 104); } .toCenter { width: 100%; text-align: center; display: flex; justify-content: center; align-items: center; } .grid-container { margin: auto; display: grid; grid-template-columns: 0.33fr 1fr; width: 210mm; height: 297mm; overflow: hidden; box-shadow: 0px 0px 10px rgba(black, 0.7); .zone-1 { padding: 40px 20px; padding-left: 35px; background: #d1d1d1; width: 100%; color: #313131; .profile { display: inline-flex; margin-bottom: 5px; margin-left: -15px; width: 220px; height: 220px; border-radius: 50%; background-image: url("https://image.freepik.com/free-photo/waist-up-portrait-handsome-serious-unshaven-male-keeps-hands-together-dressed-dark-blue-shirt-has-talk-with-interlocutor-stands-against-white-wall-self-confident-man-freelancer_273609-16320.jpg"); background-position: center top; background-size: 200%; border: 4px solid #2c2b29; } .contact-box { margin-top: 10px; & > * { width: 100%; display: grid; grid-template-columns: 0.3fr 1fr; margin-top: 25px; align-items: center; i { font-size: 1.3em; } .text { display: inline-flex; word-break: break-all; } } } .personal-box { margin-top: 35px; & > *:not(.title) { margin: 25px 0px; grid-template-columns: 0.55fr 1fr; display: grid; } .progress { .dot { display: inline-block; width: 10px; height: 10px; background-color: #313131; border-radius: 50%; margin-left: 4px; &.active { background-color: $lime; } } } } .hobbies-box { margin-top: 35px; .logo { margin: 10px 0px; display: grid; grid-template: 1fr 1fr / 1fr 1fr; font-size: 2.8em; grid-row-gap: 15px; } } } .zone-2 { background: #2c2b29; padding: 40px 20px; padding-right: 75px; color: lighten(#9c9c9a, 10%); .headTitle { font-size: 2.1em; color: $lime; h1 { font-weight: 400 !important; } } .subTitle { h1 { font-weight: 400 !important; } } .box { display: inline-block; padding: 2px 70px 2px 20px; margin-left: -20px; margin-top: 35px; background: $lime; color: #2c2b29; } .group-1 { .desc { margin-top: 15px; line-height: 1.5; } } .group-2 { .desc { margin-top: 15px; margin-left: 20px; ul { position: relative; margin-top: 20px; margin-left: 5px; &:before { content: ""; position: absolute; top: 12px; left: -22px; width: 10px; height: 10px; border-radius: 50%; background: $lime; } li { list-style-type: none; position: relative; &:before { content: ""; position: absolute; top: 12px; left: -18px; height: 60px; border-left: 2px solid $lime; } } &:last-of-type li { &:before { content: none; } } & li div:last-of-type { color: $lime; font-weight: bold; } } } } .group-3 { .desc { margin-top: 15px; margin-left: 20px; ul { position: relative; margin-top: 20px; margin-left: 5px; &:before { content: ""; position: absolute; top: 30px; left: -22px; width: 10px; height: 10px; border-radius: 50%; background: $lime; } li { list-style-type: none; position: relative; &:before { content: ""; position: absolute; top: 30px; left: -18px; height: 100px; border-left: 2px solid $lime; } } &:last-of-type li { &:before { content: none; } } & li div:nth-child(2) { color: $lime; font-weight: bold; } } } } } }

Search This Blog

Quiz and Answer

Posts

Indian Polity Parliamentary System