@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Quicksand:wght@300..700&display=swap');

*{margin: 0;padding: 0;box-sizing: border-box;font-family: Quicksand !important;}
a{text-decoration: none;}
body::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(../images/HomeMainVector.png);
    background-size: 70%;
    z-index: -1;
}
:root {--main-color: #0B63E5; }
body {font-family: Quicksand !important;position: relative;width: 100%;height: 100vh;}
h2 {font-size: 72px;font-weight: 700;line-height: 80px;}
h3 {font-size: 58px;font-weight: 700;line-height: 100%;}
h4{font-size: 48px;font-weight: 700;}
/* Footer Styilng */
footer {display: flex !important;align-items: center;justify-content: space-between;padding: 23.5px;background-color: #ffffff03;position: absolute;bottom: 0;width: 100%;backdrop-filter: blur(10px);z-index: 2;}
footer p{font-size: 16px;font-weight: 400;margin: 0 !important;}
.SocialMediaWrap {display: flex;gap: 22.67px;}
.SocialMediaWrap {display: flex;gap: 22.67px;}
.SocialMediaWrap a {width: 19px;height: 19px;}
.SocialMediaWrap a img{width: 100%;height: 100%;object-fit: contain;}
/* header styling */
header {padding: 30px;display: flex;justify-content: space-between;align-items: center;}
header .HeadLogoWrap img{width: 168px;}
.HeadBtn {background-color: var(--main-color);border-radius: 7px;padding: 0px 30px;text-decoration: none;color: #fff;
font-size: 16px;font-weight: 700;height: 48px;display: flex;align-items: center;}
a.HeadBtn.pasttrend,a.SignIn.HeadBtn{background: transparent;color: #0B63E5;border: 1px solid #0B63E5;border-radius: 5px;}
/* Login Page styling*/
.LoginLeft,.Loginright {width: 55%;height: 100%;position: relative;display: flex;align-items: center;justify-content: center;}
.LoginLeft::before {content: ' ';position: absolute;top: 0;left: 0;background-image: url(../images/LoginLeftVector.svg);width: 100%;height: 100%;background-repeat: no-repeat;background-size: cover;z-index: -1;background-position: bottom;}
.Loginright {width: 60%;background-image: url(../images/LoginRightBG.png);background-repeat: no-repeat;height: calc(100% - 30px);background-size: cover;background-position: center bottom;border-radius: 20px;margin: 30px 30px 30px 0px;display: flex;
align-items: center;justify-content: center;padding: 75px;}
.loginWrap {height: calc(100vh - 23px);display: flex;}
.LoginForm {padding: 70.5px 30px;display: flex;flex-direction: column;gap: 50px;width: 561px;align-items: center;}
.FormCont {display: flex;align-items: center;flex-direction: column;gap: 30px;width: 100%;}
.FormCont a {padding: 19px;text-decoration: none;border-radius: 10px;font-size: 20px;font-weight: 700;color: #141415;width: 100%;text-align: center;}
a.ContWithPhoneNum {background-color: var(--main-color);color: #fff;}
a.ContWithGoogle {box-shadow: 0px 18px 30px 0px #8377C61C;border: 1px solid #E0E0E9;display: flex;align-items: center;justify-content: center;gap: 16.46px;}
a.Contactus {padding: 0 !important;font-weight: 500;}
.rightContent {display: flex;flex-direction: column;text-align: center;align-items: center;}
.rightContent img {margin-bottom: 42px;}
.Loginright h4{margin-bottom: 10px;color: #fff;}
.Loginright p{font-size: 22px;font-weight: 400;color: #fff;}
/* Home Page Design */
.MainCont {width: 100%;height: calc(100vh - 67px - 108px);display: flex;}
/* .HomeMain {
    background-image: url(../images/HomeMainVector.png);
    z-index: 1;
    background-size: 100% 100vh;
    background-repeat: no-repeat;
    background-position: top;
} */
.HomeLeft {width: 45%;display: flex;align-items: center;justify-content:center;}
.HomeRight {width: 50%;position: relative;z-index:2;background: #fff;}
.HomeRight::before {content: ' ';position: absolute;top: 0;left: 0;background-image: url(../images/HomeRightImg.svg);
background-position: center;background-size: contain;width: 100%;height: 100%;z-index: -1;background-repeat: no-repeat;}
span.title {background: #EAF3FF;border-radius: 100px;padding: 12px 24px;font-size: 16px;font-weight: 500;margin-bottom: 15px;}
.HomeLeftCont {color: #061C3D;display: flex;flex-direction: column;align-items: flex-start;}
.HomeLeftCont p {font-size: 20px;margin: 30px 0px;}
/* Home Quiz Styling */
.HomeQuizLeft {width: 45%;border-top-left-radius: 10px;border-bottom-left-radius: 10px;height: 100%;position: relative;background: #fbf6f0;border-top-left-radius: 10px;
    border-bottom-right-radius: 10px;}
/* .HomeQuizLeft::before {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-image: url(../images/MIND\ MATTER\ Graphic\ Design.svg);background-size: cover;background-position: center;background-repeat: no-repeat;z-index: 1;} */
.HomeQuizWrap {padding: 0px 30px;width: 100%;display: flex;}
.HomeQuizRight {width: 55%;background-color: #EAF3FF;padding: 49px 30px;border-top-right-radius: 10px;border-bottom-right-radius: 10px;display: flex;flex-direction: column;gap: 25px;align-items: flex-start;}
.HomeQuizRight h3{color: #061C3D;}
input.QuizInput {width: 100%;background: #fff;padding: 30px;border: 1px solid #0B63E5;box-shadow: 0px 18px 30px 0px #8377C61C;border-radius: 10px;font-size: 20px;font-weight: 400;color: #061C3D;}
input.QuizInput::placeholder{font-size: 20px;font-weight: 400;color: #061C3D;}
.WrongAnsErrorWrap {display: flex;align-items: center;gap: 20px;font-size: 16px;font-weight: 400;color: #FF1400;}
.error-span {padding: 5px 10px;background: #FF14001A;border-radius: 110px;}
.HomeQuizBtnWrap {display: flex;justify-content: space-between;width: 100%;}
a.HeadBtn.GiveUp {border: 1px solid #0B63E5;background: transparent;color: #0B63E5;}
.letter-btn {font-size: 24px;height: 7.2vh;text-align: center;cursor: pointer;border-radius: 8.71px;background: #FFF;
transition: 0.3s;font-weight: 500;display: flex;align-items: center;justify-content: center;border: none;}
.char-row {display: grid;gap: 10px;}
.char-row-1 {grid-template-columns: repeat(10, 1fr);}
.char-row-3 {grid-template-columns: repeat(9, 1fr);}
.char-row-4 {grid-template-columns: repeat(7, 1fr);}
.char-row-5 {grid-template-columns: repeat(5, 1fr);}
.EnterBtn ,.EraseBtn{background-color: var(--main-color);border: none;color: #fff;}
div#desktop-keyboard-web {width: 100%;}
.crossImgWrap {position: absolute;top: 0;left: 50%;transform: translate(-50%, 109%);}
.modal {display: none;position: fixed;z-index: 1;left: 0;top: 0;width: 100%;height: 100%;background-color: #061c3d4d;opacity: 0;animation: fadeIn 0.5s forwards;}
@keyframes fadeIn {
to {opacity: 1;}
}
.modal-content {background-color: white;padding: 30px;width: 80%;max-width: 453px;position: relative;top: 50%;left: 50%;
transform: translate(-50%, -50%);border-radius: 10px;display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 30px;}
.modalContText {display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 15px;}
.modalBtnWrap {width: 100%;display: flex;gap: 40px;}
.modalBtnWrap button {width: 50%;height: 48px;border-radius: 7px;border: none;color: #fff;background-color: var(--main-color);
font-size: 16px;font-weight: 700;}
.modalBtnWrap button.cancelGiveUp {background-color: #fff;color: #0B63E5;border: 1px solid #0B63E5;}
.modal-content h6 {font-size: 28px;font-weight: 700;color: #061C3D;text-align: center;}
.modal-content p {font-size: 16px;font-weight: 400;color: #061C3D;text-align: center;}
.modal-content img {width: 64px;height: 64px;}
.closeBtn {color: #061C3D;float: right;font-size: 50px;font-weight: 500;position: absolute;right: 20px;top: 0px;}
.closeBtn:hover,.closeBtn:focus {color: #061C3D;text-decoration: none;cursor: pointer;}
/* Result Page Styling */
.ResultWrap{display: flex;width: 100%;flex-direction: column;gap: 30px;}
.TitleSpan {color: #141415;background: #EAF3FF;padding: 12px 24px;font-size: 20px;font-weight: 500;border-radius: 8px;}
.ResultScoreTable{padding: 20px;}
.resultnum {width: 100%;display: flex;gap: 10px;}
span.resultnumspan{width: 25%;background: #EAF3FF;text-align: center;padding: 18.5px;font-size: 22px;font-weight: 500;color: #000;border-top-left-radius: 8px;
    border-top-right-radius: 8px;}
    .resultnum.numsecond .resultnumspan {
        border-bottom-left-radius: 8px;
        border-bottom-right-radius: 8px;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
    }
.resultnum.numsecond{border-top: 1px solid #FFFFFF;}
.resultprocess {padding: 10px 5px;background-color: #fff;display: flex;flex-direction: column;gap: 10px;}
.progressspan {display: flex;align-items: center;gap: 14.2px;}
.num{font-size: 16px;font-weight: 400;}
.resultNum {width: 24px;display: flex;align-items: center;justify-content: center;font-size: 22px;font-weight: 700;}
.score {padding: 23.2px 20px;background: #AFAFAF;display: flex;align-items: center;justify-content: end;color: #fff;border-top-right-radius: 5px;border-bottom-right-radius: 5px;}
.score.won-attempt {background-color: #02AA74;}
.score-two {width: 100%;background-color: #02AA74;}
.score-three{width: 65%;}
a.ResultSocialBtn {border-radius: 33.6px;width: 25%;text-decoration: none;padding: 20px;font-size: 16px;font-weight: 500;text-align: center;color: #fff;display: flex;align-items: center;justify-content: center;gap: 10px;}
.ResultSocialBtnWrap {display: flex;gap: 10px;}
.resultTable {background: #fff;}
a.ResultSocialBtn.FBBtn {background: #4267B2;}
a.ResultSocialBtn.WPBtn {background: #25D366;}
a.ResultSocialBtn.LIBtn {background: #0A66C2;}
a.ResultSocialBtn.TWBtn {background: #000;}
a.ResultSocialBtn img {width: 11.6px;height: 20.6px;}
a.ResultSocialBtn.FBBtn img{width: 7.6px;}
.input-error {
    border: 2px solid red !important;
}
.message-box {
    padding: 10px 20px;
    background-color: #EAF3FF;
    border: 1px solid #fff;
    border-radius: 5px;
    font-weight: bold;
    transition: opacity 0.5s ease;
    position: absolute;
    top: 40px;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 999;
    height: 45px;
    box-shadow: rgba(3, 102, 214, 0.3) 0px 0px 0px 3px;
    color: #000;
    text-align: center;
    display: flex
;
    align-items: center;
    margin-top: 15px;
}
.head-btn-wrap{
    display: flex;
    align-items: center;
    gap: 10px;
}
/* Calander PAGE DESIGN */
.CalnderCont {width: 100%;background-image: url(../images/Calander-bg.png);background-position: bottom;background-size: cover;background-repeat: no-repeat;display: flex;justify-content: flex-start;flex-direction: column;padding: 0px 40px;}
span.TitleSpan { padding: 9.08px 24px; background: #86BB6D33; border: 1.3px solid #86BB6D66; border-radius: 1296.83px; font-size: 18px; font-weight: 500; }
.CalnderTitle { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; margin-bottom: 74px; }
span.TitlePara { font-size: 17.37px; font-weight: 400; }
.wrapper { background: #E7F0FF; width: 100%; border-radius: 5px; margin: auto; padding: 30px;box-shadow: rgba(3, 102, 214, 0.3) 0px 0px 0px 3px; }
.calheader { padding:0px 0px 30px  0px; display: flex; justify-content: space-between;border-bottom: 1px solid #D5D4DF; }
.calheader span, .calheader .current-date { font-size: 26px; font-weight: 900; }
.date-wrappeer {
    display: flex
;
    gap: 30px;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}.calheader .icons span { padding: 0px 10px; color: #878787; margin: 0 1px; border-radius: 50px; font-weight: 800; }
.icons span { transition: opacity 0.3s ease; cursor: pointer; }
.calheader .icons span:last-child { margin-right: -10px; }
.calendar ul { display: flex; list-style: none; flex-wrap: wrap; text-align: center;}
.calendar .weeks li {font-weight: 600;font-size: 16px;}
.calendar .days li {z-index: 1;cursor: pointer;height: 135px;display: flex;align-items: center;justify-content: center;border: 1px solid #D5D4DF;font-size: 22px;font-weight: 400;}
.days li.inactive {color: #A8A8A8;background: #FCFCFC;}
.days li.active {color: #fff;font-weight: 600;}
.calendar ul li {position: relative;width:calc(100%  / 7) }
.calendar .days li::before {position: absolute;content: "";height: 100%;width: 100%;top: 50%;left: 50%;z-index: -1;border-radius: 0;transform: translate(-50%, -50%);}
.days li:hover::before {background: #f2f2f2;color:#000;}
.days li.active::before {background-color: var(--main-color);color:#fff;}
ul.weeks li {padding: 20px;}
.rotate-device-message{display: none;}
.title-quizans-wrap {
    display: flex;
    justify-content: space-between;
}
span.show-msg {
    font-size: 24px;
    font-weight: 700;
    COLOR: #02AA74;
}
.resultTable.corract-result-table {
    width: 70%;
}
.result-wrap {
    display: flex;
    gap: 20px;
}
.resultTable.corract-result-answer {
    width: 30%;
}
.resultTable.corract-result-answer .ResultScoreTable{
    width: 100%;
    height: 100%;
}
.resultTable.corract-result-answer .ResultScoreTable .Answer-span {
    WIDTH: 100%;
    background: #EAF3FF;
    height: 88px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
}
.resultTable.corract-result-table.corract-result-table-hide {
    width: 100%;
}
.HomeQuizLeft {
    width: 45%;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    height: 100%;
    position: relative;
    background: #fbf6f0;
    border-top-left-radius: 10px;
    border-bottom-right-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.HomeQuizLeft img {
    width: 100%;
    height: 100%;
}

/* Responsive Styling */
@media (max-width: 1500px) {
footer{padding: 17.5px;}
a.ResultSocialBtn img {width: 13.6px;height: 20.6px;}
footer p {font-size: 13px;}
.SocialMediaWrap a {width: 16px;height: 16px;}
.SocialMediaWrap{gap:16.67px;}
.Loginright {height: calc(100% - 20px);width: 55%;margin: 15px 15px 15px 0px;border-radius: 10px;}
.rightContent img{width: 50%;}
h4 {font-size: 38px;}
.LoginForm {padding: 40px 25px;width: 430px;gap: 26px;}
.FormCont a {padding: 13px;font-size: 14px;border-radius: 7px;gap: 10px;}
.FormCont{gap: 15px;}
a.logoWrap img {width: 150px;}
a.ContWithGoogle img {width: 15px;height: 15px;}
a.ContWithGoogle{padding: 12px;}
.rightContent img {margin-bottom: 30px;}
h4 {font-size: 30px;}
.Loginright p {font-size: 18px;}
header{padding: 15px;}
header .HeadLogoWrap img {width: 135px;}
.MainCont {height: calc(100vh - 44px - 78px);}
h2 {font-size: 42px;font-weight: 700;line-height: 57px;}
h3 {font-size: 34px;}
.HomeLeftCont p {font-size: 14px;margin: 15px 0px;}
span.title {padding: 10px 20px;font-size: 14px;margin-bottom: 10px;}
.HeadBtn{height: 42px;font-size: 14px;}
.letter-btn {height: 7.5vh;font-size: 16px;border-radius: 4.71px;}
.HomeQuizRight {padding: 29px 20px;gap: 0px;justify-content: space-between;}
input.QuizInput {padding:12px 20px;font-size: 16px;border-radius: 7px;}
input.QuizInput::placeholder {font-size: 16px;}
.WrongAnsErrorWrap{font-size: 14px;}
.char-row {gap: 5px;}
.error-span {padding: 3px 10px;font-size: 13px;}
button.letter-btn.EraseBtn svg {width: 20px;}
.crossImgWrap {transform: translate(-50%, 63%);}
.modal-content{gap: 20px;max-width: 353px;padding: 20px;}
.modal-content h6 {font-size: 22px;}
.modal-content p {font-size: 14px;}
.modalBtnWrap button {height: 40px;font-size: 14px;border-radius: 5px;font-weight: 600;}
.modalBtnWrap{gap: 20px;}
.modal-content img{width: 48px;height: 48px;}
.closeBtn{font-size: 30px;top: 0px;right: 10px;}
.resultprocess {gap: 7px;padding: 5px;}
.num, .resultNum {font-size: 14px;width: 5px;}
.score {padding: 7.2px 10px;}
.ResultWrap {gap: 10px;}
.TitleSpan {padding: 10px 24px;font-size: 16px;border-radius: 5px;}
span.resultnumspan {padding: 10.5px;font-size: 18px;}
.ResultScoreTable {padding: 14px;}
a.ResultSocialBtn {padding: 10px;font-size: 15px;}
.calheader {padding: 0px 0px 15px;}
.calheader span, .calheader .current-date {font-size: 20px;}
ul.weeks li{padding:15px;}
.calendar .days li{height: 75px;font-size: 18px;}
.wrapper {padding: 15px;}
.message-box{
    height: 36.17px;
    top: 20px;
}
.resultnum.numsecond .resultnumspan {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}
.resultTable.corract-result-answer .ResultScoreTable .Answer-span {
    border-radius: 5px;
}
}
@media (max-width: 1200px) {
h2 {font-size: 44px;line-height: 47px;}
.HomeLeftCont p {font-size: 15px;}
.HomeMain {background-size: 91%;background-position: left;}
.HomeLeft {width: 45%;padding-right: 20px;}
.HomeRight {width: 55%;}
.LoginForm {width: 480px;padding: 50px 25px;}
.Loginright {width: 50%;padding: 50px;}
.LoginLeft {width: 50%;}
header {padding: 20px;}
.HeadBtn {height: 42px;padding: 0 25px;}
footer {padding: 15px 20px;}
.HomeQuizWrap {padding: 0 10px;}
.HomeQuizRight {width: 60%;padding: 40px 25px;gap: 20px;}
.letter-btn {height: 6.8vh;font-size: 18px;}
input.QuizInput {padding: 15px 25px;font-size: 18px;}
.WrongAnsErrorWrap {font-size: 15px;}
.error-span {padding: 4px 12px;font-size: 14px;}
.char-row {gap: 8px;}
h3 {font-size: 42px;}
h4 {font-size: 36px;}
.rightContent img {max-width: 80%;}
.FormCont a {padding: 15px;font-size: 18px;}
.crossImgWrap {transform: translate(-50%, 74%);}
}

@media (min-width: 600px) and (max-width: 1280px) and (orientation: landscape) {
.HomeLeftCont p {font-size: 13px;}
h2 {font-size: 40px;line-height: 45px;}
}
@media only screen and (device-width: 1024px) and (device-height: 768px) and (orientation: landscape) {
h3 {font-size: 32px;} 
}
@media only screen and (device-width: 1366px) and (device-height: 1024px) and (orientation: landscape) {
h3{font-size: 48px;}
.HomeQuizRight {padding: 49px 20px;gap: 25px;}
.HeadBtn {height: 48px;font-size: 16px;}
.char-row {gap: 10px;row-gap: 15px;}
.letter-btn {height: 8.4vh;font-size: 18px;border-radius: 8.71px;}
}

@media screen and (max-width:992px) and (orientation:landscape){
a.logoWrap img {width: 125px;}
.LoginForm {gap: 15px;padding: 50px 35px;}
.FormCont a {padding: 8px 10px;font-size: 12px;font-weight: 500;border-radius: 4.71px;}
h4 {font-size: 18px;}
br{display: none;}
.Loginright p {font-size: 11px;}
.LoginLeft {width: 47%;}
.Loginright {width: 53%;padding: 30px;border-radius: 5px;margin: 7px 7px 7px 0px;}
footer { padding: 7px 12px;}
.loginWrap { height: calc(100vh - 5px); }
.SocialMediaWrap a { width: 14px; height: 14px; }
.rightContent img { width: 45%; margin-bottom: 15px; }
footer p { font-size: 10px; }
.SocialMediaWrap { gap: 10px; }
.FormCont { gap: 12px; }
header { padding: 10px; }
.HomeLeft { width: 45%; padding-left: 20px; }
header { padding: 7px 12px; }
header .HeadLogoWrap img { width: 70px; }
h2 { font-size: 22px; line-height: 27px; }
.HeadBtn { height: 20px; padding: 0 12px; font-size: 10px; border-radius: 3px !important; font-weight: 500; }
span.title { padding: 7px 15px; font-size: 12px; margin-bottom: 12px; }
.HomeLeftCont p { font-size: 8px; margin: 10px 0px 14px; }
.MainCont {
    height: calc(100vh - 39px - 28px);
}.HomeRight::before { background-size: cover; }
.crossImgWrap { transform: translate(-50%, 44%); }
.crossImgWrap img { width: 13.53px; height: 13.53px; }
.HomeQuizRight { width: 60%; padding: 10px 15px; }
h3 { font-size: 18px; }
.HomeQuizRight { width: 60%; padding: 10px 15px; gap: 6px; justify-content: space-between; border-top-right-radius: 4px; border-bottom-right-radius: 4px; }
input.QuizInput { padding: 7px 12px; font-size: 12px; border-radius: 4px; }
input.QuizInput::placeholder { font-size: 12px; }
.WrongAnsErrorWrap { font-size: 10px; gap: 10px; }
.error-span { padding: 3px 12px; font-size: 9px; border-radius: 70px; }
.char-row { gap: 4px; }
.letter-btn { height: 7vh; font-size: 11px; border-radius: 2px; }
button.letter-btn.EraseBtn svg { width: 15px; }
.modal-content img { width: 37.22px; height: 37.22px; }
.modal-content { gap: 12px; max-width: 246px; padding: 12.69px; border-radius: 4.23px; }
.modal-content h6 { font-size: 16px; }
.modal-content p { font-size: 9px; }
.modalBtnWrap button { height: 21px; font-size: 9px; border-radius: 2.96px; font-weight: 500; }
.modalBtnWrap button { width: 40%; }
.modalBtnWrap { gap: 20px; justify-content: space-between; }
.modalContText { gap: 8px; }
.closeBtn { font-size: 24px; top: -2px; right: 7px; }
.TitleSpan { padding: 3px 10px; font-size: 10px; }
.ResultScoreTable { padding: 6px 5px 4px; }
span.resultnumspan { padding: 5.5px; font-size: 10px; }
.ResultWrap h4 { font-size: 14px; }
.resultprocess { gap: 4px; padding: 2px; }
.score { padding: 2.2px 8px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; }
a.ResultSocialBtn { padding: 5px; font-size: 10px; gap: 5px; }
.ResultWrap { gap: 5px; justify-content: space-between; }
.num, .resultNum { font-size: 12px; width: 5px; }
.resultnum.numsecond { border-top: 1.5px solid #FFFFFF; }
a.ResultSocialBtn img { height: 8.6px; }
.HomeQuizLeft { border-top-left-radius: 4px; border-bottom-left-radius: 4px; }
.HomeQuizLeft::before { border-top-left-radius: 4px; border-bottom-left-radius: 4px; }
.calheader {
    padding: 5px 0px;
}
.wrapper {
    padding: 10px;
    border-radius: 3px;
}
.CalnderCont {
    padding: 0px 10px;
}
.calheader span, .calheader .current-date {
    font-size: 11px;
}
.calendar .weeks li {
    font-size: 8px;
    padding: 7px;
}
.calendar .days li {
    height: 40px;
    font-size: 12px;
}
span.leftIcon svg, span.rightIcon svg {
    width: 5.92px;
}

.SocialMediaWrap a img
 {
    width: 12px;
    height: 12px;
}
.resultTable.corract-result-answer .ResultScoreTable .Answer-span{
    height: 48PX;
}
span.show-msg {
    font-size: 18px;
}
.LoginWrap.HomeWrap.CalnderContWrap {
    width: 100%;
}
}
@media (max-width: 767px) {
    .rotate-device-message {display: block !important;}
.rotate-device-message {background: #0B63E5;color: #fff;padding: 10px;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 90%;text-align: center;border-radius: 5px;font-size: 12px;
    }
    .Main {
        display: none;
    }
    footer{
        display: none !important;
    }
    header{
        display: none !important;
    }
}

@media only screen and (max-width: 812px) and (orientation: landscape) {
    .rotate-device-message{
        display: none !important;
    }
    .Main {
        display: block !important;
        width: 100%;
    }
    footer{
        display: flex !important;
    }
    header{
        display: flex !important;
    }
    main.content {
        height: calc(100vh - 39px - 28px);
        display: flex
    ;
        align-items: center;
    }
    .message-box {
        height: 14.75px;
        top: 2px;
        line-height: normal;
        border-radius: 3px;
        font-size: 10px;
    }
  
}