*{margin: 0;padding:0;box-sizing: border-box;}
body{font-family:Alexandria !important;padding:0;margin:0;color:#061C3D;}
a{text-decoration:none}
a:hover{text-decoration:none!important;}
button:focus{outline:none!important;}
ul{list-style:none!important;padding-left:0!important;margin-bottom:0!important;}
.login-wrap {height: calc(100vh - 66px);position: relative;}
.login-wrap::before{position:absolute;left:0;top:0;height:100%;width:100%;content:' ';background:url(../images/loginBg.svg) center center no-repeat;background-size:cover;background-position:bottom;}
.login-inner{height:100%;display:flex;justify-content:center;align-items:center;position:relative;}
.loginBox{width:595px;text-align:center;padding:70px 48px;box-shadow:0px 16px 72px 0px #061C3D14;border-radius:24px;display:flex;flex-direction:column;align-items:center;background:#FFFFFF1A;backdrop-filter:blur(20px);}
.loginBox p{padding-top:30px;margin:0;font-weight:400;font-size:18px;line-height:26px;text-align:center;color:#FFFFFF;opacity:70%;}
.phoneBtn{font-weight:400;font-size:24px;line-height:37.56px;vertical-align:middle;text-decoration:none;color:#fff;background:#2773EC;width:100%;height:61px;display:flex;justify-content:center;align-items:center;border-radius:70px;margin-top:48px;}
.phoneBtn:hover{text-decoration:none!important;color:#fff;}
/* .googleBtn:hover,.contactBtn:hover{text-decoration:none!important;color:#061C3D;} */
a.contactBtn:hover {color: #ffff;}
.blank-bar {width : auto !important;padding: 5px !important;}
.googleBtn{font-weight:400;font-size:24px;line-height:37.56px;vertical-align:middle;text-decoration:none;color:#fff;background:#FFFFFF;width:100%;height:61px;display:flex;justify-content:center;align-items:center;border-radius:70px;border:1px solid #E0E0E9;box-shadow:0px 18px 30px 0px #8377C61C;color:#061C3D;gap:16px;margin-top:15px;margin-bottom:48px;}
.contactBtn{font-weight:400;font-size:24px;line-height:37.56px;vertical-align:middle;text-decoration:none;color:#FFFFFF;}
.home-wrap{position:relative;height: 100%;}
main.content::before{position:absolute;left:0;top:0;height:100%;width:100%;content:' ';background:url(../images/homeBg.svg) center center no-repeat;background-size:cover;background-position: bottom;
}
.home-cont{position:relative;height:100%;display:flex;align-items:center;justify-content:center;}
header{display:flex!important;align-items:center;justify-content:space-between;z-index:2;padding:32px 30px;position:fixed;top:0;left:0;width:100%;}
header button{font-weight:700;font-size:16px;line-height:48px;text-transform:capitalize;padding:0 32px;height:48px;border:0;color:#fff;background:#2773EC;border-radius:7px;cursor: pointer;}
footer ul{display:flex;padding:0;gap:22px;}
footer {display: flex !important;align-items: center;justify-content: space-between;padding: 21px 30px;z-index: 1050;position: fixed;width: 100%;}
footer p{font-weight:400;font-size:16px;line-height:24px;text-align:center;vertical-align:middle;margin:0;}
.home-inner{text-align:center;display:flex;align-items:center;justify-content:center;gap:40px;margin:0 164px;width: 100%;}
.home-inner h1{font-weight:700;font-size:72px;line-height:80px;color:#061C3D;margin-bottom:0;text-align:left;}
.home-inner h1 span{color:#2773EC;position:relative;z-index:1;}
.home-inner p{font-weight:400;font-size:23px;line-height:32px;text-align:left;max-width:786px;margin:30px 0;color:#061C3D;}
.startBtn{font-weight:700;font-size:16px;line-height:48px;text-transform:capitalize;border:0;padding:0 32px;background:#2773ec;color:#FFFFFF;border-radius:7px;display:flex;align-items:center;gap:7px;cursor: pointer;font-family: Alexandria !important;}
.startBtn svg{transition:transform 0.3s ease;}
.startBtn:hover svg{transform:translateX(7px);}
.home-left{width:50%;}
.home-right{width:50%;}
.home-left img{width:100%;max-width:748px;height:505px;}
.resultCont{position:relative;height:100%;padding:38px 100px 20px 100px;}
.resultBox h2{color:#061C3D;font-weight:700;font-size:42px;line-height:100%;margin-bottom:30px;}
.past-trend{display:flex;align-items:flex-start;gap:30px;flex-direction:column;}
.past-left{width:100%;background:#E2ECFF;border-radius:10px;padding:20px;}
.past-left-inn{display:flex;gap:3px;border-radius:10px;overflow:hidden;}
.past-left-inn:last-child{margin-bottom:0;}
.past-left-inn span{width:205px;display:flex;align-items:center;justify-content:center;height:76px;font-weight:500;font-size:18px;line-height:50.85px;text-align:center;vertical-align:middle;background:#fff;}
.past-left p{font-weight:500;font-size:20px;line-height:21.78px;margin-bottom:40px;}
ul.social-link{display:flex;align-items:center;gap:10px;}
.social-link li{height:60px;display:flex;gap:10px;padding:20px 32px;border-radius:33px;font-weight:500;font-size:14px;line-height:100%;text-align:center;vertical-align:middle;color:#fff;align-items:center;width:calc(100% / 4);justify-content:center;}
li.facebook{background:#4267B2;}
li.whatsapp{background:#25D366;}
li.linkedin{background:#0A66C2;}
li.twitter{background:#000000;}
/* .numbergraph{height:41px;display:flex;align-items:center;justify-content:end;} */
.past-right-wrap{width:100%;}
.past-right{background:#E2ECFF;border-radius:10px;padding:20px;}
.past-right p{font-weight:500;font-size:20px;line-height:21.78px;margin-bottom:20px;}
.past-right ul li{display:flex;align-items:center;margin-bottom:10px;}
.past-right ul{background:#fff;border-radius:5px;padding:10px;}
.past-right ul li span{font-weight:400;font-size:16px;line-height:50.85px;text-align:center;vertical-align:middle;width:24px;}
.past-left-list{display:flex;gap:10px;}
.numbergraph.\31 4{width:100%;background:#02AA74;padding:20px;border-radius:0 5px 5px 0;color:#fff;font-weight:400;font-size:16px;line-height:50.85px;text-align:center;vertical-align:middle;}
.numbergraph.\34{width:30%;background:#AFAFAF;padding:20px;border-radius:0 5px 5px 0;color:#fff;font-weight:400;font-size:16px;line-height:50.85px;text-align:center;vertical-align:middle;}
.numbergraph.\31 2{width:50%;background:#AFAFAF;padding:20px;border-radius:0 5px 5px 0;color:#fff;font-weight:400;font-size:16px;line-height:50.85px;text-align:center;vertical-align:middle;}
.numbergraph.\37{width:70%;background:#AFAFAF;padding:20px;border-radius:0 5px 5px 0;color:#fff;font-weight:400;font-size:16px;line-height:50.85px;text-align:center;vertical-align:middle;}
.numbergraph.\39{width:40%;background:#AFAFAF;padding:20px;border-radius:0 5px 5px 0;color:#fff;font-weight:400;font-size:16px;line-height:50.85px;text-align:center;vertical-align:middle;}
.numbergraph.\35{width:50%;background:#AFAFAF;padding:20px;border-radius:0 5px 5px 0;color:#fff;font-weight:400;font-size:16px;line-height:50.85px;text-align:center;vertical-align:middle;}
.numbergraph.\38{width:70%;background:#AFAFAF;padding:20px;border-radius:0 5px 5px 0;color:#fff;font-weight:400;font-size:16px;line-height:50.85px;text-align:center;vertical-align:middle;}
.numbergraph.\33{width:50%;background:#AFAFAF;padding:20px;border-radius:0 5px 5px 0;color:#fff;font-weight:400;font-size:16px;line-height:50.85px;text-align:center;vertical-align:middle;}
.numbergraph.\31 4-gray{width:100%;background:#AFAFAF;padding:20px;border-radius:0 5px 5px 0;color:#fff;font-weight:400;font-size:16px;line-height:50.85px;text-align:center;vertical-align:middle;}
.numbergraph.\31 0{width:40%;background:#AFAFAF;padding:20px;border-radius:0 5px 5px 0;color:#fff;font-weight:400;font-size:16px;line-height:50.85px;text-align:center;vertical-align:middle;}
.rightbar {width: 100%;display: flex;flex-wrap: wrap;justify-content: center;position: relative;gap: 80px;z-index: 99;}
.key{background-color:transparent;color:#061C3D;border:1px solid #061C3D;border-radius:5px;padding:14px 20px;width:7.9vw;height:79px;transition:background-color 0.2s;font-weight:500;font-size:23.52px;line-height:100%;text-align:center;vertical-align:middle;text-transform:uppercase;display:flex;justify-content:center;align-items:center;cursor:pointer;font-family: Alexandria;}
.keyboard {display: flex;flex-direction: column;gap: 8px;padding: 0;width: 100%;margin: 0;padding: 0px 60px}
.row{display:flex;gap:10px;justify-content:space-evenly;margin-right:0!important;margin-left:0!important;}
.row.third button.key{width:9.8vw;}
.row.four button.key{width:12.9vw;}
.row.fifth button.key{width:14.8vw;}
.enter,.backspace{background-color:#2773EC;color:white;display:flex;align-items:center;justify-content:center;border:1px solid;text-transform:capitalize;border:1px solid #2773EC;}
.row.fifth{justify-content:space-between;}
.question-left{display:flex;align-items:center;gap:20px;}
.question-left input{color:#061C3D;height:100px;width:100px;box-shadow:0px 18px 30px 0px #8377C61C;border:1px solid #AFAFAF;border-radius:10px;font-weight:400;font-size:20px;line-height:37.56px;vertical-align:middle;text-align:center;font-family: Alexandria !important;}
.question-left input:focus{outline:none;border:1px solid #2773EC}
.mainQuiz {height: 100%;position: relative;display: flex;align-items: center;}
main.content {height: calc(100vh - 118px - 70px);margin-top: 118px;}
.quiz-main-question {display: flex;}
.rotate-device-message {z-index: 1050;position: relative;background: #2773EC;color: #fff;padding: 10px;text-align: center;width: 95%;margin: auto;border-radius: 5px;position: absolute;top: 50%;left: 50%;transform: translate(-50% , -50%);font-size: 12px;}
.rotate-device-message{display: none;}
/*************mini-screen responsive*************/
@media(max-width:1540px){
a.logoWrap {width: 241px;}
a.logoWrap img{width: 100%;}
.leftbar img{max-width:180px;}
.loginBox {width: 495px;padding: 35px 45px;border-radius: 18px;}
.loginLogo img{width:260px;}
.loginBox p{font-size:16px;line-height:20px;padding-top:20px;}
.phoneBtn{font-size:18px;line-height:28.56px;height:45px;margin-top:25px;}
.googleBtn {font-size: 18px;line-height: 28.56px;height: 45px;margin-bottom: 20px;}
.contactBtn{font-size:20px;line-height:30.56px;}
.home-inner {gap: 20px;margin: 0 144px;}
.home-inner h1 {font-size: 44px;line-height: 52px;}
.home-inner p {max-width: 546px;font-size: 16px;line-height: 22px;margin: 20px 0px;}
.startBtn {font-size: 14px;line-height: 36px;padding: 0 20px;}
button.startBtn svg {width: 20px;}
header{padding:20px;}
header span img{max-width:180px;}
header button{font-size:14px;height:38px;line-height:38px;padding:0 20px;}
footer{padding:15px 20px;}
footer p{font-size:14px;line-height:20px;}
footer ul{gap:15px;}
.key{width:100%;height:7.5vh;font-size:20px;}
.row.third button.key{width:100%;}
.row.four button.key{width:100%;}
.row.fifth button.key{width:13.6vw;}
.question-left input{height:60px;width:60px;border-radius:7px;}
.question-left{gap:15px;}
main.content {height: calc(100vh - 79.22px - 48px);margin-top: 79.22px;}
.home-left{height: 290px;}
.home-left img{height: 100%;}
.home-cont {align-items: baseline;padding-top: 50px;}
.login-wrap {height: calc(100vh - 54px);}
footer ul li a svg {width: 18px;}
.rightbar{gap:60px;}
.resultCont{padding: 20px 80px 20px 80px;}
.resultBox h2 {font-size: 38px;margin-bottom: 20px;}
.past-left p{margin-bottom:30px;}
.past-right-wrap ul li {display: flex;gap: 3.5px;}
.past-left-inn span {font-size: 16px;height: 60px;}
.past-trend{gap: 20px;}
.ResultSocialBtnWrap a{padding: 15px !important;}
}

@media(max-width:1200px){
.home-inner{margin: 0px 60px;}
.home-cont {align-items: center;padding: 0px;}
}
@media(max-width:992px){
.home-inner {flex-wrap: wrap;gap: 30px;}
.ResultSocialBtnWrap a{padding: 10px !important;font-size: 12px !important;gap: 5px !important;}
.past-left{padding: 15px;}
.past-left-inn span {font-size: 9px;height: 40px;line-height: normal;}
.past-right{padding: 15px;}
.past-trend{gap:10px;}
.home-left{width: 90%;height: 100%;}
.home-left img{height: 100%;max-width: 100%;width: 100%;}
.home-right{width: 100%;}
.home-right h1 br {display: none;}
.home-inner h1 {font-size: 36px;line-height: 45px;}
.home-inner p{font-size: 15px;line-height: 20px;margin: 15px 0px;}
.home-cont{align-items:baseline;padding-top: 50px;}main.content::before{background-position: 53% bottom;}
footer {justify-content: space-between !important;}
.rightbar{gap:50px;}
.resultCont {padding: 20px 40px 20px 40px;}
}
@media only screen and (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
.home-inner {margin: 0px 40px;}
.home-inner h1 {font-size: 36px;line-height: 42px;}
.home-inner p{font-size: 14px;line-height: 20px;margin: 15px 0px;}
.startBtn {line-height: 30px;padding: 0 20px;border-radius: 5px;}
.resultCont {padding: 20px 40px 20px 40px;}
}
@media only screen and (min-width: 1024px) and (max-width: 1366px) and (orientation: landscape) {
.home-inner h1 {font-size: 36px;line-height: 42px;}
.home-inner p{font-size: 14px;line-height: 20px;margin: 15px 0px;}
.startBtn {line-height: 30px;padding: 0 20px;border-radius: 5px;}
}
@media only screen and (min-width: 1024px) and (max-width: 1366px) and (orientation: portrait) {
.home-inner h1 {font-size: 40px;line-height: 45px;}
}
@media only screen and (min-width: 1024px) and (max-width: 1366px) and (orientation: landscape) {
.home-cont{align-items:center;padding: 0;}
}
@media(max-width:767px){
header {padding: 15px;}
.login-wrap {display: none;}
.home-inner {margin: 0px 20px;gap: 20px;}
.home-inner h1 {font-size: 22px;line-height: 28px;}
.home-inner p {font-size: 14px;margin: 10px 0px 15px;}
footer {flex-wrap: wrap;padding: 15px;justify-content: center !important;gap: 5px;}
main.content {height: calc(100vh - 68px - 99px);margin-top: 68px;}
footer p {font-size: 12px;}
a.logoWrap {width: 140px;}
header button {font-size: 12px;height: 32px;line-height: normal;}
main.content::before{height:92%;}
.startBtn{font-size: 12px;line-height: 32px;}
.home-cont {padding-top: 0;align-items: center;}
.login-wrap {height: calc(100vh - 80px);}
.loginBox {width: 95%;padding: 35px 20px;}
.loginLogo img {width: 180px;}
.loginBox p {font-size: 14px;line-height: 18px;padding-top: 15px;}
.phoneBtn {font-size: 16px;line-height: 22.56px;height: 35px;margin-top: 20px;}
.googleBtn{font-size: 16px;line-height: 22.56px;height: 35px;}
.contactBtn {font-size: 18px;line-height:20.56px;}   
a.googleBtn img {width: 20px;height: 20px;}
.rotate-device-message{display: block;}
header{display: none !important;}
footer{display: none !important;}
main.content{display: none;}
}
@media screen and (max-width: 1180px) and (min-width: 820px) and (orientation: landscape) {
.rightbar{gap:50px;}
.resultCont {padding: 20px 40px 20px 40px;}
}
@media screen and (max-width: 992px) and (orientation: landscape){
.home-inner{flex-wrap: nowrap;}
main.content {height: calc(100vh - 62px - 99px);margin-top: 62px;}
.login-wrap {display: block;}
footer,header{justify-content: space-between !important;padding: 10px 15px;}
main.content {height: calc(100vh - 44.45px - 40px);margin-top: 44.45px;}
.home-left {width: 100%;height: 150px;}
.home-inner p {font-size: 11.5px;margin: 10px 0px 15px;line-height: normal;}
footer ul li a svg {width: 15px;height: 15px;}
.home-cont {padding-top: 10px;}
.startBtn{padding: 0px 10px;}
login-wrap {height: calc(100vh - 44px);}
.login-wrap {height: calc(100vh - 44px);}
.login-inner{align-items: flex-start;padding-top: 20px;}
.loginBox {width: 60%;padding: 12px 20px;}
.phoneBtn{margin-top: 10px;}
.loginBox p {padding-top: 10px;font-size: 12px;line-height: 17px;}
.contactBtn {font-size: 16px;line-height: 15.56px;}
.googleBtn,.phoneBtn {font-size: 14px;line-height: 18.56px;height: 30px;}
a.googleBtn img {width: 15px;height: 15px;}
.googleBtn {margin-bottom: 10px;gap: 10px;margin-top: 10px;}
.keyboard{padding:0px 20px;}
.question-left input {height: 40px;width: 40px;border-radius: 4px;}
button.number_errors {height: 32px;font-size: 12px;display: flex;align-items: center;font-weight: 500;}
.key {width: 100%;height: 35px;font-size: 16px;}
.rightbar{gap:20px;}
.number_errors{right:15px !important;}
.resultCont {padding: 20px;}
.resultBox h2 {font-size: 22px;margin-bottom: 10px;}
.past-right p{font-size: 18px;margin-bottom:10px;}
.past-left p {margin-bottom: 10px;font-size: 18px;}
.past-right ul li span{line-height: normal;}
.ResultSocialBtnWrap a{padding: 10px !important;}
.ResultSocialBtnWrap a img{width: 10px;height: 12px;}
.numbergraph{height: 30px;font-size: 14px;}
.rotate-device-message{display:none;}
header{display: flex !important;}
footer{display: flex !important;}
main.content{display: block;}
.home-inner h1 {font-size: 24px;line-height: 28px;}
.home-cont {display: flex;align-items: center;}
a.logoWrap {width: 170px;}
header button{height: 32px;line-height: normal;font-size: 12px;}
button.startBtn svg {width: 15px;}
}