main.css 186 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439244024412442244324442445244624472448244924502451245224532454245524562457245824592460246124622463246424652466246724682469247024712472247324742475247624772478247924802481248224832484248524862487248824892490249124922493249424952496249724982499250025012502250325042505250625072508250925102511251225132514251525162517251825192520252125222523252425252526252725282529253025312532253325342535253625372538253925402541254225432544254525462547254825492550255125522553255425552556255725582559256025612562256325642565256625672568256925702571257225732574257525762577257825792580258125822583258425852586258725882589259025912592259325942595259625972598259926002601260226032604260526062607260826092610261126122613261426152616261726182619262026212622262326242625262626272628262926302631263226332634263526362637263826392640264126422643264426452646264726482649265026512652265326542655265626572658265926602661266226632664266526662667266826692670267126722673267426752676267726782679268026812682268326842685268626872688268926902691269226932694269526962697269826992700270127022703270427052706270727082709271027112712271327142715271627172718271927202721272227232724272527262727272827292730273127322733273427352736273727382739274027412742274327442745274627472748274927502751275227532754275527562757275827592760276127622763276427652766276727682769277027712772277327742775277627772778277927802781278227832784278527862787278827892790279127922793279427952796279727982799280028012802280328042805280628072808280928102811281228132814281528162817281828192820282128222823282428252826282728282829283028312832283328342835283628372838283928402841284228432844284528462847284828492850285128522853285428552856285728582859286028612862286328642865286628672868286928702871287228732874287528762877287828792880288128822883288428852886288728882889289028912892289328942895289628972898289929002901290229032904290529062907290829092910291129122913291429152916291729182919292029212922292329242925292629272928292929302931293229332934293529362937293829392940294129422943294429452946294729482949295029512952295329542955295629572958295929602961296229632964296529662967296829692970297129722973297429752976297729782979298029812982298329842985298629872988298929902991299229932994299529962997299829993000300130023003300430053006300730083009301030113012301330143015301630173018301930203021302230233024302530263027302830293030303130323033303430353036303730383039304030413042304330443045304630473048304930503051305230533054305530563057305830593060306130623063306430653066306730683069307030713072307330743075307630773078307930803081308230833084308530863087308830893090309130923093309430953096309730983099310031013102310331043105310631073108310931103111311231133114311531163117311831193120312131223123312431253126312731283129313031313132313331343135313631373138313931403141314231433144314531463147314831493150315131523153315431553156315731583159316031613162316331643165316631673168316931703171317231733174317531763177317831793180318131823183318431853186318731883189319031913192319331943195319631973198319932003201320232033204320532063207320832093210321132123213321432153216321732183219322032213222322332243225322632273228322932303231323232333234323532363237323832393240324132423243324432453246324732483249325032513252325332543255325632573258325932603261326232633264326532663267326832693270327132723273327432753276327732783279328032813282328332843285328632873288328932903291329232933294329532963297329832993300330133023303330433053306330733083309331033113312331333143315331633173318331933203321332233233324332533263327332833293330333133323333333433353336333733383339334033413342334333443345334633473348334933503351335233533354335533563357335833593360336133623363336433653366336733683369337033713372337333743375337633773378337933803381338233833384338533863387338833893390339133923393339433953396339733983399340034013402340334043405340634073408340934103411341234133414341534163417341834193420342134223423342434253426342734283429343034313432343334343435343634373438343934403441344234433444344534463447344834493450345134523453345434553456345734583459346034613462346334643465346634673468346934703471347234733474347534763477347834793480348134823483348434853486348734883489349034913492349334943495349634973498349935003501350235033504350535063507350835093510351135123513351435153516351735183519352035213522352335243525352635273528352935303531353235333534353535363537353835393540354135423543354435453546354735483549355035513552355335543555355635573558355935603561356235633564356535663567356835693570357135723573357435753576357735783579358035813582358335843585358635873588358935903591359235933594359535963597359835993600360136023603360436053606360736083609361036113612361336143615361636173618361936203621362236233624362536263627362836293630363136323633363436353636363736383639364036413642364336443645364636473648364936503651365236533654365536563657365836593660366136623663366436653666366736683669367036713672367336743675367636773678367936803681368236833684368536863687368836893690369136923693369436953696369736983699370037013702370337043705370637073708370937103711371237133714371537163717371837193720372137223723372437253726372737283729373037313732373337343735373637373738373937403741374237433744374537463747374837493750375137523753375437553756375737583759376037613762376337643765376637673768376937703771377237733774377537763777377837793780378137823783378437853786378737883789379037913792379337943795379637973798379938003801380238033804380538063807380838093810381138123813381438153816381738183819382038213822382338243825382638273828382938303831383238333834383538363837383838393840384138423843384438453846384738483849385038513852385338543855385638573858385938603861386238633864386538663867386838693870387138723873387438753876387738783879388038813882388338843885388638873888388938903891389238933894389538963897389838993900390139023903390439053906390739083909391039113912391339143915391639173918391939203921392239233924392539263927392839293930393139323933393439353936393739383939394039413942394339443945394639473948394939503951395239533954395539563957395839593960396139623963396439653966396739683969397039713972397339743975397639773978397939803981398239833984398539863987398839893990399139923993399439953996399739983999400040014002400340044005400640074008400940104011401240134014401540164017401840194020402140224023402440254026402740284029403040314032403340344035403640374038403940404041404240434044404540464047404840494050405140524053405440554056405740584059406040614062406340644065406640674068406940704071407240734074407540764077407840794080408140824083408440854086408740884089409040914092409340944095409640974098409941004101410241034104410541064107410841094110411141124113411441154116411741184119412041214122412341244125412641274128412941304131413241334134413541364137413841394140414141424143414441454146414741484149415041514152415341544155415641574158415941604161416241634164416541664167416841694170417141724173417441754176417741784179418041814182418341844185418641874188418941904191419241934194419541964197419841994200420142024203420442054206420742084209421042114212421342144215421642174218421942204221422242234224422542264227422842294230423142324233423442354236423742384239424042414242424342444245424642474248424942504251425242534254425542564257425842594260426142624263426442654266426742684269427042714272427342744275427642774278427942804281428242834284428542864287428842894290429142924293429442954296429742984299430043014302430343044305430643074308430943104311431243134314431543164317431843194320432143224323432443254326432743284329433043314332433343344335433643374338433943404341434243434344434543464347434843494350435143524353435443554356435743584359436043614362436343644365436643674368436943704371437243734374437543764377437843794380438143824383438443854386438743884389439043914392439343944395439643974398439944004401440244034404440544064407440844094410441144124413441444154416441744184419442044214422442344244425442644274428442944304431443244334434443544364437443844394440444144424443444444454446444744484449445044514452445344544455445644574458445944604461446244634464446544664467446844694470447144724473447444754476447744784479448044814482448344844485448644874488448944904491449244934494449544964497449844994500450145024503450445054506450745084509451045114512451345144515451645174518451945204521452245234524452545264527452845294530453145324533453445354536453745384539454045414542454345444545454645474548454945504551455245534554455545564557455845594560456145624563456445654566456745684569457045714572457345744575457645774578457945804581458245834584458545864587458845894590459145924593459445954596459745984599460046014602460346044605460646074608460946104611461246134614461546164617461846194620462146224623462446254626462746284629463046314632463346344635463646374638463946404641464246434644464546464647464846494650465146524653465446554656465746584659466046614662466346644665466646674668466946704671467246734674467546764677467846794680468146824683468446854686468746884689469046914692469346944695469646974698469947004701470247034704470547064707470847094710471147124713471447154716471747184719472047214722472347244725472647274728472947304731473247334734473547364737473847394740474147424743474447454746474747484749475047514752475347544755475647574758475947604761476247634764476547664767476847694770477147724773477447754776477747784779478047814782478347844785478647874788478947904791479247934794479547964797479847994800480148024803480448054806480748084809481048114812481348144815481648174818481948204821482248234824482548264827482848294830483148324833483448354836483748384839484048414842484348444845484648474848484948504851485248534854485548564857485848594860486148624863486448654866486748684869487048714872487348744875487648774878487948804881488248834884488548864887488848894890489148924893489448954896489748984899490049014902490349044905490649074908490949104911491249134914491549164917491849194920492149224923492449254926492749284929493049314932493349344935493649374938493949404941494249434944494549464947494849494950495149524953495449554956495749584959496049614962496349644965496649674968496949704971497249734974497549764977497849794980498149824983498449854986498749884989499049914992499349944995499649974998499950005001500250035004500550065007500850095010501150125013501450155016501750185019502050215022502350245025502650275028502950305031503250335034503550365037503850395040504150425043504450455046504750485049505050515052505350545055505650575058505950605061506250635064506550665067506850695070507150725073507450755076507750785079508050815082508350845085508650875088508950905091509250935094509550965097509850995100510151025103510451055106510751085109511051115112511351145115511651175118511951205121512251235124512551265127512851295130513151325133513451355136513751385139514051415142514351445145514651475148514951505151515251535154515551565157515851595160516151625163516451655166516751685169517051715172517351745175517651775178517951805181518251835184518551865187518851895190519151925193519451955196519751985199520052015202520352045205520652075208520952105211521252135214521552165217521852195220522152225223522452255226522752285229523052315232523352345235523652375238523952405241524252435244524552465247524852495250525152525253525452555256525752585259526052615262526352645265526652675268526952705271527252735274527552765277527852795280528152825283528452855286528752885289529052915292529352945295529652975298529953005301530253035304530553065307530853095310531153125313531453155316531753185319532053215322532353245325532653275328532953305331533253335334533553365337533853395340534153425343534453455346534753485349535053515352535353545355535653575358535953605361536253635364536553665367536853695370537153725373537453755376537753785379538053815382538353845385538653875388538953905391539253935394539553965397539853995400540154025403540454055406540754085409541054115412541354145415541654175418541954205421542254235424542554265427542854295430543154325433543454355436543754385439544054415442544354445445544654475448544954505451545254535454545554565457545854595460546154625463546454655466546754685469547054715472547354745475547654775478547954805481548254835484548554865487548854895490549154925493549454955496549754985499550055015502550355045505550655075508550955105511551255135514551555165517551855195520552155225523552455255526552755285529553055315532553355345535553655375538553955405541554255435544554555465547554855495550555155525553555455555556555755585559556055615562556355645565556655675568556955705571557255735574557555765577557855795580558155825583558455855586558755885589559055915592559355945595559655975598559956005601560256035604560556065607560856095610561156125613561456155616561756185619562056215622562356245625562656275628562956305631563256335634563556365637563856395640564156425643564456455646564756485649565056515652565356545655565656575658565956605661566256635664566556665667566856695670567156725673567456755676567756785679568056815682568356845685568656875688568956905691569256935694569556965697569856995700570157025703570457055706570757085709571057115712571357145715571657175718571957205721572257235724572557265727572857295730573157325733573457355736573757385739574057415742574357445745574657475748574957505751575257535754575557565757575857595760576157625763576457655766576757685769577057715772577357745775577657775778577957805781578257835784578557865787578857895790579157925793579457955796579757985799580058015802580358045805580658075808580958105811581258135814581558165817581858195820582158225823582458255826582758285829583058315832583358345835583658375838583958405841584258435844584558465847584858495850585158525853585458555856585758585859586058615862586358645865586658675868586958705871587258735874587558765877587858795880588158825883588458855886588758885889589058915892589358945895589658975898589959005901590259035904590559065907590859095910591159125913591459155916591759185919592059215922592359245925592659275928592959305931593259335934593559365937593859395940594159425943594459455946594759485949595059515952595359545955595659575958595959605961596259635964596559665967596859695970597159725973597459755976597759785979598059815982598359845985598659875988598959905991599259935994599559965997599859996000600160026003600460056006600760086009601060116012601360146015601660176018601960206021602260236024602560266027602860296030603160326033603460356036603760386039604060416042604360446045604660476048604960506051605260536054605560566057605860596060606160626063606460656066606760686069607060716072607360746075607660776078607960806081608260836084608560866087608860896090609160926093609460956096609760986099610061016102610361046105610661076108610961106111611261136114611561166117611861196120612161226123612461256126612761286129613061316132613361346135613661376138613961406141614261436144614561466147614861496150615161526153615461556156615761586159616061616162616361646165616661676168616961706171617261736174617561766177617861796180618161826183618461856186618761886189619061916192619361946195619661976198619962006201620262036204620562066207620862096210621162126213621462156216621762186219622062216222622362246225622662276228622962306231623262336234623562366237623862396240624162426243624462456246624762486249625062516252625362546255625662576258625962606261626262636264626562666267626862696270627162726273627462756276627762786279628062816282628362846285628662876288628962906291629262936294629562966297629862996300630163026303630463056306630763086309631063116312631363146315631663176318631963206321632263236324632563266327632863296330633163326333633463356336633763386339634063416342634363446345634663476348634963506351635263536354635563566357635863596360636163626363636463656366636763686369637063716372637363746375637663776378637963806381638263836384638563866387638863896390639163926393639463956396639763986399640064016402640364046405640664076408640964106411641264136414641564166417641864196420642164226423642464256426642764286429643064316432643364346435643664376438643964406441644264436444644564466447644864496450645164526453645464556456645764586459646064616462646364646465646664676468646964706471647264736474647564766477647864796480648164826483648464856486648764886489649064916492649364946495649664976498649965006501650265036504650565066507650865096510651165126513651465156516651765186519652065216522652365246525652665276528652965306531653265336534653565366537653865396540654165426543654465456546654765486549655065516552655365546555655665576558655965606561656265636564656565666567656865696570657165726573657465756576657765786579658065816582658365846585658665876588658965906591659265936594659565966597659865996600660166026603660466056606660766086609661066116612661366146615661666176618661966206621662266236624662566266627662866296630663166326633663466356636663766386639664066416642664366446645664666476648664966506651665266536654665566566657665866596660666166626663666466656666666766686669667066716672667366746675667666776678667966806681668266836684668566866687668866896690669166926693669466956696669766986699670067016702670367046705670667076708670967106711671267136714671567166717671867196720672167226723672467256726672767286729673067316732673367346735673667376738673967406741674267436744674567466747674867496750675167526753675467556756675767586759676067616762676367646765676667676768676967706771677267736774677567766777677867796780678167826783678467856786678767886789679067916792679367946795679667976798679968006801680268036804680568066807680868096810681168126813681468156816681768186819682068216822682368246825682668276828682968306831683268336834683568366837683868396840684168426843684468456846684768486849685068516852685368546855685668576858685968606861686268636864686568666867686868696870687168726873687468756876687768786879688068816882688368846885688668876888688968906891689268936894689568966897689868996900690169026903690469056906690769086909691069116912691369146915691669176918691969206921692269236924692569266927692869296930693169326933693469356936693769386939694069416942694369446945694669476948694969506951695269536954695569566957695869596960696169626963696469656966696769686969697069716972697369746975697669776978697969806981698269836984698569866987698869896990699169926993699469956996699769986999700070017002700370047005700670077008700970107011701270137014701570167017701870197020702170227023702470257026702770287029703070317032703370347035703670377038703970407041704270437044704570467047704870497050705170527053705470557056705770587059706070617062706370647065706670677068706970707071707270737074707570767077707870797080708170827083708470857086708770887089709070917092709370947095709670977098709971007101710271037104710571067107710871097110711171127113711471157116711771187119712071217122712371247125712671277128712971307131713271337134713571367137713871397140714171427143714471457146714771487149715071517152715371547155715671577158715971607161716271637164716571667167716871697170717171727173717471757176717771787179718071817182718371847185718671877188718971907191719271937194719571967197719871997200720172027203720472057206720772087209721072117212721372147215721672177218721972207221722272237224722572267227722872297230723172327233723472357236723772387239724072417242724372447245724672477248724972507251725272537254725572567257725872597260726172627263726472657266726772687269727072717272727372747275727672777278727972807281728272837284728572867287728872897290729172927293729472957296729772987299730073017302730373047305730673077308730973107311731273137314731573167317731873197320732173227323732473257326732773287329733073317332733373347335733673377338733973407341734273437344734573467347734873497350735173527353735473557356735773587359736073617362736373647365736673677368736973707371737273737374737573767377737873797380738173827383738473857386738773887389739073917392739373947395739673977398739974007401740274037404740574067407740874097410741174127413741474157416741774187419742074217422742374247425742674277428742974307431743274337434743574367437743874397440744174427443744474457446744774487449745074517452745374547455745674577458745974607461746274637464746574667467746874697470747174727473747474757476747774787479748074817482748374847485748674877488748974907491749274937494749574967497749874997500750175027503750475057506750775087509751075117512751375147515751675177518751975207521752275237524752575267527752875297530753175327533753475357536753775387539754075417542754375447545754675477548754975507551755275537554755575567557755875597560756175627563756475657566756775687569757075717572757375747575757675777578757975807581758275837584758575867587758875897590759175927593759475957596759775987599760076017602760376047605760676077608760976107611761276137614761576167617761876197620762176227623762476257626762776287629763076317632763376347635763676377638763976407641764276437644764576467647764876497650765176527653765476557656765776587659766076617662766376647665766676677668766976707671767276737674767576767677767876797680768176827683768476857686768776887689769076917692769376947695769676977698769977007701770277037704770577067707770877097710771177127713771477157716771777187719772077217722772377247725772677277728772977307731773277337734773577367737773877397740774177427743774477457746774777487749775077517752775377547755775677577758775977607761776277637764776577667767776877697770777177727773777477757776777777787779778077817782778377847785778677877788778977907791779277937794779577967797779877997800780178027803780478057806780778087809781078117812781378147815781678177818781978207821782278237824782578267827782878297830783178327833783478357836783778387839784078417842784378447845784678477848784978507851785278537854785578567857785878597860786178627863786478657866786778687869787078717872787378747875787678777878787978807881788278837884788578867887788878897890789178927893789478957896789778987899790079017902790379047905790679077908790979107911791279137914791579167917791879197920792179227923792479257926792779287929793079317932793379347935793679377938793979407941794279437944794579467947794879497950795179527953795479557956795779587959796079617962796379647965796679677968796979707971797279737974797579767977797879797980798179827983798479857986798779887989799079917992799379947995799679977998799980008001800280038004800580068007800880098010801180128013801480158016801780188019802080218022802380248025802680278028802980308031803280338034803580368037803880398040804180428043804480458046804780488049805080518052805380548055805680578058805980608061806280638064806580668067806880698070807180728073807480758076807780788079808080818082808380848085808680878088808980908091809280938094809580968097809880998100810181028103810481058106810781088109811081118112811381148115811681178118811981208121812281238124812581268127812881298130813181328133813481358136813781388139814081418142814381448145814681478148814981508151815281538154815581568157815881598160816181628163816481658166816781688169817081718172817381748175817681778178817981808181818281838184818581868187818881898190819181928193819481958196819781988199820082018202820382048205820682078208820982108211821282138214821582168217821882198220822182228223822482258226822782288229823082318232823382348235823682378238823982408241824282438244824582468247824882498250825182528253825482558256825782588259826082618262826382648265826682678268826982708271827282738274827582768277827882798280828182828283828482858286828782888289829082918292829382948295829682978298829983008301830283038304830583068307830883098310831183128313831483158316831783188319832083218322832383248325832683278328832983308331833283338334833583368337833883398340834183428343834483458346834783488349835083518352835383548355835683578358835983608361836283638364836583668367836883698370837183728373837483758376837783788379838083818382838383848385838683878388838983908391839283938394839583968397839883998400840184028403840484058406840784088409841084118412841384148415841684178418841984208421842284238424842584268427842884298430843184328433843484358436843784388439844084418442844384448445844684478448844984508451845284538454845584568457845884598460846184628463846484658466846784688469847084718472847384748475847684778478847984808481848284838484848584868487848884898490849184928493849484958496849784988499850085018502850385048505850685078508850985108511851285138514851585168517851885198520852185228523852485258526852785288529853085318532853385348535853685378538853985408541854285438544854585468547854885498550855185528553
  1. /*
  2. Theme Name: Kidsa
  3. 更多下载:https://www.99ziyuan.net
  4. Description: Kidsa - Kindergarten School HTML Template<
  5. Version: 1.0.0
  6. */
  7. /*CSS Table Of Content Ends Here*/
  8. @import url("css2-Quicksandwght300..700_swap.css");
  9. @import url("css2-Quicksandwght300..700_SourceSans3italwght0200..9001200..900_swap.css");
  10. @import url("css2-Pangolin_swap.css");
  11. :root {
  12. --body: #fff;
  13. --black: #000;
  14. --white: #fff;
  15. --theme: #F39F5F;
  16. --theme2: #70A6B1;
  17. --header: #385469;
  18. --text: #5C707E;
  19. --text-2: #ffffffcc;
  20. --border: #E5E5E5;
  21. --border2: #242449;
  22. --border3: #5262FF;
  23. --bg: #F4EEE5;
  24. --bg2: #EFF5F6;
  25. --bg3: #70A6B1;
  26. --bg4: #5866EB;
  27. --bg5: #F25334;
  28. --box-shadow: 0px 4px 25px rgba(0, 0, 0, 0.06);
  29. }
  30. .theme-btn {
  31. display: inline-block;
  32. vertical-align: middle;
  33. border: none;
  34. outline: none !important;
  35. background-color: var(--theme);
  36. color: var(--white);
  37. font-size: 16px;
  38. font-weight: 700;
  39. padding: 22px 40px;
  40. transition: all 0.4s ease-in-out;
  41. letter-spacing: 0;
  42. border-radius: 22px;
  43. position: relative;
  44. overflow: hidden;
  45. text-align: center;
  46. line-height: 1;
  47. z-index: 9;
  48. text-transform: capitalize;
  49. }
  50. .theme-btn i {
  51. margin-left: 10px;
  52. }
  53. .theme-btn::before, .theme-btn::after {
  54. position: absolute;
  55. top: 50%;
  56. content: "";
  57. width: 20px;
  58. height: 20px;
  59. background-color: var(--header);
  60. border-radius: 50%;
  61. z-index: -1;
  62. }
  63. .theme-btn::before {
  64. left: -20px;
  65. transform: translate(-50%, -50%);
  66. }
  67. .theme-btn::after {
  68. right: -20px;
  69. transform: translate(50%, -50%);
  70. }
  71. .theme-btn:hover {
  72. color: var(--white);
  73. }
  74. .theme-btn:hover::before {
  75. animation: criss-cross-left 0.8s both;
  76. animation-direction: alternate;
  77. }
  78. .theme-btn:hover::after {
  79. animation: criss-cross-right 0.8s both;
  80. animation-direction: alternate;
  81. }
  82. .theme-btn.bg-white {
  83. background-color: var(--white);
  84. color: var(--header);
  85. }
  86. .theme-btn.bg-white:hover {
  87. color: var(--white);
  88. }
  89. .theme-btn.transparent {
  90. background-color: transparent;
  91. border: 1px solid var(--theme2);
  92. color: var(--theme2);
  93. padding: 20px 40px;
  94. }
  95. .theme-btn.transparent:hover {
  96. color: var(--white);
  97. }
  98. @media (max-width: 767px) {
  99. .theme-btn.transparent {
  100. padding: 18px 32px;
  101. }
  102. }
  103. @media (max-width: 575px) {
  104. .theme-btn.transparent {
  105. padding: 16px 30px;
  106. font-size: 14px;
  107. }
  108. }
  109. .theme-btn.transparent-2 {
  110. background-color: transparent;
  111. border: 1px solid var(--theme);
  112. color: var(--theme);
  113. padding: 20px 40px;
  114. }
  115. .theme-btn.transparent-2:hover {
  116. color: var(--white);
  117. border: 1px solid transparent;
  118. }
  119. @media (max-width: 767px) {
  120. .theme-btn.transparent-2 {
  121. padding: 18px 32px;
  122. }
  123. }
  124. @media (max-width: 575px) {
  125. .theme-btn.transparent-2 {
  126. padding: 16px 30px;
  127. font-size: 14px;
  128. }
  129. }
  130. @media (max-width: 767px) {
  131. .theme-btn {
  132. padding: 20px 32px;
  133. }
  134. }
  135. @media (max-width: 575px) {
  136. .theme-btn {
  137. padding: 18px 30px;
  138. font-size: 14px;
  139. }
  140. }
  141. .theme-btn-2 {
  142. font-size: 16px;
  143. display: inline-block;
  144. font-weight: 600;
  145. color: var(--text);
  146. text-transform: capitalize;
  147. }
  148. .theme-btn-2 i {
  149. margin-left: 10px;
  150. }
  151. .theme-btn-2:hover {
  152. color: var(--theme);
  153. }
  154. /* --------------------------------------------
  155. Template Default Fonts & Fonts Styles
  156. ---------------------------------------------- */
  157. body {
  158. font-family: "Source Sans 3", sans-serif;
  159. font-size: 16px;
  160. font-weight: normal;
  161. line-height: 28px;
  162. color: var(--text);
  163. background-color: var(--white);
  164. padding: 0;
  165. margin: 0;
  166. overflow-x: hidden;
  167. }
  168. ul {
  169. padding: 0;
  170. margin: 0;
  171. list-style: none;
  172. }
  173. button {
  174. border: none;
  175. background-color: transparent;
  176. padding: 0;
  177. }
  178. input:focus {
  179. color: var(--white);
  180. outline: none;
  181. }
  182. input {
  183. color: var(--white);
  184. }
  185. h1,
  186. h2,
  187. h3,
  188. h4,
  189. h5,
  190. h6 {
  191. font-family: "Quicksand", sans-serif;
  192. margin: 0px;
  193. padding: 0;
  194. color: var(--header);
  195. text-transform: capitalize;
  196. transition: all 0.4s ease-in-out;
  197. }
  198. h1 {
  199. font-size: 70px;
  200. font-weight: 700;
  201. line-height: 112%;
  202. }
  203. h2 {
  204. font-size: 50px;
  205. line-height: 116%;
  206. font-weight: 700;
  207. }
  208. @media (max-width: 1199px) {
  209. h2 {
  210. font-size: 42px;
  211. }
  212. }
  213. @media (max-width: 767px) {
  214. h2 {
  215. font-size: 36px;
  216. }
  217. }
  218. @media (max-width: 575px) {
  219. h2 {
  220. font-size: 28px;
  221. }
  222. }
  223. h3 {
  224. font-size: 22px;
  225. font-weight: 700;
  226. line-height: 145%;
  227. }
  228. @media (max-width: 575px) {
  229. h3 {
  230. font-size: 20px;
  231. }
  232. }
  233. h4 {
  234. font-size: 20px;
  235. font-weight: 700;
  236. line-height: 130%;
  237. }
  238. h5 {
  239. font-size: 18px;
  240. font-weight: 700;
  241. }
  242. h6 {
  243. font-size: 16px;
  244. font-weight: 600;
  245. line-height: 145%;
  246. }
  247. a {
  248. text-decoration: none;
  249. outline: none !important;
  250. cursor: pointer;
  251. color: var(--header);
  252. transition: all 0.4s ease-in-out;
  253. }
  254. p {
  255. margin: 0px;
  256. transition: all 0.4s ease-in-out;
  257. }
  258. span {
  259. margin: 0px;
  260. transition: all 0.4s ease-in-out;
  261. }
  262. .about-section {
  263. position: relative;
  264. }
  265. @media (max-width: 1600px) {
  266. .about-section {
  267. overflow: hidden;
  268. }
  269. }
  270. .about-section .bus-shape {
  271. position: absolute;
  272. top: 10%;
  273. left: 0;
  274. }
  275. @media (max-width: 1199px) {
  276. .about-section .bus-shape {
  277. display: none;
  278. }
  279. }
  280. .about-section .girl-shape {
  281. position: absolute;
  282. bottom: 10%;
  283. right: 0;
  284. }
  285. .about-section .dot-shape {
  286. position: absolute;
  287. top: 17%;
  288. left: 42%;
  289. animation: rounded 5s linear infinite;
  290. }
  291. .about-section .left-shape {
  292. position: absolute;
  293. top: -15%;
  294. left: -4%;
  295. }
  296. @media (max-width: 1199px) {
  297. .about-section .left-shape {
  298. display: none;
  299. }
  300. }
  301. .about-section .plane-shape {
  302. position: absolute;
  303. top: 20%;
  304. left: 5%;
  305. }
  306. .about-section .line-1 {
  307. position: absolute;
  308. top: 10%;
  309. right: 0;
  310. animation: rounded 5s linear infinite;
  311. }
  312. @media (max-width: 1399px) {
  313. .about-wrapper {
  314. margin-bottom: 10px !important;
  315. }
  316. }
  317. @media (max-width: 1199px) {
  318. .about-wrapper {
  319. margin-bottom: 0 !important;
  320. }
  321. }
  322. .about-wrapper .about-image {
  323. position: relative;
  324. max-width: 556px;
  325. }
  326. .about-wrapper .about-image img {
  327. width: 100%;
  328. height: 100%;
  329. }
  330. .about-wrapper .about-image .about-image-2 {
  331. max-width: 288px;
  332. position: absolute;
  333. bottom: -15%;
  334. right: -5%;
  335. }
  336. .about-wrapper .about-image .about-image-2 img {
  337. width: 100%;
  338. height: 100%;
  339. }
  340. @media (max-width: 575px) {
  341. .about-wrapper .about-image .about-image-2 {
  342. max-width: 220px;
  343. }
  344. }
  345. .about-wrapper .about-content {
  346. position: relative;
  347. z-index: 9;
  348. }
  349. .about-wrapper .about-content .about-list {
  350. margin-top: 40px;
  351. display: flex;
  352. align-items: center;
  353. gap: 24px;
  354. }
  355. @media (max-width: 575px) {
  356. .about-wrapper .about-content .about-list {
  357. flex-wrap: wrap;
  358. }
  359. }
  360. .about-wrapper .about-content .about-list ul li {
  361. font-size: 18px;
  362. font-weight: 600;
  363. font-family: "Quicksand", sans-serif;
  364. color: var(--header);
  365. background-color: var(--white);
  366. box-shadow: var(--box-shadow);
  367. padding: 10px 45px 10px 10px;
  368. border-radius: 30px;
  369. }
  370. .about-wrapper .about-content .about-list ul li:not(:last-child) {
  371. margin-bottom: 24px;
  372. }
  373. .about-wrapper .about-content .about-list ul li i {
  374. margin-right: 5px;
  375. color: var(--theme);
  376. }
  377. .about-wrapper .about-content .about-author {
  378. display: flex;
  379. align-items: center;
  380. gap: 30px;
  381. margin-top: 50px;
  382. }
  383. @media (max-width: 1199px) {
  384. .about-wrapper .about-content .about-author {
  385. flex-wrap: wrap;
  386. }
  387. }
  388. @media (max-width: 767px) {
  389. .about-wrapper .about-content .about-author {
  390. margin-top: 30px;
  391. }
  392. }
  393. @media (max-width: 575px) {
  394. .about-wrapper .about-content .about-author {
  395. margin-top: 20px;
  396. }
  397. }
  398. .about-wrapper .about-content .about-author .author-icon {
  399. display: flex;
  400. align-items: center;
  401. gap: 20px;
  402. }
  403. .about-wrapper .about-content .about-author .author-icon .icon {
  404. width: 48px;
  405. height: 48px;
  406. line-height: 48px;
  407. text-align: center;
  408. background-color: var(--theme);
  409. text-align: center;
  410. color: var(--white);
  411. border-radius: 50%;
  412. position: relative;
  413. }
  414. .about-wrapper .about-content .about-author .author-icon .icon::before {
  415. position: absolute;
  416. top: 50%;
  417. left: 50%;
  418. right: 0;
  419. bottom: 0;
  420. width: 60px;
  421. height: 60px;
  422. border-radius: 50%;
  423. border: 1px solid var(--theme);
  424. content: "";
  425. transform: translate(-50%, -50%);
  426. }
  427. .about-wrapper .about-content .about-author .author-icon .content h5 {
  428. font-weight: 600;
  429. }
  430. .about-wrapper .about-content .about-author .author-icon .content h5 a {
  431. color: var(--header);
  432. }
  433. .about-wrapper .about-content .about-author .author-icon .content span {
  434. font-size: 14px;
  435. font-weight: 600;
  436. color: var(--header);
  437. font-family: "Quicksand", sans-serif;
  438. margin-bottom: 5px;
  439. }
  440. .about-activities-section {
  441. position: relative;
  442. }
  443. .about-activities-section .pencil-shape {
  444. position: absolute;
  445. top: -15%;
  446. left: 10px;
  447. animation: rounded 5s linear infinite;
  448. }
  449. @media (max-width: 1199px) {
  450. .about-activities-section .pencil-shape {
  451. display: none;
  452. }
  453. }
  454. .about-activities-section .zebra-shape {
  455. position: absolute;
  456. bottom: 0;
  457. right: 0;
  458. }
  459. @media (max-width: 767px) {
  460. .about-activities-section .zebra-shape {
  461. display: none;
  462. }
  463. }
  464. .about-activities-section-2 {
  465. position: relative;
  466. padding-bottom: 215px;
  467. margin-top: -30px;
  468. }
  469. @media (max-width: 1199px) {
  470. .about-activities-section-2 {
  471. padding-bottom: 205px;
  472. }
  473. }
  474. @media (max-width: 991px) {
  475. .about-activities-section-2 {
  476. margin-top: -55px;
  477. }
  478. }
  479. @media (max-width: 767px) {
  480. .about-activities-section-2 {
  481. margin-top: -50px;
  482. }
  483. }
  484. .about-activities-section-2 .left-shape {
  485. position: absolute;
  486. top: -25%;
  487. left: 0;
  488. }
  489. @media (max-width: 1399px) {
  490. .about-activities-section-2 .left-shape {
  491. display: none;
  492. overflow: hidden;
  493. }
  494. }
  495. .about-activities-section-2 .zebra-shape {
  496. position: absolute;
  497. bottom: 20%;
  498. right: 0;
  499. }
  500. @media (max-width: 1399px) {
  501. .about-activities-section-2 .zebra-shape {
  502. display: none;
  503. }
  504. }
  505. .about-activities-section-2 .bottom-shape {
  506. position: absolute;
  507. bottom: 0;
  508. left: 0;
  509. height: 92px;
  510. }
  511. .about-activities-section-2 .bottom-shape img {
  512. width: 100%;
  513. height: 100%;
  514. object-fit: cover;
  515. }
  516. .about-activities-section-2 .sun-shape {
  517. position: absolute;
  518. top: 5%;
  519. left: 5%;
  520. }
  521. .about-activities-section-2.style-2 {
  522. margin-top: 0;
  523. }
  524. .about-activities-section-2.style-2 .sun-shape {
  525. position: absolute;
  526. top: 45%;
  527. left: 4%;
  528. transform: translateY(-50%);
  529. }
  530. .about-activities-wrapper {
  531. position: relative;
  532. z-index: 9;
  533. }
  534. .about-activities-wrapper .activities-image {
  535. max-width: 580px;
  536. }
  537. .about-activities-wrapper .activities-image img {
  538. width: 100%;
  539. height: 100%;
  540. }
  541. .about-activities-wrapper .activities-content .icon-items {
  542. display: flex;
  543. align-items: center;
  544. gap: 20px;
  545. }
  546. .about-activities-wrapper .activities-content .icon-items:not(:last-child) {
  547. margin-bottom: 30px;
  548. }
  549. .about-activities-wrapper .activities-content .icon-items .icon {
  550. width: 90px;
  551. height: 90px;
  552. line-height: 90px;
  553. text-align: center;
  554. border-radius: 8px;
  555. }
  556. .about-activities-wrapper.style-2 {
  557. margin-bottom: -30px;
  558. }
  559. .about-activities-wrapper.style-2 .activities-image-items {
  560. margin-right: 35px;
  561. position: relative;
  562. }
  563. @media (max-width: 1199px) {
  564. .about-activities-wrapper.style-2 .activities-image-items {
  565. margin-right: 0;
  566. }
  567. }
  568. .about-activities-wrapper.style-2 .activities-image-items img {
  569. width: 100%;
  570. height: 100%;
  571. }
  572. .about-activities-wrapper.style-2 .activities-image-items .radius-shape {
  573. position: absolute;
  574. bottom: 64px;
  575. left: -12%;
  576. z-index: -1;
  577. }
  578. @media screen and (max-width: 400px) {
  579. .about-activities-wrapper.style-2 .activities-image-items .radius-shape {
  580. display: none;
  581. }
  582. }
  583. .about-activities-wrapper.style-2 .activities-image-items .circle-shape {
  584. position: absolute;
  585. top: 15%;
  586. right: 10%;
  587. z-index: -1;
  588. }
  589. .about-activities-wrapper.style-2 .activities-content .icon-items {
  590. gap: 20px;
  591. }
  592. .about-activities-wrapper.style-2 .activities-content .icon-items .icon {
  593. width: 80px;
  594. height: 80px;
  595. line-height: 80px;
  596. text-align: center;
  597. background-color: var(--white);
  598. box-shadow: var(--box-shadow);
  599. border-radius: 50%;
  600. }
  601. .about-activities-wrapper.style-2 .activities-content .icon-items .content h5 {
  602. margin-bottom: 7px;
  603. }
  604. .about-activities-wrapper.style-2 .activities-content .about-author {
  605. display: flex;
  606. align-items: center;
  607. gap: 30px;
  608. margin-top: 50px;
  609. border-top: 1px solid var(--border);
  610. padding-top: 40px;
  611. }
  612. @media (max-width: 1199px) {
  613. .about-activities-wrapper.style-2 .activities-content .about-author {
  614. flex-wrap: wrap;
  615. }
  616. }
  617. .about-activities-wrapper.style-2 .activities-content .about-author .author-image {
  618. display: flex;
  619. align-items: center;
  620. gap: 15px;
  621. }
  622. .about-activities-wrapper.style-2 .activities-content .about-author .author-image .content h6 {
  623. font-size: 18px;
  624. font-weight: 600;
  625. }
  626. .about-activities-wrapper.style-2 .activities-content .about-author .author-image .content p {
  627. color: var(--text);
  628. font-weight: 500;
  629. margin-top: -2px;
  630. }
  631. .about-activities-wrapper.style-2 .activities-content .about-author .author-icon {
  632. display: flex;
  633. align-items: center;
  634. gap: 20px;
  635. }
  636. .about-activities-wrapper.style-2 .activities-content .about-author .author-icon .icon {
  637. width: 48px;
  638. height: 48px;
  639. line-height: 48px;
  640. text-align: center;
  641. background-color: var(--theme);
  642. text-align: center;
  643. color: var(--white);
  644. border-radius: 50%;
  645. position: relative;
  646. }
  647. .about-activities-wrapper.style-2 .activities-content .about-author .author-icon .icon::before {
  648. position: absolute;
  649. top: 50%;
  650. left: 50%;
  651. right: 0;
  652. bottom: 0;
  653. width: 60px;
  654. height: 60px;
  655. border-radius: 50%;
  656. border: 1px solid var(--theme);
  657. content: "";
  658. transform: translate(-50%, -50%);
  659. }
  660. .about-wrapper-2 .about-image-items {
  661. position: relative;
  662. margin-right: 50px;
  663. }
  664. @media (max-width: 1399px) {
  665. .about-wrapper-2 .about-image-items {
  666. margin-right: 20px;
  667. }
  668. }
  669. @media (max-width: 1199px) {
  670. .about-wrapper-2 .about-image-items {
  671. margin-right: 0;
  672. }
  673. }
  674. .about-wrapper-2 .about-image-items .thumb {
  675. position: relative;
  676. z-index: 9;
  677. max-width: 540px;
  678. }
  679. .about-wrapper-2 .about-image-items .thumb img {
  680. width: 100%;
  681. height: 100%;
  682. }
  683. .about-wrapper-2 .about-image-items .border-shape {
  684. position: absolute;
  685. top: -10px;
  686. left: 50px;
  687. animation: rotated2 20s infinite linear;
  688. }
  689. @media (max-width: 1399px) {
  690. .about-wrapper-2 .about-image-items .border-shape {
  691. display: none;
  692. }
  693. }
  694. .about-wrapper-2 .about-content .icon-items {
  695. gap: 20px;
  696. display: flex;
  697. align-items: center;
  698. }
  699. .about-wrapper-2 .about-content .icon-items .icon {
  700. width: 80px;
  701. height: 80px;
  702. line-height: 80px;
  703. text-align: center;
  704. background-color: var(--theme);
  705. border-radius: 8px;
  706. }
  707. .about-wrapper-2 .about-content .icon-items .content h5 {
  708. margin-bottom: 7px;
  709. }
  710. .about-wrapper-2 .about-content .about-author {
  711. display: flex;
  712. align-items: center;
  713. gap: 30px;
  714. margin-top: 50px;
  715. border-top: 1px solid var(--border);
  716. padding-top: 40px;
  717. }
  718. @media (max-width: 1199px) {
  719. .about-wrapper-2 .about-content .about-author {
  720. flex-wrap: wrap;
  721. }
  722. }
  723. @media (max-width: 767px) {
  724. .about-wrapper-2 .about-content .about-author {
  725. padding-top: 35px;
  726. margin-top: 30px;
  727. }
  728. }
  729. @media (max-width: 575px) {
  730. .about-wrapper-2 .about-content .about-author {
  731. padding-top: 25px;
  732. margin-top: 20px;
  733. }
  734. }
  735. .about-wrapper-2 .about-content .about-author .author-image {
  736. display: flex;
  737. align-items: center;
  738. gap: 15px;
  739. }
  740. .about-wrapper-2 .about-content .about-author .author-image .content h6 {
  741. font-size: 18px;
  742. font-weight: 600;
  743. }
  744. .about-wrapper-2 .about-content .about-author .author-image .content p {
  745. color: var(--text);
  746. font-weight: 500;
  747. margin-top: -2px;
  748. }
  749. .about-wrapper-2 .about-content .about-author .author-icon {
  750. display: flex;
  751. align-items: center;
  752. gap: 20px;
  753. }
  754. .about-wrapper-2 .about-content .about-author .author-icon .icon {
  755. width: 48px;
  756. height: 48px;
  757. line-height: 48px;
  758. text-align: center;
  759. background-color: var(--theme);
  760. text-align: center;
  761. color: var(--white);
  762. border-radius: 50%;
  763. position: relative;
  764. }
  765. .about-wrapper-2 .about-content .about-author .author-icon .icon::before {
  766. position: absolute;
  767. top: 50%;
  768. left: 50%;
  769. right: 0;
  770. bottom: 0;
  771. width: 60px;
  772. height: 60px;
  773. border-radius: 50%;
  774. border: 1px solid var(--theme);
  775. content: "";
  776. transform: translate(-50%, -50%);
  777. }
  778. .about-section-2 {
  779. position: relative;
  780. }
  781. .about-section-2 .left-shape {
  782. position: absolute;
  783. top: 50%;
  784. left: 0;
  785. transform: translateY(-50%);
  786. }
  787. @media (max-width: 1399px) {
  788. .about-section-2 .left-shape {
  789. display: none;
  790. }
  791. }
  792. .about-section-2 .frame-shape {
  793. position: absolute;
  794. top: 30%;
  795. right: 20px;
  796. animation: rounded 5s linear infinite;
  797. }
  798. @media (max-width: 1399px) {
  799. .about-section-2 .frame-shape {
  800. display: none;
  801. }
  802. }
  803. @media (min-width: 1200px) {
  804. .about-wrapper-3 {
  805. margin-top: -29px;
  806. }
  807. }
  808. .about-wrapper-3 .about-image-area {
  809. position: relative;
  810. z-index: 9;
  811. }
  812. .about-wrapper-3 .about-image-area .about-image {
  813. max-width: 590px;
  814. position: relative;
  815. }
  816. .about-wrapper-3 .about-image-area .about-image img {
  817. width: 100%;
  818. height: 100%;
  819. }
  820. .about-wrapper-3 .about-image-area .about-image .about-image-2 {
  821. position: absolute;
  822. bottom: 0;
  823. left: 50px;
  824. max-width: 245px;
  825. }
  826. @media (max-width: 1199px) {
  827. .about-wrapper-3 .about-image-area .about-image .about-image-2 {
  828. max-width: 200px;
  829. }
  830. }
  831. @media (max-width: 991px) {
  832. .about-wrapper-3 .about-image-area .about-image .about-image-2 {
  833. max-width: 245px;
  834. }
  835. }
  836. @media (max-width: 767px) {
  837. .about-wrapper-3 .about-image-area .about-image .about-image-2 {
  838. max-width: 200px;
  839. }
  840. }
  841. @media (max-width: 575px) {
  842. .about-wrapper-3 .about-image-area .about-image .about-image-2 {
  843. max-width: 170px;
  844. }
  845. }
  846. .about-wrapper-3 .about-image-area .about-image .about-image-2 img {
  847. width: 100%;
  848. height: 100%;
  849. border: 15px solid var(--white);
  850. border-radius: 50%;
  851. box-shadow: var(--box-shadow);
  852. }
  853. .about-wrapper-3 .about-image-area .radius-shape {
  854. position: absolute;
  855. bottom: 15%;
  856. left: -70px;
  857. }
  858. .about-wrapper-3 .about-image-area .circle-shape {
  859. position: absolute;
  860. top: 15%;
  861. right: 20%;
  862. }
  863. .about-wrapper-3 .about-content {
  864. position: relative;
  865. z-index: 9;
  866. }
  867. @media (max-width: 1399px) {
  868. .about-wrapper-3 .about-content br {
  869. display: none;
  870. }
  871. }
  872. .about-wrapper-3 .about-content .list-items {
  873. margin-top: 30px;
  874. }
  875. .about-wrapper-3 .about-content .list-items li {
  876. font-size: 18px;
  877. font-weight: 600;
  878. color: var(--header);
  879. font-family: "Quicksand", sans-serif;
  880. }
  881. .about-wrapper-3 .about-content .list-items li:not(:last-child) {
  882. margin-bottom: 10px;
  883. }
  884. .about-wrapper-3 .about-content .list-items li i {
  885. margin-right: 5px;
  886. color: var(--theme);
  887. }
  888. .about-wrapper-3 .about-content .about-author {
  889. display: flex;
  890. align-items: center;
  891. gap: 30px;
  892. margin-top: 50px;
  893. border-top: 1px solid var(--border);
  894. padding-top: 40px;
  895. }
  896. @media (max-width: 1199px) {
  897. .about-wrapper-3 .about-content .about-author {
  898. flex-wrap: wrap;
  899. }
  900. }
  901. .about-wrapper-3 .about-content .about-author .author-image {
  902. display: flex;
  903. align-items: center;
  904. gap: 15px;
  905. }
  906. .about-wrapper-3 .about-content .about-author .author-image .content h6 {
  907. font-size: 18px;
  908. font-weight: 600;
  909. }
  910. .about-wrapper-3 .about-content .about-author .author-image .content p {
  911. color: var(--text);
  912. font-weight: 500;
  913. margin-top: -2px;
  914. }
  915. @-webkit-keyframes rippleOne {
  916. 70% {
  917. -webkit-box-shadow: 0 0 0 40px rgba(244, 68, 56, 0);
  918. box-shadow: 0 0 0 40px rgba(244, 68, 56, 0);
  919. }
  920. 100% {
  921. -webkit-box-shadow: 0 0 0 0 rgba(244, 68, 56, 0);
  922. box-shadow: 0 0 0 0 rgba(244, 68, 56, 0);
  923. }
  924. }
  925. @keyframes rippleOne {
  926. 70% {
  927. -webkit-box-shadow: 0 0 0 40px rgba(244, 68, 56, 0);
  928. box-shadow: 0 0 0 40px rgba(244, 68, 56, 0);
  929. }
  930. 100% {
  931. -webkit-box-shadow: 0 0 0 0 rgba(244, 68, 56, 0);
  932. box-shadow: 0 0 0 0 rgba(244, 68, 56, 0);
  933. }
  934. }
  935. @keyframes cir36 {
  936. 100% {
  937. transform: rotate(360deg);
  938. }
  939. }
  940. @keyframes rounded {
  941. 50% {
  942. transform: rotate(15deg);
  943. }
  944. }
  945. @-webkit-keyframes spinner {
  946. to {
  947. -webkit-transform: rotateZ(360deg);
  948. transform: rotateZ(360deg);
  949. }
  950. }
  951. @keyframes spinner {
  952. to {
  953. -webkit-transform: rotateZ(360deg);
  954. transform: rotateZ(360deg);
  955. }
  956. }
  957. @-webkit-keyframes letters-loading {
  958. 0%, 75%, 100% {
  959. opacity: 0;
  960. transform: rotateY(-90deg);
  961. }
  962. 25%, 50% {
  963. opacity: 1;
  964. transform: rotateY(0deg);
  965. }
  966. }
  967. @keyframes letters-loading {
  968. 0%, 75%, 100% {
  969. opacity: 0;
  970. transform: rotateY(-90deg);
  971. }
  972. 25%, 50% {
  973. opacity: 1;
  974. transform: rotateY(0deg);
  975. }
  976. }
  977. @keyframes loaderspin {
  978. 0% {
  979. transform: translate(-50%, -50%) rotate(0deg);
  980. }
  981. 100% {
  982. transform: translate(-50%, -50%) rotate(360deg);
  983. }
  984. }
  985. @keyframes tpswing {
  986. 0% {
  987. -webkit-transform: rotate(20deg);
  988. -ms-transform: rotate(20deg);
  989. transform: rotate(20deg);
  990. }
  991. 100% {
  992. -webkit-transform: rotate(0deg);
  993. -ms-transform: rotate(0deg);
  994. transform: rotate(0deg);
  995. }
  996. }
  997. @keyframes width {
  998. 0% {
  999. width: 0%;
  1000. }
  1001. 100% {
  1002. width: 100%;
  1003. }
  1004. }
  1005. @-webkit-keyframes width {
  1006. 0% {
  1007. width: 0%;
  1008. }
  1009. 100% {
  1010. width: 100%;
  1011. }
  1012. }
  1013. @-webkit-keyframes loaderspin {
  1014. 0% {
  1015. transform: translate(-50%, -50%) rotate(0deg);
  1016. }
  1017. 100% {
  1018. transform: translate(-50%, -50%) rotate(360deg);
  1019. }
  1020. }
  1021. @keyframes loaderpulse {
  1022. 0% {
  1023. transform: scale(1);
  1024. }
  1025. 100% {
  1026. transform: scale(1.2);
  1027. }
  1028. }
  1029. @keyframes rounded {
  1030. 50% {
  1031. transform: rotate(20deg);
  1032. }
  1033. }
  1034. @keyframes cir36 {
  1035. 100% {
  1036. transform: rotate(360deg);
  1037. }
  1038. }
  1039. .float-bob-y {
  1040. -webkit-animation-name: float-bob-y;
  1041. animation-name: float-bob-y;
  1042. -webkit-animation-duration: 3s;
  1043. animation-duration: 3s;
  1044. -webkit-animation-iteration-count: infinite;
  1045. animation-iteration-count: infinite;
  1046. -webkit-animation-timing-function: linear;
  1047. animation-timing-function: linear;
  1048. }
  1049. @-webkit-keyframes float-bob-y {
  1050. 0% {
  1051. -webkit-transform: translateY(-30px);
  1052. transform: translateY(-30px);
  1053. }
  1054. 50% {
  1055. -webkit-transform: translateY(-10px);
  1056. transform: translateY(-10px);
  1057. }
  1058. 100% {
  1059. -webkit-transform: translateY(-30px);
  1060. transform: translateY(-30px);
  1061. }
  1062. }
  1063. @keyframes float-bob-y {
  1064. 0% {
  1065. -webkit-transform: translateY(-30px);
  1066. transform: translateY(-30px);
  1067. }
  1068. 50% {
  1069. -webkit-transform: translateY(-10px);
  1070. transform: translateY(-10px);
  1071. }
  1072. 100% {
  1073. -webkit-transform: translateY(-30px);
  1074. transform: translateY(-30px);
  1075. }
  1076. }
  1077. .float-bob-x {
  1078. -webkit-animation-name: float-bob-x;
  1079. animation-name: float-bob-x;
  1080. -webkit-animation-duration: 3s;
  1081. animation-duration: 3s;
  1082. -webkit-animation-iteration-count: infinite;
  1083. animation-iteration-count: infinite;
  1084. -webkit-animation-timing-function: linear;
  1085. animation-timing-function: linear;
  1086. }
  1087. @-webkit-keyframes float-bob-x {
  1088. 0% {
  1089. -webkit-transform: translateX(0px);
  1090. transform: translateX(30px);
  1091. }
  1092. 50% {
  1093. -webkit-transform: translateX(10px);
  1094. transform: translateX(10px);
  1095. }
  1096. 100% {
  1097. -webkit-transform: translateX(30px);
  1098. transform: translateX(30px);
  1099. }
  1100. }
  1101. @keyframes float-bob-x {
  1102. 0% {
  1103. -webkit-transform: translateX(30px);
  1104. transform: translateX(30px);
  1105. }
  1106. 50% {
  1107. -webkit-transform: translateX(10px);
  1108. transform: translateX(10px);
  1109. }
  1110. 100% {
  1111. -webkit-transform: translateX(30px);
  1112. transform: translateX(30px);
  1113. }
  1114. }
  1115. @keyframes bounce-x {
  1116. 0% {
  1117. -webkit-transform: translateX(0);
  1118. transform: translateX(0);
  1119. }
  1120. 50% {
  1121. -webkit-transform: translateX(30px);
  1122. transform: translateX(30px);
  1123. }
  1124. 100% {
  1125. -webkit-transform: translateX(0);
  1126. transform: translateX(0);
  1127. }
  1128. }
  1129. .bounce-x {
  1130. -webkit-animation: bounce-x 7s infinite linear;
  1131. animation: bounce-x 7s infinite linear;
  1132. }
  1133. @keyframes criss-cross-left {
  1134. 0% {
  1135. left: -20px;
  1136. }
  1137. 50% {
  1138. left: 50%;
  1139. width: 20px;
  1140. height: 20px;
  1141. }
  1142. 100% {
  1143. left: 50%;
  1144. width: 375px;
  1145. height: 375px;
  1146. }
  1147. }
  1148. @keyframes criss-cross-right {
  1149. 0% {
  1150. right: -20px;
  1151. }
  1152. 50% {
  1153. right: 50%;
  1154. width: 20px;
  1155. height: 20px;
  1156. }
  1157. 100% {
  1158. right: 50%;
  1159. width: 375px;
  1160. height: 375px;
  1161. }
  1162. }
  1163. @keyframes rotated2 {
  1164. 0% {
  1165. transform: rotate(0);
  1166. }
  1167. 100% {
  1168. transform: rotate(-360deg);
  1169. }
  1170. }
  1171. @keyframes wave {
  1172. 0% {
  1173. transform: translateX(0);
  1174. }
  1175. 50% {
  1176. transform: translateX(-25%);
  1177. }
  1178. 100% {
  1179. transform: translateX(-50%);
  1180. }
  1181. }
  1182. .brand-wrapper {
  1183. margin-top: -5px;
  1184. }
  1185. .brand-wrapper h6 {
  1186. font-size: 22px;
  1187. position: relative;
  1188. margin-bottom: 50px;
  1189. color: var(--header);
  1190. font-weight: 700;
  1191. }
  1192. .brand-wrapper h6::before {
  1193. position: absolute;
  1194. top: 15px;
  1195. left: 35px;
  1196. content: "";
  1197. height: 1px;
  1198. width: 480px;
  1199. background-color: var(--theme);
  1200. }
  1201. @media (max-width: 1399px) {
  1202. .brand-wrapper h6::before {
  1203. display: none;
  1204. }
  1205. }
  1206. .brand-wrapper h6::after {
  1207. position: absolute;
  1208. top: 15px;
  1209. right: 35px;
  1210. content: "";
  1211. height: 1px;
  1212. width: 480px;
  1213. background-color: var(--theme);
  1214. }
  1215. @media (max-width: 1399px) {
  1216. .brand-wrapper h6::after {
  1217. display: none;
  1218. }
  1219. }
  1220. .brand-wrapper .brand-image {
  1221. text-align: center;
  1222. filter: grayscale(100%);
  1223. transition: all 0.4s ease-in-out;
  1224. opacity: 0.4;
  1225. }
  1226. .brand-wrapper .brand-image:hover {
  1227. filter: initial;
  1228. opacity: 1;
  1229. }
  1230. .brand-wrapper .swiper-slide.swiper-slide-active .brand-image {
  1231. filter: initial;
  1232. opacity: 1;
  1233. }
  1234. .contact-form-items .form-clt span {
  1235. color: var(--white);
  1236. margin-bottom: 20px;
  1237. display: inline-block;
  1238. }
  1239. .contact-form-items .form-clt input, .contact-form-items .form-clt textarea {
  1240. width: 100%;
  1241. outline: none;
  1242. border: none;
  1243. background-color: transparent;
  1244. border: 1px solid var(--white);
  1245. color: var(--white);
  1246. padding: 18px 20px;
  1247. }
  1248. @media (max-width: 767px) {
  1249. .contact-form-items .form-clt input, .contact-form-items .form-clt textarea {
  1250. padding: 14px 20px;
  1251. }
  1252. }
  1253. @media (max-width: 575px) {
  1254. .contact-form-items .form-clt input, .contact-form-items .form-clt textarea {
  1255. padding: 12px 18px;
  1256. }
  1257. }
  1258. .contact-form-items .form-clt input::placeholder, .contact-form-items .form-clt textarea::placeholder {
  1259. color: rgba(255, 255, 255, 0.7019607843);
  1260. }
  1261. .contact-form-items .form-clt textarea {
  1262. padding-bottom: 70px;
  1263. }
  1264. .contact-wrapper {
  1265. position: relative;
  1266. z-index: 9;
  1267. background-color: var(--theme2);
  1268. border-radius: 100px;
  1269. margin-top: 55px;
  1270. }
  1271. @media (max-width: 991px) {
  1272. .contact-wrapper {
  1273. margin-top: 0;
  1274. }
  1275. }
  1276. .contact-wrapper .contact-image {
  1277. margin-top: -55px;
  1278. position: relative;
  1279. margin-right: 50px;
  1280. }
  1281. @media (max-width: 1199px) {
  1282. .contact-wrapper .contact-image {
  1283. left: 35px;
  1284. height: 590px;
  1285. }
  1286. }
  1287. @media (max-width: 991px) {
  1288. .contact-wrapper .contact-image {
  1289. display: none;
  1290. }
  1291. }
  1292. .contact-wrapper .contact-image img {
  1293. width: 100%;
  1294. height: 100%;
  1295. object-fit: cover;
  1296. }
  1297. .contact-wrapper .contact-image .cricle-shape {
  1298. position: absolute;
  1299. top: 24%;
  1300. left: -27px;
  1301. z-index: -1;
  1302. animation: cir36 10s linear infinite;
  1303. }
  1304. .contact-wrapper .contact-content {
  1305. margin-top: 50px;
  1306. padding: 0 70px 80px;
  1307. }
  1308. @media (max-width: 1199px) {
  1309. .contact-wrapper .contact-content {
  1310. margin-top: 60px;
  1311. padding: 0 35px 60px;
  1312. }
  1313. }
  1314. @media (max-width: 991px) {
  1315. .contact-wrapper .contact-content {
  1316. margin-top: 0;
  1317. margin-left: 0;
  1318. padding: 0;
  1319. }
  1320. }
  1321. @media (max-width: 991px) {
  1322. .contact-wrapper .contact-content {
  1323. padding: 50px;
  1324. }
  1325. }
  1326. @media (max-width: 767px) {
  1327. .contact-wrapper .contact-content {
  1328. padding: 50px 40px;
  1329. }
  1330. }
  1331. @media (max-width: 575px) {
  1332. .contact-wrapper .contact-content {
  1333. padding: 40px 30px;
  1334. }
  1335. }
  1336. .contact-wrapper .contact-content .contact-form-items .form-clt span {
  1337. text-transform: capitalize;
  1338. }
  1339. .contact-wrapper .contact-content .contact-form-items .form-clt input::placeholder, .contact-wrapper .contact-content .contact-form-items .form-clt textarea::placeholder {
  1340. color: var(--white);
  1341. }
  1342. .contact-wrapper .contact-content .contact-form-items .theme-btn {
  1343. color: var(--theme);
  1344. border-radius: 8px;
  1345. }
  1346. .contact-wrapper .contact-content .contact-form-items .theme-btn:hover {
  1347. color: var(--white);
  1348. }
  1349. .contact-info-area {
  1350. padding-top: 220px;
  1351. display: flex;
  1352. align-items: center;
  1353. justify-content: space-between;
  1354. border-bottom: 1px solid rgba(56, 84, 105, 0.2);
  1355. }
  1356. @media (max-width: 1199px) {
  1357. .contact-info-area {
  1358. flex-wrap: wrap;
  1359. gap: 40px;
  1360. padding-top: 85px;
  1361. justify-content: initial;
  1362. }
  1363. }
  1364. @media (max-width: 575px) {
  1365. .contact-info-area {
  1366. gap: 30px;
  1367. }
  1368. }
  1369. .contact-info-area .contact-info-items {
  1370. display: flex;
  1371. align-items: center;
  1372. gap: 20px;
  1373. justify-content: space-between;
  1374. position: relative;
  1375. padding-bottom: 40px;
  1376. }
  1377. @media (max-width: 1199px) {
  1378. .contact-info-area .contact-info-items {
  1379. flex-wrap: wrap;
  1380. }
  1381. }
  1382. .contact-info-area .contact-info-items .icon {
  1383. width: 65px;
  1384. height: 65px;
  1385. line-height: 65px;
  1386. text-align: center;
  1387. position: relative;
  1388. }
  1389. .contact-info-area .contact-info-items .icon::before {
  1390. position: absolute;
  1391. top: 0;
  1392. left: 0;
  1393. right: 0;
  1394. bottom: 0;
  1395. width: 100%;
  1396. height: 100%;
  1397. content: "";
  1398. background-repeat: no-repeat;
  1399. background-size: cover;
  1400. background-image: url("../image/circle.png");
  1401. animation: cir36 10s linear infinite;
  1402. }
  1403. .contact-info-area .contact-info-items .content p {
  1404. color: var(--header);
  1405. margin-bottom: 5px;
  1406. }
  1407. .contact-info-area .contact-info-items .content h3 {
  1408. font-size: 24px;
  1409. color: var(--header);
  1410. }
  1411. .contact-info-area .contact-info-items .content h3 a {
  1412. color: var(--header);
  1413. }
  1414. .contact-section {
  1415. position: relative;
  1416. }
  1417. .contact-section .line-1 {
  1418. position: absolute;
  1419. top: 42%;
  1420. left: 5%;
  1421. animation: rounded 5s linear infinite;
  1422. }
  1423. .contact-section .line-2 {
  1424. position: absolute;
  1425. top: 50%;
  1426. transform: translateY(-50%);
  1427. right: 0;
  1428. }
  1429. .contact-wrapper-2 .contact-left-items .contact-info-area-2 {
  1430. padding: 40px;
  1431. background-color: var(--theme);
  1432. border-radius: 16px 16px 0px 0px;
  1433. }
  1434. .contact-wrapper-2 .contact-left-items .contact-info-area-2 .contact-info-items {
  1435. display: flex;
  1436. align-items: center;
  1437. gap: 20px;
  1438. position: relative;
  1439. padding-bottom: 20px;
  1440. border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  1441. }
  1442. @media (max-width: 1199px) {
  1443. .contact-wrapper-2 .contact-left-items .contact-info-area-2 .contact-info-items {
  1444. flex-wrap: wrap;
  1445. }
  1446. }
  1447. .contact-wrapper-2 .contact-left-items .contact-info-area-2 .contact-info-items .icon {
  1448. width: 65px;
  1449. height: 65px;
  1450. line-height: 65px;
  1451. text-align: center;
  1452. position: relative;
  1453. }
  1454. .contact-wrapper-2 .contact-left-items .contact-info-area-2 .contact-info-items .icon::before {
  1455. position: absolute;
  1456. top: 0;
  1457. left: 0;
  1458. right: 0;
  1459. bottom: 0;
  1460. width: 100%;
  1461. height: 100%;
  1462. content: "";
  1463. background-repeat: no-repeat;
  1464. background-size: cover;
  1465. background-image: url("../image/circle-3.png");
  1466. animation: cir36 10s linear infinite;
  1467. }
  1468. .contact-wrapper-2 .contact-left-items .contact-info-area-2 .contact-info-items .content p {
  1469. color: var(--white);
  1470. margin-bottom: 5px;
  1471. }
  1472. .contact-wrapper-2 .contact-left-items .contact-info-area-2 .contact-info-items .content h3 {
  1473. font-size: 24px;
  1474. color: var(--white);
  1475. }
  1476. .contact-wrapper-2 .contact-left-items .contact-info-area-2 .contact-info-items .content h3 a {
  1477. color: var(--white);
  1478. }
  1479. .contact-wrapper-2 .contact-left-items .contact-info-area-2 .contact-info-items.border-none {
  1480. border: none !important;
  1481. }
  1482. .contact-wrapper-2 .contact-left-items .video-image {
  1483. position: relative;
  1484. }
  1485. .contact-wrapper-2 .contact-left-items .video-image img {
  1486. width: 100%;
  1487. height: 100%;
  1488. border-radius: 0px 0px 16px 16px;
  1489. }
  1490. .contact-wrapper-2 .contact-left-items .video-image .video-box {
  1491. position: absolute;
  1492. top: 50%;
  1493. left: 50%;
  1494. transform: translate(-50%, -50%);
  1495. z-index: 9;
  1496. }
  1497. .contact-wrapper-2 .contact-left-items .video-image .video-box .video-btn {
  1498. display: inline-block;
  1499. width: 60px;
  1500. height: 60px;
  1501. line-height: 60px;
  1502. text-align: center;
  1503. border-radius: 50%;
  1504. color: var(--theme);
  1505. background-color: var(--white);
  1506. }
  1507. .contact-wrapper-2 .contact-left-items .video-image .video-box .ripple::before, .contact-wrapper-2 .contact-left-items .video-image .video-box .ripple::after {
  1508. box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8);
  1509. }
  1510. .contact-wrapper-2 .contact-content {
  1511. margin-left: 40px;
  1512. }
  1513. @media (max-width: 991px) {
  1514. .contact-wrapper-2 .contact-content {
  1515. margin-left: 0;
  1516. }
  1517. }
  1518. .contact-wrapper-2 .contact-content h2 {
  1519. margin-bottom: 10px;
  1520. }
  1521. .contact-wrapper-2 .contact-content .contact-form-items {
  1522. margin-top: 30px;
  1523. }
  1524. .contact-wrapper-2 .contact-content .contact-form-items .form-clt span {
  1525. color: var(--header);
  1526. font-weight: 600;
  1527. text-transform: capitalize;
  1528. }
  1529. .contact-wrapper-2 .contact-content .contact-form-items .form-clt input, .contact-wrapper-2 .contact-content .contact-form-items .form-clt textarea {
  1530. border: 1px solid var(--border);
  1531. color: var(--text);
  1532. padding: 18px 20px;
  1533. border-radius: 5px;
  1534. }
  1535. .contact-wrapper-2 .contact-content .contact-form-items .form-clt input::placeholder, .contact-wrapper-2 .contact-content .contact-form-items .form-clt textarea::placeholder {
  1536. color: var(--text);
  1537. }
  1538. .contact-wrapper-2 .contact-content .contact-form-items .form-clt textarea {
  1539. padding-bottom: 150px;
  1540. }
  1541. .map-items .googpemap iframe {
  1542. width: 100%;
  1543. height: 600px;
  1544. }
  1545. @media (max-width: 575px) {
  1546. .map-items .googpemap iframe {
  1547. height: 400px;
  1548. }
  1549. }
  1550. .cta-section {
  1551. position: relative;
  1552. background-position: initial;
  1553. }
  1554. .cta-section .plane-shape {
  1555. position: absolute;
  1556. left: 50px;
  1557. top: 60%;
  1558. animation: rounded 5s linear infinite;
  1559. }
  1560. .cta-section .pencil-shape {
  1561. position: absolute;
  1562. bottom: 0;
  1563. right: 0;
  1564. }
  1565. .cta-wrapper {
  1566. margin-top: 45px;
  1567. }
  1568. @media (max-width: 1399px) {
  1569. .cta-wrapper {
  1570. margin-top: 45px;
  1571. }
  1572. }
  1573. @media (max-width: 991px) {
  1574. .cta-wrapper {
  1575. text-align: center;
  1576. margin-top: 60px;
  1577. }
  1578. }
  1579. .cta-wrapper .cta-image {
  1580. text-align: right;
  1581. margin-bottom: -120px;
  1582. position: relative;
  1583. z-index: 9;
  1584. }
  1585. @media (max-width: 1199px) {
  1586. .cta-wrapper .cta-image {
  1587. margin-bottom: -100px;
  1588. }
  1589. }
  1590. @media (max-width: 991px) {
  1591. .cta-wrapper .cta-image {
  1592. margin-bottom: -80px;
  1593. text-align: center;
  1594. }
  1595. }
  1596. .cta-wrapper .cta-image .cta-shape {
  1597. position: absolute;
  1598. bottom: 0;
  1599. left: 0;
  1600. z-index: -1;
  1601. }
  1602. @media (max-width: 1399px) {
  1603. .cta-wrapper .cta-image .cta-shape {
  1604. left: 50%;
  1605. transform: translateX(-50%);
  1606. }
  1607. }
  1608. @media (max-width: 1399px) {
  1609. .cta-wrapper .cta-image .cta-shape {
  1610. left: 35%;
  1611. }
  1612. }
  1613. @media (max-width: 991px) {
  1614. .cta-wrapper .cta-image .cta-shape {
  1615. left: 39%;
  1616. }
  1617. }
  1618. .main-cta-section {
  1619. position: relative;
  1620. }
  1621. .main-cta-section .plane-shape {
  1622. position: absolute;
  1623. top: -50px;
  1624. right: 20px;
  1625. }
  1626. .main-cta-wrapper {
  1627. position: relative;
  1628. z-index: 9;
  1629. }
  1630. .main-cta-wrapper .cta-bg {
  1631. position: absolute;
  1632. top: 0;
  1633. left: 0;
  1634. background-color: var(--theme);
  1635. transition: all 500ms ease;
  1636. mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1170 485"><path d="M93.3383 50.2529C66.3045 51.6585 41.1387 60.7949 23.6656 75.5536C6.19249 90.3123 -2.15943 109.444 0.478019 128.654L38.7211 404.697C43.6663 440.539 85.4259 468.182 136.197 469.198L941.937 484.972C988.862 485.909 1030.4 463.653 1042.16 431.403L1166.78 89.5314C1174.91 67.1981 1167.44 43.4592 1146.67 25.7331C1125.9 8.00706 1094.36 -1.51972 1062.05 0.198227L93.3383 50.2529Z" /></svg>');
  1637. mask-repeat: no-repeat;
  1638. mask-position: center center;
  1639. mask-size: cover;
  1640. width: 100%;
  1641. height: 100%;
  1642. z-index: -1;
  1643. }
  1644. .main-cta-wrapper .newsletter-items {
  1645. max-width: 550px;
  1646. text-align: center;
  1647. margin: 38px auto;
  1648. position: relative;
  1649. }
  1650. @media (max-width: 767px) {
  1651. .main-cta-wrapper .newsletter-items {
  1652. padding: 0 15px;
  1653. }
  1654. }
  1655. .main-cta-wrapper .newsletter-items .form-clt input {
  1656. width: 100%;
  1657. background-color: var(--white);
  1658. border: none;
  1659. outline: none;
  1660. border-radius: 8px;
  1661. padding: 20px 20px;
  1662. color: var(--text);
  1663. }
  1664. .main-cta-wrapper .newsletter-items .theme-btn {
  1665. position: absolute;
  1666. top: 8px;
  1667. right: 8px;
  1668. bottom: 8px;
  1669. border-radius: 6px;
  1670. padding: 16px 40px;
  1671. }
  1672. @media (max-width: 767px) {
  1673. .main-cta-wrapper .newsletter-items .theme-btn {
  1674. right: 25px;
  1675. }
  1676. }
  1677. .main-cta-wrapper .pencil-shape {
  1678. position: absolute;
  1679. top: 30%;
  1680. left: 5%;
  1681. opacity: 0.5;
  1682. animation: rounded 5s linear infinite;
  1683. }
  1684. .main-cta-wrapper .plane-shape {
  1685. position: absolute;
  1686. top: 50%;
  1687. right: 10%;
  1688. transform: translateY(-50%);
  1689. }
  1690. .main-cta-wrapper .cta-shape {
  1691. position: absolute;
  1692. left: 15%;
  1693. bottom: 10%;
  1694. }
  1695. .instagram-wrapper {
  1696. padding: 0 75px;
  1697. }
  1698. @media (max-width: 1399px) {
  1699. .instagram-wrapper {
  1700. padding: 0 40px;
  1701. }
  1702. }
  1703. @media (max-width: 1199px) {
  1704. .instagram-wrapper {
  1705. padding: 0 30px;
  1706. }
  1707. }
  1708. .instagram-wrapper h3 {
  1709. margin-bottom: 50px;
  1710. position: relative;
  1711. margin-top: -6px;
  1712. }
  1713. .instagram-wrapper h3::before {
  1714. position: absolute;
  1715. top: 15px;
  1716. left: 15%;
  1717. content: "";
  1718. height: 1px;
  1719. width: 480px;
  1720. background-color: var(--theme);
  1721. }
  1722. @media (max-width: 1399px) {
  1723. .instagram-wrapper h3::before {
  1724. display: none;
  1725. }
  1726. }
  1727. .instagram-wrapper h3::after {
  1728. position: absolute;
  1729. top: 15px;
  1730. right: 15%;
  1731. content: "";
  1732. height: 1px;
  1733. width: 480px;
  1734. background-color: var(--theme);
  1735. }
  1736. @media (max-width: 1399px) {
  1737. .instagram-wrapper h3::after {
  1738. display: none;
  1739. }
  1740. }
  1741. .instagram-wrapper .instagram-banner-items .banner-image {
  1742. position: relative;
  1743. }
  1744. @media (max-width: 767px) {
  1745. .instagram-wrapper .instagram-banner-items .banner-image {
  1746. height: 450px;
  1747. }
  1748. .instagram-wrapper .instagram-banner-items .banner-image img {
  1749. object-fit: cover;
  1750. }
  1751. }
  1752. @media (max-width: 575px) {
  1753. .instagram-wrapper .instagram-banner-items .banner-image {
  1754. height: 380px;
  1755. }
  1756. }
  1757. .instagram-wrapper .instagram-banner-items .banner-image img {
  1758. width: 100%;
  1759. height: 100%;
  1760. }
  1761. .instagram-wrapper .instagram-banner-items .banner-image::before {
  1762. position: absolute;
  1763. top: 0;
  1764. left: 0;
  1765. right: 0;
  1766. bottom: 0;
  1767. content: "";
  1768. background: #385469;
  1769. opacity: 0.6;
  1770. transform: scale(1, 0);
  1771. transition: transform 500ms ease;
  1772. transform-origin: bottom center;
  1773. z-index: 1;
  1774. }
  1775. .instagram-wrapper .instagram-banner-items .banner-image .icon {
  1776. position: absolute;
  1777. width: 68px;
  1778. height: 68px;
  1779. line-height: 68px;
  1780. text-align: center;
  1781. border-radius: 50%;
  1782. background-color: var(--theme);
  1783. font-size: 28px;
  1784. top: 50%;
  1785. left: 50%;
  1786. transform: translate(-50%, -50%);
  1787. z-index: 99;
  1788. color: var(--white);
  1789. opacity: 0;
  1790. transition: all 0.4s ease-in-out;
  1791. }
  1792. .instagram-wrapper .instagram-banner-items:hover .banner-image::before {
  1793. transform: scale(1, 1);
  1794. transform-origin: top center;
  1795. }
  1796. .instagram-wrapper .instagram-banner-items:hover .banner-image .icon {
  1797. opacity: 1;
  1798. }
  1799. @media (max-width: 1199px) {
  1800. .cta-wrapper-2 {
  1801. margin-top: 37px;
  1802. }
  1803. }
  1804. @media (max-width: 991px) {
  1805. .cta-wrapper-2 {
  1806. margin-top: 67px;
  1807. text-align: center;
  1808. }
  1809. }
  1810. @media (max-width: 575px) {
  1811. .cta-wrapper-2 {
  1812. margin-top: 60px;
  1813. }
  1814. }
  1815. @media (max-width: 470px) {
  1816. .cta-wrapper-2 {
  1817. margin-top: 55px;
  1818. }
  1819. }
  1820. .cta-wrapper-2 .cta-image-area {
  1821. position: relative;
  1822. margin-bottom: -120px;
  1823. margin-top: -95px;
  1824. }
  1825. @media (max-width: 991px) {
  1826. .cta-wrapper-2 .cta-image-area {
  1827. margin-top: 0;
  1828. }
  1829. }
  1830. .cta-wrapper-2 .cta-image-area .cta-image {
  1831. max-width: 510px;
  1832. margin-left: 100px;
  1833. position: relative;
  1834. z-index: 9;
  1835. }
  1836. @media (max-width: 991px) {
  1837. .cta-wrapper-2 .cta-image-area .cta-image {
  1838. margin-left: 0;
  1839. }
  1840. }
  1841. .cta-wrapper-2 .cta-image-area .cta-image img {
  1842. width: 100%;
  1843. height: 100%;
  1844. }
  1845. .cta-wrapper-2 .cta-image-area .bg-shape {
  1846. position: absolute;
  1847. bottom: 0;
  1848. left: 50%;
  1849. transform: translateX(-50%);
  1850. }
  1851. @media (max-width: 1199px) {
  1852. .cta-wrapper-2 .cta-image-area .bg-shape {
  1853. display: none;
  1854. }
  1855. }
  1856. @media (max-width: 991px) {
  1857. .cta-wrapper-2 .cta-image-area .bg-shape {
  1858. display: block;
  1859. }
  1860. }
  1861. @media (max-width: 767px) {
  1862. .cta-wrapper-2 .cta-image-area .bg-shape {
  1863. display: none;
  1864. }
  1865. }
  1866. .cta-section-2 {
  1867. position: relative;
  1868. }
  1869. .cta-section-2 .parasuit-shape {
  1870. position: absolute;
  1871. top: 20%;
  1872. left: 5%;
  1873. }
  1874. @media (max-width: 1399px) {
  1875. .cta-section-2 .parasuit-shape {
  1876. display: none;
  1877. }
  1878. }
  1879. .cta-section-2 .parasuit-shape-2 {
  1880. position: absolute;
  1881. top: 20%;
  1882. right: 5%;
  1883. }
  1884. @media (max-width: 1199px) {
  1885. .cta-section-2 .parasuit-shape-2 {
  1886. display: none;
  1887. }
  1888. }
  1889. .cta-section-2 .pencil-shape {
  1890. position: absolute;
  1891. bottom: 15%;
  1892. left: 7%;
  1893. animation: rounded 5s linear infinite;
  1894. }
  1895. @media (max-width: 1399px) {
  1896. .cta-section-2 .pencil-shape {
  1897. display: none;
  1898. }
  1899. }
  1900. .cta-section-2 .hand-shape {
  1901. position: absolute;
  1902. left: 40%;
  1903. bottom: 35%;
  1904. }
  1905. @media (max-width: 1399px) {
  1906. .cta-section-2 .hand-shape {
  1907. display: none;
  1908. }
  1909. }
  1910. .cta-section-2 .line-shape {
  1911. position: absolute;
  1912. right: 5%;
  1913. bottom: 0;
  1914. }
  1915. @media (max-width: 1199px) {
  1916. .cta-section-2 .line-shape {
  1917. display: none;
  1918. }
  1919. }
  1920. .cta-video-section {
  1921. background-position: initial !important;
  1922. position: relative;
  1923. margin-bottom: 30px;
  1924. margin-top: 30px;
  1925. }
  1926. @media (max-width: 991px) {
  1927. .cta-video-section {
  1928. margin-top: -10px;
  1929. }
  1930. }
  1931. .cta-video-section .video-shape {
  1932. height: 120px;
  1933. width: 100%;
  1934. position: absolute;
  1935. top: -35px;
  1936. left: 0;
  1937. right: 0;
  1938. overflow-x: hidden;
  1939. z-index: -1;
  1940. }
  1941. .cta-video-section .wave {
  1942. background: url(../image/video-top-shape.png);
  1943. position: absolute;
  1944. width: 200%;
  1945. height: 100%;
  1946. animation: wave 10s -3s linear infinite;
  1947. transform: translate3d(0, 0, 0);
  1948. background-size: cover;
  1949. }
  1950. .cta-video-section .wave:nth-of-type(2) {
  1951. bottom: 0;
  1952. animation: wave 18s linear reverse infinite;
  1953. opacity: 0.5;
  1954. }
  1955. .cta-video-section .wave:nth-of-type(3) {
  1956. bottom: 0;
  1957. animation: wave 20s -1s linear infinite;
  1958. opacity: 0.5;
  1959. }
  1960. .cta-video-items {
  1961. padding: 350px 0;
  1962. position: relative;
  1963. z-index: 9;
  1964. }
  1965. @media (max-width: 1199px) {
  1966. .cta-video-items {
  1967. padding: 300px 0;
  1968. }
  1969. }
  1970. @media (max-width: 991px) {
  1971. .cta-video-items {
  1972. padding: 250px 0;
  1973. }
  1974. }
  1975. @media (max-width: 767px) {
  1976. .cta-video-items {
  1977. padding: 200px 0;
  1978. }
  1979. }
  1980. @media (max-width: 575px) {
  1981. .cta-video-items {
  1982. padding: 150px 0;
  1983. }
  1984. }
  1985. .cta-video-items .video-box {
  1986. position: absolute;
  1987. top: 50%;
  1988. left: 50%;
  1989. transform: translate(-50%, -50%);
  1990. }
  1991. .cta-video-items .video-box .video-btn {
  1992. width: 100px;
  1993. height: 100px;
  1994. line-height: 100px;
  1995. font-size: 22px;
  1996. background-color: var(--theme);
  1997. color: var(--white);
  1998. display: inline-block;
  1999. text-align: center;
  2000. border-radius: 50%;
  2001. }
  2002. @media (max-width: 767px) {
  2003. .cta-video-items .video-box .video-btn {
  2004. width: 70px;
  2005. height: 70px;
  2006. line-height: 70px;
  2007. }
  2008. }
  2009. @media (max-width: 575px) {
  2010. .cta-video-items .video-box .video-btn {
  2011. width: 60px;
  2012. height: 60px;
  2013. line-height: 60px;
  2014. }
  2015. }
  2016. .cta-video-items .video-box .ripple::before, .cta-video-items .video-box .ripple::after {
  2017. box-shadow: 0 0 0 0 rgba(243, 159, 95, 0.8);
  2018. width: 100px;
  2019. height: 100px;
  2020. }
  2021. @media (max-width: 767px) {
  2022. .cta-video-items .video-box .ripple::before, .cta-video-items .video-box .ripple::after {
  2023. width: 70px;
  2024. height: 70px;
  2025. }
  2026. }
  2027. @media (max-width: 575px) {
  2028. .cta-video-items .video-box .ripple::before, .cta-video-items .video-box .ripple::after {
  2029. width: 60px;
  2030. height: 60px;
  2031. }
  2032. }
  2033. .cta-offer-section {
  2034. margin-top: 110px;
  2035. position: relative;
  2036. z-index: 9;
  2037. }
  2038. .cta-offer-section .cta-shape {
  2039. height: 120px;
  2040. width: 100%;
  2041. position: absolute;
  2042. top: -115px;
  2043. left: 0;
  2044. right: 0;
  2045. overflow-x: hidden;
  2046. z-index: -1;
  2047. }
  2048. .cta-offer-section .wave {
  2049. background: url(../image/cta-offer-shape.png);
  2050. position: absolute;
  2051. width: 200%;
  2052. height: 100%;
  2053. animation: wave 10s -3s linear infinite;
  2054. transform: translate3d(0, 0, 0);
  2055. background-size: cover;
  2056. }
  2057. .cta-offer-section .wave:nth-of-type(2) {
  2058. bottom: 0;
  2059. animation: wave 18s linear reverse infinite;
  2060. }
  2061. .cta-offer-section .wave:nth-of-type(3) {
  2062. bottom: 0;
  2063. animation: wave 20s -1s linear infinite;
  2064. }
  2065. .cta-offer-wrapper {
  2066. text-align: center;
  2067. margin-top: -80px;
  2068. }
  2069. .cta-offer-wrapper .cta-offter-image {
  2070. margin-bottom: -120px;
  2071. }
  2072. @media (max-width: 1399px) {
  2073. .cta-offer-wrapper .cta-offter-image {
  2074. margin-bottom: -145px;
  2075. }
  2076. }
  2077. @media (max-width: 1199px) {
  2078. .cta-offer-wrapper .cta-offter-image {
  2079. display: none;
  2080. }
  2081. }
  2082. .cta-offer-wrapper .cta-offter-image img {
  2083. width: 100%;
  2084. height: 100%;
  2085. }
  2086. .cta-offer-wrapper .cta-offter-image-2 {
  2087. margin-bottom: -170px;
  2088. }
  2089. @media (max-width: 1399px) {
  2090. .cta-offer-wrapper .cta-offter-image-2 {
  2091. margin-bottom: -126px;
  2092. }
  2093. }
  2094. @media (max-width: 1199px) {
  2095. .cta-offer-wrapper .cta-offter-image-2 {
  2096. display: none;
  2097. }
  2098. }
  2099. .event-box-items {
  2100. margin-top: 30px;
  2101. background-color: var(--white);
  2102. border-radius: 16px;
  2103. }
  2104. .event-box-items .event-image {
  2105. padding: 20px 20px 0 20px;
  2106. position: relative;
  2107. }
  2108. .event-box-items .event-image img {
  2109. width: 100%;
  2110. height: 100%;
  2111. }
  2112. .event-box-items .event-image .event-shape {
  2113. position: absolute;
  2114. bottom: 0;
  2115. left: 0;
  2116. right: 0;
  2117. }
  2118. .event-box-items .event-image .event-shape img {
  2119. width: 100%;
  2120. }
  2121. .event-box-items .event-image .post-date {
  2122. position: absolute;
  2123. top: 35px;
  2124. left: 35px;
  2125. border-radius: 6px;
  2126. padding: 8px 14px;
  2127. background-color: var(--theme);
  2128. color: var(--white);
  2129. }
  2130. .event-box-items .event-image .post-date img {
  2131. width: 17px;
  2132. }
  2133. .event-box-items .event-image .post-date li {
  2134. display: flex;
  2135. align-items: center;
  2136. }
  2137. .event-box-items .event-content {
  2138. padding: 30px;
  2139. }
  2140. @media (max-width: 575px) {
  2141. .event-box-items .event-content {
  2142. padding: 20px 25px;
  2143. }
  2144. }
  2145. .event-box-items .event-content ul {
  2146. margin-bottom: 10px;
  2147. }
  2148. .event-box-items .event-content ul li span {
  2149. margin-left: 5px;
  2150. font-size: 16px;
  2151. font-weight: 500;
  2152. }
  2153. .event-box-items .event-content h3 {
  2154. border-bottom: 2px dotted var(--theme);
  2155. padding-bottom: 20px;
  2156. }
  2157. .event-box-items .event-content h3 a:hover {
  2158. color: var(--theme);
  2159. }
  2160. .event-box-items .event-content .event-author {
  2161. margin-top: 30px;
  2162. display: flex;
  2163. align-items: center;
  2164. justify-content: space-between;
  2165. }
  2166. @media (max-width: 575px) {
  2167. .event-box-items .event-content .event-author {
  2168. margin-top: 20px;
  2169. }
  2170. }
  2171. @media (max-width: 1199px) {
  2172. .event-box-items .event-content .event-author .theme-btn {
  2173. padding: 20px 30px;
  2174. }
  2175. }
  2176. @media (max-width: 991px) {
  2177. .event-box-items .event-content .event-author .theme-btn {
  2178. padding: 18px 25px;
  2179. }
  2180. }
  2181. .event-box-items .event-content .event-author .author-ratting span {
  2182. margin-left: 0;
  2183. color: var(--header);
  2184. font-weight: 500;
  2185. }
  2186. .event-box-items .event-content .event-author .author-ratting .star {
  2187. margin-top: 3px;
  2188. }
  2189. .event-box-items .event-content .event-author .author-ratting .star i {
  2190. color: var(--theme);
  2191. }
  2192. .event-box-items .event-content .event-author .author-ratting .star .color-1 {
  2193. color: #808080;
  2194. }
  2195. .event-box-items.style-bottom {
  2196. margin-bottom: 50px;
  2197. }
  2198. .event-details-wrapper .event-details-items .details-image img {
  2199. width: 100%;
  2200. height: 100%;
  2201. }
  2202. .event-details-wrapper .event-details-items .event-details-content {
  2203. margin-top: 30px;
  2204. }
  2205. .event-details-wrapper .event-details-items .event-details-content .post-items {
  2206. display: flex;
  2207. align-items: center;
  2208. gap: 25px;
  2209. margin-bottom: 30px;
  2210. }
  2211. .event-details-wrapper .event-details-items .event-details-content .post-items .post-date {
  2212. display: inline-block;
  2213. padding: 8px 14px;
  2214. font-size: 16px;
  2215. font-weight: 600;
  2216. background-color: var(--theme);
  2217. border-radius: 6px;
  2218. color: var(--white);
  2219. }
  2220. .event-details-wrapper .event-details-items .event-details-content .post-items .post-date i {
  2221. margin-right: 5px;
  2222. }
  2223. .event-details-wrapper .event-details-items .event-details-content .post-items .post-time {
  2224. display: inline-block;
  2225. padding: 7px 14px;
  2226. font-size: 16px;
  2227. font-weight: 600;
  2228. background-color: transparent;
  2229. border-radius: 6px;
  2230. border: 1px solid var(--theme);
  2231. color: var(--theme);
  2232. }
  2233. .event-details-wrapper .event-details-items .event-details-content .post-items .post-time i {
  2234. margin-right: 5px;
  2235. }
  2236. .event-details-wrapper .event-details-items .event-details-content h2 {
  2237. font-size: 30px;
  2238. margin-bottom: 20px;
  2239. line-height: 130%;
  2240. }
  2241. @media (max-width: 575px) {
  2242. .event-details-wrapper .event-details-items .event-details-content h2 {
  2243. font-size: 26px;
  2244. margin-bottom: 10px;
  2245. }
  2246. }
  2247. .event-details-wrapper .event-details-items .event-details-content .list li:not(:last-child) {
  2248. margin-bottom: 10px;
  2249. }
  2250. .event-details-wrapper .event-details-items .event-details-content .list li i {
  2251. margin-right: 5px;
  2252. color: var(--theme);
  2253. }
  2254. .event-details-wrapper .event-details-items .event-details-content .thumb img {
  2255. width: 100%;
  2256. height: 100%;
  2257. border-radius: 8px;
  2258. }
  2259. .event-details-wrapper .event-details-items .about-author {
  2260. display: flex;
  2261. align-items: center;
  2262. gap: 30px;
  2263. margin-top: 50px;
  2264. border-top: 1px solid var(--border);
  2265. border-bottom: 1px solid var(--border);
  2266. padding: 25px 0;
  2267. }
  2268. @media (max-width: 1199px) {
  2269. .event-details-wrapper .event-details-items .about-author {
  2270. flex-wrap: wrap;
  2271. }
  2272. }
  2273. @media (max-width: 767px) {
  2274. .event-details-wrapper .event-details-items .about-author {
  2275. margin-top: 30px;
  2276. }
  2277. }
  2278. @media (max-width: 575px) {
  2279. .event-details-wrapper .event-details-items .about-author {
  2280. margin-top: 20px;
  2281. }
  2282. }
  2283. .event-details-wrapper .event-details-items .about-author .author-icon {
  2284. display: flex;
  2285. align-items: center;
  2286. gap: 20px;
  2287. }
  2288. .event-details-wrapper .event-details-items .about-author .author-icon .icon {
  2289. width: 48px;
  2290. height: 48px;
  2291. line-height: 48px;
  2292. text-align: center;
  2293. background-color: var(--theme);
  2294. text-align: center;
  2295. color: var(--white);
  2296. border-radius: 50%;
  2297. position: relative;
  2298. }
  2299. .event-details-wrapper .event-details-items .about-author .author-icon .icon::before {
  2300. position: absolute;
  2301. top: 50%;
  2302. left: 50%;
  2303. right: 0;
  2304. bottom: 0;
  2305. width: 60px;
  2306. height: 60px;
  2307. border-radius: 50%;
  2308. border: 1px solid var(--theme);
  2309. content: "";
  2310. transform: translate(-50%, -50%);
  2311. }
  2312. .event-details-wrapper .details-list-area {
  2313. padding: 30px 40px;
  2314. border-radius: 10px;
  2315. position: relative;
  2316. z-index: 9;
  2317. border: 1px solid var(--border);
  2318. }
  2319. @media (max-width: 1199px) {
  2320. .event-details-wrapper .details-list-area {
  2321. padding: 30px 20px;
  2322. }
  2323. }
  2324. @media (max-width: 991px) {
  2325. .event-details-wrapper .details-list-area {
  2326. padding: 30px 40px;
  2327. }
  2328. }
  2329. @media (max-width: 575px) {
  2330. .event-details-wrapper .details-list-area {
  2331. padding: 25px 20px;
  2332. }
  2333. }
  2334. .event-details-wrapper .details-list-area h3 {
  2335. font-size: 24px;
  2336. border-bottom: 1px solid var(--border);
  2337. padding-bottom: 20px;
  2338. }
  2339. @media (max-width: 1199px) {
  2340. .event-details-wrapper .details-list-area {
  2341. margin-right: 0;
  2342. }
  2343. }
  2344. @media (max-width: 991px) {
  2345. .event-details-wrapper .details-list-area {
  2346. margin-top: 0;
  2347. }
  2348. }
  2349. .event-details-wrapper .details-list-area .details-list {
  2350. margin-bottom: 30px;
  2351. }
  2352. .event-details-wrapper .details-list-area .details-list li {
  2353. display: flex;
  2354. align-items: center;
  2355. justify-content: space-between;
  2356. padding: 15px 0;
  2357. border-bottom: 1px solid var(--border);
  2358. }
  2359. .event-details-wrapper .details-list-area .details-list li span i {
  2360. color: var(--theme);
  2361. }
  2362. .event-details-wrapper .details-list-area .theme-btn {
  2363. padding: 19px 40px;
  2364. }
  2365. .event-details-wrapper .details-list-area .theme-btn.border-style {
  2366. border: 1px solid var(--theme);
  2367. color: var(--theme);
  2368. background-color: transparent;
  2369. padding: 18px 40px;
  2370. }
  2371. .event-details-wrapper .details-list-area .theme-btn.border-style::after, .event-details-wrapper .details-list-area .theme-btn.border-style::before {
  2372. background-color: var(--theme);
  2373. }
  2374. .event-details-wrapper .details-list-area .theme-btn.border-style:hover {
  2375. color: var(--white);
  2376. }
  2377. .event-details-wrapper .details-list-area .social-icon {
  2378. justify-content: center;
  2379. gap: 15px;
  2380. margin-top: 30px;
  2381. }
  2382. .event-details-wrapper .details-list-area .social-icon a {
  2383. width: 36px;
  2384. height: 36px;
  2385. line-height: 36px;
  2386. text-align: center;
  2387. font-size: 16px;
  2388. display: block;
  2389. color: var(--theme);
  2390. transition: all 0.4s ease-in-out;
  2391. text-align: center;
  2392. background-color: transparent;
  2393. border: 1px solid var(--theme);
  2394. }
  2395. .event-details-wrapper .details-list-area .social-icon a:hover {
  2396. background-color: var(--theme);
  2397. color: var(--white);
  2398. border: 1px solid transparent;
  2399. }
  2400. .event-details-wrapper .map-items {
  2401. margin-top: 30px;
  2402. }
  2403. .event-details-wrapper .map-items iframe {
  2404. width: 100%;
  2405. height: 300px;
  2406. }
  2407. .event-section-2 {
  2408. margin-bottom: -50px;
  2409. }
  2410. .event-section {
  2411. position: relative;
  2412. margin-top: 120px;
  2413. }
  2414. .event-section .event-top-shape {
  2415. height: 160px;
  2416. width: 100%;
  2417. position: absolute;
  2418. top: -120px;
  2419. left: 0;
  2420. right: 0;
  2421. overflow-x: hidden;
  2422. }
  2423. .event-section .wave {
  2424. background: url(../image/cta-offer-shape.png);
  2425. position: absolute;
  2426. width: 200%;
  2427. height: 100%;
  2428. animation: wave 10s -3s linear infinite;
  2429. transform: translate3d(0, 0, 0);
  2430. background-size: cover;
  2431. }
  2432. .event-section .wave:nth-of-type(2) {
  2433. bottom: 0;
  2434. animation: wave 18s linear reverse infinite;
  2435. }
  2436. .event-section .wave:nth-of-type(3) {
  2437. bottom: 0;
  2438. animation: wave 20s -1s linear infinite;
  2439. }
  2440. .faq-left .nav {
  2441. display: grid;
  2442. }
  2443. @media (max-width: 991px) {
  2444. .faq-left .nav {
  2445. display: flex;
  2446. align-items: center;
  2447. gap: 10px;
  2448. justify-content: center;
  2449. }
  2450. }
  2451. .faq-left .nav .nav-link {
  2452. font-weight: 700;
  2453. font-size: 18px;
  2454. text-transform: capitalize;
  2455. color: var(--header);
  2456. }
  2457. .faq-left .nav .nav-link.active {
  2458. color: var(--theme);
  2459. }
  2460. .faq-content .accordion-item {
  2461. border: 0;
  2462. background-color: var(--white);
  2463. box-shadow: var(--box-shadow);
  2464. }
  2465. .faq-content .accordion-item .accordion-header .accordion-button {
  2466. font-weight: 700;
  2467. color: var(--theme);
  2468. letter-spacing: -0.2px;
  2469. border: 0;
  2470. border-radius: 0;
  2471. box-shadow: none;
  2472. background-color: var(--white);
  2473. padding: 25px 30px 0;
  2474. text-transform: capitalize;
  2475. font-size: 20px;
  2476. border: none;
  2477. }
  2478. .faq-content .accordion-item .accordion-header .accordion-button::after {
  2479. font-weight: 500;
  2480. transition: all 0.3s ease-in-out !important;
  2481. background-image: url(../image/chevron-right.svg);
  2482. color: var(--theme2);
  2483. }
  2484. .faq-content .accordion-item .accordion-header .accordion-button:not(.collapsed)::after {
  2485. background-image: url(../image/chevron-down.svg);
  2486. font-weight: 500;
  2487. color: var(--theme);
  2488. transform: rotate(0);
  2489. }
  2490. .faq-content .accordion-item .accordion-header .accordion-button.collapsed {
  2491. background-color: transparent;
  2492. padding: 25px 30px;
  2493. color: var(--header);
  2494. }
  2495. .faq-content .accordion-item .accordion-collapse .accordion-body {
  2496. padding-right: 130px;
  2497. padding-left: 30px;
  2498. padding-top: 15px;
  2499. color: var(--text);
  2500. background-color: var(--white);
  2501. padding-bottom: 25px;
  2502. }
  2503. @media (max-width: 1399px) {
  2504. .faq-content .accordion-item .accordion-collapse .accordion-body {
  2505. padding-right: 50px;
  2506. }
  2507. }
  2508. @media (max-width: 991px) {
  2509. .faq-content .accordion-item .accordion-collapse .accordion-body {
  2510. padding-right: 30px;
  2511. }
  2512. }
  2513. .work-process-section {
  2514. position: relative;
  2515. }
  2516. .work-process-section .top-shape {
  2517. position: absolute;
  2518. top: 0;
  2519. left: 0;
  2520. }
  2521. .work-process-section-2 {
  2522. position: relative;
  2523. }
  2524. .work-process-section-2 .top-shape {
  2525. position: absolute;
  2526. top: 0;
  2527. left: 0;
  2528. }
  2529. .process-work-wrapper {
  2530. position: relative;
  2531. z-index: 9;
  2532. }
  2533. .process-work-wrapper .work-process-items {
  2534. position: relative;
  2535. }
  2536. .process-work-wrapper .work-process-items .line-shape {
  2537. position: absolute;
  2538. top: 12%;
  2539. right: -55%;
  2540. }
  2541. @media (max-width: 1199px) {
  2542. .process-work-wrapper .work-process-items .line-shape {
  2543. display: none;
  2544. }
  2545. }
  2546. .process-work-wrapper .work-process-items .line-shape-2 {
  2547. position: absolute;
  2548. top: -32%;
  2549. right: -55%;
  2550. }
  2551. @media (max-width: 1199px) {
  2552. .process-work-wrapper .work-process-items .line-shape-2 {
  2553. display: none;
  2554. }
  2555. }
  2556. .process-work-wrapper .work-process-items .icon {
  2557. width: 100px;
  2558. height: 100px;
  2559. line-height: 100px;
  2560. text-align: center;
  2561. margin: 0 auto;
  2562. }
  2563. .process-work-wrapper .work-process-items .content {
  2564. margin-top: 30px;
  2565. }
  2566. .process-work-wrapper .work-process-items .content h4 {
  2567. margin-bottom: 5px;
  2568. }
  2569. .process-work-wrapper .work-process-items .content.style-two {
  2570. margin-top: 0;
  2571. margin-bottom: 30px;
  2572. }
  2573. .process-work-wrapper .work-process-items.style-2 {
  2574. margin-top: 100px;
  2575. }
  2576. @media (max-width: 1199px) {
  2577. .process-work-wrapper .work-process-items.style-2 {
  2578. margin-top: 0;
  2579. }
  2580. }
  2581. .process-work-wrapper.style-padding {
  2582. padding-top: 90px;
  2583. }
  2584. .feature-value-section {
  2585. position: relative;
  2586. margin-top: -55px;
  2587. }
  2588. .feature-value-section .shape-1 {
  2589. position: absolute;
  2590. top: 20%;
  2591. left: 0;
  2592. animation: rounded 5s linear infinite;
  2593. }
  2594. @media (max-width: 1399px) {
  2595. .feature-value-section .shape-1 {
  2596. display: none;
  2597. }
  2598. }
  2599. .feature-value-section .shape-2 {
  2600. position: absolute;
  2601. top: 20%;
  2602. right: 10px;
  2603. }
  2604. @media (max-width: 1199px) {
  2605. .feature-value-section .shape-2 {
  2606. display: none;
  2607. }
  2608. }
  2609. .feature-value-items {
  2610. margin-top: 30px;
  2611. position: relative;
  2612. z-index: 9;
  2613. }
  2614. @media (max-width: 1399px) {
  2615. .feature-value-items {
  2616. margin-bottom: -50px;
  2617. }
  2618. }
  2619. @media (max-width: 1199px) {
  2620. .feature-value-items {
  2621. margin-bottom: 0;
  2622. }
  2623. }
  2624. .feature-value-items .value-icon-items {
  2625. display: flex;
  2626. align-items: center;
  2627. gap: 20px;
  2628. }
  2629. @media (max-width: 575px) {
  2630. .feature-value-items .value-icon-items {
  2631. flex-wrap: wrap;
  2632. justify-content: center;
  2633. text-align: center;
  2634. }
  2635. }
  2636. .feature-value-items .value-icon-items:not(:last-child) {
  2637. margin-bottom: 30px;
  2638. }
  2639. .feature-value-items .value-icon-items .icon {
  2640. width: 90px;
  2641. height: 90px;
  2642. line-height: 90px;
  2643. text-align: center;
  2644. border-radius: 8px;
  2645. background: rgba(243, 159, 95, 0.2);
  2646. border-radius: 8px;
  2647. flex-basis: 40%;
  2648. }
  2649. .feature-value-items .value-icon-items .icon.color-2 {
  2650. background: rgba(88, 102, 235, 0.15);
  2651. }
  2652. .feature-value-items .value-icon-items .icon.color-3 {
  2653. background: rgba(57, 192, 250, 0.15);
  2654. }
  2655. .feature-value-items .value-icon-items .icon.color-4 {
  2656. background: rgba(249, 37, 150, 0.15);
  2657. }
  2658. .feature-value-items .value-icon-items .content h5 {
  2659. margin-bottom: 10px;
  2660. }
  2661. .feature-value-items .value-icon-items.style-2 .content {
  2662. text-align: right;
  2663. }
  2664. @media (max-width: 1199px) {
  2665. .feature-value-items .value-icon-items.style-2 .content {
  2666. text-align: left;
  2667. }
  2668. }
  2669. @media (max-width: 575px) {
  2670. .feature-value-items .value-icon-items.style-2 .content {
  2671. text-align: center;
  2672. }
  2673. }
  2674. .feature-value-items .feature-value-image {
  2675. max-width: 290px;
  2676. text-align: center;
  2677. margin: 0 auto -120px;
  2678. position: relative;
  2679. z-index: 9;
  2680. }
  2681. @media (max-width: 1199px) {
  2682. .feature-value-items .feature-value-image {
  2683. margin: 0 auto 0;
  2684. }
  2685. }
  2686. .feature-value-items .feature-value-image img {
  2687. width: 100%;
  2688. height: 100%;
  2689. }
  2690. .feature-value-items .feature-value-image .value-shape {
  2691. position: absolute;
  2692. bottom: 0;
  2693. left: -25px;
  2694. z-index: -1;
  2695. right: -30px;
  2696. max-width: 340px;
  2697. }
  2698. .feature-value-items .feature-value-image .value-shape img {
  2699. width: 100%;
  2700. height: 100%;
  2701. }
  2702. .counter-section {
  2703. position: relative;
  2704. z-index: 9;
  2705. padding: 90px 0 120px;
  2706. margin-bottom: -33px;
  2707. }
  2708. @media (max-width: 1199px) {
  2709. .counter-section {
  2710. margin-bottom: -27px;
  2711. }
  2712. }
  2713. .counter-section .counter-bg {
  2714. position: absolute;
  2715. top: -16px;
  2716. left: 0;
  2717. background-color: var(--theme2);
  2718. transition: all 500ms ease;
  2719. mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1920 325"><path d="M0 325V29.4378V5.47337C38.0396 17.4556 143.614 5.47336 277.289 5.47337C423 5.47339 552.217 -6.50878 664 5.47347C806.815 23.114 1257.86 5.47337 1341 5.47337C1472 5.47337 1746.15 -6.84172 1920 5.47337V322.004C1750 298.138 1254 309.122 1138 309.122C885.21 309.122 608 314.114 396 309.122C69.2597 293.145 130 322.004 0 325Z" /></svg>');
  2720. mask-repeat: no-repeat;
  2721. mask-position: center center;
  2722. mask-size: cover;
  2723. width: 100%;
  2724. height: 100%;
  2725. z-index: -1;
  2726. }
  2727. @media (max-width: 1199px) {
  2728. .counter-section .counter-bg {
  2729. top: 0;
  2730. }
  2731. }
  2732. .counter-section .line-shape {
  2733. position: absolute;
  2734. left: 0;
  2735. bottom: 50px;
  2736. }
  2737. @media (max-width: 1199px) {
  2738. .counter-section .line-shape {
  2739. display: none;
  2740. }
  2741. }
  2742. .counter-section .box-shape {
  2743. position: absolute;
  2744. right: 0;
  2745. bottom: 0;
  2746. }
  2747. @media (max-width: 1199px) {
  2748. .counter-section .box-shape {
  2749. display: none;
  2750. }
  2751. }
  2752. .counter-section-2 {
  2753. background-color: var(--theme2);
  2754. background-position: top !important;
  2755. }
  2756. @media (max-width: 767px) {
  2757. .counter-section-2 {
  2758. background-size: initial !important;
  2759. }
  2760. }
  2761. .counter-wrapper .counter-items {
  2762. text-align: center;
  2763. border-right: 1px dotted var(--white);
  2764. }
  2765. @media (max-width: 1199px) {
  2766. .counter-wrapper .counter-items {
  2767. border: none;
  2768. }
  2769. }
  2770. .counter-wrapper .counter-items .content {
  2771. margin-top: 15px;
  2772. }
  2773. .counter-wrapper .counter-items .content h2 {
  2774. color: var(--white);
  2775. margin-bottom: 5px;
  2776. }
  2777. .counter-wrapper .counter-items .content p {
  2778. color: var(--white);
  2779. font-weight: 600;
  2780. font-size: 18px;
  2781. }
  2782. .counter-wrapper.style-2 {
  2783. padding: 120px 0 80px;
  2784. }
  2785. .certificate-image img {
  2786. width: 100%;
  2787. height: 100%;
  2788. border: 1px solid var(--border);
  2789. border-radius: 20px;
  2790. }
  2791. .feature-items {
  2792. position: relative;
  2793. z-index: 9;
  2794. }
  2795. .feature-items .feature-image {
  2796. margin: 0 auto 20px;
  2797. text-align: center;
  2798. max-width: 290px;
  2799. }
  2800. .feature-items .feature-image img {
  2801. width: 100%;
  2802. height: 100%;
  2803. }
  2804. .footer-widgets-wrapper {
  2805. padding: 90px 0 120px;
  2806. position: relative;
  2807. z-index: 9;
  2808. }
  2809. @media (max-width: 1199px) {
  2810. .footer-widgets-wrapper {
  2811. padding: 60px 0 90px;
  2812. }
  2813. }
  2814. @media (max-width: 991px) {
  2815. .footer-widgets-wrapper {
  2816. padding: 50px 0 70px;
  2817. }
  2818. }
  2819. .footer-widgets-wrapper .single-footer-widget {
  2820. margin-top: 30px;
  2821. }
  2822. .footer-widgets-wrapper .single-footer-widget .widget-head {
  2823. margin-bottom: 30px;
  2824. padding-bottom: 20px;
  2825. border-bottom: 2px solid transparent;
  2826. border-image: linear-gradient(90deg, #F39F5F 4.85%, rgba(201, 203, 223, 0) 96.39%);
  2827. border-bottom: 2px solid transparent;
  2828. border-image-slice: 2;
  2829. display: inline-block;
  2830. }
  2831. @media (max-width: 575px) {
  2832. .footer-widgets-wrapper .single-footer-widget .widget-head {
  2833. margin-bottom: 20px;
  2834. }
  2835. }
  2836. .footer-widgets-wrapper .single-footer-widget .widget-head h3 {
  2837. font-weight: bold;
  2838. color: var(--header);
  2839. font-size: 24px;
  2840. display: inline-block;
  2841. }
  2842. .footer-widgets-wrapper .single-footer-widget .footer-content p {
  2843. color: var(--header);
  2844. }
  2845. .footer-widgets-wrapper .single-footer-widget .footer-content .social-icon {
  2846. margin-top: 40px;
  2847. gap: 15px;
  2848. position: relative;
  2849. z-index: 9;
  2850. }
  2851. @media (max-width: 575px) {
  2852. .footer-widgets-wrapper .single-footer-widget .footer-content .social-icon {
  2853. margin-top: 20px;
  2854. }
  2855. }
  2856. .footer-widgets-wrapper .single-footer-widget .footer-content .social-icon a {
  2857. width: 36px;
  2858. height: 36px;
  2859. line-height: 36px;
  2860. text-align: center;
  2861. font-size: 16px;
  2862. display: block;
  2863. color: var(--header);
  2864. transition: all 0.4s ease-in-out;
  2865. text-align: center;
  2866. background-color: transparent;
  2867. border: 1px solid rgba(56, 84, 105, 0.2);
  2868. }
  2869. .footer-widgets-wrapper .single-footer-widget .footer-content .social-icon a:hover {
  2870. background-color: var(--theme);
  2871. color: var(--white);
  2872. border: 1px solid transparent;
  2873. }
  2874. .footer-widgets-wrapper .single-footer-widget .footer-content.style-two .social-icon {
  2875. margin-top: 20px;
  2876. margin-bottom: 35px;
  2877. }
  2878. .footer-widgets-wrapper .single-footer-widget .footer-content .footer-input {
  2879. position: relative;
  2880. margin-top: 40px;
  2881. }
  2882. .footer-widgets-wrapper .single-footer-widget .footer-content .footer-input input {
  2883. background: transparent;
  2884. border: none;
  2885. outline: none;
  2886. padding: 18px 20px;
  2887. width: 100%;
  2888. border-radius: 8px;
  2889. border: 1px solid rgba(92, 112, 126, 0.3);
  2890. color: var(--text);
  2891. }
  2892. .footer-widgets-wrapper .single-footer-widget .footer-content .footer-input input::placeholder {
  2893. color: var(--text);
  2894. }
  2895. .footer-widgets-wrapper .single-footer-widget .footer-content .footer-input .newsletter-btn {
  2896. position: absolute;
  2897. top: 5px;
  2898. right: 5px;
  2899. width: 60px;
  2900. height: 55px;
  2901. line-height: 60px;
  2902. border-radius: 4px;
  2903. text-align: center;
  2904. background-color: var(--theme);
  2905. color: var(--white);
  2906. bottom: 5px;
  2907. }
  2908. .footer-widgets-wrapper .single-footer-widget .footer-content .footer-input .newsletter-btn i {
  2909. font-size: 24px;
  2910. }
  2911. .footer-widgets-wrapper .single-footer-widget .footer-content .contact-info {
  2912. margin-top: 20px;
  2913. }
  2914. .footer-widgets-wrapper .single-footer-widget .footer-content .contact-info li {
  2915. color: var(--text);
  2916. font-weight: 500;
  2917. }
  2918. .footer-widgets-wrapper .single-footer-widget .footer-content .contact-info li:not(:last-child) {
  2919. margin-bottom: 20px;
  2920. }
  2921. .footer-widgets-wrapper .single-footer-widget .footer-content .contact-info li i {
  2922. font-size: 16px;
  2923. color: var(--theme);
  2924. margin-right: 10px;
  2925. font-size: 20px;
  2926. }
  2927. .footer-widgets-wrapper .single-footer-widget .footer-content .contact-info li a {
  2928. color: var(--text);
  2929. }
  2930. .footer-widgets-wrapper .single-footer-widget .list-area li {
  2931. transition: all 0.4s ease-in-out;
  2932. font-weight: 500;
  2933. }
  2934. .footer-widgets-wrapper .single-footer-widget .list-area li:not(:last-child) {
  2935. margin-bottom: 15px;
  2936. }
  2937. .footer-widgets-wrapper .single-footer-widget .list-area li a {
  2938. color: var(--header);
  2939. }
  2940. .footer-widgets-wrapper .single-footer-widget .list-area li a i {
  2941. margin-right: 5px;
  2942. }
  2943. .footer-widgets-wrapper .single-footer-widget .list-area li:hover {
  2944. margin-left: 5px;
  2945. }
  2946. .footer-widgets-wrapper .single-footer-widget .list-area li:hover a {
  2947. color: var(--theme);
  2948. }
  2949. .footer-widgets-wrapper .single-footer-widget .recent-post-area .recent-post-items {
  2950. display: flex;
  2951. align-items: center;
  2952. gap: 20px;
  2953. margin-bottom: 25px;
  2954. }
  2955. .footer-widgets-wrapper .single-footer-widget .recent-post-area .recent-post-items .thumb {
  2956. width: 80px;
  2957. height: 80px;
  2958. }
  2959. .footer-widgets-wrapper .single-footer-widget .recent-post-area .recent-post-items .thumb img {
  2960. width: 100%;
  2961. height: 100%;
  2962. }
  2963. .footer-widgets-wrapper .single-footer-widget .recent-post-area .recent-post-items .content .post-date {
  2964. margin-bottom: 10px;
  2965. }
  2966. .footer-widgets-wrapper .single-footer-widget .recent-post-area .recent-post-items .content .post-date li {
  2967. color: var(--theme);
  2968. }
  2969. .footer-widgets-wrapper .single-footer-widget .recent-post-area .recent-post-items .content h6 {
  2970. font-size: 16px;
  2971. font-weight: 700;
  2972. }
  2973. .footer-widgets-wrapper .single-footer-widget .recent-post-area .recent-post-items .content h6 a {
  2974. color: var(--header);
  2975. }
  2976. .footer-widgets-wrapper .single-footer-widget .recent-post-area .recent-post-items .content h6 a:hover {
  2977. color: var(--theme);
  2978. }
  2979. .footer-widgets-wrapper .single-footer-widget .footer-post .single-post-item {
  2980. overflow: hidden;
  2981. }
  2982. .footer-widgets-wrapper .single-footer-widget .footer-post .single-post-item .thumb {
  2983. width: 80px;
  2984. height: 80px;
  2985. float: left;
  2986. margin-right: 20px;
  2987. }
  2988. .footer-widgets-wrapper .single-footer-widget .footer-post .single-post-item .post-content .post-date {
  2989. color: var(--theme);
  2990. margin-bottom: 10px;
  2991. }
  2992. .footer-widgets-wrapper .single-footer-widget .footer-post .single-post-item .post-content .post-date i {
  2993. margin-right: 10px;
  2994. }
  2995. .footer-widgets-wrapper .single-footer-widget .footer-post .single-post-item .post-content h6 {
  2996. font-size: 16px;
  2997. }
  2998. .footer-widgets-wrapper .single-footer-widget .footer-post .single-post-item .post-content h6 a {
  2999. color: var(--text);
  3000. }
  3001. .footer-widgets-wrapper .single-footer-widget .footer-post .single-post-item .post-content h6 a:hover {
  3002. color: var(--theme);
  3003. }
  3004. @media (min-width: 1200px) {
  3005. .footer-widgets-wrapper .single-footer-widget.style-margin {
  3006. margin-left: 70px;
  3007. }
  3008. }
  3009. @media (min-width: 1200px) {
  3010. .footer-widgets-wrapper .single-footer-widget.style-margin-2 {
  3011. margin-left: 50px;
  3012. }
  3013. }
  3014. .footer-widgets-wrapper .single-footer-widget .footer-gallery .gallery-wrap .gallery-item {
  3015. display: flex;
  3016. align-items: center;
  3017. gap: 10px;
  3018. }
  3019. .footer-widgets-wrapper .single-footer-widget .footer-gallery .gallery-wrap .gallery-item:not(:last-child) {
  3020. margin-bottom: 10px;
  3021. }
  3022. .footer-widgets-wrapper .single-footer-widget .footer-gallery .gallery-wrap .gallery-item .thumb {
  3023. position: relative;
  3024. }
  3025. @media (max-width: 575px) {
  3026. .footer-widgets-wrapper .single-footer-widget .footer-gallery .gallery-wrap .gallery-item .thumb {
  3027. width: 100px;
  3028. }
  3029. }
  3030. .footer-widgets-wrapper .single-footer-widget .footer-gallery .gallery-wrap .gallery-item .thumb img {
  3031. width: 100%;
  3032. height: 100%;
  3033. border-radius: 8px;
  3034. }
  3035. .footer-widgets-wrapper .single-footer-widget .footer-gallery .gallery-wrap .gallery-item .thumb .icon {
  3036. position: absolute;
  3037. top: 50%;
  3038. left: 50%;
  3039. transform: translate(-50%, -50%);
  3040. z-index: 1;
  3041. text-align: center;
  3042. transition: 0.3s;
  3043. opacity: 0;
  3044. width: 100%;
  3045. height: 100%;
  3046. }
  3047. .footer-widgets-wrapper .single-footer-widget .footer-gallery .gallery-wrap .gallery-item .thumb .icon::after {
  3048. position: absolute;
  3049. content: "";
  3050. top: 0;
  3051. left: 0;
  3052. right: 0;
  3053. bottom: 0;
  3054. background-color: rgba(243, 159, 95, 0.85);
  3055. transition: 0.4s;
  3056. opacity: 0;
  3057. width: 100%;
  3058. height: 100%;
  3059. border-radius: 8px;
  3060. }
  3061. .footer-widgets-wrapper .single-footer-widget .footer-gallery .gallery-wrap .gallery-item .thumb .icon i {
  3062. color: var(--white);
  3063. font-size: 22px;
  3064. z-index: 99;
  3065. position: relative;
  3066. margin-top: 25px;
  3067. }
  3068. .footer-widgets-wrapper .single-footer-widget .footer-gallery .gallery-wrap .gallery-item .thumb:hover .icon {
  3069. opacity: 1;
  3070. }
  3071. .footer-widgets-wrapper .single-footer-widget .footer-gallery .gallery-wrap .gallery-item .thumb:hover .icon::after {
  3072. opacity: 1;
  3073. }
  3074. .footer-widgets-wrapper .footer-style-2 {
  3075. background-color: rgba(122, 135, 255, 0.15);
  3076. margin-top: 30px;
  3077. padding: 20px 50px 50px 50px;
  3078. position: relative;
  3079. z-index: 9;
  3080. }
  3081. .footer-widgets-wrapper .footer-style-2 .single-footer-widget .footer-content .contact-info-area-2 {
  3082. margin-top: 20px;
  3083. }
  3084. .footer-widgets-wrapper .footer-style-2 .single-footer-widget .footer-content .contact-info-area-2 .contact-info-item-2 {
  3085. display: flex;
  3086. gap: 16px;
  3087. }
  3088. .footer-widgets-wrapper .footer-style-2 .single-footer-widget .footer-content .contact-info-area-2 .contact-info-item-2 .icon {
  3089. font-size: 24px;
  3090. color: var(--white);
  3091. }
  3092. .footer-widgets-wrapper .footer-style-2 .single-footer-widget .footer-content .contact-info-area-2 .contact-info-item-2 .content h6 {
  3093. font-weight: 700;
  3094. color: var(--white);
  3095. margin-bottom: 5px;
  3096. }
  3097. .footer-widgets-wrapper .footer-style-2 .single-footer-widget .footer-content .contact-info-area-2 .contact-info-item-2 .content a {
  3098. color: var(--text-2);
  3099. }
  3100. .footer-widgets-wrapper .footer-style-2 .single-footer-widget .footer-content .apps-image {
  3101. gap: 16px;
  3102. margin-top: 30px;
  3103. }
  3104. .footer-bottom {
  3105. position: relative;
  3106. z-index: 9;
  3107. z-index: 9;
  3108. }
  3109. .footer-bottom .f-bottom-shape {
  3110. position: absolute;
  3111. top: 0;
  3112. left: 0;
  3113. background-color: #C9DDE2;
  3114. transition: all 500ms ease;
  3115. mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1920 92"><path d="M84.7504 27.2721C51.6574 -20.7819 14.4614 12.773 0 35.5572V92H1920V18.9869C1896.59 -9.59695 1871.91 7.07696 1862.49 18.9869C1844.33 45.0852 1828.02 37.4559 1822.13 30.379C1792.67 -11.4611 1766.47 2.24395 1757.06 14.3265C1734.46 44.1531 1718.38 37.4559 1713.17 30.379C1681.69 -9.38979 1655.66 3.10699 1646.58 14.3265C1626.8 44.1531 1612.11 37.4559 1607.23 30.379C1575.75 -11.0468 1551.07 2.41656 1542.66 14.3265C1523.69 43.7389 1504.49 37.2833 1497.26 30.379C1467.8 -9.38979 1440.59 3.10699 1430.67 14.3265C1410.89 48.71 1392.16 39.3546 1385.27 30.379C1357.42 -13.1181 1327.92 5.00568 1316.66 19.5047C1300.92 43.5317 1287.9 36.7655 1283.36 30.379C1252.29 -12.2896 1227.37 -0.862982 1218.79 10.1839C1198.61 47.4672 1178.43 39.182 1170.87 30.379C1140.2 -12.7039 1114.03 4.83308 1104.78 18.9869C1082.99 46.7422 1064.76 35.0395 1058.37 25.7187C1028.1 -14.0502 1001.03 4.66049 991.277 18.9869C976.748 46.7422 960.336 35.0395 953.946 25.7187C924.082 -13.2216 896.774 5.0057 886.852 18.9869C866.27 47.5708 849.017 35.3847 842.964 25.7187C816.732 -13.2216 786.295 5.0057 774.356 18.9869C757.003 50.4706 737.53 34.8668 729.963 23.1295C704.538 -11.6682 677.667 5.86872 667.409 18.9869C652.074 45.4995 635.124 34.5216 628.565 25.7187C606.369 -9.9076 580.305 1.20835 570.047 11.2196C548.658 46.4316 527.504 35.5573 519.601 25.7187C495.386 -10.7361 467.809 3.27964 457.047 14.8444C433.64 50.0564 415.681 36.7656 409.627 25.7187C387.834 -8.25056 361.534 1.89878 351.109 11.2196C334.562 49.3314 309.238 34.0038 298.644 21.576C271.605 -14.4645 245.003 6.55916 235.081 21.576C215.71 46.8458 199.096 32.1051 193.211 21.576C179.086 6.04134 151.34 -8.45772 127.126 21.576C107.754 45.603 90.804 35.3846 84.7504 27.2721Z" /></svg>');
  3116. mask-repeat: no-repeat;
  3117. mask-position: center center;
  3118. mask-size: cover;
  3119. width: 100%;
  3120. height: 100%;
  3121. z-index: -1;
  3122. }
  3123. .footer-bottom .footer-wrapper {
  3124. position: relative;
  3125. z-index: 9;
  3126. padding-top: 50px;
  3127. padding-bottom: 20px;
  3128. }
  3129. @media (max-width: 991px) {
  3130. .footer-bottom .footer-wrapper {
  3131. flex-wrap: wrap;
  3132. gap: 10px;
  3133. justify-content: center !important;
  3134. margin-top: 30px;
  3135. }
  3136. }
  3137. .footer-bottom .footer-wrapper p {
  3138. color: var(--header);
  3139. }
  3140. .footer-bottom .footer-wrapper p a {
  3141. color: var(--theme);
  3142. }
  3143. .footer-bottom .footer-wrapper .footer-menu {
  3144. display: flex;
  3145. align-items: center;
  3146. gap: 20px;
  3147. }
  3148. .footer-bottom .footer-wrapper .footer-menu li a {
  3149. color: var(--header);
  3150. background-image: linear-gradient(var(--theme), var(--theme));
  3151. background-position: 0 95%;
  3152. background-repeat: no-repeat;
  3153. background-size: 0% 2px;
  3154. display: inline-block;
  3155. transition: all 0.4s ease-in-out;
  3156. }
  3157. .footer-bottom .footer-wrapper .footer-menu li a:hover {
  3158. background-size: 100% 1px;
  3159. color: var(--theme);
  3160. }
  3161. .footer-bottom .scroll-icon {
  3162. position: absolute;
  3163. left: 90.2%;
  3164. top: -40px;
  3165. transform: translateX(-50%);
  3166. width: 70px;
  3167. height: 70px;
  3168. line-height: 60px;
  3169. background-color: var(--theme);
  3170. border-radius: 50%;
  3171. text-align: center;
  3172. color: var(--white);
  3173. border: 5px solid var(--white);
  3174. display: inline-block;
  3175. z-index: 99;
  3176. }
  3177. @media (max-width: 1399px) {
  3178. .footer-bottom .scroll-icon {
  3179. left: 50%;
  3180. }
  3181. }
  3182. .footer-section {
  3183. position: relative;
  3184. }
  3185. .footer-section .footer-top-shape {
  3186. position: absolute;
  3187. top: 0;
  3188. left: 0;
  3189. }
  3190. .footer-section .f-bottom-shape {
  3191. position: absolute;
  3192. bottom: 0;
  3193. left: 0;
  3194. }
  3195. .footer-section .frame-shape {
  3196. position: absolute;
  3197. top: 40%;
  3198. left: 0;
  3199. animation: rounded 5s linear infinite;
  3200. }
  3201. .footer-section .frame-shape.style-2 {
  3202. top: 35%;
  3203. }
  3204. @media (max-width: 1199px) {
  3205. .footer-section .frame-shape {
  3206. display: none;
  3207. }
  3208. }
  3209. .footer-section .zebra-shape {
  3210. position: absolute;
  3211. top: 50%;
  3212. right: 0;
  3213. transform: translateY(-50%);
  3214. }
  3215. .footer-section .zebra-shape-2 {
  3216. position: absolute;
  3217. right: 0;
  3218. bottom: 30%;
  3219. }
  3220. @media (max-width: 1399px) {
  3221. .footer-section .zebra-shape-2 {
  3222. display: none;
  3223. }
  3224. }
  3225. .footer-section .tree-shape {
  3226. position: absolute;
  3227. left: 0;
  3228. bottom: 30%;
  3229. }
  3230. @media (max-width: 1399px) {
  3231. .footer-section .tree-shape {
  3232. display: none;
  3233. }
  3234. }
  3235. .footer-section .frame-shape-3 {
  3236. position: absolute;
  3237. top: 40%;
  3238. right: 0;
  3239. transform: translateY(-50%);
  3240. }
  3241. @media (max-width: 1199px) {
  3242. .footer-section .frame-shape-3 {
  3243. display: none;
  3244. }
  3245. }
  3246. .header-top-section {
  3247. position: relative;
  3248. z-index: 9;
  3249. background-color: var(--bg);
  3250. }
  3251. @media (max-width: 991px) {
  3252. .header-top-section {
  3253. display: none;
  3254. }
  3255. }
  3256. .header-top-section .header-top-shape {
  3257. position: absolute;
  3258. top: 0;
  3259. left: 0;
  3260. width: 100%;
  3261. height: 92px;
  3262. z-index: -1;
  3263. }
  3264. .header-top-section .header-top-shape img {
  3265. width: 100%;
  3266. /* height: 100%; */
  3267. /* object-fit: cover; */
  3268. height: auto; /* 设置高度自适应,保持图片的纵横比 */
  3269. object-fit: contain; /* 保持图片完整显示,并让图片适应容器 */
  3270. z-index: -2;
  3271. }
  3272. .header-top-section-4 {
  3273. position: relative;
  3274. z-index: 9;
  3275. margin-bottom: 20px;
  3276. }
  3277. @media (max-width: 991px) {
  3278. .header-top-section-4 {
  3279. display: none;
  3280. }
  3281. }
  3282. .header-top-section-4 .header-top-shape {
  3283. position: absolute;
  3284. top: 0;
  3285. left: 0;
  3286. height: 92px;
  3287. z-index: -1;
  3288. }
  3289. .header-top-section-4 .header-top-shape img {
  3290. width: 100%;
  3291. height: 100%;
  3292. object-fit: cover;
  3293. }
  3294. .header-top-wrapper {
  3295. display: flex;
  3296. align-items: center;
  3297. justify-content: space-between;
  3298. padding: 20px 0;
  3299. }
  3300. .header-top-wrapper .contact-list {
  3301. display: flex;
  3302. align-items: center;
  3303. gap: 40px;
  3304. }
  3305. .header-top-wrapper .contact-list li {
  3306. color: var(--header);
  3307. font-weight: 500;
  3308. }
  3309. .header-top-wrapper .contact-list li i {
  3310. margin-right: 5px;
  3311. }
  3312. .header-top-wrapper .contact-list li a {
  3313. color: var(--header);
  3314. font-weight: 500;
  3315. }
  3316. .header-top-wrapper .social-icon {
  3317. gap: 20px;
  3318. }
  3319. .header-top-wrapper .social-icon span {
  3320. color: var(--header);
  3321. font-weight: 500;
  3322. }
  3323. .header-top-wrapper .social-icon a {
  3324. color: var(--header);
  3325. }
  3326. .header-top-wrapper .social-icon a:hover {
  3327. color: var(--theme);
  3328. }
  3329. .header-top-wrapper.style-2 {
  3330. padding: 15px 0;
  3331. }
  3332. .header-top-wrapper.style-2 .contact-list li {
  3333. color: var(--white);
  3334. }
  3335. .header-top-wrapper.style-2 .contact-list li a {
  3336. color: var(--white);
  3337. }
  3338. .header-top-wrapper.style-2 .social-icon span {
  3339. color: var(--white);
  3340. }
  3341. .header-top-wrapper.style-2 .social-icon a {
  3342. color: var(--white);
  3343. }
  3344. .header-top-wrapper.style-2 .social-icon a:hover {
  3345. color: var(--theme);
  3346. }
  3347. .header-top-section-3 {
  3348. background-color: var(--theme2);
  3349. }
  3350. @media (max-width: 767px) {
  3351. .header-top-section-3 {
  3352. display: none;
  3353. }
  3354. }
  3355. .header-section {
  3356. position: absolute;
  3357. top: 0;
  3358. left: 0;
  3359. width: 100%;
  3360. z-index: 999;
  3361. background-color: transparent;
  3362. }
  3363. .header-main {
  3364. display: flex;
  3365. align-items: center;
  3366. justify-content: space-between;
  3367. padding: 10px 0;
  3368. }
  3369. .header-main .main-menu ul {
  3370. margin-bottom: 0;
  3371. }
  3372. .header-main .main-menu ul li {
  3373. position: relative;
  3374. list-style: none;
  3375. display: inline-block;
  3376. margin-inline-end: 40px;
  3377. }
  3378. .header-main .main-menu ul li:last-child {
  3379. margin-inline-end: 0;
  3380. }
  3381. .header-main .main-menu ul li a {
  3382. display: inline-block;
  3383. font-size: 16px;
  3384. font-weight: 600;
  3385. color: var(--header);
  3386. padding: 20px 0;
  3387. text-align: left;
  3388. position: relative;
  3389. text-transform: capitalize;
  3390. transition: all 0.4s ease-in-out;
  3391. }
  3392. .header-main .main-menu ul li a i {
  3393. margin-left: 4px;
  3394. }
  3395. .header-main .main-menu ul li a:hover {
  3396. color: var(--theme) !important;
  3397. }
  3398. .header-main .main-menu ul li .submenu {
  3399. position: absolute;
  3400. top: 100%;
  3401. inset-inline-start: 0;
  3402. min-width: 240px;
  3403. background: var(--white);
  3404. z-index: 99999;
  3405. visibility: hidden;
  3406. opacity: 0;
  3407. transform-origin: top center;
  3408. color: var(--header);
  3409. box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
  3410. -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
  3411. -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
  3412. transform: translateY(10px);
  3413. transition: all 0.4s ease-in-out;
  3414. }
  3415. .header-main .main-menu ul li .submenu li {
  3416. display: block;
  3417. width: 100%;
  3418. margin: 0;
  3419. padding: 0;
  3420. }
  3421. .header-main .main-menu ul li .submenu li a {
  3422. position: relative;
  3423. z-index: 11;
  3424. font-size: 16px;
  3425. font-weight: 600;
  3426. color: var(--header);
  3427. padding: 0 25px;
  3428. padding-bottom: 11px;
  3429. padding-top: 11px;
  3430. width: 100%;
  3431. border-bottom: 1px solid #eeeeee;
  3432. }
  3433. .header-main .main-menu ul li .submenu li:last-child a {
  3434. border: none;
  3435. }
  3436. .header-main .main-menu ul li .submenu li .submenu {
  3437. inset-inline-start: 100%;
  3438. top: 0;
  3439. visibility: hidden;
  3440. opacity: 0;
  3441. }
  3442. .header-main .main-menu ul li .submenu li:hover > a {
  3443. background: var(--theme);
  3444. color: var(--white) !important;
  3445. }
  3446. .header-main .main-menu ul li .submenu li:hover > a::after {
  3447. color: var(--theme);
  3448. }
  3449. .header-main .main-menu ul li .submenu li:hover > .submenu {
  3450. -webkit-transform: translateY(1);
  3451. -moz-transform: translateY(1);
  3452. -ms-transform: translateY(1);
  3453. -o-transform: translateY(1);
  3454. transform: translateY(1);
  3455. visibility: visible;
  3456. opacity: 1;
  3457. }
  3458. .header-main .main-menu ul li .submenu li.has-dropdown > a::after {
  3459. position: absolute;
  3460. top: 50%;
  3461. inset-inline-end: 25px;
  3462. -webkit-transform: translateY(-50%);
  3463. -moz-transform: translateY(-50%);
  3464. -ms-transform: translateY(-50%);
  3465. -o-transform: translateY(-50%);
  3466. transform: translateY(-50%);
  3467. color: var(--theme);
  3468. }
  3469. .header-main .main-menu ul li .has-homemenu {
  3470. width: 1000px;
  3471. padding: 30px 30px 10px 30px;
  3472. opacity: 0;
  3473. left: -250px;
  3474. visibility: hidden;
  3475. padding: 30px 30px 10px 30px;
  3476. }
  3477. .header-main .main-menu ul li .has-homemenu .homemenu-items {
  3478. display: flex;
  3479. align-items: center;
  3480. gap: 30px;
  3481. justify-content: space-between;
  3482. }
  3483. @media (max-width: 991px) {
  3484. .header-main .main-menu ul li .has-homemenu .homemenu-items {
  3485. flex-wrap: wrap;
  3486. }
  3487. }
  3488. .header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu {
  3489. position: relative;
  3490. }
  3491. .header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-thumb {
  3492. position: relative;
  3493. }
  3494. .header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-thumb .demo-button {
  3495. position: absolute;
  3496. top: 50%;
  3497. left: 50%;
  3498. transform: translate(-50%, -50%);
  3499. width: 60%;
  3500. gap: 10px;
  3501. display: flex;
  3502. justify-content: center;
  3503. flex-direction: column;
  3504. opacity: 0;
  3505. visibility: hidden;
  3506. transition: all 0.4s ease-in-out;
  3507. margin-top: 20px;
  3508. }
  3509. .header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-thumb .demo-button .theme-btn {
  3510. padding: 14px 20px;
  3511. color: var(--white) !important;
  3512. width: initial;
  3513. font-size: 14px;
  3514. text-align: center;
  3515. border-radius: 0;
  3516. }
  3517. .header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-thumb .demo-button .theme-btn:hover {
  3518. color: var(--white) !important;
  3519. }
  3520. .header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-thumb::before {
  3521. background: -webkit-gradient(linear, left top, left bottom, from(rgba(20, 19, 19, 0)), to(#5e5ef6));
  3522. background: linear-gradient(to bottom, rgba(99, 92, 92, 0) 0%, #252527 100%);
  3523. background-repeat: no-repeat;
  3524. background-size: cover;
  3525. background-position: center;
  3526. width: 100%;
  3527. height: 100%;
  3528. position: absolute;
  3529. left: 0;
  3530. top: 0;
  3531. overflow: hidden;
  3532. opacity: 0;
  3533. -webkit-transition: all 0.3s ease-in-out;
  3534. transition: all 0.3s ease-in-out;
  3535. content: "";
  3536. }
  3537. .header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-thumb:hover::before {
  3538. visibility: visible;
  3539. opacity: 1;
  3540. }
  3541. .header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-thumb:hover .demo-button {
  3542. opacity: 1;
  3543. visibility: visible;
  3544. margin-top: 0;
  3545. }
  3546. .header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-thumb:hover .homemenu-btn {
  3547. opacity: 1;
  3548. visibility: visible;
  3549. bottom: 50%;
  3550. transform: translateY(50%);
  3551. }
  3552. .header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-thumb img {
  3553. width: 100%;
  3554. }
  3555. .header-main .main-menu ul li .has-homemenu .homemenu-items .homemenu .homemenu-title {
  3556. text-align: center;
  3557. margin: 15px auto;
  3558. display: inline-block;
  3559. font-size: 16px;
  3560. }
  3561. .header-main .main-menu ul li:hover > a {
  3562. color: var(--theme);
  3563. }
  3564. .header-main .main-menu ul li:hover > a::after {
  3565. color: var(--theme);
  3566. }
  3567. .header-main .main-menu ul li:hover > .submenu {
  3568. visibility: visible;
  3569. opacity: 1;
  3570. transform: translateY(0px);
  3571. }
  3572. .header-main .sidebar__toggle {
  3573. cursor: pointer;
  3574. font-size: 20px;
  3575. }
  3576. .container-fluid {
  3577. padding: 20px 150px;
  3578. }
  3579. @media (min-width: 1800px) {
  3580. .container-xxxl {
  3581. max-width: 1800px;
  3582. margin: 0 auto;
  3583. /* 居中 */
  3584. }
  3585. }
  3586. @media (max-width: 1600px) {
  3587. .container-fluid {
  3588. padding: 0 40px;
  3589. }
  3590. }
  3591. @media (max-width: 1199px) {
  3592. .container-fluid {
  3593. padding: 0 30px;
  3594. }
  3595. }
  3596. @media (max-width: 767px) {
  3597. .container-fluid {
  3598. padding: 0 20px;
  3599. }
  3600. }
  3601. .header-1 {
  3602. background-color: var(--bg);
  3603. padding-top: 25px;
  3604. }
  3605. @media (max-width: 991px) {
  3606. .header-1 {
  3607. padding-top: 0;
  3608. }
  3609. }
  3610. .header-1 .header-main .header-left {
  3611. display: flex;
  3612. align-items: center;
  3613. gap: 60px;
  3614. }
  3615. @media (max-width: 1899px) {
  3616. .header-1 .header-main .header-left {
  3617. gap: 40px;
  3618. }
  3619. }
  3620. @media (max-width: 1399px) {
  3621. .header-1 .header-main .header-left {
  3622. gap: 25px;
  3623. }
  3624. }
  3625. @media (max-width: 1199px) {
  3626. .header-1 .header-main .header-left {
  3627. gap: 20px;
  3628. }
  3629. }
  3630. .header-1 .header-main .header-left .category-oneadjust {
  3631. width: 160px;
  3632. border-radius: 8px;
  3633. border: 1px solid rgba(92, 112, 126, 0.3);
  3634. padding: 10px 16px;
  3635. position: relative;
  3636. z-index: 99;
  3637. }
  3638. @media (max-width: 767px) {
  3639. .header-1 .header-main .header-left .category-oneadjust {
  3640. display: none;
  3641. }
  3642. }
  3643. .header-1 .header-main .header-left .category-oneadjust .nice-select {
  3644. width: unset !important;
  3645. gap: 20px;
  3646. font-size: 16px;
  3647. }
  3648. .header-1 .header-main .header-left .category-oneadjust .nice-select .list {
  3649. max-height: 15vh;
  3650. background: var(--white);
  3651. width: 160px;
  3652. padding: 5px 8px;
  3653. overflow-y: scroll;
  3654. }
  3655. @media (max-width: 1199px) {
  3656. .header-1 .header-main .header-left .category-oneadjust .nice-select .list {
  3657. right: -60px;
  3658. }
  3659. }
  3660. .header-1 .header-main .header-left .category-oneadjust .nice-select .list li {
  3661. color: var(--header);
  3662. font-size: 14px;
  3663. border: none;
  3664. }
  3665. .header-1 .header-main .header-right {
  3666. gap: 30px;
  3667. }
  3668. @media (max-width: 1199px) {
  3669. .header-1 .header-main .header-right {
  3670. gap: 20px;
  3671. }
  3672. }
  3673. @media (max-width: 767px) {
  3674. .header-1 .header-main .header-right {
  3675. gap: 10px;
  3676. }
  3677. }
  3678. .header-1 .header-main .header-right .search-icon {
  3679. width: 50px;
  3680. height: 50px;
  3681. line-height: 50px;
  3682. text-align: center;
  3683. border-radius: 50%;
  3684. border: 1px solid rgba(92, 112, 126, 0.3);
  3685. color: var(--header);
  3686. margin-left: 30px;
  3687. }
  3688. @media (max-width: 1199px) {
  3689. .header-1 .header-main .header-right .search-icon {
  3690. margin-left: 0;
  3691. }
  3692. }
  3693. @media (max-width: 1199px) {
  3694. .header-1 .header-main .header-right .search-icon {
  3695. width: 40px;
  3696. height: 40px;
  3697. line-height: 40px;
  3698. }
  3699. }
  3700. @media (max-width: 1399px) {
  3701. .header-1 .header-main .header-right .header-button {
  3702. display: none;
  3703. }
  3704. }
  3705. .header-2 {
  3706. background-color: var(--bg);
  3707. }
  3708. .header-2 .header-main {
  3709. background-color: var(--white);
  3710. padding: 20px 30px;
  3711. border-radius: 16px;
  3712. }
  3713. .header-2 .header-main .header-right {
  3714. gap: 30px;
  3715. }
  3716. @media (max-width: 1199px) {
  3717. .header-2 .header-main .header-right {
  3718. gap: 20px;
  3719. }
  3720. }
  3721. @media (max-width: 767px) {
  3722. .header-2 .header-main .header-right {
  3723. gap: 10px;
  3724. }
  3725. }
  3726. .header-2 .header-main .header-right .search-icon {
  3727. width: 50px;
  3728. height: 50px;
  3729. line-height: 50px;
  3730. text-align: center;
  3731. border-radius: 50%;
  3732. border: 1px solid rgba(92, 112, 126, 0.3);
  3733. color: var(--header);
  3734. margin-left: 30px;
  3735. }
  3736. @media (max-width: 1199px) {
  3737. .header-2 .header-main .header-right .search-icon {
  3738. margin-left: 0;
  3739. }
  3740. }
  3741. @media (max-width: 1199px) {
  3742. .header-2 .header-main .header-right .search-icon {
  3743. width: 40px;
  3744. height: 40px;
  3745. line-height: 40px;
  3746. }
  3747. }
  3748. @media (max-width: 1399px) {
  3749. .header-2 .header-main .header-right .header-button {
  3750. display: none;
  3751. }
  3752. }
  3753. .header-3 {
  3754. padding: 10px 0;
  3755. }
  3756. .header-3 .header-main .header-left {
  3757. display: flex;
  3758. align-items: center;
  3759. gap: 35px;
  3760. }
  3761. .header-3 .header-main .header-right {
  3762. gap: 30px;
  3763. }
  3764. .header-3 .header-main .header-right .author-icon {
  3765. display: flex;
  3766. align-items: center;
  3767. gap: 20px;
  3768. }
  3769. @media (max-width: 1399px) {
  3770. .header-3 .header-main .header-right .author-icon {
  3771. display: none;
  3772. }
  3773. }
  3774. .header-3 .header-main .header-right .author-icon .icon {
  3775. width: 48px;
  3776. height: 48px;
  3777. line-height: 48px;
  3778. text-align: center;
  3779. background-color: var(--theme);
  3780. text-align: center;
  3781. color: var(--white);
  3782. border-radius: 50%;
  3783. position: relative;
  3784. }
  3785. .header-3 .header-main .header-right .author-icon .icon::before {
  3786. position: absolute;
  3787. top: 50%;
  3788. left: 50%;
  3789. right: 0;
  3790. bottom: 0;
  3791. width: 60px;
  3792. height: 60px;
  3793. border-radius: 50%;
  3794. border: 1px solid var(--theme);
  3795. content: "";
  3796. transform: translate(-50%, -50%);
  3797. }
  3798. .header-3 .header-main .header-right .author-icon .content span {
  3799. margin-bottom: 5px;
  3800. display: inline-block;
  3801. }
  3802. @media (max-width: 1199px) {
  3803. .header-3 .header-main .header-right .header-button {
  3804. display: none;
  3805. }
  3806. }
  3807. .header-4 {
  3808. padding: 10px 0;
  3809. }
  3810. .header-4 .header-main .header-right {
  3811. gap: 30px;
  3812. }
  3813. @media (max-width: 1199px) {
  3814. .header-4 .header-main .header-right {
  3815. gap: 20px;
  3816. }
  3817. }
  3818. @media (max-width: 767px) {
  3819. .header-4 .header-main .header-right {
  3820. gap: 20px;
  3821. }
  3822. }
  3823. .header-4 .header-main .header-right .search-icon {
  3824. width: 50px;
  3825. height: 50px;
  3826. line-height: 50px;
  3827. text-align: center;
  3828. border-radius: 50%;
  3829. border: 1px solid rgba(92, 112, 126, 0.3);
  3830. color: var(--header);
  3831. margin-left: 30px;
  3832. }
  3833. @media (max-width: 1199px) {
  3834. .header-4 .header-main .header-right .search-icon {
  3835. margin-left: 0;
  3836. }
  3837. }
  3838. @media (max-width: 1199px) {
  3839. .header-4 .header-main .header-right .search-icon {
  3840. width: 40px;
  3841. height: 40px;
  3842. line-height: 40px;
  3843. }
  3844. }
  3845. @media (max-width: 1399px) {
  3846. .header-4 .header-main .header-right .header-button {
  3847. display: none;
  3848. }
  3849. }
  3850. .sidebar__toggle {
  3851. cursor: pointer;
  3852. }
  3853. .sticky {
  3854. position: fixed !important;
  3855. top: 0 !important;
  3856. left: 0;
  3857. width: 100%;
  3858. z-index: 100;
  3859. transition: all 0.9s;
  3860. background-color: var(--white);
  3861. box-shadow: var(--box-shadow);
  3862. -webkit-animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;
  3863. animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;
  3864. }
  3865. .sticky.header-1 {
  3866. padding-top: 0;
  3867. }
  3868. .sticky.header-2 .header-main {
  3869. padding: 15px 0;
  3870. border-radius: 0;
  3871. }
  3872. .offcanvas__info {
  3873. background: var(--bg) none repeat scroll 0 0;
  3874. border-left: 2px solid var(--theme);
  3875. position: fixed;
  3876. right: 0;
  3877. top: 0;
  3878. width: 400px;
  3879. height: 100%;
  3880. -webkit-transform: translateX(calc(100% + 80px));
  3881. -moz-transform: translateX(calc(100% + 80px));
  3882. -ms-transform: translateX(calc(100% + 80px));
  3883. -o-transform: translateX(calc(100% + 80px));
  3884. transform: translateX(calc(100% + 80px));
  3885. -webkit-transition: transform 0.45s ease-in-out, opacity 0.45s ease-in-out;
  3886. -moz-transition: transform 0.45s ease-in-out, opacity 0.45s ease-in-out;
  3887. transition: transform 0.45s ease-in-out, opacity 0.45s ease-in-out;
  3888. z-index: 99999;
  3889. overflow-y: scroll;
  3890. overscroll-behavior-y: contain;
  3891. scrollbar-width: none;
  3892. }
  3893. .offcanvas__info::-webkit-scrollbar {
  3894. display: none;
  3895. }
  3896. .offcanvas__info.info-open {
  3897. opacity: 1;
  3898. -webkit-transform: translateX(0);
  3899. -moz-transform: translateX(0);
  3900. -ms-transform: translateX(0);
  3901. -o-transform: translateX(0);
  3902. transform: translateX(0);
  3903. }
  3904. .offcanvas__logo a img {
  3905. width: 150px;
  3906. }
  3907. .offcanvas__wrapper {
  3908. position: relative;
  3909. height: 100%;
  3910. padding: 30px 30px;
  3911. }
  3912. .offcanvas__wrapper .offcanvas__content .text {
  3913. color: var(--text);
  3914. }
  3915. .offcanvas__wrapper .offcanvas__content .offcanvas__close {
  3916. width: 45px;
  3917. height: 45px;
  3918. line-height: 45px;
  3919. text-align: center;
  3920. border-radius: 50%;
  3921. background-color: var(--theme);
  3922. position: relative;
  3923. z-index: 9;
  3924. cursor: pointer;
  3925. }
  3926. .offcanvas__wrapper .offcanvas__content .offcanvas__close i {
  3927. color: var(--white);
  3928. }
  3929. .offcanvas__wrapper .offcanvas__content .offcanvas__contact {
  3930. margin-top: 20px;
  3931. }
  3932. .offcanvas__wrapper .offcanvas__content .offcanvas__contact ul {
  3933. margin-top: 20px;
  3934. }
  3935. .offcanvas__wrapper .offcanvas__content .offcanvas__contact ul li {
  3936. font-size: 16px;
  3937. font-weight: 600;
  3938. text-transform: capitalize;
  3939. }
  3940. .offcanvas__wrapper .offcanvas__content .offcanvas__contact ul li a {
  3941. color: var(--text);
  3942. }
  3943. .offcanvas__wrapper .offcanvas__content .offcanvas__contact ul li:not(:last-child) {
  3944. margin-bottom: 15px;
  3945. }
  3946. .offcanvas__wrapper .offcanvas__content .offcanvas__contact ul li .offcanvas__contact-icon {
  3947. margin-right: 20px;
  3948. }
  3949. .offcanvas__wrapper .offcanvas__content .offcanvas__contact ul li .offcanvas__contact-icon i {
  3950. color: var(--theme);
  3951. }
  3952. .offcanvas__wrapper .offcanvas__content .offcanvas__contact span {
  3953. text-transform: initial;
  3954. }
  3955. .offcanvas__wrapper .offcanvas__content .offcanvas__contact .header-button .theme-btn {
  3956. width: 100%;
  3957. padding: 16px 40px;
  3958. text-transform: capitalize !important;
  3959. }
  3960. .offcanvas__wrapper .offcanvas__content .offcanvas__contact .social-icon {
  3961. margin-top: 30px;
  3962. gap: 10px;
  3963. }
  3964. .offcanvas__wrapper .offcanvas__content .offcanvas__contact .social-icon a {
  3965. width: 45px;
  3966. height: 45px;
  3967. line-height: 45px;
  3968. text-align: center;
  3969. font-size: 16px;
  3970. display: block;
  3971. background: transparent;
  3972. color: var(--text);
  3973. border-radius: 50%;
  3974. -webkit-transition: all 0.4s ease-in-out;
  3975. transition: all 0.4s ease-in-out;
  3976. text-align: center;
  3977. border: 1px solid var(--border);
  3978. }
  3979. .offcanvas__wrapper .offcanvas__content .offcanvas__contact .social-icon a:hover {
  3980. background-color: var(--theme);
  3981. color: var(--white);
  3982. }
  3983. .offcanvas__overlay {
  3984. position: fixed;
  3985. height: 100%;
  3986. width: 100%;
  3987. background: #151515;
  3988. z-index: 900;
  3989. top: 0;
  3990. opacity: 0;
  3991. visibility: hidden;
  3992. right: 0;
  3993. }
  3994. .offcanvas__overlay.overlay-open {
  3995. opacity: 0.8;
  3996. visibility: visible;
  3997. }
  3998. @media (max-width: 450px) {
  3999. .offcanvas__info {
  4000. width: 300px;
  4001. }
  4002. }
  4003. @media (max-width: 575px) {
  4004. .offcanvas__wrapper {
  4005. padding: 20px;
  4006. }
  4007. }
  4008. .breadcrumb-wrapper {
  4009. position: relative;
  4010. overflow: hidden;
  4011. }
  4012. .breadcrumb-wrapper .line-shape {
  4013. position: absolute;
  4014. left: 0;
  4015. bottom: 20%;
  4016. }
  4017. @media (max-width: 991px) {
  4018. .breadcrumb-wrapper .line-shape {
  4019. display: none;
  4020. }
  4021. }
  4022. .breadcrumb-wrapper .plane-shape {
  4023. position: absolute;
  4024. top: 25%;
  4025. left: 15%;
  4026. }
  4027. @media (max-width: 991px) {
  4028. .breadcrumb-wrapper .plane-shape {
  4029. display: none;
  4030. }
  4031. }
  4032. .breadcrumb-wrapper .doll-shape {
  4033. position: absolute;
  4034. bottom: 25%;
  4035. left: 12%;
  4036. }
  4037. @media (max-width: 991px) {
  4038. .breadcrumb-wrapper .doll-shape {
  4039. display: none;
  4040. }
  4041. }
  4042. .breadcrumb-wrapper .parasuit-shape {
  4043. position: absolute;
  4044. right: 10%;
  4045. top: 10%;
  4046. }
  4047. @media (max-width: 991px) {
  4048. .breadcrumb-wrapper .parasuit-shape {
  4049. display: none;
  4050. }
  4051. }
  4052. .breadcrumb-wrapper .frame-shape {
  4053. position: absolute;
  4054. top: 12%;
  4055. right: 23%;
  4056. animation: rounded 5s linear infinite;
  4057. }
  4058. @media (max-width: 991px) {
  4059. .breadcrumb-wrapper .frame-shape {
  4060. display: none;
  4061. }
  4062. }
  4063. .breadcrumb-wrapper .bee-shape {
  4064. position: absolute;
  4065. bottom: 25%;
  4066. right: 18%;
  4067. }
  4068. @media (max-width: 991px) {
  4069. .breadcrumb-wrapper .bee-shape {
  4070. display: none;
  4071. }
  4072. }
  4073. .breadcrumb-wrapper .page-heading {
  4074. position: relative;
  4075. padding: 140px 0 197px;
  4076. text-align: center;
  4077. z-index: 9;
  4078. }
  4079. @media (max-width: 1199px) {
  4080. .breadcrumb-wrapper .page-heading {
  4081. padding: 140px 0;
  4082. }
  4083. }
  4084. @media (max-width: 991px) {
  4085. .breadcrumb-wrapper .page-heading {
  4086. padding: 110px 0;
  4087. }
  4088. }
  4089. @media (max-width: 767px) {
  4090. .breadcrumb-wrapper .page-heading {
  4091. padding: 70px 0;
  4092. }
  4093. }
  4094. @media (max-width: 575px) {
  4095. .breadcrumb-wrapper .page-heading {
  4096. padding: 60px 0;
  4097. }
  4098. }
  4099. .breadcrumb-wrapper .page-heading h1 {
  4100. color: var(--white);
  4101. font-size: 60px;
  4102. position: relative;
  4103. z-index: 9;
  4104. }
  4105. @media (max-width: 991px) {
  4106. .breadcrumb-wrapper .page-heading h1 {
  4107. font-size: 42px;
  4108. }
  4109. }
  4110. @media (max-width: 575px) {
  4111. .breadcrumb-wrapper .page-heading h1 {
  4112. font-size: 36px;
  4113. }
  4114. }
  4115. .breadcrumb-wrapper .page-heading .breadcrumb-items {
  4116. display: flex;
  4117. align-items: center;
  4118. margin-top: 20px;
  4119. gap: 10px;
  4120. justify-content: center;
  4121. }
  4122. @media (max-width: 575px) {
  4123. .breadcrumb-wrapper .page-heading .breadcrumb-items {
  4124. margin-top: 15px;
  4125. }
  4126. }
  4127. .breadcrumb-wrapper .page-heading .breadcrumb-items li {
  4128. color: var(--white);
  4129. text-transform: capitalize;
  4130. font-weight: 600;
  4131. font-size: 18px;
  4132. }
  4133. .breadcrumb-wrapper .page-heading .breadcrumb-items li a {
  4134. color: var(--white);
  4135. transition: all 0.4s ease-in-out;
  4136. }
  4137. .breadcrumb-wrapper .page-heading .breadcrumb-items li a:hover {
  4138. color: var(--white);
  4139. }
  4140. .breadcrumb-wrapper .page-heading .breadcrumb-items li i {
  4141. color: var(--white);
  4142. }
  4143. .error-items {
  4144. text-align: center;
  4145. }
  4146. .error-items .error-image img {
  4147. width: 100%;
  4148. height: 100%;
  4149. }
  4150. .error-items h2 {
  4151. margin-top: 30px;
  4152. margin-bottom: 40px;
  4153. }
  4154. ::-webkit-scrollbar {
  4155. width: 4px;
  4156. height: 4px;
  4157. }
  4158. /* Track */
  4159. ::-webkit-scrollbar-track {
  4160. box-shadow: inset 0 0 5px var(--theme);
  4161. border-radius: 5px;
  4162. }
  4163. /* Handle */
  4164. ::-webkit-scrollbar-thumb {
  4165. background: var(--theme);
  4166. border-radius: 10px;
  4167. }
  4168. .fix {
  4169. overflow: hidden;
  4170. }
  4171. .ralt {
  4172. position: relative;
  4173. }
  4174. .ml-100 {
  4175. margin-left: 100px;
  4176. }
  4177. .ripple {
  4178. position: relative;
  4179. }
  4180. .ripple::before, .ripple::after {
  4181. position: absolute;
  4182. left: 50%;
  4183. top: 50%;
  4184. width: 60px;
  4185. height: 60px;
  4186. -webkit-transform: translateX(-50%) translateY(-50%);
  4187. transform: translateX(-50%) translateY(-50%);
  4188. border-radius: 50%;
  4189. box-shadow: 0 0 0 0 rgba(243, 159, 95, 0.5);
  4190. -webkit-animation: rippleOne 3s infinite;
  4191. animation: rippleOne 3s infinite;
  4192. }
  4193. .ripple::before {
  4194. -webkit-animation-delay: 0.9s;
  4195. animation-delay: 0.9s;
  4196. content: "";
  4197. position: absolute;
  4198. right: 0;
  4199. bottom: 0;
  4200. }
  4201. .ripple::after {
  4202. -webkit-animation-delay: 0.6s;
  4203. animation-delay: 0.6s;
  4204. content: "";
  4205. position: absolute;
  4206. right: 0;
  4207. bottom: 0;
  4208. }
  4209. .swiper-dot {
  4210. margin-bottom: 2px;
  4211. position: relative;
  4212. }
  4213. .swiper-dot::before {
  4214. position: absolute;
  4215. bottom: 13px;
  4216. left: 37%;
  4217. transform: translate(-50%, -50%);
  4218. width: 105px;
  4219. height: 2px;
  4220. background: linear-gradient(90deg, #F39F5F 4.85%, rgba(255, 255, 255, 0) 96.39%);
  4221. content: "";
  4222. transform: rotate(-180deg);
  4223. }
  4224. @media (max-width: 1399px) {
  4225. .swiper-dot::before {
  4226. display: none;
  4227. }
  4228. }
  4229. .swiper-dot::after {
  4230. position: absolute;
  4231. bottom: 13px;
  4232. right: 37%;
  4233. width: 105px;
  4234. height: 2px;
  4235. background: linear-gradient(90deg, #F39F5F 4.85%, rgba(255, 255, 255, 0) 96.39%);
  4236. content: "";
  4237. }
  4238. @media (max-width: 1399px) {
  4239. .swiper-dot::after {
  4240. display: none;
  4241. }
  4242. }
  4243. .swiper-dot .swiper-pagination-bullet {
  4244. width: 10px;
  4245. height: 10px;
  4246. transition: 0.6s;
  4247. background-color: var(--theme);
  4248. opacity: 1;
  4249. border-radius: 10px;
  4250. }
  4251. .swiper-dot .swiper-pagination-bullet:not(:last-child) {
  4252. margin-right: 15px;
  4253. }
  4254. .swiper-dot .swiper-pagination-bullet.swiper-pagination-bullet-active {
  4255. background-color: var(--theme);
  4256. transition: 0.6s;
  4257. position: relative;
  4258. }
  4259. .swiper-dot .swiper-pagination-bullet.swiper-pagination-bullet-active::before {
  4260. position: absolute;
  4261. width: 30px;
  4262. height: 30px;
  4263. line-height: 30px;
  4264. top: -10px;
  4265. left: -10px;
  4266. border-radius: 50%;
  4267. background-color: transparent;
  4268. border: 2px solid var(--theme);
  4269. content: "";
  4270. }
  4271. .array-button {
  4272. display: flex;
  4273. align-items: center;
  4274. gap: 15px;
  4275. }
  4276. .array-button .array-prev {
  4277. width: 61px;
  4278. height: 56px;
  4279. line-height: 56px;
  4280. text-align: center;
  4281. background-color: var(--white);
  4282. color: var(--header);
  4283. border-radius: 22px;
  4284. transition: all 0.4s ease-in-out;
  4285. }
  4286. .array-button .array-prev:hover {
  4287. background-color: var(--theme);
  4288. color: var(--white);
  4289. }
  4290. .array-button .array-next {
  4291. width: 61px;
  4292. height: 56px;
  4293. line-height: 56px;
  4294. text-align: center;
  4295. background-color: var(--theme);
  4296. color: var(--white);
  4297. border-radius: 22px;
  4298. transition: all 0.4s ease-in-out;
  4299. }
  4300. .array-button .array-next:hover {
  4301. background-color: var(--white);
  4302. color: var(--theme);
  4303. }
  4304. .mt-10 {
  4305. margin-top: 10px;
  4306. }
  4307. @media (max-width: 767px) {
  4308. br {
  4309. display: none;
  4310. }
  4311. }
  4312. .mt-60 {
  4313. margin-top: 55px;
  4314. }
  4315. .mb-40 {
  4316. margin-bottom: 40px;
  4317. }
  4318. /* background */
  4319. .bg-cover {
  4320. background-repeat: no-repeat;
  4321. background-size: cover;
  4322. position: relative;
  4323. background-position: center;
  4324. }
  4325. .bg-cover-2 {
  4326. background-repeat: no-repeat;
  4327. background-size: cover;
  4328. position: relative;
  4329. background-position: center;
  4330. width: 100%;
  4331. height: 100%;
  4332. }
  4333. .nice-select {
  4334. background-color: transparent;
  4335. border: transparent;
  4336. float: initial;
  4337. overflow: initial;
  4338. height: initial;
  4339. padding: 0;
  4340. display: inline-flex;
  4341. align-items: center;
  4342. line-height: 150%;
  4343. width: 100%;
  4344. border: none;
  4345. }
  4346. .nice-select:focus, .nice-select:hover {
  4347. border-color: transparent;
  4348. }
  4349. .nice-select::after {
  4350. height: 8px;
  4351. width: 8px;
  4352. right: -25px;
  4353. top: 15px;
  4354. border-color: var(--header);
  4355. border-bottom: 2px solid var(--header);
  4356. border-right: 2px solid var(--header);
  4357. }
  4358. .nice-select .list {
  4359. width: initial;
  4360. background-color: var(--theme);
  4361. box-shadow: none;
  4362. overflow: initial;
  4363. box-shadow: rgba(0, 0, 0, 0.15) 0px 3px 3px 0px;
  4364. width: 100%;
  4365. top: 100%;
  4366. padding: 0;
  4367. max-height: 50vh;
  4368. overflow-x: auto;
  4369. right: -50px;
  4370. }
  4371. .nice-select .list::-webkit-scrollbar {
  4372. width: 2px;
  4373. opacity: 1;
  4374. display: block;
  4375. }
  4376. .nice-select .list::-webkit-scrollbar-button, .nice-select .list::-webkit-scrollbar-thumb {
  4377. background: var(--header);
  4378. }
  4379. .nice-select .option {
  4380. background-color: transparent;
  4381. font-size: 16px;
  4382. line-height: 150%;
  4383. padding: 4px 5px;
  4384. min-height: initial;
  4385. font-weight: 500;
  4386. }
  4387. .nice-select .option:hover, .nice-select .option:focus, .nice-select .option.selected.focus {
  4388. background-color: transparent;
  4389. }
  4390. .nice-select .current {
  4391. font-weight: 500;
  4392. color: var(--header);
  4393. }
  4394. .scroll-up {
  4395. cursor: pointer;
  4396. display: block;
  4397. border-radius: 50px;
  4398. box-shadow: inset 0 0 0 2px var(--border);
  4399. z-index: 99;
  4400. opacity: 0;
  4401. visibility: hidden;
  4402. transform: translateY(15px);
  4403. position: fixed;
  4404. right: 25px;
  4405. bottom: 35px;
  4406. height: 50px;
  4407. width: 50px;
  4408. transition: all 0.4s ease-in-out;
  4409. }
  4410. .scroll-up::after {
  4411. position: absolute;
  4412. font-family: "Font Awesome 6 free";
  4413. content: "\f062";
  4414. text-align: center;
  4415. line-height: 50px;
  4416. font-weight: 700;
  4417. font-size: 18px;
  4418. color: var(--theme);
  4419. left: 0;
  4420. top: 0;
  4421. height: 50px;
  4422. width: 50px;
  4423. cursor: pointer;
  4424. display: block;
  4425. z-index: 1;
  4426. transition: all 0.4s ease-in-out;
  4427. }
  4428. .scroll-up svg path {
  4429. fill: none;
  4430. }
  4431. .scroll-up svg.scroll-circle path {
  4432. stroke: var(--theme2);
  4433. stroke-width: 4px;
  4434. box-sizing: border-box;
  4435. transition: all 0.4s ease-in-out;
  4436. }
  4437. .scroll-up.active-scroll {
  4438. opacity: 1;
  4439. visibility: visible;
  4440. transform: translateY(0);
  4441. }
  4442. .page-nav-wrap ul li {
  4443. display: inline-block;
  4444. }
  4445. .page-nav-wrap ul li .page-numbers {
  4446. display: inline-block;
  4447. width: 50px;
  4448. height: 50px;
  4449. line-height: 50px;
  4450. background: transparent;
  4451. font-weight: 600;
  4452. transition: all 0.3s ease-in-out;
  4453. margin: 0 2px;
  4454. border: 1px solid var(--border);
  4455. color: var(--text);
  4456. border-radius: 50%;
  4457. }
  4458. .page-nav-wrap ul li .page-numbers.current {
  4459. background-color: var(--theme);
  4460. color: var(--white);
  4461. }
  4462. @media (max-width: 767px) {
  4463. .page-nav-wrap ul li .page-numbers {
  4464. margin-top: 10px;
  4465. width: 50px;
  4466. height: 50px;
  4467. line-height: 50px;
  4468. font-size: 14px;
  4469. }
  4470. }
  4471. .page-nav-wrap ul li .page-numbers i {
  4472. margin-top: 2px;
  4473. }
  4474. .page-nav-wrap ul li .page-numbers:hover {
  4475. background-color: var(--theme);
  4476. color: var(--white);
  4477. border: 1px solid transparent;
  4478. }
  4479. .box-color-1 {
  4480. background-color: rgba(248, 184, 31, 0.15);
  4481. }
  4482. .box-color-2 {
  4483. background-color: rgba(88, 102, 235, 0.15);
  4484. }
  4485. .box-color-3 {
  4486. background-color: rgba(57, 192, 250, 0.15);
  4487. }
  4488. .box-color-4 {
  4489. background-color: rgba(249, 37, 150, 0.15);
  4490. }
  4491. .border-none {
  4492. border: none !important;
  4493. }
  4494. .pt-40 {
  4495. padding-top: 40px;
  4496. }
  4497. .box-shadow {
  4498. box-shadow: var(--box-shadow);
  4499. }
  4500. .bor-1 {
  4501. border: 1px solid var(--theme);
  4502. }
  4503. .mb-55 {
  4504. margin-bottom: 55px;
  4505. }
  4506. .border-array-style {
  4507. border: 1px solid var(--theme);
  4508. }
  4509. .pt-80 {
  4510. padding-top: 80px;
  4511. }
  4512. .fz-40 {
  4513. font-size: 40px;
  4514. }
  4515. .hero-1 {
  4516. background-color: var(--bg);
  4517. padding-top: 30px;
  4518. padding-bottom: 40px;
  4519. position: relative;
  4520. }
  4521. @media (max-width: 1199px) {
  4522. .hero-1 {
  4523. padding-top: 90px;
  4524. padding-bottom: 100px;
  4525. }
  4526. }
  4527. @media (max-width: 991px) {
  4528. .hero-1 {
  4529. padding-top: 130px;
  4530. padding-bottom: 0;
  4531. }
  4532. }
  4533. @media (max-width: 767px) {
  4534. .hero-1 {
  4535. padding-top: 100px;
  4536. }
  4537. }
  4538. @media (max-width: 575px) {
  4539. .hero-1 {
  4540. padding-top: 80px;
  4541. }
  4542. }
  4543. .hero-1 .bottom-shape {
  4544. position: absolute;
  4545. bottom: 0;
  4546. left: 0;
  4547. right: 0;
  4548. z-index: 99;
  4549. width: 100%;
  4550. }
  4551. .hero-1 .parasuit-shape {
  4552. position: absolute;
  4553. top: 20%;
  4554. left: 5%;
  4555. }
  4556. @media (max-width: 767px) {
  4557. .hero-1 .parasuit-shape {
  4558. display: none;
  4559. }
  4560. }
  4561. .hero-1 .left-shape {
  4562. position: absolute;
  4563. bottom: 10%;
  4564. left: 0;
  4565. }
  4566. .hero-1 .book-shape {
  4567. position: absolute;
  4568. top: 10%;
  4569. left: 50%;
  4570. transform: translateX(-50%);
  4571. }
  4572. @media (max-width: 991px) {
  4573. .hero-1 .book-shape {
  4574. display: none;
  4575. }
  4576. }
  4577. .hero-1 .pencil-shape {
  4578. position: absolute;
  4579. bottom: 15%;
  4580. right: 5%;
  4581. animation: rounded 5s linear infinite;
  4582. }
  4583. .hero-1 .bee-shape {
  4584. position: absolute;
  4585. top: 20%;
  4586. right: 5%;
  4587. }
  4588. @media (max-width: 991px) {
  4589. .hero-1 .bee-shape {
  4590. display: none;
  4591. }
  4592. }
  4593. .hero-1 .right-shape {
  4594. position: absolute;
  4595. top: 17%;
  4596. right: 0;
  4597. }
  4598. .hero-1 .star-shape {
  4599. position: absolute;
  4600. bottom: 20%;
  4601. left: 45%;
  4602. transform: translateX(-50%);
  4603. }
  4604. .hero-1 .hero-content {
  4605. position: relative;
  4606. z-index: 9;
  4607. }
  4608. @media (max-width: 575px) {
  4609. .hero-1 .hero-content {
  4610. text-align: center;
  4611. margin: 0 auto;
  4612. }
  4613. }
  4614. .hero-1 .hero-content h5 {
  4615. margin-bottom: 15px;
  4616. color: var(--theme);
  4617. font-family: "Pangolin";
  4618. font-weight: 500;
  4619. position: relative;
  4620. display: inline-block;
  4621. }
  4622. .hero-1 .hero-content h5::before {
  4623. position: absolute;
  4624. right: -30px;
  4625. top: 0;
  4626. width: 20px;
  4627. height: 20px;
  4628. content: "";
  4629. background-image: url(../image/star.svg);
  4630. }
  4631. .hero-1 .hero-content h1 {
  4632. margin-bottom: 20px;
  4633. }
  4634. .hero-1 .hero-content h1 span {
  4635. color: var(--theme);
  4636. }
  4637. @media (max-width: 1399px) {
  4638. .hero-1 .hero-content h1 {
  4639. font-size: 60px;
  4640. }
  4641. }
  4642. @media (max-width: 1199px) {
  4643. .hero-1 .hero-content h1 {
  4644. font-size: 56px;
  4645. }
  4646. }
  4647. @media (max-width: 767px) {
  4648. .hero-1 .hero-content h1 {
  4649. font-size: 42px;
  4650. }
  4651. }
  4652. @media (max-width: 575px) {
  4653. .hero-1 .hero-content h1 {
  4654. font-size: 34px;
  4655. }
  4656. }
  4657. .hero-1 .hero-content p {
  4658. font-size: 20px;
  4659. }
  4660. .hero-1 .hero-content .hero-button {
  4661. display: flex;
  4662. align-items: center;
  4663. gap: 30px;
  4664. margin-top: 50px;
  4665. }
  4666. @media (max-width: 767px) {
  4667. .hero-1 .hero-content .hero-button {
  4668. margin-top: 40px;
  4669. }
  4670. }
  4671. @media (max-width: 575px) {
  4672. .hero-1 .hero-content .hero-button {
  4673. margin-top: 25px;
  4674. justify-content: center;
  4675. flex-wrap: wrap;
  4676. }
  4677. }
  4678. .hero-1 .hero-content .hero-button .video-btn {
  4679. background-color: var(--theme);
  4680. color: var(--white);
  4681. display: inline-block;
  4682. font-size: 16px;
  4683. height: 50px;
  4684. width: 50px;
  4685. line-height: 50px;
  4686. border-radius: 50%;
  4687. text-align: center;
  4688. position: relative;
  4689. }
  4690. .hero-1 .hero-content .hero-button .video-btn::before {
  4691. position: absolute;
  4692. top: 50%;
  4693. left: 50%;
  4694. right: 0;
  4695. bottom: 0;
  4696. width: 60px;
  4697. height: 60px;
  4698. border-radius: 50%;
  4699. border: 1px solid var(--theme);
  4700. content: "";
  4701. transform: translate(-50%, -50%);
  4702. }
  4703. .hero-1 .hero-content .hero-button .button-text span {
  4704. font-size: 16px;
  4705. color: var(--header);
  4706. font-weight: bold;
  4707. }
  4708. .hero-1 .hero-image {
  4709. position: relative;
  4710. z-index: 9;
  4711. }
  4712. .hero-1 .hero-image img {
  4713. width: 100%;
  4714. height: 100%;
  4715. }
  4716. .hero-1 .hero-image .hero-shape {
  4717. position: absolute;
  4718. bottom: 0;
  4719. left: 30px;
  4720. z-index: -1;
  4721. margin-right: -60px;
  4722. }
  4723. @media (max-width: 1399px) {
  4724. .hero-1 .hero-image .hero-shape {
  4725. margin-right: 0;
  4726. }
  4727. }
  4728. .hero-2 {
  4729. background-color: var(--bg);
  4730. padding-top: 280px;
  4731. padding-bottom: 110px;
  4732. }
  4733. .hero-2 .right-shape {
  4734. position: absolute;
  4735. top: 20%;
  4736. right: 0;
  4737. }
  4738. @media (max-width: 1399px) {
  4739. .hero-2 .right-shape {
  4740. display: none;
  4741. }
  4742. }
  4743. .hero-2 .line-shape {
  4744. position: absolute;
  4745. top: 60%;
  4746. left: 52%;
  4747. transform: translate(-50%, -50%);
  4748. }
  4749. @media (max-width: 1600px) {
  4750. .hero-2 .line-shape {
  4751. top: 28%;
  4752. left: 55%;
  4753. }
  4754. }
  4755. @media (max-width: 1199px) {
  4756. .hero-2 .line-shape {
  4757. display: none;
  4758. }
  4759. }
  4760. .hero-2 .circle-shape {
  4761. position: absolute;
  4762. top: 30%;
  4763. right: 15%;
  4764. z-index: 9;
  4765. animation: cir36 10s linear infinite;
  4766. }
  4767. @media (max-width: 1600px) {
  4768. .hero-2 .circle-shape {
  4769. display: none;
  4770. }
  4771. }
  4772. .hero-2 .roket-shape {
  4773. position: absolute;
  4774. left: 30px;
  4775. top: 30%;
  4776. }
  4777. @media (max-width: 1199px) {
  4778. .hero-2 .roket-shape {
  4779. display: none;
  4780. }
  4781. }
  4782. .hero-2 .compass-shape {
  4783. position: absolute;
  4784. left: 5%;
  4785. bottom: 20%;
  4786. animation: rounded 5s linear infinite;
  4787. }
  4788. @media (max-width: 1199px) {
  4789. .hero-2 .compass-shape {
  4790. display: none;
  4791. }
  4792. }
  4793. .hero-2 .bus-shape {
  4794. position: absolute;
  4795. left: 50%;
  4796. bottom: 2%;
  4797. transform: translateX(-50%);
  4798. z-index: 9;
  4799. }
  4800. @media (max-width: 1199px) {
  4801. .hero-2 .bus-shape {
  4802. display: none;
  4803. }
  4804. }
  4805. .hero-2 .frame-shape {
  4806. position: absolute;
  4807. top: 10%;
  4808. left: 56%;
  4809. animation: rounded 5s linear infinite;
  4810. }
  4811. @media (max-width: 991px) {
  4812. .hero-2 .frame-shape {
  4813. display: none;
  4814. }
  4815. }
  4816. .hero-2 .star-shape {
  4817. position: absolute;
  4818. bottom: 5%;
  4819. left: 35%;
  4820. transform: translateX(-50%);
  4821. z-index: 9;
  4822. }
  4823. @media (max-width: 1199px) {
  4824. .hero-2 .star-shape {
  4825. display: none;
  4826. }
  4827. }
  4828. .hero-2 .pencil-shape {
  4829. position: absolute;
  4830. top: 20%;
  4831. right: 5%;
  4832. animation: rounded 5s linear infinite;
  4833. }
  4834. .hero-2 .hero-content {
  4835. position: relative;
  4836. z-index: 9;
  4837. }
  4838. @media (max-width: 575px) {
  4839. .hero-2 .hero-content {
  4840. text-align: center;
  4841. margin: 0 auto;
  4842. }
  4843. }
  4844. .hero-2 .hero-content h5 {
  4845. margin-bottom: 15px;
  4846. color: var(--theme);
  4847. font-family: "Pangolin";
  4848. font-weight: 500;
  4849. position: relative;
  4850. display: inline-block;
  4851. }
  4852. .hero-2 .hero-content h1 {
  4853. margin-bottom: 20px;
  4854. }
  4855. .hero-2 .hero-content h1 span {
  4856. color: var(--theme);
  4857. }
  4858. @media (max-width: 1399px) {
  4859. .hero-2 .hero-content h1 {
  4860. font-size: 60px;
  4861. }
  4862. }
  4863. @media (max-width: 1199px) {
  4864. .hero-2 .hero-content h1 {
  4865. font-size: 56px;
  4866. }
  4867. }
  4868. @media (max-width: 767px) {
  4869. .hero-2 .hero-content h1 {
  4870. font-size: 42px;
  4871. }
  4872. }
  4873. @media (max-width: 575px) {
  4874. .hero-2 .hero-content h1 {
  4875. font-size: 34px;
  4876. }
  4877. }
  4878. .hero-2 .hero-content p {
  4879. font-size: 20px;
  4880. }
  4881. .hero-2 .hero-content .hero-button {
  4882. display: flex;
  4883. align-items: center;
  4884. gap: 30px;
  4885. margin-top: 50px;
  4886. }
  4887. @media (max-width: 767px) {
  4888. .hero-2 .hero-content .hero-button {
  4889. margin-top: 40px;
  4890. }
  4891. }
  4892. @media (max-width: 575px) {
  4893. .hero-2 .hero-content .hero-button {
  4894. margin-top: 25px;
  4895. justify-content: center;
  4896. flex-wrap: wrap;
  4897. gap: 20px;
  4898. }
  4899. }
  4900. .hero-2 .hero-content .hero-button .video-btn {
  4901. background-color: var(--theme);
  4902. color: var(--white);
  4903. display: inline-block;
  4904. font-size: 16px;
  4905. height: 50px;
  4906. width: 50px;
  4907. line-height: 50px;
  4908. border-radius: 50%;
  4909. text-align: center;
  4910. position: relative;
  4911. }
  4912. .hero-2 .hero-content .hero-button .video-btn::before {
  4913. position: absolute;
  4914. top: 50%;
  4915. left: 50%;
  4916. right: 0;
  4917. bottom: 0;
  4918. width: 60px;
  4919. height: 60px;
  4920. border-radius: 50%;
  4921. border: 1px solid var(--theme);
  4922. content: "";
  4923. transform: translate(-50%, -50%);
  4924. }
  4925. .hero-2 .hero-content .hero-button .button-text span {
  4926. font-size: 16px;
  4927. color: var(--header);
  4928. font-weight: bold;
  4929. }
  4930. .hero-2 .hero-image {
  4931. max-width: 594px;
  4932. position: relative;
  4933. z-index: 9;
  4934. margin-left: 100px;
  4935. }
  4936. @media (max-width: 1199px) {
  4937. .hero-2 .hero-image {
  4938. margin-left: 50px;
  4939. }
  4940. }
  4941. @media (max-width: 991px) {
  4942. .hero-2 .hero-image {
  4943. margin-left: 0;
  4944. max-width: 750px;
  4945. }
  4946. }
  4947. .hero-2 .hero-image img {
  4948. width: 100%;
  4949. height: 100%;
  4950. }
  4951. .hero-2 .hero-image::before {
  4952. position: absolute;
  4953. top: 10px;
  4954. left: -25px;
  4955. content: "";
  4956. background: linear-gradient(0deg, #FFA41B, #FFA41B);
  4957. width: 550px;
  4958. height: 540px;
  4959. border-radius: 50%;
  4960. z-index: -1;
  4961. }
  4962. @media (max-width: 1399px) {
  4963. .hero-2 .hero-image::before {
  4964. top: 5px;
  4965. left: -15px;
  4966. width: 480px;
  4967. height: 460px;
  4968. }
  4969. }
  4970. @media (max-width: 1199px) {
  4971. .hero-2 .hero-image::before {
  4972. top: 5px;
  4973. left: -15px;
  4974. width: 440px;
  4975. height: 420px;
  4976. }
  4977. }
  4978. @media (max-width: 991px) {
  4979. .hero-2 .hero-image::before {
  4980. display: none;
  4981. }
  4982. }
  4983. .hero-3 {
  4984. position: relative;
  4985. }
  4986. .hero-3 .swiper-dot {
  4987. position: absolute;
  4988. top: 42%;
  4989. left: 2%;
  4990. z-index: 99;
  4991. transform: translateY(-50%);
  4992. transform: rotate(90deg);
  4993. }
  4994. .hero-3 .swiper-dot::before {
  4995. position: absolute;
  4996. top: 58px;
  4997. left: -105px;
  4998. width: 85px;
  4999. height: 2px;
  5000. background: linear-gradient(90deg, #F39F5F 4.85%, rgba(255, 255, 255, 0) 96.39%);
  5001. content: "";
  5002. }
  5003. .hero-3 .swiper-dot::after {
  5004. position: absolute;
  5005. bottom: 13px;
  5006. right: -105px;
  5007. width: 85px;
  5008. height: 2px;
  5009. background: linear-gradient(90deg, #F39F5F 4.85%, rgba(255, 255, 255, 0) 96.39%);
  5010. content: "";
  5011. }
  5012. @media (max-width: 1399px) {
  5013. .hero-3 .swiper-dot {
  5014. display: none;
  5015. }
  5016. }
  5017. .hero-3 .slider-image .parasuit-shape {
  5018. position: absolute;
  5019. top: 15%;
  5020. left: 5%;
  5021. }
  5022. @media (max-width: 767px) {
  5023. .hero-3 .slider-image .parasuit-shape {
  5024. display: none;
  5025. }
  5026. }
  5027. .hero-3 .slider-image .doll-shape {
  5028. position: absolute;
  5029. top: 10%;
  5030. left: 41%;
  5031. }
  5032. @media (max-width: 991px) {
  5033. .hero-3 .slider-image .doll-shape {
  5034. display: none;
  5035. }
  5036. }
  5037. .hero-3 .slider-image .bus-shape {
  5038. position: absolute;
  5039. bottom: 10%;
  5040. left: 10%;
  5041. }
  5042. @media (max-width: 991px) {
  5043. .hero-3 .slider-image .bus-shape {
  5044. display: none;
  5045. }
  5046. }
  5047. .hero-3 .slider-image .bee-shape {
  5048. position: absolute;
  5049. bottom: 10%;
  5050. left: 43%;
  5051. }
  5052. @media (max-width: 991px) {
  5053. .hero-3 .slider-image .bee-shape {
  5054. display: none;
  5055. }
  5056. }
  5057. .hero-3 .slider-image .star-shape {
  5058. position: absolute;
  5059. top: 20%;
  5060. left: 35%;
  5061. transform: translateX(-50%);
  5062. }
  5063. @media (max-width: 991px) {
  5064. .hero-3 .slider-image .star-shape {
  5065. display: none;
  5066. }
  5067. }
  5068. .hero-3 .hero-content {
  5069. position: relative;
  5070. z-index: 9;
  5071. padding-bottom: 270px;
  5072. padding-top: 200px;
  5073. }
  5074. @media (max-width: 1399px) {
  5075. .hero-3 .hero-content {
  5076. padding: 180px 0;
  5077. }
  5078. }
  5079. @media (max-width: 1199px) {
  5080. .hero-3 .hero-content {
  5081. padding: 160px 0;
  5082. }
  5083. }
  5084. @media (max-width: 991px) {
  5085. .hero-3 .hero-content {
  5086. padding: 130px 0;
  5087. }
  5088. }
  5089. @media (max-width: 767px) {
  5090. .hero-3 .hero-content {
  5091. padding: 110px 0;
  5092. }
  5093. }
  5094. @media (max-width: 575px) {
  5095. .hero-3 .hero-content {
  5096. text-align: center;
  5097. margin: 0 auto;
  5098. padding: 80px 0;
  5099. }
  5100. }
  5101. .hero-3 .hero-content h5 {
  5102. margin-bottom: 20px;
  5103. position: relative;
  5104. font-family: Pangolin;
  5105. font-weight: 500;
  5106. color: var(--theme);
  5107. }
  5108. @media (max-width: 767px) {
  5109. .hero-3 .hero-content h5 {
  5110. font-size: 18px;
  5111. }
  5112. }
  5113. @media (max-width: 575px) {
  5114. .hero-3 .hero-content h5 {
  5115. font-size: 16px;
  5116. }
  5117. }
  5118. .hero-3 .hero-content h1 {
  5119. margin-bottom: 20px;
  5120. }
  5121. .hero-3 .hero-content h1 span {
  5122. color: var(--theme);
  5123. }
  5124. @media (max-width: 1399px) {
  5125. .hero-3 .hero-content h1 {
  5126. font-size: 70px;
  5127. }
  5128. }
  5129. @media (max-width: 1199px) {
  5130. .hero-3 .hero-content h1 {
  5131. font-size: 62px;
  5132. }
  5133. }
  5134. @media (max-width: 991px) {
  5135. .hero-3 .hero-content h1 {
  5136. font-size: 52px;
  5137. }
  5138. }
  5139. @media (max-width: 767px) {
  5140. .hero-3 .hero-content h1 {
  5141. font-size: 42px;
  5142. }
  5143. }
  5144. @media (max-width: 575px) {
  5145. .hero-3 .hero-content h1 {
  5146. font-size: 34px;
  5147. }
  5148. }
  5149. .hero-3 .hero-content p {
  5150. font-size: 20px;
  5151. }
  5152. .hero-3 .hero-content .hero-button {
  5153. display: flex;
  5154. align-items: center;
  5155. gap: 20px;
  5156. margin-top: 50px;
  5157. }
  5158. @media (max-width: 767px) {
  5159. .hero-3 .hero-content .hero-button {
  5160. margin-top: 30px;
  5161. }
  5162. }
  5163. @media (max-width: 575px) {
  5164. .hero-3 .hero-content .hero-button {
  5165. flex-wrap: wrap;
  5166. margin-top: 20px;
  5167. justify-content: center;
  5168. }
  5169. }
  5170. .hero-4 {
  5171. padding: 120px 0 30px;
  5172. position: relative;
  5173. background-color: var(--bg);
  5174. }
  5175. .hero-4 .doll-shape {
  5176. position: absolute;
  5177. left: 10%;
  5178. top: 15%;
  5179. }
  5180. @media (max-width: 991px) {
  5181. .hero-4 .doll-shape {
  5182. display: none;
  5183. }
  5184. }
  5185. .hero-4 .line-shape {
  5186. position: absolute;
  5187. left: -5%;
  5188. bottom: 0;
  5189. }
  5190. @media (max-width: 1199px) {
  5191. .hero-4 .line-shape {
  5192. display: none;
  5193. }
  5194. }
  5195. .hero-4 .bee-shape {
  5196. position: absolute;
  5197. left: 25%;
  5198. bottom: 5%;
  5199. }
  5200. .hero-4 .line-2 {
  5201. position: absolute;
  5202. bottom: 10%;
  5203. left: 40%;
  5204. animation: rounded 5s linear infinite;
  5205. }
  5206. @media (max-width: 1199px) {
  5207. .hero-4 .line-2 {
  5208. display: none;
  5209. }
  5210. }
  5211. .hero-4 .star-shape {
  5212. position: absolute;
  5213. top: 20%;
  5214. left: 35%;
  5215. }
  5216. @media (max-width: 991px) {
  5217. .hero-4 .star-shape {
  5218. display: none;
  5219. }
  5220. }
  5221. .hero-4 .frame-shape {
  5222. position: absolute;
  5223. top: 30%;
  5224. right: 3%;
  5225. animation: rounded 5s linear infinite;
  5226. }
  5227. @media (max-width: 1199px) {
  5228. .hero-4 .frame-shape {
  5229. display: none;
  5230. }
  5231. }
  5232. .hero-4 .hero-content {
  5233. position: relative;
  5234. z-index: 9;
  5235. }
  5236. @media (max-width: 575px) {
  5237. .hero-4 .hero-content {
  5238. text-align: center;
  5239. margin: 0 auto;
  5240. }
  5241. }
  5242. .hero-4 .hero-content h5 {
  5243. margin-bottom: 15px;
  5244. color: var(--theme);
  5245. font-family: "Pangolin";
  5246. font-weight: 500;
  5247. position: relative;
  5248. display: inline-block;
  5249. }
  5250. .hero-4 .hero-content h1 {
  5251. margin-bottom: 20px;
  5252. }
  5253. .hero-4 .hero-content h1 span {
  5254. color: var(--theme);
  5255. }
  5256. @media (max-width: 1399px) {
  5257. .hero-4 .hero-content h1 {
  5258. font-size: 60px;
  5259. }
  5260. }
  5261. @media (max-width: 1199px) {
  5262. .hero-4 .hero-content h1 {
  5263. font-size: 56px;
  5264. }
  5265. }
  5266. @media (max-width: 767px) {
  5267. .hero-4 .hero-content h1 {
  5268. font-size: 42px;
  5269. }
  5270. }
  5271. @media (max-width: 575px) {
  5272. .hero-4 .hero-content h1 {
  5273. font-size: 34px;
  5274. }
  5275. }
  5276. .hero-4 .hero-content p {
  5277. font-size: 20px;
  5278. }
  5279. @media (max-width: 767px) {
  5280. .hero-4 .hero-content p {
  5281. font-size: 18px;
  5282. }
  5283. }
  5284. @media (max-width: 575px) {
  5285. .hero-4 .hero-content p {
  5286. font-size: 16px;
  5287. }
  5288. }
  5289. .hero-4 .hero-content .hero-button {
  5290. display: flex;
  5291. align-items: center;
  5292. gap: 30px;
  5293. margin-top: 50px;
  5294. }
  5295. @media (max-width: 767px) {
  5296. .hero-4 .hero-content .hero-button {
  5297. margin-top: 40px;
  5298. }
  5299. }
  5300. @media (max-width: 575px) {
  5301. .hero-4 .hero-content .hero-button {
  5302. margin-top: 25px;
  5303. justify-content: center;
  5304. flex-wrap: wrap;
  5305. gap: 20px;
  5306. }
  5307. }
  5308. .hero-4 .hero-content .hero-button .video-btn {
  5309. background-color: var(--theme);
  5310. color: var(--white);
  5311. display: inline-block;
  5312. font-size: 16px;
  5313. height: 50px;
  5314. width: 50px;
  5315. line-height: 50px;
  5316. border-radius: 50%;
  5317. text-align: center;
  5318. position: relative;
  5319. }
  5320. .hero-4 .hero-content .hero-button .video-btn::before {
  5321. position: absolute;
  5322. top: 50%;
  5323. left: 50%;
  5324. right: 0;
  5325. bottom: 0;
  5326. width: 60px;
  5327. height: 60px;
  5328. border-radius: 50%;
  5329. border: 1px solid var(--theme);
  5330. content: "";
  5331. transform: translate(-50%, -50%);
  5332. }
  5333. .hero-4 .hero-content .hero-button .button-text span {
  5334. font-size: 16px;
  5335. color: var(--header);
  5336. font-weight: bold;
  5337. }
  5338. .hero-4 .hero-image-area {
  5339. position: relative;
  5340. }
  5341. .hero-4 .hero-image-area .hero-image {
  5342. max-width: 555px;
  5343. position: relative;
  5344. z-index: 1;
  5345. margin-bottom: -30px;
  5346. }
  5347. .hero-4 .hero-image-area .hero-image img {
  5348. width: 100%;
  5349. height: 100%;
  5350. }
  5351. .hero-4 .hero-image-area .hero-bg {
  5352. position: absolute;
  5353. bottom: 0;
  5354. left: 0;
  5355. }
  5356. @media (max-width: 1199px) {
  5357. .hero-4 .hero-image-area .hero-bg {
  5358. display: none;
  5359. }
  5360. }
  5361. .marquee-wrapper {
  5362. position: relative;
  5363. overflow: hidden;
  5364. white-space: nowrap;
  5365. z-index: 9;
  5366. margin-top: -15px;
  5367. margin-bottom: -30px;
  5368. }
  5369. .text-slider {
  5370. font-size: 60px;
  5371. height: 100px;
  5372. line-height: 90px;
  5373. font-weight: 700;
  5374. text-transform: capitalize;
  5375. color: var(--theme);
  5376. }
  5377. .text-slider:not(:last-child) {
  5378. margin-right: 30px;
  5379. }
  5380. @media (max-width: 767px) {
  5381. .text-slider {
  5382. font-size: 36px;
  5383. }
  5384. }
  5385. .text-slider img {
  5386. margin-bottom: 10px;
  5387. }
  5388. .text-slider.text-color {
  5389. color: var(--header);
  5390. }
  5391. .text-slider.text-color-2 {
  5392. color: var(--header);
  5393. font-size: 50px;
  5394. }
  5395. .marquee-inner {
  5396. position: absolute;
  5397. display: inline-flex;
  5398. width: 200%;
  5399. }
  5400. .marquee-list {
  5401. float: left;
  5402. width: 50%;
  5403. }
  5404. .marquee-item {
  5405. float: left;
  5406. transition: animation 0.2s ease-out;
  5407. }
  5408. .marquee-inner.to-left {
  5409. animation: marqueeLeft 25s linear infinite;
  5410. }
  5411. @keyframes marqueeLeft {
  5412. 0% {
  5413. left: 0;
  5414. }
  5415. 100% {
  5416. left: -100%;
  5417. }
  5418. }
  5419. .marquee-inner.to-right {
  5420. animation: marqueeRight 25s linear infinite;
  5421. }
  5422. @keyframes marqueeRight {
  5423. 0% {
  5424. right: 0;
  5425. }
  5426. 100% {
  5427. right: -100%;
  5428. }
  5429. }
  5430. .marque-section-2 {
  5431. position: relative;
  5432. }
  5433. @media (max-width: 1199px) {
  5434. .marque-section-2 {
  5435. margin-bottom: -20px;
  5436. }
  5437. }
  5438. @media (max-width: 991px) {
  5439. .marque-section-2 {
  5440. margin-bottom: -40px;
  5441. }
  5442. }
  5443. .mean-container a.meanmenu-reveal {
  5444. display: none;
  5445. }
  5446. .mean-container .mean-nav {
  5447. background: none;
  5448. margin-top: 0;
  5449. }
  5450. .mean-container .mean-bar {
  5451. padding: 0;
  5452. min-height: auto;
  5453. background: none;
  5454. }
  5455. .mean-container .mean-nav > ul {
  5456. padding: 0;
  5457. margin: 0;
  5458. width: 100%;
  5459. list-style-type: none;
  5460. display: block !important;
  5461. }
  5462. .mean-container .mean-nav > ul .homemenu-items {
  5463. display: flex;
  5464. align-items: center;
  5465. gap: 30px;
  5466. justify-content: space-between;
  5467. }
  5468. @media (max-width: 1199px) {
  5469. .mean-container .mean-nav > ul .homemenu-items {
  5470. flex-wrap: wrap;
  5471. }
  5472. }
  5473. .mean-container .mean-nav > ul .homemenu-items .homemenu {
  5474. position: relative;
  5475. }
  5476. @media (max-width: 1199px) {
  5477. .mean-container .mean-nav > ul .homemenu-items .homemenu {
  5478. max-width: 300px;
  5479. text-align: center;
  5480. margin: 0 auto;
  5481. border: 1px solid var(--border);
  5482. padding: 10px;
  5483. }
  5484. }
  5485. .mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-thumb {
  5486. position: relative;
  5487. }
  5488. .mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-thumb .demo-button {
  5489. position: absolute;
  5490. top: 50%;
  5491. left: 50%;
  5492. transform: translate(-50%, -50%);
  5493. width: 60%;
  5494. gap: 10px;
  5495. display: flex;
  5496. justify-content: center;
  5497. flex-direction: column;
  5498. opacity: 0;
  5499. visibility: hidden;
  5500. transition: all 0.4s ease-in-out;
  5501. margin-top: 20px;
  5502. }
  5503. .mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-thumb .demo-button .theme-btn {
  5504. padding: 12px 20px;
  5505. color: var(--white) !important;
  5506. width: initial;
  5507. font-size: 16px;
  5508. text-align: center;
  5509. border-radius: 0;
  5510. }
  5511. .mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-thumb .demo-button .theme-btn:hover {
  5512. color: var(--white) !important;
  5513. }
  5514. .mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-thumb::before {
  5515. background: -webkit-gradient(linear, left top, left bottom, from(rgba(20, 19, 19, 0)), to(#5e5ef6));
  5516. background: linear-gradient(to bottom, rgba(99, 92, 92, 0) 0%, #252527 100%);
  5517. background-repeat: no-repeat;
  5518. background-size: cover;
  5519. background-position: center;
  5520. width: 100%;
  5521. height: 100%;
  5522. position: absolute;
  5523. left: 0;
  5524. top: 0;
  5525. overflow: hidden;
  5526. opacity: 0;
  5527. -webkit-transition: all 0.3s ease-in-out;
  5528. transition: all 0.3s ease-in-out;
  5529. content: "";
  5530. }
  5531. .mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-thumb:hover::before {
  5532. visibility: visible;
  5533. opacity: 1;
  5534. }
  5535. .mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-thumb:hover .demo-button {
  5536. opacity: 1;
  5537. visibility: visible;
  5538. margin-top: 0;
  5539. }
  5540. .mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-thumb:hover .homemenu-btn {
  5541. opacity: 1;
  5542. visibility: visible;
  5543. bottom: 50%;
  5544. transform: translateY(50%);
  5545. }
  5546. .mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-thumb img {
  5547. width: 100%;
  5548. }
  5549. .mean-container .mean-nav > ul .homemenu-items .homemenu .homemenu-title {
  5550. text-align: center;
  5551. margin: 15px auto;
  5552. display: inline-block;
  5553. font-size: 16px;
  5554. }
  5555. .mean-container a.meanmenu-reveal {
  5556. display: none !important;
  5557. }
  5558. .mean-container .mean-nav ul li a {
  5559. width: 100%;
  5560. padding: 10px 0;
  5561. color: var(--header);
  5562. font-size: 16px;
  5563. line-height: 1.5;
  5564. font-weight: 500;
  5565. text-transform: capitalize;
  5566. border-bottom: 1px solid var(--border) !important;
  5567. border: none;
  5568. }
  5569. .mean-container .mean-nav ul li a:hover {
  5570. color: var(--theme);
  5571. }
  5572. .mean-container .mean-nav ul li a:last-child {
  5573. border-bottom: 0;
  5574. }
  5575. .mean-container .mean-nav ul li a:hover {
  5576. color: var(--theme2);
  5577. }
  5578. .mean-container .mean-nav ul li a.mean-expand {
  5579. margin-top: 5px;
  5580. padding: 0 !important;
  5581. }
  5582. .mean-container .mean-nav ul li > a > i {
  5583. display: none;
  5584. }
  5585. .mean-container .mean-nav ul li > a.mean-expand i {
  5586. display: inline-block;
  5587. font-size: 18px;
  5588. }
  5589. .mean-container .mean-nav > ul > li:first-child > a {
  5590. border-top: 0;
  5591. }
  5592. .mean-container .mean-nav ul li a.mean-expand.mean-clicked i {
  5593. transform: rotate(45deg);
  5594. -webkit-transform: rotate(45deg);
  5595. -moz-transform: rotate(45deg);
  5596. -ms-transform: rotate(45deg);
  5597. -o-transform: rotate(45deg);
  5598. transition: all 0.4s ease-in-out;
  5599. }
  5600. .mean-container .mean-nav ul li .mega-menu li a {
  5601. height: 200px;
  5602. width: 100%;
  5603. padding: 0;
  5604. border-top: 0;
  5605. margin-bottom: 20px;
  5606. }
  5607. .news-wrapper {
  5608. margin-top: 30px;
  5609. }
  5610. .news-wrapper .news-single-items {
  5611. border: 1px solid var(--border);
  5612. border-radius: 8px;
  5613. }
  5614. @media (max-width: 1399px) {
  5615. .news-wrapper .news-single-items br {
  5616. display: none;
  5617. }
  5618. }
  5619. .news-wrapper .news-single-items .news-image {
  5620. padding: 20px 20px 0 20px;
  5621. }
  5622. .news-wrapper .news-single-items .news-image img {
  5623. width: 100%;
  5624. height: 100%;
  5625. }
  5626. .news-wrapper .news-single-items .news-content {
  5627. padding: 20px 30px;
  5628. }
  5629. .news-wrapper .news-single-items .news-content ul {
  5630. display: flex;
  5631. align-items: center;
  5632. gap: 25px;
  5633. margin-bottom: 15px;
  5634. }
  5635. .news-wrapper .news-single-items .news-content h3 {
  5636. margin-bottom: 10px;
  5637. }
  5638. .news-wrapper .news-single-items .news-content h3 a:hover {
  5639. color: var(--theme);
  5640. }
  5641. .news-wrapper .news-single-items .news-content .post-author-items {
  5642. margin-top: 20px;
  5643. display: flex;
  5644. align-items: center;
  5645. justify-content: space-between;
  5646. }
  5647. @media (max-width: 575px) {
  5648. .news-wrapper .news-single-items .news-content .post-author-items {
  5649. gap: 20px;
  5650. flex-wrap: wrap;
  5651. }
  5652. }
  5653. .news-wrapper .news-single-items .news-content .post-author-items .post-items {
  5654. display: flex;
  5655. align-items: center;
  5656. gap: 16px;
  5657. }
  5658. .news-wrapper .news-single-items .news-content .post-author-items .post-items .content span {
  5659. font-weight: 600;
  5660. color: var(--theme);
  5661. }
  5662. .news-wrapper .news-single-items .news-content .post-author-items .post-items .content h6 {
  5663. margin-top: 3px;
  5664. }
  5665. .news-wrapper .news-single-items .news-content .post-author-items .theme-btn {
  5666. padding: 20px 30px;
  5667. }
  5668. .news-wrapper .news-right-items {
  5669. padding: 20px;
  5670. border-radius: 8px;
  5671. border: 1px solid var(--border);
  5672. display: flex;
  5673. align-items: center;
  5674. gap: 30px;
  5675. }
  5676. @media (max-width: 767px) {
  5677. .news-wrapper .news-right-items {
  5678. flex-wrap: wrap;
  5679. }
  5680. }
  5681. .news-wrapper .news-right-items:not(:last-child) {
  5682. margin-bottom: 30px;
  5683. }
  5684. @media (max-width: 575px) {
  5685. .news-wrapper .news-right-items:not(:last-child) {
  5686. margin-bottom: 20px;
  5687. }
  5688. }
  5689. .news-wrapper .news-right-items .news-content ul {
  5690. display: flex;
  5691. align-items: center;
  5692. gap: 25px;
  5693. margin-bottom: 10px;
  5694. }
  5695. .news-wrapper .news-right-items .news-content h3 a:hover {
  5696. color: var(--theme);
  5697. }
  5698. .news-wrapper .news-right-items .news-content .post-items {
  5699. display: flex;
  5700. align-items: center;
  5701. gap: 16px;
  5702. margin-top: 30px;
  5703. }
  5704. @media (max-width: 575px) {
  5705. .news-wrapper .news-right-items .news-content .post-items {
  5706. margin-top: 20px;
  5707. }
  5708. }
  5709. .news-wrapper .news-right-items .news-content .post-items .content span {
  5710. font-weight: 600;
  5711. color: var(--theme);
  5712. }
  5713. .news-wrapper .news-right-items .news-content .post-items .content h6 {
  5714. margin-top: 3px;
  5715. }
  5716. .news-wrapper .news-right-items.style-2 {
  5717. margin-top: 30px;
  5718. position: relative;
  5719. z-index: 9;
  5720. }
  5721. .news-card-items {
  5722. margin-top: 30px;
  5723. background-color: var(--white);
  5724. box-shadow: var(--box-shadow);
  5725. border-radius: 16px;
  5726. padding: 20px;
  5727. }
  5728. .news-card-items .news-image {
  5729. position: relative;
  5730. z-index: 2;
  5731. overflow: hidden;
  5732. width: 100%;
  5733. }
  5734. .news-card-items .news-image .post {
  5735. position: absolute;
  5736. top: 20px;
  5737. left: 20px;
  5738. background-color: var(--theme);
  5739. color: var(--white);
  5740. padding: 4px 15px;
  5741. border-radius: 8px;
  5742. }
  5743. .news-card-items .news-image img {
  5744. width: 100%;
  5745. height: 100%;
  5746. display: block;
  5747. }
  5748. .news-card-items .news-image .news-layer-wrapper {
  5749. position: absolute;
  5750. top: 100%;
  5751. left: 0;
  5752. width: 100%;
  5753. height: 100%;
  5754. display: flex;
  5755. transition: 0.5s;
  5756. }
  5757. .news-card-items .news-image .news-layer-wrapper .news-layer-image {
  5758. width: 25%;
  5759. height: 100%;
  5760. transition: 0.5s;
  5761. background-size: cover;
  5762. }
  5763. .news-card-items .news-image .news-layer-wrapper .news-layer-image:nth-child(1) {
  5764. background-position: 0;
  5765. transition-delay: 0;
  5766. }
  5767. .news-card-items .news-image .news-layer-wrapper .news-layer-image:nth-child(2) {
  5768. background-position: 33.33%;
  5769. transition-delay: 0.1s;
  5770. }
  5771. .news-card-items .news-image .news-layer-wrapper .news-layer-image:nth-child(3) {
  5772. background-position: 66.66%;
  5773. transition-delay: 0.2s;
  5774. }
  5775. .news-card-items .news-image .news-layer-wrapper .news-layer-image:nth-child(4) {
  5776. background-position: 100%;
  5777. transition-delay: 0.3s;
  5778. }
  5779. .news-card-items .news-content {
  5780. padding: 25px 10px 10px;
  5781. }
  5782. .news-card-items .news-content ul {
  5783. display: flex;
  5784. align-items: center;
  5785. gap: 30px;
  5786. margin-bottom: 15px;
  5787. }
  5788. .news-card-items .news-content ul li i {
  5789. color: var(--theme);
  5790. margin-right: 5px;
  5791. }
  5792. .news-card-items .news-content h3 {
  5793. margin-bottom: 10px;
  5794. }
  5795. .news-card-items .news-content h3 a:hover {
  5796. color: var(--theme);
  5797. }
  5798. .news-card-items:hover .news-image .news-layer-wrapper .news-layer-image {
  5799. transform: translateY(-100%);
  5800. }
  5801. .news-section-2 {
  5802. position: relative;
  5803. z-index: 9;
  5804. }
  5805. .news-section-2::before {
  5806. position: absolute;
  5807. top: 0;
  5808. left: 0;
  5809. right: 0;
  5810. bottom: 0;
  5811. width: 100%;
  5812. height: 100%;
  5813. content: "";
  5814. z-index: -1;
  5815. height: 50%;
  5816. background-image: url(../image/cta-bg.jpg);
  5817. background-size: cover;
  5818. background-repeat: no-repeat;
  5819. }
  5820. @media (max-width: 1199px) {
  5821. .news-section-2::before {
  5822. background-size: initial;
  5823. }
  5824. }
  5825. .news-section-2 .shape-1 {
  5826. position: absolute;
  5827. top: 20%;
  5828. left: 5%;
  5829. }
  5830. .news-section {
  5831. position: relative;
  5832. }
  5833. .news-section .plane-shape {
  5834. position: absolute;
  5835. bottom: 10%;
  5836. left: 2%;
  5837. }
  5838. @media (max-width: 1199px) {
  5839. .news-section .plane-shape {
  5840. display: none;
  5841. }
  5842. }
  5843. @media (max-width: 767px) {
  5844. .news-section .section-title-area {
  5845. text-align: center;
  5846. justify-content: center;
  5847. }
  5848. }
  5849. .news-standard-wrapper .news-standard-items {
  5850. border: 1px solid var(--border);
  5851. padding: 30px;
  5852. border-radius: 10px;
  5853. }
  5854. .news-standard-wrapper .news-standard-items:not(:last-child) {
  5855. margin-bottom: 20px;
  5856. }
  5857. .news-standard-wrapper .news-standard-items .news-thumb {
  5858. position: relative;
  5859. }
  5860. .news-standard-wrapper .news-standard-items .news-thumb img {
  5861. width: 100%;
  5862. height: 100%;
  5863. }
  5864. .news-standard-wrapper .news-standard-items .news-thumb .post {
  5865. position: absolute;
  5866. top: 20px;
  5867. left: 20px;
  5868. background-color: var(--theme);
  5869. color: var(--white);
  5870. padding: 4px 15px;
  5871. border-radius: 8px;
  5872. }
  5873. .news-standard-wrapper .news-standard-items .news-content {
  5874. margin-top: 20px;
  5875. position: relative;
  5876. z-index: 9;
  5877. }
  5878. .news-standard-wrapper .news-standard-items .news-content ul {
  5879. display: flex;
  5880. align-items: center;
  5881. gap: 30px;
  5882. margin-bottom: 15px;
  5883. }
  5884. @media (max-width: 1199px) {
  5885. .news-standard-wrapper .news-standard-items .news-content ul {
  5886. gap: 20px;
  5887. }
  5888. }
  5889. .news-standard-wrapper .news-standard-items .news-content ul li {
  5890. font-size: 16px;
  5891. font-weight: 500;
  5892. }
  5893. .news-standard-wrapper .news-standard-items .news-content ul li i {
  5894. color: var(--theme);
  5895. margin-right: 5px;
  5896. }
  5897. .news-standard-wrapper .news-standard-items .news-content h3 {
  5898. font-weight: bold;
  5899. margin-bottom: 15px;
  5900. font-size: 30px;
  5901. }
  5902. .news-standard-wrapper .news-standard-items .news-content h3 a:hover {
  5903. color: var(--theme);
  5904. }
  5905. .main-sidebar .single-sidebar-widget {
  5906. padding: 40px 30px;
  5907. background-color: var(--bg);
  5908. margin-bottom: 30px;
  5909. border-radius: 10px;
  5910. }
  5911. .main-sidebar .single-sidebar-widget .wid-title {
  5912. margin-bottom: 25px;
  5913. }
  5914. .main-sidebar .single-sidebar-widget .wid-title h3 {
  5915. position: relative;
  5916. padding-bottom: 15px;
  5917. border-bottom: 2px solid transparent;
  5918. border-image: linear-gradient(90deg, #F39F5F 4.85%, rgba(201, 203, 223, 0) 96.39%);
  5919. border-bottom: 2px solid transparent;
  5920. border-image-slice: 2;
  5921. display: inline-block;
  5922. }
  5923. .main-sidebar .single-sidebar-widget .search-widget form {
  5924. width: 100%;
  5925. position: relative;
  5926. }
  5927. .main-sidebar .single-sidebar-widget .search-widget form input {
  5928. background-color: var(--white);
  5929. font-size: 16px;
  5930. padding: 20px;
  5931. width: 100%;
  5932. border: none;
  5933. color: var(--text);
  5934. border: 1px solid var(--border);
  5935. border-radius: 4px;
  5936. }
  5937. .main-sidebar .single-sidebar-widget .search-widget form button {
  5938. position: absolute;
  5939. right: 0;
  5940. top: 0;
  5941. width: 70px;
  5942. font-size: 18px;
  5943. height: 100%;
  5944. background-color: var(--theme);
  5945. color: var(--white);
  5946. text-align: center;
  5947. transition: all 0.3s ease-in-out;
  5948. border-radius: 0 4px 4px 0;
  5949. }
  5950. .main-sidebar .single-sidebar-widget .search-widget form button:hover {
  5951. background-color: var(--header);
  5952. }
  5953. .main-sidebar .single-sidebar-widget .news-widget-categories ul li {
  5954. display: flex;
  5955. align-items: center;
  5956. justify-content: space-between;
  5957. padding: 20px;
  5958. background-color: transparent;
  5959. font-weight: 500;
  5960. transition: all 0.4s ease-in-out;
  5961. border: 1px solid #E1DBD2;
  5962. border-radius: 4px;
  5963. font-size: 18px;
  5964. }
  5965. .main-sidebar .single-sidebar-widget .news-widget-categories ul li a {
  5966. color: var(--header);
  5967. }
  5968. .main-sidebar .single-sidebar-widget .news-widget-categories ul li span {
  5969. transition: all 0.4s ease-in-out;
  5970. color: var(--header);
  5971. }
  5972. .main-sidebar .single-sidebar-widget .news-widget-categories ul li:not(:last-child) {
  5973. margin-bottom: 12px;
  5974. }
  5975. .main-sidebar .single-sidebar-widget .news-widget-categories ul li:hover a {
  5976. color: var(--theme);
  5977. }
  5978. .main-sidebar .single-sidebar-widget .news-widget-categories ul li:hover span {
  5979. color: var(--theme);
  5980. }
  5981. .main-sidebar .single-sidebar-widget .news-widget-categories ul li.active a {
  5982. color: var(--theme);
  5983. }
  5984. .main-sidebar .single-sidebar-widget .news-widget-categories ul li.active span {
  5985. color: var(--theme);
  5986. }
  5987. .main-sidebar .single-sidebar-widget .recent-post-area .recent-items {
  5988. display: flex;
  5989. align-items: center;
  5990. gap: 20px;
  5991. }
  5992. .main-sidebar .single-sidebar-widget .recent-post-area .recent-items:not(:last-child) {
  5993. margin-bottom: 20px;
  5994. }
  5995. .main-sidebar .single-sidebar-widget .recent-post-area .recent-items .recent-content ul {
  5996. margin-bottom: 8px;
  5997. }
  5998. .main-sidebar .single-sidebar-widget .recent-post-area .recent-items .recent-content ul li i {
  5999. color: var(--theme);
  6000. margin-right: 5px;
  6001. }
  6002. .main-sidebar .single-sidebar-widget .recent-post-area .recent-items .recent-content h6 {
  6003. font-weight: 700;
  6004. }
  6005. .main-sidebar .single-sidebar-widget .recent-post-area .recent-items .recent-content h6 a:hover {
  6006. color: var(--theme);
  6007. }
  6008. .main-sidebar .single-sidebar-widget .tagcloud a {
  6009. display: inline-block;
  6010. padding: 11px 20px;
  6011. line-height: 1;
  6012. font-size: 16px;
  6013. font-weight: 500;
  6014. background: var(--white);
  6015. margin-right: 5px;
  6016. text-transform: capitalize;
  6017. margin-bottom: 10px;
  6018. border-radius: 4px;
  6019. border: 1px solid var(--border);
  6020. transition: all 0.4s ease-in-out;
  6021. }
  6022. .main-sidebar .single-sidebar-widget .tagcloud a:last-child {
  6023. margin-right: 0;
  6024. }
  6025. .main-sidebar .single-sidebar-widget .tagcloud a:hover {
  6026. background-color: var(--theme);
  6027. color: var(--white);
  6028. }
  6029. .news-details-area .blog-post-details .single-blog-post .post-featured-thumb {
  6030. height: 460px;
  6031. border-radius: 10px;
  6032. }
  6033. @media (max-width: 767px) {
  6034. .news-details-area .blog-post-details .single-blog-post .post-featured-thumb {
  6035. height: 400px;
  6036. }
  6037. }
  6038. .news-details-area .blog-post-details .single-blog-post .post-content {
  6039. margin-top: 30px;
  6040. }
  6041. .news-details-area .blog-post-details .single-blog-post .post-content .post-list {
  6042. gap: 30px;
  6043. margin-bottom: 20px;
  6044. border-bottom: 1px solid var(--border);
  6045. padding-bottom: 20px;
  6046. }
  6047. .news-details-area .blog-post-details .single-blog-post .post-content .post-list li {
  6048. font-size: 14px;
  6049. font-weight: 500;
  6050. }
  6051. .news-details-area .blog-post-details .single-blog-post .post-content .post-list li i {
  6052. color: var(--theme);
  6053. margin-right: 5px;
  6054. }
  6055. .news-details-area .blog-post-details .single-blog-post .post-content h3 {
  6056. margin-bottom: 20px;
  6057. font-size: 32px;
  6058. }
  6059. @media (max-width: 575px) {
  6060. .news-details-area .blog-post-details .single-blog-post .post-content h3 {
  6061. font-size: 24px;
  6062. }
  6063. }
  6064. .news-details-area .blog-post-details .single-blog-post .post-content h3 a:hover {
  6065. color: var(--theme);
  6066. }
  6067. .news-details-area .blog-post-details .single-blog-post .post-content .hilight-text {
  6068. border-left: 4px solid var(--theme);
  6069. padding: 40px;
  6070. background-color: var(--bg);
  6071. }
  6072. .news-details-area .blog-post-details .single-blog-post .post-content .hilight-text p {
  6073. font-weight: 600;
  6074. text-transform: capitalize;
  6075. font-style: italic;
  6076. line-height: 26px;
  6077. color: var(--header);
  6078. line-height: 162%;
  6079. }
  6080. .news-details-area .blog-post-details .single-blog-post .post-content .hilight-text svg {
  6081. float: right;
  6082. margin-top: -30px;
  6083. }
  6084. .news-details-area .blog-post-details .single-blog-post .post-content .details-image img {
  6085. width: 100%;
  6086. height: 100%;
  6087. }
  6088. .news-details-area .blog-post-details .tag-share-wrap {
  6089. border-top: 1px solid var(--border);
  6090. border-bottom: 1px solid var(--border);
  6091. padding: 30px 0;
  6092. }
  6093. .news-details-area .blog-post-details .tag-share-wrap .tagcloud a {
  6094. display: inline-block;
  6095. padding: 12px 26px;
  6096. line-height: 1;
  6097. background: transparent;
  6098. margin-right: 8px;
  6099. text-transform: capitalize;
  6100. font-weight: 500;
  6101. -webkit-transition: all 0.4s ease-in-out;
  6102. transition: all 0.4s ease-in-out;
  6103. border-radius: 4px;
  6104. border: 1px solid var(--border);
  6105. }
  6106. @media (max-width: 575px) {
  6107. .news-details-area .blog-post-details .tag-share-wrap .tagcloud a {
  6108. margin-bottom: 5px;
  6109. }
  6110. }
  6111. .news-details-area .blog-post-details .tag-share-wrap .tagcloud a:hover {
  6112. background-color: var(--theme);
  6113. color: var(--white);
  6114. }
  6115. .news-details-area .blog-post-details .tag-share-wrap .social-share span {
  6116. font-size: 18px;
  6117. color: var(--header);
  6118. font-weight: 600;
  6119. }
  6120. .news-details-area .blog-post-details .tag-share-wrap .social-share a {
  6121. font-size: 18px;
  6122. color: var(--header);
  6123. }
  6124. .news-details-area .blog-post-details .tag-share-wrap .social-share a:not(:last-child) {
  6125. margin-right: 10px;
  6126. }
  6127. .news-details-area .blog-post-details .tag-share-wrap .social-share a:hover {
  6128. color: var(--theme);
  6129. }
  6130. .news-details-area .blog-post-details .comments-area {
  6131. margin-top: 40px;
  6132. }
  6133. .news-details-area .blog-post-details .comments-area .comments-heading {
  6134. margin-bottom: 30px;
  6135. }
  6136. @media (max-width: 575px) {
  6137. .news-details-area .blog-post-details .comments-area .comments-heading {
  6138. margin-bottom: 20px;
  6139. }
  6140. }
  6141. .news-details-area .blog-post-details .comments-area .comments-heading h3 {
  6142. font-size: 30px;
  6143. font-weight: 700;
  6144. }
  6145. @media (max-width: 575px) {
  6146. .news-details-area .blog-post-details .comments-area .comments-heading h3 {
  6147. font-size: 26px;
  6148. }
  6149. }
  6150. .news-details-area .blog-post-details .comments-area .blog-single-comment {
  6151. border-bottom: 1px solid var(--border);
  6152. }
  6153. @media (max-width: 575px) {
  6154. .news-details-area .blog-post-details .comments-area .blog-single-comment {
  6155. flex-wrap: wrap;
  6156. gap: 20px;
  6157. }
  6158. }
  6159. .news-details-area .blog-post-details .comments-area .blog-single-comment .content .head .con h5 {
  6160. margin-bottom: 10px;
  6161. font-weight: 600;
  6162. font-size: 20px;
  6163. }
  6164. .news-details-area .blog-post-details .comments-area .blog-single-comment .content .head .star i {
  6165. color: var(--theme);
  6166. font-size: 14px;
  6167. }
  6168. .news-details-area .blog-post-details .comments-area .blog-single-comment .content .reply {
  6169. border-radius: 4px;
  6170. padding: 5px 18px;
  6171. font-weight: 400;
  6172. background-color: var(--theme);
  6173. color: var(--white);
  6174. }
  6175. .news-details-area .blog-post-details .comment-form-wrap h3 {
  6176. font-size: 32px;
  6177. margin-bottom: 30px;
  6178. }
  6179. @media (max-width: 575px) {
  6180. .news-details-area .blog-post-details .comment-form-wrap h3 {
  6181. font-size: 28px;
  6182. margin-bottom: 20px;
  6183. }
  6184. }
  6185. .news-details-area .blog-post-details .comment-form-wrap .form-clt span {
  6186. color: var(--header);
  6187. display: inline-block;
  6188. margin-bottom: 10px;
  6189. }
  6190. .news-details-area .blog-post-details .comment-form-wrap .form-clt input, .news-details-area .blog-post-details .comment-form-wrap .form-clt textarea {
  6191. width: 100%;
  6192. outline: none;
  6193. border: none;
  6194. background-color: transparent;
  6195. border: 1px solid var(--border);
  6196. padding: 16px 20px;
  6197. font-weight: 500;
  6198. border-radius: 8px;
  6199. color: var(--text);
  6200. }
  6201. .news-details-area .blog-post-details .comment-form-wrap .form-clt input::placeholder, .news-details-area .blog-post-details .comment-form-wrap .form-clt textarea::placeholder {
  6202. color: var(--text);
  6203. }
  6204. .news-details-area .blog-post-details .comment-form-wrap .form-clt textarea {
  6205. padding-bottom: 100px;
  6206. }
  6207. .preloader {
  6208. align-items: center;
  6209. cursor: default;
  6210. display: flex;
  6211. height: 100%;
  6212. justify-content: center;
  6213. position: fixed;
  6214. left: 0;
  6215. top: 0;
  6216. width: 100%;
  6217. z-index: 9999999;
  6218. }
  6219. .preloader .animation-preloader {
  6220. z-index: 1000;
  6221. }
  6222. .preloader .animation-preloader .spinner {
  6223. animation: spinner 1s infinite linear;
  6224. border-radius: 50%;
  6225. border: 3px solid rgba(0, 0, 0, 0.2);
  6226. border-top-color: var(--theme);
  6227. height: 9em;
  6228. margin: 0 auto 3.5em auto;
  6229. width: 9em;
  6230. }
  6231. @media (max-width: 767px) {
  6232. .preloader .animation-preloader .spinner {
  6233. width: 7.5em;
  6234. height: 7.5em;
  6235. margin: 0 auto 1.5em auto;
  6236. }
  6237. }
  6238. .preloader .animation-preloader .txt-loading {
  6239. font: bold 5em "Quicksand", sans-serif, "Source Sans 3", sans-serif;
  6240. text-align: center;
  6241. user-select: none;
  6242. }
  6243. @media (max-width: 767px) {
  6244. .preloader .animation-preloader .txt-loading {
  6245. font-size: 2.5em;
  6246. }
  6247. }
  6248. .preloader .animation-preloader .txt-loading .letters-loading {
  6249. color: var(--theme);
  6250. position: relative;
  6251. }
  6252. .preloader .animation-preloader .txt-loading .letters-loading:nth-child(2):before {
  6253. animation-delay: 0.2s;
  6254. }
  6255. .preloader .animation-preloader .txt-loading .letters-loading:nth-child(3):before {
  6256. animation-delay: 0.4s;
  6257. }
  6258. .preloader .animation-preloader .txt-loading .letters-loading:nth-child(4):before {
  6259. animation-delay: 0.6s;
  6260. }
  6261. .preloader .animation-preloader .txt-loading .letters-loading:nth-child(5):before {
  6262. animation-delay: 0.8s;
  6263. }
  6264. .preloader .animation-preloader .txt-loading .letters-loading:nth-child(6):before {
  6265. animation-delay: 1s;
  6266. }
  6267. .preloader .animation-preloader .txt-loading .letters-loading:nth-child(7):before {
  6268. animation-delay: 1.2s;
  6269. }
  6270. .preloader .animation-preloader .txt-loading .letters-loading:nth-child(8):before {
  6271. animation-delay: 1.4s;
  6272. }
  6273. .preloader .animation-preloader .txt-loading .letters-loading::before {
  6274. animation: letters-loading 4s infinite;
  6275. color: var(--header);
  6276. content: attr(data-text-preloader);
  6277. left: 0;
  6278. opacity: 0;
  6279. font-family: "Quicksand", sans-serif;
  6280. position: absolute;
  6281. top: -3px;
  6282. transform: rotateY(-90deg);
  6283. }
  6284. .preloader p {
  6285. font-size: 15px;
  6286. font-weight: 600;
  6287. text-transform: uppercase;
  6288. letter-spacing: 8px;
  6289. color: var(--theme);
  6290. }
  6291. .preloader .loader {
  6292. position: fixed;
  6293. top: 0;
  6294. left: 0;
  6295. width: 100%;
  6296. height: 100%;
  6297. font-size: 0;
  6298. z-index: 1;
  6299. pointer-events: none;
  6300. }
  6301. .preloader .loader .row {
  6302. height: 100%;
  6303. }
  6304. .preloader .loader .loader-section {
  6305. padding: 0px;
  6306. }
  6307. .preloader .loader .loader-section .bg {
  6308. background-color: var(--bg);
  6309. height: 100%;
  6310. left: 0;
  6311. width: 100%;
  6312. transition: all 800ms cubic-bezier(0.77, 0, 0.175, 1);
  6313. }
  6314. .preloader.loaded .animation-preloader {
  6315. opacity: 0;
  6316. transition: 0.3s ease-out;
  6317. }
  6318. .preloader.loaded .loader-section .bg {
  6319. width: 0;
  6320. transition: 0.7s 0.3s allcubic-bezier(0.1, 0.1, 0.1, 1);
  6321. }
  6322. .search-wrap {
  6323. width: 100%;
  6324. height: 100%;
  6325. overflow: hidden;
  6326. display: none;
  6327. position: fixed;
  6328. top: 0;
  6329. left: 0;
  6330. z-index: 999999;
  6331. background-color: rgba(255, 255, 255, 0.9);
  6332. }
  6333. .search-wrap .search-inner {
  6334. position: relative;
  6335. width: 100%;
  6336. height: 100%;
  6337. }
  6338. .search-wrap .search-cell {
  6339. position: absolute;
  6340. top: 50%;
  6341. width: 100%;
  6342. transform: translateY(-50%);
  6343. }
  6344. .search-wrap .search-field-holder {
  6345. width: 50%;
  6346. margin: auto;
  6347. position: relative;
  6348. animation: slideInUp 0.3s;
  6349. }
  6350. @media only screen and (min-width: 768px) and (max-width: 991px) {
  6351. .search-wrap .search-field-holder {
  6352. width: 70%;
  6353. }
  6354. }
  6355. @media (max-width: 575px) {
  6356. .search-wrap .search-field-holder {
  6357. width: 80%;
  6358. }
  6359. }
  6360. .search-wrap .main-search-input {
  6361. width: 100%;
  6362. height: 70px;
  6363. border: 0;
  6364. padding: 0 50px;
  6365. text-transform: capitalize;
  6366. background: transparent;
  6367. font-size: 25px;
  6368. color: var(--theme);
  6369. border-bottom: 2px solid var(--theme);
  6370. text-align: center;
  6371. letter-spacing: 2px;
  6372. }
  6373. @media (max-width: 575px) {
  6374. .search-wrap .main-search-input {
  6375. height: 50px;
  6376. padding: 0 0;
  6377. line-height: 50px;
  6378. font-size: 18px;
  6379. }
  6380. }
  6381. .search-wrap input.form-control,
  6382. .search-wrap input.form-control:focus {
  6383. background-color: var(--theme);
  6384. }
  6385. input.main-search-input::placeholder {
  6386. color: var(--theme);
  6387. opacity: 1;
  6388. font-size: 25px;
  6389. }
  6390. @media (max-width: 575px) {
  6391. input.main-search-input::placeholder {
  6392. font-size: 18px;
  6393. }
  6394. }
  6395. .search-close {
  6396. position: absolute;
  6397. top: 50px;
  6398. right: 50px;
  6399. font-size: 30px;
  6400. color: var(--theme);
  6401. cursor: pointer;
  6402. }
  6403. .mouse-cursor {
  6404. position: fixed;
  6405. left: 0;
  6406. top: 0;
  6407. pointer-events: none;
  6408. border-radius: 50%;
  6409. -webkit-transform: translateZ(0);
  6410. transform: translateZ(0);
  6411. visibility: hidden;
  6412. }
  6413. .cursor-inner {
  6414. width: 6px;
  6415. height: 6px;
  6416. z-index: 10000001;
  6417. background-color: var(--theme);
  6418. -webkit-transition: width 0.3s ease-in-out, height 0.3s ease-in-out, margin 0.3s ease-in-out, opacity 0.3s ease-in-out;
  6419. -o-transition: width 0.3s ease-in-out, height 0.3s ease-in-out, margin 0.3s ease-in-out, opacity 0.3s ease-in-out;
  6420. transition: width 0.3s ease-in-out, height 0.3s ease-in-out, margin 0.3s ease-in-out, opacity 0.3s ease-in-out;
  6421. }
  6422. .cursor-inner.cursor-hover {
  6423. margin-left: -35px;
  6424. margin-top: -35px;
  6425. width: 70px;
  6426. height: 70px;
  6427. background-color: var(--theme);
  6428. opacity: 0.3;
  6429. }
  6430. .cursor-outer {
  6431. margin-left: -12px;
  6432. margin-top: -12px;
  6433. width: 30px;
  6434. height: 30px;
  6435. border: 1px solid var(--theme);
  6436. -webkit-box-sizing: border-box;
  6437. box-sizing: border-box;
  6438. z-index: 10000000;
  6439. opacity: 0.5;
  6440. -webkit-transition: all 0.08s ease-out;
  6441. -o-transition: all 0.08s ease-out;
  6442. transition: all 0.08s ease-out;
  6443. }
  6444. .cursor-outer.cursor-hover {
  6445. opacity: 0;
  6446. }
  6447. .pricing-section {
  6448. position: relative;
  6449. margin-top: 40px;
  6450. }
  6451. .pricing-section .tree-shape {
  6452. position: absolute;
  6453. bottom: 5%;
  6454. left: 3%;
  6455. }
  6456. .pricing-section .pencil-shape {
  6457. position: absolute;
  6458. top: 15%;
  6459. right: 10px;
  6460. animation: rounded 5s linear infinite;
  6461. }
  6462. .pricing-section .top-shape {
  6463. position: absolute;
  6464. top: -40px;
  6465. left: 0;
  6466. height: 92px;
  6467. border: 1px solid red;
  6468. }
  6469. .pricing-section .top-shape img {
  6470. width: 100%;
  6471. height: 100%;
  6472. object-fit: cover;
  6473. }
  6474. .pricing-section .girl-shape {
  6475. position: absolute;
  6476. top: 15%;
  6477. right: 3%;
  6478. }
  6479. .pricing-wrapper .nav {
  6480. display: flex;
  6481. align-items: center;
  6482. gap: 30px;
  6483. justify-content: center;
  6484. margin-top: 40px;
  6485. margin-bottom: 40px;
  6486. }
  6487. @media (max-width: 767px) {
  6488. .pricing-wrapper .nav {
  6489. gap: 20px;
  6490. margin-top: 30px;
  6491. margin-bottom: 30px;
  6492. }
  6493. }
  6494. @media (max-width: 575px) {
  6495. .pricing-wrapper .nav {
  6496. gap: 15px;
  6497. margin-top: 20px;
  6498. margin-bottom: 20px;
  6499. }
  6500. }
  6501. .pricing-wrapper .nav .nav-link {
  6502. text-align: center;
  6503. padding: 10px 40px;
  6504. background-color: var(--white);
  6505. border-radius: 6px;
  6506. font-weight: 700;
  6507. font-size: 15px;
  6508. text-transform: capitalize;
  6509. color: var(--header);
  6510. transition: all 0.3s ease-in-out;
  6511. }
  6512. @media (max-width: 991px) {
  6513. .pricing-wrapper .nav .nav-link {
  6514. padding: 14px 45px;
  6515. font-size: 18px;
  6516. }
  6517. }
  6518. @media (max-width: 575px) {
  6519. .pricing-wrapper .nav .nav-link {
  6520. padding: 12px 20px;
  6521. font-size: 14px;
  6522. }
  6523. }
  6524. .pricing-wrapper .nav .nav-link.active {
  6525. position: relative;
  6526. background-color: var(--theme);
  6527. color: var(--white);
  6528. }
  6529. .pricing-items {
  6530. margin-top: 30px;
  6531. padding: 45px 40px;
  6532. background-color: var(--white);
  6533. border-radius: 24px;
  6534. position: relative;
  6535. }
  6536. @media (max-width: 575px) {
  6537. .pricing-items {
  6538. padding: 30px;
  6539. }
  6540. }
  6541. .pricing-items .icon {
  6542. position: absolute;
  6543. top: 50px;
  6544. right: 60px;
  6545. z-index: 2;
  6546. display: inline-block;
  6547. }
  6548. .pricing-items .icon::before {
  6549. position: absolute;
  6550. top: 50%;
  6551. left: 50%;
  6552. transform: translate(-50%, -50%);
  6553. content: "";
  6554. width: 95px;
  6555. height: 90px;
  6556. background-repeat: no-repeat;
  6557. background-size: cover;
  6558. background-image: url(../image/icon-bg1.png);
  6559. z-index: -1;
  6560. transition: all 0.4s ease-in-out;
  6561. }
  6562. .pricing-items .element-shape {
  6563. position: absolute;
  6564. bottom: 0;
  6565. right: 0;
  6566. }
  6567. .pricing-items .pricing-header {
  6568. border-bottom: 1px solid rgba(243, 159, 95, 0.3);
  6569. padding-bottom: 30px;
  6570. }
  6571. @media (max-width: 575px) {
  6572. .pricing-items .pricing-header {
  6573. padding-bottom: 20px;
  6574. }
  6575. }
  6576. .pricing-items .pricing-header h2 {
  6577. font-size: 40px;
  6578. margin-top: 10px;
  6579. }
  6580. .pricing-items .pricing-header h2 span {
  6581. font-size: 20px;
  6582. font-weight: 500;
  6583. margin-left: -10px;
  6584. }
  6585. .pricing-items .pricing-list {
  6586. margin-top: 30px;
  6587. margin-bottom: 40px;
  6588. }
  6589. @media (max-width: 767px) {
  6590. .pricing-items .pricing-list {
  6591. margin-bottom: 30px;
  6592. }
  6593. }
  6594. @media (max-width: 575px) {
  6595. .pricing-items .pricing-list {
  6596. margin-top: 20px;
  6597. margin-bottom: 20px;
  6598. }
  6599. }
  6600. .pricing-items .pricing-list li {
  6601. color: var(--header);
  6602. }
  6603. .pricing-items .pricing-list li:not(:last-child) {
  6604. margin-bottom: 10px;
  6605. }
  6606. .pricing-items .pricing-list li i {
  6607. color: var(--theme);
  6608. margin-right: 10px;
  6609. }
  6610. .pricing-items .theme-btn {
  6611. border-radius: 8px;
  6612. }
  6613. .pricing-items.active {
  6614. background-color: var(--theme);
  6615. }
  6616. .pricing-items.active .icon::before {
  6617. filter: grayscale(100%) brightness(300%);
  6618. }
  6619. .pricing-items.active .pricing-header {
  6620. border-bottom: 1px solid rgb(255, 255, 255);
  6621. }
  6622. .pricing-items.active .pricing-header h4 {
  6623. color: var(--white);
  6624. }
  6625. .pricing-items.active .pricing-header h2 {
  6626. color: var(--white);
  6627. }
  6628. .pricing-items.active .pricing-list li {
  6629. color: var(--white);
  6630. }
  6631. .pricing-items.active .pricing-list li i {
  6632. color: var(--white);
  6633. }
  6634. .pricing-items.active .theme-btn {
  6635. background-color: var(--white);
  6636. color: var(--theme);
  6637. }
  6638. .pricing-items.active .theme-btn:hover {
  6639. color: var(--white);
  6640. }
  6641. .program-box-items {
  6642. padding: 20px 30px 36px;
  6643. position: relative;
  6644. z-index: 9;
  6645. max-width: 420px;
  6646. text-align: center;
  6647. margin: 30px auto;
  6648. }
  6649. .program-box-items .program-bg {
  6650. position: absolute;
  6651. top: 0;
  6652. left: 0;
  6653. background-color: var(--theme2);
  6654. transition: all 500ms ease;
  6655. mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 371 458"><path d="M180.499 1.01957C228.479 0.655383 276.69 -1.7067 311.981 40.3475C348.649 84.0424 368.9 145.98 370.375 210.447C371.895 276.909 355.756 343.16 319.998 390.92C283.71 439.389 232.608 453.808 180.499 456.752C125.658 459.85 64.9802 460.19 28.2615 407.4C-7.46789 356.033 -0.110132 279.336 4.09606 210.447C7.86177 148.773 16.5925 85.8896 50.5519 42.3318C84.3879 -1.06785 132.853 1.38123 180.499 1.01957Z" /></svg>');
  6656. mask-repeat: no-repeat;
  6657. mask-position: center center;
  6658. mask-size: cover;
  6659. width: 100%;
  6660. height: 100%;
  6661. z-index: -1;
  6662. }
  6663. .program-box-items .program-bg.bg-2 {
  6664. background-color: var(--theme);
  6665. }
  6666. .program-box-items .program-bg.bg-3 {
  6667. background-color: var(--theme);
  6668. }
  6669. .program-box-items .program-bg.bg-3 {
  6670. background-color: var(--white);
  6671. }
  6672. .program-box-items .program-bg.bg-4 {
  6673. background-color: var(--bg);
  6674. }
  6675. .program-box-items .program-bg.bg-5 {
  6676. background-color: var(--bg4);
  6677. }
  6678. .program-box-items .program-bg.bg-6 {
  6679. background-color: var(--bg5);
  6680. }
  6681. .program-box-items .program-image img {
  6682. width: 100%;
  6683. height: 100%;
  6684. }
  6685. .program-box-items .program-content {
  6686. padding: 30px 20px 0;
  6687. }
  6688. @media (max-width: 575px) {
  6689. .program-box-items .program-content {
  6690. padding: 20px 20px 0;
  6691. }
  6692. }
  6693. @media (min-width: 1800px) {
  6694. .program-box-items .program-content {
  6695. padding: 30px 35px 0;
  6696. }
  6697. }
  6698. .program-box-items .program-content h4 {
  6699. margin-bottom: 5px;
  6700. }
  6701. .program-box-items .program-content h4 a {
  6702. color: var(--white);
  6703. }
  6704. .program-box-items .program-content span {
  6705. color: var(--white);
  6706. font-weight: 600;
  6707. font-family: "Quicksand", sans-serif;
  6708. }
  6709. .program-box-items .program-content p {
  6710. color: var(--white);
  6711. margin-top: 10px;
  6712. margin-bottom: 30px;
  6713. }
  6714. @media (max-width: 575px) {
  6715. .program-box-items .program-content p {
  6716. margin-bottom: 15px;
  6717. }
  6718. }
  6719. .program-box-items .program-content .arrow-icon {
  6720. width: 60px;
  6721. height: 55px;
  6722. line-height: 55px;
  6723. border-radius: 22px;
  6724. background-color: var(--theme);
  6725. display: inline-block;
  6726. color: var(--white);
  6727. transition: all 0.4s ease-in-out;
  6728. position: absolute;
  6729. bottom: -50px;
  6730. left: 50%;
  6731. transform: translate(-50%, -50%);
  6732. }
  6733. .program-box-items .program-content .arrow-icon:hover {
  6734. background-color: var(--header);
  6735. }
  6736. .program-box-items .program-content .arrow-icon.color-2 {
  6737. background-color: var(--header);
  6738. }
  6739. .program-box-items .program-content .arrow-icon.color-2:hover {
  6740. background-color: var(--white);
  6741. color: var(--header);
  6742. }
  6743. .program-box-items .program-content.style-2 h4 a {
  6744. color: var(--header);
  6745. }
  6746. .program-box-items .program-content.style-2 span {
  6747. color: var(--theme);
  6748. }
  6749. .program-box-items .program-content.style-2 p {
  6750. color: var(--text);
  6751. }
  6752. @media (max-width: 575px) {
  6753. .program-box-items {
  6754. display: n;
  6755. }
  6756. }
  6757. .program-section {
  6758. position: relative;
  6759. padding-bottom: 172px;
  6760. }
  6761. @media (max-width: 1199px) {
  6762. .program-section {
  6763. padding-bottom: 155px;
  6764. }
  6765. }
  6766. @media (max-width: 991px) {
  6767. .program-section {
  6768. padding-bottom: 120px;
  6769. }
  6770. }
  6771. .program-section .top-shape {
  6772. position: absolute;
  6773. top: 0;
  6774. left: 0;
  6775. width: 100%;
  6776. }
  6777. .program-section .bottom-shape {
  6778. position: absolute;
  6779. bottom: -1px;
  6780. left: 0;
  6781. width: 100%;
  6782. }
  6783. .program-section .mask-shape {
  6784. position: absolute;
  6785. top: 15%;
  6786. left: 5%;
  6787. }
  6788. .program-section .pencil-shape {
  6789. position: absolute;
  6790. bottom: 10%;
  6791. left: 85px;
  6792. animation: rounded 5s linear infinite;
  6793. }
  6794. .program-section .mask-shape-2 {
  6795. position: absolute;
  6796. top: 18%;
  6797. right: 5%;
  6798. animation: rounded 5s linear infinite;
  6799. }
  6800. .program-section .compass-shape {
  6801. position: absolute;
  6802. bottom: 10%;
  6803. right: 85px;
  6804. animation: rounded 5s linear infinite;
  6805. }
  6806. .program-section .love-shape {
  6807. position: absolute;
  6808. top: 40%;
  6809. left: 0;
  6810. animation: rounded 5s linear infinite;
  6811. }
  6812. .program-section .zebra-shape {
  6813. position: absolute;
  6814. top: 45%;
  6815. right: 0;
  6816. }
  6817. .program-box-items-2 {
  6818. padding: 50px 30px 40px;
  6819. position: relative;
  6820. z-index: 9;
  6821. max-width: 420px;
  6822. text-align: center;
  6823. margin: 30px auto;
  6824. }
  6825. .program-box-items-2 .program-bg {
  6826. position: absolute;
  6827. top: 0;
  6828. left: 0;
  6829. background-color: var(--theme2);
  6830. transition: all 500ms ease;
  6831. mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 270 288"><path fill-rule="evenodd" clip-rule="evenodd" d="M131.352 0.968405C166.359 0.739595 212.216 -6.12903 237.965 20.2925C264.719 47.745 268.813 92.0436 269.889 132.547C270.998 174.303 264.054 235.303 237.965 265.31C211.488 295.761 169.371 285.444 131.352 287.293C91.3384 289.24 47.0661 289.453 20.2754 256.287C-5.7936 224.014 -0.425215 175.827 2.64371 132.547C5.39126 93.7981 -4.50211 53.0434 20.2754 25.6771C44.9629 -1.5898 96.5877 1.19563 131.352 0.968405Z" /></svg>');
  6832. mask-repeat: no-repeat;
  6833. mask-position: center center;
  6834. mask-size: cover;
  6835. width: 100%;
  6836. height: 100%;
  6837. z-index: -1;
  6838. }
  6839. .program-box-items-2 .program-bg.bg-2 {
  6840. background-color: var(--theme);
  6841. }
  6842. .program-box-items-2 .program-bg.bg-3 {
  6843. background-color: #5866EB;
  6844. }
  6845. .program-box-items-2 .program-bg.bg-4 {
  6846. background-color: #F25334;
  6847. }
  6848. .program-box-items-2 .content {
  6849. padding: 30px 20px 0;
  6850. }
  6851. @media (max-width: 575px) {
  6852. .program-box-items-2 .content {
  6853. padding: 20px 20px 0;
  6854. }
  6855. }
  6856. .program-box-items-2 .content h4 {
  6857. margin-bottom: 5px;
  6858. }
  6859. .program-box-items-2 .content h4 a {
  6860. color: var(--white);
  6861. }
  6862. .program-box-items-2 .content span {
  6863. color: var(--white);
  6864. font-weight: 600;
  6865. font-family: "Quicksand", sans-serif;
  6866. }
  6867. .program-box-items-2 .content p {
  6868. color: var(--white);
  6869. margin-top: 10px;
  6870. margin-bottom: 30px;
  6871. }
  6872. @media (max-width: 575px) {
  6873. .program-box-items-2 .content p {
  6874. margin-bottom: 15px;
  6875. }
  6876. }
  6877. .program-box-items-2 .content .arrow-icon {
  6878. width: 60px;
  6879. height: 55px;
  6880. line-height: 55px;
  6881. border-radius: 22px;
  6882. background-color: var(--theme2);
  6883. display: inline-block;
  6884. color: var(--white);
  6885. transition: all 0.4s ease-in-out;
  6886. position: absolute;
  6887. bottom: -50px;
  6888. left: 50%;
  6889. transform: translate(-50%, -50%);
  6890. border: 2px solid var(--white);
  6891. box-shadow: var(--box-shadow);
  6892. }
  6893. .program-box-items-2 .content .arrow-icon:hover {
  6894. background-color: var(--white);
  6895. color: var(--header);
  6896. }
  6897. .program-box-items-2 .content .arrow-icon.color-2 {
  6898. background-color: var(--theme);
  6899. }
  6900. .program-box-items-2 .content .arrow-icon.color-2:hover {
  6901. background-color: var(--white);
  6902. color: var(--header);
  6903. }
  6904. .program-box-items-2 .content .arrow-icon.color-3 {
  6905. background-color: #5866EB;
  6906. }
  6907. .program-box-items-2 .content .arrow-icon.color-3:hover {
  6908. background-color: var(--white);
  6909. color: var(--header);
  6910. }
  6911. .program-box-items-2 .content .arrow-icon.color-4 {
  6912. background-color: #F25334;
  6913. }
  6914. .program-box-items-2 .content .arrow-icon.color-4:hover {
  6915. background-color: var(--white);
  6916. color: var(--header);
  6917. }
  6918. .program-section-2 {
  6919. position: relative;
  6920. }
  6921. .program-section-2 .line-1 {
  6922. position: absolute;
  6923. top: 40%;
  6924. right: 0%;
  6925. animation: rounded 5s linear infinite;
  6926. }
  6927. .clases-section {
  6928. position: relative;
  6929. margin-top: 120px;
  6930. }
  6931. @media (max-width: 1899px) {
  6932. .clases-section .array-button {
  6933. display: none;
  6934. }
  6935. }
  6936. .clases-section .array-button .array-prev {
  6937. position: absolute;
  6938. transform: translate(-50, -50%);
  6939. top: 55%;
  6940. left: 12%;
  6941. background-color: var(--theme2);
  6942. color: var(--white);
  6943. border: 2px solid var(--white);
  6944. }
  6945. .clases-section .array-button .array-prev:hover {
  6946. background-color: var(--white);
  6947. color: var(--theme);
  6948. }
  6949. .clases-section .array-button .array-next {
  6950. position: absolute;
  6951. transform: translate(-50, -50%);
  6952. top: 55%;
  6953. right: 12%;
  6954. background-color: var(--theme2);
  6955. color: var(--white);
  6956. border: 2px solid var(--white);
  6957. }
  6958. .clases-section .array-button .array-next:hover {
  6959. background-color: var(--white);
  6960. color: var(--theme);
  6961. }
  6962. .clases-section .clases-shape {
  6963. height: 160px;
  6964. width: 100%;
  6965. position: absolute;
  6966. top: -120px;
  6967. left: 0;
  6968. right: 0;
  6969. overflow-x: hidden;
  6970. }
  6971. .clases-section .wave {
  6972. background: url(../image/clases-top-shape.png);
  6973. position: absolute;
  6974. width: 200%;
  6975. height: 100%;
  6976. animation: wave 10s -3s linear infinite;
  6977. transform: translate3d(0, 0, 0);
  6978. background-size: cover;
  6979. }
  6980. .clases-section .wave:nth-of-type(2) {
  6981. bottom: 0;
  6982. animation: wave 18s linear reverse infinite;
  6983. }
  6984. .clases-section .wave:nth-of-type(3) {
  6985. bottom: 0;
  6986. animation: wave 20s -1s linear infinite;
  6987. }
  6988. .clases-items {
  6989. margin-top: 30px;
  6990. position: relative;
  6991. z-index: 9;
  6992. }
  6993. @media (max-width: 1399px) {
  6994. .clases-items br {
  6995. display: none;
  6996. }
  6997. }
  6998. .clases-items .clases-bg {
  6999. position: absolute;
  7000. top: 0;
  7001. left: 0;
  7002. background-color: var(--white);
  7003. transition: all 500ms ease;
  7004. mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 370 456"><path d="M7.69014 27.8377C7.69014 27.8377 2.04067 39.7721 6.56025 199.448C11.0798 359.107 -34.2042 452.395 64.068 454.599C162.34 456.803 278.579 456.097 313.562 454.599C348.546 453.101 370 472.509 370 371.041C370 269.573 370 191.974 368.87 120.351C367.74 48.7271 376.694 13.544 336.103 10.9952C295.499 8.44648 190.533 3.96893 145.394 2.47068C100.256 0.972426 12.2097 -9.46369 7.69014 27.8377Z" /></svg>');
  7005. mask-repeat: no-repeat;
  7006. mask-position: center center;
  7007. mask-size: cover;
  7008. width: 100%;
  7009. height: 100%;
  7010. z-index: -1;
  7011. }
  7012. .clases-items .clases-bg.style-2 {
  7013. background-color: rgba(240, 240, 240, 0.4509803922);
  7014. }
  7015. .clases-items .clases-image {
  7016. padding: 25px 25px 0 25px;
  7017. }
  7018. .clases-items .clases-image img {
  7019. width: 100%;
  7020. height: 100%;
  7021. }
  7022. .clases-items .clases-content {
  7023. padding: 20px 30px;
  7024. }
  7025. @media (max-width: 575px) {
  7026. .clases-items .clases-content {
  7027. padding: 15px 30px;
  7028. }
  7029. }
  7030. .clases-items .clases-content h4 {
  7031. margin-bottom: 10px;
  7032. }
  7033. .clases-items .clases-content h4 a:hover {
  7034. color: var(--theme);
  7035. }
  7036. .clases-items .clases-content p {
  7037. padding-bottom: 20px;
  7038. border-bottom: 2px dotted var(--theme);
  7039. }
  7040. @media (max-width: 575px) {
  7041. .clases-items .clases-content p {
  7042. padding-bottom: 15px;
  7043. }
  7044. }
  7045. .clases-items .clases-content .clases-schedule {
  7046. margin-top: 30px;
  7047. display: flex;
  7048. align-items: center;
  7049. justify-content: space-between;
  7050. }
  7051. @media (max-width: 575px) {
  7052. .clases-items .clases-content .clases-schedule {
  7053. margin-top: 15px;
  7054. }
  7055. }
  7056. .clases-items .clases-content .clases-schedule li {
  7057. font-weight: 600;
  7058. color: var(--header);
  7059. font-weight: "Quicksand", sans-serif;
  7060. }
  7061. .clases-items .clases-content .clases-schedule li span {
  7062. font-family: "Source Sans 3", sans-serif;
  7063. color: var(--theme);
  7064. font-weight: 14px;
  7065. }
  7066. .program-details-wrapper .program-details-items .details-image img {
  7067. width: 100%;
  7068. height: 100%;
  7069. }
  7070. .program-details-wrapper .program-details-items .details-content {
  7071. margin-top: 40px;
  7072. }
  7073. .program-details-wrapper .program-details-items .details-content .post {
  7074. background-color: var(--theme);
  7075. color: var(--white);
  7076. padding: 4px 15px;
  7077. border-radius: 8px;
  7078. display: inline-block;
  7079. margin-bottom: 20px;
  7080. }
  7081. .program-details-wrapper .program-details-items .details-content h2 {
  7082. font-size: 30px;
  7083. margin-bottom: 20px;
  7084. }
  7085. @media (max-width: 767px) {
  7086. .program-details-wrapper .program-details-items .details-content h2 {
  7087. font-size: 26px;
  7088. }
  7089. }
  7090. @media (max-width: 575px) {
  7091. .program-details-wrapper .program-details-items .details-content h2 {
  7092. font-size: 24px;
  7093. }
  7094. }
  7095. .program-details-wrapper .program-details-items .details-content .details-author-area {
  7096. display: flex;
  7097. align-items: center;
  7098. gap: 30px;
  7099. border-top: 1px solid var(--border);
  7100. border-bottom: 1px solid var(--border);
  7101. padding: 20px 0;
  7102. margin-bottom: 40px;
  7103. margin-top: 30px;
  7104. }
  7105. @media (max-width: 575px) {
  7106. .program-details-wrapper .program-details-items .details-content .details-author-area {
  7107. flex-wrap: wrap;
  7108. gap: 15px;
  7109. margin-bottom: 20px;
  7110. margin-top: 20px;
  7111. }
  7112. }
  7113. .program-details-wrapper .program-details-items .details-content .details-author-area .author-items {
  7114. display: flex;
  7115. align-items: center;
  7116. gap: 10px;
  7117. }
  7118. .program-details-wrapper .program-details-items .details-content .details-author-area .class-list {
  7119. display: flex;
  7120. align-items: center;
  7121. gap: 30px;
  7122. }
  7123. .program-details-wrapper .program-details-items .details-content .details-author-area .class-list li i {
  7124. color: var(--theme);
  7125. }
  7126. .program-details-wrapper .program-details-items .details-content .list-items {
  7127. margin-top: 20px;
  7128. }
  7129. .program-details-wrapper .program-details-items .details-content .list-items li:not(:last-child) {
  7130. margin-bottom: 10px;
  7131. }
  7132. .program-details-wrapper .program-details-items .details-content .list-items li i {
  7133. margin-right: 5px;
  7134. color: var(--theme);
  7135. }
  7136. .program-details-wrapper .details-list-area {
  7137. padding: 30px 40px;
  7138. border-radius: 10px;
  7139. position: relative;
  7140. z-index: 9;
  7141. border: 1px solid var(--border);
  7142. }
  7143. @media (max-width: 1199px) {
  7144. .program-details-wrapper .details-list-area {
  7145. padding: 30px 20px;
  7146. }
  7147. }
  7148. @media (max-width: 991px) {
  7149. .program-details-wrapper .details-list-area {
  7150. padding: 30px 40px;
  7151. }
  7152. }
  7153. .program-details-wrapper .details-list-area h3 {
  7154. font-size: 24px;
  7155. border-bottom: 1px solid var(--border);
  7156. padding-bottom: 20px;
  7157. }
  7158. @media (max-width: 1199px) {
  7159. .program-details-wrapper .details-list-area {
  7160. margin-right: 0;
  7161. }
  7162. }
  7163. @media (max-width: 991px) {
  7164. .program-details-wrapper .details-list-area {
  7165. margin-top: 0;
  7166. }
  7167. }
  7168. .program-details-wrapper .details-list-area .details-list {
  7169. margin-bottom: 30px;
  7170. }
  7171. .program-details-wrapper .details-list-area .details-list li {
  7172. display: flex;
  7173. align-items: center;
  7174. justify-content: space-between;
  7175. padding: 15px 0;
  7176. border-bottom: 1px solid var(--border);
  7177. }
  7178. .program-details-wrapper .details-list-area .details-list li span {
  7179. font-weight: 600 !important;
  7180. color: var(--header);
  7181. }
  7182. .program-details-wrapper .details-list-area .details-list li span i {
  7183. color: var(--theme);
  7184. }
  7185. .program-details-wrapper .details-list-area .theme-btn {
  7186. padding: 19px 40px;
  7187. }
  7188. @media (max-width: 1199px) {
  7189. .program-details-wrapper .details-list-area .theme-btn {
  7190. padding: 19px 25px;
  7191. font-size: 14px;
  7192. }
  7193. }
  7194. @media (max-width: 991px) {
  7195. .program-details-wrapper .details-list-area .theme-btn {
  7196. padding: 19px 40px;
  7197. font-size: 16px;
  7198. }
  7199. }
  7200. .program-details-wrapper .details-list-area .theme-btn.border-style {
  7201. border: 1px solid var(--theme);
  7202. color: var(--theme);
  7203. background-color: transparent;
  7204. padding: 18px 40px;
  7205. }
  7206. .program-details-wrapper .details-list-area .theme-btn.border-style::after, .program-details-wrapper .details-list-area .theme-btn.border-style::before {
  7207. background-color: var(--theme);
  7208. }
  7209. .program-details-wrapper .details-list-area .theme-btn.border-style:hover {
  7210. color: var(--white);
  7211. }
  7212. .program-details-wrapper .details-list-area .social-icon {
  7213. justify-content: center;
  7214. gap: 15px;
  7215. margin-top: 30px;
  7216. }
  7217. .program-details-wrapper .details-list-area .social-icon a {
  7218. width: 36px;
  7219. height: 36px;
  7220. line-height: 36px;
  7221. text-align: center;
  7222. font-size: 16px;
  7223. display: block;
  7224. color: var(--theme);
  7225. transition: all 0.4s ease-in-out;
  7226. text-align: center;
  7227. background-color: transparent;
  7228. border: 1px solid var(--theme);
  7229. }
  7230. .program-details-wrapper .details-list-area .social-icon a:hover {
  7231. background-color: var(--theme);
  7232. color: var(--white);
  7233. border: 1px solid transparent;
  7234. }
  7235. .program-details-wrapper .program-author-items {
  7236. display: flex;
  7237. align-items: center;
  7238. gap: 30px;
  7239. padding: 30px;
  7240. border: 1px solid var(--border);
  7241. border-radius: 12px;
  7242. margin-top: 23px;
  7243. }
  7244. @media (max-width: 1199px) {
  7245. .program-details-wrapper .program-author-items {
  7246. flex-wrap: wrap;
  7247. justify-content: center;
  7248. text-align: center;
  7249. }
  7250. }
  7251. .program-details-wrapper .program-author-items .thumb {
  7252. max-width: 370px;
  7253. }
  7254. .program-details-wrapper .program-author-items .thumb img {
  7255. width: 100%;
  7256. height: 100%;
  7257. border-radius: 10px;
  7258. }
  7259. .program-details-wrapper .program-author-items .content {
  7260. max-width: 700px;
  7261. }
  7262. @media (max-width: 1199px) {
  7263. .program-details-wrapper .program-author-items .content {
  7264. margin: 0 auto;
  7265. text-align: center;
  7266. }
  7267. }
  7268. .program-details-wrapper .program-author-items .content h2 {
  7269. font-size: 30px;
  7270. margin-bottom: 5px;
  7271. }
  7272. @media (max-width: 575px) {
  7273. .program-details-wrapper .program-author-items .content h2 {
  7274. font-size: 26px;
  7275. }
  7276. }
  7277. .program-details-wrapper .program-author-items .content span {
  7278. margin-bottom: 20px;
  7279. display: inline-block;
  7280. }
  7281. @media (max-width: 575px) {
  7282. .program-details-wrapper .program-author-items .content span {
  7283. margin-bottom: 10px;
  7284. }
  7285. }
  7286. .program-details-wrapper .program-author-items .content ul {
  7287. margin-top: 20px;
  7288. display: flex;
  7289. align-items: center;
  7290. gap: 50px;
  7291. border-top: 1px solid var(--border);
  7292. border-bottom: 1px solid var(--border);
  7293. padding: 20px 0;
  7294. }
  7295. @media (max-width: 1199px) {
  7296. .program-details-wrapper .program-author-items .content ul {
  7297. flex-wrap: wrap;
  7298. justify-content: center;
  7299. text-align: center;
  7300. gap: 20px;
  7301. }
  7302. }
  7303. .program-details-wrapper .program-author-items .content ul li {
  7304. color: var(--header);
  7305. }
  7306. .program-details-wrapper .program-author-items .content ul li i {
  7307. margin-right: 5px;
  7308. }
  7309. .program-details-wrapper .program-author-items .content ul li .color-star {
  7310. color: var(--theme);
  7311. }
  7312. .program-details-wrapper .program-author-items .content .social-icon {
  7313. margin-top: 40px;
  7314. gap: 15px;
  7315. position: relative;
  7316. z-index: 9;
  7317. }
  7318. @media (max-width: 1199px) {
  7319. .program-details-wrapper .program-author-items .content .social-icon {
  7320. flex-wrap: wrap;
  7321. justify-content: center;
  7322. }
  7323. }
  7324. @media (max-width: 575px) {
  7325. .program-details-wrapper .program-author-items .content .social-icon {
  7326. margin-top: 20px;
  7327. }
  7328. }
  7329. .program-details-wrapper .program-author-items .content .social-icon a {
  7330. width: 36px;
  7331. height: 36px;
  7332. line-height: 36px;
  7333. text-align: center;
  7334. font-size: 16px;
  7335. display: block;
  7336. color: var(--theme);
  7337. transition: all 0.4s ease-in-out;
  7338. text-align: center;
  7339. background-color: transparent;
  7340. border: 1px solid var(--theme);
  7341. }
  7342. .program-details-wrapper .program-author-items .content .social-icon a:hover {
  7343. background-color: var(--theme);
  7344. color: var(--white);
  7345. border: 1px solid transparent;
  7346. }
  7347. .section-title {
  7348. position: relative;
  7349. z-index: 99;
  7350. margin-bottom: 30px;
  7351. margin-top: -5px;
  7352. }
  7353. @media (max-width: 767px) {
  7354. .section-title {
  7355. margin-bottom: 0;
  7356. }
  7357. }
  7358. .section-title span {
  7359. color: var(--theme);
  7360. margin-bottom: 10px;
  7361. display: inline-block;
  7362. font-weight: 400;
  7363. text-transform: capitalize;
  7364. font-size: 20px;
  7365. font-family: "Pangolin";
  7366. }
  7367. .section-title-area {
  7368. display: flex;
  7369. align-items: center;
  7370. justify-content: space-between;
  7371. position: relative;
  7372. z-index: 9;
  7373. }
  7374. @media (max-width: 767px) {
  7375. .section-title-area {
  7376. flex-wrap: wrap;
  7377. gap: 30px;
  7378. }
  7379. }
  7380. .center {
  7381. text-align: center;
  7382. margin: 0 auto;
  7383. }
  7384. .section-bg {
  7385. background-color: var(--bg);
  7386. }
  7387. .section-bg-2 {
  7388. background-color: var(--bg2);
  7389. }
  7390. .section-bg-3 {
  7391. background-color: var(--theme2);
  7392. }
  7393. .section-padding {
  7394. padding: 120px 0;
  7395. }
  7396. @media (max-width: 1199px) {
  7397. .section-padding {
  7398. padding: 100px 0;
  7399. }
  7400. }
  7401. @media (max-width: 991px) {
  7402. .section-padding {
  7403. padding: 80px 0;
  7404. }
  7405. }
  7406. @media (max-width: 767px) {
  7407. .service-wrapper {
  7408. text-align: center;
  7409. margin-bottom: -5px;
  7410. }
  7411. }
  7412. .service-wrapper .service-left .about-author {
  7413. display: flex;
  7414. align-items: center;
  7415. gap: 30px;
  7416. margin-top: 50px;
  7417. }
  7418. @media (max-width: 1199px) {
  7419. .service-wrapper .service-left .about-author {
  7420. flex-wrap: wrap;
  7421. }
  7422. }
  7423. @media (max-width: 767px) {
  7424. .service-wrapper .service-left .about-author {
  7425. margin-top: 30px;
  7426. text-align: center;
  7427. justify-content: center;
  7428. }
  7429. }
  7430. @media (max-width: 575px) {
  7431. .service-wrapper .service-left .about-author {
  7432. margin-top: 20px;
  7433. }
  7434. }
  7435. .service-wrapper .service-left .about-author .author-icon {
  7436. display: flex;
  7437. align-items: center;
  7438. gap: 20px;
  7439. }
  7440. .service-wrapper .service-left .about-author .author-icon .icon {
  7441. width: 48px;
  7442. height: 48px;
  7443. line-height: 48px;
  7444. text-align: center;
  7445. background-color: var(--theme);
  7446. text-align: center;
  7447. color: var(--white);
  7448. border-radius: 50%;
  7449. position: relative;
  7450. }
  7451. .service-wrapper .service-left .about-author .author-icon .icon::before {
  7452. position: absolute;
  7453. top: 50%;
  7454. left: 50%;
  7455. right: 0;
  7456. bottom: 0;
  7457. width: 60px;
  7458. height: 60px;
  7459. border-radius: 50%;
  7460. border: 1px solid var(--theme);
  7461. content: "";
  7462. transform: translate(-50%, -50%);
  7463. }
  7464. .service-wrapper .service-left .about-author .author-icon .content h5 {
  7465. font-weight: 600;
  7466. }
  7467. .service-wrapper .service-left .about-author .author-icon .content h5 a {
  7468. color: var(--header);
  7469. }
  7470. .service-wrapper .service-left .about-author .author-icon .content span {
  7471. font-size: 14px;
  7472. font-weight: 600;
  7473. color: var(--header);
  7474. font-family: "Quicksand", sans-serif;
  7475. margin-bottom: 5px;
  7476. }
  7477. .service-wrapper .service-right .icon-items {
  7478. display: flex;
  7479. align-items: center;
  7480. gap: 20px;
  7481. margin-left: 120px;
  7482. }
  7483. @media (max-width: 1199px) {
  7484. .service-wrapper .service-right .icon-items {
  7485. margin-left: 30px;
  7486. }
  7487. }
  7488. @media (max-width: 991px) {
  7489. .service-wrapper .service-right .icon-items {
  7490. margin-left: 100px;
  7491. }
  7492. }
  7493. @media (max-width: 767px) {
  7494. .service-wrapper .service-right .icon-items {
  7495. flex-wrap: wrap;
  7496. margin-left: 0;
  7497. justify-content: center;
  7498. text-align: center;
  7499. }
  7500. }
  7501. .service-wrapper .service-right .icon-items:not(:last-child) {
  7502. margin-bottom: 30px;
  7503. }
  7504. @media (max-width: 575px) {
  7505. .service-wrapper .service-right .icon-items:not(:last-child) {
  7506. margin-bottom: 20px;
  7507. }
  7508. }
  7509. .service-wrapper .service-right .icon-items .icon {
  7510. width: 90px;
  7511. height: 90px;
  7512. line-height: 90px;
  7513. text-align: center;
  7514. border-radius: 8px;
  7515. background: rgba(243, 159, 95, 0.2);
  7516. }
  7517. .service-wrapper .service-right .icon-items .icon.color-2 {
  7518. background: rgba(88, 102, 235, 0.15);
  7519. }
  7520. .service-wrapper .service-right .icon-items .icon.color-3 {
  7521. background: rgba(112, 166, 177, 0.15);
  7522. }
  7523. .service-wrapper .service-right .icon-items .content h5 {
  7524. margin-bottom: 5px;
  7525. }
  7526. .service-wrapper .service-right .icon-items.style-2 {
  7527. margin-left: 0;
  7528. }
  7529. .service-section {
  7530. position: relative;
  7531. }
  7532. .service-section .line-1 {
  7533. position: absolute;
  7534. bottom: 10%;
  7535. left: 0;
  7536. animation: rounded 5s linear infinite;
  7537. }
  7538. @media (max-width: 1600px) {
  7539. .service-section .line-1 {
  7540. display: none;
  7541. }
  7542. }
  7543. .service-section .line-2 {
  7544. position: absolute;
  7545. bottom: 10%;
  7546. right: 0;
  7547. }
  7548. @media (max-width: 1600px) {
  7549. .service-section .line-2 {
  7550. display: none;
  7551. }
  7552. }
  7553. .team-section {
  7554. position: relative;
  7555. }
  7556. .team-section .top-shape {
  7557. position: absolute;
  7558. top: 0;
  7559. left: 0;
  7560. width: 100%;
  7561. }
  7562. .team-section .love-shape {
  7563. position: absolute;
  7564. bottom: 0;
  7565. left: 30px;
  7566. }
  7567. @media (max-width: 1399px) {
  7568. .team-section .love-shape {
  7569. left: 30px;
  7570. }
  7571. }
  7572. @media (max-width: 1199px) {
  7573. .team-section .love-shape {
  7574. display: none;
  7575. }
  7576. }
  7577. .team-section .frame-shape {
  7578. position: absolute;
  7579. top: 45%;
  7580. right: 0;
  7581. animation: rounded 5s linear infinite;
  7582. }
  7583. @media (max-width: 1199px) {
  7584. .team-section .frame-shape {
  7585. display: none;
  7586. }
  7587. }
  7588. .team-items {
  7589. margin-top: 30px;
  7590. }
  7591. .team-items .team-image {
  7592. position: relative;
  7593. }
  7594. .team-items .team-image img {
  7595. width: 100%;
  7596. height: 100%;
  7597. border-radius: 12px;
  7598. }
  7599. .team-items .team-image .shape-img {
  7600. position: absolute;
  7601. bottom: 0;
  7602. left: 0;
  7603. right: 0;
  7604. }
  7605. .team-items .team-image .social-profile {
  7606. position: absolute;
  7607. right: 20px;
  7608. top: 20px;
  7609. content: "";
  7610. -webkit-transition: all 0.4s ease-in-out;
  7611. transition: all 0.4s ease-in-out;
  7612. z-index: 2;
  7613. display: inline-block;
  7614. overflow: hidden;
  7615. z-index: 99;
  7616. }
  7617. .team-items .team-image .social-profile ul {
  7618. transform: translateY(-100px);
  7619. transition: all 0.6s ease-in-out;
  7620. opacity: 0;
  7621. visibility: hidden;
  7622. }
  7623. .team-items .team-image .social-profile ul li {
  7624. margin-bottom: 10px;
  7625. }
  7626. .team-items .team-image .social-profile ul li a {
  7627. width: 40px;
  7628. height: 40px;
  7629. line-height: 43px;
  7630. text-align: center;
  7631. font-size: 18px;
  7632. display: block;
  7633. background: var(--white);
  7634. color: var(--theme);
  7635. -webkit-transition: all 0.4s ease-in-out;
  7636. transition: all 0.4s ease-in-out;
  7637. text-align: center;
  7638. margin: 0 auto;
  7639. border-radius: 50%;
  7640. }
  7641. .team-items .team-image .social-profile ul li a:hover {
  7642. background-color: var(--theme);
  7643. color: var(--white);
  7644. }
  7645. .team-items .team-image .social-profile .plus-btn {
  7646. z-index: 2;
  7647. cursor: pointer;
  7648. width: 40px;
  7649. height: 40px;
  7650. line-height: 40px;
  7651. text-align: center;
  7652. font-size: 18px;
  7653. display: inline-block;
  7654. background: transparent;
  7655. border: 1px solid var(--white);
  7656. color: var(--white);
  7657. transition: all 0.4s ease-in-out;
  7658. border-radius: 50%;
  7659. margin-bottom: 10px;
  7660. }
  7661. .team-items .team-image .social-profile .plus-btn:hover {
  7662. background-color: var(--white);
  7663. color: var(--theme);
  7664. }
  7665. .team-items .team-image .social-profile:hover ul {
  7666. transform: translateY(0);
  7667. opacity: 1;
  7668. visibility: visible;
  7669. }
  7670. .team-items .team-content {
  7671. margin-top: 20px;
  7672. text-align: center;
  7673. }
  7674. .team-items .team-content h3 {
  7675. margin-bottom: 5px;
  7676. }
  7677. .team-items .team-content h3 a:hover {
  7678. color: var(--theme);
  7679. }
  7680. .team-box-items {
  7681. margin-top: 30px;
  7682. text-align: center;
  7683. position: relative;
  7684. z-index: 9;
  7685. }
  7686. .team-box-items::before {
  7687. position: absolute;
  7688. top: 0;
  7689. left: 0;
  7690. right: 0;
  7691. bottom: 0;
  7692. width: 100%;
  7693. height: 100%;
  7694. content: "";
  7695. background-color: var(--white);
  7696. border-radius: 24px;
  7697. z-index: -1;
  7698. top: 35%;
  7699. height: initial;
  7700. }
  7701. .team-box-items .team-image {
  7702. max-width: 300px;
  7703. margin: 0 auto;
  7704. }
  7705. .team-box-items .team-image img {
  7706. width: 100%;
  7707. height: 100%;
  7708. }
  7709. .team-box-items .team-content {
  7710. padding: 20px 50px;
  7711. }
  7712. .team-box-items .team-content p {
  7713. margin-bottom: 15px;
  7714. margin-top: 5px;
  7715. }
  7716. .team-box-items .team-content .social-icon {
  7717. justify-content: center;
  7718. gap: 20px;
  7719. border-top: 1px solid var(--border);
  7720. padding-top: 20px;
  7721. }
  7722. .team-box-items .team-content .social-icon a {
  7723. color: var(--text);
  7724. font-size: 20px;
  7725. }
  7726. .team-box-items .team-content .social-icon a:hover {
  7727. color: var(--theme);
  7728. }
  7729. .team-section-2 {
  7730. position: relative;
  7731. margin-top: 30px;
  7732. }
  7733. .team-section-2 .top-shape {
  7734. position: absolute;
  7735. top: -40px;
  7736. left: 0;
  7737. height: 92px;
  7738. }
  7739. .team-section-2 .top-shape img {
  7740. width: 100%;
  7741. height: 100%;
  7742. object-fit: cover;
  7743. }
  7744. .team-section-2 .love-shape {
  7745. position: absolute;
  7746. bottom: 10%;
  7747. left: 30px;
  7748. }
  7749. @media (max-width: 1399px) {
  7750. .team-section-2 .love-shape {
  7751. left: 30px;
  7752. }
  7753. }
  7754. @media (max-width: 1199px) {
  7755. .team-section-2 .love-shape {
  7756. display: none;
  7757. }
  7758. }
  7759. .team-section-2 .frame-shape {
  7760. position: absolute;
  7761. top: 40%;
  7762. right: 0;
  7763. animation: rounded 5s linear infinite;
  7764. }
  7765. @media (max-width: 1199px) {
  7766. .team-section-2 .frame-shape {
  7767. display: none;
  7768. }
  7769. }
  7770. .team-section-3 {
  7771. position: relative;
  7772. }
  7773. .team-section-3 .tree-shape {
  7774. position: absolute;
  7775. bottom: 15%;
  7776. left: 0;
  7777. }
  7778. .team-section-3 .right-shape {
  7779. position: absolute;
  7780. right: 0;
  7781. top: 10%;
  7782. }
  7783. .team-section-3 .bee-shape {
  7784. position: absolute;
  7785. right: 5%;
  7786. top: 15%;
  7787. transform: translateY(-50%);
  7788. }
  7789. .team-section-4 {
  7790. margin-bottom: -5px;
  7791. }
  7792. .team-details-wrapper .team-author-items {
  7793. display: flex;
  7794. align-items: center;
  7795. gap: 30px;
  7796. padding: 30px;
  7797. border: 1px solid var(--border);
  7798. border-radius: 12px;
  7799. }
  7800. @media (max-width: 1199px) {
  7801. .team-details-wrapper .team-author-items {
  7802. flex-wrap: wrap;
  7803. gap: 20px;
  7804. justify-content: center;
  7805. text-align: center;
  7806. }
  7807. }
  7808. .team-details-wrapper .team-author-items .thumb {
  7809. max-width: 370px;
  7810. }
  7811. .team-details-wrapper .team-author-items .thumb img {
  7812. width: 100%;
  7813. height: 100%;
  7814. border-radius: 10px;
  7815. }
  7816. .team-details-wrapper .team-author-items .content {
  7817. max-width: 700px;
  7818. }
  7819. .team-details-wrapper .team-author-items .content h2 {
  7820. font-size: 30px;
  7821. margin-bottom: 5px;
  7822. }
  7823. @media (max-width: 575px) {
  7824. .team-details-wrapper .team-author-items .content h2 {
  7825. font-size: 26px;
  7826. }
  7827. }
  7828. .team-details-wrapper .team-author-items .content span {
  7829. margin-bottom: 20px;
  7830. display: inline-block;
  7831. }
  7832. @media (max-width: 575px) {
  7833. .team-details-wrapper .team-author-items .content span {
  7834. margin-bottom: 10px;
  7835. }
  7836. }
  7837. .team-details-wrapper .team-author-items .content ul {
  7838. margin-top: 20px;
  7839. display: flex;
  7840. align-items: center;
  7841. gap: 50px;
  7842. border-top: 1px solid var(--border);
  7843. border-bottom: 1px solid var(--border);
  7844. padding: 20px 0;
  7845. }
  7846. @media (max-width: 1199px) {
  7847. .team-details-wrapper .team-author-items .content ul {
  7848. flex-wrap: wrap;
  7849. gap: 15px;
  7850. margin-bottom: 20px;
  7851. margin-top: 20px;
  7852. justify-content: center;
  7853. }
  7854. }
  7855. .team-details-wrapper .team-author-items .content ul li {
  7856. color: var(--header);
  7857. }
  7858. .team-details-wrapper .team-author-items .content ul li i {
  7859. margin-right: 5px;
  7860. }
  7861. .team-details-wrapper .team-author-items .content ul li .color-star {
  7862. color: var(--theme);
  7863. }
  7864. .team-details-wrapper .team-author-items .content .social-icon {
  7865. margin-top: 40px;
  7866. gap: 15px;
  7867. position: relative;
  7868. z-index: 9;
  7869. }
  7870. @media (max-width: 1199px) {
  7871. .team-details-wrapper .team-author-items .content .social-icon {
  7872. justify-content: center;
  7873. margin-top: 30px;
  7874. }
  7875. }
  7876. @media (max-width: 575px) {
  7877. .team-details-wrapper .team-author-items .content .social-icon {
  7878. margin-top: 20px;
  7879. }
  7880. }
  7881. .team-details-wrapper .team-author-items .content .social-icon a {
  7882. width: 36px;
  7883. height: 36px;
  7884. line-height: 36px;
  7885. text-align: center;
  7886. font-size: 16px;
  7887. display: block;
  7888. color: var(--theme);
  7889. transition: all 0.4s ease-in-out;
  7890. text-align: center;
  7891. background-color: transparent;
  7892. border: 1px solid var(--theme);
  7893. }
  7894. .team-details-wrapper .team-author-items .content .social-icon a:hover {
  7895. background-color: var(--theme);
  7896. color: var(--white);
  7897. border: 1px solid transparent;
  7898. }
  7899. .team-details-wrapper .details-info-items {
  7900. padding: 80px 0;
  7901. border-bottom: 1px solid var(--border);
  7902. }
  7903. @media (max-width: 767px) {
  7904. .team-details-wrapper .details-info-items {
  7905. padding: 50px 0;
  7906. }
  7907. }
  7908. @media (max-width: 575px) {
  7909. .team-details-wrapper .details-info-items {
  7910. padding: 40px 0;
  7911. }
  7912. }
  7913. .team-details-wrapper .details-info-items .info-content h2 {
  7914. font-size: 30px;
  7915. margin-bottom: 15px;
  7916. }
  7917. .team-details-wrapper .details-info-items .progress-wrap {
  7918. margin-left: 30px;
  7919. }
  7920. @media (max-width: 991px) {
  7921. .team-details-wrapper .details-info-items .progress-wrap {
  7922. margin-left: 0;
  7923. }
  7924. }
  7925. .team-details-wrapper .details-info-items .progress-wrap .pro-items {
  7926. width: 100%;
  7927. }
  7928. .team-details-wrapper .details-info-items .progress-wrap .pro-items:not(:last-child) {
  7929. margin-bottom: 20px;
  7930. }
  7931. .team-details-wrapper .details-info-items .progress-wrap .pro-items .pro-head {
  7932. display: flex;
  7933. align-items: center;
  7934. justify-content: space-between;
  7935. margin-bottom: 10px;
  7936. }
  7937. .team-details-wrapper .details-info-items .progress-wrap .pro-items .pro-head .title {
  7938. font-size: 16px;
  7939. color: var(--header);
  7940. }
  7941. .team-details-wrapper .details-info-items .progress-wrap .pro-items .pro-head .point {
  7942. font-size: 16px;
  7943. color: var(--header);
  7944. }
  7945. .team-details-wrapper .details-info-items .progress-wrap .pro-items .progress {
  7946. background: var(--bg2);
  7947. justify-content: flex-start;
  7948. border-radius: 100px;
  7949. align-items: center;
  7950. position: relative;
  7951. display: flex;
  7952. height: 8px;
  7953. width: 100%;
  7954. }
  7955. .team-details-wrapper .details-info-items .progress-wrap .pro-items .progress-value {
  7956. animation: load 3s normal forwards;
  7957. border-radius: 0;
  7958. background: var(--theme);
  7959. height: 8px;
  7960. width: 0;
  7961. }
  7962. .team-details-wrapper .details-info-items .progress-wrap .pro-items .style-two {
  7963. animation: load2 3s normal forwards;
  7964. }
  7965. .team-details-wrapper .details-info-items .progress-wrap .pro-items .style-three {
  7966. animation: load3 3s normal forwards;
  7967. }
  7968. @keyframes load {
  7969. 0% {
  7970. width: 0;
  7971. }
  7972. 100% {
  7973. width: 90%;
  7974. }
  7975. }
  7976. @keyframes load2 {
  7977. 0% {
  7978. width: 0;
  7979. }
  7980. 100% {
  7981. width: 70%;
  7982. }
  7983. }
  7984. @keyframes load3 {
  7985. 0% {
  7986. width: 0;
  7987. }
  7988. 100% {
  7989. width: 55%;
  7990. }
  7991. }
  7992. .testimonial-section {
  7993. position: relative;
  7994. }
  7995. .testimonial-section .tree-shape {
  7996. position: absolute;
  7997. left: 0;
  7998. bottom: 50px;
  7999. }
  8000. .testimonial-section .right-shape {
  8001. position: absolute;
  8002. right: 0;
  8003. top: 50%;
  8004. transform: translateY(-50%);
  8005. }
  8006. .testimonial-section .bee-shape {
  8007. position: absolute;
  8008. right: 5%;
  8009. top: 45%;
  8010. transform: translateY(-50%);
  8011. }
  8012. .testimonial-section .love-shape {
  8013. position: absolute;
  8014. top: 50%;
  8015. left: 0;
  8016. animation: rounded 5s linear infinite;
  8017. }
  8018. .testimonial-section .pencil-shape {
  8019. position: absolute;
  8020. top: 50%;
  8021. left: 2%;
  8022. animation: rounded 5s linear infinite;
  8023. }
  8024. .testimonial-section .girl-shape {
  8025. position: absolute;
  8026. top: 30%;
  8027. right: 0;
  8028. }
  8029. .testimonial-items {
  8030. position: relative;
  8031. z-index: 9;
  8032. max-width: 420px;
  8033. padding: 55px 60px;
  8034. text-align: center;
  8035. margin: 30px auto;
  8036. }
  8037. .testimonial-items::after {
  8038. width: 0;
  8039. height: 0;
  8040. border-top: 20px solid var(--theme2);
  8041. border-right: 16px solid transparent;
  8042. content: "";
  8043. left: 60px;
  8044. position: absolute;
  8045. bottom: -10px;
  8046. transform: rotate(0deg);
  8047. }
  8048. .testimonial-items.style-2::after {
  8049. border-top: 20px solid var(--theme);
  8050. }
  8051. .testimonial-items.style-3::after {
  8052. border-top: 20px solid var(--header);
  8053. }
  8054. .testimonial-items .icon {
  8055. position: absolute;
  8056. top: -30px;
  8057. right: 30px;
  8058. }
  8059. .testimonial-items .testimonial-bg {
  8060. position: absolute;
  8061. top: 0;
  8062. left: 0;
  8063. background-color: var(--theme2);
  8064. transition: all 500ms ease;
  8065. mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 371 216"><path d="M29.5383 22.3807C20.9831 23.0067 13.019 27.0757 7.48934 33.6486C1.95971 40.2216 -0.683385 48.7421 0.151277 57.2974L12.2539 180.236C13.8189 196.199 27.0343 208.51 43.1016 208.962L298.091 215.987C312.941 216.405 326.086 206.493 329.808 192.13L369.245 39.8738C371.819 29.9274 369.454 19.355 362.881 11.4605C356.308 3.56603 346.327 -0.676823 336.102 0.0882826L29.5383 22.3807Z" /></svg>');
  8066. mask-repeat: no-repeat;
  8067. mask-position: center center;
  8068. mask-size: cover;
  8069. width: 100%;
  8070. height: 100%;
  8071. z-index: -1;
  8072. }
  8073. .testimonial-items .testimonial-bg.bg-2 {
  8074. background-color: var(--theme);
  8075. }
  8076. .testimonial-items .testimonial-bg.bg-3 {
  8077. background-color: var(--header);
  8078. }
  8079. .testimonial-items .testimonial-content {
  8080. position: relative;
  8081. }
  8082. .testimonial-items .testimonial-content p {
  8083. color: var(--white);
  8084. }
  8085. .testimonial-items .testimonial-content h6 {
  8086. color: var(--white);
  8087. margin-top: 20px;
  8088. position: relative;
  8089. display: inline-block;
  8090. }
  8091. .testimonial-items .testimonial-content h6::before {
  8092. position: absolute;
  8093. top: 10px;
  8094. left: -40px;
  8095. content: "";
  8096. width: 24px;
  8097. height: 2px;
  8098. background-color: var(--white);
  8099. }
  8100. .testimonial-section-2 {
  8101. position: relative;
  8102. }
  8103. .testimonial-section-2 .zebra-shape {
  8104. position: absolute;
  8105. top: 50%;
  8106. right: 0;
  8107. transform: translateY(-50%);
  8108. }
  8109. .testimonial-section-2 .left-shape {
  8110. position: absolute;
  8111. left: 0;
  8112. bottom: 20%;
  8113. }
  8114. .testimonial-wrapper {
  8115. position: relative;
  8116. z-index: 9;
  8117. }
  8118. @media (max-width: 1199px) {
  8119. .testimonial-wrapper .array-button {
  8120. display: none;
  8121. }
  8122. }
  8123. .testimonial-wrapper .array-button .array-prev {
  8124. position: absolute;
  8125. top: 50%;
  8126. left: -15px;
  8127. transform: translateY(-50%);
  8128. z-index: 99;
  8129. background-color: var(--theme2);
  8130. color: var(--white);
  8131. border: 2px solid var(--white);
  8132. }
  8133. .testimonial-wrapper .array-button .array-prev:hover {
  8134. background-color: var(--theme);
  8135. }
  8136. .testimonial-wrapper .array-button .array-next {
  8137. position: absolute;
  8138. top: 50%;
  8139. right: 10px;
  8140. transform: translateY(-50%);
  8141. z-index: 99;
  8142. background-color: var(--theme);
  8143. color: var(--white);
  8144. border: 2px solid var(--white);
  8145. }
  8146. .testimonial-wrapper .array-button .array-next:hover {
  8147. background-color: var(--theme2);
  8148. }
  8149. .testimonial-wrapper .shape-1 {
  8150. position: absolute;
  8151. top: 80px;
  8152. left: 80px;
  8153. }
  8154. @media (max-width: 991px) {
  8155. .testimonial-wrapper .shape-1 {
  8156. display: none;
  8157. }
  8158. }
  8159. .testimonial-wrapper .shape-2 {
  8160. position: absolute;
  8161. bottom: 80px;
  8162. right: 150px;
  8163. }
  8164. @media (max-width: 991px) {
  8165. .testimonial-wrapper .shape-2 {
  8166. display: none;
  8167. }
  8168. }
  8169. .testimonial-wrapper .testimonial-bg {
  8170. position: absolute;
  8171. top: 0;
  8172. left: 0;
  8173. background-color: var(--bg2);
  8174. transition: all 500ms ease;
  8175. mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1170 520"><path d="M87.3898 28.5081C60.3657 30.0652 30.9339 38.7742 15.916 59.8231C0.898128 80.8719 -1.73756 121.246 0.898944 142.527L39.1283 448.337C44.0717 488.044 85.2474 507.875 136 509L976.649 519.793C1023.56 520.831 1082.11 519.574 1094.61 476.369L1166.78 99.186C1174.91 74.4444 1167.44 48.1456 1146.68 28.5081C1125.91 8.8705 1094.39 -1.6836 1062.09 0.219603L87.3898 28.5081Z" /></svg>');
  8176. mask-repeat: no-repeat;
  8177. mask-position: center center;
  8178. mask-size: cover;
  8179. width: 100%;
  8180. height: 100%;
  8181. z-index: -1;
  8182. }
  8183. .testimonial-wrapper .testimonial-box-items {
  8184. max-width: 800px;
  8185. margin: 0 auto;
  8186. text-align: center;
  8187. padding-top: 15px;
  8188. }
  8189. @media (max-width: 991px) {
  8190. .testimonial-wrapper .testimonial-box-items {
  8191. padding: 15px 40px;
  8192. }
  8193. }
  8194. @media (max-width: 575px) {
  8195. .testimonial-wrapper .testimonial-box-items {
  8196. padding: 15px 30px;
  8197. }
  8198. }
  8199. .testimonial-wrapper .testimonial-box-items p {
  8200. font-size: 20px;
  8201. }
  8202. @media (max-width: 575px) {
  8203. .testimonial-wrapper .testimonial-box-items p {
  8204. font-size: 18px;
  8205. }
  8206. }
  8207. .testimonial-wrapper .testimonial-box-items .client-info {
  8208. display: flex;
  8209. align-items: center;
  8210. gap: 15px;
  8211. justify-content: center;
  8212. margin-top: 40px;
  8213. }
  8214. @media (max-width: 767px) {
  8215. .testimonial-wrapper .testimonial-box-items .client-info {
  8216. margin-top: 30px;
  8217. }
  8218. }
  8219. @media (max-width: 575px) {
  8220. .testimonial-wrapper .testimonial-box-items .client-info {
  8221. margin-top: 20px;
  8222. }
  8223. }
  8224. .testimonial-wrapper .testimonial-box-items .client-info .content {
  8225. text-align: left;
  8226. }
  8227. .testimonial-wrapper .testimonial-box-items .client-info .content h5 {
  8228. margin-bottom: 5px;
  8229. }
  8230. .testimonial-wrapper.style-2 {
  8231. margin-top: -10px;
  8232. }
  8233. .testimonial-wrapper-2 {
  8234. margin-bottom: -10px;
  8235. position: relative;
  8236. }
  8237. @media (max-width: 991px) {
  8238. .testimonial-wrapper-2 {
  8239. text-align: center;
  8240. margin: 0 auto;
  8241. }
  8242. }
  8243. .testimonial-wrapper-2 .array-button {
  8244. position: absolute;
  8245. bottom: 25%;
  8246. right: 0;
  8247. display: grid;
  8248. gap: 12px;
  8249. z-index: 99;
  8250. }
  8251. @media (max-width: 1399px) {
  8252. .testimonial-wrapper-2 .array-button {
  8253. display: none;
  8254. }
  8255. }
  8256. .testimonial-wrapper-2 .array-button .array-prev {
  8257. border: 1.5px solid var(--theme);
  8258. height: 55px;
  8259. width: 50px;
  8260. line-height: 55px;
  8261. line-height: 44px;
  8262. }
  8263. .testimonial-wrapper-2 .array-button .array-next {
  8264. height: 55px;
  8265. width: 50px;
  8266. line-height: 55px;
  8267. line-height: 44px;
  8268. }
  8269. .testimonial-wrapper-2 .array-button .array-next:hover {
  8270. border: 1.5px solid var(--theme);
  8271. }
  8272. .testimonial-wrapper-2 .testimonial-image img {
  8273. width: 100%;
  8274. height: 100%;
  8275. }
  8276. .testimonial-wrapper-2 .testimonial-content {
  8277. position: relative;
  8278. }
  8279. .testimonial-wrapper-2 .testimonial-content .star {
  8280. margin-bottom: 20px;
  8281. }
  8282. .testimonial-wrapper-2 .testimonial-content .star i {
  8283. color: var(--theme);
  8284. }
  8285. .testimonial-wrapper-2 .testimonial-content .star .color-star {
  8286. color: var(--text);
  8287. }
  8288. .testimonial-wrapper-2 .testimonial-content p {
  8289. font-size: 18px;
  8290. max-width: 500px;
  8291. }
  8292. @media (max-width: 991px) {
  8293. .testimonial-wrapper-2 .testimonial-content p {
  8294. text-align: center;
  8295. margin: 0 auto;
  8296. }
  8297. }
  8298. .testimonial-wrapper-2 .testimonial-content .client-info {
  8299. display: flex;
  8300. align-items: center;
  8301. gap: 15px;
  8302. margin-top: 25px;
  8303. }
  8304. @media (max-width: 991px) {
  8305. .testimonial-wrapper-2 .testimonial-content .client-info {
  8306. justify-content: center;
  8307. }
  8308. }
  8309. @media (max-width: 575px) {
  8310. .testimonial-wrapper-2 .testimonial-content .client-info {
  8311. margin-top: 20px;
  8312. }
  8313. }
  8314. .testimonial-wrapper-2 .testimonial-content .client-info .content h5 {
  8315. margin-bottom: 5px;
  8316. }
  8317. @media (max-width: 991px) {
  8318. .testimonial-wrapper-2 .testimonial-content .client-info .content h5 {
  8319. text-align: left;
  8320. }
  8321. }
  8322. @media (max-width: 991px) {
  8323. .testimonial-wrapper-2 .testimonial-content .client-info .content p {
  8324. text-align: left;
  8325. }
  8326. }
  8327. .testimonial-wrapper-2 .testimonial-content .icon {
  8328. position: absolute;
  8329. bottom: -5%;
  8330. right: 20%;
  8331. }
  8332. @media (max-width: 767px) {
  8333. .testimonial-wrapper-2 .testimonial-content .icon {
  8334. right: 10%;
  8335. }
  8336. }
  8337. .testimonial-wrapper-2 .testimonial-right {
  8338. margin-left: 50px;
  8339. }
  8340. @media (max-width: 1199px) {
  8341. .testimonial-wrapper-2 .testimonial-right {
  8342. margin-left: 25px;
  8343. }
  8344. }
  8345. @media (max-width: 991px) {
  8346. .testimonial-wrapper-2 .testimonial-right {
  8347. margin-left: 0;
  8348. }
  8349. }/*# sourceMappingURL=main.css.map */