@charset "utf-8";/* CSS Document */@import url('https://fonts.googleapis.com/css?family=Handlee');/*fonts properties*/@font-face {font-family: 'proxima_nova_rgbold';src: url('fonts/proxima_nova_bold-webfont.woff2') format('woff2'), url('fonts/proxima_nova_bold-webfont.woff') format('woff');}@font-face {font-family: 'proxima_nova_ltsemibold';src: url('fonts/proxima_nova_semibold-webfont.woff2') format('woff2'), url('fonts/proxima_nova_semibold-webfont.woff') format('woff');}@font-face {font-family: 'proxima_nova_ltlight';src: url('fonts/proxima_nova_light-webfont.woff2') format('woff2'), url('fonts/proxima_nova_light-webfont.woff') format('woff');}@font-face {font-family: 'proxima_nova_rgregular';src: url('fonts/proxima_nova_regular-webfont.woff2') format('woff2'), url('fonts/proxima_nova_regular-webfont.woff') format('woff');}@font-face {font-family: 'proxima_novathin';src: url('fonts/proxima_nova_thin-webfont.woff2') format('woff2'), url('fonts/proxima_nova_thin-webfont.woff') format('woff');}.handlee {font-family: 'Handlee', cursive;} .proxima_nova_ltsemibold{ font-family:'proxima_nova_ltsemibold', sans-serif;}
/*special properties*/.auto {margin: auto;}.db {display: block}.dib {display: inline-block}.inline {display: inline}.dn {display: none}.abs {position: absolute}.rel {position: relative}.hand {cursor: pointer}.z99 {z-index: 99}.o-hid {overflow: hidden}.o-auto {overflow: auto}.o-y {overflow-y: auto;overflow-x: hidden}.fix {position: fixed;}/*font properties*/.b {font-weight: 700}.i {font-style: italic}.u {text-decoration: underline}.n {font-style: normal;font-weight: 400;text-decoration: none;text-transform: none}.bcs {border-collapse: separate}.nw {white-space: nowrap}.ttc {text-transform: capitalize}.ttl {text-transform: lowercase}.ttu {text-transform: uppercase}.fvsc {font-variant: small-caps}.nw {white-space: nowrap}.ttc {text-transform: capitalize}.ttl {text-transform: lowercase}.ttu {text-transform: uppercase}.fvsc {font-variant: small-caps}.fs10 {font-size: 10px}.fs11 {font-size: 11px}.fs12 {font-size: 12px}.fs13 {font-size: 13px}.fs14 {font-size: 14px}.fs15 {font-size: 15px}.fs16 {font-size: 16px}.fs17 {font-size: 17px}.fs18 {font-size: 18px}.fs19 {font-size: 19px}.fs20 {font-size: 20px}.fs21 {font-size: 21px}.fs22 {font-size: 22px}.fs23 {font-size: 23px}.fs24 {font-size: 24px}.fs26 {font-size: 26px}.fs28 {font-size: 28px}.fs29 {font-size: 29px}.fs30 {font-size: 30px}.fs32 {font-size: 32px}.fs34 {font-size: 34px}.fs36 {font-size: 36px}.fs37 {font-size: 37px}.fs40 {font-size: 40px}.fs51 {font-size: 51px;}.lh0em {line-height: 0}.lh02em {line-height: .2em}.lh05em {line-height: .5em}.lh1em {line-height: 1em}.lh07em {line-height: .9em}.lh12em {line-height: 1.2em}.lh13em {line-height: 1.3em}.lh15em {line-height: 1.5em}.lh2em {line-height: 2em}.lh18px {line-height: 18px}.black, .black a, .black a:hover {color: #222}.black1, .black1 a, .black1 a:hover {color: #101315}.gray, .gray a, .gray a:hover {color: #858585}.gray1, .gray1 a, .gray1 a:hover {color: #888}.gray2, .gray2 a, .gray2 a:hover {color: #999}.red, .red a, .red a:hover {color: #d92424}.pink, .pink a, .pink a:hover {color: #ff0096}.pink1, .pink1 a, .pink1 a:hover {color: #c81d98}.orange, .orange a, .orange a:hover {color: #ec750e}.white, .white a, .white a:hover {color: #fff}.pale, .pale a, .pale a:hover {color: #f07d00}.green, .green a, .green a:hover {color: #43ab4a}.blue, .blue a, .blue a:hover {color: #0e8bec}.blue1, .blue1 a, .blue1 a:hover {color: #164e7c}.blue2, .blue2 a, .blue2 a:hover {color: #c0d8e1}.yellow, .yellow a, yellow a:hover {color: #0e8bec}/*ALIGNMENT STYLES*/.al {text-align: left}.ar {text-align: right}.ac {text-align: center}.aj {text-align: justify}.vat {vertical-align: top}.vam {vertical-align: middle}.vab {vertical-align: bottom}.fl {display: inline;float: left}.fr {display: inline;float: right}p.cb {content: '.';display: block;font-size: 0;height: 0;line-height: 0;margin: 0;padding: 0}.cb {clear: both;line-height: 0;height: 0;}.cl {clear: left}.cr {clear: right}.lt {text-decoration: line-through}/*margin-style*/.m0-2 {margin: 0px 2px;}.m0-5 {margin: 0px 5px;}.m0-10 {margin: 0px 10px;}.m2-0 {margin: 2px 0px;}.m5-0 {margin: 5px 0px;}.m10-0 {margin: 10px 0px;}.m5-10 {margin: 5px 10px;}.m5-20 {margin: 5px 20px;}.m1 {margin: 1px;}.m2 {margin: 2px;}.m3 {margin: 3px;}.m4 {margin: 4px;}.m5 {margin: 5px;}.m6 {margin: 6px;}.m7 {margin: 7px;}.m8 {margin: 8px;}.m9 {margin: 9px;}.m10 {margin: 10px;}.m11 {margin: 11px;}.m12 {margin: 12px;}.m13 {margin: 13px;}.m14 {margin: 14px;}.m15 {margin: 15px;}.m16 {margin: 16px;}.m17 {margin: 17px;}.m18 {margin: 18px;}.m19 {margin: 19px;}.m21 {margin: 21px;}.m22 {margin: 22px;}.m23 {margin: 23px;}.m24 {margin: 24px;}.m25 {margin: 25px;}.m30 {margin: 30px;}.mt1 {margin-top: 1px}.mt2 {margin-top: 2px}.mt3 {margin-top: 3px}.mt4 {margin-top: 4px}.mt5 {margin-top: 5px}.mt6 {margin-top: 6px}.mt7 {margin-top: 7px}.mt8 {margin-top: 8px}.mt9 {margin-top: 9px}.mt10 {margin-top: 10px}.mt11 {margin-top: 11px}.mt12 {margin-top: 12px}.mt13 {margin-top: 13px}.mt14 {margin-top: 14px}.mt15 {margin-top: 15px}.mt16 {margin-top: 16px}.mt17 {margin-top: 17px}.mt18 {margin-top: 18px}.mt19 {margin-top: 19px}.mt20 {margin-top: 20px}.mt21 {margin-top: 21px}.mt22 {margin-top: 22px}.mt23 {margin-top: 23px}.mt24 {margin-top: 24px}.mt25 {margin-top: 25px}.mt26 {margin-top: 26px}.mt27 {margin-top: 27px}.mt28 {margin-top: 28px}.mt29 {margin-top: 29px}.mt30 {margin-top: 30px}.mt31 {margin-top: 31px}.mt32 {margin-top: 32px}.mt33 {margin-top: 33px}.mt34 {margin-top: 34px}.mt35 {margin-top: 35px}.mt36 {margin-top: 36px}.mt37 {margin-top: 37px}.mt38 {margin-top: 38px}.mt39 {margin-top: 39px}.mt40 {margin-top: 40px}.mt41 {margin-top: 41px}.mt42 {margin-top: 42px}.mt43 {margin-top: 43px}.mt44 {margin-top: 44px}.mt45 {margin-top: 45px}.mt46 {margin-top: 46px}.mt47 {margin-top: 47px}.mt48 {margin-top: 48px}.mt49 {margin-top: 49px}.mt50 {margin-top: 50px}.mt51 {margin-top: 51px}.mt52 {margin-top: 52px}.mt53 {margin-top: 53px}.mt54 {margin-top: 54px}.mt55 {margin-top: 55px}.mt56 {margin-top: 56px}.mt57 {margin-top: 57px}.mt58 {margin-top: 58px}.mt59 {margin-top: 59px}.mt60 {margin-top: 60px}.mt61 {margin-top: 61px}.mt62 {margin-top: 62px}.mt63 {margin-top: 63px}.mt64 {margin-top: 64px}.mt65 {margin-top: 65px}.mt66 {margin-top: 66px}.mt67 {margin-top: 67px}.mt68 {margin-top: 68px}.mt69 {margin-top: 69px}.mt70 {margin-top: 70px}.mt71 {margin-top: 71px}.mt72 {margin-top: 72px}.mt73 {margin-top: 73px}.mt74 {margin-top: 74px}.mt75 {margin-top: 75px}.mt76 {margin-top: 76px}.mt77 {margin-top: 77px}.mt78 {margin-top: 78px}.mt79 {margin-top: 79px}.mt80 {margin-top: 80px}.mt81 {margin-top: 81px}.mt82 {margin-top: 82px}.mt83 {margin-top: 83px}.mt84 {margin-top: 84px}.mt85 {margin-top: 85px}.mt86 {margin-top: 86px}.mt87 {margin-top: 87px}.mt88 {margin-top: 88px}.mt89 {margin-top: 89px}.mt90 {margin-top: 90px}.mt91 {margin-top: 91px}.mt92 {margin-top: 92px}.mt93 {margin-top: 93px}.mt94 {margin-top: 94px}.mt95 {margin-top: 95px}.mt96 {margin-top: 96px}.mt97 {margin-top: 97px}.mt98 {margin-top: 98px}.mt99 {margin-top: 99px}.mt100 {margin-top: 100px}.mt120 {margin-top: 120px}.mt150 {margin-top: 150px}.mr1 {margin-right: 1px}.mr2 {margin-right: 2px}.mr3 {margin-right: 3px}.mr4 {margin-right: 4px}.mr5 {margin-right: 5px}.mr6 {margin-right: 6px}.mr7 {margin-right: 7px}.mr8 {margin-right: 8px}.mr9 {margin-right: 9px}.mr10 {margin-right: 10px}.mr11 {margin-right: 11px}.mr12 {margin-right: 12px}.mr13 {margin-right: 13px}.mr14 {margin-right: 14px}.mr15 {margin-right: 15px}.mr16 {margin-right: 16px}.mr17 {margin-right: 17px}.mr18 {margin-right: 18px}.mr19 {margin-right: 19px}.mr20 {margin-right: 20px}.mr21 {margin-right: 21px}.mr22 {margin-right: 22px}.mr23 {margin-right: 23px}.mr24 {margin-right: 24px}.mr25 {margin-right: 25px}.mr26 {margin-right: 26px}.mr27 {margin-right: 27px}.mr28 {margin-right: 28px}.mr29 {margin-right: 29px}.mr30 {margin-right: 30px}.mr31 {margin-right: 31px}.mr32 {margin-right: 32px}.mr33 {margin-right: 33px}.mr34 {margin-right: 34px}.mr35 {margin-right: 35px}.mr36 {margin-right: 36px}.mr37 {margin-right: 37px}.mr38 {margin-right: 38px}.mr39 {margin-right: 39px}.mr40 {margin-right: 40px}.mr41 {margin-right: 41px}.mr42 {margin-right: 42px}.mr43 {margin-right: 43px}.mr44 {margin-right: 44px}.mr45 {margin-right: 45px}.mr46 {margin-right: 46px}.mr47 {margin-right: 47px}.mr48 {margin-right: 48px}.mr49 {margin-right: 49px}.mr50 {margin-right: 50px}.mr51 {margin-right: 51px}.mr52 {margin-right: 52px}.mr53 {margin-right: 53px}.mr54 {margin-right: 54px}.mr55 {margin-right: 55px}.mr56 {margin-right: 56px}.mr57 {margin-right: 57px}.mr58 {margin-right: 58px}.mr59 {margin-right: 59px}.mr60 {margin-right: 60px}.mr61 {margin-right: 61px}.mr62 {margin-right: 62px}.mr63 {margin-right: 63px}.mr64 {margin-right: 64px}.mr65 {margin-right: 65px}.mr66 {margin-right: 66px}.mr67 {margin-right: 67px}.mr68 {margin-right: 68px}.mr69 {margin-right: 69px}.mr70 {margin-right: 70px}.mr71 {margin-right: 71px}.mr72 {margin-right: 72px}.mr73 {margin-right: 73px}.mr74 {margin-right: 74px}.mr75 {margin-right: 75px}.mr76 {margin-right: 76px}.mr77 {margin-right: 77px}.mr78 {margin-right: 78px}.mr79 {margin-right: 79px}.mr80 {margin-right: 80px}.mr81 {margin-right: 81px}.mr82 {margin-right: 82px}.mr83 {margin-right: 83px}.mr84 {margin-right: 84px}.mr85 {margin-right: 85px}.mr86 {margin-right: 86px}.mr87 {margin-right: 87px}.mr88 {margin-right: 88px}.mr89 {margin-right: 89px}.mr90 {margin-right: 90px}.mr91 {margin-right: 91px}.mr92 {margin-right: 92px}.mr93 {margin-right: 93px}.mr94 {margin-right: 94px}.mr95 {margin-right: 95px}.mr96 {margin-right: 96px}.mr97 {margin-right: 97px}.mr98 {margin-right: 98px}.mr99 {margin-right: 99px}.mr100 {margin-right: 100px}.m0 {margin: 0 !important}.ml1 {margin-left: 1px}.ml2 {margin-left: 2px}.ml3 {margin-left: 3px}.ml4 {margin-left: 4px}.ml5 {margin-left: 5px}.ml6 {margin-left: 6px}.ml7 {margin-left: 7px}.ml8 {margin-left: 8px}.ml9 {margin-left: 9px}.ml10 {margin-left: 10px}.ml11 {margin-left: 11px}.ml12 {margin-left: 12px}.ml13 {margin-left: 13px}.ml14 {margin-left: 14px}.ml15 {margin-left: 15px}.ml16 {margin-left: 16px}.ml17 {margin-left: 17px}.ml18 {margin-left: 18px}.ml19 {margin-left: 19px}.ml20 {margin-left: 20px}.ml21 {margin-left: 21px}.ml22 {margin-left: 22px}.ml23 {margin-left: 23px}.ml24 {margin-left: 24px}.ml25 {margin-left: 25px}.ml26 {margin-left: 26px}.ml27 {margin-left: 27px}.ml28 {margin-left: 28px}.ml29 {margin-left: 29px}.ml30 {margin-left: 30px}.ml31 {margin-left: 31px}.ml32 {margin-left: 32px}.ml33 {margin-left: 33px}.ml34 {margin-left: 34px}.ml35 {margin-left: 35px}.ml36 {margin-left: 36px}.ml37 {margin-left: 37px}.ml38 {margin-left: 38px}.ml39 {margin-left: 39px}.ml40 {margin-left: 40px}.ml41 {margin-left: 41px}.ml42 {margin-left: 42px}.ml43 {margin-left: 43px}.ml44 {margin-left: 44px}.ml45 {margin-left: 45px}.ml46 {margin-left: 46px}.ml47 {margin-left: 47px}.ml48 {margin-left: 48px}.ml49 {margin-left: 49px}.ml50 {margin-left: 50px}.ml51 {margin-left: 51px}.ml52 {margin-left: 52px}.ml53 {margin-left: 53px}.ml54 {margin-left: 54px}.ml55 {margin-left: 55px}.ml56 {margin-left: 56px}.ml57 {margin-left: 57px}.ml58 {margin-left: 58px}.ml59 {margin-left: 59px}.ml60 {margin-left: 60px}.ml61 {margin-left: 61px}.ml62 {margin-left: 62px}.ml63 {margin-left: 63px}.ml64 {margin-left: 64px}.ml65 {margin-left: 65px}.ml66 {margin-left: 66px}.ml67 {margin-left: 67px}.ml68 {margin-left: 68px}.ml69 {margin-left: 69px}.ml70 {margin-left: 70px}.ml71 {margin-left: 71px}.ml72 {margin-left: 72px}.ml73 {margin-left: 73px}.ml74 {margin-left: 74px}.ml75 {margin-left: 75px}.ml76 {margin-left: 76px}.ml77 {margin-left: 77px}.ml78 {margin-left: 78px}.ml79 {margin-left: 79px}.ml80 {margin-left: 80px}.ml81 {margin-left: 81px}.ml82 {margin-left: 82px}.ml83 {margin-left: 83px}.ml84 {margin-left: 84px}.ml85 {margin-left: 85px}.ml86 {margin-left: 86px}.ml87 {margin-left: 87px}.ml88 {margin-left: 88px}.ml89 {margin-left: 89px}.ml90 {margin-left: 90px}.ml91 {margin-left: 91px}.ml92 {margin-left: 92px}.ml93 {margin-left: 93px}.ml94 {margin-left: 94px}.ml95 {margin-left: 95px}.ml96 {margin-left: 96px}.ml97 {margin-left: 97px}.ml98 {margin-left: 98px}.ml99 {margin-left: 99px}.ml100 {margin-left: 100px}.mb1 {margin-bottom: 1px}.mb2 {margin-bottom: 2px}.mb3 {margin-bottom: 3px}.mb4 {margin-bottom: 4px}.mb5 {margin-bottom: 5px}.mb6 {margin-bottom: 6px}.mb7 {margin-bottom: 7px}.mb8 {margin-bottom: 8px}.mb9 {margin-bottom: 9px}.mb10 {margin-bottom: 10px}.mb11 {margin-bottom: 11px}.mb12 {margin-bottom: 12px}.mb13 {margin-bottom: 13px}.mb14 {margin-bottom: 14px}.mb15 {margin-bottom: 15px}.mb16 {margin-bottom: 16px}.mb17 {margin-bottom: 17px}.mb18 {margin-bottom: 18px}.mb19 {margin-bottom: 19px}.mb20 {margin-bottom: 20px}.mb21 {margin-bottom: 21px}.mb22 {margin-bottom: 22px}.mb23 {margin-bottom: 23px}.mb24 {margin-bottom: 24px}.mb25 {margin-bottom: 25px}.mb26 {margin-bottom: 26px}.mb27 {margin-bottom: 27px}.mb28 {margin-bottom: 28px}.mb29 {margin-bottom: 29px}.mb30 {margin-bottom: 30px}.mb31 {margin-bottom: 31px}.mb32 {margin-bottom: 32px}.mb33 {margin-bottom: 33px}.mb34 {margin-bottom: 34px}.mb35 {margin-bottom: 35px}.mb36 {margin-bottom: 36px}.mb37 {margin-bottom: 37px}.mb38 {margin-bottom: 38px}.mb39 {margin-bottom: 39px}.mb40 {margin-bottom: 40px}.mb41 {margin-bottom: 41px}.mb42 {margin-bottom: 42px}.mb43 {margin-bottom: 43px}.mb44 {margin-bottom: 44px}.mb45 {margin-bottom: 45px}.mb46 {margin-bottom: 46px}.mb47 {margin-bottom: 47px}.mb48 {margin-bottom: 48px}.mb49 {margin-bottom: 49px}.mb50 {margin-bottom: 50px}.mb51 {margin-bottom: 51px}.mb52 {margin-bottom: 52px}.mb53 {margin-bottom: 53px}.mb54 {margin-bottom: 54px}.mb55 {margin-bottom: 55px}.mb56 {margin-bottom: 56px}.mb57 {margin-bottom: 57px}.mb58 {margin-bottom: 58px}.mb59 {margin-bottom: 59px}.mb60 {margin-bottom: 60px}.mb61 {margin-bottom: 61px}.mb62 {margin-bottom: 62px}.mb63 {margin-bottom: 63px}.mb64 {margin-bottom: 64px}.mb65 {margin-bottom: 65px}.mb66 {margin-bottom: 66px}.mb67 {margin-bottom: 67px}.mb68 {margin-bottom: 68px}.mb69 {margin-bottom: 69px}.mb70 {margin-bottom: 70px}.mb71 {margin-bottom: 71px}.mb72 {margin-bottom: 72px}.mb73 {margin-bottom: 73px}.mb74 {margin-bottom: 74px}.mb75 {margin-bottom: 75px}.mb76 {margin-bottom: 76px}.mb77 {margin-bottom: 77px}.mb78 {margin-bottom: 78px}.mb79 {margin-bottom: 79px}.mb80 {margin-bottom: 80px}.mb81 {margin-bottom: 81px}.mb82 {margin-bottom: 82px}.mb83 {margin-bottom: 83px}.mb84 {margin-bottom: 84px}.mb85 {margin-bottom: 85px}.mb86 {margin-bottom: 86px}.mb87 {margin-bottom: 87px}.mb88 {margin-bottom: 88px}.mb89 {margin-bottom: 89px}.mb90 {margin-bottom: 90px}.mb91 {margin-bottom: 91px}.mb92 {margin-bottom: 92px}.mb93 {margin-bottom: 93px}.mb94 {margin-bottom: 94px}.mb95 {margin-bottom: 95px}.mb96 {margin-bottom: 96px}.mb97 {margin-bottom: 97px}.mb98 {margin-bottom: 98px}.mb99 {margin-bottom: 99px}.mb100 {margin-bottom: 100px}/*padding-style*/.p0-2 {padding: 0px 2px;}.p0-5 {padding: 0px 5px;}.p0-10 {padding: 0px 10px;}.p1-5 {padding: 1px 5px;}.p1-10 {padding: 1px 10px;}.p1-15 {padding: 1px 15px;}.p2-5 {padding: 2px 5px;}.p2-10 {padding: 2px 10px;}.p2-15 {padding: 2px 15px;}.p3-5 {padding: 3px 5px;}.p3-10 {padding: 3px 10px;}.p3-15 {padding: 3px 15px;}.p2-0 {padding: 2px 0px;}.p5-0 {padding: 5px 0px;}.p10-0 {padding: 10px 0px;}.p5-10 {padding: 5px 10px;}.p5-15 {padding: 5px 15px;}.p5-20 {padding: 5px 20px;}.p10-15 {padding: 10px 15px;}.p10-20 {padding: 10px 20px;}.p1 {padding: 1px;}.p2 {padding: 2px;}.p3 {padding: 3px;}.p4 {padding: 4px;}.p5 {padding: 5px;}.p6 {padding: 6px;}.p7 {padding: 7px;}.p8 {padding: 8px;}.p9 {padding: 9px;}.p10 {padding: 10px;}.p11 {padding: 11px;}.p12 {padding: 12px;}.p13 {padding: 13px;}.p14 {padding: 14px;}.p15 {padding: 15px;}.p16 {padding: 16px;}.p17 {padding: 17px;}.p18 {padding: 18px;}.p19 {padding: 19px;}.p20 {padding: 20px;}.p21 {padding: 21px;}.p22 {padding: 22px;}.p23 {padding: 23px;}.p24 {padding: 24px;}.p25 {padding: 25px;}.p30 {padding: 30px;}.pt1 {padding-top: 1px}.pt2 {padding-top: 2px}.pt3 {padding-top: 3px}.pt4 {padding-top: 4px}.pt5 {padding-top: 5px}.pt6 {padding-top: 6px}.pt7 {padding-top: 7px}.pt8 {padding-top: 8px}.pt9 {padding-top: 9px}.pt10 {padding-top: 10px}.pt11 {padding-top: 11px}.pt12 {padding-top: 12px}.pt13 {padding-top: 13px}.pt14 {padding-top: 14px}.pt15 {padding-top: 15px}.pt16 {padding-top: 16px}.pt17 {padding-top: 17px}.pt18 {padding-top: 18px}.pt19 {padding-top: 19px}.pt20 {padding-top: 20px}.pt21 {padding-top: 21px}.pt22 {padding-top: 22px}.pt23 {padding-top: 23px}.pt24 {padding-top: 24px}.pt25 {padding-top: 25px}.pt26 {padding-top: 26px}.pt27 {padding-top: 27px}.pt28 {padding-top: 28px}.pt29 {padding-top: 29px}.pt30 {padding-top: 30px}.pt31 {padding-top: 31px}.pt32 {padding-top: 32px}.pt33 {padding-top: 33px}.pt34 {padding-top: 34px}.pt35 {padding-top: 35px}.pt36 {padding-top: 36px}.pt37 {padding-top: 37px}.pt38 {padding-top: 38px}.pt39 {padding-top: 39px}.pt40 {padding-top: 40px}.pt41 {padding-top: 41px}.pt42 {padding-top: 42px}.pt43 {padding-top: 43px}.pt44 {padding-top: 44px}.pt45 {padding-top: 45px}.pt46 {padding-top: 46px}.pt47 {padding-top: 47px}.pt48 {padding-top: 48px}.pt49 {padding-top: 49px}.pt50 {padding-top: 50px}.pt60 {padding-top: 60px}.pt70 {padding-top: 70px}.pt95 {padding-top: 95px}.pt100 {padding-top: 100px}.pr1 {padding-right: 1px}.pr2 {padding-right: 2px}.pr3 {padding-right: 3px}.pr4 {padding-right: 4px}.pr5 {padding-right: 5px}.pr6 {padding-right: 6px}.pr7 {padding-right: 7px}.pr8 {padding-right: 8px}.pr9 {padding-right: 9px}.pr10 {padding-right: 10px}.pr11 {padding-right: 11px}.pr12 {padding-right: 12px}.pr13 {padding-right: 13px}.pr14 {padding-right: 14px}.pr15 {padding-right: 15px}.pr16 {padding-right: 16px}.pr17 {padding-right: 17px}.pr18 {padding-right: 18px}.pr19 {padding-right: 19px}.pr20 {padding-right: 20px}.pr21 {padding-right: 21px}.pr22 {padding-right: 22px}.pr23 {padding-right: 23px}.pr24 {padding-right: 24px}.pr25 {padding-right: 25px}.pr26 {padding-right: 26px}.pr27 {padding-right: 27px}.pr28 {padding-right: 28px}.pr29 {padding-right: 29px}.pr30 {padding-right: 30px}.pr31 {padding-right: 31px}.pr32 {padding-right: 32px}.pr33 {padding-right: 33px}.pr34 {padding-right: 34px}.pr35 {padding-right: 35px}.pr36 {padding-right: 36px}.pr37 {padding-right: 37px}.pr38 {padding-right: 38px}.pr39 {padding-right: 39px}.pr40 {padding-right: 40px}.pr41 {padding-right: 41px}.pr42 {padding-right: 42px}.pr43 {padding-right: 43px}.pr44 {padding-right: 44px}.pr45 {padding-right: 45px}.pr46 {padding-right: 46px}.pr47 {padding-right: 47px}.pr48 {padding-right: 48px}.pr49 {padding-right: 49px}.pr50 {padding-right: 50px}.pl1 {padding-left: 1px}.pl2 {padding-left: 2px}.pl3 {padding-left: 3px}.pl4 {padding-left: 4px}.pl5 {padding-left: 5px}.pl6 {padding-left: 6px}.pl7 {padding-left: 7px}.pl8 {padding-left: 8px}.pl9 {padding-left: 9px}.pl10 {padding-left: 10px}.pl11 {padding-left: 11px}.pl12 {padding-left: 12px}.pl13 {padding-left: 13px}.pl14 {padding-left: 14px}.pl15 {padding-left: 15px}.pl16 {padding-left: 16px}.pl17 {padding-left: 17px}.pl18 {padding-left: 18px}.pl19 {padding-left: 19px}.pl20 {padding-left: 20px}.pl21 {padding-left: 21px}.pl22 {padding-left: 22px}.pl23 {padding-left: 23px}.pl24 {padding-left: 24px}.pl25 {padding-left: 25px}.pl26 {padding-left: 26px}.pl27 {padding-left: 27px}.pl28 {padding-left: 28px}.pl29 {padding-left: 29px}.pl30 {padding-left: 30px}.pl31 {padding-left: 31px}.pl32 {padding-left: 32px}.pl33 {padding-left: 33px}.pl34 {padding-left: 34px}.pl35 {padding-left: 35px}.pl36 {padding-left: 36px}.pl37 {padding-left: 37px}.pl38 {padding-left: 38px}.pl39 {padding-left: 39px}.pl40 {padding-left: 40px}.pl41 {padding-left: 41px}.pl42 {padding-left: 42px}.pl43 {padding-left: 43px}.pl44 {padding-left: 44px}.pl45 {padding-left: 45px}.pl46 {padding-left: 46px}.pl47 {padding-left: 47px}.pl48 {padding-left: 48px}.pl49 {padding-left: 49px}.pl50 {padding-left: 50px}.pl60 {padding-left: 60px}.pl65 {padding-left: 65px}.pl70 {padding-left: 70px}.pl80 {padding-left: 80px}.pb0 {padding-bottom: 0px}.pb1 {padding-bottom: 1px}.pb2 {padding-bottom: 2px}.pb3 {padding-bottom: 3px}.pb4 {padding-bottom: 4px}.pb5 {padding-bottom: 5px}.pb6 {padding-bottom: 6px}.pb7 {padding-bottom: 7px}.pb8 {padding-bottom: 8px}.pb9 {padding-bottom: 9px}.pb10 {padding-bottom: 10px}.pb11 {padding-bottom: 11px}.pb12 {padding-bottom: 12px}.pb13 {padding-bottom: 13px}.pb14 {padding-bottom: 14px}.pb15 {padding-bottom: 15px}.pb16 {padding-bottom: 16px}.pb17 {padding-bottom: 17px}.pb18 {padding-bottom: 18px}.pb19 {padding-bottom: 19px}.pb20 {padding-bottom: 20px}.pb21 {padding-bottom: 21px}.pb22 {padding-bottom: 22px}.pb23 {padding-bottom: 23px}.pb24 {padding-bottom: 24px}.pb25 {padding-bottom: 25px}.pb26 {padding-bottom: 26px}.pb27 {padding-bottom: 27px}.pb28 {padding-bottom: 28px}.pb29 {padding-bottom: 29px}.pb30 {padding-bottom: 30px}.pb31 {padding-bottom: 31px}.pb32 {padding-bottom: 32px}.pb33 {padding-bottom: 33px}.pb34 {padding-bottom: 34px}.pb35 {padding-bottom: 35px}.pb36 {padding-bottom: 36px}.pb37 {padding-bottom: 37px}.pb38 {padding-bottom: 38px}.pb39 {padding-bottom: 39px}.pb40 {padding-bottom: 40px}.pb41 {padding-bottom: 41px}.pb42 {padding-bottom: 42px}.pb43 {padding-bottom: 43px}.pb44 {padding-bottom: 44px}.pb45 {padding-bottom: 45px}.pb46 {padding-bottom: 46px}.pb47 {padding-bottom: 47px}.pb48 {padding-bottom: 48px}.pb49 {padding-bottom: 49px}.pb50 {padding-bottom: 50px}.pt0 {padding-top: 0 !important;} /*$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$ CSS Document by Anil $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$*/.weight200 {font-weight: 200;}.weight300 {font-weight: 300;}.weight400 {font-weight: 400;}.weight500 {font-weight: 500;}.weight600 {font-weight: 600;}.weight700 {font-weight: 700;}.weight800 {font-weight: 800;}.weight900 {font-weight: 900;}p, h6, h5, ul, li, img, span, h3, h1, h2, h3, h4, a, input, div {margin: 0px;padding: 0px;border: 0px;outline: none;}/* BACKGROUND */.bg-white {background: #fff;}.bg-white1 {background: #fff;box-shadow: 1px 1px 1px rgba(0,0,0,.1);}.bg-black {background: #000;}.bg-pale {background: #fffae0;border: 1px dashed #ee7d21;}.bg-pale1 {background: #f0eeb6;}.bg-pale2 {background: #fffdc5;border: 1px solid #efe08e;}.bg-gray {background: #f6f6f6;}.bg-gray1 {background: #444;}.bg-gray2 {background: #efefef;}.bg-gray3 {background: #666;}.bg-gray4 {background: #f1f1f1;}.bg-gray5 {background: #222;}.bg-blue {background: #0a4d7e;}.bg-red {background: #da2d1c;}.bg-orange {background: #f3a344;}.bg-green {background: #ebfaec;}.bg-green1 {background: #fafecf;border: 1px solid #cbd474;}/* LINE HEIGHT */.lht-10 {line-height: 10px;}.lht-12 {line-height: 12px;}.lht-13 {line-height: 13px;}.lht-14 {line-height: 14px;}.lht-15 {line-height: 15px;}.lht-16 {line-height: 16px;}.lht-17 {line-height: 17px;}.lht-18 {line-height: 18px;}.lht-19 {line-height: 19px;}.lht-20 {line-height: 20px;}.lht-22 {line-height: 22px;}.lht-24 {line-height: 24px;}.lht-26 {line-height: 26px;}.lht-28 {line-height: 28px;}.lht-30 {line-height: 30px;}.lht-32 {line-height: 32px;}.lht-36 {line-height: 36px;}.lht-37 {line-height: 37px;}/* BORDER */.bb {border-bottom: 1px solid #d9d9d9;}.bb1 {border-top: 1px solid #f1f1f1;}.bb2 {border-bottom: 1px solid #f1f1f1;}.bb3 {border-bottom: 2px solid #eee;}.bb5 {border-bottom: 2px solid #fff;}.bt {border-top: 1px solid #f1f1f1}.bt2 {border-top: 1px solid #eee;}.border1 {border: 1px solid #eee;}.border2 {border: 1px solid #ddd;}.border3 {border: 10px solid #efefef;}a {color: #333;text-decoration: none;}a:hover {color: #ff9600;text-decoration: none;}a.uo, a.uo:visited {text-decoration: none;}a.uo:hover {text-decoration: underline !important;}a.uu, a.uu:visited {text-decoration: underline;}a.uu:hover {text-decoration: none !important;}/*Back to top button */#back-top {position: fixed;bottom: 100px;right: 10px;z-index: 3;display: block;}#back-top .btn-default {display: inline-block;background: #fff;overflow: hidden;padding: 7px 0;border-radius: 100%;line-height: inherit !important;color: #708294;width: 50px;height: 50px;box-shadow: 0 0 10px 1px rgba(112,130,148,0.3);border: 0;font-size: 30px;}/*button clasess*//*mobile menu clasess*/#wrapper {padding-left: 0;-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;}#wrapper.toggled {padding-left: 220px;}#sidebar-wrapper {z-index: 1000;left: 230px;width: 0;height: 100%;margin-left: -230px;overflow-y: auto;overflow-x: hidden;background: #1262c0;-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;}#sidebar-wrapper::-webkit-scrollbar {display: none;}#wrapper.toggled #sidebar-wrapper {width: 220px;}#page-content-wrapper {width: 100%;}#wrapper.toggled #page-content-wrapper {position: absolute;margin-right: -220px;}/*-------------------------------*//*     Sidebar nav styles        *//*-------------------------------*/.sidebar-nav {position: absolute;top: 0;width: 230px;margin: 0;padding: 0;list-style: none;}.sidebar-nav li {position: relative;line-height: 20px;display: inline-block;width: 100%;}.sidebar-nav li:before {content: '';position: absolute;top: 0;left: 0;z-index: -1;height: 100%;width: 3px;}.sidebar-nav li a {display: block;font-size: 18px;color: #fff !important;font-family: 'proxima_nova_rgregular', sans-serif;text-decoration: none;background: none !important;padding: 14px 15px 14px 15px;border-bottom: 1px solid #1b6dcc;}.sidebar-nav li a:hover, .sidebar-nav li.open a:hover {color: #fff;background: #0b58b3 !important;text-decoration: none;}.sidebar-nav li>.sub_nav>a {display: block;font-size: 14px;color: #fff;font-family: 'proxima_nova_rgregular', sans-serif;text-decoration: none;background: #0b58b3 !important;padding: 8px 10px 8px 25px;border-bottom: 1px solid #105fbd !important;}/*-------------------------------*//*       Hamburger-Cross         *//*-------------------------------*/.hamburger {position: absolute;top: 15px;z-index: 999;display: none;width: 30px;height: 30px;margin-left: 0;border: 0;background: transparent;}.hamburger:hover, .hamburger:focus, .hamburger:active {outline: none;}.hamburger.is-closed:before {content: '';display: block;width: 100px;font-size: 14px;color: #fff;line-height: 32px;text-align: center;opacity: 0;-webkit-transform: translate3d(0, 0, 0);-webkit-transition: all .35s ease-in-out;}.hamburger.is-closed:hover:before {opacity: 1;display: block;-webkit-transform: translate3d(-100px, 0, 0);-webkit-transition: all .35s ease-in-out;}.hamburger.is-closed .hamb-top, .hamburger.is-closed .hamb-middle, .hamburger.is-closed .hamb-bottom, .hamburger.is-open .hamb-top, .hamburger.is-open .hamb-middle, .hamburger.is-open .hamb-bottom {position: absolute;left: 0;height: 4px;width: 100%;}.hamburger.is-closed .hamb-top, .hamburger.is-closed .hamb-middle, .hamburger.is-closed .hamb-bottom {background-color: #708294;}.hamburger.is-closed .hamb-top {top: 5px;-webkit-transition: all .35s ease-in-out;}.hamburger.is-closed .hamb-middle {top: 50%;margin-top: -2px;-webkit-transition: all .35s ease-in-out;}.hamburger.is-closed .hamb-bottom {bottom: 5px;-webkit-transition: all .35s ease-in-out;}.hamburger.is-closed:hover .hamb-top {top: 0;-webkit-transition: all .35s ease-in-out;}.hamburger.is-closed:hover .hamb-bottom {bottom: 0;-webkit-transition: all .35s ease-in-out;}.hamburger.is-open .hamb-top, .hamburger.is-open .hamb-middle, .hamburger.is-open .hamb-bottom {background-color: #708294;}.hamburger.is-open .hamb-top, .hamburger.is-open .hamb-bottom {top: 50%;margin-top: -2px;}.hamburger.is-open .hamb-top {-webkit-transform: rotate(495deg);-webkit-transition: all .35s ease-in-out;}.hamburger.is-open .hamb-middle {display: none;}.hamburger.is-open .hamb-bottom {-webkit-transform: rotate(-495deg);-webkit-transition: all .35s ease-in-out;}.hamburger.is-open:before {content: '';display: block;width: 100px;font-size: 14px;color: #fff;line-height: 32px;text-align: center;opacity: 0;-webkit-transform: translate3d(0, 0, 0);-webkit-transition: all .35s ease-in-out;}.hamburger.is-open:hover:before {opacity: 1;display: block;-webkit-transform: translate3d(-100px, 0, 0);-webkit-transition: all .35s ease-in-out;} /*-------------------------------*//* Overlay *//*-------------------------------*/.overlay {position: fixed;display: none;width: 100%;height: 100%;top: 0;left: 0;right: 0;bottom: 0;background-color: rgba(255,255,255,.8);z-index: 9;}@media only screen and (max-width:991px) {.hamburger {display: block;}} /*mobile menu clasess ends*//*animated clasess*/.animated {-webkit-animation-duration: 1s;animation-duration: 1s;-webkit-animation-fill-mode: both;animation-fill-mode: both;}@-webkit-keyframes fadeInDown {0% {opacity: 0;-webkit-transform: translateY(-20px);transform: translateY(-20px);}100% {opacity: 1;-webkit-transform: translateY(0);transform: translateY(0);}}@keyframes fadeInDown {0% {opacity: 0;-webkit-transform: translateY(-20px);-ms-transform: translateY(-20px);transform: translateY(-20px);}100% {opacity: 1;-webkit-transform: translateY(0);-ms-transform: translateY(0);transform: translateY(0);}}.fadeInDown {-webkit-animation-name: fadeInDown;animation-name: fadeInDown;}/*animated clasess ends*//*carousel clasess*/.owl-carousel .item {padding: 5px 0;z-index: 2;}.owl-carousel .item figure {background: #fff;border-radius: 2px;overflow: hidden;box-shadow: 0 0 5px 5px rgba(204,204,204,0.08);}.owl-carousel .item figure img {-webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);filter: grayscale(100%);transition: all linear .3s;-webkit-transition: all linear .3s;-moz-transition: all linear .3s;-ms-transition: all linear .3s;}.owl-carousel .item figure:hover img {-webkit-filter: grayscale(0%);-moz-filter: grayscale(0%);-ms-filter: grayscale(0%);-o-filter: grayscale(0%);filter: grayscale(0%);}
.owl-carousel .item p{ font-size:15px; color:#666; font-family:'proxima_nova_rgregular'; line-height:18px; margin-top:10px; }
/*=============================================*/.owl-carousel, .owl-carousel .owl-item {-webkit-tap-highlight-color: transparent;position: relative}.owl-carousel {display: none;width: 100%;padding: 0 25px;z-index: 1}.owl-carousel .owl-stage {position: relative;-ms-touch-action: pan-Y;-moz-backface-visibility: hidden}.owl-carousel .owl-stage:after {content: ".";display: block;clear: both;visibility: hidden;line-height: 0;height: 0}.owl-carousel .owl-stage-outer {position: relative;overflow: hidden;-webkit-transform: translate3d(0, 0, 0)}.owl-carousel .owl-item, .owl-carousel .owl-wrapper {-webkit-backface-visibility: hidden;-moz-backface-visibility: hidden;-ms-backface-visibility: hidden;-webkit-transform: translate3d(0, 0, 0);-moz-transform: translate3d(0, 0, 0);-ms-transform: translate3d(0, 0, 0)}.owl-carousel .owl-item {min-height: 1px;text-align: center;float: left;-webkit-backface-visibility: hidden;-webkit-touch-callout: none}.owl-carousel .owl-item img {display: inline-block;}.owl-carousel .owl-dots.disabled, .owl-carousel .owl-nav.disabled {display: none}.no-js .owl-carousel, .owl-carousel.owl-loaded {display: block}.owl-carousel .owl-dot, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-nav .owl-prev {cursor: pointer;cursor: hand;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none}.owl-carousel.owl-loading {opacity: 0;display: block}.owl-carousel.owl-hidden {opacity: 0}.owl-carousel.owl-refresh .owl-item {visibility: hidden}.owl-carousel.owl-drag .owl-item {-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none}.owl-carousel.owl-grab {cursor: move;cursor: grab}.owl-carousel.owl-rtl {direction: rtl}.owl-carousel.owl-rtl .owl-item {float: right}.owl-carousel .animated {animation-duration: 1s;animation-fill-mode: both}.owl-carousel .owl-animated-in {z-index: 0}.owl-carousel .owl-animated-out {z-index: 1}.owl-carousel .fadeOut {animation-name: fadeOut}@keyframes fadeOut {0% {opacity:1}100% {opacity:0}}.owl-height {transition: height .5s ease-in-out}.owl-carousel .owl-item .owl-lazy {opacity: 0;transition: opacity .4s ease}.owl-carousel .owl-item img.owl-lazy {transform-style: preserve-3d}.owl-carousel .owl-video-wrapper {position: relative;height: 100%;background: #000}.owl-carousel .owl-video-play-icon {position: absolute;height: 80px;width: 80px;left: 50%;top: 50%;margin-left: -40px;margin-top: -40px;background: url(owl.video.play.png) no-repeat;cursor: pointer;z-index: 1;-webkit-backface-visibility: hidden;transition: transform .1s ease}.owl-carousel .owl-video-play-icon:hover {-ms-transform: scale(1.3, 1.3);transform: scale(1.3, 1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon, .owl-carousel .owl-video-playing .owl-video-tn {display: none}.owl-carousel .owl-video-tn {opacity: 0;height: 100%;background-position: center center;background-repeat: no-repeat;background-size: contain;transition: opacity .4s ease}.owl-carousel .owl-video-frame {position: relative;z-index: 1;height: 100%;width: 100%}.owl-prev {position: absolute;top: 50%;left: 0;transform: translate(0, -50%)}.owl-next {position: absolute;top: 50%;right: 0;transform: translate(0, -50%)}/*carousel clasess ends*/

.left-fx-btn{ position:fixed; left:0; top:300px; background:url(../images/fx_enquiry_btn.png) no-repeat; width:55px; height:180px; display:inline-block; z-index:3;}

.mob-left-fx-btn{ position:fixed; left:10px; bottom:10px; background:url(../images/mob_enquiry_fx_btn.png) no-repeat; width:138px; height:40px; display:inline-block; z-index:3; outline:none !important;}

--------------------------------




















/* ========== RESET AND BASE STYLES START ========== */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
  line-height: 1.6;
  color: #333;
  background-color: #ffffff;
}

.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

/* ========== RESET AND BASE STYLES END ========== */

/* ========== HEADER SECTION START ========== */
.header {
  text-align: center;
  padding: 24px 0;
  background-color: #ffffff;
}

.header-title {
  font-size: 2rem;
  font-weight: 300;
  color: #4a5568;
  margin: 0;
}

.highlight {
  color: #3b82f6;
  font-weight: 400;
}

/* ========== HEADER SECTION END ========== */

/* ========== HERO SECTION START ========== */
.hero-section {
  padding: 0 20px 32px;
}

.hero-container {
  position: relative;
  background: linear-gradient(to right, #fbbf24, #f59e0b, #ea580c);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  height: 500px;
  max-width: 1400px;
  margin: 0 auto;
  display: flex;
  align-items: center;
}

.plus-icon {
  position: absolute;
  top: 16px;
  left: 16px;
  color: white;
  font-size: 2rem;
  z-index: 10;
}

/* Left side content */
.left-content {
  flex: 0 0 auto;
  padding: 32px;
  display: flex;
  align-items: center;
  z-index: 20;
}

.poster-container {
  position: relative;
}

.poster-frame {
  background: white;
  padding: 12px;
  border-radius: 12px;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
  transform: rotate(-3deg);
}

.poster-content {
  width: 256px;
  height: 320px;
  border-radius: 4px;
  overflow: hidden;
  background: #f7fafc;
}

.poster-header {
  padding: 16px;
  background: white;
}

.game-title {
  font-size: 1.5rem;
  font-weight: bold;
  color: #2d3748;
  margin-bottom: 8px;
}

.game-subtitle {
  font-size: 0.875rem;
  color: #718096;
  margin-bottom: 16px;
}

.character-portrait {
  height: 192px;
  background: linear-gradient(to bottom, #f56565, #ea580c);
  position: relative;
}

.character-portrait::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.2);
}

/* Right side content - YouTube Video */
.right-content {
  flex: 1;
  height: 100%;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.video-wrapper {
  width: 100%;
  height: 100%;
  position: relative;
  min-height: 300px;
}

.video-wrapper iframe {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Play button overlay */
.play-button-container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 30;
}

.play-button {
  background: rgba(0, 0, 0, 0.6);
  color: white;
  border: none;
  border-radius: 50px;
  padding: 16px 32px;
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1.125rem;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.play-button:hover {
  background: rgba(0, 0, 0, 0.7);
}

.play-icon {
  width: 32px;
  height: 32px;
  background: white;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: black;
  font-size: 0.875rem;
}

.play-duration {
  color: rgba(255, 255, 255, 0.8);
}

.social-stats {
  position: absolute;
  bottom: 24px;
  right: 24px;
  display: flex;
  align-items: center;
  gap: 24px;
  color: white;
  z-index: 20;
}

.stat-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1.125rem;
}

.stat-item i.fa-heart {
  color: #f56565;
}

.menu-button {
  position: absolute;
  top: 24px;
  right: 24px;
  z-index: 20;
}

.menu-btn {
  background: rgba(0, 0, 0, 0.3);
  color: white;
  border: none;
  border-radius: 50%;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.menu-btn:hover {
  background: rgba(0, 0, 0, 0.4);
}

/* ========== HERO SECTION END ========== */

/* ========== CONTENT SECTION START ========== */
.content-section {
  max-width: 1000px;
  margin: 0 auto;
  padding: 0 24px 48px;
}

.content-title {
  font-size: 1.25rem;
  font-weight: 400;
  color: #718096;
  text-align: center;
  margin-bottom: 32px;
}

.content-text {
  color: #718096;
  line-height: 1.75;
}

.content-text p {
  margin-bottom: 24px;
  text-align: justify;
}

/* ========== CONTENT SECTION END ========== */

/* ========== VIDEO MODAL START ========== */
.video-modal {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.9);
  z-index: 1000;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

.video-modal.active {
  display: flex;
}

.video-modal-content {
  position: relative;
  width: 100%;
  max-width: 1024px;
  aspect-ratio: 16 / 9;
}

.close-button {
  position: absolute;
  top: -48px;
  right: 0;
  background: none;
  border: none;
  color: white;
  font-size: 1.5rem;
  cursor: pointer;
  padding: 8px;
  transition: color 0.3s ease;
}

.close-button:hover {
  color: #d1d5db;
}

.video-container {
  width: 100%;
  height: 100%;
  border-radius: 12px;
  overflow: hidden;
}

.video-container iframe {
  width: 100%;
  height: 100%;
}

/* ========== VIDEO MODAL END ========== */

/* ========== MOBILE RESPONSIVE START ========== */
@media (max-width: 768px) {
  /* Header responsive */
  .header-title {
    font-size: 1.5rem;
    line-height: 1.4;
  }

  /* Hero section responsive */
  .hero-container {
    height: auto;
    min-height: 400px;
    margin: 0 10px;
    flex-direction: column;
    padding: 16px;
  }

  .left-content {
    flex: 0 0 auto;
    padding: 16px 0;
    width: 100%;
    justify-content: center;
  }

  .right-content {
    flex: 1;
    width: 100%;
    min-height: 250px;
    height: 250px;
  }

  .video-wrapper {
    width: 100%;
    height: 100%;
    border-radius: 8px;
    overflow: hidden;
  }

  .video-wrapper iframe {
    width: 100%;
    height: 100%;
    border-radius: 8px;
  }

  .poster-content {
    width: 200px;
    height: 260px;
  }

  .game-title {
    font-size: 1.2rem;
  }

  .character-portrait {
    height: 140px;
  }

  .play-button {
    padding: 12px 24px;
    font-size: 1rem;
    gap: 8px;
  }

  .play-icon {
    width: 28px;
    height: 28px;
  }

  .social-stats {
    bottom: 16px;
    right: 16px;
    gap: 16px;
    font-size: 1rem;
  }

  .menu-button {
    top: 16px;
    right: 16px;
  }

  .menu-btn {
    width: 40px;
    height: 40px;
  }

  /* Content section responsive */
  .content-section {
    padding: 0 16px 32px;
  }

  .content-title {
    font-size: 1.125rem;
    margin-bottom: 24px;
  }

  .content-text {
    font-size: 0.95rem;
  }

  /* Video modal responsive */
  .video-modal-content {
    margin: 0 10px;
  }

  .close-button {
    top: -40px;
    font-size: 1.25rem;
  }
}

@media (max-width: 480px) {
  /* Extra small screens */
  .container {
    padding: 0 15px;
  }

  .header {
    padding: 16px 0;
  }

  .header-title {
    font-size: 1.25rem;
  }

  .hero-container {
    height: auto;
    min-height: 350px;
    margin: 0 5px;
    padding: 12px;
  }

  .left-content {
    padding: 12px 0;
  }

  .right-content {
    min-height: 200px;
    height: 200px;
    margin-top: 16px;
  }

  .poster-frame {
    transform: rotate(-3deg) scale(0.8);
  }

  .plus-icon {
    top: 12px;
    left: 12px;
    font-size: 1.5rem;
  }

  .play-button {
    padding: 10px 20px;
    font-size: 0.9rem;
    gap: 6px;
  }

  .play-icon {
    width: 24px;
    height: 24px;
  }

  .social-stats {
    bottom: 12px;
    right: 12px;
    gap: 12px;
    font-size: 0.9rem;
  }

  .content-text {
    font-size: 0.9rem;
    text-align: left;
  }

  .content-text p {
    margin-bottom: 20px;
  }
}

@media (max-width: 360px) {
  /* Very small screens */
  .header-title {
    font-size: 1.1rem;
  }

  .hero-container {
    height: auto;
    min-height: 300px;
    padding: 8px;
  }

  .right-content {
    min-height: 180px;
    height: 180px;
    margin-top: 12px;
  }

  .poster-frame {
    transform: rotate(-3deg) scale(0.7);
  }

  .play-button {
    padding: 8px 16px;
    font-size: 0.8rem;
  }

  .play-text {
    display: none;
  }
}

/* ========== MOBILE RESPONSIVE END ========== */

/* ========== LANDSCAPE ORIENTATION START ========== */
@media (max-height: 500px) and (orientation: landscape) {
  .hero-container {
    height: 300px;
    flex-direction: row;
    padding: 16px;
  }

  .left-content {
    padding: 16px;
    flex: 0 0 auto;
  }

  .right-content {
    flex: 1;
    height: 100%;
    min-height: auto;
  }

  .poster-frame {
    transform: rotate(-3deg) scale(0.8);
  }
}

/* ========== LANDSCAPE ORIENTATION END ========== */












----------------------------------------------------------------------


/* Start CSS Section */
/* Global Styles */
body {
  font-family:
    ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  margin: 0;
  padding: 2rem; /* Equivalent to p-8 */
  background-color: #fff; /* bg-white */
  color: #374151; /* Default text-gray-700 */
}


/* Directory Grid Section */
.directory-grid {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr)); /* grid-cols-1 */
  gap: 1rem; /* gap-4 */
}

@media (min-width: 768px) {
  /* md */
  .directory-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)); /* md:grid-cols-2 */
  }
}

