style.css 448 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439244024412442244324442445244624472448244924502451245224532454245524562457245824592460246124622463246424652466246724682469247024712472247324742475247624772478247924802481248224832484248524862487248824892490249124922493249424952496249724982499250025012502250325042505250625072508250925102511251225132514251525162517251825192520252125222523252425252526252725282529253025312532253325342535253625372538253925402541254225432544254525462547254825492550255125522553255425552556255725582559256025612562256325642565256625672568256925702571257225732574257525762577257825792580258125822583258425852586258725882589259025912592259325942595259625972598259926002601260226032604260526062607260826092610261126122613261426152616261726182619262026212622262326242625262626272628262926302631263226332634263526362637263826392640264126422643264426452646264726482649265026512652265326542655265626572658265926602661266226632664266526662667266826692670267126722673267426752676267726782679268026812682268326842685268626872688268926902691269226932694269526962697269826992700270127022703270427052706270727082709271027112712271327142715271627172718271927202721272227232724272527262727272827292730273127322733273427352736273727382739274027412742274327442745274627472748274927502751275227532754275527562757275827592760276127622763276427652766276727682769277027712772277327742775277627772778277927802781278227832784278527862787278827892790279127922793279427952796279727982799280028012802280328042805280628072808280928102811281228132814281528162817281828192820282128222823282428252826282728282829283028312832283328342835283628372838283928402841284228432844284528462847284828492850285128522853285428552856285728582859286028612862286328642865286628672868286928702871287228732874287528762877287828792880288128822883288428852886288728882889289028912892289328942895289628972898289929002901290229032904290529062907290829092910291129122913291429152916291729182919292029212922292329242925292629272928292929302931293229332934293529362937293829392940294129422943294429452946294729482949295029512952295329542955295629572958295929602961296229632964296529662967296829692970297129722973297429752976297729782979298029812982298329842985298629872988298929902991299229932994299529962997299829993000300130023003300430053006300730083009301030113012301330143015301630173018301930203021302230233024302530263027302830293030303130323033303430353036303730383039304030413042304330443045304630473048304930503051305230533054305530563057305830593060306130623063306430653066306730683069307030713072307330743075307630773078307930803081308230833084308530863087308830893090309130923093309430953096309730983099310031013102310331043105310631073108310931103111311231133114311531163117311831193120312131223123312431253126312731283129313031313132313331343135313631373138313931403141314231433144314531463147314831493150315131523153315431553156315731583159316031613162316331643165316631673168316931703171317231733174317531763177317831793180318131823183318431853186318731883189319031913192319331943195319631973198319932003201320232033204320532063207320832093210321132123213321432153216321732183219322032213222322332243225322632273228322932303231323232333234323532363237323832393240324132423243324432453246324732483249325032513252325332543255325632573258325932603261326232633264326532663267326832693270327132723273327432753276327732783279328032813282328332843285328632873288328932903291329232933294329532963297329832993300330133023303330433053306330733083309331033113312331333143315331633173318331933203321332233233324332533263327332833293330333133323333333433353336333733383339334033413342334333443345334633473348334933503351335233533354335533563357335833593360336133623363336433653366336733683369337033713372337333743375337633773378337933803381338233833384338533863387338833893390339133923393339433953396339733983399340034013402340334043405340634073408340934103411341234133414341534163417341834193420342134223423342434253426342734283429343034313432343334343435343634373438343934403441344234433444344534463447344834493450345134523453345434553456345734583459346034613462346334643465346634673468346934703471347234733474347534763477347834793480348134823483348434853486348734883489349034913492349334943495349634973498349935003501350235033504350535063507350835093510351135123513351435153516351735183519352035213522352335243525352635273528352935303531353235333534353535363537353835393540354135423543354435453546354735483549355035513552355335543555355635573558355935603561356235633564356535663567356835693570357135723573357435753576357735783579358035813582358335843585358635873588358935903591359235933594359535963597359835993600360136023603360436053606360736083609361036113612361336143615361636173618361936203621362236233624362536263627362836293630363136323633363436353636363736383639364036413642364336443645364636473648364936503651365236533654365536563657365836593660366136623663366436653666366736683669367036713672367336743675367636773678367936803681368236833684368536863687368836893690369136923693369436953696369736983699370037013702370337043705370637073708370937103711371237133714371537163717371837193720372137223723372437253726372737283729373037313732373337343735373637373738373937403741374237433744374537463747374837493750375137523753375437553756375737583759376037613762376337643765376637673768376937703771377237733774377537763777377837793780378137823783378437853786378737883789379037913792379337943795379637973798379938003801380238033804380538063807380838093810381138123813381438153816381738183819382038213822382338243825382638273828382938303831383238333834383538363837383838393840384138423843384438453846384738483849385038513852385338543855385638573858385938603861386238633864386538663867386838693870387138723873387438753876387738783879388038813882388338843885388638873888388938903891389238933894389538963897389838993900390139023903390439053906390739083909391039113912391339143915391639173918391939203921392239233924392539263927392839293930393139323933393439353936393739383939394039413942394339443945394639473948394939503951395239533954395539563957395839593960396139623963396439653966396739683969397039713972397339743975397639773978397939803981398239833984398539863987398839893990399139923993399439953996399739983999400040014002400340044005400640074008400940104011401240134014401540164017401840194020402140224023402440254026402740284029403040314032403340344035403640374038403940404041404240434044404540464047404840494050405140524053405440554056405740584059406040614062406340644065406640674068406940704071407240734074407540764077407840794080408140824083408440854086408740884089409040914092409340944095409640974098409941004101410241034104410541064107410841094110411141124113411441154116411741184119412041214122412341244125412641274128412941304131413241334134413541364137413841394140414141424143414441454146414741484149415041514152415341544155415641574158415941604161416241634164416541664167416841694170417141724173417441754176417741784179418041814182418341844185418641874188418941904191419241934194419541964197419841994200420142024203420442054206420742084209421042114212421342144215421642174218421942204221422242234224422542264227422842294230423142324233423442354236423742384239424042414242424342444245424642474248424942504251425242534254425542564257425842594260426142624263426442654266426742684269427042714272427342744275427642774278427942804281428242834284428542864287428842894290429142924293429442954296429742984299430043014302430343044305430643074308430943104311431243134314431543164317431843194320432143224323432443254326432743284329433043314332433343344335433643374338433943404341434243434344434543464347434843494350435143524353435443554356435743584359436043614362436343644365436643674368436943704371437243734374437543764377437843794380438143824383438443854386438743884389439043914392439343944395439643974398439944004401440244034404440544064407440844094410441144124413441444154416441744184419442044214422442344244425442644274428442944304431443244334434443544364437443844394440444144424443444444454446444744484449445044514452445344544455445644574458445944604461446244634464446544664467446844694470447144724473447444754476447744784479448044814482448344844485448644874488448944904491449244934494449544964497449844994500450145024503450445054506450745084509451045114512451345144515451645174518451945204521452245234524452545264527452845294530453145324533453445354536453745384539454045414542454345444545454645474548454945504551455245534554455545564557455845594560456145624563456445654566456745684569457045714572457345744575457645774578457945804581458245834584458545864587458845894590459145924593459445954596459745984599460046014602460346044605460646074608460946104611461246134614461546164617461846194620462146224623462446254626462746284629463046314632463346344635463646374638463946404641464246434644464546464647464846494650465146524653465446554656465746584659466046614662466346644665466646674668466946704671467246734674467546764677467846794680468146824683468446854686468746884689469046914692469346944695469646974698469947004701470247034704470547064707470847094710471147124713471447154716471747184719472047214722472347244725472647274728472947304731473247334734473547364737473847394740474147424743474447454746474747484749475047514752475347544755475647574758475947604761476247634764476547664767476847694770477147724773477447754776477747784779478047814782478347844785478647874788478947904791479247934794479547964797479847994800480148024803480448054806480748084809481048114812481348144815481648174818481948204821482248234824482548264827482848294830483148324833483448354836483748384839484048414842484348444845484648474848484948504851485248534854485548564857485848594860486148624863486448654866486748684869487048714872487348744875487648774878487948804881488248834884488548864887488848894890489148924893489448954896489748984899490049014902490349044905490649074908490949104911491249134914491549164917491849194920492149224923492449254926492749284929493049314932493349344935493649374938493949404941494249434944494549464947494849494950495149524953495449554956495749584959496049614962496349644965496649674968496949704971497249734974497549764977497849794980498149824983498449854986498749884989499049914992499349944995499649974998499950005001500250035004500550065007500850095010501150125013501450155016501750185019502050215022502350245025502650275028502950305031503250335034503550365037503850395040504150425043504450455046504750485049505050515052505350545055505650575058505950605061506250635064506550665067506850695070507150725073507450755076507750785079508050815082508350845085508650875088508950905091509250935094509550965097509850995100510151025103510451055106510751085109511051115112511351145115511651175118511951205121512251235124512551265127512851295130513151325133513451355136513751385139514051415142514351445145514651475148514951505151515251535154515551565157515851595160516151625163516451655166516751685169517051715172517351745175517651775178517951805181518251835184518551865187518851895190519151925193519451955196519751985199520052015202520352045205520652075208520952105211521252135214521552165217521852195220522152225223522452255226522752285229523052315232523352345235523652375238523952405241524252435244524552465247524852495250525152525253525452555256525752585259526052615262526352645265526652675268526952705271527252735274527552765277527852795280528152825283528452855286528752885289529052915292529352945295529652975298529953005301530253035304530553065307530853095310531153125313531453155316531753185319532053215322532353245325532653275328532953305331533253335334533553365337533853395340534153425343534453455346534753485349535053515352535353545355535653575358535953605361536253635364536553665367536853695370537153725373537453755376537753785379538053815382538353845385538653875388538953905391539253935394539553965397539853995400540154025403540454055406540754085409541054115412541354145415541654175418541954205421542254235424542554265427542854295430543154325433543454355436543754385439544054415442544354445445544654475448544954505451545254535454545554565457545854595460546154625463546454655466546754685469547054715472547354745475547654775478547954805481548254835484548554865487548854895490549154925493549454955496549754985499550055015502550355045505550655075508550955105511551255135514551555165517551855195520552155225523552455255526552755285529553055315532553355345535553655375538553955405541554255435544554555465547554855495550555155525553555455555556555755585559556055615562556355645565556655675568556955705571557255735574557555765577557855795580558155825583558455855586558755885589559055915592559355945595559655975598559956005601560256035604560556065607560856095610561156125613561456155616561756185619562056215622562356245625562656275628562956305631563256335634563556365637563856395640564156425643564456455646564756485649565056515652565356545655565656575658565956605661566256635664566556665667566856695670567156725673567456755676567756785679568056815682568356845685568656875688568956905691569256935694569556965697569856995700570157025703570457055706570757085709571057115712571357145715571657175718571957205721572257235724572557265727572857295730573157325733573457355736573757385739574057415742574357445745574657475748574957505751575257535754575557565757575857595760576157625763576457655766576757685769577057715772577357745775577657775778577957805781578257835784578557865787578857895790579157925793579457955796579757985799580058015802580358045805580658075808580958105811581258135814581558165817581858195820582158225823582458255826582758285829583058315832583358345835583658375838583958405841584258435844584558465847584858495850585158525853585458555856585758585859586058615862586358645865586658675868586958705871587258735874587558765877587858795880588158825883588458855886588758885889589058915892589358945895589658975898589959005901590259035904590559065907590859095910591159125913591459155916591759185919592059215922592359245925592659275928592959305931593259335934593559365937593859395940594159425943594459455946594759485949595059515952595359545955595659575958595959605961596259635964596559665967596859695970597159725973597459755976597759785979598059815982598359845985598659875988598959905991599259935994599559965997599859996000600160026003600460056006600760086009601060116012601360146015601660176018601960206021602260236024602560266027602860296030603160326033603460356036603760386039604060416042604360446045604660476048604960506051605260536054605560566057605860596060606160626063606460656066606760686069607060716072607360746075607660776078607960806081608260836084608560866087608860896090609160926093609460956096609760986099610061016102610361046105610661076108610961106111611261136114611561166117611861196120612161226123612461256126612761286129613061316132613361346135613661376138613961406141614261436144614561466147614861496150615161526153615461556156615761586159616061616162616361646165616661676168616961706171617261736174617561766177617861796180618161826183618461856186618761886189619061916192619361946195619661976198619962006201620262036204620562066207620862096210621162126213621462156216621762186219622062216222622362246225622662276228622962306231623262336234623562366237623862396240624162426243624462456246624762486249625062516252625362546255625662576258625962606261626262636264626562666267626862696270627162726273627462756276627762786279628062816282628362846285628662876288628962906291629262936294629562966297629862996300630163026303630463056306630763086309631063116312631363146315631663176318631963206321632263236324632563266327632863296330633163326333633463356336633763386339634063416342634363446345634663476348634963506351635263536354635563566357635863596360636163626363636463656366636763686369637063716372637363746375637663776378637963806381638263836384638563866387638863896390639163926393639463956396639763986399640064016402640364046405640664076408640964106411641264136414641564166417641864196420642164226423642464256426642764286429643064316432643364346435643664376438643964406441644264436444644564466447644864496450645164526453645464556456645764586459646064616462646364646465646664676468646964706471647264736474647564766477647864796480648164826483648464856486648764886489649064916492649364946495649664976498649965006501650265036504650565066507650865096510651165126513651465156516651765186519652065216522652365246525652665276528652965306531653265336534653565366537653865396540654165426543654465456546654765486549655065516552655365546555655665576558655965606561656265636564656565666567656865696570657165726573657465756576657765786579658065816582658365846585658665876588658965906591659265936594659565966597659865996600660166026603660466056606660766086609661066116612661366146615661666176618661966206621662266236624662566266627662866296630663166326633663466356636663766386639664066416642664366446645664666476648664966506651665266536654665566566657665866596660666166626663666466656666666766686669667066716672667366746675667666776678667966806681668266836684668566866687668866896690669166926693669466956696669766986699670067016702670367046705670667076708670967106711671267136714671567166717671867196720672167226723672467256726672767286729673067316732673367346735673667376738673967406741674267436744674567466747674867496750675167526753675467556756675767586759676067616762676367646765676667676768676967706771677267736774677567766777677867796780678167826783678467856786678767886789679067916792679367946795679667976798679968006801680268036804680568066807680868096810681168126813681468156816681768186819682068216822682368246825682668276828682968306831683268336834683568366837683868396840684168426843684468456846684768486849685068516852685368546855685668576858685968606861686268636864686568666867686868696870687168726873687468756876687768786879688068816882688368846885688668876888688968906891689268936894689568966897689868996900690169026903690469056906690769086909691069116912691369146915691669176918691969206921692269236924692569266927692869296930693169326933693469356936693769386939694069416942694369446945694669476948694969506951695269536954695569566957695869596960696169626963696469656966696769686969697069716972697369746975697669776978697969806981698269836984698569866987698869896990699169926993699469956996699769986999700070017002700370047005700670077008700970107011701270137014701570167017701870197020702170227023702470257026702770287029703070317032703370347035703670377038703970407041704270437044704570467047704870497050705170527053705470557056705770587059706070617062706370647065706670677068706970707071707270737074707570767077707870797080708170827083708470857086708770887089709070917092709370947095709670977098709971007101710271037104710571067107710871097110711171127113711471157116711771187119712071217122712371247125712671277128712971307131713271337134713571367137713871397140714171427143714471457146714771487149715071517152715371547155715671577158715971607161716271637164716571667167716871697170717171727173717471757176717771787179718071817182718371847185718671877188718971907191719271937194719571967197719871997200720172027203720472057206720772087209721072117212721372147215721672177218721972207221722272237224722572267227722872297230723172327233723472357236723772387239724072417242724372447245724672477248724972507251725272537254725572567257725872597260726172627263726472657266726772687269727072717272727372747275727672777278727972807281728272837284728572867287728872897290729172927293729472957296729772987299730073017302730373047305730673077308730973107311731273137314731573167317731873197320732173227323732473257326732773287329733073317332733373347335733673377338733973407341734273437344734573467347734873497350735173527353735473557356735773587359736073617362736373647365736673677368736973707371737273737374737573767377737873797380738173827383738473857386738773887389739073917392739373947395739673977398739974007401740274037404740574067407740874097410741174127413741474157416741774187419742074217422742374247425742674277428742974307431743274337434743574367437743874397440744174427443744474457446744774487449745074517452745374547455745674577458745974607461746274637464746574667467746874697470747174727473747474757476747774787479748074817482748374847485748674877488748974907491749274937494749574967497749874997500750175027503750475057506750775087509751075117512751375147515751675177518751975207521752275237524752575267527752875297530753175327533753475357536753775387539754075417542754375447545754675477548754975507551755275537554755575567557755875597560756175627563756475657566756775687569757075717572757375747575757675777578757975807581758275837584758575867587758875897590759175927593759475957596759775987599760076017602760376047605760676077608760976107611761276137614761576167617761876197620762176227623762476257626762776287629763076317632763376347635763676377638763976407641764276437644764576467647764876497650765176527653765476557656765776587659766076617662766376647665766676677668766976707671767276737674767576767677767876797680768176827683768476857686768776887689769076917692769376947695769676977698769977007701770277037704770577067707770877097710771177127713771477157716771777187719772077217722772377247725772677277728772977307731773277337734773577367737773877397740774177427743774477457746774777487749775077517752775377547755775677577758775977607761776277637764776577667767776877697770777177727773777477757776777777787779778077817782778377847785778677877788778977907791779277937794779577967797779877997800780178027803780478057806780778087809781078117812781378147815781678177818781978207821782278237824782578267827782878297830783178327833783478357836783778387839784078417842784378447845784678477848784978507851785278537854785578567857785878597860786178627863786478657866786778687869787078717872787378747875787678777878787978807881788278837884788578867887788878897890789178927893789478957896789778987899790079017902790379047905790679077908790979107911791279137914791579167917791879197920792179227923792479257926792779287929793079317932793379347935793679377938793979407941794279437944794579467947794879497950795179527953795479557956795779587959796079617962796379647965796679677968796979707971797279737974797579767977797879797980798179827983798479857986798779887989799079917992799379947995799679977998799980008001800280038004800580068007800880098010801180128013801480158016801780188019802080218022802380248025802680278028802980308031803280338034803580368037803880398040804180428043804480458046804780488049805080518052805380548055805680578058805980608061806280638064806580668067806880698070807180728073807480758076807780788079808080818082808380848085808680878088808980908091809280938094809580968097809880998100810181028103810481058106810781088109811081118112811381148115811681178118811981208121812281238124812581268127812881298130813181328133813481358136813781388139814081418142814381448145814681478148814981508151815281538154815581568157815881598160816181628163816481658166816781688169817081718172817381748175817681778178817981808181818281838184818581868187818881898190819181928193819481958196819781988199820082018202820382048205820682078208820982108211821282138214821582168217821882198220822182228223822482258226822782288229823082318232823382348235823682378238823982408241824282438244824582468247824882498250825182528253825482558256825782588259826082618262826382648265826682678268826982708271827282738274827582768277827882798280828182828283828482858286828782888289829082918292829382948295829682978298829983008301830283038304830583068307830883098310831183128313831483158316831783188319832083218322832383248325832683278328832983308331833283338334833583368337833883398340834183428343834483458346834783488349835083518352835383548355835683578358835983608361836283638364836583668367836883698370837183728373837483758376837783788379838083818382838383848385838683878388838983908391839283938394839583968397839883998400840184028403840484058406840784088409841084118412841384148415841684178418841984208421842284238424842584268427842884298430843184328433843484358436843784388439844084418442844384448445844684478448844984508451845284538454845584568457845884598460846184628463846484658466846784688469847084718472847384748475847684778478847984808481848284838484848584868487848884898490849184928493849484958496849784988499850085018502850385048505850685078508850985108511851285138514851585168517851885198520852185228523852485258526852785288529853085318532853385348535853685378538853985408541854285438544854585468547854885498550855185528553855485558556855785588559856085618562856385648565856685678568856985708571857285738574857585768577857885798580858185828583858485858586858785888589859085918592859385948595859685978598859986008601860286038604860586068607860886098610861186128613861486158616861786188619862086218622862386248625862686278628862986308631863286338634863586368637863886398640864186428643864486458646864786488649865086518652865386548655865686578658865986608661866286638664866586668667866886698670867186728673867486758676867786788679868086818682868386848685868686878688868986908691869286938694869586968697869886998700870187028703870487058706870787088709871087118712871387148715871687178718871987208721872287238724872587268727872887298730873187328733873487358736873787388739874087418742874387448745874687478748874987508751875287538754875587568757875887598760876187628763876487658766876787688769877087718772877387748775877687778778877987808781878287838784878587868787878887898790879187928793879487958796879787988799880088018802880388048805880688078808880988108811881288138814881588168817881888198820882188228823882488258826882788288829883088318832883388348835883688378838883988408841884288438844884588468847884888498850885188528853885488558856885788588859886088618862886388648865886688678868886988708871887288738874887588768877887888798880888188828883888488858886888788888889889088918892889388948895889688978898889989008901890289038904890589068907890889098910891189128913891489158916891789188919892089218922892389248925892689278928892989308931893289338934893589368937893889398940894189428943894489458946894789488949895089518952895389548955895689578958895989608961896289638964896589668967896889698970897189728973897489758976897789788979898089818982898389848985898689878988898989908991899289938994899589968997899889999000900190029003900490059006900790089009901090119012901390149015901690179018901990209021902290239024902590269027902890299030903190329033903490359036903790389039904090419042904390449045904690479048904990509051905290539054905590569057905890599060906190629063906490659066906790689069907090719072907390749075907690779078907990809081908290839084908590869087908890899090909190929093909490959096909790989099910091019102910391049105910691079108910991109111911291139114911591169117911891199120912191229123912491259126912791289129913091319132913391349135913691379138913991409141914291439144914591469147914891499150915191529153915491559156915791589159916091619162916391649165916691679168916991709171917291739174917591769177917891799180918191829183918491859186918791889189919091919192919391949195919691979198919992009201920292039204920592069207920892099210921192129213921492159216921792189219922092219222922392249225922692279228922992309231923292339234923592369237923892399240924192429243924492459246924792489249925092519252925392549255925692579258925992609261926292639264926592669267926892699270927192729273927492759276927792789279928092819282928392849285928692879288928992909291929292939294929592969297929892999300930193029303930493059306930793089309931093119312931393149315931693179318931993209321932293239324932593269327932893299330933193329333933493359336933793389339934093419342934393449345934693479348934993509351935293539354935593569357935893599360936193629363936493659366936793689369937093719372937393749375937693779378937993809381938293839384938593869387938893899390939193929393939493959396939793989399940094019402940394049405940694079408940994109411941294139414941594169417941894199420942194229423942494259426942794289429943094319432943394349435943694379438943994409441944294439444944594469447944894499450945194529453945494559456945794589459946094619462946394649465946694679468946994709471947294739474947594769477947894799480948194829483948494859486948794889489949094919492949394949495949694979498949995009501950295039504950595069507950895099510951195129513951495159516951795189519952095219522952395249525952695279528952995309531953295339534953595369537953895399540954195429543954495459546954795489549955095519552955395549555955695579558955995609561956295639564956595669567956895699570957195729573957495759576957795789579958095819582958395849585958695879588958995909591959295939594959595969597959895999600960196029603960496059606960796089609961096119612961396149615961696179618961996209621962296239624962596269627962896299630963196329633963496359636963796389639964096419642964396449645964696479648964996509651965296539654965596569657965896599660966196629663966496659666966796689669967096719672967396749675967696779678967996809681968296839684968596869687968896899690969196929693969496959696969796989699970097019702970397049705970697079708970997109711971297139714971597169717971897199720972197229723972497259726972797289729973097319732973397349735973697379738973997409741974297439744974597469747974897499750975197529753975497559756975797589759976097619762976397649765976697679768976997709771977297739774977597769777977897799780978197829783978497859786978797889789979097919792979397949795979697979798979998009801980298039804980598069807980898099810981198129813981498159816981798189819982098219822982398249825982698279828982998309831983298339834983598369837983898399840984198429843984498459846984798489849985098519852985398549855985698579858985998609861986298639864986598669867986898699870987198729873987498759876987798789879988098819882988398849885988698879888988998909891989298939894989598969897989898999900990199029903990499059906990799089909991099119912991399149915991699179918991999209921992299239924992599269927992899299930993199329933993499359936993799389939994099419942994399449945994699479948994999509951995299539954995599569957995899599960996199629963996499659966996799689969997099719972997399749975997699779978997999809981998299839984998599869987998899899990999199929993999499959996999799989999100001000110002100031000410005100061000710008100091001010011100121001310014100151001610017100181001910020100211002210023100241002510026100271002810029100301003110032100331003410035100361003710038100391004010041100421004310044100451004610047100481004910050100511005210053100541005510056100571005810059100601006110062100631006410065100661006710068100691007010071100721007310074100751007610077100781007910080100811008210083100841008510086100871008810089100901009110092100931009410095100961009710098100991010010101101021010310104101051010610107101081010910110101111011210113101141011510116101171011810119101201012110122101231012410125101261012710128101291013010131101321013310134101351013610137101381013910140101411014210143101441014510146101471014810149101501015110152101531015410155101561015710158101591016010161101621016310164101651016610167101681016910170101711017210173101741017510176101771017810179101801018110182101831018410185101861018710188101891019010191101921019310194101951019610197101981019910200102011020210203102041020510206102071020810209102101021110212102131021410215102161021710218102191022010221102221022310224102251022610227102281022910230102311023210233102341023510236102371023810239102401024110242102431024410245102461024710248102491025010251102521025310254102551025610257102581025910260102611026210263102641026510266102671026810269102701027110272102731027410275102761027710278102791028010281102821028310284102851028610287102881028910290102911029210293102941029510296102971029810299103001030110302103031030410305103061030710308103091031010311103121031310314103151031610317103181031910320103211032210323103241032510326103271032810329103301033110332103331033410335103361033710338103391034010341103421034310344103451034610347103481034910350103511035210353103541035510356103571035810359103601036110362103631036410365103661036710368103691037010371103721037310374103751037610377103781037910380103811038210383103841038510386103871038810389103901039110392103931039410395103961039710398103991040010401104021040310404104051040610407104081040910410104111041210413104141041510416104171041810419104201042110422104231042410425104261042710428104291043010431104321043310434104351043610437104381043910440104411044210443104441044510446104471044810449104501045110452104531045410455104561045710458104591046010461104621046310464104651046610467104681046910470104711047210473104741047510476104771047810479104801048110482104831048410485104861048710488104891049010491104921049310494104951049610497104981049910500105011050210503105041050510506105071050810509105101051110512105131051410515105161051710518105191052010521105221052310524105251052610527105281052910530105311053210533105341053510536105371053810539105401054110542105431054410545105461054710548105491055010551105521055310554105551055610557105581055910560105611056210563105641056510566105671056810569105701057110572105731057410575105761057710578105791058010581105821058310584105851058610587105881058910590105911059210593105941059510596105971059810599106001060110602106031060410605106061060710608106091061010611106121061310614106151061610617106181061910620106211062210623106241062510626106271062810629106301063110632106331063410635106361063710638106391064010641106421064310644106451064610647106481064910650106511065210653106541065510656106571065810659106601066110662106631066410665106661066710668106691067010671106721067310674106751067610677106781067910680106811068210683106841068510686106871068810689106901069110692106931069410695106961069710698106991070010701107021070310704107051070610707107081070910710107111071210713107141071510716107171071810719107201072110722107231072410725107261072710728107291073010731107321073310734107351073610737107381073910740107411074210743107441074510746107471074810749107501075110752107531075410755107561075710758107591076010761107621076310764107651076610767107681076910770107711077210773107741077510776107771077810779107801078110782107831078410785107861078710788107891079010791107921079310794107951079610797107981079910800108011080210803108041080510806108071080810809108101081110812108131081410815108161081710818108191082010821108221082310824108251082610827108281082910830108311083210833108341083510836108371083810839108401084110842108431084410845108461084710848108491085010851108521085310854108551085610857108581085910860108611086210863108641086510866108671086810869108701087110872108731087410875108761087710878108791088010881108821088310884108851088610887108881088910890108911089210893108941089510896108971089810899109001090110902109031090410905109061090710908109091091010911109121091310914109151091610917109181091910920109211092210923109241092510926109271092810929109301093110932109331093410935109361093710938109391094010941109421094310944109451094610947109481094910950109511095210953109541095510956109571095810959109601096110962109631096410965109661096710968109691097010971109721097310974109751097610977109781097910980109811098210983109841098510986109871098810989109901099110992109931099410995109961099710998109991100011001110021100311004110051100611007110081100911010110111101211013110141101511016110171101811019110201102111022110231102411025110261102711028110291103011031110321103311034110351103611037110381103911040110411104211043110441104511046110471104811049110501105111052110531105411055110561105711058110591106011061110621106311064110651106611067110681106911070110711107211073110741107511076110771107811079110801108111082110831108411085110861108711088110891109011091110921109311094110951109611097110981109911100111011110211103111041110511106111071110811109111101111111112111131111411115111161111711118111191112011121111221112311124111251112611127111281112911130111311113211133111341113511136111371113811139111401114111142111431114411145111461114711148111491115011151111521115311154111551115611157111581115911160111611116211163111641116511166111671116811169111701117111172111731117411175111761117711178111791118011181111821118311184111851118611187111881118911190111911119211193111941119511196111971119811199112001120111202112031120411205112061120711208112091121011211112121121311214112151121611217112181121911220112211122211223112241122511226112271122811229112301123111232112331123411235112361123711238112391124011241112421124311244112451124611247112481124911250112511125211253112541125511256112571125811259112601126111262112631126411265112661126711268112691127011271112721127311274112751127611277112781127911280112811128211283112841128511286112871128811289112901129111292112931129411295112961129711298112991130011301113021130311304113051130611307113081130911310113111131211313113141131511316113171131811319113201132111322113231132411325113261132711328113291133011331113321133311334113351133611337113381133911340113411134211343113441134511346113471134811349113501135111352113531135411355113561135711358113591136011361113621136311364113651136611367113681136911370113711137211373113741137511376113771137811379113801138111382113831138411385113861138711388113891139011391113921139311394113951139611397113981139911400114011140211403114041140511406114071140811409114101141111412114131141411415114161141711418114191142011421114221142311424114251142611427114281142911430114311143211433114341143511436114371143811439114401144111442114431144411445114461144711448114491145011451114521145311454114551145611457114581145911460114611146211463114641146511466114671146811469114701147111472114731147411475114761147711478114791148011481114821148311484114851148611487114881148911490114911149211493114941149511496114971149811499115001150111502115031150411505115061150711508115091151011511115121151311514115151151611517115181151911520115211152211523115241152511526115271152811529115301153111532115331153411535115361153711538115391154011541115421154311544115451154611547115481154911550115511155211553115541155511556115571155811559115601156111562115631156411565115661156711568115691157011571115721157311574115751157611577115781157911580115811158211583115841158511586115871158811589115901159111592115931159411595115961159711598115991160011601116021160311604116051160611607116081160911610116111161211613116141161511616116171161811619116201162111622116231162411625116261162711628116291163011631116321163311634116351163611637116381163911640116411164211643116441164511646116471164811649116501165111652116531165411655116561165711658116591166011661116621166311664116651166611667116681166911670116711167211673116741167511676116771167811679116801168111682116831168411685116861168711688116891169011691116921169311694116951169611697116981169911700117011170211703117041170511706117071170811709117101171111712117131171411715117161171711718117191172011721117221172311724117251172611727117281172911730117311173211733117341173511736117371173811739117401174111742117431174411745117461174711748117491175011751117521175311754117551175611757117581175911760117611176211763117641176511766117671176811769117701177111772117731177411775117761177711778117791178011781117821178311784117851178611787117881178911790117911179211793117941179511796117971179811799118001180111802118031180411805118061180711808118091181011811118121181311814118151181611817118181181911820118211182211823118241182511826118271182811829118301183111832118331183411835118361183711838118391184011841118421184311844118451184611847118481184911850118511185211853118541185511856118571185811859118601186111862118631186411865118661186711868118691187011871118721187311874118751187611877118781187911880118811188211883118841188511886118871188811889118901189111892118931189411895118961189711898118991190011901119021190311904119051190611907119081190911910119111191211913119141191511916119171191811919119201192111922119231192411925119261192711928119291193011931119321193311934119351193611937119381193911940119411194211943119441194511946119471194811949119501195111952119531195411955119561195711958119591196011961119621196311964119651196611967119681196911970119711197211973119741197511976119771197811979119801198111982119831198411985119861198711988119891199011991119921199311994119951199611997119981199912000120011200212003120041200512006120071200812009120101201112012120131201412015120161201712018120191202012021120221202312024120251202612027120281202912030120311203212033120341203512036120371203812039120401204112042120431204412045120461204712048120491205012051120521205312054120551205612057120581205912060120611206212063120641206512066120671206812069120701207112072120731207412075120761207712078120791208012081120821208312084120851208612087120881208912090120911209212093120941209512096120971209812099121001210112102121031210412105121061210712108121091211012111121121211312114121151211612117121181211912120121211212212123121241212512126121271212812129121301213112132121331213412135121361213712138121391214012141121421214312144121451214612147121481214912150121511215212153121541215512156121571215812159121601216112162121631216412165121661216712168121691217012171121721217312174121751217612177121781217912180121811218212183121841218512186121871218812189121901219112192121931219412195121961219712198121991220012201122021220312204122051220612207122081220912210122111221212213122141221512216122171221812219122201222112222122231222412225122261222712228122291223012231122321223312234122351223612237122381223912240122411224212243122441224512246122471224812249122501225112252122531225412255122561225712258122591226012261122621226312264122651226612267122681226912270122711227212273122741227512276122771227812279122801228112282122831228412285122861228712288122891229012291122921229312294122951229612297122981229912300123011230212303123041230512306123071230812309123101231112312123131231412315123161231712318123191232012321123221232312324123251232612327123281232912330123311233212333123341233512336123371233812339123401234112342123431234412345123461234712348123491235012351123521235312354123551235612357123581235912360123611236212363123641236512366123671236812369123701237112372123731237412375123761237712378123791238012381123821238312384123851238612387123881238912390123911239212393123941239512396123971239812399124001240112402124031240412405124061240712408124091241012411124121241312414124151241612417124181241912420124211242212423124241242512426124271242812429124301243112432124331243412435124361243712438124391244012441124421244312444124451244612447124481244912450124511245212453124541245512456124571245812459124601246112462124631246412465124661246712468124691247012471124721247312474124751247612477124781247912480124811248212483124841248512486124871248812489124901249112492124931249412495124961249712498124991250012501125021250312504125051250612507125081250912510125111251212513125141251512516125171251812519125201252112522125231252412525125261252712528125291253012531125321253312534125351253612537125381253912540125411254212543125441254512546125471254812549125501255112552125531255412555125561255712558125591256012561125621256312564125651256612567125681256912570125711257212573125741257512576125771257812579125801258112582125831258412585125861258712588125891259012591125921259312594125951259612597125981259912600126011260212603126041260512606126071260812609126101261112612126131261412615126161261712618126191262012621126221262312624126251262612627126281262912630126311263212633126341263512636126371263812639126401264112642126431264412645126461264712648126491265012651126521265312654126551265612657126581265912660126611266212663126641266512666126671266812669126701267112672126731267412675126761267712678126791268012681126821268312684126851268612687126881268912690126911269212693126941269512696126971269812699127001270112702127031270412705127061270712708127091271012711127121271312714127151271612717127181271912720127211272212723127241272512726127271272812729127301273112732127331273412735127361273712738127391274012741127421274312744127451274612747127481274912750127511275212753127541275512756127571275812759127601276112762127631276412765127661276712768127691277012771127721277312774127751277612777127781277912780127811278212783127841278512786127871278812789127901279112792127931279412795127961279712798127991280012801128021280312804128051280612807128081280912810128111281212813128141281512816128171281812819128201282112822128231282412825128261282712828128291283012831128321283312834128351283612837128381283912840128411284212843128441284512846128471284812849128501285112852128531285412855128561285712858128591286012861128621286312864128651286612867128681286912870128711287212873128741287512876128771287812879128801288112882128831288412885128861288712888128891289012891128921289312894128951289612897128981289912900129011290212903129041290512906129071290812909129101291112912129131291412915129161291712918129191292012921129221292312924129251292612927129281292912930129311293212933129341293512936129371293812939129401294112942129431294412945129461294712948129491295012951129521295312954129551295612957129581295912960129611296212963129641296512966129671296812969129701297112972129731297412975129761297712978129791298012981129821298312984129851298612987129881298912990129911299212993129941299512996129971299812999130001300113002130031300413005130061300713008130091301013011130121301313014130151301613017130181301913020130211302213023130241302513026130271302813029130301303113032130331303413035130361303713038130391304013041130421304313044130451304613047130481304913050130511305213053130541305513056130571305813059130601306113062130631306413065130661306713068130691307013071130721307313074130751307613077130781307913080130811308213083130841308513086130871308813089130901309113092130931309413095130961309713098130991310013101131021310313104131051310613107131081310913110131111311213113131141311513116131171311813119131201312113122131231312413125131261312713128131291313013131131321313313134131351313613137131381313913140131411314213143131441314513146131471314813149131501315113152131531315413155131561315713158131591316013161131621316313164131651316613167131681316913170131711317213173131741317513176131771317813179131801318113182131831318413185131861318713188131891319013191131921319313194131951319613197131981319913200132011320213203132041320513206132071320813209132101321113212132131321413215132161321713218132191322013221132221322313224132251322613227132281322913230132311323213233132341323513236132371323813239132401324113242132431324413245132461324713248132491325013251132521325313254132551325613257132581325913260132611326213263132641326513266132671326813269132701327113272132731327413275132761327713278132791328013281132821328313284132851328613287132881328913290132911329213293132941329513296132971329813299133001330113302133031330413305133061330713308133091331013311133121331313314133151331613317133181331913320133211332213323133241332513326133271332813329133301333113332133331333413335133361333713338133391334013341133421334313344133451334613347133481334913350133511335213353133541335513356133571335813359133601336113362133631336413365133661336713368133691337013371133721337313374133751337613377133781337913380133811338213383133841338513386133871338813389133901339113392133931339413395133961339713398133991340013401134021340313404134051340613407134081340913410134111341213413134141341513416134171341813419134201342113422134231342413425134261342713428134291343013431134321343313434134351343613437134381343913440134411344213443134441344513446134471344813449134501345113452134531345413455134561345713458134591346013461134621346313464134651346613467134681346913470134711347213473134741347513476134771347813479134801348113482134831348413485134861348713488134891349013491134921349313494134951349613497134981349913500135011350213503135041350513506135071350813509135101351113512135131351413515135161351713518135191352013521135221352313524135251352613527135281352913530135311353213533135341353513536135371353813539135401354113542135431354413545135461354713548135491355013551135521355313554135551355613557135581355913560135611356213563135641356513566135671356813569135701357113572135731357413575135761357713578135791358013581135821358313584135851358613587135881358913590135911359213593135941359513596135971359813599136001360113602136031360413605136061360713608136091361013611136121361313614136151361613617136181361913620136211362213623136241362513626136271362813629136301363113632136331363413635136361363713638136391364013641136421364313644136451364613647136481364913650136511365213653136541365513656136571365813659136601366113662136631366413665136661366713668136691367013671136721367313674136751367613677136781367913680136811368213683136841368513686136871368813689136901369113692136931369413695136961369713698136991370013701137021370313704137051370613707137081370913710137111371213713137141371513716137171371813719137201372113722137231372413725137261372713728137291373013731137321373313734137351373613737137381373913740137411374213743137441374513746137471374813749137501375113752137531375413755137561375713758137591376013761137621376313764137651376613767137681376913770137711377213773137741377513776137771377813779137801378113782137831378413785137861378713788137891379013791137921379313794137951379613797137981379913800138011380213803138041380513806138071380813809138101381113812138131381413815138161381713818138191382013821138221382313824138251382613827138281382913830138311383213833138341383513836138371383813839138401384113842138431384413845138461384713848138491385013851138521385313854138551385613857138581385913860138611386213863138641386513866138671386813869138701387113872138731387413875138761387713878138791388013881138821388313884138851388613887138881388913890138911389213893138941389513896138971389813899139001390113902139031390413905139061390713908139091391013911139121391313914139151391613917139181391913920139211392213923139241392513926139271392813929139301393113932139331393413935139361393713938139391394013941139421394313944139451394613947139481394913950139511395213953139541395513956139571395813959139601396113962139631396413965139661396713968139691397013971139721397313974139751397613977139781397913980139811398213983139841398513986139871398813989139901399113992139931399413995139961399713998139991400014001140021400314004140051400614007140081400914010140111401214013140141401514016140171401814019140201402114022140231402414025140261402714028140291403014031140321403314034140351403614037140381403914040140411404214043140441404514046140471404814049140501405114052140531405414055140561405714058140591406014061140621406314064140651406614067140681406914070140711407214073140741407514076140771407814079140801408114082140831408414085140861408714088140891409014091140921409314094140951409614097140981409914100141011410214103141041410514106141071410814109141101411114112141131411414115141161411714118141191412014121141221412314124141251412614127141281412914130141311413214133141341413514136141371413814139141401414114142141431414414145141461414714148141491415014151141521415314154141551415614157141581415914160141611416214163141641416514166141671416814169141701417114172141731417414175141761417714178141791418014181141821418314184141851418614187141881418914190141911419214193141941419514196141971419814199142001420114202142031420414205142061420714208142091421014211142121421314214142151421614217142181421914220142211422214223142241422514226142271422814229142301423114232142331423414235142361423714238142391424014241142421424314244142451424614247142481424914250142511425214253142541425514256142571425814259142601426114262142631426414265142661426714268142691427014271142721427314274142751427614277142781427914280142811428214283142841428514286142871428814289142901429114292142931429414295142961429714298142991430014301143021430314304143051430614307143081430914310143111431214313143141431514316143171431814319143201432114322143231432414325143261432714328143291433014331143321433314334143351433614337143381433914340143411434214343143441434514346143471434814349143501435114352143531435414355143561435714358143591436014361143621436314364143651436614367143681436914370143711437214373143741437514376143771437814379143801438114382143831438414385143861438714388143891439014391143921439314394143951439614397143981439914400144011440214403144041440514406144071440814409144101441114412144131441414415144161441714418144191442014421144221442314424144251442614427144281442914430144311443214433144341443514436144371443814439144401444114442144431444414445144461444714448144491445014451144521445314454144551445614457144581445914460144611446214463144641446514466144671446814469144701447114472144731447414475144761447714478144791448014481144821448314484144851448614487144881448914490144911449214493144941449514496144971449814499145001450114502145031450414505145061450714508145091451014511145121451314514145151451614517145181451914520145211452214523145241452514526145271452814529145301453114532145331453414535145361453714538145391454014541145421454314544145451454614547145481454914550145511455214553145541455514556145571455814559145601456114562145631456414565145661456714568145691457014571145721457314574145751457614577145781457914580145811458214583145841458514586145871458814589145901459114592145931459414595145961459714598145991460014601146021460314604146051460614607146081460914610146111461214613146141461514616146171461814619146201462114622146231462414625146261462714628146291463014631146321463314634146351463614637146381463914640146411464214643146441464514646146471464814649146501465114652146531465414655146561465714658146591466014661146621466314664146651466614667146681466914670146711467214673146741467514676146771467814679146801468114682146831468414685146861468714688146891469014691146921469314694146951469614697146981469914700147011470214703147041470514706147071470814709147101471114712147131471414715147161471714718147191472014721147221472314724147251472614727147281472914730147311473214733147341473514736147371473814739147401474114742147431474414745147461474714748147491475014751147521475314754147551475614757147581475914760147611476214763147641476514766147671476814769147701477114772147731477414775147761477714778147791478014781147821478314784147851478614787147881478914790147911479214793147941479514796147971479814799148001480114802148031480414805148061480714808148091481014811148121481314814148151481614817148181481914820148211482214823148241482514826148271482814829148301483114832148331483414835148361483714838148391484014841148421484314844148451484614847148481484914850148511485214853148541485514856148571485814859148601486114862148631486414865148661486714868148691487014871148721487314874148751487614877148781487914880148811488214883148841488514886148871488814889148901489114892148931489414895148961489714898148991490014901149021490314904149051490614907149081490914910149111491214913149141491514916149171491814919149201492114922149231492414925149261492714928149291493014931149321493314934149351493614937149381493914940149411494214943149441494514946149471494814949149501495114952149531495414955149561495714958149591496014961149621496314964149651496614967149681496914970149711497214973149741497514976149771497814979149801498114982149831498414985149861498714988149891499014991149921499314994149951499614997149981499915000150011500215003150041500515006150071500815009150101501115012150131501415015150161501715018150191502015021150221502315024150251502615027150281502915030150311503215033150341503515036150371503815039150401504115042150431504415045150461504715048150491505015051150521505315054150551505615057150581505915060150611506215063150641506515066150671506815069150701507115072150731507415075150761507715078150791508015081150821508315084150851508615087150881508915090150911509215093150941509515096150971509815099151001510115102151031510415105151061510715108151091511015111151121511315114151151511615117151181511915120151211512215123151241512515126151271512815129151301513115132151331513415135151361513715138151391514015141151421514315144151451514615147151481514915150151511515215153151541515515156151571515815159151601516115162151631516415165151661516715168151691517015171151721517315174151751517615177151781517915180151811518215183151841518515186151871518815189151901519115192151931519415195151961519715198151991520015201152021520315204152051520615207152081520915210152111521215213152141521515216152171521815219152201522115222152231522415225152261522715228152291523015231152321523315234152351523615237152381523915240152411524215243152441524515246152471524815249152501525115252152531525415255152561525715258152591526015261152621526315264152651526615267152681526915270152711527215273152741527515276152771527815279152801528115282152831528415285152861528715288152891529015291152921529315294152951529615297152981529915300153011530215303153041530515306153071530815309153101531115312153131531415315153161531715318153191532015321153221532315324153251532615327153281532915330153311533215333153341533515336153371533815339153401534115342153431534415345153461534715348153491535015351153521535315354153551535615357153581535915360153611536215363153641536515366153671536815369153701537115372153731537415375153761537715378153791538015381153821538315384153851538615387153881538915390153911539215393153941539515396153971539815399154001540115402154031540415405154061540715408154091541015411154121541315414154151541615417154181541915420154211542215423154241542515426154271542815429154301543115432154331543415435154361543715438154391544015441154421544315444154451544615447154481544915450154511545215453154541545515456154571545815459154601546115462154631546415465154661546715468154691547015471154721547315474154751547615477154781547915480154811548215483154841548515486154871548815489154901549115492154931549415495154961549715498154991550015501155021550315504155051550615507155081550915510155111551215513155141551515516155171551815519155201552115522155231552415525155261552715528155291553015531155321553315534155351553615537155381553915540155411554215543155441554515546155471554815549155501555115552155531555415555155561555715558155591556015561155621556315564155651556615567155681556915570155711557215573155741557515576155771557815579155801558115582155831558415585155861558715588155891559015591155921559315594155951559615597155981559915600156011560215603156041560515606156071560815609156101561115612156131561415615156161561715618156191562015621156221562315624156251562615627156281562915630156311563215633156341563515636156371563815639156401564115642156431564415645156461564715648156491565015651156521565315654156551565615657156581565915660156611566215663156641566515666156671566815669156701567115672156731567415675156761567715678156791568015681156821568315684156851568615687156881568915690156911569215693156941569515696156971569815699157001570115702157031570415705157061570715708157091571015711157121571315714157151571615717157181571915720157211572215723157241572515726157271572815729157301573115732157331573415735157361573715738157391574015741157421574315744157451574615747157481574915750157511575215753157541575515756157571575815759157601576115762157631576415765157661576715768157691577015771157721577315774157751577615777157781577915780157811578215783157841578515786157871578815789157901579115792157931579415795157961579715798157991580015801158021580315804158051580615807158081580915810158111581215813158141581515816158171581815819158201582115822158231582415825158261582715828158291583015831158321583315834158351583615837158381583915840158411584215843158441584515846158471584815849158501585115852158531585415855158561585715858158591586015861158621586315864158651586615867158681586915870158711587215873158741587515876158771587815879158801588115882158831588415885158861588715888158891589015891158921589315894158951589615897158981589915900159011590215903159041590515906159071590815909159101591115912159131591415915159161591715918159191592015921159221592315924159251592615927159281592915930159311593215933159341593515936159371593815939159401594115942159431594415945159461594715948159491595015951159521595315954159551595615957159581595915960159611596215963159641596515966159671596815969159701597115972159731597415975159761597715978159791598015981159821598315984159851598615987159881598915990159911599215993159941599515996159971599815999160001600116002160031600416005160061600716008160091601016011160121601316014160151601616017160181601916020160211602216023160241602516026160271602816029160301603116032160331603416035160361603716038160391604016041160421604316044160451604616047160481604916050160511605216053160541605516056160571605816059160601606116062160631606416065160661606716068160691607016071160721607316074160751607616077160781607916080160811608216083160841608516086160871608816089160901609116092160931609416095160961609716098160991610016101161021610316104161051610616107161081610916110161111611216113161141611516116161171611816119161201612116122161231612416125161261612716128161291613016131161321613316134161351613616137161381613916140161411614216143161441614516146161471614816149161501615116152161531615416155161561615716158161591616016161161621616316164161651616616167161681616916170161711617216173161741617516176161771617816179161801618116182161831618416185161861618716188161891619016191161921619316194161951619616197161981619916200162011620216203162041620516206162071620816209162101621116212162131621416215162161621716218162191622016221162221622316224162251622616227162281622916230162311623216233162341623516236162371623816239162401624116242162431624416245162461624716248162491625016251162521625316254162551625616257162581625916260162611626216263162641626516266162671626816269162701627116272162731627416275162761627716278162791628016281162821628316284162851628616287162881628916290162911629216293162941629516296162971629816299163001630116302163031630416305163061630716308163091631016311163121631316314163151631616317163181631916320163211632216323163241632516326163271632816329163301633116332163331633416335163361633716338163391634016341163421634316344163451634616347163481634916350163511635216353163541635516356163571635816359163601636116362163631636416365163661636716368163691637016371163721637316374163751637616377163781637916380163811638216383163841638516386163871638816389163901639116392163931639416395163961639716398163991640016401164021640316404164051640616407164081640916410164111641216413164141641516416164171641816419164201642116422164231642416425164261642716428164291643016431164321643316434164351643616437164381643916440164411644216443164441644516446164471644816449164501645116452164531645416455164561645716458164591646016461164621646316464164651646616467164681646916470164711647216473164741647516476164771647816479164801648116482164831648416485164861648716488164891649016491164921649316494164951649616497164981649916500165011650216503165041650516506165071650816509165101651116512165131651416515165161651716518165191652016521165221652316524165251652616527165281652916530165311653216533165341653516536165371653816539165401654116542165431654416545165461654716548165491655016551165521655316554165551655616557165581655916560165611656216563165641656516566165671656816569165701657116572165731657416575165761657716578165791658016581165821658316584165851658616587165881658916590165911659216593165941659516596165971659816599166001660116602166031660416605166061660716608166091661016611166121661316614166151661616617166181661916620166211662216623166241662516626166271662816629166301663116632166331663416635166361663716638166391664016641166421664316644166451664616647166481664916650166511665216653166541665516656166571665816659166601666116662166631666416665166661666716668166691667016671166721667316674166751667616677166781667916680166811668216683166841668516686166871668816689166901669116692166931669416695166961669716698166991670016701167021670316704167051670616707167081670916710167111671216713167141671516716167171671816719167201672116722167231672416725167261672716728167291673016731167321673316734167351673616737167381673916740167411674216743167441674516746167471674816749167501675116752167531675416755167561675716758167591676016761167621676316764167651676616767167681676916770167711677216773167741677516776167771677816779167801678116782167831678416785167861678716788167891679016791167921679316794167951679616797167981679916800168011680216803168041680516806168071680816809168101681116812168131681416815168161681716818168191682016821168221682316824168251682616827168281682916830168311683216833168341683516836168371683816839168401684116842168431684416845168461684716848168491685016851168521685316854168551685616857168581685916860168611686216863168641686516866168671686816869168701687116872168731687416875168761687716878168791688016881168821688316884168851688616887168881688916890168911689216893168941689516896168971689816899169001690116902169031690416905169061690716908169091691016911169121691316914169151691616917169181691916920169211692216923169241692516926169271692816929169301693116932169331693416935169361693716938169391694016941169421694316944169451694616947169481694916950169511695216953169541695516956169571695816959169601696116962169631696416965169661696716968169691697016971169721697316974169751697616977169781697916980169811698216983169841698516986169871698816989169901699116992169931699416995169961699716998169991700017001170021700317004170051700617007170081700917010170111701217013170141701517016170171701817019170201702117022170231702417025170261702717028170291703017031170321703317034170351703617037170381703917040170411704217043170441704517046170471704817049170501705117052170531705417055170561705717058170591706017061170621706317064170651706617067170681706917070170711707217073170741707517076170771707817079170801708117082170831708417085170861708717088170891709017091170921709317094170951709617097170981709917100171011710217103171041710517106171071710817109171101711117112171131711417115171161711717118171191712017121171221712317124171251712617127171281712917130171311713217133171341713517136171371713817139171401714117142171431714417145171461714717148171491715017151171521715317154171551715617157171581715917160171611716217163171641716517166171671716817169171701717117172171731717417175171761717717178171791718017181171821718317184171851718617187171881718917190171911719217193171941719517196171971719817199172001720117202172031720417205172061720717208172091721017211172121721317214172151721617217172181721917220172211722217223172241722517226172271722817229172301723117232172331723417235172361723717238172391724017241172421724317244172451724617247172481724917250172511725217253172541725517256172571725817259172601726117262172631726417265172661726717268172691727017271172721727317274172751727617277172781727917280172811728217283172841728517286172871728817289172901729117292172931729417295172961729717298172991730017301173021730317304173051730617307173081730917310173111731217313173141731517316173171731817319173201732117322173231732417325173261732717328173291733017331173321733317334173351733617337173381733917340173411734217343173441734517346173471734817349173501735117352173531735417355173561735717358173591736017361173621736317364173651736617367173681736917370173711737217373173741737517376173771737817379173801738117382173831738417385173861738717388173891739017391173921739317394173951739617397173981739917400174011740217403174041740517406174071740817409174101741117412174131741417415174161741717418174191742017421174221742317424174251742617427174281742917430174311743217433174341743517436174371743817439174401744117442174431744417445174461744717448174491745017451174521745317454174551745617457174581745917460174611746217463174641746517466174671746817469174701747117472174731747417475174761747717478174791748017481174821748317484174851748617487174881748917490174911749217493174941749517496174971749817499175001750117502175031750417505175061750717508175091751017511175121751317514175151751617517175181751917520175211752217523175241752517526175271752817529175301753117532175331753417535175361753717538175391754017541175421754317544175451754617547175481754917550175511755217553175541755517556175571755817559175601756117562175631756417565175661756717568175691757017571175721757317574175751757617577175781757917580175811758217583175841758517586175871758817589175901759117592175931759417595175961759717598175991760017601176021760317604176051760617607176081760917610176111761217613176141761517616176171761817619176201762117622176231762417625176261762717628176291763017631176321763317634176351763617637176381763917640176411764217643176441764517646176471764817649176501765117652176531765417655176561765717658176591766017661176621766317664176651766617667176681766917670176711767217673176741767517676176771767817679176801768117682176831768417685176861768717688176891769017691176921769317694176951769617697176981769917700177011770217703177041770517706177071770817709177101771117712177131771417715177161771717718177191772017721177221772317724177251772617727177281772917730177311773217733177341773517736177371773817739177401774117742177431774417745177461774717748177491775017751177521775317754177551775617757177581775917760177611776217763177641776517766177671776817769177701777117772177731777417775177761777717778177791778017781177821778317784177851778617787177881778917790177911779217793177941779517796177971779817799178001780117802178031780417805178061780717808178091781017811178121781317814178151781617817178181781917820178211782217823178241782517826178271782817829178301783117832178331783417835178361783717838178391784017841178421784317844178451784617847178481784917850178511785217853178541785517856178571785817859178601786117862178631786417865178661786717868178691787017871178721787317874178751787617877178781787917880178811788217883178841788517886178871788817889178901789117892178931789417895178961789717898178991790017901179021790317904179051790617907179081790917910179111791217913179141791517916179171791817919179201792117922179231792417925179261792717928179291793017931179321793317934179351793617937179381793917940179411794217943179441794517946179471794817949179501795117952179531795417955179561795717958179591796017961179621796317964179651796617967179681796917970179711797217973179741797517976179771797817979179801798117982179831798417985179861798717988179891799017991179921799317994179951799617997179981799918000180011800218003180041800518006180071800818009180101801118012180131801418015180161801718018180191802018021180221802318024180251802618027180281802918030180311803218033180341803518036180371803818039180401804118042180431804418045180461804718048180491805018051180521805318054180551805618057180581805918060180611806218063180641806518066180671806818069180701807118072180731807418075180761807718078180791808018081180821808318084180851808618087180881808918090180911809218093180941809518096180971809818099181001810118102181031810418105181061810718108181091811018111181121811318114181151811618117181181811918120181211812218123181241812518126181271812818129181301813118132181331813418135181361813718138181391814018141181421814318144181451814618147181481814918150181511815218153181541815518156181571815818159181601816118162181631816418165181661816718168181691817018171181721817318174181751817618177181781817918180181811818218183181841818518186181871818818189181901819118192181931819418195181961819718198181991820018201182021820318204182051820618207182081820918210182111821218213182141821518216182171821818219182201822118222182231822418225182261822718228182291823018231182321823318234182351823618237182381823918240182411824218243182441824518246182471824818249182501825118252182531825418255182561825718258182591826018261182621826318264182651826618267182681826918270182711827218273182741827518276182771827818279182801828118282182831828418285182861828718288182891829018291182921829318294182951829618297182981829918300183011830218303183041830518306183071830818309183101831118312183131831418315183161831718318183191832018321183221832318324183251832618327183281832918330183311833218333183341833518336183371833818339183401834118342183431834418345183461834718348183491835018351183521835318354183551835618357183581835918360183611836218363183641836518366183671836818369183701837118372183731837418375183761837718378183791838018381183821838318384183851838618387183881838918390183911839218393183941839518396183971839818399184001840118402184031840418405184061840718408184091841018411184121841318414184151841618417184181841918420184211842218423184241842518426184271842818429184301843118432184331843418435184361843718438184391844018441184421844318444184451844618447184481844918450184511845218453184541845518456184571845818459184601846118462184631846418465184661846718468184691847018471184721847318474184751847618477184781847918480184811848218483184841848518486184871848818489184901849118492184931849418495184961849718498184991850018501185021850318504185051850618507185081850918510185111851218513185141851518516185171851818519185201852118522185231852418525185261852718528185291853018531185321853318534185351853618537185381853918540185411854218543185441854518546185471854818549185501855118552185531855418555185561855718558185591856018561185621856318564185651856618567185681856918570185711857218573185741857518576185771857818579185801858118582185831858418585185861858718588185891859018591185921859318594185951859618597185981859918600186011860218603186041860518606186071860818609186101861118612186131861418615186161861718618186191862018621186221862318624186251862618627186281862918630186311863218633186341863518636186371863818639186401864118642186431864418645186461864718648186491865018651186521865318654186551865618657186581865918660186611866218663186641866518666186671866818669186701867118672186731867418675186761867718678186791868018681186821868318684186851868618687186881868918690186911869218693186941869518696186971869818699187001870118702187031870418705187061870718708187091871018711187121871318714187151871618717187181871918720187211872218723187241872518726187271872818729187301873118732187331873418735187361873718738187391874018741187421874318744187451874618747187481874918750187511875218753187541875518756187571875818759187601876118762187631876418765187661876718768187691877018771187721877318774187751877618777187781877918780187811878218783187841878518786187871878818789187901879118792187931879418795187961879718798187991880018801188021880318804188051880618807188081880918810188111881218813188141881518816188171881818819188201882118822188231882418825188261882718828188291883018831188321883318834188351883618837188381883918840188411884218843188441884518846188471884818849188501885118852188531885418855188561885718858188591886018861188621886318864188651886618867188681886918870188711887218873188741887518876188771887818879188801888118882188831888418885188861888718888188891889018891188921889318894188951889618897188981889918900189011890218903189041890518906189071890818909189101891118912189131891418915189161891718918189191892018921189221892318924189251892618927189281892918930189311893218933189341893518936189371893818939189401894118942189431894418945189461894718948189491895018951189521895318954189551895618957189581895918960189611896218963189641896518966189671896818969189701897118972189731897418975189761897718978189791898018981189821898318984189851898618987189881898918990189911899218993189941899518996189971899818999190001900119002190031900419005190061900719008190091901019011190121901319014190151901619017190181901919020190211902219023190241902519026190271902819029190301903119032190331903419035190361903719038190391904019041190421904319044190451904619047190481904919050190511905219053190541905519056190571905819059190601906119062190631906419065190661906719068190691907019071190721907319074190751907619077190781907919080190811908219083190841908519086190871908819089190901909119092190931909419095190961909719098190991910019101191021910319104191051910619107191081910919110191111911219113191141911519116191171911819119191201912119122191231912419125191261912719128191291913019131191321913319134191351913619137191381913919140191411914219143191441914519146191471914819149191501915119152191531915419155191561915719158191591916019161191621916319164191651916619167191681916919170191711917219173191741917519176191771917819179191801918119182191831918419185191861918719188191891919019191191921919319194191951919619197191981919919200192011920219203192041920519206192071920819209192101921119212192131921419215192161921719218192191922019221192221922319224192251922619227192281922919230192311923219233192341923519236192371923819239192401924119242192431924419245192461924719248192491925019251192521925319254192551925619257192581925919260192611926219263192641926519266192671926819269192701927119272192731927419275192761927719278192791928019281192821928319284192851928619287192881928919290192911929219293192941929519296192971929819299193001930119302193031930419305193061930719308193091931019311193121931319314193151931619317193181931919320193211932219323193241932519326193271932819329193301933119332193331933419335193361933719338193391934019341193421934319344193451934619347193481934919350193511935219353193541935519356193571935819359193601936119362193631936419365193661936719368193691937019371193721937319374193751937619377193781937919380193811938219383193841938519386193871938819389193901939119392193931939419395193961939719398193991940019401194021940319404194051940619407194081940919410194111941219413194141941519416194171941819419194201942119422194231942419425194261942719428194291943019431194321943319434194351943619437194381943919440194411944219443194441944519446194471944819449194501945119452194531945419455194561945719458194591946019461194621946319464194651946619467194681946919470194711947219473194741947519476194771947819479194801948119482194831948419485194861948719488194891949019491194921949319494194951949619497194981949919500195011950219503195041950519506195071950819509195101951119512195131951419515195161951719518195191952019521195221952319524195251952619527195281952919530195311953219533195341953519536195371953819539195401954119542195431954419545195461954719548195491955019551195521955319554195551955619557195581955919560195611956219563195641956519566195671956819569195701957119572195731957419575195761957719578195791958019581195821958319584195851958619587195881958919590195911959219593195941959519596195971959819599196001960119602196031960419605
  1. /* -------------------------------------------------------
  2. Theme Name: Crafto - The Multipurpose HTML5 Template
  3. Theme URL: https://craftohtml.themezaa.com/
  4. Description: Elevate your online presence with Crafto - a modern, versatile, multipurpose Bootstrap 5 responsive HTML5, SCSS template using highly creative 56+ ready demos.
  5. Author: ThemeZaa - https://www.themezaa.com/
  6. Author ThemeForest URL: https://themeforest.net/user/themezaa
  7. Copyright(c) 2025 themezaa.com
  8. Version: 3.0
  9. ------------------------------------------------------- */
  10. /*
  11. Table of contents
  12. 01. Google font
  13. 02. CSS color variable
  14. 03. Reset
  15. 04. Typography
  16. 05. General
  17. 06. Background and border
  18. 07. Width
  19. 08. Height
  20. 09. Loop
  21. 10. Header
  22. 11. Page title
  23. 12. Layout
  24. 13. Elements
  25. 14. Blog
  26. 15. Portfolio
  27. 16. Shop
  28. 17. Footer
  29. */
  30. /* ===================================
  31. 01. Google font
  32. ====================================== */
  33. @import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap");
  34. @import url("https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap");
  35. :root {
  36. --alt-font: "Plus Jakarta Sans", sans-serif;
  37. --primary-font: "Inter", sans-serif;
  38. }
  39. /* ===================================
  40. 02. CSS color variable
  41. ====================================== */
  42. :root {
  43. --base-color: #2946f3;
  44. --white: #ffffff;
  45. --black: #000000;
  46. --red: #dc3131;
  47. --light-red: #feedec;
  48. --green: #2ebb79;
  49. --crusoe-green: #d39121;
  50. --yellow: #ffea23;
  51. --dark-gray: #232323;
  52. --medium-gray: #717580;
  53. --extra-medium-gray: #e4e4e4;
  54. --light-gray: #a8a8a8;
  55. --very-light-gray: #f7f7f7;
  56. --light-medium-gray: #eaeaeb;
  57. --charcoal-blue: #202329;
  58. --slate-blue: #262b35;
  59. --medium-slate-blue: #374162;
  60. --extra-medium-slate-blue: #23262d;
  61. --dark-slate-blue: #1f232c;
  62. --extra-dark-slate-blue: #121418;
  63. --extra-very-slate-blue: #161620;
  64. --tussock-yellow: #BC8947;
  65. --aluminium-gray:#80858F;
  66. --solitude-blue:#f0f4fd;
  67. --golden-yellow:#fd961e;
  68. --selago:#eaedff;
  69. --white-ice:#d8f5ef;
  70. --cornflower-blue:#445fed;
  71. --jade:#00AF6B;
  72. --orange: #ef991f;
  73. --majorelle-blue: #724ade;
  74. --light-majorelle-blue: #f2edfe;
  75. --spring-wood: #f9f6f3;
  76. --tropical-blue: #1ea3b1;
  77. --camarone: #20642b;
  78. --seal-brown: #0e0708;
  79. --Wasabi: #8ea63a;
  80. }
  81. /* ===================================
  82. 03. Reset
  83. ====================================== */
  84. .alt-font {
  85. font-family: var(--alt-font);
  86. }
  87. .primary-font {
  88. font-family: var(--primary-font) !important;
  89. }
  90. html {
  91. font-size: 16px;
  92. }
  93. body {
  94. font-family: var(--primary-font);
  95. font-size: 16px;
  96. line-height: 30px;
  97. font-weight: 400;
  98. color: var(--medium-gray);
  99. -moz-osx-font-smoothing: grayscale;
  100. word-break: break-word;
  101. -webkit-font-smoothing: antialiased;
  102. }
  103. section {
  104. padding-top: 110px;
  105. padding-bottom: 110px;
  106. }
  107. section.half-section {
  108. padding-top: 70px;
  109. padding-bottom: 70px;
  110. }
  111. section.big-section {
  112. padding-top: 130px;
  113. padding-bottom: 130px;
  114. }
  115. section.extra-big-section {
  116. padding-top: 160px;
  117. padding-bottom: 160px;
  118. }
  119. img {
  120. max-width: 100%;
  121. height: auto;
  122. }
  123. ul li {
  124. list-style: none;
  125. }
  126. a {
  127. color: var(--medium-gray);
  128. -webkit-transition: 0.3s;
  129. transition: 0.3s;
  130. text-decoration: none;
  131. }
  132. a:hover {
  133. color: var(--base-color);
  134. text-decoration: none;
  135. }
  136. p {
  137. margin-bottom: 25px;
  138. }
  139. .last-paragraph-no-margin p:last-of-type {
  140. margin-bottom: 0;
  141. }
  142. video {
  143. background-size: cover;
  144. display: table-cell;
  145. vertical-align: middle;
  146. width: 100%;
  147. }
  148. :focus-visible {
  149. outline: none;
  150. }
  151. [class*=line-icon], [class*=" line-icon"], [class*=bi-], [class*=feather], [class*=ti-] {
  152. display: inline-block;
  153. }
  154. .form-control, .form-control.is-invalid, .was-validated .form-control:invalid {
  155. background-position: right 20px center !important;
  156. }
  157. .form-control.is-invalid, .was-validated .form-control:invalid {
  158. border-color: #dc3545 !important;
  159. }
  160. .g-recaptcha.is-invalid iframe {
  161. border: 1px solid #dc3545 !important;
  162. }
  163. .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
  164. padding-right: 15px;
  165. padding-left: 15px;
  166. }
  167. .row {
  168. margin-right: -15px;
  169. margin-left: -15px;
  170. }
  171. .row > * {
  172. padding-right: 15px;
  173. padding-left: 15px;
  174. }
  175. .row.g-0 {
  176. margin-right: 0;
  177. margin-left: 0;
  178. }
  179. .row.g-0 > * {
  180. padding-right: 0;
  181. padding-left: 0;
  182. }
  183. .row.gutter-very-small {
  184. margin-left: -5px;
  185. margin-right: -5px;
  186. }
  187. .row.gutter-very-small > * {
  188. padding-right: 5px;
  189. padding-left: 5px;
  190. }
  191. .row.gutter-small {
  192. margin-left: -10px;
  193. margin-right: -10px;
  194. }
  195. .row.gutter-small > * {
  196. padding-right: 10px;
  197. padding-left: 10px;
  198. }
  199. /* ===================================
  200. 04. Typography
  201. ====================================== */
  202. /* Heading */
  203. .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
  204. margin-bottom: 30px;
  205. letter-spacing: -0.5px;
  206. font-weight: inherit;
  207. }
  208. h1, .h1 {
  209. font-size: 4.375rem;
  210. line-height: 4.375rem;
  211. }
  212. h2, .h2 {
  213. font-size: 3.438rem;
  214. line-height: 3.438rem;
  215. }
  216. h3, .h3 {
  217. font-size: 2.813rem;
  218. line-height: 3.125rem;
  219. }
  220. h4 {
  221. font-size: 2.375rem;
  222. line-height: 2.7rem;
  223. }
  224. h5 {
  225. font-size: 2rem;
  226. line-height: 2.2rem;
  227. }
  228. h6 {
  229. font-size: 1.75rem;
  230. line-height: 1.95rem;
  231. }
  232. /* Font custom */
  233. .font-style-italic {
  234. font-style: italic;
  235. }
  236. .hover-text {
  237. display: none;
  238. }
  239. b, strong {
  240. font-weight: 700;
  241. }
  242. .text-white-space-nowrap {
  243. white-space: nowrap;
  244. }
  245. .text-white-space-normal {
  246. white-space: normal;
  247. }
  248. .text-transform-none {
  249. text-transform: none !important;
  250. }
  251. .text-uppercase-inherit {
  252. text-transform: inherit !important;
  253. }
  254. .word-break-normal {
  255. word-break: normal;
  256. }
  257. .vertical-align-top {
  258. vertical-align: top;
  259. }
  260. /* Font size */
  261. .fs-0 {
  262. font-size: 0;
  263. }
  264. .fs-9 {
  265. font-size: 9px;
  266. }
  267. .fs-10 {
  268. font-size: 10px;
  269. }
  270. .fs-11 {
  271. font-size: 11px;
  272. }
  273. .fs-12 {
  274. font-size: 12px;
  275. }
  276. .fs-13 {
  277. font-size: 13px;
  278. }
  279. .fs-14 {
  280. font-size: 14px;
  281. }
  282. .fs-15 {
  283. font-size: 15px;
  284. }
  285. .fs-16 {
  286. font-size: 16px;
  287. }
  288. .fs-17 {
  289. font-size: 17px;
  290. }
  291. .fs-18 {
  292. font-size: 18px;
  293. }
  294. .fs-19 {
  295. font-size: 19px;
  296. }
  297. .fs-20 {
  298. font-size: 20px;
  299. }
  300. .fs-22 {
  301. font-size: 22px;
  302. }
  303. .fs-24 {
  304. font-size: 24px;
  305. line-height: 32px;
  306. }
  307. .fs-26 {
  308. font-size: 26px;
  309. line-height: 38px;
  310. }
  311. .fs-28 {
  312. font-size: 1.75rem;
  313. line-height: 2.6rem;
  314. }
  315. .fs-30 {
  316. font-size: 1.875rem;
  317. line-height: 2.8rem;
  318. }
  319. .fs-32 {
  320. font-size: 2rem;
  321. line-height: 2.5rem;
  322. }
  323. .fs-34 {
  324. font-size: 2.125rem;
  325. line-height: 2.125rem;
  326. }
  327. .fs-40 {
  328. font-size: 2.5rem;
  329. line-height: 2.5rem;
  330. }
  331. .fs-45 {
  332. font-size: 2.813rem;
  333. line-height: 3rem;
  334. }
  335. .fs-50 {
  336. font-size: 3.125rem;
  337. line-height: 3.25rem;
  338. }
  339. .fs-55 {
  340. font-size: 3.438rem;
  341. line-height: 3.5rem;
  342. }
  343. .fs-60 {
  344. font-size: 3.75rem;
  345. line-height: 3.75rem;
  346. }
  347. .fs-65 {
  348. font-size: 4.063rem;
  349. line-height: 4.688rem;
  350. }
  351. .fs-70 {
  352. font-size: 4.375rem;
  353. line-height: 4.375rem;
  354. }
  355. .fs-75 {
  356. font-size: 4.668rem;
  357. line-height: 4.668rem;
  358. }
  359. .fs-80 {
  360. font-size: 5rem;
  361. line-height: 5rem;
  362. }
  363. .fs-85 {
  364. font-size: 5.313rem;
  365. line-height: 5.313rem;
  366. }
  367. .fs-90 {
  368. font-size: 5.625rem;
  369. line-height: 5.625rem;
  370. }
  371. .fs-95 {
  372. font-size: 5.938rem;
  373. line-height: 5.938rem;
  374. }
  375. .fs-100 {
  376. font-size: 6.25rem;
  377. line-height: 6.25rem;
  378. }
  379. .fs-110 {
  380. font-size: 6.875rem;
  381. line-height: 6.875rem;
  382. }
  383. .fs-120 {
  384. font-size: 7.5rem;
  385. line-height: 7.5rem;
  386. }
  387. .fs-130 {
  388. font-size: 8.125rem;
  389. line-height: 8.125rem;
  390. }
  391. .fs-140 {
  392. font-size: 8.75rem;
  393. line-height: 8.75rem;
  394. }
  395. .fs-150 {
  396. font-size: 9.375rem;
  397. line-height: 9.375rem;
  398. }
  399. .fs-160 {
  400. font-size: 10rem;
  401. line-height: 10rem;
  402. }
  403. .fs-170 {
  404. font-size: 10.625rem;
  405. line-height: 10.625rem;
  406. }
  407. .fs-180 {
  408. font-size: 11.25rem;
  409. line-height: 11.25rem;
  410. }
  411. .fs-190 {
  412. font-size: 11.875rem;
  413. line-height: 11.875rem;
  414. }
  415. .fs-200 {
  416. font-size: 12.5rem;
  417. line-height: 12.5rem;
  418. }
  419. .fs-225 {
  420. font-size: 14.063rem;
  421. line-height: 14.063rem;
  422. }
  423. .fs-250 {
  424. font-size: 15.625rem;
  425. line-height: 15.625rem;
  426. }
  427. .fs-275 {
  428. font-size: 17.188rem;
  429. line-height: 17.188rem;
  430. }
  431. .fs-300 {
  432. font-size: 18.75rem;
  433. line-height: 18.75rem;
  434. }
  435. .fs-350 {
  436. font-size: 21.875rem;
  437. line-height: 21.875rem;
  438. }
  439. .fs-400 {
  440. font-size: 25rem;
  441. line-height: 25rem;
  442. }
  443. /* Line height */
  444. .lh-0px {
  445. line-height: 0px;
  446. }
  447. .lh-10 {
  448. line-height: 10px;
  449. }
  450. .lh-11 {
  451. line-height: 11px;
  452. }
  453. .lh-12 {
  454. line-height: 12px;
  455. }
  456. .lh-13 {
  457. line-height: 13px;
  458. }
  459. .lh-14 {
  460. line-height: 14px;
  461. }
  462. .lh-15 {
  463. line-height: 15px;
  464. }
  465. .lh-16 {
  466. line-height: 16px;
  467. }
  468. .lh-18 {
  469. line-height: 18px;
  470. }
  471. .lh-19 {
  472. line-height: 19px;
  473. }
  474. .lh-20 {
  475. line-height: 20px;
  476. }
  477. .lh-22 {
  478. line-height: 22px;
  479. }
  480. .lh-24 {
  481. line-height: 24px;
  482. }
  483. .lh-26 {
  484. line-height: 26px;
  485. }
  486. .lh-28 {
  487. line-height: 28px;
  488. }
  489. .lh-30 {
  490. line-height: 30px;
  491. }
  492. .lh-32 {
  493. line-height: 2rem;
  494. }
  495. .lh-34 {
  496. line-height: 2.125rem;
  497. }
  498. .lh-36 {
  499. line-height: 2.25rem;
  500. }
  501. .lh-38 {
  502. line-height: 2.375rem;
  503. }
  504. .lh-40 {
  505. line-height: 2.5rem;
  506. }
  507. .lh-42 {
  508. line-height: 2.625rem;
  509. }
  510. .lh-44 {
  511. line-height: 2.75rem;
  512. }
  513. .lh-46 {
  514. line-height: 2.875rem;
  515. }
  516. .lh-48 {
  517. line-height: 3rem;
  518. }
  519. .lh-50 {
  520. line-height: 3.125rem;
  521. }
  522. .lh-55 {
  523. line-height: 3.438rem;
  524. }
  525. .lh-60 {
  526. line-height: 3.75rem;
  527. }
  528. .lh-65 {
  529. line-height: 4.063rem;
  530. }
  531. .lh-70 {
  532. line-height: 4.375rem;
  533. }
  534. .lh-75 {
  535. line-height: 4.688rem;
  536. }
  537. .lh-80 {
  538. line-height: 5rem;
  539. }
  540. .lh-85 {
  541. line-height: 5.313rem;
  542. }
  543. .lh-90 {
  544. line-height: 5.625rem;
  545. }
  546. .lh-95 {
  547. line-height: 5.938rem;
  548. }
  549. .lh-100 {
  550. line-height: 6.25rem;
  551. }
  552. .lh-105 {
  553. line-height: 6.563rem;
  554. }
  555. .lh-110 {
  556. line-height: 6.875rem;
  557. }
  558. .lh-115 {
  559. line-height: 7.188rem;
  560. }
  561. .lh-120 {
  562. line-height: 7.5rem;
  563. }
  564. .lh-0 {
  565. line-height: 0;
  566. }
  567. .lh-normal {
  568. line-height: normal;
  569. }
  570. .lh-initial {
  571. line-height: initial;
  572. }
  573. .lh-inherit {
  574. line-height: inherit;
  575. }
  576. /* Text color */
  577. .text-white, .btn-link.text-white, a.text-white-hover:hover {
  578. color: var(--white);
  579. }
  580. .text-base-color-hover:hover {
  581. color: var(--base-color) !important;
  582. }
  583. .text-base-color, .btn-link.text-base-color {
  584. color: var(--base-color);
  585. }
  586. .text-black, .btn-link.text-black, a.text-black-hover:hover {
  587. color: var(--black);
  588. }
  589. .text-dark-gray, .btn-link.text-dark-gray, a.text-dark-gray-hover:hover {
  590. color: var(--dark-gray);
  591. }
  592. .text-medium-gray, .btn-link.text-medium-gray, a.text-medium-gray-hover:hover {
  593. color: var(--medium-gray);
  594. }
  595. .text-extra-medium-gray, .btn-link.text-extra-medium-gray, a.text-extra-medium-gray-hover:hover {
  596. color: var(--extra-medium-gray);
  597. }
  598. .text-light-medium-gray, .btn-link.text-light-medium-gray, a.text-light-medium-gray:hover {
  599. color: var(--light-medium-gray);
  600. }
  601. .text-light-gray, .btn-link.text-light-gray, a.text-light-gray-hover:hover {
  602. color: var(--light-gray);
  603. }
  604. .text-very-light-gray, .btn-link.text-very-light-gray, a.text-very-light-gray-hover:hover {
  605. color: var(--very-light-gray);
  606. }
  607. .text-red, .btn-link.text-red, a.text-red-hover:hover {
  608. color: var(--red);
  609. }
  610. .text-green, .btn-link.text-green, a.text-green-hover:hover {
  611. color: var(--green);
  612. }
  613. .text-yellow, .btn-link.text-yellow, a.text-yellow-hover:hover {
  614. color: var(--yellow);
  615. }
  616. .text-golden-yellow, .btn-link.text-golden-yellow, a.text-golden-yellow-hover:hover {
  617. color: var(--golden-yellow);
  618. }
  619. .text-tussock-yellow, .btn-link.text-tussock-yellow, a.text-tussock-yellow-hover:hover {
  620. color: var(--tussock-yellow);
  621. }
  622. .text-cornflower-blue, .btn-link.text-cornflower-blue, a.text-cornflower-blue-hover:hover {
  623. color: var(--cornflower-blue);
  624. }
  625. .text-jade, .btn-link.text-jade, a.text-jade-hover:hover {
  626. color: var(--jade);
  627. }
  628. .text-majorelle-blue {
  629. color: var(--majorelle-blue);
  630. }
  631. .text-orange {
  632. color: var(--orange);
  633. }
  634. .text-crusoe-green {
  635. color: var(--crusoe-green);
  636. }
  637. .text-tropical-blue {
  638. color: var(--tropical-blue);
  639. }
  640. .text-camarone {
  641. color: var(--camarone);
  642. }
  643. .text-seal-brown {
  644. color: var(--seal-brown);
  645. }
  646. .text-Wasabi {
  647. color: var(--Wasabi);
  648. }
  649. /* Text gradient color */
  650. .text-gradient-blue-magenta-orange, .text-gradient-light-gray-white, .text-gradient-light-purple-light-orange, .text-gradient-sky-blue-pink, .text-gradient-light-blue-light-turquoise, .text-gradient-fast-blue-purple-light-orange, .text-gradient-light-pink-light-purple, .text-gradient-fast-blue-purple, .text-gradient-pink-orange, .text-gradient-fast-pink-light-yellow, .text-gradient-purple-pink, .text-gradient-light-pink-light-orange {
  651. -webkit-background-clip: text;
  652. -webkit-text-fill-color: transparent;
  653. }
  654. .text-gradient-light-pink-light-orange {
  655. background-image: linear-gradient(to right, #ffafbd, #ffb3b4, #ffb7ac, #ffbda5, #ffc3a0);
  656. }
  657. .text-gradient-purple-pink {
  658. background-image: linear-gradient(to right, #8b14b1, #ab019e, #c00c8b, #cd267b, #d53d6e);
  659. }
  660. .text-gradient-fast-pink-light-yellow {
  661. background-image: linear-gradient(to right, #f7567f, #fe7177, #ff8a74, #ffa378, #ffba83);
  662. }
  663. .text-gradient-pink-orange {
  664. background-image: linear-gradient(to right, #de347f, #e73a70, #ed4461, #f05152, #ef5f43);
  665. }
  666. .text-gradient-fast-blue-purple {
  667. background-image: linear-gradient(to right, #2a46f4, #5f42f9, #833cfc, #a233fe, #bf25ff);
  668. }
  669. .text-gradient-light-pink-light-purple {
  670. background-image: linear-gradient(to right, #ed579b, #e855ad, #df57c0, #d15cd4, #bc63e8);
  671. }
  672. .text-gradient-fast-blue-purple-light-orange {
  673. background-image: linear-gradient(to right top, #183fb9, #4f41df, #ae2eb9, #ef3f59, #e9522d);
  674. }
  675. .text-gradient-light-blue-light-turquoise {
  676. background-image: linear-gradient(to right, #18cdbb, #22d2ae, #3cd69d, #57da89, #73dc73);
  677. }
  678. .text-gradient-sky-blue-pink {
  679. background-image: linear-gradient(to right, #556fff, #556fff, #e05fc4, #f767a6, #ff798e);
  680. }
  681. .text-gradient-light-purple-light-orange {
  682. background-image: linear-gradient(to right, #b783ff, #b783ff, #fa7cc1, #ff85a6, #ff9393);
  683. }
  684. .text-gradient-light-gray-white {
  685. background-image: linear-gradient(to bottom, #efefef, #efefef, #f7f7f7, #fdfdfc, #ffffff);
  686. }
  687. .text-gradient-blue-magenta-orange {
  688. background-image: linear-gradient(to right, #002fff, #ab00ff, #ff137d, #ff562f, #ee8502);
  689. }
  690. /* Text shadow */
  691. .text-shadow-large {
  692. text-shadow: 0 0 50px rgba(0, 0, 0, 0.9);
  693. }
  694. .text-shadow-extra-large {
  695. text-shadow: 0 0 60px rgba(0, 0, 0, 0.9);
  696. }
  697. .text-shadow-double-large {
  698. text-shadow: 0 0 100px rgba(0, 0, 0, 0.9);
  699. }
  700. /* Text bottom line */
  701. .text-decoration-line-bottom {
  702. border-bottom: 1px solid;
  703. }
  704. .text-decoration-line-bottom-medium {
  705. border-bottom: 2px solid;
  706. }
  707. .text-decoration-line-bottom-thick {
  708. border-bottom: 3px solid;
  709. }
  710. .text-decoration-line-through {
  711. text-decoration: line-through;
  712. }
  713. /* Text outline*/
  714. .text-outline {
  715. -webkit-text-fill-color: transparent;
  716. -webkit-text-stroke-width: 1px;
  717. -webkit-text-stroke-color: var(--white);
  718. }
  719. /* Text stroke width */
  720. .text-outline-width-1px {
  721. -webkit-text-stroke-width: 1px;
  722. }
  723. .text-outline-width-2px {
  724. -webkit-text-stroke-width: 2px;
  725. }
  726. .text-outline-width-3px {
  727. -webkit-text-stroke-width: 3px;
  728. }
  729. .text-outline-width-4px {
  730. -webkit-text-stroke-width: 4px;
  731. }
  732. .text-outline-width-5px {
  733. -webkit-text-stroke-width: 5px;
  734. }
  735. /* Text stroke color */
  736. .text-outline-color-black {
  737. -webkit-text-stroke-color: var(--black);
  738. }
  739. .text-outline-color-base-color {
  740. -webkit-text-stroke-color: var(--base-color);
  741. }
  742. .text-outline-color-red {
  743. -webkit-text-stroke-color: var(--red);
  744. }
  745. .text-outline-color-dark-gray {
  746. -webkit-text-stroke-color: var(--dark-gray);
  747. }
  748. .text-outline-color-medium-gray {
  749. -webkit-text-stroke-color: var(--medium-gray);
  750. }
  751. .text-outline-color-extra-medium-gray {
  752. -webkit-text-stroke-color: var(--extra-medium-gray);
  753. }
  754. /* Letter spacing */
  755. .ls-0px {
  756. letter-spacing: 0px !important;
  757. }
  758. .ls-05px {
  759. letter-spacing: 0.5px !important;
  760. }
  761. .ls-1px {
  762. letter-spacing: 1px !important;
  763. }
  764. .ls-2px {
  765. letter-spacing: 2px !important;
  766. }
  767. .ls-3px {
  768. letter-spacing: 3px !important;
  769. }
  770. .ls-4px {
  771. letter-spacing: 4px !important;
  772. }
  773. .ls-5px {
  774. letter-spacing: 5px !important;
  775. }
  776. .ls-6px {
  777. letter-spacing: 6px !important;
  778. }
  779. .ls-7px {
  780. letter-spacing: 7px !important;
  781. }
  782. .ls-8px {
  783. letter-spacing: 8px !important;
  784. }
  785. .ls-9px {
  786. letter-spacing: 9px !important;
  787. }
  788. .ls-10px {
  789. letter-spacing: 10px !important;
  790. }
  791. .ls-minus-05px {
  792. letter-spacing: -0.5px !important;
  793. }
  794. .ls-minus-1px {
  795. letter-spacing: -1px !important;
  796. }
  797. .ls-minus-2px {
  798. letter-spacing: -2px !important;
  799. }
  800. .ls-minus-3px {
  801. letter-spacing: -3px !important;
  802. }
  803. .ls-minus-4px {
  804. letter-spacing: -4px !important;
  805. }
  806. .ls-minus-5px {
  807. letter-spacing: -5px !important;
  808. }
  809. .ls-minus-6px {
  810. letter-spacing: -6px !important;
  811. }
  812. .ls-minus-7px {
  813. letter-spacing: -7px !important;
  814. }
  815. .ls-minus-8px {
  816. letter-spacing: -8px !important;
  817. }
  818. .ls-minus-9px {
  819. letter-spacing: -9px !important;
  820. }
  821. .ls-minus-10px {
  822. letter-spacing: -10px !important;
  823. }
  824. /* Icon size */
  825. .icon-extra-double-large {
  826. font-size: 80px;
  827. }
  828. .icon-double-large {
  829. font-size: 60px;
  830. }
  831. .icon-extra-large {
  832. font-size: 50px;
  833. }
  834. .icon-large {
  835. font-size: 42px;
  836. }
  837. .icon-medium {
  838. font-size: 34px;
  839. }
  840. .icon-very-medium {
  841. font-size: 28px;
  842. }
  843. .icon-extra-medium {
  844. font-size: 24px;
  845. }
  846. .icon-small {
  847. font-size: 18px;
  848. }
  849. .icon-very-small {
  850. font-size: 14px;
  851. }
  852. /* ===================================
  853. 05. General
  854. ====================================== */
  855. /* Separator line */
  856. .separator-line-1px {
  857. height: 1px;
  858. }
  859. .separator-line-2px {
  860. height: 2px;
  861. }
  862. .separator-line-3px {
  863. height: 3px;
  864. }
  865. .separator-line-4px {
  866. height: 4px;
  867. }
  868. .separator-line-5px {
  869. height: 5px;
  870. }
  871. /* Separator vertical line */
  872. .separator-line-vertical {
  873. -webkit-transform: rotate(-90deg);
  874. transform: rotate(-90deg);
  875. }
  876. /* Separator line size */
  877. .separator-line-small {
  878. width: 35px;
  879. height: 1px;
  880. display: inline-block;
  881. margin-right: 7px;
  882. }
  883. .separator-line-extra-small {
  884. width: 18px;
  885. height: 1px;
  886. display: inline-block;
  887. margin-right: 8px;
  888. vertical-align: middle;
  889. }
  890. .separator-line-very-small {
  891. width: 12px;
  892. height: 1px;
  893. display: inline-block;
  894. margin-right: 9px;
  895. vertical-align: middle;
  896. }
  897. /* Opacity */
  898. .opacity-full-dark, .opacity-full, .opacity-medium, .opacity-extra-medium, .opacity-light, .opacity-very-light {
  899. position: absolute;
  900. height: 100%;
  901. width: 100%;
  902. top: 0;
  903. left: 0;
  904. }
  905. .opacity-very-light {
  906. opacity: 0.2;
  907. }
  908. .opacity-light {
  909. opacity: 0.3;
  910. }
  911. .opacity-extra-medium {
  912. opacity: 0.5;
  913. }
  914. .opacity-medium {
  915. opacity: 0.75;
  916. }
  917. .opacity-full {
  918. opacity: 0.8;
  919. }
  920. .opacity-full-dark {
  921. opacity: 0.9;
  922. }
  923. /* Position */
  924. .position-inherit {
  925. position: inherit !important;
  926. }
  927. .position-initial {
  928. position: initial !important;
  929. }
  930. .absolute-middle-center {
  931. left: 50%;
  932. top: 50%;
  933. position: absolute;
  934. -webkit-transform: translate(-50%, -50%);
  935. transform: translate(-50%, -50%);
  936. }
  937. .absolute-middle-left {
  938. left: 0;
  939. top: 50%;
  940. position: absolute;
  941. -webkit-transform: translateY(-50%);
  942. transform: translateY(-50%);
  943. }
  944. .absolute-middle-right {
  945. right: 0;
  946. top: 50%;
  947. position: absolute;
  948. -webkit-transform: translateY(-50%);
  949. transform: translateY(-50%);
  950. }
  951. .absolute-top-center {
  952. left: 50%;
  953. top: 0;
  954. position: absolute;
  955. -webkit-transform: translateX(-50%);
  956. transform: translateX(-50%);
  957. }
  958. .absolute-bottom-center {
  959. left: 50%;
  960. bottom: 0;
  961. position: absolute;
  962. -webkit-transform: translateX(-50%);
  963. transform: translateX(-50%);
  964. }
  965. .absolute-bottom-left {
  966. left: 0;
  967. bottom: 0;
  968. position: absolute;
  969. }
  970. .absolute-bottom-right {
  971. right: 0;
  972. bottom: 0;
  973. position: absolute;
  974. }
  975. /* Vertical title center */
  976. .vertical-title-center {
  977. display: flex;
  978. height: 100%;
  979. }
  980. .vertical-title-center .title {
  981. -webkit-transform: rotate(180deg);
  982. transform: rotate(180deg);
  983. writing-mode: vertical-lr;
  984. }
  985. /* Skrollr */
  986. .skrollr-parallax {
  987. position: relative !important;
  988. background-size: cover !important;
  989. background-attachment: fixed !important;
  990. transition-timing-function: none;
  991. -webkit-transition-timing-function: none;
  992. transition-duration: 0s;
  993. -webkit-transition-duration: 0s;
  994. }
  995. .skrollr-zoom {
  996. transition: none !important;
  997. }
  998. .blur-box {
  999. backdrop-filter: blur(5px);
  1000. -webkit-backdrop-filter: blur(3px);
  1001. }
  1002. /* Transform */
  1003. .transform-origin-right {
  1004. transform-origin: right;
  1005. }
  1006. .transform-origin-left {
  1007. transform-origin: left;
  1008. }
  1009. .btn.btn-none-transform, .btn.btn-none-transform:hover {
  1010. -webkit-transform: translate3d(0, 0, 0);
  1011. transform: translate3d(0, 0, 0);
  1012. }
  1013. /* Transition */
  1014. .transition {
  1015. -webkit-transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  1016. transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  1017. }
  1018. .transition-inner-all * {
  1019. -webkit-transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  1020. transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  1021. }
  1022. .no-transition {
  1023. -webkit-transition: 0s;
  1024. transition: 0s;
  1025. }
  1026. /* Pointer events */
  1027. .pointer-events-none {
  1028. pointer-events: none;
  1029. }
  1030. .pointer-events-all {
  1031. pointer-events: all;
  1032. }
  1033. /* Sticky column */
  1034. .sticky-wrap {
  1035. position: fixed;
  1036. top: 50%;
  1037. left: 0;
  1038. opacity: 0;
  1039. z-index: 1;
  1040. -webkit-transform: rotate(-90deg) translate(-50%, 50%);
  1041. transform: rotate(-90deg) translate(-50%, 50%);
  1042. transform-origin: 0 50%;
  1043. transition: 1s cubic-bezier(0.7, 0, 0.3, 1) !important;
  1044. }
  1045. .sticky-wrap.shadow-in {
  1046. left: 50px;
  1047. opacity: 1;
  1048. box-shadow: none !important;
  1049. }
  1050. .sticky-wrap.sticky-hidden {
  1051. left: 0;
  1052. opacity: 0;
  1053. }
  1054. .sticky-wrap a {
  1055. color: var(--dark-gray) !important;
  1056. }
  1057. .sticky-wrap a:hover {
  1058. color: var(--dark-gray) !important;
  1059. }
  1060. .sticky-wrap div, .sticky-wrap span, .sticky-wrap p {
  1061. color: var(--dark-gray) !important;
  1062. }
  1063. .sticky-wrap .social-icon-style-10 ul li a:hover {
  1064. color: var(--dark-gray) !important;
  1065. }
  1066. .sticky-wrap.sticky-highlight a {
  1067. color: var(--white) !important;
  1068. }
  1069. .sticky-wrap.sticky-highlight a:hover {
  1070. color: var(--white) !important;
  1071. }
  1072. .sticky-wrap.sticky-highlight div, .sticky-wrap.sticky-highlight span, .sticky-wrap.sticky-highlight p {
  1073. color: var(--white) !important;
  1074. }
  1075. .sticky-wrap.sticky-highlight .separator-line-1px {
  1076. background-color: var(--white) !important;
  1077. }
  1078. .sticky-wrap.sticky-highlight .social-icon-style-10 ul li a:hover {
  1079. color: var(--white) !important;
  1080. }
  1081. .sticky-wrap-right {
  1082. position: fixed;
  1083. top: 50%;
  1084. right: 110px;
  1085. z-index: 1;
  1086. -webkit-transform: rotate(-90deg) translate(50%, 100%);
  1087. transform: rotate(-90deg) translate(50%, 100%);
  1088. transform-origin: 100% 0%;
  1089. }
  1090. /* Overflow */
  1091. .overflow-visible {
  1092. overflow: visible !important;
  1093. }
  1094. .overflow-x-hidden {
  1095. overflow-x: hidden !important;
  1096. }
  1097. .overflow-y-hidden {
  1098. overflow-y: hidden !important;
  1099. }
  1100. /* Overlap section */
  1101. .overlap-section {
  1102. position: relative;
  1103. }
  1104. .overlap-height {
  1105. transition: 0.3s height;
  1106. }
  1107. /* Outside box */
  1108. .outside-box-top-15 {
  1109. margin-top: -15vw;
  1110. }
  1111. .outside-box-top-18 {
  1112. margin-top: -18vw;
  1113. }
  1114. .outside-box-left-1 {
  1115. margin-left: -1vw;
  1116. }
  1117. .outside-box-left-2 {
  1118. margin-left: -2vw;
  1119. }
  1120. .outside-box-left-5 {
  1121. margin-left: -5vw;
  1122. }
  1123. .outside-box-left-7 {
  1124. margin-left: -7vw;
  1125. }
  1126. .outside-box-left-8 {
  1127. margin-left: -8vw;
  1128. }
  1129. .outside-box-left-10 {
  1130. margin-left: -10vw;
  1131. }
  1132. .outside-box-left-15 {
  1133. margin-left: -15vw;
  1134. }
  1135. .outside-box-left-20 {
  1136. margin-left: -20vw;
  1137. }
  1138. .outside-box-left-25 {
  1139. margin-left: -25vw;
  1140. }
  1141. .outside-box-left-30 {
  1142. margin-left: -30vw;
  1143. }
  1144. .outside-box-left-35 {
  1145. margin-left: -35vw;
  1146. }
  1147. .outside-box-left-40 {
  1148. margin-left: -40vw;
  1149. }
  1150. .outside-box-left-50 {
  1151. margin-left: -50vw;
  1152. }
  1153. .outside-box-left-60 {
  1154. margin-left: -60vw;
  1155. }
  1156. .outside-box-left-65 {
  1157. margin-left: -65vw;
  1158. }
  1159. .outside-box-right-1 {
  1160. margin-right: -1vw;
  1161. }
  1162. .outside-box-right-2 {
  1163. margin-right: -2vw;
  1164. }
  1165. .outside-box-right-5 {
  1166. margin-right: -5vw;
  1167. }
  1168. .outside-box-right-7 {
  1169. margin-right: -7vw;
  1170. }
  1171. .outside-box-right-10 {
  1172. margin-right: -10vw;
  1173. }
  1174. .outside-box-right-15 {
  1175. margin-right: -15vw;
  1176. }
  1177. .outside-box-right-20 {
  1178. margin-right: -20vw;
  1179. }
  1180. .outside-box-right-25 {
  1181. margin-right: -25vw;
  1182. }
  1183. .outside-box-right-30 {
  1184. margin-right: -30vw;
  1185. }
  1186. .outside-box-right-35 {
  1187. margin-right: -35vw;
  1188. }
  1189. .outside-box-right-40 {
  1190. margin-right: -40vw;
  1191. }
  1192. .outside-box-right-45 {
  1193. margin-right: -45vw;
  1194. }
  1195. .outside-box-right-50 {
  1196. margin-right: -50vw;
  1197. }
  1198. .outside-box-right-60 {
  1199. margin-right: -60vw;
  1200. }
  1201. .outside-box-right-65 {
  1202. margin-right: -65vw;
  1203. }
  1204. /* CSS filter */
  1205. .filter-mix-100 {
  1206. filter: grayscale(100%) invert(100%);
  1207. }
  1208. .filter-grayscale-100 {
  1209. filter: grayscale(100%);
  1210. }
  1211. /* Box shadow */
  1212. .box-shadow, .box-shadow-hover:hover {
  1213. -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);
  1214. box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);
  1215. -webkit-transition: 350ms ease-in-out;
  1216. transition: 350ms ease-in-out;
  1217. }
  1218. .box-shadow-small, .box-shadow-small-hover:hover {
  1219. -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.08);
  1220. box-shadow: 0 0 15px rgba(0, 0, 0, 0.08);
  1221. -webkit-transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  1222. transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  1223. }
  1224. .box-shadow-medium, .box-shadow-medium-hover:hover {
  1225. -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.08);
  1226. box-shadow: 0 0 20px rgba(0, 0, 0, 0.08);
  1227. -webkit-transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  1228. transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  1229. }
  1230. .box-shadow-medium-bottom, .box-shadow-medium-bottom-hover:hover {
  1231. -webkit-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08);
  1232. box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08);
  1233. -webkit-transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  1234. transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  1235. }
  1236. .box-shadow-large, .box-shadow-large-hover:hover {
  1237. -webkit-box-shadow: 0 0 25px rgba(0, 0, 0, 0.08);
  1238. box-shadow: 0 0 25px rgba(0, 0, 0, 0.08);
  1239. -webkit-transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  1240. transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  1241. }
  1242. .box-shadow-extra-large, .box-shadow-extra-large-hover:hover {
  1243. -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.08);
  1244. box-shadow: 0 0 30px rgba(0, 0, 0, 0.08);
  1245. -webkit-transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  1246. transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  1247. }
  1248. .box-shadow-double-large, .box-shadow-double-large-hover:hover {
  1249. -webkit-box-shadow: 0 0 45px rgba(0, 0, 0, 0.09);
  1250. box-shadow: 0 0 45px rgba(0, 0, 0, 0.09);
  1251. -webkit-transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  1252. transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  1253. }
  1254. .box-shadow-triple-large, .box-shadow-triple-large-hover:hover {
  1255. -webkit-box-shadow: 0 0 60px rgba(0, 0, 0, 0.2);
  1256. box-shadow: 0 0 60px rgba(0, 0, 0, 0.2);
  1257. -webkit-transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  1258. transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  1259. }
  1260. .box-shadow-quadruple-large, .box-shadow-quadruple-large-hover:hover {
  1261. -webkit-box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);
  1262. box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);
  1263. -webkit-transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  1264. transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  1265. }
  1266. .box-shadow-hover:hover, .box-shadow-large-hover:hover, .box-shadow-extra-large-hover:hover, .box-shadow-medium-hover:hover, .box-shadow-small-hover:hover, .box-shadow-double-large-hover:hover, .box-shadow-quadruple-large-hover:hover {
  1267. -webkit-transform: translate3d(0, -3px, 0);
  1268. transform: translate3d(0, -3px, 0);
  1269. }
  1270. .box-shadow-bottom {
  1271. -webkit-box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.05);
  1272. box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.05);
  1273. }
  1274. /* Input */
  1275. input, select, textarea, .form-control, .form-select {
  1276. padding: 12px 25px;
  1277. width: 100%;
  1278. max-width: 100%;
  1279. resize: none;
  1280. outline: none;
  1281. font-size: 16px;
  1282. border: 1px solid var(--extra-medium-gray);
  1283. color: var(--medium-gray);
  1284. line-height: inherit;
  1285. word-break: normal;
  1286. -webkit-transition: 0.3s;
  1287. transition: 0.3s;
  1288. }
  1289. .form-select {
  1290. color: var(--medium-gray);
  1291. }
  1292. .form-select:focus {
  1293. border-color: #dfdfdf;
  1294. }
  1295. input:focus, select:focus, textarea:focus, .form-control:focus {
  1296. border: 1px solid #c2c2c2;
  1297. box-shadow: none !important;
  1298. color: var(--medium-gray);
  1299. }
  1300. ::-webkit-input-placeholder {
  1301. color: var(--medium-gray) !important;
  1302. text-overflow: ellipsis;
  1303. }
  1304. ::-moz-placeholder {
  1305. color: var(--medium-gray) !important;
  1306. text-overflow: ellipsis;
  1307. opacity: 1;
  1308. }
  1309. :-ms-input-placeholder {
  1310. color: var(--medium-gray) !important;
  1311. text-overflow: ellipsis;
  1312. opacity: 1;
  1313. }
  1314. .placeholder-light::-webkit-input-placeholder {
  1315. color: var(--white) !important;
  1316. text-overflow: ellipsis;
  1317. }
  1318. .placeholder-light::-moz-placeholder {
  1319. color: var(--white) !important;
  1320. text-overflow: ellipsis;
  1321. opacity: 1;
  1322. }
  1323. .placeholder-light:-ms-input-placeholder {
  1324. color: var(--white) !important;
  1325. text-overflow: ellipsis;
  1326. opacity: 1;
  1327. }
  1328. .search-error {
  1329. border-color: var(--red) !important;
  1330. }
  1331. /* Select */
  1332. .select {
  1333. position: relative;
  1334. }
  1335. .select:after {
  1336. content: "\e842";
  1337. font-family: feather !important;
  1338. right: 20px;
  1339. top: 50%;
  1340. height: 34px;
  1341. position: absolute;
  1342. pointer-events: none;
  1343. font-size: 22px;
  1344. margin-top: -15px;
  1345. }
  1346. /* Date icon */
  1347. .date-time {
  1348. position: relative;
  1349. }
  1350. .date-icon {
  1351. position: relative;
  1352. }
  1353. .date-icon input[type=date]::-webkit-inner-spin-button,
  1354. .date-icon input[type=date]::-webkit-calendar-picker-indicator {
  1355. -webkit-appearance: none;
  1356. opacity: 0;
  1357. -moz-appearance: none;
  1358. appearance: none;
  1359. }
  1360. .date-icon:after {
  1361. content: "\e83a";
  1362. font-family: feather !important;
  1363. right: 28px;
  1364. top: 50%;
  1365. height: 34px;
  1366. position: absolute;
  1367. pointer-events: none;
  1368. font-size: 22px;
  1369. margin-top: -15px;
  1370. }
  1371. .date-icon input[type=date]::-webkit-date-and-time-value {
  1372. text-align: left !important;
  1373. }
  1374. /* Mozilla firefox */
  1375. @-moz-document url-prefix() {
  1376. .date-icon:after {
  1377. display: none;
  1378. }
  1379. }
  1380. /* Time icon */
  1381. .time-icon {
  1382. position: relative;
  1383. }
  1384. .time-icon input[type=time]::-webkit-inner-spin-button,
  1385. .time-icon input[type=time]::-webkit-calendar-picker-indicator {
  1386. -webkit-appearance: none;
  1387. opacity: 0;
  1388. -moz-appearance: none;
  1389. appearance: none;
  1390. }
  1391. .time-icon:after {
  1392. content: "\e84d";
  1393. font-family: feather !important;
  1394. right: 28px;
  1395. top: 50%;
  1396. height: 34px;
  1397. position: absolute;
  1398. pointer-events: none;
  1399. font-size: 22px;
  1400. margin-top: -15px;
  1401. }
  1402. /* Input size */
  1403. .input-small,
  1404. .textarea-small,
  1405. .select-small {
  1406. padding: 7px 15px;
  1407. font-size: 12px;
  1408. }
  1409. .input-medium,
  1410. .textarea-medium,
  1411. .select-medium {
  1412. padding: 14px 28px;
  1413. }
  1414. .input-large {
  1415. padding: 16px 32px;
  1416. }
  1417. .form-control.is-invalid:focus {
  1418. box-shadow: none;
  1419. }
  1420. /* Box overlay */
  1421. .box-overlay {
  1422. position: absolute;
  1423. top: 0px;
  1424. left: 0px;
  1425. width: 100%;
  1426. height: 100%;
  1427. opacity: 0;
  1428. visibility: hidden;
  1429. -webkit-transition: all 400ms cubic-bezier(0.5, 1, 0.89, 1);
  1430. transition: all 400ms cubic-bezier(0.5, 1, 0.89, 1);
  1431. }
  1432. .hover-box {
  1433. z-index: 1;
  1434. }
  1435. .hover-box * {
  1436. -webkit-transition: all 500ms cubic-bezier(0.5, 1, 0.89, 1);
  1437. transition: all 500ms cubic-bezier(0.5, 1, 0.89, 1);
  1438. will-change: transform;
  1439. }
  1440. .hover-box:hover .box-overlay {
  1441. opacity: 1;
  1442. visibility: visible;
  1443. }
  1444. .hover-box.dark-hover .border-dark-opacity {
  1445. border-color: rgba(35, 35, 35, 0.15) !important;
  1446. }
  1447. .hover-box.dark-hover:hover a, .hover-box.dark-hover:hover p, .hover-box.dark-hover:hover span, .hover-box.dark-hover:hover .btn, .hover-box.dark-hover:hover i, .hover-box.dark-hover:hover b, .hover-box.dark-hover:hover u, .hover-box.dark-hover:hover p, .hover-box.dark-hover:hover h1, .hover-box.dark-hover:hover h2, .hover-box.dark-hover:hover h3, .hover-box.dark-hover:hover h4, .hover-box.dark-hover:hover h5, .hover-box.dark-hover:hover h6 {
  1448. color: var(--white) !important;
  1449. -webkit-text-stroke-color: var(--white);
  1450. }
  1451. .hover-box.dark-hover:hover [class*=separator-line] {
  1452. background-color: var(--white);
  1453. }
  1454. .hover-box.dark-hover:hover [class*=btn-link-gradient] span {
  1455. background: var(--white);
  1456. background-image: none;
  1457. }
  1458. .hover-box.dark-hover:hover [class*=btn-transparent] {
  1459. background-color: var(--white);
  1460. border-color: var(--white);
  1461. color: var(--dark-gray) !important;
  1462. }
  1463. .hover-box.dark-hover:hover .text-light-opacity {
  1464. opacity: 0.7;
  1465. }
  1466. .hover-box.dark-hover:hover .text-medium-opacity {
  1467. opacity: 0.5;
  1468. }
  1469. .hover-box.dark-hover:hover .border-dark-opacity {
  1470. border-color: rgba(255, 255, 255, 0.3) !important;
  1471. }
  1472. .hover-box.dark-hover:hover .content-slide-up .text-light-opacity {
  1473. opacity: 0.7;
  1474. }
  1475. .hover-box.dark-hover:hover .btn-link {
  1476. border-color: var(--white);
  1477. }
  1478. .hover-box.dark-hover:hover [class*=text-gradient-] {
  1479. color: var(--white);
  1480. background-image: none;
  1481. -webkit-background-clip: inherit;
  1482. -webkit-text-fill-color: var(--white);
  1483. -webkit-text-fill-color: var(--white);
  1484. }
  1485. .hover-box.light-hover .border-light-opacity {
  1486. border-color: rgba(255, 255, 255, 0.25) !important;
  1487. }
  1488. .hover-box.light-hover:hover a, .hover-box.light-hover:hover span, .hover-box.light-hover:hover .btn, .hover-box.light-hover:hover i, .hover-box.light-hover:hover b, .hover-box.light-hover:hover u, .hover-box.light-hover:hover p, .hover-box.light-hover:hover h1, .hover-box.light-hover:hover h2, .hover-box.light-hover:hover h3, .hover-box.light-hover:hover h4, .hover-box.light-hover:hover h5, .hover-box.light-hover:hover h6 {
  1489. color: var(--dark-gray) !important;
  1490. }
  1491. .hover-box.light-hover:hover .text-light-opacity {
  1492. opacity: 0.7;
  1493. }
  1494. .hover-box.light-hover:hover .text-medium-opacity {
  1495. opacity: 0.5;
  1496. }
  1497. .hover-box.light-hover:hover .border-light-opacity {
  1498. border-color: rgba(35, 35, 35, 0.15) !important;
  1499. }
  1500. .hover-box.light-hover:hover .content-slide-up .text-light-opacity {
  1501. opacity: 0.7;
  1502. }
  1503. .hover-box.light-hover:hover .btn-link {
  1504. border-color: var(--dark-gray);
  1505. }
  1506. .hover-box.light-hover:hover [class*=separator-line] {
  1507. background-color: var(--dark-gray);
  1508. }
  1509. .hover-box.light-hover:hover [class*=text-gradient-] {
  1510. color: var(--dark-gray);
  1511. background-image: none;
  1512. -webkit-background-clip: var(--dark-gray);
  1513. -webkit-text-fill-color: var(--dark-gray);
  1514. }
  1515. /* Swiper slider pagination */
  1516. .swiper-horizontal > .swiper-pagination-bullets, .swiper-vertical > .swiper-pagination-bullets {
  1517. bottom: 45px;
  1518. left: 50%;
  1519. width: auto;
  1520. cursor: default;
  1521. -webkit-transform: translateX(-50%);
  1522. transform: translateX(-50%);
  1523. }
  1524. .swiper-horizontal > .swiper-pagination-bullets-right, .swiper-vertical > .swiper-pagination-bullets-right {
  1525. bottom: auto;
  1526. top: 50%;
  1527. right: 60px;
  1528. left: auto;
  1529. width: auto;
  1530. -webkit-transform: translateY(-50%);
  1531. transform: translateY(-50%);
  1532. text-align: right;
  1533. }
  1534. .swiper-horizontal > .swiper-pagination-bullets-right .swiper-pagination-bullet, .swiper-vertical > .swiper-pagination-bullets-right .swiper-pagination-bullet {
  1535. display: block;
  1536. margin: 25px 0 !important;
  1537. }
  1538. .swiper-dark-pagination .swiper-pagination-bullet {
  1539. width: 8px;
  1540. height: 8px;
  1541. margin: 0 15px !important;
  1542. opacity: 1;
  1543. background-color: var(--light-gray);
  1544. -webkit-transition: 0.3s;
  1545. transition: 0.3s;
  1546. outline: none;
  1547. }
  1548. .swiper-dark-pagination .swiper-pagination-bullet:before {
  1549. content: "";
  1550. width: 30px;
  1551. height: 30px;
  1552. border: 1px solid var(--dark-gray);
  1553. background: transparent;
  1554. display: inline-block;
  1555. border-radius: 50%;
  1556. position: relative;
  1557. top: 50%;
  1558. left: 50%;
  1559. -webkit-transform: translate(-50%, -50%);
  1560. transform: translate(-50%, -50%);
  1561. -webkit-transition: 0.3s;
  1562. transition: 0.3s;
  1563. opacity: 0;
  1564. }
  1565. .swiper-dark-pagination .swiper-pagination-bullet:hover {
  1566. background-color: var(--dark-gray);
  1567. }
  1568. .swiper-dark-pagination .swiper-pagination-bullet:hover:before {
  1569. opacity: 1;
  1570. }
  1571. .swiper-dark-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  1572. background-color: var(--dark-gray);
  1573. }
  1574. .swiper-dark-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active:before {
  1575. opacity: 1;
  1576. }
  1577. .swiper-light-pagination .swiper-pagination-bullet {
  1578. width: 8px;
  1579. height: 8px;
  1580. margin: 0 15px !important;
  1581. display: inline-block;
  1582. vertical-align: middle;
  1583. background-color: var(--white);
  1584. -webkit-transition: 0.3s;
  1585. transition: 0.3s;
  1586. outline: none;
  1587. opacity: 0.5;
  1588. }
  1589. .swiper-light-pagination .swiper-pagination-bullet:before {
  1590. content: "";
  1591. width: 30px;
  1592. height: 30px;
  1593. border: 2px solid rgba(255, 255, 255, 0.2);
  1594. background: transparent;
  1595. display: inline-block;
  1596. border-radius: 50%;
  1597. position: relative;
  1598. top: 50%;
  1599. left: 50%;
  1600. -webkit-transform: translate(-50%, -50%);
  1601. transform: translate(-50%, -50%);
  1602. -webkit-transition: 0.3s;
  1603. transition: 0.3s;
  1604. opacity: 0;
  1605. }
  1606. .swiper-light-pagination .swiper-pagination-bullet:hover {
  1607. background-color: var(--white);
  1608. opacity: 1;
  1609. }
  1610. .swiper-light-pagination .swiper-pagination-bullet:hover:before {
  1611. opacity: 1;
  1612. }
  1613. .swiper-light-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  1614. background-color: var(--white);
  1615. opacity: 1;
  1616. }
  1617. .swiper-light-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active:before {
  1618. opacity: 1;
  1619. }
  1620. /* Swiper pagination style 02 */
  1621. .swiper-pagination-style-2 .swiper-pagination-bullet {
  1622. width: 8px;
  1623. height: 8px;
  1624. margin: 0 6px !important;
  1625. }
  1626. .swiper-pagination-style-2 .swiper-pagination-bullet:before {
  1627. display: none;
  1628. }
  1629. /* Swiper pagination style 03 */
  1630. .swiper-pagination-style-3 .swiper-pagination-bullet {
  1631. width: 14px;
  1632. height: 14px;
  1633. background: transparent;
  1634. opacity: 0.4;
  1635. margin: 0 7px !important;
  1636. border: 2px solid var(--white);
  1637. }
  1638. .swiper-pagination-style-3 .swiper-pagination-bullet:hover, .swiper-pagination-style-3 .swiper-pagination-bullet.swiper-pagination-bullet-active {
  1639. background-color: var(--white);
  1640. opacity: 1;
  1641. -webkit-transform: scale(1.3);
  1642. transform: scale(1.3);
  1643. }
  1644. .swiper-pagination-style-3 .swiper-pagination-bullet:before {
  1645. display: none;
  1646. }
  1647. .swiper-pagination-style-3.dark .swiper-pagination-bullet {
  1648. border: 2px solid var(--dark-gray);
  1649. }
  1650. .swiper-pagination-style-3.dark .swiper-pagination-bullet.swiper-pagination-bullet-active {
  1651. background-color: var(--dark-gray);
  1652. }
  1653. /* Swiper pagination style 04 */
  1654. .swiper-pagination-style-4 .swiper-pagination-bullet {
  1655. width: 8px;
  1656. height: 8px;
  1657. background: var(--white);
  1658. opacity: 1;
  1659. position: relative;
  1660. margin: 0 25px !important;
  1661. border: 0;
  1662. }
  1663. .swiper-pagination-style-4 .swiper-pagination-bullet:hover, .swiper-pagination-style-4 .swiper-pagination-bullet.swiper-pagination-bullet-active {
  1664. background-color: var(--base-color);
  1665. opacity: 1;
  1666. border: 0;
  1667. }
  1668. .swiper-pagination-style-4.dark .swiper-pagination-bullet {
  1669. background: var(--dark-gray);
  1670. }
  1671. .swiper-pagination-style-4.dark .swiper-pagination-bullet:hover, .swiper-pagination-style-4.dark .swiper-pagination-bullet.swiper-pagination-bullet-active {
  1672. background-color: var(--base-color);
  1673. }
  1674. /* Custom image pagination */
  1675. .slider-custom-image .slider-custom-image-pagination {
  1676. display: flex;
  1677. align-items: center;
  1678. bottom: 0;
  1679. }
  1680. .slider-custom-image .slider-custom-image-pagination .swiper-pagination-bullet {
  1681. margin: 0 15px !important;
  1682. outline: none;
  1683. opacity: 0.8;
  1684. width: 100px;
  1685. height: 100px;
  1686. margin: 0 15px !important;
  1687. background-size: cover;
  1688. -webkit-transition: 0.3s;
  1689. transition: 0.3s;
  1690. -webkit-filter: grayscale(1);
  1691. filter: grayscale(1);
  1692. }
  1693. .slider-custom-image .slider-custom-image-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  1694. -webkit-filter: grayscale(0);
  1695. filter: grayscale(0);
  1696. -webkit-transform: scale(1.2);
  1697. transform: scale(1.2);
  1698. opacity: 1;
  1699. }
  1700. .slider-custom-image .slider-custom-image-pagination.slider-custom-image-pagination-top {
  1701. top: 0;
  1702. bottom: auto;
  1703. }
  1704. /* Swiper number pagination style 01 */
  1705. .swiper-number-pagination-style-01 .swiper-number {
  1706. text-align: left;
  1707. bottom: 70px;
  1708. }
  1709. .swiper-number-pagination-style-01 .swiper-number .swiper-pagination-bullet {
  1710. position: relative;
  1711. padding-right: 10px;
  1712. padding-left: 8px;
  1713. margin: 0;
  1714. color: var(--white);
  1715. opacity: 0.7;
  1716. width: auto;
  1717. -webkit-transition: 0.5s;
  1718. transition: 0.5s;
  1719. height: auto;
  1720. background: transparent;
  1721. border-radius: 0;
  1722. outline: none;
  1723. }
  1724. .swiper-number-pagination-style-01 .swiper-number .swiper-pagination-bullet.swiper-pagination-bullet-active {
  1725. opacity: 1;
  1726. }
  1727. .swiper-number-pagination-style-01 .swiper-number .swiper-pagination-bullet.swiper-pagination-bullet-active:after {
  1728. width: 70px;
  1729. }
  1730. .swiper-number-pagination-style-01 .swiper-number .swiper-pagination-bullet:after {
  1731. width: 0;
  1732. height: 1px;
  1733. content: "";
  1734. margin-left: 15px;
  1735. display: inline-block;
  1736. background: var(--white);
  1737. vertical-align: middle;
  1738. -webkit-transition: 0.5s;
  1739. transition: 0.5s;
  1740. }
  1741. /* Swiper number pagination style 02 */
  1742. .swiper-number-pagination-style-02 .swiper-number {
  1743. width: auto;
  1744. left: inherit;
  1745. right: 60px;
  1746. padding: 0;
  1747. }
  1748. .swiper-number-pagination-style-02 .swiper-number .swiper-pagination-bullet {
  1749. position: relative;
  1750. font-family: var(--alt-font);
  1751. font-size: 15px;
  1752. display: block;
  1753. color: var(--white);
  1754. margin: 10px 0 !important;
  1755. opacity: 0.7;
  1756. width: 56px;
  1757. -webkit-transition: 0.4s;
  1758. transition: 0.4s;
  1759. height: 56px;
  1760. background: transparent;
  1761. border-radius: 100%;
  1762. text-align: center;
  1763. line-height: 56px;
  1764. outline: none;
  1765. }
  1766. .swiper-number-pagination-style-02 .swiper-number .swiper-pagination-bullet.swiper-pagination-bullet-active {
  1767. opacity: 1;
  1768. }
  1769. .swiper-number-pagination-style-02 .swiper-number .swiper-pagination-bullet.swiper-pagination-bullet-active:before {
  1770. opacity: 1;
  1771. -webkit-transform: scale(1);
  1772. transform: scale(1);
  1773. -webkit-transition: 0.4s;
  1774. transition: 0.4s;
  1775. background: rgba(0, 0, 0, 0.45);
  1776. z-index: -1;
  1777. }
  1778. .swiper-number-pagination-style-02 .swiper-number .swiper-pagination-bullet:before {
  1779. width: 56px;
  1780. height: 56px;
  1781. border-radius: 100%;
  1782. content: "";
  1783. position: absolute;
  1784. top: 0;
  1785. left: 0;
  1786. -webkit-transform: scale(0.7);
  1787. transform: scale(0.7);
  1788. }
  1789. /* Swiper line pagination style 01 */
  1790. .swiper-line-pagination-style-01 .swiper-line-pagination {
  1791. text-align: center;
  1792. bottom: 0;
  1793. width: 100%;
  1794. left: 0;
  1795. }
  1796. .swiper-line-pagination-style-01 .swiper-line-pagination .swiper-pagination-bullet {
  1797. width: 100px;
  1798. height: 2px;
  1799. margin: 0 !important;
  1800. border-radius: 0;
  1801. }
  1802. .swiper-line-pagination-style-01 .swiper-line-pagination .swiper-pagination-bullet:before {
  1803. display: none;
  1804. }
  1805. .swiper-line-pagination-style-01 .swiper-line-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  1806. background-color: var(--base-color);
  1807. }
  1808. .swiper-h-pagination:after {
  1809. display: none;
  1810. }
  1811. /* Swiper number line pagination style */
  1812. .swiper-number-pagination-progress .swiper-pagination-wrapper .number-prev, .swiper-number-pagination-progress .swiper-pagination-wrapper .number-next {
  1813. width: 50px;
  1814. text-align: center;
  1815. }
  1816. .swiper-number-pagination-progress .swiper-pagination-wrapper .swiper-pagination {
  1817. position: inherit;
  1818. width: auto;
  1819. }
  1820. .swiper-number-pagination-progress .swiper-pagination-wrapper .swiper-pagination .swiper-pagination-bullet {
  1821. width: 60px;
  1822. height: 1px;
  1823. vertical-align: middle;
  1824. margin: 0;
  1825. background-color: var(--medium-gray);
  1826. }
  1827. /* Swiper number navigation style */
  1828. .swiper-number-navigation-style .swiper-button-prev, .swiper-number-navigation-style .swiper-button-next {
  1829. top: inherit;
  1830. bottom: 0;
  1831. position: inherit;
  1832. display: inline-block;
  1833. vertical-align: middle;
  1834. transform: none;
  1835. width: auto;
  1836. height: auto;
  1837. }
  1838. .swiper-number-navigation-style .swiper-button-prev i, .swiper-number-navigation-style .swiper-button-prev .number-prev, .swiper-number-navigation-style .swiper-button-prev .number-next, .swiper-number-navigation-style .swiper-button-next i, .swiper-number-navigation-style .swiper-button-next .number-prev, .swiper-number-navigation-style .swiper-button-next .number-next {
  1839. display: inline-block;
  1840. vertical-align: middle;
  1841. }
  1842. .swiper-number-navigation-style .swiper-button-prev .number-prev, .swiper-number-navigation-style .swiper-button-prev .number-next, .swiper-number-navigation-style .swiper-button-next .number-prev, .swiper-number-navigation-style .swiper-button-next .number-next {
  1843. width: 50px;
  1844. text-align: center;
  1845. }
  1846. /* Swiper pagination progress style */
  1847. .swiper-pagination-progress {
  1848. width: 220px;
  1849. height: 1px;
  1850. position: relative;
  1851. }
  1852. .swiper-pagination-progress .swiper-progress {
  1853. position: absolute;
  1854. top: 0;
  1855. left: 0;
  1856. height: 100%;
  1857. width: var(--swiper-progress, 0);
  1858. background-color: var(--base-color);
  1859. -webkit-transition: 0.4s;
  1860. transition: 0.4s;
  1861. }
  1862. /* Swiper pagination progress style */
  1863. .swiper-number-pagination-progress-vertical .swiper-pagination-wrapper {
  1864. position: absolute;
  1865. right: 40px;
  1866. top: 50%;
  1867. -webkit-transform: translateY(-50%);
  1868. transform: translateY(-50%);
  1869. z-index: 99;
  1870. }
  1871. .swiper-number-pagination-progress-vertical .swiper-pagination-wrapper .swiper-progress {
  1872. position: absolute;
  1873. top: 0;
  1874. left: 0;
  1875. width: 2px;
  1876. height: var(--swiper-progress, 0);
  1877. background-color: var(--dark-gray);
  1878. -webkit-transition: 0.4s;
  1879. transition: 0.4s;
  1880. }
  1881. .swiper-number-pagination-progress-vertical .swiper-pagination-wrapper .pagination-progress-vertical {
  1882. transform: rotate(180deg);
  1883. writing-mode: vertical-lr;
  1884. }
  1885. .swiper-number-pagination-progress-vertical .swiper-pagination-wrapper .swiper-pagination-progress {
  1886. width: 2px;
  1887. height: 100px;
  1888. background-color: var(--extra-medium-gray);
  1889. }
  1890. .swiper-number-pagination-progress-vertical .swiper-pagination-wrapper .number-next {
  1891. margin-top: 15px;
  1892. width: auto;
  1893. }
  1894. .swiper-number-pagination-progress-vertical .swiper-pagination-wrapper .number-prev {
  1895. margin-bottom: 15px;
  1896. width: auto;
  1897. }
  1898. /* Swiper pagination bottom */
  1899. .swiper-pagination-bottom .swiper-button-prev, .swiper-pagination-bottom .swiper-button-next {
  1900. top: inherit;
  1901. bottom: 0;
  1902. }
  1903. /* Swiper navigation */
  1904. .swiper-button-prev, .swiper-button-next {
  1905. outline: none;
  1906. cursor: pointer;
  1907. height: 45px;
  1908. width: 45px;
  1909. margin-top: 0;
  1910. text-align: center;
  1911. display: -webkit-box;
  1912. display: -ms-flexbox;
  1913. display: flex;
  1914. -webkit-box-align: center;
  1915. -ms-flex-align: center;
  1916. align-items: center;
  1917. -webkit-box-pack: center;
  1918. -ms-flex-pack: center;
  1919. justify-content: center;
  1920. -webkit-transform: translateY(-50%);
  1921. transform: translateY(-50%);
  1922. -webkit-transition: 0.3s;
  1923. transition: 0.3s;
  1924. }
  1925. .swiper-button-prev:hover, .swiper-button-next:hover {
  1926. opacity: 0.8;
  1927. }
  1928. .swiper-button-next {
  1929. left: inherit;
  1930. }
  1931. /* Swiper navigation style 01 */
  1932. .slider-navigation-style-01 {
  1933. position: absolute;
  1934. top: 50%;
  1935. left: 65px;
  1936. -webkit-border-radius: 100%;
  1937. border-radius: 100%;
  1938. -webkit-transform: translateY(-50%);
  1939. transform: translateY(-50%);
  1940. -webkit-transition: 0.3s;
  1941. transition: 0.3s;
  1942. }
  1943. .slider-navigation-style-01.swiper-button-next {
  1944. right: 65px;
  1945. left: inherit;
  1946. }
  1947. .slider-navigation-style-01:hover {
  1948. opacity: 0.8;
  1949. }
  1950. /* Swiper navigation style 02 */
  1951. .slider-navigation-style-02 {
  1952. position: absolute;
  1953. top: 50%;
  1954. left: 0;
  1955. -webkit-transform: translateY(-50%);
  1956. transform: translateY(-50%);
  1957. z-index: 99;
  1958. }
  1959. .slider-navigation-style-02.swiper-button-next {
  1960. right: 0;
  1961. left: auto;
  1962. }
  1963. /* Swiper navigation style 03 */
  1964. .slider-navigation-style-03 {
  1965. position: absolute;
  1966. top: 50%;
  1967. left: -60px;
  1968. width: 40px;
  1969. height: 40px;
  1970. background: var(--white);
  1971. -webkit-border-radius: 100%;
  1972. border-radius: 100%;
  1973. -webkit-transform: translateY(-50%);
  1974. transform: translateY(-50%);
  1975. -webkit-transition: 0.3s;
  1976. transition: 0.3s;
  1977. }
  1978. .slider-navigation-style-03.swiper-button-next {
  1979. right: -60px;
  1980. left: inherit;
  1981. }
  1982. .slider-navigation-style-03:hover {
  1983. -webkit-box-shadow: 0px 0 20px rgba(35, 35, 35, 0.1);
  1984. box-shadow: 0px 0 20px rgba(35, 35, 35, 0.1);
  1985. }
  1986. /* Swiper navigation style 04 */
  1987. .slider-navigation-style-04 {
  1988. height: 56px;
  1989. width: 56px;
  1990. border-radius: 100%;
  1991. position: relative;
  1992. bottom: inherit;
  1993. left: 0;
  1994. top: inherit;
  1995. -webkit-transform: translateY(0px);
  1996. transform: translateY(0px);
  1997. -webkit-transition: 0.3s;
  1998. transition: 0.3s;
  1999. }
  2000. .slider-navigation-style-04 i {
  2001. -webkit-transition: 0.3s;
  2002. transition: 0.3s;
  2003. display: -webkit-box;
  2004. display: -ms-flexbox;
  2005. display: flex;
  2006. }
  2007. .slider-navigation-style-04:hover i {
  2008. opacity: 0.5;
  2009. }
  2010. .slider-navigation-style-04.swiper-button-prev {
  2011. margin-right: 5px;
  2012. }
  2013. .slider-navigation-style-04.swiper-button-next {
  2014. margin-left: 5px;
  2015. }
  2016. /* Swiper navigation style 05 */
  2017. .slider-navigation-style-05 {
  2018. left: -30%;
  2019. }
  2020. .slider-navigation-style-05.swiper-button-next {
  2021. right: -30%;
  2022. left: inherit;
  2023. }
  2024. /* Swiper navigation style 06 */
  2025. .slider-navigation-style-06 {
  2026. width: auto;
  2027. height: auto;
  2028. left: 60px;
  2029. }
  2030. .slider-navigation-style-06.swiper-button-next {
  2031. right: 60px;
  2032. left: inherit;
  2033. }
  2034. /* Swiper navigation style 07 */
  2035. .slider-navigation-style-07 {
  2036. left: 50%;
  2037. bottom: 0;
  2038. top: inherit;
  2039. width: 75px;
  2040. height: 75px;
  2041. -webkit-transform: translateX(-100%);
  2042. transform: translateX(-100%);
  2043. }
  2044. .slider-navigation-style-07.swiper-button-next {
  2045. bottom: 1px;
  2046. -webkit-transform: translate(-100%, -100%);
  2047. transform: translate(-100%, -100%);
  2048. }
  2049. /* Swiper navigation style 08 */
  2050. .slider-navigation-style-08 {
  2051. width: auto;
  2052. height: auto;
  2053. position: relative;
  2054. -webkit-transform: translateX(0px);
  2055. transform: translateX(0px);
  2056. left: 0;
  2057. }
  2058. .slider-navigation-style-08.swiper-button-next {
  2059. right: 0;
  2060. left: inherit;
  2061. }
  2062. /* Slider custom text */
  2063. .slider-custom-verticle-text > span {
  2064. -webkit-transform: rotate(-90deg);
  2065. transform: rotate(-90deg);
  2066. }
  2067. .swiper-button-prev.slider-custom-text-prev, .swiper-button-prev.slider-custom-text-next, .swiper-button-next.slider-custom-text-prev, .swiper-button-next.slider-custom-text-next {
  2068. width: auto;
  2069. height: auto;
  2070. min-height: 125px;
  2071. -webkit-transition: 0.3s;
  2072. transition: 0.3s;
  2073. -webkit-user-select: none;
  2074. -ms-user-select: none;
  2075. user-select: none;
  2076. }
  2077. .swiper-button-prev.slider-custom-text-prev:hover, .swiper-button-prev.slider-custom-text-next:hover, .swiper-button-next.slider-custom-text-prev:hover, .swiper-button-next.slider-custom-text-next:hover {
  2078. opacity: 0.5;
  2079. }
  2080. .swiper-button-prev.slider-custom-text-prev {
  2081. border-right: 1px solid var(--extra-medium-gray);
  2082. padding-right: 50px;
  2083. }
  2084. .swiper-button-next.slider-custom-text-next {
  2085. border-left: 1px solid var(--extra-medium-gray);
  2086. padding-left: 50px;
  2087. }
  2088. /* Swiper width auto */
  2089. .swiper-width-auto .swiper-slide {
  2090. width: auto;
  2091. }
  2092. /* Slider shadow */
  2093. .slider-shadow-right {
  2094. mask-image: linear-gradient(to right, transparent 0%, #000000 0%, #000000 50%, transparent 80%);
  2095. -webkit-mask-image: linear-gradient(to right, transparent 0%, #000000 0%, #000000 50%, transparent 80%);
  2096. }
  2097. .slider-shadow-left {
  2098. mask-image: linear-gradient(to right, transparent 50%, #000000 80%, #000000 0%, transparent 0%);
  2099. -webkit-mask-image: linear-gradient(to right, transparent 50%, #000000 80%, #000000 0%, transparent 0%);
  2100. }
  2101. .slider-shadow-left-right {
  2102. mask-image: linear-gradient(to right, transparent 18%, #000000 22%, #000000 78%, transparent 82%);
  2103. -webkit-mask-image: linear-gradient(to right, transparent 18%, #000000 22%, #000000 78%, transparent 82%);
  2104. }
  2105. .slider-shadow-none .swiper {
  2106. mask-image: none !important;
  2107. -webkit-mask-image: none !important;
  2108. }
  2109. /* Highlight separator */
  2110. .highlight-separator {
  2111. position: relative;
  2112. padding-bottom: 20px;
  2113. }
  2114. .highlight-separator[data-shadow-animation] {
  2115. box-shadow: none !important;
  2116. display: inline-block;
  2117. }
  2118. .highlight-separator[data-shadow-animation] span {
  2119. clip-path: inset(0px 100% 0px 0px);
  2120. float: left;
  2121. width: 100%;
  2122. height: 20px;
  2123. transition: clip-path 1s;
  2124. transition-timing-function: cubic-bezier(0.4, 0.6, 0.4, 1);
  2125. position: absolute;
  2126. left: 0;
  2127. bottom: 0;
  2128. }
  2129. .highlight-separator[data-shadow-animation] span img {
  2130. position: absolute;
  2131. left: 0;
  2132. bottom: 0;
  2133. transition: none;
  2134. width: 100%;
  2135. height: 14px;
  2136. }
  2137. .highlight-separator.shadow-in[data-shadow-animation] span {
  2138. clip-path: inset(0px 0 0px 0px);
  2139. }
  2140. /* Full screen */
  2141. .full-screen {
  2142. height: 100vh;
  2143. }
  2144. .full-screen.top-space-margin {
  2145. height: calc(100vh - 96px);
  2146. }
  2147. /* Video icons */
  2148. @-webkit-keyframes video-icon-sonar {
  2149. 0% {
  2150. opacity: 1;
  2151. -webkit-transform: scale(0.1);
  2152. transform: scale(0.1);
  2153. }
  2154. 100% {
  2155. opacity: 0;
  2156. -webkit-transform: scale(1.1);
  2157. transform: scale(1.1);
  2158. }
  2159. }
  2160. @keyframes video-icon-sonar {
  2161. 0% {
  2162. opacity: 1;
  2163. -webkit-transform: scale(0.1);
  2164. transform: scale(0.1);
  2165. }
  2166. 100% {
  2167. opacity: 0;
  2168. -webkit-transform: scale(1.1);
  2169. transform: scale(1.1);
  2170. }
  2171. }
  2172. .video-icon-box {
  2173. z-index: 1;
  2174. }
  2175. .video-icon-box > span {
  2176. display: -webkit-inline-box;
  2177. display: inline-flex;
  2178. -webkit-box-orient: horizontal;
  2179. -webkit-box-direction: normal;
  2180. flex-flow: row wrap;
  2181. -webkit-box-align: center;
  2182. align-items: center;
  2183. -webkit-box-pack: center;
  2184. -ms-flex-pack: center;
  2185. justify-content: center;
  2186. }
  2187. /* HTML video play */
  2188. .html-video-play .video-icon .play-icon, .html-video-play .video-icon .pause-icon {
  2189. position: absolute;
  2190. left: 50%;
  2191. -webkit-transform: translate(-50%, -50%);
  2192. transform: translate(-50%, -50%);
  2193. }
  2194. .html-video-play .video-icon .play-icon, .html-video-play .video-icon .pause-icon {
  2195. opacity: 1;
  2196. top: 50%;
  2197. padding-left: 5px;
  2198. visibility: visible;
  2199. -webkit-transition: all 0.4s linear;
  2200. transition: all 0.4s linear;
  2201. }
  2202. .html-video-play .video-icon .pause-icon {
  2203. top: 100%;
  2204. padding-left: 0;
  2205. opacity: 0;
  2206. }
  2207. .html-video-play[playing=true] .video-icon .pause-icon {
  2208. top: 50%;
  2209. opacity: 1;
  2210. }
  2211. .html-video-play[playing=true] .video-icon .play-icon {
  2212. top: 0%;
  2213. opacity: 0;
  2214. }
  2215. .video-play-icon {
  2216. z-index: 1 !important;
  2217. }
  2218. .video-play-icon.remove-play-icon + .html-video-play {
  2219. opacity: 0 !important;
  2220. }
  2221. .video-play-icon.remove-play-icon + .html-video-play:hover {
  2222. opacity: 1 !important;
  2223. }
  2224. .video-play-icon.remove-play-icon:hover + .html-video-play {
  2225. opacity: 1 !important;
  2226. }
  2227. .video-icon {
  2228. position: relative;
  2229. display: -webkit-inline-box;
  2230. display: inline-flex;
  2231. -webkit-box-align: center;
  2232. align-items: center;
  2233. -webkit-box-pack: center;
  2234. justify-content: center;
  2235. border-radius: 50%;
  2236. }
  2237. .video-icon i {
  2238. margin-left: 5px;
  2239. }
  2240. .video-icon .video-icon-sonar {
  2241. position: absolute;
  2242. width: 100%;
  2243. height: 100%;
  2244. border-radius: 50%;
  2245. top: 0;
  2246. left: 0;
  2247. z-index: -10;
  2248. -webkit-animation: video-icon-sonar 2s linear infinite;
  2249. animation: video-icon-sonar 2s linear infinite;
  2250. }
  2251. .video-icon .video-icon-sonar .video-icon-sonar-bfr {
  2252. content: "";
  2253. position: absolute;
  2254. border-radius: 50%;
  2255. top: -25px;
  2256. left: -25px;
  2257. z-index: -100;
  2258. }
  2259. .video-icon .video-icon-sonar .video-icon-sonar-afr {
  2260. content: "";
  2261. position: absolute;
  2262. border-radius: 50%;
  2263. top: -10px;
  2264. left: -10px;
  2265. z-index: -50;
  2266. }
  2267. .video-icon-small .video-icon {
  2268. width: 40px;
  2269. height: 40px;
  2270. font-size: 11px;
  2271. }
  2272. .video-icon-small .video-icon .video-icon-sonar .video-icon-sonar-bfr {
  2273. top: -15px;
  2274. left: -15px;
  2275. width: 70px;
  2276. height: 70px;
  2277. }
  2278. .video-icon-small .video-icon .video-icon-sonar .video-icon-sonar-afr {
  2279. top: 0px;
  2280. left: 0px;
  2281. width: 40px;
  2282. height: 40px;
  2283. }
  2284. .video-icon-medium .video-icon {
  2285. width: 50px;
  2286. height: 50px;
  2287. font-size: 14px;
  2288. }
  2289. .video-icon-medium .video-icon .video-icon-sonar .video-icon-sonar-bfr {
  2290. width: 100px;
  2291. height: 100px;
  2292. }
  2293. .video-icon-medium .video-icon .video-icon-sonar .video-icon-sonar-afr {
  2294. width: 70px;
  2295. height: 70px;
  2296. }
  2297. .video-icon-large.video-icon-box .video-icon i {
  2298. margin-left: 5px;
  2299. }
  2300. .video-icon-large .video-icon {
  2301. width: 85px;
  2302. height: 85px;
  2303. font-size: 20px;
  2304. }
  2305. .video-icon-large .video-icon .video-icon-sonar .video-icon-sonar-bfr {
  2306. width: 135px;
  2307. height: 135px;
  2308. }
  2309. .video-icon-large .video-icon .video-icon-sonar .video-icon-sonar-afr {
  2310. width: 105px;
  2311. height: 105px;
  2312. }
  2313. .video-icon-extra-large.video-icon-box .video-icon i {
  2314. margin-left: 10px;
  2315. }
  2316. .video-icon-extra-large .video-icon {
  2317. width: 120px;
  2318. height: 120px;
  2319. font-size: 30px;
  2320. }
  2321. .video-icon-extra-large .video-icon .video-icon-sonar .video-icon-sonar-bfr {
  2322. width: 170px;
  2323. height: 170px;
  2324. }
  2325. .video-icon-extra-large .video-icon .video-icon-sonar .video-icon-sonar-afr {
  2326. width: 140px;
  2327. height: 140px;
  2328. }
  2329. /* Will change */
  2330. .will-change-transform * {
  2331. will-change: transform;
  2332. }
  2333. .will-change-inherit * {
  2334. will-change: inherit !important;
  2335. }
  2336. .animation-rotation {
  2337. -webkit-animation: rotation 8s infinite linear;
  2338. }
  2339. @-webkit-keyframes rotation {
  2340. from {
  2341. -webkit-transform: rotate(0deg);
  2342. }
  2343. to {
  2344. -webkit-transform: rotate(359deg);
  2345. }
  2346. }
  2347. /* Float animation */
  2348. .animation-float {
  2349. animation: float 2000ms linear 500ms infinite alternate both;
  2350. }
  2351. @keyframes float {
  2352. 0% {
  2353. transform: translateY(0px);
  2354. }
  2355. 50% {
  2356. transform: translateY(15px);
  2357. }
  2358. 100% {
  2359. transform: translateY(30px);
  2360. }
  2361. }
  2362. .animation-float-small {
  2363. animation: float 2000ms linear 500ms infinite alternate both;
  2364. }
  2365. @keyframes float {
  2366. 0% {
  2367. transform: translateY(0px);
  2368. }
  2369. 50% {
  2370. transform: translateY(5px);
  2371. }
  2372. 100% {
  2373. transform: translateY(10px);
  2374. }
  2375. }
  2376. /* Zoom animation */
  2377. .animation-zoom {
  2378. animation: zoom-in-zoom-out 2000ms linear 500ms infinite alternate both;
  2379. }
  2380. @keyframes zoom-in-zoom-out {
  2381. 0% {
  2382. transform: scale(1, 1);
  2383. }
  2384. 50% {
  2385. transform: scale(1.2, 1.2);
  2386. }
  2387. 100% {
  2388. transform: scale(1, 1);
  2389. }
  2390. }
  2391. /* Box shadow animation */
  2392. [data-shadow-animation] {
  2393. box-shadow: 0 0 0 rgba(0, 0, 0, 0.1);
  2394. transition: box-shadow 0.5s cubic-bezier(0.7, 0, 0.3, 1);
  2395. }
  2396. [data-shadow-animation].shadow-in {
  2397. box-shadow: 0 20px 100px rgba(0, 0, 0, 0.1);
  2398. }
  2399. [data-shadow-animation].shadow-in img {
  2400. opacity: 1;
  2401. transition-delay: 0.35s;
  2402. }
  2403. [data-shadow-animation] img {
  2404. opacity: 0;
  2405. transition: opacity 0.65s cubic-bezier(0.5, 1, 0.5, 1);
  2406. }
  2407. /* Parallax liquid */
  2408. [data-parallax-liquid] {
  2409. overflow: hidden;
  2410. will-change: transform;
  2411. -webkit-transform: translateY(0);
  2412. transform: translateY(0);
  2413. transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1);
  2414. }
  2415. [data-parallax-liquid] .liquid-parallax {
  2416. will-change: transform;
  2417. transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1);
  2418. transform: translateY(0px) scale(1.201);
  2419. position: relative;
  2420. top: 50px;
  2421. }
  2422. /* Masked image animation */
  2423. .masked-image {
  2424. position: absolute;
  2425. top: -100px;
  2426. right: 0;
  2427. }
  2428. .masked-image svg {
  2429. width: 100%;
  2430. height: 100%;
  2431. position: absolute;
  2432. top: 0;
  2433. left: 0;
  2434. -o-object-fit: cover;
  2435. object-fit: cover;
  2436. }
  2437. .masked-image figure {
  2438. background-position: center;
  2439. background-size: cover;
  2440. background-repeat: no-repeat;
  2441. }
  2442. .masked-image img {
  2443. width: 100%;
  2444. height: auto;
  2445. visibility: visible;
  2446. }
  2447. /* Shape image animation */
  2448. .shape-image-animation {
  2449. position: absolute;
  2450. bottom: 0;
  2451. left: 0;
  2452. }
  2453. .shape-image-animation svg {
  2454. height: 100%;
  2455. width: 100%;
  2456. }
  2457. .shape-image-animation svg path {
  2458. width: 100%;
  2459. }
  2460. .page-divider-wrapper {
  2461. margin-bottom: -1px;
  2462. }
  2463. .page-divider-wrapper svg {
  2464. width: 100%;
  2465. margin-bottom: -3px;
  2466. }
  2467. /* Magic cursor */
  2468. .magic-cursor {
  2469. cursor: none;
  2470. }
  2471. #ball-cursor {
  2472. position: fixed;
  2473. width: 70px;
  2474. height: 70px;
  2475. border: 0 !important;
  2476. background-color: var(--dark-gray);
  2477. box-shadow: 0 0 50px rgba(0, 0, 0, 0.25);
  2478. border-radius: 100%;
  2479. opacity: 0 !important;
  2480. overflow: hidden;
  2481. transition: opacity 0.3s ease-in-out 0.1s;
  2482. text-align: center;
  2483. }
  2484. #ball-cursor:before, #ball-cursor:after {
  2485. content: "\e843";
  2486. font-family: feather !important;
  2487. color: var(--white);
  2488. font-size: 20px;
  2489. line-height: 70px;
  2490. position: absolute;
  2491. left: 12px;
  2492. top: 0px;
  2493. }
  2494. #ball-cursor:after {
  2495. content: "\e844";
  2496. right: 12px;
  2497. left: auto;
  2498. }
  2499. .magic-cursor-wrapper {
  2500. position: absolute;
  2501. left: 0;
  2502. top: 0;
  2503. width: 30px;
  2504. height: 30px;
  2505. pointer-events: none;
  2506. z-index: 10000;
  2507. transition: opacity 0.2s ease-in-out 0.2s;
  2508. }
  2509. .magic-cursor-wrapper.sliderhover #ball-cursor {
  2510. opacity: 1 !important;
  2511. }
  2512. .magic-cursor-wrapper.vertical #ball-cursor:before, .magic-cursor-wrapper.vertical #ball-cursor:after {
  2513. content: "\e845";
  2514. left: 50%;
  2515. top: 10px;
  2516. line-height: normal;
  2517. -webkit-transform: translateX(-50%);
  2518. transform: translateX(-50%);
  2519. }
  2520. .magic-cursor-wrapper.vertical #ball-cursor:after {
  2521. content: "\e842";
  2522. right: auto;
  2523. bottom: 10px;
  2524. top: auto;
  2525. }
  2526. @media (hover: none) {
  2527. .magic-cursor-wrapper {
  2528. display: none;
  2529. }
  2530. }
  2531. .magic-cursor-light #ball-cursor {
  2532. background-color: var(--white);
  2533. }
  2534. .magic-cursor-light #ball-cursor:before {
  2535. color: var(--dark-gray);
  2536. }
  2537. .magic-cursor-light #ball-cursor:after {
  2538. color: var(--dark-gray);
  2539. }
  2540. .magic-cursor-base-color #ball-cursor {
  2541. background-color: var(--base-color);
  2542. }
  2543. .magic-cursor-base-color #ball-cursor:before {
  2544. color: var(--white);
  2545. }
  2546. .magic-cursor-base-color #ball-cursor:after {
  2547. color: var(--white);
  2548. }
  2549. .magic-view-cursor #ball-cursor {
  2550. -webkit-backdrop-filter: blur(10px);
  2551. backdrop-filter: blur(10px);
  2552. background-color: rgba(0, 0, 0, 0.2);
  2553. width: 180px;
  2554. height: 180px;
  2555. box-shadow: none;
  2556. }
  2557. .magic-view-cursor #ball-cursor:after {
  2558. display: none;
  2559. }
  2560. .magic-view-cursor #ball-cursor:before {
  2561. content: "Explore";
  2562. font-size: 16px;
  2563. color: var(--white) !important;
  2564. font-weight: 400;
  2565. font-family: var(--alt-font) !important;
  2566. text-shadow: 0 0 20px rgba(0, 0, 0, 0.9);
  2567. top: 50%;
  2568. left: 50%;
  2569. transform: translate(-50%, -50%);
  2570. }
  2571. .magic-drag-cursor #ball-cursor {
  2572. -webkit-backdrop-filter: blur(10px);
  2573. backdrop-filter: blur(10px);
  2574. background-color: rgba(0, 0, 0, 0.2);
  2575. width: 140px;
  2576. height: 140px;
  2577. box-shadow: none;
  2578. }
  2579. .magic-drag-cursor #ball-cursor:after {
  2580. display: none;
  2581. }
  2582. .magic-drag-cursor #ball-cursor:before {
  2583. content: "< DRAG >";
  2584. font-size: 14px;
  2585. color: var(--white) !important;
  2586. font-weight: 600;
  2587. font-family: var(--alt-font) !important;
  2588. text-shadow: 0 0 20px rgba(0, 0, 0, 0.9);
  2589. top: 50%;
  2590. left: 50%;
  2591. transform: translate(-50%, -50%);
  2592. word-spacing: 4px;
  2593. width: inherit;
  2594. }
  2595. .magic-drag-cursor.magic-cursor-light #ball-cursor {
  2596. background-color: rgba(255, 255, 255, 0.2);
  2597. }
  2598. .magic-drag-cursor.magic-cursor-light #ball-cursor:before {
  2599. color: var(--dark-gray);
  2600. }
  2601. .magic-drag-cursor.magic-cursor-light #ball-cursor:after {
  2602. color: var(--dark-gray);
  2603. }
  2604. .magic-round-cursor #ball-cursor {
  2605. -webkit-backdrop-filter: blur(6px);
  2606. backdrop-filter: blur(6px);
  2607. background-color: rgba(0, 0, 0, 0.2);
  2608. width: 220px;
  2609. height: 220px;
  2610. box-shadow: none;
  2611. }
  2612. .magic-round-cursor #ball-cursor:before {
  2613. display: none;
  2614. }
  2615. .magic-round-cursor #ball-cursor:after {
  2616. display: none;
  2617. }
  2618. /* Anime animation */
  2619. [data-anime] {
  2620. opacity: 0;
  2621. transition: none;
  2622. }
  2623. [data-anime].appear {
  2624. opacity: 1;
  2625. }
  2626. [data-anime].btn {
  2627. transition: none;
  2628. }
  2629. [data-anime].btn.anime-complete {
  2630. -webkit-transition: all 300ms ease-in-out;
  2631. transition: all 300ms ease-in-out;
  2632. }
  2633. /* Atropos box */
  2634. .atropos-shadow {
  2635. background-color: transparent !important;
  2636. filter: inherit;
  2637. }
  2638. .atropos-highlight {
  2639. background-image: inherit !important;
  2640. }
  2641. /* Only for safari browser */
  2642. @media not all and (min-resolution: 0.001dpcm) {
  2643. [data-anime] [class*=text-shadow-] {
  2644. text-shadow: none;
  2645. }
  2646. [data-anime][class*=text-shadow-] {
  2647. text-shadow: none;
  2648. }
  2649. [data-fancy-text] [class*=text-shadow-] {
  2650. text-shadow: none;
  2651. }
  2652. [data-fancy-text][class*=text-shadow-] {
  2653. text-shadow: none;
  2654. }
  2655. /* font awesome icon gradient color */
  2656. .review-star-icon i {
  2657. display: inline;
  2658. }
  2659. }
  2660. @media screen and (-webkit-min-device-pixel-ratio: 0) {
  2661. /* color issue */
  2662. .text-white a[href^=tel] {
  2663. color: var(--white);
  2664. }
  2665. .text-dark-gray a[href^=tel] {
  2666. color: var(--text-dark-gray);
  2667. }
  2668. }
  2669. .swiper-slide [data-fancy-text] {
  2670. opacity: 0;
  2671. }
  2672. .swiper-slide [data-fancy-text].appear {
  2673. opacity: 1;
  2674. }
  2675. .swiper-slide.swiper-slide-active [data-fancy-text] {
  2676. opacity: 1;
  2677. }
  2678. .swiper-slide.swiper-slide-active [data-anime] {
  2679. opacity: 1;
  2680. }
  2681. .swiper-slide [data-anime] {
  2682. opacity: 0;
  2683. transition: 0.3s ease-in-out;
  2684. }
  2685. .no-animation .anime-text .whitespace {
  2686. display: inline-block;
  2687. }
  2688. .no-animation .anime-text .whitespace::after {
  2689. content: "r";
  2690. opacity: 0;
  2691. font-size: 70%;
  2692. }
  2693. .no-animation [data-anime], .no-animation [data-fancy-text] {
  2694. opacity: 1;
  2695. transition: none;
  2696. }
  2697. /* Data top bottom transition animation */
  2698. [data-top-bottom] {
  2699. transition: transform 0.65s cubic-bezier(0.23, 1, 0.32, 1);
  2700. }
  2701. /* Custom cursor */
  2702. @media (hover: hover) and (pointer: fine) {
  2703. .custom-cursor .circle-cursor {
  2704. position: fixed;
  2705. left: 0;
  2706. top: 0;
  2707. pointer-events: none;
  2708. -webkit-border-radius: 50%;
  2709. border-radius: 50%;
  2710. -webkit-transform: translateZ(0);
  2711. transform: translateZ(0);
  2712. visibility: hidden;
  2713. opacity: 0;
  2714. transition: opacity 0.65s cubic-bezier(0.23, 1, 0.32, 1);
  2715. }
  2716. .custom-cursor .circle-cursor-inner {
  2717. margin-left: -3px;
  2718. margin-top: -3px;
  2719. width: 6px;
  2720. height: 6px;
  2721. z-index: 10000001;
  2722. background-color: var(--base-color);
  2723. }
  2724. .custom-cursor .circle-cursor-inner.cursor-link-hover {
  2725. margin-left: -10px;
  2726. margin-top: -10px;
  2727. width: 20px;
  2728. height: 20px;
  2729. background-color: var(--base-color);
  2730. opacity: 0.8;
  2731. }
  2732. .custom-cursor .circle-cursor-outer {
  2733. margin-left: -15px;
  2734. margin-top: -15px;
  2735. width: 30px;
  2736. height: 30px;
  2737. border: 1px solid var(--base-color);
  2738. z-index: 10000000;
  2739. opacity: 0.8;
  2740. -webkit-transition: 0.1s;
  2741. transition: 0.1s;
  2742. }
  2743. .custom-cursor .cursor-link.circle-cursor-inner .cursor-link-hover {
  2744. opacity: 1;
  2745. }
  2746. }
  2747. .is-touchable .cursor-page-inner {
  2748. display: none !important;
  2749. }
  2750. /* Stack box */
  2751. .stack-box {
  2752. position: relative;
  2753. z-index: 1;
  2754. height: 300vh;
  2755. }
  2756. .stack-box .stack-box-contain {
  2757. height: 100vh;
  2758. position: -webkit-sticky;
  2759. position: sticky;
  2760. top: 0;
  2761. }
  2762. .stack-box .stack-item {
  2763. height: 100vh;
  2764. width: 100%;
  2765. position: absolute;
  2766. overflow: hidden;
  2767. z-index: 999;
  2768. display: flex;
  2769. align-items: center;
  2770. }
  2771. .stack-box .stack-item.stack-item-02 {
  2772. z-index: 99;
  2773. }
  2774. .stack-box .stack-item.stack-item-03 {
  2775. z-index: 9;
  2776. }
  2777. .stack-box .stack-item .stack-item-wrapper {
  2778. position: absolute;
  2779. top: 0;
  2780. left: 0;
  2781. right: 0;
  2782. bottom: 0;
  2783. z-index: -1;
  2784. display: flex;
  2785. align-items: center;
  2786. height: 100vh;
  2787. }
  2788. /* stack card */
  2789. .stack-card .stack-item {
  2790. border: 0;
  2791. position: -webkit-sticky;
  2792. position: sticky;
  2793. top: 60px;
  2794. border-radius: 0;
  2795. }
  2796. .stack-card .stack-card-item {
  2797. will-change: scale;
  2798. background: var(--white);
  2799. border-radius: 20px;
  2800. overflow: hidden;
  2801. box-shadow: 20px 14px 50px 0px rgba(42, 27, 68, 0.1019607843);
  2802. transform-origin: center top;
  2803. -webkit-transform-origin: center top;
  2804. transition: scale 0.5s ease;
  2805. background-size: cover;
  2806. }
  2807. .transform-3d {
  2808. transform: translate3d(0px, 0px, 100px);
  2809. }
  2810. /* Scrolling text */
  2811. .marquees-text {
  2812. -webkit-transform: translateX(100%);
  2813. transform: translateX(100%);
  2814. -webkit-animation: example1 50s linear infinite;
  2815. animation: example1 50s linear infinite;
  2816. width: 100%;
  2817. }
  2818. .looping-wrapper {
  2819. position: absolute;
  2820. display: flex;
  2821. align-items: center;
  2822. flex-wrap: wrap;
  2823. width: 1px;
  2824. height: 100vh;
  2825. left: 50%;
  2826. top: 0;
  2827. }
  2828. .looping-wrapper .el {
  2829. position: absolute;
  2830. opacity: 1;
  2831. width: 2px;
  2832. height: 24vh;
  2833. margin-top: -18vh;
  2834. transform-origin: 50% 100%;
  2835. background: var(--base-color);
  2836. }
  2837. .looping-wrapper-gray {
  2838. position: absolute;
  2839. display: flex;
  2840. align-items: center;
  2841. flex-wrap: wrap;
  2842. width: 1px;
  2843. height: 100vh;
  2844. left: 50%;
  2845. top: 0;
  2846. }
  2847. .looping-wrapper-gray .el {
  2848. position: absolute;
  2849. opacity: 1;
  2850. width: 2px;
  2851. height: 24vh;
  2852. margin-top: -18vh;
  2853. transform-origin: 50% 100%;
  2854. background: #292929;
  2855. }
  2856. /* Marquee slide */
  2857. .marquee-slide {
  2858. -webkit-transition-timing-function: linear !important;
  2859. transition-timing-function: linear !important;
  2860. position: relative;
  2861. }
  2862. .marquee-rotate-down {
  2863. transform: rotate(3.87deg);
  2864. margin-bottom: -60px;
  2865. }
  2866. .marquee-rotate-up {
  2867. transform: rotate(-2.2deg);
  2868. }
  2869. /* Father shadow */
  2870. .feather-shadow {
  2871. mask-image: linear-gradient(to right, transparent 0%, #000000 20%, #000000 80%, transparent 100%);
  2872. -webkit-mask-image: linear-gradient(to right, transparent 0%, #000000 20%, #000000 80%, transparent 100%);
  2873. }
  2874. /* Text sliding line */
  2875. .text-sliding-line {
  2876. display: inline-block;
  2877. position: relative;
  2878. padding: 0;
  2879. z-index: 1;
  2880. background-image: linear-gradient(135deg, transparent 45%, var(--white) 45%, var(--white) 55%, transparent 0);
  2881. background-size: 4px 4px;
  2882. -webkit-background-clip: text;
  2883. background-clip: text;
  2884. -webkit-text-fill-color: transparent;
  2885. }
  2886. /* Sliding line */
  2887. .bg-sliding-line {
  2888. background-image: linear-gradient(45deg, transparent 45%, var(--white) 45%, var(--white) 55%, transparent 0);
  2889. background-size: 0.1em 0.1em;
  2890. }
  2891. /* Feature box slider */
  2892. .feature-box-slider .feature-box {
  2893. display: flex;
  2894. flex-direction: row;
  2895. align-items: center;
  2896. padding: 24px 40px;
  2897. background: var(--white);
  2898. box-shadow: 0 5px 25px rgba(89, 101, 124, 0.15);
  2899. border-radius: 10px;
  2900. color: var(--dark-gray);
  2901. font-weight: 500;
  2902. font-size: 17px;
  2903. }
  2904. .feature-box-slider .feature-box i {
  2905. font-size: 24px;
  2906. margin-right: 10px;
  2907. }
  2908. .feature-box-slider .swiper-slide {
  2909. width: auto;
  2910. padding-top: 15px;
  2911. padding-bottom: 15px;
  2912. }
  2913. /* Page loader */
  2914. .page-loader {
  2915. position: absolute;
  2916. width: 100%;
  2917. height: 100%;
  2918. left: 0;
  2919. top: 0;
  2920. background-color: var(--white) !important;
  2921. opacity: 1 !important;
  2922. z-index: 99999;
  2923. }
  2924. .page-loader::after {
  2925. background: 0 0;
  2926. content: "" !important;
  2927. position: absolute;
  2928. left: calc(50% - 25px) !important;
  2929. top: calc(50% - 25px) !important;
  2930. width: 50px !important;
  2931. height: 50px !important;
  2932. opacity: 1 !important;
  2933. right: inherit !important;
  2934. z-index: 9;
  2935. text-align: center;
  2936. border: 2px solid rgba(23, 23, 23, 0.2);
  2937. border-top-color: rgba(23, 23, 23, 0.7);
  2938. border-radius: 50%;
  2939. -webkit-animation: rotation 8s infinite linear;
  2940. animation: rotation 1.5s infinite linear;
  2941. }
  2942. /* Cookie message */
  2943. .cookie-message {
  2944. position: fixed;
  2945. bottom: 20px;
  2946. right: 20px;
  2947. max-width: 370px;
  2948. z-index: 999999;
  2949. padding: 40px;
  2950. display: none;
  2951. }
  2952. /* Scroll progress */
  2953. .scroll-progress {
  2954. position: fixed;
  2955. right: 20px;
  2956. z-index: 111;
  2957. top: 50%;
  2958. -webkit-transition: all 0.3s linear;
  2959. transition: all 0.3s linear;
  2960. opacity: 0;
  2961. visibility: hidden;
  2962. -webkit-transform: translateY(-50%);
  2963. transform: translateY(-50%);
  2964. mix-blend-mode: difference;
  2965. }
  2966. .scroll-progress.visible {
  2967. opacity: 1;
  2968. visibility: visible;
  2969. }
  2970. .scroll-progress .scroll-top {
  2971. display: flex;
  2972. flex-direction: column;
  2973. justify-content: center;
  2974. align-items: center;
  2975. }
  2976. .scroll-progress .scroll-line {
  2977. width: 2px;
  2978. height: 60px;
  2979. position: relative;
  2980. background-color: rgba(255, 255, 255, 0.15);
  2981. color: inherit;
  2982. display: block;
  2983. }
  2984. .scroll-progress .scroll-point {
  2985. display: inline-block;
  2986. width: 2px;
  2987. position: absolute;
  2988. background-color: var(--white);
  2989. top: 0px;
  2990. left: 0px;
  2991. }
  2992. .scroll-progress .scroll-text {
  2993. -webkit-transform: rotate(180deg);
  2994. transform: rotate(180deg);
  2995. writing-mode: vertical-lr;
  2996. margin-bottom: 15px;
  2997. color: var(--white);
  2998. font-size: 11px;
  2999. text-transform: uppercase;
  3000. }
  3001. .scroll-progress.scroll-simple {
  3002. position: fixed;
  3003. right: 50px;
  3004. z-index: 111;
  3005. top: auto;
  3006. transform: none;
  3007. bottom: 50px;
  3008. mix-blend-mode: inherit;
  3009. }
  3010. .scroll-progress.scroll-simple .scroll-top {
  3011. background: var(--white);
  3012. font-size: 17px;
  3013. line-height: 34px;
  3014. box-shadow: 0 0 25px rgba(23, 23, 23, 0.25);
  3015. height: 34px;
  3016. width: 34px;
  3017. padding: 0;
  3018. border-radius: 100%;
  3019. }
  3020. /* Crafto progressive blur */
  3021. .crafto-progressive-blur {
  3022. height: var(--progressive-blur-height);
  3023. left: 0;
  3024. position: fixed;
  3025. pointer-events: none;
  3026. top: 0;
  3027. width: 100%;
  3028. z-index: 19;
  3029. }
  3030. .crafto-progressive-blur.crafto-progressive-blur-bottom {
  3031. bottom: 0;
  3032. top: auto;
  3033. transform: scaleY(-1);
  3034. }
  3035. .crafto-progressive-blur > div {
  3036. height: 100%;
  3037. left: 0;
  3038. position: absolute;
  3039. pointer-events: none;
  3040. top: 0;
  3041. width: 100%;
  3042. }
  3043. /* Crafto reveal hover */
  3044. .reveal-item-hover {
  3045. position: relative;
  3046. -webkit-transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  3047. transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  3048. }
  3049. .reveal-item-hover .reveal-title, .reveal-item-hover .reveal-action {
  3050. -webkit-transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  3051. transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  3052. }
  3053. .reveal-item-hover .hover-reveal {
  3054. position: absolute;
  3055. top: 0;
  3056. left: 0;
  3057. pointer-events: none;
  3058. opacity: 0;
  3059. z-index: 10;
  3060. transition: opacity 0.25s, transform 0.51s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.51s cubic-bezier(0.215, 0.61, 0.355, 1);
  3061. width: auto;
  3062. }
  3063. .reveal-item-hover .hover-reveal .hover-reveal__inner {
  3064. position: relative;
  3065. overflow: hidden;
  3066. }
  3067. .reveal-item-hover .hover-reveal .hover-reveal__img {
  3068. will-change: transform;
  3069. }
  3070. .reveal-item-hover:hover .hover-reveal {
  3071. opacity: 1;
  3072. }
  3073. /* for buy and demo button */
  3074. .theme-demos {
  3075. display: none;
  3076. width: 100%;
  3077. height: 100%;
  3078. min-height: 100%;
  3079. position: fixed;
  3080. background-color: var(--white);
  3081. right: -100%;
  3082. top: 0;
  3083. z-index: 1050;
  3084. -webkit-transition: all 0.5s cubic-bezier(0.77, 0, 0.175, 1);
  3085. transition: all 0.5s cubic-bezier(0.77, 0, 0.175, 1);
  3086. }
  3087. .theme-demos section {
  3088. height: 100%;
  3089. min-height: 100%;
  3090. position: relative;
  3091. z-index: 11;
  3092. padding: 0;
  3093. width: 100%;
  3094. overflow-y: scroll;
  3095. background-color: var(--very-light-gray);
  3096. }
  3097. .theme-demos .demos-wrapper {
  3098. width: 100%;
  3099. }
  3100. .theme-demos .demos-wrapper .demos-wrapper-inner {
  3101. padding: 60px 50px;
  3102. }
  3103. .theme-demos.active {
  3104. -webkit-transform: translateX(-100%);
  3105. transform: translateX(-100%);
  3106. box-shadow: 0 0 45px 0 rgba(0, 0, 0, 0.25);
  3107. }
  3108. .theme-demos .grid {
  3109. padding: 0 20px;
  3110. display: flex;
  3111. flex-wrap: wrap;
  3112. }
  3113. .theme-demos .demo-button-wrapper {
  3114. width: auto;
  3115. white-space: nowrap;
  3116. position: absolute;
  3117. right: 100%;
  3118. display: block;
  3119. bottom: 250px;
  3120. cursor: pointer;
  3121. z-index: 10;
  3122. -webkit-transform: rotate(-90deg) translateY(-100%);
  3123. -ms-transform: rotate(-90deg) translateY(-100%);
  3124. transform: rotate(-90deg) translateY(-100%);
  3125. -webkit-transform-origin: 100% 0% 0;
  3126. -ms-transform-origin: 100% 0% 0;
  3127. transform-origin: 100% 0% 0;
  3128. margin-right: -1px;
  3129. display: flex;
  3130. }
  3131. .theme-demos .buy-theme a, .theme-demos .all-demo a {
  3132. color: var(--dark-gray);
  3133. font-size: 11px;
  3134. padding: 15px;
  3135. display: block;
  3136. text-decoration: none;
  3137. font-weight: 500;
  3138. }
  3139. .theme-demos .buy-theme a > i, .theme-demos .all-demo a > i {
  3140. position: absolute;
  3141. left: 0;
  3142. top: 0;
  3143. height: 100%;
  3144. width: 59px;
  3145. line-height: 55px;
  3146. text-align: center;
  3147. opacity: 0;
  3148. font-size: 24px;
  3149. transition-delay: 0.3s;
  3150. }
  3151. .theme-demos .all-demo {
  3152. background-color: #1f242e;
  3153. }
  3154. .theme-demos .all-demo .theme-wrapper {
  3155. padding: 0 9px;
  3156. position: relative;
  3157. top: 0;
  3158. opacity: 1;
  3159. transition-delay: 0.3s;
  3160. line-height: 0;
  3161. }
  3162. .theme-demos .all-demo .theme-wrapper > div {
  3163. display: inline-block;
  3164. vertical-align: middle;
  3165. font-size: 15px;
  3166. line-height: 15px;
  3167. color: var(--white);
  3168. font-size: 14px;
  3169. text-transform: uppercase;
  3170. line-height: 21px;
  3171. }
  3172. .theme-demos .buy-theme {
  3173. text-align: center;
  3174. background-color: #48a133;
  3175. position: relative;
  3176. z-index: 1;
  3177. }
  3178. .theme-demos .buy-theme .theme-wrapper {
  3179. padding: 0;
  3180. position: relative;
  3181. top: 0;
  3182. opacity: 1;
  3183. transition-delay: 0.3s;
  3184. line-height: 0;
  3185. }
  3186. .theme-demos .buy-theme .theme-wrapper span {
  3187. font-size: 15px;
  3188. font-weight: 600;
  3189. margin-right: 0;
  3190. }
  3191. .theme-demos .buy-theme .theme-wrapper i {
  3192. margin-right: 10px;
  3193. font-size: 21px;
  3194. }
  3195. .theme-demos .buy-theme .theme-wrapper > div svg {
  3196. margin: 0;
  3197. }
  3198. .theme-demos .mCustomScrollBox {
  3199. display: -webkit-box;
  3200. display: -ms-flexbox;
  3201. display: flex;
  3202. width: 100%;
  3203. }
  3204. .theme-demos .mCustomScrollBox .mCSB_container {
  3205. width: 100%;
  3206. -ms-flex-item-align: start;
  3207. align-self: flex-start;
  3208. margin: 0;
  3209. padding-right: 15px !important;
  3210. }
  3211. .theme-demos .mCustomScrollBox .mCSB_container.mCS_y_hidden.mCS_no_scrollbar_y {
  3212. -ms-flex-item-align: center;
  3213. align-self: center;
  3214. }
  3215. .theme-demos .mCustomScrollBox .mCSB_draggerRail {
  3216. display: none;
  3217. }
  3218. .theme-demos .clearfix {
  3219. clear: both;
  3220. }
  3221. .theme-demos .portfolio-wrapper .grid-item {
  3222. flex: 0 0 auto;
  3223. }
  3224. .theme-demos .close-popup {
  3225. position: absolute;
  3226. top: 10px;
  3227. right: 10px;
  3228. z-index: 99;
  3229. cursor: pointer;
  3230. -webkit-transition: -webkit-transform 0.3s ease;
  3231. -ms-transition: -ms-transform 0.3s ease;
  3232. transition: transform 0.3s ease;
  3233. -webkit-transform-origin: 50% 50%;
  3234. -ms-transform-origin: 50% 50%;
  3235. transform-origin: 50% 50%;
  3236. }
  3237. .theme-demos .close-popup:hover {
  3238. -webkit-transform: rotate(-180deg);
  3239. -ms-transform: rotate(-180deg);
  3240. transform: rotate(-180deg);
  3241. }
  3242. .show-search-popup .theme-demos .theme-demos, .show-search-popup .show-menu .theme-demos {
  3243. z-index: 1;
  3244. }
  3245. /* Move it (define the animation) */
  3246. @-moz-keyframes example1 {
  3247. 0% {
  3248. -moz-transform: translateX(100%);
  3249. }
  3250. 100% {
  3251. -moz-transform: translateX(-100%);
  3252. }
  3253. }
  3254. @-webkit-keyframes example1 {
  3255. 0% {
  3256. -webkit-transform: translateX(100%);
  3257. }
  3258. 100% {
  3259. -webkit-transform: translateX(-100%);
  3260. }
  3261. }
  3262. @keyframes example1 {
  3263. 0% {
  3264. -moz-transform: translateX(100%); /* Firefox bug fix */
  3265. -webkit-transform: translateX(100%); /* Firefox bug fix */
  3266. transform: translateX(100%);
  3267. }
  3268. 100% {
  3269. -moz-transform: translateX(-100%); /* Firefox bug fix */
  3270. -webkit-transform: translateX(-100%); /* Firefox bug fix */
  3271. transform: translateX(-100%);
  3272. }
  3273. }
  3274. /* ===================================
  3275. 06. Background and border
  3276. ====================================== */
  3277. /* Background color */
  3278. .bg-base-color {
  3279. background-color: var(--base-color);
  3280. }
  3281. .bg-dark-gray,
  3282. .bg-dark-gray:focus {
  3283. background-color: var(--dark-gray);
  3284. }
  3285. .bg-black {
  3286. background-color: var(--black);
  3287. }
  3288. .bg-medium-gray {
  3289. background-color: var(--medium-gray);
  3290. }
  3291. .bg-light-medium-gray {
  3292. background-color: var(--light-medium-gray);
  3293. }
  3294. .bg-extra-medium-gray {
  3295. background-color: var(--extra-medium-gray);
  3296. }
  3297. .bg-light-gray {
  3298. background-color: var(--light-gray);
  3299. }
  3300. .bg-very-light-gray {
  3301. background-color: var(--very-light-gray);
  3302. }
  3303. .bg-red {
  3304. background-color: var(--red);
  3305. }
  3306. .bg-light-red {
  3307. background-color: var(--light-red);
  3308. }
  3309. .bg-green {
  3310. background-color: var(--green);
  3311. }
  3312. .bg-crusoe-green {
  3313. background-color: var(--crusoe-green);
  3314. }
  3315. .bg-yellow {
  3316. background-color: var(--yellow);
  3317. }
  3318. .bg-charcoal-blue {
  3319. background-color: var(--charcoal-blue);
  3320. }
  3321. .bg-slate-blue {
  3322. background-color: var(--slate-blue);
  3323. }
  3324. .bg-medium-slate-blue {
  3325. background-color: var(--medium-slate-blue);
  3326. }
  3327. .bg-extra-medium-slate-blue {
  3328. background-color: var(--extra-medium-slate-blue);
  3329. }
  3330. .bg-dark-slate-blue {
  3331. background-color: var(--dark-slate-blue);
  3332. }
  3333. .bg-extra-dark-slate-blue {
  3334. background-color: var(--extra-dark-slate-blue);
  3335. }
  3336. .bg-extra-very-slate-blue {
  3337. background-color: var(--extra-very-slate-blue);
  3338. }
  3339. .bg-tussock-yellow {
  3340. background-color: var(--tussock-yellow);
  3341. }
  3342. .bg-solitude-blue {
  3343. background-color: var(--solitude-blue);
  3344. }
  3345. .bg-aluminium-gray {
  3346. background-color: var(--aluminium-gray);
  3347. }
  3348. .bg-selago {
  3349. background-color: var(--selago);
  3350. }
  3351. .bg-white-ice {
  3352. background-color: var(--white-ice);
  3353. }
  3354. .bg-golden-yellow {
  3355. background-color: var(--golden-yellow);
  3356. }
  3357. .bg-jade {
  3358. background-color: var(--jade);
  3359. }
  3360. .bg-orange {
  3361. background-color: var(--orange);
  3362. }
  3363. .bg-light-majorelle-blue {
  3364. background-color: var(--light-majorelle-blue);
  3365. }
  3366. .bg-majorelle-blue {
  3367. background-color: var(--majorelle-blue);
  3368. }
  3369. .bg-spring-wood {
  3370. background-color: var(--spring-wood);
  3371. }
  3372. .bg-tropical-blue {
  3373. background-color: var(--tropical-blue);
  3374. }
  3375. .bg-cornflower-blue {
  3376. background-color: var(--cornflower-blue);
  3377. }
  3378. .bg-camarone {
  3379. background-color: var(--camarone);
  3380. }
  3381. .bg-seal-brown {
  3382. background-color: var(--seal-brown);
  3383. }
  3384. .bg-Wasabi {
  3385. background-color: var(--Wasabi);
  3386. }
  3387. /* Gradient background color */
  3388. .bg-gradient-light-pink-light-orange {
  3389. background-image: linear-gradient(to right top, #ffafbd, #ffb3b4, #ffb7ac, #ffbda5, #ffc3a0);
  3390. }
  3391. .bg-gradient-purple-pink {
  3392. background-image: linear-gradient(to right top, #8b14b1, #ab019e, #c00c8b, #cd267b, #d53d6e);
  3393. }
  3394. .bg-gradient-fast-pink-light-yellow {
  3395. background-image: linear-gradient(to right top, #f7567f, #fe7177, #ff8a74, #ffa378, #ffba83);
  3396. }
  3397. .bg-gradient-pink-orange {
  3398. background-image: linear-gradient(to right top, #de347f, #e73a70, #ed4461, #f05152, #ef5f43);
  3399. }
  3400. .bg-gradient-fast-blue-purple {
  3401. background-image: linear-gradient(to right top, #2a46f4, #5f42f9, #833cfc, #a233fe, #bf25ff);
  3402. }
  3403. .bg-gradient-light-pink-light-purple {
  3404. background-image: linear-gradient(to right top, #ed579b, #e855ad, #df57c0, #d15cd4, #bc63e8);
  3405. }
  3406. .bg-gradient-purple-magento {
  3407. background-image: linear-gradient(to right top, #5553e1, #a34dcc, #ce4fb5, #e75ca1, #f47291);
  3408. }
  3409. .bg-gradient-blue-green {
  3410. background-image: linear-gradient(to right top, #18cdbb, #22d2ae, #3cd69d, #57da89, #73dc73);
  3411. }
  3412. .bg-gradient-light-purple-light-orange {
  3413. background-image: linear-gradient(to right top, #b783ff, #e37be0, #fa7cc1, #ff85a6, #ff9393);
  3414. }
  3415. .bg-gradient-sky-blue-pink {
  3416. background-image: linear-gradient(to right top, #5758df, #a553cb, #d055b5, #ea63a0, #f77991);
  3417. }
  3418. .bg-gradient-dark-gray-brown {
  3419. background-image: linear-gradient(to right top, #0f130f, #1e1d15, #3d2f20, #4e3b27, #664a2f);
  3420. }
  3421. .bg-gradient-tan-geraldine {
  3422. background-image: linear-gradient(to right top, #fb7f87, #fc8a82, #fb957f, #fa9f7f, #f7aa80);
  3423. }
  3424. .bg-gradient-very-light-gray {
  3425. background-image: linear-gradient(to bottom, #f7f8f9, #f9fafb, #fbfbfc, #fdfdfd, #ffffff);
  3426. }
  3427. .bg-gradient-top-very-light-gray {
  3428. background-image: linear-gradient(to top, #f7f7f7, #f7f7f7, #fcfafa, #fcfafa, #ffffff);
  3429. }
  3430. .bg-gradient-orange-transparent {
  3431. background: linear-gradient(to right, rgb(233, 117, 34) 10%, rgba(255, 255, 255, 0) 95%);
  3432. }
  3433. .bg-gradient-blue-transparent {
  3434. background: linear-gradient(to right, rgb(30, 163, 177) 10%, rgba(255, 255, 255, 0) 95%);
  3435. }
  3436. .bg-gradient-emerald-blue-emerald-green {
  3437. background-image: linear-gradient(50deg, #09afea 0, #19e089 100%);
  3438. }
  3439. .bg-gradient-very-ghost-white {
  3440. background-image: linear-gradient(to bottom, #f4f6ff, #f7f8ff, #fafaff, #fdfdff, #ffffff);
  3441. }
  3442. /* Transparent background color */
  3443. .bg-transparent {
  3444. background-color: transparent;
  3445. }
  3446. .bg-gradient-fast-blue-purple-transparent {
  3447. background-image: linear-gradient(to right top, rgb(42, 70, 244), rgba(95, 66, 249, 0.9), rgba(131, 60, 252, 0.9), rgba(162, 51, 254, 0.9), rgba(191, 37, 255, 0.9));
  3448. }
  3449. .bg-gradient-fast-pink-light-yellow-transparent {
  3450. background-image: linear-gradient(to right top, rgba(247, 86, 127, 0.9), rgba(254, 113, 119, 0.9), rgba(255, 138, 116, 0.9), rgba(255, 163, 120, 0.9), rgba(255, 186, 131, 0.9));
  3451. }
  3452. .bg-gradient-sky-blue-pink-transparent {
  3453. background-image: linear-gradient(to right top, rgba(87, 88, 223, 0.9), rgba(165, 83, 203, 0.9), rgba(208, 85, 181, 0.9), rgba(234, 99, 160, 0.9), rgba(247, 121, 145, 0.9));
  3454. }
  3455. .bg-gradient-gray-light-dark-transparent {
  3456. background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(32, 35, 41, 0.8)), to(transparent));
  3457. background-image: linear-gradient(to top, rgba(32, 35, 41, 0.8) 0%, transparent 100%);
  3458. }
  3459. .bg-gradient-dark-transparent {
  3460. background: -webkit-gradient(linear, left bottom, left top, color-stop(7%, #141622), to(transparent));
  3461. background: linear-gradient(to top, #141622 7%, transparent 100%);
  3462. }
  3463. .bg-gradient-dark-gray-left-transparent {
  3464. background: -webkit-linear-gradient(right, rgba(24, 25, 28, 0.5), rgba(255, 255, 255, 0));
  3465. background: linear-gradient(to right, rgba(24, 25, 28, 0.5), rgba(255, 255, 255, 0));
  3466. }
  3467. .bg-gradient-white-transparent {
  3468. background: linear-gradient(to top, #ffffff 20%, rgba(255, 255, 255, 0) 80%);
  3469. }
  3470. .bg-gradient-white-dark-transparent {
  3471. background: -webkit-gradient(linear, left bottom, left top, color-stop(35%, #ffffff), to(transparent));
  3472. background: linear-gradient(to top, #ffffff 30%, rgba(255, 255, 255, 0) 70%);
  3473. }
  3474. .bg-gradient-white-bottom-transparent {
  3475. background: rgb(0, 0, 0);
  3476. background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgb(255, 255, 255) 60%);
  3477. }
  3478. .bg-gradient-black-bottom-transparent {
  3479. background: rgb(255, 255, 255);
  3480. background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
  3481. }
  3482. .bg-gradient-solitude-blue-transparent {
  3483. background: -webkit-linear-gradient(bottom, rgb(240, 244, 253), rgba(255, 255, 255, 0));
  3484. background: linear-gradient(to top, rgb(240, 244, 253), rgba(255, 255, 255, 0));
  3485. }
  3486. .bg-gradient-extra-midium-gray-transparent {
  3487. background: -webkit-gradient(left top, left bottom, color-stop(50%, rgba(0, 0, 0, 0.5)), color-stop(150%, rgba(20, 20, 20, 0.3)));
  3488. background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 50%, rgba(20, 20, 20, 0.3) 150%);
  3489. }
  3490. .bg-dark-gray-transparent {
  3491. background-color: rgba(35, 35, 35, 0.8);
  3492. }
  3493. .bg-dark-gray-transparent-light {
  3494. background-color: rgba(35, 35, 35, 0.2);
  3495. }
  3496. .bg-dark-gray-transparent-medium {
  3497. background-color: rgba(35, 35, 35, 0.4);
  3498. }
  3499. .bg-medium-gray-transparent {
  3500. background-color: rgba(111, 111, 111, 0.1);
  3501. }
  3502. .bg-light-gray-transparent {
  3503. background-color: rgb(251, 251, 251);
  3504. }
  3505. .bg-medium-gray-transparent {
  3506. background-color: rgba(136, 136, 136, 0.3);
  3507. }
  3508. .bg-black-transparent-light {
  3509. background-color: rgba(0, 0, 0, 0.2);
  3510. }
  3511. .bg-black-transparent-medium {
  3512. background-color: rgba(0, 0, 0, 0.5);
  3513. }
  3514. .bg-black-transparent {
  3515. background-color: rgba(0, 0, 0, 0.8);
  3516. }
  3517. .bg-white-transparent-extra-light,
  3518. .bg-white-transparent-extra-light:focus {
  3519. background-color: rgba(255, 255, 255, 0.1);
  3520. }
  3521. .bg-white-transparent-very-light {
  3522. background-color: rgba(255, 255, 255, 0.2);
  3523. }
  3524. .bg-white-transparent-light {
  3525. background-color: rgba(255, 255, 255, 0.4);
  3526. }
  3527. .bg-white-transparent {
  3528. background-color: rgba(255, 255, 255, 0.7);
  3529. }
  3530. /* Background image */
  3531. .contain-background {
  3532. background-size: contain;
  3533. }
  3534. .cover-background {
  3535. background-repeat: no-repeat !important;
  3536. background-size: cover;
  3537. overflow: hidden;
  3538. position: relative;
  3539. background-position: center center !important;
  3540. }
  3541. .fix-background {
  3542. position: relative;
  3543. background-size: cover !important;
  3544. -webkit-animation-duration: 0s;
  3545. -webkit-animation-fill-mode: none;
  3546. overflow: hidden;
  3547. background-position: center center;
  3548. background-repeat: no-repeat !important;
  3549. background-attachment: fixed !important;
  3550. }
  3551. .background-size-inherit {
  3552. background-size: inherit !important;
  3553. }
  3554. .background-attachment-inherit {
  3555. background-attachment: inherit !important;
  3556. }
  3557. .background-position-left {
  3558. background-position: left center !important;
  3559. }
  3560. .background-position-left-bottom {
  3561. background-position: left bottom !important;
  3562. }
  3563. .background-position-left-center {
  3564. background-position: left center !important;
  3565. }
  3566. .background-position-right {
  3567. background-position: right center !important;
  3568. }
  3569. .background-position-right-top {
  3570. background-position: right top !important;
  3571. }
  3572. .background-position-center-top {
  3573. background-position: center top !important;
  3574. }
  3575. .background-position-left-top {
  3576. background-position: left top !important;
  3577. }
  3578. .background-position-right-bottom {
  3579. background-position: right bottom !important;
  3580. }
  3581. .background-position-center-bottom {
  3582. background-position: center bottom 0px !important;
  3583. }
  3584. .background-repeat {
  3585. background-repeat: repeat;
  3586. }
  3587. .background-no-repeat {
  3588. background-repeat: no-repeat;
  3589. }
  3590. .background-no-repeat-y {
  3591. background-repeat-y: no-repeat;
  3592. }
  3593. .background-position-center {
  3594. background-position: center !important;
  3595. }
  3596. /* Background size */
  3597. .background-size-100 {
  3598. background-size: 100% !important;
  3599. }
  3600. .background-size-auto-100 {
  3601. background-size: auto 100% !important;
  3602. }
  3603. .background-size-contain {
  3604. background-size: contain !important;
  3605. }
  3606. /* Border width */
  3607. .border-6 {
  3608. border-width: 6px !important;
  3609. }
  3610. .border-7 {
  3611. border-width: 7px !important;
  3612. }
  3613. .border-8 {
  3614. border-width: 8px !important;
  3615. }
  3616. .border-9 {
  3617. border-width: 9px !important;
  3618. }
  3619. .border-10 {
  3620. border-width: 10px !important;
  3621. }
  3622. /* Border style */
  3623. .border-dotted {
  3624. border-style: dotted !important;
  3625. }
  3626. .border-dashed {
  3627. border-style: dashed !important;
  3628. }
  3629. .border-solid {
  3630. border-style: solid !important;
  3631. }
  3632. .border-double {
  3633. border-style: double !important;
  3634. }
  3635. .border-groove {
  3636. border-style: groove !important;
  3637. }
  3638. .border-ridge {
  3639. border-style: ridge !important;
  3640. }
  3641. .border-inset {
  3642. border-style: inset !important;
  3643. }
  3644. .border-outset {
  3645. border-style: outset !important;
  3646. }
  3647. .border-none {
  3648. border-style: none !important;
  3649. }
  3650. .border-hidden {
  3651. border-style: hidden !important;
  3652. }
  3653. /* Border color */
  3654. .border-color-base-color {
  3655. border-color: var(--base-color) !important;
  3656. }
  3657. .border-color-white {
  3658. border-color: var(--white) !important;
  3659. }
  3660. .border-color-dark-gray {
  3661. border-color: var(--dark-gray) !important;
  3662. }
  3663. .border-color-medium-gray {
  3664. border-color: var(--medium-gray) !important;
  3665. }
  3666. .border-color-light-gray {
  3667. border-color: var(--light-gray) !important;
  3668. }
  3669. .border-color-very-light-gray {
  3670. border-color: var(--very-light-gray) !important;
  3671. }
  3672. .border-color-light-medium-gray {
  3673. border-color: var(--light-medium-gray) !important;
  3674. }
  3675. .border-color-extra-medium-gray {
  3676. border-color: var(--extra-medium-gray) !important;
  3677. }
  3678. .border-color-yellow {
  3679. border-color: var(--yellow) !important;
  3680. }
  3681. .border-color-orange {
  3682. border-color: var(--orange) !important;
  3683. }
  3684. .border-color-red {
  3685. border-color: var(--red) !important;
  3686. }
  3687. .border-color-transparent-dark-very-light {
  3688. border-color: rgba(35, 35, 35, 0.1) !important;
  3689. }
  3690. .border-color-transparent-dark-light {
  3691. border-color: rgba(35, 35, 35, 0.2) !important;
  3692. }
  3693. .border-color-transparent-white-very-light {
  3694. border-color: rgba(255, 255, 255, 0.3) !important;
  3695. }
  3696. .border-color-transparent-white-light {
  3697. border-color: rgba(255, 255, 255, 0.1) !important;
  3698. }
  3699. .border-color-transparent-white {
  3700. border-color: rgba(255, 255, 255, 0.6) !important;
  3701. }
  3702. .border-color-transparent {
  3703. border-color: transparent !important;
  3704. }
  3705. .border-color-transparent-on-hover:hover {
  3706. border-color: transparent !important;
  3707. }
  3708. /* Gradient border color */
  3709. .border-gradient-light-pink-light-orange {
  3710. border-image: linear-gradient(to right top, #ffafbd, #ffb3b4, #ffb7ac, #ffbda5, #ffc3a0);
  3711. border-image-slice: 1;
  3712. }
  3713. .border-gradient-purple-pink {
  3714. border-image: linear-gradient(to right, #8b14b1, #ab019e, #c00c8b, #cd267b, #d53d6e);
  3715. border-image-slice: 1;
  3716. }
  3717. .border-gradient-fast-pink-light-yellow {
  3718. border-image: linear-gradient(to right top, #f7567f, #fe7177, #ff8a74, #ffa378, #ffba83);
  3719. border-image-slice: 1;
  3720. }
  3721. .border-gradient-pink-orange {
  3722. border-image: linear-gradient(to right top, #de347f, #e73a70, #ed4461, #f05152, #ef5f43);
  3723. border-image-slice: 1;
  3724. }
  3725. .border-gradient-fast-blue-purple {
  3726. border-image: linear-gradient(to right top, #2a46f4, #5f42f9, #833cfc, #a233fe, #bf25ff);
  3727. border-image-slice: 1;
  3728. }
  3729. .border-gradient-light-pink-light-purple {
  3730. border-image: linear-gradient(to right top, #ed579b, #e855ad, #df57c0, #d15cd4, #bc63e8);
  3731. border-image-slice: 1;
  3732. }
  3733. .border-gradient-light-green-light-perotgreen {
  3734. border-image: linear-gradient(to right top, #5553e1, #a34dcc, #ce4fb5, #e75ca1, #f47291);
  3735. border-image-slice: 1;
  3736. }
  3737. .border-gradient-sky-blue-pink {
  3738. border-image: linear-gradient(to right top, #556fff, #556fff, #e05fc4, #f767a6, #ff798e);
  3739. border-image-slice: 1;
  3740. }
  3741. /* Border radius */
  3742. .border-radius-0px {
  3743. border-radius: 0 !important;
  3744. }
  3745. .border-radius-1px {
  3746. border-radius: 1px !important;
  3747. }
  3748. .border-radius-2px {
  3749. border-radius: 2px !important;
  3750. }
  3751. .border-radius-3px {
  3752. border-radius: 3px !important;
  3753. }
  3754. .border-radius-4px {
  3755. border-radius: 4px !important;
  3756. }
  3757. .border-radius-5px {
  3758. border-radius: 5px !important;
  3759. }
  3760. .border-radius-6px {
  3761. border-radius: 6px !important;
  3762. }
  3763. .border-radius-7px {
  3764. border-radius: 7px !important;
  3765. }
  3766. .border-radius-8px {
  3767. border-radius: 8px !important;
  3768. }
  3769. .border-radius-9px {
  3770. border-radius: 9px !important;
  3771. }
  3772. .border-radius-10px {
  3773. border-radius: 10px !important;
  3774. }
  3775. .border-radius-15px {
  3776. border-radius: 15px !important;
  3777. }
  3778. .border-radius-18px {
  3779. border-radius: 18px !important;
  3780. }
  3781. .border-radius-20px {
  3782. border-radius: 20px !important;
  3783. }
  3784. .border-radius-22px {
  3785. border-radius: 22px !important;
  3786. }
  3787. .border-radius-24px {
  3788. border-radius: 24px !important;
  3789. }
  3790. .border-radius-26px {
  3791. border-radius: 26px !important;
  3792. }
  3793. .border-radius-30px {
  3794. border-radius: 30px !important;
  3795. }
  3796. .border-radius-40px {
  3797. border-radius: 40px !important;
  3798. }
  3799. .border-radius-50px {
  3800. border-radius: 50px !important;
  3801. }
  3802. .border-radius-100px {
  3803. border-radius: 100px !important;
  3804. }
  3805. .border-radius-50 {
  3806. border-radius: 50% !important;
  3807. }
  3808. .border-radius-100 {
  3809. border-radius: 100% !important;
  3810. }
  3811. .no-border-radius {
  3812. border-radius: 0 !important;
  3813. }
  3814. .border-radius-top-left {
  3815. border-radius: 10px 0 0 10px !important;
  3816. }
  3817. /* Parallax background */
  3818. .parallax {
  3819. position: relative !important;
  3820. background-size: cover !important;
  3821. overflow: hidden;
  3822. background-attachment: fixed !important;
  3823. transition-timing-function: none;
  3824. -webkit-transition-timing-function: none;
  3825. transition-duration: 0s;
  3826. -webkit-transition-duration: 0s;
  3827. }
  3828. /* ===================================
  3829. 07. Width
  3830. ====================================== */
  3831. .w-1px {
  3832. width: 1px !important;
  3833. }
  3834. .w-2px {
  3835. width: 2px !important;
  3836. }
  3837. .w-3px {
  3838. width: 3px !important;
  3839. }
  3840. .w-4px {
  3841. width: 4px !important;
  3842. }
  3843. .w-5px {
  3844. width: 5px !important;
  3845. }
  3846. .w-6px {
  3847. width: 6px !important;
  3848. }
  3849. .w-7px {
  3850. width: 7px !important;
  3851. }
  3852. .w-8px {
  3853. width: 8px !important;
  3854. }
  3855. .w-9px {
  3856. width: 9px !important;
  3857. }
  3858. .w-10px {
  3859. width: 10px !important;
  3860. }
  3861. .w-15px {
  3862. width: 15px !important;
  3863. }
  3864. .w-20px {
  3865. width: 20px !important;
  3866. }
  3867. .w-25px {
  3868. width: 25px !important;
  3869. }
  3870. .w-30px {
  3871. width: 30px !important;
  3872. }
  3873. .w-35px {
  3874. width: 35px !important;
  3875. }
  3876. .w-40px {
  3877. width: 40px !important;
  3878. }
  3879. .w-45px {
  3880. width: 45px !important;
  3881. }
  3882. .w-50px {
  3883. width: 50px !important;
  3884. }
  3885. .w-55px {
  3886. width: 55px !important;
  3887. }
  3888. .w-60px {
  3889. width: 60px !important;
  3890. }
  3891. .w-65px {
  3892. width: 65px !important;
  3893. }
  3894. .w-70px {
  3895. width: 70px !important;
  3896. }
  3897. .w-75px {
  3898. width: 75px !important;
  3899. }
  3900. .w-80px {
  3901. width: 80px !important;
  3902. }
  3903. .w-85px {
  3904. width: 85px !important;
  3905. }
  3906. .w-90px {
  3907. width: 90px !important;
  3908. }
  3909. .w-95px {
  3910. width: 95px !important;
  3911. }
  3912. .w-100px {
  3913. width: 100px !important;
  3914. }
  3915. .w-110px {
  3916. width: 110px !important;
  3917. }
  3918. .w-120px {
  3919. width: 120px !important;
  3920. }
  3921. .w-130px {
  3922. width: 130px !important;
  3923. }
  3924. .w-140px {
  3925. width: 140px !important;
  3926. }
  3927. .w-150px {
  3928. width: 150px !important;
  3929. }
  3930. .w-160px {
  3931. width: 160px !important;
  3932. }
  3933. .w-170px {
  3934. width: 170px !important;
  3935. }
  3936. .w-180px {
  3937. width: 180px !important;
  3938. }
  3939. .w-190px {
  3940. width: 190px !important;
  3941. }
  3942. .w-200px {
  3943. width: 200px !important;
  3944. }
  3945. .w-210px {
  3946. width: 210px !important;
  3947. }
  3948. .w-220px {
  3949. width: 220px !important;
  3950. }
  3951. .w-230px {
  3952. width: 230px !important;
  3953. }
  3954. .w-240px {
  3955. width: 240px !important;
  3956. }
  3957. .w-250px {
  3958. width: 250px !important;
  3959. }
  3960. .w-260px {
  3961. width: 260px !important;
  3962. }
  3963. .w-270px {
  3964. width: 270px !important;
  3965. }
  3966. .w-280px {
  3967. width: 280px !important;
  3968. }
  3969. .w-290px {
  3970. width: 290px !important;
  3971. }
  3972. .w-300px {
  3973. width: 300px !important;
  3974. }
  3975. .w-310px {
  3976. width: 310px !important;
  3977. }
  3978. .w-320px {
  3979. width: 320px !important;
  3980. }
  3981. .w-330px {
  3982. width: 330px !important;
  3983. }
  3984. .w-340px {
  3985. width: 340px !important;
  3986. }
  3987. .w-350px {
  3988. width: 350px !important;
  3989. }
  3990. .w-360px {
  3991. width: 360px !important;
  3992. }
  3993. .w-370px {
  3994. width: 370px !important;
  3995. }
  3996. .w-380px {
  3997. width: 380px !important;
  3998. }
  3999. .w-390px {
  4000. width: 390px !important;
  4001. }
  4002. .w-400px {
  4003. width: 400px !important;
  4004. }
  4005. .w-450px {
  4006. width: 450px !important;
  4007. }
  4008. .w-500px {
  4009. width: 500px !important;
  4010. }
  4011. .w-550px {
  4012. width: 550px !important;
  4013. }
  4014. .w-600px {
  4015. width: 600px !important;
  4016. }
  4017. .w-650px {
  4018. width: 650px !important;
  4019. }
  4020. .w-700px {
  4021. width: 700px !important;
  4022. }
  4023. .w-750px {
  4024. width: 750px !important;
  4025. }
  4026. .w-800px {
  4027. width: 800px !important;
  4028. }
  4029. .w-850px {
  4030. width: 850px !important;
  4031. }
  4032. .w-900px {
  4033. width: 900px !important;
  4034. }
  4035. .w-950px {
  4036. width: 950px !important;
  4037. }
  4038. .w-1000px {
  4039. width: 1000px !important;
  4040. }
  4041. .w-10 {
  4042. width: 10% !important;
  4043. }
  4044. .w-15 {
  4045. width: 15% !important;
  4046. }
  4047. .w-20 {
  4048. width: 20% !important;
  4049. }
  4050. .w-25 {
  4051. width: 25% !important;
  4052. }
  4053. .w-30 {
  4054. width: 30% !important;
  4055. }
  4056. .w-35 {
  4057. width: 35% !important;
  4058. }
  4059. .w-40 {
  4060. width: 40% !important;
  4061. }
  4062. .w-45 {
  4063. width: 45% !important;
  4064. }
  4065. .w-50 {
  4066. width: 50% !important;
  4067. }
  4068. .w-55 {
  4069. width: 55% !important;
  4070. }
  4071. .w-60 {
  4072. width: 60% !important;
  4073. }
  4074. .w-65 {
  4075. width: 65% !important;
  4076. }
  4077. .w-70 {
  4078. width: 70% !important;
  4079. }
  4080. .w-75 {
  4081. width: 75% !important;
  4082. }
  4083. .w-80 {
  4084. width: 80% !important;
  4085. }
  4086. .w-85 {
  4087. width: 85% !important;
  4088. }
  4089. .w-90 {
  4090. width: 90% !important;
  4091. }
  4092. .w-95 {
  4093. width: 95% !important;
  4094. }
  4095. .w-100 {
  4096. width: 100% !important;
  4097. }
  4098. .w-auto {
  4099. width: auto !important;
  4100. }
  4101. /* ===================================
  4102. 08. Height
  4103. ====================================== */
  4104. .h-1px {
  4105. height: 1px !important;
  4106. }
  4107. .h-2px {
  4108. height: 2px !important;
  4109. }
  4110. .h-3px {
  4111. height: 3px !important;
  4112. }
  4113. .h-4px {
  4114. height: 4px !important;
  4115. }
  4116. .h-5px {
  4117. height: 5px !important;
  4118. }
  4119. .h-6px {
  4120. height: 6px !important;
  4121. }
  4122. .h-7px {
  4123. height: 7px !important;
  4124. }
  4125. .h-8px {
  4126. height: 8px !important;
  4127. }
  4128. .h-9px {
  4129. height: 9px !important;
  4130. }
  4131. .h-10px {
  4132. height: 10px !important;
  4133. }
  4134. .h-11px {
  4135. height: 11px !important;
  4136. }
  4137. .h-12px {
  4138. height: 12px !important;
  4139. }
  4140. .h-13px {
  4141. height: 13px !important;
  4142. }
  4143. .h-14px {
  4144. height: 14px !important;
  4145. }
  4146. .h-15px {
  4147. height: 15px !important;
  4148. }
  4149. .h-20px {
  4150. height: 20px !important;
  4151. }
  4152. .h-25px {
  4153. height: 25px !important;
  4154. }
  4155. .h-30px {
  4156. height: 30px !important;
  4157. }
  4158. .h-35px {
  4159. height: 35px !important;
  4160. }
  4161. .h-40px {
  4162. height: 40px !important;
  4163. }
  4164. .h-42px {
  4165. height: 42px !important;
  4166. }
  4167. .h-45px {
  4168. height: 45px !important;
  4169. }
  4170. .h-50px {
  4171. height: 50px !important;
  4172. }
  4173. .h-55px {
  4174. height: 55px !important;
  4175. }
  4176. .h-60px {
  4177. height: 60px !important;
  4178. }
  4179. .h-65px {
  4180. height: 65px !important;
  4181. }
  4182. .h-70px {
  4183. height: 70px !important;
  4184. }
  4185. .h-75px {
  4186. height: 75px !important;
  4187. }
  4188. .h-80px {
  4189. height: 80px !important;
  4190. }
  4191. .h-85px {
  4192. height: 85px !important;
  4193. }
  4194. .h-90px {
  4195. height: 90px !important;
  4196. }
  4197. .h-95px {
  4198. height: 95px !important;
  4199. }
  4200. .h-100px {
  4201. height: 100px !important;
  4202. }
  4203. .h-110px {
  4204. height: 110px !important;
  4205. }
  4206. .h-120px {
  4207. height: 120px !important;
  4208. }
  4209. .h-130px {
  4210. height: 130px !important;
  4211. }
  4212. .h-140px {
  4213. height: 140px !important;
  4214. }
  4215. .h-150px {
  4216. height: 150px !important;
  4217. }
  4218. .h-160px {
  4219. height: 160px !important;
  4220. }
  4221. .h-170px {
  4222. height: 170px !important;
  4223. }
  4224. .h-180px {
  4225. height: 180px !important;
  4226. }
  4227. .h-190px {
  4228. height: 190px !important;
  4229. }
  4230. .h-200px {
  4231. height: 200px !important;
  4232. }
  4233. .h-210px {
  4234. height: 210px !important;
  4235. }
  4236. .h-220px {
  4237. height: 220px !important;
  4238. }
  4239. .h-230px {
  4240. height: 230px !important;
  4241. }
  4242. .h-240px {
  4243. height: 240px !important;
  4244. }
  4245. .h-250px {
  4246. height: 250px !important;
  4247. }
  4248. .h-260px {
  4249. height: 260px !important;
  4250. }
  4251. .h-270px {
  4252. height: 270px !important;
  4253. }
  4254. .h-280px {
  4255. height: 280px !important;
  4256. }
  4257. .h-290px {
  4258. height: 290px !important;
  4259. }
  4260. .h-300px {
  4261. height: 300px !important;
  4262. }
  4263. .h-350px {
  4264. height: 350px !important;
  4265. }
  4266. .h-400px {
  4267. height: 400px !important;
  4268. }
  4269. .h-450px {
  4270. height: 450px !important;
  4271. }
  4272. .h-480px {
  4273. height: 480px !important;
  4274. }
  4275. .h-500px {
  4276. height: 500px !important;
  4277. }
  4278. .h-550px {
  4279. height: 550px !important;
  4280. }
  4281. .h-580px {
  4282. height: 580px !important;
  4283. }
  4284. .h-600px {
  4285. height: 600px !important;
  4286. }
  4287. .h-650px {
  4288. height: 650px !important;
  4289. }
  4290. .h-700px {
  4291. height: 700px !important;
  4292. }
  4293. .h-750px {
  4294. height: 750px !important;
  4295. }
  4296. .h-800px {
  4297. height: 800px !important;
  4298. }
  4299. .h-850px {
  4300. height: 850px !important;
  4301. }
  4302. .h-auto {
  4303. height: auto !important;
  4304. }
  4305. /* Screen height */
  4306. .extra-very-small-screen {
  4307. height: 250px !important;
  4308. }
  4309. .extra-small-screen {
  4310. height: 300px !important;
  4311. }
  4312. .small-screen {
  4313. height: 400px !important;
  4314. }
  4315. .one-half-screen {
  4316. height: 600px !important;
  4317. }
  4318. .one-third-screen {
  4319. height: 700px !important;
  4320. }
  4321. .one-fourth-screen {
  4322. height: 800px !important;
  4323. }
  4324. .one-fifth-screen {
  4325. height: 900px !important;
  4326. }
  4327. .one-sixth-screen {
  4328. height: 1000px !important;
  4329. }
  4330. .one-seventh-screen {
  4331. height: 1200px !important;
  4332. }
  4333. /* Direction ltr and rtl */
  4334. .direction-ltr {
  4335. direction: ltr;
  4336. }
  4337. .direction-rtl {
  4338. direction: rtl;
  4339. }
  4340. /* lr container line */
  4341. .lr-container-line {
  4342. position: relative;
  4343. }
  4344. .lr-container-line::after, .lr-container-line::before {
  4345. position: absolute;
  4346. top: 0;
  4347. margin-top: -150px;
  4348. width: 1px;
  4349. height: 180px;
  4350. opacity: 0.5;
  4351. content: "";
  4352. background: linear-gradient(180deg, rgba(52, 60, 217, 0) 0%, #343cd9 100%);
  4353. }
  4354. .lr-container-line::before {
  4355. left: 0;
  4356. animation: scroll1 15s ease-out infinite;
  4357. }
  4358. .lr-container-line::after {
  4359. right: 0;
  4360. animation: scroll1 20s ease-out infinite;
  4361. }
  4362. @media (prefers-reduced-motion: no-preference) {
  4363. :root {
  4364. scroll-behavior: auto;
  4365. }
  4366. }
  4367. /* ===================================
  4368. 09. Loop - Padding, margin, position, font weight, min height, opacity and z-index
  4369. ====================================== */
  4370. /* Padding and margin */
  4371. .p-5px {
  4372. padding: 5px !important;
  4373. }
  4374. .p-10px {
  4375. padding: 10px !important;
  4376. }
  4377. .p-15px {
  4378. padding: 15px !important;
  4379. }
  4380. .p-20px {
  4381. padding: 20px !important;
  4382. }
  4383. .p-25px {
  4384. padding: 25px !important;
  4385. }
  4386. .p-30px {
  4387. padding: 30px !important;
  4388. }
  4389. .p-35px {
  4390. padding: 35px !important;
  4391. }
  4392. .p-40px {
  4393. padding: 40px !important;
  4394. }
  4395. .p-45px {
  4396. padding: 45px !important;
  4397. }
  4398. .p-50px {
  4399. padding: 50px !important;
  4400. }
  4401. .p-55px {
  4402. padding: 55px !important;
  4403. }
  4404. .p-60px {
  4405. padding: 60px !important;
  4406. }
  4407. .p-65px {
  4408. padding: 65px !important;
  4409. }
  4410. .p-70px {
  4411. padding: 70px !important;
  4412. }
  4413. .p-1 {
  4414. padding: 1% !important;
  4415. }
  4416. .p-2 {
  4417. padding: 2% !important;
  4418. }
  4419. .p-3 {
  4420. padding: 3% !important;
  4421. }
  4422. .p-4 {
  4423. padding: 4% !important;
  4424. }
  4425. .p-5 {
  4426. padding: 5% !important;
  4427. }
  4428. .p-6 {
  4429. padding: 6% !important;
  4430. }
  4431. .p-7 {
  4432. padding: 7% !important;
  4433. }
  4434. .p-8 {
  4435. padding: 8% !important;
  4436. }
  4437. .p-9 {
  4438. padding: 9% !important;
  4439. }
  4440. .p-10 {
  4441. padding: 10% !important;
  4442. }
  4443. .p-11 {
  4444. padding: 11% !important;
  4445. }
  4446. .p-12 {
  4447. padding: 12% !important;
  4448. }
  4449. .p-13 {
  4450. padding: 13% !important;
  4451. }
  4452. .p-14 {
  4453. padding: 14% !important;
  4454. }
  4455. .p-15 {
  4456. padding: 15% !important;
  4457. }
  4458. .p-16 {
  4459. padding: 16% !important;
  4460. }
  4461. .p-17 {
  4462. padding: 17% !important;
  4463. }
  4464. .p-18 {
  4465. padding: 18% !important;
  4466. }
  4467. .p-19 {
  4468. padding: 19% !important;
  4469. }
  4470. .p-20 {
  4471. padding: 20% !important;
  4472. }
  4473. .p-21 {
  4474. padding: 21% !important;
  4475. }
  4476. .p-22 {
  4477. padding: 22% !important;
  4478. }
  4479. .p-23 {
  4480. padding: 23% !important;
  4481. }
  4482. .p-24 {
  4483. padding: 24% !important;
  4484. }
  4485. .p-25 {
  4486. padding: 25% !important;
  4487. }
  4488. .p-26 {
  4489. padding: 26% !important;
  4490. }
  4491. .p-27 {
  4492. padding: 27% !important;
  4493. }
  4494. .p-28 {
  4495. padding: 28% !important;
  4496. }
  4497. .p-29 {
  4498. padding: 29% !important;
  4499. }
  4500. .p-30 {
  4501. padding: 30% !important;
  4502. }
  4503. .pt-5px {
  4504. padding-top: 5px !important;
  4505. }
  4506. .pt-10px {
  4507. padding-top: 10px !important;
  4508. }
  4509. .pt-15px {
  4510. padding-top: 15px !important;
  4511. }
  4512. .pt-20px {
  4513. padding-top: 20px !important;
  4514. }
  4515. .pt-25px {
  4516. padding-top: 25px !important;
  4517. }
  4518. .pt-30px {
  4519. padding-top: 30px !important;
  4520. }
  4521. .pt-35px {
  4522. padding-top: 35px !important;
  4523. }
  4524. .pt-40px {
  4525. padding-top: 40px !important;
  4526. }
  4527. .pt-45px {
  4528. padding-top: 45px !important;
  4529. }
  4530. .pt-50px {
  4531. padding-top: 50px !important;
  4532. }
  4533. .pt-55px {
  4534. padding-top: 55px !important;
  4535. }
  4536. .pt-60px {
  4537. padding-top: 60px !important;
  4538. }
  4539. .pt-65px {
  4540. padding-top: 65px !important;
  4541. }
  4542. .pt-70px {
  4543. padding-top: 70px !important;
  4544. }
  4545. .pt-1 {
  4546. padding-top: 1% !important;
  4547. }
  4548. .pt-2 {
  4549. padding-top: 2% !important;
  4550. }
  4551. .pt-3 {
  4552. padding-top: 3% !important;
  4553. }
  4554. .pt-4 {
  4555. padding-top: 4% !important;
  4556. }
  4557. .pt-5 {
  4558. padding-top: 5% !important;
  4559. }
  4560. .pt-6 {
  4561. padding-top: 6% !important;
  4562. }
  4563. .pt-7 {
  4564. padding-top: 7% !important;
  4565. }
  4566. .pt-8 {
  4567. padding-top: 8% !important;
  4568. }
  4569. .pt-9 {
  4570. padding-top: 9% !important;
  4571. }
  4572. .pt-10 {
  4573. padding-top: 10% !important;
  4574. }
  4575. .pt-11 {
  4576. padding-top: 11% !important;
  4577. }
  4578. .pt-12 {
  4579. padding-top: 12% !important;
  4580. }
  4581. .pt-13 {
  4582. padding-top: 13% !important;
  4583. }
  4584. .pt-14 {
  4585. padding-top: 14% !important;
  4586. }
  4587. .pt-15 {
  4588. padding-top: 15% !important;
  4589. }
  4590. .pt-16 {
  4591. padding-top: 16% !important;
  4592. }
  4593. .pt-17 {
  4594. padding-top: 17% !important;
  4595. }
  4596. .pt-18 {
  4597. padding-top: 18% !important;
  4598. }
  4599. .pt-19 {
  4600. padding-top: 19% !important;
  4601. }
  4602. .pt-20 {
  4603. padding-top: 20% !important;
  4604. }
  4605. .pt-21 {
  4606. padding-top: 21% !important;
  4607. }
  4608. .pt-22 {
  4609. padding-top: 22% !important;
  4610. }
  4611. .pt-23 {
  4612. padding-top: 23% !important;
  4613. }
  4614. .pt-24 {
  4615. padding-top: 24% !important;
  4616. }
  4617. .pt-25 {
  4618. padding-top: 25% !important;
  4619. }
  4620. .pt-26 {
  4621. padding-top: 26% !important;
  4622. }
  4623. .pt-27 {
  4624. padding-top: 27% !important;
  4625. }
  4626. .pt-28 {
  4627. padding-top: 28% !important;
  4628. }
  4629. .pt-29 {
  4630. padding-top: 29% !important;
  4631. }
  4632. .pt-30 {
  4633. padding-top: 30% !important;
  4634. }
  4635. .pe-5px {
  4636. padding-right: 5px !important;
  4637. }
  4638. .pe-10px {
  4639. padding-right: 10px !important;
  4640. }
  4641. .pe-15px {
  4642. padding-right: 15px !important;
  4643. }
  4644. .pe-20px {
  4645. padding-right: 20px !important;
  4646. }
  4647. .pe-25px {
  4648. padding-right: 25px !important;
  4649. }
  4650. .pe-30px {
  4651. padding-right: 30px !important;
  4652. }
  4653. .pe-35px {
  4654. padding-right: 35px !important;
  4655. }
  4656. .pe-40px {
  4657. padding-right: 40px !important;
  4658. }
  4659. .pe-45px {
  4660. padding-right: 45px !important;
  4661. }
  4662. .pe-50px {
  4663. padding-right: 50px !important;
  4664. }
  4665. .pe-55px {
  4666. padding-right: 55px !important;
  4667. }
  4668. .pe-60px {
  4669. padding-right: 60px !important;
  4670. }
  4671. .pe-65px {
  4672. padding-right: 65px !important;
  4673. }
  4674. .pe-70px {
  4675. padding-right: 70px !important;
  4676. }
  4677. .pe-1 {
  4678. padding-right: 1% !important;
  4679. }
  4680. .pe-2 {
  4681. padding-right: 2% !important;
  4682. }
  4683. .pe-3 {
  4684. padding-right: 3% !important;
  4685. }
  4686. .pe-4 {
  4687. padding-right: 4% !important;
  4688. }
  4689. .pe-5 {
  4690. padding-right: 5% !important;
  4691. }
  4692. .pe-6 {
  4693. padding-right: 6% !important;
  4694. }
  4695. .pe-7 {
  4696. padding-right: 7% !important;
  4697. }
  4698. .pe-8 {
  4699. padding-right: 8% !important;
  4700. }
  4701. .pe-9 {
  4702. padding-right: 9% !important;
  4703. }
  4704. .pe-10 {
  4705. padding-right: 10% !important;
  4706. }
  4707. .pe-11 {
  4708. padding-right: 11% !important;
  4709. }
  4710. .pe-12 {
  4711. padding-right: 12% !important;
  4712. }
  4713. .pe-13 {
  4714. padding-right: 13% !important;
  4715. }
  4716. .pe-14 {
  4717. padding-right: 14% !important;
  4718. }
  4719. .pe-15 {
  4720. padding-right: 15% !important;
  4721. }
  4722. .pe-16 {
  4723. padding-right: 16% !important;
  4724. }
  4725. .pe-17 {
  4726. padding-right: 17% !important;
  4727. }
  4728. .pe-18 {
  4729. padding-right: 18% !important;
  4730. }
  4731. .pe-19 {
  4732. padding-right: 19% !important;
  4733. }
  4734. .pe-20 {
  4735. padding-right: 20% !important;
  4736. }
  4737. .pe-21 {
  4738. padding-right: 21% !important;
  4739. }
  4740. .pe-22 {
  4741. padding-right: 22% !important;
  4742. }
  4743. .pe-23 {
  4744. padding-right: 23% !important;
  4745. }
  4746. .pe-24 {
  4747. padding-right: 24% !important;
  4748. }
  4749. .pe-25 {
  4750. padding-right: 25% !important;
  4751. }
  4752. .pe-26 {
  4753. padding-right: 26% !important;
  4754. }
  4755. .pe-27 {
  4756. padding-right: 27% !important;
  4757. }
  4758. .pe-28 {
  4759. padding-right: 28% !important;
  4760. }
  4761. .pe-29 {
  4762. padding-right: 29% !important;
  4763. }
  4764. .pe-30 {
  4765. padding-right: 30% !important;
  4766. }
  4767. .pb-5px {
  4768. padding-bottom: 5px !important;
  4769. }
  4770. .pb-10px {
  4771. padding-bottom: 10px !important;
  4772. }
  4773. .pb-15px {
  4774. padding-bottom: 15px !important;
  4775. }
  4776. .pb-20px {
  4777. padding-bottom: 20px !important;
  4778. }
  4779. .pb-25px {
  4780. padding-bottom: 25px !important;
  4781. }
  4782. .pb-30px {
  4783. padding-bottom: 30px !important;
  4784. }
  4785. .pb-35px {
  4786. padding-bottom: 35px !important;
  4787. }
  4788. .pb-40px {
  4789. padding-bottom: 40px !important;
  4790. }
  4791. .pb-45px {
  4792. padding-bottom: 45px !important;
  4793. }
  4794. .pb-50px {
  4795. padding-bottom: 50px !important;
  4796. }
  4797. .pb-55px {
  4798. padding-bottom: 55px !important;
  4799. }
  4800. .pb-60px {
  4801. padding-bottom: 60px !important;
  4802. }
  4803. .pb-65px {
  4804. padding-bottom: 65px !important;
  4805. }
  4806. .pb-70px {
  4807. padding-bottom: 70px !important;
  4808. }
  4809. .pb-1 {
  4810. padding-bottom: 1% !important;
  4811. }
  4812. .pb-2 {
  4813. padding-bottom: 2% !important;
  4814. }
  4815. .pb-3 {
  4816. padding-bottom: 3% !important;
  4817. }
  4818. .pb-4 {
  4819. padding-bottom: 4% !important;
  4820. }
  4821. .pb-5 {
  4822. padding-bottom: 5% !important;
  4823. }
  4824. .pb-6 {
  4825. padding-bottom: 6% !important;
  4826. }
  4827. .pb-7 {
  4828. padding-bottom: 7% !important;
  4829. }
  4830. .pb-8 {
  4831. padding-bottom: 8% !important;
  4832. }
  4833. .pb-9 {
  4834. padding-bottom: 9% !important;
  4835. }
  4836. .pb-10 {
  4837. padding-bottom: 10% !important;
  4838. }
  4839. .pb-11 {
  4840. padding-bottom: 11% !important;
  4841. }
  4842. .pb-12 {
  4843. padding-bottom: 12% !important;
  4844. }
  4845. .pb-13 {
  4846. padding-bottom: 13% !important;
  4847. }
  4848. .pb-14 {
  4849. padding-bottom: 14% !important;
  4850. }
  4851. .pb-15 {
  4852. padding-bottom: 15% !important;
  4853. }
  4854. .pb-16 {
  4855. padding-bottom: 16% !important;
  4856. }
  4857. .pb-17 {
  4858. padding-bottom: 17% !important;
  4859. }
  4860. .pb-18 {
  4861. padding-bottom: 18% !important;
  4862. }
  4863. .pb-19 {
  4864. padding-bottom: 19% !important;
  4865. }
  4866. .pb-20 {
  4867. padding-bottom: 20% !important;
  4868. }
  4869. .pb-21 {
  4870. padding-bottom: 21% !important;
  4871. }
  4872. .pb-22 {
  4873. padding-bottom: 22% !important;
  4874. }
  4875. .pb-23 {
  4876. padding-bottom: 23% !important;
  4877. }
  4878. .pb-24 {
  4879. padding-bottom: 24% !important;
  4880. }
  4881. .pb-25 {
  4882. padding-bottom: 25% !important;
  4883. }
  4884. .pb-26 {
  4885. padding-bottom: 26% !important;
  4886. }
  4887. .pb-27 {
  4888. padding-bottom: 27% !important;
  4889. }
  4890. .pb-28 {
  4891. padding-bottom: 28% !important;
  4892. }
  4893. .pb-29 {
  4894. padding-bottom: 29% !important;
  4895. }
  4896. .pb-30 {
  4897. padding-bottom: 30% !important;
  4898. }
  4899. .ps-5px {
  4900. padding-left: 5px !important;
  4901. }
  4902. .ps-10px {
  4903. padding-left: 10px !important;
  4904. }
  4905. .ps-15px {
  4906. padding-left: 15px !important;
  4907. }
  4908. .ps-20px {
  4909. padding-left: 20px !important;
  4910. }
  4911. .ps-25px {
  4912. padding-left: 25px !important;
  4913. }
  4914. .ps-30px {
  4915. padding-left: 30px !important;
  4916. }
  4917. .ps-35px {
  4918. padding-left: 35px !important;
  4919. }
  4920. .ps-40px {
  4921. padding-left: 40px !important;
  4922. }
  4923. .ps-45px {
  4924. padding-left: 45px !important;
  4925. }
  4926. .ps-50px {
  4927. padding-left: 50px !important;
  4928. }
  4929. .ps-55px {
  4930. padding-left: 55px !important;
  4931. }
  4932. .ps-60px {
  4933. padding-left: 60px !important;
  4934. }
  4935. .ps-65px {
  4936. padding-left: 65px !important;
  4937. }
  4938. .ps-70px {
  4939. padding-left: 70px !important;
  4940. }
  4941. .ps-1 {
  4942. padding-left: 1% !important;
  4943. }
  4944. .ps-2 {
  4945. padding-left: 2% !important;
  4946. }
  4947. .ps-3 {
  4948. padding-left: 3% !important;
  4949. }
  4950. .ps-4 {
  4951. padding-left: 4% !important;
  4952. }
  4953. .ps-5 {
  4954. padding-left: 5% !important;
  4955. }
  4956. .ps-6 {
  4957. padding-left: 6% !important;
  4958. }
  4959. .ps-7 {
  4960. padding-left: 7% !important;
  4961. }
  4962. .ps-8 {
  4963. padding-left: 8% !important;
  4964. }
  4965. .ps-9 {
  4966. padding-left: 9% !important;
  4967. }
  4968. .ps-10 {
  4969. padding-left: 10% !important;
  4970. }
  4971. .ps-11 {
  4972. padding-left: 11% !important;
  4973. }
  4974. .ps-12 {
  4975. padding-left: 12% !important;
  4976. }
  4977. .ps-13 {
  4978. padding-left: 13% !important;
  4979. }
  4980. .ps-14 {
  4981. padding-left: 14% !important;
  4982. }
  4983. .ps-15 {
  4984. padding-left: 15% !important;
  4985. }
  4986. .ps-16 {
  4987. padding-left: 16% !important;
  4988. }
  4989. .ps-17 {
  4990. padding-left: 17% !important;
  4991. }
  4992. .ps-18 {
  4993. padding-left: 18% !important;
  4994. }
  4995. .ps-19 {
  4996. padding-left: 19% !important;
  4997. }
  4998. .ps-20 {
  4999. padding-left: 20% !important;
  5000. }
  5001. .ps-21 {
  5002. padding-left: 21% !important;
  5003. }
  5004. .ps-22 {
  5005. padding-left: 22% !important;
  5006. }
  5007. .ps-23 {
  5008. padding-left: 23% !important;
  5009. }
  5010. .ps-24 {
  5011. padding-left: 24% !important;
  5012. }
  5013. .ps-25 {
  5014. padding-left: 25% !important;
  5015. }
  5016. .ps-26 {
  5017. padding-left: 26% !important;
  5018. }
  5019. .ps-27 {
  5020. padding-left: 27% !important;
  5021. }
  5022. .ps-28 {
  5023. padding-left: 28% !important;
  5024. }
  5025. .ps-29 {
  5026. padding-left: 29% !important;
  5027. }
  5028. .ps-30 {
  5029. padding-left: 30% !important;
  5030. }
  5031. .m-5px {
  5032. margin: 5px !important;
  5033. }
  5034. .m-10px {
  5035. margin: 10px !important;
  5036. }
  5037. .m-15px {
  5038. margin: 15px !important;
  5039. }
  5040. .m-20px {
  5041. margin: 20px !important;
  5042. }
  5043. .m-25px {
  5044. margin: 25px !important;
  5045. }
  5046. .m-30px {
  5047. margin: 30px !important;
  5048. }
  5049. .m-35px {
  5050. margin: 35px !important;
  5051. }
  5052. .m-40px {
  5053. margin: 40px !important;
  5054. }
  5055. .m-45px {
  5056. margin: 45px !important;
  5057. }
  5058. .m-50px {
  5059. margin: 50px !important;
  5060. }
  5061. .m-55px {
  5062. margin: 55px !important;
  5063. }
  5064. .m-60px {
  5065. margin: 60px !important;
  5066. }
  5067. .m-65px {
  5068. margin: 65px !important;
  5069. }
  5070. .m-70px {
  5071. margin: 70px !important;
  5072. }
  5073. .m-1 {
  5074. margin: 1% !important;
  5075. }
  5076. .m-2 {
  5077. margin: 2% !important;
  5078. }
  5079. .m-3 {
  5080. margin: 3% !important;
  5081. }
  5082. .m-4 {
  5083. margin: 4% !important;
  5084. }
  5085. .m-5 {
  5086. margin: 5% !important;
  5087. }
  5088. .m-6 {
  5089. margin: 6% !important;
  5090. }
  5091. .m-7 {
  5092. margin: 7% !important;
  5093. }
  5094. .m-8 {
  5095. margin: 8% !important;
  5096. }
  5097. .m-9 {
  5098. margin: 9% !important;
  5099. }
  5100. .m-10 {
  5101. margin: 10% !important;
  5102. }
  5103. .m-11 {
  5104. margin: 11% !important;
  5105. }
  5106. .m-12 {
  5107. margin: 12% !important;
  5108. }
  5109. .m-13 {
  5110. margin: 13% !important;
  5111. }
  5112. .m-14 {
  5113. margin: 14% !important;
  5114. }
  5115. .m-15 {
  5116. margin: 15% !important;
  5117. }
  5118. .m-16 {
  5119. margin: 16% !important;
  5120. }
  5121. .m-17 {
  5122. margin: 17% !important;
  5123. }
  5124. .m-18 {
  5125. margin: 18% !important;
  5126. }
  5127. .m-19 {
  5128. margin: 19% !important;
  5129. }
  5130. .m-20 {
  5131. margin: 20% !important;
  5132. }
  5133. .m-21 {
  5134. margin: 21% !important;
  5135. }
  5136. .m-22 {
  5137. margin: 22% !important;
  5138. }
  5139. .m-23 {
  5140. margin: 23% !important;
  5141. }
  5142. .m-24 {
  5143. margin: 24% !important;
  5144. }
  5145. .m-25 {
  5146. margin: 25% !important;
  5147. }
  5148. .m-26 {
  5149. margin: 26% !important;
  5150. }
  5151. .m-27 {
  5152. margin: 27% !important;
  5153. }
  5154. .m-28 {
  5155. margin: 28% !important;
  5156. }
  5157. .m-29 {
  5158. margin: 29% !important;
  5159. }
  5160. .m-30 {
  5161. margin: 30% !important;
  5162. }
  5163. .mt-5px {
  5164. margin-top: 5px !important;
  5165. }
  5166. .mt-10px {
  5167. margin-top: 10px !important;
  5168. }
  5169. .mt-15px {
  5170. margin-top: 15px !important;
  5171. }
  5172. .mt-20px {
  5173. margin-top: 20px !important;
  5174. }
  5175. .mt-25px {
  5176. margin-top: 25px !important;
  5177. }
  5178. .mt-30px {
  5179. margin-top: 30px !important;
  5180. }
  5181. .mt-35px {
  5182. margin-top: 35px !important;
  5183. }
  5184. .mt-40px {
  5185. margin-top: 40px !important;
  5186. }
  5187. .mt-45px {
  5188. margin-top: 45px !important;
  5189. }
  5190. .mt-50px {
  5191. margin-top: 50px !important;
  5192. }
  5193. .mt-55px {
  5194. margin-top: 55px !important;
  5195. }
  5196. .mt-60px {
  5197. margin-top: 60px !important;
  5198. }
  5199. .mt-65px {
  5200. margin-top: 65px !important;
  5201. }
  5202. .mt-70px {
  5203. margin-top: 70px !important;
  5204. }
  5205. .mt-1 {
  5206. margin-top: 1% !important;
  5207. }
  5208. .mt-2 {
  5209. margin-top: 2% !important;
  5210. }
  5211. .mt-3 {
  5212. margin-top: 3% !important;
  5213. }
  5214. .mt-4 {
  5215. margin-top: 4% !important;
  5216. }
  5217. .mt-5 {
  5218. margin-top: 5% !important;
  5219. }
  5220. .mt-6 {
  5221. margin-top: 6% !important;
  5222. }
  5223. .mt-7 {
  5224. margin-top: 7% !important;
  5225. }
  5226. .mt-8 {
  5227. margin-top: 8% !important;
  5228. }
  5229. .mt-9 {
  5230. margin-top: 9% !important;
  5231. }
  5232. .mt-10 {
  5233. margin-top: 10% !important;
  5234. }
  5235. .mt-11 {
  5236. margin-top: 11% !important;
  5237. }
  5238. .mt-12 {
  5239. margin-top: 12% !important;
  5240. }
  5241. .mt-13 {
  5242. margin-top: 13% !important;
  5243. }
  5244. .mt-14 {
  5245. margin-top: 14% !important;
  5246. }
  5247. .mt-15 {
  5248. margin-top: 15% !important;
  5249. }
  5250. .mt-16 {
  5251. margin-top: 16% !important;
  5252. }
  5253. .mt-17 {
  5254. margin-top: 17% !important;
  5255. }
  5256. .mt-18 {
  5257. margin-top: 18% !important;
  5258. }
  5259. .mt-19 {
  5260. margin-top: 19% !important;
  5261. }
  5262. .mt-20 {
  5263. margin-top: 20% !important;
  5264. }
  5265. .mt-21 {
  5266. margin-top: 21% !important;
  5267. }
  5268. .mt-22 {
  5269. margin-top: 22% !important;
  5270. }
  5271. .mt-23 {
  5272. margin-top: 23% !important;
  5273. }
  5274. .mt-24 {
  5275. margin-top: 24% !important;
  5276. }
  5277. .mt-25 {
  5278. margin-top: 25% !important;
  5279. }
  5280. .mt-26 {
  5281. margin-top: 26% !important;
  5282. }
  5283. .mt-27 {
  5284. margin-top: 27% !important;
  5285. }
  5286. .mt-28 {
  5287. margin-top: 28% !important;
  5288. }
  5289. .mt-29 {
  5290. margin-top: 29% !important;
  5291. }
  5292. .mt-30 {
  5293. margin-top: 30% !important;
  5294. }
  5295. .me-5px {
  5296. margin-right: 5px !important;
  5297. }
  5298. .me-10px {
  5299. margin-right: 10px !important;
  5300. }
  5301. .me-15px {
  5302. margin-right: 15px !important;
  5303. }
  5304. .me-20px {
  5305. margin-right: 20px !important;
  5306. }
  5307. .me-25px {
  5308. margin-right: 25px !important;
  5309. }
  5310. .me-30px {
  5311. margin-right: 30px !important;
  5312. }
  5313. .me-35px {
  5314. margin-right: 35px !important;
  5315. }
  5316. .me-40px {
  5317. margin-right: 40px !important;
  5318. }
  5319. .me-45px {
  5320. margin-right: 45px !important;
  5321. }
  5322. .me-50px {
  5323. margin-right: 50px !important;
  5324. }
  5325. .me-55px {
  5326. margin-right: 55px !important;
  5327. }
  5328. .me-60px {
  5329. margin-right: 60px !important;
  5330. }
  5331. .me-65px {
  5332. margin-right: 65px !important;
  5333. }
  5334. .me-70px {
  5335. margin-right: 70px !important;
  5336. }
  5337. .me-1 {
  5338. margin-right: 1% !important;
  5339. }
  5340. .me-2 {
  5341. margin-right: 2% !important;
  5342. }
  5343. .me-3 {
  5344. margin-right: 3% !important;
  5345. }
  5346. .me-4 {
  5347. margin-right: 4% !important;
  5348. }
  5349. .me-5 {
  5350. margin-right: 5% !important;
  5351. }
  5352. .me-6 {
  5353. margin-right: 6% !important;
  5354. }
  5355. .me-7 {
  5356. margin-right: 7% !important;
  5357. }
  5358. .me-8 {
  5359. margin-right: 8% !important;
  5360. }
  5361. .me-9 {
  5362. margin-right: 9% !important;
  5363. }
  5364. .me-10 {
  5365. margin-right: 10% !important;
  5366. }
  5367. .me-11 {
  5368. margin-right: 11% !important;
  5369. }
  5370. .me-12 {
  5371. margin-right: 12% !important;
  5372. }
  5373. .me-13 {
  5374. margin-right: 13% !important;
  5375. }
  5376. .me-14 {
  5377. margin-right: 14% !important;
  5378. }
  5379. .me-15 {
  5380. margin-right: 15% !important;
  5381. }
  5382. .me-16 {
  5383. margin-right: 16% !important;
  5384. }
  5385. .me-17 {
  5386. margin-right: 17% !important;
  5387. }
  5388. .me-18 {
  5389. margin-right: 18% !important;
  5390. }
  5391. .me-19 {
  5392. margin-right: 19% !important;
  5393. }
  5394. .me-20 {
  5395. margin-right: 20% !important;
  5396. }
  5397. .me-21 {
  5398. margin-right: 21% !important;
  5399. }
  5400. .me-22 {
  5401. margin-right: 22% !important;
  5402. }
  5403. .me-23 {
  5404. margin-right: 23% !important;
  5405. }
  5406. .me-24 {
  5407. margin-right: 24% !important;
  5408. }
  5409. .me-25 {
  5410. margin-right: 25% !important;
  5411. }
  5412. .me-26 {
  5413. margin-right: 26% !important;
  5414. }
  5415. .me-27 {
  5416. margin-right: 27% !important;
  5417. }
  5418. .me-28 {
  5419. margin-right: 28% !important;
  5420. }
  5421. .me-29 {
  5422. margin-right: 29% !important;
  5423. }
  5424. .me-30 {
  5425. margin-right: 30% !important;
  5426. }
  5427. .mb-5px {
  5428. margin-bottom: 5px !important;
  5429. }
  5430. .mb-10px {
  5431. margin-bottom: 10px !important;
  5432. }
  5433. .mb-15px {
  5434. margin-bottom: 15px !important;
  5435. }
  5436. .mb-20px {
  5437. margin-bottom: 20px !important;
  5438. }
  5439. .mb-25px {
  5440. margin-bottom: 25px !important;
  5441. }
  5442. .mb-30px {
  5443. margin-bottom: 30px !important;
  5444. }
  5445. .mb-35px {
  5446. margin-bottom: 35px !important;
  5447. }
  5448. .mb-40px {
  5449. margin-bottom: 40px !important;
  5450. }
  5451. .mb-45px {
  5452. margin-bottom: 45px !important;
  5453. }
  5454. .mb-50px {
  5455. margin-bottom: 50px !important;
  5456. }
  5457. .mb-55px {
  5458. margin-bottom: 55px !important;
  5459. }
  5460. .mb-60px {
  5461. margin-bottom: 60px !important;
  5462. }
  5463. .mb-65px {
  5464. margin-bottom: 65px !important;
  5465. }
  5466. .mb-70px {
  5467. margin-bottom: 70px !important;
  5468. }
  5469. .mb-1 {
  5470. margin-bottom: 1% !important;
  5471. }
  5472. .mb-2 {
  5473. margin-bottom: 2% !important;
  5474. }
  5475. .mb-3 {
  5476. margin-bottom: 3% !important;
  5477. }
  5478. .mb-4 {
  5479. margin-bottom: 4% !important;
  5480. }
  5481. .mb-5 {
  5482. margin-bottom: 5% !important;
  5483. }
  5484. .mb-6 {
  5485. margin-bottom: 6% !important;
  5486. }
  5487. .mb-7 {
  5488. margin-bottom: 7% !important;
  5489. }
  5490. .mb-8 {
  5491. margin-bottom: 8% !important;
  5492. }
  5493. .mb-9 {
  5494. margin-bottom: 9% !important;
  5495. }
  5496. .mb-10 {
  5497. margin-bottom: 10% !important;
  5498. }
  5499. .mb-11 {
  5500. margin-bottom: 11% !important;
  5501. }
  5502. .mb-12 {
  5503. margin-bottom: 12% !important;
  5504. }
  5505. .mb-13 {
  5506. margin-bottom: 13% !important;
  5507. }
  5508. .mb-14 {
  5509. margin-bottom: 14% !important;
  5510. }
  5511. .mb-15 {
  5512. margin-bottom: 15% !important;
  5513. }
  5514. .mb-16 {
  5515. margin-bottom: 16% !important;
  5516. }
  5517. .mb-17 {
  5518. margin-bottom: 17% !important;
  5519. }
  5520. .mb-18 {
  5521. margin-bottom: 18% !important;
  5522. }
  5523. .mb-19 {
  5524. margin-bottom: 19% !important;
  5525. }
  5526. .mb-20 {
  5527. margin-bottom: 20% !important;
  5528. }
  5529. .mb-21 {
  5530. margin-bottom: 21% !important;
  5531. }
  5532. .mb-22 {
  5533. margin-bottom: 22% !important;
  5534. }
  5535. .mb-23 {
  5536. margin-bottom: 23% !important;
  5537. }
  5538. .mb-24 {
  5539. margin-bottom: 24% !important;
  5540. }
  5541. .mb-25 {
  5542. margin-bottom: 25% !important;
  5543. }
  5544. .mb-26 {
  5545. margin-bottom: 26% !important;
  5546. }
  5547. .mb-27 {
  5548. margin-bottom: 27% !important;
  5549. }
  5550. .mb-28 {
  5551. margin-bottom: 28% !important;
  5552. }
  5553. .mb-29 {
  5554. margin-bottom: 29% !important;
  5555. }
  5556. .mb-30 {
  5557. margin-bottom: 30% !important;
  5558. }
  5559. .ms-5px {
  5560. margin-left: 5px !important;
  5561. }
  5562. .ms-10px {
  5563. margin-left: 10px !important;
  5564. }
  5565. .ms-15px {
  5566. margin-left: 15px !important;
  5567. }
  5568. .ms-20px {
  5569. margin-left: 20px !important;
  5570. }
  5571. .ms-25px {
  5572. margin-left: 25px !important;
  5573. }
  5574. .ms-30px {
  5575. margin-left: 30px !important;
  5576. }
  5577. .ms-35px {
  5578. margin-left: 35px !important;
  5579. }
  5580. .ms-40px {
  5581. margin-left: 40px !important;
  5582. }
  5583. .ms-45px {
  5584. margin-left: 45px !important;
  5585. }
  5586. .ms-50px {
  5587. margin-left: 50px !important;
  5588. }
  5589. .ms-55px {
  5590. margin-left: 55px !important;
  5591. }
  5592. .ms-60px {
  5593. margin-left: 60px !important;
  5594. }
  5595. .ms-65px {
  5596. margin-left: 65px !important;
  5597. }
  5598. .ms-70px {
  5599. margin-left: 70px !important;
  5600. }
  5601. .ms-1 {
  5602. margin-left: 1% !important;
  5603. }
  5604. .ms-2 {
  5605. margin-left: 2% !important;
  5606. }
  5607. .ms-3 {
  5608. margin-left: 3% !important;
  5609. }
  5610. .ms-4 {
  5611. margin-left: 4% !important;
  5612. }
  5613. .ms-5 {
  5614. margin-left: 5% !important;
  5615. }
  5616. .ms-6 {
  5617. margin-left: 6% !important;
  5618. }
  5619. .ms-7 {
  5620. margin-left: 7% !important;
  5621. }
  5622. .ms-8 {
  5623. margin-left: 8% !important;
  5624. }
  5625. .ms-9 {
  5626. margin-left: 9% !important;
  5627. }
  5628. .ms-10 {
  5629. margin-left: 10% !important;
  5630. }
  5631. .ms-11 {
  5632. margin-left: 11% !important;
  5633. }
  5634. .ms-12 {
  5635. margin-left: 12% !important;
  5636. }
  5637. .ms-13 {
  5638. margin-left: 13% !important;
  5639. }
  5640. .ms-14 {
  5641. margin-left: 14% !important;
  5642. }
  5643. .ms-15 {
  5644. margin-left: 15% !important;
  5645. }
  5646. .ms-16 {
  5647. margin-left: 16% !important;
  5648. }
  5649. .ms-17 {
  5650. margin-left: 17% !important;
  5651. }
  5652. .ms-18 {
  5653. margin-left: 18% !important;
  5654. }
  5655. .ms-19 {
  5656. margin-left: 19% !important;
  5657. }
  5658. .ms-20 {
  5659. margin-left: 20% !important;
  5660. }
  5661. .ms-21 {
  5662. margin-left: 21% !important;
  5663. }
  5664. .ms-22 {
  5665. margin-left: 22% !important;
  5666. }
  5667. .ms-23 {
  5668. margin-left: 23% !important;
  5669. }
  5670. .ms-24 {
  5671. margin-left: 24% !important;
  5672. }
  5673. .ms-25 {
  5674. margin-left: 25% !important;
  5675. }
  5676. .ms-26 {
  5677. margin-left: 26% !important;
  5678. }
  5679. .ms-27 {
  5680. margin-left: 27% !important;
  5681. }
  5682. .ms-28 {
  5683. margin-left: 28% !important;
  5684. }
  5685. .ms-29 {
  5686. margin-left: 29% !important;
  5687. }
  5688. .ms-30 {
  5689. margin-left: 30% !important;
  5690. }
  5691. /* Position */
  5692. .top-0px {
  5693. top: 0px;
  5694. }
  5695. .top-1px {
  5696. top: 1px;
  5697. }
  5698. .top-2px {
  5699. top: 2px;
  5700. }
  5701. .top-3px {
  5702. top: 3px;
  5703. }
  5704. .top-4px {
  5705. top: 4px;
  5706. }
  5707. .top-5px {
  5708. top: 5px;
  5709. }
  5710. .top-6px {
  5711. top: 6px;
  5712. }
  5713. .top-7px {
  5714. top: 7px;
  5715. }
  5716. .top-8px {
  5717. top: 8px;
  5718. }
  5719. .top-9px {
  5720. top: 9px;
  5721. }
  5722. .top-10px {
  5723. top: 10px;
  5724. }
  5725. .top-11px {
  5726. top: 11px;
  5727. }
  5728. .top-12px {
  5729. top: 12px;
  5730. }
  5731. .top-13px {
  5732. top: 13px;
  5733. }
  5734. .top-14px {
  5735. top: 14px;
  5736. }
  5737. .top-15px {
  5738. top: 15px;
  5739. }
  5740. .top-16px {
  5741. top: 16px;
  5742. }
  5743. .top-17px {
  5744. top: 17px;
  5745. }
  5746. .top-18px {
  5747. top: 18px;
  5748. }
  5749. .top-19px {
  5750. top: 19px;
  5751. }
  5752. .top-20px {
  5753. top: 20px;
  5754. }
  5755. .top-21px {
  5756. top: 21px;
  5757. }
  5758. .top-22px {
  5759. top: 22px;
  5760. }
  5761. .top-23px {
  5762. top: 23px;
  5763. }
  5764. .top-24px {
  5765. top: 24px;
  5766. }
  5767. .top-25px {
  5768. top: 25px;
  5769. }
  5770. .top-26px {
  5771. top: 26px;
  5772. }
  5773. .top-27px {
  5774. top: 27px;
  5775. }
  5776. .top-28px {
  5777. top: 28px;
  5778. }
  5779. .top-29px {
  5780. top: 29px;
  5781. }
  5782. .top-30px {
  5783. top: 30px;
  5784. }
  5785. .top-40px {
  5786. top: 40px;
  5787. }
  5788. .top-50px {
  5789. top: 50px;
  5790. }
  5791. .top-60px {
  5792. top: 60px;
  5793. }
  5794. .top-70px {
  5795. top: 70px;
  5796. }
  5797. .top-80px {
  5798. top: 80px;
  5799. }
  5800. .top-90px {
  5801. top: 90px;
  5802. }
  5803. .top-100px {
  5804. top: 100px;
  5805. }
  5806. .top-110px {
  5807. top: 110px;
  5808. }
  5809. .top-120px {
  5810. top: 120px;
  5811. }
  5812. .top-130px {
  5813. top: 130px;
  5814. }
  5815. .top-140px {
  5816. top: 140px;
  5817. }
  5818. .top-150px {
  5819. top: 150px;
  5820. }
  5821. .right-0px {
  5822. right: 0px;
  5823. }
  5824. .right-1px {
  5825. right: 1px;
  5826. }
  5827. .right-2px {
  5828. right: 2px;
  5829. }
  5830. .right-3px {
  5831. right: 3px;
  5832. }
  5833. .right-4px {
  5834. right: 4px;
  5835. }
  5836. .right-5px {
  5837. right: 5px;
  5838. }
  5839. .right-6px {
  5840. right: 6px;
  5841. }
  5842. .right-7px {
  5843. right: 7px;
  5844. }
  5845. .right-8px {
  5846. right: 8px;
  5847. }
  5848. .right-9px {
  5849. right: 9px;
  5850. }
  5851. .right-10px {
  5852. right: 10px;
  5853. }
  5854. .right-11px {
  5855. right: 11px;
  5856. }
  5857. .right-12px {
  5858. right: 12px;
  5859. }
  5860. .right-13px {
  5861. right: 13px;
  5862. }
  5863. .right-14px {
  5864. right: 14px;
  5865. }
  5866. .right-15px {
  5867. right: 15px;
  5868. }
  5869. .right-16px {
  5870. right: 16px;
  5871. }
  5872. .right-17px {
  5873. right: 17px;
  5874. }
  5875. .right-18px {
  5876. right: 18px;
  5877. }
  5878. .right-19px {
  5879. right: 19px;
  5880. }
  5881. .right-20px {
  5882. right: 20px;
  5883. }
  5884. .right-21px {
  5885. right: 21px;
  5886. }
  5887. .right-22px {
  5888. right: 22px;
  5889. }
  5890. .right-23px {
  5891. right: 23px;
  5892. }
  5893. .right-24px {
  5894. right: 24px;
  5895. }
  5896. .right-25px {
  5897. right: 25px;
  5898. }
  5899. .right-26px {
  5900. right: 26px;
  5901. }
  5902. .right-27px {
  5903. right: 27px;
  5904. }
  5905. .right-28px {
  5906. right: 28px;
  5907. }
  5908. .right-29px {
  5909. right: 29px;
  5910. }
  5911. .right-30px {
  5912. right: 30px;
  5913. }
  5914. .right-40px {
  5915. right: 40px;
  5916. }
  5917. .right-50px {
  5918. right: 50px;
  5919. }
  5920. .right-60px {
  5921. right: 60px;
  5922. }
  5923. .right-70px {
  5924. right: 70px;
  5925. }
  5926. .right-80px {
  5927. right: 80px;
  5928. }
  5929. .right-90px {
  5930. right: 90px;
  5931. }
  5932. .right-100px {
  5933. right: 100px;
  5934. }
  5935. .right-110px {
  5936. right: 110px;
  5937. }
  5938. .right-120px {
  5939. right: 120px;
  5940. }
  5941. .right-130px {
  5942. right: 130px;
  5943. }
  5944. .right-140px {
  5945. right: 140px;
  5946. }
  5947. .right-150px {
  5948. right: 150px;
  5949. }
  5950. .bottom-0px {
  5951. bottom: 0px;
  5952. }
  5953. .bottom-1px {
  5954. bottom: 1px;
  5955. }
  5956. .bottom-2px {
  5957. bottom: 2px;
  5958. }
  5959. .bottom-3px {
  5960. bottom: 3px;
  5961. }
  5962. .bottom-4px {
  5963. bottom: 4px;
  5964. }
  5965. .bottom-5px {
  5966. bottom: 5px;
  5967. }
  5968. .bottom-6px {
  5969. bottom: 6px;
  5970. }
  5971. .bottom-7px {
  5972. bottom: 7px;
  5973. }
  5974. .bottom-8px {
  5975. bottom: 8px;
  5976. }
  5977. .bottom-9px {
  5978. bottom: 9px;
  5979. }
  5980. .bottom-10px {
  5981. bottom: 10px;
  5982. }
  5983. .bottom-11px {
  5984. bottom: 11px;
  5985. }
  5986. .bottom-12px {
  5987. bottom: 12px;
  5988. }
  5989. .bottom-13px {
  5990. bottom: 13px;
  5991. }
  5992. .bottom-14px {
  5993. bottom: 14px;
  5994. }
  5995. .bottom-15px {
  5996. bottom: 15px;
  5997. }
  5998. .bottom-16px {
  5999. bottom: 16px;
  6000. }
  6001. .bottom-17px {
  6002. bottom: 17px;
  6003. }
  6004. .bottom-18px {
  6005. bottom: 18px;
  6006. }
  6007. .bottom-19px {
  6008. bottom: 19px;
  6009. }
  6010. .bottom-20px {
  6011. bottom: 20px;
  6012. }
  6013. .bottom-21px {
  6014. bottom: 21px;
  6015. }
  6016. .bottom-22px {
  6017. bottom: 22px;
  6018. }
  6019. .bottom-23px {
  6020. bottom: 23px;
  6021. }
  6022. .bottom-24px {
  6023. bottom: 24px;
  6024. }
  6025. .bottom-25px {
  6026. bottom: 25px;
  6027. }
  6028. .bottom-26px {
  6029. bottom: 26px;
  6030. }
  6031. .bottom-27px {
  6032. bottom: 27px;
  6033. }
  6034. .bottom-28px {
  6035. bottom: 28px;
  6036. }
  6037. .bottom-29px {
  6038. bottom: 29px;
  6039. }
  6040. .bottom-30px {
  6041. bottom: 30px;
  6042. }
  6043. .bottom-40px {
  6044. bottom: 40px;
  6045. }
  6046. .bottom-50px {
  6047. bottom: 50px;
  6048. }
  6049. .bottom-60px {
  6050. bottom: 60px;
  6051. }
  6052. .bottom-70px {
  6053. bottom: 70px;
  6054. }
  6055. .bottom-80px {
  6056. bottom: 80px;
  6057. }
  6058. .bottom-90px {
  6059. bottom: 90px;
  6060. }
  6061. .bottom-100px {
  6062. bottom: 100px;
  6063. }
  6064. .bottom-110px {
  6065. bottom: 110px;
  6066. }
  6067. .bottom-120px {
  6068. bottom: 120px;
  6069. }
  6070. .bottom-130px {
  6071. bottom: 130px;
  6072. }
  6073. .bottom-140px {
  6074. bottom: 140px;
  6075. }
  6076. .bottom-150px {
  6077. bottom: 150px;
  6078. }
  6079. .left-0px {
  6080. left: 0px;
  6081. }
  6082. .left-1px {
  6083. left: 1px;
  6084. }
  6085. .left-2px {
  6086. left: 2px;
  6087. }
  6088. .left-3px {
  6089. left: 3px;
  6090. }
  6091. .left-4px {
  6092. left: 4px;
  6093. }
  6094. .left-5px {
  6095. left: 5px;
  6096. }
  6097. .left-6px {
  6098. left: 6px;
  6099. }
  6100. .left-7px {
  6101. left: 7px;
  6102. }
  6103. .left-8px {
  6104. left: 8px;
  6105. }
  6106. .left-9px {
  6107. left: 9px;
  6108. }
  6109. .left-10px {
  6110. left: 10px;
  6111. }
  6112. .left-11px {
  6113. left: 11px;
  6114. }
  6115. .left-12px {
  6116. left: 12px;
  6117. }
  6118. .left-13px {
  6119. left: 13px;
  6120. }
  6121. .left-14px {
  6122. left: 14px;
  6123. }
  6124. .left-15px {
  6125. left: 15px;
  6126. }
  6127. .left-16px {
  6128. left: 16px;
  6129. }
  6130. .left-17px {
  6131. left: 17px;
  6132. }
  6133. .left-18px {
  6134. left: 18px;
  6135. }
  6136. .left-19px {
  6137. left: 19px;
  6138. }
  6139. .left-20px {
  6140. left: 20px;
  6141. }
  6142. .left-21px {
  6143. left: 21px;
  6144. }
  6145. .left-22px {
  6146. left: 22px;
  6147. }
  6148. .left-23px {
  6149. left: 23px;
  6150. }
  6151. .left-24px {
  6152. left: 24px;
  6153. }
  6154. .left-25px {
  6155. left: 25px;
  6156. }
  6157. .left-26px {
  6158. left: 26px;
  6159. }
  6160. .left-27px {
  6161. left: 27px;
  6162. }
  6163. .left-28px {
  6164. left: 28px;
  6165. }
  6166. .left-29px {
  6167. left: 29px;
  6168. }
  6169. .left-30px {
  6170. left: 30px;
  6171. }
  6172. .left-40px {
  6173. left: 40px;
  6174. }
  6175. .left-50px {
  6176. left: 50px;
  6177. }
  6178. .left-60px {
  6179. left: 60px;
  6180. }
  6181. .left-70px {
  6182. left: 70px;
  6183. }
  6184. .left-80px {
  6185. left: 80px;
  6186. }
  6187. .left-90px {
  6188. left: 90px;
  6189. }
  6190. .left-100px {
  6191. left: 100px;
  6192. }
  6193. .left-110px {
  6194. left: 110px;
  6195. }
  6196. .left-120px {
  6197. left: 120px;
  6198. }
  6199. .left-130px {
  6200. left: 130px;
  6201. }
  6202. .left-140px {
  6203. left: 140px;
  6204. }
  6205. .left-150px {
  6206. left: 150px;
  6207. }
  6208. .top-minus-0px {
  6209. top: -0px;
  6210. }
  6211. .top-minus-1px {
  6212. top: -1px;
  6213. }
  6214. .top-minus-2px {
  6215. top: -2px;
  6216. }
  6217. .top-minus-3px {
  6218. top: -3px;
  6219. }
  6220. .top-minus-4px {
  6221. top: -4px;
  6222. }
  6223. .top-minus-5px {
  6224. top: -5px;
  6225. }
  6226. .top-minus-6px {
  6227. top: -6px;
  6228. }
  6229. .top-minus-7px {
  6230. top: -7px;
  6231. }
  6232. .top-minus-8px {
  6233. top: -8px;
  6234. }
  6235. .top-minus-9px {
  6236. top: -9px;
  6237. }
  6238. .top-minus-10px {
  6239. top: -10px;
  6240. }
  6241. .top-minus-11px {
  6242. top: -11px;
  6243. }
  6244. .top-minus-12px {
  6245. top: -12px;
  6246. }
  6247. .top-minus-13px {
  6248. top: -13px;
  6249. }
  6250. .top-minus-14px {
  6251. top: -14px;
  6252. }
  6253. .top-minus-15px {
  6254. top: -15px;
  6255. }
  6256. .top-minus-16px {
  6257. top: -16px;
  6258. }
  6259. .top-minus-17px {
  6260. top: -17px;
  6261. }
  6262. .top-minus-18px {
  6263. top: -18px;
  6264. }
  6265. .top-minus-19px {
  6266. top: -19px;
  6267. }
  6268. .top-minus-20px {
  6269. top: -20px;
  6270. }
  6271. .top-minus-21px {
  6272. top: -21px;
  6273. }
  6274. .top-minus-22px {
  6275. top: -22px;
  6276. }
  6277. .top-minus-23px {
  6278. top: -23px;
  6279. }
  6280. .top-minus-24px {
  6281. top: -24px;
  6282. }
  6283. .top-minus-25px {
  6284. top: -25px;
  6285. }
  6286. .top-minus-26px {
  6287. top: -26px;
  6288. }
  6289. .top-minus-27px {
  6290. top: -27px;
  6291. }
  6292. .top-minus-28px {
  6293. top: -28px;
  6294. }
  6295. .top-minus-29px {
  6296. top: -29px;
  6297. }
  6298. .top-minus-30px {
  6299. top: -30px;
  6300. }
  6301. .top-minus-40px {
  6302. top: -40px;
  6303. }
  6304. .top-minus-50px {
  6305. top: -50px;
  6306. }
  6307. .top-minus-60px {
  6308. top: -60px;
  6309. }
  6310. .top-minus-70px {
  6311. top: -70px;
  6312. }
  6313. .top-minus-80px {
  6314. top: -80px;
  6315. }
  6316. .top-minus-90px {
  6317. top: -90px;
  6318. }
  6319. .top-minus-100px {
  6320. top: -100px;
  6321. }
  6322. .top-minus-110px {
  6323. top: -110px;
  6324. }
  6325. .top-minus-120px {
  6326. top: -120px;
  6327. }
  6328. .top-minus-130px {
  6329. top: -130px;
  6330. }
  6331. .top-minus-140px {
  6332. top: -140px;
  6333. }
  6334. .top-minus-150px {
  6335. top: -150px;
  6336. }
  6337. .right-minus-0px {
  6338. right: -0px;
  6339. }
  6340. .right-minus-1px {
  6341. right: -1px;
  6342. }
  6343. .right-minus-2px {
  6344. right: -2px;
  6345. }
  6346. .right-minus-3px {
  6347. right: -3px;
  6348. }
  6349. .right-minus-4px {
  6350. right: -4px;
  6351. }
  6352. .right-minus-5px {
  6353. right: -5px;
  6354. }
  6355. .right-minus-6px {
  6356. right: -6px;
  6357. }
  6358. .right-minus-7px {
  6359. right: -7px;
  6360. }
  6361. .right-minus-8px {
  6362. right: -8px;
  6363. }
  6364. .right-minus-9px {
  6365. right: -9px;
  6366. }
  6367. .right-minus-10px {
  6368. right: -10px;
  6369. }
  6370. .right-minus-11px {
  6371. right: -11px;
  6372. }
  6373. .right-minus-12px {
  6374. right: -12px;
  6375. }
  6376. .right-minus-13px {
  6377. right: -13px;
  6378. }
  6379. .right-minus-14px {
  6380. right: -14px;
  6381. }
  6382. .right-minus-15px {
  6383. right: -15px;
  6384. }
  6385. .right-minus-16px {
  6386. right: -16px;
  6387. }
  6388. .right-minus-17px {
  6389. right: -17px;
  6390. }
  6391. .right-minus-18px {
  6392. right: -18px;
  6393. }
  6394. .right-minus-19px {
  6395. right: -19px;
  6396. }
  6397. .right-minus-20px {
  6398. right: -20px;
  6399. }
  6400. .right-minus-21px {
  6401. right: -21px;
  6402. }
  6403. .right-minus-22px {
  6404. right: -22px;
  6405. }
  6406. .right-minus-23px {
  6407. right: -23px;
  6408. }
  6409. .right-minus-24px {
  6410. right: -24px;
  6411. }
  6412. .right-minus-25px {
  6413. right: -25px;
  6414. }
  6415. .right-minus-26px {
  6416. right: -26px;
  6417. }
  6418. .right-minus-27px {
  6419. right: -27px;
  6420. }
  6421. .right-minus-28px {
  6422. right: -28px;
  6423. }
  6424. .right-minus-29px {
  6425. right: -29px;
  6426. }
  6427. .right-minus-30px {
  6428. right: -30px;
  6429. }
  6430. .right-minus-40px {
  6431. right: -40px;
  6432. }
  6433. .right-minus-50px {
  6434. right: -50px;
  6435. }
  6436. .right-minus-60px {
  6437. right: -60px;
  6438. }
  6439. .right-minus-70px {
  6440. right: -70px;
  6441. }
  6442. .right-minus-80px {
  6443. right: -80px;
  6444. }
  6445. .right-minus-90px {
  6446. right: -90px;
  6447. }
  6448. .right-minus-100px {
  6449. right: -100px;
  6450. }
  6451. .right-minus-110px {
  6452. right: -110px;
  6453. }
  6454. .right-minus-120px {
  6455. right: -120px;
  6456. }
  6457. .right-minus-130px {
  6458. right: -130px;
  6459. }
  6460. .right-minus-140px {
  6461. right: -140px;
  6462. }
  6463. .right-minus-150px {
  6464. right: -150px;
  6465. }
  6466. .bottom-minus-0px {
  6467. bottom: -0px;
  6468. }
  6469. .bottom-minus-1px {
  6470. bottom: -1px;
  6471. }
  6472. .bottom-minus-2px {
  6473. bottom: -2px;
  6474. }
  6475. .bottom-minus-3px {
  6476. bottom: -3px;
  6477. }
  6478. .bottom-minus-4px {
  6479. bottom: -4px;
  6480. }
  6481. .bottom-minus-5px {
  6482. bottom: -5px;
  6483. }
  6484. .bottom-minus-6px {
  6485. bottom: -6px;
  6486. }
  6487. .bottom-minus-7px {
  6488. bottom: -7px;
  6489. }
  6490. .bottom-minus-8px {
  6491. bottom: -8px;
  6492. }
  6493. .bottom-minus-9px {
  6494. bottom: -9px;
  6495. }
  6496. .bottom-minus-10px {
  6497. bottom: -10px;
  6498. }
  6499. .bottom-minus-11px {
  6500. bottom: -11px;
  6501. }
  6502. .bottom-minus-12px {
  6503. bottom: -12px;
  6504. }
  6505. .bottom-minus-13px {
  6506. bottom: -13px;
  6507. }
  6508. .bottom-minus-14px {
  6509. bottom: -14px;
  6510. }
  6511. .bottom-minus-15px {
  6512. bottom: -15px;
  6513. }
  6514. .bottom-minus-16px {
  6515. bottom: -16px;
  6516. }
  6517. .bottom-minus-17px {
  6518. bottom: -17px;
  6519. }
  6520. .bottom-minus-18px {
  6521. bottom: -18px;
  6522. }
  6523. .bottom-minus-19px {
  6524. bottom: -19px;
  6525. }
  6526. .bottom-minus-20px {
  6527. bottom: -20px;
  6528. }
  6529. .bottom-minus-21px {
  6530. bottom: -21px;
  6531. }
  6532. .bottom-minus-22px {
  6533. bottom: -22px;
  6534. }
  6535. .bottom-minus-23px {
  6536. bottom: -23px;
  6537. }
  6538. .bottom-minus-24px {
  6539. bottom: -24px;
  6540. }
  6541. .bottom-minus-25px {
  6542. bottom: -25px;
  6543. }
  6544. .bottom-minus-26px {
  6545. bottom: -26px;
  6546. }
  6547. .bottom-minus-27px {
  6548. bottom: -27px;
  6549. }
  6550. .bottom-minus-28px {
  6551. bottom: -28px;
  6552. }
  6553. .bottom-minus-29px {
  6554. bottom: -29px;
  6555. }
  6556. .bottom-minus-30px {
  6557. bottom: -30px;
  6558. }
  6559. .bottom-minus-40px {
  6560. bottom: -40px;
  6561. }
  6562. .bottom-minus-50px {
  6563. bottom: -50px;
  6564. }
  6565. .bottom-minus-60px {
  6566. bottom: -60px;
  6567. }
  6568. .bottom-minus-70px {
  6569. bottom: -70px;
  6570. }
  6571. .bottom-minus-80px {
  6572. bottom: -80px;
  6573. }
  6574. .bottom-minus-90px {
  6575. bottom: -90px;
  6576. }
  6577. .bottom-minus-100px {
  6578. bottom: -100px;
  6579. }
  6580. .bottom-minus-110px {
  6581. bottom: -110px;
  6582. }
  6583. .bottom-minus-120px {
  6584. bottom: -120px;
  6585. }
  6586. .bottom-minus-130px {
  6587. bottom: -130px;
  6588. }
  6589. .bottom-minus-140px {
  6590. bottom: -140px;
  6591. }
  6592. .bottom-minus-150px {
  6593. bottom: -150px;
  6594. }
  6595. .left-minus-0px {
  6596. left: -0px;
  6597. }
  6598. .left-minus-1px {
  6599. left: -1px;
  6600. }
  6601. .left-minus-2px {
  6602. left: -2px;
  6603. }
  6604. .left-minus-3px {
  6605. left: -3px;
  6606. }
  6607. .left-minus-4px {
  6608. left: -4px;
  6609. }
  6610. .left-minus-5px {
  6611. left: -5px;
  6612. }
  6613. .left-minus-6px {
  6614. left: -6px;
  6615. }
  6616. .left-minus-7px {
  6617. left: -7px;
  6618. }
  6619. .left-minus-8px {
  6620. left: -8px;
  6621. }
  6622. .left-minus-9px {
  6623. left: -9px;
  6624. }
  6625. .left-minus-10px {
  6626. left: -10px;
  6627. }
  6628. .left-minus-11px {
  6629. left: -11px;
  6630. }
  6631. .left-minus-12px {
  6632. left: -12px;
  6633. }
  6634. .left-minus-13px {
  6635. left: -13px;
  6636. }
  6637. .left-minus-14px {
  6638. left: -14px;
  6639. }
  6640. .left-minus-15px {
  6641. left: -15px;
  6642. }
  6643. .left-minus-16px {
  6644. left: -16px;
  6645. }
  6646. .left-minus-17px {
  6647. left: -17px;
  6648. }
  6649. .left-minus-18px {
  6650. left: -18px;
  6651. }
  6652. .left-minus-19px {
  6653. left: -19px;
  6654. }
  6655. .left-minus-20px {
  6656. left: -20px;
  6657. }
  6658. .left-minus-21px {
  6659. left: -21px;
  6660. }
  6661. .left-minus-22px {
  6662. left: -22px;
  6663. }
  6664. .left-minus-23px {
  6665. left: -23px;
  6666. }
  6667. .left-minus-24px {
  6668. left: -24px;
  6669. }
  6670. .left-minus-25px {
  6671. left: -25px;
  6672. }
  6673. .left-minus-26px {
  6674. left: -26px;
  6675. }
  6676. .left-minus-27px {
  6677. left: -27px;
  6678. }
  6679. .left-minus-28px {
  6680. left: -28px;
  6681. }
  6682. .left-minus-29px {
  6683. left: -29px;
  6684. }
  6685. .left-minus-30px {
  6686. left: -30px;
  6687. }
  6688. .left-minus-40px {
  6689. left: -40px;
  6690. }
  6691. .left-minus-50px {
  6692. left: -50px;
  6693. }
  6694. .left-minus-60px {
  6695. left: -60px;
  6696. }
  6697. .left-minus-70px {
  6698. left: -70px;
  6699. }
  6700. .left-minus-80px {
  6701. left: -80px;
  6702. }
  6703. .left-minus-90px {
  6704. left: -90px;
  6705. }
  6706. .left-minus-100px {
  6707. left: -100px;
  6708. }
  6709. .left-minus-110px {
  6710. left: -110px;
  6711. }
  6712. .left-minus-120px {
  6713. left: -120px;
  6714. }
  6715. .left-minus-130px {
  6716. left: -130px;
  6717. }
  6718. .left-minus-140px {
  6719. left: -140px;
  6720. }
  6721. .left-minus-150px {
  6722. left: -150px;
  6723. }
  6724. /* Font weight */
  6725. .fw-100 {
  6726. font-weight: 100 !important;
  6727. }
  6728. .fw-200 {
  6729. font-weight: 200 !important;
  6730. }
  6731. .fw-300 {
  6732. font-weight: 300 !important;
  6733. }
  6734. .fw-400 {
  6735. font-weight: 400 !important;
  6736. }
  6737. .fw-500 {
  6738. font-weight: 500 !important;
  6739. }
  6740. .fw-600 {
  6741. font-weight: 600 !important;
  6742. }
  6743. .fw-700 {
  6744. font-weight: 700 !important;
  6745. }
  6746. .fw-800 {
  6747. font-weight: 800 !important;
  6748. }
  6749. .fw-900 {
  6750. font-weight: 900 !important;
  6751. }
  6752. /* Min height */
  6753. .min-h-100px {
  6754. min-height: 100px !important;
  6755. }
  6756. .min-h-150px {
  6757. min-height: 150px !important;
  6758. }
  6759. .min-h-200px {
  6760. min-height: 200px !important;
  6761. }
  6762. .min-h-250px {
  6763. min-height: 250px !important;
  6764. }
  6765. .min-h-300px {
  6766. min-height: 300px !important;
  6767. }
  6768. .min-h-350px {
  6769. min-height: 350px !important;
  6770. }
  6771. .min-h-400px {
  6772. min-height: 400px !important;
  6773. }
  6774. .min-h-450px {
  6775. min-height: 450px !important;
  6776. }
  6777. .min-h-500px {
  6778. min-height: 500px !important;
  6779. }
  6780. .min-h-550px {
  6781. min-height: 550px !important;
  6782. }
  6783. .min-h-600px {
  6784. min-height: 600px !important;
  6785. }
  6786. .min-h-650px {
  6787. min-height: 650px !important;
  6788. }
  6789. .min-h-700px {
  6790. min-height: 700px !important;
  6791. }
  6792. .min-h-750px {
  6793. min-height: 750px !important;
  6794. }
  6795. .min-h-800px {
  6796. min-height: 800px !important;
  6797. }
  6798. .min-h-850px {
  6799. min-height: 850px !important;
  6800. }
  6801. .min-h-900px {
  6802. min-height: 900px !important;
  6803. }
  6804. .min-h-950px {
  6805. min-height: 950px !important;
  6806. }
  6807. /* Opacity */
  6808. .opacity-0 {
  6809. opacity: .0;
  6810. }
  6811. .opacity-1 {
  6812. opacity: .1;
  6813. }
  6814. .opacity-2 {
  6815. opacity: .2;
  6816. }
  6817. .opacity-3 {
  6818. opacity: .3;
  6819. }
  6820. .opacity-4 {
  6821. opacity: .4;
  6822. }
  6823. .opacity-5 {
  6824. opacity: .5;
  6825. }
  6826. .opacity-6 {
  6827. opacity: .6;
  6828. }
  6829. .opacity-7 {
  6830. opacity: .7;
  6831. }
  6832. .opacity-8 {
  6833. opacity: .8;
  6834. }
  6835. .opacity-9 {
  6836. opacity: .9;
  6837. }
  6838. /* Z-index */
  6839. .z-index-0 {
  6840. z-index: 0;
  6841. }
  6842. .z-index-1 {
  6843. z-index: 1;
  6844. }
  6845. .z-index-2 {
  6846. z-index: 2;
  6847. }
  6848. .z-index-3 {
  6849. z-index: 3;
  6850. }
  6851. .z-index-4 {
  6852. z-index: 4;
  6853. }
  6854. .z-index-5 {
  6855. z-index: 5;
  6856. }
  6857. .z-index-6 {
  6858. z-index: 6;
  6859. }
  6860. .z-index-7 {
  6861. z-index: 7;
  6862. }
  6863. .z-index-8 {
  6864. z-index: 8;
  6865. }
  6866. .z-index-9 {
  6867. z-index: 9;
  6868. }
  6869. .z-index-minus-1 {
  6870. z-index: -1;
  6871. }
  6872. .z-index-minus-2 {
  6873. z-index: -2;
  6874. }
  6875. /* ===================================
  6876. 10. Header
  6877. ====================================== */
  6878. header .header-top-bar [class*=col-] {
  6879. display: -webkit-box;
  6880. display: -ms-flexbox;
  6881. display: flex;
  6882. -ms-flex-item-align: stretch;
  6883. -ms-grid-row-align: stretch;
  6884. align-self: stretch;
  6885. -webkit-box-align: center;
  6886. -ms-flex-align: center;
  6887. align-items: center;
  6888. }
  6889. header .header-top-bar [class*=col-].text-end {
  6890. justify-content: flex-end !important;
  6891. }
  6892. header .header-top-bar [class*=col-] .header-icon {
  6893. -ms-flex-item-align: stretch;
  6894. -ms-grid-row-align: stretch;
  6895. align-self: stretch;
  6896. }
  6897. header .navbar {
  6898. position: fixed;
  6899. top: 0;
  6900. right: 0;
  6901. left: 0;
  6902. z-index: 99;
  6903. }
  6904. header .navbar [class*=col-] {
  6905. padding: 0 15px;
  6906. display: -webkit-box;
  6907. display: -ms-flexbox;
  6908. display: flex;
  6909. -ms-flex-item-align: stretch;
  6910. -ms-grid-row-align: stretch;
  6911. align-self: stretch;
  6912. }
  6913. header .navbar [class*=col-].text-end {
  6914. justify-content: flex-end !important;
  6915. }
  6916. header .navbar [class*=col-] .navbar-nav {
  6917. -ms-flex-item-align: stretch;
  6918. -ms-grid-row-align: stretch;
  6919. align-self: stretch;
  6920. -webkit-box-align: center;
  6921. -ms-flex-align: center;
  6922. align-items: center;
  6923. }
  6924. header .navbar [class*=col-] .navbar-nav .nav-item {
  6925. display: -webkit-box;
  6926. display: -ms-flexbox;
  6927. display: flex;
  6928. -ms-flex-item-align: stretch;
  6929. -ms-grid-row-align: stretch;
  6930. align-self: stretch;
  6931. -webkit-box-align: center;
  6932. -ms-flex-align: center;
  6933. align-items: center;
  6934. }
  6935. header .navbar [class*=col-] .navbar-nav .nav-item a {
  6936. display: -webkit-box;
  6937. display: -ms-flexbox;
  6938. display: flex;
  6939. -ms-flex-item-align: stretch;
  6940. -ms-grid-row-align: stretch;
  6941. align-self: stretch;
  6942. -webkit-box-align: center;
  6943. -ms-flex-align: center;
  6944. align-items: center;
  6945. }
  6946. header .container-fluid {
  6947. padding-left: 45px;
  6948. padding-right: 45px;
  6949. }
  6950. header.sticky .navbar-brand {
  6951. padding: 20px 0;
  6952. }
  6953. header.sticky .navbar {
  6954. -webkit-transform: translateY(-100%);
  6955. transform: translateY(-100%);
  6956. }
  6957. header.sticky .navbar.sticky-header {
  6958. -webkit-transform: translateY(0);
  6959. transform: translateY(0);
  6960. }
  6961. header.sticky .navbar.fixed-header {
  6962. -webkit-transform: translateY(0);
  6963. transform: translateY(0);
  6964. }
  6965. header.sticky .header-light:not(.disable-fixed) {
  6966. box-shadow: 0px 10px 35px 0px rgba(0, 0, 0, 0.1);
  6967. }
  6968. header.sticky.sticky-appear .header-reverse-back-scroll {
  6969. -webkit-transform: translateY(0);
  6970. transform: translateY(0);
  6971. }
  6972. header.sticky.sticky-appear .header-reverse-back-scroll.glass-effect {
  6973. -webkit-backdrop-filter: blur(5px);
  6974. backdrop-filter: blur(5px);
  6975. background-color: rgba(255, 255, 255, 0.85) !important;
  6976. }
  6977. header.sticky.sticky-appear .header-reverse-back-scroll.header-dark.glass-effect {
  6978. background-color: rgba(35, 35, 35, 0.7) !important;
  6979. }
  6980. header.sticky.sticky-active .header-reverse {
  6981. -webkit-transform: translateY(0);
  6982. transform: translateY(0);
  6983. border-color: transparent !important;
  6984. }
  6985. header.sticky.sticky-active .header-reverse.glass-effect {
  6986. -webkit-backdrop-filter: blur(5px);
  6987. backdrop-filter: blur(5px);
  6988. background-color: rgba(255, 255, 255, 0.85) !important;
  6989. }
  6990. header.sticky.sticky-active .header-reverse.header-dark.glass-effect {
  6991. background-color: rgba(35, 35, 35, 0.7) !important;
  6992. }
  6993. header.sticky.sticky-active .navbar-brand .alt-logo {
  6994. visibility: visible;
  6995. opacity: 1;
  6996. width: auto;
  6997. }
  6998. header.sticky.sticky-active .navbar-brand .default-logo {
  6999. visibility: hidden;
  7000. opacity: 0;
  7001. width: 0;
  7002. }
  7003. header.sticky.sticky-active [data-header-hover=dark] {
  7004. background-color: var(--dark-gray) !important;
  7005. }
  7006. header.sticky.sticky-active [data-header-hover=dark] .navbar-nav .nav-item:hover .nav-link {
  7007. color: var(--white);
  7008. opacity: 0.6;
  7009. }
  7010. header.sticky.sticky-active [data-header-hover=dark] .navbar-nav .nav-link {
  7011. color: var(--white);
  7012. }
  7013. header.sticky.sticky-active [data-header-hover=dark] .icon > a {
  7014. color: var(--white);
  7015. }
  7016. header.sticky.sticky-active [data-header-hover=dark] .icon > a:hover {
  7017. color: var(--white);
  7018. opacity: 0.6;
  7019. }
  7020. header.sticky.sticky-active [data-header-hover=dark] .icon .push-button span {
  7021. background-color: var(--white);
  7022. }
  7023. header.sticky.sticky-active [data-header-hover=dark] .icon .header-language > a, header.sticky.sticky-active [data-header-hover=dark] .icon .header-cart > a {
  7024. color: var(--white);
  7025. }
  7026. header.sticky.sticky-active [data-header-hover=dark] .icon .header-language > a:hover, header.sticky.sticky-active [data-header-hover=dark] .icon .header-cart > a:hover {
  7027. color: var(--white);
  7028. }
  7029. header.sticky.sticky-active [data-header-hover=dark] .header-search-style i {
  7030. color: var(--white);
  7031. }
  7032. header.sticky.sticky-active [data-header-hover=dark] .header-language-icon .header-language .language-dropdown {
  7033. background-color: var(--dark-gray);
  7034. }
  7035. header.sticky.sticky-active [data-header-hover=dark] .header-language-icon .header-language .language-dropdown a {
  7036. color: var(--light-gray);
  7037. }
  7038. header.sticky.sticky-active [data-header-hover=dark] .header-language-icon .header-language .language-dropdown a:hover {
  7039. color: var(--white);
  7040. opacity: 1;
  7041. }
  7042. header.sticky.sticky-active [data-header-hover=light] {
  7043. background-color: var(--white) !important;
  7044. box-shadow: 0px 0px 50px 0px rgba(0, 0, 0, 0.1);
  7045. }
  7046. header.sticky.sticky-active [data-header-hover=light] .navbar-nav .nav-link {
  7047. color: var(--dark-gray);
  7048. }
  7049. header.sticky.sticky-active [data-header-hover=light] .icon > a {
  7050. color: var(--dark-gray);
  7051. }
  7052. header.sticky.sticky-active [data-header-hover=light] .icon > a:hover {
  7053. color: var(--medium-gray);
  7054. opacity: 1;
  7055. }
  7056. header.sticky.sticky-active [data-header-hover=light] .icon .push-button span {
  7057. background-color: var(--dark-gray);
  7058. }
  7059. header.sticky.sticky-active [data-header-hover=light] .icon .header-language > a, header.sticky.sticky-active [data-header-hover=light] .icon .header-cart > a {
  7060. color: var(--dark-gray);
  7061. }
  7062. header.sticky.sticky-active [data-header-hover=light] .icon .header-language > a:hover, header.sticky.sticky-active [data-header-hover=light] .icon .header-cart > a:hover {
  7063. color: var(--medium-gray);
  7064. opacity: 1;
  7065. }
  7066. header.sticky.sticky-active [data-header-hover=light] .header-search-style i {
  7067. color: var(--dark-gray);
  7068. }
  7069. header.sticky.sticky-active [data-header-hover=light] .header-language-icon .language-dropdown li a {
  7070. color: var(--medium-gray);
  7071. }
  7072. header.sticky.sticky-active [data-header-hover=light] .header-language-icon .language-dropdown li a:hover {
  7073. color: var(--dark-gray);
  7074. opacity: 1;
  7075. }
  7076. header.sticky.sticky-active [data-header-hover=light] .widget-text {
  7077. color: var(--dark-gray);
  7078. }
  7079. header.sticky.sticky-active [data-header-hover=light] .widget-text a {
  7080. color: var(--dark-gray);
  7081. }
  7082. header.sticky.sticky-active [data-header-hover=light].disable-fixed.header-demo {
  7083. background-color: transparent !important;
  7084. }
  7085. header.sticky .header-icon .push-button {
  7086. padding: 0;
  7087. }
  7088. header.sticky .center-logo .navbar-nav .nav-link {
  7089. padding: 26px 20px;
  7090. }
  7091. header.sticky .top-logo .navbar-brand {
  7092. padding: 15px 0;
  7093. }
  7094. header.sticky .top-logo.fixed-header .navbar-brand, header.sticky .top-logo.disable-fixed .navbar-brand {
  7095. padding: 22px 0;
  7096. }
  7097. header.sticky .top-logo.responsive-sticky .navbar-nav .nav-link {
  7098. padding-top: 18px !important;
  7099. padding-bottom: 18px !important;
  7100. }
  7101. header.sticky .top-logo.responsive-sticky .header-icon .header-cart-icon .header-cart a i {
  7102. padding-top: 22px;
  7103. padding-bottom: 22px;
  7104. }
  7105. header.sticky .top-logo.responsive-sticky .header-icon .header-language-icon .header-cart > a i {
  7106. padding-top: 22px;
  7107. padding-bottom: 22px;
  7108. }
  7109. header.sticky .mini-header .header-icon .header-language a i {
  7110. padding-top: 16px;
  7111. padding-bottom: 16px;
  7112. }
  7113. header.sticky .mini-header .header-icon .header-cart-icon .header-cart a i {
  7114. padding-top: 16px;
  7115. padding-bottom: 16px;
  7116. }
  7117. header.sticky .fixed-header .navbar-brand, header.sticky .disable-fixed .navbar-brand {
  7118. padding: 30px 0;
  7119. }
  7120. header .navbar {
  7121. -webkit-transition: 0.3s;
  7122. transition: 0.3s;
  7123. }
  7124. header .navbar.mini-header .navbar-brand {
  7125. padding: 20px 0;
  7126. }
  7127. header .navbar.mini-header .navbar-brand img {
  7128. max-height: 22px;
  7129. }
  7130. header .navbar-brand {
  7131. margin-right: 0;
  7132. vertical-align: middle;
  7133. padding: 30px 0;
  7134. display: inline-block;
  7135. font-size: 0;
  7136. }
  7137. header .navbar-brand .default-logo {
  7138. visibility: visible;
  7139. opacity: 1;
  7140. width: auto;
  7141. }
  7142. header .navbar-brand .alt-logo, header .navbar-brand .mobile-logo {
  7143. visibility: hidden;
  7144. opacity: 0;
  7145. width: 0;
  7146. }
  7147. header .navbar-brand img {
  7148. max-height: 46px;
  7149. }
  7150. header .header-top-bar {
  7151. position: fixed;
  7152. top: 0;
  7153. right: 0;
  7154. width: 100%;
  7155. left: 0;
  7156. z-index: 100;
  7157. -webkit-transition: 0.3s;
  7158. transition: 0.3s;
  7159. }
  7160. header .header-top-bar + .navbar {
  7161. -webkit-transition: 0.3s;
  7162. transition: 0.3s;
  7163. top: 40px;
  7164. }
  7165. header .header-top-bar + .navbar.disable-fixed {
  7166. top: 0;
  7167. }
  7168. header .header-top-bar .widget {
  7169. display: inline-block;
  7170. }
  7171. header .header-top-bar .widget i {
  7172. padding-right: 5px;
  7173. }
  7174. header .header-top-bar .header-icon .header-social-icon {
  7175. top: 0;
  7176. }
  7177. header .header-top-bar .header-icon .header-social-icon ul {
  7178. list-style: none;
  7179. padding: 0;
  7180. margin: 0;
  7181. }
  7182. header .header-top-bar .header-icon .header-social-icon ul li {
  7183. display: inline-block;
  7184. margin: 0 15px 0 0;
  7185. }
  7186. header .header-top-bar .header-icon .header-social-icon ul li:last-child {
  7187. margin-right: 0;
  7188. }
  7189. header .header-top-bar .header-icon .header-social-icon a {
  7190. font-size: 12px;
  7191. }
  7192. header .header-top-bar .header-icon .header-social-text {
  7193. top: 0;
  7194. }
  7195. header .header-top-bar .header-icon .header-social-text ul {
  7196. list-style: none;
  7197. padding: 0;
  7198. margin: 0;
  7199. }
  7200. header .header-top-bar .header-icon .header-social-text ul li {
  7201. display: inline-block;
  7202. margin: 0 30px 0 0;
  7203. }
  7204. header .header-top-bar .header-icon .header-social-text ul li:last-child {
  7205. margin-right: 0;
  7206. }
  7207. header .left-nav .navbar-nav:before {
  7208. height: 20px;
  7209. width: 1px;
  7210. background-color: var(--medium-gray);
  7211. opacity: 0.5;
  7212. content: "";
  7213. -webkit-transform: translate(-7px, 0px);
  7214. transform: translate(-7px, 0px);
  7215. -webkit-transition: 0.3s;
  7216. transition: 0.3s;
  7217. }
  7218. header .disable-fixed {
  7219. position: absolute;
  7220. }
  7221. header.sticky .responsive-sticky {
  7222. -webkit-transform: translateY(0);
  7223. transform: translateY(0);
  7224. }
  7225. header.sticky .navbar.disable-fixed {
  7226. -webkit-transform: translateY(0);
  7227. transform: translateY(0);
  7228. box-shadow: none;
  7229. }
  7230. /* Navbar */
  7231. .navbar {
  7232. padding: 0;
  7233. }
  7234. .navbar .navbar-nav .nav-item > i {
  7235. display: none;
  7236. }
  7237. .navbar .navbar-nav .nav-item:hover .nav-link, .navbar .navbar-nav .nav-item.active .nav-link {
  7238. opacity: 0.6;
  7239. }
  7240. .navbar .navbar-nav .nav-item .nav-link.active {
  7241. opacity: 0.6;
  7242. }
  7243. .navbar .navbar-nav .nav-link {
  7244. font-size: 16px;
  7245. line-height: 20px;
  7246. padding: 10px 20px;
  7247. position: relative;
  7248. font-weight: 500;
  7249. opacity: 1;
  7250. word-break: normal;
  7251. -webkit-transition: 0.3s;
  7252. transition: 0.3s;
  7253. color: var(--white);
  7254. }
  7255. .navbar .navbar-nav .nav-link .label {
  7256. display: inline-block;
  7257. padding: 1px 11px;
  7258. font-size: 12px;
  7259. margin-left: 8px;
  7260. margin-top: 0px;
  7261. vertical-align: middle;
  7262. }
  7263. .navbar .navbar-nav .dropdown.submenu {
  7264. position: inherit;
  7265. }
  7266. .navbar .navbar-nav .dropdown .dropdown-menu {
  7267. margin: 0;
  7268. padding: 60px 0 65px;
  7269. border: 0;
  7270. top: 100%;
  7271. background-color: var(--white);
  7272. box-shadow: 0 45px 45px 0 rgba(0, 0, 0, 0.05);
  7273. -webkit-animation: hide-animation 0.5s;
  7274. animation: hide-animation 0.5s;
  7275. -webkit-border-radius: 0;
  7276. border-radius: 0;
  7277. }
  7278. .navbar .navbar-nav .dropdown .dropdown-menu li:last-child > a {
  7279. padding-bottom: 0;
  7280. }
  7281. .navbar .navbar-nav .dropdown .dropdown-menu li.active > a {
  7282. color: var(--dark-gray);
  7283. }
  7284. .navbar .navbar-nav .dropdown .dropdown-menu li a:hover {
  7285. padding-left: 3px;
  7286. }
  7287. .navbar .navbar-nav .dropdown .dropdown-menu a {
  7288. color: var(--medium-gray);
  7289. font-size: 15px;
  7290. line-height: 24px;
  7291. font-weight: 400;
  7292. padding-bottom: 10px;
  7293. display: block;
  7294. }
  7295. .navbar .navbar-nav .dropdown .dropdown-menu a:hover {
  7296. color: var(--dark-gray);
  7297. }
  7298. .navbar .navbar-nav .dropdown .dropdown-menu a i {
  7299. width: 25px;
  7300. display: inline-block;
  7301. vertical-align: middle;
  7302. margin-right: 7px;
  7303. text-align: center;
  7304. }
  7305. .navbar .navbar-nav .dropdown .dropdown-menu a .label {
  7306. display: inline-block;
  7307. padding: 5px 10px;
  7308. font-size: 10px;
  7309. line-height: initial;
  7310. margin-left: 8px;
  7311. margin-top: 0px;
  7312. vertical-align: middle;
  7313. font-weight: 700;
  7314. text-transform: uppercase;
  7315. white-space: nowrap;
  7316. }
  7317. .navbar .navbar-nav .dropdown.open .dropdown-menu {
  7318. display: block;
  7319. -webkit-animation: show-animation 0.5s;
  7320. animation: show-animation 0.5s;
  7321. }
  7322. .navbar .navbar-nav .submenu-content {
  7323. width: 100%;
  7324. border-top: 1px solid #e7e7e7 !important;
  7325. left: 0;
  7326. }
  7327. .navbar .navbar-nav .submenu-content ul {
  7328. padding: 0 30px 0 0;
  7329. list-style: none;
  7330. }
  7331. .navbar .navbar-nav .submenu-content ul:nth-child(4n+1) {
  7332. clear: both;
  7333. }
  7334. .navbar .navbar-nav .submenu-content ul .sub-title {
  7335. color: var(--dark-gray);
  7336. font-size: 16px;
  7337. font-weight: 600;
  7338. margin-bottom: 10px;
  7339. }
  7340. .navbar .navbar-nav .submenu-content ul:last-child:before {
  7341. display: none;
  7342. }
  7343. .navbar .navbar-nav .submenu-content .mega-menu {
  7344. width: 1190px;
  7345. }
  7346. .navbar .navbar-nav .simple-dropdown .dropdown-menu {
  7347. display: none;
  7348. width: 245px;
  7349. padding: 35px 0;
  7350. -webkit-border-radius: 0;
  7351. border-radius: 0;
  7352. box-shadow: 0 0 35px 0 rgba(0, 0, 0, 0.1);
  7353. }
  7354. .navbar .navbar-nav .simple-dropdown .dropdown-menu li {
  7355. padding: 0 45px 0 40px;
  7356. }
  7357. .navbar .navbar-nav .simple-dropdown .dropdown-menu li a {
  7358. padding-bottom: 12px;
  7359. }
  7360. .navbar .navbar-nav .simple-dropdown .dropdown-menu .dropdown {
  7361. position: relative;
  7362. }
  7363. .navbar .navbar-nav .simple-dropdown .dropdown-menu .dropdown i {
  7364. position: absolute;
  7365. right: 35px;
  7366. top: 6px;
  7367. width: auto;
  7368. font-size: 13px;
  7369. }
  7370. .navbar .navbar-nav .simple-dropdown .dropdown-menu .dropdown.open > a {
  7371. color: var(--dark-gray);
  7372. }
  7373. .navbar .navbar-nav .simple-dropdown .dropdown-menu .dropdown.open > .dropdown-menu {
  7374. display: block;
  7375. }
  7376. .navbar .navbar-nav .simple-dropdown .dropdown-menu .dropdown.menu-left .dropdown-menu {
  7377. left: calc(-100% - 1px);
  7378. }
  7379. .navbar .navbar-nav .simple-dropdown .dropdown-menu .dropdown .dropdown-menu {
  7380. -webkit-animation: none;
  7381. animation: none;
  7382. }
  7383. .navbar .navbar-nav .simple-dropdown .dropdown-menu .dropdown-menu {
  7384. display: none;
  7385. position: absolute;
  7386. left: calc(100% + 1px);
  7387. top: -35px;
  7388. }
  7389. .navbar .navbar-nav .dropdown.dropdown-with-icon-style02 .dropdown-menu {
  7390. border-radius: 5px;
  7391. padding: 0;
  7392. overflow: hidden;
  7393. width: 260px;
  7394. }
  7395. .navbar .navbar-nav .dropdown.dropdown-with-icon-style02 .dropdown-menu li {
  7396. padding: 0;
  7397. }
  7398. .navbar .navbar-nav .dropdown.dropdown-with-icon-style02 .dropdown-menu li a {
  7399. font-size: 15px;
  7400. line-height: 26px;
  7401. border-bottom: 1px solid rgba(23, 23, 23, 0.1);
  7402. padding: 17px 20px;
  7403. }
  7404. .navbar .navbar-nav .dropdown.dropdown-with-icon-style02 .dropdown-menu li a i {
  7405. font-size: 19px;
  7406. }
  7407. .navbar .navbar-nav .dropdown.dropdown-with-icon-style02 .dropdown-menu li a img {
  7408. width: 35px;
  7409. margin-right: 15px;
  7410. }
  7411. .navbar .navbar-nav .dropdown.dropdown-with-icon-style02 .dropdown-menu li:last-child a {
  7412. border-bottom: 0;
  7413. }
  7414. .navbar .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu {
  7415. box-shadow: 0 0 35px 0 rgba(0, 0, 0, 0.1);
  7416. border-radius: 5px;
  7417. width: 310px;
  7418. padding: 20px 35px;
  7419. }
  7420. .navbar .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li {
  7421. justify-content: center;
  7422. display: flex;
  7423. border-bottom: 0;
  7424. padding: 0;
  7425. }
  7426. .navbar .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li:first-child a {
  7427. border-top: 0;
  7428. }
  7429. .navbar .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li a {
  7430. margin: 0;
  7431. border-top: 1px solid rgba(23, 23, 23, 0.1);
  7432. padding: 15px 30px 15px 0;
  7433. font-size: 16px;
  7434. line-height: 28px;
  7435. font-weight: 500;
  7436. width: 100%;
  7437. position: relative;
  7438. display: -webkit-box;
  7439. display: -ms-flexbox;
  7440. display: flex;
  7441. }
  7442. .navbar .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li a i {
  7443. width: 40px;
  7444. font-size: 36px;
  7445. margin-right: 15px;
  7446. color: var(--base-color);
  7447. flex-shrink: 0;
  7448. text-align: left;
  7449. }
  7450. .navbar .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li a span {
  7451. color: var(--dark-gray);
  7452. font-weight: 600;
  7453. }
  7454. .navbar .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li a p {
  7455. margin: 0;
  7456. font-size: 13px;
  7457. color: var(--medium-gray);
  7458. }
  7459. .navbar .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li a img {
  7460. border-radius: 100%;
  7461. width: 45px;
  7462. margin-right: 15px;
  7463. }
  7464. .navbar .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li a:before {
  7465. content: "\f135";
  7466. color: var(--black);
  7467. font-family: bootstrap-icons;
  7468. font-weight: 400;
  7469. font-size: 23px;
  7470. position: absolute;
  7471. right: 6px;
  7472. opacity: 0;
  7473. -webkit-transition: all 300ms cubic-bezier(0.61, 1, 0.88, 1);
  7474. transition: all 300ms cubic-bezier(0.61, 1, 0.88, 1);
  7475. }
  7476. .navbar .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li a:hover:before {
  7477. right: 0px;
  7478. opacity: 1;
  7479. }
  7480. .navbar .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li a.btn {
  7481. padding: 15px 20px;
  7482. justify-content: center;
  7483. margin-top: 10px;
  7484. line-height: normal;
  7485. border-top: 0;
  7486. font-size: 14px;
  7487. margin-bottom: 5px;
  7488. }
  7489. .navbar .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li a.btn:before {
  7490. display: none;
  7491. }
  7492. /* Header hover submenu dark */
  7493. [data-header-hover=dark] .navbar-nav .dropdown .dropdown-menu li.active > a {
  7494. color: var(--white);
  7495. }
  7496. [data-header-hover=dark] .navbar-nav .dropdown.dropdown-with-icon-style02 .dropdown-menu li a {
  7497. border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  7498. }
  7499. [data-header-hover=dark] .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li a {
  7500. border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  7501. }
  7502. [data-header-hover=dark] .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li a span {
  7503. color: var(--white) !important;
  7504. }
  7505. [data-header-hover=dark] .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li a:before {
  7506. color: var(--white);
  7507. }
  7508. [data-header-hover=dark] .navbar-nav .simple-dropdown .dropdown-menu, [data-header-hover=dark] .navbar-nav .dropdown-with-icon-style02 .dropdown-menu, [data-header-hover=dark] .navbar-nav .dropdown-with-icon .dropdown-menu {
  7509. background-color: var(--dark-gray);
  7510. }
  7511. [data-header-hover=dark] .navbar-nav .simple-dropdown .dropdown-menu a, [data-header-hover=dark] .navbar-nav .dropdown-with-icon-style02 .dropdown-menu a, [data-header-hover=dark] .navbar-nav .dropdown-with-icon .dropdown-menu a {
  7512. color: var(--light-gray);
  7513. }
  7514. [data-header-hover=dark] .navbar-nav .simple-dropdown .dropdown-menu a:hover, [data-header-hover=dark] .navbar-nav .dropdown-with-icon-style02 .dropdown-menu a:hover, [data-header-hover=dark] .navbar-nav .dropdown-with-icon .dropdown-menu a:hover {
  7515. color: var(--white);
  7516. }
  7517. [data-header-hover=dark] .navbar-nav .simple-dropdown .dropdown-menu .dropdown:hover > a, [data-header-hover=dark] .navbar-nav .dropdown-with-icon-style02 .dropdown-menu .dropdown:hover > a, [data-header-hover=dark] .navbar-nav .dropdown-with-icon .dropdown-menu .dropdown:hover > a {
  7518. color: var(--white);
  7519. }
  7520. [data-header-hover=dark] .header-cart-icon .header-cart .cart-item-list {
  7521. background-color: var(--dark-gray);
  7522. }
  7523. [data-header-hover=dark] .header-cart-icon .header-cart .cart-item-list .cart-item {
  7524. border-color: #3e3e3e;
  7525. }
  7526. [data-header-hover=dark] .header-cart-icon .header-cart .cart-item-list .cart-item.cart-total {
  7527. background-color: var(--black);
  7528. }
  7529. [data-header-hover=dark] .header-cart-icon .header-cart .cart-item-list .cart-item.cart-total span {
  7530. color: var(--white);
  7531. }
  7532. [data-header-hover=dark] .header-cart-icon .header-cart .cart-item-list .cart-item .product-detail a {
  7533. color: var(--medium-gray);
  7534. }
  7535. [data-header-hover=dark] .header-cart-icon .header-cart .cart-item-list .cart-item .product-detail a:hover {
  7536. color: var(--white);
  7537. }
  7538. [data-header-hover=dark] .header-cart-icon .header-cart .cart-item-list .cart-item .close {
  7539. color: var(--white);
  7540. }
  7541. [data-header-hover=dark] .header-language-icon .header-language .language-dropdown {
  7542. background-color: var(--dark-gray);
  7543. }
  7544. [data-header-hover=dark] .header-language-icon .header-language .language-dropdown a {
  7545. color: var(--light-gray);
  7546. }
  7547. [data-header-hover=dark] .header-language-icon .header-language .language-dropdown a:hover {
  7548. color: var(--white);
  7549. opacity: 1;
  7550. }
  7551. .submenu-dark {
  7552. background-color: var(--dark-gray) !important;
  7553. }
  7554. .submenu-dark .navbar-brand .alt-logo {
  7555. visibility: visible;
  7556. opacity: 1;
  7557. width: auto;
  7558. }
  7559. .submenu-dark .navbar-brand .default-logo {
  7560. visibility: hidden;
  7561. opacity: 0;
  7562. width: 0;
  7563. }
  7564. .submenu-dark .navbar-nav .dropdown .dropdown-menu {
  7565. background-color: var(--dark-gray);
  7566. }
  7567. .submenu-dark .navbar-nav .dropdown .dropdown-menu a {
  7568. color: var(--light-gray);
  7569. }
  7570. .submenu-dark .navbar-nav .dropdown .dropdown-menu a:hover {
  7571. color: var(--white);
  7572. }
  7573. .submenu-dark .navbar-nav .dropdown .dropdown-menu li.active > a {
  7574. color: var(--white);
  7575. }
  7576. .submenu-dark .navbar-nav .submenu-content {
  7577. border-color: #424242 !important;
  7578. }
  7579. .submenu-dark .navbar-nav .submenu-content ul .sub-title {
  7580. color: var(--white);
  7581. }
  7582. .submenu-dark .navbar-nav .submenu-content ul:before {
  7583. background-color: var(--medium-gray);
  7584. }
  7585. .submenu-dark .navbar-nav .simple-dropdown .dropdown-menu {
  7586. background-color: var(--dark-gray);
  7587. }
  7588. .submenu-dark .navbar-nav .simple-dropdown .dropdown-menu a {
  7589. color: var(--light-gray);
  7590. }
  7591. .submenu-dark .navbar-nav .simple-dropdown .dropdown-menu a:hover {
  7592. color: var(--white);
  7593. }
  7594. .submenu-dark .navbar-nav .simple-dropdown .dropdown-menu .dropdown:hover > a {
  7595. color: var(--white);
  7596. }
  7597. .submenu-dark .header-cart-icon .header-cart .cart-item-list {
  7598. background-color: var(--dark-gray);
  7599. }
  7600. .submenu-dark .header-cart-icon .header-cart .cart-item-list .cart-item {
  7601. border-color: #3e3e3e;
  7602. }
  7603. .submenu-dark .header-cart-icon .header-cart .cart-item-list .cart-item.cart-total {
  7604. background-color: var(--black);
  7605. }
  7606. .submenu-dark .header-cart-icon .header-cart .cart-item-list .cart-item.cart-total span {
  7607. color: var(--white);
  7608. }
  7609. .submenu-dark .header-cart-icon .header-cart .cart-item-list .cart-item .product-detail a {
  7610. color: var(--medium-gray);
  7611. }
  7612. .submenu-dark .header-cart-icon .header-cart .cart-item-list .cart-item .product-detail a:hover {
  7613. color: var(--white);
  7614. }
  7615. .submenu-dark .header-cart-icon .header-cart .cart-item-list .cart-item .close {
  7616. color: var(--white);
  7617. }
  7618. .submenu-dark .header-cart-icon .header-language .language-dropdown {
  7619. background-color: var(--dark-gray);
  7620. }
  7621. .submenu-dark .header-cart-icon .header-language .language-dropdown a {
  7622. color: var(--light-gray);
  7623. }
  7624. .submenu-dark .header-cart-icon .header-language .language-dropdown a:hover {
  7625. color: var(--white);
  7626. opacity: 1;
  7627. }
  7628. /* Header hover submenu light */
  7629. .submenu-light {
  7630. background-color: var(--white) !important;
  7631. }
  7632. .submenu-light .navbar-brand .alt-logo {
  7633. visibility: visible;
  7634. opacity: 1;
  7635. width: auto;
  7636. }
  7637. .submenu-light .navbar-brand .default-logo {
  7638. visibility: hidden;
  7639. opacity: 0;
  7640. width: 0;
  7641. }
  7642. .submenu-light .navbar-nav .nav-link {
  7643. color: var(--dark-gray);
  7644. }
  7645. .submenu-light .header-icon .icon > a {
  7646. color: var(--dark-gray);
  7647. }
  7648. .submenu-light .header-icon .icon > a:hover {
  7649. color: var(--medium-gray);
  7650. }
  7651. .submenu-light .header-icon .icon .push-button span {
  7652. background-color: var(--dark-gray);
  7653. }
  7654. .submenu-light .header-icon .icon .header-language > a, .submenu-light .header-icon .icon .header-cart > a {
  7655. color: var(--dark-gray);
  7656. }
  7657. .submenu-light .header-icon .icon .header-language > a:hover, .submenu-light .header-icon .icon .header-cart > a:hover {
  7658. color: var(--medium-gray);
  7659. }
  7660. .submenu-light .menu-item-list .nav-link {
  7661. color: var(--dark-gray);
  7662. }
  7663. .submenu-light .menu-item-list .nav-link:hover {
  7664. color: var(--dark-gray);
  7665. opacity: 0.6;
  7666. }
  7667. .submenu-light .menu-item-list .sub-menu a {
  7668. color: var(--dark-gray);
  7669. opacity: 0.6;
  7670. }
  7671. .submenu-light .menu-item-list .menu-item .toggle {
  7672. color: var(--dark-gray);
  7673. }
  7674. .submenu-light .widget-text {
  7675. color: var(--dark-gray);
  7676. }
  7677. .submenu-light .widget-text a {
  7678. color: var(--dark-gray);
  7679. }
  7680. /* Header dark */
  7681. .header-dark .navbar-nav .dropdown .dropdown-menu {
  7682. background-color: var(--dark-gray);
  7683. }
  7684. .header-dark .navbar-nav .dropdown .dropdown-menu a {
  7685. color: var(--light-gray);
  7686. }
  7687. .header-dark .navbar-nav .dropdown .dropdown-menu a:hover {
  7688. color: var(--white);
  7689. }
  7690. .header-dark .navbar-nav .dropdown .dropdown-menu li.active > a {
  7691. color: var(--white);
  7692. }
  7693. .header-dark .navbar-nav .dropdown.dropdown-with-icon-style02 .dropdown-menu li a {
  7694. border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  7695. }
  7696. .header-dark .navbar-nav .dropdown.dropdown-with-icon-style02 .dropdown-menu li:last-child a {
  7697. border-bottom: 0;
  7698. }
  7699. .header-dark .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li a {
  7700. border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  7701. }
  7702. .header-dark .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li a span {
  7703. color: var(--white);
  7704. }
  7705. .header-dark .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li a p {
  7706. color: var(--light-gray);
  7707. }
  7708. .header-dark .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li a:before {
  7709. color: var(--white);
  7710. }
  7711. .header-dark .navbar-nav .submenu-content {
  7712. border-color: #424242 !important;
  7713. }
  7714. .header-dark .navbar-nav .submenu-content ul .sub-title {
  7715. color: var(--white);
  7716. }
  7717. .header-dark .navbar-nav .submenu-content ul:before {
  7718. background-color: var(--medium-gray);
  7719. }
  7720. .header-dark .navbar-nav .simple-dropdown .dropdown-menu {
  7721. background-color: var(--dark-gray);
  7722. }
  7723. .header-dark .navbar-nav .simple-dropdown .dropdown-menu a {
  7724. color: var(--light-gray);
  7725. }
  7726. .header-dark .navbar-nav .simple-dropdown .dropdown-menu a:hover {
  7727. color: var(--white);
  7728. }
  7729. .header-dark .navbar-nav .simple-dropdown .dropdown-menu .dropdown.open > a {
  7730. color: var(--white);
  7731. }
  7732. .header-dark .navbar-nav .simple-dropdown .dropdown-menu .dropdown:hover > a {
  7733. color: var(--white);
  7734. }
  7735. .header-dark .header-cart-icon .header-cart .cart-item-list {
  7736. background-color: var(--dark-gray);
  7737. }
  7738. .header-dark .header-cart-icon .header-cart .cart-item-list .cart-item {
  7739. border-color: #3e3e3e;
  7740. }
  7741. .header-dark .header-cart-icon .header-cart .cart-item-list .cart-item.cart-total {
  7742. background-color: var(--black);
  7743. }
  7744. .header-dark .header-cart-icon .header-cart .cart-item-list .cart-item.cart-total span {
  7745. color: var(--white);
  7746. }
  7747. .header-dark .header-cart-icon .header-cart .cart-item-list .cart-item .product-detail a {
  7748. color: var(--medium-gray);
  7749. }
  7750. .header-dark .header-cart-icon .header-cart .cart-item-list .cart-item .product-detail a:hover {
  7751. color: var(--white);
  7752. }
  7753. .header-dark .header-cart-icon .header-cart .cart-item-list .cart-item .close {
  7754. color: var(--white);
  7755. }
  7756. .header-dark .header-language-icon .header-language .language-dropdown {
  7757. background-color: var(--dark-gray);
  7758. }
  7759. .header-dark .header-language-icon .header-language .language-dropdown a {
  7760. color: var(--light-gray);
  7761. }
  7762. .header-dark .header-language-icon .header-language .language-dropdown a:hover {
  7763. color: var(--white);
  7764. opacity: 1;
  7765. }
  7766. /* Header light */
  7767. .header-light .navbar-nav .nav-link {
  7768. color: var(--dark-gray);
  7769. }
  7770. .header-light .header-icon .icon > a {
  7771. color: var(--dark-gray);
  7772. }
  7773. .header-light .header-icon .icon > a:hover {
  7774. color: var(--dark-gray);
  7775. opacity: 0.6;
  7776. }
  7777. .header-light .header-icon .icon .push-button span {
  7778. background-color: var(--dark-gray);
  7779. }
  7780. .header-light .header-icon .icon .header-language > a, .header-light .header-icon .icon .header-cart > a, .header-light .header-icon .icon .header-account > a {
  7781. color: var(--dark-gray);
  7782. }
  7783. .header-light .header-icon .icon .header-language > a:hover, .header-light .header-icon .icon .header-cart > a:hover, .header-light .header-icon .icon .header-account > a:hover {
  7784. color: var(--dark-gray);
  7785. opacity: 0.6;
  7786. }
  7787. .header-light .menu-item-list .nav-link {
  7788. color: var(--dark-gray);
  7789. }
  7790. .header-light .menu-item-list .nav-link:hover {
  7791. color: var(--dark-gray);
  7792. opacity: 0.6;
  7793. }
  7794. .header-light .menu-item-list .sub-menu a {
  7795. color: var(--medium-gray);
  7796. opacity: 1;
  7797. }
  7798. .header-light .menu-item-list .sub-menu a:hover {
  7799. color: var(--dark-gray);
  7800. }
  7801. .header-light .menu-item-list .sub-menu .active > a {
  7802. color: var(--dark-gray);
  7803. }
  7804. .header-light .menu-item-list .menu-item .menu-toggle:before, .header-light .menu-item-list .menu-item .menu-toggle:after {
  7805. background-color: var(--dark-gray);
  7806. }
  7807. .header-light .widget-text {
  7808. color: var(--dark-gray);
  7809. }
  7810. .header-light .widget-text a {
  7811. color: var(--dark-gray);
  7812. }
  7813. /* Header icon */
  7814. .header-icon {
  7815. display: flex;
  7816. align-items: center;
  7817. }
  7818. .header-icon .icon {
  7819. position: relative;
  7820. line-height: 0;
  7821. display: -webkit-box;
  7822. display: -ms-flexbox;
  7823. display: flex;
  7824. -ms-flex-item-align: stretch;
  7825. -ms-grid-row-align: stretch;
  7826. align-self: stretch;
  7827. -webkit-box-align: center;
  7828. -ms-flex-align: center;
  7829. align-items: center;
  7830. }
  7831. .header-icon .icon > a {
  7832. padding-left: 16px;
  7833. font-size: 17px;
  7834. color: var(--white);
  7835. }
  7836. .header-icon .icon > a:hover {
  7837. color: var(--white);
  7838. opacity: 0.6;
  7839. }
  7840. .header-icon .icon:first-child a:first-child {
  7841. padding-left: 0;
  7842. }
  7843. .header-icon .icon .header-language, .header-icon .icon .header-cart, .header-icon .icon .header-account {
  7844. display: -webkit-box;
  7845. display: -ms-flexbox;
  7846. display: flex;
  7847. -ms-flex-item-align: stretch;
  7848. -ms-grid-row-align: stretch;
  7849. align-self: stretch;
  7850. -webkit-box-align: center;
  7851. -ms-flex-align: center;
  7852. align-items: center;
  7853. }
  7854. .header-icon .icon .header-language > a, .header-icon .icon .header-cart > a, .header-icon .icon .header-account > a {
  7855. padding-left: 14px;
  7856. color: var(--white);
  7857. font-size: 17px;
  7858. }
  7859. .header-icon .icon .header-language > a:hover, .header-icon .icon .header-cart > a:hover, .header-icon .icon .header-account > a:hover {
  7860. color: var(--white);
  7861. opacity: 0.6;
  7862. }
  7863. .header-icon .header-mail {
  7864. padding-right: 35px;
  7865. top: 0;
  7866. }
  7867. .header-icon .header-mail .mail {
  7868. font-size: 14px;
  7869. }
  7870. .header-icon .header-mail .mail i {
  7871. vertical-align: middle;
  7872. padding-right: 5px;
  7873. }
  7874. .header-icon .header-social-icon a {
  7875. font-size: 17px;
  7876. padding-left: 20px;
  7877. flex-shrink: 0;
  7878. }
  7879. /* Header cart */
  7880. .header-cart-icon .header-cart {
  7881. display: inline-block;
  7882. }
  7883. .header-cart-icon .header-cart .cart-item-list {
  7884. display: none;
  7885. left: auto;
  7886. right: 0;
  7887. box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.1);
  7888. border-radius: 0;
  7889. background-color: var(--white);
  7890. border: 0;
  7891. padding: 0;
  7892. min-width: 250px;
  7893. margin: 0;
  7894. position: absolute;
  7895. z-index: 1;
  7896. top: 100%;
  7897. }
  7898. .header-cart-icon .header-cart .cart-item-list .cart-item {
  7899. display: flex;
  7900. padding: 17px;
  7901. border-top: 1px solid #ededed;
  7902. position: relative;
  7903. }
  7904. .header-cart-icon .header-cart .cart-item-list .cart-item .close {
  7905. font-size: 16px;
  7906. position: absolute;
  7907. right: 15px;
  7908. top: 15px;
  7909. font-weight: 400;
  7910. color: var(--dark-gray);
  7911. }
  7912. .header-cart-icon .header-cart .cart-item-list .cart-item .product-image {
  7913. max-width: 50px;
  7914. width: 30%;
  7915. display: inline-block;
  7916. }
  7917. .header-cart-icon .header-cart .cart-item-list .cart-item .product-detail {
  7918. padding-left: 15px;
  7919. width: 70%;
  7920. text-align: left;
  7921. display: inline-block;
  7922. }
  7923. .header-cart-icon .header-cart .cart-item-list .cart-item .product-detail a {
  7924. color: var(--dark-gray);
  7925. font-size: 12px;
  7926. display: inline-block;
  7927. line-height: 16px;
  7928. padding: 0;
  7929. }
  7930. .header-cart-icon .header-cart .cart-item-list .cart-item .product-detail .item-ammount {
  7931. display: block;
  7932. font-size: 11px;
  7933. color: var(--medium-gray);
  7934. line-height: normal;
  7935. }
  7936. .header-cart-icon .header-cart .cart-item-list .cart-item:first-child {
  7937. border-top: 0;
  7938. }
  7939. .header-cart-icon .header-cart .cart-item-list .cart-total {
  7940. background-color: var(--very-light-gray);
  7941. flex-direction: column !important;
  7942. color: var(--dark-gray);
  7943. }
  7944. .header-cart-icon .header-cart .cart-item-list .cart-total span {
  7945. line-height: 20px;
  7946. display: inline-block;
  7947. }
  7948. .header-cart-icon .header-cart .cart-item-list .cart-total .btn {
  7949. width: 100%;
  7950. display: block;
  7951. margin: 8px 0;
  7952. }
  7953. .header-cart-icon .header-cart.open .cart-item-list {
  7954. display: block;
  7955. -webkit-animation: show-animation 0.5s;
  7956. animation: show-animation 0.5s;
  7957. }
  7958. .header-cart-icon a {
  7959. position: relative;
  7960. }
  7961. .header-cart-icon .cart-count {
  7962. position: absolute;
  7963. top: -7px;
  7964. right: -11px;
  7965. width: 17px;
  7966. height: 17px;
  7967. font-weight: 600;
  7968. text-align: center;
  7969. font-size: 10px;
  7970. line-height: 18px;
  7971. background-color: var(--base-color);
  7972. color: var(--white);
  7973. -webkit-border-radius: 100%;
  7974. border-radius: 100%;
  7975. -webkit-transition: 0.5s;
  7976. transition: 0.5s;
  7977. }
  7978. /* Header account */
  7979. .header-account-icon {
  7980. line-height: normal !important;
  7981. }
  7982. .header-account-icon .header-account {
  7983. display: inline-block;
  7984. }
  7985. .header-account-icon .header-account .account-item-list {
  7986. display: none;
  7987. left: auto;
  7988. right: 0;
  7989. box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.1);
  7990. border-radius: 0;
  7991. background-color: var(--white);
  7992. border: 0;
  7993. padding: 35px 0;
  7994. min-width: 220px;
  7995. margin: 0;
  7996. position: absolute;
  7997. z-index: 1;
  7998. top: 100%;
  7999. }
  8000. .header-account-icon .header-account .account-item-list .account-item {
  8001. display: inline-block;
  8002. padding: 0 45px 12px 40px;
  8003. width: 100%;
  8004. position: relative;
  8005. font-size: 17px;
  8006. font-weight: 400;
  8007. }
  8008. .header-account-icon .header-account .account-item-list .account-item a {
  8009. padding-left: 0;
  8010. }
  8011. .header-account-icon .header-account .account-item-list .account-item a:hover {
  8012. padding-left: 3px;
  8013. }
  8014. .header-account-icon .header-account .account-item-list .account-item:last-child {
  8015. padding-bottom: 0;
  8016. }
  8017. .header-account-icon .header-account.open .account-item-list {
  8018. display: block;
  8019. -webkit-animation: show-animation 0.5s;
  8020. animation: show-animation 0.5s;
  8021. }
  8022. .header-account-icon a {
  8023. position: relative;
  8024. }
  8025. /* Header language */
  8026. .header-language-icon .header-language {
  8027. display: inline-block;
  8028. }
  8029. .header-language-icon .header-language .language-dropdown {
  8030. position: absolute;
  8031. right: 0;
  8032. top: 100%;
  8033. padding: 20px;
  8034. list-style: none;
  8035. background-color: var(--white);
  8036. display: none;
  8037. box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.1);
  8038. -webkit-animation: hide-animation 0.5s;
  8039. animation: hide-animation 0.5s;
  8040. z-index: 9;
  8041. text-align: left;
  8042. margin: 0;
  8043. min-width: 140px;
  8044. }
  8045. .header-language-icon .header-language .language-dropdown li a {
  8046. color: var(--medium-gray);
  8047. font-size: 12px;
  8048. line-height: 28px;
  8049. padding: 0;
  8050. }
  8051. .header-language-icon .header-language .language-dropdown li a .icon-country {
  8052. width: 16px;
  8053. height: 16px;
  8054. display: inline-block;
  8055. margin: 0 10px 0 5px;
  8056. }
  8057. .header-language-icon .header-language .language-dropdown li a:hover {
  8058. color: var(--dark-gray);
  8059. opacity: 1;
  8060. }
  8061. .header-language-icon .header-language.open .language-dropdown {
  8062. display: block;
  8063. -webkit-animation: show-animation 0.5s;
  8064. animation: show-animation 0.5s;
  8065. }
  8066. /* Header widget */
  8067. .widget-text {
  8068. color: var(--white);
  8069. }
  8070. header a.widget-text:hover {
  8071. opacity: 0.6;
  8072. }
  8073. /* Header push button */
  8074. .header-push-button {
  8075. padding-left: 16px;
  8076. }
  8077. .header-push-button .push-button {
  8078. position: relative;
  8079. display: block;
  8080. width: 22px;
  8081. height: 14px;
  8082. padding: 0;
  8083. cursor: pointer;
  8084. -webkit-transition: 0.3s;
  8085. transition: 0.3s;
  8086. }
  8087. .header-push-button .push-button span {
  8088. background: var(--white);
  8089. height: 2px;
  8090. width: 22px;
  8091. content: "";
  8092. display: block;
  8093. border-radius: 0;
  8094. position: absolute;
  8095. left: 0;
  8096. right: 0;
  8097. margin-left: auto;
  8098. margin-right: auto;
  8099. -webkit-transform: rotate(0deg);
  8100. transform: rotate(0deg);
  8101. -webkit-transition: 0.25s;
  8102. transition: 0.25s;
  8103. }
  8104. .header-push-button .push-button span:nth-child(2) {
  8105. top: 6px;
  8106. }
  8107. .header-push-button .push-button span:nth-child(3) {
  8108. top: 6px;
  8109. }
  8110. .header-push-button .push-button span:nth-child(4) {
  8111. top: 12px;
  8112. width: 14px;
  8113. left: -8px;
  8114. }
  8115. .header-push-button .push-button:hover {
  8116. opacity: 0.6;
  8117. }
  8118. .show-menu .header-push-button .push-button span:nth-child(1) {
  8119. top: 7px;
  8120. width: 0%;
  8121. }
  8122. .show-menu .header-push-button .push-button span:nth-child(2) {
  8123. -webkit-transform: rotate(45deg);
  8124. transform: rotate(45deg);
  8125. }
  8126. .show-menu .header-push-button .push-button span:nth-child(3) {
  8127. -webkit-transform: rotate(-45deg);
  8128. transform: rotate(-45deg);
  8129. }
  8130. .show-menu .header-push-button .push-button span:nth-child(4) {
  8131. top: 7px;
  8132. width: 0%;
  8133. }
  8134. .navbar-modern-inner {
  8135. display: none;
  8136. }
  8137. .navbar-modern-inner .navbar-toggler {
  8138. display: none;
  8139. }
  8140. /* Header push menu */
  8141. .show-menu {
  8142. overflow: hidden;
  8143. }
  8144. .show-menu .push-menu {
  8145. right: 0;
  8146. -webkit-box-shadow: 0 0 60px rgba(0, 0, 0, 0.3);
  8147. box-shadow: 0 0 60px rgba(0, 0, 0, 0.3);
  8148. }
  8149. .show-menu .push-menu .close-menu {
  8150. opacity: 1;
  8151. -webkit-transform: scale(1);
  8152. transform: scale(1);
  8153. -webkit-transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  8154. transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  8155. -webkit-transition-delay: 0.5s;
  8156. transition-delay: 0.5s;
  8157. visibility: visible;
  8158. cursor: pointer;
  8159. }
  8160. .show-menu .push-menu.push-menu-left {
  8161. right: auto;
  8162. left: 0;
  8163. }
  8164. .push-menu {
  8165. position: fixed;
  8166. top: 0;
  8167. right: -100%;
  8168. width: 400px;
  8169. height: 100%;
  8170. z-index: 1031;
  8171. overflow-y: auto;
  8172. -webkit-transition: 0.5s;
  8173. transition: 0.5s;
  8174. }
  8175. .push-menu.push-menu-left {
  8176. right: auto;
  8177. left: -100%;
  8178. }
  8179. .push-menu .left-circle {
  8180. width: 500px !important;
  8181. height: 500px;
  8182. position: absolute;
  8183. left: -160px;
  8184. top: -80px;
  8185. -webkit-border-radius: 100%;
  8186. border-radius: 100%;
  8187. }
  8188. .push-menu .left-circle:before, .push-menu .left-circle:after {
  8189. width: 100%;
  8190. height: 100%;
  8191. border: 1px solid var(--light-medium-gray);
  8192. content: "";
  8193. display: block;
  8194. position: absolute;
  8195. top: 0;
  8196. left: 0;
  8197. transform: translate(10px, 5px);
  8198. -webkit-border-radius: 100%;
  8199. border-radius: 100%;
  8200. }
  8201. .push-menu .left-circle:after {
  8202. transform: translate(5px, 5px);
  8203. }
  8204. .push-menu .close-menu {
  8205. height: 40px;
  8206. width: 40px;
  8207. text-align: center;
  8208. position: absolute;
  8209. right: 50px;
  8210. top: 50px;
  8211. z-index: 9;
  8212. display: flex;
  8213. border-radius: 100%;
  8214. align-items: center;
  8215. justify-content: center;
  8216. opacity: 0;
  8217. visibility: hidden;
  8218. -webkit-transform: scale(0.8);
  8219. transform: scale(0.8);
  8220. }
  8221. .push-menu .push-menu-wrapper {
  8222. height: 100%;
  8223. overflow-y: hidden;
  8224. padding: 20px 0;
  8225. }
  8226. .push-menu .push-menu-wrapper .mCustomScrollBox {
  8227. display: flex;
  8228. }
  8229. .push-menu .push-menu-wrapper .mCustomScrollBox .mCSB_container.mCS_y_hidden.mCS_no_scrollbar_y {
  8230. align-self: center;
  8231. }
  8232. .push-menu .push-menu-wrapper .mCustomScrollBox .mCSB_container {
  8233. width: 100%;
  8234. align-self: flex-start;
  8235. }
  8236. .push-menu .push-menu-wrapper .mCSB_inside > .mCSB_container {
  8237. margin: 0 !important;
  8238. padding: 0 15px !important;
  8239. }
  8240. .push-menu.push-menu-style-2 .push-menu-wrapper .mCustomScrollBox .mCSB_container.mCS_y_hidden.mCS_no_scrollbar_y {
  8241. align-self: start;
  8242. }
  8243. .push-menu.push-menu-style-3 .push-menu-wrapper .mCustomScrollBox .mCSB_container.mCS_y_hidden.mCS_no_scrollbar_y {
  8244. height: 100%;
  8245. display: flex;
  8246. flex-wrap: wrap;
  8247. align-content: space-between;
  8248. }
  8249. /* Header center logo */
  8250. .center-logo .navbar-nav .nav-link {
  8251. padding: 38px 20px;
  8252. }
  8253. .center-logo .menu-logo .d-none {
  8254. -ms-flex-item-align: center;
  8255. -ms-grid-row-align: center;
  8256. align-self: center;
  8257. }
  8258. .center-logo .navbar-brand {
  8259. position: absolute;
  8260. left: 50%;
  8261. top: 50%;
  8262. -webkit-transform: translate(-50%, -50%);
  8263. transform: translate(-50%, -50%);
  8264. transition: none;
  8265. }
  8266. .center-logo .navbar-left, .center-logo .navbar-right {
  8267. width: 42%;
  8268. }
  8269. /* Header top logo */
  8270. .top-logo .navbar-brand {
  8271. padding: 22px 0;
  8272. }
  8273. .top-logo .navbar-nav .nav-link {
  8274. padding-top: 25px !important;
  8275. padding-bottom: 25px !important;
  8276. }
  8277. /* Header left menu simple */
  8278. .left-sidebar-wrapper {
  8279. padding-left: 300px;
  8280. position: relative;
  8281. min-height: 300px;
  8282. width: 100%;
  8283. }
  8284. .left-sidebar-wrapper .left-sidebar-header.collapse:not(.show) {
  8285. display: block !important;
  8286. }
  8287. header.sticky .left-sidebar-nav .navbar-nav .nav-link {
  8288. padding: 0;
  8289. }
  8290. .left-sidebar-header {
  8291. position: absolute;
  8292. left: 0;
  8293. width: 301px;
  8294. top: -100%;
  8295. bottom: 0;
  8296. z-index: 999;
  8297. display: block;
  8298. }
  8299. .left-sidebar-header .menu-item-list .menu-item .nav-link {
  8300. font-size: 16px;
  8301. line-height: 20px;
  8302. }
  8303. .left-sidebar-header .menu-item-list .menu-item .menu-toggle {
  8304. top: 10px;
  8305. }
  8306. .left-sidebar-header .menu-item-list .menu-item .sub-menu .menu-toggle {
  8307. top: 0;
  8308. }
  8309. .left-sidebar-nav {
  8310. width: 300px;
  8311. padding: 80px 50px;
  8312. left: 0;
  8313. position: fixed;
  8314. overflow: hidden;
  8315. display: block;
  8316. height: inherit;
  8317. -webkit-transition: 0.3s;
  8318. transition: 0.3s;
  8319. }
  8320. .left-sidebar-nav .left-menu-bottom {
  8321. width: 100%;
  8322. }
  8323. .left-sidebar-nav .left-menu-bottom .header-icon .icon a {
  8324. padding: 0 15px;
  8325. }
  8326. .left-sidebar-nav .navbar-brand {
  8327. padding: 0 !important;
  8328. }
  8329. .left-sidebar-nav .side-menu {
  8330. margin-top: 10.5rem;
  8331. margin-bottom: 10.5rem;
  8332. width: 100%;
  8333. }
  8334. .left-sidebar-nav .navbar-toggler {
  8335. display: none;
  8336. }
  8337. .social-text {
  8338. width: 100%;
  8339. display: inline-block;
  8340. color: var(--medium-gray);
  8341. font-size: 13px;
  8342. line-height: 16px;
  8343. }
  8344. .connect-me a {
  8345. color: var(--dark-gray);
  8346. display: table;
  8347. }
  8348. .connect-me a:hover {
  8349. opacity: 0.6;
  8350. }
  8351. .connect-me .widget-text {
  8352. color: var(--dark-gray);
  8353. display: table;
  8354. }
  8355. /* Menu list */
  8356. .menu-item-list {
  8357. display: block;
  8358. width: 100%;
  8359. list-style: none;
  8360. padding: 0;
  8361. margin-bottom: 0;
  8362. }
  8363. .menu-item-list .menu-item {
  8364. position: relative;
  8365. margin: 0;
  8366. }
  8367. .menu-item-list .menu-item ul {
  8368. list-style: none;
  8369. padding: 0;
  8370. }
  8371. .menu-item-list .menu-item .menu-toggle {
  8372. display: block;
  8373. position: absolute;
  8374. right: 0;
  8375. top: 14px;
  8376. cursor: pointer;
  8377. z-index: 1;
  8378. width: 30px;
  8379. height: 30px;
  8380. line-height: 30px;
  8381. }
  8382. .menu-item-list .menu-item .menu-toggle:before, .menu-item-list .menu-item .menu-toggle:after {
  8383. content: "";
  8384. display: block;
  8385. position: absolute;
  8386. right: 10px;
  8387. top: 15px;
  8388. height: 1px;
  8389. width: 11px;
  8390. background-color: var(--white);
  8391. }
  8392. .menu-item-list .menu-item .menu-toggle:after {
  8393. -webkit-transform: rotate(-90deg);
  8394. transform: rotate(-90deg);
  8395. }
  8396. .menu-item-list .menu-item .menu-toggle.show:after {
  8397. -webkit-transform: rotate(0deg);
  8398. transform: rotate(0deg);
  8399. }
  8400. .menu-item-list .menu-item .sub-menu .menu-toggle {
  8401. top: 0;
  8402. }
  8403. .menu-item-list .menu-item .sub-menu .menu-toggle:before, .menu-item-list .menu-item .sub-menu .menu-toggle:after {
  8404. width: 7px;
  8405. }
  8406. .menu-item-list .menu-item .sub-menu .active > a {
  8407. opacity: 1;
  8408. }
  8409. .menu-item-list .active .nav-link {
  8410. opacity: 0.6;
  8411. }
  8412. .menu-item-list .nav-link {
  8413. padding: 5px 20px 5px 0;
  8414. font-size: 20px;
  8415. line-height: 28px;
  8416. display: inline-block;
  8417. width: 100%;
  8418. margin: 9px 0;
  8419. color: var(--white);
  8420. -webkit-transition: 0.3s;
  8421. transition: 0.3s;
  8422. }
  8423. .menu-item-list .nav-link:hover {
  8424. color: var(--white);
  8425. opacity: 0.6;
  8426. }
  8427. .menu-item-list .sub-menu {
  8428. padding: 0;
  8429. display: block;
  8430. height: 0;
  8431. overflow: hidden;
  8432. list-style: none;
  8433. margin: 0;
  8434. position: relative !important;
  8435. transform: none !important;
  8436. background-color: transparent;
  8437. border: 0;
  8438. }
  8439. .menu-item-list .sub-menu li {
  8440. position: relative;
  8441. margin: 0;
  8442. padding: 5px 0;
  8443. }
  8444. .menu-item-list .sub-menu li .sub-menu {
  8445. margin: 0;
  8446. padding-left: 15px;
  8447. }
  8448. .menu-item-list .sub-menu li .sub-menu li {
  8449. padding: 10px 0 0;
  8450. }
  8451. .menu-item-list .sub-menu li .sub-menu li a {
  8452. padding: 0;
  8453. }
  8454. .menu-item-list .sub-menu li .sub-menu li a i {
  8455. margin-right: 10px;
  8456. }
  8457. .menu-item-list .sub-menu li .sub-menu li:first-child {
  8458. margin-top: 10px;
  8459. }
  8460. .menu-item-list .sub-menu li .sub-menu li:last-child {
  8461. margin-bottom: 10px;
  8462. }
  8463. .menu-item-list .sub-menu li:last-child {
  8464. margin-bottom: 0;
  8465. }
  8466. .menu-item-list .sub-menu li:last-child .sub-menu li:last-child {
  8467. margin-bottom: 0;
  8468. }
  8469. .menu-item-list .sub-menu a {
  8470. font-size: 15px;
  8471. line-height: 22px;
  8472. display: block;
  8473. color: var(--light-gray);
  8474. margin: 0;
  8475. padding-right: 20px;
  8476. }
  8477. .menu-item-list .sub-menu a:hover {
  8478. color: var(--white);
  8479. }
  8480. .menu-item-list .sub-menu a .label {
  8481. display: inline-block;
  8482. padding: 5px 10px;
  8483. font-size: 10px;
  8484. line-height: initial;
  8485. margin-left: 8px;
  8486. margin-top: 0px;
  8487. vertical-align: middle;
  8488. font-weight: 700;
  8489. text-transform: uppercase;
  8490. white-space: nowrap;
  8491. }
  8492. .menu-item-list .sub-menu.show {
  8493. height: auto;
  8494. overflow: visible;
  8495. }
  8496. /* Header left menu modern */
  8497. .left-modern-menu {
  8498. padding-left: 75px;
  8499. }
  8500. .left-modern-menu .collapse:not(.show) {
  8501. display: block !important;
  8502. }
  8503. .left-modern-menu .left-modern-header .navbar-brand {
  8504. position: relative;
  8505. z-index: 9;
  8506. width: 100%;
  8507. padding: 0 !important;
  8508. text-align: center;
  8509. }
  8510. .left-modern-menu .left-modern-header .navbar-brand img {
  8511. max-height: 45px;
  8512. }
  8513. .left-modern-menu .left-modern-header .modern-sidebar-nav {
  8514. position: fixed;
  8515. height: 100%;
  8516. width: 380px;
  8517. overflow-y: auto;
  8518. top: 0;
  8519. left: -400px;
  8520. transition-duration: 0.3s;
  8521. z-index: 9;
  8522. }
  8523. .left-modern-menu .left-modern-header .modern-sidebar-nav:hover .side-menu-hover-background-color {
  8524. opacity: 1;
  8525. }
  8526. .left-modern-menu .left-modern-header .modern-side-menu {
  8527. padding: 75px 40px;
  8528. height: 100%;
  8529. overflow-y: hidden;
  8530. }
  8531. .left-modern-menu .left-modern-header .modern-side-menu .mCustomScrollBox {
  8532. display: flex;
  8533. width: 100%;
  8534. }
  8535. .left-modern-menu .left-modern-header .modern-side-menu .mCustomScrollBox .mCSB_container {
  8536. align-self: flex-start;
  8537. width: 100%;
  8538. margin: 0;
  8539. padding: 0 30px;
  8540. }
  8541. .left-modern-menu .left-modern-header .modern-side-menu .mCustomScrollBox .mCSB_container.mCS_no_scrollbar_y {
  8542. align-self: center;
  8543. }
  8544. .left-modern-menu .left-modern-header.show .modern-sidebar-nav {
  8545. left: 75px;
  8546. box-shadow: 0 0 150px rgba(0, 0, 0, 0.2);
  8547. }
  8548. .left-modern-menu .left-modern-header.show .navbar-toggler-line:nth-child(1) {
  8549. top: 7px;
  8550. width: 0%;
  8551. }
  8552. .left-modern-menu .left-modern-header.show .navbar-toggler-line:nth-child(2) {
  8553. -webkit-transform: rotate(45deg);
  8554. transform: rotate(45deg);
  8555. }
  8556. .left-modern-menu .left-modern-header.show .navbar-toggler-line:nth-child(3) {
  8557. -webkit-transform: rotate(-45deg);
  8558. transform: rotate(-45deg);
  8559. }
  8560. .left-modern-menu .left-modern-header.show .navbar-toggler-line:nth-child(4) {
  8561. top: 7px;
  8562. width: 0%;
  8563. }
  8564. .side-menu-hover-background-color {
  8565. position: absolute;
  8566. width: 100%;
  8567. height: 100%;
  8568. opacity: 0;
  8569. -webkit-transition-duration: 0.6s;
  8570. transition-duration: 0.6s;
  8571. }
  8572. /* Header left menu modern dark */
  8573. .header-dark .social-text {
  8574. color: var(--white);
  8575. }
  8576. .header-dark .connect-me .widget-text {
  8577. color: var(--white);
  8578. }
  8579. .header-dark .connect-me a {
  8580. color: var(--white);
  8581. }
  8582. .header-dark .connect-me a:hover {
  8583. opacity: 0.6;
  8584. }
  8585. .header-dark.left-modern-sidebar .navbar-toggler-line {
  8586. background-color: var(--white);
  8587. }
  8588. .vertical-title {
  8589. display: flex;
  8590. height: 100%;
  8591. flex: 1;
  8592. justify-content: flex-end;
  8593. flex-direction: column;
  8594. -webkit-transform: translateY(-75px);
  8595. transform: translateY(-75px);
  8596. }
  8597. .vertical-title .title {
  8598. -webkit-transform: rotate(-90deg);
  8599. transform: rotate(-90deg);
  8600. white-space: nowrap;
  8601. text-transform: uppercase;
  8602. }
  8603. .menu-list-wrapper {
  8604. overflow: auto;
  8605. height: calc(100vh - 150px);
  8606. padding: 50px 0;
  8607. }
  8608. .menu-list-wrapper .mCustomScrollBox {
  8609. display: flex;
  8610. width: 100%;
  8611. }
  8612. .menu-list-wrapper .mCustomScrollBox .mCSB_container {
  8613. align-self: flex-start;
  8614. width: 100%;
  8615. margin: 0;
  8616. }
  8617. .menu-list-wrapper .mCustomScrollBox .mCSB_container.mCS_no_scrollbar_y {
  8618. align-self: center;
  8619. }
  8620. .left-modern-sidebar {
  8621. position: fixed;
  8622. top: 0;
  8623. left: 0;
  8624. z-index: 999;
  8625. height: 100%;
  8626. width: 75px;
  8627. padding: 35px 0;
  8628. }
  8629. .left-modern-sidebar .toggle-icon {
  8630. position: absolute;
  8631. top: 50%;
  8632. left: 50%;
  8633. z-index: 9;
  8634. -webkit-transform: translate(-12px, -50%);
  8635. transform: translate(-12px, -50%);
  8636. }
  8637. .left-modern-sidebar .toggle-icon .navbar-toggler {
  8638. margin: 0;
  8639. position: relative;
  8640. margin: 0 auto;
  8641. z-index: 99;
  8642. cursor: pointer;
  8643. }
  8644. /* Hamburger menu */
  8645. .hamburger-nav {
  8646. width: 50%;
  8647. -webkit-transition: 0.5s;
  8648. transition: 0.5s;
  8649. }
  8650. .hamburger-nav .menu-item-list {
  8651. margin-bottom: 0;
  8652. padding: 0 30px;
  8653. }
  8654. .hamburger-nav .menu-item-list .menu-item {
  8655. margin: 0;
  8656. }
  8657. .hamburger-menu .header-icon {
  8658. position: absolute;
  8659. left: 0;
  8660. bottom: -50px;
  8661. }
  8662. /* Hamburger menu half */
  8663. .show-menu .hamburger-menu-half .hamburger-logo {
  8664. transform: translateY(0px);
  8665. opacity: 1;
  8666. transition-delay: 0.2s;
  8667. }
  8668. .show-menu .hamburger-menu-half .menu-address {
  8669. transform: translateY(0px);
  8670. opacity: 1;
  8671. transition-delay: 0.4s;
  8672. }
  8673. .show-menu .hamburger-menu-half .menu-text {
  8674. transform: translateY(0px);
  8675. opacity: 1;
  8676. transition-delay: 0.8s;
  8677. }
  8678. .show-menu .hamburger-menu-half .elements-social {
  8679. transform: translateY(0px);
  8680. opacity: 1;
  8681. transition-delay: 0.8s;
  8682. }
  8683. .show-menu .hamburger-menu-half .menu-item-list .menu-item {
  8684. transform: translateY(0px);
  8685. -webkit-transform: translateY(0px);
  8686. opacity: 1;
  8687. }
  8688. .show-menu .hamburger-menu-half .menu-item-list .menu-item:nth-child(1) {
  8689. transition-delay: 0.27s;
  8690. }
  8691. .show-menu .hamburger-menu-half .menu-item-list .menu-item:nth-child(2) {
  8692. transition-delay: 0.34s;
  8693. }
  8694. .show-menu .hamburger-menu-half .menu-item-list .menu-item:nth-child(3) {
  8695. transition-delay: 0.41s;
  8696. }
  8697. .show-menu .hamburger-menu-half .menu-item-list .menu-item:nth-child(4) {
  8698. transition-delay: 0.48s;
  8699. }
  8700. .show-menu .hamburger-menu-half .menu-item-list .menu-item:nth-child(5) {
  8701. transition-delay: 0.55s;
  8702. }
  8703. .show-menu .hamburger-menu-half .menu-item-list .menu-item:nth-child(6) {
  8704. transition-delay: 0.62s;
  8705. }
  8706. .show-menu .hamburger-menu-half .menu-item-list .menu-item:nth-child(7) {
  8707. transition-delay: 0.69s;
  8708. }
  8709. .show-menu .hamburger-menu-half .menu-item-list .menu-item:nth-child(8) {
  8710. transition-delay: 0.76s;
  8711. }
  8712. .show-menu .hamburger-menu-half .menu-item-list .menu-item:nth-child(9) {
  8713. transition-delay: 0.83s;
  8714. }
  8715. .show-menu .hamburger-menu-half .menu-item-list .menu-item:nth-child(10) {
  8716. transition-delay: 0.9s;
  8717. }
  8718. .show-menu .hamburger-menu-half .menu-item-list .menu-item:nth-child(11) {
  8719. transition-delay: 0.97s;
  8720. }
  8721. .show-menu .hamburger-menu-half .menu-item-list .menu-item:nth-child(12) {
  8722. transition-delay: 1.04s;
  8723. }
  8724. .show-menu .hamburger-menu-half .menu-item-list .menu-item:nth-child(13) {
  8725. transition-delay: 1.11s;
  8726. }
  8727. .show-menu .hamburger-menu-half .menu-item-list .menu-item:nth-child(14) {
  8728. transition-delay: 1.18s;
  8729. }
  8730. .show-menu .hamburger-menu-half .menu-item-list .menu-item:nth-child(15) {
  8731. transition-delay: 1.25s;
  8732. }
  8733. .hamburger-menu-half .hamburger-logo {
  8734. transform: translateY(30px);
  8735. opacity: 0;
  8736. transition: transform 0.8s cubic-bezier(0.4, 0.01, 0.165, 0.99), opacity 0.6s cubic-bezier(0.4, 0.01, 0.165, 0.99);
  8737. }
  8738. .hamburger-menu-half .menu-address {
  8739. transform: translateY(30px);
  8740. opacity: 0;
  8741. transition: transform 0.8s cubic-bezier(0.4, 0.01, 0.165, 0.99), opacity 0.6s cubic-bezier(0.4, 0.01, 0.165, 0.99);
  8742. }
  8743. .hamburger-menu-half .elements-social {
  8744. transform: translateY(30px);
  8745. opacity: 0;
  8746. transition: transform 0.5s cubic-bezier(0.4, 0.01, 0.165, 0.99), opacity 0.6s cubic-bezier(0.4, 0.01, 0.165, 0.99);
  8747. }
  8748. .hamburger-menu-half .menu-item-list .menu-item {
  8749. transform: translateY(30px);
  8750. opacity: 0;
  8751. transition: transform 0.8s cubic-bezier(0.4, 0.01, 0.165, 0.99), opacity 0.4s cubic-bezier(0.8, 0.01, 0.165, 0.99);
  8752. }
  8753. .hamburger-menu-half .menu-item-list .menu-item:nth-child(1) {
  8754. transition-delay: 0.49s;
  8755. }
  8756. .hamburger-menu-half .menu-item-list .menu-item:nth-child(2) {
  8757. transition-delay: 0.42s;
  8758. }
  8759. .hamburger-menu-half .menu-item-list .menu-item:nth-child(3) {
  8760. transition-delay: 0.35s;
  8761. }
  8762. .hamburger-menu-half .menu-item-list .menu-item:nth-child(4) {
  8763. transition-delay: 0.28s;
  8764. }
  8765. .hamburger-menu-half .menu-item-list .menu-item:nth-child(5) {
  8766. transition-delay: 0.21s;
  8767. }
  8768. .hamburger-menu-half .menu-item-list .menu-item:nth-child(6) {
  8769. transition-delay: 0.14s;
  8770. }
  8771. .hamburger-menu-half .menu-item-list .menu-item:nth-child(7) {
  8772. transition-delay: 0.07s;
  8773. }
  8774. .hamburger-menu-half .menu-item-list .menu-item:nth-child(8) {
  8775. transition-delay: 0s;
  8776. }
  8777. .hamburger-menu-half .menu-item-list .menu-item:nth-child(9) {
  8778. transition-delay: -0.07s;
  8779. }
  8780. .hamburger-menu-half .menu-item-list .menu-item:nth-child(10) {
  8781. transition-delay: -0.14s;
  8782. }
  8783. .hamburger-menu-half .menu-item-list .menu-item:nth-child(11) {
  8784. transition-delay: -0.21s;
  8785. }
  8786. .hamburger-menu-half .menu-item-list .menu-item:nth-child(12) {
  8787. transition-delay: -0.28s;
  8788. }
  8789. .hamburger-menu-half .menu-item-list .menu-item:nth-child(13) {
  8790. transition-delay: -0.35s;
  8791. }
  8792. .hamburger-menu-half .menu-item-list .menu-item:nth-child(14) {
  8793. transition-delay: -0.42s;
  8794. }
  8795. .hamburger-menu-half .menu-item-list .menu-item:nth-child(15) {
  8796. transition-delay: -0.49s;
  8797. }
  8798. /* Hamburger menu simple */
  8799. .show-menu .hamburger-menu-simple {
  8800. opacity: 1;
  8801. visibility: visible;
  8802. top: 0px;
  8803. }
  8804. .show-menu .hamburger-menu-simple .hamburger-menu {
  8805. opacity: 1;
  8806. }
  8807. .show-menu .hamburger-menu-simple .hamburger-logo {
  8808. transform: translateY(0px);
  8809. opacity: 1;
  8810. transition-delay: 0.2s;
  8811. }
  8812. .show-menu .hamburger-menu-simple .menu-address {
  8813. transform: translateY(0px);
  8814. opacity: 1;
  8815. transition-delay: 0.4s;
  8816. }
  8817. .show-menu .hamburger-menu-simple .menu-text {
  8818. transform: translateY(0px);
  8819. opacity: 1;
  8820. transition-delay: 0.8s;
  8821. }
  8822. .show-menu .hamburger-menu-simple .elements-social {
  8823. transform: translateY(0px);
  8824. opacity: 1;
  8825. transition-delay: 0.8s;
  8826. }
  8827. .show-menu .hamburger-menu-simple .menu-item-list .menu-item {
  8828. transform: scale(1) translateY(0px);
  8829. -webkit-transform: scale(1) translateY(0px);
  8830. opacity: 1;
  8831. }
  8832. .show-menu .hamburger-menu-simple .menu-item-list .menu-item:nth-child(1) {
  8833. transition-delay: 0.27s;
  8834. }
  8835. .show-menu .hamburger-menu-simple .menu-item-list .menu-item:nth-child(2) {
  8836. transition-delay: 0.34s;
  8837. }
  8838. .show-menu .hamburger-menu-simple .menu-item-list .menu-item:nth-child(3) {
  8839. transition-delay: 0.41s;
  8840. }
  8841. .show-menu .hamburger-menu-simple .menu-item-list .menu-item:nth-child(4) {
  8842. transition-delay: 0.48s;
  8843. }
  8844. .show-menu .hamburger-menu-simple .menu-item-list .menu-item:nth-child(5) {
  8845. transition-delay: 0.55s;
  8846. }
  8847. .show-menu .hamburger-menu-simple .menu-item-list .menu-item:nth-child(6) {
  8848. transition-delay: 0.62s;
  8849. }
  8850. .show-menu .hamburger-menu-simple .menu-item-list .menu-item:nth-child(7) {
  8851. transition-delay: 0.69s;
  8852. }
  8853. .show-menu .hamburger-menu-simple .menu-item-list .menu-item:nth-child(8) {
  8854. transition-delay: 0.76s;
  8855. }
  8856. .show-menu .hamburger-menu-simple .menu-item-list .menu-item:nth-child(9) {
  8857. transition-delay: 0.83s;
  8858. }
  8859. .show-menu .hamburger-menu-simple .menu-item-list .menu-item:nth-child(10) {
  8860. transition-delay: 0.9s;
  8861. }
  8862. .show-menu .hamburger-menu-simple .menu-item-list .menu-item:nth-child(11) {
  8863. transition-delay: 0.97s;
  8864. }
  8865. .show-menu .hamburger-menu-simple .menu-item-list .menu-item:nth-child(12) {
  8866. transition-delay: 1.04s;
  8867. }
  8868. .show-menu .hamburger-menu-simple .menu-item-list .menu-item:nth-child(13) {
  8869. transition-delay: 1.11s;
  8870. }
  8871. .show-menu .hamburger-menu-simple .menu-item-list .menu-item:nth-child(14) {
  8872. transition-delay: 1.18s;
  8873. }
  8874. .show-menu .hamburger-menu-simple .menu-item-list .menu-item:nth-child(15) {
  8875. transition-delay: 1.25s;
  8876. }
  8877. .hamburger-menu-simple {
  8878. width: 100%;
  8879. right: 0;
  8880. opacity: 1;
  8881. visibility: collapse;
  8882. height: 100vh;
  8883. max-height: 100dvh;
  8884. top: -100%;
  8885. -webkit-transition: 0.3s;
  8886. transition: 0.3s;
  8887. }
  8888. .hamburger-menu-simple .navbar-brand {
  8889. position: absolute;
  8890. top: 100px;
  8891. left: 0;
  8892. right: 0;
  8893. }
  8894. .hamburger-menu-simple .hamburger-menu {
  8895. padding: 30px 0;
  8896. transition: transform 0.5s cubic-bezier(0.4, 0.01, 0.165, 0.99), opacity 0.6s cubic-bezier(0.4, 0.01, 0.165, 0.99);
  8897. transition-delay: 0.4s;
  8898. opacity: 0;
  8899. }
  8900. .hamburger-menu-simple .hamburger-menu .header-icon {
  8901. bottom: 100px;
  8902. }
  8903. .hamburger-menu-simple .hamburger-logo {
  8904. transform: translateY(-50px);
  8905. opacity: 0;
  8906. transition: transform 0.5s cubic-bezier(0.4, 0.01, 0.165, 0.99), opacity 0.6s cubic-bezier(0.4, 0.01, 0.165, 0.99);
  8907. }
  8908. .hamburger-menu-simple .menu-address {
  8909. transform: translateY(-50px);
  8910. opacity: 0;
  8911. transition: transform 0.5s cubic-bezier(0.4, 0.01, 0.165, 0.99), opacity 0.6s cubic-bezier(0.4, 0.01, 0.165, 0.99);
  8912. }
  8913. .hamburger-menu-simple .menu-text {
  8914. transform: translateY(-50px);
  8915. opacity: 0;
  8916. transition: transform 0.5s cubic-bezier(0.4, 0.01, 0.165, 0.99), opacity 0.6s cubic-bezier(0.4, 0.01, 0.165, 0.99);
  8917. }
  8918. .hamburger-menu-simple .elements-social {
  8919. transform: translateY(-50px);
  8920. opacity: 0;
  8921. transition: transform 0.5s cubic-bezier(0.4, 0.01, 0.165, 0.99), opacity 0.6s cubic-bezier(0.4, 0.01, 0.165, 0.99);
  8922. }
  8923. .hamburger-menu-simple .menu-item-list .menu-item {
  8924. transform: scale(1.15) translateY(-30px);
  8925. opacity: 0;
  8926. transition: transform 0.5s cubic-bezier(0.4, 0.01, 0.165, 0.99), opacity 0.6s cubic-bezier(0.4, 0.01, 0.165, 0.99);
  8927. }
  8928. .hamburger-menu-simple .menu-item-list .menu-item:nth-child(1) {
  8929. transition-delay: 0.49s;
  8930. }
  8931. .hamburger-menu-simple .menu-item-list .menu-item:nth-child(2) {
  8932. transition-delay: 0.42s;
  8933. }
  8934. .hamburger-menu-simple .menu-item-list .menu-item:nth-child(3) {
  8935. transition-delay: 0.35s;
  8936. }
  8937. .hamburger-menu-simple .menu-item-list .menu-item:nth-child(4) {
  8938. transition-delay: 0.28s;
  8939. }
  8940. .hamburger-menu-simple .menu-item-list .menu-item:nth-child(5) {
  8941. transition-delay: 0.21s;
  8942. }
  8943. .hamburger-menu-simple .menu-item-list .menu-item:nth-child(6) {
  8944. transition-delay: 0.14s;
  8945. }
  8946. .hamburger-menu-simple .menu-item-list .menu-item:nth-child(7) {
  8947. transition-delay: 0.07s;
  8948. }
  8949. .hamburger-menu-simple .menu-item-list .menu-item:nth-child(8) {
  8950. transition-delay: 0s;
  8951. }
  8952. .hamburger-menu-simple .menu-item-list .menu-item:nth-child(9) {
  8953. transition-delay: -0.07s;
  8954. }
  8955. .hamburger-menu-simple .menu-item-list .menu-item:nth-child(10) {
  8956. transition-delay: -0.14s;
  8957. }
  8958. .hamburger-menu-simple .menu-item-list .menu-item:nth-child(11) {
  8959. transition-delay: -0.21s;
  8960. }
  8961. .hamburger-menu-simple .menu-item-list .menu-item:nth-child(12) {
  8962. transition-delay: -0.28s;
  8963. }
  8964. .hamburger-menu-simple .menu-item-list .menu-item:nth-child(13) {
  8965. transition-delay: -0.35s;
  8966. }
  8967. .hamburger-menu-simple .menu-item-list .menu-item:nth-child(14) {
  8968. transition-delay: -0.42s;
  8969. }
  8970. .hamburger-menu-simple .menu-item-list .menu-item:nth-child(15) {
  8971. transition-delay: -0.49s;
  8972. }
  8973. .hamburger-menu-simple .menu-item-list .nav-link {
  8974. font-size: 20px;
  8975. width: auto;
  8976. position: relative;
  8977. }
  8978. .hamburger-menu-simple .menu-item-list .nav-link:hover {
  8979. opacity: 0.6;
  8980. }
  8981. .hamburger-logo img {
  8982. max-height: 45px;
  8983. }
  8984. /* Right push menu */
  8985. .right-push-menu .menu-item-list .menu-item .toggle {
  8986. top: 18px;
  8987. }
  8988. .right-push-menu .menu-item-list .sub-menu li .toggle {
  8989. top: 4px;
  8990. }
  8991. .right-push-menu .menu-item-list .nav-link {
  8992. font-size: 1.5rem;
  8993. line-height: 2.5rem;
  8994. }
  8995. .right-push-menu .left-menu-bottom {
  8996. margin-top: 30px;
  8997. }
  8998. .right-push-menu .left-menu-bottom .header-icon {
  8999. position: relative;
  9000. bottom: 0;
  9001. }
  9002. /* Header search popup */
  9003. .show-search-popup {
  9004. overflow: hidden;
  9005. }
  9006. .show-search-popup header .navbar {
  9007. z-index: 110;
  9008. }
  9009. .show-search-popup .search-form-wrapper {
  9010. opacity: 1;
  9011. visibility: visible;
  9012. cursor: url(../images/mfg-close.png), auto;
  9013. }
  9014. .show-search-popup .search-form-wrapper .search-form {
  9015. height: 50%;
  9016. cursor: default;
  9017. visibility: visible;
  9018. opacity: 1;
  9019. }
  9020. .search-form-wrapper {
  9021. background: rgba(35, 35, 35, 0.9);
  9022. width: 100%;
  9023. left: 0;
  9024. top: 0;
  9025. overflow: hidden !important;
  9026. display: block !important;
  9027. height: 100vh;
  9028. position: fixed;
  9029. visibility: hidden;
  9030. opacity: 0;
  9031. z-index: 999;
  9032. -webkit-transition: 0.2s;
  9033. transition: 0.2s;
  9034. }
  9035. .search-form-wrapper .search-form {
  9036. height: 0;
  9037. background-color: var(--white);
  9038. width: 100%;
  9039. left: 0;
  9040. top: 0;
  9041. display: flex;
  9042. align-items: center;
  9043. justify-content: center;
  9044. position: absolute;
  9045. opacity: 0;
  9046. visibility: hidden;
  9047. -webkit-transition: 0.6s;
  9048. transition: 0.6s;
  9049. }
  9050. .search-form-wrapper .search-form .search-input {
  9051. outline: none;
  9052. border: 0;
  9053. border-bottom: 1px solid rgba(23, 23, 23, 0.2);
  9054. color: var(--dark-gray);
  9055. font-size: 18px;
  9056. padding: 20px 0;
  9057. background: transparent;
  9058. line-height: 2.5rem;
  9059. -webkit-border-radius: 0px;
  9060. border-radius: 0px;
  9061. height: 80px;
  9062. width: 100%;
  9063. }
  9064. .search-form-wrapper .search-form .search-input::-moz-placeholder {
  9065. color: var(--light-gray);
  9066. opacity: 1;
  9067. }
  9068. .search-form-wrapper .search-form .search-input::-webkit-input-placeholder {
  9069. color: var(--light-gray);
  9070. }
  9071. .search-form-wrapper .search-form .search-button {
  9072. color: var(--dark-gray);
  9073. bottom: 24px;
  9074. position: absolute;
  9075. font-size: 25px;
  9076. right: 0;
  9077. line-height: normal;
  9078. outline: none;
  9079. cursor: pointer;
  9080. z-index: 0;
  9081. margin-right: 0;
  9082. border: none;
  9083. background: none;
  9084. }
  9085. .search-form-wrapper .search-form:hover {
  9086. color: var(--light-gray);
  9087. }
  9088. .search-form-wrapper .search-close {
  9089. color: var(--black);
  9090. position: fixed;
  9091. top: 30px;
  9092. right: 35px;
  9093. overflow: visible;
  9094. cursor: pointer;
  9095. background: transparent;
  9096. border: 0;
  9097. -webkit-appearance: none;
  9098. display: block;
  9099. outline: none;
  9100. padding: 0;
  9101. z-index: 1046;
  9102. box-shadow: none;
  9103. font-size: 40px;
  9104. font-weight: 300;
  9105. width: 44px;
  9106. height: 44px;
  9107. line-height: 44px;
  9108. }
  9109. .search-form-wrapper .search-form-box {
  9110. position: relative;
  9111. width: 45%;
  9112. }
  9113. /* Custom hide animation */
  9114. @-webkit-keyframes hide-animation {
  9115. 0% {
  9116. opacity: 1;
  9117. }
  9118. to {
  9119. opacity: 0;
  9120. }
  9121. }
  9122. /* Custom slide animation */
  9123. @-webkit-keyframes show-animation {
  9124. 0% {
  9125. opacity: 0;
  9126. }
  9127. to {
  9128. opacity: 1;
  9129. }
  9130. }
  9131. button:focus {
  9132. outline: none;
  9133. }
  9134. /* Header toggle button */
  9135. .navbar-toggler {
  9136. font-size: 24px;
  9137. width: 22px;
  9138. height: 14px;
  9139. display: inline-block;
  9140. position: relative;
  9141. padding: 0;
  9142. margin: 0;
  9143. border: none;
  9144. vertical-align: middle;
  9145. border-radius: 0;
  9146. -webkit-transition: 0.3s;
  9147. transition: 0.3s;
  9148. }
  9149. .navbar-toggler:focus {
  9150. box-shadow: none;
  9151. }
  9152. .navbar-toggler-line {
  9153. background: var(--dark-gray);
  9154. height: 2px;
  9155. width: 22px;
  9156. content: "";
  9157. display: block;
  9158. border-radius: 0;
  9159. position: absolute;
  9160. left: 0;
  9161. right: 0;
  9162. margin-left: auto;
  9163. margin-right: auto;
  9164. -webkit-transform: rotate(0deg);
  9165. transform: rotate(0deg);
  9166. -webkit-transition: 0.25s;
  9167. transition: 0.25s;
  9168. }
  9169. .navbar-toggler-line:nth-child(1) {
  9170. top: 0px;
  9171. width: 14px;
  9172. }
  9173. .navbar-toggler-line:nth-child(2) {
  9174. top: 6px;
  9175. }
  9176. .navbar-toggler-line:nth-child(3) {
  9177. top: 6px;
  9178. }
  9179. .navbar-toggler-line:nth-child(4) {
  9180. top: 12px;
  9181. width: 14px;
  9182. }
  9183. .navbar-collapse-show .navbar-toggler-line:nth-child(1) {
  9184. top: 7px;
  9185. width: 0%;
  9186. }
  9187. .navbar-collapse-show .navbar-toggler-line:nth-child(2) {
  9188. -webkit-transform: rotate(45deg);
  9189. transform: rotate(45deg);
  9190. }
  9191. .navbar-collapse-show .navbar-toggler-line:nth-child(3) {
  9192. -webkit-transform: rotate(-45deg);
  9193. transform: rotate(-45deg);
  9194. }
  9195. .navbar-collapse-show .navbar-toggler-line:nth-child(4) {
  9196. top: 7px;
  9197. width: 0%;
  9198. }
  9199. .navbar-modern-inner {
  9200. display: none;
  9201. }
  9202. .navbar-modern-inner .navbar-toggler {
  9203. display: none;
  9204. }
  9205. .header-with-topbar + .top-space-margin {
  9206. margin-top: 136px;
  9207. }
  9208. .header-with-topbar + .top-space-padding {
  9209. padding-top: 136px;
  9210. }
  9211. .navbar-modern-inner, .navbar-full-screen-menu-inner {
  9212. display: none;
  9213. }
  9214. .top-space-margin {
  9215. margin-top: 96px;
  9216. }
  9217. .top-space-padding {
  9218. padding-top: 96px;
  9219. }
  9220. /* Landing page header */
  9221. .header-demo.navbar .navbar-nav .premium-element {
  9222. padding: 35px 40px;
  9223. border-radius: 13px;
  9224. }
  9225. .header-demo.navbar .navbar-nav .premium-element a {
  9226. color: #585858;
  9227. padding-bottom: 8px;
  9228. }
  9229. .header-demo.navbar .navbar-nav .premium-element .sub-title {
  9230. font-size: 18px;
  9231. }
  9232. .header-demo.navbar .navbar-nav .nav-item:first-child .dropdown-menu a {
  9233. color: var(--dark-gray);
  9234. }
  9235. .header-demo.navbar .navbar-nav .nav-link {
  9236. font-weight: 600;
  9237. }
  9238. .header-demo.navbar .navbar-nav .dropdown .dropdown-menu a {
  9239. font-weight: 500;
  9240. }
  9241. .header-demo.navbar.header-dark .navbar-nav .nav-item:first-child .dropdown-menu a {
  9242. color: var(--white);
  9243. }
  9244. /* ===================================
  9245. 11. Page title
  9246. ====================================== */
  9247. /* Breadcrumb */
  9248. .breadcrumb {
  9249. margin: 0;
  9250. }
  9251. .breadcrumb ul {
  9252. margin: 0;
  9253. padding: 0;
  9254. }
  9255. .breadcrumb-style-01 ul li {
  9256. display: inline-block;
  9257. }
  9258. .breadcrumb-style-01 ul li:after {
  9259. content: "\e844";
  9260. font-family: "feather";
  9261. font-size: 13px;
  9262. font-weight: 900;
  9263. display: inline-block;
  9264. vertical-align: middle;
  9265. padding: 0 8px 0 10px;
  9266. }
  9267. .breadcrumb-style-01 ul li:last-child:after {
  9268. content: "";
  9269. padding: 0;
  9270. }
  9271. /* Page title style */
  9272. .page-title-double-large h1 {
  9273. font-size: 3.6rem;
  9274. line-height: 3.3rem;
  9275. }
  9276. .page-title-double-large h2 {
  9277. font-size: 17px;
  9278. line-height: 26px;
  9279. }
  9280. .page-title-extra-large h1 {
  9281. font-size: 3.3rem;
  9282. line-height: 3.3rem;
  9283. }
  9284. .page-title-extra-large h2 {
  9285. font-size: 18px;
  9286. line-height: 26px;
  9287. }
  9288. .page-title-large h1 {
  9289. font-size: 2.8rem;
  9290. line-height: 3rem;
  9291. }
  9292. .page-title-large h2 {
  9293. font-size: 16px;
  9294. line-height: 22px;
  9295. }
  9296. .page-title-medium h1 {
  9297. font-size: 2rem;
  9298. line-height: 2.2rem;
  9299. }
  9300. .page-title-medium h2 {
  9301. font-size: 16px;
  9302. line-height: 22px;
  9303. }
  9304. .page-title-small h1 {
  9305. font-size: 1.625rem;
  9306. line-height: 1.875rem;
  9307. }
  9308. .page-title-small h2 {
  9309. font-size: 16px;
  9310. line-height: 22px;
  9311. }
  9312. .page-title-extra-small h1 {
  9313. font-size: 17px;
  9314. line-height: 20px;
  9315. }
  9316. .page-title-extra-small h2 {
  9317. font-size: 3.8rem;
  9318. line-height: 3.8rem;
  9319. }
  9320. .page-title-button-style.page-title-button-style {
  9321. -webkit-transition: all 0.3s;
  9322. transition: all 0.3s;
  9323. }
  9324. .page-title-button-style h1 {
  9325. padding: 13px 30px;
  9326. display: inline-block;
  9327. }
  9328. .page-title-mini-version h1 {
  9329. font-size: 20px;
  9330. line-height: 30px;
  9331. }
  9332. /* Down section icon */
  9333. .down-section {
  9334. position: absolute;
  9335. bottom: 60px;
  9336. left: 0;
  9337. right: 0;
  9338. width: 100%;
  9339. }
  9340. .down-section a {
  9341. display: inline-block;
  9342. }
  9343. .down-section.down-bottom {
  9344. bottom: 0;
  9345. -webkit-transform: translateY(50%);
  9346. transform: translateY(50%);
  9347. }
  9348. /* Down section line */
  9349. .down-section-line .section-line {
  9350. position: relative;
  9351. }
  9352. .down-section-line .section-line:before {
  9353. position: absolute;
  9354. left: 0;
  9355. top: 0;
  9356. content: "";
  9357. height: 0;
  9358. width: 100%;
  9359. -webkit-transition: all 0.5s;
  9360. transition: all 0.5s;
  9361. background-color: var(--base-color);
  9362. }
  9363. .down-section-line:hover .section-line:before {
  9364. height: 100%;
  9365. }
  9366. /* ===================================
  9367. 12. Layout
  9368. ====================================== */
  9369. /* Sidebar */
  9370. .sidebar-list li {
  9371. position: relative;
  9372. display: inline-block;
  9373. width: 100%;
  9374. margin-bottom: 15px;
  9375. line-height: 18px;
  9376. }
  9377. .sidebar-list li a {
  9378. display: inline-block;
  9379. text-align: left;
  9380. }
  9381. .sidebar-list li a:hover {
  9382. color: var(--base-color) !important;
  9383. }
  9384. .sidebar-list li .item-qty {
  9385. font-size: 14px;
  9386. position: absolute;
  9387. top: 1px;
  9388. right: 0;
  9389. text-align: right;
  9390. }
  9391. .sidebar-list li:last-child {
  9392. margin-bottom: 0;
  9393. }
  9394. .latest-post-sidebar {
  9395. list-style: none;
  9396. padding: 0;
  9397. margin: 0;
  9398. }
  9399. .latest-post-sidebar li {
  9400. margin-bottom: 25px;
  9401. }
  9402. .latest-post-sidebar li figure {
  9403. height: 65px;
  9404. width: 80px;
  9405. margin: 0;
  9406. }
  9407. .latest-post-sidebar li .media-body {
  9408. line-height: normal;
  9409. padding-left: 30px;
  9410. position: relative;
  9411. top: -3px;
  9412. }
  9413. .latest-post-sidebar li:last-child {
  9414. margin-bottom: 0;
  9415. }
  9416. .popular-post-sidebar {
  9417. list-style: none;
  9418. padding: 0;
  9419. margin: 0;
  9420. }
  9421. .popular-post-sidebar li {
  9422. margin-bottom: 25px;
  9423. }
  9424. .popular-post-sidebar li figure {
  9425. height: 100px;
  9426. width: 100px;
  9427. margin: 0;
  9428. }
  9429. .popular-post-sidebar li .media-body {
  9430. line-height: normal;
  9431. padding-left: 30px;
  9432. position: relative;
  9433. }
  9434. .popular-post-sidebar li:last-child {
  9435. margin-bottom: 0;
  9436. }
  9437. .category-list-sidebar {
  9438. list-style: none;
  9439. padding: 0;
  9440. margin: 0;
  9441. }
  9442. .category-list-sidebar li {
  9443. margin-bottom: 15px;
  9444. }
  9445. .category-list-sidebar li .btn {
  9446. right: -10%;
  9447. opacity: 0;
  9448. -webkit-transform: scale(0.9);
  9449. transform: scale(0.9);
  9450. -webkit-transition: all 300ms cubic-bezier(0.37, 0.8, 0.63, 1);
  9451. transition: all 300ms cubic-bezier(0.37, 0.8, 0.63, 1);
  9452. }
  9453. .category-list-sidebar li:last-child {
  9454. margin-bottom: 0;
  9455. }
  9456. .category-list-sidebar li:hover .btn {
  9457. right: -8%;
  9458. opacity: 1;
  9459. -webkit-transform: scale(1);
  9460. transform: scale(1);
  9461. }
  9462. .post-sidebar.blog-side-image li {
  9463. margin-bottom: 35px;
  9464. width: 100%;
  9465. }
  9466. .post-sidebar.blog-side-image li .blog-box .blog-image {
  9467. min-height: 1px;
  9468. }
  9469. .post-sidebar.blog-side-image li:last-child {
  9470. margin-bottom: 0;
  9471. }
  9472. .tag-cloud a {
  9473. display: inline-block;
  9474. text-align: center;
  9475. font-size: 14px;
  9476. line-height: 20px;
  9477. margin: 0 6px 10px 0;
  9478. padding: 7px 18px;
  9479. border-radius: 4px;
  9480. border: 1px solid var(--extra-medium-gray);
  9481. }
  9482. .tag-cloud a:hover, .tag-cloud a.active {
  9483. box-shadow: 0 0 10px rgba(23, 23, 23, 0.1);
  9484. color: var(--dark-gray);
  9485. background-color: var(--white);
  9486. }
  9487. /* Grid */
  9488. .grid {
  9489. list-style: none;
  9490. padding: 0;
  9491. margin: 0;
  9492. }
  9493. /* Grid column and gutter spacing */
  9494. .grid li img {
  9495. width: 100%;
  9496. }
  9497. .grid .grid-sizer {
  9498. padding: 0 !important;
  9499. margin: 0 !important;
  9500. }
  9501. .grid.gutter-very-small li {
  9502. padding: 3px 3px;
  9503. }
  9504. .grid.gutter-small li {
  9505. padding: 5px 5px;
  9506. }
  9507. .grid.gutter-medium li {
  9508. padding: 7px 7px;
  9509. }
  9510. .grid.gutter-large li {
  9511. padding: 10px 10px;
  9512. }
  9513. .grid.gutter-extra-large li {
  9514. padding: 15px;
  9515. }
  9516. .grid.gutter-double-extra-large li {
  9517. padding: 20px;
  9518. }
  9519. .grid.gutter-triple-extra-large li {
  9520. padding: 30px;
  9521. }
  9522. .grid.grid-6col li {
  9523. width: 16.67%;
  9524. }
  9525. .grid.grid-6col li.grid-item-double {
  9526. width: 33.33%;
  9527. }
  9528. .grid.grid-6col li.grid-item-single {
  9529. width: 100%;
  9530. }
  9531. .grid.grid-5col li {
  9532. width: 20%;
  9533. }
  9534. .grid.grid-5col li.grid-item-double {
  9535. width: 40%;
  9536. }
  9537. .grid.grid-5col li.grid-item-single {
  9538. width: 100%;
  9539. }
  9540. .grid.grid-4col li {
  9541. width: 25%;
  9542. }
  9543. .grid.grid-4col li.grid-item-double {
  9544. width: 50%;
  9545. }
  9546. .grid.grid-4col li.grid-item-single {
  9547. width: 100%;
  9548. }
  9549. .grid.grid-3col li {
  9550. width: 33.33%;
  9551. }
  9552. .grid.grid-3col li.grid-item-double {
  9553. width: 66.67%;
  9554. }
  9555. .grid.grid-3col li.grid-item-single {
  9556. width: 100%;
  9557. }
  9558. .grid.grid-2col li {
  9559. width: 50%;
  9560. }
  9561. .grid.grid-2col li.grid-item-double {
  9562. width: 100%;
  9563. }
  9564. .grid.grid-2col li.grid-item-single {
  9565. width: 100%;
  9566. }
  9567. .grid .gutter-large {
  9568. margin-left: 10px;
  9569. margin-right: 10px;
  9570. margin: 0 10px;
  9571. }
  9572. /* ===================================
  9573. 13. Elements
  9574. ====================================== */
  9575. /* Accordion */
  9576. .accordion .accordion-item {
  9577. color: inherit;
  9578. border: none;
  9579. }
  9580. .accordion .accordion-item .accordion-header {
  9581. background-color: transparent;
  9582. border: none;
  9583. padding: 0;
  9584. margin-bottom: 0;
  9585. }
  9586. .accordion .accordion-item .accordion-header .accordion-title {
  9587. cursor: pointer;
  9588. padding-right: 25px;
  9589. }
  9590. .accordion .accordion-item .accordion-header .accordion-title i {
  9591. position: absolute;
  9592. top: 50%;
  9593. right: 0;
  9594. -webkit-transform: translateY(-50%);
  9595. transform: translateY(-50%);
  9596. }
  9597. .accordion .accordion-item .accordion-collapse {
  9598. border: 0;
  9599. }
  9600. /* Accordion style 01 */
  9601. .accordion-style-01 .accordion-item {
  9602. margin-bottom: 20px;
  9603. overflow: inherit;
  9604. padding: 20px 35px;
  9605. -webkit-border-radius: 4px !important;
  9606. border-radius: 4px !important;
  9607. -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  9608. transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  9609. -webkit-box-shadow: 0px 0px 20px 0px rgba(111, 111, 111, 0.15);
  9610. box-shadow: 0px 0px 20px 0px rgba(111, 111, 111, 0.15);
  9611. }
  9612. .accordion-style-01 .accordion-item:last-child {
  9613. margin-bottom: 0;
  9614. }
  9615. .accordion-style-01 .accordion-item .collapse {
  9616. overflow: hidden;
  9617. }
  9618. .accordion-style-01 .accordion-item .accordion-body {
  9619. padding: 12px 45px 10px 0px;
  9620. }
  9621. .accordion-style-01 .accordion-item .accordion-header .accordion-title > i {
  9622. position: static;
  9623. -webkit-transform: none;
  9624. transform: none;
  9625. }
  9626. /* Accordion style 02 */
  9627. .accordion-style-02 .accordion-item {
  9628. background-color: transparent;
  9629. }
  9630. .accordion-style-02 .accordion-item .accordion-header {
  9631. margin-bottom: 0;
  9632. padding: 15px 0;
  9633. }
  9634. .accordion-style-02 .accordion-item .accordion-header .accordion-title i {
  9635. right: 0;
  9636. }
  9637. .accordion-style-02 .accordion-item.active-accordion .accordion-header {
  9638. border-bottom-color: transparent !important;
  9639. }
  9640. .accordion-style-02 .accordion-item .accordion-body {
  9641. padding: 0 25px 30px 0;
  9642. }
  9643. .accordion-style-02 .right-icon {
  9644. background-color: var(--white);
  9645. color: var(--dark-gray);
  9646. }
  9647. .accordion-style-02 .right-icon:hover {
  9648. background-color: var(--base-color);
  9649. color: var(--white);
  9650. }
  9651. /* Accordion style 03 */
  9652. .accordion-style-03 .accordion-item {
  9653. margin-bottom: 20px;
  9654. border: 1px solid rgba(255, 255, 255, 0.15) !important;
  9655. -webkit-border-radius: 0;
  9656. border-radius: 0;
  9657. background-color: transparent;
  9658. }
  9659. .accordion-style-03 .accordion-item .accordion-header {
  9660. padding: 15px 30px;
  9661. -webkit-border-radius: 0;
  9662. border-radius: 0;
  9663. }
  9664. .accordion-style-03 .accordion-item .accordion-body {
  9665. padding: 30px;
  9666. border-top: 1px solid rgba(255, 255, 255, 0.15) !important;
  9667. }
  9668. /* Accordion style 04 */
  9669. .accordion-style-04 .accordion-item {
  9670. -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  9671. transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  9672. -webkit-border-radius: 0;
  9673. border-radius: 0;
  9674. background-color: transparent;
  9675. }
  9676. .accordion-style-04 .accordion-item .accordion-header {
  9677. padding: 18px 35px;
  9678. }
  9679. .accordion-style-04 .accordion-item .accordion-body {
  9680. padding: 25px 40px 30px;
  9681. }
  9682. .accordion-style-04 .accordion-item.active-accordion {
  9683. -webkit-box-shadow: 0px 5px 25px 0px rgba(111, 111, 111, 0.15);
  9684. box-shadow: 0px 5px 25px 0px rgba(111, 111, 111, 0.15);
  9685. background: var(--white);
  9686. }
  9687. /* Accordion style 05 */
  9688. .accordion-style-05 .accordion-item {
  9689. margin-bottom: 20px;
  9690. overflow: hidden;
  9691. padding: 22px 35px 22px 65px;
  9692. position: relative;
  9693. -webkit-border-radius: 4px !important;
  9694. border-radius: 4px !important;
  9695. -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  9696. transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  9697. -webkit-box-shadow: 0px 0px 45px 0px rgba(111, 111, 111, 0.15);
  9698. box-shadow: 0px 0px 45px 0px rgba(111, 111, 111, 0.15);
  9699. }
  9700. .accordion-style-05 .accordion-item:last-child {
  9701. margin-bottom: 0;
  9702. }
  9703. .accordion-style-05 .accordion-item .collapse {
  9704. overflow: hidden;
  9705. }
  9706. .accordion-style-05 .accordion-item .accordion-body {
  9707. padding: 10px 45px 10px 0px;
  9708. }
  9709. .accordion-style-05 .accordion-item .number {
  9710. position: absolute;
  9711. left: -13px;
  9712. top: 15px;
  9713. }
  9714. .accordion-style-05 .accordion-item.active-accordion {
  9715. -webkit-box-shadow: 0px 15px 40px 5px rgba(111, 111, 111, 0.15);
  9716. box-shadow: 0px 15px 40px 5px rgba(111, 111, 111, 0.15);
  9717. }
  9718. .accordion-style-05 .accordion-item.active-accordion .number {
  9719. -webkit-text-fill-color: var(--base-color);
  9720. -webkit-text-stroke-color: var(--base-color);
  9721. }
  9722. /* Accordion style 06 */
  9723. .accordion-style-06 .accordion-item {
  9724. margin-bottom: 0;
  9725. overflow: hidden;
  9726. padding: 15px 100px 15px 45px;
  9727. position: relative;
  9728. -webkit-border-radius: 4px !important;
  9729. border-radius: 4px !important;
  9730. }
  9731. .accordion-style-06 .accordion-item:last-child {
  9732. margin-bottom: 0;
  9733. }
  9734. .accordion-style-06 .accordion-item .collapse {
  9735. overflow: hidden;
  9736. border-radius: 0;
  9737. }
  9738. .accordion-style-06 .accordion-item .accordion-body {
  9739. padding: 10px 0 10px 0px;
  9740. }
  9741. .accordion-style-06 .accordion-item i {
  9742. position: absolute;
  9743. right: -32px;
  9744. top: 50%;
  9745. opacity: 0;
  9746. -webkit-transition: 0.3s;
  9747. transition: 0.3s;
  9748. color: var(--dark-gray);
  9749. -webkit-transform: rotate(-35deg) translateY(-50%);
  9750. transform: rotate(-35deg) translateY(-50%);
  9751. }
  9752. .accordion-style-06 .accordion-item .collapsing i {
  9753. opacity: 0;
  9754. }
  9755. .accordion-style-06 .accordion-item.active-accordion {
  9756. padding-top: 30px;
  9757. padding-bottom: 30px;
  9758. background-image: linear-gradient(to bottom, #f2f8f7, #f5fafa, #f9fbfd, #fcfdfe, #ffffff);
  9759. }
  9760. .accordion-style-06 .accordion-item.active-accordion i {
  9761. opacity: 0.15;
  9762. }
  9763. /* Alert box */
  9764. .alert-success {
  9765. background-color: #f1fbec;
  9766. color: #54b783;
  9767. border-color: #cce8b3;
  9768. padding: 10px 20px 10px 20px;
  9769. }
  9770. .alert {
  9771. padding: 20px 25px 20px 30px;
  9772. margin-bottom: 30px;
  9773. line-height: 22px;
  9774. position: relative;
  9775. z-index: 1;
  9776. -webkit-border-radius: 4px;
  9777. border-radius: 4px;
  9778. }
  9779. .alert.alert-success {
  9780. background-color: #f1fbec;
  9781. color: #54b783;
  9782. border-color: #cce8b3;
  9783. }
  9784. .alert.alert-info {
  9785. background-color: #ebf5f9;
  9786. color: #4278bb;
  9787. border-color: #bce8f1;
  9788. }
  9789. .alert.alert-warning {
  9790. background-color: #fcf8e3;
  9791. color: #e2ad4b;
  9792. border-color: #faebcc;
  9793. }
  9794. .alert.alert-danger {
  9795. background-color: #fbf1f1;
  9796. color: #e65656;
  9797. border-color: #efe1e3;
  9798. }
  9799. .alert strong {
  9800. font-weight: 500;
  9801. }
  9802. @keyframes hvr-icon-push {
  9803. 50% {
  9804. -webkit-trasfrom: scale(0.5);
  9805. trasfrom: scale(0.5);
  9806. }
  9807. }
  9808. .alert .close {
  9809. opacity: 1;
  9810. font-size: 16px;
  9811. line-height: 22px;
  9812. color: rgba(0, 0, 0, 0.34);
  9813. text-shadow: none;
  9814. float: right;
  9815. }
  9816. .alert .close i {
  9817. -webkit-transform: translateZ(0);
  9818. transform: translateZ(0);
  9819. -webkit-transition-duration: 0.3s;
  9820. transition-duration: 0.3s;
  9821. -webkit-transition-property: transform;
  9822. transition-property: transform;
  9823. -webkit-transition-timing-function: ease-out;
  9824. transition-timing-function: ease-out;
  9825. }
  9826. .alert .close:hover i {
  9827. -webkit-animation-name: hvr-icon-push;
  9828. animation-name: hvr-icon-push;
  9829. -webkit-animation-duration: 0.3s;
  9830. animation-duration: 0.3s;
  9831. -webkit-animation-timing-function: linear;
  9832. animation-timing-function: linear;
  9833. -webkit-animation-iteration-count: 1;
  9834. animation-iteration-count: 1;
  9835. }
  9836. .alert .close:not(:disabled), .alert .close:not(.disabled):focus, .alert .close:not(.disabled):hover {
  9837. opacity: 1;
  9838. }
  9839. /* Alert box style 02 */
  9840. .alert-box-style-02 .alert {
  9841. padding: 22px 60px 22px 30px;
  9842. border: none;
  9843. line-height: 22px;
  9844. -webkit-box-shadow: 0px 0 10px 0 rgba(111, 111, 111, 0.1);
  9845. box-shadow: 0px 0 10px 0 rgba(111, 111, 111, 0.1);
  9846. }
  9847. .alert-box-style-02 .alert.alert-success {
  9848. color: #54b783;
  9849. }
  9850. .alert-box-style-02 .alert.alert-info {
  9851. color: #4278bb;
  9852. }
  9853. .alert-box-style-02 .alert.alert-warning {
  9854. color: #e2ad4b;
  9855. }
  9856. .alert-box-style-02 .alert.alert-danger {
  9857. color: #e65656;
  9858. }
  9859. .alert-box-style-02 .alert .close {
  9860. height: 100%;
  9861. position: absolute;
  9862. right: 0;
  9863. width: 60px;
  9864. text-align: center;
  9865. top: 0;
  9866. display: flex;
  9867. justify-content: center;
  9868. align-items: center;
  9869. border-left: 1px solid var(--light-medium-gray);
  9870. font-size: 18px;
  9871. }
  9872. /* Alert box style 03 */
  9873. .alert-box-style-03 .alert {
  9874. padding: 20px 30px 20px 55px;
  9875. border: 0;
  9876. }
  9877. .alert-box-style-03 .alert:before {
  9878. font-family: bootstrap-icons;
  9879. display: inline-block;
  9880. position: absolute;
  9881. left: 25px;
  9882. font-size: 18px;
  9883. }
  9884. .alert-box-style-03 .alert.alert-success {
  9885. background-color: #54b783;
  9886. }
  9887. .alert-box-style-03 .alert.alert-success:before {
  9888. content: "\f26b";
  9889. }
  9890. .alert-box-style-03 .alert.alert-info {
  9891. background-color: #4278bb;
  9892. }
  9893. .alert-box-style-03 .alert.alert-info:before {
  9894. content: "\f431";
  9895. }
  9896. .alert-box-style-03 .alert.alert-warning {
  9897. background-color: #e2ad4b;
  9898. }
  9899. .alert-box-style-03 .alert.alert-warning:before {
  9900. content: "\f567";
  9901. }
  9902. .alert-box-style-03 .alert.alert-danger {
  9903. background-color: #e65656;
  9904. }
  9905. .alert-box-style-03 .alert.alert-danger:before {
  9906. content: "\f623";
  9907. }
  9908. .alert-box-style-03 .alert .close {
  9909. right: -10px;
  9910. position: relative;
  9911. }
  9912. /* Alert box style 04 */
  9913. .alert-box-style-04 .alert {
  9914. padding: 20px 25px 20px 30px;
  9915. border-radius: 0;
  9916. border: none;
  9917. border-left: 3px solid;
  9918. }
  9919. .alert-box-style-04 .alert:hover {
  9920. -webkit-box-shadow: 0px 0 10px 0 rgba(111, 111, 111, 0.1);
  9921. box-shadow: 0px 0 10px 0 rgba(111, 111, 111, 0.1);
  9922. }
  9923. .alert-box-style-04 .alert.alert-success {
  9924. color: #54b783;
  9925. border-color: #54b783;
  9926. }
  9927. .alert-box-style-04 .alert.alert-info {
  9928. color: #4278bb;
  9929. border-color: #4278bb;
  9930. }
  9931. .alert-box-style-04 .alert.alert-warning {
  9932. color: #e2ad4b;
  9933. border-color: #e2ad4b;
  9934. }
  9935. .alert-box-style-04 .alert.alert-danger {
  9936. color: #e65656;
  9937. border-color: #e65656;
  9938. }
  9939. /* Alert box style 05 */
  9940. .alert-box-style-05 .alert {
  9941. background-color: transparent;
  9942. padding-left: 0;
  9943. padding-right: 0;
  9944. border: none;
  9945. border-bottom: 2px solid;
  9946. color: var(--dark-gray);
  9947. padding: 10px 0;
  9948. -webkit-border-radius: 0px;
  9949. border-radius: 0px;
  9950. }
  9951. .alert-box-style-05 .alert.alert-success {
  9952. border-color: #54b783;
  9953. }
  9954. .alert-box-style-05 .alert.alert-info {
  9955. border-color: #4278bb;
  9956. }
  9957. .alert-box-style-05 .alert.alert-warning {
  9958. border-color: #e2ad4b;
  9959. }
  9960. .alert-box-style-05 .alert.alert-danger {
  9961. border-color: #e65656;
  9962. }
  9963. /* Blockquote */
  9964. blockquote footer {
  9965. padding: 0;
  9966. }
  9967. /* Blockquote style 05 */
  9968. .blockquote-style-04 .blockquote-img img {
  9969. margin-top: -114px;
  9970. }
  9971. .blockquote-style-04 .blockquote-content {
  9972. padding: 5% 0 5% 26%;
  9973. margin-left: -8vw;
  9974. -webkit-border-radius: 50px 50px 125px 50px;
  9975. border-radius: 50px 50px 125px 50px;
  9976. }
  9977. /* Use for mac desktop pc */
  9978. @media only screen and (min-width: 1921px) {
  9979. .blockquote-style-04 .blockquote-content {
  9980. margin-left: -6vw;
  9981. }
  9982. }
  9983. /* Button */
  9984. .btn-box-shadow {
  9985. -webkit-box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
  9986. box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
  9987. -webkit-transition: all 0.3s cubic-bezier(0.2, 0, 0.3, 1);
  9988. transition: all 0.3s cubic-bezier(0.2, 0, 0.3, 1);
  9989. }
  9990. .btn-box-shadow:hover {
  9991. -webkit-box-shadow: 0 8px 30px 0 rgba(0, 0, 0, 0.15);
  9992. box-shadow: 0 8px 30px 0 rgba(0, 0, 0, 0.15);
  9993. -webkit-transform: translate3d(0, -2px, 0);
  9994. transform: translate3d(0, -2px, 0);
  9995. }
  9996. .btn-check:checked + .btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check) + .btn:active {
  9997. border-color: initial;
  9998. color: initial;
  9999. }
  10000. .btn {
  10001. display: inline-block;
  10002. border: 2px solid transparent;
  10003. border-radius: 0;
  10004. text-transform: uppercase;
  10005. letter-spacing: 0.5px;
  10006. width: auto;
  10007. font-family: var(--alt-font);
  10008. font-weight: 500;
  10009. -webkit-transition: all 300ms ease-in-out;
  10010. transition: all 300ms ease-in-out;
  10011. }
  10012. .btn:focus {
  10013. -webkit-box-shadow: none;
  10014. box-shadow: none;
  10015. }
  10016. .btn:hover {
  10017. background-color: inherit;
  10018. }
  10019. .btn i {
  10020. position: relative;
  10021. margin-left: 6px;
  10022. }
  10023. .btn.btn-extra-large {
  10024. font-size: 16px;
  10025. padding: 24px 46px;
  10026. }
  10027. .btn.btn-large {
  10028. font-size: 14px;
  10029. padding: 18px 34px;
  10030. }
  10031. .btn.btn-medium {
  10032. font-size: 13px;
  10033. padding: 16px 30px;
  10034. }
  10035. .btn.btn-small {
  10036. font-size: 12px;
  10037. padding: 13px 26px;
  10038. }
  10039. .btn.btn-very-small {
  10040. font-size: 11px;
  10041. padding: 10px 20px;
  10042. }
  10043. .btn.btn-rounded.btn-extra-large {
  10044. padding: 18px 46px;
  10045. }
  10046. .btn.btn-rounded.btn-large {
  10047. padding: 14px 36px;
  10048. }
  10049. .btn.btn-rounded.btn-medium {
  10050. padding: 12px 32px;
  10051. }
  10052. .btn.btn-rounded.btn-small {
  10053. padding: 10px 26px;
  10054. }
  10055. .btn.btn-rounded.btn-very-small {
  10056. padding: 8px 20px;
  10057. }
  10058. .btn.btn-rounded.btn-rounded {
  10059. -webkit-border-radius: 50px;
  10060. border-radius: 50px;
  10061. }
  10062. .btn.btn-round-edge {
  10063. -webkit-border-radius: 4px;
  10064. border-radius: 4px;
  10065. }
  10066. .btn.btn-round-edge-small {
  10067. -webkit-border-radius: 2px;
  10068. border-radius: 2px;
  10069. }
  10070. .btn.btn-link {
  10071. padding: 0 0 2px;
  10072. position: relative;
  10073. text-decoration: none;
  10074. border: 0;
  10075. border-bottom: 2px solid;
  10076. letter-spacing: 0;
  10077. background-color: transparent;
  10078. }
  10079. .btn.btn-link.thin {
  10080. border-bottom: 1px solid;
  10081. }
  10082. .btn.btn-link:hover {
  10083. opacity: 0.7;
  10084. }
  10085. .btn.btn-link:focus-visible {
  10086. box-shadow: none;
  10087. }
  10088. .btn.btn-link-gradient {
  10089. padding: 0 0 3px !important;
  10090. position: relative;
  10091. border: 0;
  10092. background-color: transparent;
  10093. }
  10094. .btn.btn-link-gradient > span {
  10095. position: absolute;
  10096. bottom: 0;
  10097. left: 0;
  10098. height: 2px;
  10099. width: 100%;
  10100. }
  10101. .btn.btn-link-gradient.thin span {
  10102. height: 1px;
  10103. }
  10104. .btn.btn-link-gradient.expand span {
  10105. width: 50%;
  10106. -webkit-transition: all 0.3s ease;
  10107. transition: all 0.3s ease;
  10108. }
  10109. .btn.btn-link-gradient:hover {
  10110. opacity: 0.7;
  10111. }
  10112. .btn.btn-link-gradient:hover.expand:hover span {
  10113. width: 100%;
  10114. }
  10115. .btn.btn-expand {
  10116. position: relative;
  10117. z-index: 1;
  10118. }
  10119. .btn.btn-expand span {
  10120. position: absolute;
  10121. top: 0;
  10122. left: 0;
  10123. width: 50%;
  10124. height: 100%;
  10125. z-index: -1;
  10126. -webkit-transition: 0.3s;
  10127. transition: 0.3s;
  10128. }
  10129. .btn.btn-expand:hover, .btn.btn-expand:active {
  10130. border-color: transparent;
  10131. }
  10132. .btn.btn-expand:hover span, .btn.btn-expand:active span {
  10133. width: 100%;
  10134. }
  10135. .btn.btn-expand-ltr {
  10136. position: relative;
  10137. z-index: 1;
  10138. background-color: transparent;
  10139. border: 0;
  10140. color: initial;
  10141. }
  10142. .btn.btn-expand-ltr:active {
  10143. background-color: transparent;
  10144. border: 0;
  10145. color: initial;
  10146. }
  10147. .btn.btn-expand-ltr span {
  10148. border-radius: 50px;
  10149. position: absolute;
  10150. top: 50%;
  10151. left: 0;
  10152. z-index: -1;
  10153. -webkit-transition: 0.3s;
  10154. transition: 0.3s;
  10155. -webkit-transform: translateY(-50%);
  10156. transform: translateY(-50%);
  10157. }
  10158. .btn.btn-expand-ltr:hover span {
  10159. width: 100% !important;
  10160. }
  10161. .btn.btn-expand-ltr.btn-extra-large {
  10162. padding: 18px 28px;
  10163. }
  10164. .btn.btn-expand-ltr.btn-extra-large span {
  10165. width: 60px;
  10166. height: 60px;
  10167. }
  10168. .btn.btn-expand-ltr.btn-large {
  10169. padding: 14px 26px;
  10170. }
  10171. .btn.btn-expand-ltr.btn-large span {
  10172. width: 50px;
  10173. height: 50px;
  10174. }
  10175. .btn.btn-expand-ltr.btn-medium {
  10176. padding: 12px 24px;
  10177. }
  10178. .btn.btn-expand-ltr.btn-medium span {
  10179. width: 44px;
  10180. height: 44px;
  10181. }
  10182. .btn.btn-expand-ltr.btn-small {
  10183. padding: 10px 22px;
  10184. }
  10185. .btn.btn-expand-ltr.btn-small span {
  10186. width: 40px;
  10187. height: 40px;
  10188. }
  10189. .btn.btn-expand-ltr.btn-very-small {
  10190. padding: 8px 18px;
  10191. }
  10192. .btn.btn-expand-ltr.btn-very-small span {
  10193. width: 38px;
  10194. height: 38px;
  10195. }
  10196. .btn.btn-hover-animation-switch.btn-link {
  10197. border-bottom: 0;
  10198. padding-bottom: 0;
  10199. }
  10200. .btn.btn-hover-animation-switch.btn-link:hover {
  10201. opacity: 1;
  10202. }
  10203. .btn.btn-hover-animation-switch > span {
  10204. display: inline-flex;
  10205. align-items: center;
  10206. }
  10207. .btn.btn-hover-animation-switch .btn-text {
  10208. margin-left: -13px;
  10209. position: relative;
  10210. z-index: 3;
  10211. transition: transform 0.6s 0.125s cubic-bezier(0.1, 0.75, 0.25, 1);
  10212. }
  10213. .btn.btn-hover-animation-switch .btn-icon {
  10214. margin-left: 6px;
  10215. position: relative;
  10216. transition: opacity 0.4s 0.25s, transform 0.6s 0.25s;
  10217. transition-timing-function: cubic-bezier(0.1, 0.75, 0.25, 1);
  10218. line-height: 0;
  10219. z-index: 3;
  10220. }
  10221. .btn.btn-hover-animation-switch .btn-icon i {
  10222. margin: 0;
  10223. line-height: 0;
  10224. }
  10225. .btn.btn-hover-animation-switch .btn-icon + .btn-icon {
  10226. order: -2;
  10227. opacity: 0;
  10228. transition-delay: 0s;
  10229. margin-left: 0;
  10230. -webkit-transform: translateX(-10px);
  10231. transform: translateX(-10px);
  10232. }
  10233. .btn.btn-hover-animation-switch:hover .btn-text {
  10234. transition-delay: 0.1s;
  10235. transform: translateX(23px);
  10236. }
  10237. .btn.btn-hover-animation-switch:hover .btn-icon {
  10238. transition-delay: 0s;
  10239. transform: translateX(10px);
  10240. opacity: 0;
  10241. }
  10242. .btn.btn-hover-animation-switch:hover .btn-icon + .btn-icon {
  10243. opacity: 1;
  10244. transform: translateX(0);
  10245. transition-delay: 0.225s;
  10246. }
  10247. .btn.btn-hover-animation-switch.btn-icon-left .btn-text {
  10248. margin-right: -15px;
  10249. margin-left: 0px;
  10250. position: relative;
  10251. z-index: 3;
  10252. }
  10253. .btn.btn-hover-animation-switch.btn-icon-left .btn-icon {
  10254. opacity: 0;
  10255. margin-left: 0;
  10256. transition-delay: 0s;
  10257. -webkit-transform: translateX(10px);
  10258. transform: translateX(10px);
  10259. }
  10260. .btn.btn-hover-animation-switch.btn-icon-left .btn-icon + .btn-icon {
  10261. opacity: 1;
  10262. margin-left: 0;
  10263. margin-right: 6px;
  10264. transition: opacity 0.4s 0.25s, transform 0.6s 0.25s;
  10265. transition-timing-function: cubic-bezier(0.1, 0.75, 0.25, 1);
  10266. -webkit-transform: translateX(0px);
  10267. transform: translateX(0px);
  10268. }
  10269. .btn.btn-hover-animation-switch.btn-icon-left:hover .btn-text {
  10270. transition-delay: 0.1s;
  10271. transform: translateX(-20px);
  10272. }
  10273. .btn.btn-hover-animation-switch.btn-icon-left:hover .btn-icon {
  10274. transform: translateX(0px);
  10275. opacity: 1;
  10276. transition-delay: 0.225s;
  10277. }
  10278. .btn.btn-hover-animation-switch.btn-icon-left:hover .btn-icon + .btn-icon {
  10279. opacity: 0;
  10280. transition-delay: 0s;
  10281. transform: translateX(-10px);
  10282. }
  10283. .btn.btn-hover-animation.btn-link {
  10284. border-bottom: 0;
  10285. padding-bottom: 0;
  10286. }
  10287. .btn.btn-hover-animation.btn-link:hover {
  10288. opacity: 1;
  10289. }
  10290. .btn.btn-hover-animation > span {
  10291. display: inline-flex;
  10292. align-items: center;
  10293. }
  10294. .btn.btn-hover-animation .btn-text {
  10295. margin-left: 0px;
  10296. position: relative;
  10297. z-index: 3;
  10298. transition: transform 0.5s;
  10299. }
  10300. .btn.btn-hover-animation .btn-icon {
  10301. display: inline-flex;
  10302. align-items: center;
  10303. margin-left: -24px;
  10304. }
  10305. .btn.btn-hover-animation .btn-icon i {
  10306. display: inline-block;
  10307. opacity: 0;
  10308. top: 0;
  10309. transform: translateX(0.24px);
  10310. transition: opacity 0.25s, transform 0.5s;
  10311. }
  10312. .btn.btn-hover-animation:hover .btn-text {
  10313. -webkit-transform: translateX(-12px);
  10314. transform: translateX(-12px);
  10315. }
  10316. .btn.btn-hover-animation:hover .btn-icon i {
  10317. opacity: 1;
  10318. -webkit-transform: translateX(12px);
  10319. transform: translateX(12px);
  10320. }
  10321. .btn.btn-hover-animation:active {
  10322. border-color: transparent !important;
  10323. }
  10324. .btn.btn-hover-animation.btn-icon-left .btn-icon {
  10325. margin-right: -24px;
  10326. margin-left: 0;
  10327. }
  10328. .btn.btn-hover-animation.btn-icon-left .btn-icon i {
  10329. transform: translateX(0.24px);
  10330. }
  10331. .btn.btn-hover-animation.btn-icon-left .btn-text {
  10332. margin-right: 0;
  10333. margin-left: 0;
  10334. }
  10335. .btn.btn-hover-animation.btn-icon-left:hover .btn-text {
  10336. -webkit-transform: translateX(15px);
  10337. transform: translateX(15px);
  10338. }
  10339. .btn.btn-hover-animation.btn-icon-left:hover .btn-icon i {
  10340. opacity: 1;
  10341. -webkit-transform: translateX(-20px);
  10342. transform: translateX(-20px);
  10343. }
  10344. .btn.btn-slide-up span {
  10345. -webkit-transform: translateY(100%);
  10346. transform: translateY(100%);
  10347. }
  10348. .btn.btn-slide-down span {
  10349. -webkit-transform: translateY(-100%);
  10350. transform: translateY(-100%);
  10351. }
  10352. .btn.btn-slide-left span {
  10353. -webkit-transform: translateX(100%);
  10354. transform: translateX(100%);
  10355. }
  10356. .btn.btn-slide-right span {
  10357. -webkit-transform: translateX(-100%);
  10358. transform: translateX(-100%);
  10359. }
  10360. .btn.btn-slide-up, .btn.btn-slide-down, .btn.btn-slide-left, .btn.btn-slide-right {
  10361. position: relative;
  10362. z-index: 1;
  10363. overflow: hidden;
  10364. }
  10365. .btn.btn-slide-up span, .btn.btn-slide-down span, .btn.btn-slide-left span, .btn.btn-slide-right span {
  10366. position: absolute;
  10367. height: 100%;
  10368. width: 102%;
  10369. z-index: -1;
  10370. left: -2px;
  10371. top: 0;
  10372. -webkit-transition: 0.3s;
  10373. transition: 0.3s;
  10374. }
  10375. .btn.btn-slide-up:hover span, .btn.btn-slide-down:hover span, .btn.btn-slide-left:hover span, .btn.btn-slide-right:hover span {
  10376. -webkit-transform: translateY(0);
  10377. transform: translateY(0);
  10378. }
  10379. .btn.btn-radius {
  10380. -webkit-transition: all 0.5s;
  10381. transition: all 0.5s;
  10382. }
  10383. .btn.btn-radius:hover {
  10384. -webkit-border-radius: 10px;
  10385. border-radius: 10px;
  10386. }
  10387. .btn.arrow-bounce-right {
  10388. position: relative;
  10389. }
  10390. .btn.arrow-bounce-right:before {
  10391. content: "\f108";
  10392. font-family: "Font Awesome 5 Free";
  10393. position: absolute;
  10394. top: inherit;
  10395. left: 80%;
  10396. transition: all 0.3s;
  10397. opacity: 0;
  10398. font-weight: 900;
  10399. margin-top: 3px;
  10400. }
  10401. .btn.arrow-bounce-right:hover:before {
  10402. left: 85%;
  10403. opacity: 1;
  10404. }
  10405. .btn.underline-on-hover {
  10406. position: relative;
  10407. padding: 0 0 2px;
  10408. border: none;
  10409. opacity: 1 !important;
  10410. }
  10411. .btn.underline-on-hover:after {
  10412. position: absolute;
  10413. top: 100%;
  10414. left: 0;
  10415. width: 100%;
  10416. border-bottom: 2px solid;
  10417. content: "";
  10418. opacity: 0;
  10419. -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  10420. transition: opacity 0.3s, transform 0.3s;
  10421. -webkit-transform: translateY(7px);
  10422. transform: translateY(7px);
  10423. }
  10424. .btn.underline-on-hover:hover:after {
  10425. opacity: 1;
  10426. -webkit-transform: translateY(0);
  10427. transform: translateY(0);
  10428. }
  10429. .btn.underline-on-hover.btn-medium, .btn.underline-on-hover.btn-small, .btn.underline-on-hover.btn-very-small {
  10430. padding: 0 0 3px;
  10431. }
  10432. .btn.hover-text-dark {
  10433. -webkit-transition: all 0.3s linear;
  10434. transition: all 0.3s linear;
  10435. margin: 0;
  10436. padding: 0;
  10437. position: relative;
  10438. border-bottom: none;
  10439. opacity: 0.4;
  10440. display: inline-block;
  10441. }
  10442. .btn.hover-text-dark:after {
  10443. position: absolute;
  10444. top: 0;
  10445. left: 0;
  10446. width: 100%;
  10447. display: block;
  10448. content: attr(data-hover);
  10449. max-height: 0;
  10450. overflow: hidden;
  10451. -webkit-transition: max-height 0.5s;
  10452. transition: max-height 0.5s;
  10453. }
  10454. .btn.hover-text-dark:hover {
  10455. opacity: 1;
  10456. }
  10457. .btn.hover-text-dark:hover:after {
  10458. max-height: 100%;
  10459. }
  10460. .btn.hover-text-light {
  10461. -webkit-transition: all 0.3s linear;
  10462. transition: all 0.3s linear;
  10463. margin: 0;
  10464. padding: 0;
  10465. position: relative;
  10466. border-bottom: none;
  10467. opacity: 1;
  10468. display: inline-block;
  10469. }
  10470. .btn.hover-text-light:after {
  10471. position: absolute;
  10472. top: 0;
  10473. left: 0;
  10474. width: 100%;
  10475. display: block;
  10476. content: attr(data-hover);
  10477. max-height: 0;
  10478. overflow: hidden;
  10479. -webkit-transition: max-height 0.5s;
  10480. transition: max-height 0.5s;
  10481. }
  10482. .btn.hover-text-light:hover {
  10483. opacity: 0.6;
  10484. }
  10485. .btn.hover-text-light:hover:after {
  10486. max-height: 100%;
  10487. }
  10488. .btn.btn-base-color {
  10489. background-color: var(--base-color);
  10490. color: var(--white);
  10491. }
  10492. .btn.btn-base-color:hover, .btn.btn-base-color:active {
  10493. background-color: transparent;
  10494. border-color: var(--base-color);
  10495. color: var(--base-color);
  10496. }
  10497. .btn.btn-dark-gray {
  10498. background-color: var(--dark-gray);
  10499. color: var(--white);
  10500. }
  10501. .btn.btn-dark-gray:hover, .btn.btn-dark-gray:active {
  10502. background-color: transparent;
  10503. border-color: var(--dark-gray);
  10504. color: var(--dark-gray);
  10505. }
  10506. .btn.btn-black {
  10507. background-color: var(--black);
  10508. color: var(--white);
  10509. }
  10510. .btn.btn-black:hover, .btn.btn-black:active {
  10511. background-color: transparent;
  10512. border-color: var(--black);
  10513. color: var(--black);
  10514. }
  10515. .btn.btn-white {
  10516. background-color: var(--white);
  10517. color: var(--dark-gray);
  10518. }
  10519. .btn.btn-white:hover, .btn.btn-white:active {
  10520. background-color: transparent;
  10521. border-color: var(--white);
  10522. color: var(--white);
  10523. }
  10524. .btn.btn-cornflower-blue {
  10525. background-color: var(--cornflower-blue);
  10526. color: var(--white);
  10527. }
  10528. .btn.btn-cornflower-blue:hover, .btn.btn-cornflower-blue:active {
  10529. background-color: transparent;
  10530. border-color: var(--cornflower-blue);
  10531. color: var(--cornflower-blue);
  10532. }
  10533. .btn.btn-jade {
  10534. background-color: var(--jade);
  10535. color: var(--white);
  10536. }
  10537. .btn.btn-jade:hover, .btn.btn-jade:active {
  10538. background-color: transparent;
  10539. border-color: var(--jade);
  10540. color: var(--jade);
  10541. }
  10542. .btn.btn-transparent-black {
  10543. background-color: transparent;
  10544. border-color: var(--black);
  10545. color: var(--black);
  10546. }
  10547. .btn.btn-transparent-black:hover, .btn.btn-transparent-black:active {
  10548. background-color: var(--black);
  10549. border-color: var(--black);
  10550. color: var(--white);
  10551. }
  10552. .btn.btn-transparent-white {
  10553. background-color: transparent;
  10554. border-color: var(--white);
  10555. color: var(--white);
  10556. }
  10557. .btn.btn-transparent-white:hover, .btn.btn-transparent-white:active {
  10558. background-color: var(--white);
  10559. border-color: var(--white);
  10560. color: var(--dark-gray);
  10561. }
  10562. .btn.btn-transparent-white-light {
  10563. background-color: transparent;
  10564. border-color: rgba(255, 255, 255, 0.3);
  10565. color: var(--white);
  10566. }
  10567. .btn.btn-transparent-white-light:hover, .btn.btn-transparent-white-light:active {
  10568. background-color: var(--white);
  10569. border-color: rgba(255, 255, 255, 0.3);
  10570. color: var(--dark-gray);
  10571. }
  10572. .btn.btn-transparent-base-color {
  10573. background-color: transparent;
  10574. border-color: var(--base-color);
  10575. color: var(--base-color);
  10576. }
  10577. .btn.btn-transparent-base-color:hover, .btn.btn-transparent-base-color:active {
  10578. background-color: var(--base-color);
  10579. border-color: var(--base-color);
  10580. color: var(--white);
  10581. }
  10582. .btn.btn-transparent-dark-gray {
  10583. background-color: transparent;
  10584. border-color: var(--dark-gray);
  10585. color: var(--dark-gray);
  10586. }
  10587. .btn.btn-transparent-dark-gray:hover, .btn.btn-transparent-dark-gray:active {
  10588. background-color: var(--dark-gray);
  10589. border-color: var(--dark-gray);
  10590. color: var(--white);
  10591. }
  10592. .btn.btn-transparent-light-gray {
  10593. background-color: transparent;
  10594. border-color: var(--extra-medium-gray);
  10595. color: var(--dark-gray);
  10596. }
  10597. .btn.btn-transparent-light-gray:hover, .btn.btn-transparent-light-gray:active {
  10598. background-color: var(--dark-gray);
  10599. border-color: var(--dark-gray);
  10600. color: var(--white);
  10601. }
  10602. .btn.btn-double-border.btn-extra-large {
  10603. padding: 0;
  10604. }
  10605. .btn.btn-double-border.btn-extra-large > span {
  10606. padding: 24px 50px;
  10607. }
  10608. .btn.btn-double-border.btn-large {
  10609. padding: 0;
  10610. }
  10611. .btn.btn-double-border.btn-large > span {
  10612. padding: 18px 42px;
  10613. }
  10614. .btn.btn-double-border.btn-medium {
  10615. padding: 0;
  10616. }
  10617. .btn.btn-double-border.btn-medium > span {
  10618. padding: 16px 34px;
  10619. }
  10620. .btn.btn-double-border.btn-small {
  10621. padding: 0;
  10622. }
  10623. .btn.btn-double-border.btn-small > span {
  10624. padding: 13px 32px;
  10625. }
  10626. .btn.btn-double-border.btn-very-small {
  10627. padding: 0;
  10628. }
  10629. .btn.btn-double-border.btn-very-small > span {
  10630. padding: 10px 22px;
  10631. }
  10632. .btn.btn-double-border > span {
  10633. display: inline-flex;
  10634. align-items: center;
  10635. position: relative;
  10636. overflow: hidden;
  10637. }
  10638. .btn.btn-double-border .btn-double-text {
  10639. transition: opacity 0.65s, transform 0.65s;
  10640. transition-timing-function: cubic-bezier(0.15, 0.85, 0.31, 1);
  10641. }
  10642. .btn.btn-double-border .btn-double-text:before {
  10643. content: attr(data-text);
  10644. display: inline-block;
  10645. position: absolute;
  10646. white-space: nowrap;
  10647. top: 50%;
  10648. opacity: 0;
  10649. left: 50%;
  10650. transform: translate(-50%, 100%);
  10651. transition: opacity 0.5s, transform 0.8s;
  10652. transition-timing-function: cubic-bezier(0.15, 0.85, 0.31, 1);
  10653. }
  10654. .btn.btn-double-border:hover .btn-double-text {
  10655. transform: translateY(-200%);
  10656. }
  10657. .btn.btn-double-border:hover .btn-double-text:before {
  10658. transform: translate(-50%, 150%);
  10659. opacity: 1;
  10660. }
  10661. .btn.btn-double-border:after {
  10662. display: inline-block;
  10663. content: "";
  10664. position: absolute;
  10665. border: 1px solid;
  10666. width: calc(100% - 8px);
  10667. height: calc(100% + 12px);
  10668. top: -6px;
  10669. left: 4px;
  10670. transform: translateX(0) translateY(0);
  10671. z-index: 0;
  10672. }
  10673. .btn.btn-double-border.btn-border-base-color {
  10674. position: relative;
  10675. border: 1px solid var(--base-color);
  10676. color: var(--base-color);
  10677. }
  10678. .btn.btn-double-border.btn-border-base-color:hover {
  10679. border-color: var(--dark-gray);
  10680. color: var(--dark-gray);
  10681. }
  10682. .btn.btn-double-border.btn-border-base-color:hover:after {
  10683. border-color: var(--dark-gray);
  10684. -webkit-transition: all 0.3s ease;
  10685. transition: all 0.3s ease;
  10686. }
  10687. .btn.btn-double-border.btn-border-base-color.hover-border-color-white:hover {
  10688. border-color: var(--white);
  10689. color: var(--white);
  10690. }
  10691. .btn.btn-double-border.btn-border-base-color.hover-border-color-white:hover:after {
  10692. border-color: var(--white);
  10693. -webkit-transition: all 0.3s ease;
  10694. transition: all 0.3s ease;
  10695. }
  10696. .btn.btn-double-border.btn-border-color-dark-gray {
  10697. position: relative;
  10698. border: 1px solid var(--dark-gray);
  10699. color: var(--dark-gray);
  10700. }
  10701. .btn.btn-double-border.btn-border-color-dark-gray:hover {
  10702. border-color: var(--base-color);
  10703. color: var(--base-color);
  10704. }
  10705. .btn.btn-double-border.btn-border-color-dark-gray:hover:after {
  10706. border-color: var(--base-color);
  10707. -webkit-transition: all 0.3s ease;
  10708. transition: all 0.3s ease;
  10709. }
  10710. .btn.btn-double-border.btn-border-color-white {
  10711. position: relative;
  10712. border: 1px solid var(--white);
  10713. color: var(--white);
  10714. }
  10715. .btn.btn-double-border.btn-border-color-white:hover {
  10716. border-color: var(--base-color);
  10717. color: var(--base-color);
  10718. }
  10719. .btn.btn-double-border.btn-border-color-white:hover:after {
  10720. border-color: var(--base-color);
  10721. -webkit-transition: all 0.3s ease;
  10722. transition: all 0.3s ease;
  10723. }
  10724. .btn.btn-double-border.btn-border-color-transparent-white {
  10725. position: relative;
  10726. border: 1px solid rgba(255, 255, 255, 0.2);
  10727. color: var(--white);
  10728. }
  10729. .btn.btn-double-border.btn-border-color-transparent-white:after {
  10730. border: 1px solid rgba(255, 255, 255, 0.2);
  10731. }
  10732. .btn.btn-double-border.btn-border-color-transparent-white:hover {
  10733. border-color: rgb(255, 255, 255);
  10734. color: var(--white);
  10735. }
  10736. .btn.btn-double-border.btn-border-color-transparent-white:hover:after {
  10737. border-color: rgb(255, 255, 255);
  10738. -webkit-transition: all 0.3s ease;
  10739. transition: all 0.3s ease;
  10740. }
  10741. .btn.btn-double-border.btn-border-color-transparent-dark {
  10742. position: relative;
  10743. border: 1px solid rgba(35, 35, 35, 0.2);
  10744. color: var(--dark-gray);
  10745. }
  10746. .btn.btn-double-border.btn-border-color-transparent-dark:after {
  10747. border: 1px solid rgba(35, 35, 35, 0.2);
  10748. }
  10749. .btn.btn-double-border.btn-border-color-transparent-dark:hover {
  10750. border-color: rgb(35, 35, 35);
  10751. color: var(--dark-gray);
  10752. }
  10753. .btn.btn-double-border.btn-border-color-transparent-dark:hover:after {
  10754. border-color: rgb(35, 35, 35);
  10755. -webkit-transition: all 0.3s ease;
  10756. transition: all 0.3s ease;
  10757. }
  10758. .btn.btn-switch-text.btn-extra-large {
  10759. padding: 0;
  10760. }
  10761. .btn.btn-switch-text.btn-extra-large > span {
  10762. padding: 22px 40px;
  10763. }
  10764. .btn.btn-switch-text.btn-large {
  10765. padding: 0;
  10766. }
  10767. .btn.btn-switch-text.btn-large > span {
  10768. padding: 18px 34px;
  10769. }
  10770. .btn.btn-switch-text.btn-medium {
  10771. padding: 0;
  10772. }
  10773. .btn.btn-switch-text.btn-medium > span {
  10774. padding: 16px 30px;
  10775. }
  10776. .btn.btn-switch-text.btn-small {
  10777. padding: 0;
  10778. }
  10779. .btn.btn-switch-text.btn-small > span {
  10780. padding: 13px 24px;
  10781. }
  10782. .btn.btn-switch-text.btn-very-small {
  10783. padding: 0;
  10784. }
  10785. .btn.btn-switch-text.btn-very-small > span {
  10786. padding: 10px 20px;
  10787. }
  10788. .btn.btn-switch-text > span {
  10789. display: inline-flex;
  10790. align-items: center;
  10791. position: relative;
  10792. overflow: hidden;
  10793. }
  10794. .btn.btn-switch-text .btn-double-text {
  10795. transition: opacity 0.65s, transform 0.85s;
  10796. transition-timing-function: cubic-bezier(0.15, 0.85, 0.31, 1);
  10797. }
  10798. .btn.btn-switch-text .btn-double-text:before {
  10799. content: attr(data-text);
  10800. display: inline-block;
  10801. position: absolute;
  10802. white-space: nowrap;
  10803. top: 50%;
  10804. opacity: 0;
  10805. left: 50%;
  10806. transform: translate(-50%, 100%);
  10807. transition: opacity 0.5s, transform 0.8s;
  10808. transition-timing-function: cubic-bezier(0.15, 0.85, 0.31, 1);
  10809. }
  10810. .btn.btn-switch-text:hover .btn-double-text, .btn.btn-switch-text:active .btn-double-text {
  10811. transform: translateY(-200%);
  10812. }
  10813. .btn.btn-switch-text:hover .btn-double-text:before, .btn.btn-switch-text:active .btn-double-text:before {
  10814. transform: translate(-50%, 150%);
  10815. opacity: 1;
  10816. }
  10817. .btn.btn-switch-text.purchase-envato.btn-small {
  10818. padding: 0;
  10819. }
  10820. .btn.btn-switch-text.purchase-envato.btn-small > span {
  10821. padding: 11px 30px;
  10822. }
  10823. .btn.base-color-hover:hover, .btn.base-color-hover:active {
  10824. background-color: var(--base-color);
  10825. color: var(--white);
  10826. }
  10827. .btn.white-hover:hover, .btn.white-hover:active {
  10828. background-color: var(--white);
  10829. color: var(--dark-gray);
  10830. }
  10831. .btn.black-hover:hover, .btn.black-hover:active {
  10832. background-color: var(--dark-gray);
  10833. color: var(--white);
  10834. }
  10835. .btn.btn-box-shadow.btn-white:hover, .btn.btn-box-shadow.btn-white:active {
  10836. background: var(--white);
  10837. color: var(--dark-gray);
  10838. }
  10839. .btn.btn-box-shadow.btn-black:hover, .btn.btn-box-shadow.btn-black:active {
  10840. background: var(--black);
  10841. color: var(--white);
  10842. }
  10843. .btn.btn-box-shadow.btn-dark-gray:hover, .btn.btn-box-shadow.btn-dark-gray:active {
  10844. background: var(--dark-gray);
  10845. color: var(--white);
  10846. }
  10847. .btn.btn-box-shadow.btn-base-color:hover, .btn.btn-box-shadow.btn-base-color:active {
  10848. background: var(--base-color);
  10849. color: var(--white);
  10850. }
  10851. .btn.btn-box-shadow.btn-cornflower-blue:hover, .btn.btn-box-shadow.btn-cornflower-blue:active {
  10852. background-color: var(--cornflower-blue);
  10853. color: var(--white);
  10854. }
  10855. .btn.btn-box-shadow.btn-jade:hover, .btn.btn-box-shadow.btn-jade:active {
  10856. background-color: var(--jade);
  10857. color: var(--white);
  10858. }
  10859. .btn.with-rounded {
  10860. position: relative;
  10861. }
  10862. .btn.with-rounded > span {
  10863. display: flex;
  10864. align-items: center;
  10865. justify-content: center;
  10866. width: 42px;
  10867. height: 42px;
  10868. position: absolute;
  10869. border-radius: 100%;
  10870. right: 8px;
  10871. top: 50%;
  10872. -webkit-transform: translateY(-50%);
  10873. transform: translateY(-50%);
  10874. -webkit-box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.35);
  10875. box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.35);
  10876. }
  10877. .btn.with-rounded > span i {
  10878. margin: 0;
  10879. }
  10880. .btn.with-rounded.btn-extra-large {
  10881. padding-right: 70px;
  10882. }
  10883. .btn.with-rounded.btn-large {
  10884. padding-right: 55px;
  10885. }
  10886. .btn.with-rounded.btn-large > span {
  10887. width: 34px;
  10888. height: 34px;
  10889. right: 8px;
  10890. }
  10891. .btn.with-rounded.btn-medium {
  10892. padding-right: 50px;
  10893. }
  10894. .btn.with-rounded.btn-medium > span {
  10895. width: 32px;
  10896. height: 32px;
  10897. right: 8px;
  10898. }
  10899. .btn.with-rounded.btn-small {
  10900. padding-right: 45px;
  10901. }
  10902. .btn.with-rounded.btn-small > span {
  10903. width: 28px;
  10904. height: 28px;
  10905. right: 6px;
  10906. }
  10907. .btn.with-rounded.btn-very-small {
  10908. padding-right: 37px;
  10909. }
  10910. .btn.with-rounded.btn-very-small > span {
  10911. width: 26px;
  10912. height: 26px;
  10913. right: 5px;
  10914. }
  10915. /* Button icon position */
  10916. .left-icon i {
  10917. margin-right: 6px;
  10918. margin-left: 0;
  10919. }
  10920. [class*=btn-transparent], [class*=" btn-transparent"] {
  10921. font-weight: 600;
  10922. }
  10923. /* Gradient button */
  10924. [class*=btn-gradient-] {
  10925. background-color: transparent;
  10926. border-color: transparent;
  10927. }
  10928. [class*=btn-gradient-]:active {
  10929. background-color: transparent;
  10930. border-color: transparent !important;
  10931. color: var(--white) !important;
  10932. }
  10933. [class*=btn-gradient-]:hover {
  10934. background-position: right center;
  10935. color: var(--white);
  10936. }
  10937. .btn-gradient-purple-pink {
  10938. background-image: linear-gradient(to right, #8b14b1, #d53d6e, #8b14b1);
  10939. background-size: 200% auto;
  10940. color: var(--white);
  10941. }
  10942. .btn-gradient-fast-pink-light-yellow {
  10943. background-image: linear-gradient(to right, #f7567f, #ffba83, #f7567f);
  10944. background-size: 200% auto;
  10945. color: var(--white);
  10946. }
  10947. .btn-gradient-pink-orange {
  10948. background-image: linear-gradient(to right, #de347f, #ef5f43, #de347f);
  10949. background-size: 200% auto;
  10950. color: var(--white);
  10951. }
  10952. .btn-gradient-fast-blue-purple {
  10953. background-image: linear-gradient(to right, #2a46f4, #bf25ff, #2a46f4);
  10954. background-size: 200% auto;
  10955. color: var(--white);
  10956. }
  10957. .btn-gradient-light-pink-light-purple {
  10958. background-image: linear-gradient(to right, #ed579b, #bc63e8, #ed579b);
  10959. background-size: 200% auto;
  10960. color: var(--white);
  10961. }
  10962. .btn-gradient-sky-blue-pink {
  10963. background-image: linear-gradient(to right, #5758df, #f77991, #5758df);
  10964. background-size: 200% auto;
  10965. color: var(--white);
  10966. }
  10967. .btn-dual .btn {
  10968. margin-left: 10px;
  10969. margin-right: 10px;
  10970. }
  10971. .btn-dual .btn.btn-link, .btn-dual .btn.btn-underline, .btn-dual .btn.btn-zoom, .btn-dual .btn.btn-link-gradient {
  10972. margin-left: 30px;
  10973. margin-right: 30px;
  10974. }
  10975. /* Blog button */
  10976. .categories-btn {
  10977. padding: 4px 12px;
  10978. -webkit-border-radius: 2px;
  10979. border-radius: 2px;
  10980. -webkit-transition: 0.3s;
  10981. transition: 0.3s;
  10982. margin-left: 5px;
  10983. display: inline-block;
  10984. font-size: 12px;
  10985. line-height: 20px;
  10986. }
  10987. /* Clients style 01 */
  10988. .clients-style-01 .client-image:hover > img {
  10989. -webkit-transform: scale(1.1);
  10990. transform: scale(1.1);
  10991. -webkit-filter: blur(3px);
  10992. filter: blur(3px);
  10993. }
  10994. /* Clients style 02 */
  10995. .clients-style-02 .swiper-slide {
  10996. -webkit-transition: all 350ms ease-in-out;
  10997. transition: all 350ms ease-in-out;
  10998. }
  10999. .clients-style-02 .swiper-slide:hover {
  11000. -webkit-filter: grayscale(1);
  11001. filter: grayscale(1);
  11002. }
  11003. .clients-style-02 .swiper-button-prev {
  11004. left: -110px;
  11005. }
  11006. .clients-style-02 .swiper-button-next {
  11007. right: -110px;
  11008. }
  11009. /* Clients style 03 */
  11010. .clients-style-03 .client-box {
  11011. -webkit-transition: all 350ms cubic-bezier(0.12, 0, 0.39, 0);
  11012. transition: all 350ms cubic-bezier(0.12, 0, 0.39, 0);
  11013. will-change: transform;
  11014. }
  11015. .clients-style-03 .client-box:hover {
  11016. -webkit-transform: scale(1.1);
  11017. transform: scale(1.1);
  11018. }
  11019. /* Clients style 04 */
  11020. .clients-style-04 .client-box:hover {
  11021. opacity: 0.5;
  11022. }
  11023. /* Clients style 05 */
  11024. .clients-style-05 .client-box {
  11025. position: relative;
  11026. -webkit-transition: 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  11027. transition: 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  11028. }
  11029. .clients-style-05 .client-box img {
  11030. z-index: 2;
  11031. position: relative;
  11032. }
  11033. .clients-style-05 .client-box:hover {
  11034. opacity: 0.5;
  11035. -webkit-transform: translateY(-8px);
  11036. transform: translateY(-8px);
  11037. }
  11038. /* Clients style 06 */
  11039. .clients-style-06 .client-box {
  11040. -webkit-transition: all 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  11041. transition: all 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  11042. }
  11043. .clients-style-06 .client-box img {
  11044. max-width: inherit;
  11045. }
  11046. .clients-style-06:hover .client-box {
  11047. opacity: 0.4;
  11048. }
  11049. .clients-style-06:hover .client-box:hover {
  11050. opacity: 1;
  11051. }
  11052. /* Clients style 07 */
  11053. .clients-style-07 .client-box .client-info {
  11054. position: absolute;
  11055. top: 0;
  11056. right: 0;
  11057. width: 100%;
  11058. height: 100%;
  11059. }
  11060. .clients-style-07 .client-box .client-info .client-content {
  11061. position: absolute;
  11062. bottom: 0;
  11063. right: 0;
  11064. -webkit-transition: all 0.5s cubic-bezier(0.77, 0, 0.175, 1);
  11065. transition: all 0.5s cubic-bezier(0.77, 0, 0.175, 1);
  11066. overflow: hidden;
  11067. }
  11068. .clients-style-07 .client-box .client-info .client-content .client-link {
  11069. position: absolute;
  11070. opacity: 0;
  11071. width: 100%;
  11072. height: 100%;
  11073. z-index: 2;
  11074. left: 0;
  11075. right: 0;
  11076. }
  11077. .clients-style-07 .client-box .client-info:hover .client-content {
  11078. margin: 0;
  11079. width: 100% !important;
  11080. height: 100% !important;
  11081. border-radius: 0;
  11082. }
  11083. .clients-style-07 .client-box .client-info:hover .client-content .client-icon {
  11084. opacity: 0;
  11085. visibility: hidden;
  11086. }
  11087. .clients-style-07 .client-box .client-info:hover .client-content .client-link {
  11088. opacity: 1;
  11089. -webkit-transition-delay: 0.5s;
  11090. transition-delay: 0.5s;
  11091. }
  11092. .clients-style-07 .client-box .client-info:hover .client-content .box-overlay {
  11093. opacity: 1;
  11094. visibility: visible;
  11095. }
  11096. /* Clients style 08 */
  11097. .clients-style-08 .client-box {
  11098. -webkit-transition: all 0.3s ease;
  11099. transition: all 0.3s ease;
  11100. opacity: 0.5;
  11101. }
  11102. .clients-style-08 .client-box:hover {
  11103. opacity: 1;
  11104. }
  11105. /* Columns */
  11106. .show-grid [class^=col-] {
  11107. background-color: #f5f5f5;
  11108. border: 1px solid rgba(0, 0, 0, 0.2);
  11109. margin-bottom: 15px;
  11110. padding-top: 10px;
  11111. padding-bottom: 10px;
  11112. text-align: center;
  11113. }
  11114. /* Contact form */
  11115. .select-style select {
  11116. background-image: url("../images/contact-form-down-arrow.jpg");
  11117. background-repeat: no-repeat;
  11118. background-position: top 25px right 30px;
  11119. cursor: pointer;
  11120. -webkit-appearance: none;
  11121. background-color: transparent;
  11122. }
  11123. .terms-condition-box label {
  11124. display: block;
  11125. }
  11126. .terms-condition-box input[type=checkbox] {
  11127. opacity: 0;
  11128. visibility: hidden;
  11129. position: absolute;
  11130. top: 4px;
  11131. left: 0;
  11132. }
  11133. .terms-condition-box input[type=checkbox]:checked + .box:after {
  11134. display: block;
  11135. }
  11136. .terms-condition-box input[type=checkbox].is-invalid + .box:before {
  11137. border-color: #dc3545;
  11138. }
  11139. .terms-condition-box .box {
  11140. position: relative;
  11141. padding-left: 30px;
  11142. cursor: pointer;
  11143. display: inline-block;
  11144. }
  11145. .terms-condition-box .box:before {
  11146. content: "";
  11147. width: 20px;
  11148. height: 20px;
  11149. background-color: transparent;
  11150. border: 1px solid var(--extra-medium-gray);
  11151. position: absolute;
  11152. top: 5px;
  11153. left: 0;
  11154. -webkit-border-radius: 4px;
  11155. border-radius: 4px;
  11156. }
  11157. .terms-condition-box .box:after {
  11158. position: absolute;
  11159. left: 7px;
  11160. top: 9px;
  11161. content: "";
  11162. width: 6px;
  11163. height: 10px;
  11164. display: none;
  11165. border: solid var(--dark-gray);
  11166. border-width: 0 2px 2px 0;
  11167. -webkit-transform: rotate(45deg);
  11168. -ms-transform: rotate(45deg);
  11169. transform: rotate(45deg);
  11170. }
  11171. /* Contact form style 01 */
  11172. .contact-form-style-01 input, .contact-form-style-01 textarea, .contact-form-style-01 select {
  11173. padding-left: 55px;
  11174. }
  11175. .contact-form-style-01 .form-group .form-icon {
  11176. position: absolute;
  11177. top: 50%;
  11178. -webkit-transform: translateY(-50%);
  11179. transform: translateY(-50%);
  11180. padding-top: 2px;
  11181. left: 25px;
  11182. }
  11183. .contact-form-style-01 .form-group.form-textarea .form-icon {
  11184. top: 12px;
  11185. -webkit-transform: translateY(0);
  11186. transform: translateY(0);
  11187. }
  11188. /* Contact form style 03 */
  11189. .contact-form-style-03 input, .contact-form-style-03 textarea {
  11190. outline: none;
  11191. border: none;
  11192. border-bottom: 1px solid;
  11193. background: transparent;
  11194. }
  11195. .contact-form-style-03 select {
  11196. outline: none;
  11197. border: none;
  11198. border-bottom: 1px solid;
  11199. }
  11200. .contact-form-style-03 input:focus, .contact-form-style-03 select:focus, .contact-form-style-03 textarea:focus, .contact-form-style-03 .form-control:focus {
  11201. border: 0;
  11202. border-bottom: 1px solid #c2c2c2;
  11203. }
  11204. .contact-form-style-03 textarea {
  11205. resize: none;
  11206. }
  11207. .contact-form-style-03 .form-group .form-icon {
  11208. position: absolute;
  11209. top: 50%;
  11210. right: 5px;
  11211. -webkit-transform: translateY(-50%);
  11212. transform: translateY(-50%);
  11213. }
  11214. .contact-form-style-03 .form-group.form-textarea .form-icon {
  11215. top: 10px;
  11216. -webkit-transform: translateY(0);
  11217. transform: translateY(0);
  11218. }
  11219. .contact-form-style-03 .form-control, .contact-form-style-03 .form-control.is-invalid, .contact-form-style-03 .was-validated .form-control:invalid {
  11220. background-position: right 35px center !important;
  11221. }
  11222. /* Contact form style 06 */
  11223. .contact-form-style-06 input, .contact-form-style-06 textarea {
  11224. color: var(--white);
  11225. }
  11226. .contact-form-style-06 input:focus, .contact-form-style-06 textarea:focus {
  11227. color: var(--white);
  11228. }
  11229. .contact-form-style-06 input::placeholder, .contact-form-style-06 textarea::placeholder {
  11230. color: var(--light-medium-gray);
  11231. }
  11232. .contact-form-style-06 .select-style select {
  11233. color: var(--light-medium-gray);
  11234. background-image: url("../images/contact-form-arrow-white.png");
  11235. background-position: top 25px right 20px;
  11236. padding-right: 45px;
  11237. }
  11238. .contact-form-style-06 .select-style select option {
  11239. color: var(--dark-gray);
  11240. }
  11241. /* Contact form style 07 */
  11242. .contact-form-style-07 input, .contact-form-style-07 textarea {
  11243. outline: none;
  11244. border: none;
  11245. border-bottom: 1px solid;
  11246. background: transparent;
  11247. }
  11248. .contact-form-style-07 select {
  11249. outline: none;
  11250. border: none;
  11251. border-bottom: 1px solid;
  11252. }
  11253. .contact-form-style-07 input:focus, .contact-form-style-07 select:focus, .contact-form-style-07 textarea:focus, .contact-form-style-07 .form-control:focus {
  11254. border: 0;
  11255. border-bottom: 1px solid #c2c2c2;
  11256. }
  11257. .contact-form-style-07 textarea {
  11258. resize: none;
  11259. }
  11260. .contact-form-style-07 .form-group .form-icon {
  11261. position: absolute;
  11262. top: 50%;
  11263. right: 5px;
  11264. -webkit-transform: translateY(-50%);
  11265. transform: translateY(-50%);
  11266. }
  11267. .contact-form-style-07 .form-group.form-textarea .form-icon {
  11268. top: 10px;
  11269. -webkit-transform: translateY(0);
  11270. transform: translateY(0);
  11271. }
  11272. .contact-form-style-07 .form-control, .contact-form-style-07 .form-control.is-invalid, .contact-form-style-07 .was-validated .form-control:invalid {
  11273. background-position: right 35px center !important;
  11274. }
  11275. .swiper-button-next, .swiper-button-prev {
  11276. color: var(--dark-gray);
  11277. }
  11278. .swiper-button-next:after, .swiper-button-prev:after {
  11279. display: none;
  11280. content: "";
  11281. }
  11282. /* Text slider 02 */
  11283. .text-slider-style-02 .swiper-slide {
  11284. opacity: 0.2;
  11285. -webkit-transition: 0.4s;
  11286. transition: 0.4s;
  11287. }
  11288. .text-slider-style-02 .swiper-slide.swiper-slide-active {
  11289. opacity: 1;
  11290. }
  11291. /* Text slider 03 */
  11292. .text-slider-style-03 .swiper-slide > img {
  11293. object-fit: cover;
  11294. height: 100%;
  11295. width: 100%;
  11296. }
  11297. /* Text slider 05 */
  11298. .text-slider-style-05 .swiper-slide {
  11299. -webkit-filter: grayscale(100%);
  11300. filter: grayscale(100%);
  11301. opacity: 0.3;
  11302. -webkit-transition: 0.4s;
  11303. transition: 0.4s;
  11304. }
  11305. .text-slider-style-05 .swiper-slide .services-box-style-01:hover img {
  11306. -webkit-transform: scale(1);
  11307. transform: scale(1);
  11308. }
  11309. .text-slider-style-05 .swiper-slide .services-box-style-01:hover .icon-box {
  11310. opacity: 0;
  11311. }
  11312. .text-slider-style-05 .swiper-slide.swiper-slide-next {
  11313. -webkit-filter: grayscale(0);
  11314. filter: grayscale(0);
  11315. opacity: 1;
  11316. }
  11317. .text-slider-style-05 .swiper-slide.swiper-slide-next .services-box-style-01 .icon-box {
  11318. opacity: 1;
  11319. }
  11320. /* Countdown style 01 */
  11321. .countdown-style-01 .counter-container {
  11322. display: -webkit-box;
  11323. display: -ms-flexbox;
  11324. display: flex;
  11325. }
  11326. .countdown-style-01 .counter-container .countdown-box {
  11327. font-family: var(--alt-font);
  11328. color: var(--dark-gray);
  11329. background-color: var(--white);
  11330. width: 130px;
  11331. min-height: 130px;
  11332. padding: 25px 20px 20px;
  11333. margin: 0 15px;
  11334. text-align: center;
  11335. -webkit-border-radius: 6px;
  11336. border-radius: 6px;
  11337. -webkit-box-shadow: 0 0 25px rgba(0, 0, 0, 0.05);
  11338. box-shadow: 0 0 25px rgba(0, 0, 0, 0.05);
  11339. display: -webkit-box;
  11340. display: -ms-flexbox;
  11341. display: flex;
  11342. -webkit-box-orient: vertical;
  11343. -webkit-box-direction: normal;
  11344. -ms-flex-direction: column;
  11345. flex-direction: column;
  11346. -webkit-box-align: center;
  11347. -ms-flex-align: center;
  11348. align-items: center;
  11349. -webkit-box-pack: center;
  11350. -ms-flex-pack: center;
  11351. justify-content: center;
  11352. }
  11353. .countdown-style-01 .counter-container .countdown-box .number {
  11354. font-size: 2.375rem;
  11355. line-height: 2.5rem;
  11356. font-weight: 600;
  11357. margin-bottom: 5px;
  11358. letter-spacing: -1px;
  11359. }
  11360. .countdown-style-01 .counter-container .countdown-box span {
  11361. font-size: 14px;
  11362. line-height: 14px;
  11363. color: var(--medium-gray);
  11364. text-transform: uppercase;
  11365. }
  11366. /* Countdown style 02 */
  11367. .countdown-style-02 .countdown-box {
  11368. position: relative;
  11369. width: 165px;
  11370. padding: 0 15px;
  11371. color: var(--white);
  11372. font-family: var(--alt-font);
  11373. display: inline-block;
  11374. text-align: center;
  11375. }
  11376. .countdown-style-02 .countdown-box:before {
  11377. content: ":";
  11378. position: absolute;
  11379. top: 50%;
  11380. right: -5px;
  11381. -webkit-transform: translateY(-50%);
  11382. transform: translateY(-50%);
  11383. color: var(--white);
  11384. text-align: center;
  11385. font-size: 3rem;
  11386. margin-top: -4px;
  11387. }
  11388. .countdown-style-02 .countdown-box:last-child:before {
  11389. display: none;
  11390. }
  11391. .countdown-style-02 .countdown-box .number {
  11392. font-size: 3.5rem;
  11393. line-height: 3.75rem;
  11394. font-weight: 600;
  11395. letter-spacing: -1px;
  11396. }
  11397. .countdown-style-02 .countdown-box span {
  11398. font-size: 15px;
  11399. line-height: 14px;
  11400. text-transform: uppercase;
  11401. position: absolute;
  11402. top: -26px;
  11403. left: 0;
  11404. right: 0;
  11405. color: var(--white);
  11406. font-weight: 500;
  11407. }
  11408. /* Countdown style 03 */
  11409. .countdown-style-03 .countdown-box {
  11410. width: 130px;
  11411. display: inline-block;
  11412. margin: 0 15px;
  11413. text-align: center;
  11414. }
  11415. .countdown-style-03 .countdown-box .number {
  11416. color: var(--dark-gray);
  11417. font-size: 4.3rem;
  11418. line-height: 4.3rem;
  11419. font-family: var(--alt-font);
  11420. letter-spacing: -1px;
  11421. font-weight: 700;
  11422. }
  11423. .countdown-style-03 .countdown-box span {
  11424. color: var(--medium-gray);
  11425. text-transform: uppercase;
  11426. font-size: 14px;
  11427. line-height: 16px;
  11428. font-weight: 500;
  11429. }
  11430. /* Countdown style 04 */
  11431. .countdown-style-04 .countdown-box {
  11432. width: 160px;
  11433. display: inline-block;
  11434. margin: 0 7px;
  11435. text-align: center;
  11436. position: relative;
  11437. }
  11438. .countdown-style-04 .countdown-box:before {
  11439. content: ":";
  11440. position: absolute;
  11441. top: 20px;
  11442. font-size: 2rem;
  11443. color: var(--white);
  11444. right: -10px;
  11445. margin-top: -5px;
  11446. font-weight: 400;
  11447. opacity: 0.7;
  11448. }
  11449. .countdown-style-04 .countdown-box:last-child:before {
  11450. display: none;
  11451. }
  11452. .countdown-style-04 .countdown-box .number {
  11453. color: #ffffff;
  11454. font-size: 4.5rem;
  11455. line-height: 4.5rem;
  11456. font-family: var(--alt-font);
  11457. font-weight: 600;
  11458. }
  11459. .countdown-style-04 .countdown-box span {
  11460. color: var(--very-light-gray);
  11461. font-size: 15px;
  11462. }
  11463. /* Counter style 03 */
  11464. .counter-style-03 .feature-box i {
  11465. -webkit-transition: 0.4s;
  11466. transition: 0.4s;
  11467. }
  11468. .counter-style-03 .feature-box:hover i {
  11469. -webkit-transform: translateY(-7px);
  11470. transform: translateY(-7px);
  11471. }
  11472. /* Counter style 04 */
  11473. .counter-style-04 .vertical-counter:after {
  11474. content: attr(data-text);
  11475. display: inline-block;
  11476. margin-left: 3px;
  11477. word-break: normal;
  11478. }
  11479. /* Counter style 06 */
  11480. .counter-style-06 .feature-box-content .counter-title {
  11481. position: absolute;
  11482. top: 50%;
  11483. left: 50%;
  11484. width: 100%;
  11485. -webkit-transform: translate(-50%, -50%);
  11486. transform: translate(-50%, -50%);
  11487. }
  11488. .counter-style-06 .feature-box-content:after {
  11489. content: "";
  11490. display: block;
  11491. height: 40%;
  11492. right: 0;
  11493. top: 50%;
  11494. width: 1px;
  11495. position: absolute;
  11496. -webkit-transform: translateY(-50%);
  11497. transform: translateY(-50%);
  11498. background-color: var(--extra-medium-gray);
  11499. }
  11500. .counter-style-06 .feature-box:last-child .feature-box-content:after {
  11501. display: none;
  11502. }
  11503. /* Counter style 07 */
  11504. .counter-style-07 .vertical-counter-number {
  11505. z-index: 1;
  11506. }
  11507. /* Vertical counter */
  11508. .vertical-counter-number {
  11509. overflow: hidden;
  11510. width: 100%;
  11511. height: auto;
  11512. }
  11513. .vertical-counter-number ul {
  11514. text-align: center;
  11515. margin: 0;
  11516. padding: 0;
  11517. list-style: none;
  11518. will-change: transform;
  11519. -webkit-transform: translateY(0);
  11520. transform: translateY(0);
  11521. }
  11522. /* Divider style 01 */
  11523. .divider-style-01 .divider-shadow:after, .divider-style-01 .divider-shadow:before {
  11524. flex: 1 1 auto;
  11525. -webkit-box-flex: 1 1 auto;
  11526. -ms-flex: 1 1 auto;
  11527. content: "";
  11528. height: 10px;
  11529. margin-top: 7px;
  11530. box-shadow: 0 6px 10px -10px #8c8b8b inset;
  11531. }
  11532. .divider-style-01 .divider-border:after, .divider-style-01 .divider-border:before {
  11533. flex: 1 1 auto;
  11534. -webkit-box-flex: 1 1 auto;
  11535. -ms-flex: 1 1 auto;
  11536. content: "";
  11537. height: 10px;
  11538. margin-top: 7px;
  11539. border-top: 1px solid #E4E4E4;
  11540. }
  11541. /* Divider style 02 */
  11542. .divider-style-02 .divider-dot {
  11543. position: relative;
  11544. }
  11545. .divider-style-02 .divider-dot span {
  11546. content: "";
  11547. position: absolute;
  11548. z-index: 1;
  11549. top: 50%;
  11550. left: 50%;
  11551. margin: -10px 0 0 -13px;
  11552. width: 25px;
  11553. height: 25px;
  11554. box-shadow: inset 0 0 0 6px white;
  11555. }
  11556. .divider-style-02 .divider-dot:after {
  11557. top: 0;
  11558. content: "";
  11559. height: 100%;
  11560. width: 1px;
  11561. flex: 1 1 auto;
  11562. -webkit-box-flex: 1 1 1px;
  11563. -ms-flex: 1 1 1px;
  11564. border-left: 1px solid #E4E4E4;
  11565. position: absolute;
  11566. left: 0;
  11567. right: 0;
  11568. margin: 0 auto;
  11569. }
  11570. /* Divider style 03 */
  11571. .divider-style-03.divider-style-03-01 {
  11572. border-top: 1px solid;
  11573. width: 100%;
  11574. }
  11575. .divider-style-03.divider-style-03-02 {
  11576. border-top: 1px dashed;
  11577. }
  11578. .divider-style-03.divider-style-03-03 {
  11579. border-top: 4px double;
  11580. }
  11581. .divider-style-03.divider-style-03-04 {
  11582. border-top: 2px dashed;
  11583. }
  11584. .divider-style-03.divider-style-03-05 {
  11585. border-top: 2px dotted;
  11586. }
  11587. /* First letter */
  11588. .first-letter {
  11589. float: left;
  11590. font-size: 4.5rem;
  11591. line-height: 4.5rem;
  11592. font-weight: 600;
  11593. text-align: center;
  11594. margin: 0 25px 0 0;
  11595. }
  11596. /* First letter block */
  11597. .first-letter-block {
  11598. font-size: 4.5rem;
  11599. line-height: 100px;
  11600. font-weight: 600;
  11601. width: 100px;
  11602. height: 100px;
  11603. margin: 8px 35px 0 0;
  11604. }
  11605. /* First letter round */
  11606. .first-letter-round {
  11607. -webkit-border-radius: 50%;
  11608. border-radius: 50%;
  11609. font-size: 3.5rem;
  11610. }
  11611. /* First letter big */
  11612. .first-letter-big {
  11613. float: left;
  11614. font-size: 9rem;
  11615. line-height: 9rem;
  11616. padding: 0;
  11617. text-align: center;
  11618. position: relative;
  11619. }
  11620. /* First letter small */
  11621. .first-letter-small {
  11622. font-size: 3.438rem;
  11623. line-height: 4rem;
  11624. font-weight: 600;
  11625. width: 65px;
  11626. height: 65px;
  11627. margin: 8px 30px 0 0;
  11628. }
  11629. /* Event style 02 */
  11630. .time-table {
  11631. display: -webkit-box;
  11632. display: flex;
  11633. -webkit-box-orient: horizontal;
  11634. -webkit-box-direction: normal;
  11635. flex-flow: row nowrap;
  11636. -webkit-box-align: stretch;
  11637. align-items: stretch;
  11638. -webkit-box-flex: 1;
  11639. flex: 1 0;
  11640. }
  11641. .time-table + .time-table .time-table-box {
  11642. border-top-width: 0 !important;
  11643. }
  11644. .time-table-box {
  11645. -webkit-box-align: stretch;
  11646. align-items: stretch;
  11647. text-align: center;
  11648. flex-basis: 12.5%;
  11649. padding: 30px 10px;
  11650. position: relative;
  11651. display: -webkit-box;
  11652. display: flex;
  11653. -webkit-box-orient: vertical;
  11654. -webkit-box-direction: normal;
  11655. flex-direction: column;
  11656. -webkit-box-pack: center;
  11657. justify-content: center;
  11658. min-height: 100px;
  11659. }
  11660. .time-table-box .inner-box {
  11661. display: -webkit-box;
  11662. display: flex;
  11663. -webkit-box-orient: vertical;
  11664. -webkit-box-direction: normal;
  11665. flex-direction: column;
  11666. -webkit-box-pack: center;
  11667. justify-content: center;
  11668. -webkit-box-flex: 1;
  11669. flex: 1 auto;
  11670. z-index: 9;
  11671. }
  11672. .time-table-box .inner-box > div {
  11673. line-height: initial;
  11674. margin-top: 7px;
  11675. }
  11676. .time-table-box + .time-table-box {
  11677. border-left-width: 0 !important;
  11678. }
  11679. .time-table-box + .time-table-box.name-box:before {
  11680. position: absolute;
  11681. content: "";
  11682. transition: opacity 0.3s;
  11683. opacity: 0;
  11684. display: inline-block;
  11685. width: 100%;
  11686. height: 100%;
  11687. top: 0;
  11688. left: 0;
  11689. background-color: var(--base-color);
  11690. }
  11691. .time-table-box + .time-table-box.name-box:hover .inner-box span, .time-table-box + .time-table-box.name-box:hover .inner-box div {
  11692. color: var(--white);
  11693. }
  11694. .time-table-box + .time-table-box.name-box:hover:before {
  11695. opacity: 1;
  11696. }
  11697. .time-table-box + .time-table-box.name-box:hover .hover-detail {
  11698. visibility: visible;
  11699. opacity: 1;
  11700. }
  11701. .time-table-box.day {
  11702. padding: 15px 10px;
  11703. min-height: 1px;
  11704. }
  11705. .time-table-box .hover-detail {
  11706. position: absolute;
  11707. left: 50%;
  11708. top: 100%;
  11709. padding: 25px 30px;
  11710. border-radius: 6px;
  11711. width: 250px;
  11712. z-index: 111;
  11713. opacity: 0;
  11714. visibility: hidden;
  11715. -webkit-transform: translateX(-50%);
  11716. -ms-transform: translateX(-50%);
  11717. transform: translateX(-50%);
  11718. -webkit-box-shadow: 0 0 60px rgba(0, 0, 0, 0.14);
  11719. box-shadow: 0 0 60px rgba(0, 0, 0, 0.14);
  11720. -webkit-transition: 0.05s;
  11721. transition: 0.05s;
  11722. }
  11723. .time-table-box .hover-detail:after {
  11724. content: "";
  11725. top: -21px;
  11726. left: 50%;
  11727. height: 0;
  11728. width: 0;
  11729. z-index: 9;
  11730. margin-left: -14px;
  11731. position: absolute;
  11732. pointer-events: none;
  11733. border: solid transparent;
  11734. border-width: 11px;
  11735. border-bottom-color: var(--white);
  11736. }
  11737. .time-table-box .hover-detail.hover-detail-left {
  11738. left: auto;
  11739. right: 0;
  11740. -webkit-transform: none;
  11741. -ms-transform: none;
  11742. transform: none;
  11743. }
  11744. .time-table-box .hover-detail.hover-detail-left:after {
  11745. right: 60px;
  11746. left: auto;
  11747. }
  11748. .time-table-box .hover-detail.hover-detail-top {
  11749. top: auto;
  11750. bottom: 100%;
  11751. }
  11752. .time-table-box .hover-detail.hover-detail-top:after {
  11753. top: auto;
  11754. bottom: -21px;
  11755. border-top-color: var(--white);
  11756. border-bottom-color: transparent;
  11757. }
  11758. .name-box span {
  11759. line-height: 26px;
  11760. transition: 0.2s;
  11761. }
  11762. .name-box div {
  11763. line-height: 26px;
  11764. transition: 0.2s;
  11765. }
  11766. /* Event style 03 */
  11767. .event-style-03 .nav-tabs {
  11768. border-radius: 6px 6px 0 0px;
  11769. }
  11770. .event-style-03 .nav-tabs .nav-link {
  11771. color: var(--white);
  11772. line-height: normal;
  11773. padding: 17px 15px 20px;
  11774. border: 0;
  11775. border-radius: 0;
  11776. }
  11777. .event-style-03 .nav-tabs .nav-link.active, .event-style-03 .nav-tabs .nav-link.show, .event-style-03 .nav-tabs .nav-link:hover {
  11778. color: var(--dark-gray);
  11779. background-color: var(--white);
  11780. }
  11781. .event-style-03 .nav-tabs > li.nav-item {
  11782. padding: 0;
  11783. width: 100%;
  11784. }
  11785. .event-style-03 .nav-tabs > li.nav-item:not(:last-child) {
  11786. border-right: 1px solid rgba(0, 0, 0, 0.1);
  11787. }
  11788. .event-style-03 .accordion .accordion-title .event-time {
  11789. min-width: 354px;
  11790. }
  11791. .event-style-03 .accordion .accordion-title .event-time i {
  11792. position: static;
  11793. -webkit-transform: none;
  11794. transform: none;
  11795. }
  11796. .event-style-03 .accordion .trainer-box {
  11797. flex: 0 0 auto;
  11798. width: 270px;
  11799. margin-right: 85px;
  11800. margin-top: 15px;
  11801. }
  11802. /* Text image mask */
  11803. .image-mask {
  11804. -webkit-text-fill-color: transparent;
  11805. -webkit-background-clip: text;
  11806. }
  11807. /* Fancy text box style 01 */
  11808. .fancy-text-box-style-01 {
  11809. border-bottom: 1px solid;
  11810. border-right: 1px solid;
  11811. overflow: hidden;
  11812. }
  11813. .fancy-text-box-style-01 .text-box-wrapper .text-box, .fancy-text-box-style-01 .text-box-wrapper .text-box-hover {
  11814. display: block;
  11815. width: 100%;
  11816. -webkit-transition: all 0.6s cubic-bezier(0.12, 0, 0.39, 0);
  11817. transition: all 0.6s cubic-bezier(0.12, 0, 0.39, 0);
  11818. }
  11819. .fancy-text-box-style-01 .text-box-wrapper .text-box-hover {
  11820. opacity: 0;
  11821. position: absolute;
  11822. }
  11823. .fancy-text-box-style-01 .text-box-wrapper:hover .text-box {
  11824. opacity: 0;
  11825. visibility: hidden;
  11826. -webkit-transform: translateY(-100%);
  11827. transform: translateY(-100%);
  11828. -webkit-transition: all 0.6s cubic-bezier(0.12, 0, 0.39, 0);
  11829. transition: all 0.6s cubic-bezier(0.12, 0, 0.39, 0);
  11830. }
  11831. .fancy-text-box-style-01 .text-box-wrapper:hover .text-box-hover {
  11832. opacity: 1;
  11833. -webkit-transform: translateY(-100%);
  11834. transform: translateY(-100%);
  11835. -webkit-transition: all 0.6s cubic-bezier(0.12, 0, 0.39, 0);
  11836. transition: all 0.6s cubic-bezier(0.12, 0, 0.39, 0);
  11837. }
  11838. .fancy-text-box-style-01:last-child {
  11839. border-right: 0;
  11840. }
  11841. /* Google map */
  11842. #map {
  11843. height: 550px;
  11844. }
  11845. .arrow_box {
  11846. width: 22px;
  11847. height: 22px;
  11848. border-radius: 100%;
  11849. -webkit-border-top-left-radius: 100%;
  11850. -webkit-border-top-right-radius: 100%;
  11851. -webkit-border-bottom-right-radius: 100%;
  11852. -webkit-border-bottom-left-radius: 100%;
  11853. position: relative;
  11854. opacity: 0.8;
  11855. cursor: pointer;
  11856. }
  11857. .arrow_box span {
  11858. width: 100%;
  11859. height: 100%;
  11860. border: 1px solid;
  11861. opacity: 0.2;
  11862. display: inline-block;
  11863. border-radius: 100%;
  11864. -webkit-border-top-left-radius: 100%;
  11865. -webkit-border-top-right-radius: 100%;
  11866. -webkit-border-bottom-right-radius: 100%;
  11867. -webkit-border-bottom-left-radius: 100%;
  11868. position: absolute;
  11869. top: 0;
  11870. left: 0;
  11871. }
  11872. .arrow_box span:first-child {
  11873. animation: markerWave 1.5s 0.45s cubic-bezier(0.4, 0, 0.2, 1) infinite forwards;
  11874. -webkit-animation: markerWave 1.5s 0.45s cubic-bezier(0.4, 0, 0.2, 1) infinite forwards;
  11875. }
  11876. .arrow_box span:first-child + span {
  11877. animation: markerWave 1.5s 0.45s cubic-bezier(0, 0, 0.2, 1) infinite forwards;
  11878. -webkit-animation: markerWave 1.5s 0.45s cubic-bezier(0, 0, 0.2, 1) infinite forwards;
  11879. }
  11880. .arrow_box span:last-child {
  11881. opacity: 0.1;
  11882. }
  11883. .arrow_box.marker02 {
  11884. width: 18px;
  11885. height: 18px;
  11886. }
  11887. .arrow_box.marker02 span {
  11888. border: 0;
  11889. }
  11890. .arrow_box.marker02:after {
  11891. content: "";
  11892. width: 45px;
  11893. height: 62px;
  11894. background: url("../images/marker02.png") left center no-repeat;
  11895. background-size: cover;
  11896. position: absolute;
  11897. left: -15px;
  11898. top: -58px;
  11899. float: left;
  11900. }
  11901. .arrow_box.marker03 {
  11902. width: 16px;
  11903. height: 16px;
  11904. -webkit-transform: rotateX(0deg);
  11905. transform: rotateX(0deg);
  11906. }
  11907. .arrow_box.marker03 span {
  11908. background-color: transparent !important;
  11909. }
  11910. @keyframes markerWave {
  11911. 0% {
  11912. transform: scale(1);
  11913. opacity: 0.8;
  11914. }
  11915. 20% {
  11916. opacity: 0.8;
  11917. }
  11918. 100% {
  11919. transform: scale(5.5);
  11920. opacity: 0;
  11921. }
  11922. }
  11923. @-webkit-keyframes markerWave {
  11924. 0% {
  11925. -webkit-transform: scale(1);
  11926. opacity: 0.8;
  11927. }
  11928. 20% {
  11929. opacity: 0.8;
  11930. }
  11931. 100% {
  11932. -webkit-transform: scale(5.5);
  11933. opacity: 0;
  11934. }
  11935. }
  11936. .infowindow {
  11937. color: var(--dark-gray);
  11938. font-weight: 400;
  11939. line-height: 26px;
  11940. font-size: 15px;
  11941. letter-spacing: -0.5px;
  11942. padding: 25px 25px 25px 25px !important;
  11943. text-align: center;
  11944. }
  11945. .infowindow .mb-3 {
  11946. margin-bottom: 5px !important;
  11947. font-weight: 600;
  11948. font-size: 16px;
  11949. letter-spacing: -0.25px;
  11950. }
  11951. .infowindow p {
  11952. color: var(--medium-gray);
  11953. font-size: 15px;
  11954. margin-bottom: 5px;
  11955. letter-spacing: -0.25px;
  11956. line-height: 24px;
  11957. }
  11958. .infowindow :last-child {
  11959. margin-bottom: 0;
  11960. }
  11961. .gm-style .gm-style-iw-c {
  11962. padding: 0 !important;
  11963. border-radius: 0;
  11964. max-width: 230px !important;
  11965. -webkit-box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);
  11966. box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);
  11967. }
  11968. .gm-style .gm-style-iw-d {
  11969. overflow: auto !important;
  11970. }
  11971. .gm-style .gm-style-iw-t::after {
  11972. background: var(--dark-gray);
  11973. -webkit-box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);
  11974. box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);
  11975. }
  11976. .gm-ui-hover-effect {
  11977. opacity: 0.8;
  11978. top: -2px !important;
  11979. right: 2px !important;
  11980. width: 25px !important;
  11981. display: none !important;
  11982. height: 25px !important;
  11983. }
  11984. .gm-ui-hover-effect img {
  11985. width: 17px !important;
  11986. height: 17px !important;
  11987. margin: 6px !important;
  11988. }
  11989. .google-maps-link {
  11990. text-align: center;
  11991. }
  11992. .google-maps-link a {
  11993. font-size: 12px;
  11994. font-weight: 400;
  11995. display: block;
  11996. background-color: var(--dark-gray);
  11997. color: var(--white);
  11998. padding: 15px;
  11999. letter-spacing: 0.5px;
  12000. }
  12001. .google-maps-link a:hover {
  12002. text-decoration: none;
  12003. }
  12004. .gmnoprint .gm-style-mtc,
  12005. .gmnoprint .gm-svpc {
  12006. display: none;
  12007. }
  12008. .gm-style a[title] {
  12009. display: none !important;
  12010. }
  12011. .gmnoprint .gm-style-cc,
  12012. .gmnoprint.gm-style-cc,
  12013. .gm-style-cc,
  12014. .gmnoscreen {
  12015. display: none !important;
  12016. }
  12017. .gm-style .gm-style-iw-tc::after {
  12018. background: var(--dark-gray);
  12019. }
  12020. @media screen {
  12021. .gm-style .gmnoscreen,
  12022. .gmnoscreen {
  12023. display: none;
  12024. }
  12025. }
  12026. /* Text highlight */
  12027. .text-highlight {
  12028. position: relative;
  12029. z-index: 1;
  12030. }
  12031. .text-highlight span {
  12032. display: inline-block;
  12033. left: -3px;
  12034. position: absolute;
  12035. z-index: -1;
  12036. width: calc(100% + 6px);
  12037. }
  12038. /* Separator animation */
  12039. .separator-animation {
  12040. width: 0 !important;
  12041. -webkit-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  12042. transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  12043. }
  12044. .shadow-in .separator-animation {
  12045. width: calc(100% + 6px) !important;
  12046. }
  12047. /* Feature box style */
  12048. .feature-box {
  12049. display: -webkit-box;
  12050. display: -ms-flexbox;
  12051. display: flex;
  12052. -webkit-box-align: center;
  12053. -ms-flex-align: center;
  12054. align-items: center;
  12055. -webkit-box-pack: center;
  12056. -ms-flex-pack: center;
  12057. justify-content: center;
  12058. -webkit-box-orient: vertical;
  12059. -webkit-box-direction: normal;
  12060. -ms-flex-direction: column;
  12061. flex-direction: column;
  12062. text-align: center;
  12063. position: relative;
  12064. z-index: 1;
  12065. }
  12066. .feature-box .feature-box-icon i:not([class*=text-gradient-]) {
  12067. display: -webkit-box;
  12068. display: -ms-flexbox;
  12069. display: flex;
  12070. }
  12071. .feature-box.feature-box-left-icon, .feature-box.feature-box-left-icon-middle {
  12072. -webkit-box-orient: horizontal;
  12073. -webkit-box-direction: normal;
  12074. -ms-flex-flow: row wrap;
  12075. flex-flow: row wrap;
  12076. -webkit-box-align: stretch !important;
  12077. -ms-flex-align: stretch !important;
  12078. align-items: stretch !important;
  12079. -webkit-box-pack: start;
  12080. -ms-flex-pack: start;
  12081. justify-content: flex-start;
  12082. text-align: left;
  12083. }
  12084. .feature-box.feature-box-left-icon .feature-box-icon, .feature-box.feature-box-left-icon-middle .feature-box-icon {
  12085. margin-right: 30px;
  12086. }
  12087. .feature-box.feature-box-left-icon .feature-box-content, .feature-box.feature-box-left-icon-middle .feature-box-content {
  12088. -webkit-box-flex: 1;
  12089. -ms-flex: 1;
  12090. flex: 1;
  12091. }
  12092. .feature-box.feature-box-left-icon .content-slide-up, .feature-box.feature-box-left-icon-middle .content-slide-up {
  12093. display: -webkit-box;
  12094. display: -ms-flexbox;
  12095. display: flex;
  12096. }
  12097. .feature-box.feature-box-left-icon-middle {
  12098. -webkit-flex-flow: row wrap;
  12099. -ms-flex-flow: row wrap;
  12100. -webkit-box-align: center !important;
  12101. -ms-flex-align: center !important;
  12102. align-items: center !important;
  12103. -webkit-box-align: center;
  12104. -ms-flex-pack: center;
  12105. justify-content: flex-start;
  12106. text-align: left;
  12107. }
  12108. .feature-box.feature-box-left-icon-middle .content-slide-up {
  12109. flex-flow: row wrap;
  12110. align-items: center;
  12111. justify-content: flex-start;
  12112. text-align: left;
  12113. }
  12114. .feature-box.text-start {
  12115. -webkit-box-align: start;
  12116. -ms-flex-align: start;
  12117. align-items: start;
  12118. }
  12119. .feature-box.text-end {
  12120. -webkit-box-align: end;
  12121. -ms-flex-align: end;
  12122. align-items: flex-end;
  12123. }
  12124. .feature-box .feature-box-overlay {
  12125. position: absolute;
  12126. top: 0;
  12127. left: 0;
  12128. width: 100%;
  12129. height: 100%;
  12130. z-index: -1;
  12131. opacity: 0;
  12132. -webkit-transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12133. transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12134. }
  12135. .feature-box .content-slide-up {
  12136. will-change: transform;
  12137. -webkit-transform: translateY(30px);
  12138. transform: translateY(30px);
  12139. }
  12140. .feature-box .content-slide-up .text-visible {
  12141. opacity: 0;
  12142. }
  12143. .feature-box .border-hover {
  12144. left: 0;
  12145. bottom: -1px;
  12146. width: calc(100% + 0px);
  12147. height: 5px;
  12148. position: absolute;
  12149. -webkit-transform: scaleX(0);
  12150. transform: scaleX(0);
  12151. -webkit-transition: transform 0.5s ease;
  12152. transition: transform 0.5s ease;
  12153. will-change: transform;
  12154. }
  12155. .feature-box .feature-box-bg-overlay {
  12156. position: absolute;
  12157. top: 0;
  12158. left: 0;
  12159. width: 100%;
  12160. height: 100%;
  12161. z-index: -9;
  12162. opacity: 0;
  12163. -webkit-transform: scale(0.8);
  12164. transform: scale(0.8);
  12165. -webkit-transition: 0.5s;
  12166. transition: 0.5s;
  12167. }
  12168. .feature-box .feature-box-icon-rounded {
  12169. display: -webkit-box;
  12170. display: -ms-flexbox;
  12171. display: flex;
  12172. -webkit-box-pack: center;
  12173. -ms-flex-pack: center;
  12174. justify-content: center;
  12175. -webkit-box-align: center;
  12176. -ms-flex-align: center;
  12177. align-items: center;
  12178. position: relative;
  12179. overflow: hidden;
  12180. -webkit-transition: 0.3s;
  12181. transition: 0.3s;
  12182. }
  12183. .feature-box .feature-box-icon-rounded .feature-box-icon-hover {
  12184. position: absolute;
  12185. top: 0px;
  12186. left: 0px;
  12187. width: 100%;
  12188. height: 100%;
  12189. opacity: 0;
  12190. -webkit-transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12191. transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12192. }
  12193. .feature-box .feature-box-icon-rounded i {
  12194. position: relative;
  12195. z-index: 1;
  12196. -webkit-transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12197. transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12198. }
  12199. .feature-box .box-move-bottom-top {
  12200. -webkit-transform: translateY(28px);
  12201. transform: translateY(28px);
  12202. -webkit-transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12203. transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12204. }
  12205. .feature-box .move-bottom-top {
  12206. -webkit-transform: translateY(20px);
  12207. transform: translateY(20px);
  12208. -webkit-transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12209. transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12210. opacity: 0;
  12211. }
  12212. .feature-box:hover .box-move-bottom-top {
  12213. -webkit-transform: translateY(0px);
  12214. transform: translateY(0px);
  12215. }
  12216. .feature-box:hover .box-move-bottom-top .move-bottom-top {
  12217. -webkit-transform: translateY(0px);
  12218. transform: translateY(0px);
  12219. opacity: 1;
  12220. }
  12221. .feature-box:hover .border-hover {
  12222. -webkit-transform: scaleX(1);
  12223. transform: scaleX(1);
  12224. }
  12225. .feature-box:hover .feature-box-overlay {
  12226. opacity: 1;
  12227. }
  12228. .feature-box:hover .content-slide-up {
  12229. -webkit-transform: translateY(0);
  12230. transform: translateY(0);
  12231. }
  12232. .feature-box:hover .content-slide-up .text-visible {
  12233. opacity: 1;
  12234. }
  12235. .feature-box:hover .content-slide-up.content-scale .feature-box-overlay {
  12236. -webkit-transform: scale(1.1);
  12237. transform: scale(1.1);
  12238. }
  12239. .feature-box:hover .feature-box-bg-overlay {
  12240. opacity: 1;
  12241. -webkit-transform: scale(1);
  12242. transform: scale(1);
  12243. }
  12244. .feature-box:hover .feature-box-icon-rounded.border-color-transparent-on-hover {
  12245. border-color: transparent !important;
  12246. }
  12247. .feature-box:hover .feature-box-icon-rounded .feature-box-icon-hover {
  12248. opacity: 1;
  12249. }
  12250. .feature-box:hover .feature-box-content .underline-on-hover {
  12251. color: var(--base-color);
  12252. }
  12253. .feature-box:hover .feature-box-content .underline-on-hover:after {
  12254. opacity: 1;
  12255. -webkit-transform: translateY(0);
  12256. transform: translateY(0);
  12257. }
  12258. .feature-box:hover .dark-hover i, .feature-box:hover .dark-hover span {
  12259. color: #fff;
  12260. }
  12261. .feature-box:hover .dark-hover [class*=text-gradient-] {
  12262. color: var(--white);
  12263. background-image: none;
  12264. -webkit-background-clip: inherit;
  12265. -webkit-text-fill-color: var(--white);
  12266. -webkit-text-fill-color: var(--white);
  12267. }
  12268. .feature-box.border-bottom .feature-box-overlay {
  12269. height: calc(100% + 1px);
  12270. }
  12271. .feature-box.border-top .feature-box-overlay {
  12272. height: calc(100% + 1px);
  12273. }
  12274. /* Icon with text style 03 */
  12275. .icon-with-text-style-03 * {
  12276. word-break: initial;
  12277. }
  12278. /* Icon with text style 05 */
  12279. .icon-with-text-style-05 .feature-box {
  12280. height: 100%;
  12281. }
  12282. /* Icon with text style 07 */
  12283. .icon-with-text-style-07 .hover-box:hover .feature-box-title {
  12284. left: -25%;
  12285. }
  12286. .icon-with-text-style-07 .hover-box:hover .feature-box-title.text-outline-color-dark-gray {
  12287. -webkit-text-stroke-color: var(--base-color);
  12288. opacity: 1;
  12289. }
  12290. .icon-with-text-style-07 .feature-box-title {
  12291. position: absolute;
  12292. top: 30px;
  12293. left: 50%;
  12294. word-break: normal;
  12295. width: 100%;
  12296. -webkit-transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12297. transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12298. }
  12299. /* Icon with text style 10 */
  12300. .icon-with-text-style-10 .feature-box-icon:before {
  12301. width: 100%;
  12302. height: 50%;
  12303. background-color: var(--base-color);
  12304. opacity: 0.12;
  12305. z-index: -1;
  12306. content: "";
  12307. position: absolute;
  12308. left: 0;
  12309. top: 0;
  12310. -webkit-transform: rotate(-40deg);
  12311. -ms-transform: rotate(-40deg);
  12312. transform: rotate(-40deg);
  12313. -webkit-transform-origin: bottom center;
  12314. -ms-transform-origin: bottom center;
  12315. transform-origin: bottom center;
  12316. -webkit-transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12317. transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12318. }
  12319. .icon-with-text-style-10:nth-child(even) .feature-box-icon:before {
  12320. -webkit-transform: rotate(140deg);
  12321. -ms-transform: rotate(140deg);
  12322. transform: rotate(140deg);
  12323. }
  12324. .icon-with-text-style-10:hover .feature-box-icon {
  12325. -webkit-transform: scale(1.1);
  12326. transform: scale(1.1);
  12327. -webkit-transition: all 300ms cubic-bezier(0.37, 0.8, 0.63, 1.2);
  12328. transition: all 300ms cubic-bezier(0.37, 0.8, 0.63, 1.2);
  12329. }
  12330. .icon-with-text-style-10:hover .feature-box-icon i {
  12331. color: var(--white);
  12332. }
  12333. .icon-with-text-style-10:hover .feature-box-icon:before {
  12334. height: 100%;
  12335. -webkit-transform-origin: center;
  12336. -ms-transform-origin: center;
  12337. transform-origin: center;
  12338. opacity: 1;
  12339. }
  12340. /* Icon with text style 11 */
  12341. .icon-with-text-style-11 {
  12342. -webkit-transform: translateY(0px);
  12343. transform: translateY(0px);
  12344. -webkit-transition: all 0.3s linear;
  12345. transition: all 0.3s linear;
  12346. }
  12347. .icon-with-text-style-11 .text-box {
  12348. opacity: 1;
  12349. }
  12350. .icon-with-text-style-11 .text-box-hover {
  12351. position: absolute;
  12352. top: 0;
  12353. left: 0;
  12354. opacity: 0;
  12355. -webkit-transition: all 0.3s linear;
  12356. transition: all 0.3s linear;
  12357. }
  12358. .icon-with-text-style-11:hover {
  12359. -webkit-transform: translateY(-15px);
  12360. transform: translateY(-15px);
  12361. }
  12362. .icon-with-text-style-11:hover .text-box-hover {
  12363. opacity: 1;
  12364. }
  12365. .icon-with-text-style-11:hover .text-box {
  12366. opacity: 0;
  12367. }
  12368. /* Image gallery style 01 */
  12369. .image-gallery-style-01 .gallery-box .gallery-image {
  12370. will-change: transform;
  12371. }
  12372. .image-gallery-style-01 .gallery-box:hover img {
  12373. opacity: 0.5;
  12374. -webkit-filter: blur(2px);
  12375. filter: blur(2px);
  12376. -webkit-transform: scale(1.1);
  12377. transform: scale(1.1);
  12378. }
  12379. /* Image gallery style 02 */
  12380. .image-gallery-style-02 .gallery-box:hover img {
  12381. -webkit-filter: grayscale(1);
  12382. filter: grayscale(1);
  12383. opacity: 0.3;
  12384. }
  12385. /* Image gallery style 03 */
  12386. .image-gallery-style-03 .gallery-box i {
  12387. opacity: 0;
  12388. visibility: hidden;
  12389. }
  12390. .image-gallery-style-03 .gallery-box img {
  12391. -webkit-transform: scale(1.13) translateZ(0);
  12392. transform: scale(1.13) translateZ(0);
  12393. }
  12394. .image-gallery-style-03 .gallery-box:hover i {
  12395. opacity: 1;
  12396. visibility: visible;
  12397. }
  12398. .image-gallery-style-03 .gallery-box:hover img {
  12399. opacity: 0.2;
  12400. -webkit-transform: scale(1) translateZ(0);
  12401. transform: scale(1) translateZ(0);
  12402. }
  12403. /* Image gallery style 04 */
  12404. .image-gallery-style-04 .gallery-box {
  12405. will-change: transform;
  12406. }
  12407. .image-gallery-style-04 .gallery-box img {
  12408. width: 100%;
  12409. }
  12410. .image-gallery-style-04 .gallery-box:hover img {
  12411. opacity: 0.2;
  12412. }
  12413. /* Image gallery style 05 */
  12414. .image-gallery-style-05 .gallery-box {
  12415. will-change: transform;
  12416. }
  12417. .image-gallery-style-05 .gallery-box:hover img {
  12418. opacity: 0.2;
  12419. }
  12420. /* Image gallery style 06 */
  12421. .image-gallery-style-06 .gallery-box {
  12422. will-change: transform;
  12423. }
  12424. .image-gallery-style-06 .gallery-box img {
  12425. width: 100%;
  12426. }
  12427. .image-gallery-style-06 .gallery-box .gallery-hover {
  12428. position: absolute;
  12429. top: 0;
  12430. left: 0;
  12431. opacity: 0;
  12432. visibility: hidden;
  12433. }
  12434. .image-gallery-style-06 .gallery-box .gallery-hover .gallery-title {
  12435. -webkit-transform: scale(1.5);
  12436. transform: scale(1.5);
  12437. }
  12438. .image-gallery-style-06 .gallery-box:hover img {
  12439. opacity: 0.2;
  12440. -webkit-transform: scale(1.15);
  12441. transform: scale(1.15);
  12442. }
  12443. .image-gallery-style-06 .gallery-box:hover .gallery-hover {
  12444. opacity: 1;
  12445. visibility: visible;
  12446. }
  12447. .image-gallery-style-06 .gallery-box:hover .gallery-hover .gallery-title {
  12448. -webkit-transform: scale(1);
  12449. transform: scale(1);
  12450. }
  12451. /* Instagram */
  12452. .instafeed-grid {
  12453. list-style: none;
  12454. text-align: center;
  12455. }
  12456. .instafeed-grid figure {
  12457. position: relative;
  12458. overflow: hidden;
  12459. margin-bottom: 0;
  12460. border-radius: 4px;
  12461. }
  12462. .instafeed-grid figure a .insta-icon {
  12463. opacity: 0;
  12464. position: absolute;
  12465. top: 0;
  12466. left: 0;
  12467. text-align: center;
  12468. background: rgba(35, 35, 35, 0.7);
  12469. width: 100%;
  12470. height: 100%;
  12471. -webkit-transition: 0.3s;
  12472. transition: 0.3s;
  12473. }
  12474. .instafeed-grid figure a .insta-icon i {
  12475. margin-right: 5px;
  12476. margin-left: 5px;
  12477. position: relative;
  12478. display: block;
  12479. font-size: 26px;
  12480. color: var(--white);
  12481. top: 50%;
  12482. -webkit-transform: translateY(-50%) scale(1.5, 1.5);
  12483. transform: translateY(-50%) scale(1.5, 1.5);
  12484. -webkit-transition: all 200ms cubic-bezier(0.37, 0.8, 0.63, 1);
  12485. transition: all 200ms cubic-bezier(0.37, 0.8, 0.63, 1);
  12486. }
  12487. .instafeed-grid figure a .insta-video {
  12488. display: none;
  12489. }
  12490. .instafeed-grid figure a video {
  12491. object-fit: cover;
  12492. width: 100%;
  12493. height: 100%;
  12494. }
  12495. .instafeed-grid figure a video[data-class=video] {
  12496. display: block;
  12497. }
  12498. .instafeed-grid figure a [data-class=video] + .insta-image {
  12499. display: none;
  12500. }
  12501. .instafeed-grid figure:hover a .insta-icon {
  12502. opacity: 1;
  12503. }
  12504. .instafeed-grid figure:hover a .insta-icon i {
  12505. -webkit-transform: translateY(-50%) scale(1, 1);
  12506. transform: translateY(-50%) scale(1, 1);
  12507. }
  12508. .instagram-follow-api .instagram-button {
  12509. z-index: 1;
  12510. white-space: nowrap;
  12511. padding: 12px 32px;
  12512. box-shadow: 0 0 35px rgba(23, 23, 23, 0.4);
  12513. }
  12514. /* Interactive banner style 01 */
  12515. .interactive-banner-style-01 figure {
  12516. -webkit-transition: all 700ms cubic-bezier(0.61, 1, 0.88, 1);
  12517. transition: all 700ms cubic-bezier(0.61, 1, 0.88, 1);
  12518. }
  12519. .interactive-banner-style-01 figure .icon-box {
  12520. opacity: 0;
  12521. position: relative;
  12522. top: 15px;
  12523. }
  12524. .interactive-banner-style-01 figure figcaption {
  12525. position: absolute;
  12526. bottom: 0;
  12527. }
  12528. .interactive-banner-style-01 figure:hover {
  12529. -webkit-transform: translateY(-5px);
  12530. transform: translateY(-5px);
  12531. }
  12532. .interactive-banner-style-01 figure:hover img {
  12533. -webkit-transform: scale(1.1);
  12534. transform: scale(1.1);
  12535. -webkit-transition: all 700ms cubic-bezier(0.61, 1, 0.88, 1);
  12536. transition: all 700ms cubic-bezier(0.61, 1, 0.88, 1);
  12537. }
  12538. .interactive-banner-style-01 figure:hover .icon-box {
  12539. opacity: 1;
  12540. top: 0;
  12541. }
  12542. .interactive-banner-style-01 figure:hover .box-overlay {
  12543. opacity: 0.5;
  12544. }
  12545. /* Interactive banner style 02 */
  12546. .interactive-banner-style-02.hover-box * {
  12547. will-change: auto !important;
  12548. }
  12549. .interactive-banner-style-02 figure figcaption .features-icon {
  12550. margin-bottom: -45px;
  12551. opacity: 0;
  12552. visibility: hidden;
  12553. }
  12554. .interactive-banner-style-02:hover figure img {
  12555. -webkit-transform: scale(1.1);
  12556. transform: scale(1.1);
  12557. }
  12558. .interactive-banner-style-02:hover figure figcaption .features-icon {
  12559. margin-bottom: 20px;
  12560. opacity: 1;
  12561. visibility: visible;
  12562. }
  12563. /* Interactive banner style 03 */
  12564. .interactive-banner-style-03 figure {
  12565. position: relative;
  12566. }
  12567. .interactive-banner-style-03 figure img {
  12568. -webkit-transition: all 700ms cubic-bezier(0.61, 1, 0.88, 1);
  12569. transition: all 700ms cubic-bezier(0.61, 1, 0.88, 1);
  12570. }
  12571. .interactive-banner-style-03 figure figcaption {
  12572. position: absolute;
  12573. bottom: 0;
  12574. top: 0;
  12575. background-color: rgba(0, 0, 0, 0.2);
  12576. }
  12577. .interactive-banner-style-03 figure:hover img {
  12578. -webkit-transform: scale(1.08);
  12579. transform: scale(1.08);
  12580. }
  12581. /* Interactive banner style 04 */
  12582. .interactive-banner-style-04 figure {
  12583. -webkit-transition: all 700ms cubic-bezier(0.5, 1, 0.89, 1);
  12584. transition: all 700ms cubic-bezier(0.5, 1, 0.89, 1);
  12585. }
  12586. .interactive-banner-style-04 figure * {
  12587. -webkit-transition: all 700ms cubic-bezier(0.5, 1, 0.89, 1);
  12588. transition: all 700ms cubic-bezier(0.5, 1, 0.89, 1);
  12589. }
  12590. .interactive-banner-style-04 figure figcaption {
  12591. position: absolute;
  12592. bottom: 0;
  12593. }
  12594. .interactive-banner-style-04 figure figcaption .features-content {
  12595. position: absolute;
  12596. left: 25px;
  12597. top: 25px;
  12598. width: calc(100% - 50px);
  12599. height: calc(100% - 50px);
  12600. opacity: 0;
  12601. visibility: hidden;
  12602. -webkit-transform: translateY(20px);
  12603. transform: translateY(20px);
  12604. -webkit-transition: all 500ms cubic-bezier(0.5, 1, 0.89, 1);
  12605. transition: all 500ms cubic-bezier(0.5, 1, 0.89, 1);
  12606. }
  12607. .interactive-banner-style-04 figure figcaption .features-content .box-overlay {
  12608. height: 0%;
  12609. -webkit-transition: all 400ms cubic-bezier(0.5, 1, 0.89, 1);
  12610. transition: all 400ms cubic-bezier(0.5, 1, 0.89, 1);
  12611. }
  12612. .interactive-banner-style-04 figure figcaption .box-button {
  12613. opacity: 1;
  12614. visibility: visible;
  12615. position: relative;
  12616. bottom: 0;
  12617. -webkit-transition: all 500ms cubic-bezier(0.5, 1, 0.89, 1);
  12618. transition: all 500ms cubic-bezier(0.5, 1, 0.89, 1);
  12619. }
  12620. .interactive-banner-style-04 figure:hover {
  12621. -webkit-transform: translateY(-5px);
  12622. transform: translateY(-5px);
  12623. }
  12624. .interactive-banner-style-04 figure:hover figcaption .features-content {
  12625. opacity: 1;
  12626. visibility: visible;
  12627. -webkit-transform: translateY(0);
  12628. transform: translateY(0);
  12629. }
  12630. .interactive-banner-style-04 figure:hover figcaption .box-overlay {
  12631. height: 100%;
  12632. }
  12633. .interactive-banner-style-04 figure:hover figcaption .box-button {
  12634. opacity: 0;
  12635. visibility: hidden;
  12636. position: relative;
  12637. bottom: -70px;
  12638. }
  12639. /* Interactive banner style 05 */
  12640. .interactive-banner-style-05 figure img {
  12641. -webkit-transition: all 700ms cubic-bezier(0.61, 1, 0.88, 1);
  12642. transition: all 700ms cubic-bezier(0.61, 1, 0.88, 1);
  12643. }
  12644. .interactive-banner-style-05 figure figcaption .btn {
  12645. margin-bottom: -50px;
  12646. visibility: hidden;
  12647. opacity: 0;
  12648. transition-timing-function: linear;
  12649. -webkit-transition: all 700ms cubic-bezier(0.61, 1, 0.88, 1);
  12650. transition: all 700ms cubic-bezier(0.61, 1, 0.88, 1);
  12651. }
  12652. .interactive-banner-style-05 figure figcaption .content-arrow {
  12653. position: absolute;
  12654. right: 0;
  12655. opacity: 0;
  12656. top: 50%;
  12657. -webkit-transform: translateY(5px);
  12658. transform: translateY(5px);
  12659. }
  12660. .interactive-banner-style-05 figure:hover img {
  12661. -webkit-transform: scale(1.08);
  12662. transform: scale(1.08);
  12663. }
  12664. .interactive-banner-style-05 figure:hover figcaption img {
  12665. -webkit-transform: scale(1);
  12666. transform: scale(1);
  12667. }
  12668. .interactive-banner-style-05 figure:hover figcaption .content-arrow {
  12669. opacity: 1;
  12670. -webkit-transform: translateY(-50%);
  12671. transform: translateY(-50%);
  12672. }
  12673. .interactive-banner-style-05 figure:hover figcaption .btn {
  12674. margin-bottom: 0;
  12675. visibility: visible;
  12676. opacity: 1;
  12677. }
  12678. .interactive-banner-style-05 .atropos:hover .box-overlay {
  12679. opacity: 1;
  12680. visibility: visible;
  12681. }
  12682. .interactive-banner-style-05 .atropos:hover img {
  12683. -webkit-transform: scale(1.08);
  12684. transform: scale(1.08);
  12685. }
  12686. /* Interactive banner style 06 */
  12687. .interactive-banner-style-06 {
  12688. position: relative;
  12689. overflow: hidden;
  12690. }
  12691. .interactive-banner-style-06 .banners-icon {
  12692. z-index: 9;
  12693. -webkit-transition: 350ms cubic-bezier(0.12, 0, 0.39, 0);
  12694. transition: 350ms cubic-bezier(0.12, 0, 0.39, 0);
  12695. }
  12696. .interactive-banner-style-06 img {
  12697. -webkit-transition: 1s cubic-bezier(0.12, 0, 0.39, 0);
  12698. transition: 1s cubic-bezier(0.12, 0, 0.39, 0);
  12699. width: 100%;
  12700. }
  12701. .interactive-banner-style-06 .interactive-banners-content {
  12702. position: absolute;
  12703. bottom: 0;
  12704. left: 0;
  12705. width: 100%;
  12706. z-index: 1;
  12707. transform: translateY(calc(100% - 155px));
  12708. -webkit-transition: 550ms cubic-bezier(0.12, 0, 0.1, 0);
  12709. transition: 550ms cubic-bezier(0.12, 0, 0.1, 0);
  12710. }
  12711. .interactive-banner-style-06 .interactive-banners-content .interactive-banners-content-text {
  12712. opacity: 0;
  12713. visibility: hidden;
  12714. -webkit-transition: 350ms cubic-bezier(0.12, 0, 0.39, 0);
  12715. transition: 350ms cubic-bezier(0.12, 0, 0.39, 0);
  12716. }
  12717. .interactive-banner-style-06 .box-overlay {
  12718. height: 25%;
  12719. bottom: 0;
  12720. top: auto;
  12721. visibility: visible;
  12722. opacity: 0;
  12723. -webkit-transition: 350ms cubic-bezier(0.12, 0, 0.39, 0);
  12724. transition: 350ms cubic-bezier(0.12, 0, 0.39, 0);
  12725. }
  12726. .interactive-banner-style-06:hover img {
  12727. -webkit-transform: scale(1.3);
  12728. transform: scale(1.3);
  12729. -webkit-transition: 3s cubic-bezier(0.12, 0, 0.39, 0);
  12730. transition: 3s cubic-bezier(0.12, 0, 0.39, 0);
  12731. }
  12732. .interactive-banner-style-06:hover .icon-hover-base-color {
  12733. color: var(--base-color) !important;
  12734. }
  12735. .interactive-banner-style-06:hover .interactive-banners-content {
  12736. transform: translateY(0);
  12737. }
  12738. .interactive-banner-style-06:hover .interactive-banners-content .interactive-banners-content-text {
  12739. opacity: 1;
  12740. visibility: visible;
  12741. }
  12742. .interactive-banner-style-06:hover .box-overlay {
  12743. height: 100%;
  12744. visibility: visible;
  12745. opacity: 1;
  12746. }
  12747. /* Interactive banner style 07 */
  12748. .interactive-banner-style-07 figure {
  12749. position: relative;
  12750. overflow: hidden;
  12751. }
  12752. .interactive-banner-style-07 figure > img {
  12753. -webkit-transition: 0.6s cubic-bezier(0.12, 0, 0.39, 0);
  12754. transition: 0.6s cubic-bezier(0.12, 0, 0.39, 0);
  12755. -webkit-transform: scale(1);
  12756. transform: scale(1);
  12757. }
  12758. .interactive-banner-style-07 figure .overlay-bg {
  12759. -webkit-transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12760. transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12761. }
  12762. .interactive-banner-style-07 figure figcaption {
  12763. position: absolute;
  12764. top: 0;
  12765. left: 0;
  12766. width: 100%;
  12767. height: 100%;
  12768. z-index: 1;
  12769. }
  12770. .interactive-banner-style-07 figure .hover-hide-content {
  12771. position: absolute;
  12772. bottom: 50px;
  12773. left: 0;
  12774. width: 100%;
  12775. -webkit-transition: 1s;
  12776. transition: 1s;
  12777. }
  12778. .interactive-banner-style-07 figure .hover-show-content {
  12779. opacity: 0;
  12780. visibility: hidden;
  12781. position: absolute;
  12782. bottom: 50px;
  12783. -webkit-transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12784. transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12785. -webkit-transform: scale(1);
  12786. transform: scale(1);
  12787. }
  12788. .interactive-banner-style-07 figure:hover > img {
  12789. -webkit-transform: scale(1.1);
  12790. transform: scale(1.1);
  12791. }
  12792. .interactive-banner-style-07 figure:hover .overlay-bg {
  12793. opacity: 0.7;
  12794. }
  12795. .interactive-banner-style-07 figure:hover .hover-hide-content {
  12796. opacity: 0;
  12797. visibility: hidden;
  12798. -webkit-transition: 0.1s;
  12799. transition: 0.1s;
  12800. }
  12801. .interactive-banner-style-07 figure:hover .hover-show-content {
  12802. opacity: 1;
  12803. visibility: visible;
  12804. -webkit-transform: scale(1.2);
  12805. transform: scale(1.2);
  12806. }
  12807. /* Interactive banner style 08 */
  12808. .interactive-banner-style-08 figure:hover img {
  12809. -webkit-transform: scale(1.08);
  12810. transform: scale(1.08);
  12811. -webkit-transition: 1.5s;
  12812. transition: 1.5s;
  12813. }
  12814. .interactive-banner-style-08 figure:hover .box-overlay {
  12815. opacity: 1;
  12816. visibility: visible;
  12817. }
  12818. .interactive-banner-style-08 figure:hover figcaption .circle-box {
  12819. background-color: var(--white) !important;
  12820. -webkit-transform: scale(1.1);
  12821. transform: scale(1.1);
  12822. -webkit-transition: all 500ms cubic-bezier(0.61, 1, 0.88, 1.5);
  12823. transition: all 500ms cubic-bezier(0.61, 1, 0.88, 1.5);
  12824. }
  12825. /* Interactive banner style 09 */
  12826. .interactive-banner-style-09 img {
  12827. -webkit-transition: all 1.5s cubic-bezier(0.19, 1, 0.22, 1);
  12828. transition: all 1.5s cubic-bezier(0.19, 1, 0.22, 1);
  12829. }
  12830. .interactive-banner-style-09 .image-content {
  12831. position: absolute;
  12832. top: 0;
  12833. }
  12834. .interactive-banner-style-09 .image-content .content-title {
  12835. -webkit-box-flex: 1;
  12836. -ms-flex: 1;
  12837. flex: 1;
  12838. position: relative;
  12839. opacity: 0.6;
  12840. visibility: visible;
  12841. will-change: transform;
  12842. -webkit-transform: translateY(0);
  12843. transform: translateY(0);
  12844. -webkit-transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12845. transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12846. }
  12847. .interactive-banner-style-09 .image-content .content-title-hover {
  12848. position: absolute;
  12849. width: auto;
  12850. left: 0;
  12851. bottom: 0;
  12852. visibility: hidden;
  12853. will-change: transform;
  12854. -webkit-transform: translateY(20px);
  12855. transform: translateY(20px);
  12856. -webkit-transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12857. transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  12858. }
  12859. .interactive-banner-style-09 .image-content .content-arrow {
  12860. will-change: transform;
  12861. position: absolute;
  12862. right: 0;
  12863. opacity: 0;
  12864. top: 50%;
  12865. -webkit-transform: translateY(10px);
  12866. transform: translateY(10px);
  12867. -webkit-transition: all 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  12868. transition: all 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  12869. display: flex;
  12870. align-items: center;
  12871. justify-content: center;
  12872. }
  12873. .interactive-banner-style-09 .image-content .label {
  12874. -webkit-transition: 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  12875. transition: 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  12876. }
  12877. .interactive-banner-style-09 .image-content .hover-label-icon i {
  12878. opacity: 0;
  12879. position: absolute;
  12880. top: 20px;
  12881. left: 0;
  12882. -webkit-transition: 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  12883. transition: 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  12884. }
  12885. .interactive-banner-style-09 .image-content:hover .content-arrow {
  12886. opacity: 1;
  12887. -webkit-transform: translateY(-42%);
  12888. transform: translateY(-42%);
  12889. }
  12890. .interactive-banner-style-09 .image-content:hover .content-title {
  12891. opacity: 0;
  12892. visibility: hidden;
  12893. -webkit-transform: translateY(-20px);
  12894. transform: translateY(-20px);
  12895. }
  12896. .interactive-banner-style-09 .image-content:hover .content-title-hover {
  12897. visibility: visible;
  12898. -webkit-transform: translateY(-3px);
  12899. transform: translateY(-3px);
  12900. }
  12901. .interactive-banner-style-09 .image-content:hover .box-overlay {
  12902. opacity: 1;
  12903. visibility: visible;
  12904. }
  12905. .interactive-banner-style-09 .image-content:hover .hover-label-icon .label {
  12906. opacity: 0;
  12907. margin-top: -20px;
  12908. }
  12909. .interactive-banner-style-09 .image-content:hover .hover-label-icon i {
  12910. opacity: 1;
  12911. top: 0;
  12912. }
  12913. .interactive-banner-style-09:hover img {
  12914. -webkit-transform: scale(1.1);
  12915. transform: scale(1.1);
  12916. }
  12917. /* List style 01 */
  12918. .list-style-01 {
  12919. list-style: none;
  12920. }
  12921. .list-style-01 li {
  12922. border-bottom: 1px solid;
  12923. }
  12924. .list-style-01 li:last-child {
  12925. border-bottom: 0px;
  12926. }
  12927. /* List style 02 */
  12928. .list-style-02 {
  12929. list-style: none;
  12930. }
  12931. .list-style-02 li {
  12932. display: -webkit-box;
  12933. display: -ms-flexbox;
  12934. display: flex;
  12935. -webkit-box-orient: horizontal;
  12936. -webkit-box-direction: normal;
  12937. -ms-flex-direction: row;
  12938. flex-direction: row;
  12939. -webkit-box-align: start;
  12940. -ms-flex-align: start;
  12941. align-items: start;
  12942. }
  12943. .list-style-02 li:last-child {
  12944. margin-bottom: 0;
  12945. }
  12946. .list-style-02 li i {
  12947. line-height: 32px;
  12948. }
  12949. /* List style 03 */
  12950. .list-style-03 {
  12951. counter-reset: li;
  12952. list-style-type: none;
  12953. }
  12954. .list-style-03 li {
  12955. position: relative;
  12956. padding: 0 0 0 38px;
  12957. margin: 0 0 9px 0;
  12958. }
  12959. .list-style-03 li:before {
  12960. content: counter(li, decimal-leading-zero) ".";
  12961. counter-increment: li;
  12962. display: inline-block;
  12963. position: absolute;
  12964. left: 0;
  12965. }
  12966. /* List style 04 */
  12967. .list-style-04 {
  12968. padding-left: 16px;
  12969. }
  12970. .list-style-04 li {
  12971. margin: 0 0 10px;
  12972. list-style: disc;
  12973. }
  12974. /* List style 05 */
  12975. .list-style-05 {
  12976. padding: 0;
  12977. margin: 0;
  12978. }
  12979. .list-style-05 li {
  12980. margin: 0;
  12981. display: inline-block;
  12982. }
  12983. .list-style-05 li:before {
  12984. border-radius: 100%;
  12985. content: "";
  12986. background-color: var(--medium-gray);
  12987. display: inline-block;
  12988. width: 6px;
  12989. height: 6px;
  12990. margin: 0 15px;
  12991. vertical-align: middle;
  12992. position: relative;
  12993. top: -2px;
  12994. }
  12995. .list-style-05 li:first-child:before {
  12996. display: none;
  12997. }
  12998. /* HTML video */
  12999. .html-video {
  13000. background-color: #000;
  13001. left: 0%;
  13002. position: absolute;
  13003. top: 50%;
  13004. z-index: -3;
  13005. object-fit: cover;
  13006. -webkit-transform: translateY(-50%);
  13007. transform: translateY(-50%);
  13008. }
  13009. /* Background video */
  13010. .bg-video-wrapper {
  13011. position: absolute;
  13012. top: 0;
  13013. left: 0;
  13014. width: 100%;
  13015. height: 100%;
  13016. z-index: -1;
  13017. pointer-events: none;
  13018. overflow: hidden;
  13019. }
  13020. .bg-video-wrapper iframe {
  13021. width: 100vw;
  13022. height: 56.25vw;
  13023. min-height: 100vh;
  13024. min-width: 177.77vh;
  13025. position: absolute;
  13026. top: 50%;
  13027. left: 50%;
  13028. transform: translate(-50%, -50%);
  13029. }
  13030. /* Modal popup */
  13031. #popup-form {
  13032. cursor: default;
  13033. }
  13034. .mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close {
  13035. color: var(--white);
  13036. background: transparent;
  13037. }
  13038. .mfp-iframe-holder .mfp-content {
  13039. max-width: 1050px;
  13040. }
  13041. .mfp-close, .mfp-close:active {
  13042. opacity: 1;
  13043. background-color: transparent;
  13044. right: 20px;
  13045. top: 20px;
  13046. height: 30px;
  13047. width: 30px;
  13048. font-size: 13px;
  13049. line-height: 31px;
  13050. position: absolute;
  13051. color: var(--dark-gray);
  13052. }
  13053. .lightbox-gallery a {
  13054. position: relative;
  13055. display: block;
  13056. }
  13057. .lightbox-gallery .gallary-over-layer {
  13058. position: absolute;
  13059. top: 0;
  13060. left: 0;
  13061. }
  13062. .show-search-popup > section {
  13063. filter: grayscale(100%);
  13064. }
  13065. .show-search-popup .mfp-search.mfp-bg.mfp-ready {
  13066. opacity: 0.5;
  13067. }
  13068. .mfp-arrow {
  13069. opacity: 1;
  13070. }
  13071. .mfp-wrap {
  13072. cursor: url("../images/mfg-close.png"), auto;
  13073. }
  13074. .mfp-wrap .mfp-container {
  13075. cursor: auto;
  13076. }
  13077. .show-search-popup .mfp-close, .show-search-popup .mfp-close:active {
  13078. color: var(--dark-gray);
  13079. }
  13080. .show-search-popup .search-form .search-input {
  13081. border-bottom: 2px solid rgba(0, 0, 0, 0.1);
  13082. }
  13083. .show-search-popup .search-form .search-button {
  13084. color: var(--dark-gray);
  13085. }
  13086. .show-search-popup .mfp-container {
  13087. position: fixed;
  13088. height: 300px;
  13089. background-color: var(--white);
  13090. -webkit-animation-name: "ani-mfp";
  13091. animation-name: "ani-mfp";
  13092. -webkit-animation-duration: 0.2s;
  13093. -moz-animation-duration: 0.2s;
  13094. -o-animation-duration: 0.2s;
  13095. animation-duration: 0.2s;
  13096. }
  13097. .show-search-popup .mfp-removing .mfp-container {
  13098. -webkit-animation-name: "ani-mfp-close";
  13099. animation-name: "ani-mfp-close";
  13100. -webkit-animation-duration: 0.2s;
  13101. -moz-animation-duration: 0.2s;
  13102. -o-animation-duration: 0.2s;
  13103. animation-duration: 0.2s;
  13104. }
  13105. .show-search-popup .search-form .search-input {
  13106. color: var(--dark-gray);
  13107. }
  13108. .lightbox-gallery a {
  13109. position: relative;
  13110. display: block;
  13111. }
  13112. .lightbox-gallery .gallary-over-layer {
  13113. position: absolute;
  13114. top: 0;
  13115. left: 0;
  13116. }
  13117. .mfp-arrow-right:after,
  13118. .mfp-arrow-left:after {
  13119. display: none;
  13120. }
  13121. .mfp-arrow-left {
  13122. left: 30px;
  13123. }
  13124. .mfp-arrow-right {
  13125. right: 30px;
  13126. }
  13127. .mfp-arrow-left:before {
  13128. border-right: none;
  13129. content: "\e629";
  13130. font-size: 20px;
  13131. font-family: "themify";
  13132. color: var(--white);
  13133. line-height: 60px;
  13134. width: 100%;
  13135. height: 100%;
  13136. border: none;
  13137. margin: 0;
  13138. opacity: 1;
  13139. }
  13140. .mfp-arrow-right:before {
  13141. border-left: none;
  13142. content: "\e628";
  13143. font-size: 20px;
  13144. font-family: "themify";
  13145. color: var(--white);
  13146. line-height: 60px;
  13147. width: 100%;
  13148. height: 100%;
  13149. border: none;
  13150. margin: 0;
  13151. opacity: 1;
  13152. }
  13153. .mfp-bottom-bar {
  13154. margin-top: -24px;
  13155. font-size: 12px;
  13156. }
  13157. .mfp-close {
  13158. font-size: 28px;
  13159. font-family: var(--alt-font);
  13160. }
  13161. .mfp-figure {
  13162. -webkit-animation-name: fadeIn;
  13163. -moz-animation-name: fadeIn;
  13164. -o-animation-name: fadeIn;
  13165. -ms-animation-name: fadeIn;
  13166. animation-name: fadeIn;
  13167. -webkit-animation-duration: 0.4s;
  13168. -moz-animation-duration: 0.4s;
  13169. -ms-animation-duration: 0.4s;
  13170. -o-animation-duration: 0.4s;
  13171. animation-duration: 0.4s;
  13172. -webkit-animation-fill-mode: both;
  13173. -moz-animation-fill-mode: both;
  13174. -ms-animation-fill-mode: both;
  13175. -o-animation-fill-mode: both;
  13176. animation-fill-mode: both;
  13177. webkit-backface-visibility: hidden;
  13178. -moz-backface-visibility: hidden;
  13179. -ms-backface-visibility: hidden;
  13180. }
  13181. /* Zoom animation */
  13182. .my-mfp-zoom-in .zoom-anim-dialog {
  13183. opacity: 0;
  13184. -webkit-transform: scale3d(0.9, 0.9, 1);
  13185. -o-transform: scale3d(0.9, 0.9, 1);
  13186. transform: scale3d(0.9, 0.9, 1);
  13187. -webkit-transition: all 0.5s cubic-bezier(0.2, 0, 0.3, 1);
  13188. transition: all 0.5s cubic-bezier(0.2, 0, 0.3, 1);
  13189. }
  13190. .my-mfp-zoom-in.mfp-ready .zoom-anim-dialog {
  13191. opacity: 1;
  13192. -webkit-transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
  13193. -o-transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
  13194. transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
  13195. }
  13196. .my-mfp-zoom-in.mfp-removing .zoom-anim-dialog {
  13197. -webkit-transform: scale(0.8);
  13198. transform: scale(0.8);
  13199. opacity: 0;
  13200. }
  13201. .my-mfp-zoom-in.mfp-bg {
  13202. opacity: 0;
  13203. -webkit-transition: opacity 0.3s ease-out;
  13204. transition: opacity 0.3s ease-out;
  13205. }
  13206. .my-mfp-zoom-in.mfp-ready.mfp-bg {
  13207. opacity: 0.8;
  13208. }
  13209. .my-mfp-zoom-in.mfp-removing.mfp-bg {
  13210. opacity: 0;
  13211. }
  13212. /* Fade animation */
  13213. .my-mfp-slide-bottom .zoom-anim-dialog {
  13214. opacity: 0;
  13215. -webkit-transition: all 0.3s ease-out;
  13216. transition: all 0.3s ease-out;
  13217. -webkit-transform: translateY(-20px) perspective(600px) rotateX(10deg);
  13218. -o-transform: translateY(-20px) perspective(600px) rotateX(10deg);
  13219. transform: translateY(-20px) perspective(600px) rotateX(10deg);
  13220. }
  13221. .my-mfp-slide-bottom.mfp-ready .zoom-anim-dialog {
  13222. opacity: 1;
  13223. -webkit-transform: translateY(0) perspective(600px) rotateX(0);
  13224. -o-transform: translateY(0) perspective(600px) rotateX(0);
  13225. transform: translateY(0) perspective(600px) rotateX(0);
  13226. }
  13227. .my-mfp-slide-bottom.mfp-removing .zoom-anim-dialog {
  13228. opacity: 0;
  13229. -webkit-transform: translateY(-10px) perspective(600px) rotateX(10deg);
  13230. -o-transform: translateY(-10px) perspective(600px) rotateX(10deg);
  13231. transform: translateY(-10px) perspective(600px) rotateX(10deg);
  13232. }
  13233. .my-mfp-slide-bottom.mfp-bg {
  13234. opacity: 0;
  13235. -webkit-transition: opacity 0.3s ease-out;
  13236. transition: opacity 0.3s ease-out;
  13237. }
  13238. .my-mfp-slide-bottom.mfp-ready.mfp-bg {
  13239. opacity: 0.8;
  13240. }
  13241. .my-mfp-slide-bottom.mfp-removing.mfp-bg {
  13242. opacity: 0;
  13243. }
  13244. /* Slide up animation */
  13245. .my-mfp-slide-up .slide-up-popup {
  13246. -webkit-transition: all 0.5s cubic-bezier(0.2, 0, 0.3, 1);
  13247. transition: all 0.5s cubic-bezier(0.2, 0, 0.3, 1);
  13248. -webkit-transform: translate3d(0, 30px, 0);
  13249. transform: translate3d(0, 30px, 0);
  13250. }
  13251. .my-mfp-slide-up.mfp-ready .slide-up-popup {
  13252. -webkit-transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
  13253. -o-transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
  13254. transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
  13255. }
  13256. .my-mfp-slide-up.mfp-removing .slide-up-popup {
  13257. opacity: 0;
  13258. -webkit-transform: translate3d(0, 30px, 0);
  13259. transform: translate3d(0, 30px, 0);
  13260. }
  13261. .my-mfp-slide-up.mfp-bg {
  13262. opacity: 0;
  13263. -webkit-transition: opacity 0.3s ease-out;
  13264. transition: opacity 0.3s ease-out;
  13265. }
  13266. .my-mfp-slide-up.mfp-ready.mfp-bg {
  13267. opacity: 0.8;
  13268. }
  13269. .my-mfp-slide-up.mfp-removing.mfp-bg {
  13270. opacity: 0;
  13271. }
  13272. .mfp-bg {
  13273. background: var(--dark-gray);
  13274. opacity: 0.9;
  13275. }
  13276. .mfp-bg, .mfp-wrap {
  13277. z-index: 10007;
  13278. }
  13279. .mfp-fade.mfp-bg {
  13280. opacity: 0;
  13281. -webkit-transition: all 0.3s ease-out;
  13282. -o-transition: all 0.3s ease-out;
  13283. transition: all 0.3s ease-out;
  13284. }
  13285. .mfp-fade.mfp-bg.mfp-ready {
  13286. opacity: 0.93;
  13287. }
  13288. .mfp-fade.mfp-bg.mfp-removing {
  13289. opacity: 0;
  13290. }
  13291. .mfp-fade.mfp-wrap .mfp-content {
  13292. opacity: 0;
  13293. -webkit-transition: all 0.3s ease-out;
  13294. -o-transition: all 0.3s ease-out;
  13295. transition: all 0.3s ease-out;
  13296. }
  13297. .mfp-fade.mfp-wrap.mfp-ready .mfp-content {
  13298. opacity: 1;
  13299. }
  13300. .mfp-fade.mfp-wrap.mfp-removing .mfp-content {
  13301. opacity: 0;
  13302. }
  13303. .mfp-ajax-holder {
  13304. width: 70%;
  13305. height: calc(100% - 100px);
  13306. margin: 0 auto;
  13307. position: relative;
  13308. top: 50%;
  13309. -webkit-transform: translateY(-50%);
  13310. transform: translateY(-50%);
  13311. }
  13312. button.mfp-close,
  13313. button.mfp-close:active {
  13314. height: 40px;
  13315. width: 40px;
  13316. position: absolute;
  13317. right: 20px;
  13318. top: 20px;
  13319. border-radius: 100%;
  13320. display: flex;
  13321. align-items: center;
  13322. justify-content: center;
  13323. font-size: 0;
  13324. }
  13325. button.mfp-close:before,
  13326. button.mfp-close:active:before {
  13327. content: "\f00d";
  13328. color: var(--black);
  13329. font-family: "Font Awesome 7 Free";
  13330. font-size: 16px;
  13331. font-weight: 900;
  13332. }
  13333. /* Images gallery */
  13334. .mfp-gallery button.mfp-close,
  13335. .mfp-iframe-holder ~ button.mfp-close {
  13336. right: 40px;
  13337. top: 40px;
  13338. background-color: var(--white);
  13339. }
  13340. .mfp-gallery button.mfp-close:before,
  13341. .mfp-iframe-holder ~ button.mfp-close:before {
  13342. color: var(--dark-gray);
  13343. }
  13344. /* Modal popup */
  13345. .modal-popup-main {
  13346. position: relative;
  13347. }
  13348. /* Auto newsletter popup */
  13349. .subscribe-popup .mfp-close,
  13350. .subscribe-popup .mfp-close:active {
  13351. background-color: transparent;
  13352. font-size: 13px;
  13353. line-height: 30px;
  13354. top: 20px;
  13355. right: 20px;
  13356. }
  13357. .subscribe-popup .mfp-close.mfp-close-btn {
  13358. bottom: 0;
  13359. top: inherit;
  13360. position: relative;
  13361. width: auto;
  13362. right: 0;
  13363. height: auto;
  13364. font-size: 14px;
  13365. }
  13366. .subscribe-popup .mfp-close.mfp-close-btn:before {
  13367. display: none;
  13368. }
  13369. .subscribe-popup .mfp-close:before {
  13370. color: var(--dark-gray);
  13371. }
  13372. .subscribe-popup .newsletter-style-02 input {
  13373. padding-right: 70px;
  13374. }
  13375. .subscribe-popup .newsletter-style-02 .btn {
  13376. padding: 6px 25px 9px 25px;
  13377. }
  13378. .newsletter-popup label {
  13379. cursor: pointer;
  13380. }
  13381. /* Parallax background */
  13382. [data-parallax-background-ratio] {
  13383. position: relative !important;
  13384. background-size: cover !important;
  13385. overflow: hidden;
  13386. background-attachment: fixed !important;
  13387. transition-duration: 0s;
  13388. -webkit-transition-duration: 0s;
  13389. }
  13390. /* Video icon effect */
  13391. .video-icon-effect {
  13392. position: relative;
  13393. width: 65px;
  13394. height: 65px;
  13395. border-radius: 50%;
  13396. background-color: var(--white);
  13397. }
  13398. .video-icon-effect:before {
  13399. position: absolute;
  13400. content: "";
  13401. animation: border-transform 7s linear infinite alternate forwards;
  13402. background-color: var(--white);
  13403. width: 100px;
  13404. height: 100px;
  13405. top: -15px;
  13406. left: -15px;
  13407. opacity: 0.2;
  13408. }
  13409. @-webkit-keyframes border-transform {
  13410. 0%, 100% {
  13411. border-radius: 36% 64% 59% 41%/40% 45% 55% 60%;
  13412. }
  13413. 24% {
  13414. border-radius: 37% 63% 60% 40%/46% 52% 48% 54%;
  13415. }
  13416. 32% {
  13417. border-radius: 40% 60% 54% 46%/52% 56% 44% 48%;
  13418. }
  13419. 42% {
  13420. border-radius: 52% 48% 62% 38%/54% 54% 46% 46%;
  13421. }
  13422. 56% {
  13423. border-radius: 60% 40% 65% 35%/54% 50% 50% 46%;
  13424. }
  13425. 70% {
  13426. border-radius: 44% 56% 43% 57%/42% 50% 50% 58%;
  13427. }
  13428. }
  13429. @keyframes border-transform {
  13430. 0%, 100% {
  13431. border-radius: 36% 64% 59% 41%/40% 45% 55% 60%;
  13432. }
  13433. 24% {
  13434. border-radius: 37% 63% 60% 40%/46% 52% 48% 54%;
  13435. }
  13436. 32% {
  13437. border-radius: 40% 60% 54% 46%/52% 56% 44% 48%;
  13438. }
  13439. 42% {
  13440. border-radius: 52% 48% 62% 38%/54% 54% 46% 46%;
  13441. }
  13442. 56% {
  13443. border-radius: 60% 40% 65% 35%/54% 50% 50% 46%;
  13444. }
  13445. 70% {
  13446. border-radius: 44% 56% 43% 57%/42% 50% 50% 58%;
  13447. }
  13448. }
  13449. /* Particles */
  13450. canvas {
  13451. display: block;
  13452. vertical-align: bottom;
  13453. }
  13454. /* Pie chart style 01 */
  13455. .pie-chart-style-01 {
  13456. position: relative;
  13457. display: inline-block;
  13458. }
  13459. .pie-chart-style-01 .percent {
  13460. position: absolute;
  13461. left: 0;
  13462. right: 0;
  13463. margin: 0 auto;
  13464. top: 50%;
  13465. -webkit-transform: translateY(-50%);
  13466. transform: translateY(-50%);
  13467. }
  13468. /* Pricing table style 01 */
  13469. .pricing-table-style-01.popular-item {
  13470. margin-top: -30px;
  13471. }
  13472. /* Pricing table style 02 */
  13473. .pricing-table-style-02 .popular-item {
  13474. left: -10px;
  13475. position: relative;
  13476. z-index: 1;
  13477. width: calc(100% + 20px);
  13478. }
  13479. .pricing-table-style-02 .popular-label {
  13480. position: absolute;
  13481. top: 0;
  13482. left: 50%;
  13483. padding: 1px 20px;
  13484. -webkit-transform: translate(-50%, -50%);
  13485. transform: translate(-50%, -50%);
  13486. }
  13487. /* Pricing table style 04 */
  13488. .pricing-table-style-04 .accordion-item {
  13489. border-radius: 5px !important;
  13490. padding: 16px 35px;
  13491. }
  13492. .pricing-table-style-04 .accordion-item .accordion-body {
  13493. padding: 10px 0;
  13494. }
  13495. .pricing-table-style-04 .accordion-item .icon-round {
  13496. position: absolute;
  13497. top: 50%;
  13498. right: 0;
  13499. text-align: center;
  13500. -webkit-border-radius: 100%;
  13501. border-radius: 100%;
  13502. -webkit-transform: translateY(-50%);
  13503. transform: translateY(-50%);
  13504. }
  13505. .pricing-table-style-04 .accordion-item .icon-round i {
  13506. left: 0;
  13507. font-size: 13px;
  13508. }
  13509. .pricing-table-style-04 .accordion-item.active-accordion {
  13510. padding: 30px 40px;
  13511. background-color: var(--base-color) !important;
  13512. color: var(--white) !important;
  13513. }
  13514. .pricing-table-style-04 .accordion-item.active-accordion .accordion-header .accordion-title {
  13515. color: var(--white) !important;
  13516. }
  13517. .pricing-table-style-04 .accordion-item.active-accordion .icon-round {
  13518. background-color: rgba(0, 0, 0, 0.4);
  13519. color: var(--white) !important;
  13520. }
  13521. /* Pricing table style 07 */
  13522. .pricing-table-style-07 .nav-tabs {
  13523. padding: 0;
  13524. }
  13525. .pricing-table-style-07 .nav-tabs .nav-item {
  13526. width: 100%;
  13527. padding: 0 15px;
  13528. }
  13529. .pricing-table-style-07 .nav-tabs .nav-item .nav-link {
  13530. border: 0;
  13531. color: var(--medium-gray);
  13532. }
  13533. .pricing-table-style-07 .nav-tabs .nav-item .nav-link .icon {
  13534. border-color: rgba(23, 23, 23, 0.2) !important;
  13535. }
  13536. .pricing-table-style-07 .nav-tabs .nav-item .nav-link .icon i {
  13537. opacity: 0;
  13538. }
  13539. .pricing-table-style-07 .nav-tabs .nav-item .nav-link .text-dark-gray {
  13540. -webkit-transition: 0.3s;
  13541. transition: 0.3s;
  13542. }
  13543. .pricing-table-style-07 .nav-tabs .nav-item .nav-link:hover, .pricing-table-style-07 .nav-tabs .nav-item .nav-link.active {
  13544. box-shadow: none;
  13545. background-color: var(--base-color);
  13546. color: var(--white) !important;
  13547. }
  13548. .pricing-table-style-07 .nav-tabs .nav-item .nav-link:hover .text-dark-gray, .pricing-table-style-07 .nav-tabs .nav-item .nav-link.active .text-dark-gray {
  13549. color: var(--white) !important;
  13550. }
  13551. .pricing-table-style-07 .nav-tabs .nav-item .nav-link:hover .icon i, .pricing-table-style-07 .nav-tabs .nav-item .nav-link.active .icon i {
  13552. opacity: 1;
  13553. }
  13554. .pricing-table-style-07 .nav-tabs .nav-item .nav-link:hover .offer, .pricing-table-style-07 .nav-tabs .nav-item .nav-link.active .offer {
  13555. background-color: var(--dark-gray);
  13556. border-color: var(--dark-gray) !important;
  13557. }
  13558. .pricing-table-style-07 .nav-tabs .nav-item .nav-link.active .icon {
  13559. border-color: rgb(255, 255, 255) !important;
  13560. }
  13561. .pricing-table-style-07 .nav-tabs .nav-item .nav-link.active .offer {
  13562. background-color: var(--dark-gray);
  13563. border-color: var(--dark-gray) !important;
  13564. }
  13565. /* Pricing table style 08 */
  13566. .pricing-table-style-08 .nav-tabs {
  13567. position: relative;
  13568. }
  13569. .pricing-table-style-08 .nav-tabs > li.nav-item {
  13570. padding: 0;
  13571. margin: 0;
  13572. }
  13573. .pricing-table-style-08 .nav-tabs > li.nav-item > a.nav-link {
  13574. position: relative;
  13575. padding: 0;
  13576. border: 0;
  13577. color: var(--medium-gray);
  13578. }
  13579. .pricing-table-style-08 .nav-tabs > li.nav-item > a.nav-link .tab-nav-text {
  13580. margin: 0 15px;
  13581. }
  13582. .pricing-table-style-08 .nav-tabs > li.nav-item > a:before {
  13583. content: "";
  13584. display: inline-block;
  13585. width: 22px;
  13586. height: 22px;
  13587. position: absolute;
  13588. bottom: 5px;
  13589. left: calc(50% - 15px);
  13590. opacity: 0;
  13591. border-radius: 50em;
  13592. background-color: #fff;
  13593. -webkit-transform: scale(0.5);
  13594. transform: scale(0.5);
  13595. transition: transform 0.65s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.65s cubic-bezier(0.23, 1, 0.32, 1);
  13596. -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
  13597. box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
  13598. }
  13599. .pricing-table-style-08 .nav-tabs > li.nav-item > a:after {
  13600. content: "";
  13601. display: inline-block;
  13602. width: 100%;
  13603. height: 32px;
  13604. background-color: #152bca;
  13605. }
  13606. .pricing-table-style-08 .nav-tabs > li.nav-item > a.active {
  13607. color: var(--dark-gray);
  13608. background-color: transparent;
  13609. }
  13610. .pricing-table-style-08 .nav-tabs > li.nav-item > a.active:before {
  13611. opacity: 1;
  13612. -webkit-transform: scale(1);
  13613. transform: scale(1);
  13614. }
  13615. .pricing-table-style-08 .nav-tabs > li.nav-item:first-child a {
  13616. flex-direction: row;
  13617. }
  13618. .pricing-table-style-08 .nav-tabs > li.nav-item:first-child a:before {
  13619. left: auto;
  13620. right: 0px;
  13621. }
  13622. .pricing-table-style-08 .nav-tabs > li.nav-item:first-child a:after {
  13623. border-radius: 50em 0 0 50em;
  13624. width: 28px;
  13625. }
  13626. .pricing-table-style-08 .nav-tabs > li.nav-item:last-child a {
  13627. flex-direction: row-reverse;
  13628. }
  13629. .pricing-table-style-08 .nav-tabs > li.nav-item:last-child a:after {
  13630. width: 30px;
  13631. border-radius: 0 50em 50em 0;
  13632. }
  13633. .pricing-table-style-08 .nav-tabs > li.nav-item:last-child a:before {
  13634. left: 2px;
  13635. }
  13636. /* Pricing table style 09 */
  13637. .pricing-table-style-09 .row {
  13638. -webkit-transition: all 400ms cubic-bezier(0.61, 1, 0.88, 1);
  13639. transition: all 400ms cubic-bezier(0.61, 1, 0.88, 1);
  13640. }
  13641. .pricing-table-style-09 .row img, .pricing-table-style-09 .row i {
  13642. -webkit-transition: all 400ms cubic-bezier(0.61, 1, 0.88, 1);
  13643. transition: all 400ms cubic-bezier(0.61, 1, 0.88, 1);
  13644. }
  13645. .pricing-table-style-09 .row:hover {
  13646. -webkit-box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08);
  13647. box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08);
  13648. }
  13649. .pricing-table-style-09 .row:hover img, .pricing-table-style-09 .row:hover i {
  13650. -webkit-transform: scale(1.1);
  13651. transform: scale(1.1);
  13652. }
  13653. .pricing-table-style-09 .action {
  13654. -webkit-transition: 0.3s;
  13655. transition: 0.3s;
  13656. }
  13657. .pricing-table-style-09 .action:hover {
  13658. margin-right: -5px;
  13659. }
  13660. /* Pricing table style 10 */
  13661. .pricing-table-style-10 .cover-background {
  13662. filter: grayscale(0);
  13663. -webkit-transition: all 700ms cubic-bezier(0.61, 1, 0.88, 1);
  13664. transition: all 700ms cubic-bezier(0.61, 1, 0.88, 1);
  13665. }
  13666. .pricing-table-style-10 .popular-label {
  13667. position: absolute;
  13668. top: 0;
  13669. right: 50px;
  13670. z-index: 1;
  13671. height: 100px;
  13672. width: 100px;
  13673. display: flex;
  13674. align-items: center;
  13675. justify-content: center;
  13676. -webkit-transform: translate(0, -50%);
  13677. transform: translate(0, -50%);
  13678. }
  13679. .pricing-table-style-10:hover .cover-background {
  13680. filter: grayscale(100%);
  13681. }
  13682. /* Pricing table style 11 */
  13683. .pricing-table-style-11 li {
  13684. list-style: none;
  13685. padding: 25px 0;
  13686. position: relative;
  13687. -webkit-transition: all 200ms cubic-bezier(0.37, 0.8, 0.63, 1);
  13688. transition: all 200ms cubic-bezier(0.37, 0.8, 0.63, 1);
  13689. }
  13690. .pricing-table-style-11 li .popular-label {
  13691. position: absolute;
  13692. border-radius: 100%;
  13693. display: flex;
  13694. align-items: center;
  13695. justify-content: center;
  13696. }
  13697. .pricing-table-style-11 li:hover {
  13698. -webkit-transform: scale(1.03);
  13699. transform: scale(1.03);
  13700. }
  13701. /* Pricing table style 12 */
  13702. .pricing-table-style-12 {
  13703. padding: 0;
  13704. margin: 0;
  13705. list-style: none;
  13706. }
  13707. .pricing-table-style-12 li {
  13708. display: -webkit-box;
  13709. display: -ms-flexbox;
  13710. display: flex;
  13711. -webkit-box-align: center;
  13712. -ms-flex-align: center;
  13713. align-items: center;
  13714. padding: 15px 0;
  13715. -webkit-transition: all 500ms cubic-bezier(0.61, 1, 0.88, 1);
  13716. transition: all 500ms cubic-bezier(0.61, 1, 0.88, 1);
  13717. }
  13718. .pricing-table-style-12 li:last-child {
  13719. padding-bottom: 0;
  13720. }
  13721. .pricing-table-style-12 li:hover {
  13722. -webkit-transform: translateX(15px);
  13723. transform: translateX(15px);
  13724. }
  13725. /* Pricing table style 13 */
  13726. .pricing-table-style-13 {
  13727. padding: 0;
  13728. margin: 0;
  13729. list-style: none;
  13730. }
  13731. .pricing-table-style-13 li {
  13732. display: -webkit-box;
  13733. display: -ms-flexbox;
  13734. display: flex;
  13735. -webkit-box-align: center;
  13736. -ms-flex-align: center;
  13737. align-items: center;
  13738. padding: 25px 0;
  13739. -webkit-transition: all 500ms cubic-bezier(0.61, 1, 0.88, 1);
  13740. transition: all 500ms cubic-bezier(0.61, 1, 0.88, 1);
  13741. }
  13742. .pricing-table-style-13 li:last-child {
  13743. padding-bottom: 0;
  13744. }
  13745. .pricing-table-style-13 li:hover {
  13746. -webkit-transform: translateX(15px);
  13747. transform: translateX(15px);
  13748. }
  13749. /* Process step style 01 */
  13750. .process-step-style-01 .progress-step-separator {
  13751. position: absolute;
  13752. top: 50%;
  13753. left: calc(100% + 20px);
  13754. -webkit-transform: translateX(-50%);
  13755. transform: translateX(-50%);
  13756. }
  13757. .process-step-style-01 .process-step-icon {
  13758. position: relative;
  13759. text-align: center;
  13760. display: inline-block;
  13761. vertical-align: middle;
  13762. }
  13763. .process-step-style-01:hover .box-overlay {
  13764. -webkit-transform: scale(1.2);
  13765. transform: scale(1.2);
  13766. }
  13767. .process-step-style-01:hover .number, .process-step-style-01:hover .icon {
  13768. color: var(--white);
  13769. }
  13770. .process-step-style-01:hover .border-color-transparent-on-hover {
  13771. border-color: transparent !important;
  13772. }
  13773. /* Process step style 02 */
  13774. .process-step-style-02 .process-step-icon {
  13775. overflow: hidden;
  13776. position: relative;
  13777. text-align: center;
  13778. display: inline-block;
  13779. vertical-align: middle;
  13780. will-change: transform;
  13781. }
  13782. .process-step-style-02 .progress-step-separator {
  13783. position: absolute;
  13784. top: 50%;
  13785. left: calc(100% + 15px);
  13786. -webkit-transform: translateX(-50%);
  13787. transform: translateX(-50%);
  13788. }
  13789. .process-step-style-02:hover .process-step-icon {
  13790. -webkit-transform: scale(1.1);
  13791. transform: scale(1.1);
  13792. will-change: transform;
  13793. }
  13794. /* Process step style 03 */
  13795. .process-step-style-03.hover-box * {
  13796. will-change: auto;
  13797. vertical-align: top;
  13798. }
  13799. .process-step-style-03 .process-step-icon-box .progress-step-separator {
  13800. position: absolute;
  13801. top: 50%;
  13802. left: calc(100% + 15px);
  13803. -webkit-transform: translateX(-50%);
  13804. transform: translateX(-50%);
  13805. -webkit-transition: 0.4s;
  13806. transition: 0.4s;
  13807. }
  13808. .process-step-style-03 .process-step-icon-box .number {
  13809. opacity: 0;
  13810. visibility: hidden;
  13811. -webkit-transition: 0.4s;
  13812. transition: 0.4s;
  13813. top: 55%;
  13814. }
  13815. .process-step-style-03:hover .process-step-icon-box .box-overlay {
  13816. opacity: 0.9;
  13817. }
  13818. .process-step-style-03:hover .process-step-icon-box .number {
  13819. opacity: 1;
  13820. visibility: visible;
  13821. top: 50%;
  13822. }
  13823. .process-step-style-03:hover .process-step-icon-box img {
  13824. -webkit-transform: scale(1.1);
  13825. transform: scale(1.1);
  13826. }
  13827. .process-step-style-03:hover .process-step-icon-box .progress-image {
  13828. -webkit-transform: scale(1.1);
  13829. transform: scale(1.1);
  13830. }
  13831. /* Process step style 04 */
  13832. .process-step-style-04 .process-step-icon-box {
  13833. will-change: transform;
  13834. }
  13835. .process-step-style-04 .process-step-icon-box .progress-step-separator {
  13836. position: absolute;
  13837. top: 50%;
  13838. left: calc(100% + 15px);
  13839. -webkit-transform: translateX(-50%);
  13840. transform: translateX(-50%);
  13841. }
  13842. .process-step-style-04:hover .process-step-icon-box .number, .process-step-style-04:hover .process-step-icon-box .icon {
  13843. -webkit-transform: scale(1.3);
  13844. transform: scale(1.3);
  13845. }
  13846. /* Process step style 05 */
  13847. .process-step-style-05 .process-step-item {
  13848. display: flex;
  13849. position: relative;
  13850. flex-flow: row wrap;
  13851. align-items: stretch;
  13852. justify-content: flex-start;
  13853. text-align: left;
  13854. }
  13855. .process-step-style-05 .process-content {
  13856. overflow: hidden;
  13857. flex: 1;
  13858. max-width: 100%;
  13859. }
  13860. .process-step-style-05 .progress-step-separator {
  13861. position: absolute;
  13862. bottom: 15px;
  13863. width: 1px;
  13864. left: 50%;
  13865. height: calc(100% - 100px);
  13866. }
  13867. .process-step-style-05 .process-step-icon {
  13868. will-change: transform;
  13869. -webkit-transition: all 350ms cubic-bezier(0.165, 0.84, 0.44, 1.7);
  13870. transition: all 350ms cubic-bezier(0.165, 0.84, 0.44, 1.7);
  13871. }
  13872. .process-step-style-05:hover .process-step-icon {
  13873. -webkit-transform: scale(1.1);
  13874. transform: scale(1.1);
  13875. }
  13876. .process-step-style-05:hover .number, .process-step-style-05:hover .icon {
  13877. color: var(--white);
  13878. }
  13879. /* Process step style 07 */
  13880. .process-step-style-06 .process-step-icon-box .progress-step-separator {
  13881. position: absolute;
  13882. top: 50%;
  13883. left: 0;
  13884. }
  13885. .process-step-style-06:hover .process-step-icon-box .step-box {
  13886. -webkit-transform: scale(1.3);
  13887. transform: scale(1.3);
  13888. }
  13889. /* Process step style 08 */
  13890. .process-step-style-08 .process-step-item {
  13891. -webkit-transform: translateY(0);
  13892. transform: translateY(0);
  13893. -webkit-transition: all 350ms cubic-bezier(0.23, 1, 0.32, 1);
  13894. transition: all 350ms cubic-bezier(0.23, 1, 0.32, 1);
  13895. }
  13896. .process-step-style-08 .process-step-item:hover {
  13897. -webkit-transform: translateY(-8px);
  13898. transform: translateY(-8px);
  13899. }
  13900. /* Process step style 09 */
  13901. .process-step-style-09 .progress-right-icon {
  13902. position: absolute;
  13903. top: 50%;
  13904. left: 100%;
  13905. -webkit-transform: translateY(-50%);
  13906. transform: translateY(-50%);
  13907. }
  13908. .process-step-style-09 .process-step-icon {
  13909. position: relative;
  13910. text-align: center;
  13911. display: inline-block;
  13912. vertical-align: middle;
  13913. }
  13914. .process-step-style-09:hover .box-overlay {
  13915. -webkit-transform: scale(1.2);
  13916. transform: scale(1.2);
  13917. }
  13918. .process-step-style-09:hover .border-color-transparent-on-hover {
  13919. border-color: transparent !important;
  13920. }
  13921. /* Process step style 10 */
  13922. .process-step-style-10 .process-step-icon-box {
  13923. -webkit-transition: all 650ms cubic-bezier(0.23, 1, 0.32, 1);
  13924. transition: all 650ms cubic-bezier(0.23, 1, 0.32, 1);
  13925. }
  13926. .process-step-style-10:hover .process-step-icon-box {
  13927. -webkit-transform: translateX(20px) scale(1.1);
  13928. transform: translateX(20px) scale(1.1);
  13929. }
  13930. .process-step-style-10.hover-box .hover-content {
  13931. opacity: 0;
  13932. position: absolute;
  13933. left: 0;
  13934. bottom: -15px;
  13935. }
  13936. .process-step-style-10.hover-box:hover .hover-content {
  13937. opacity: 1;
  13938. bottom: -5px;
  13939. }
  13940. /* Process step style 11 */
  13941. .process-step-style-11 .process-step-icon-wrap {
  13942. z-index: 1;
  13943. background-color: var(--base-color);
  13944. background-size: 4px 4px;
  13945. -webkit-transition: all 650ms cubic-bezier(0.23, 1, 0.32, 1);
  13946. transition: all 650ms cubic-bezier(0.23, 1, 0.32, 1);
  13947. }
  13948. .process-step-style-11:hover .process-step-icon-wrap {
  13949. background-color: var(--dark-gray);
  13950. background-image: none;
  13951. -webkit-transform: scale(1.1);
  13952. transform: scale(1.1);
  13953. -webkit-transition: all 650ms cubic-bezier(0.23, 1, 0.32, 1);
  13954. transition: all 650ms cubic-bezier(0.23, 1, 0.32, 1);
  13955. }
  13956. /* Progress bar */
  13957. .progress {
  13958. position: relative;
  13959. overflow: visible;
  13960. }
  13961. .progress .progress-bar {
  13962. width: 0px;
  13963. position: absolute;
  13964. top: 0;
  13965. left: 0;
  13966. overflow: visible;
  13967. -webkit-transition: all 1s cubic-bezier(0.5, 1, 0.5, 1);
  13968. transition: all 1s cubic-bezier(0.5, 1, 0.5, 1);
  13969. }
  13970. .progress .progress-bar.appear .progress-bar-percent {
  13971. opacity: 1;
  13972. }
  13973. .progress-bar-percent {
  13974. opacity: 0;
  13975. }
  13976. /* Progress bar style 01 */
  13977. .progress-bar-style-01 .progress {
  13978. height: 4px;
  13979. border-radius: 0;
  13980. }
  13981. .progress-bar-style-01 .progress .progress-bar-title {
  13982. position: absolute;
  13983. bottom: 10px;
  13984. }
  13985. .progress-bar-style-01 .progress .progress-bar-percent {
  13986. position: absolute;
  13987. bottom: 17px;
  13988. right: -20px;
  13989. padding: 7px;
  13990. min-width: 40px;
  13991. min-height: 26px;
  13992. border-radius: 3px;
  13993. }
  13994. .progress-bar-style-01 .progress .progress-bar-percent:after {
  13995. content: "";
  13996. top: 100%;
  13997. left: 50%;
  13998. height: 0;
  13999. width: 0;
  14000. z-index: 9;
  14001. margin-left: -4px;
  14002. border-width: 4px;
  14003. position: absolute;
  14004. pointer-events: none;
  14005. border: solid transparent;
  14006. border-top-color: #232323;
  14007. }
  14008. .progress-bar-style-01 .progress .progress-bar {
  14009. height: 100%;
  14010. }
  14011. /* Progress bar style 02 */
  14012. .progress-bar-style-02 .progress {
  14013. height: 30px;
  14014. overflow: hidden;
  14015. }
  14016. .progress-bar-style-02 .progress .progress-bar-percent {
  14017. position: absolute;
  14018. top: 9px;
  14019. right: 20px;
  14020. min-width: 26px;
  14021. }
  14022. .progress-bar-style-02 .progress .progress-bar-title {
  14023. position: absolute;
  14024. top: 9px;
  14025. left: 20px;
  14026. }
  14027. .progress-bar-style-02 .progress .progress-bar {
  14028. width: 0px;
  14029. height: 100%;
  14030. position: absolute;
  14031. }
  14032. /* Progress bar style 03 */
  14033. .progress-bar-style-03 .progress {
  14034. height: 4px;
  14035. }
  14036. .progress-bar-style-03 .progress .progress-bar-title {
  14037. position: absolute;
  14038. bottom: 14px;
  14039. }
  14040. .progress-bar-style-03 .progress .progress-bar {
  14041. height: 100%;
  14042. }
  14043. .progress-bar-style-03 .progress .progress-bar-percent {
  14044. position: absolute;
  14045. bottom: 14px;
  14046. right: 0;
  14047. opacity: 1;
  14048. }
  14049. /* Progress bar style 04 */
  14050. .progress-bar-style-04 .progress {
  14051. height: 8px;
  14052. border-radius: 6px;
  14053. }
  14054. .progress-bar-style-04 .progress .progress-bar-title {
  14055. position: absolute;
  14056. bottom: 15px;
  14057. }
  14058. .progress-bar-style-04 .progress .progress-bar {
  14059. height: 100%;
  14060. border-radius: 6px;
  14061. }
  14062. .progress-bar-style-04 .progress .progress-bar-percent {
  14063. position: absolute;
  14064. bottom: 15px;
  14065. right: 0px;
  14066. }
  14067. .review-star-icon i {
  14068. color: #fd961e;
  14069. letter-spacing: 1px;
  14070. }
  14071. .review-star-icon.review-star-icon-white i {
  14072. color: var(--white);
  14073. }
  14074. /* Review style 03 */
  14075. .review-style-03 .slider-review-image-thumbs {
  14076. padding: 10px;
  14077. height: auto;
  14078. }
  14079. .review-style-03 .slider-review-image-thumbs .swiper-slide:not(.swiper-slide-thumb-active) img {
  14080. -webkit-transform: scale(0.8);
  14081. transform: scale(0.8);
  14082. }
  14083. .review-style-03 .slider-review-image-thumbs img {
  14084. border: 6px solid transparent;
  14085. margin: 0 auto;
  14086. -webkit-transition: all 0.3s ease-in-out;
  14087. transition: all 0.3s ease-in-out;
  14088. }
  14089. .review-style-03 .slider-review-image-thumbs .swiper-slide-thumb-active img {
  14090. box-shadow: 0 0 30px rgba(0, 0, 0, 0.05);
  14091. border: 6px solid #ffffff;
  14092. }
  14093. .review-style-03 .slider-review-image-thumbs .swiper-slide {
  14094. cursor: pointer;
  14095. }
  14096. /* Review style 08 */
  14097. .swiper-fade .review-style-08.swiper-slide {
  14098. opacity: 0 !important;
  14099. }
  14100. .swiper-fade .review-style-08.swiper-slide.swiper-slide-active {
  14101. opacity: 1 !important;
  14102. }
  14103. /* Rotate box */
  14104. .rotate-box {
  14105. will-change: transform;
  14106. min-height: 250px;
  14107. -webkit-perspective: 1000;
  14108. perspective: 1000;
  14109. -webkit-transform-style: preserve-3d;
  14110. transform-style: preserve-3d;
  14111. }
  14112. .rotate-box p {
  14113. color: rgba(255, 255, 255, 0.7);
  14114. }
  14115. .rotate-box .front-side, .rotate-box .back-side {
  14116. position: absolute;
  14117. top: 0;
  14118. -webkit-backface-visibility: hidden;
  14119. backface-visibility: hidden;
  14120. -webkit-transition: transform 0.6s cubic-bezier(0.5, 0.3, 0.3, 1);
  14121. transition: transform 0.6s cubic-bezier(0.5, 0.3, 0.3, 1);
  14122. }
  14123. .rotate-box .rotate-content-front, .rotate-box .rotate-content-back {
  14124. position: relative;
  14125. top: 50%;
  14126. -webkit-transform-style: preserve-3d;
  14127. transform-style: preserve-3d;
  14128. -webkit-transition: transform 0.6s cubic-bezier(0.5, 0.3, 0.3, 1);
  14129. transition: transform 0.6s cubic-bezier(0.5, 0.3, 0.3, 1);
  14130. }
  14131. .rotate-box.to-left .front-side, .rotate-box.to-right .front-side {
  14132. z-index: 1;
  14133. -webkit-transform: rotateY(0deg);
  14134. transform: rotateY(0deg);
  14135. -webkit-transform-style: preserve-3d;
  14136. transform-style: preserve-3d;
  14137. }
  14138. .rotate-box.to-left .rotate-content-front, .rotate-box.to-right .rotate-content-front {
  14139. -webkit-transform: translateY(-50%) translateX(0px) scale(1);
  14140. transform: translateY(-50%) translateX(0px) scale(1);
  14141. }
  14142. .rotate-box.to-left:hover .back-side, .rotate-box.to-right:hover .back-side {
  14143. -webkit-transform: rotateY(0deg);
  14144. transform: rotateY(0deg);
  14145. -webkit-transform-style: preserve-3d;
  14146. transform-style: preserve-3d;
  14147. }
  14148. .rotate-box.to-left:hover .rotate-content-back, .rotate-box.to-right:hover .rotate-content-back {
  14149. -webkit-transform: translateY(-50%) translateX(0px) translateZ(0px) scale(1);
  14150. transform: translateY(-50%) translateX(0px) translateZ(0px) scale(1);
  14151. -webkit-transform-style: preserve-3d;
  14152. transform-style: preserve-3d;
  14153. }
  14154. .rotate-box.to-left .back-side {
  14155. -webkit-transform: rotateY(180deg);
  14156. transform: rotateY(180deg);
  14157. -webkit-transform-style: preserve-3d;
  14158. transform-style: preserve-3d;
  14159. z-index: 1;
  14160. }
  14161. .rotate-box.to-left .rotate-content-back {
  14162. -webkit-transform: translateY(-50%) translateX(400px) translateZ(60px) scale(0.88);
  14163. transform: translateY(-50%) translateX(400px) translateZ(60px) scale(0.88);
  14164. }
  14165. .rotate-box.to-left:hover .front-side {
  14166. -webkit-transform: rotateY(-180deg);
  14167. transform: rotateY(-180deg);
  14168. -webkit-transform-style: preserve-3d;
  14169. transform-style: preserve-3d;
  14170. }
  14171. .rotate-box.to-left:hover .rotate-content-front {
  14172. -webkit-transform: translateY(-50%) translateX(-400px) scale(0.88);
  14173. transform: translateY(-50%) translateX(-400px) scale(0.88);
  14174. -webkit-transform-style: preserve-3d;
  14175. transform-style: preserve-3d;
  14176. }
  14177. .rotate-box.to-right .back-side {
  14178. -webkit-transform: rotateY(-180deg);
  14179. transform: rotateY(-180deg);
  14180. -webkit-transform-style: preserve-3d;
  14181. transform-style: preserve-3d;
  14182. z-index: 1;
  14183. }
  14184. .rotate-box.to-right .rotate-content-back {
  14185. -webkit-transform: translateY(-50%) translateX(-400px) translateZ(60px) scale(0.88);
  14186. transform: translateY(-50%) translateX(-400px) translateZ(60px) scale(0.88);
  14187. }
  14188. .rotate-box.to-right:hover .front-side {
  14189. -webkit-transform: rotateY(180deg);
  14190. transform: rotateY(180deg);
  14191. -webkit-transform-style: preserve-3d;
  14192. transform-style: preserve-3d;
  14193. }
  14194. .rotate-box.to-right:hover .rotate-content-front {
  14195. -webkit-transform: translateY(-50%) translateX(400px) scale(0.88);
  14196. transform: translateY(-50%) translateX(400px) scale(0.88);
  14197. -webkit-transform-style: preserve-3d;
  14198. transform-style: preserve-3d;
  14199. }
  14200. .rotate-box.to-top .front-side, .rotate-box.to-bottom .front-side {
  14201. -webkit-transform: rotateX(0deg);
  14202. transform: rotateX(0deg);
  14203. -webkit-transform-style: preserve-3d;
  14204. transform-style: preserve-3d;
  14205. }
  14206. .rotate-box.to-top .rotate-content-front, .rotate-box.to-bottom .rotate-content-front {
  14207. -webkit-transform: translateY(-50%) translateX(0px) scale(1);
  14208. transform: translateY(-50%) translateX(0px) scale(1);
  14209. }
  14210. .rotate-box.to-top:hover .back-side, .rotate-box.to-bottom:hover .back-side {
  14211. -webkit-transform: rotateX(0deg);
  14212. transform: rotateX(0deg);
  14213. -webkit-transform-style: preserve-3d;
  14214. transform-style: preserve-3d;
  14215. z-index: 1;
  14216. }
  14217. .rotate-box.to-top:hover .rotate-content-front, .rotate-box.to-bottom:hover .rotate-content-front {
  14218. -webkit-transform: translateY(-50%) translateY(400px) scale(0.88);
  14219. transform: translateY(-50%) translateY(400px) scale(0.88);
  14220. -webkit-transform-style: preserve-3d;
  14221. transform-style: preserve-3d;
  14222. }
  14223. .rotate-box.to-top:hover .rotate-content-back, .rotate-box.to-bottom:hover .rotate-content-back {
  14224. -webkit-transform: translateY(-50%) translateY(0px) translateZ(0px) scale(1);
  14225. transform: translateY(-50%) translateY(0px) translateZ(0px) scale(1);
  14226. -webkit-transform-style: preserve-3d;
  14227. transform-style: preserve-3d;
  14228. }
  14229. .rotate-box.to-top .back-side {
  14230. -webkit-transform: rotateX(180deg);
  14231. transform: rotateX(180deg);
  14232. -webkit-transform-style: preserve-3d;
  14233. transform-style: preserve-3d;
  14234. z-index: 1;
  14235. }
  14236. .rotate-box.to-top .rotate-content-back {
  14237. -webkit-transform: translateY(-50%) translateY(-400px) translateZ(60px) scale(0.88);
  14238. transform: translateY(-50%) translateY(-400px) translateZ(60px) scale(0.88);
  14239. }
  14240. .rotate-box.to-top:hover .front-side {
  14241. -webkit-transform: rotateX(-180deg);
  14242. transform: rotateX(-180deg);
  14243. -webkit-transform-style: preserve-3d;
  14244. transform-style: preserve-3d;
  14245. }
  14246. .rotate-box.to-bottom .back-side {
  14247. -webkit-transform: rotateX(-180deg);
  14248. transform: rotateX(-180deg);
  14249. -webkit-transform-style: preserve-3d;
  14250. transform-style: preserve-3d;
  14251. z-index: 1;
  14252. }
  14253. .rotate-box.to-bottom .rotate-content-back {
  14254. -webkit-transform: translateY(-50%) translateY(400px) translateZ(60px) scale(0.88);
  14255. transform: translateY(-50%) translateY(400px) translateZ(60px) scale(0.88);
  14256. }
  14257. .rotate-box.to-bottom:hover .front-side {
  14258. -webkit-transform: rotateX(180deg);
  14259. transform: rotateX(180deg);
  14260. -webkit-transform-style: preserve-3d;
  14261. transform-style: preserve-3d;
  14262. }
  14263. .to-top {
  14264. animation: toTop 0.3s linear forwards;
  14265. }
  14266. .to-right {
  14267. animation: toRight 0.3s linear forwards;
  14268. }
  14269. .to-bottom {
  14270. animation: toBottom 0.3s linear forwards;
  14271. }
  14272. .to-left {
  14273. animation: toLeft 0.3s linear forwards;
  14274. }
  14275. /* Rotate box style 01 */
  14276. .rotate-box-style-01 * {
  14277. will-change: transform;
  14278. }
  14279. .rotate-box-style-01 .rm-rotate-box {
  14280. position: relative;
  14281. }
  14282. .rotate-box-style-01 .flipper {
  14283. position: relative;
  14284. }
  14285. .rotate-box-style-01 .flipper:hover .front {
  14286. -webkit-transform: rotateY(-180deg);
  14287. transform: rotateY(-180deg);
  14288. }
  14289. .rotate-box-style-01 .flipper:hover .back {
  14290. -webkit-transform: rotateY(0deg);
  14291. transform: rotateY(0deg);
  14292. }
  14293. .rotate-box-style-01 .flipper.to-right .front {
  14294. -webkit-transform: rotateY(0deg);
  14295. transform: rotateY(0deg);
  14296. }
  14297. .rotate-box-style-01 .flipper.to-right .back {
  14298. -webkit-transform: rotateY(-180deg);
  14299. transform: rotateY(-180deg);
  14300. }
  14301. .rotate-box-style-01 .flipper.to-right:hover .front {
  14302. -webkit-transform: rotateY(180deg);
  14303. transform: rotateY(180deg);
  14304. }
  14305. .rotate-box-style-01 .flipper.to-right:hover .back {
  14306. -webkit-transform: rotateY(0deg);
  14307. transform: rotateY(0deg);
  14308. }
  14309. .rotate-box-style-01 .flipper.to-top .front {
  14310. -webkit-transform: rotateX(0deg);
  14311. transform: rotateX(0deg);
  14312. }
  14313. .rotate-box-style-01 .flipper.to-top .back {
  14314. -webkit-transform: rotateX(-180deg);
  14315. transform: rotateX(-180deg);
  14316. }
  14317. .rotate-box-style-01 .flipper.to-top:hover .front {
  14318. -webkit-transform: rotateX(180deg);
  14319. transform: rotateX(180deg);
  14320. }
  14321. .rotate-box-style-01 .flipper.to-top:hover .back {
  14322. -webkit-transform: rotateX(0deg);
  14323. transform: rotateX(0deg);
  14324. }
  14325. .rotate-box-style-01 .flipper.to-bottom .front {
  14326. -webkit-transform: rotateX(0deg);
  14327. transform: rotateX(0deg);
  14328. }
  14329. .rotate-box-style-01 .flipper.to-bottom .back {
  14330. -webkit-transform: rotateX(180deg);
  14331. transform: rotateX(180deg);
  14332. }
  14333. .rotate-box-style-01 .flipper.to-bottom:hover .front {
  14334. -webkit-transform: rotateX(-180deg);
  14335. transform: rotateX(-180deg);
  14336. }
  14337. .rotate-box-style-01 .flipper.to-bottom:hover .back {
  14338. -webkit-transform: rotateX(0deg);
  14339. transform: rotateX(0deg);
  14340. }
  14341. .rotate-box-style-01 .thumb-wrap {
  14342. perspective: 1000px;
  14343. transform-style: preserve-3d;
  14344. }
  14345. .rotate-box-style-01 .content-wrap {
  14346. position: absolute;
  14347. width: 100%;
  14348. display: block;
  14349. transform-style: preserve-3d;
  14350. perspective: inherit;
  14351. backface-visibility: hidden;
  14352. -webkit-backface-visibility: hidden;
  14353. z-index: 2;
  14354. bottom: 55px;
  14355. left: 0;
  14356. transform: translate3d(0, 0, 0) scale(1);
  14357. }
  14358. .rotate-box-style-01 .front {
  14359. -webkit-transform: rotateY(0deg);
  14360. transform: rotateY(0deg);
  14361. background-size: cover;
  14362. z-index: 1;
  14363. transform-style: preserve-3d;
  14364. -webkit-transform-style: preserve-3d;
  14365. backface-visibility: hidden;
  14366. -webkit-backface-visibility: hidden;
  14367. perspective: inherit;
  14368. transition: transform 0.8s cubic-bezier(0.5, 0.2, 0.2, 0.8);
  14369. }
  14370. .rotate-box-style-01 .back {
  14371. -webkit-transform: rotateY(180deg);
  14372. transform: rotateY(180deg);
  14373. position: absolute;
  14374. display: block;
  14375. top: 0;
  14376. left: 0;
  14377. width: 100%;
  14378. height: 100%;
  14379. transform-style: preserve-3d;
  14380. -webkit-transform-style: preserve-3d;
  14381. backface-visibility: hidden;
  14382. -webkit-backface-visibility: hidden;
  14383. perspective: inherit;
  14384. transition: transform 0.8s cubic-bezier(0.5, 0.2, 0.2, 0.8);
  14385. }
  14386. .rotate-box-style-01 .back .content-wrap {
  14387. top: 50%;
  14388. bottom: inherit;
  14389. left: 0;
  14390. transform: translate3d(0, -50%, 0) scale(1);
  14391. }
  14392. .rotate-box-style-01 .back .box-overlay {
  14393. visibility: visible;
  14394. opacity: 1;
  14395. }
  14396. /* Rotate box style 02 */
  14397. .rotate-box-style-02 .rotate-box {
  14398. min-height: 350px;
  14399. }
  14400. /* Services box style 01 */
  14401. .services-box-style-01 .icon-box {
  14402. opacity: 0;
  14403. margin-top: 15px;
  14404. }
  14405. .services-box-style-01 .box-image {
  14406. overflow: hidden;
  14407. }
  14408. .services-box-style-01 .box-image img {
  14409. width: 100%;
  14410. }
  14411. .services-box-style-01 .box-overlay {
  14412. z-index: 1;
  14413. -webkit-transition: all 500ms cubic-bezier(0.61, 1, 0.88, 1);
  14414. transition: all 500ms cubic-bezier(0.61, 1, 0.88, 1);
  14415. }
  14416. .services-box-style-01:hover img {
  14417. -webkit-transform: scale(1.1);
  14418. transform: scale(1.1);
  14419. -webkit-transition: all 500ms cubic-bezier(61, 10, 88, 10);
  14420. transition: all 500ms cubic-bezier(61, 10, 88, 10);
  14421. }
  14422. .services-box-style-01:hover .icon-box {
  14423. opacity: 1;
  14424. margin-top: 0;
  14425. }
  14426. .services-box-style-01:hover .box-overlay {
  14427. opacity: 0.8;
  14428. }
  14429. /* Services box style 02 */
  14430. .services-box-style-02 .box-overlay {
  14431. z-index: 1;
  14432. -webkit-transition: all 450ms ease-in-out;
  14433. transition: all 450ms ease-in-out;
  14434. }
  14435. .services-box-style-02.hover-box:hover .box-overlay {
  14436. opacity: 1;
  14437. }
  14438. /* Services box style 05 */
  14439. .services-box-style-05 img {
  14440. -webkit-transition: 0.3s;
  14441. transition: 0.3s;
  14442. width: 100%;
  14443. }
  14444. .services-box-style-05 figure {
  14445. position: relative;
  14446. }
  14447. .services-box-style-05 figure figcaption {
  14448. position: absolute;
  14449. top: 0;
  14450. }
  14451. .services-box-style-05 figure figcaption a {
  14452. display: inline-block;
  14453. color: var(--dark-gray);
  14454. }
  14455. .services-box-style-05 figure figcaption .content-box {
  14456. margin-bottom: -80px;
  14457. }
  14458. .services-box-style-05 figure:hover figcaption .btn-link {
  14459. color: var(--white);
  14460. border-color: var(--white);
  14461. }
  14462. .services-box-style-05 figure:hover figcaption .box-title {
  14463. color: var(--white);
  14464. }
  14465. .services-box-style-05 figure:hover figcaption .box-overlay {
  14466. opacity: 1;
  14467. visibility: visible;
  14468. }
  14469. /* Services box style 06 */
  14470. .services-box-style-06 .services-text:after {
  14471. content: "\f309";
  14472. display: inline-block;
  14473. font-family: bootstrap-icons;
  14474. vertical-align: middle;
  14475. margin: -2px 2px 0;
  14476. font-size: 22px;
  14477. color: var(--medium-gray);
  14478. opacity: 0.7;
  14479. }
  14480. .services-box-style-06:hover img {
  14481. -webkit-transform: scale(1.1);
  14482. transform: scale(1.1);
  14483. -webkit-transition: all 500ms cubic-bezier(61, 10, 88, 10);
  14484. transition: all 500ms cubic-bezier(61, 10, 88, 10);
  14485. }
  14486. /* Services box style 07 */
  14487. .services-box-style-07 .btn-hover {
  14488. position: absolute;
  14489. left: 0;
  14490. top: 100%;
  14491. width: 100%;
  14492. height: 100%;
  14493. -webkit-transition: all 0.3s linear;
  14494. transition: all 0.3s linear;
  14495. }
  14496. .services-box-style-07 .text-down {
  14497. -webkit-transition: all 0.3s linear;
  14498. transition: all 0.3s linear;
  14499. }
  14500. .services-box-style-07:hover .btn-hover {
  14501. top: 0;
  14502. }
  14503. .services-box-style-07:hover .text-down {
  14504. -webkit-transform: translateY(20px);
  14505. transform: translateY(20px);
  14506. }
  14507. /* Services box style 08 */
  14508. .services-box-style-08 .box-shadow-quadruple-large-hover {
  14509. -webkit-transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  14510. transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  14511. }
  14512. /* Services box style 09 */
  14513. .services-box-style-09:hover {
  14514. color: var(--white);
  14515. }
  14516. .services-box-style-09:hover .reveal-action {
  14517. color: var(--white);
  14518. padding-right: 40px;
  14519. }
  14520. .services-box-style-09:hover .reveal-title {
  14521. padding-left: 40px;
  14522. }
  14523. .services-box-style-09:hover .reveal-overlay {
  14524. height: 100%;
  14525. }
  14526. .services-box-style-09 .reveal-overlay {
  14527. position: absolute;
  14528. top: 0;
  14529. left: 0;
  14530. width: 100%;
  14531. height: 0;
  14532. z-index: -1;
  14533. -webkit-transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  14534. transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  14535. }
  14536. .services-box-style-09.overlay-light:hover {
  14537. color: var(--dark-gray);
  14538. }
  14539. .services-box-style-09.overlay-light:hover .reveal-action {
  14540. color: var(--dark-gray);
  14541. }
  14542. /* Sliding box zoom effect */
  14543. @keyframes scale-effect {
  14544. 0% {
  14545. -webkit-transform: scale(0.9);
  14546. transform: scale(0.9);
  14547. }
  14548. to {
  14549. -webkit-transform: scale(1);
  14550. transform: scale(1);
  14551. }
  14552. }
  14553. @-webkit-keyframes scale-effect {
  14554. 0% {
  14555. -webkit-transform: scale(0.9);
  14556. transform: scale(0.9);
  14557. }
  14558. to {
  14559. -webkit-transform: scale(1);
  14560. transform: scale(1);
  14561. }
  14562. }
  14563. /* Sliding box fade effect */
  14564. @keyframes fade {
  14565. 0% {
  14566. opacity: 0.2;
  14567. }
  14568. to {
  14569. opacity: 1;
  14570. }
  14571. }
  14572. @-webkit-keyframes fade {
  14573. 0% {
  14574. opacity: 0.2;
  14575. }
  14576. to {
  14577. opacity: 1;
  14578. }
  14579. }
  14580. /* Sliding box right effect */
  14581. @keyframes slide-right {
  14582. 0% {
  14583. -webkit-transform: translateX(-25px);
  14584. transform: translateX(-25px);
  14585. }
  14586. to {
  14587. -webkit-transform: translateX(0);
  14588. transform: translateX(0);
  14589. }
  14590. }
  14591. @-webkit-keyframes slide-right {
  14592. 0% {
  14593. -webkit-transform: translateX(-25px);
  14594. transform: translateX(-25px);
  14595. }
  14596. to {
  14597. -webkit-transform: translateX(0);
  14598. transform: translateX(0);
  14599. }
  14600. }
  14601. /* Sliding box */
  14602. .sliding-box * {
  14603. will-change: transform;
  14604. }
  14605. .sliding-box .sliding-box-item {
  14606. margin-left: 15px;
  14607. margin-right: 15px;
  14608. float: left;
  14609. overflow: hidden;
  14610. position: relative;
  14611. -webkit-transition: width 0.7s;
  14612. transition: width 0.7s;
  14613. }
  14614. .sliding-box .sliding-box-item .sliding-box-content {
  14615. top: 0;
  14616. height: 100%;
  14617. position: absolute;
  14618. }
  14619. /* Sliding box style 01 */
  14620. .sliding-box-style-01 .sliding-box-item .sliding-box-content:after {
  14621. content: "";
  14622. right: 100%;
  14623. top: 50%;
  14624. height: 0;
  14625. width: 0;
  14626. opacity: 0;
  14627. z-index: 9;
  14628. margin-top: -10px;
  14629. position: absolute;
  14630. border: solid transparent;
  14631. border-right-color: var(--white);
  14632. border-width: 12px;
  14633. pointer-events: none;
  14634. -webkit-transition: all 0.2s linear;
  14635. transition: all 0.2s linear;
  14636. }
  14637. .sliding-box-style-01 .sliding-box-item.active .sliding-box-content:after, .sliding-box-style-01 .sliding-box-item:hover .sliding-box-content:after {
  14638. opacity: 1;
  14639. }
  14640. /* Sliding box style 02 */
  14641. .sliding-box-style-02 .sliding-box-item .sliding-box-img {
  14642. border-radius: 4px;
  14643. -webkit-transition: all 0.2s linear;
  14644. transition: all 0.2s linear;
  14645. }
  14646. .sliding-box-style-02 .sliding-box-item.active .sliding-box-img {
  14647. border-radius: 4px 0 0 4px;
  14648. }
  14649. .sliding-box-style-02 .sliding-box-item.active .sliding-box-content {
  14650. border-radius: 0 4px 4px 0;
  14651. }
  14652. .sliding-box-style-02 .sliding-box-item.active .content-hover {
  14653. animation: fade 1s;
  14654. }
  14655. /* Sliding box style 03 */
  14656. .sliding-box-style-03 .overlay {
  14657. position: absolute;
  14658. top: 0px;
  14659. left: 0px;
  14660. width: 100%;
  14661. height: 100%;
  14662. opacity: 0.5;
  14663. z-index: 1;
  14664. -webkit-transition: all 0.3s linear;
  14665. transition: all 0.3s linear;
  14666. }
  14667. .sliding-box-style-03 .overlay-contnet {
  14668. position: absolute;
  14669. left: 0;
  14670. top: 0;
  14671. opacity: 1;
  14672. visibility: visible;
  14673. -webkit-transition: all 0.4s linear;
  14674. transition: all 0.4s linear;
  14675. }
  14676. .sliding-box-style-03 .number {
  14677. position: absolute;
  14678. bottom: -30px;
  14679. left: 0;
  14680. right: 0;
  14681. text-align: center;
  14682. }
  14683. .sliding-box-style-03 .sliding-box-content:after {
  14684. display: none;
  14685. }
  14686. .sliding-box-style-03.active .overlay {
  14687. opacity: 0;
  14688. visibility: hidden;
  14689. }
  14690. .sliding-box-style-03.active .overlay-contnet {
  14691. opacity: 0;
  14692. visibility: hidden;
  14693. }
  14694. /* Social media icon */
  14695. .elements-social .behance:hover {
  14696. color: #1769ff;
  14697. }
  14698. .elements-social .behance-square:hover {
  14699. color: #1769ff;
  14700. }
  14701. .elements-social .blogger:hover {
  14702. color: #ff8000;
  14703. }
  14704. .elements-social .codepen:hover {
  14705. color: #0ebeff;
  14706. }
  14707. .elements-social .deviantart:hover {
  14708. color: #05cc47;
  14709. }
  14710. .elements-social .digg:hover {
  14711. color: #262626;
  14712. }
  14713. .elements-social .dribbble:hover {
  14714. color: #ea4c89;
  14715. }
  14716. .elements-social .delicious:hover {
  14717. color: #205cc0;
  14718. }
  14719. .elements-social .email:hover {
  14720. color: #7d7d7d;
  14721. }
  14722. .elements-social .facebook:hover {
  14723. color: #3b5998;
  14724. }
  14725. .elements-social .facebook-square:hover {
  14726. color: #3b5998;
  14727. }
  14728. .elements-social .flickr:hover {
  14729. color: #ff0084;
  14730. }
  14731. .elements-social .flipboard:hover {
  14732. color: #e12828;
  14733. }
  14734. .elements-social .github:hover {
  14735. color: #4078c0;
  14736. }
  14737. .elements-social .google:hover {
  14738. color: #dc4a38;
  14739. }
  14740. .elements-social .google-plus:hover {
  14741. color: #dd4b39;
  14742. }
  14743. .elements-social .instagram:hover {
  14744. color: #FE1F49;
  14745. }
  14746. .elements-social .jsfiddle:hover {
  14747. color: #0084FF;
  14748. }
  14749. .elements-social .linkedin:hover {
  14750. color: #0077b5;
  14751. }
  14752. .elements-social .livejournal:hover {
  14753. color: #00b0ea;
  14754. }
  14755. .elements-social .medium:hover {
  14756. color: #00ab6c;
  14757. }
  14758. .elements-social .meneame:hover {
  14759. color: #ff6400;
  14760. }
  14761. .elements-social .mailru:hover {
  14762. color: #168de2;
  14763. }
  14764. .elements-social .odnoklassniki:hover {
  14765. color: #d7772d;
  14766. }
  14767. .elements-social .paypal:hover {
  14768. color: #003087;
  14769. }
  14770. .elements-social .pinterest:hover {
  14771. color: #CB2027;
  14772. }
  14773. .elements-social .pinterest-p:hover {
  14774. color: #CB2027;
  14775. }
  14776. .elements-social .print:hover {
  14777. color: #222222;
  14778. }
  14779. .elements-social .reddit:hover {
  14780. color: #ff4500;
  14781. }
  14782. .elements-social .reddit-square:hover {
  14783. color: #ff4500;
  14784. }
  14785. .elements-social .rss:hover {
  14786. color: #f2890a;
  14787. }
  14788. .elements-social .skype:hover {
  14789. color: #00aff0;
  14790. }
  14791. .elements-social .slack:hover {
  14792. color: #6ecadc;
  14793. }
  14794. .elements-social .snapchat:hover {
  14795. color: #fffc00;
  14796. }
  14797. .elements-social .soundcloud:hover {
  14798. color: #ff8800;
  14799. }
  14800. .elements-social .spotify:hover {
  14801. color: #1db954;
  14802. }
  14803. .elements-social .sms:hover {
  14804. color: #ffbd00;
  14805. }
  14806. .elements-social .sharethis:hover {
  14807. color: #95D03A;
  14808. }
  14809. .elements-social .stack-overflow:hover {
  14810. color: #f48024;
  14811. }
  14812. .elements-social .stumbleupon:hover {
  14813. color: #eb4924;
  14814. }
  14815. .elements-social .telegram:hover {
  14816. color: #0088cc;
  14817. }
  14818. .elements-social .trello:hover {
  14819. color: #0079bf;
  14820. }
  14821. .elements-social .tumblr:hover {
  14822. color: #32506d;
  14823. }
  14824. .elements-social .twitch:hover {
  14825. color: #6441a5;
  14826. }
  14827. .elements-social .twitter:hover {
  14828. color: #00aced;
  14829. }
  14830. .elements-social .twitter-square:hover {
  14831. color: #00aced;
  14832. }
  14833. .elements-social .vimeo:hover {
  14834. color: #1ab7ea;
  14835. }
  14836. .elements-social .vine:hover {
  14837. color: #00bf8f;
  14838. }
  14839. .elements-social .vk:hover {
  14840. color: #4c6c91;
  14841. }
  14842. .elements-social .wordpress:hover {
  14843. color: #21759b;
  14844. }
  14845. .elements-social .weibo:hover {
  14846. color: #ff9933;
  14847. }
  14848. .elements-social .whatsapp:hover {
  14849. color: #25d366;
  14850. }
  14851. .elements-social .xing:hover {
  14852. color: #1a7576;
  14853. }
  14854. .elements-social .youtube:hover {
  14855. color: #ff0000;
  14856. }
  14857. .elements-social .youtube-play:hover {
  14858. color: #ff0000;
  14859. }
  14860. .elements-social ul {
  14861. margin-bottom: 0;
  14862. list-style: none;
  14863. padding: 0;
  14864. }
  14865. .elements-social ul li {
  14866. display: inline-block;
  14867. }
  14868. .elements-social ul li:first-child {
  14869. margin-left: 0 !important;
  14870. }
  14871. .elements-social ul li:last-child {
  14872. margin-right: 0 !important;
  14873. }
  14874. .elements-social ul li a {
  14875. text-align: center;
  14876. display: flex;
  14877. align-items: center;
  14878. justify-content: center;
  14879. -webkit-transition: 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  14880. transition: 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  14881. }
  14882. .extra-small-icon li {
  14883. margin: 0 2px;
  14884. }
  14885. .extra-small-icon a {
  14886. font-size: 14px;
  14887. width: 30px;
  14888. height: 30px;
  14889. }
  14890. .small-icon li {
  14891. margin: 0 5px;
  14892. }
  14893. .small-icon a {
  14894. font-size: 18px;
  14895. width: 40px;
  14896. height: 40px;
  14897. }
  14898. .medium-icon li {
  14899. margin: 0 8px;
  14900. }
  14901. .medium-icon a {
  14902. font-size: 20px;
  14903. width: 50px;
  14904. height: 50px;
  14905. }
  14906. .large-icon li {
  14907. margin: 0 10px;
  14908. }
  14909. .large-icon a {
  14910. font-size: 24px;
  14911. width: 60px;
  14912. height: 60px;
  14913. }
  14914. .extra-large-icon li {
  14915. margin: 0 12px;
  14916. }
  14917. .extra-large-icon a {
  14918. font-size: 30px;
  14919. width: 70px;
  14920. height: 70px;
  14921. }
  14922. .social-icon a {
  14923. margin: 0 15px;
  14924. }
  14925. .social-icon a:first-child {
  14926. margin-left: 0;
  14927. }
  14928. .social-icon a:last-child {
  14929. margin-right: 0;
  14930. }
  14931. [class^=social-icon-] ul, [class*=" social-icon-"] ul {
  14932. list-style: none;
  14933. }
  14934. /* Social icon dark and light */
  14935. .elements-social .light li a {
  14936. color: var(--white);
  14937. }
  14938. .elements-social .dark li a {
  14939. color: var(--dark-gray);
  14940. }
  14941. .elements-social .icon-with-animation a:hover {
  14942. -webkit-transform: translateY(-8px);
  14943. transform: translateY(-8px);
  14944. }
  14945. /* Social icon style 01 */
  14946. .social-icon-style-01 ul li a:hover {
  14947. color: var(--base-color) !important;
  14948. }
  14949. /* Social icon style 03 */
  14950. .social-icon-style-03 ul li a {
  14951. color: var(--white);
  14952. border-radius: 100%;
  14953. -webkit-transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  14954. transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  14955. }
  14956. .social-icon-style-03 ul li a:hover {
  14957. background-color: var(--white) !important;
  14958. box-shadow: 0 0 30px rgba(23, 23, 23, 0.25);
  14959. transform: translate3d(0, -3px, 0);
  14960. }
  14961. .social-icon-style-03 ul li a.behance {
  14962. background-color: #1769ff;
  14963. }
  14964. .social-icon-style-03 ul li a.behance-square {
  14965. background-color: #1769ff;
  14966. }
  14967. .social-icon-style-03 ul li a.blogger {
  14968. background-color: #ff8000;
  14969. }
  14970. .social-icon-style-03 ul li a.codepen {
  14971. background-color: #0ebeff;
  14972. }
  14973. .social-icon-style-03 ul li a.deviantart {
  14974. background-color: #05cc47;
  14975. }
  14976. .social-icon-style-03 ul li a.digg {
  14977. background-color: #262626;
  14978. }
  14979. .social-icon-style-03 ul li a.dribbble {
  14980. background-color: #ea4c89;
  14981. }
  14982. .social-icon-style-03 ul li a.delicious {
  14983. background-color: #205cc0;
  14984. }
  14985. .social-icon-style-03 ul li a.email {
  14986. background-color: #7d7d7d;
  14987. }
  14988. .social-icon-style-03 ul li a.facebook {
  14989. background-color: #3b5998;
  14990. }
  14991. .social-icon-style-03 ul li a.facebook-square {
  14992. background-color: #3b5998;
  14993. }
  14994. .social-icon-style-03 ul li a.flickr {
  14995. background-color: #ff0084;
  14996. }
  14997. .social-icon-style-03 ul li a.flipboard {
  14998. background-color: #e12828;
  14999. }
  15000. .social-icon-style-03 ul li a.github {
  15001. background-color: #4078c0;
  15002. }
  15003. .social-icon-style-03 ul li a.google {
  15004. background-color: #dc4a38;
  15005. }
  15006. .social-icon-style-03 ul li a.google-plus {
  15007. background-color: #dd4b39;
  15008. }
  15009. .social-icon-style-03 ul li a.instagram {
  15010. background-color: #FE1F49;
  15011. }
  15012. .social-icon-style-03 ul li a.jsfiddle {
  15013. background-color: #0084FF;
  15014. }
  15015. .social-icon-style-03 ul li a.linkedin {
  15016. background-color: #0077b5;
  15017. }
  15018. .social-icon-style-03 ul li a.livejournal {
  15019. background-color: #00b0ea;
  15020. }
  15021. .social-icon-style-03 ul li a.medium {
  15022. background-color: #00ab6c;
  15023. }
  15024. .social-icon-style-03 ul li a.meneame {
  15025. background-color: #ff6400;
  15026. }
  15027. .social-icon-style-03 ul li a.mailru {
  15028. background-color: #168de2;
  15029. }
  15030. .social-icon-style-03 ul li a.odnoklassniki {
  15031. background-color: #d7772d;
  15032. }
  15033. .social-icon-style-03 ul li a.paypal {
  15034. background-color: #003087;
  15035. }
  15036. .social-icon-style-03 ul li a.pinterest {
  15037. background-color: #CB2027;
  15038. }
  15039. .social-icon-style-03 ul li a.pinterest-p {
  15040. background-color: #CB2027;
  15041. }
  15042. .social-icon-style-03 ul li a.print {
  15043. background-color: #222222;
  15044. }
  15045. .social-icon-style-03 ul li a.reddit {
  15046. background-color: #ff4500;
  15047. }
  15048. .social-icon-style-03 ul li a.reddit-square {
  15049. background-color: #ff4500;
  15050. }
  15051. .social-icon-style-03 ul li a.rss {
  15052. background-color: #f2890a;
  15053. }
  15054. .social-icon-style-03 ul li a.skype {
  15055. background-color: #00aff0;
  15056. }
  15057. .social-icon-style-03 ul li a.slack {
  15058. background-color: #6ecadc;
  15059. }
  15060. .social-icon-style-03 ul li a.snapchat {
  15061. background-color: #fffc00;
  15062. }
  15063. .social-icon-style-03 ul li a.soundcloud {
  15064. background-color: #ff8800;
  15065. }
  15066. .social-icon-style-03 ul li a.spotify {
  15067. background-color: #1db954;
  15068. }
  15069. .social-icon-style-03 ul li a.sms {
  15070. background-color: #ffbd00;
  15071. }
  15072. .social-icon-style-03 ul li a.sharethis {
  15073. background-color: #95D03A;
  15074. }
  15075. .social-icon-style-03 ul li a.stack-overflow {
  15076. background-color: #f48024;
  15077. }
  15078. .social-icon-style-03 ul li a.stumbleupon {
  15079. background-color: #eb4924;
  15080. }
  15081. .social-icon-style-03 ul li a.telegram {
  15082. background-color: #0088cc;
  15083. }
  15084. .social-icon-style-03 ul li a.trello {
  15085. background-color: #0079bf;
  15086. }
  15087. .social-icon-style-03 ul li a.tumblr {
  15088. background-color: #32506d;
  15089. }
  15090. .social-icon-style-03 ul li a.twitch {
  15091. background-color: #6441a5;
  15092. }
  15093. .social-icon-style-03 ul li a.twitter {
  15094. background-color: #00aced;
  15095. }
  15096. .social-icon-style-03 ul li a.twitter-square {
  15097. background-color: #00aced;
  15098. }
  15099. .social-icon-style-03 ul li a.vimeo {
  15100. background-color: #1ab7ea;
  15101. }
  15102. .social-icon-style-03 ul li a.vine {
  15103. background-color: #00bf8f;
  15104. }
  15105. .social-icon-style-03 ul li a.vk {
  15106. background-color: #4c6c91;
  15107. }
  15108. .social-icon-style-03 ul li a.wordpress {
  15109. background-color: #21759b;
  15110. }
  15111. .social-icon-style-03 ul li a.weibo {
  15112. background-color: #ff9933;
  15113. }
  15114. .social-icon-style-03 ul li a.whatsapp {
  15115. background-color: #25d366;
  15116. }
  15117. .social-icon-style-03 ul li a.xing {
  15118. background-color: #1a7576;
  15119. }
  15120. .social-icon-style-03 ul li a.youtube {
  15121. background-color: #ff0000;
  15122. }
  15123. .social-icon-style-03 ul li a.youtube-play {
  15124. background-color: #ff0000;
  15125. }
  15126. /* Social icon style 04 */
  15127. .social-icon-style-04 ul li a {
  15128. z-index: 9;
  15129. position: relative;
  15130. }
  15131. .social-icon-style-04 ul li a:hover {
  15132. color: var(--white) !important;
  15133. }
  15134. .social-icon-style-04 ul li a:hover span {
  15135. width: 100%;
  15136. height: 100%;
  15137. border-radius: 100%;
  15138. top: 0;
  15139. left: 0;
  15140. }
  15141. .social-icon-style-04 ul li a span {
  15142. border-radius: 0;
  15143. display: block;
  15144. height: 0;
  15145. width: 0;
  15146. left: 50%;
  15147. margin: 0;
  15148. position: absolute;
  15149. top: 50%;
  15150. -webkit-transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  15151. transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  15152. z-index: -1;
  15153. background-color: var(--dark-gray);
  15154. }
  15155. .social-icon-style-04 ul li a.behance span {
  15156. background-color: #1769ff;
  15157. }
  15158. .social-icon-style-04 ul li a.behance-square span {
  15159. background-color: #1769ff;
  15160. }
  15161. .social-icon-style-04 ul li a.blogger span {
  15162. background-color: #ff8000;
  15163. }
  15164. .social-icon-style-04 ul li a.codepen span {
  15165. background-color: #0ebeff;
  15166. }
  15167. .social-icon-style-04 ul li a.deviantart span {
  15168. background-color: #05cc47;
  15169. }
  15170. .social-icon-style-04 ul li a.digg span {
  15171. background-color: #262626;
  15172. }
  15173. .social-icon-style-04 ul li a.dribbble span {
  15174. background-color: #ea4c89;
  15175. }
  15176. .social-icon-style-04 ul li a.delicious span {
  15177. background-color: #205cc0;
  15178. }
  15179. .social-icon-style-04 ul li a.email span {
  15180. background-color: #7d7d7d;
  15181. }
  15182. .social-icon-style-04 ul li a.facebook span {
  15183. background-color: #3b5998;
  15184. }
  15185. .social-icon-style-04 ul li a.facebook-square span {
  15186. background-color: #3b5998;
  15187. }
  15188. .social-icon-style-04 ul li a.flickr span {
  15189. background-color: #ff0084;
  15190. }
  15191. .social-icon-style-04 ul li a.flipboard span {
  15192. background-color: #e12828;
  15193. }
  15194. .social-icon-style-04 ul li a.github span {
  15195. background-color: #4078c0;
  15196. }
  15197. .social-icon-style-04 ul li a.google span {
  15198. background-color: #dc4a38;
  15199. }
  15200. .social-icon-style-04 ul li a.google-plus span {
  15201. background-color: #dd4b39;
  15202. }
  15203. .social-icon-style-04 ul li a.instagram span {
  15204. background-color: #FE1F49;
  15205. }
  15206. .social-icon-style-04 ul li a.jsfiddle span {
  15207. background-color: #0084FF;
  15208. }
  15209. .social-icon-style-04 ul li a.linkedin span {
  15210. background-color: #0077b5;
  15211. }
  15212. .social-icon-style-04 ul li a.livejournal span {
  15213. background-color: #00b0ea;
  15214. }
  15215. .social-icon-style-04 ul li a.medium span {
  15216. background-color: #00ab6c;
  15217. }
  15218. .social-icon-style-04 ul li a.meneame span {
  15219. background-color: #ff6400;
  15220. }
  15221. .social-icon-style-04 ul li a.mailru span {
  15222. background-color: #168de2;
  15223. }
  15224. .social-icon-style-04 ul li a.odnoklassniki span {
  15225. background-color: #d7772d;
  15226. }
  15227. .social-icon-style-04 ul li a.paypal span {
  15228. background-color: #003087;
  15229. }
  15230. .social-icon-style-04 ul li a.pinterest span {
  15231. background-color: #CB2027;
  15232. }
  15233. .social-icon-style-04 ul li a.pinterest-p span {
  15234. background-color: #CB2027;
  15235. }
  15236. .social-icon-style-04 ul li a.print span {
  15237. background-color: #222222;
  15238. }
  15239. .social-icon-style-04 ul li a.reddit span {
  15240. background-color: #ff4500;
  15241. }
  15242. .social-icon-style-04 ul li a.reddit-square span {
  15243. background-color: #ff4500;
  15244. }
  15245. .social-icon-style-04 ul li a.rss span {
  15246. background-color: #f2890a;
  15247. }
  15248. .social-icon-style-04 ul li a.skype span {
  15249. background-color: #00aff0;
  15250. }
  15251. .social-icon-style-04 ul li a.slack span {
  15252. background-color: #6ecadc;
  15253. }
  15254. .social-icon-style-04 ul li a.snapchat span {
  15255. background-color: #fffc00;
  15256. }
  15257. .social-icon-style-04 ul li a.soundcloud span {
  15258. background-color: #ff8800;
  15259. }
  15260. .social-icon-style-04 ul li a.spotify span {
  15261. background-color: #1db954;
  15262. }
  15263. .social-icon-style-04 ul li a.sms span {
  15264. background-color: #ffbd00;
  15265. }
  15266. .social-icon-style-04 ul li a.sharethis span {
  15267. background-color: #95D03A;
  15268. }
  15269. .social-icon-style-04 ul li a.stack-overflow span {
  15270. background-color: #f48024;
  15271. }
  15272. .social-icon-style-04 ul li a.stumbleupon span {
  15273. background-color: #eb4924;
  15274. }
  15275. .social-icon-style-04 ul li a.telegram span {
  15276. background-color: #0088cc;
  15277. }
  15278. .social-icon-style-04 ul li a.trello span {
  15279. background-color: #0079bf;
  15280. }
  15281. .social-icon-style-04 ul li a.tumblr span {
  15282. background-color: #32506d;
  15283. }
  15284. .social-icon-style-04 ul li a.twitch span {
  15285. background-color: #6441a5;
  15286. }
  15287. .social-icon-style-04 ul li a.twitter span {
  15288. background-color: #00aced;
  15289. }
  15290. .social-icon-style-04 ul li a.twitter-square span {
  15291. background-color: #00aced;
  15292. }
  15293. .social-icon-style-04 ul li a.vimeo span {
  15294. background-color: #1ab7ea;
  15295. }
  15296. .social-icon-style-04 ul li a.vine span {
  15297. background-color: #00bf8f;
  15298. }
  15299. .social-icon-style-04 ul li a.vk span {
  15300. background-color: #4c6c91;
  15301. }
  15302. .social-icon-style-04 ul li a.wordpress span {
  15303. background-color: #21759b;
  15304. }
  15305. .social-icon-style-04 ul li a.weibo span {
  15306. background-color: #ff9933;
  15307. }
  15308. .social-icon-style-04 ul li a.whatsapp span {
  15309. background-color: #25d366;
  15310. }
  15311. .social-icon-style-04 ul li a.xing span {
  15312. background-color: #1a7576;
  15313. }
  15314. .social-icon-style-04 ul li a.youtube span {
  15315. background-color: #ff0000;
  15316. }
  15317. .social-icon-style-04 ul li a.youtube-play span {
  15318. background-color: #ff0000;
  15319. }
  15320. /* Social icon style 05 */
  15321. .social-icon-style-05 ul li a:hover {
  15322. color: var(--white) !important;
  15323. }
  15324. .social-icon-style-05 ul li a.behance {
  15325. color: #1769ff;
  15326. }
  15327. .social-icon-style-05 ul li a.behance-square {
  15328. color: #1769ff;
  15329. }
  15330. .social-icon-style-05 ul li a.blogger {
  15331. color: #ff8000;
  15332. }
  15333. .social-icon-style-05 ul li a.codepen {
  15334. color: #0ebeff;
  15335. }
  15336. .social-icon-style-05 ul li a.deviantart {
  15337. color: #05cc47;
  15338. }
  15339. .social-icon-style-05 ul li a.digg {
  15340. color: #262626;
  15341. }
  15342. .social-icon-style-05 ul li a.dribbble {
  15343. color: #ea4c89;
  15344. }
  15345. .social-icon-style-05 ul li a.delicious {
  15346. color: #205cc0;
  15347. }
  15348. .social-icon-style-05 ul li a.email {
  15349. color: #7d7d7d;
  15350. }
  15351. .social-icon-style-05 ul li a.facebook {
  15352. color: #3b5998;
  15353. }
  15354. .social-icon-style-05 ul li a.facebook-square {
  15355. color: #3b5998;
  15356. }
  15357. .social-icon-style-05 ul li a.flickr {
  15358. color: #ff0084;
  15359. }
  15360. .social-icon-style-05 ul li a.flipboard {
  15361. color: #e12828;
  15362. }
  15363. .social-icon-style-05 ul li a.github {
  15364. color: #4078c0;
  15365. }
  15366. .social-icon-style-05 ul li a.google {
  15367. color: #dc4a38;
  15368. }
  15369. .social-icon-style-05 ul li a.google-plus {
  15370. color: #dd4b39;
  15371. }
  15372. .social-icon-style-05 ul li a.instagram {
  15373. color: #FE1F49;
  15374. }
  15375. .social-icon-style-05 ul li a.jsfiddle {
  15376. color: #0084FF;
  15377. }
  15378. .social-icon-style-05 ul li a.linkedin {
  15379. color: #0077b5;
  15380. }
  15381. .social-icon-style-05 ul li a.livejournal {
  15382. color: #00b0ea;
  15383. }
  15384. .social-icon-style-05 ul li a.medium {
  15385. color: #00ab6c;
  15386. }
  15387. .social-icon-style-05 ul li a.meneame {
  15388. color: #ff6400;
  15389. }
  15390. .social-icon-style-05 ul li a.mailru {
  15391. color: #168de2;
  15392. }
  15393. .social-icon-style-05 ul li a.odnoklassniki {
  15394. color: #d7772d;
  15395. }
  15396. .social-icon-style-05 ul li a.paypal {
  15397. color: #003087;
  15398. }
  15399. .social-icon-style-05 ul li a.pinterest {
  15400. color: #CB2027;
  15401. }
  15402. .social-icon-style-05 ul li a.pinterest-p {
  15403. color: #CB2027;
  15404. }
  15405. .social-icon-style-05 ul li a.print {
  15406. color: #222222;
  15407. }
  15408. .social-icon-style-05 ul li a.reddit {
  15409. color: #ff4500;
  15410. }
  15411. .social-icon-style-05 ul li a.reddit-square {
  15412. color: #ff4500;
  15413. }
  15414. .social-icon-style-05 ul li a.rss {
  15415. color: #f2890a;
  15416. }
  15417. .social-icon-style-05 ul li a.skype {
  15418. color: #00aff0;
  15419. }
  15420. .social-icon-style-05 ul li a.slack {
  15421. color: #6ecadc;
  15422. }
  15423. .social-icon-style-05 ul li a.snapchat {
  15424. color: #fffc00;
  15425. }
  15426. .social-icon-style-05 ul li a.soundcloud {
  15427. color: #ff8800;
  15428. }
  15429. .social-icon-style-05 ul li a.spotify {
  15430. color: #1db954;
  15431. }
  15432. .social-icon-style-05 ul li a.sms {
  15433. color: #ffbd00;
  15434. }
  15435. .social-icon-style-05 ul li a.sharethis {
  15436. color: #95D03A;
  15437. }
  15438. .social-icon-style-05 ul li a.stack-overflow {
  15439. color: #f48024;
  15440. }
  15441. .social-icon-style-05 ul li a.stumbleupon {
  15442. color: #eb4924;
  15443. }
  15444. .social-icon-style-05 ul li a.telegram {
  15445. color: #0088cc;
  15446. }
  15447. .social-icon-style-05 ul li a.trello {
  15448. color: #0079bf;
  15449. }
  15450. .social-icon-style-05 ul li a.tumblr {
  15451. color: #32506d;
  15452. }
  15453. .social-icon-style-05 ul li a.twitch {
  15454. color: #6441a5;
  15455. }
  15456. .social-icon-style-05 ul li a.twitter {
  15457. color: #00aced;
  15458. }
  15459. .social-icon-style-05 ul li a.twitter-square {
  15460. color: #00aced;
  15461. }
  15462. .social-icon-style-05 ul li a.vimeo {
  15463. color: #1ab7ea;
  15464. }
  15465. .social-icon-style-05 ul li a.vine {
  15466. color: #00bf8f;
  15467. }
  15468. .social-icon-style-05 ul li a.vk {
  15469. color: #4c6c91;
  15470. }
  15471. .social-icon-style-05 ul li a.wordpress {
  15472. color: #21759b;
  15473. }
  15474. .social-icon-style-05 ul li a.weibo {
  15475. color: #ff9933;
  15476. }
  15477. .social-icon-style-05 ul li a.whatsapp {
  15478. color: #25d366;
  15479. }
  15480. .social-icon-style-05 ul li a.xing {
  15481. color: #1a7576;
  15482. }
  15483. .social-icon-style-05 ul li a.youtube {
  15484. color: #ff0000;
  15485. }
  15486. .social-icon-style-05 ul li a.youtube-play {
  15487. color: #ff0000;
  15488. }
  15489. .social-icon-style-05 ul.dark li a:hover {
  15490. color: var(--dark-gray) !important;
  15491. }
  15492. /* Social icon style 06 */
  15493. .social-icon-style-06 ul li a {
  15494. display: inline-block;
  15495. height: auto;
  15496. width: auto;
  15497. padding: 0 24px;
  15498. position: relative;
  15499. vertical-align: middle;
  15500. overflow: hidden;
  15501. }
  15502. .social-icon-style-06 ul li a .brand-icon {
  15503. position: absolute;
  15504. height: 100%;
  15505. width: 100%;
  15506. left: 0;
  15507. top: 100%;
  15508. transition-duration: 0.3s;
  15509. }
  15510. .social-icon-style-06 ul li a > span {
  15511. line-height: inherit;
  15512. top: 0px;
  15513. position: relative;
  15514. transition: 350ms cubic-bezier(0.175, 0.885, 0.32, 1.275) all;
  15515. }
  15516. .social-icon-style-06 ul li a:hover .brand-label {
  15517. top: -50px;
  15518. transition: 350ms cubic-bezier(0.175, 0.885, 0.32, 1.275) all;
  15519. }
  15520. .social-icon-style-06 ul li a:hover .brand-icon {
  15521. top: 0;
  15522. transition-duration: 0.3s;
  15523. }
  15524. .social-icon-style-06 ul li a.behance {
  15525. color: #1769ff;
  15526. }
  15527. .social-icon-style-06 ul li a.behance-square {
  15528. color: #1769ff;
  15529. }
  15530. .social-icon-style-06 ul li a.blogger {
  15531. color: #ff8000;
  15532. }
  15533. .social-icon-style-06 ul li a.codepen {
  15534. color: #0ebeff;
  15535. }
  15536. .social-icon-style-06 ul li a.deviantart {
  15537. color: #05cc47;
  15538. }
  15539. .social-icon-style-06 ul li a.digg {
  15540. color: #262626;
  15541. }
  15542. .social-icon-style-06 ul li a.dribbble {
  15543. color: #ea4c89;
  15544. }
  15545. .social-icon-style-06 ul li a.delicious {
  15546. color: #205cc0;
  15547. }
  15548. .social-icon-style-06 ul li a.email {
  15549. color: #7d7d7d;
  15550. }
  15551. .social-icon-style-06 ul li a.facebook {
  15552. color: #3b5998;
  15553. }
  15554. .social-icon-style-06 ul li a.facebook-square {
  15555. color: #3b5998;
  15556. }
  15557. .social-icon-style-06 ul li a.flickr {
  15558. color: #ff0084;
  15559. }
  15560. .social-icon-style-06 ul li a.flipboard {
  15561. color: #e12828;
  15562. }
  15563. .social-icon-style-06 ul li a.github {
  15564. color: #4078c0;
  15565. }
  15566. .social-icon-style-06 ul li a.google {
  15567. color: #dc4a38;
  15568. }
  15569. .social-icon-style-06 ul li a.google-plus {
  15570. color: #dd4b39;
  15571. }
  15572. .social-icon-style-06 ul li a.instagram {
  15573. color: #FE1F49;
  15574. }
  15575. .social-icon-style-06 ul li a.jsfiddle {
  15576. color: #0084FF;
  15577. }
  15578. .social-icon-style-06 ul li a.linkedin {
  15579. color: #0077b5;
  15580. }
  15581. .social-icon-style-06 ul li a.livejournal {
  15582. color: #00b0ea;
  15583. }
  15584. .social-icon-style-06 ul li a.medium {
  15585. color: #00ab6c;
  15586. }
  15587. .social-icon-style-06 ul li a.meneame {
  15588. color: #ff6400;
  15589. }
  15590. .social-icon-style-06 ul li a.mailru {
  15591. color: #168de2;
  15592. }
  15593. .social-icon-style-06 ul li a.odnoklassniki {
  15594. color: #d7772d;
  15595. }
  15596. .social-icon-style-06 ul li a.paypal {
  15597. color: #003087;
  15598. }
  15599. .social-icon-style-06 ul li a.pinterest {
  15600. color: #CB2027;
  15601. }
  15602. .social-icon-style-06 ul li a.pinterest-p {
  15603. color: #CB2027;
  15604. }
  15605. .social-icon-style-06 ul li a.print {
  15606. color: #222222;
  15607. }
  15608. .social-icon-style-06 ul li a.reddit {
  15609. color: #ff4500;
  15610. }
  15611. .social-icon-style-06 ul li a.reddit-square {
  15612. color: #ff4500;
  15613. }
  15614. .social-icon-style-06 ul li a.rss {
  15615. color: #f2890a;
  15616. }
  15617. .social-icon-style-06 ul li a.skype {
  15618. color: #00aff0;
  15619. }
  15620. .social-icon-style-06 ul li a.slack {
  15621. color: #6ecadc;
  15622. }
  15623. .social-icon-style-06 ul li a.snapchat {
  15624. color: #fffc00;
  15625. }
  15626. .social-icon-style-06 ul li a.soundcloud {
  15627. color: #ff8800;
  15628. }
  15629. .social-icon-style-06 ul li a.spotify {
  15630. color: #1db954;
  15631. }
  15632. .social-icon-style-06 ul li a.sms {
  15633. color: #ffbd00;
  15634. }
  15635. .social-icon-style-06 ul li a.sharethis {
  15636. color: #95D03A;
  15637. }
  15638. .social-icon-style-06 ul li a.stack-overflow {
  15639. color: #f48024;
  15640. }
  15641. .social-icon-style-06 ul li a.stumbleupon {
  15642. color: #eb4924;
  15643. }
  15644. .social-icon-style-06 ul li a.telegram {
  15645. color: #0088cc;
  15646. }
  15647. .social-icon-style-06 ul li a.trello {
  15648. color: #0079bf;
  15649. }
  15650. .social-icon-style-06 ul li a.tumblr {
  15651. color: #32506d;
  15652. }
  15653. .social-icon-style-06 ul li a.twitch {
  15654. color: #6441a5;
  15655. }
  15656. .social-icon-style-06 ul li a.twitter {
  15657. color: #00aced;
  15658. }
  15659. .social-icon-style-06 ul li a.twitter-square {
  15660. color: #00aced;
  15661. }
  15662. .social-icon-style-06 ul li a.vimeo {
  15663. color: #1ab7ea;
  15664. }
  15665. .social-icon-style-06 ul li a.vine {
  15666. color: #00bf8f;
  15667. }
  15668. .social-icon-style-06 ul li a.vk {
  15669. color: #4c6c91;
  15670. }
  15671. .social-icon-style-06 ul li a.wordpress {
  15672. color: #21759b;
  15673. }
  15674. .social-icon-style-06 ul li a.weibo {
  15675. color: #ff9933;
  15676. }
  15677. .social-icon-style-06 ul li a.whatsapp {
  15678. color: #25d366;
  15679. }
  15680. .social-icon-style-06 ul li a.xing {
  15681. color: #1a7576;
  15682. }
  15683. .social-icon-style-06 ul li a.youtube {
  15684. color: #ff0000;
  15685. }
  15686. .social-icon-style-06 ul li a.youtube-play {
  15687. color: #ff0000;
  15688. }
  15689. /* Social icon style 07 */
  15690. .social-icon-style-07 ul li a {
  15691. position: relative;
  15692. z-index: 3;
  15693. overflow: hidden;
  15694. vertical-align: middle;
  15695. }
  15696. .social-icon-style-07 ul li a:hover {
  15697. color: var(--white) !important;
  15698. }
  15699. .social-icon-style-07 ul li a:hover > span {
  15700. top: 0;
  15701. }
  15702. .social-icon-style-07 ul li a > span {
  15703. position: absolute;
  15704. top: -100%;
  15705. left: 0;
  15706. height: 100%;
  15707. width: 100%;
  15708. z-index: -1;
  15709. -webkit-transition: 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  15710. transition: 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  15711. }
  15712. .social-icon-style-07 ul li a.behance {
  15713. color: #1769ff;
  15714. }
  15715. .social-icon-style-07 ul li a.behance span {
  15716. background-color: #1769ff;
  15717. }
  15718. .social-icon-style-07 ul li a.behance-square {
  15719. color: #1769ff;
  15720. }
  15721. .social-icon-style-07 ul li a.behance-square span {
  15722. background-color: #1769ff;
  15723. }
  15724. .social-icon-style-07 ul li a.blogger {
  15725. color: #ff8000;
  15726. }
  15727. .social-icon-style-07 ul li a.blogger span {
  15728. background-color: #ff8000;
  15729. }
  15730. .social-icon-style-07 ul li a.codepen {
  15731. color: #0ebeff;
  15732. }
  15733. .social-icon-style-07 ul li a.codepen span {
  15734. background-color: #0ebeff;
  15735. }
  15736. .social-icon-style-07 ul li a.deviantart {
  15737. color: #05cc47;
  15738. }
  15739. .social-icon-style-07 ul li a.deviantart span {
  15740. background-color: #05cc47;
  15741. }
  15742. .social-icon-style-07 ul li a.digg {
  15743. color: #262626;
  15744. }
  15745. .social-icon-style-07 ul li a.digg span {
  15746. background-color: #262626;
  15747. }
  15748. .social-icon-style-07 ul li a.dribbble {
  15749. color: #ea4c89;
  15750. }
  15751. .social-icon-style-07 ul li a.dribbble span {
  15752. background-color: #ea4c89;
  15753. }
  15754. .social-icon-style-07 ul li a.delicious {
  15755. color: #205cc0;
  15756. }
  15757. .social-icon-style-07 ul li a.delicious span {
  15758. background-color: #205cc0;
  15759. }
  15760. .social-icon-style-07 ul li a.email {
  15761. color: #7d7d7d;
  15762. }
  15763. .social-icon-style-07 ul li a.email span {
  15764. background-color: #7d7d7d;
  15765. }
  15766. .social-icon-style-07 ul li a.facebook {
  15767. color: #3b5998;
  15768. }
  15769. .social-icon-style-07 ul li a.facebook span {
  15770. background-color: #3b5998;
  15771. }
  15772. .social-icon-style-07 ul li a.facebook-square {
  15773. color: #3b5998;
  15774. }
  15775. .social-icon-style-07 ul li a.facebook-square span {
  15776. background-color: #3b5998;
  15777. }
  15778. .social-icon-style-07 ul li a.flickr {
  15779. color: #ff0084;
  15780. }
  15781. .social-icon-style-07 ul li a.flickr span {
  15782. background-color: #ff0084;
  15783. }
  15784. .social-icon-style-07 ul li a.flipboard {
  15785. color: #e12828;
  15786. }
  15787. .social-icon-style-07 ul li a.flipboard span {
  15788. background-color: #e12828;
  15789. }
  15790. .social-icon-style-07 ul li a.github {
  15791. color: #4078c0;
  15792. }
  15793. .social-icon-style-07 ul li a.github span {
  15794. background-color: #4078c0;
  15795. }
  15796. .social-icon-style-07 ul li a.google {
  15797. color: #dc4a38;
  15798. }
  15799. .social-icon-style-07 ul li a.google span {
  15800. background-color: #dc4a38;
  15801. }
  15802. .social-icon-style-07 ul li a.google-plus {
  15803. color: #dd4b39;
  15804. }
  15805. .social-icon-style-07 ul li a.google-plus span {
  15806. background-color: #dd4b39;
  15807. }
  15808. .social-icon-style-07 ul li a.instagram {
  15809. color: #FE1F49;
  15810. }
  15811. .social-icon-style-07 ul li a.instagram span {
  15812. background-color: #FE1F49;
  15813. }
  15814. .social-icon-style-07 ul li a.jsfiddle {
  15815. color: #0084FF;
  15816. }
  15817. .social-icon-style-07 ul li a.jsfiddle span {
  15818. background-color: #0084FF;
  15819. }
  15820. .social-icon-style-07 ul li a.linkedin {
  15821. color: #0077b5;
  15822. }
  15823. .social-icon-style-07 ul li a.linkedin span {
  15824. background-color: #0077b5;
  15825. }
  15826. .social-icon-style-07 ul li a.livejournal {
  15827. color: #00b0ea;
  15828. }
  15829. .social-icon-style-07 ul li a.livejournal span {
  15830. background-color: #00b0ea;
  15831. }
  15832. .social-icon-style-07 ul li a.medium {
  15833. color: #00ab6c;
  15834. }
  15835. .social-icon-style-07 ul li a.medium span {
  15836. background-color: #00ab6c;
  15837. }
  15838. .social-icon-style-07 ul li a.meneame {
  15839. color: #ff6400;
  15840. }
  15841. .social-icon-style-07 ul li a.meneame span {
  15842. background-color: #ff6400;
  15843. }
  15844. .social-icon-style-07 ul li a.mailru {
  15845. color: #168de2;
  15846. }
  15847. .social-icon-style-07 ul li a.mailru span {
  15848. background-color: #168de2;
  15849. }
  15850. .social-icon-style-07 ul li a.odnoklassniki {
  15851. color: #d7772d;
  15852. }
  15853. .social-icon-style-07 ul li a.odnoklassniki span {
  15854. background-color: #d7772d;
  15855. }
  15856. .social-icon-style-07 ul li a.paypal {
  15857. color: #003087;
  15858. }
  15859. .social-icon-style-07 ul li a.paypal span {
  15860. background-color: #003087;
  15861. }
  15862. .social-icon-style-07 ul li a.pinterest {
  15863. color: #CB2027;
  15864. }
  15865. .social-icon-style-07 ul li a.pinterest span {
  15866. background-color: #CB2027;
  15867. }
  15868. .social-icon-style-07 ul li a.pinterest-p {
  15869. color: #CB2027;
  15870. }
  15871. .social-icon-style-07 ul li a.pinterest-p span {
  15872. background-color: #CB2027;
  15873. }
  15874. .social-icon-style-07 ul li a.print {
  15875. color: #222222;
  15876. }
  15877. .social-icon-style-07 ul li a.print span {
  15878. background-color: #222222;
  15879. }
  15880. .social-icon-style-07 ul li a.reddit {
  15881. color: #ff4500;
  15882. }
  15883. .social-icon-style-07 ul li a.reddit span {
  15884. background-color: #ff4500;
  15885. }
  15886. .social-icon-style-07 ul li a.reddit-square {
  15887. color: #ff4500;
  15888. }
  15889. .social-icon-style-07 ul li a.reddit-square span {
  15890. background-color: #ff4500;
  15891. }
  15892. .social-icon-style-07 ul li a.rss {
  15893. color: #f2890a;
  15894. }
  15895. .social-icon-style-07 ul li a.rss span {
  15896. background-color: #f2890a;
  15897. }
  15898. .social-icon-style-07 ul li a.skype {
  15899. color: #00aff0;
  15900. }
  15901. .social-icon-style-07 ul li a.skype span {
  15902. background-color: #00aff0;
  15903. }
  15904. .social-icon-style-07 ul li a.slack {
  15905. color: #6ecadc;
  15906. }
  15907. .social-icon-style-07 ul li a.slack span {
  15908. background-color: #6ecadc;
  15909. }
  15910. .social-icon-style-07 ul li a.snapchat {
  15911. color: #fffc00;
  15912. }
  15913. .social-icon-style-07 ul li a.snapchat span {
  15914. background-color: #fffc00;
  15915. }
  15916. .social-icon-style-07 ul li a.soundcloud {
  15917. color: #ff8800;
  15918. }
  15919. .social-icon-style-07 ul li a.soundcloud span {
  15920. background-color: #ff8800;
  15921. }
  15922. .social-icon-style-07 ul li a.spotify {
  15923. color: #1db954;
  15924. }
  15925. .social-icon-style-07 ul li a.spotify span {
  15926. background-color: #1db954;
  15927. }
  15928. .social-icon-style-07 ul li a.sms {
  15929. color: #ffbd00;
  15930. }
  15931. .social-icon-style-07 ul li a.sms span {
  15932. background-color: #ffbd00;
  15933. }
  15934. .social-icon-style-07 ul li a.sharethis {
  15935. color: #95D03A;
  15936. }
  15937. .social-icon-style-07 ul li a.sharethis span {
  15938. background-color: #95D03A;
  15939. }
  15940. .social-icon-style-07 ul li a.stack-overflow {
  15941. color: #f48024;
  15942. }
  15943. .social-icon-style-07 ul li a.stack-overflow span {
  15944. background-color: #f48024;
  15945. }
  15946. .social-icon-style-07 ul li a.stumbleupon {
  15947. color: #eb4924;
  15948. }
  15949. .social-icon-style-07 ul li a.stumbleupon span {
  15950. background-color: #eb4924;
  15951. }
  15952. .social-icon-style-07 ul li a.telegram {
  15953. color: #0088cc;
  15954. }
  15955. .social-icon-style-07 ul li a.telegram span {
  15956. background-color: #0088cc;
  15957. }
  15958. .social-icon-style-07 ul li a.trello {
  15959. color: #0079bf;
  15960. }
  15961. .social-icon-style-07 ul li a.trello span {
  15962. background-color: #0079bf;
  15963. }
  15964. .social-icon-style-07 ul li a.tumblr {
  15965. color: #32506d;
  15966. }
  15967. .social-icon-style-07 ul li a.tumblr span {
  15968. background-color: #32506d;
  15969. }
  15970. .social-icon-style-07 ul li a.twitch {
  15971. color: #6441a5;
  15972. }
  15973. .social-icon-style-07 ul li a.twitch span {
  15974. background-color: #6441a5;
  15975. }
  15976. .social-icon-style-07 ul li a.twitter {
  15977. color: #00aced;
  15978. }
  15979. .social-icon-style-07 ul li a.twitter span {
  15980. background-color: #00aced;
  15981. }
  15982. .social-icon-style-07 ul li a.twitter-square {
  15983. color: #00aced;
  15984. }
  15985. .social-icon-style-07 ul li a.twitter-square span {
  15986. background-color: #00aced;
  15987. }
  15988. .social-icon-style-07 ul li a.vimeo {
  15989. color: #1ab7ea;
  15990. }
  15991. .social-icon-style-07 ul li a.vimeo span {
  15992. background-color: #1ab7ea;
  15993. }
  15994. .social-icon-style-07 ul li a.vine {
  15995. color: #00bf8f;
  15996. }
  15997. .social-icon-style-07 ul li a.vine span {
  15998. background-color: #00bf8f;
  15999. }
  16000. .social-icon-style-07 ul li a.vk {
  16001. color: #4c6c91;
  16002. }
  16003. .social-icon-style-07 ul li a.vk span {
  16004. background-color: #4c6c91;
  16005. }
  16006. .social-icon-style-07 ul li a.wordpress {
  16007. color: #21759b;
  16008. }
  16009. .social-icon-style-07 ul li a.wordpress span {
  16010. background-color: #21759b;
  16011. }
  16012. .social-icon-style-07 ul li a.weibo {
  16013. color: #ff9933;
  16014. }
  16015. .social-icon-style-07 ul li a.weibo span {
  16016. background-color: #ff9933;
  16017. }
  16018. .social-icon-style-07 ul li a.whatsapp {
  16019. color: #25d366;
  16020. }
  16021. .social-icon-style-07 ul li a.whatsapp span {
  16022. background-color: #25d366;
  16023. }
  16024. .social-icon-style-07 ul li a.xing {
  16025. color: #1a7576;
  16026. }
  16027. .social-icon-style-07 ul li a.xing span {
  16028. background-color: #1a7576;
  16029. }
  16030. .social-icon-style-07 ul li a.youtube {
  16031. color: #ff0000;
  16032. }
  16033. .social-icon-style-07 ul li a.youtube span {
  16034. background-color: #ff0000;
  16035. }
  16036. .social-icon-style-07 ul li a.youtube-play {
  16037. color: #ff0000;
  16038. }
  16039. .social-icon-style-07 ul li a.youtube-play span {
  16040. background-color: #ff0000;
  16041. }
  16042. /* Social icon style 08 */
  16043. .social-icon-style-08 ul li a:hover {
  16044. opacity: 0.5;
  16045. color: var(--dark-gray) !important;
  16046. }
  16047. .social-icon-style-08 ul.light li a:hover {
  16048. opacity: 0.5;
  16049. color: var(--white) !important;
  16050. }
  16051. /* Social icon style 09 */
  16052. .social-icon-style-09 ul li a {
  16053. z-index: 9;
  16054. border: 1px solid rgba(35, 35, 35, 0.15);
  16055. border-radius: 100%;
  16056. position: relative;
  16057. }
  16058. .social-icon-style-09 ul li a:hover {
  16059. color: var(--white) !important;
  16060. }
  16061. .social-icon-style-09 ul li a:hover span {
  16062. -webkit-transform: scale(1);
  16063. transform: scale(1);
  16064. opacity: 1;
  16065. }
  16066. .social-icon-style-09 ul li a span {
  16067. display: block;
  16068. border-radius: 100%;
  16069. height: 100%;
  16070. width: 100%;
  16071. top: -1px;
  16072. left: -1px;
  16073. padding: 1px;
  16074. box-sizing: content-box;
  16075. margin: 0;
  16076. position: absolute;
  16077. -webkit-transform: scale(1.2);
  16078. transform: scale(1.2);
  16079. opacity: 0;
  16080. -webkit-transition: 0.5s cubic-bezier(0.12, 0, 0.39, 0);
  16081. transition: 0.5s cubic-bezier(0.12, 0, 0.39, 0);
  16082. pointer-events: none;
  16083. z-index: -1;
  16084. background-color: var(--dark-gray);
  16085. }
  16086. .social-icon-style-09 ul.light li a {
  16087. border-color: rgba(255, 255, 255, 0.3);
  16088. }
  16089. .social-icon-style-09 ul.light li a:hover {
  16090. color: var(--dark-gray) !important;
  16091. }
  16092. .social-icon-style-09 ul.light li a span {
  16093. background-color: var(--white);
  16094. }
  16095. /* Social icon style 10 */
  16096. .social-icon-style-10 ul li a {
  16097. color: var(--dark-gray);
  16098. }
  16099. .social-icon-style-10 ul li a:hover {
  16100. color: var(--base-color) !important;
  16101. }
  16102. .social-icon-style-10 .default-color a.behance {
  16103. color: #1769ff;
  16104. }
  16105. .social-icon-style-10 .default-color a.behance-square {
  16106. color: #1769ff;
  16107. }
  16108. .social-icon-style-10 .default-color a.blogger {
  16109. color: #ff8000;
  16110. }
  16111. .social-icon-style-10 .default-color a.codepen {
  16112. color: #0ebeff;
  16113. }
  16114. .social-icon-style-10 .default-color a.deviantart {
  16115. color: #05cc47;
  16116. }
  16117. .social-icon-style-10 .default-color a.digg {
  16118. color: #262626;
  16119. }
  16120. .social-icon-style-10 .default-color a.dribbble {
  16121. color: #ea4c89;
  16122. }
  16123. .social-icon-style-10 .default-color a.delicious {
  16124. color: #205cc0;
  16125. }
  16126. .social-icon-style-10 .default-color a.email {
  16127. color: #7d7d7d;
  16128. }
  16129. .social-icon-style-10 .default-color a.facebook {
  16130. color: #3b5998;
  16131. }
  16132. .social-icon-style-10 .default-color a.facebook-square {
  16133. color: #3b5998;
  16134. }
  16135. .social-icon-style-10 .default-color a.flickr {
  16136. color: #ff0084;
  16137. }
  16138. .social-icon-style-10 .default-color a.flipboard {
  16139. color: #e12828;
  16140. }
  16141. .social-icon-style-10 .default-color a.github {
  16142. color: #4078c0;
  16143. }
  16144. .social-icon-style-10 .default-color a.google {
  16145. color: #dc4a38;
  16146. }
  16147. .social-icon-style-10 .default-color a.google-plus {
  16148. color: #dd4b39;
  16149. }
  16150. .social-icon-style-10 .default-color a.instagram {
  16151. color: #FE1F49;
  16152. }
  16153. .social-icon-style-10 .default-color a.jsfiddle {
  16154. color: #0084FF;
  16155. }
  16156. .social-icon-style-10 .default-color a.linkedin {
  16157. color: #0077b5;
  16158. }
  16159. .social-icon-style-10 .default-color a.livejournal {
  16160. color: #00b0ea;
  16161. }
  16162. .social-icon-style-10 .default-color a.medium {
  16163. color: #00ab6c;
  16164. }
  16165. .social-icon-style-10 .default-color a.meneame {
  16166. color: #ff6400;
  16167. }
  16168. .social-icon-style-10 .default-color a.mailru {
  16169. color: #168de2;
  16170. }
  16171. .social-icon-style-10 .default-color a.odnoklassniki {
  16172. color: #d7772d;
  16173. }
  16174. .social-icon-style-10 .default-color a.paypal {
  16175. color: #003087;
  16176. }
  16177. .social-icon-style-10 .default-color a.pinterest {
  16178. color: #CB2027;
  16179. }
  16180. .social-icon-style-10 .default-color a.pinterest-p {
  16181. color: #CB2027;
  16182. }
  16183. .social-icon-style-10 .default-color a.print {
  16184. color: #222222;
  16185. }
  16186. .social-icon-style-10 .default-color a.reddit {
  16187. color: #ff4500;
  16188. }
  16189. .social-icon-style-10 .default-color a.reddit-square {
  16190. color: #ff4500;
  16191. }
  16192. .social-icon-style-10 .default-color a.rss {
  16193. color: #f2890a;
  16194. }
  16195. .social-icon-style-10 .default-color a.skype {
  16196. color: #00aff0;
  16197. }
  16198. .social-icon-style-10 .default-color a.slack {
  16199. color: #6ecadc;
  16200. }
  16201. .social-icon-style-10 .default-color a.snapchat {
  16202. color: #fffc00;
  16203. }
  16204. .social-icon-style-10 .default-color a.soundcloud {
  16205. color: #ff8800;
  16206. }
  16207. .social-icon-style-10 .default-color a.spotify {
  16208. color: #1db954;
  16209. }
  16210. .social-icon-style-10 .default-color a.sms {
  16211. color: #ffbd00;
  16212. }
  16213. .social-icon-style-10 .default-color a.sharethis {
  16214. color: #95D03A;
  16215. }
  16216. .social-icon-style-10 .default-color a.stack-overflow {
  16217. color: #f48024;
  16218. }
  16219. .social-icon-style-10 .default-color a.stumbleupon {
  16220. color: #eb4924;
  16221. }
  16222. .social-icon-style-10 .default-color a.telegram {
  16223. color: #0088cc;
  16224. }
  16225. .social-icon-style-10 .default-color a.trello {
  16226. color: #0079bf;
  16227. }
  16228. .social-icon-style-10 .default-color a.tumblr {
  16229. color: #32506d;
  16230. }
  16231. .social-icon-style-10 .default-color a.twitch {
  16232. color: #6441a5;
  16233. }
  16234. .social-icon-style-10 .default-color a.twitter {
  16235. color: #00aced;
  16236. }
  16237. .social-icon-style-10 .default-color a.twitter-square {
  16238. color: #00aced;
  16239. }
  16240. .social-icon-style-10 .default-color a.vimeo {
  16241. color: #1ab7ea;
  16242. }
  16243. .social-icon-style-10 .default-color a.vine {
  16244. color: #00bf8f;
  16245. }
  16246. .social-icon-style-10 .default-color a.vk {
  16247. color: #4c6c91;
  16248. }
  16249. .social-icon-style-10 .default-color a.wordpress {
  16250. color: #21759b;
  16251. }
  16252. .social-icon-style-10 .default-color a.weibo {
  16253. color: #ff9933;
  16254. }
  16255. .social-icon-style-10 .default-color a.whatsapp {
  16256. color: #25d366;
  16257. }
  16258. .social-icon-style-10 .default-color a.xing {
  16259. color: #1a7576;
  16260. }
  16261. .social-icon-style-10 .default-color a.youtube {
  16262. color: #ff0000;
  16263. }
  16264. .social-icon-style-10 .default-color a.youtube-play {
  16265. color: #ff0000;
  16266. }
  16267. .social-icon-style-10 .default-color a:hover {
  16268. color: var(--dark-gray) !important;
  16269. }
  16270. /* Social icon style 11 */
  16271. .social-icon-style-11 ul {
  16272. display: flex;
  16273. }
  16274. .social-icon-style-11 ul li {
  16275. flex: 1 0 0%;
  16276. }
  16277. .social-icon-style-11 ul li a {
  16278. padding: 27px 15px;
  16279. border-right: 1px solid var(--extra-medium-gray);
  16280. }
  16281. .social-icon-style-11 ul li a i {
  16282. transition: inherit;
  16283. }
  16284. .social-icon-style-11 ul li a:hover {
  16285. color: var(--white) !important;
  16286. background-color: var(--base-color);
  16287. }
  16288. .social-icon-style-11 ul li a:hover i {
  16289. color: var(--white) !important;
  16290. }
  16291. .social-icon-style-11 ul li:last-child a {
  16292. border-right: 0;
  16293. }
  16294. /* Social text style 01 */
  16295. .social-text-style-01 ul li a {
  16296. width: auto;
  16297. height: auto;
  16298. line-height: normal;
  16299. }
  16300. /* Subcribe style 01 */
  16301. .newsletter-style-01 input {
  16302. border-radius: 4px;
  16303. padding-right: 160px;
  16304. }
  16305. .newsletter-style-01 input.is-invalid {
  16306. padding-right: 160px;
  16307. }
  16308. .newsletter-style-01 .btn {
  16309. position: absolute;
  16310. right: 0;
  16311. top: 0;
  16312. height: 100%;
  16313. border-radius: 0 4px 4px 0;
  16314. }
  16315. .newsletter-style-01 .btn i {
  16316. top: 1px;
  16317. }
  16318. /* Subcribe style 02 */
  16319. .newsletter-style-02 input {
  16320. border-radius: 4px;
  16321. padding-right: 60px !important;
  16322. }
  16323. .newsletter-style-02 .btn {
  16324. position: absolute;
  16325. right: 0;
  16326. top: 0;
  16327. height: 100%;
  16328. border-radius: 0 4px 4px 0;
  16329. padding: 10px 25px 9px 25px;
  16330. display: inline-block;
  16331. }
  16332. .newsletter-style-02 .btn i {
  16333. margin-left: 0;
  16334. top: inherit;
  16335. }
  16336. .newsletter-style-02 .btn:active {
  16337. border-color: transparent;
  16338. }
  16339. /* Subcribe style 03 */
  16340. .newsletter-style-03 input {
  16341. padding-right: 165px !important;
  16342. padding-left: 30px !important;
  16343. }
  16344. .newsletter-style-03 .btn {
  16345. position: absolute;
  16346. right: 0;
  16347. top: 0;
  16348. border-radius: 0 100px 100px 0;
  16349. height: 100%;
  16350. padding: 12px 35px 12px 30px;
  16351. }
  16352. .newsletter-style-03 .btn:active {
  16353. border-color: transparent;
  16354. }
  16355. /* Subcribe style 04 */
  16356. .newsletter-style-04 input {
  16357. padding-left: 0;
  16358. padding-right: 40px;
  16359. border-radius: 0;
  16360. }
  16361. .newsletter-style-04 .btn {
  16362. position: absolute;
  16363. right: 0;
  16364. top: 0;
  16365. height: 100%;
  16366. padding: 0;
  16367. border: none;
  16368. }
  16369. .newsletter-style-04 .btn i {
  16370. margin-left: 0;
  16371. }
  16372. /* Subcribe style 06 */
  16373. .newsletter-style-06 input {
  16374. border-radius: 4px;
  16375. padding-right: 160px;
  16376. }
  16377. .newsletter-style-06 input.is-invalid {
  16378. padding-right: 160px;
  16379. }
  16380. .newsletter-style-06 .btn.submit {
  16381. position: absolute;
  16382. right: 7px;
  16383. top: 7px;
  16384. border-radius: 4px;
  16385. height: calc(100% - 14px);
  16386. padding: 0 28px;
  16387. }
  16388. .newsletter-style-06 .btn.submit.btn-base-color:active {
  16389. background-color: var(--base-color);
  16390. color: var(--white);
  16391. opacity: 0.7;
  16392. }
  16393. .newsletter-style-06 .btn.submit.btn-base-color:hover {
  16394. background-color: var(--base-color);
  16395. color: var(--white);
  16396. opacity: 0.7;
  16397. }
  16398. .newsletter-style-01 .form-control, .newsletter-style-01 .form-control.is-invalid, .newsletter-style-01 .was-validated .form-control:invalid, .newsletter-style-02 .form-control, .newsletter-style-02 .form-control.is-invalid, .newsletter-style-02 .was-validated .form-control:invalid, .newsletter-style-03 .form-control, .newsletter-style-03 .form-control.is-invalid, .newsletter-style-03 .was-validated .form-control:invalid, .newsletter-style-04 .form-control, .newsletter-style-04 .form-control.is-invalid, .newsletter-style-04 .was-validated .form-control:invalid, .newsletter-style-05 .form-control, .newsletter-style-05 .form-control.is-invalid, .newsletter-style-05 .was-validated .form-control:invalid, .newsletter-style-06 .form-control, .newsletter-style-06 .form-control.is-invalid, .newsletter-style-06 .was-validated .form-control:invalid {
  16399. background-image: inherit;
  16400. }
  16401. /* Tab */
  16402. .nav-tabs > li.nav-item {
  16403. display: inline-block;
  16404. float: none;
  16405. margin: 0;
  16406. padding: 0 17px;
  16407. }
  16408. /* Tab style 01 */
  16409. .tab-style-01 .nav-tabs .nav-link {
  16410. border: none;
  16411. -webkit-border-radius: 50px;
  16412. border-radius: 50px;
  16413. padding: 10px 40px;
  16414. color: var(--medium-gray);
  16415. -webkit-transition: all 0.3s linear;
  16416. transition: all 0.3s linear;
  16417. }
  16418. .tab-style-01 .nav-tabs .nav-link.show, .tab-style-01 .nav-tabs .nav-link.active, .tab-style-01 .nav-tabs .nav-link:hover {
  16419. color: var(--dark-gray);
  16420. background-color: var(--white);
  16421. -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);
  16422. box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);
  16423. -webkit-transform: translate3d(0, -3px, 0);
  16424. transform: translate3d(0, -3px, 0);
  16425. }
  16426. .tab-style-01 .nav-tabs > li.nav-item {
  16427. padding: 0 4px;
  16428. }
  16429. /* Tab style 02 */
  16430. .tab-style-02 .nav-tabs {
  16431. border-bottom: none;
  16432. }
  16433. .tab-style-02 .nav-tabs > li.nav-item {
  16434. margin: 0 34px;
  16435. }
  16436. .tab-style-02 .nav-tabs > li.nav-item > a.nav-link {
  16437. border: none;
  16438. padding: 0;
  16439. color: var(--medium-gray);
  16440. border-bottom: 2px solid transparent;
  16441. -webkit-transition: all 0.3s linear;
  16442. transition: all 0.3s linear;
  16443. }
  16444. .tab-style-02 .nav-tabs > li.nav-item > a.nav-link i {
  16445. -webkit-transition: all 0.3s linear;
  16446. transition: all 0.3s linear;
  16447. -webkit-transform: translateY(0);
  16448. transform: translateY(0);
  16449. will-change: transform;
  16450. }
  16451. .tab-style-02 .nav-tabs > li.nav-item > a.nav-link:hover {
  16452. color: var(--dark-gray);
  16453. border-bottom: 2px solid;
  16454. }
  16455. .tab-style-02 .nav-tabs > li.nav-item > a.nav-link:hover i {
  16456. color: var(--base-color);
  16457. -webkit-transform: translateY(-5px);
  16458. transform: translateY(-5px);
  16459. -webkit-transform: scale(1.1);
  16460. transform: scale(1.1);
  16461. }
  16462. .tab-style-02 .nav-tabs > li.nav-item > a.nav-link.active {
  16463. color: var(--dark-gray);
  16464. border-bottom: 2px solid;
  16465. background: transparent;
  16466. }
  16467. .tab-style-02 .nav-tabs > li.nav-item > a.nav-link.active i {
  16468. color: var(--base-color);
  16469. }
  16470. /* Tab style 03 */
  16471. .tab-style-03 .nav-tabs .nav-link {
  16472. padding: 10px 33px;
  16473. color: var(--medium-gray);
  16474. border: 1px solid var(--light-medium-gray);
  16475. border-bottom: none;
  16476. -webkit-border-radius: 6px 6px 0 0;
  16477. border-radius: 6px 6px 0 0;
  16478. }
  16479. .tab-style-03 .nav-tabs .nav-link.active, .tab-style-03 .nav-tabs .nav-link.show, .tab-style-03 .nav-tabs .nav-link:hover {
  16480. color: var(--dark-gray);
  16481. background-color: var(--white);
  16482. }
  16483. .tab-style-03 .nav-tabs > li.nav-item {
  16484. padding: 0 8px;
  16485. }
  16486. /* Tab style 04 */
  16487. .tab-style-04 .nav-tabs .nav-item {
  16488. padding: 0 35px;
  16489. }
  16490. .tab-style-04 .nav-tabs .nav-item .nav-link {
  16491. padding: 0;
  16492. border: none;
  16493. background: transparent;
  16494. position: relative;
  16495. color: var(--medium-gray);
  16496. }
  16497. .tab-style-04 .nav-tabs .nav-item .nav-link .tab-border {
  16498. width: 100%;
  16499. height: 2px;
  16500. display: block;
  16501. -wekit-transform: scaleX(0);
  16502. -moz-transform: scaleX(0);
  16503. -ms-transform: scaleX(0);
  16504. transform: scaleX(0);
  16505. -webkit-transition: transform 0.5s ease;
  16506. transition: transform 0.5s ease;
  16507. }
  16508. .tab-style-04 .nav-tabs .nav-item .nav-link.active, .tab-style-04 .nav-tabs .nav-item .nav-link.show, .tab-style-04 .nav-tabs .nav-item .nav-link:hover {
  16509. color: var(--dark-gray);
  16510. }
  16511. .tab-style-04 .nav-tabs .nav-item .nav-link.active .tab-border, .tab-style-04 .nav-tabs .nav-item .nav-link.show .tab-border, .tab-style-04 .nav-tabs .nav-item .nav-link:hover .tab-border {
  16512. -webkit-transform: scaleX(1);
  16513. transform: scaleX(1);
  16514. }
  16515. /* Tab style 05 */
  16516. .tab-style-05 .nav-tabs > li {
  16517. width: 100%;
  16518. }
  16519. .tab-style-05 .nav-tabs > li.nav-item {
  16520. padding: 0;
  16521. }
  16522. .tab-style-05 .nav-tabs .nav-item .nav-link {
  16523. border: none;
  16524. padding: 20px 28px 22px;
  16525. margin-bottom: 15px;
  16526. background: transparent;
  16527. -webkit-border-radius: 4px;
  16528. border-radius: 4px;
  16529. -webkit-transition: all 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  16530. transition: all 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  16531. display: flex;
  16532. align-items: center;
  16533. }
  16534. .tab-style-05 .nav-tabs .nav-item .nav-link i {
  16535. vertical-align: middle;
  16536. display: inline-block;
  16537. margin-right: 10px;
  16538. }
  16539. .tab-style-05 .nav-tabs .nav-item .nav-link span {
  16540. position: relative;
  16541. top: 1px;
  16542. color: var(--dark-gray);
  16543. -webkit-transition: all 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  16544. transition: all 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  16545. }
  16546. .tab-style-05 .nav-tabs .nav-item .nav-link:hover, .tab-style-05 .nav-tabs .nav-item .nav-link.show, .tab-style-05 .nav-tabs .nav-item .nav-link.active {
  16547. background: var(--white);
  16548. color: var(--base-color);
  16549. -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.08);
  16550. box-shadow: 0 0 20px rgba(0, 0, 0, 0.08);
  16551. }
  16552. .tab-style-05 .nav-tabs .nav-item .nav-link:hover i, .tab-style-05 .nav-tabs .nav-item .nav-link.show i, .tab-style-05 .nav-tabs .nav-item .nav-link.active i {
  16553. color: var(--base-color);
  16554. }
  16555. .tab-style-05 .nav-tabs .nav-item .nav-link:hover span, .tab-style-05 .nav-tabs .nav-item .nav-link.show span, .tab-style-05 .nav-tabs .nav-item .nav-link.active span {
  16556. color: var(--base-color);
  16557. }
  16558. .tab-style-05 .nav-tabs .nav-item:last-child .nav-link {
  16559. border-bottom: none;
  16560. }
  16561. /* Tab style 06 */
  16562. .tab-style-06 .nav-tabs > li.nav-item {
  16563. position: relative;
  16564. z-index: 1;
  16565. padding: 0;
  16566. border: 1px solid;
  16567. overflow: hidden;
  16568. border-radius: 4px 0 0 4px;
  16569. }
  16570. .tab-style-06 .nav-tabs > li.nav-item:last-child {
  16571. border-radius: 0 4px 4px 0;
  16572. margin-left: -1px;
  16573. }
  16574. .tab-style-06 .nav-tabs > li.nav-item > a.nav-link {
  16575. border-bottom: none;
  16576. border-radius: 0;
  16577. line-height: 18px;
  16578. padding: 16px 40px;
  16579. text-transform: uppercase;
  16580. z-index: 1;
  16581. background-color: transparent;
  16582. color: var(--medium-gray);
  16583. border: 0;
  16584. }
  16585. .tab-style-06 .nav-tabs > li.nav-item > a.nav-link.active {
  16586. color: #fff !important;
  16587. }
  16588. .tab-style-06 .nav-tabs > li.nav-item > a.nav-link.active + .tab-bg-active {
  16589. opacity: 1;
  16590. }
  16591. .tab-style-06 .tab-bg-active {
  16592. position: absolute;
  16593. top: -1px;
  16594. left: -1px;
  16595. width: calc(100% + 2px);
  16596. height: calc(100% + 2px);
  16597. z-index: -1;
  16598. opacity: 0;
  16599. }
  16600. /* Tab style 07 */
  16601. .tab-style-07 .nav-tabs > li {
  16602. width: 100%;
  16603. }
  16604. .tab-style-07 .nav-tabs > li.nav-item {
  16605. padding: 0;
  16606. }
  16607. .tab-style-07 .nav-tabs .nav-item .nav-link {
  16608. border: none;
  16609. border-bottom: 1px solid;
  16610. border-color: var(--extra-medium-gray);
  16611. padding: 38px 60px 38px;
  16612. background: transparent;
  16613. -webkit-border-radius: 0;
  16614. border-radius: 0;
  16615. -webkit-transition: 0.4s;
  16616. transition: 0.4s;
  16617. position: relative;
  16618. }
  16619. .tab-style-07 .nav-tabs .nav-item .nav-link span {
  16620. color: var(--dark-gray);
  16621. z-index: 9;
  16622. position: relative;
  16623. -webkit-transition: 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  16624. transition: 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  16625. }
  16626. .tab-style-07 .nav-tabs .nav-item .nav-link:hover, .tab-style-07 .nav-tabs .nav-item .nav-link.show, .tab-style-07 .nav-tabs .nav-item .nav-link.active {
  16627. color: var(--white);
  16628. isolation: inherit;
  16629. }
  16630. .tab-style-07 .nav-tabs .nav-item .nav-link:hover span, .tab-style-07 .nav-tabs .nav-item .nav-link.show span, .tab-style-07 .nav-tabs .nav-item .nav-link.active span {
  16631. color: var(--white);
  16632. -webkit-transition: 0.5s;
  16633. transition: 0.5s;
  16634. }
  16635. .tab-style-07 .nav-tabs .nav-item .nav-link:hover .number-box, .tab-style-07 .nav-tabs .nav-item .nav-link.show .number-box, .tab-style-07 .nav-tabs .nav-item .nav-link.active .number-box {
  16636. opacity: 1;
  16637. -webkit-transform: translate(50%, -50%);
  16638. transform: translate(50%, -50%);
  16639. transition: opacity 0.4s, transform 0.4s;
  16640. -webkit-transition-delay: 0.35s;
  16641. transition-delay: 0.35s;
  16642. }
  16643. .tab-style-07 .nav-tabs .nav-item .nav-link:hover .bg-hover, .tab-style-07 .nav-tabs .nav-item .nav-link.show .bg-hover, .tab-style-07 .nav-tabs .nav-item .nav-link.active .bg-hover {
  16644. -webkit-transform: scaleX(1);
  16645. transform: scaleX(1);
  16646. }
  16647. .tab-style-07 .nav-tabs .nav-item .nav-link .number-box {
  16648. position: absolute;
  16649. top: 50%;
  16650. z-index: 9;
  16651. right: 0;
  16652. opacity: 0;
  16653. -webkit-transform: translate(25%, -50%);
  16654. transform: translate(25%, -50%);
  16655. transition: opacity 0s, transform 0s;
  16656. -webkit-transition-delay: 0s;
  16657. transition-delay: 0s;
  16658. }
  16659. .tab-style-07 .nav-tabs .nav-item .nav-link .bg-hover {
  16660. position: absolute;
  16661. width: 100%;
  16662. height: 100%;
  16663. left: 0;
  16664. top: 0;
  16665. content: "";
  16666. -webkit-transform: scaleX(0);
  16667. transform: scaleX(0);
  16668. transform-origin: left;
  16669. -webkit-transition: 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  16670. transition: 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  16671. z-index: 1;
  16672. }
  16673. .tab-style-07 .nav-tabs .nav-item:last-child .nav-link {
  16674. border-bottom: none;
  16675. }
  16676. /* Tab style 08 */
  16677. .tab-style-08 ul .nav-item {
  16678. padding: 0;
  16679. background-color: transparent;
  16680. border-right: 1px solid var(--light-medium-gray);
  16681. flex-grow: 1;
  16682. flex-basis: 0;
  16683. }
  16684. .tab-style-08 ul .nav-item .nav-link {
  16685. border: 0;
  16686. margin-bottom: 0;
  16687. padding: 30px 15px;
  16688. background-color: transparent;
  16689. position: relative;
  16690. color: var(--medium-gray);
  16691. }
  16692. .tab-style-08 ul .nav-item .nav-link.active, .tab-style-08 ul .nav-item .nav-link.show, .tab-style-08 ul .nav-item .nav-link:hover {
  16693. border: 0;
  16694. color: var(--base-color);
  16695. }
  16696. .tab-style-08 ul .nav-item .nav-link.active .tab-border, .tab-style-08 ul .nav-item .nav-link.show .tab-border, .tab-style-08 ul .nav-item .nav-link:hover .tab-border {
  16697. -wekit-transform: scaleX(1);
  16698. -moz-transform: scaleX(1);
  16699. -ms-transform: scaleX(1);
  16700. transform: scaleX(1);
  16701. }
  16702. .tab-style-08 ul .nav-item .tab-border {
  16703. width: calc(100% + 2px);
  16704. height: 3px;
  16705. display: block;
  16706. -wekit-transform: scaleX(0);
  16707. -moz-transform: scaleX(0);
  16708. -ms-transform: scaleX(0);
  16709. transform: scaleX(0);
  16710. -webkit-transition: transform 0.5s ease;
  16711. transition: transform 0.5s ease;
  16712. position: absolute;
  16713. left: -1px;
  16714. top: 0;
  16715. }
  16716. .tab-style-08 ul .nav-item:last-child {
  16717. border: 0;
  16718. }
  16719. .tab-style-08 ul.active-tab-border-bottom .nav-item .tab-border {
  16720. bottom: 0;
  16721. top: auto;
  16722. }
  16723. /* Tab style 09 */
  16724. .tab-style-09 .nav-tabs .nav-item {
  16725. padding: 0 35px;
  16726. }
  16727. .tab-style-09 .nav-tabs .nav-item .nav-link {
  16728. padding: 0;
  16729. border: none;
  16730. background: transparent;
  16731. position: relative;
  16732. color: rgba(255, 255, 255, 0.45);
  16733. }
  16734. .tab-style-09 .nav-tabs .nav-item .nav-link.active, .tab-style-09 .nav-tabs .nav-item .nav-link.show, .tab-style-09 .nav-tabs .nav-item .nav-link:hover {
  16735. color: var(--white);
  16736. }
  16737. /* Team style 01 */
  16738. .team-style-01 figure figcaption {
  16739. position: absolute;
  16740. bottom: -1px;
  16741. }
  16742. .team-style-01 figure figcaption .social-icon {
  16743. display: block !important;
  16744. height: auto !important;
  16745. margin-bottom: -50px !important;
  16746. overflow: visible !important;
  16747. -webkit-transition: 0.4s;
  16748. transition: 0.4s;
  16749. }
  16750. .team-style-01 figure figcaption .social-icon a {
  16751. margin: 0 10px;
  16752. }
  16753. .team-style-01 figure figcaption .social-icon a:last-child {
  16754. margin-right: 0;
  16755. }
  16756. .team-style-01 figure figcaption .social-icon a:first-child {
  16757. margin-left: 0;
  16758. }
  16759. .team-style-01 figure .text-light-opacity:hover {
  16760. opacity: 1 !important;
  16761. }
  16762. .team-style-01 figure:hover figcaption .social-icon {
  16763. margin-bottom: 0px !important;
  16764. }
  16765. /* Team style 02 */
  16766. .team-style-02 figure figcaption {
  16767. position: absolute;
  16768. opacity: 0;
  16769. bottom: 0;
  16770. -webkit-transition: all 0.5s cubic-bezier(0.12, 0, 0.39, 0);
  16771. transition: all 0.5s cubic-bezier(0.12, 0, 0.39, 0);
  16772. }
  16773. .team-style-02 figure figcaption .social-icon a {
  16774. margin: 0 12px;
  16775. opacity: 0;
  16776. -webkit-transition: 0.45s cubic-bezier(0.19, 1, 0.22, 1);
  16777. transition: 0.45s cubic-bezier(0.19, 1, 0.22, 1);
  16778. -webkit-transform: translateY(-25px);
  16779. transform: translateY(-25px);
  16780. display: inline-block;
  16781. }
  16782. .team-style-02 figure figcaption .social-icon a:nth-child(1) {
  16783. -webkit-transition: all 0.3s cubic-bezier(0.2, 0, 0.3, 1);
  16784. transition: all 0.3s cubic-bezier(0.2, 0, 0.3, 1);
  16785. }
  16786. .team-style-02 figure figcaption .social-icon a:nth-child(2) {
  16787. -webkit-transition: all 0.4s cubic-bezier(0.2, 0, 0.3, 1);
  16788. transition: all 0.4s cubic-bezier(0.2, 0, 0.3, 1);
  16789. }
  16790. .team-style-02 figure figcaption .social-icon a:nth-child(3) {
  16791. -webkit-transition: all 0.6s cubic-bezier(0.2, 0, 0.3, 1);
  16792. transition: all 0.6s cubic-bezier(0.2, 0, 0.3, 1);
  16793. }
  16794. .team-style-02 figure figcaption .social-icon a:nth-child(4) {
  16795. -webkit-transition: all 0.8s cubic-bezier(0.2, 0, 0.3, 1);
  16796. transition: all 0.8s cubic-bezier(0.2, 0, 0.3, 1);
  16797. }
  16798. .team-style-02 figure figcaption .social-icon a:nth-child(5) {
  16799. -webkit-transition: all 1s cubic-bezier(0.2, 0, 0.3, 1);
  16800. transition: all 1s cubic-bezier(0.2, 0, 0.3, 1);
  16801. }
  16802. .team-style-02 figure figcaption .team-member-name {
  16803. opacity: 0;
  16804. -webkit-transform: translate3d(0, 15px, 0);
  16805. transform: translate3d(0, 15px, 0);
  16806. -webkit-transition: all 1s cubic-bezier(0.2, 0, 0.3, 1);
  16807. transition: all 1s cubic-bezier(0.2, 0, 0.3, 1);
  16808. }
  16809. .team-style-02 figure figcaption .member-designation {
  16810. opacity: 0;
  16811. -webkit-transform: translate3d(0, 15px, 0);
  16812. transform: translate3d(0, 15px, 0);
  16813. -webkit-transition: all 0.7s cubic-bezier(0.2, 0, 0.3, 1);
  16814. transition: all 0.7s cubic-bezier(0.2, 0, 0.3, 1);
  16815. }
  16816. .team-style-02 figure:hover figcaption {
  16817. opacity: 1;
  16818. }
  16819. .team-style-02 figure:hover figcaption .team-member-name {
  16820. opacity: 1;
  16821. -webkit-transform: translate3d(0, 0, 0);
  16822. transform: translate3d(0, 0, 0);
  16823. -webkit-transition: all 0.4s cubic-bezier(0.2, 0, 0.3, 1);
  16824. transition: all 0.4s cubic-bezier(0.2, 0, 0.3, 1);
  16825. }
  16826. .team-style-02 figure:hover figcaption .member-designation {
  16827. opacity: 0.7;
  16828. -webkit-transform: translate3d(0, 0, 0);
  16829. transform: translate3d(0, 0, 0);
  16830. -webkit-transition: all 0.7s cubic-bezier(0.2, 0, 0.3, 1);
  16831. transition: all 0.7s cubic-bezier(0.2, 0, 0.3, 1);
  16832. }
  16833. .team-style-02 figure:hover figcaption a {
  16834. opacity: 1;
  16835. -webkit-transform: translateY(0);
  16836. transform: translateY(0);
  16837. }
  16838. .team-style-02 figure:hover figcaption a:nth-child(1) {
  16839. -webkit-transition: all 0.3s cubic-bezier(0.2, 0, 0.3, 1);
  16840. transition: all 0.3s cubic-bezier(0.2, 0, 0.3, 1);
  16841. }
  16842. .team-style-02 figure:hover figcaption a:nth-child(2) {
  16843. -webkit-transition: all 0.4s cubic-bezier(0.2, 0, 0.3, 1);
  16844. transition: all 0.4s cubic-bezier(0.2, 0, 0.3, 1);
  16845. }
  16846. .team-style-02 figure:hover figcaption a:nth-child(3) {
  16847. -webkit-transition: all 0.6s cubic-bezier(0.2, 0, 0.3, 1);
  16848. transition: all 0.6s cubic-bezier(0.2, 0, 0.3, 1);
  16849. }
  16850. .team-style-02 figure:hover figcaption a:nth-child(4) {
  16851. -webkit-transition: all 0.8s cubic-bezier(0.2, 0, 0.3, 1);
  16852. transition: all 0.8s cubic-bezier(0.2, 0, 0.3, 1);
  16853. }
  16854. .team-style-02 figure:hover figcaption a:nth-child(5) {
  16855. -webkit-transition: all 1s cubic-bezier(0.2, 0, 0.3, 1);
  16856. transition: all 1s cubic-bezier(0.2, 0, 0.3, 1);
  16857. }
  16858. /* Team style 04 */
  16859. .team-style-04 .team-content {
  16860. position: absolute;
  16861. bottom: 0;
  16862. -webkit-transition: all 0.5s cubic-bezier(0.37, 0.31, 0.2, 0.85);
  16863. transition: all 0.5s cubic-bezier(0.37, 0.31, 0.2, 0.85);
  16864. }
  16865. .team-style-04 figure figcaption {
  16866. position: absolute;
  16867. bottom: -20px;
  16868. -webkit-transition: all 0.5s cubic-bezier(0.37, 0.31, 0.2, 0.85);
  16869. transition: all 0.5s cubic-bezier(0.37, 0.31, 0.2, 0.85);
  16870. }
  16871. .team-style-04 figure figcaption .social-icon {
  16872. -webkit-transition: all 0s linear;
  16873. transition: all 0s linear;
  16874. }
  16875. .team-style-04 figure figcaption .social-icon a {
  16876. margin: 0 10px;
  16877. }
  16878. .team-style-04 figure:hover figcaption {
  16879. bottom: 0px;
  16880. }
  16881. /* Team style 05 */
  16882. .team-style-05 .team-content {
  16883. position: absolute;
  16884. bottom: 0;
  16885. opacity: 0;
  16886. -webkit-transition: all 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  16887. transition: all 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  16888. }
  16889. .team-style-05 .team-content p {
  16890. top: 55%;
  16891. -webkit-transition: all 0.5s ease;
  16892. transition: all 0.5s ease;
  16893. }
  16894. .team-style-05 .social-icon a {
  16895. opacity: 0;
  16896. -webkit-transition: 0.45s cubic-bezier(0.19, 1, 0.22, 1);
  16897. transition: 0.45s cubic-bezier(0.19, 1, 0.22, 1);
  16898. -webkit-transform: translateY(25px);
  16899. transform: translateY(25px);
  16900. margin: 0 10px;
  16901. display: inline-block;
  16902. }
  16903. .team-style-05 .social-icon a:nth-child(1) {
  16904. -webkit-transition: all 0.3s ease;
  16905. transition: all 0.3s ease;
  16906. }
  16907. .team-style-05 .social-icon a:nth-child(2) {
  16908. -webkit-transition: all 0.4s ease;
  16909. transition: all 0.4s ease;
  16910. }
  16911. .team-style-05 .social-icon a:nth-child(3) {
  16912. -webkit-transition: all 0.6s ease;
  16913. transition: all 0.6s ease;
  16914. }
  16915. .team-style-05 .social-icon a:nth-child(4) {
  16916. -webkit-transition: all 0.8s ease;
  16917. transition: all 0.8s ease;
  16918. }
  16919. .team-style-05 .social-icon a:nth-child(5) {
  16920. -webkit-transition: all 1s ease;
  16921. transition: all 1s ease;
  16922. }
  16923. .team-style-05:hover .team-content {
  16924. opacity: 1;
  16925. }
  16926. .team-style-05:hover .team-content p {
  16927. top: 50%;
  16928. }
  16929. .team-style-05:hover .social-icon a {
  16930. opacity: 1;
  16931. -webkit-transform: translateY(0);
  16932. transform: translateY(0);
  16933. }
  16934. .team-style-05:hover .social-icon a:nth-child(1) {
  16935. -webkit-transition: all 0.3s ease;
  16936. transition: all 0.3s ease;
  16937. }
  16938. .team-style-05:hover .social-icon a:nth-child(2) {
  16939. -webkit-transition: all 0.6s ease;
  16940. transition: all 0.6s ease;
  16941. }
  16942. .team-style-05:hover .social-icon a:nth-child(3) {
  16943. -webkit-transition: all 0.9s ease;
  16944. transition: all 0.9s ease;
  16945. }
  16946. .team-style-05:hover .social-icon a:nth-child(4) {
  16947. -webkit-transition: all 1.1s ease;
  16948. transition: all 1.1s ease;
  16949. }
  16950. .team-style-05:hover .social-icon a:nth-child(5) {
  16951. -webkit-transition: all 1.4s ease;
  16952. transition: all 1.4s ease;
  16953. }
  16954. /* Team style 08 */
  16955. .team-style-08 figure {
  16956. -webkit-transform: translate3d(0, 0, 0);
  16957. transform: translate3d(0, 0, 0);
  16958. -webkit-transition: all 0.5s cubic-bezier(0.2, 0, 0.3, 1);
  16959. transition: all 0.5s cubic-bezier(0.2, 0, 0.3, 1);
  16960. }
  16961. .team-style-08 figure figcaption {
  16962. position: absolute;
  16963. opacity: 0;
  16964. bottom: 0;
  16965. -webkit-transition: all 0.5s;
  16966. transition: all 0.5s;
  16967. }
  16968. .team-style-08 figure figcaption .social-icon a {
  16969. margin: 0 0 10px;
  16970. opacity: 0;
  16971. display: inline-block;
  16972. background-color: var(--dark-gray);
  16973. height: 50px;
  16974. width: 50px;
  16975. border-radius: 100%;
  16976. display: flex;
  16977. align-items: center;
  16978. justify-content: center;
  16979. -webkit-transform: translate3d(0, 15px, 0);
  16980. transform: translate3d(0, 15px, 0);
  16981. -webkit-transition: all 0.3s cubic-bezier(0.2, 0, 0.3, 1);
  16982. transition: all 0.3s cubic-bezier(0.2, 0, 0.3, 1);
  16983. -webkit-transform: scale(1);
  16984. transform: scale(1);
  16985. }
  16986. .team-style-08 figure figcaption .social-icon a:last-child {
  16987. margin-bottom: 0;
  16988. }
  16989. .team-style-08 figure figcaption .team-member-name {
  16990. opacity: 0;
  16991. -webkit-transform: translate3d(0, 15px, 0);
  16992. transform: translate3d(0, 15px, 0);
  16993. -webkit-transition: all 0.5s cubic-bezier(0.2, 0, 0.3, 1);
  16994. transition: all 0.5s cubic-bezier(0.2, 0, 0.3, 1);
  16995. }
  16996. .team-style-08 figure figcaption .member-designation {
  16997. opacity: 0;
  16998. -webkit-transform: translate3d(0, 20px, 0);
  16999. transform: translate3d(0, 20px, 0);
  17000. -webkit-transition: all 0.7s cubic-bezier(0.2, 0, 0.3, 1);
  17001. transition: all 0.7s cubic-bezier(0.2, 0, 0.3, 1);
  17002. }
  17003. .team-style-08:hover figure {
  17004. -webkit-transform: translate3d(0, -8px, 0);
  17005. transform: translate3d(0, -8px, 0);
  17006. }
  17007. .team-style-08:hover figure figcaption {
  17008. opacity: 1;
  17009. }
  17010. .team-style-08:hover figure figcaption .social-icon a:hover {
  17011. -webkit-transform: scale(1.1);
  17012. transform: scale(1.1);
  17013. }
  17014. .team-style-08:hover figure figcaption .team-member-name {
  17015. opacity: 1;
  17016. -webkit-transform: translate3d(0, 0, 0);
  17017. transform: translate3d(0, 0, 0);
  17018. }
  17019. .team-style-08:hover figure figcaption .member-designation {
  17020. opacity: 0.6;
  17021. -webkit-transform: translate3d(0, 0, 0);
  17022. transform: translate3d(0, 0, 0);
  17023. }
  17024. .team-style-08:hover figure figcaption a {
  17025. -webkit-transform: translate3d(0, 0, 0);
  17026. transform: translate3d(0, 0, 0);
  17027. opacity: 1;
  17028. }
  17029. /* Team style 09 */
  17030. .team-style-09 .nav-tabs > li.nav-item {
  17031. padding: 0;
  17032. }
  17033. .team-style-09 .nav-tabs > li.nav-item .number {
  17034. color: var(--dark-gray);
  17035. -webkit-transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  17036. transition: 0.4s cubic-bezier(0.12, 0, 0.39, 0);
  17037. }
  17038. .team-style-09 .nav-tabs > li.nav-item:last-child .nav-link {
  17039. border-bottom: 0;
  17040. }
  17041. .team-style-09 .nav-tabs .nav-link {
  17042. border: 0;
  17043. display: flex;
  17044. border-bottom: 1px solid var(--extra-medium-gray);
  17045. padding: 20px 0;
  17046. margin-bottom: 0;
  17047. background-color: transparent;
  17048. -webkit-border-radius: 0;
  17049. border-radius: 0;
  17050. -webkit-transition: 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  17051. transition: 0.3s cubic-bezier(0.12, 0, 0.39, 0);
  17052. }
  17053. .team-style-09 .nav-tabs .nav-link:hover {
  17054. -webkit-transform: translate3d(10px, 0, 0);
  17055. transform: translate3d(10px, 0, 0);
  17056. }
  17057. .team-style-09 .nav-tabs .nav-link.active, .team-style-09 .nav-tabs .nav-link:hover {
  17058. border-bottom: 1px solid var(--dark-gray);
  17059. }
  17060. /* Team style 10 */
  17061. .team-style-10 figure {
  17062. -webkit-transform: translate3d(0, 0, 0);
  17063. transform: translate3d(0, 0, 0);
  17064. -webkit-transition: all 0.5s cubic-bezier(0.2, 0, 0.3, 1);
  17065. transition: all 0.5s cubic-bezier(0.2, 0, 0.3, 1);
  17066. }
  17067. .team-style-10 figure .hover-switch-image {
  17068. position: absolute;
  17069. top: 0;
  17070. left: 0;
  17071. width: 100%;
  17072. height: 100%;
  17073. opacity: 0;
  17074. -webkit-transition: all 0.2s cubic-bezier(0.2, 0, 0.3, 1);
  17075. transition: all 0.2s cubic-bezier(0.2, 0, 0.3, 1);
  17076. }
  17077. .team-style-10 figure figcaption {
  17078. position: absolute;
  17079. opacity: 0;
  17080. bottom: 0;
  17081. -webkit-transition: all 0.5s;
  17082. transition: all 0.5s;
  17083. }
  17084. .team-style-10 figure figcaption .social-icon a {
  17085. margin: 0 0 10px;
  17086. opacity: 0;
  17087. display: inline-block;
  17088. background-color: var(--dark-gray);
  17089. height: 50px;
  17090. width: 50px;
  17091. border-radius: 100%;
  17092. display: flex;
  17093. align-items: center;
  17094. justify-content: center;
  17095. will-change: transform;
  17096. -webkit-transition: all 0.3s cubic-bezier(0.2, 0, 0.3, 1);
  17097. transition: all 0.3s cubic-bezier(0.2, 0, 0.3, 1);
  17098. -webkit-transform: scale(1.1);
  17099. transform: scale(1.1);
  17100. }
  17101. .team-style-10 figure figcaption .social-icon a:last-child {
  17102. margin-bottom: 0;
  17103. }
  17104. .team-style-10 figure figcaption .team-member-strip {
  17105. -webkit-transform: translate3d(0, 20px, 0);
  17106. transform: translate3d(0, 20px, 0);
  17107. -webkit-transition: all 0.3s cubic-bezier(0.2, 0, 0.8, 1);
  17108. transition: all 0.3s cubic-bezier(0.2, 0, 0.8, 1);
  17109. }
  17110. .team-style-10 figure figcaption .team-member-strip .team-member-name {
  17111. opacity: 0;
  17112. -webkit-transform: translate3d(0, 15px, 0);
  17113. transform: translate3d(0, 15px, 0);
  17114. -webkit-transition: all 0.5s cubic-bezier(0.2, 0, 0.3, 1);
  17115. transition: all 0.5s cubic-bezier(0.2, 0, 0.3, 1);
  17116. }
  17117. .team-style-10 figure figcaption .team-member-strip .member-designation {
  17118. opacity: 0;
  17119. -webkit-transform: translate3d(0, 20px, 0);
  17120. transform: translate3d(0, 20px, 0);
  17121. -webkit-transition: all 0.7s cubic-bezier(0.2, 0, 0.3, 1);
  17122. transition: all 0.7s cubic-bezier(0.2, 0, 0.3, 1);
  17123. }
  17124. .team-style-10:hover figure .hover-switch-image {
  17125. left: 0;
  17126. opacity: 1;
  17127. }
  17128. .team-style-10:hover figure figcaption {
  17129. opacity: 1;
  17130. }
  17131. .team-style-10:hover figure figcaption .social-icon a {
  17132. -webkit-transform: scale(1);
  17133. transform: scale(1);
  17134. }
  17135. .team-style-10:hover figure figcaption .social-icon a:hover {
  17136. -webkit-transform: scale(1.1);
  17137. transform: scale(1.1);
  17138. }
  17139. .team-style-10:hover figure figcaption .team-member-strip {
  17140. -webkit-transform: translate3d(0, 0, 0);
  17141. transform: translate3d(0, 0, 0);
  17142. }
  17143. .team-style-10:hover figure figcaption .team-member-strip .team-member-name {
  17144. opacity: 1;
  17145. -webkit-transform: translate3d(0, 0, 0);
  17146. transform: translate3d(0, 0, 0);
  17147. }
  17148. .team-style-10:hover figure figcaption .team-member-strip .member-designation {
  17149. opacity: 1;
  17150. -webkit-transform: translate3d(0, 0, 0);
  17151. transform: translate3d(0, 0, 0);
  17152. }
  17153. .team-style-10:hover figure figcaption a {
  17154. -webkit-transform: translate3d(0, 0, 0);
  17155. transform: translate3d(0, 0, 0);
  17156. opacity: 1;
  17157. }
  17158. /* Testimonial style 01 */
  17159. .testimonials-style-01 .testimonial-arrow:after {
  17160. content: "";
  17161. top: 100%;
  17162. left: 50px;
  17163. height: 0;
  17164. width: 0;
  17165. z-index: 9;
  17166. margin-left: -14px;
  17167. position: absolute;
  17168. pointer-events: none;
  17169. border: solid transparent;
  17170. border-width: 14px;
  17171. border-top-color: var(--white);
  17172. }
  17173. .testimonials-style-01 .author-detail img {
  17174. width: 60px;
  17175. height: 60px;
  17176. }
  17177. /* Testimonial style 04 */
  17178. .testimonials-style-04.swiper-horizontal-3d.swiper {
  17179. margin-left: auto;
  17180. margin-right: auto;
  17181. position: relative;
  17182. overflow: hidden;
  17183. z-index: 1;
  17184. }
  17185. .testimonials-style-04.swiper-horizontal-3d .swiper-wrapper {
  17186. position: relative;
  17187. width: 100%;
  17188. height: 100%;
  17189. z-index: 1;
  17190. display: flex;
  17191. transition-property: transform;
  17192. transition-property: transform, -webkit-transform;
  17193. box-sizing: content-box;
  17194. }
  17195. .testimonials-style-04.swiper-horizontal-3d.swiper-pagination-bottom .swiper-wrapper {
  17196. margin-bottom: 0;
  17197. }
  17198. .testimonials-style-04.swiper-horizontal-3d .swiper-slide {
  17199. filter: grayscale(100%);
  17200. opacity: 0;
  17201. -webkit-flex-shrink: 0;
  17202. -ms-flex: 0 0 auto;
  17203. -ms-flex-negative: 0;
  17204. flex-shrink: 0;
  17205. width: 100%;
  17206. height: 100%;
  17207. position: relative;
  17208. }
  17209. .testimonials-style-04.swiper-horizontal-3d .swiper-slide.swiper-slide-prev, .testimonials-style-04.swiper-horizontal-3d .swiper-slide.swiper-slide-next {
  17210. opacity: 0.7;
  17211. }
  17212. .testimonials-style-04.swiper-horizontal-3d .swiper-slide.swiper-slide-active {
  17213. opacity: 1;
  17214. filter: grayscale(0);
  17215. box-shadow: 0 0 60px rgba(0, 0, 0, 0.17);
  17216. }
  17217. .testimonials-style-04.swiper-horizontal-3d .swiper-slide.swiper-slide-active .slider-image:hover .preview-icon {
  17218. opacity: 1;
  17219. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  17220. z-index: 1;
  17221. }
  17222. .testimonials-style-04.swiper-horizontal-3d .swiper-slide img {
  17223. opacity: 0;
  17224. }
  17225. .testimonials-style-04.swiper-horizontal-3d.swiper {
  17226. width: 100%;
  17227. padding-bottom: 60px;
  17228. }
  17229. .testimonials-style-04.swiper-horizontal-3d.swiper-3d .swiper-slide-shadow-left, .testimonials-style-04.swiper-horizontal-3d.swiper-3d .swiper-slide-shadow-right {
  17230. background-image: none;
  17231. }
  17232. .testimonials-style-04.swiper-horizontal-3d .swiper-slide-active img {
  17233. opacity: 1;
  17234. }
  17235. /* Testimonial style 05 */
  17236. .testimonials-style-05 .testimonials-bubble {
  17237. position: relative;
  17238. border: 1px solid;
  17239. -webkit-transition: 0.2s;
  17240. transition: 0.2s;
  17241. }
  17242. .testimonials-style-05 .testimonials-bubble:after, .testimonials-style-05 .testimonials-bubble:before {
  17243. top: 100%;
  17244. left: 50px;
  17245. border: solid transparent;
  17246. content: " ";
  17247. height: 0;
  17248. width: 0;
  17249. position: absolute;
  17250. pointer-events: none;
  17251. }
  17252. .testimonials-style-05 .testimonials-bubble:after {
  17253. border-color: rgba(255, 255, 255, 0);
  17254. border-top-color: var(--white);
  17255. border-width: 15px 15px 0 0;
  17256. margin-left: 1px;
  17257. }
  17258. .testimonials-style-05 .testimonials-bubble:before {
  17259. border-color: rgba(237, 237, 237, 0);
  17260. border-top-color: var(--extra-medium-gray);
  17261. border-width: 18px 18px 0 0;
  17262. }
  17263. /* Testimonial style 12 */
  17264. .testimonials-style-12 .swiper-button-next-nav {
  17265. right: -8px;
  17266. }
  17267. .testimonials-style-12 .swiper-button-next-nav:hover {
  17268. opacity: 1;
  17269. }
  17270. .testimonials-style-12 .swiper-button-previous-nav {
  17271. left: -8px;
  17272. }
  17273. .testimonials-style-12 .swiper-button-previous-nav:hover {
  17274. opacity: 1;
  17275. }
  17276. /* Testimonial style 13 */
  17277. .testimonials-style-13 .swiper-slide {
  17278. opacity: 0.1;
  17279. }
  17280. .testimonials-style-13 .swiper-slide.swiper-slide-active {
  17281. opacity: 1;
  17282. }
  17283. .testimonials-style-13 .swiper-slide.swiper-slide-next {
  17284. opacity: 0.4;
  17285. }
  17286. /* ===================================
  17287. 14. Blog
  17288. ====================================== */
  17289. /* Blog grid */
  17290. .blog-grid .card {
  17291. color: inherit;
  17292. -webkit-transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  17293. transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  17294. }
  17295. .blog-grid .card .blog-image img {
  17296. -webkit-border-radius: 4px 4px 0 0;
  17297. border-radius: 4px 4px 0 0;
  17298. }
  17299. .blog-grid .card .card-body {
  17300. color: inherit;
  17301. }
  17302. .blog-grid .card .card-body p {
  17303. margin-bottom: 15px;
  17304. }
  17305. .blog-grid .card .card-body .author {
  17306. will-change: transform;
  17307. }
  17308. .blog-grid .card .card-body .author .blog-date {
  17309. opacity: 1;
  17310. visibility: visible;
  17311. -webkit-transform: translateY(0);
  17312. transform: translateY(0);
  17313. -webkit-transition: all 500ms cubic-bezier(0.37, 0, 0.63, 1);
  17314. transition: all 500ms cubic-bezier(0.37, 0, 0.63, 1);
  17315. }
  17316. .blog-grid .card .card-body .author .like-count a i {
  17317. margin-right: 4px;
  17318. vertical-align: middle;
  17319. -webkit-transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  17320. transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  17321. }
  17322. .blog-grid .card .card-body .author .like-count a:hover i {
  17323. -webkit-transform: scale(1.2);
  17324. transform: scale(1.2);
  17325. }
  17326. .blog-grid .card .card-body .author .author-name {
  17327. position: absolute;
  17328. width: auto;
  17329. left: 0;
  17330. bottom: 0;
  17331. opacity: 1;
  17332. visibility: visible;
  17333. -webkit-transform: translateY(32px);
  17334. transform: translateY(32px);
  17335. -webkit-transition: all 500ms cubic-bezier(0.37, 0, 0.63, 1);
  17336. transition: all 500ms cubic-bezier(0.37, 0, 0.63, 1);
  17337. }
  17338. .blog-grid .card .blog-categories {
  17339. position: absolute;
  17340. top: 17px;
  17341. right: 20px;
  17342. }
  17343. .blog-grid .card .blog-categories .categories-btn {
  17344. -webkit-box-shadow: 0 0 25px rgba(0, 0, 0, 0.4);
  17345. box-shadow: 0 0 25px rgba(0, 0, 0, 0.4);
  17346. }
  17347. .blog-grid .card:hover .author .blog-date {
  17348. position: relative;
  17349. opacity: 1;
  17350. visibility: visible;
  17351. -webkit-transform: translateY(-32px);
  17352. transform: translateY(-32px);
  17353. }
  17354. .blog-grid .card:hover .author .author-name {
  17355. opacity: 1;
  17356. visibility: visible;
  17357. -webkit-transform: translateY(0);
  17358. transform: translateY(0);
  17359. }
  17360. /* Blog classic */
  17361. .blog-classic .card {
  17362. color: inherit;
  17363. }
  17364. .blog-classic .card .blog-image img {
  17365. -webkit-transition: all 600ms cubic-bezier(0.37, 0, 0.63, 1);
  17366. transition: all 600ms cubic-bezier(0.37, 0, 0.63, 1);
  17367. will-change: transform;
  17368. }
  17369. .blog-classic .card .card-body {
  17370. color: inherit;
  17371. }
  17372. .blog-classic .card .card-body .categories-text:after {
  17373. content: "\f309";
  17374. display: inline-block;
  17375. font-family: bootstrap-icons;
  17376. vertical-align: middle;
  17377. margin: -2px 1px 0;
  17378. font-size: 22px;
  17379. color: var(--medium-gray);
  17380. opacity: 0.7;
  17381. }
  17382. .blog-classic .card .card-body .card-link i {
  17383. opacity: 0;
  17384. visibility: hidden;
  17385. transform-origin: center left;
  17386. -webkit-transform: translateX(-10px) scaleX(0);
  17387. transform: translateX(-10px) scaleX(0);
  17388. -webkit-transition: all 300ms cubic-bezier(0.5, 1, 0.89, 1);
  17389. transition: all 300ms cubic-bezier(0.5, 1, 0.89, 1);
  17390. vertical-align: middle;
  17391. margin-left: 3px;
  17392. }
  17393. .blog-classic .card:hover .blog-image img {
  17394. -webkit-transform: scale(1.07);
  17395. transform: scale(1.07);
  17396. }
  17397. .blog-classic .card:hover .card-body .card-link i {
  17398. opacity: 1;
  17399. visibility: visible;
  17400. -webkit-transform: translateX(0) scaleX(1);
  17401. transform: translateX(0) scaleX(1);
  17402. }
  17403. /* Blog only text */
  17404. .blog-only-text {
  17405. counter-reset: card-body;
  17406. }
  17407. .blog-only-text .card-body {
  17408. color: inherit;
  17409. position: relative;
  17410. overflow: hidden;
  17411. }
  17412. .blog-only-text .card-body .hover-img {
  17413. position: absolute;
  17414. left: 0;
  17415. top: 0;
  17416. -o-object-fit: cover;
  17417. object-fit: cover;
  17418. width: 100%;
  17419. height: 100%;
  17420. opacity: 0;
  17421. visibility: hidden;
  17422. -webkit-transition: all 300ms cubic-bezier(0.37, 0, 0.63, 1);
  17423. transition: all 300ms cubic-bezier(0.37, 0, 0.63, 1);
  17424. -webkit-transform: scale(1.1) rotate(-3deg);
  17425. transform: scale(1.1) rotate(-3deg);
  17426. }
  17427. .blog-only-text .card-body:after {
  17428. counter-increment: card-body;
  17429. content: counter(card-body, decimal-leading-zero);
  17430. position: absolute;
  17431. font-size: 70px;
  17432. line-height: 70px;
  17433. letter-spacing: -3px;
  17434. top: 30px;
  17435. right: -8px;
  17436. font-weight: 600;
  17437. opacity: 0.1;
  17438. color: var(--dark-gray);
  17439. -webkit-transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  17440. transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  17441. }
  17442. .blog-only-text .card-body:hover .hover-img {
  17443. opacity: 1;
  17444. visibility: visible;
  17445. -webkit-transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  17446. transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  17447. -webkit-transform: scale(1) rotate(0deg);
  17448. transform: scale(1) rotate(0deg);
  17449. }
  17450. .blog-only-text .card-body:hover:after {
  17451. opacity: 0.2;
  17452. color: var(--white);
  17453. right: 30px;
  17454. -webkit-transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  17455. transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  17456. }
  17457. .blog-only-text .card-body:hover .card-title {
  17458. text-shadow: 0 0 50px rgba(0, 0, 0, 0.9);
  17459. }
  17460. .blog-only-text .card-body:hover .categories-btn {
  17461. background: var(--white);
  17462. color: var(--dark-gray) !important;
  17463. -webkit-box-shadow: 0 10px 40px rgba(0, 0, 0, 0.6);
  17464. box-shadow: 0 10px 40px rgba(0, 0, 0, 0.6);
  17465. -webkit-transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  17466. transition: all 350ms cubic-bezier(0.37, 0, 0.63, 1);
  17467. }
  17468. /* Blog metro */
  17469. .blog-metro figure .blog-image .blog-overlay {
  17470. position: absolute;
  17471. top: 0;
  17472. left: 0;
  17473. height: 100%;
  17474. width: 100%;
  17475. background: #1f232c;
  17476. background: linear-gradient(0deg, rgba(23, 23, 23, 0.8) 0, rgba(23, 23, 23, 0) 70%);
  17477. -webkit-transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  17478. transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  17479. }
  17480. .blog-metro figure .categories-btn {
  17481. border: 1px solid transparent;
  17482. }
  17483. .blog-metro figure img {
  17484. -webkit-transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  17485. transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  17486. width: 100%;
  17487. }
  17488. .blog-metro figure figcaption {
  17489. position: absolute;
  17490. top: 0;
  17491. left: 0;
  17492. }
  17493. .blog-metro figure .card-title {
  17494. margin-bottom: 0;
  17495. }
  17496. .blog-metro figure:hover img {
  17497. -webkit-transform: scale(1.1);
  17498. transform: scale(1.1);
  17499. opacity: 0.5;
  17500. }
  17501. .blog-metro figure:hover .categories-btn {
  17502. background: transparent !important;
  17503. color: #fff;
  17504. border: 1px solid rgba(255, 255, 255, 0.3);
  17505. }
  17506. .blog-metro figure:hover .categories-btn.bg-base-color {
  17507. color: var(--base-color) !important;
  17508. border-color: var(--base-color);
  17509. }
  17510. /* Blog masonry */
  17511. .blog-masonry .card {
  17512. color: inherit;
  17513. }
  17514. .blog-masonry .card .card-top {
  17515. position: relative;
  17516. padding: 15px 20px;
  17517. }
  17518. .blog-masonry .card .card-top:after {
  17519. content: "";
  17520. position: absolute;
  17521. left: 25px;
  17522. top: 100%;
  17523. width: 0;
  17524. height: 0;
  17525. border-left: 8px solid transparent;
  17526. border-right: 8px solid transparent;
  17527. border-top: 8px solid #fff;
  17528. clear: both;
  17529. z-index: 1;
  17530. }
  17531. .blog-masonry .card .card-top .avtar {
  17532. height: 30px;
  17533. width: 30px;
  17534. margin-right: 10px;
  17535. position: relative;
  17536. border-radius: 100%;
  17537. }
  17538. .blog-masonry .card .blog-image img {
  17539. -webkit-transition: all 1000ms cubic-bezier(0.5, 1, 0.89, 1);
  17540. transition: all 1000ms cubic-bezier(0.5, 1, 0.89, 1);
  17541. }
  17542. .blog-masonry .card .blog-image .categories-btn {
  17543. -webkit-box-shadow: 0 0 25px rgba(0, 0, 0, 0.4);
  17544. box-shadow: 0 0 25px rgba(0, 0, 0, 0.4);
  17545. }
  17546. .blog-masonry .card .like-count a i {
  17547. margin-right: 5px;
  17548. -webkit-transition: all 400ms cubic-bezier(0.5, 1, 0.89, 1);
  17549. transition: all 400ms cubic-bezier(0.5, 1, 0.89, 1);
  17550. will-change: transform;
  17551. }
  17552. .blog-masonry .card .like-count a:hover i {
  17553. -webkit-transform: scale(1.2);
  17554. transform: scale(1.2);
  17555. }
  17556. .blog-masonry .card .blog-date i {
  17557. margin-right: 8px;
  17558. }
  17559. .blog-masonry .card .blog-categories {
  17560. position: absolute;
  17561. bottom: 30px;
  17562. left: 30px;
  17563. }
  17564. .blog-masonry .card:hover {
  17565. -webkit-transform: translate3d(0, 0, 0);
  17566. transform: translate3d(0, 0, 0);
  17567. }
  17568. .blog-masonry .card:hover .blog-image img {
  17569. -webkit-transform: scale(1.1);
  17570. transform: scale(1.1);
  17571. }
  17572. /* Blog simple */
  17573. .blog-simple figure .blog-image {
  17574. overflow: hidden;
  17575. }
  17576. .blog-simple figure .blog-hover-icon {
  17577. -webkit-transform: scale(0);
  17578. transform: scale(0);
  17579. -webkit-transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  17580. transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  17581. opacity: 0;
  17582. }
  17583. .blog-simple figure figcaption {
  17584. position: absolute;
  17585. bottom: 0;
  17586. top: 0;
  17587. width: 100%;
  17588. -webkit-transition: all 0.3s linear;
  17589. transition: all 0.3s linear;
  17590. }
  17591. .blog-simple figure:hover .blog-hover-icon {
  17592. opacity: 1;
  17593. visibility: visible;
  17594. -webkit-transform: scale(1);
  17595. transform: scale(1);
  17596. }
  17597. .blog-simple figure:hover .post-content .card-title a:hover {
  17598. color: var(--base-color);
  17599. }
  17600. .blog-simple figure:hover .blog-image img {
  17601. -webkit-filter: blur(2px);
  17602. filter: blur(2px);
  17603. -webkit-transition: 0.3s;
  17604. transition: 0.3s;
  17605. }
  17606. .blog-simple figure:hover .blog-image .box-overlay {
  17607. opacity: 0.3;
  17608. }
  17609. .blog-simple figure:hover .box-overlay {
  17610. opacity: 1;
  17611. visibility: visible;
  17612. }
  17613. /* Blog date */
  17614. .blog-date .feature-box {
  17615. -webkit-transform: translateY(0);
  17616. transform: translateY(0);
  17617. }
  17618. .blog-date .feature-box .feature-box-icon {
  17619. margin-right: 40px !important;
  17620. }
  17621. .blog-date .feature-box .post-date {
  17622. min-width: 75px;
  17623. padding: 20px 0 17px;
  17624. -webkit-transition: all 0.3s linear;
  17625. transition: all 0.3s linear;
  17626. }
  17627. .blog-date .feature-box .post-date span {
  17628. -webkit-transition: all 0.3s linear;
  17629. transition: all 0.3s linear;
  17630. }
  17631. .blog-date .feature-box:hover {
  17632. -webkit-transform: translateY(-5px);
  17633. transform: translateY(-5px);
  17634. }
  17635. /* Blog side image */
  17636. .blog-side-image .blog-box .blog-image {
  17637. min-height: 300px;
  17638. will-change: transform;
  17639. -webkit-transition: all 600ms cubic-bezier(0.5, 1, 0.89, 1);
  17640. transition: all 600ms cubic-bezier(0.5, 1, 0.89, 1);
  17641. }
  17642. .blog-side-image .blog-box .blog-image .blog-post-image-overlay {
  17643. opacity: 0;
  17644. position: absolute;
  17645. top: 0;
  17646. left: 0;
  17647. width: 100%;
  17648. height: 100%;
  17649. -webkit-transition: all 600ms cubic-bezier(0.5, 1, 0.89, 1);
  17650. transition: all 600ms cubic-bezier(0.5, 1, 0.89, 1);
  17651. }
  17652. .blog-side-image .blog-box .blog-content {
  17653. position: relative;
  17654. z-index: 1;
  17655. }
  17656. .blog-side-image .blog-box .blog-content .separator {
  17657. width: 10px;
  17658. height: 1px;
  17659. -webkit-transition: all 600ms cubic-bezier(0.5, 1, 0.89, 1);
  17660. transition: all 600ms cubic-bezier(0.5, 1, 0.89, 1);
  17661. display: inline-block;
  17662. vertical-align: middle;
  17663. margin-right: 7px;
  17664. }
  17665. .blog-side-image .blog-box .blog-content .categories-btn {
  17666. -webkit-border-radius: 50px;
  17667. border-radius: 50px;
  17668. margin-left: 0;
  17669. margin-right: 5px;
  17670. line-height: 20px;
  17671. padding: 4px 15px;
  17672. }
  17673. .blog-side-image .blog-box:hover .blog-image {
  17674. -webkit-transform: scale(1.1);
  17675. transform: scale(1.1);
  17676. }
  17677. .blog-side-image .blog-box:hover .blog-image .blog-post-image-overlay {
  17678. opacity: 0.4;
  17679. }
  17680. .blog-side-image .blog-box:hover .blog-content .separator {
  17681. width: 30px;
  17682. }
  17683. /* Blog modern */
  17684. .blog-modern figure .blog-image {
  17685. margin-bottom: 48px;
  17686. }
  17687. .blog-modern figure .blog-image img {
  17688. -webkit-transition: all 900ms cubic-bezier(0.5, 1, 0.89, 1);
  17689. transition: all 900ms cubic-bezier(0.5, 1, 0.89, 1);
  17690. }
  17691. .blog-modern figure .post-content-wrapper {
  17692. position: absolute;
  17693. bottom: -51px;
  17694. width: 85%;
  17695. margin: 0 auto;
  17696. left: 0;
  17697. right: 0;
  17698. -webkit-box-shadow: 0px 4px 10px rgba(111, 111, 111, 0.1);
  17699. box-shadow: 0px 4px 10px rgba(111, 111, 111, 0.1);
  17700. }
  17701. .blog-modern figure .post-content-wrapper .post-content {
  17702. -webkit-transition: all 400ms cubic-bezier(0.5, 1, 0.89, 1);
  17703. transition: all 400ms cubic-bezier(0.5, 1, 0.89, 1);
  17704. }
  17705. .blog-modern figure .post-content-wrapper .separator {
  17706. margin: 0 15px;
  17707. opacity: 0.7;
  17708. font-weight: 300;
  17709. }
  17710. .blog-modern figure:hover .blog-image img {
  17711. -webkit-transform: scale(1.1);
  17712. transform: scale(1.1);
  17713. }
  17714. .blog-modern figure:hover .post-content-wrapper .post-content .card-title {
  17715. color: var(--white);
  17716. }
  17717. .blog-modern figure:hover .post-content-wrapper .post-content .card-title:hover {
  17718. color: var(--white);
  17719. }
  17720. .blog-modern figure:hover .post-content-wrapper .post-content .box-overlay {
  17721. opacity: 1;
  17722. visibility: visible;
  17723. }
  17724. /* Blog standard */
  17725. .blog-standard .blog-image {
  17726. position: relative;
  17727. }
  17728. .blog-standard .blog-image .blog-categories {
  17729. position: absolute;
  17730. right: 40px;
  17731. top: 40px;
  17732. }
  17733. .blog-standard .entry-meta span {
  17734. position: relative;
  17735. margin-right: 20px;
  17736. }
  17737. .blog-standard .entry-meta span:last-child {
  17738. margin-right: 0;
  17739. }
  17740. .blog-standard .entry-meta span i {
  17741. margin-right: 7px;
  17742. }
  17743. /* Blog comment */
  17744. .blog-comment {
  17745. padding-left: 0;
  17746. margin-bottom: 0;
  17747. }
  17748. .blog-comment li {
  17749. padding-bottom: 65px;
  17750. position: relative;
  17751. list-style: none;
  17752. }
  17753. .blog-comment li:last-child {
  17754. border-bottom: medium none;
  17755. padding-bottom: 0;
  17756. }
  17757. .blog-comment li .btn-reply {
  17758. float: right;
  17759. font-size: 11px;
  17760. line-height: initial;
  17761. padding: 7px 20px 6px;
  17762. border-radius: 50px;
  17763. border: 1px solid rgba(44, 44, 44, 0.25);
  17764. background-color: var(--white);
  17765. }
  17766. .blog-comment li .btn-reply:hover {
  17767. border-color: var(--base-color);
  17768. background: var(--base-color);
  17769. color: var(--white);
  17770. }
  17771. .blog-comment li ul.child-comment {
  17772. list-style: outside none none;
  17773. margin-left: 70px;
  17774. }
  17775. .blog-comment li ul.child-comment li {
  17776. margin-top: 60px;
  17777. padding-bottom: 0;
  17778. }
  17779. .blog-comment > li:first-child {
  17780. padding-top: 0;
  17781. }
  17782. /* Pagination style 01 */
  17783. .pagination-style-01 .page-item .page-link {
  17784. border: 0;
  17785. padding: 0 2px;
  17786. margin: 0 7px;
  17787. background: 0 0;
  17788. color: var(--medium-gray);
  17789. min-width: 45px;
  17790. font-size: inherit;
  17791. text-align: center;
  17792. -webkit-border-radius: 100%;
  17793. border-radius: 100%;
  17794. line-height: 45px;
  17795. min-height: 45px;
  17796. }
  17797. .pagination-style-01 .page-item .page-link i {
  17798. line-height: 40px;
  17799. }
  17800. .pagination-style-01 .page-item .page-link:hover {
  17801. background: var(--white);
  17802. color: var(--dark-gray);
  17803. box-shadow: 0 0 10px rgba(23, 23, 23, 0.15) !important;
  17804. }
  17805. .pagination-style-01 .page-item .page-link:focus {
  17806. box-shadow: none;
  17807. }
  17808. .pagination-style-01 .page-item.active .page-link {
  17809. background: var(--dark-gray);
  17810. color: var(--white);
  17811. box-shadow: 0 0 10px rgba(23, 23, 23, 0.15) !important;
  17812. }
  17813. .pagination-style-01 .page-item:first-child .page-link, .pagination-style-01 .page-item:last-child .page-link {
  17814. background: transparent;
  17815. box-shadow: none !important;
  17816. }
  17817. .pagination-style-01.light .page-item:first-child .page-link, .pagination-style-01.light .page-item:last-child .page-link {
  17818. background: transparent;
  17819. box-shadow: none !important;
  17820. }
  17821. .pagination-style-01.light .page-item:first-child .page-link:hover, .pagination-style-01.light .page-item:last-child .page-link:hover {
  17822. color: var(--white);
  17823. }
  17824. /* Blog clean */
  17825. .blog-clean .card {
  17826. color: inherit;
  17827. }
  17828. .blog-clean .card .blog-image img {
  17829. -webkit-transition: all 0.3s linear;
  17830. transition: all 0.3s linear;
  17831. will-change: transform;
  17832. }
  17833. .blog-clean .card .card-body {
  17834. color: inherit;
  17835. }
  17836. .blog-clean .card .card-body .blog-categories {
  17837. top: -17px;
  17838. }
  17839. .blog-clean .card .card-body .blog-categories .categories-btn {
  17840. margin: 0 5px 0 0;
  17841. font-size: 12px;
  17842. border-radius: 0;
  17843. }
  17844. .blog-clean .card .card-body .card-link i {
  17845. opacity: 0;
  17846. visibility: hidden;
  17847. -webkit-transform: translateX(-10px);
  17848. transform: translateX(-10px);
  17849. -webkit-transition: all 0.3s linear;
  17850. transition: all 0.3s linear;
  17851. vertical-align: middle;
  17852. margin-left: 10px;
  17853. line-height: 11px;
  17854. }
  17855. .blog-clean .card:hover .blog-image img {
  17856. -webkit-transform: scale(1.07);
  17857. transform: scale(1.07);
  17858. }
  17859. .blog-clean .card:hover .card-body .card-link i {
  17860. opacity: 1;
  17861. visibility: visible;
  17862. -webkit-transform: translateX(0);
  17863. transform: translateX(0);
  17864. }
  17865. /* ===================================
  17866. 15. Portfolio
  17867. ====================================== */
  17868. /* Portfolio grid */
  17869. .grid-item .portfolio-image img {
  17870. width: 100%;
  17871. }
  17872. .portfolio-grid .work-1col li {
  17873. width: 100%;
  17874. }
  17875. /* Portfolio filter */
  17876. .portfolio-filter li {
  17877. padding: 0 25px;
  17878. }
  17879. .portfolio-filter li:first-child {
  17880. padding-left: 0;
  17881. }
  17882. .portfolio-filter li:last-child {
  17883. padding-right: 0;
  17884. }
  17885. .portfolio-filter li a {
  17886. color: var(--medium-gray);
  17887. border-bottom: 2px solid transparent;
  17888. }
  17889. .portfolio-filter li:hover a, .portfolio-filter li:focus a, .portfolio-filter li.active a {
  17890. color: var(--dark-gray);
  17891. border-color: var(--dark-gray);
  17892. }
  17893. .portfolio-filter.filter-btn li {
  17894. padding: 0 12px;
  17895. }
  17896. .portfolio-filter.filter-btn li a {
  17897. padding: 6px 30px;
  17898. border-radius: 40px;
  17899. }
  17900. .portfolio-filter.filter-btn li a:hover, .portfolio-filter.filter-btn li a:focus, .portfolio-filter.filter-btn li a.active {
  17901. background-color: var(--white);
  17902. color: var(--dark-gray);
  17903. -webkit-box-shadow: 0 0 25px rgba(0, 0, 0, 0.08);
  17904. box-shadow: 0 0 25px rgba(0, 0, 0, 0.08);
  17905. }
  17906. .portfolio-filter.filter-btn li.active a {
  17907. background-color: var(--white);
  17908. color: var(--dark-gray);
  17909. -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);
  17910. box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);
  17911. }
  17912. /* Portfolio classic */
  17913. .portfolio-classic .portfolio-box {
  17914. -webkit-clip-path: inset(0 0 0 0);
  17915. clip-path: inset(0 0 0 0);
  17916. }
  17917. .portfolio-classic .portfolio-box .portfolio-hover {
  17918. opacity: 0;
  17919. transform: translate3d(0, 45px, 0) skewY(-15deg);
  17920. }
  17921. .portfolio-classic .portfolio-box:hover {
  17922. -webkit-clip-path: inset(2% 2% 2% 2%);
  17923. clip-path: inset(2% 2% 2% 2%);
  17924. }
  17925. .portfolio-classic .portfolio-box:hover .portfolio-image img {
  17926. opacity: 0.15;
  17927. -webkit-filter: blur(4px);
  17928. filter: blur(4px);
  17929. }
  17930. .portfolio-classic .portfolio-box:hover .portfolio-hover {
  17931. opacity: 1;
  17932. transform: translate3d(0, 0, 0);
  17933. }
  17934. /* Portfolio boxed */
  17935. .portfolio-boxed .portfolio-box {
  17936. will-change: transform;
  17937. }
  17938. .portfolio-boxed .portfolio-box .portfolio-icon a {
  17939. margin: 0 4px;
  17940. position: relative;
  17941. -webkit-box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.5);
  17942. box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.5);
  17943. }
  17944. .portfolio-boxed .portfolio-box .portfolio-overlay {
  17945. position: absolute;
  17946. top: 0px;
  17947. left: 0px;
  17948. width: 100%;
  17949. height: 100%;
  17950. z-index: -1;
  17951. opacity: 0;
  17952. visibility: hidden;
  17953. -webkit-transition: all 0.2s linear;
  17954. transition: all 0.2s linear;
  17955. }
  17956. .portfolio-boxed .portfolio-box:hover {
  17957. -webkit-box-shadow: 10px 0 70px rgba(0, 0, 0, 0.15);
  17958. box-shadow: 10px 0 70px rgba(0, 0, 0, 0.15);
  17959. -webkit-transform: translateY(-5px);
  17960. transform: translateY(-5px);
  17961. }
  17962. .portfolio-boxed .portfolio-box:hover .portfolio-image img {
  17963. opacity: 0.3;
  17964. }
  17965. .portfolio-boxed .portfolio-box:hover .portfolio-overlay {
  17966. opacity: 1;
  17967. visibility: visible;
  17968. }
  17969. /* Mousetip */
  17970. .mousetip-wrapper .caption {
  17971. opacity: 0;
  17972. visibility: hidden;
  17973. position: absolute;
  17974. top: 20px;
  17975. left: 20px;
  17976. z-index: 9;
  17977. }
  17978. .mousetip-wrapper:hover .caption {
  17979. opacity: 1;
  17980. visibility: visible;
  17981. display: block;
  17982. }
  17983. /* Portfolio transform */
  17984. .portfolio-transform .portfolio-box {
  17985. will-change: auto;
  17986. overflow: visible;
  17987. }
  17988. .portfolio-transform .portfolio-box .caption {
  17989. padding: 22px 28px 11px;
  17990. white-space: nowrap;
  17991. -webkit-box-shadow: 0 0 25px rgba(0, 0, 0, 0.2);
  17992. box-shadow: 0 0 25px rgba(0, 0, 0, 0.2);
  17993. }
  17994. .portfolio-transform .portfolio-box .portfolio-image {
  17995. overflow: visible;
  17996. }
  17997. .portfolio-transform .portfolio-box .portfolio-image img {
  17998. -webkit-transition: all 0.6s linear;
  17999. transition: all 0.6s linear;
  18000. }
  18001. .portfolio-transform .portfolio-box:hover .portfolio-image img {
  18002. -webkit-transform: scale(1.1);
  18003. transform: scale(1.1);
  18004. }
  18005. /* Portfolio creative */
  18006. .portfolio-creative .portfolio-box {
  18007. will-change: transform;
  18008. }
  18009. .portfolio-creative .portfolio-box .portfolio-title {
  18010. -webkit-transform: scale(2);
  18011. transform: scale(2);
  18012. display: block;
  18013. width: 100%;
  18014. }
  18015. .portfolio-creative .portfolio-box .portfolio-title::before {
  18016. content: attr(data-text);
  18017. position: absolute;
  18018. top: 0;
  18019. left: 0;
  18020. width: 100%;
  18021. z-index: 1;
  18022. -webkit-transform: translateY(-50%);
  18023. transform: translateY(-50%);
  18024. }
  18025. .portfolio-creative .portfolio-box .portfolio-title::after {
  18026. content: attr(data-text);
  18027. position: absolute;
  18028. left: 0;
  18029. right: 0;
  18030. top: -20px;
  18031. font-size: 110px;
  18032. letter-spacing: -6px;
  18033. color: rgba(0, 0, 0, 0.1);
  18034. font-weight: 800;
  18035. white-space: nowrap;
  18036. text-align: center;
  18037. display: inline-block;
  18038. animation: glitch-skew 1s infinite linear alternate-reverse;
  18039. }
  18040. .portfolio-creative .portfolio-box .portfolio-hover span {
  18041. -webkit-transform: translateY(25px);
  18042. transform: translateY(25px);
  18043. }
  18044. .portfolio-creative .portfolio-box:hover .portfolio-image img {
  18045. opacity: 0;
  18046. }
  18047. .portfolio-creative .portfolio-box:hover .portfolio-title {
  18048. -webkit-transform: scale(1);
  18049. transform: scale(1);
  18050. }
  18051. .portfolio-creative .portfolio-box:hover .portfolio-hover span {
  18052. -webkit-transform: translateY(0);
  18053. transform: translateY(0);
  18054. }
  18055. /* Portfolio simple */
  18056. .portfolio-simple .portfolio-box .portfolio-icon a {
  18057. margin: 0 5px;
  18058. position: relative;
  18059. -webkit-transition-delay: 0.1s;
  18060. transition-delay: 0.1s;
  18061. -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
  18062. box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
  18063. }
  18064. .portfolio-simple .portfolio-box .portfolio-icon a:last-child {
  18065. -webkit-transition-delay: 0.2s;
  18066. transition-delay: 0.2s;
  18067. }
  18068. .portfolio-simple .portfolio-box:hover .portfolio-image img {
  18069. opacity: 0.5;
  18070. -webkit-transform: scale(1.1);
  18071. transform: scale(1.1);
  18072. }
  18073. /* Portfolio modern */
  18074. .portfolio-modern .portfolio-box {
  18075. position: relative;
  18076. will-change: transform;
  18077. }
  18078. .portfolio-modern .portfolio-box .portfolio-hover {
  18079. opacity: 0;
  18080. left: 20px;
  18081. bottom: 20px;
  18082. width: calc(100% - 40px);
  18083. height: auto;
  18084. top: inherit;
  18085. -webkit-transform: translateY(0) scale(1, 0);
  18086. transform: translateY(0) scale(1, 0);
  18087. transform-origin: bottom center;
  18088. }
  18089. .portfolio-modern .portfolio-box .portfolio-hover > * > * > * {
  18090. opacity: 0;
  18091. transition-delay: 0.25s;
  18092. transform: translateY(15px);
  18093. }
  18094. .portfolio-modern .portfolio-box .portfolio-hover > * > * > * + * {
  18095. opacity: 0;
  18096. transition-delay: 0.35s;
  18097. }
  18098. .portfolio-modern .portfolio-box .portfolio-hover > * > * + * {
  18099. opacity: 0;
  18100. transform: translateY(15px);
  18101. transition-delay: 0.45s;
  18102. }
  18103. .portfolio-modern .portfolio-box:hover {
  18104. opacity: 1;
  18105. -webkit-filter: blur(0);
  18106. filter: blur(0);
  18107. }
  18108. .portfolio-modern .portfolio-box:hover .portfolio-image img {
  18109. -webkit-transform: scale(1.1);
  18110. transform: scale(1.1);
  18111. }
  18112. .portfolio-modern .portfolio-box:hover .portfolio-hover {
  18113. -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
  18114. box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
  18115. -webkit-transform: translateY(0) scale(1, 1);
  18116. transform: translateY(0) scale(1, 1);
  18117. opacity: 1;
  18118. }
  18119. .portfolio-modern .portfolio-box:hover .portfolio-hover > * > * > * {
  18120. opacity: 1;
  18121. transform: translateY(0);
  18122. }
  18123. .portfolio-modern .portfolio-box:hover .portfolio-hover > * > * > * + * {
  18124. opacity: 1;
  18125. }
  18126. .portfolio-modern .portfolio-box:hover .portfolio-hover > * > * + * {
  18127. opacity: 1;
  18128. transform: translateY(0);
  18129. }
  18130. /* Portfolio attractive */
  18131. .portfolio-attractive .portfolio-link {
  18132. position: absolute;
  18133. left: 0;
  18134. top: 0;
  18135. width: 100%;
  18136. height: 100%;
  18137. content: "";
  18138. z-index: 9999;
  18139. cursor: pointer;
  18140. }
  18141. .portfolio-attractive .portfolio-box {
  18142. position: relative;
  18143. }
  18144. .portfolio-attractive .portfolio-box .portfolio-image img {
  18145. -webkit-transition: all 500ms cubic-bezier(0.37, 0, 0.63, 1);
  18146. transition: all 500ms cubic-bezier(0.37, 0, 0.63, 1);
  18147. }
  18148. .portfolio-attractive .portfolio-box .portfolio-hover .icon-box {
  18149. margin-top: 0px;
  18150. transform-style: inherit;
  18151. }
  18152. .portfolio-attractive .grid-item:hover .portfolio-hover {
  18153. opacity: 1;
  18154. }
  18155. .portfolio-attractive .grid-item:hover .portfolio-hover .icon-box {
  18156. margin-top: -10px;
  18157. }
  18158. .portfolio-attractive .grid-item:hover .portfolio-image img {
  18159. opacity: 0.3;
  18160. }
  18161. .portfolio-attractive .grid-item:hover .move-bottom-top-self span,
  18162. .portfolio-attractive .grid-item:hover .move-top-bottom-self span {
  18163. -webkit-transform: translateY(0);
  18164. transform: translateY(0);
  18165. opacity: 1;
  18166. }
  18167. /* Portfolio simple */
  18168. .portfolio-slider .portfolio-box {
  18169. -webkit-transform: translateY(0);
  18170. transform: translateY(0);
  18171. -webkit-transition: all 0.65s cubic-bezier(0.05, 0.2, 0.1, 1);
  18172. transition: all 0.65s cubic-bezier(0.05, 0.2, 0.1, 1);
  18173. }
  18174. .portfolio-slider .portfolio-box .portfolio-image img {
  18175. -webkit-transition: all 0.65s cubic-bezier(0.05, 0.2, 0.1, 1);
  18176. transition: all 0.65s cubic-bezier(0.05, 0.2, 0.1, 1);
  18177. }
  18178. .portfolio-slider .portfolio-box .portfolio-hover {
  18179. opacity: 1;
  18180. }
  18181. .portfolio-slider .portfolio-box .portfolio-hover .portfolio-link .category {
  18182. -webkit-transform: translateY(0);
  18183. transform: translateY(0);
  18184. opacity: 1;
  18185. visibility: visible;
  18186. }
  18187. .portfolio-slider .portfolio-box .portfolio-hover .portfolio-link i {
  18188. position: absolute;
  18189. right: 0;
  18190. will-change: transform;
  18191. -webkit-transform: translateY(0);
  18192. transform: translateY(0);
  18193. opacity: 0;
  18194. }
  18195. .portfolio-slider .portfolio-box:hover {
  18196. -webkit-transform: translateY(-5px);
  18197. transform: translateY(-5px);
  18198. }
  18199. .portfolio-slider .portfolio-box:hover .portfolio-image img {
  18200. opacity: 0.6;
  18201. -webkit-transform: scale(1.1);
  18202. transform: scale(1.1);
  18203. }
  18204. .portfolio-slider .portfolio-box:hover .portfolio-hover.dark-hover .portfolio-title {
  18205. color: var(--white) !important;
  18206. }
  18207. .portfolio-slider .portfolio-box:hover .portfolio-hover.dark-hover .portfolio-link a, .portfolio-slider .portfolio-box:hover .portfolio-hover.dark-hover .portfolio-link i, .portfolio-slider .portfolio-box:hover .portfolio-hover.dark-hover .portfolio-link span, .portfolio-slider .portfolio-box:hover .portfolio-hover.dark-hover .portfolio-link div {
  18208. color: var(--white) !important;
  18209. }
  18210. .portfolio-slider .portfolio-box:hover .portfolio-hover.light-hover .portfolio-title {
  18211. color: var(--dark-gray) !important;
  18212. }
  18213. .portfolio-slider .portfolio-box:hover .portfolio-hover.light-hover .portfolio-link a, .portfolio-slider .portfolio-box:hover .portfolio-hover.light-hover .portfolio-link i, .portfolio-slider .portfolio-box:hover .portfolio-hover.light-hover .portfolio-link span, .portfolio-slider .portfolio-box:hover .portfolio-hover.light-hover .portfolio-link div {
  18214. color: var(--dark-gray) !important;
  18215. }
  18216. .portfolio-slider .portfolio-box:hover .portfolio-hover .portfolio-link .category {
  18217. -webkit-transform: translateY(-20px);
  18218. transform: translateY(-20px);
  18219. opacity: 0;
  18220. visibility: hidden;
  18221. }
  18222. .portfolio-slider .portfolio-box:hover .portfolio-hover .portfolio-link i {
  18223. -webkit-transform: translateY(-28px);
  18224. transform: translateY(-28px);
  18225. opacity: 1;
  18226. }
  18227. .portfolio-slider .portfolio-box:hover .portfolio-hover .box-overlay {
  18228. opacity: 1;
  18229. visibility: visible;
  18230. }
  18231. /* Portfolio clean */
  18232. .portfolio-clean .portfolio-box {
  18233. position: relative;
  18234. }
  18235. .portfolio-clean .portfolio-box .portfolio-image {
  18236. -webkit-clip-path: inset(0 0 0 0);
  18237. clip-path: inset(0 0 0 0);
  18238. -webkit-transition: all 600ms cubic-bezier(0.37, 0, 0.63, 1);
  18239. transition: all 600ms cubic-bezier(0.37, 0, 0.63, 1);
  18240. }
  18241. .portfolio-clean .portfolio-box .portfolio-hover {
  18242. -webkit-transform: translateY(35px);
  18243. transform: translateY(35px);
  18244. -webkit-transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  18245. transition: all 400ms cubic-bezier(0.37, 0, 0.63, 1);
  18246. }
  18247. .portfolio-clean .portfolio-box .portfolio-hover .portfolio-title {
  18248. -webkit-box-flex: 1;
  18249. -ms-flex: 1;
  18250. flex: 1;
  18251. }
  18252. .portfolio-clean .portfolio-box:hover .portfolio-image {
  18253. -webkit-clip-path: inset(0 0 70px 0);
  18254. clip-path: inset(0 0 70px 0);
  18255. }
  18256. .portfolio-clean .portfolio-box:hover .portfolio-image img {
  18257. -webkit-transform: translateY(-40px);
  18258. transform: translateY(-40px);
  18259. }
  18260. .portfolio-clean .portfolio-box:hover .portfolio-hover {
  18261. -webkit-transform: translateY(0);
  18262. transform: translateY(0);
  18263. -webkit-transition: all 600ms cubic-bezier(0.37, 0, 0.63, 1);
  18264. transition: all 600ms cubic-bezier(0.37, 0, 0.63, 1);
  18265. }
  18266. /* Portfolio clean */
  18267. .portfolio-switch-image .portfolio-box .portfolio-image .hover-switch-image {
  18268. position: absolute;
  18269. top: 0;
  18270. left: 0;
  18271. width: 100%;
  18272. height: 100%;
  18273. opacity: 0;
  18274. -webkit-transform: scale3d(1.1, 1.1, 1.1);
  18275. transform: scale3d(1.1, 1.1, 1.1);
  18276. }
  18277. .portfolio-switch-image .portfolio-box:hover {
  18278. -webkit-transform: translateY(-5px);
  18279. transform: translateY(-5px);
  18280. }
  18281. .portfolio-switch-image .portfolio-box:hover .portfolio-image .hover-switch-image {
  18282. opacity: 1;
  18283. -webkit-transform: scale3d(1, 1, 1);
  18284. transform: scale3d(1, 1, 1);
  18285. }
  18286. /* Portfolio and gallery translate animation */
  18287. .portfolio-box, .gallery-box {
  18288. overflow: hidden;
  18289. will-change: transform;
  18290. }
  18291. .portfolio-box .move-top-bottom, .gallery-box .move-top-bottom {
  18292. -webkit-transform: translateY(-15px);
  18293. transform: translateY(-15px);
  18294. opacity: 0;
  18295. }
  18296. .portfolio-box .move-bottom-top, .gallery-box .move-bottom-top {
  18297. -webkit-transform: translateY(15px);
  18298. transform: translateY(15px);
  18299. opacity: 0;
  18300. }
  18301. .portfolio-box .move-left-right, .gallery-box .move-left-right {
  18302. -webkit-transform: translateX(-15px);
  18303. transform: translateX(-15px);
  18304. opacity: 0;
  18305. }
  18306. .portfolio-box .move-right-left, .gallery-box .move-right-left {
  18307. -webkit-transform: translateX(15px);
  18308. transform: translateX(15px);
  18309. opacity: 0;
  18310. }
  18311. .portfolio-box .move-bottom-top-self, .gallery-box .move-bottom-top-self {
  18312. overflow: hidden;
  18313. }
  18314. .portfolio-box .move-bottom-top-self span, .gallery-box .move-bottom-top-self span {
  18315. opacity: 0;
  18316. display: block;
  18317. will-change: transform;
  18318. -webkit-transform: translateY(50%);
  18319. transform: translateY(50%);
  18320. -webkit-transition: all 0.5s cubic-bezier(0.37, 0.31, 0.2, 0.85);
  18321. transition: all 0.5s cubic-bezier(0.37, 0.31, 0.2, 0.85);
  18322. }
  18323. .portfolio-box .move-top-bottom-self, .gallery-box .move-top-bottom-self {
  18324. overflow: hidden;
  18325. }
  18326. .portfolio-box .move-top-bottom-self span, .gallery-box .move-top-bottom-self span {
  18327. opacity: 0;
  18328. display: block;
  18329. will-change: transform;
  18330. -webkit-transform: translateY(-50%);
  18331. transform: translateY(-50%);
  18332. -webkit-transition: all 0.5s cubic-bezier(0.37, 0.31, 0.2, 0.85);
  18333. transition: all 0.5s cubic-bezier(0.37, 0.31, 0.2, 0.85);
  18334. }
  18335. .portfolio-box .move-left-right-self, .gallery-box .move-left-right-self {
  18336. overflow: hidden;
  18337. }
  18338. .portfolio-box .move-left-right-self span, .gallery-box .move-left-right-self span {
  18339. opacity: 0;
  18340. display: block;
  18341. will-change: transform;
  18342. -webkit-transform: translateX(-50%);
  18343. transform: translateX(-50%);
  18344. -webkit-transition: all 0.5s cubic-bezier(0.37, 0.31, 0.2, 0.85);
  18345. transition: all 0.5s cubic-bezier(0.37, 0.31, 0.2, 0.85);
  18346. }
  18347. .portfolio-box .move-right-left-self, .gallery-box .move-right-left-self {
  18348. overflow: hidden;
  18349. }
  18350. .portfolio-box .move-right-left-self span, .gallery-box .move-right-left-self span {
  18351. opacity: 0;
  18352. display: block;
  18353. will-change: transform;
  18354. -webkit-transform: translateX(50%);
  18355. transform: translateX(50%);
  18356. -webkit-transition: all 0.5s cubic-bezier(0.37, 0.31, 0.2, 0.85);
  18357. transition: all 0.5s cubic-bezier(0.37, 0.31, 0.2, 0.85);
  18358. }
  18359. .portfolio-box .portfolio-hover, .gallery-box .portfolio-hover {
  18360. position: absolute;
  18361. width: 100%;
  18362. height: 100%;
  18363. left: 0;
  18364. top: 0;
  18365. opacity: 0;
  18366. }
  18367. .portfolio-box .portfolio-image, .gallery-box .portfolio-image {
  18368. position: relative;
  18369. overflow: hidden;
  18370. }
  18371. .portfolio-box:hover .move-top-bottom, .gallery-box:hover .move-top-bottom {
  18372. -webkit-transform: translateY(0);
  18373. transform: translateY(0);
  18374. opacity: 1;
  18375. }
  18376. .portfolio-box:hover .move-bottom-top, .gallery-box:hover .move-bottom-top {
  18377. -webkit-transform: translateY(0);
  18378. transform: translateY(0);
  18379. opacity: 1;
  18380. }
  18381. .portfolio-box:hover .move-left-right, .gallery-box:hover .move-left-right {
  18382. -webkit-transform: translateX(0);
  18383. transform: translateX(0);
  18384. opacity: 1;
  18385. }
  18386. .portfolio-box:hover .move-right-left, .gallery-box:hover .move-right-left {
  18387. -webkit-transform: translateX(0);
  18388. transform: translateX(0);
  18389. opacity: 1;
  18390. }
  18391. .portfolio-box:hover .move-bottom-top-self span, .gallery-box:hover .move-bottom-top-self span {
  18392. -webkit-transform: translateY(0);
  18393. transform: translateY(0);
  18394. opacity: 1;
  18395. }
  18396. .portfolio-box:hover .move-top-bottom-self span, .gallery-box:hover .move-top-bottom-self span {
  18397. opacity: 1;
  18398. -webkit-transform: translateY(0);
  18399. transform: translateY(0);
  18400. }
  18401. .portfolio-box:hover .move-left-right-self span, .gallery-box:hover .move-left-right-self span {
  18402. -webkit-transform: translateX(0);
  18403. transform: translateX(0);
  18404. opacity: 1;
  18405. }
  18406. .portfolio-box:hover .move-right-left-self span, .gallery-box:hover .move-right-left-self span {
  18407. opacity: 1;
  18408. -webkit-transform: translateX(0);
  18409. transform: translateX(0);
  18410. }
  18411. .portfolio-box:hover .portfolio-hover, .gallery-box:hover .portfolio-hover {
  18412. opacity: 1;
  18413. }
  18414. /* Portfolio pagination */
  18415. .portfolio-pagination {
  18416. position: relative;
  18417. z-index: 1;
  18418. }
  18419. .portfolio-pagination .bg-fancy-image {
  18420. position: absolute;
  18421. top: 0;
  18422. left: 0;
  18423. opacity: 0;
  18424. height: 100%;
  18425. width: 100%;
  18426. z-index: -1;
  18427. visibility: hidden;
  18428. background-size: cover;
  18429. -webkit-transition: 0.5s;
  18430. transition: 0.5s;
  18431. }
  18432. .portfolio-pagination .btn-slide-icon-left .separator, .portfolio-pagination .btn-slide-icon-right .separator {
  18433. position: relative;
  18434. -webkit-transition: 0.5s;
  18435. transition: 0.5s;
  18436. }
  18437. .portfolio-pagination .btn-slide-icon-left .separator:after, .portfolio-pagination .btn-slide-icon-left .separator:before, .portfolio-pagination .btn-slide-icon-right .separator:after, .portfolio-pagination .btn-slide-icon-right .separator:before {
  18438. content: "";
  18439. display: block;
  18440. position: absolute;
  18441. left: -2px;
  18442. top: -4px;
  18443. height: 2px;
  18444. width: 11px;
  18445. background-color: var(--dark-gray);
  18446. -webkit-transition: 0.5s;
  18447. transition: 0.5s;
  18448. }
  18449. .portfolio-pagination .btn-slide-icon-left .separator:after, .portfolio-pagination .btn-slide-icon-right .separator:after {
  18450. -webkit-transform: rotate(132deg);
  18451. transform: rotate(132deg);
  18452. }
  18453. .portfolio-pagination .btn-slide-icon-left .separator:before, .portfolio-pagination .btn-slide-icon-right .separator:before {
  18454. -webkit-transform: rotate(228deg);
  18455. transform: rotate(228deg);
  18456. top: 4px !important;
  18457. }
  18458. .portfolio-pagination .btn-slide-icon-right .separator:after, .portfolio-pagination .btn-slide-icon-right .separator:before {
  18459. right: -2px;
  18460. left: auto;
  18461. }
  18462. .portfolio-pagination .btn-slide-icon-right .separator:before {
  18463. transform: rotate(132deg);
  18464. -webkit-transform: rotate(132deg);
  18465. transform: rotate(132deg);
  18466. }
  18467. .portfolio-pagination .btn-slide-icon-right .separator:after {
  18468. transform: rotate(48deg);
  18469. -webkit-transform: rotate(48deg);
  18470. transform: rotate(48deg);
  18471. }
  18472. .portfolio-pagination h6, .portfolio-pagination span {
  18473. -webkit-transition: 0.2s;
  18474. transition: 0.2s;
  18475. }
  18476. .portfolio-pagination:hover .bg-fancy-image {
  18477. opacity: 1;
  18478. visibility: visible;
  18479. }
  18480. .portfolio-pagination:hover .separator {
  18481. width: 100px !important;
  18482. background-color: var(--white);
  18483. }
  18484. .portfolio-pagination:hover .separator:after {
  18485. color: var(--white);
  18486. }
  18487. .portfolio-pagination:hover span {
  18488. color: var(--white);
  18489. }
  18490. .portfolio-pagination:hover .btn-slide-icon-left .separator:after, .portfolio-pagination:hover .btn-slide-icon-left .separator:before, .portfolio-pagination:hover .btn-slide-icon-right .separator:after, .portfolio-pagination:hover .btn-slide-icon-right .separator:before {
  18491. background-color: var(--white);
  18492. }
  18493. /* Grid loading */
  18494. @keyframes spin {
  18495. to {
  18496. -webkit-transform: rotate(360deg);
  18497. -ms-transform: rotate(360deg);
  18498. transform: rotate(360deg);
  18499. }
  18500. }
  18501. .grid-loading {
  18502. overflow: hidden;
  18503. position: relative;
  18504. opacity: 1 !important;
  18505. transition: all 0s ease-in-out !important;
  18506. -webkit-transition: all 0s ease-in-out !important;
  18507. z-index: 99;
  18508. }
  18509. .grid-loading::after {
  18510. background: none;
  18511. content: "" !important;
  18512. position: absolute;
  18513. top: 100px !important;
  18514. left: calc(50% - 25px) !important;
  18515. width: 50px !important;
  18516. height: 50px !important;
  18517. opacity: 1 !important;
  18518. right: inherit !important;
  18519. z-index: 9;
  18520. text-align: center;
  18521. border: 3px solid rgba(23, 23, 23, 0.2);
  18522. border-top-color: rgba(23, 23, 23, 0.7);
  18523. border-radius: 50%;
  18524. animation: spin 1s linear infinite;
  18525. -webkit-animation: spin 1s linear infinite;
  18526. }
  18527. .grid-loading:before {
  18528. content: "";
  18529. position: absolute;
  18530. right: 2px;
  18531. top: 1px;
  18532. width: calc(100% - 4px);
  18533. height: calc(100% - 2px);
  18534. border-radius: inherit;
  18535. z-index: 1;
  18536. }
  18537. .grid-loading.grid-loading-white::after {
  18538. border: 3px solid rgba(255, 255, 255, 0.2);
  18539. border-top-color: rgba(255, 255, 255, 0.7);
  18540. }
  18541. .grid-loading .grid-item {
  18542. visibility: hidden;
  18543. }
  18544. .grid-loading li .grid-item {
  18545. overflow: hidden;
  18546. opacity: 0;
  18547. }
  18548. /* Portfolio minimal */
  18549. .sticky-image-distortion-wrapper {
  18550. position: static;
  18551. display: flex;
  18552. height: 100%;
  18553. overflow: hidden;
  18554. width: 100%;
  18555. }
  18556. .sticky-image-distortion-wrapper .svg-wrapper {
  18557. position: fixed;
  18558. right: 55px;
  18559. height: 100%;
  18560. top: 0;
  18561. width: 50%;
  18562. z-index: -1;
  18563. }
  18564. .sticky-image-distortion-wrapper .menu {
  18565. width: 50%;
  18566. -ms-overflow-style: none;
  18567. scrollbar-width: none;
  18568. overflow-y: scroll;
  18569. overflow-x: hidden;
  18570. padding: 100px 0 100px 100px;
  18571. }
  18572. .sticky-image-distortion-wrapper .menu::-webkit-scrollbar {
  18573. display: none;
  18574. }
  18575. .sticky-image-distortion-wrapper .menu .menu__link {
  18576. display: flex;
  18577. align-items: center;
  18578. width: 100%;
  18579. }
  18580. .sticky-image-distortion-wrapper .menu .menu__link .sticky-image-title a:hover {
  18581. opacity: 1 !important;
  18582. }
  18583. .sticky-image-distortion-wrapper .menu .menu__link svg {
  18584. opacity: 0;
  18585. visibility: hidden;
  18586. -webkit-transition: 0.3s;
  18587. transition: 0.3s;
  18588. width: 100%;
  18589. height: 100%;
  18590. }
  18591. .sticky-image-distortion-wrapper .menu .menu__link.active svg {
  18592. opacity: 1;
  18593. visibility: visible;
  18594. }
  18595. .sticky-image-distortion-wrapper .menu .menu__link.active .sticky-image-title a {
  18596. padding-left: 70px;
  18597. -webkit-transition: 0.5s;
  18598. transition: 0.5s;
  18599. }
  18600. .sticky-image-distortion-wrapper .menu .menu__link.active .sticky-image-title .title {
  18601. opacity: 0.25;
  18602. left: 95px;
  18603. }
  18604. .sticky-image-distortion-wrapper .menu .menu__link.active .sticky-category {
  18605. opacity: 1;
  18606. color: var(--dark-gray);
  18607. left: 25px;
  18608. }
  18609. .sticky-image-distortion-wrapper .menu:hover .menu__link .sticky-image-title a {
  18610. opacity: 0.3;
  18611. }
  18612. .sticky-image-title {
  18613. position: relative;
  18614. display: flex;
  18615. -webkit-transition: 0.3s;
  18616. transition: 0.3s;
  18617. padding: 0;
  18618. width: 100%;
  18619. }
  18620. .sticky-image-title a {
  18621. padding: 25px 50px 25px;
  18622. width: 100%;
  18623. }
  18624. .sticky-image-title .title {
  18625. position: absolute;
  18626. left: 100px;
  18627. width: 100%;
  18628. top: 45%;
  18629. -webkit-transform: translateY(-50%);
  18630. transform: translateY(-50%);
  18631. word-break: normal;
  18632. z-index: -1;
  18633. opacity: 0;
  18634. -webkit-transition: 0.3s;
  18635. transition: 0.3s;
  18636. }
  18637. .sticky-category {
  18638. display: flex;
  18639. align-items: center;
  18640. position: absolute;
  18641. left: 32px;
  18642. height: 100%;
  18643. width: 50px;
  18644. justify-content: center;
  18645. top: 0;
  18646. opacity: 0;
  18647. -webkit-transition: 0.3s;
  18648. transition: 0.3s;
  18649. }
  18650. .sticky-category .category {
  18651. -webkit-transform: rotate(180deg);
  18652. transform: rotate(180deg);
  18653. writing-mode: vertical-lr;
  18654. }
  18655. /* Horizontal portfolio */
  18656. .threeD-letter-menu {
  18657. position: relative;
  18658. min-height: 100vh;
  18659. }
  18660. .threeD-letter-menu .menu-item .hover-reveal {
  18661. position: fixed;
  18662. z-index: 1;
  18663. width: 420px;
  18664. height: 420px;
  18665. top: 0;
  18666. left: 0;
  18667. pointer-events: none;
  18668. opacity: 0;
  18669. transform-origin: 100% 0%;
  18670. will-change: transform, filter;
  18671. border-radius: 100%;
  18672. }
  18673. .threeD-letter-menu .menu-item .hover-reveal .hover-reveal__inner {
  18674. width: 100%;
  18675. height: 100%;
  18676. position: relative;
  18677. overflow: hidden;
  18678. border-radius: 100%;
  18679. }
  18680. .threeD-letter-menu .menu-item .hover-reveal .hover-reveal__img {
  18681. height: 100%;
  18682. width: 100%;
  18683. background-size: cover;
  18684. background-position: 50% 50%;
  18685. will-change: transform;
  18686. border-radius: 100%;
  18687. }
  18688. .threeD-letter-menu .menu-item .text-white-linear:hover span {
  18689. color: var(--white);
  18690. -webkit-text-fill-color: #fff;
  18691. }
  18692. .threeD-letter-menu .menu-item .menu-item-text {
  18693. position: relative;
  18694. display: inline-block;
  18695. }
  18696. .threeD-letter-menu .menu-item .menu-item-text .word {
  18697. overflow: hidden;
  18698. line-height: 120%;
  18699. }
  18700. .threeD-letter-menu .menu-item .menu-item-text .words .char {
  18701. transition: 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);
  18702. }
  18703. .threeD-letter-menu .menu-item .menu-item-text .clone {
  18704. position: absolute;
  18705. top: 0;
  18706. left: 0;
  18707. }
  18708. .threeD-letter-menu .menu-item .menu-item-text .clone .char {
  18709. -webkit-transform: translateY(-100px);
  18710. transform: translateY(-100px);
  18711. opacity: 0;
  18712. }
  18713. .threeD-letter-menu .menu-item .menu-item-text:hover .clone .char {
  18714. -webkit-transform: translateY(0);
  18715. transform: translateY(0);
  18716. opacity: 1;
  18717. }
  18718. .threeD-letter-menu .menu-item .menu-item-text:hover .words:not(.clone) .char {
  18719. -webkit-transform: translateY(100px);
  18720. transform: translateY(100px);
  18721. opacity: 0;
  18722. }
  18723. /* ===================================
  18724. 16. Shop
  18725. ====================================== */
  18726. /* Categories style 01 */
  18727. .categories-style-01 .categories-box {
  18728. display: -webkit-box;
  18729. display: -ms-flexbox;
  18730. display: flex;
  18731. -webkit-box-align: center;
  18732. -ms-flex-align: center;
  18733. align-items: center;
  18734. -webkit-box-pack: center;
  18735. -ms-flex-pack: center;
  18736. justify-content: center;
  18737. -webkit-box-orient: vertical;
  18738. -webkit-box-direction: normal;
  18739. -ms-flex-direction: column;
  18740. flex-direction: column;
  18741. text-align: center;
  18742. position: relative;
  18743. z-index: 1;
  18744. -webkit-transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  18745. transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  18746. -webkit-backface-visibility: hidden;
  18747. backface-visibility: hidden;
  18748. }
  18749. .categories-style-01 a {
  18750. position: relative;
  18751. }
  18752. .categories-style-01 a:last-child:after {
  18753. content: "";
  18754. position: absolute;
  18755. border-bottom: 2px solid;
  18756. border-color: var(--dark-gray);
  18757. left: 0;
  18758. bottom: 0;
  18759. width: 0%;
  18760. -webkit-transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  18761. transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  18762. }
  18763. .categories-style-01 .count-circle {
  18764. position: absolute;
  18765. top: -15px;
  18766. right: -10px;
  18767. opacity: 0;
  18768. -webkit-transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  18769. transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  18770. -webkit-transform: scale(0.8);
  18771. transform: scale(0.8);
  18772. }
  18773. .categories-style-01:hover .categories-box {
  18774. -webkit-transform: translate3d(0, -7px, 0);
  18775. transform: translate3d(0, -7px, 0);
  18776. }
  18777. .categories-style-01:hover a:last-child:after {
  18778. border-color: var(--dark-gray);
  18779. color: var(--dark-gray);
  18780. width: 100%;
  18781. }
  18782. .categories-style-01:hover .count-circle {
  18783. opacity: 1;
  18784. -webkit-transform: scale(1.1);
  18785. transform: scale(1.1);
  18786. }
  18787. .categories-style-01:hover img {
  18788. opacity: 0.6;
  18789. }
  18790. /* Categories style 02 */
  18791. .categories-style-02 {
  18792. -webkit-transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  18793. transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  18794. }
  18795. .categories-style-02 .categories-box {
  18796. position: relative;
  18797. }
  18798. .categories-style-02:hover {
  18799. transform: translate3d(0, -8px, 0);
  18800. }
  18801. /* Categories style 03 */
  18802. .categories-style-03 .categories-box {
  18803. position: relative;
  18804. -webkit-transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  18805. transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  18806. }
  18807. .categories-style-03 .categories-box .category-title {
  18808. position: absolute;
  18809. left: 0;
  18810. bottom: 0;
  18811. padding: 30px;
  18812. width: 100%;
  18813. }
  18814. .categories-style-03 .categories-box .category-image {
  18815. -webkit-transform: scale(1);
  18816. transform: scale(1);
  18817. -webkit-transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  18818. transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  18819. }
  18820. .categories-style-03 .categories-box:hover {
  18821. -webkit-transform: scale(1.05);
  18822. transform: scale(1.05);
  18823. }
  18824. .categories-style-03 .categories-box:hover .category-image {
  18825. -webkit-transform: scale(1.1);
  18826. transform: scale(1.1);
  18827. }
  18828. /* Shop boxed */
  18829. .shop-boxed {
  18830. margin-left: -10px;
  18831. margin-right: -10px;
  18832. }
  18833. .shop-boxed .shop-box {
  18834. border: 6px solid #fff;
  18835. -webkit-transition-duration: 0.4s;
  18836. transition-duration: 0.4s;
  18837. }
  18838. .shop-boxed .shop-box .shop-image {
  18839. overflow: hidden;
  18840. }
  18841. .shop-boxed .shop-box .shop-image a {
  18842. display: block;
  18843. overflow: hidden;
  18844. }
  18845. .shop-boxed .shop-box .shop-image .product-overlay {
  18846. position: absolute;
  18847. left: 0;
  18848. top: 0;
  18849. width: 100%;
  18850. height: 100%;
  18851. opacity: 0;
  18852. -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  18853. transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  18854. }
  18855. .shop-boxed .shop-box .shop-image .shop-hover {
  18856. position: absolute;
  18857. bottom: 0px;
  18858. width: 100%;
  18859. -webkit-transition-duration: 0.3s;
  18860. transition-duration: 0.3s;
  18861. }
  18862. .shop-boxed .shop-box .shop-image .shop-hover a {
  18863. -webkit-transform: translateY(15px);
  18864. transform: translateY(15px);
  18865. opacity: 0;
  18866. }
  18867. .shop-boxed .shop-box .shop-footer del {
  18868. margin-right: 8px;
  18869. }
  18870. .shop-boxed .shop-box:hover {
  18871. -webkit-box-shadow: 0 0 50px rgba(0, 0, 0, 0.08);
  18872. box-shadow: 0 0 50px rgba(0, 0, 0, 0.08);
  18873. border: 6px solid #fff;
  18874. }
  18875. .shop-boxed .shop-box:hover .shop-image .product-overlay {
  18876. opacity: 1;
  18877. }
  18878. .shop-boxed .shop-box:hover .shop-image .shop-hover {
  18879. bottom: 25px;
  18880. }
  18881. .shop-boxed .shop-box:hover .shop-image .shop-hover a {
  18882. -webkit-transform: translateY(0px);
  18883. transform: translateY(0px);
  18884. -webkit-transition-delay: 0.1s;
  18885. transition-delay: 0.1s;
  18886. opacity: 1;
  18887. }
  18888. .shop-boxed .shop-box:hover .shop-image .shop-hover a:nth-child(2) {
  18889. -webkit-transition-delay: 0.2s;
  18890. transition-delay: 0.2s;
  18891. }
  18892. .shop-boxed .shop-box:hover .shop-image .shop-hover a:nth-child(3) {
  18893. -webkit-transition-delay: 0.3s;
  18894. transition-delay: 0.3s;
  18895. }
  18896. .shop-boxed .shop-box:hover .shop-image .shop-hover a:nth-child(4) {
  18897. -webkit-transition-delay: 0.4s;
  18898. transition-delay: 0.4s;
  18899. }
  18900. /* Shop modern */
  18901. .shop-modern {
  18902. margin-left: -15px;
  18903. margin-right: -15px;
  18904. }
  18905. .shop-modern .grid-item .shop-box .shop-image {
  18906. overflow: hidden;
  18907. }
  18908. .shop-modern .grid-item .shop-box .shop-image img {
  18909. -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  18910. transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  18911. }
  18912. .shop-modern .grid-item .shop-box .shop-image .shop-overlay {
  18913. position: absolute;
  18914. left: 0;
  18915. top: 0;
  18916. width: 100%;
  18917. height: 100%;
  18918. opacity: 0;
  18919. -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  18920. transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  18921. }
  18922. .shop-modern .grid-item .shop-box .shop-image .shop-hover {
  18923. position: absolute;
  18924. top: 20px;
  18925. width: auto;
  18926. right: 12px;
  18927. opacity: 0;
  18928. -webkit-transition-duration: 0.3s;
  18929. transition-duration: 0.3s;
  18930. }
  18931. .shop-modern .grid-item .shop-box .shop-image .shop-hover ul {
  18932. padding: 0;
  18933. }
  18934. .shop-modern .grid-item .shop-box .shop-image .shop-hover ul li {
  18935. display: block;
  18936. width: auto;
  18937. margin: 0 0 8px;
  18938. padding: 0;
  18939. -webkit-transform: translateY(20px);
  18940. transform: translateY(20px);
  18941. -webkit-transition-duration: 0.3s;
  18942. transition-duration: 0.3s;
  18943. }
  18944. .shop-modern .grid-item .shop-box .shop-image .shop-hover ul li:nth-child(1) {
  18945. -webkit-transition-delay: 25ms;
  18946. transition-delay: 25ms;
  18947. }
  18948. .shop-modern .grid-item .shop-box .shop-image .shop-hover ul li:nth-child(2) {
  18949. -webkit-transition-delay: 50ms;
  18950. transition-delay: 50ms;
  18951. }
  18952. .shop-modern .grid-item .shop-box .shop-image .shop-hover ul li:nth-child(3) {
  18953. -webkit-transition-delay: 75ms;
  18954. transition-delay: 75ms;
  18955. }
  18956. .shop-modern .grid-item .shop-box .shop-image .shop-hover ul li :nth-child(4) {
  18957. -webkit-transition-delay: 1ms;
  18958. transition-delay: 1ms;
  18959. }
  18960. .shop-modern .grid-item .shop-box .shop-image .shop-hover ul li a:hover {
  18961. background-color: var(--base-color);
  18962. }
  18963. .shop-modern .grid-item .shop-box .shop-image .shop-buttons-wrap {
  18964. position: absolute;
  18965. left: 20px;
  18966. bottom: 20px;
  18967. width: calc(100% - 40px);
  18968. text-align: center;
  18969. }
  18970. .shop-modern .grid-item .shop-box .shop-image .shop-buttons-wrap .btn {
  18971. opacity: 0;
  18972. visibility: hidden;
  18973. width: 100%;
  18974. -webkit-transform: translateY(10px);
  18975. transform: translateY(10px);
  18976. -webkit-transition: all 0.3s ease-in-out;
  18977. transition: all 0.3s ease-in-out;
  18978. }
  18979. .shop-modern .grid-item .shop-box .shop-image .shop-buttons-wrap .btn.btn-large {
  18980. padding: 8px 20px;
  18981. }
  18982. .shop-modern .grid-item .shop-box .shop-footer del {
  18983. margin-right: 8px;
  18984. }
  18985. .shop-modern .grid-item .shop-box:hover .shop-image img {
  18986. -webkit-transform: scale(1.05);
  18987. transform: scale(1.05);
  18988. }
  18989. .shop-modern .grid-item .shop-box:hover .shop-image .shop-buttons-wrap .btn {
  18990. -webkit-transform: translateY(0px);
  18991. transform: translateY(0px);
  18992. opacity: 1;
  18993. visibility: visible;
  18994. }
  18995. .shop-modern .grid-item .shop-box:hover .shop-image .shop-overlay {
  18996. opacity: 1;
  18997. }
  18998. .shop-modern .grid-item .shop-box:hover .shop-image .shop-hover {
  18999. opacity: 1;
  19000. top: 20px;
  19001. }
  19002. .shop-modern .grid-item .shop-box:hover .shop-image .shop-hover ul li {
  19003. -webkit-transform: translateY(0px);
  19004. transform: translateY(0px);
  19005. }
  19006. /* Shop sidebar */
  19007. .shop-sidebar .shop-filter {
  19008. padding: 0;
  19009. margin: 0;
  19010. list-style: none;
  19011. }
  19012. .shop-sidebar .shop-filter li {
  19013. position: relative;
  19014. margin-bottom: 2px;
  19015. padding: 0 25px;
  19016. }
  19017. .shop-sidebar .shop-filter li a {
  19018. display: block;
  19019. }
  19020. .shop-sidebar .shop-filter li a:hover .product-cb {
  19021. border-color: var(--dark-gray);
  19022. }
  19023. .shop-sidebar .shop-filter li a:hover .product-cb:after {
  19024. opacity: 1;
  19025. }
  19026. .shop-sidebar .shop-filter li .product-cb {
  19027. width: 16px;
  19028. height: 16px;
  19029. border: 1px solid var(--medium-gray);
  19030. display: inline-block;
  19031. border-radius: 100%;
  19032. position: absolute;
  19033. left: 0;
  19034. top: 8px;
  19035. }
  19036. .shop-sidebar .shop-filter li .product-cb:after {
  19037. width: 8px;
  19038. height: 8px;
  19039. background-color: var(--dark-gray);
  19040. border-radius: 100%;
  19041. content: "";
  19042. position: absolute;
  19043. left: 50%;
  19044. top: 50%;
  19045. opacity: 0;
  19046. -webkit-transition: 0.4s;
  19047. transition: 0.4s;
  19048. -webkit-transform: translate(-50%, -50%);
  19049. transform: translate(-50%, -50%);
  19050. }
  19051. .shop-sidebar .shop-filter li .item-qty {
  19052. position: absolute;
  19053. right: 0;
  19054. top: 0;
  19055. background: var(--very-light-gray);
  19056. border-radius: 100%;
  19057. height: 30px;
  19058. width: 30px;
  19059. font-size: 11px;
  19060. text-align: center;
  19061. font-weight: 500;
  19062. color: var(--dark-gray);
  19063. line-height: 30px;
  19064. }
  19065. .shop-sidebar .shop-filter li:last-child {
  19066. margin-bottom: 0;
  19067. }
  19068. .shop-sidebar .shop-filter.color-filter li .product-cb {
  19069. border: 0;
  19070. }
  19071. .shop-sidebar .shop-filter.color-filter li .product-cb:after {
  19072. background-color: var(--white);
  19073. }
  19074. .shop-sidebar .shop-filter.fabric-filter li .product-cb {
  19075. line-height: 0;
  19076. overflow: hidden;
  19077. border: 0;
  19078. }
  19079. .shop-sidebar .shop-filter.fabric-filter li .product-cb:after {
  19080. background-color: var(--white);
  19081. }
  19082. .shop-sidebar .shop-filter.rating-filter li {
  19083. padding-left: 0;
  19084. }
  19085. .shop-sidebar .shop-filter.tag-cloud a {
  19086. padding: 5px 10px;
  19087. }
  19088. /* Toolbar wrapper */
  19089. .toolbar-wrapper a img {
  19090. -webkit-transition: 0.3s;
  19091. transition: 0.3s;
  19092. }
  19093. .toolbar-wrapper a:hover img {
  19094. opacity: 1;
  19095. }
  19096. /* Shop lable */
  19097. .shop-image {
  19098. position: relative;
  19099. }
  19100. .shop-image .lable {
  19101. padding: 0 8px;
  19102. position: absolute;
  19103. left: 17px;
  19104. top: 17px;
  19105. color: var(--white);
  19106. font-size: 9px;
  19107. line-height: 21px;
  19108. border-radius: 2px;
  19109. text-transform: uppercase;
  19110. font-weight: 700;
  19111. }
  19112. .shop-image .lable.new {
  19113. background-color: var(--green);
  19114. }
  19115. .shop-image .lable.hot {
  19116. background-color: var(--red);
  19117. }
  19118. /* Product detail */
  19119. .product-image-thumb .swiper-slide {
  19120. cursor: pointer;
  19121. border: 1px solid transparent;
  19122. }
  19123. .product-image-thumb .swiper-slide.swiper-slide-thumb-active {
  19124. border-color: var(--light-gray);
  19125. }
  19126. /* Single product thumb vertical */
  19127. .single-product-thumb .slider-vertical {
  19128. width: 100%;
  19129. height: 100%;
  19130. position: absolute;
  19131. left: 15px;
  19132. }
  19133. .single-product-thumb .slider-vertical .swiper-slide {
  19134. height: auto !important;
  19135. cursor: pointer;
  19136. }
  19137. .product-image-slider img {
  19138. cursor: crosshair;
  19139. }
  19140. /* Shop color */
  19141. .shop-color {
  19142. list-style: none;
  19143. padding: 0;
  19144. display: flex;
  19145. }
  19146. .shop-color li {
  19147. position: relative;
  19148. display: inline-block;
  19149. vertical-align: middle;
  19150. }
  19151. .shop-color li > input[type=radio] + label {
  19152. display: flex;
  19153. }
  19154. .shop-color li > input[type=radio] + label span {
  19155. height: 32px;
  19156. width: 32px;
  19157. border-radius: 100%;
  19158. margin-right: 6px;
  19159. display: inline-block;
  19160. position: relative;
  19161. vertical-align: middle;
  19162. cursor: pointer;
  19163. }
  19164. .shop-color li input[type=radio]:checked + label span:after {
  19165. position: absolute;
  19166. top: 2px;
  19167. left: 2px;
  19168. color: var(--white);
  19169. height: 28px;
  19170. width: 28px;
  19171. border: 2px solid var(--white);
  19172. border-radius: 100%;
  19173. text-align: center;
  19174. content: "";
  19175. font-weight: 900;
  19176. }
  19177. /* Shop size */
  19178. .shop-size {
  19179. list-style: none;
  19180. padding: 0;
  19181. display: flex;
  19182. }
  19183. .shop-size li {
  19184. position: relative;
  19185. display: inline-block;
  19186. vertical-align: middle;
  19187. margin-right: 6px;
  19188. }
  19189. .shop-size li > input[type=radio] + label {
  19190. display: flex;
  19191. }
  19192. .shop-size li > input[type=radio] + label span {
  19193. height: 37px;
  19194. width: 37px;
  19195. border-radius: 100%;
  19196. display: flex;
  19197. align-items: center;
  19198. justify-content: center;
  19199. position: relative;
  19200. cursor: pointer;
  19201. border: 1px solid var(--extra-medium-gray);
  19202. text-align: center;
  19203. font-size: 12px;
  19204. line-height: normal;
  19205. color: var(--dark-gray);
  19206. font-weight: 500;
  19207. }
  19208. .shop-size li input[type=radio]:checked + label span:after {
  19209. position: absolute;
  19210. top: -1px;
  19211. left: -1px;
  19212. height: 37px;
  19213. width: 37px;
  19214. border: 1px solid var(--dark-gray);
  19215. border-radius: 100%;
  19216. text-align: center;
  19217. content: "";
  19218. }
  19219. /* Shop quantity */
  19220. .quantity {
  19221. display: inline-block;
  19222. position: relative;
  19223. }
  19224. .quantity button {
  19225. border: 0;
  19226. background-color: transparent;
  19227. padding: 0;
  19228. margin: -9px 0 0 0;
  19229. font-size: 22px;
  19230. line-height: 18px;
  19231. position: absolute;
  19232. left: 15px;
  19233. top: 50%;
  19234. color: var(--dark-gray);
  19235. -webkit-transform: translateY(-3px);
  19236. transform: translateY(-3px);
  19237. }
  19238. .quantity button.qty-plus {
  19239. right: 15px;
  19240. left: auto;
  19241. }
  19242. .quantity .qty-text {
  19243. width: 115px;
  19244. height: 54px;
  19245. border: 1px solid var(--extra-medium-gray);
  19246. border-radius: 5px;
  19247. text-align: center;
  19248. color: var(--dark-gray);
  19249. }
  19250. .btn-cart.btn.btn-switch-text.btn-extra-large > span {
  19251. padding: 13px 48px;
  19252. }
  19253. .wishlist {
  19254. height: 54px;
  19255. width: 54px;
  19256. }
  19257. /* Cart */
  19258. .cart-products th {
  19259. border-top: 0;
  19260. border-bottom: 1px solid var(--extra-medium-gray) !important;
  19261. padding: 15px 10px;
  19262. font-weight: normal;
  19263. text-transform: capitalize;
  19264. color: var(--dark-gray);
  19265. }
  19266. .cart-products td {
  19267. vertical-align: middle;
  19268. border-bottom: 1px solid var(--extra-medium-gray);
  19269. border-top: 0;
  19270. padding: 25px 10px;
  19271. color: var(--medium-gray);
  19272. }
  19273. .cart-products .product-remove {
  19274. width: 25px;
  19275. }
  19276. .cart-products .product-thumbnail {
  19277. width: 100px;
  19278. }
  19279. .cart-products .quantity button {
  19280. color: var(--medium-gray);
  19281. }
  19282. .cart-products .quantity .qty-text {
  19283. color: var(--medium-gray);
  19284. height: 42px;
  19285. width: 100px;
  19286. }
  19287. .coupon-code-panel {
  19288. position: relative;
  19289. }
  19290. .coupon-code-panel:before {
  19291. content: "\e8bf";
  19292. font-family: feather;
  19293. position: absolute;
  19294. left: 20px;
  19295. z-index: 2;
  19296. line-height: 50px;
  19297. }
  19298. .coupon-code-panel input {
  19299. margin: 0;
  19300. border: none;
  19301. border: 1px dashed var(--extra-medium-gray);
  19302. padding: 8px 70px 9px 45px;
  19303. width: 100%;
  19304. position: relative;
  19305. font-size: 14px;
  19306. }
  19307. .coupon-code-panel .apply-coupon-btn {
  19308. position: absolute;
  19309. right: 5px;
  19310. top: 50%;
  19311. -webkit-transform: translateY(-50%);
  19312. -ms-transform: translateY(-50%);
  19313. transform: translateY(-50%);
  19314. color: var(--dark-gray);
  19315. line-height: 30px;
  19316. letter-spacing: 0;
  19317. }
  19318. .coupon-code-panel .apply-coupon-btn:active {
  19319. border-color: transparent;
  19320. }
  19321. .total-price-table th, .total-price-table td {
  19322. border-bottom: 1px solid var(--extra-medium-gray);
  19323. padding-top: 20px;
  19324. padding-bottom: 20px;
  19325. vertical-align: top;
  19326. }
  19327. .total-price-table .total-amount th, .total-price-table .total-amount td {
  19328. border-bottom: 0;
  19329. }
  19330. .calculate-shipping .form-select:focus {
  19331. border-color: #dfdfdf;
  19332. }
  19333. /* Checkout */
  19334. .your-order-table .product td {
  19335. padding-top: 15px;
  19336. padding-bottom: 15px;
  19337. vertical-align: middle;
  19338. }
  19339. .your-order-box .terms-condition .box:before {
  19340. background-color: var(--white);
  19341. }
  19342. /* Minicart */
  19343. .header-cart-icon .header-cart .cart-item-list {
  19344. border-radius: 6px;
  19345. padding: 10px 30px 25px;
  19346. min-width: 260px;
  19347. }
  19348. .header-cart-icon .header-cart .cart-item-list .cart-item {
  19349. padding: 15px 0;
  19350. }
  19351. .header-cart-icon .header-cart .cart-item-list .cart-item .close {
  19352. right: 0;
  19353. top: 50%;
  19354. font-size: 20px;
  19355. -webkit-transform: translateY(-50%);
  19356. transform: translateY(-50%);
  19357. }
  19358. .header-cart-icon .header-cart .cart-item-list .cart-item .product-detail a {
  19359. font-size: 15px;
  19360. line-height: 22px;
  19361. }
  19362. .header-cart-icon .header-cart .cart-item-list .cart-item .product-detail .item-ammount {
  19363. font-size: 14px;
  19364. }
  19365. .header-cart-icon .header-cart .cart-item-list .cart-item:last-of-type {
  19366. border-bottom: 0;
  19367. }
  19368. .header-cart-icon .header-cart .cart-item-list .cart-total {
  19369. background-color: transparent;
  19370. border: 0;
  19371. padding-bottom: 0;
  19372. padding-top: 10px;
  19373. }
  19374. .header-cart-icon .header-cart .cart-item-list .cart-total .btn.btn-large {
  19375. font-size: 14px;
  19376. padding: 11px 20px;
  19377. border-width: 1px;
  19378. }
  19379. /* Shop category style 02 */
  19380. .shop-category-02 .category-box {
  19381. overflow: hidden;
  19382. position: relative;
  19383. }
  19384. .shop-category-02 .category-box .category-title {
  19385. padding: 0 15px;
  19386. width: 100%;
  19387. }
  19388. .shop-category-02 .category-box img {
  19389. -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  19390. transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  19391. }
  19392. .shop-category-02 .category-box .category-hover-content {
  19393. position: absolute;
  19394. left: 20px;
  19395. top: 20px;
  19396. height: calc(100% - 40px);
  19397. width: calc(100% - 40px);
  19398. opacity: 0;
  19399. visibility: hidden;
  19400. -webkit-transform: scale(0.9);
  19401. transform: scale(0.9);
  19402. }
  19403. .shop-category-02 .category-box .category-hover-content a {
  19404. opacity: 0;
  19405. -webkit-transition: 0.2s;
  19406. transition: 0.2s;
  19407. -webkit-transform: translateY(30px);
  19408. transform: translateY(30px);
  19409. }
  19410. .shop-category-02 .category-box .category-hover-content a:hover {
  19411. color: var(--dark-gray);
  19412. }
  19413. .shop-category-02 .category-box .category-hover-content .title {
  19414. opacity: 0;
  19415. -webkit-transition: 0.3s;
  19416. transition: 0.3s;
  19417. -webkit-transform: scale(0.8);
  19418. transform: scale(0.8);
  19419. }
  19420. .shop-category-02 .category-box:hover img {
  19421. -webkit-transform: scale(1.1);
  19422. transform: scale(1.1);
  19423. opacity: 0.6;
  19424. }
  19425. .shop-category-02 .category-box:hover .category-hover-content {
  19426. opacity: 1;
  19427. visibility: visible;
  19428. -webkit-transform: scale(1);
  19429. transform: scale(1);
  19430. }
  19431. .shop-category-02 .category-box:hover .category-hover-content .title {
  19432. opacity: 1;
  19433. -webkit-transform: scale(1);
  19434. transform: scale(1);
  19435. -webkit-transition-delay: 0.1s;
  19436. transition-delay: 0.1s;
  19437. }
  19438. .shop-category-02 .category-box:hover .category-hover-content a {
  19439. opacity: 1;
  19440. -webkit-transform: translateY(0px);
  19441. transform: translateY(0px);
  19442. -webkit-transition-delay: 0.2s;
  19443. transition-delay: 0.2s;
  19444. }
  19445. /* Shop banner style 01 */
  19446. .shop-banner-style-01 figure figcaption {
  19447. opacity: 0;
  19448. -webkit-transition: all 0.5s cubic-bezier(0.12, 0, 0.39, 0);
  19449. transition: all 0.5s cubic-bezier(0.12, 0, 0.39, 0);
  19450. }
  19451. .shop-banner-style-01 figure figcaption .banner-subtitle, .shop-banner-style-01 figure figcaption .banner-title, .shop-banner-style-01 figure figcaption .banner-btn {
  19452. opacity: 0;
  19453. -webkit-transform: translate3d(0, 15px, 0);
  19454. transform: translate3d(0, 15px, 0);
  19455. -webkit-transition: all 1s cubic-bezier(0.2, 0, 0.3, 1);
  19456. transition: all 1s cubic-bezier(0.2, 0, 0.3, 1);
  19457. }
  19458. .shop-banner-style-01 figure figcaption .banner-subtitle {
  19459. opacity: 0;
  19460. -webkit-transform: translate3d(0, 15px, 0);
  19461. transform: translate3d(0, 15px, 0);
  19462. -webkit-transition: all 1s cubic-bezier(0.2, 0, 0.3, 1);
  19463. transition: all 1s cubic-bezier(0.2, 0, 0.3, 1);
  19464. }
  19465. .shop-banner-style-01 figure figcaption .banner-title {
  19466. opacity: 0;
  19467. -webkit-transform: translate3d(0, 15px, 0);
  19468. transform: translate3d(0, 15px, 0);
  19469. -webkit-transition: all 0.7s cubic-bezier(0.2, 0, 0.3, 1);
  19470. transition: all 0.7s cubic-bezier(0.2, 0, 0.3, 1);
  19471. }
  19472. .shop-banner-style-01 figure figcaption .banner-btn {
  19473. opacity: 0;
  19474. -webkit-transform: translate3d(0, 15px, 0);
  19475. transform: translate3d(0, 15px, 0);
  19476. -webkit-transition: all 1s cubic-bezier(0.2, 0, 0.3, 1);
  19477. transition: all 1s cubic-bezier(0.2, 0, 0.3, 1);
  19478. }
  19479. .shop-banner-style-01 figure:hover figcaption {
  19480. opacity: 1;
  19481. }
  19482. .shop-banner-style-01 figure:hover figcaption .banner-subtitle {
  19483. opacity: 1;
  19484. -webkit-transform: translate3d(0, 0, 0);
  19485. transform: translate3d(0, 0, 0);
  19486. -webkit-transition: all 0.4s cubic-bezier(0.2, 0, 0.3, 1);
  19487. transition: all 0.4s cubic-bezier(0.2, 0, 0.3, 1);
  19488. }
  19489. .shop-banner-style-01 figure:hover figcaption .banner-title {
  19490. opacity: 1;
  19491. -webkit-transform: translate3d(0, 0, 0);
  19492. transform: translate3d(0, 0, 0);
  19493. -webkit-transition: all 0.7s cubic-bezier(0.2, 0, 0.3, 1);
  19494. transition: all 0.7s cubic-bezier(0.2, 0, 0.3, 1);
  19495. }
  19496. .shop-banner-style-01 figure:hover figcaption .banner-btn {
  19497. opacity: 1;
  19498. -webkit-transform: translate3d(0, 0, 0);
  19499. transform: translate3d(0, 0, 0);
  19500. -webkit-transition: all 1s cubic-bezier(0.2, 0, 0.3, 1);
  19501. transition: all 1s cubic-bezier(0.2, 0, 0.3, 1);
  19502. }
  19503. /* ===================================
  19504. 17. Footer
  19505. ====================================== */
  19506. footer {
  19507. padding-top: 110px;
  19508. padding-bottom: 110px;
  19509. }
  19510. footer.half-footer {
  19511. padding-top: 70px;
  19512. padding-bottom: 70px;
  19513. }
  19514. footer.big-footer {
  19515. padding-top: 140px;
  19516. padding-bottom: 140px;
  19517. }
  19518. footer .footer-logo img {
  19519. max-height: 30px;
  19520. }
  19521. footer ul {
  19522. padding: 0;
  19523. list-style: none;
  19524. margin: 0;
  19525. }
  19526. footer ul li {
  19527. margin-bottom: 5px;
  19528. }
  19529. footer .elements-social.social-icon-style-01 li, footer .elements-social.social-icon-style-02 li, footer .elements-social.social-icon-style-05 li, footer .elements-social.social-icon-style-08 li {
  19530. margin: 0 15px 0 0;
  19531. }
  19532. footer .elements-social.social-icon-style-01 li a, footer .elements-social.social-icon-style-02 li a, footer .elements-social.social-icon-style-05 li a, footer .elements-social.social-icon-style-08 li a {
  19533. width: auto;
  19534. height: auto;
  19535. }
  19536. footer .newsletter-style-05 .input-small {
  19537. font-size: 14px;
  19538. }
  19539. footer .nav-link {
  19540. color: var(--medium-gray);
  19541. padding: 0.5rem 1rem;
  19542. }
  19543. footer .footer-navbar .nav-item:last-child a {
  19544. padding-right: 0;
  19545. }
  19546. /* Footer dark */
  19547. .footer-dark {
  19548. color: var(--aluminium-gray);
  19549. }
  19550. .footer-dark p, .footer-dark a {
  19551. color: var(--aluminium-gray);
  19552. }
  19553. .footer-dark a:hover {
  19554. color: var(--base-color);
  19555. }
  19556. /* Footer light */
  19557. .footer-light a:hover {
  19558. color: var(--base-color);
  19559. }
  19560. /* Footer navbar */
  19561. .footer-navbar li {
  19562. display: inline-block;
  19563. margin-bottom: 0;
  19564. }
  19565. .footer-navbar li a:hover {
  19566. color: var(--base-color);
  19567. }
  19568. .footer-navbar li:last-child a {
  19569. padding-right: 0;
  19570. }
  19571. .footer-navbar li:first-child a {
  19572. padding-left: 0;
  19573. }
  19574. .footer-navbar .nav-link:focus {
  19575. color: inherit;
  19576. }
  19577. /* Footer sticky */
  19578. .main-content {
  19579. position: relative;
  19580. z-index: 2;
  19581. background: var(--white);
  19582. }
  19583. .footer-sticky {
  19584. position: -webkit-sticky;
  19585. position: sticky;
  19586. bottom: 0;
  19587. overflow: hidden;
  19588. }
  19589. /* Landing page footer */
  19590. .footer-demo ul li {
  19591. margin-bottom: 0;
  19592. line-height: 30px;
  19593. }
  19594. .footer-demo a:hover {
  19595. color: #fff;
  19596. }
  19597. .footer-demo img {
  19598. max-height: 55px !important;
  19599. }