@font-face { font-family: 'KarbonMedium'; src: url('../../font/Karbon-Medium.eot'); src: url('../../font/Karbon-Medium.eot?#iefix') format('embedded-opentype'), url('../../font/Karbon-Medium.otf') format('opentype'), url('../../font/Karbon-Medium.svg#Karbon-Medium') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'futura_ltregular'; src: url('../../font/futuralt-webfont.eot'); src: url('../../font/futuralt-webfont.eot?#iefix') format('embedded-opentype'), url('../../font/futuralt-webfont.woff') format('woff'), url('../../font/futuralt-webfont.ttf') format('truetype'), url('../../font/futuralt-webfont.svg#futura_ltregular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'HelveticaNeueLTStd-Cn'; src: url('../../font/HelveticaNeueLTStd-Cn.otf') format('opentype'); src: url('../../font/HelveticaNeueLTStd-Cn.eot?#iefix') format('embedded-opentype'), url('../../font/HelveticaNeueLTStd-Cn.ttf') format('truetype'), url('../../font/HelveticaNeueLTStd-Cn.woff') format('woff'), url('../../font/HelveticaNeueLTStd-Cn.svg#HelveticaNeueLTStd-Cn') format('svg'), url('../../font/HelveticaNeueLTStd-Cn.eot'); font-weight: normal; font-style: normal; } @font-face { font-family: 'HelveticaNeueLTStd-Bd'; src: url('../../font/HelveticaNeueLTStd-Bd.otf') format('opentype'); src: url('../../font/HelveticaNeueLTStd-Bd.eot?#iefix') format('embedded-opentype'), url('../../font/HelveticaNeueLTStd-Bd.ttf') format('truetype'), url('../../font/HelveticaNeueLTStd-Bd-Cn.woff') format('woff'), url('../../font/HelveticaNeueLTStd-Bd.svg#HelveticaNeueLTStd-Bd') format('svg'), url('../../font/HelveticaNeueLTStd-Bd.eot'); font-weight: normal; font-style: normal; } @font-face { font-family: 'HelveticaNeueLTStd-Md'; src: url('../../font/HelveticaNeueLTStd-Md.otf') format('opentype'); src: url('../../font/HelveticaNeueLTStd-Md.eot?#iefix') format('embedded-opentype'), url('../../font/HelveticaNeueLTStd-Md.ttf') format('truetype'), url('../../font/HelveticaNeueLTStd-Md.woff') format('woff'), url('../../font/HelveticaNeueLTStd-Md.svg#HelveticaNeueLTStd-Md') format('svg'), url('../../font/HelveticaNeueLTStd-Md.eot'); font-weight: normal; font-style: normal; } small { font-size: 60%; } body { padding: 0; margin: 0; -webkit-text-size-adjust: 100%; } input { outline: 0; } #loader { width: 100%; height: 100%; background: #cccccc url(../../images/controls/loader.gif) no-repeat center; position: fixed; left: 0%; top: 0%; z-index: 9999999999; background-size: 100px; } #volume { display: none !important; } .launchbtn_flash { -webkit-animation: flash4s linear forwards; -moz-animation: flash 4s linear forwards; animation: flash 4s linear forwards; -moz-animation-iteration-count: infinite; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } .page0_wrapper { width: 1024px; height: 469px; overflow: hidden; position: relative; background: url("../images/html_data/page_0_bg.jpg") no-repeat scroll left top transparent; top: 0px; left: 0px; } .glossary_term { cursor: pointer; } #demo { position: absolute; right: 57px; font-size: 19px; bottom: -4px; font-size: 20px; color: #fff; } .toc_head { width: 460px; /*height: 270px;*/ height: 0px; position: absolute; bottom: 112px; right: 0px; z-index: 68; border-top-left-radius: 22px; border-top-right-radius: 22px; overflow: hidden; background-color: rgba(255, 255, 255, 0.95); padding-left: 23px; } .toc_head_top { position: absolute; background: #024c99; top: 0; left: 0; width: 100%; height: 40px; color: #fff; font-size: 20px; padding-left: 30px; line-height: 43px; } .toc_content { width: 100%; margin-top: 45px; color: #000; font-size: 16px; margin-left: 7px; } .toc_content ul li { cursor: pointer; } .toc_close { position: absolute; right: 40px; top: 5px; line-height: 32px; width: 30px; height: 30px; background: #fff; color: #024c99; border-radius: 22px; text-align: center; cursor: pointer; } /* slider imoa*/ section.iMOA { position: absolute; width: 700px; left: 153px; -webkit-font-smoothing: antialiased; font-stretch: normal; font-variant: normal; font-weight: normal; top: 21px; z-index: 5; } #imoa-popup-bg { background-color: rgba(0, 0, 0, 0.8); width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; } /* this is placeholder image you click on to show the popup */ .showPopup { position: relative; width: 740px; left: 269px; top: 23px; height: 458px; background-size: contain; background-repeat: no-repeat; background-image: url("../images/html_data/popup_image.jpg"); } .closeiMOApop { width: 31px; height: 31px; display: block; background: gray; -webkit-border-radius: 50%; border-radius: 50%; position: absolute; right: -13px; top: -12px; } .closeiMOApop:before, .closeiMOApop:after { height: 23px; width: 3px; display: block; position: relative; content: ""; } .closeiMOApop:before { top: 4px; right: -14px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg); } .closeiMOApop:after { left: 14px; bottom: 19px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(45deg); transform: rotate(-45deg); } .closeiMOApop:before, .closeiMOApop:after { background: #fff; } .closeiMOApop:hover, .closeiMOApop:active { background-color: #000; cursor: pointer; } section.iMOA * { -webkit-box-sizing: border-box; box-sizing: border-box; } /******************************************* * the 2 tabs at the top of the video */ section.iMOA nav.tabs { z-index: 10; position: absolute; display: none; top: -1px; } section.iMOA nav.tabs button { position: absolute; border: none; background-color: transparent; width: 143px; height: 48px; } section.iMOA nav.tabs button.diabetic { left: 373px; } section.iMOA nav.tabs button.normal { left: 216px; } section.iMOA nav.tabs button.selected label { color: #333333; } section.iMOA nav.tabs button label { display: block; position: absolute; top: 5px; left: 0px; width: 100%; font-family: 'KarbonMedium'; font-size: 14px; color: white; } section.iMOA.tab_normal nav.tabs button.normal { background-image: url("../images/html_data/btn_background.png"); } section.iMOA.tab_diabetic nav.tabs button.diabetic { background-image: url("../images/html_data/btn_background.png"); } /************************************************* * holds the static background image of the video */ section.iMOA article { width: 701px; height: 0px;/* background-image: url("../images/html_data/background_poster.jpg"); */ } /************************************************* * Initial Start Button */ section.iMOA button.start { position: absolute; border: none; background: url("../images/html_data/75x75_PlayBtn.png") no-repeat; z-index: 200; top: 206px; left: 320px; width: 75px; height: 75px; -webkit-transition: opacity .5s ease-in-out; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); outline: none; opacity: 0; } section.iMOA button.start.visible { opacity: 1; } /********************************************************************** * text / arrow / marker that show up over the slider at certain points */ section.iMOA figcaption { z-index: 10; position: absolute; display: none; } /* * This caption shows up on the sldier when either tab reaches 180+ */ .approximateRenalThreshold { top: 52px; left: 228px; width: 188px; height: 51px; background-image: url("../images/html_data/ptr_approximate-renal-threshold.png"); } /** * This caption shows up on the slider * only on the diabetic tab at 240+ */ .approximateRenalThresholdForDiabetics { top: 49px; left: 344px; width: 194px; height: 53px; background-image: url("../images/html_data/ptr_approximate-renal-threshold-for-diabetics.png"); } /** * The litle arrows on the slider at 180 and 240 */ section.iMOA .arrow { width: 15px; height: 16px; top: -7px; } section.iMOA .arrow.gray { background-image: url("../images/html_data/ptr_arrow-gray.png"); } section.iMOA .arrow.red { background-image: url("../images/html_data/ptr_arrow-red.png"); } section.iMOA .arrow.one-eighty { left: 315px; } section.iMOA .arrow.two-forty { left: 434px; } /** * The little white marker lines on the slider at 180 and 240 */ section.iMOA .marker { top: 34px; width: 1px; height: 11px; background-color: white; } section.iMOA .marker.one-eighty { left: 322px; } section.iMOA .marker.two-forty { left: 441px; } /************************************************** * When swtiching to diabetic tab * this is the invokana text next to dragdrop icon */ section.iMOA .invokana.label { position: absolute; left: 121px; top: 44px; font-family: 'KarbonMedium'; font-size: 26px; color: white; text-shadow: 1px -1px 1px #1F1F1F; opacity: 0; } section.iMOA .invokana.label.visible { -webkit-animation-name: fadeIn; -webkit-animation-duration: 500ms; -webkit-animation-delay: 250ms; -webkit-animation-fill-mode: both; } section.iMOA .invokana.pointer { left: 225px; top: 127px; width: 120px; height: 61px; background-image: url("../images/html_data/ptr_invokana.png"); } /*********************************************************** * Descriptions are the labels with the lines pointing to * certain sections of the video */ section.iMOA .description { z-index: 100; position: absolute; background-color: transparent; } section.iMOA .description div { position: absolute; text-align: center; font-family: 'HelveticaNeueLTStd-Cn'; font-size: 22px; color: #dedede; letter-spacing: .5px; text-shadow: 1px 2px black; top: -14px; } section.iMOA .description hr { position: absolute; height: 1.5px; border: none; background-color: white; } /***************************************** * the following descriptions always show */ section.iMOA .description.glomerulus { top: 301px; left: 45px; } section.iMOA .description.glomerulus div { left: 10px; } section.iMOA .description.glomerulus hr { top: 40px; width: 70px; -webkit-transform: rotate(113deg); -moz-transform: rotate(113deg); transform: rotate(113deg); } section.iMOA .description.glucose { top: 32px; left: 542px; } section.iMOA .description.glucose div { left: 10px; } section.iMOA .description.glucose hr { left: 4px; top: 20px; width: 43px; -webkit-transform: rotate(146deg); -moz-transform: rotate(146deg); transform: rotate(146deg); } section.iMOA .description.SGLT2 { top: 100px; left: 572px; } section.iMOA .description.SGLT2 div { left: -12px; } section.iMOA .description.SGLT2 hr { left: -70px; top: 26px; width: 79px; -webkit-transform: rotate(-25deg); -moz-transform: rotate(-25deg); transform: rotate(-25deg); } /***************************************** * Glucose and Urine only show when: * at 180+ for normal tab * at 240+ for diabetic tab */ section.iMOA figcaption.description.glucoseInUrine { top: 382px; left: 424px; } section.iMOA figcaption.description.glucoseInUrine div { top: -37px; left: 94px; } section.iMOA figcaption.description.glucoseInUrine hr.left { left: -13px; top: -58px; width: 111px; -webkit-transform: rotate(50deg); -moz-transform: rotate(50deg); transform: rotate(50deg); } section.iMOA figcaption.description.glucoseInUrine hr.right { left: 126px; top: -83px; width: 85px; -webkit-transform: rotate(103deg); -moz-transform: rotate(103deg); transform: rotate(103deg); } /********************************************************************* * Invokana description that only shows after dragging onto glomerulus */ section.iMOA figcaption.description.invokana { top: 17px; left: 242px; } section.iMOA figcaption.description.invokana div { left: 9px; } section.iMOA figcaption.description.invokana hr { left: 49px; top: 31px; width: 67px; -webkit-transform: rotate(46deg); -moz-transform: rotate(46deg); transform: rotate(46deg); } /*************************************************************** * tubule descriptions are always there but are a special case * * "regular" on Normal Tab * - show for everyony slider position in normal tab * * "special" on diabetic tab * - it disapppears at 240 and above slider position to make room for a highlight * * "shweta" on Invokana DragDrop * - shows only when in this mode */ section.iMOA figcaption.description.tubule { left: 82px; width: 200px; } section.iMOA figcaption.description.tubule.regular, section.iMOA figcaption.description.tubule.shweta { top: 88px; } section.iMOA figcaption.description.tubule.special { top: 147px; } section.iMOA figcaption.description.tubule.special hr { top: -1px; width: 37px; } section.iMOA figcaption.description.tubule.shweta hr { left: 165px; top: 9px; width: 53px; -webkit-transform: rotate(12deg); -moz-transform: rotate(12deg); transform: rotate(12deg); } section.iMOA figcaption.description.tubule div { text-align: center; left: 10px; } section.iMOA figcaption.description.tubule hr { left: 165px; top: -6px; width: 77px; -webkit-transform: rotate(-12deg); } /********************************************************************* * Invokana DragDrop icon on Diabetic tab */ section.iMOA figure.message { z-index: 10; position: absolute; display: none; } /* * the close button when dropped */ section.iMOA figure.message.closeButton { top: 13px; left: 602px; width: 71px; height: 71px; background-image: url("../images/html_data/icon_close-blue.png"); } /* this looks like it's not being used and I can't find where it was used on the origial presentation. Leaving it here just in case */ section.iMOA figure.message.glomerulus { top: 258px; left: 16px; width: 233px; height: 129px; background-image: url("../images/html_data/msg_glucose-released-by-glomerulus.png"); } /* * The Invokana icon thingy */ section.iMOA figure.message.invokana { z-index: 100; top: 2px; left: 15px; width: 111px; height: 111px; background-image: url("../images/html_data/invokana_sprite.png"); background-repeat: no-repeat; background-position: left center; -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: infinite; -moz-animation-timing-function: linear; -moz-animation-iteration-count: infinite; animation-timing-function: linear; animation-iteration-count: infinite; } section.iMOA figure.message.invokana.snappingIntoPlaceFromFarAway { -webkit-animation-duration: 2s; -webkit-animation: mymove 2s infinite; } section.iMOA figure.message.invokana.snappingBack { -webkit-transition-property: top, left; -webkit-transition-duration: 500ms, 500ms; -webkit-transition-timing-function: ease-out; } section.iMOA figure.message.invokana.snappingIntoPlace { -webkit-transition-property: top, left; -webkit-transition-duration: 1000ms, 1000ms; -webkit-transition-timing-function: cubic-bezier(0.05, 0.33, 0.23, 1); } section.iMOA figure.message.invokana.dissolving { -webkit-animation: play 0.8s steps(6); } section.iMOA .dropTargetRegion { z-index: 2; position: absolute; left: -20px; top: 296px; bottom: 0; width: 300px; text-align: center; } /************************************************************* * This the text in the white squares in each tab * * on Normal Tab * - Glomerulus highlight shows first * - at 180 glucoseBeginsToExcrete shows * * on Diabetic Tab * - begins with renalGlucoseAltered * - at 240 changes to glucoseExceeds240mg * * on DragDrop * - invokanaInhibitsSGLT2 */ section.iMOA div.highlight { z-index: 100; position: absolute; display: none; background-color: rgba(255, 255, 255, 0.7); -webkit-border-radius: 10px; border-radius: 10px; padding-left: 11px; padding-top: 16px; color: #005b7f; font-family: 'KarbonMedium'; font-size: 20px; line-height: 20px; letter-spacing: .4px; } section.iMOA div.highlight sup { font-size: 11px; line-height: 0; } section.iMOA div.highlight.glomerulus { top: 150px; left: 76px; width: 234px; height: 129px; display: block; font-family: 'HelveticaNeueLTStd-Cn'; } section.iMOA div.highlight.glucoseExceeds240mg { top: 124px; left: 31px; width: 248px; height: 187px; } section.iMOA div.highlight.glucoseBeginsToExcrete { top: 148px; left: 31px; width: 248px; height: 129px; } section.iMOA div.highlight.invokanaInhibitsSGLT2 { top: 132px; left: 31px; width: 220px; height: 165px; padding-right: 5px; padding-top: 11px; line-height: 15px; font-family: 'KarbonMedium'; } section.iMOA div.highlight.renalGlucoseAltered { top: 202px; left: 31px; width: 233px; height: 81px; } section.iMOA .page-content h1 { margin-top: 13px; } /************************************************** Slider styles */ .uberSliderTicks { z-index: 1; position: absolute; width: 496px; height: 28px; top: 2px; left: 75px; font-family: Helvetica; font-size: 13px; color: #fff; text-shadow: 0 1px 4px rgba(0, 0, 0, .88); text-align: center; } .uberSliderTicks .tickLabel { position: absolute; width: 40px; height: 28px; padding-top: 12px; cursor: pointer; } .uberSliderTicks .tickLabel.first { left: 4px; } .uberSliderTicks .tickLabel.second { left: 47px; } .uberSliderTicks .tickLabel.third { left: 110px; } .uberSliderTicks .tickLabel.fourth { left: 168px; } .uberSliderTicks .tickLabel.fifth { left: 227px; } .uberSliderTicks .tickLabel.sixth { left: 286px; } .uberSliderTicks .tickLabel.seventh { left: 347px; } .uberSliderTicks .tickLabel.eighth { left: 410px; } .uberSliderTicks .tickLabel.ninth { left: 471px; } section.iMOA .slider { z-index: 10; position: absolute; visibility: hidden; top: 498px; left: 50px; width: 600px; height: 61px; /* background-image: url("../images/html_data/slider_background_empty.png");*/ display: none; } section.iMOA .slider .horizontalSlider { position: absolute; left: 73px; top: 0px; height: 24px; width: 517px; padding: 0 18px 0 14px; } section.iMOA .slider .horizontalSlider .sliderTrack { position: relative; z-index: 1; top: 36px; left: 0px; width: 100%; height: 8px; background: -webkit-linear-gradient(left, #c60b46 0, #c60b46 18px, #cacaca 18px, #cacaca 100%); } section.iMOA .slider .horizontalSlider .sliderTicks { position: absolute; width: 496px; height: 33px; } section.iMOA .slider .horizontalSlider .sliderTicks .tickMark { position: absolute; height: 75px; width: 1px; background-color: black; } section.iMOA .slider .horizontalSlider .sliderThumb { position: absolute; top: 13px; left: 1px; background: url("../images/html_data/slider_thumb.png") no-repeat; background-position: center center; width: 50px; height: 54px; z-index: 2; } .sliderThumb:hover { cursor: -webkit-grab; } .sliderThumb:active { cursor: -webkit-grabbing; } section.iMOA video { width: 700px; height: 478px; } /******************************************************************************* The following classes are dynamically added to section.iMOA to hide/show the different states of the content over the video. This way you can easily change states by adding classes to one element */ section.iMOA.tab_normal .slider, section.iMOA.tab_diabetic .slider { visibility: visible; } section.iMOA.tab_normal nav.tabs, section.iMOA.tab_diabetic nav.tabs { display: block; } section.iMOA.tab_normal .regular.tubule, section.iMOA.tab_normal .glucose.description, section.iMOA.tab_normal .SGLT2.description, section.iMOA.tab_normal .glomerulus.description { display: block; opacity: 1; } section.iMOA.normal_70-150 .glomerulus.highlight { display: block; opacity: 1; } section.iMOA.normal_180 .red.one-eighty, section.iMOA.normal_180 .approximateRenalThreshold, section.iMOA.normal_180 .glucoseInUrine.description, section.iMOA.normal_180 .glucoseBeginsToExcrete.highlight { display: block; opacity: 1; } section.iMOA.normal_210-300 .gray.one-eighty, section.iMOA.normal_210-300 .one-eighty.marker, section.iMOA.normal_210-300 .glucoseInUrine.description, section.iMOA.normal_210-300 .glucoseBeginsToExcrete.highlight, section.iMOA.normal_210-300 .approximateRenalThreshold { display: block; opacity: 1; } section.iMOA.tab_diabetic .glucose.description, section.iMOA.tab_diabetic .SGLT2.description, section.iMOA.tab_diabetic .invokana.message, section.iMOA.tab_diabetic .invokana.label.visible { display: block; opacity: 1; } section.iMOA.diabetic_70-150 .special.tubule, section.iMOA.diabetic_70-150 .renalGlucoseAltered, section.iMOA.diabetic_70-150 .glomerulus.description { display: block; opacity: 1; } section.iMOA.diabetic_180 .red.one-eighty, section.iMOA.diabetic_180 .approximateRenalThreshold, section.iMOA.diabetic_180 .glomerulus.description, section.iMOA.diabetic_180 .renalGlucoseAltered, section.iMOA.diabetic_180 .special.tubule { display: block; opacity: 1; } section.iMOA.diabetic_210 .gray.one-eighty, section.iMOA.diabetic_210 .one-eighty.marker, section.iMOA.diabetic_210 .glomerulus.description, section.iMOA.diabetic_210 .renalGlucoseAltered, section.iMOA.diabetic_210 .special.tubule { display: block; opacity: 1; } section.iMOA.diabetic_240 .red.two-forty, section.iMOA.diabetic_240 .one-eighty.marker, section.iMOA.diabetic_240 .gray.one-eighty, section.iMOA.diabetic_240 .glucoseExceeds240mg, section.iMOA.diabetic_240 .glucoseInUrine, section.iMOA.diabetic_240 .approximateRenalThresholdForDiabetics { display: block; opacity: 1; } section.iMOA.diabetic_270-300 .gray.two-forty, section.iMOA.diabetic_270-300 .gray.one-eighty, section.iMOA.diabetic_270-300 .two-forty.marker, section.iMOA.diabetic_270-300 .one-eighty.marker, section.iMOA.diabetic_270-300 .glucoseExceeds240mg, section.iMOA.diabetic_270-300 .glucoseInUrine, section.iMOA.diabetic_270-300 .approximateRenalThresholdForDiabetics { display: block; opacity: 1; } section.iMOA.tab_invokana .shweta.tubule, section.iMOA.tab_invokana .invokana.description, section.iMOA.tab_invokana .closeButton.message, section.iMOA.tab_invokana .glucoseInUrine, section.iMOA.tab_invokana .invokanaInhibitsSGLT2, section.iMOA.tab_invokana .glomerulus.description { display: block; opacity: 1; } .slider_g { position: absolute; top: 630px; left: 432px; z-index: 10;/* height: 30px; *//* background-color: #000; *//* display: block; */ } .SGLT2 { display: block !important; } .glucoseInUrine { display: block !important; } .wrapper { position: relative; top: 0; left: 0; width: 1024px; height: 637px; overflow: hidden; font-family: Helvetica; background: url(../images/html_data/bg.jpg) no-repeat top left; background-size: 100% 100%; font-family: 'KarbonMedium'; } #video1 { position: absolute; top: 137px; left: 72px; width: 869px; height: auto; } .section video { width: 100%; } .iMOA { -webkit-transform: scale(0.9); -moz-transform: scale(0.9); transform: scale(0.9); } /* slider css */ .sliderr_back { background: #000000; opacity: 0.4; position: absolute; top: 387px; left: 409px; width: 201px; border-radius: 16px; z-index: 8; height: 46px; display: none; } #sc_slider { width: 130px; height: 0px; z-index: 11; position: absolute; left: 440px; border: 3px solid #ffffff; top: 407px; display: none; } .navp { position: absolute; top: 365px; color: #ffffff; left: 415px; z-index: 8; font-family: 'HelveticaNeueLTStd-Cn'; display: none; width: 64px; } .navpw { position: absolute; top: 365px; color: #ffffff; left: 542px; text-align: center; z-index: 8; font-family: 'HelveticaNeueLTStd-Cn'; display: none; width: 77px; } .section.iMOA video { width: 700px; height: 478px; } #HomeBtnCong { cursor: pointer; color: #000; font-size: 28px; /* padding: 10px; */ width: 110px; border-radius: 30px; text-align: center; background: #f59302; position: absolute; height: 42px; font-style: italic; line-height: 42px; top: 400px; left: 482px; } .animated06 { cursor: pointer } /*animations starts*/ .delay0 { -webkit-animation-delay: 0s; -moz-animation-delay: 0s; animation-delay: 0s; } .delay1 { -webkit-animation-delay: 1s; -moz-animation-delay: 1s; animation-delay: 1s; } .delay2 { -webkit-animation-delay: 2s; -moz-animation-delay: 2s; animation-delay: 2s; } .delay3 { -webkit-animation-delay: 3s; -moz-animation-delay: 3s; animation-delay: 3s; } .delay4 { -webkit-animation-delay: 4s; -moz-animation-delay: 4s; animation-delay: 4s; } .delay5 { -webkit-animation-delay: 5s; -moz-animation-delay: 5s; animation-delay: 5s; } .delay6 { -webkit-animation-delay: 6s; -moz-animation-delay: 6s; animation-delay: 6s; } .delay7 { -webkit-animation-delay: 7s; -moz-animation-delay: 7s; animation-delay: 7s; } .delay8 { -webkit-animation-delay: 8s; -moz-animation-delay: 8s; animation-delay: 8s; } .delay9 { -webkit-animation-delay: 9s; -moz-animation-delay: 9s; animation-delay: 9s; } .delay10 { -webkit-animation-delay: 10s; -moz-animation-delay: 10s; animation-delay: 10s; } .delay11 { -webkit-animation-delay: 11s; -moz-animation-delay: 11s; animation-delay: 11s; } .delay12 { -webkit-animation-delay: 12s; -moz-animation-delay: 12s; animation-delay: 12s; } .delay13 { -webkit-animation-delay: 13s; -moz-animation-delay: 13s; animation-delay: 13s; } .delay14 { -webkit-animation-delay: 14s; -moz-animation-delay: 14s; animation-delay: 14s; } .delay15 { -webkit-animation-delay: 15s; -moz-animation-delay: 15s; animation-delay: 15s; } .delay16 { -webkit-animation-delay: 16s; -moz-animation-delay: 16s; animation-delay: 16s; } .delay_00 { -webkit-animation-delay: 0.5s; -moz-animation-delay: 0.5s; animation-delay: 0.5s; } .delay_01 { -webkit-animation-delay: 1.5s; -moz-animation-delay: 1.5s; animation-delay: 1.5s; } .delay_02 { -webkit-animation-delay: 2.5s; -moz-animation-delay: 2.5s; animation-delay: 2.5s; } .delay_03 { -webkit-animation-delay: 3.5s; -moz-animation-delay: 3.5s; animation-delay: 3.5s; } .delay_04 { -webkit-animation-delay: 4.5s; -moz-animation-delay: 4.5s; animation-delay: 4.5s; } .delay01 { -webkit-animation-delay: 7s; -moz-animation-delay: 7s; animation-delay: 7s; } @-webkit-keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes fadeIn_2 { from { opacity: 0; } to { opacity: 1; } } @keyframes fadeIn_2 { from { opacity: 0; } to { opacity: 1; } } .fadeIn_2 { -webkit-animation-name: fadeIn_2; animation-name: fadeIn_2; -webkit-animation-duration: 0.3s; animation-duration: 0.3s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .fadeIn_02 { -webkit-animation-name: fadeIn_2; animation-name: fadeIn_2; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes fadeIn_4 { from { opacity: 0; } to { opacity: 1; } } @keyframes fadeIn_4 { from { opacity: 0; } to { opacity: 1; } } .fadeIn_04 { -webkit-animation-name: fadeIn_4; animation-name: fadeIn_4; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes fadeIn_17 { from { opacity: 0; } to { opacity: 1; } } @keyframes fadeIn_17 { from { opacity: 0; } to { opacity: 1; } } .fadeIn_17 { -webkit-animation-name: fadeIn_17; animation-name: fadeIn_17; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes fadeIn_19 { from { opacity: 0; } to { opacity: 1; } } @keyframes fadeIn_19 { from { opacity: 0; } to { opacity: 1; } } .fadeIn_19 { -webkit-animation-name: fadeIn_19; animation-name: fadeIn_19; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes fadeInLeft { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes fadeInLeft { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .fadeInLeft { -webkit-animation-name: fadeIn; animation-name: fadeIn; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes h1 { from { height: 0; } to { height: 52px; } } @keyframes h1 { from { height: 0; } to { height: 52px; } } .h1 { -webkit-animation-name: h1; animation-name: h1; -webkit-animation-duration: 0.8s; animation-duration: 0.8s; -webkit-animation-fill-mode: both; } .breaker_bay { color: #5b999f } .bold { font-weight: bold; } .orientaionMsg { position: fixed; width: 100%; height: 100%; top: 0; left: 0; background-color: #000000; z-index: 1; display: none; } .orientContent { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; } .orientContent img { width: 35%; margin-bottom: 25px; } .orientContent p { color: #fff; font-size: 20px; font-weight: normal; } .navMsgBox { width: 275px; position: absolute; bottom: 136px; right: 0px; text-align: center; background-color: #ccc; color: #000; padding: 5px 0; border-top-left-radius: 7px; border-bottom-left-radius: 7px; z-index: 10; } .animated { animation-duration: 4s; -webkit-animation-duration: 4s; -webkit-animation-fill-mode: both; -webkit-animation-timing-function: ease-in; animation-fill-mode: both; animation-timing-function: ease-in; } @-webkit-keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } @keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } .fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut; -webkit-animation-duration: 4s; animation-duration: 4s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes fadeOutDown { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } @-webkit-keyframes slideInRight { from { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes slideInRight { from { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .slideInRight { -webkit-animation-name: slideInRight; animation-name: slideInRight; } @-webkit-keyframes w2 { from { width: 0; } to { width: 194px; } } @keyframes w2 { from { width: 0; } to { width: 194px; } } .w2 { -webkit-animation-name: w2; animation-name: w2; -webkit-animation-duration: 0.8s; animation-duration: 0.8s; -webkit-animation-fill-mode: both; } @-moz-keyframes flash { from, 50%, to { opacity: 1; } 25%, 75% { opacity: 0.5; } } @-webkit-keyframes flash { from, 50%, to { opacity: 1; } 25%, 75% { opacity: 0.5; } } @keyframes flash { from, 50%, to { opacity: 1; } 25%, 75% { opacity: 0.5; } } .flash { -webkit-animation-name: flash; animation-name: flash; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } @-webkit-keyframes flash13 { from, 50%, to { opacity: 0.8; } 25%, 75% { opacity: 1; } } @keyframes flash13 { from, 50%, to { opacity: 0.8; } 25%, 75% { opacity: 1; } } .flash13 { -webkit-animation-name: flash13; animation-name: flash13; -webkit-animation-duration: 3s; animation-duration: 3s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } /*animation end*/ .src_title { position: absolute; top: 122px; left: 12px; color: #f30617; font-size: 22px; font-family: 'HelveticaNeueLTStd-Md'; letter-spacing: -0.5px; } .correctIcon { width: 55px; position: absolute; height: 55px; top: 90px; left: 150px; } .wrongIcon { width: 55px; position: absolute; height: 55px; top: 90px; left: 140px; } ._tframe__plot_0, ._tframe__plot_1, ._tframe__plot_2, ._tframe__plot_3, ._tframe__plot_4, ._tframe__plot_5, ._tframe__plot_6, ._tframe__plot_7, ._tframe__plot_8, ._tframe__plot_9, ._tframe__plot_10, ._tframe__plot_11, ._tframe__plot_12, ._tframe__plot_13, ._tframe__plot_14, ._tframe__plot_15, ._tframe__plot_16, ._tframe__plot_17, ._tframe__plot_18, ._tframe__plot_19, ._tframe__plot_20 { display: none; } .clientLogo { display: none; } sup, sub { font-size: 10px; } /*Global end*/ /* common css rithu */ .h1 { -webkit-animation-name: h1; animation-name: h1; -webkit-animation-duration: 0.8s; animation-duration: 0.8s; -webkit-animation-fill-mode: both; } .breaker_bay { color: #5b999f } .bold { font-weight: bold; } .orientaionMsg { position: fixed; width: 100%; height: 100%; top: 0; left: 0; background-color: #000000; z-index: 1; display: none; } .orientContent { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; } .orientContent img { width: 35%; margin-bottom: 25px; } .orientContent p { color: #fff; font-size: 20px; font-weight: normal; } /*Common css start*/ .submitBtn { width: 127px; height: 37px; background: url(../images/html_data/submitBtn.png) no-repeat; background-size: 100% 100%; position: absolute; top: 500px; right: 12px; border: 0px; cursor: pointer; } .submitBtn:focus { outline: none; } .resetBtn { width: 127px; height: 37px; background: url(../images/html_data/ResetBtn.png) no-repeat; background-size: 100% 100%; position: absolute; top: 500px; right: 12px; border: 0px; cursor: pointer; } .resetBtn:focus { outline: none; } .IncorrectPop { width: 1024px; height: 434px; position: absolute; top: 114px; left: 0; z-index: 1; display: none; background: rgba(0, 0, 0, 0.8) } .IncorrectPopBox { width: 450px; height: auto; background-color: #fff; border-radius: 12px; display: block; margin: 0 auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .IncorrectPopBox h2 { background-color: #ff0000; width: 300px; display: block; margin: 0 auto; text-align: center; color: #fff; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; height: 35px; line-height: 35px; margin-top: 3px; font-family: 'HelveticaNeueLTStd-Cn'; font-weight: bold; letter-spacing: 1.5px; font-size: 18px; } .IncorrectPopBox p { text-align: center; margin: 70px auto; width: 500px; letter-spacing: 1.5px; font-size: 18px; font-family: 'HelveticaNeueLTStd-Cn'; font-weight: bold; color: #ff0000; } .CorrectPop { width: 1024px; height: 434px; position: absolute; top: 114px; left: 0; z-index: 1; display: none; background: rgba(0, 0, 0, 0.8) } .CorrectPopBox { width: 450px; height: auto; background-color: #fff; border-radius: 12px; display: block; margin: 0 auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .CorrectPopBox h2 { background-color: #269900; width: 300px; display: block; margin: 0 auto; text-align: center; color: #fff; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; height: 35px; line-height: 35px; margin-top: 3px; font-family: 'HelveticaNeueLTStd-Cn'; font-weight: bold; letter-spacing: 1.5px; font-size: 18px; } .CorrectPopBox p { text-align: center; width: 510px; margin: 70px auto; display: block; letter-spacing: 1.5px; font-size: 18px; font-family: 'HelveticaNeueLTStd-Cn'; font-weight: bold; color: #269900; } .correctclose { width: 30px; height: 30px; background: url(../images/html_data/close_icon.png) no-repeat; background-size: 100% 100%; position: absolute; top: 5px; right: 5px; border: 0px; cursor: pointer } .IncorrectPop .tryagain { width: 127px; height: 37px; background: url(../images/html_data/Tryagain_btn.png) no-repeat; background-size: 100% 100%; position: absolute; top: 340px; left: 450px; border: 0px; cursor: pointer; } .correctIcon { width: 55px; position: absolute; height: 55px; top: 90px; left: 150px; } .wrongIcon { width: 55px; position: absolute; height: 55px; top: 90px; left: 140px; } ._tframe__plot_0, ._tframe__plot_1, ._tframe__plot_2, ._tframe__plot_3, ._tframe__plot_4, ._tframe__plot_5, ._tframe__plot_6, ._tframe__plot_7, ._tframe__plot_8, ._tframe__plot_9, ._tframe__plot_10, ._tframe__plot_11, ._tframe__plot_12, ._tframe__plot_13, ._tframe__plot_14, ._tframe__plot_15, ._tframe__plot_16, ._tframe__plot_17, ._tframe__plot_18, ._tframe__plot_19, ._tframe__plot_20 { display: none; } .srcTitle { position: absolute; top: 120px; left: 15px; color: #f30617; font-size: 22px; font-family: 'HelveticaNeueLTStd-Md'; } .srcSubTitle { position: absolute; top: 150px; left: 15px; color: #424242; font-size: 18px; font-family: 'HelveticaNeueLTStd-Cn'; font-weight: bold; } .srcFooter { color: #000; font-family: 'HelveticaNeueLTStd-Md'; font-size: 12px; position: absolute; bottom: 135px; left: 12px; } .src_popup_close { position: absolute; top: 122px; left: 762px; width: 51px; height: 41px; opacity: 0; cursor: pointer; } .titleTxt { color: #f30617; font-size: 21.33px; font-family: 'HelveticaNeueLTStd-Md'; position: absolute; top: 123px; left: 12px; } .listTxt { color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .titleTxt1 { color: #f30617; font-size: 21.33px; font-family: 'HelveticaNeueLTStd-Md'; position: absolute; top: 65px; left: 12px; width: 66%; } .padding_right10 { padding-right: 2px; } .footerTxt { color: #000; font-family: 'HelveticaNeueLTStd-Cn'; font-size: 12px; position: absolute; bottom: 136px; left: 17px; } .dotIcon { width: 5px; height: 5px; background: url(../images/html_data/dotIcon.png) no-repeat top left; background-size: 100% 100%; } .iScrollIndicator { background: rgb(25, 183, 179) !important; } /*Common css end*/ /*Disclaimers start*/ .scr00_Box{ width: 654px; height: 243px; background: url(../images/html_data/scr00_boxBg.png) no-repeat center center; background-size: 654px 243px; position: absolute; top: 215px; left: 185px; display: flex; align-items: center; justify-content: center; text-align: center; } .scr00_text h2{ color: #f30617; font-size: 24px; font-family: 'HelveticaNeueLTStd-Md'; margin-bottom: 15px; } .scr00_text p{ color: #424242; font-size: 19px; font-family: 'HelveticaNeueLTStd-Cn'; } /*Disclaimers end*/ /* common css rithu */ /*slider05_wrapper start*/ .src05_title { color: #f30617; font-size: 21.33px; position: absolute; top: 123px; left: 12px;line-height: 25px;letter-spacing: .2px;font-size: 22.33px} .src05_para { position: absolute; top: 155px; left: 12px; color: #424242; font-size: 18.67px; font-weight: bold; } .src05_wrapper { width: 1024px; height: 672px; overflow: hidden; position: relative; background: url(../images/html_data/scr25_bg.jpg); top: 0px; left: 0px; } .src05_wrapper input[type="radio"] { display: none; } .ansTrue input[type="radio"]:checked + label { background-color: #227d42; } .ansFalse input[type="radio"]:checked + label { background-color: #bb3200; } #scr05sSubmit.submit_screens { top: 470px; } .src05_ques_text { position: relative; width: 690px; left: 0; top: 0; padding: 0px 25px; -webkit-box-sizing: border-box; box-sizing: border-box; height: 55px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-color: rgba(226, 243, 247, 0.6); border-radius: 5px; font-family: 'HelveticaNeueLTStd-Cn'; font-size: 18px; } .src05_question_1 { position: absolute; top: 205px; left: 35px; width: 100%; } .src05_question_2 { position: absolute; top: 270px; left: 35px; width: 100%; } .src05_question_3 { position: absolute; top: 335px; left: 35px; width: 100%; } .src05_question_4 { position: absolute; top: 402px; left: 35px; width: 100%; } .ansTrue{ position: absolute; top: 0; left: 710px; } .ansFalse { position: absolute; top: 0; left: 805px; } .ansTrue label{ position: absolute; left: 0; top: 0; font-size: 18px; font-family: 'HelveticaNeueLTStd-Cn'; background-color: rgba(122, 179, 142, 0.8); padding: 17px 28px; color: #ffffff; border-radius: 7px; } .ansFalse label { position: absolute; left: 0; top: 0; font-size: 18px; font-family: 'HelveticaNeueLTStd-Cn'; background-color: rgba(228, 124, 110, 0.8); padding: 17px 28px; color: #ffffff; border-radius: 7px; } .src05_footer{ position: absolute;top: 519px;left: 11px;font-size: 12px; color: #424242 } /*slider05_wrapper end*/ /*slider11_wrapper start*/ .src11_title { z-index: 5; } .src11_label img { position: absolute; top: 135px; left: 621px; } .src11_label .txt_sec { position: absolute; color: #010101; font-size: 13.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .src11_label .txt_1.txt_sec { top: 123px; left: 654px; text-align: right; } .src11_label .txt_2.txt_sec { top: 145px; left: 870px; } .src11_label .txt_3.txt_sec { top: 180px; left: 930px; } .src11_label .txt_4.txt_sec { top: 260px; left: 958px; } .src11_label .txt_5.txt_sec { top: 425px; left: 595px; text-align: center; } .src11_label .txt_6.txt_sec { top: 283px; left: 541px; text-align: right; } .src11_label .txt_7.txt_sec { top: 198px; left: 617px; text-align: center; } .src11_list1 { position: absolute; top: 182px; left: 72px; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .src11_list2 { position: absolute; top: 285px; left: 73px; line-height: 17px; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .src11_list3 { position: absolute; top: 347px; left: 73px; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .src11_list4 { position: absolute; top: 389px; left: 73px; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .src11_list5 { position: absolute; top: 430px; left: 73px; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .src11_arrow1 { width: 10px; height: 13px; background: url(../images/html_data/src01_arrow.png) no-repeat top left; background-size: 100% 100%; position: absolute; top: 4px; left: -25px; } .src11_heading { color: #31858d; font-size: 40px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 155px; left: 32px; font-weight: lighter; } .src11_list { list-style: none; } .src11_list li { color: #424242; font-size: 18px; font-family: 'HelveticaNeueLTStd-Cn'; padding-top: 15px; } .src02Img1, .src02Img2, .src02Img3, .src02Img4 { position: absolute; left: 0px; top: 0px; width: 1024px; height: 672px; } .src19Img1, .src019Img2, .src19Img3 { position: absolute; left: 0px; top: 0px; width: 1024px; height: 672px; } .src19_label { position: absolute; top: 180px; right: 128px; width: 329px; height: 296px; background: url(../images/html_data/scr19_label.png) no-repeat; } /*slider11_wrapper end*/ /*slider12_wrapper start*/ .src12_wrapper { width: 1024px; height: 672px; overflow: hidden; position: relative; background: url("../images/html_data/src12_bg.jpg") no-repeat scroll left top transparent; top: 0px; left: 0px; } .src12_para { position: absolute; top: 153px; left: 12px; color: #424242; font-size: 20px; font-family: 'HelveticaNeueLTStd-Cn'; font-weight: bold; } .src12_box { width: 850px; height: 280px; position: relative; top: 242px; left: 41px; } .src12_box1 { width: 174px; height: 186px; background: url(../images/html_data/src12_box1.png) no-repeat top left; background-size: 100% 100%; position: absolute; top: 0px; left: 250px; } .src12_box2 { width: 174px; height: 186px; background: url(../images/html_data/src12_box3.png) no-repeat top left; background-size: 100% 100%; position: absolute; top: 0px; left: 460px; } .src12_box_sec { width: 174px; height: 42px; background: url(../images/html_data/src12_box_bg.png) no-repeat top left; } .src12_box_sec1 { position: absolute; top: 438px; left: 290px; } .src12_box_sec2 { position: absolute; top: 438px; left: 500px; } #src12_draggables { position: absolute; top: 0px; left: 0px; } .src12_green { width: 175px; height: 42px; background: url(../images/html_data/src12_green.png) no-repeat top left; background-size: 100%; display: flex; align-items: center; justify-content: center; font-size: 14px; color: #fff; font-family: 'HelveticaNeueLTStd-Md'; text-align: center; } .src12_1boxtxt { position: absolute; top: 295px; left: 837px; } .src12_2boxtxt { position: absolute; top: 345px; left: 837px; } #submit12 { top: 500px; } #reset12 { top: 455px; } .submit_screens { width: 127px; height: 37px; background: url(../images/html_data/src04_submit.png) no-repeat; background-size: 100% 100%; position: absolute; top: 500px; right: 12px; border: 0px; cursor: pointer; } .submit_screens:focus { outline: none; } .reset_screens { width: 127px; height: 37px; background: url(../images/html_data/Reset_Btn.png) no-repeat; background-size: 100% 100%; position: absolute; top: 500px; right: 12px; border: 0px; cursor: pointer; } .reset_screens:focus { outline: none; } .src04_Correct { position: absolute; width: 1024px; height: 550px; top: 0; left: 0; display: none; background: rgba(0, 0, 0, 0.3); } .src04_correct_close { width: 46px; height: 46px; position: absolute; top: 218px; left: 724px; cursor: pointer } .src04_Incorrect { width: 1024px; height: 434px; position: absolute; top: 114px; left: 0; z-index: 1; display: none; background: rgba(0, 0, 0, 0.8) } .src04_IncorrectBox { width: 450px; height: auto; background-color: #fff; border-radius: 12px; display: block; margin: 0 auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .src04_IncorrectBox h2 { background-color: #ff0000; width: 300px; display: block; margin: 0 auto; text-align: center; color: #fff; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; height: 35px; line-height: 35px; margin-top: 3px; font-family: 'HelveticaNeueLTStd-Cn'; font-weight: bold; letter-spacing: 1.5px; font-size: 18px; } .src04_IncorrectBox p { text-align: center; margin: 70px auto; width: 500px; letter-spacing: 1.5px; font-size: 18px; font-family: 'HelveticaNeueLTStd-Cn'; font-weight: bold; color: #ff0000; } .src04_Correct { width: 1024px; height: 434px; position: absolute; top: 114px; left: 0; z-index: 1; display: none; background: rgba(0, 0, 0, 0.8) } .src04_CorrectBox { width: 450px; height: auto; background-color: #fff; border-radius: 12px; display: block; margin: 0 auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .src04_CorrectBox h2 { background-color: #269900; width: 300px; display: block; margin: 0 auto; text-align: center; color: #fff; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; height: 35px; line-height: 35px; margin-top: 3px; font-family: 'HelveticaNeueLTStd-Cn'; font-weight: bold; letter-spacing: 1.5px; font-size: 18px; } .src04_CorrectBox p { text-align: center; width: 510px; margin: 70px auto; display: block; letter-spacing: 1.5px; font-size: 18px; font-family: 'HelveticaNeueLTStd-Cn'; font-weight: bold; color: #269900; } .correctclose { width: 30px; height: 30px; background: url(../images/html_data/close_icon.png) no-repeat; background-size: 100% 100%; position: absolute; top: 5px; right: 5px; border: 0px; cursor: pointer } .src04_Incorrect .tryagain { width: 127px; height: 37px; background: url(../images/html_data/Tryagain_btn.png) no-repeat; background-size: 100% 100%; position: absolute; top: 340px; left: 450px; border: 0px; cursor: pointer; } /*slider12_wrapper end*/ /*slider13 wrapper start */ .src13_wrapper { width: 1024px; height: 672px; overflow: hidden; position: relative; background: url(../images/html_data/src13_bg.jpg) no-repeat scroll left top transparent; top: 0px; left: 0px; } .src13_para { position: absolute; top: 153px; left: 13px; color: #424242; font-size: 20px; font-family: 'HelveticaNeueLTStd-Cn'; font-weight: bold; } .src13_footer { color: #424242; font-size: 12px; position: absolute; bottom: 140px; left: 11px; } .sortable_wrap { position: absolute; top: 215px; left: 278px; } .sortable { display: flex; flex-direction: row; flex-wrap: wrap; width: 100%; height: 320px; } span.sortHandle { position: absolute; right: 18px; top: 22px; } .sortOrder { width: 58px; height: 58px; display: flex; align-items: center; justify-content: center; border-radius: 5px; background-color: #0e8c81; color: #ffffff; font-family: 'HelveticaNeueLTStd-Cn'; font-size: 18px; } .sortOrder1 { position: absolute; top: 215px; left: 210px; } .sortOrder2 { position: absolute; top: 280px; left: 210px; } .sortOrder3 { position: absolute; top: 345px; left: 210px; } .sortOrder4 { position: absolute; top: 410px; left: 210px; } .sortOrder5 { position: absolute; top: 475px; left: 210px; } .sortHandle img { width: 20px;height: 20px; } .sortable_wrap li { position: relative;color: #fff; font-size: 14px; font-family: 'HelveticaNeueLTStd-Cn'; list-style-type: none; width: 500px; height: 62px; background: url(../images/html_data/scr13_gradient5.png) no-repeat center;background-size: cover; padding: 0 35px 0 20px; display: flex; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; align-items: center; border-radius: 5px; box-sizing: border-box; cursor: all-scroll; } .sortable_wrap li.item1{background: url(../images/html_data/scr13_gradient1.png) no-repeat center;background-size: 100% 100%;color: #fff;} .sortable_wrap li.item2{background: url(../images/html_data/scr13_gradient2.png) no-repeat center;background-size: 100% 100%;color: #fff;} .sortable_wrap li.item3{background: url(../images/html_data/scr13_gradient3.png) no-repeat center;background-size: 100% 100%;color: #fff;} .sortable_wrap li.item4{background: url(../images/html_data/scr13_gradient4.png) no-repeat center;background-size: 100% 100%;color: #fff;} .sortable_wrap li.item5{background: url(../images/html_data/scr13_gradient5.png) no-repeat center;background-size: 100% 100%;color: #fff;} #submit15{top: 480px;} .changeItem1{background: url(../images/html_data/scr13_gradient2.png) no-repeat center !important;background-size: 100% 100% !important;} .changeItem2{background: url(../images/html_data/scr13_gradient3.png) no-repeat center !important;background-size: 100% 100% !important;} .changeItem3{background: url(../images/html_data/scr13_gradient4.png) no-repeat center !important;background-size: 100% 100% !important;} .changeItem4{background: url(../images/html_data/scr13_gradient1.png) no-repeat center !important;background-size: 100% 100% !important;} .changeItem5{background: url(../images/html_data/scr13_gradient5.png) no-repeat center !important;background-size: 100% 100% !important;} #scr13Submit { top: 490px; } .dummySort .sortable li { cursor: not-allowed; } /*slider13 wrapper ends */ /*slider14_wrapper starts*/ .src14_label img { position: absolute; top: 143px; left: 564px; } .src14_label .txt_sec { position: absolute; color: #000; font-size: 13.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .src14_label .txt_1.txt_sec { top: 220px; left: 567px; text-align: center } .src14_label .txt_2.txt_sec { top: 127px; left: 705px; text-align: center } .src14_label .txt_3.txt_sec { top: 131px; left: 859px } .src14_label .txt_4.txt_sec { top: 215px; left: 888px; text-align: left; } .src14_label .txt_5.txt_sec { top: 306px; left: 568px; text-align: center; } .src14_label .txt_6.txt_sec { top: 350px; left: 579px; text-align: right; } .src14_label .txt_7.txt_sec { top: 377px; left: 510px; text-align: right; } .src14_label .txt_8.txt_sec { top: 527px; left: 683px; text-align: center; } .src14_label .txt_9.txt_sec { top: 369px; left: 900px; text-align: left; } .src14_list1 { position: absolute; top: 201px; left: 72px; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .src14_list2 { position: absolute; top: 257px; left: 73px; line-height: 19px; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .src14_list3 { position: absolute; top: 327px; left: 73px; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .src14_list4 { position: absolute; top: 379px; left: 73px; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .src14_list5 { position: absolute; top: 430px; left: 73px; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .src14_arrow1 { width: 10px; height: 13px; background: url(../images/html_data/src01_arrow.png) no-repeat top left; background-size: 100% 100%; position: absolute; top: 4px; left: -25px; } .src14_footer{ position: absolute;top: 519px;left: 11px;font-size: 12px; color: #424242 } /*slider14_wrapper end*/ /*slider15_wrapper end*/ .src15_list6 { position: absolute; top: 305px; left: 108px; color: #424242; font-size: 15.67px; font-family: 'HelveticaNeueLTStd-Cn'; } .src15_list7 { top: 327px; left: 108px; position: absolute; color: #424242; font-size: 15.67px; font-family: 'HelveticaNeueLTStd-Cn'; } .src_dot16_3 { width: 5px; height: 5px; background: url(../images/html_data/src_dot16_3.png) no-repeat top left; background-size: 100% 100%; position: absolute; top: 8px; left: -17px; } .src15_list51 { top: 350px; left: 126px; position: absolute; color: #424242; font-size: 15.67px; font-family: 'HelveticaNeueLTStd-Cn'; } .src15_list52 { position: absolute; color: #424242; font-size: 15.67px; font-family: 'HelveticaNeueLTStd-Cn'; top: 371px; left: 126px; } .src15_list53 { position: absolute; color: #424242; font-size: 15.67px; font-family: 'HelveticaNeueLTStd-Cn'; top: 391px; left: 125px; } .src15_list54 { position: absolute; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; top: 425px; left: 73px; } .src15_list55 { position: absolute; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; top: 460px; left: 73px; } /*slider15_wrapper end*/ /*slider16_wrapper start*/ .src16_title { top: 121px; letter-spacing: -0.3px; } .footer_txt { position: absolute; top: 519px; left: 12px; font-size: 12px; font-family: 'HelveticaNeueLTStd-Cn'; } .src_dot16_1 { width: 6px; height: 6px; background: url(../images/html_data/src_dot16_1.png) no-repeat top left; background-size: 100% 100%; position: absolute; top: 7px; left: -16px; } .src_dot16_2 { width: 7px; height: 7px; background: url(../images/html_data/src_dot16_2.png) no-repeat top left; background-size: 100% 100%; position: absolute; top: 6px; left: -21px; } .src16_list1 { top: 180px; left: 12px; position: absolute; color: #424242; font-size: 18.67px; font-family: 'HelveticaNeueLTStd-Bd'; } .src16_list2 { top: 214px; left: 73px; position: absolute; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; letter-spacing: 0.5px; } .src16_list3 { top: 238px; left: 88px; position: absolute; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .src16_list4 { top: 260px; left: 89px; position: absolute; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .src16_list5 { top: 284px; left: 89px; position: absolute; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .src16_list6 { top: 312px; left: 73px; position: absolute; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; letter-spacing: 0.5px; } .src16_list7 { top: 335px; left: 90px; position: absolute; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .src16_list8 { top: 391px; left: 89px; position: absolute; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .src16_list9 { top: 412px; left: 109px; position: absolute; color: #424242; font-size: 15.67px; font-family: 'HelveticaNeueLTStd-Cn'; } .src16_list10 { top: 433px; left: 109px; position: absolute; color: #424242; font-size: 15.67px; font-family: 'HelveticaNeueLTStd-Cn'; } .footer16_txt { position: absolute; top: 515px; left: 12px; font-size: 12px; font-family: 'HelveticaNeueLTStd-Cn'; } .src16_label .txt_sec { position: absolute; color: #424242; font-size: 12px; font-family: 'HelveticaNeueLTStd-Cn'; } .src16_label .txt_sec1 { position: absolute; color: white; font-size: 12px; font-family: 'HelveticaNeueLTStd-Bd'; } .src16_label .txt_1.txt_sec { top: 123px; left: 654px; } .src16_label .txt_2.txt_sec { top: 123px; left: 654px; } .src16_label .txt_3.txt_sec { top: 123px; left: 654px; } .src16_label .txt_4.txt_sec { top: 123px; left: 654px; } .src16_label .txt_5.txt_sec { top: 123px; left: 654px; } .src16_label .txt_6.txt_sec { top: 123px; left: 654px; } .src16_label .txt_7.txt_sec { top: 123px; left: 654px; } .src16_label .txt_8.txt_sec { top: 123px; left: 654px; } .src16_label .txt_9.txt_sec { top: 123px; left: 654px; } .src16_label .txt_10.txt_sec { top: 123px; left: 654px; } .src16_label .txt_11.txt_sec { top: 123px; left: 654px; } .src16_label .txt_12.txt_sec { top: 123px; left: 654px; } .src16_label .txt_13.txt_sec { top: 123px; left: 654px; } .src16_label .txt_14.txt_sec { top: 123px; left: 654px; } .src16_label .txt_15.txt_sec1 { top: 386px; left: 739px; letter-spacing: -0.5px; } .src16_label .txt_16.txt_sec1 { top: 386px; left: 739px; letter-spacing: -0.5px; } .src16_label .txt_17.txt_sec1 { top: 386px; left: 739px; letter-spacing: -0.5px; } .src16_label .txt_18.txt_sec1 { top: 386px; left: 739px; letter-spacing: -0.5px; } .txt_19.txt_sec { top: 218px; left: 626px; letter-spacing: 0.4px; } .src16_label .txt_1.txt_sec { top: 171px; left: 647px; } .src16_label .txt_2.txt_sec { top: 169px; left: 873px; } .src16_label .txt_3.txt_sec { top: 251px; left: 882px; font-size: 15px !important; } .src16_label .txt_4.txt_sec { top: 351px; left: 812px; } .src16_label .txt_5.txt_sec { top: 427px; left: 836px; } .src16_label .txt_6.txt_sec { top: 479px; left: 939px; font-size: 15px !important; } .src16_label .txt_7.txt_sec { top: 478px; left: 722px; font-size: 15px !important; } .src16_label .txt_8.txt_sec { top: 465px; left: 647px; text-align: center; } .src16_label .txt_9.txt_sec { top: 347px; left: 697px; font-size: 15px !important; } .src16_label .txt_10.txt_sec { top: 285px; left: 686px; } .src16_label .txt_11.txt_sec { top: 429px; left: 521px; text-align: center; } .src16_label .txt_12.txt_sec { top: 372px; text-align: center; left: 543px; } .src16_label .txt_13.txt_sec { top: 331px; left: 514px; font-size: 15px !important; } .src16_label .txt_14.txt_sec { top: 279px; left: 558px; font-size: 15px !important; } .src16_label .txt_15.txt_sec1 { top: 213px; left: 829px; letter-spacing: -0.5px; } .src16_label .txt_16.txt_sec1 { top: 279px; left: 808px; letter-spacing: -0.5px; } .src16_label .txt_17.txt_sec1 { top: 275px; left: 846px; letter-spacing: -0.5px; } .src16_label .txt_18.txt_sec1 { top: 386px; left: 739px; letter-spacing: -0.5px; } .src16_label .txt_19.txt_sec { top: 218px; left: 626px; letter-spacing: 0.4px; } .src16_label .txt_20.txt_sec { top: 503px; left: 584px; letter-spacing: 0.4px; font-size: 15px !important; } .src16_list61 { top: 368px; left: 74px; position: absolute; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; letter-spacing: 0.1px; } /*slider16_wrapper end*/ /*slider17_wrapper start*/ .src17_title { position: absolute; top: 122px; font-size: 23px; font-weight: bold; left: 11px; letter-spacing: .2px; color: #f30518; } .src17_img { position: absolute; } .src17_img1 { background: url(../images/html_data/heart-scr-16.png) no-repeat; width: 161px; height: 262px; top: 119px; left: 429px; } .src17_img2 { background: url(../images/html_data/scr17-image-1.png) no-repeat; width: 402px; height: 180px; top: 199px; left: 22px; } .src17_img2 p { position: absolute; top: 39px; left: 42px; font-size: 17px; color: white; font-family: 'HelveticaNeueLTStd-Cn'; letter-spacing: 0.01px; } .bold{font-family: 'HelveticaNeueLTStd-Md'; } .src17_img3 { background: url(../images/html_data/scr17-image-2.png) no-repeat; width: 399px; height: 180px; top: 199px; left: 602px; } .src17_img3 p { position: absolute; top: 34px; left: 152px; font-size: 17px; letter-spacing: .1px; line-height: 19px; color: #fff; } .src17_img4 { background: url(../images/html_data/scr17-image-3.png) no-repeat; width: 352px; height: 175px; top: 375px; left: 22px; } .src17_img4 p { position: absolute; top: 70px; left: 117px; font-size: 16px; color: #fff; } .src17_img5 { background: url(../images/html_data/scr17-image-4.png) no-repeat; width: 390px; height: 175px; top: 375px; left: 295px; } .src17_img5 p { position: absolute; top: 41px; left: 101px; font-size: 16px; color: #fff; } .src17_img6 { background: url(../images/html_data/scr17-image-5.png) no-repeat; width: 390px; height: 175px; top: 375px; left: 610px; } .src17_img6 p { position: absolute; top: 48px; left: 102px; font-size: 16px; color: #fff; } .src17_footer { position: absolute; bottom: 130px; left: 12px; font-size: 12px; color: #424242; } /*slider17_wrapper end*/ /*slider18_wrapper start*/ .src18_title { position: absolute; top: 122px; left: 12px; font-size: 22px; font-weight: bold; letter-spacing: .1px; color: #f30617; } .src18_img1 { background: url(../images/html_data/scr18_img1.png) no-repeat; width: 306px; height: 555px; left: 633px; position: absolute; } .src18_box1 { position: absolute; top: 171px; left: 37px; font-size: 17px; letter-spacing: .13px; } .src18_box2 { position: absolute; left: 37px; top: 231px; font-size: 17px; letter-spacing: .13px; } .src18_box3 { position: absolute; left: 37px; top: 276px; font-size: 17px; letter-spacing: .13px; } .src18_box4 { position: absolute; left: 37px; top: 318px; font-size: 17px; letter-spacing: .13px; } .src18_box5 { position: absolute; left: 37px; top: 380px; font-size: 17px; letter-spacing: .13px; } .src18_box6 { position: absolute; left: 37px; top: 422px; font-size: 12px; } .src18_footer { position: absolute; left: 12px; top: 528px; font-size: 12px; } /*slider18_wrapper end*/ /*slider19_wrapper start*/ .src19_title { position: absolute; top: 122px; left: 12px; font-size: 22px; font-weight: bold; letter-spacing: .1px; color: #f30617; font-family: 'HelveticaNeueLTStd-Md';} .scr19_img { position: absolute; } .scr19_img1 { background: url(../images/html_data/scr19-image-1.png) no-repeat; width: 194px; height: 78px; top: 193px; left: 40px; } .scr19_img1 p, .scr19_img2 p { position: absolute; font-size: 18px; top: 29px; left: 48px; color: #fff; } .scr19_img2 { background: url(../images/html_data/scr19-image-2.png) no-repeat; width: 194px; height: 78px; top: 193px; left: 216px; } .scr19_img3 { background: url(../images/html_data/scr19-image-3.png) no-repeat; width: 195px; height: 78px; top: 193px; left: 390px; } .scr19_img3 p { position: absolute; font-size: 18px; top: 29px; left: 66px; color: #fff; } .scr19_img4 { background: url(../images/html_data/scr19-image-4.png) no-repeat; width: 194px; height: 78px; top: 193px; left: 566px; } .scr19_img4 p { position: absolute; font-size: 18px; top: 29px; left: 66px; color: #fff; } .scr19_img5 { background: url(../images/html_data/scr19-image-5.png) no-repeat; width: 194px; height: 78px; top: 193px; left: 742px; } .scr19_img5 p { position: absolute; font-size: 18px; top: 29px; left: 48px; color: #fff; } .scr19_img6 { background: url(../images/html_data/scr19-image-6.png) no-repeat; width: 201px; height: 100px; top: 281px; left: 388px; } .scr19_img6 p { position: absolute; font-size: 16px; top: 23px; left: 69px; color: #fff; text-align: center; } .scr19_img7 { background: url(../images/html_data/scr19-image-7.png) no-repeat; width: 201px; height: 100px; top: 281px; left: 563px; } .scr19_img7 p { position: absolute; font-size: 16px; top: 24px; left: 52px; color: #fff; text-align: center; } .scr19_img8 { background: url(../images/html_data/scr19-image-8.png) no-repeat; width: 201px; height: 100px; top: 365px; left: 388px; } .scr19_img8 p { position: absolute; font-size: 16px; top: 34px; left: 55px; color: #fff; } .scr19_img9 { background: url(../images/html_data/scr19-image-6.png) no-repeat; width: 201px; height: 100px; top: 450px; left: 388px; } .scr19_img9 p { position: absolute; font-size: 16px; top: 24px; left: 60px; color: #fff; text-align: center; } .scr19_imgArrow1 { background: url(../images/html_data/double-arrow.png) no-repeat; width: 15px; height: 23px; top: 271px; left: 481px; } .scr19_imgArrow2 { background: url(../images/html_data/right-arrow.png) no-repeat; width: 11px; height: 13px; top: 317px; left: 571px; } .scr19_imgArrow22 { background: url(../images/html_data/up-arrow.png) no-repeat; width: 14px; height: 24px; top: 272px; left:655px; } .scr19_imgArrow3 { background: url(../images/html_data/double-arrow.png) no-repeat; width: 15px; height: 23px; top: 354px; left: 481px; } .scr19_imgArrow4 { background: url(../images/html_data/double-arrow.png) no-repeat; width: 15px; height: 23px; top: 439px; left: 481px; } .scr19_imgArrow5 { background: url(../images/html_data/curve-arrow.png) no-repeat; width: 110px; height: 228px; top: 271px; left: 357px; } .scr19_imgArrow6 { background: url(../images/html_data/long-curve-arrow.png) no-repeat; width: 420px; height: 269px; top: 225px; left: 565px; } .src19_footer { position: absolute; left: 12px; top: 528px; font-size: 12px; } /*slider19_wrapper end*/ /*slider20_wrapper start*/ .titleTxt20 { color: #f30617; font-size: 21.33px; font-family: 'HelveticaNeueLTStd-Md'; position: absolute; top: 123px; left: 12px; letter-spacing: -0.5px; } .src20_list1 .sec1 { position: absolute; top: 14px; left: 46px; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; line-height: 22px; } .src20_list1 .sec2 { position: absolute; top: 68px; left: 46px; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; line-height: 22px; } .src20_list1 .sec3 { position: absolute; top: 99px; left: 46px; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; line-height: 22px; } .src20_list2 .sec4 { position: absolute; top: 15px; left: 43px; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; line-height: 22px; } .src20_list2 .sec5 { position: absolute; top: 67px; left: 43px; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; line-height: 22px; } .src20_list1 h3 { position: absolute; font-size: 18.67px; line-height: 15px; color: #fff; font-family: 'HelveticaNeueLTStd-Cn'; top: 243px; left: 307px; letter-spacing: 0.5px; font-weight: bold; } .src20_list2 h3 { position: absolute; font-size: 18.67px; line-height: 15px; color: #fff; font-family: 'HelveticaNeueLTStd-Cn'; top: 243px; left: 649px; letter-spacing: 0.5px; font-weight: bold; } .src01_arrow3 { width: 10px; height: 13px; background: url(../images/html_data/src01_arrow.png) no-repeat top left; background-size: 100% 100%; position: absolute; top: 4px; left: -23px; } .src_footer { color: #424242; font-size: 12px; position: absolute; bottom: 140px; left: 12px; } .src20_list1 img { position: absolute; top: 220px; left: 192px; } .src20_list2 img { position: absolute; top: 220px; left: 514px; } .src20_list1 .para-sec { position: absolute; top: 284px; left: 191px; width: 316px; height: 162px; background: white; border-bottom-left-radius: 9px; border-bottom-right-radius: 9px; } .src20_list2 .para-sec { position: absolute; top: 284px; left: 515px; width: 316px; height: 162px; background: white; border-bottom-left-radius: 9px; border-bottom-right-radius: 9px; } .src20_list1 para-sec { color: white; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 338px; left: 138px; line-height: 23px; } .src20_list2 para-sec { color: white; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 338px; left: 138px; line-height: 23px; } .src20_footer { color: #424242; font-size: 12px; position: absolute; bottom: 129px; left: 11px; } /*slider20_wrapper end*/ /*slider21_wrapper start*/ .src21_list1 .para-sec { color: white; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 338px; left: 138px; line-height: 23px; } .src21_list2 .para-sec { color: white; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 276px; left: 433px; line-height: 21px; } .src21_list3 .para-sec { color: white; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 318px; left: 743px; line-height: 22px; } .src21_list1 img { position: absolute; top: 148px; left: 94px; } .src21_list2 img { position: absolute; top: 148px; left: 393px; } .src21_list3 img { position: absolute; top: 148px; left: 692px; } /*slider21_wrapper end*/ /*slider22_wrapper start*/ .src22_list1 { color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 157px; left: 53px; letter-spacing: -0.5px; line-height: 25px; } .src22_list2 { color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 258px; left: 53px; line-height: 25px; letter-spacing: -0.5px; } .src22_list3 { color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 332px; left: 53px; letter-spacing: -0.5px; line-height: 25px; } .src22_list4 { color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 407px; left: 53px; line-height: 25px; letter-spacing: -0.5px; } .src22_list5 { color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 157px; left: 516px; line-height: 25px; letter-spacing: -0.5px; } .src22_list6 { color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 232px; left: 516px; line-height: 25px; letter-spacing: -0.5px; } /*slider22_wrapper end*/ /*slider23_wrapper start*/ .src23_list1 { color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 157px; left: 53px; letter-spacing: -0.5px; line-height: 25px; } .src23_list2 { color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 232px; left: 53px; line-height: 25px; letter-spacing: -0.5px; } .src23_list3 { color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 332px; left: 53px; letter-spacing: -0.5px; line-height: 25px; } .src23_list4 { color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 158px; left: 516px; line-height: 25px; letter-spacing: -0.5px; } .src23_list5 { color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 257px; left: 516px; line-height: 25px; letter-spacing: -0.5px; } .src23_arrow1 { width: 10px; height: 13px; background: url(../images/html_data/src01_arrow.png) no-repeat top left; background-size: 100% 100%; position: absolute; top: 5.5px; left: -20px; } .src23_dot { width: 5px; height: 5px; background: url(../images/html_data/src_dot.png) no-repeat top left; background-size: 100% 100%; } .src23_dot1 { position: absolute; top: 12px; left: -17px; } .src23_dot2 { position: absolute; top: 13px; left: -17px; } .src23_list3_sub1 { font-family: 'HelveticaNeueLTStd-Cn'; line-height: normal; font-size: 17.33px; color: #424242; top: 397px; left: 69px; line-height: 25px; position: absolute; line-height: 25px; letter-spacing: -0.5px; } .src23_list3_sub2 { font-family: 'HelveticaNeueLTStd-Cn'; line-height: normal; font-size: 17.33px; color: #424242; top: 435px; left: 69px; line-height: 25px; position: absolute; line-height: 25px; letter-spacing: -0.5px; } /*slider23_wrapper end*/ /*slider24_wrapper start*/ .src24_wrapper { width: 1024px; height: 672px; overflow: hidden; position: relative; background: url("../images/html_data/src24_bg.jpg") no-repeat scroll left top transparent; top: 0px; left: 0px; } .src24_title { position: absolute; top: 130px; left: 15px; color: #f30617; font-size: 22px; font-family: 'HelveticaNeueLTStd-Cn'; } .src24_para { position: absolute; top: 165px; left: 15px; color: #424242; font-size: 20px; font-family: 'HelveticaNeueLTStd-Cn'; font-weight: bold; } .src24_box { width: 430px; height: 420px; position: relative; top: 145px; left: 300px; } .src24_heart { position: absolute; top: -20px; } .src24_box_sec { width: 174px; height: 42px; background: url(../images/html_data/src12_box_bg.png) no-repeat top left; } .src24_heading { color: #000; font-size: 14px; } .src24_heading1 { position: absolute; top: -15px; left: 175px; } .src24_heading2 { position: absolute; top: 162px; left: 28px; text-align: right; } .src24_heading3 { position: absolute; top: 208px; left: 50px; } .src24_heading4 { position: absolute; top: 235px; left: -25px;text-align: right; } .src24_heading5 { left: 155px; position: absolute; bottom: 20px; } .src24_heading6 { position: absolute; right: 3px; top: 227px; } .src24_box_sec1 { position: absolute; top: 226px; left: 200px; } .src24_box_sec2 { position: absolute; top: 122px; left: 632px; } .src24_box_sec3 { position: absolute; top: 190px; left: 675px; } .src24_box_sec4 { position: absolute; top: 438px; left: 601px; } #src24_draggables { position: absolute; top: 0px; left: 0px; } .src24_green { width: 175px; height: 42px; background: url(../images/html_data/src12_green.png) no-repeat top left; background-size: 100%; display: flex; align-items: center; justify-content: center; font-size: 14px; color: #fff; font-family: 'HelveticaNeueLTStd-Cn'; } .src24_1boxtxt { position: absolute; top: 265px; left: 810px; } .src24_2boxtxt { position: absolute; top: 315px; left: 810px; } .src24_3boxtxt { position: absolute; top: 365px; left: 810px; } .src24_heart_line { position: absolute; top: 2px; left: 7px; } #submit24 { top: 500px; } #reset24 { top: 455px; } .src24_footer { color: #424242; font-size: 12px; position: absolute; bottom: 140px; left: 10px; } /*slider24_wrapper end*/ /*slider25_wrapper start*/ .titleTxt { color: #f30617; font-size: 21.33px; font-family: 'HelveticaNeueLTStd-Md'; position: absolute; top: 123px; left: 12px; } .srcSubTitle { position: absolute; top: 155px; left: 12px; color: #424242; font-size: 18.67px; font-family: 'HelveticaNeueLTStd-Cn'; font-weight: bold; } .src25_wrapper { width: 1024px; height: 672px; overflow: hidden; position: relative; background: url(../images/html_data/scr25_bg.jpg) no-repeat scroll left top transparent; top: 0px; left: 0px; } .queswrap { position: absolute; width: 100%; top: 190px; } .quesHead { position: absolute; top: 0; left: 55px; width: 750px; color: #424242; font-size: 18px; font-family: 'HelveticaNeueLTStd-Cn'; padding: 20px 10px 20px 40px; background-color: rgba(240, 246, 247, 0.7); border-radius: 5px; } .quesHead span { position: absolute; left: -20px; width: 40px; height: 40px; display: flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; top: 0; bottom: 0; margin: auto; background-color: #98c3c8; border-radius: 50%; border: 5px solid #ffffff; color: #326b71; font-family: 'HelveticaNeueLTStd-Cn'; font-weight: bold; } .checkboxWrap { position: absolute; top: 90px; left: 100px; } .checkboxWrap12 { position: absolute; top: 110px; left: 100px; } .checkboxes { display: flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 22px; } .checkboxText { font-size: 16px; font-family: 'HelveticaNeueLTStd-Cn'; color: #424242; padding-left: 45px; } .checkboxWrap12 .checkboxText { padding-left: 30px; } .checkboxWrap input[type=checkbox] { position: absolute; opacity: 0; } .checkboxes .checkboxBtn { position: absolute; width: 35px; height: 35px; background: url("../images/html_data/check.png") no-repeat } .checkboxes .checkboxBtn.checkBtnX { position: absolute; width: 35px; height: 35px; background: url("../images/html_data/checkWrng.png") no-repeat } .checkboxes input[type="checkbox"]:checked + .checkboxBtn { position: absolute; width: 35px; height: 35px; background: url("../images/html_data/checkCorrect.png") no-repeat } .quesContent { display: none; } .pagination { position: absolute; left: 445px; top: 285px; width: 135px; height: 35px; display: flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; background-color: #c6d5d7; color: #326b71; font-size: 18px; font-family: 'HelveticaNeueLTStd-Cn'; border-radius: 15px; } .left_nav { width: 35px; height: 35px; background: url("../images/html_data/pageBtnLeft.png") no-repeat; border: 0; outline: none; background-size: 100% 100%; } .right_nav { width: 35px; height: 35px; background: url("../images/html_data/pageBtnRight.png") no-repeat; border: 0; outline: none; background-size: 100% 100%; } .left_nav[disabled], .right_nav[disabled] { opacity: 0.5 } .submitBtn { width: 127px; height: 37px; background: url(../images/html_data/submitBtn.png) no-repeat; background-size: 100% 100%; position: absolute; top: 470px; right: 12px; border: 0px; cursor: pointer; } .submitBtn:focus { outline: none; } .IncorrectPop { width: 1024px; height: 434px; position: absolute; top: 114px; left: 0; z-index: 1; display: none; background: rgba(0, 0, 0, 0.8) } .IncorrectPopBox { width: 450px; height: auto; background-color: #fff; border-radius: 12px; display: block; margin: 0 auto; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .IncorrectPopBox h2 { background-color: #ff0000; width: 300px; display: block; margin: 0 auto; text-align: center; color: #fff; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; height: 35px; line-height: 35px; margin-top: 3px; font-family: 'HelveticaNeueLTStd-Cn'; font-weight: bold; letter-spacing: 1.5px; font-size: 18px; } .IncorrectPopBox p { text-align: center; margin: 70px auto; width: 500px; letter-spacing: 1.5px; font-size: 18px; font-family: 'HelveticaNeueLTStd-Cn'; font-weight: bold; color: #ff0000; } .IncorrectPop .tryagain { width: 127px; height: 37px; background: url(../images/html_data/Tryagain_btn.png) no-repeat; background-size: 100% 100%; position: absolute; top: 340px; left: 450px; border: 0px; cursor: pointer; } .CorrectPop { width: 1024px; height: 434px; position: absolute; top: 114px; left: 0; z-index: 1; display: none; background: rgba(0, 0, 0, 0.8) } .CorrectPopBox { width: 450px; height: auto; background-color: #fff; border-radius: 12px; display: block; margin: 0 auto; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .CorrectPopBox h2 { background-color: #269900; width: 300px; display: block; margin: 0 auto; text-align: center; color: #fff; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; height: 35px; line-height: 35px; margin-top: 3px; font-family: 'HelveticaNeueLTStd-Cn'; font-weight: bold; letter-spacing: 1.5px; font-size: 18px; } .CorrectPopBox p { text-align: center; width: 510px; margin: 70px auto; display: block; letter-spacing: 1.5px; font-size: 18px; font-family: 'HelveticaNeueLTStd-Cn'; font-weight: bold; color: #269900; } .correctclose { width: 30px; height: 30px; background: url(../images/html_data/close_icon.png) no-repeat; background-size: 100% 100%; position: absolute; top: 5px; right: 5px; border: 0px; cursor: pointer } /*slider25_wrapper end*/ /*slider26_wrapper start*/ .checkIcon { padding-right: 12px; padding-top: 2px; } .srcTitle { position: absolute; top: 122px; left: 12px; color: #f30617; font-size: 22px; font-family: 'HelveticaNeueLTStd-Cn'; } .src26_list1 { position: absolute; top: 179px; left: 38px; font-size: 17px; font-family: 'HelveticaNeueLTStd-Cn'; color: #424242; display: flex; align-items: center; } .src26_list2 { color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 208px; left: 38px; display: flex; align-items: center; } .src26_list3 { color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 240px; left: 38px; display: flex; align-items: center; } .src26_list4 { color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 272px; left: 38px; display: flex; align-items: center; } .src26_list5 { color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 304px; left: 38px; display: flex; align-items: center; } .src26_list6 { color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 336px; left: 38px; display: flex; align-items: center; } /*slider26_wrapper end*/ /*slider27_wrapper starts*/ .scr27_wrapper { width: 1024px; height: 672px; overflow: hidden; position: relative; background: url(../images/html_data/src27_bg.jpg) no-repeat scroll left top transparent; top: 0px; left: 0px; } .scr27_heading { font-size: 22px; color: #f30617; position: absolute; top: 126px; left: 12px; } .src27_banner { background: #31868d; width: 553px; height: 265px; position: absolute; top: 198px; left: 234px; border-radius: 19px; } .src27_banner_heading { background: white; position: absolute; top: 254px; left: 311px; width: 403px; height: 65px; border-radius: 8px; color: #31868d; } .src27_banner_heading span { position: absolute; left: 38px; font-family: 'HelveticaNeueLTStd-Cn'; top: 10px; letter-spacing: 1.5px; font-size: 40px; font-weight: bold; } .src27_banner_para { color: #ffffff; font-family: 'HelveticaNeueLTStd-Cn'; position: absolute; top: 338px; left: 386px; text-align: center; line-height: 31px; font-size: 26.67px; letter-spacing: 0.4px; } /*slider27_wrapper ends*/ /*slider1 start*/ .scr01_list_title { color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Md'; position: absolute; top: 180px; left: 47px; } .scr01_list1 { position: absolute; top: 220px; left: 73px; } .scr01_list2 { position: absolute; top: 252px; left: 73px; } .scr01_list3 { position: absolute; top: 284px; left: 73px; } .arrowIcon { width: 10px; height: 13px; background: url(../images/html_data/arrowIcon.png) no-repeat top left; background-size: 100% 100%; } .scr01_arrow { position: absolute; top: 4px; left: -25px; } /*slider1 end*/ /*slider2 start*/ .scr02_wrapper { width: 1024px; height: 672px; overflow: hidden; position: relative; background: url(../images/html_data/scr21Bg.jpg) no-repeat scroll left top transparent; top: 0px; left: 0px; } .scr02_list1 { position: absolute; top: 181px; left: 54px; } .scr02_list2 { position: absolute; top: 213px; left: 54px; } .scr02_list3 { position: absolute; top: 244px; left: 54px; } .scr02_list4 { position: absolute; top: 277px; left: 54px; } .scr02_list5 { position: absolute; top: 308px; left: 54px; } .scr02_list6 { position: absolute; top: 340px; left: 54px; } .scr02_list7 { position: absolute; top: 373px; left: 54px; } .scr02_list8 { position: absolute; top: 405px; left: 54px; } .scr02_list9 { position: absolute; top: 436px; left: 54px; } .scr02_list10 { position: absolute; top: 468px; left: 46px; } .scr02_list11 { position: absolute; top: 500px; left: 46px; } .thickMark { width: 23px; height: 23px; background: url(../images/html_data/thickMark.png) no-repeat top left; background-size: 100% 100%; } .scr02_checkbox { position: absolute; top: -2px; left: -35px; } .scr_info_wrp { position: absolute; top: 440px; right: 13px; width: 59px; height: 59px; cursor: pointer; left: 950px; display: none; } .scr02_info { background: url(../images/html_data/infoBtn.png) no-repeat top left; background-size: 59px 59px; position: absolute; top: 0; right: 0; width: 59px; height: 59px; cursor: pointer; } .src02_popup { width: 1024px; height: 435px; background: rgba(0, 0, 0, 0.8); display: block; margin: 0 auto; position: absolute; top: 113px; left: 0px; z-index: 10; } .src02_close { width: 50px; height: 55px; background: url(../images/html_data/closeIcon.png) no-repeat; background-size: 100% 100%; position: absolute; top: 20px; right: 195px; border: 0px; cursor: pointer; } .src02_popup_box { width: 635px; height: 315px; background-color: #fff; border-radius: 12px; display: block; margin: 0 auto; position: absolute; top: 14%; left: 175px; border: 2px solid #0e8c81; padding: 0px 20px; overflow: hidden; } .src02_popup_box h2 { font-family: 'HelveticaNeueLTStd-Cn'; font-size: 18.67px; font-weight: bold; color: #31858d; width: 95%; padding: 9px 0; margin: 0 2.5%; border-bottom: 2px solid #31858d; padding-top: 14px; } .src02_popup ol { padding-left: 40px; padding-top: 10px; list-style: none; position: relative; } .src02_popup ol li { line-height: 20px; font-size: 16px; font-family: 'HelveticaNeueLTStd-Cn'; color: #424242; padding-bottom: 9px; position: relative; } .scr02_arrow { position: absolute; top: 4px; left: -25px; } /*slder2 end*/ /*slider3 start*/ .src_03_heart { position: absolute; top: 150px; } .src_03_heart_img1 { position: absolute; top: 153px; left: 208px; } .src_03_heart_img1 span { position: absolute; padding: 15px 0px; left: 125px; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; color: #424242 } .src_03_heart_img6 span { position: absolute; padding: 5px 0px; left: 125px; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; color: #424242 } .src_03_heart_img3 span, .src_03_heart_img5 span { position: absolute; padding: 15px 0px; left: 98px; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; color: #424242 } .src_03_heart_img2 span, .src_03_heart_img4 span { position: absolute; padding: 4px 0px; left: 97px; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; color: #424242 } .src_03_heart_img2 { position: absolute; top: 213px; left: 263px; } .src_03_heart_img3 { position: absolute; top: 278px; left: 292px; } .src_03_heart_img4 { position: absolute; top: 342px; left: 292px; } .src_03_heart_img5 { position: absolute; top: 405px; left: 263px; } .src_03_heart_img6 { position: absolute; top: 465px; left: 207px; } /*slider3 end*/ /*slider4 start*/ .src04_wrapper { width: 1024px; height: 672px; overflow: hidden; position: relative; background: url(../images/html_data/scr04_bg.jpg) no-repeat scroll left top transparent; top: 0px; left: 0px; } .src04_title { position: absolute; color: #000; font-size: 18.67px; font-family: 'HelveticaNeueLTStd-Md'; } .scr04_list1 { position: absolute; top: 160px; left: 72px; } .scr04_list2 { position: absolute; top: 210px; left: 72px; } .scr04_list2 ul{margin-left: 30px;} .scr04_list2 ul li{padding-top: 5px;} .scr04_list3 { position: absolute; top: 410px; left: 72px; } .scr04_list4 { position: absolute; top: 465px; left: 72px; } .scr04_list5 { position: absolute; top: 243px; right: 205px; } .scr04_list5 span { position: absolute; font-size: 13.33px; width: 148px; top: 6px; left: 102px;font-family: 'HelveticaNeueLTStd-Md'; color: #000 } .scr04_list6 { position: absolute; top: 272px; right: 205px; } .scr04_list6 span { position: absolute; font-size: 13.33px; width: 148px; top: 6px; left: 102px; font-family: 'HelveticaNeueLTStd-Md'; color: #000; } .scr04_list7 { position: absolute; top: 322px; right: 190px; } .scr04_list7 span { position: absolute; font-size: 13px; width: 121px; top: 7px; font-family: 'HelveticaNeueLTStd-Md'; left: 170px; color: #000 } .scr04_list8 { position: absolute; top: 371px; right: 165px; } .scr04_list8 span { position: absolute; left: 230px; top: 7px; width:45px; font-size: 13px; font-family: 'HelveticaNeueLTStd-Md'; color: #000; } .scr04_arrow { position: absolute; top: 4px; left: -25px; } .scr11_info { background: url(../images/html_data/scr11_info.png) no-repeat top left; background-size: 59px 59px; position: absolute; top: 1px; right: 0; width: 59px; height: 59px; cursor: pointer; } .src04_popup { width: 1024px; height: 434px; background: rgba(0, 0, 0, 0.8); display: block; margin: 0 auto; position: absolute; top: 114px; left: 0px; display: none; z-index: 10; } .src04_popup_close { width: 50px; height: 55px; background: url(../images/html_data/closeIcon.png) no-repeat; background-size: 100% 100%; position: absolute; top: 25px; right: 195px; border: 0px; cursor: pointer; } .src04_poup_container { width: 635px; height: 320px; background-color: #fff; border-radius: 12px; display: block; margin: 0 auto; position: absolute; top: 52%; left: 50%; transform: translate(-50%, -50%); border: 2px solid #0e8c81; padding: 0px 20px; } .src04_notes { font-family: 'HelveticaNeueLTStd-Cn'; font-size: 18.67px; font-weight: bold; color: #31858d; width: 95%; padding: 9px 0; margin: 0 2.5%; border-bottom: 2px solid #31858d; padding-top: 14px; } .src04_popup_txt1 { top: 59px; position: absolute; left: 53px; font-family: 'HelveticaNeueLTStd-Cn'; ; font-size: 16px; color: #424242; } .src04_popup_txt2 { font-family: 'HelveticaNeueLTStd-Cn'; ; font-size: 16px; color: #424242; position: absolute; top: 112px; left: 52px; } .src04_arrow2 { width: 10px; height: 13px; background: url(../images/html_data/arrowIcon.png); background-size: 100% 100%; position: absolute; left: -18px; top: 2px; } /*slider4 end*/ /*slider06 */ .src06_wrapper { width: 1024px; height: 672px; overflow: hidden; position: relative; background: url(../images/html_data/scr06_bg.jpg) no-repeat scroll left top transparent; top: 0px; left: 0px; } .scr06_list1 { position: absolute; top: 202px; left: 37px; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .scr06_list2 { position: absolute; top: 265px; left: 37px; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .scr06_list3 { position: absolute; top: 327px; left: 37px; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .scr06_list4 { position: absolute; top: 369px; left: 37px; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .scr06_list5 { position: absolute; top: 409px; left: 37px; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .scr06_list6 { position: absolute; top: 452px; left: 37px; color: #424242; font-size: 17.33px; font-family: 'HelveticaNeueLTStd-Cn'; } .src06_popup { width: 1024px; height: 434px; background: rgba(0, 0, 0, 0.8); display: block; margin: 0 auto; position: absolute; top: 114px; left: 0px; display: none; z-index: 10; } .src06_popup_txt1, .src06_popup_txt2 { font-family: 'HelveticaNeueLTStd-Cn'; ; font-size: 16px; color: #424242; } .src06_poup_container { width: 635px; height: 320px; background-color: #fff; border-radius: 12px; display: block; margin: 0 auto; position: absolute; top: 52%; left: 50%; transform: translate(-50%, -50%); border: 2px solid #0e8c81; padding: 0px 20px; } .src06_notes { font-family: 'HelveticaNeueLTStd-Cn'; font-size: 18.67px; font-weight: bold; color: #31858d; width: 95%; padding: 9px 0; margin: 0 2.5%; border-bottom: 2px solid #31858d; padding-top: 14px; } .src06_popup_txt1 { top: 62px; position: absolute; left: 56px; font-family: 'HelveticaNeueLTStd-Cn'; ; font-size: 16px; color: #424242; } .src06_popup_txt2 { font-family: 'HelveticaNeueLTStd-Cn'; ; font-size: 16px; color: #424242; position: absolute; top: 91px; left: 56px; } .scr06_popup_close { width: 50px; height: 55px; background: url(../images/html_data/closeIcon.png) no-repeat; background-size: 100% 100%; position: absolute; top: 25px; right: 195px; border: 0px; cursor: pointer; } .scr06_info { background: url(../images/html_data/scr11_info.png) no-repeat top left; background-size: 59px 59px; position: absolute; top: 0; right: 0; width: 59px; height: 59px; cursor: pointer; } .src06_popup_txt3 { font-family: 'HelveticaNeueLTStd-Cn'; ; font-size: 16px; color: #424242; position: absolute; top: 125px; left: 56px; } .src06_popup_txt4 { font-family: 'HelveticaNeueLTStd-Cn'; ; font-size: 16px; color: #424242; position: absolute; top: 158px; left: 56px; } .src06_popup_txt5 { font-family: 'HelveticaNeueLTStd-Cn'; ; font-size: 16px; color: #424242; position: absolute; top: 191px; left: 56px; } .src06_popup_txt6 { font-family: 'HelveticaNeueLTStd-Cn'; ; font-size: 16px; color: #424242; position: absolute; top: 221px; left: 56px; } .src06_popup_txt7 { font-family: 'HelveticaNeueLTStd-Cn'; ; font-size: 16px; color: #424242; position: absolute; top: 253px; left: 56px; } .src06_arrow2 { width: 10px; height: 13px; background: url(../images/html_data/arrowIcon.png); background-size: 100% 100%; position: absolute; top: 4px; left: -20px; } /*slider06 end*/ /*slider7 start*/ .scr07_a{position: absolute;top: 160px;left: 60px;font-size: 16px;} .scr07_list1 { position: absolute; top: 185px; left: 42px; font-size: 16px; } .scr07_b{position: absolute;top: 260px;left: 60px;font-size: 16px;} .scr07_list2 { position: absolute; top: 288px; left: 42px; font-size: 16px; } .scr07_list3 { position: absolute; top: 350px; left: 42px; font-size: 16px; } .scr07_list4 { position: absolute; top: 415px; left: 42px; font-size: 16px; } .scr07_list5 { position: absolute; top: 510px; left: 520px; } .scr07_list6 { position: absolute; top: 514px; left: 765px; } .scr07_list7 { position: absolute; bottom: 70px; right: 562px; } .scr07_list8 { position: absolute; bottom: 63px; right: 336px; } .col_light_blue { color: #19b7b3; font-weight: bold; font-size: 16px; } .scr_04_directed { position: absolute; top: 0px; width: 380px; font-family: 'HelveticaNeueLTStd-Cn'; left: 17px; } .scr_07_directed { position: absolute; top: 0px; width: 415px; font-family: 'HelveticaNeueLTStd-Cn'; left: 17px; } .content1 { position: absolute; bottom: 244px; font-size: 13.33px; text-align: right; width: 100px; left: -12px; color: #000;font-weight: bold; } .content2 { position: absolute; bottom: 244px; font-size: 13.33px; text-align: right; width: 105px; left: -15px; color: #000;font-weight: bold; } .content3 { position: absolute; bottom: 238px; font-size: 13.33px; text-align: right; width: 100px; left: -12px; color: #000; } .content4 { position: absolute; bottom: 245px; font-size: 13.33px; text-align: right; width: 100px; left: -9px; color: #000; } .content5 { position: absolute; bottom: 96px; font-size: 13.33px; width: 48px; right: -143px; color: #000; } .scr07_list5 img { position: absolute; bottom: 75px; } .scr07_list6 img { position: absolute; bottom: 75px; } .scr07_list7 img { position: absolute; bottom: 75px; } .scr07_list8 img { position: absolute; bottom: 112px; } .a_light_blue { color: #19b7b3; position: absolute; bottom: 74px; right: 14px; font-size: 21.33px; } .right_btm { bottom: 77px !important; right: 2px !important; } /*slider7 end*/ /*slider8 Start*/ .scr08_list1 { position: absolute; top: 250px; left: 50px; } .scr08_list1 img { position: absolute; top: 15px; left: 0px; } .scr08_text1 { position: absolute; top: 50px; font-family: 'HelveticaNeueLTStd-Cn'; color: #fff; font-size: 15.33px; padding: 26px 0px; width: 200px; left: 108px; } .scr08_digit1 { position: absolute; left: 94px; font-size: 25.55px; font-family: 'HelveticaNeueLTStd-Bd'; color: #f85c72; top: -2px } .scr_08_step1 { position: absolute; top: -2px; font-size: 25.55px; font-family: 'HelveticaNeueLTStd-Bd'; color: #f85c72; left: 22px; } .scr08_list2 { position: absolute; top: 250px; left: 342px; color: #f85c72 } .scr08_list2 img { position: absolute; top: 15px; left: -15px; } .scr08_text2 { position: absolute; top: 58px; font-family: 'HelveticaNeueLTStd-Cn'; color: #fff; font-size: 15.33px; padding: 26px 0px; width: 200px; left: 98px; } .scr_08_step2 { position: absolute; top: -2px; font-size: 25.55px; font-family: 'HelveticaNeueLTStd-Bd'; color: #6a82fb; left: 12px; } .scr08_digit2 { position: absolute; left: 87px; font-size: 25.55px; font-family: 'HelveticaNeueLTStd-Bd'; color: #6a82fb; top: -2px; } .scr08_list3 { position: absolute; top: 250px; left: 624px; } .scr08_list3 img { position: absolute; top: 15px; left: -20px; } .scr08_text3 { position: absolute; top: 38px; font-family: 'HelveticaNeueLTStd-Cn'; color: #fff; font-size: 15.33px; padding: 26px 0px; width: 235px; left: 76px; ; } .scr_08_step3 { position: absolute; top: 0px; font-size: 25.55px; font-family: 'HelveticaNeueLTStd-Bd'; color: #813ce2; left: 7px;top: -2px; } .scr08_digit3 { position: absolute; left: 81px; font-size: 25.55px; font-family: 'HelveticaNeueLTStd-Bd'; color: #813ce2; top: -2px } /*slider8 end*/ /*slider9 Start*/ .src09_wrapper { width: 1024px; height: 672px; overflow: hidden; position: relative; background: url(../images/html_data/scr09_bg.jpg) no-repeat scroll left top transparent; top: 0px; left: 0px; } .scr09_list2 { position: absolute; top: 265px; left: 37px; } .scr09_list3 { position: absolute; top: 310px; left: 37px; } .scr09_list4 { position: absolute; top: 375px; left: 37px; } .scr09_list5 { position: absolute; top: 440px; left: 37px; } .src09_popup_txt1 { top: 58px; position: absolute; left: 53px; } .src09_popup_txt2 { position: absolute; top: 95px; left: 53px; } .src09_arrow2 { width: 10px; height: 13px; background: url(../images/html_data/arrowIcon.png); background-size: 100% 100%; position: absolute; top: 3px !important; left: -19px; top: 6px; } /*slider8 end*/ /*slider10 start*/ .src10_wrapper { width: 1024px; height: 672px; overflow: hidden; position: relative; background: url(../images/html_data/scr10_bg.jpg) no-repeat scroll left top transparent; top: 0px; left: 0px; } .scr10_list1 { position: absolute; top: 132px; left: 220px; } .scr10_list2 { position: absolute; top: 132px; right: 225px; } .scr10_text1 { position: absolute; bottom: -16px; left: 112px; font-family: 'HelveticaNeueLTStd-Md'; font-size: 13.33px; text-align: center; color: #000; } .scr10_text2 { position: absolute; bottom: -36px; left: 62px; font-family: 'HelveticaNeueLTStd-Md'; font-size: 13.33px; text-align: center; color: #000; } .src10_popup { width: 1024px; height: 434px; background: rgba(0, 0, 0, 0.8); display: block; margin: 0 auto; position: absolute; top: 114px; left: 0px; display: none; z-index: 10; } .src10_popup_txt1, .src06_popup_txt2 { font-family: 'HelveticaNeueLTStd-Cn'; ; font-size: 16px; color: #424242; } .src10_poup_container { background: url(../images/html_data/ref_popup06.png) no-repeat top left; position: absolute; top: 10px; left: 197px; width: 659px; margin-left: -21px; height: 100% } .src10_notes { font-family: 'HelveticaNeueLTStd-Cn'; font-size: 18.67px; font-weight: bold; color: #31858d; position: absolute; top: 57px; left: 36px; } .src10_popup_txt1 { top: 60px; position: absolute; left: 53px; font-family: 'HelveticaNeueLTStd-Cn'; ; font-size: 16px; color: #424242; } .src10_popup_txt2 { font-family: 'HelveticaNeueLTStd-Cn'; font-size: 16px; color: #424242; position: absolute; top: 108px; left: 53px; } .scr10_popup_close { width: 52px; height: 44px; background: white; position: absolute; top: -3px; right: 21px; opacity: 0; cursor: pointer; border: 1px solid white; } .src10_popup_txt3 { font-family: 'HelveticaNeueLTStd-Cn'; font-size: 16px; color: #424242; position: absolute; top: 154px; left: 53px; } .src10_popup_txt4 { font-family: 'HelveticaNeueLTStd-Cn'; font-size: 16px; color: #424242; position: absolute; top: 200px; left: 53px; } .src10_popup_txt5 { font-family: 'HelveticaNeueLTStd-Cn'; font-size: 16px; color: #424242; position: absolute; top: 244px; left: 53px; } .src10_popup_close { width: 52px; height: 44px; background: white; position: absolute; top: -3px; right: 21px; opacity: 0; cursor: pointer; border: 1px solid white; } /*slider10 end*/