@media (min-width: 1024px) {
  /* lg */
  .directory-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)); /* lg:grid-cols-4 */
  }
}

.column {
  border: 1px solid #e5e7eb; /* border border-gray-200 */
  border-radius: 0.5rem; /* rounded-lg */
  overflow: hidden;
}

/* Directory Item Section */
.directory-item-trigger {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem 1rem; /* py-2 px-4 */
  text-align: left;
  font-size: 0.875rem; /* text-sm */
  line-height: 1.25rem;
  font-weight: 500; /* font-medium */
  color: #374151; /* text-gray-700 */
  background-color: transparent;
  border: none;
  cursor: pointer;
  transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out;
}

.directory-item-trigger:hover {
  background-color: #f3f4f6; /* hover:bg-gray-100 */
}

.directory-item-trigger.is-open {
  background-color: #f3f4f6; /* data-[state=open]:bg-gray-100 */
  color: #1f2937; /* data-[state=open]:text-gray-900 */
}

.directory-item-trigger .chevron-icon {
  height: 1rem; /* h-4 */
  width: 1rem; /* w-4 */
  color: #6b7280; /* text-gray-500 */
  transition: transform 0.15s ease-in-out;
}

.directory-item-trigger.is-open .chevron-icon {
  transform: rotate(180deg); /* data-[state=open]:rotate-180 */
}

.directory-item-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-out;
}

.directory-item-content.is-open {
  max-height: 500px; /* Arbitrary large value to allow content to show */
  padding-top: 0.25rem; /* py-1 */
  padding-bottom: 0.25rem; /* py-1 */
  padding-left: 2rem; /* pl-8 */
  padding-right: 1rem; /* pr-4 */
}

.directory-item-link {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem 1rem; /* py-2 px-4 */
  text-align: left;
  font-size: 0.875rem; /* text-sm */
  line-height: 1.25rem;
  font-weight: 500; /* font-medium */
  color: #2563eb; /* text-blue-600 */
  text-decoration: none;
  transition: background-color 0.15s ease-in-out;
}

.directory-item-link:hover {
  background-color: #f9fafb; /* hover:bg-gray-50 */
}

.directory-item-link .chevron-icon-right {
  height: 1rem; /* h-4 */
  width: 1rem; /* w-4 */
  color: #3b82f6; /* text-blue-500 */
}

.separator {
  height: 1px; /* h-px */
  background-color: #e5e7eb; /* bg-gray-200 */
  margin-left: 1rem; /* mx-4 */
  margin-right: 1rem; /* mx-4 */
}
/* End CSS Section */