UNPKG

coronaindia

Version:

COVID19 India Tracker, predictive analytics and research. Built by engineers, data scientists, AI and medical professionals.

709 lines (575 loc) 30 kB
html { font-size: 14px; font-family: 'averta-regularuploaded_file'; } @include media-breakpoint-up(sm) { html { font-size: 1.2rem; } } @include media-breakpoint-up(md) { html { font-size: 1.4rem; } } @include media-breakpoint-up(lg) { html { font-size: 1.6rem; } } body{ /* background: #eef2f3; background: -webkit-linear-gradient(to right, #eef2f3); background: linear-gradient(to right, #eef2f3); */ } body2 { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; } body2:before { content: ""; position: absolute; background: linear-gradient(to right top, #fdfdfd, #ecf1ff, #ecf1ff ); background-size: cover; z-index: -1; height: 20%; width: 20%; transform: scale(5); transform-origin: top left; filter: blur(2px); } @media screen and (max-width: 460px) { body { font-size: 3vw; } } th, td, a, p, label, button, span{ font-family: 'averta-regularuploaded_file' ; } i { font-family: 'averta-semibolduploaded_file' ; } /*-------------------------------------Custom HTML Ends------------------ */ /*-------------------------------------Custom Bootstrap------------------ */ container-fluid{ background-color: #F3FBFF; color: #F2F9FF; } .col-point5 { max-width: 4.166% ! important ; flex: 0 0 4.166% ! important; } .col-1-5 { max-width: 12.5% ! important ; flex: 0 0 12.5% ! important; } .col-2-5 { max-width: 20.83333% ! important ; flex: 0 0 20.83333% ! important; } .col-3-5 { max-width: 29.16667% ! important ; flex: 0 0 29.16667% ! important; } .col-4-5 { max-width: 37.5% ! important ; flex: 0 0 37.5% ! important; } .col-5-5 { max-width: 45.83333% ! important ; flex: 0 0 45.83333% ! important; } .col-6-5 { max-width: 54.16667% ! important ; flex: 0 0 54.16667% ! important; } .col-7-5 { max-width: 62.5% ! important ; flex: 0 0 62.5% ! important; } .col-8-5 { max-width: 70.83333% ! important ; flex: 0 0 70.83333% ! important; } .col-9-5 { max-width: 79.16667% ! important ; flex: 0 0 79.16667% ! important; } .col-10-5 { max-width: 87.5% ! important ; flex: 0 0 87.5% ! important; } .col-11-5 { max-width: 95.8333% ! important ; flex: 0 0 95.8333% ! important; } @media (min-width: 576px) { .col-sm-point5 { max-width: 4.166% ! important ; flex: 0 0 4.166% ! important; } .col-sm-1-5 { max-width: 12.5% ! important ; flex: 0 0 12.5% ! important; } .col-sm-2-5 { max-width: 20.83333% ! important ; flex: 0 0 20.83333% ! important; } .col-sm-3-5 { max-width: 29.16667% ! important ; flex: 0 0 29.16667% ! important; } .col-sm-4-5 { max-width: 37.5% ! important ; flex: 0 0 37.5% ! important; } .col-sm-5-5 { max-width: 45.83333% ! important ; flex: 0 0 45.83333% ! important; } .col-sm-6-5 { max-width: 54.16667% ! important ; flex: 0 0 54.16667% ! important; } .col-sm-7-5 { max-width: 62.5% ! important ; flex: 0 0 62.5% ! important; } .col-sm-8-5 { max-width: 70.83333% ! important ; flex: 0 0 70.83333% ! important; } .col-sm-9-5 { max-width: 79.16667% ! important ; flex: 0 0 79.16667% ! important; } .col-sm-10-5 { max-width: 87.5% ! important ; flex: 0 0 87.5% ! important; } .col-sm-11-5 { max-width: 95.8333% ! important ; flex: 0 0 95.8333% ! important; } } @media (min-width: 720px) { .col-md-point5 { max-width: 4.166% ! important; flex: 0 0 4.166% ! important; } .col-md-1-5 { max-width: 12.5% ! important; flex: 0 0 12.5% ! important; } .col-md-2-5 { max-width: 20.83333% ! important ; flex: 0 0 20.83333% ! important; } .col-md-3-5 { max-width: 29.16667% ! important ; flex: 0 0 29.16667% ! important; } .col-md-4-5 { max-width: 37.5% ! important ; flex: 0 0 37.5% ! important; } .col-md-5-5 { max-width: 45.83333% ! important ; flex: 0 0 45.83333% ! important; } .col-md-6-5 { max-width: 54.16667% ! important ; flex: 0 0 54.16667% ! important; } .col-md-7-5 { max-width: 62.5% ! important ; flex: 0 0 62.5% ! important; } .col-md-8-5 { max-width: 70.83333% ! important ; flex: 0 0 70.83333% ! important; } .col-md-9-5 { max-width: 79.16667% ! important ; flex: 0 0 79.16667% ! important; } .col-md-10-5 { max-width: 87.5% ! important ; flex: 0 0 87.5% ! important; } .col-md-11-5 { max-width: 95.8333% ! important; flex: 0 0 95.8333% ! important; } } @media (min-width: 992px) { .col-lg-point5 { max-width: 4.166% ! important; flex: 0 0 4.166% ! important; } .col-lg-1-5 { max-width: 12.5% ! important; flex: 0 0 12.5% ! important; } .col-lg-2-5 { max-width: 20.83333% ! important ; flex: 0 0 20.83333% ! important; } .col-lg-3-5 { max-width: 29.16667% ! important ; flex: 0 0 29.16667% ! important; } .col-lg-4-5 { max-width: 37.5% ! important ; flex: 0 0 37.5% ! important; } .col-lg-5-5 { max-width: 45.83333% ! important ; flex: 0 0 45.83333% ! important; } .col-lg-6-5 { max-width: 54.16667% ! important ; flex: 0 0 54.16667% ! important; } .col-lg-7-5 { max-width: 62.5% ! important ; flex: 0 0 62.5% ! important; } .col-lg-8-5 { max-width: 70.83333% ! important ; flex: 0 0 70.83333% ! important; } .col-lg-9-5 { max-width: 79.16667% ! important ; flex: 0 0 79.16667% ! important; } .col-lg-10-5 { max-width: 87.5% ! important ; flex: 0 0 87.5% ! important; } .col-lg-11-5 { max-width: 95.8333% ! important; flex: 0 0 95.8333% ! important; } } .ml-point5, .mx-point5 { margin-left: .13rem!important; } .mr-point5, .mx-point5 { margin-right: .13rem!important; } .ml-md-point5, .mx-md-point5 { margin-left: .13rem!important; } .mr-md-point5, .mx-md-point5 { margin-right: .13rem!important; } @media screen and (min-width: 767px) { .border-md{ border-left: 2px solid black; border-top: 2px solid black; border-right: 2px solid black; border-bottom: 2px solid black; } .border-left-md{ border-left: 2px solid black; } .border-top-md{ border-top: 2px solid black; } .border-right-md{ border-right: 2px solid black; } .border-bottom-md{ border-bottom: 2px solid black; } } @media screen and (min-width: 992px) { .border-lg{ border-left: 2px solid black; border-top: 2px solid black; border-right: 2px solid black; border-bottom: 2px solid black; } .border-left-lg{ border-left: 2px solid black; } .border-top-lg{ border-top: 2px solid black; } .border-right-lg{ border-right: 2px solid black; } .border-bottom-lg{ border-bottom: 2px solid black; } } @media screen and (max-width: 767px) { .border-xs{ border-left: 2px solid black; border-top: 2px solid black; border-right: 2px solid black; border-bottom: 2px solid black; } .border-left-xs{ border-left: 2px solid black; } .border-top-xs{ border-top: 2px solid black; } .border-right-xs{ border-right: 2px solid black; } .border-bottom-xs{ border-bottom: 2px solid black; } } .btn-primary { color: #fff; background-color: #13A1FE; border-color: #13A1FE; border-radius: 40px; transition: all 0.3s ease 0s; box-shadow: -0.1px 1px 20px -7px #13A1FE !important; } .btn-secondary { color: #fff; background-color: #6c757d; border-color: #6c757d; border-radius: 40px; transition: all 0.3s ease 0s; box-shadow: -0.1px 1px 20px -7px #6c757d !important; } .btn-success { color: #fff; background-color: #28a745; border-color: #28a745; border-radius: 40px; transition: all 0.3s ease 0s; box-shadow: -0.1px 1px 20px -7px #28a745 !important; } .btn-info { color: #fff; background-color: #17a2b8; border-color: #17a2b8; border-radius: 40px; transition: all 0.3s ease 0s; box-shadow: -0.1px 1px 20px -7px #17a2b8 !important; } .btn-warning { color: #fff; background-color: #ffc107; border-color: #ffc107; border-radius: 40px; transition: all 0.3s ease 0s; box-shadow: -0.1px 1px 20px -7px #ffc107 !important; } .btn-danger { color: #fff; background-color: #dc3545; border-color: #dc3545; border-radius: 40px; transition: all 0.3s ease 0s; box-shadow: -0.1px 1px 20px -7px #dc3545 !important; } .btn-light { color: #212529; background-color: #f8f9fa; border-color: #f8f9fa; border-radius: 40px; transition: all 0.3s ease 0s; box-shadow: -0.1px 1px 20px -7px #f8f9fa !important; } /*.btn-dark { color: #fff; background-color: #343a40; border-color: #343a40; border-radius: 40px; transition: all 0.3s ease 0s; box-shadow: -0.1px 1px 20px -7px #343a40 !important; } */ .btn-primary:hover { color: #fff; background-color: #0069d9; border-color: #0062cc; } .btn-secondary:hover { color: #fff; background-color: #5a6268; border-color: #545b62; } .btn-success:hover { color: #fff; background-color: #218838; border-color: #1e7e34; } .btn-info:hover { color: #fff; background-color: #138496; border-color: #117a8b; } .btn-warning:hover { color: #212529; background-color: #e0a800; border-color: #d39e00; } .btn-danger:hover { color: #fff; background-color: #c82333; border-color: #bd2130; } .btn-light:hover { color: #212529; background-color: #e2e6ea; border-color: #dae0e5; } /*.btn-dark:hover { color: #fff; background-color: #23272b; border-color: #1d2124; }*/ .text-primary{ color: #13A1FE !important; } #inputFilterType{ font-weight: 600 !important; } .input-group-text, #inputFilterType:enabled { background: #E0EAFC !important; /* fallback for old browsers */ background: -webkit-linear-gradient(to right, #CFDEF3, #E0EAFC) !important; /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to right, #CFDEF3, #E0EAFC) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ font-weight: 600 !important; } .btn-circle { width: 45px; height: 45px; line-height: 45px; text-align: center; padding: 0; border-radius: 50%; } .btn-circle i { position: relative; top: -1px; } .btn-circle-sm { width: 35px; height: 35px; line-height: 35px; font-size: 1rem; } .btn-circle-lg { width: 55px; height: 55px; line-height: 55px; font-size: 1.1rem; } .btn-circle-xl { width: 70px; height: 70px; line-height: 70px; font-size: 1.3rem; } /*-------------------------------------Custom Bootstrap Ends------------------ */ /*--------------------------datatable css starts------------------------------- */ .even{ background-color: #FFFFFF !important; } .odd{ background-color: #F2F5F9 !important; } .even th, .odd th, .even td, .odd td { vertical-align: middle !important; } table.dataTable tbody tr.selected, table.dataTable tbody th.selected, table.dataTable tbody td.selected { color: black !important; } table.dataTable tbody>tr.selected, table.dataTable tbody>tr>.selected { background-color: #bfcfdccc !important; } table.dataTable.dtr-inline.collapsed>tbody>tr[role="row"]>td:first-child:before, table.dataTable.dtr-inline.collapsed>tbody>tr[role="row"]>th:first-child:before { /* top: 7px; */ } .fa-chevron-circle-up , .fa-chevron-circle-down{ font-size: 15.5px !important; } .fa-chevron-circle-down:hover{ text-shadow: -1px 2px 11px #00ff18b8; } .fa-chevron-circle-up:hover{ text-shadow: -1px 2px 11px #dc3545; } @media screen and (max-width: 575px) { li.paginate_button.previous { display: inline; } li.paginate_button.next { display: inline; } li.paginate_button { display: none; } } .expandCollapseTh{ padding-right: 0px !important; } /*--------------------------datatable css ends------------------------------- */ /*----------------------------------------Custom CSS Starts------------------ */ .noUserSelect{ -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .vertical-text { writing-mode: vertical-rl !important; text-orientation: mixed; } ExtraCSS{ background: url(media/images/linPoints.png); filter: blur(8px); -webkit-filter: blur(8px); z-index: -1; cursor: pointer; transition-duration: 0.4s; height: 40px; } /* Remove input type number up and down arrow input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; -moz-appearance: none; appearance: none; margin: 0; }*/ /* Remove controls from Firefox input[type=number] { -moz-appearance: textfield; } */ /* Re-applies the controls on :hover and :focus input[type="number"]:hover, input[type="number"]:focus { -moz-appearance: number-input; } */ /* @media screen and (max-width: 460px) { .nav-tabs .nav-link { font-size: 3vw; } */ /*----------------------------------------Custom CSS Ends------------------ */ /*----------------------------------------Color gradients------------------ */ .CrystalClear { background: #159957; background: -webkit-linear-gradient(to right, #155799, #159957); background: linear-gradient(to right, #155799, #159957); } .CoolSky { background: #2980B9; background: -webkit-linear-gradient(to right, #FFFFFF, #6DD5FA, #2980B9); background: linear-gradient(to right, #FFFFFF, #6DD5FA, #2980B9); } .WitchingHour { background: #c31432; background: -webkit-linear-gradient(to right, #240b36, #c31432); background: linear-gradient(to right, #240b36, #c31432); } .RainbowBlue { background: #00F260; background: -webkit-linear-gradient(to right, #0575E6, #00F260); background: linear-gradient(to right, #0575E6, #00F260); } .martini{ background: #FDFC47; background: -webkit-linear-gradient(to right, #24FE41, #FDFC47); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to right, #24FE41, #FDFC47); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ } .instgram{ background: #833ab4; background: -webkit-linear-gradient(to right, #fcb045, #fd1d1d, #833ab4); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to right, #fcb045, #fd1d1d, #833ab4); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ } .velvetsun{ background: #e1eec3; background: -webkit-linear-gradient(to left, #f05053, #e1eec3); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to left, #f05053, #e1eec3); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ } /* ---------------------------Color gradients Ends---------------------------- */ /* ---------------------------Animations Starts---------------------------- */ .slideRemove-anime { -webkit-animation: animation 1800ms linear infinite both; animation: slideRemove-animation 1800ms linear infinite both; } /* Generated with Bounce.js. Edit at http://bouncejs.com#%7Bl%3A1%2Cs%3A%5B%7BT%3A%22t%22%2Ce%3A%22s%22%2Cd%3A700%2CD%3A500%2Cf%3A%7Bx%3A0%2Cy%3A0%7D%2Ct%3A%7Bx%3A100%2Cy%3A0%7D%2Cs%3A5%2Cb%3A3%7D%2C%7BT%3A%22t%22%2Ce%3A%22b%22%2Cd%3A700%2CD%3A1100%2Cf%3A%7Bx%3A0%2Cy%3A0%7D%2Ct%3A%7Bx%3A1000%2Cy%3A0%7D%2Cs%3A5%2Cb%3A0%7D%5D%7D */ @-webkit-keyframes slideRemove-animation { 0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 27.68% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 27.78% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 28.83% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 16.002, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 16.002, 0, 0, 1); } 29.88% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 19.668, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 19.668, 0, 0, 1); } 33.15% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 9.467, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 9.467, 0, 0, 1); } 36.38% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 2.117, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 2.117, 0, 0, 1); } 42.88% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.073, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.073, 0, 0, 1); } 55.84% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 61.01% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 61.11% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 62.36% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 416.905, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 416.905, 0, 0, 1); } 63.56% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 655.056, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 655.056, 0, 0, 1); } 64.77% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 796.43, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 796.43, 0, 0, 1); } 65.98% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 880.153, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 880.153, 0, 0, 1); } 66.67% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 911.557, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 911.557, 0, 0, 1); } 68.43% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 959.478, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 959.478, 0, 0, 1); } 70.84% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 986.206, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 986.206, 0, 0, 1); } 80.58% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 999.842, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 999.842, 0, 0, 1); } 100% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 1000, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 1000, 0, 0, 1); } } @keyframes slideRemove-animation { 0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 27.68% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 27.78% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 28.83% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 16.002, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 16.002, 0, 0, 1); } 29.88% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 19.668, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 19.668, 0, 0, 1); } 33.15% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 9.467, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 9.467, 0, 0, 1); } 36.38% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 2.117, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 2.117, 0, 0, 1); } 42.88% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.073, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.073, 0, 0, 1); } 55.84% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 61.01% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 61.11% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 62.36% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 416.905, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 416.905, 0, 0, 1); } 63.56% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 655.056, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 655.056, 0, 0, 1); } 64.77% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 796.43, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 796.43, 0, 0, 1); } 65.98% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 880.153, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 880.153, 0, 0, 1); } 66.67% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 911.557, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 911.557, 0, 0, 1); } 68.43% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 959.478, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 959.478, 0, 0, 1); } 70.84% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 986.206, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 986.206, 0, 0, 1); } 80.58% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 999.842, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 999.842, 0, 0, 1); } 100% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 1000, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 1000, 0, 0, 1); } } .movingDown-anime { -webkit-animation: movingDownAnimation 500ms linear infinite both; animation: movingDownAnimation 500ms linear infinite both; } /* Generated with Bounce.js. Edit at http://bouncejs.com#%7Bl%3A1%2Cs%3A%5B%7BT%3A%22t%22%2Ce%3A%22b%22%2Cd%3A500%2CD%3A0%2Cf%3A%7Bx%3A0%2Cy%3A0%7D%2Ct%3A%7Bx%3A0%2Cy%3A100%7D%2Cs%3A5%2Cb%3A0%7D%5D%7D */ @-webkit-keyframes movingDownAnimation { 0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 3.2% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 41.69, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 41.69, 0, 1); } 6.31% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 65.506, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 65.506, 0, 1); } 9.41% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 79.643, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 79.643, 0, 1); } 12.51% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 88.015, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 88.015, 0, 1); } 18.82% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 95.948, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 95.948, 0, 1); } 25.03% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 98.621, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 98.621, 0, 1); } 50.05% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 99.984, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 99.984, 0, 1); } 100% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 100, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 100, 0, 1); } } @keyframes movingDownAnimation { 0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 3.2% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 41.69, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 41.69, 0, 1); } 6.31% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 65.506, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 65.506, 0, 1); } 9.41% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 79.643, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 79.643, 0, 1); } 12.51% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 88.015, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 88.015, 0, 1); } 18.82% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 95.948, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 95.948, 0, 1); } 25.03% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 98.621, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 98.621, 0, 1); } 50.05% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 99.984, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 99.984, 0, 1); } 100% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 100, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 100, 0, 1); } } .movingUp-anime { -webkit-animation: movingUpAnimation 800ms linear infinite both; animation: movingUpAnimation 800ms linear infinite both; } /* Generated with Bounce.js. Edit at http://bouncejs.com#%7Bl%3A1%2Cs%3A%5B%7BT%3A%22t%22%2Ce%3A%22b%22%2Cd%3A600%2CD%3A200%2Cf%3A%7Bx%3A0%2Cy%3A100%7D%2Ct%3A%7Bx%3A0%2Cy%3A0%7D%2Cs%3A5%2Cb%3A0%7D%5D%7D */ @-webkit-keyframes movingUpAnimation { 0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 24.9% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 25% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 100, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 100, 0, 1); } 27.4% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 58.31, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 58.31, 0, 1); } 29.73% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 34.494, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 34.494, 0, 1); } 32.06% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 20.357, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 20.357, 0, 1); } 34.38% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 11.985, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 11.985, 0, 1); } 39.11% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 4.052, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 4.052, 0, 1); } 43.77% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 1.379, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 1.379, 0, 1); } 62.54% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0.016, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0.016, 0, 1); } 100% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } } @keyframes movingUpAnimation { 0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 24.9% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 25% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 100, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 100, 0, 1); } 27.4% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 58.31, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 58.31, 0, 1); } 29.73% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 34.494, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 34.494, 0, 1); } 32.06% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 20.357, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 20.357, 0, 1); } 34.38% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 11.985, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 11.985, 0, 1); } 39.11% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 4.052, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 4.052, 0, 1); } 43.77% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 1.379, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 1.379, 0, 1); } 62.54% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0.016, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0.016, 0, 1); } 100% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } } /* ---------------------------Animations Ends---------------------------- */ #container2ExpandBtn:hover { -webkit-animation: rotationExpandBtn 0.5s linear; } @-webkit-keyframes rotationExpandBtn { from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(180deg); } }