PNG  IHDRX cHRMz&u0`:pQ<bKGD pHYsodtIME MeqIDATxw]Wug^Qd˶ 6`!N:!@xI~)%7%@Bh&`lnjVF29gΨ4E$|>cɚ{gk= %,a KX%,a KX%,a KX%,a KX%,a KX%,a KX%, b` ǟzeאfp]<!SJmɤY޲ڿ,%c ~ع9VH.!Ͳz&QynֺTkRR.BLHi٪:l;@(!MԴ=žI,:o&N'Kù\vRmJ雵֫AWic H@" !: Cé||]k-Ha oݜ:y F())u]aG7*JV@J415p=sZH!=!DRʯvɱh~V\}v/GKY$n]"X"}t@ xS76^[bw4dsce)2dU0 CkMa-U5tvLƀ~mlMwfGE/-]7XAƟ`׮g ewxwC4\[~7@O-Q( a*XGƒ{ ՟}$_y3tĐƤatgvێi|K=uVyrŲlLӪuܿzwk$m87k( `múcE)"@rK( z4$D; 2kW=Xb$V[Ru819קR~qloѱDyįݎ*mxw]y5e4K@ЃI0A D@"BDk_)N\8͜9dz"fK0zɿvM /.:2O{ Nb=M=7>??Zuo32 DLD@D| &+֎C #B8ַ`bOb $D#ͮҪtx]%`ES`Ru[=¾!@Od37LJ0!OIR4m]GZRJu$‡c=%~s@6SKy?CeIh:[vR@Lh | (BhAMy=݃  G"'wzn޺~8ԽSh ~T*A:xR[ܹ?X[uKL_=fDȊ؂p0}7=D$Ekq!/t.*2ʼnDbŞ}DijYaȲ(""6HA;:LzxQ‘(SQQ}*PL*fc\s `/d'QXW, e`#kPGZuŞuO{{wm[&NBTiiI0bukcA9<4@SӊH*؎4U/'2U5.(9JuDfrޱtycU%j(:RUbArLֺN)udA':uGQN"-"Is.*+k@ `Ojs@yU/ H:l;@yyTn}_yw!VkRJ4P)~y#)r,D =ě"Q]ci'%HI4ZL0"MJy 8A{ aN<8D"1#IJi >XjX֔#@>-{vN!8tRݻ^)N_╗FJEk]CT՟ YP:_|H1@ CBk]yKYp|og?*dGvzنzӴzjֺNkC~AbZƷ`.H)=!QͷVTT(| u78y֮}|[8-Vjp%2JPk[}ԉaH8Wpqhwr:vWª<}l77_~{s۴V+RCģ%WRZ\AqHifɤL36: #F:p]Bq/z{0CU6ݳEv_^k7'>sq*+kH%a`0ԣisqにtү04gVgW΂iJiS'3w.w}l6MC2uԯ|>JF5`fV5m`Y**Db1FKNttu]4ccsQNnex/87+}xaUW9y>ͯ骵G{䩓Գ3+vU}~jJ.NFRD7<aJDB1#ҳgSb,+CS?/ VG J?|?,2#M9}B)MiE+G`-wo߫V`fio(}S^4e~V4bHOYb"b#E)dda:'?}׮4繏`{7Z"uny-?ǹ;0MKx{:_pÚmFמ:F " .LFQLG)Q8qN q¯¯3wOvxDb\. BKD9_NN &L:4D{mm o^tֽ:q!ƥ}K+<"m78N< ywsard5+вz~mnG)=}lYݧNj'QJS{S :UYS-952?&O-:W}(!6Mk4+>A>j+i|<<|;ر^߉=HE|V#F)Emm#}/"y GII웻Jі94+v뾧xu~5C95~ūH>c@덉pʃ1/4-A2G%7>m;–Y,cyyaln" ?ƻ!ʪ<{~h~i y.zZB̃/,雋SiC/JFMmBH&&FAbϓO^tubbb_hZ{_QZ-sύodFgO(6]TJA˯#`۶ɟ( %$&+V'~hiYy>922 Wp74Zkq+Ovn錄c>8~GqܲcWꂎz@"1A.}T)uiW4="jJ2W7mU/N0gcqܗOO}?9/wìXžΏ0 >֩(V^Rh32!Hj5`;O28؇2#ݕf3 ?sJd8NJ@7O0 b־?lldщ̡&|9C.8RTWwxWy46ah嘦mh٤&l zCy!PY?: CJyв]dm4ǜҐR޻RլhX{FƯanшQI@x' ao(kUUuxW_Ñ줮[w8 FRJ(8˼)_mQ _!RJhm=!cVmm ?sFOnll6Qk}alY}; "baӌ~M0w,Ggw2W:G/k2%R,_=u`WU R.9T"v,<\Ik޽/2110Ӿxc0gyC&Ny޽JҢrV6N ``یeA16"J³+Rj*;BϜkZPJaÍ<Jyw:NP8/D$ 011z֊Ⱳ3ι֘k1V_"h!JPIΣ'ɜ* aEAd:ݺ>y<}Lp&PlRfTb1]o .2EW\ͮ]38؋rTJsǏP@芎sF\> P^+dYJLbJ C-xϐn> ι$nj,;Ǖa FU *择|h ~izť3ᤓ`K'-f tL7JK+vf2)V'-sFuB4i+m+@My=O҈0"|Yxoj,3]:cо3 $#uŘ%Y"y죯LebqtҢVzq¼X)~>4L׶m~[1_k?kxֺQ`\ |ٛY4Ѯr!)N9{56(iNq}O()Em]=F&u?$HypWUeB\k]JɩSع9 Zqg4ZĊo oMcjZBU]B\TUd34ݝ~:7ڶSUsB0Z3srx 7`:5xcx !qZA!;%͚7&P H<WL!džOb5kF)xor^aujƍ7 Ǡ8/p^(L>ὴ-B,{ۇWzֺ^k]3\EE@7>lYBȝR.oHnXO/}sB|.i@ɥDB4tcm,@ӣgdtJ!lH$_vN166L__'Z)y&kH;:,Y7=J 9cG) V\hjiE;gya~%ks_nC~Er er)muuMg2;֫R)Md) ,¶ 2-wr#F7<-BBn~_(o=KO㭇[Xv eN_SMgSҐ BS헃D%g_N:/pe -wkG*9yYSZS.9cREL !k}<4_Xs#FmҶ:7R$i,fi!~' # !6/S6y@kZkZcX)%5V4P]VGYq%H1!;e1MV<!ϐHO021Dp= HMs~~a)ަu7G^];git!Frl]H/L$=AeUvZE4P\.,xi {-~p?2b#amXAHq)MWǾI_r`S Hz&|{ +ʖ_= (YS(_g0a03M`I&'9vl?MM+m~}*xT۲(fY*V4x@29s{DaY"toGNTO+xCAO~4Ϳ;p`Ѫ:>Ҵ7K 3}+0 387x\)a"/E>qpWB=1 ¨"MP(\xp߫́A3+J] n[ʼnӼaTbZUWb={~2ooKױӰp(CS\S筐R*JغV&&"FA}J>G֐p1ٸbk7 ŘH$JoN <8s^yk_[;gy-;߉DV{c B yce% aJhDȶ 2IdйIB/^n0tNtџdcKj4϶v~- CBcgqx9= PJ) dMsjpYB] GD4RDWX +h{y`,3ꊕ$`zj*N^TP4L:Iz9~6s) Ga:?y*J~?OrMwP\](21sZUD ?ܟQ5Q%ggW6QdO+\@ ̪X'GxN @'4=ˋ+*VwN ne_|(/BDfj5(Dq<*tNt1х!MV.C0 32b#?n0pzj#!38}޴o1KovCJ`8ŗ_"]] rDUy޲@ Ȗ-;xџ'^Y`zEd?0„ DAL18IS]VGq\4o !swV7ˣι%4FѮ~}6)OgS[~Q vcYbL!wG3 7띸*E Pql8=jT\꘿I(z<[6OrR8ºC~ډ]=rNl[g|v TMTղb-o}OrP^Q]<98S¤!k)G(Vkwyqyr޽Nv`N/e p/~NAOk \I:G6]4+K;j$R:Mi #*[AȚT,ʰ,;N{HZTGMoּy) ]%dHء9Պ䠬|<45,\=[bƟ8QXeB3- &dҩ^{>/86bXmZ]]yޚN[(WAHL$YAgDKp=5GHjU&99v簪C0vygln*P)9^͞}lMuiH!̍#DoRBn9l@ xA/_v=ȺT{7Yt2N"4!YN`ae >Q<XMydEB`VU}u]嫇.%e^ánE87Mu\t`cP=AD/G)sI"@MP;)]%fH9'FNsj1pVhY&9=0pfuJ&gޤx+k:!r˭wkl03׼Ku C &ѓYt{.O.zҏ z}/tf_wEp2gvX)GN#I ݭ߽v/ .& и(ZF{e"=V!{zW`, ]+LGz"(UJp|j( #V4, 8B 0 9OkRrlɱl94)'VH9=9W|>PS['G(*I1==C<5"Pg+x'K5EMd؞Af8lG ?D FtoB[je?{k3zQ vZ;%Ɠ,]E>KZ+T/ EJxOZ1i #T<@ I}q9/t'zi(EMqw`mYkU6;[t4DPeckeM;H}_g pMww}k6#H㶏+b8雡Sxp)&C $@'b,fPߑt$RbJ'vznuS ~8='72_`{q纶|Q)Xk}cPz9p7O:'|G~8wx(a 0QCko|0ASD>Ip=4Q, d|F8RcU"/KM opKle M3#i0c%<7׿p&pZq[TR"BpqauIp$ 8~Ĩ!8Սx\ւdT>>Z40ks7 z2IQ}ItԀ<-%S⍤};zIb$I 5K}Q͙D8UguWE$Jh )cu4N tZl+[]M4k8֦Zeq֮M7uIqG 1==tLtR,ƜSrHYt&QP윯Lg' I,3@P'}'R˪e/%-Auv·ñ\> vDJzlӾNv5:|K/Jb6KI9)Zh*ZAi`?S {aiVDԲuy5W7pWeQJk֤#5&V<̺@/GH?^τZL|IJNvI:'P=Ϛt"¨=cud S Q.Ki0 !cJy;LJR;G{BJy޺[^8fK6)=yʊ+(k|&xQ2`L?Ȓ2@Mf 0C`6-%pKpm')c$׻K5[J*U[/#hH!6acB JA _|uMvDyk y)6OPYjœ50VT K}cǻP[ $:]4MEA.y)|B)cf-A?(e|lɉ#P9V)[9t.EiQPDѠ3ϴ;E:+Օ t ȥ~|_N2,ZJLt4! %ա]u {+=p.GhNcŞQI?Nd'yeh n7zi1DB)1S | S#ًZs2|Ɛy$F SxeX{7Vl.Src3E℃Q>b6G ўYCmtկ~=K0f(=LrAS GN'ɹ9<\!a`)֕y[uՍ[09` 9 +57ts6}b4{oqd+J5fa/,97J#6yν99mRWxJyѡyu_TJc`~W>l^q#Ts#2"nD1%fS)FU w{ܯ R{ ˎ󅃏џDsZSQS;LV;7 Od1&1n$ N /.q3~eNɪ]E#oM~}v֯FڦwyZ=<<>Xo稯lfMFV6p02|*=tV!c~]fa5Y^Q_WN|Vs 0ҘދU97OI'N2'8N֭fgg-}V%y]U4 峧p*91#9U kCac_AFңĪy뚇Y_AiuYyTTYЗ-(!JFLt›17uTozc. S;7A&&<ԋ5y;Ro+:' *eYJkWR[@F %SHWP 72k4 qLd'J "zB6{AC0ƁA6U.'F3:Ȅ(9ΜL;D]m8ڥ9}dU "v!;*13Rg^fJyShyy5auA?ɩGHRjo^]׽S)Fm\toy 4WQS@mE#%5ʈfFYDX ~D5Ϡ9tE9So_aU4?Ѽm%&c{n>.KW1Tlb}:j uGi(JgcYj0qn+>) %\!4{LaJso d||u//P_y7iRJ߬nHOy) l+@$($VFIQ9%EeKʈU. ia&FY̒mZ=)+qqoQn >L!qCiDB;Y<%} OgBxB!ØuG)WG9y(Ą{_yesuZmZZey'Wg#C~1Cev@0D $a@˲(.._GimA:uyw֬%;@!JkQVM_Ow:P.s\)ot- ˹"`B,e CRtaEUP<0'}r3[>?G8xU~Nqu;Wm8\RIkբ^5@k+5(By'L&'gBJ3ݶ!/㮻w҅ yqPWUg<e"Qy*167΃sJ\oz]T*UQ<\FԎ`HaNmڜ6DysCask8wP8y9``GJ9lF\G g's Nn͵MLN֪u$| /|7=]O)6s !ĴAKh]q_ap $HH'\1jB^s\|- W1:=6lJBqjY^LsPk""`]w)󭃈,(HC ?䔨Y$Sʣ{4Z+0NvQkhol6C.婧/u]FwiVjZka&%6\F*Ny#8O,22+|Db~d ~Çwc N:FuuCe&oZ(l;@ee-+Wn`44AMK➝2BRՈt7g*1gph9N) *"TF*R(#'88pm=}X]u[i7bEc|\~EMn}P瘊J)K.0i1M6=7'_\kaZ(Th{K*GJyytw"IO-PWJk)..axӝ47"89Cc7ĐBiZx 7m!fy|ϿF9CbȩV 9V-՛^pV̌ɄS#Bv4-@]Vxt-Z, &ֺ*diؠ2^VXbs֔Ìl.jQ]Y[47gj=幽ex)A0ip׳ W2[ᎇhuE^~q흙L} #-b۸oFJ_QP3r6jr+"nfzRJTUqoaۍ /$d8Mx'ݓ= OՃ| )$2mcM*cЙj}f };n YG w0Ia!1Q.oYfr]DyISaP}"dIӗթO67jqR ҊƐƈaɤGG|h;t]䗖oSv|iZqX)oalv;۩meEJ\!8=$4QU4Xo&VEĊ YS^E#d,yX_> ۘ-e\ "Wa6uLĜZi`aD9.% w~mB(02G[6y.773a7 /=o7D)$Z 66 $bY^\CuP. (x'"J60׿Y:Oi;F{w佩b+\Yi`TDWa~|VH)8q/=9!g߆2Y)?ND)%?Ǐ`k/sn:;O299yB=a[Ng 3˲N}vLNy;*?x?~L&=xyӴ~}q{qE*IQ^^ͧvü{Huu=R|>JyUlZV, B~/YF!Y\u_ݼF{_C)LD]m {H 0ihhadd nUkf3oٺCvE\)QJi+֥@tDJkB$1!Đr0XQ|q?d2) Ӣ_}qv-< FŊ߫%roppVBwü~JidY4:}L6M7f٬F "?71<2#?Jyy4뷢<_a7_=Q E=S1И/9{+93֮E{ǂw{))?maÆm(uLE#lïZ  ~d];+]h j?!|$F}*"4(v'8s<ŏUkm7^7no1w2ؗ}TrͿEk>p'8OB7d7R(A 9.*Mi^ͳ; eeUwS+C)uO@ =Sy]` }l8^ZzRXj[^iUɺ$tj))<sbDJfg=Pk_{xaKo1:-uyG0M ԃ\0Lvuy'ȱc2Ji AdyVgVh!{]/&}}ċJ#%d !+87<;qN޼Nفl|1N:8ya  8}k¾+-$4FiZYÔXk*I&'@iI99)HSh4+2G:tGhS^繿 Kتm0 вDk}֚+QT4;sC}rՅE,8CX-e~>G&'9xpW,%Fh,Ry56Y–hW-(v_,? ; qrBk4-V7HQ;ˇ^Gv1JVV%,ik;D_W!))+BoS4QsTM;gt+ndS-~:11Sgv!0qRVh!"Ȋ(̦Yl.]PQWgٳE'`%W1{ndΗBk|Ž7ʒR~,lnoa&:ü$ 3<a[CBݮwt"o\ePJ=Hz"_c^Z.#ˆ*x z̝grY]tdkP*:97YľXyBkD4N.C_[;F9`8& !AMO c `@BA& Ost\-\NX+Xp < !bj3C&QL+*&kAQ=04}cC!9~820G'PC9xa!w&bo_1 Sw"ܱ V )Yl3+ס2KoXOx]"`^WOy :3GO0g;%Yv㐫(R/r (s } u B &FeYZh0y> =2<Ϟc/ -u= c&׭,.0"g"7 6T!vl#sc>{u/Oh Bᾈ)۴74]x7 gMӒ"d]U)}" v4co[ ɡs 5Gg=XR14?5A}D "b{0$L .\4y{_fe:kVS\\O]c^W52LSBDM! C3Dhr̦RtArx4&agaN3Cf<Ԉp4~ B'"1@.b_/xQ} _߃҉/gٓ2Qkqp0շpZ2fԫYz< 4L.Cyυι1t@鎫Fe sYfsF}^ V}N<_`p)alٶ "(XEAVZ<)2},:Ir*#m_YӼ R%a||EƼIJ,,+f"96r/}0jE/)s)cjW#w'Sʯ5<66lj$a~3Kʛy 2:cZ:Yh))+a߭K::N,Q F'qB]={.]h85C9cr=}*rk?vwV렵ٸW Rs%}rNAkDv|uFLBkWY YkX מ|)1!$#3%y?pF<@<Rr0}: }\J [5FRxY<9"SQdE(Q*Qʻ)q1E0B_O24[U'],lOb ]~WjHޏTQ5Syu wq)xnw8~)c 쫬gٲߠ H% k5dƝk> kEj,0% b"vi2Wس_CuK)K{n|>t{P1򨾜j>'kEkƗBg*H%'_aY6Bn!TL&ɌOb{c`'d^{t\i^[uɐ[}q0lM˕G:‚4kb祔c^:?bpg… +37stH:0}en6x˟%/<]BL&* 5&fK9Mq)/iyqtA%kUe[ڛKN]Ě^,"`/ s[EQQm?|XJ߅92m]G.E΃ח U*Cn.j_)Tѧj̿30ڇ!A0=͜ar I3$C^-9#|pk!)?7.x9 @OO;WƝZBFU keZ75F6Tc6"ZȚs2y/1 ʵ:u4xa`C>6Rb/Yм)^=+~uRd`/|_8xbB0?Ft||Z\##|K 0>>zxv8۴吅q 8ĥ)"6>~\8:qM}#͚'ĉ#p\׶ l#bA?)|g g9|8jP(cr,BwV (WliVxxᡁ@0Okn;ɥh$_ckCgriv}>=wGzβ KkBɛ[˪ !J)h&k2%07δt}!d<9;I&0wV/ v 0<H}L&8ob%Hi|޶o&h1L|u֦y~󛱢8fٲUsւ)0oiFx2}X[zVYr_;N(w]_4B@OanC?gĦx>мgx>ΛToZoOMp>40>V Oy V9iq!4 LN,ˢu{jsz]|"R޻&'ƚ{53ўFu(<٪9:΋]B;)B>1::8;~)Yt|0(pw2N%&X,URBK)3\zz&}ax4;ǟ(tLNg{N|Ǽ\G#C9g$^\}p?556]/RP.90 k,U8/u776s ʪ_01چ|\N 0VV*3H鴃J7iI!wG_^ypl}r*jɤSR 5QN@ iZ#1ٰy;_\3\BQQ x:WJv츟ٯ$"@6 S#qe딇(/P( Dy~TOϻ<4:-+F`0||;Xl-"uw$Цi󼕝mKʩorz"mϺ$F:~E'ҐvD\y?Rr8_He@ e~O,T.(ފR*cY^m|cVR[8 JҡSm!ΆԨb)RHG{?MpqrmN>߶Y)\p,d#xۆWY*,l6]v0h15M˙MS8+EdI='LBJIH7_9{Caз*Lq,dt >+~ّeʏ?xԕ4bBAŚjﵫ!'\Ը$WNvKO}ӽmSşذqsOy?\[,d@'73'j%kOe`1.g2"e =YIzS2|zŐƄa\U,dP;jhhhaxǶ?КZ՚.q SE+XrbOu%\GتX(H,N^~]JyEZQKceTQ]VGYqnah;y$cQahT&QPZ*iZ8UQQM.qo/T\7X"u?Mttl2Xq(IoW{R^ ux*SYJ! 4S.Jy~ BROS[V|žKNɛP(L6V^|cR7i7nZW1Fd@ Ara{詑|(T*dN]Ko?s=@ |_EvF]׍kR)eBJc" MUUbY6`~V޴dJKß&~'d3i WWWWWW
Current Directory: /home2/samarhoy/dnvp.in/dashboard
Viewing File: /home2/samarhoy/dnvp.in/dashboard/forms-elements.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>Xacton - Admin & Dashboard Template</title> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta content="Premium Multipurpose Admin & Dashboard Template" name="description" /> <meta content="MyraStudio" name="author" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <!-- App favicon --> <link rel="shortcut icon" href="assets/images/favicon.ico"> <!-- App css --> <link href="assets/css/bootstrap.min.css" rel="stylesheet" type="text/css" /> <link href="assets/css/icons.min.css" rel="stylesheet" type="text/css" /> <link href="assets/css/theme.min.css" rel="stylesheet" type="text/css" /> </head> <body> <!-- Begin page --> <div id="layout-wrapper"> <header id="page-topbar"> <div class="navbar-header"> <div class="d-flex align-items-left"> <button type="button" class="btn btn-sm mr-2 d-lg-none px-3 font-size-16 header-item waves-effect" id="vertical-menu-btn"> <i class="fa fa-fw fa-bars"></i> </button> <div class="dropdown d-none d-sm-inline-block"> <button type="button" class="btn header-item waves-effect" id="page-header-user-dropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <i class="mdi mdi-plus"></i> Create New <i class="mdi mdi-chevron-down d-none d-sm-inline-block"></i> </button> <div class="dropdown-menu"> <!-- item--> <a href="javascript:void(0);" class="dropdown-item notify-item"> Application </a> <!-- item--> <a href="javascript:void(0);" class="dropdown-item notify-item"> Software </a> <!-- item--> <a href="javascript:void(0);" class="dropdown-item notify-item"> EMS System </a> <!-- item--> <a href="javascript:void(0);" class="dropdown-item notify-item"> CRM App </a> </div> </div> </div> <div class="d-flex align-items-center"> <div class="dropdown d-none d-sm-inline-block ml-2"> <button type="button" class="btn header-item noti-icon waves-effect" id="page-header-search-dropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <i class="mdi mdi-magnify"></i> </button> <div class="dropdown-menu dropdown-menu-lg dropdown-menu-right p-0" aria-labelledby="page-header-search-dropdown"> <form class="p-3"> <div class="form-group m-0"> <div class="input-group"> <input type="text" class="form-control" placeholder="Search ..." aria-label="Recipient's username"> <div class="input-group-append"> <button class="btn btn-primary" type="submit"><i class="mdi mdi-magnify"></i></button> </div> </div> </div> </form> </div> </div> <div class="dropdown d-inline-block"> <button type="button" class="btn header-item waves-effect" id="page-header-user-dropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <img class="" src="assets/images/flags/us.jpg"alt="Header Language" height="16"> <span class="d-none d-sm-inline-block ml-1">English</span> <i class="mdi mdi-chevron-down d-none d-sm-inline-block"></i> </button> <div class="dropdown-menu dropdown-menu-right"> <!-- item--> <a href="javascript:void(0);" class="dropdown-item notify-item"> <img src="assets/images/flags/spain.jpg" alt="user-image" class="mr-1" height="12"> <span class="align-middle">Spanish</span> </a> <!-- item--> <a href="javascript:void(0);" class="dropdown-item notify-item"> <img src="assets/images/flags/germany.jpg" alt="user-image" class="mr-1" height="12"> <span class="align-middle">German</span> </a> <!-- item--> <a href="javascript:void(0);" class="dropdown-item notify-item"> <img src="assets/images/flags/italy.jpg" alt="user-image" class="mr-1" height="12"> <span class="align-middle">Italian</span> </a> <!-- item--> <a href="javascript:void(0);" class="dropdown-item notify-item"> <img src="assets/images/flags/russia.jpg" alt="user-image" class="mr-1" height="12"> <span class="align-middle">Russian</span> </a> </div> </div> <div class="dropdown d-inline-block"> <button type="button" class="btn header-item noti-icon waves-effect" id="page-header-notifications-dropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <i class="mdi mdi-bell"></i> <span class="badge badge-danger badge-pill">3</span> </button> <div class="dropdown-menu dropdown-menu-lg dropdown-menu-right p-0" aria-labelledby="page-header-notifications-dropdown"> <div class="p-3"> <div class="row align-items-center"> <div class="col"> <h6 class="m-0"> Notifications </h6> </div> <div class="col-auto"> <a href="#!" class="small"> View All</a> </div> </div> </div> <div data-simplebar style="max-height: 230px;"> <a href="" class="text-reset notification-item"> <div class="media"> <img src="assets/images/users/avatar-2.jpg" class="mr-3 rounded-circle avatar-xs" alt="user-pic"> <div class="media-body"> <h6 class="mt-0 mb-1">Samuel Coverdale</h6> <p class="font-size-12 mb-1">You have new follower on Instagram</p> <p class="font-size-12 mb-0 text-muted"><i class="mdi mdi-clock-outline"></i> 2 min ago</p> </div> </div> </a> <a href="" class="text-reset notification-item"> <div class="media"> <div class="avatar-xs mr-3"> <span class="avatar-title bg-success rounded-circle"> <i class="mdi mdi-cloud-download-outline"></i> </span> </div> <div class="media-body"> <h6 class="mt-0 mb-1">Download Available !</h6> <p class="font-size-12 mb-1">Latest version of admin is now available. Please download here.</p> <p class="font-size-12 mb-0 text-muted"><i class="mdi mdi-clock-outline"></i> 4 hours ago</p> </div> </div> </a> <a href="" class="text-reset notification-item"> <div class="media"> <img src="assets/images/users/avatar-3.jpg" class="mr-3 rounded-circle avatar-xs" alt="user-pic"> <div class="media-body"> <h6 class="mt-0 mb-1">Victoria Mendis</h6> <p class="font-size-12 mb-1">Just upgraded to premium account.</p> <p class="font-size-12 mb-0 text-muted"><i class="mdi mdi-clock-outline"></i> 1 day ago</p> </div> </div> </a> </div> <div class="p-2 border-top"> <a class="btn btn-sm btn-light btn-block text-center" href="javascript:void(0)"> <i class="mdi mdi-arrow-down-circle mr-1"></i> Load More.. </a> </div> </div> </div> <div class="dropdown d-inline-block ml-2"> <button type="button" class="btn header-item waves-effect" id="page-header-user-dropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <img class="rounded-circle header-profile-user" src="assets/images/users/avatar-3.jpg" alt="Header Avatar"> <span class="d-none d-sm-inline-block ml-1">Jamie D.</span> <i class="mdi mdi-chevron-down d-none d-sm-inline-block"></i> </button> <div class="dropdown-menu dropdown-menu-right"> <a class="dropdown-item d-flex align-items-center justify-content-between" href="javascript:void(0)"> <span>Inbox</span> <span> <span class="badge badge-pill badge-info">3</span> </span> </a> <a class="dropdown-item d-flex align-items-center justify-content-between" href="javascript:void(0)"> <span>Profile</span> <span> <span class="badge badge-pill badge-warning">1</span> </span> </a> <a class="dropdown-item d-flex align-items-center justify-content-between" href="javascript:void(0)"> Settings </a> <a class="dropdown-item d-flex align-items-center justify-content-between" href="javascript:void(0)"> <span>Lock Account</span> </a> <a class="dropdown-item d-flex align-items-center justify-content-between" href="javascript:void(0)"> <span>Log Out</span> </a> </div> </div> </div> </div> </header> <!-- ========== Left Sidebar Start ========== --> <div class="vertical-menu"> <div data-simplebar class="h-100"> <div class="navbar-brand-box"> <a href="index.html" class="logo"> <i class="mdi mdi-alpha-x-circle"></i> <span> Xacton </span> </a> </div> <!--- Sidemenu --> <div id="sidebar-menu"> <!-- Left Menu Start --> <ul class="metismenu list-unstyled" id="side-menu"> <li class="menu-title">Menu</li> <li> <a href="index.html" class="waves-effect"><i class="feather-airplay"></i><span class="badge badge-pill badge-primary float-right">7</span><span>Dashboard</span></a> </li> <li> <a href="javascript: void(0);" class="has-arrow waves-effect"><i class="feather-copy"></i><span>Pages</span></a> <ul class="sub-menu" aria-expanded="false"> <li><a href="pages-invoice.html">Invoice</a></li> <li><a href="pages-starter.html">Starter Page</a></li> <li><a href="pages-maintenance.html">Maintenance</a></li> <li><a href="pages-faqs.html">FAQs</a></li> <li><a href="pages-pricing.html">Pricing</a></li> <li><a href="pages-login.html">Login</a></li> <li><a href="pages-register.html">Register</a></li> <li><a href="pages-recoverpw.html">Recover Password</a></li> <li><a href="pages-lock-screen.html">Lock Screen</a></li> <li><a href="pages-404.html">Error 404</a></li> <li><a href="pages-500.html">Error 500</a></li> </ul> </li> <li><a href="calendar.html" class=" waves-effect"><i class="feather-calendar"></i><span>Calendar</span></a></li> <li class="menu-title">Components</li> <li> <a href="javascript: void(0);" class="has-arrow waves-effect"><i class="feather-briefcase"></i><span>UI Elements</span></a> <ul class="sub-menu" aria-expanded="false"> <li><a href="ui-buttons.html">Buttons</a></li> <li><a href="ui-cards.html">Cards</a></li> <li><a href="ui-carousel.html">Carousel</a> <li><a href="ui-embeds.html">Embeds</a> <li><a href="ui-general.html">General</a></li> <li><a href="ui-grid.html">Grid</a></li> <li><a href="ui-media-objects.html">Media Objects</a></li> <li><a href="ui-modals.html">Modals</a></li> <li><a href="ui-progressbars.html">Progress Bars</a></li> <li><a href="ui-tabs.html">Tabs</a></li> <li><a href="ui-typography.html">Typography</a></li> <li><a href="ui-toasts.html">Toasts</a></li> <li><a href="ui-tooltips-popovers.html">Tooltips & Popovers</a></li> <li><a href="ui-scrollspy.html">Scrollspy</a></li> <li><a href="ui-spinners.html">Spinners</a></li> <li><a href="ui-sweetalerts.html">Sweet Alerts</a></li> </ul> </li> <li> <a href="javascript: void(0);" class="has-arrow waves-effect"><i class="feather-list"></i><span>Tables</span></a> <ul class="sub-menu" aria-expanded="false"> <li><a href="tables-basic.html">Basic Tables</a></li> <li><a href="tables-datatables.html">Data Tables</a></li> </ul> </li> <li> <a href="javascript: void(0);" class="has-arrow waves-effect"><i class="feather-bar-chart-2"></i><span>Charts</span></a> <ul class="sub-menu" aria-expanded="false"> <li><a href="charts-morris.html">Morris</a></li> <li><a href="charts-google.html">Google</a></li> <li><a href="charts-chartjs.html">Chartjs</a></li> <li><a href="charts-sparkline.html">Sparkline</a></li> <li><a href="charts-knob.html">Jquery Knob</a></li> </ul> </li> <li> <a href="javascript: void(0);" class="waves-effect"><i class="feather-book"></i><span class="badge badge-pill badge-danger float-right">6</span><span>Forms</span></a> <ul class="sub-menu" aria-expanded="false"> <li><a href="forms-elements.html">Elements</a></li> <li><a href="forms-plugins.html">Plugins</a></li> <li><a href="forms-validation.html">Validation</a></li> <li><a href="forms-mask.html">Masks</a></li> <li><a href="forms-quilljs.html">Quilljs</a></li> <li><a href="forms-uploads.html">File Uploads</a></li> </ul> </li> <li> <a href="javascript: void(0);" class="has-arrow waves-effect"><i class="feather-box"></i><span>Icons</span></a> <ul class="sub-menu" aria-expanded="false"> <li><a href="icons-materialdesign.html">Material Design</a></li> <li><a href="icons-fontawesome.html">Font awesome</a></li> <li><a href="icons-dripicons.html">Dripicons</a></li> <li><a href="icons-feather.html">Feather Icons</a></li> </ul> </li> <li class="menu-title">More</li> <li> <a href="javascript: void(0);" class="has-arrow waves-effect"><i class="feather-map"></i><span>Maps</span></a> <ul class="sub-menu" aria-expanded="false"> <li><a href="maps-google.html">Google Maps</a></li> <li><a href="maps-vector.html">Vector Maps</a></li> </ul> </li> <li> <a href="javascript: void(0);" class="has-arrow waves-effect"><i class="mdi mdi-share-variant"></i><span>Multi Level</span></a> <ul class="sub-menu" aria-expanded="true"> <li><a href="javascript: void(0);">Level 1.1</a></li> <li><a href="javascript: void(0);" class="has-arrow">Level 1.2</a> <ul class="sub-menu" aria-expanded="true"> <li><a href="javascript: void(0);">Level 2.1</a></li> <li><a href="javascript: void(0);">Level 2.2</a></li> </ul> </li> </ul> </li> </ul> </div> <!-- Sidebar --> </div> </div> <!-- Left Sidebar End --> <!-- ============================================================== --> <!-- Start right Content here --> <!-- ============================================================== --> <div class="main-content"> <div class="page-content"> <div class="container-fluid"> <!-- start page title --> <div class="row"> <div class="col-12"> <div class="page-title-box d-flex align-items-center justify-content-between"> <h4 class="mb-0 font-size-18">Form Elements</h4> <div class="page-title-right"> <ol class="breadcrumb m-0"> <li class="breadcrumb-item"><a href="javascript: void(0);">Pages</a></li> <li class="breadcrumb-item active">Elements</li> </ol> </div> </div> </div> </div> <!-- end page title --> <div class="row"> <div class="col-xl-6"> <div class="card"> <div class="card-body"> <h4 class="card-title">Form Controls </h4> <p class="card-subtitle mb-4">Textual form controls—like <code>input</code>s,<code> selects</code>, and<code> textare</code>s—are styled with the .form-control class. Included are styles for general appearance, focus state, sizing, and more. </p> <form> <div class="form-group"> <label for="simpleinput">Text</label> <input type="text" id="simpleinput" class="form-control" placeholder="Enter your text"> </div> <div class="form-group"> <label for="example-password">Password</label> <input type="password" id="example-password" class="form-control" value="password"> </div> <div class="form-group"> <label for="exampleFormControlInput1">Email address</label> <input type="email" class="form-control" id="exampleFormControlInput1" placeholder="name@example.com"> </div> <div class="form-group"> <label for="exampleFormControlSelect1">Select</label> <select class="form-control" id="exampleFormControlSelect1"> <option>1</option> <option>2</option> <option>3</option> <option>4</option> <option>5</option> </select> </div> <div class="form-group"> <label for="exampleFormControlSelect2">Multiple Select</label> <select multiple class="form-control" id="exampleFormControlSelect2"> <option>1</option> <option>2</option> <option>3</option> <option>4</option> <option>5</option> </select> </div> <div class="form-group"> <label for="exampleFormControlTextarea1">Textarea</label> <textarea class="form-control" id="exampleFormControlTextarea1" rows="3"></textarea> </div> <div class="form-group"> <label for="formControlRange">Range input</label> <input type="range" class="form-control-range" id="formControlRange"> </div> <div class="form-group"> <label for="customRange3">Custom Range</label> <input type="range" class="custom-range" min="0" max="5" step="0.5" id="customRange3"> </div> <div class="form-group"> <label>File Browser</label> <div class="custom-file"> <input type="file" class="custom-file-input" id="customFile"> <label class="custom-file-label" for="customFile">Choose file</label> </div> </div> <div class="form-group"> <label for="example-readonly">Readonly</label> <input type="text" id="example-readonly" class="form-control" readonly="" value="Readonly value"> </div> <div class="form-group"> <label for="example-disable">Disabled</label> <input type="text" class="form-control" id="example-disable" disabled="" value="Disabled value"> </div> <div class="form-group"> <label for="example-static">Static control</label> <input type="text" readonly class="form-control-plaintext" id="example-static" value="email@example.com"> </div> <div class="form-group mb-0"> <label for="example-helping">Helping text</label> <input type="text" id="example-helping" class="form-control" placeholder="Helping text"> <span class="help-block"><small>A block of help text that breaks onto a new line and may extend beyond one line.</small></span> </div> </form> </div> <!-- end card-body--> </div> <!-- end card --> <div class="card"> <div class="card-body"> <h4 class="card-title">Basic Forms</h4> <p class="card-subtitle mb-4">Here’s a quick example to demonstrate Bootstrap’s form styles. Keep reading for documentation on required classes, form layout, and more.</p> <form> <div class="form-group"> <label for="exampleInputEmail1">Email address</label> <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email"> <small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small> </div> <div class="form-group"> <label for="exampleInputPassword1">Password</label> <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password"> </div> <div class="form-group mb-3"> <div class="custom-control custom-checkbox"> <input type="checkbox" class="custom-control-input" id="checkmeout0"> <label class="custom-control-label" for="checkmeout0">Check me out !</label> </div> </div> <button type="submit" class="btn btn-primary waves-effect waves-light">Submit</button> </form> </div> <!-- end card-body--> </div> <!-- end card--> <div class="card"> <div class="card-body"> <h4 class="card-title">Horizontal Form</h4> <p class="card-subtitle mb-4">Create horizontal forms with the grid by adding the <code>.row</code> class to form groups and using the <code>.col-*-*</code> classes to specify the width of your labels and controls. Be sure to add <code>.col-form-label</code> to your <code>&lt;label&gt;</code>s as well so they’re vertically centered with their associated form controls.</p> <form class="form-horizontal"> <div class="form-group row mb-3"> <label for="inputEmail3" class="col-3 col-form-label">Email</label> <div class="col-9"> <input type="email" class="form-control" id="inputEmail3" placeholder="Email"> </div> </div> <div class="form-group row mb-3"> <label for="inputPassword3" class="col-3 col-form-label">Password</label> <div class="col-9"> <input type="password" class="form-control" id="inputPassword3" placeholder="Password"> </div> </div> <div class="form-group row mb-3"> <label for="inputPassword5" class="col-3 col-form-label">Re Password</label> <div class="col-9"> <input type="password" class="form-control" id="inputPassword5" placeholder="Retype Password"> </div> </div> <div class="form-group row mb-3 justify-content-end"> <div class="col-9"> <div class="custom-control custom-checkbox"> <input type="checkbox" class="custom-control-input" id="checkmeout"> <label class="custom-control-label" for="checkmeout">Check me out !</label> </div> </div> </div> <div class="form-group mb-0 justify-content-end row"> <div class="col-9"> <button type="submit" class="btn btn-info waves-effect waves-light">Sign in</button> </div> </div> </form> </div> <!-- end card-body--> </div> <!-- end card--> </div> <!-- end col --> <div class="col-xl-6"> <div class="card"> <div class="card-body"> <h4 class="card-title">Checkboxes and Radios</h4> <p class="card-subtitle mb-4">Each checkbox and radio <code>&lt;input&gt;</code> and <code>&lt;label&gt;</code> pairing is wrapped in a <code>&lt;div&gt;</code> to create our custom control. Structurally, this is the same approach as our default <code>.form-check</code>.</p> <h6>Checkboxes</h6> <!-- Checkboxes--> <div class="mt-3"> <div class="custom-control custom-checkbox"> <input type="checkbox" class="custom-control-input" id="customCheck1"> <label class="custom-control-label" for="customCheck1">Check this custom checkbox</label> </div> <div class="custom-control custom-checkbox"> <input type="checkbox" class="custom-control-input" id="customCheck2"> <label class="custom-control-label" for="customCheck2">Check this custom checkbox</label> </div> </div> <h6 class="mt-4">Inline Checkbox</h6> <!-- Inline--> <div class="mt-3"> <div class="custom-control custom-checkbox custom-control-inline"> <input type="checkbox" class="custom-control-input" id="customCheck3"> <label class="custom-control-label" for="customCheck3">Check this custom checkbox</label> </div> <div class="custom-control custom-checkbox custom-control-inline"> <input type="checkbox" class="custom-control-input" id="customCheck4"> <label class="custom-control-label" for="customCheck4">Check this custom checkbox</label> </div> </div> <!-- Disabled--> <div class="mt-2"> <div class="custom-control custom-checkbox custom-control-inline"> <input type="checkbox" class="custom-control-input" id="customCheck5" checked disabled> <label class="custom-control-label" for="customCheck5">Check this custom checkbox</label> </div> <div class="custom-control custom-checkbox custom-control-inline"> <input type="checkbox" class="custom-control-input" id="customCheck6" disabled> <label class="custom-control-label" for="customCheck6">Check this custom checkbox</label> </div> </div> <h6 class="mt-4">Radios</h6> <!-- Radios--> <div class="mt-3"> <div class="custom-control custom-radio"> <input type="radio" id="customRadio1" name="customRadio" class="custom-control-input"> <label class="custom-control-label" for="customRadio1">Toggle this custom radio</label> </div> <div class="custom-control custom-radio"> <input type="radio" id="customRadio2" name="customRadio" class="custom-control-input"> <label class="custom-control-label" for="customRadio2">Or toggle this other custom radio</label> </div> </div> <!-- Inline--> <h6 class="mt-4">Inline Radios</h6> <div class="mt-3"> <div class="custom-control custom-radio custom-control-inline"> <input type="radio" id="customRadio3" name="customRadio1" class="custom-control-input"> <label class="custom-control-label" for="customRadio3">Toggle this custom radio</label> </div> <div class="custom-control custom-radio custom-control-inline"> <input type="radio" id="customRadio4" name="customRadio1" class="custom-control-input"> <label class="custom-control-label" for="customRadio4">Or toggle this other custom radio</label> </div> </div> <!-- Disabled--> <div class="mt-2"> <div class="custom-control custom-radio custom-control-inline"> <input type="radio" id="customRadio5" name="customRadio2" class="custom-control-input" disabled> <label class="custom-control-label" for="customRadio5">Toggle this custom radio</label> </div> <div class="custom-control custom-radio custom-control-inline"> <input type="radio" id="customRadio6" name="customRadio2" class="custom-control-input" checked disabled> <label class="custom-control-label" for="customRadio6">Or toggle this other custom radio</label> </div> </div> </div> <!-- end card-body--> </div> <!-- end card--> <div class="card"> <div class="card-body"> <h4 class="card-title">Sizing</h4> <p class="card-subtitle mb-4">Set heights using classes like <code>.form-control-lg</code> and <code>.form-control-sm</code>.</p> <h6 class="mb-3">Input Sizing</h6> <input class="form-control form-control-lg mb-3" type="text" placeholder=".form-control-lg"> <input class="form-control mb-3" type="text" placeholder="Default input"> <input class="form-control form-control-sm" type="text" placeholder=".form-control-sm"> <h6 class="mt-4 mb-3">Select Sizing</h6> <select class="form-control form-control-lg mb-3"> <option>Large select</option> </select> <select class="form-control mb-3"> <option>Default select</option> </select> <select class="form-control form-control-sm"> <option>Small select</option> </select> </div> <!-- end card-body--> </div> <!-- end card --> <div class="card"> <div class="card-body"> <h4 class="card-title">Horizontal Form Label Sizing</h4> <p class="card-subtitle mb-4">Be sure to use <code>.col-form-label-sm</code> or <code>.col-form-label-lg</code> to your <code>&lt;label&gt;</code>s or <code>&lt;legend&gt;</code>s to correctly follow the size of <code>.form-control-lg</code> and <code>.form-control-sm</code>.</p> <form> <div class="form-group row"> <label for="colFormLabelSm" class="col-sm-2 col-form-label col-form-label-sm">Email</label> <div class="col-sm-10"> <input type="email" class="form-control form-control-sm" id="colFormLabelSm" placeholder="col-form-label-sm"> </div> </div> <div class="form-group row"> <label for="colFormLabel" class="col-sm-2 col-form-label">Email</label> <div class="col-sm-10"> <input type="email" class="form-control" id="colFormLabel" placeholder="col-form-label"> </div> </div> <div class="form-group row mb-0"> <label for="colFormLabelLg" class="col-sm-2 col-form-label col-form-label-lg">Email</label> <div class="col-sm-10"> <input type="email" class="form-control form-control-lg" id="colFormLabelLg" placeholder="col-form-label-lg"> </div> </div> </form> </div> <!-- end card-body--> </div> <!-- end card --> <div class="card"> <div class="card-body"> <h4 class="card-title">Input Group</h4> <p class="card-subtitle mb-4">Easily extend form controls by adding text, buttons, or button groups on either side of textual inputs, custom selects, and custom file inputs</p> <div class="form-group"> <label>Static</label> <div class="input-group"> <div class="input-group-prepend"> <span class="input-group-text" id="basic-addon1">@</span> </div> <input type="text" class="form-control" placeholder="Username" aria-label="Username" aria-describedby="basic-addon1"> </div> </div> <div class="form-group"> <label>Dropdowns</label> <div class="input-group"> <div class="input-group-prepend"> <button class="btn btn-primary dropdown-toggle waves-effect waves-light" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</button> <div class="dropdown-menu"> <a class="dropdown-item" href="#">Action</a> <a class="dropdown-item" href="#">Another action</a> <a class="dropdown-item" href="#">Something else here</a> </div> </div> <input type="text" class="form-control" placeholder="" aria-label="" aria-describedby="basic-addon1"> </div> </div> <div class="form-group"> <label>Buttons</label> <div class="input-group"> <input type="text" class="form-control" placeholder="Recipient's username" aria-label="Recipient's username"> <div class="input-group-append"> <button class="btn btn-dark waves-effect waves-light" type="button">Button</button> </div> </div> </div> </div> <!-- end card-body--> </div> <!-- end card--> <div class="card"> <div class="card-body"> <h4 class="card-title">Inline Form</h4> <p class="card-subtitle mb-4">Use the <code>.form-inline</code> class to display a series of labels, form controls, and buttons on a single horizontal row. Form controls within inline forms vary slightly from their default states. Controls only appear inline in viewports that are at least 576px wide to account for narrow viewports on mobile devices.</p> <form class="form-inline"> <div class="form-group"> <label for="staticEmail2" class="sr-only">Email</label> <input type="text" readonly class="form-control-plaintext" id="staticEmail2" value="email@example.com"> </div> <div class="form-group mx-sm-3"> <label for="inputPassword2" class="sr-only">Password</label> <input type="password" class="form-control" id="inputPassword2" placeholder="Password"> </div> <button type="submit" class="btn btn-primary waves-effect waves-light">Confirm identity</button> </form> <!-- Auto-sizing --> <h6 class="mt-4 mb-3">Auto Sizing</h6> <form> <div class="form-row align-items-center"> <div class="col-auto"> <label class="sr-only" for="inlineFormInput">Name</label> <input type="text" class="form-control mb-2" id="inlineFormInput" placeholder="Jane Doe"> </div> <div class="col-auto"> <label class="sr-only" for="inlineFormInputGroup">Username</label> <div class="input-group mb-2"> <div class="input-group-prepend"> <div class="input-group-text">@</div> </div> <input type="text" class="form-control" id="inlineFormInputGroup" placeholder="Username"> </div> </div> <div class="col-auto"> <div class="custom-control custom-checkbox mb-2"> <input type="checkbox" class="custom-control-input" id="autoSizingCheck"> <label class="custom-control-label" for="autoSizingCheck">Remember me</label> </div> </div> <div class="col-auto"> <button type="submit" class="btn btn-primary mb-2 waves-effect waves-light">Submit</button> </div> </div> </form> </div> <!-- end card-body--> </div> <!-- end card--> </div> <!-- end col --> </div> <!-- end row--> </div> <!-- container-fluid --> </div> <!-- End Page-content --> <footer class="footer"> <div class="container-fluid"> <div class="row"> <div class="col-sm-6"> 2019 © Xacton. </div> <div class="col-sm-6"> <div class="text-sm-right d-none d-sm-block"> Design & Develop by Myra </div> </div> </div> </div> </footer> </div> <!-- end main content--> </div> <!-- END layout-wrapper --> <!-- Overlay--> <div class="menu-overlay"></div> <!-- jQuery --> <script src="assets/js/jquery.min.js"></script> <script src="assets/js/bootstrap.bundle.min.js"></script> <script src="assets/js/metismenu.min.js"></script> <script src="assets/js/waves.js"></script> <script src="assets/js/simplebar.min.js"></script> <!-- App js --> <script src="assets/js/theme.js"></script> </body> </html>