html, body { width: 100%; height: 100% }
body { font-family: 'Roboto', Arial, Helvetica, sans-serif!important; font-weight: 400 !important; font-size: 12px; color: #707070; text-decoration: none; margin: 0px; padding: 0px; background-color: #f9f9f9; }
.toc {border: solid 1px #E2E2E2; background-color:#F7F7F7; padding:10px!important; margin-top:20px!important;}
.toc a{ color:#09F}
.intro-wrap { background-color: #0FC; width: 100%; height: 100% }
#menu { position: fixed; top: 0; left: 0; height: 40px; z-index: 70; width: 100%; padding: 0; margin: 0; }
#section0 { background:url(../images/intro-bg.jpg); background-size:cover; background-color:#35446b!important; }
#section1 { background-image: url(../images/loginbg.jpg); background-repeat: no-repeat; background-position: left -70px; background-color: #35446b!important; }
.dashdiv { display: block; position:absolute; }
.rob1 { background-image:url(images/intro-bot1.png); width:174px; height:119px; left:40%; top:180px }
.rob2 { background-image:url(images/intro-bot2.png); width:119px; height:116px; left:1025px; top:195px }
.rob3 { background-image:url(images/intro-bot3.png); width:108px; height:259px; left:1300px; top:30px }
.rob4 { background-image:url(images/intro-bot4.png); width:212px; height:190px; left:305px; top:377px }
.rob5 { background-image:url(images/intro-bot5.png); width:141px; height:175px; left:150px; top:650px }
.rob6 { background-image:url(images/intro-bot6.png); width:263px; height:206px; left:1100px; top:600px }
* { outline:none; }
a { text-decoration:none!important; }
.login-control { position: relative; padding: 0px 20px 20px 20px; left: 701px; top: 40px; width: 306px; height: 539px; background-image: url(../images/login-supergraphic.png); background-repeat: no-repeat; background-position: 153px 396px; }
.login-control ul { padding:0; margin:0 }
.login-control li { list-style:none; padding:0; margin:0 }
.eye { width:80px; height:40px; background-image:url(../images/eye.gif); position:relative; float:left; top:230px; left:354px; display:block; }
/*---------- Modal Popup Start------------------*/
.modal-header { border-bottom:none!important; padding:5px 10px 0px 10px!important; }
.modal-body { padding: 0 1rem 1rem 1rem!important; }
.pop-title { color:#1a2c5e; font-size:28px; font-weight:500; margin-bottom:15px; }
.form-group { position: relative; }
.form-group + .form-group { margin-top: 30px; }
.form-label { font-size:16px; position: absolute; left: 0; top: 10px; color: #999; background-color: #fff; z-index: 10; transition: font-size 150ms ease-out, -webkit-transform 150ms ease-out; transition: transform 150ms ease-out, font-size 150ms ease-out; transition: transform 150ms ease-out, font-size 150ms ease-out, -webkit-transform 150ms ease-out; }
.focused .form-label { -webkit-transform: translateY(-125%); transform: translateY(-125%); font-size:1em; }
.form-input { position: relative; padding: 12px 0px 10px 0; width: 100%; outline: 0; border: 0; box-shadow: 0 1px 0 0 #e5e5e5; transition: box-shadow 150ms ease-out; }
.form-input:focus { box-shadow: 0 2px 0 0 #26235D; }
.form-input.filled { box-shadow: 0 1px 0 0 #eee; background-image: url(../images/filter-tick.png); background-repeat: no-repeat; background-position: right center; }
.signup-btn { background-color:#ee3064; width:100%; padding: 10px 0; text-align:center; font-size:18px; color:#fff; border:0; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; transition: 0.3s; }
.signup-btn:hover { background-color:#26235d; }
.modal-content { border:0!important; }
/*---------- Modal Popup End------------------*/

#preloader { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 9999; overflow: hidden; background: #000; }
#preloader:before { content: ""; position: fixed; top: calc(50% - 30px); left: calc(50% - 30px); border: 6px solid #f2f2f2; border-top: 6px solid #e90042; border-radius: 50%; width: 60px; height: 60px; -webkit-animation: animate-preloader 1s linear infinite; animation: animate-preloader 1s linear infinite; }
 @-webkit-keyframes animate-preloader { 0% {
 -webkit-transform: rotate(0deg);
 transform: rotate(0deg);
}
 100% {
 -webkit-transform: rotate(360deg);
 transform: rotate(360deg);
}
}
 @keyframes animate-preloader { 0% {
 -webkit-transform: rotate(0deg);
 transform: rotate(0deg);
}
 100% {
 -webkit-transform: rotate(360deg);
 transform: rotate(360deg);
}
}
.input-box { background-color:#e7eceb; height:40px; font-size:14px; width:100%; border:solid 1px #dce0df; margin-bottom:10px; text-indent:30px; color:#5d5d5e; background-repeat:no-repeat; background-position:left 8px center; }
.log-title { color:#db154e; font-size:28px; font-weight:500; margin-bottom:30px!important; float:left; width:100%; margin-top:-30px; }
.log-title span { color:#1a2c5e}
.user-icon { background-image:url(../images/login-user-icon.png); }
.pass-icon { background-image:url(../images/pass-icon.png); }
.forgot { color:#3c3c3c; font-size:12px; margin-bottom:30px!important; }
.forgot a { color:#3c3c3c }
.forgot span { float:right; color:#3c3c3c; font-size:12px; }
.log-btn { height:40px; padding:0 17px; background-color:#ed1651; color:#fff; font-size:12px; text-align:center; border:0; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; text-transform:uppercase; text-decoration:none; transition: 0.3s; }
.log-btn:hover { background-color:#1a2c5e; }
.notyet-text { margin-top:180px!important; margin-bottom:10px!important; text-align:center; color:#3c3c3c; }
.notyet-text > a { color:#ed1651; text-decoration:none; }
.login-link. {
text-decoration:none;
}
.arrow { background-color:#db154e; width:80px; height:80px; -webkit-border-radius: 120px; -moz-border-radius: 120px; border-radius: 120px; text-align:center; left:50%; bottom:50px; -webkit-box-shadow: 0px 0px 4px 0px #000000; box-shadow: 0px 0px 4px 0px #000000; }
.arrow img { margin-top:30px; }
.bounce { -moz-animation: bounce 2s infinite; -webkit-animation: bounce 2s infinite; animation: bounce 2s infinite; }
 @keyframes bounce {  0%, 20%, 50%, 80%, 100% {
 transform: translateY(0);
}
 40% {
 transform: translateY(-30px);
}
 60% {
 transform: translateY(-15px);
}
}
 @media (max-width: 768px) {
 .notyet-text { margin-top:30px!important; }
.log-title {
margin-top:0;
}
#section0 {
display:none;
}
.eye {
display: none;
}
#section1 {
background-image: url(../images/intro-bg-mobile.jpg);
background-repeat: no-repeat;
background-position: center top;
}
.login-control {
padding:20px;
width:96%;
height:auto;
margin:auto;
background-color:rgba(255, 255, 255, 0.95);

left:0;
top:140px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
}
.login-control ul {
padding:0;
margin:0
}
.login-control li {
list-style:none;
padding:0;
margin:0
}
}
@media (max-width: 1200px) {
}
@media (max-width: 1200px) {
}
@media (max-width: 1920px) {
}
@media (max-width: 1600px) {
}
@media (max-width: 1366px) {
}
@media (max-width: 1280px) {
}
