/*===============================================HEADER STYLES STARTs=============================================================*/ /*.flx-justify-start:hover{ cursor: pointer; }*/ header .dashboard-info-row { display: flex; justify-content: center; } header .dashboard-info-row .dashboard-info-box_ { cursor: pointer; margin-right: 0.3vw; display: flex; justify-content: flex-start; align-items: center; border: solid 1px rgba(62, 123, 196, 0.6); padding: 4px;} header .dashboard-info-row .dashboard-info-box_:last-child { margin-right: 0%; } header .dashboard-info-row .dashboard-info-box_ span.ttile-desc { color: #3e7bc4; } header .dashboard-info-row .dashboard-info-box_ .paid-count { margin-left: 2px; } header .dashboard-info-row .dashboard-info-box_:hover { } header .dashboard-info-row .dashboard-info-box_:hover span.ttile-desc { } header .dashboard-info-row .dashboard-info-box_:hover .paid-count { } @media only screen and (max-width: 1400px) { header .dashboard-info-row { flex-wrap: wrap; } } header ul.nav li.watchvideo-in-topnav { } header ul.nav li.watchvideo-in-topnav a.watch-video-bar {position: relative;top: auto;left: auto;border: solid 1px #afd240 !important;margin-left: 7px;right: auto;width: auto;height: 36px;max-width: 1000px;display: flex;justify-items: flex-start;align-items: center;padding: .5rem 1rem !important;font-size: 14px;background-color: #afd240;border-radius: 2px;} header ul.nav li.watchvideo-in-topnav a.watch-video-bar:hover {border: solid 1px #afd240;background-color: transparent;color: #afd240 !important;} header ul.nav li.watchvideo-in-topnav a.watch-video-bar span.wvb-video-ico_ {position: relative;top: auto;left: auto;margin-right: 7px;width: 21px;height: 21px;padding: 4px;font-size: 7px;text-align: center;} header ul.nav li.watchvideo-in-topnav a.watch-video-bar span.wvb-video-ico_:before {width: 100%;text-align: center;font-size: 7px;line-height: 7px;position: absolute;top: 5px;left: 1px;} header ul.nav li.watchvideo-in-topnav a.watch-video-bar div.wvb-heading {transform: none;width: auto;height: auto;position: relative;left: auto;font-size: 14px;top: auto;} header ul.nav li.watchvideo-in-topnav a.watch-video-bar:hover span.wvb-video-ico_ { border: solid 1px #ec1717; background-color: #fff !important;} header ul.nav li.watchvideo-in-topnav a.watch-video-bar:hover span.wvb-video-ico_:before { top: 6px; color: #ec1717; } header ul.nav li.watchvideo-in-topnav a.watch-video-bar:hover div.wvb-heading { color: #afd240; } /*===============================================HEADER STYLES STARTs=============================================================*/ /*===============================================HOME PAGE STYLES STARTs=============================================================*/ .home-page-container { margin-top: 0px; } .home-page-container .left-form-col { } .home-page-container .right-slider-column { background: url(../images/home-assets/home-right-col-bg.png) no-repeat center center; background-size: 100% 100%;} .home-login-form .cmp-field_ { position: relative; } .home-login-form .cmp-field_ input { padding: 7px 8px; padding-right: 32px; border: solid 1px #aeaeae; } .home-login-form .cmp-field_ input[type="email"] { } .home-login-form .cmp-field_ input[type="password"] { } .home-login-form .cmp-field_ input + span.fa { position: absolute; top: 0px; right: 11px; line-height: 40px; color: #cbcbcb; } .home-login-form .cmp-field_ input + span.fa:before { color: inherit; } .home-login-form button[type="submit"] { } #home-page-carousel { position:relative; max-width: 540px; margin: 0px auto; padding: 32px; background-color: #fff; border-radius: 4px; margin-bottom: 40px;} #home-page-carousel .carousel-inner { border-radius: 4px; } #home-page-carousel .carousel-inner .carousel-item { } #home-page-carousel .carousel-inner .carousel-item .item-count { position: absolute; text-align: center; background-color: transparent; top: 0px; left: 0px; width: 100%; padding-top: 100px; font-size: 100px; color: #cecece; opacity: 0.4; } #home-page-carousel .carousel-inner .carousel-item.active { } #home-page-carousel .carousel-inner .carousel-item img { } #home-page-carousel a.carousel-control-prev { width: 32px; } #home-page-carousel a.carousel-control-prev span.carousel-control-prev-icon { position: relative; min-height: 47px; background-image: none !important;} #home-page-carousel a.carousel-control-prev span.carousel-control-prev-icon:before {content: "\f104";display: inline-block;font: normal normal normal 14px/1 FontAwesome;font-size: inherit;text-rendering: auto;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-size: 42px;color: #242424;} #home-page-carousel a.carousel-control-prev span.prev-control-txt { } #home-page-carousel a.carousel-control-next { width: 32px; } #home-page-carousel a.carousel-control-next span.carousel-control-next-icon { position: relative; min-height: 47px; background-image: none !important; } #home-page-carousel a.carousel-control-next span.carousel-control-next-icon:before {content: "\f105";display: inline-block;font: normal normal normal 14px/1 FontAwesome;font-size: inherit;text-rendering: auto;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-size: 42px;color: #242424;} #home-page-carousel a.carousel-control-next span.next-control-txt { } #home-page-carousel .carousel-indicators { bottom: 7px; } #home-page-carousel .carousel-indicators li { width: 13px; height: 13px; border-radius: 50%; border: 0px; background-color: #ebebeb; margin: 0px 13px; } #home-page-carousel .carousel-indicators li.active { background-color: #ffaf00; } /*===============================================HOME PAGE STYLES ENDs=============================================================*/ /*===============================================WEBSITE FORM STYLES STARTs=============================================================*/ .ssa-form_ { } .ssa-form_ label { margin-bottom: 4px; } .ssa-form_ input { border: solid 1px #3b7ec4; border-radius: 6px; padding: 6px;height: 31px;} .ssa-form_ select { border: solid 1px #3b7ec4; border-radius: 6px; font-size: 14px; padding: 6px; padding: 4.5px 6px; height: 31px; line-height: 30px;} .ssa-form_ textarea { border: solid 1px #3b7ec4; border-radius: 6px; font-size: 14px; padding: 6px;} .ssa-form_ select.custom-select-arrow {border: solid 1px #3b7ec4; border-radius: 6px;font-size: 14px;padding: 6px;padding: 4.5px 6px;height: 31px;line-height: 30px;padding-right: 27px;-webkit-appearance: textfield;-webkit-appearance: unset;padding: 0px;padding-right: 18px;margin-bottom: 7px;padding-left: 4px; position: relative; z-index: 40; background-color: transparent;} .ssa-form_ select.custom-select-arrow + .fa { position: absolute;top: 29px;right: 6px; z-index:20;} .ssa-form_ select.custom-select-arrow[disp=yes] + .fa { display: inline-block !important; z-index:20;} .ssa-form_ select.custom-select-arrow[disp=yes] + .fa { display: inline-block !important; z-index:20;} .ssa-form_ select.custom-select-arrow[disp=yes] + select#number_of_days + .fa { display: inline-block !important; z-index:20;} .ssa-form_ input[type="file"] {height: 35px; padding:2px; } .ssa-form_ .form-control, .ssa-form_ .form-control:focus { background-color: #fff !important; border-color: #3e7bc4;} .ssa-form_ input[disabled], .ssa-form_ select[disabled], .ssa-form_ textarea[disabled] { background-color: rgb(235, 235, 228) !important; } .ssa-drug-form_ .radio-field { /*display: flex; justify-content: flex-end; flex-wrap: wrap;*/ } .ssa-drug-form_ .radio-field .radio-field-option { text-align: right; min-width:100%;} .ssa-drug-form_ .radio-field .radio-field-option label { } .ssa-drug-form_ .radio-field .radio-field-option label input[type="radio"] { float: right; margin-left: 4px; margin-top: 3px;} .ssa-drug-form_ .radio-field .radio-field-option label span { line-height: 1.47em; font-weight: 600;} .flds-qt-ds-rr-ric-pop-pp-pi-aa .field > label { height: 40px; height: 3em; } .ssa-drug-form_ button.drg-cln-adv { padding: 4px 14px; border: solid 1px #999; border-radius: 3px; background-color: #fff; } .ssa-drug-form_ button.patient-message { padding: 4px 14px; border: solid 1px #999; border-radius: 3px; background-color: #fff;} .ssa-drug-form_ button.drg-cln-adv:hover { border: solid 1px #ec1717 !important; } .ssa-drug-form_ button.patient-message:hover { border: solid 1px #9bc90d !important; } .ssa-drug-form_ button.clear-form { padding: 4px 14px; border-radius: 24px; } .ssa-drug-form_ button.submit-form { padding: 6px 14px; border-radius: 24px; } .ssa-drug-form_ { } .ssa-drug-form_ label { text-align: left !important; } .ssa-drug-form_ .flds-rs_sl-rs_prf .fld-rx_sell input { border: 0px !important; } .ssa-drug-form_ .flds-rs_sl-rs_prf .fld-rx_profit input { border: 0px !important; } .ssa-drug-form_ .flds-str-df-br { } .ssa-drug-form_ .flds-str-df-br .fld-brand_ref { } .ssa-drug-form_ .flds-str-df-br .fld-brand_ref label { color: #242424 !important;background-color: transparent;text-align: left !important;justify-content: flex-start;font-weight: 500; } .ssa-drug-form_ .flds-str-df-br .fld-brand_ref input { bordeR: 0px; } .ssa-drug-form_ .fld-brand_ref label { color: #242424 !important;background-color: transparent;text-align: left !important;justify-content: flex-start;font-weight: 500; } .ssa-drug-form_ .fld-brand_ref input { border: 0px !important; } .ssa-drug-form_ .fld-rx_sell label { color: #242424 !important;background-color: transparent;text-align: left !important;justify-content: flex-start;font-weight: 500; } .ssa-drug-form_ .fld-rx_sell input { border: 0px !important; } .ssa-drug-form_ .fld-rx_profit label { color: #242424 !important;background-color: transparent;text-align: left !important;justify-content: flex-start;font-weight: 500; color: #9bc90d !important} .sssa-drug-form_ .fld-rx_profit input { border: 0px !important; } .ssa-drug-form_ .fld-rx-ingr-cost label { color: #ec1717 !important; border: solid 1px #ec1717 !important; background-color: transparent !important; } .ssa-drug-form_ .fld-rx-ingr-cost input { border: solid 1px #ec1717 !important; color: #ec1717 !important; border-top: 0px !important;} .sss-drug-form_ .fld-thrd-party-pay label { color: #242424 !important;border: solid 1px #999 !important; background-color: transparent !important;} .sss-drug-form_ .fld-thrd-party-pay input { border-top: 0px !important; } .ssa-drug-form_ .fld-patient-out-pocket label { color: #242424 !important;border: solid 1px #999 !important; background-color: transparent !important;} .ssa-drug-form_ .fld-patient-out-pocket input { border-top: 0px !important; } .ssa-drug-form_ .flds-qt-ds-rr-ric-3pp-pc-rx_sl-rx_pr label { text-align: center !important; justify-content: center !important; } .modal { } .modal .ssa-form_ { } .modal .ssa-form_ label { margin-bottom: 4px; } .modal .ssa-form_ input:not([type="checkbox"]) { border: solid 1px #3b7ec4; border-radius: 6px; } .modal .ssa-form_ input[type="checkbox"] { border: 0px; } .modal .ssa-form_ select { border: solid 1px #3b7ec4; border-radius: 6px; } .modal .ssa-form_ textarea { border: solid 1px #3b7ec4; border-radius: 6px; } /*===============================================WEBSITE FORM STYLES ENDs=============================================================*/ /*===============================================PRACTICE ADMIN STYLES STARTs=====================================*/ @media (min-width: 992px) { #practice_admin_left_col { max-width: 44%; flex: 0 0 44%; } #enrollmentStatusPatient { min-width: 56%; flex: 0 0 56%; } #enrollshowPrescription { min-width: 56%; flex: 0 0 56%; } .left_col_44p { max-width: 44% !important; flex: 0 0 44% !important; } .right_col_56p { min-width: 56% !important; flex: 0 0 56% !important; } } /*===============================================PRACTICE ADMIN STYLES ENDs=====================================*/ /*===============================================BOOTSTRAP OVERRIDE STYLES STARTs=============================================================*/ .form-control:focus { color: inherit; background-color: inherit; border-color: inherit; outline: 0px !important; box-shadow: none !important; } /*.btn { padding: 0rem .75rem;}*/ .modal-dialog { width: 100%; } .modal-header { background-color: #3b7ec4; color: #fff; padding: 0.3rem 1rem; font-size: 20px; } .modal-footer { border: 0px; padding-top: 0rem; } .modal-header.bg-transparent-force { background-color: transparent !important; border: 0px; } .modal-header button.stick-top-right-circle {position: absolute;color: #3e7bc4;width: 24px;height: 24px;border-radius: 50%;background-color: #fff;line-height: 22px;font-size: 12px;padding: 0px;margin: 0px;border: solid 2px #3e7bc4 !important;top: -8px;right: -8px;text-shadow: none;opacity: 1 !important;} .modal-header button.stick-top-right-circle:hover { background-color: #3e7bc4; color: #fff; } .modal-header button.stick-top-right-circle.bw-hover { color: #fff; background-color: #337bc4; border: solid 2px #fff; } .modal-header button.stick-top-right-circle.bw-hover:hover { border: solid 2px rgba(62, 123, 196, 0.86) !important; background-color: #fff; color: #3e7bc4; } ul.reports-tabs { } ul.reports-tabs li { margin-right: 4px; } ul.reports-tabs li a.nav-link.active { background-color: #3e7bc4; color: #fff; } ul.reports-tabs li a.nav-link { background-color: #fff; color: #3e7bc4; border: solid 1px #cecece; } ul.reports-tabs { } ul.reports-tabs li:hover { } ul.reports-tabs li:hover a.nav-link { color: #fff !important; background-color: #3b72b5; } ul.reports-tabs li:hover a.nav-link.active { color: #fff !important; } ul.question-tabs { } ul.question-tabs li { margin-right: 4px; } ul.question-tabs li a.nav-link.active { background-color: #3e7bc4; color: #fff; } ul.question-tabs li a.nav-link { background-color: #fff; color: #3e7bc4; border: solid 1px #cecece; } ul.question-tabs { } ul.question-tabs li:hover { } ul.question-tabs li:hover a.nav-link { color: #fff !important; background-color: #3b72b5; } ul.question-tabs li:hover a.nav-link.active { color: #fff !important; } .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { color: #fff !important; } /*===============================================BOOTSTRAP OVERRIDE STYLES ENDs=============================================================*/ /*===============================================SELECT2 OVERRIDE STYLES STARTs=============================================================*/ .select2-container { min-width: 100%; } .select2-container--default .select2-selection--single { border-radius: 0px; border: 0px; } .select2-container--open .select2-dropdown--below { margin-left: -1px; margin-right: -1px; box-sizing: content-box; } /*===============================================SELECT2 OVERRIDE STYLES ENDs=============================================================*/ /*===============================================jQuery DATA-TABLE OVERRIDE STYLES ENDs=============================================================*/ table.dataTable thead .sorting, table.dataTable thead .sorting_asc, table.dataTable thead .sorting_desc, table.dataTable thead .sorting_asc_disabled, table.dataTable thead .sorting_desc_disabled { background-position: left 7px !important;background-size: auto 14px;padding: 7px;padding-left: 14px; } /*===============================================jQuery DATA-TABLE OVERRIDE STYLES ENDs=============================================================*/ /*===============================================jQuery WIZARD OVERRIDE STYLES STARTs=============================================================*/ .wizard > .content { margin: 0px; min-height: 22em; background-color: transparent;min-width: 100%;border-radius: 0px;} .wizard > .content > .body { min-width: 100%; max-widtH: 100%;margin: 0px; padding: 0px; overflow-y: auto;padding-right: 7px;overflow-x: hidden;padding-left: 7px;border-radius: 0px !important;} .wizard > .content > .body input { display: block; border: 1px solid #3b7ec4;} .wizard > .actions > ul { min-width: 100%; } .wizard > .actions > ul > li { float: right; } .wizard > .actions > ul > li a { text-transform: uppercase; } .wizard > .actions > ul > li a:hover { color: #242424; } .wizard > .actions > ul > li:first-child { float: left; margin-left: 0px;} .wizard > .actions > ul > li:last-child { margin-right: 0px;} .wizard > .actions > ul > li.disabled { visibility: hidden; } .wizard > .steps { margin-bottom: 14px; } .wizard > .steps > ul { } .wizard > .steps > ul > li {} .wizard > .steps > ul > li a { padding: 2px 6px !important;position: relative;font-size: 13px;line-height: 21px;margin: 0px !important; /* border: solid 2px #fff; */border-right: 0px;border-left: 0px;border-right: 0px;color: #666666 !important; background-color: #e0e0e0 !important;border-radius: 0px;border: solid 2px #fff;border-radius: 5px 30px 30px 5px; border-left: 0px;z-index: 100; padding-right: 1.2vw !important;} .wizard > .steps > ul > li:hover a, .wizard > .steps > ul > li:active a { border-radius: 5px 30px 30px 5px; } .wizard > .steps > ul > li { position: relative; width: auto; } /*.wizard > .steps > ul > li a:after {content: ''; width: 0; height: 0; border-top: 1em solid transparent;border-bottom: 1em solid transparent; border-left: 1em solid;border-color: inehrit;}*/ .wizard > .steps > ul > li:before {content: '';position: absolute;width: 24px;height: 100%;background-color: #e0e0e0;top: 0px;left: -21px;z-index: 1;border-top: solid 2px #fff;border-bottom: solid 2px #fff;} .wizard > .steps > ul > li.current:before { background-color: #afd13f; } .wizard > .steps > ul > li:first-child a { border-left: solid 2px #fff; border-radius: 5px 30px 30px 5px;} .wizard > .steps > ul > li:first-child a:before { display: none; } .wizard > .steps > ul > li:first-child:before { display: none; } .wizard > .steps > ul > li a span.number { float: left; font-size: inherit !important; line-height: inherit !important; margin-right: 0.6vw; } .wizard > .steps > ul > li.current { } .wizard > .steps > ul > li.current a {background-color: #afd13f !important;color: #fff !important;border: solid 2px #fff;border-radius: 5px 30px 30px 5px; border-left: 0px;} .wizard > .steps > ul > li.current:first-child a { border-left: solid 2px !important; } /*===============================================jQuery WIZARD OVERRIDE STYLES STARTs=============================================================*/ .blink-icon { -moz-animation: blink normal 2s infinite ease-in-out; /* Firefox */ -webkit-animation: blink normal 2s infinite ease-in-out; /* Webkit */ -ms-animation: blink normal 2s infinite ease-in-out; /* IE */ animation: blink normal 2s infinite ease-in-out; /* Opera and prob css3 final iteration */ } .blink-icon-fast { -moz-animation: blink normal 1s infinite ease-in-out; /* Firefox */ -webkit-animation: blink normal 1s infinite ease-in-out; /* Webkit */ -ms-animation: blink normal 1s infinite ease-in-out; /* IE */ animation: blink normal 1s infinite ease-in-out; /* Opera and prob css3 final iteration */ } @-moz-keyframes blink { 0% { opacity:1; } 50% { opacity:0; } 100% { opacity:1; } } @-webkit-keyframes blink { 0% { opacity:1; } 50% { opacity:0; } 100% { opacity:1; } } /* IE */ @-ms-keyframes blink { 0% { opacity:1; } 50% { opacity:0; } 100% { opacity:1; } } /* Opera and prob css3 final iteration */ @keyframes blink { 0% { opacity:1; } 50% { opacity:0; } 100% { opacity:1; } } /*===============================================jQuery WIZARD OVERRIDE STYLES ENDs=============================================================*/ /*================================================BOOTSTRAP TOOLTIP OVERRIDES STYLES STARTs================================================================*/ .bs-tooltip-top { background-color: #f3d1d0; padding: 6px; border-radius: 11px; /*max-width: 162px;*/ width: auto; box-shadow: 0px 1px 7px 1px #cecece; border: solid 1px #242424; text-align: left; } .bs-tooltip-top .tooltip-inner {background-color: transparent;padding: 0px;} /*================================================BOOTSTRAP TOOLTIP OVERRIDES STYLES ENDs================================================================*/ a[data-target="#profit-check-Modal"]:focus { color: #fff !important; } a[data-target="#profit-check-Modal"]:hover { color: #242424 !important; } header .right-col-header a.profit-check-modal-link { border: solid 1px #013b78 !important; background-color: #013b78; color: #fff; box-sizing: border-box; max-height: 36px; font-weight: 600 !important; } header .right-col-header a.profit-check-modal-link:hover { color: #013b78; background-color: #fff; } #profit-check-Modal .modal-content { background-color: transparent; border: 0px !important; } #alert-msg { margin-right: 17px; box-shadow: 1px 1px 13px 4px rgba(0,0,0,0.4); border: solid 2px #fff; } #alert-msg .right-red-arrow-border-white:after, #alert-msg .right-red-arrow-border-white:before { content: ''; display: block; position: absolute; left: 100%; width: 0px; height: 0px; border-style: solid;} #alert-msg .right-red-arrow-border-white:after { top: 13px; border-color: transparent transparent transparent #ec1717; border-width: 6px;} #alert-msg .right-red-arrow-border-white:before {top: 10px;border-color: transparent transparent transparent #fff;border-width: 9px;} #alert-msg button.close-button-top-left {position: absolute;color: #3e7bc4;width: 24px;height: 24px;border-radius: 50%;background-color: #fff;line-height: 22px;font-size: 12px;padding: 0px;margin: 0px;border: solid 2px #3e7bc4 !important;top: -9px;left: -9px;text-shadow: none;opacity: 1 !important;} #alert-msg button.close-button-top-left:before { content: '\2716'; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; line-height: 21px; font-size: inherit; } #alert-msg button.close-button-top-left:hover { background-color: #3e7bc4; color: #fff; border: solid 2px #3e7bc4 !important;} .loader { position: fixed; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; background-color: rgba(32,4,4,0.6); } .loader .sk-folding-cube { margin: 20px auto; width: 40px; height: 40px; position: relative; -webkit-transform: rotateZ(45deg); transform: rotateZ(45deg); } .loader .sk-folding-cube .sk-cube { float: left; width: 50%; height: 50%; position: relative; -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .loader .sk-folding-cube .sk-cube:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #9bc90d; -webkit-animation: sk-foldCubeAngle 2.4s infinite linear both; animation: sk-foldCubeAngle 2.4s infinite linear both; -webkit-transform-origin: 100% 100%; -ms-transform-origin: 100% 100%; transform-origin: 100% 100%; } .loader .sk-folding-cube .sk-cube2 { -webkit-transform: scale(1.1) rotateZ(90deg); transform: scale(1.1) rotateZ(90deg); } .loader .sk-folding-cube .sk-cube3 { -webkit-transform: scale(1.1) rotateZ(180deg); transform: scale(1.1) rotateZ(180deg); } .loader .sk-folding-cube .sk-cube4 { -webkit-transform: scale(1.1) rotateZ(270deg); transform: scale(1.1) rotateZ(270deg); } .loader .sk-folding-cube .sk-cube2:before { -webkit-animation-delay: 0.3s; animation-delay: 0.3s; } .loader .sk-folding-cube .sk-cube3:before { -webkit-animation-delay: 0.6s; animation-delay: 0.6s; } .loader .sk-folding-cube .sk-cube4:before { -webkit-animation-delay: 0.9s; animation-delay: 0.9s; } @-webkit-keyframes sk-foldCubeAngle { 0%, 10% { -webkit-transform: perspective(140px) rotateX(-180deg); transform: perspective(140px) rotateX(-180deg); opacity: 0; } 25%, 75% { -webkit-transform: perspective(140px) rotateX(0deg); transform: perspective(140px) rotateX(0deg); opacity: 1; } 90%, 100% { -webkit-transform: perspective(140px) rotateY(180deg); transform: perspective(140px) rotateY(180deg); opacity: 0; } } @keyframes sk-foldCubeAngle { 0%, 10% { -webkit-transform: perspective(140px) rotateX(-180deg); transform: perspective(140px) rotateX(-180deg); opacity: 0; } 25%, 75% { -webkit-transform: perspective(140px) rotateX(0deg); transform: perspective(140px) rotateX(0deg); opacity: 1; } 90%, 100% { -webkit-transform: perspective(140px) rotateY(180deg); transform: perspective(140px) rotateY(180deg); opacity: 0; } }