WebSVN - Integrator Subversion - Blame - Rev 1 - /DOCUMENTOS E ANALISE/telas/templates/admin3/components

Rev	Author	Line No.	Line
1	espaco	1	<!DOCTYPE html>
		2	<!--
		3	Template Name: Metronic - Responsive Admin Dashboard Template build with Twitter Bootstrap 3.3.2
		4	Version: 3.2.0
		5	Author: KeenThemes
		6	Website: http://www.keenthemes.com/
		7	Contact: support@keenthemes.com
		8	Follow: www.twitter.com/keenthemes
		9	Like: www.facebook.com/keenthemes
		10	Purchase: http://themeforest.net/item/metronic-responsive-admin-dashboard-template/4021469?ref=keenthemes
		11	License: You must have a valid license purchased only from themeforest(the above link) in order to legally use the theme for your project.
		12	-->
		13	<!--[if IE 8]> <html lang="en" class="ie8 no-js"> <![endif]-->
		14	<!--[if IE 9]> <html lang="en" class="ie9 no-js"> <![endif]-->
		15	<!--[if !IE]><!-->
		16	<html lang="en">
		17	<!--<![endif]-->
		18	<!-- BEGIN HEAD -->
		19	<head>
		20	<meta charset="utf-8"/>
		21	<title>Metronic \| Date & Time Pickers</title>
		22	<meta http-equiv="X-UA-Compatible" content="IE=edge">
		23	<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
		24	<meta http-equiv="Content-type" content="text/html; charset=utf-8">
		25	<meta content="" name="description"/>
		26	<meta content="" name="author"/>
		27	<!-- BEGIN GLOBAL MANDATORY STYLES -->
		28	<link href="http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700&subset=all" rel="stylesheet" type="text/css">
		29	<link href="../../assets/global/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
		30	<link href="../../assets/global/plugins/simple-line-icons/simple-line-icons.min.css" rel="stylesheet" type="text/css">
		31	<link href="../../assets/global/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css">
		32	<link href="../../assets/global/plugins/uniform/css/uniform.default.css" rel="stylesheet" type="text/css">
		33	<!-- END GLOBAL MANDATORY STYLES -->
		34	<!-- BEGIN PAGE LEVEL STYLES -->
		35	<link rel="stylesheet" type="text/css" href="../../assets/global/plugins/clockface/css/clockface.css"/>
		36	<link rel="stylesheet" type="text/css" href="../../assets/global/plugins/bootstrap-datepicker/css/datepicker3.css"/>
		37	<link rel="stylesheet" type="text/css" href="../../assets/global/plugins/bootstrap-timepicker/css/bootstrap-timepicker.min.css"/>
		38	<link rel="stylesheet" type="text/css" href="../../assets/global/plugins/bootstrap-colorpicker/css/colorpicker.css"/>
		39	<link rel="stylesheet" type="text/css" href="../../assets/global/plugins/bootstrap-daterangepicker/daterangepicker-bs3.css"/>
		40	<link rel="stylesheet" type="text/css" href="../../assets/global/plugins/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css"/>
		41	<!-- END PAGE LEVEL STYLES -->
		42	<!-- BEGIN THEME STYLES -->
		43	<link href="../../assets/global/css/components-rounded.css" id="style_components" rel="stylesheet" type="text/css">
		44	<link href="../../assets/global/css/plugins.css" rel="stylesheet" type="text/css">
		45	<link href="../../assets/admin/layout3/css/layout.css" rel="stylesheet" type="text/css">
		46	<link href="../../assets/admin/layout3/css/themes/default.css" rel="stylesheet" type="text/css" id="style_color">
		47	<link href="../../assets/admin/layout3/css/custom.css" rel="stylesheet" type="text/css">
		48	<!-- END THEME STYLES -->
		49	<link rel="shortcut icon" href="favicon.ico"/>
		50	</head>
		51	<!-- END HEAD -->
		52	<!-- BEGIN BODY -->
		53	<!-- DOC: Apply "page-header-menu-fixed" class to set the mega menu fixed -->
		54	<!-- DOC: Apply "page-header-top-fixed" class to set the top menu fixed -->
		55	<body>
		56	<!-- BEGIN HEADER -->
		57	<div class="page-header">
		58	<!-- BEGIN HEADER TOP -->
		59	<div class="page-header-top">
		60	<div class="container">
		61	<!-- BEGIN LOGO -->
		62	<div class="page-logo">
		63	<a href="index.html"><img src="../../assets/admin/layout3/img/logo-default.png" alt="logo" class="logo-default"></a>
		64	</div>
		65	<!-- END LOGO -->
		66	<!-- BEGIN RESPONSIVE MENU TOGGLER -->
		67	<a href="javascript:;" class="menu-toggler"></a>
		68	<!-- END RESPONSIVE MENU TOGGLER -->
		69	<!-- BEGIN TOP NAVIGATION MENU -->
		70	<div class="top-menu">
		71	<ul class="nav navbar-nav pull-right">
		72	<!-- BEGIN NOTIFICATION DROPDOWN -->
		73	<li class="dropdown dropdown-extended dropdown-dark dropdown-notification" id="header_notification_bar">
		74	<a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">
		75	<i class="icon-bell"></i>
		76	<span class="badge badge-default">7</span>
		77	</a>
		78	<ul class="dropdown-menu">
		79	<li class="external">
		80	<h3>You have <strong>12 pending</strong> tasks</h3>
		81	<a href="javascript:;">view all</a>
		82	</li>
		83	<li>
		84	<ul class="dropdown-menu-list scroller" style="height: 250px;" data-handle-color="#637283">
		85	<li>
		86	<a href="javascript:;">
		87	<span class="time">just now</span>
		88	<span class="details">
		89	<span class="label label-sm label-icon label-success">
		90	<i class="fa fa-plus"></i>
		91	</span>
		92	New user registered. </span>
		93	</a>
		94	</li>
		95	<li>
		96	<a href="javascript:;">
		97	<span class="time">3 mins</span>
		98	<span class="details">
		99	<span class="label label-sm label-icon label-danger">
		100	<i class="fa fa-bolt"></i>
		101	</span>
		102	Server #12 overloaded. </span>
		103	</a>
		104	</li>
		105	<li>
		106	<a href="javascript:;">
		107	<span class="time">10 mins</span>
		108	<span class="details">
		109	<span class="label label-sm label-icon label-warning">
		110	<i class="fa fa-bell-o"></i>
		111	</span>
		112	Server #2 not responding. </span>
		113	</a>
		114	</li>
		115	<li>
		116	<a href="javascript:;">
		117	<span class="time">14 hrs</span>
		118	<span class="details">
		119	<span class="label label-sm label-icon label-info">
		120	<i class="fa fa-bullhorn"></i>
		121	</span>
		122	Application error. </span>
		123	</a>
		124	</li>
		125	<li>
		126	<a href="javascript:;">
		127	<span class="time">2 days</span>
		128	<span class="details">
		129	<span class="label label-sm label-icon label-danger">
		130	<i class="fa fa-bolt"></i>
		131	</span>
		132	Database overloaded 68%. </span>
		133	</a>
		134	</li>
		135	<li>
		136	<a href="javascript:;">
		137	<span class="time">3 days</span>
		138	<span class="details">
		139	<span class="label label-sm label-icon label-danger">
		140	<i class="fa fa-bolt"></i>
		141	</span>
		142	A user IP blocked. </span>
		143	</a>
		144	</li>
		145	<li>
		146	<a href="javascript:;">
		147	<span class="time">4 days</span>
		148	<span class="details">
		149	<span class="label label-sm label-icon label-warning">
		150	<i class="fa fa-bell-o"></i>
		151	</span>
		152	Storage Server #4 not responding dfdfdfd. </span>
		153	</a>
		154	</li>
		155	<li>
		156	<a href="javascript:;">
		157	<span class="time">5 days</span>
		158	<span class="details">
		159	<span class="label label-sm label-icon label-info">
		160	<i class="fa fa-bullhorn"></i>
		161	</span>
		162	System Error. </span>
		163	</a>
		164	</li>
		165	<li>
		166	<a href="javascript:;">
		167	<span class="time">9 days</span>
		168	<span class="details">
		169	<span class="label label-sm label-icon label-danger">
		170	<i class="fa fa-bolt"></i>
		171	</span>
		172	Storage server failed. </span>
		173	</a>
		174	</li>
		175	</ul>
		176	</li>
		177	</ul>
		178	</li>
		179	<!-- END NOTIFICATION DROPDOWN -->
		180	<!-- BEGIN TODO DROPDOWN -->
		181	<li class="dropdown dropdown-extended dropdown-dark dropdown-tasks" id="header_task_bar">
		182	<a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">
		183	<i class="icon-calendar"></i>
		184	<span class="badge badge-default">3</span>
		185	</a>
		186	<ul class="dropdown-menu extended tasks">
		187	<li class="external">
		188	<h3>You have <strong>12 pending</strong> tasks</h3>
		189	<a href="javascript:;">view all</a>
		190	</li>
		191	<li>
		192	<ul class="dropdown-menu-list scroller" style="height: 275px;" data-handle-color="#637283">
		193	<li>
		194	<a href="javascript:;">
		195	<span class="task">
		196	<span class="desc">New release v1.2 </span>
		197	<span class="percent">30%</span>
		198	</span>
		199	<span class="progress">
		200	<span style="width: 40%;" class="progress-bar progress-bar-success" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"><span class="sr-only">40% Complete</span></span>
		201	</span>
		202	</a>
		203	</li>
		204	<li>
		205	<a href="javascript:;">
		206	<span class="task">
		207	<span class="desc">Application deployment</span>
		208	<span class="percent">65%</span>
		209	</span>
		210	<span class="progress">
		211	<span style="width: 65%;" class="progress-bar progress-bar-danger" aria-valuenow="65" aria-valuemin="0" aria-valuemax="100"><span class="sr-only">65% Complete</span></span>
		212	</span>
		213	</a>
		214	</li>
		215	<li>
		216	<a href="javascript:;">
		217	<span class="task">
		218	<span class="desc">Mobile app release</span>
		219	<span class="percent">98%</span>
		220	</span>
		221	<span class="progress">
		222	<span style="width: 98%;" class="progress-bar progress-bar-success" aria-valuenow="98" aria-valuemin="0" aria-valuemax="100"><span class="sr-only">98% Complete</span></span>
		223	</span>
		224	</a>
		225	</li>
		226	<li>
		227	<a href="javascript:;">
		228	<span class="task">
		229	<span class="desc">Database migration</span>
		230	<span class="percent">10%</span>
		231	</span>
		232	<span class="progress">
		233	<span style="width: 10%;" class="progress-bar progress-bar-warning" aria-valuenow="10" aria-valuemin="0" aria-valuemax="100"><span class="sr-only">10% Complete</span></span>
		234	</span>
		235	</a>
		236	</li>
		237	<li>
		238	<a href="javascript:;">
		239	<span class="task">
		240	<span class="desc">Web server upgrade</span>
		241	<span class="percent">58%</span>
		242	</span>
		243	<span class="progress">
		244	<span style="width: 58%;" class="progress-bar progress-bar-info" aria-valuenow="58" aria-valuemin="0" aria-valuemax="100"><span class="sr-only">58% Complete</span></span>
		245	</span>
		246	</a>
		247	</li>
		248	<li>
		249	<a href="javascript:;">
		250	<span class="task">
		251	<span class="desc">Mobile development</span>
		252	<span class="percent">85%</span>
		253	</span>
		254	<span class="progress">
		255	<span style="width: 85%;" class="progress-bar progress-bar-success" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100"><span class="sr-only">85% Complete</span></span>
		256	</span>
		257	</a>
		258	</li>
		259	<li>
		260	<a href="javascript:;">
		261	<span class="task">
		262	<span class="desc">New UI release</span>
		263	<span class="percent">38%</span>
		264	</span>
		265	<span class="progress progress-striped">
		266	<span style="width: 38%;" class="progress-bar progress-bar-important" aria-valuenow="18" aria-valuemin="0" aria-valuemax="100"><span class="sr-only">38% Complete</span></span>
		267	</span>
		268	</a>
		269	</li>
		270	</ul>
		271	</li>
		272	</ul>
		273	</li>
		274	<!-- END TODO DROPDOWN -->
		275	<li class="droddown dropdown-separator">
		276	<span class="separator"></span>
		277	</li>
		278	<!-- BEGIN INBOX DROPDOWN -->
		279	<li class="dropdown dropdown-extended dropdown-dark dropdown-inbox" id="header_inbox_bar">
		280	<a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">
		281	<span class="circle">3</span>
		282	<span class="corner"></span>
		283	</a>
		284	<ul class="dropdown-menu">
		285	<li class="external">
		286	<h3>You have <strong>7 New</strong> Messages</h3>
		287	<a href="javascript:;">view all</a>
		288	</li>
		289	<li>
		290	<ul class="dropdown-menu-list scroller" style="height: 275px;" data-handle-color="#637283">
		291	<li>
		292	<a href="inbox.html?a=view">
		293	<span class="photo">
		294	<img src="../../assets/admin/layout3/img/avatar2.jpg" class="img-circle" alt="">
		295	</span>
		296	<span class="subject">
		297	<span class="from">
		298	Lisa Wong </span>
		299	<span class="time">Just Now </span>
		300	</span>
		301	<span class="message">
		302	Vivamus sed auctor nibh congue nibh. auctor nibh auctor nibh... </span>
		303	</a>
		304	</li>
		305	<li>
		306	<a href="inbox.html?a=view">
		307	<span class="photo">
		308	<img src="../../assets/admin/layout3/img/avatar3.jpg" class="img-circle" alt="">
		309	</span>
		310	<span class="subject">
		311	<span class="from">
		312	Richard Doe </span>
		313	<span class="time">16 mins </span>
		314	</span>
		315	<span class="message">
		316	Vivamus sed congue nibh auctor nibh congue nibh. auctor nibh auctor nibh... </span>
		317	</a>
		318	</li>
		319	<li>
		320	<a href="inbox.html?a=view">
		321	<span class="photo">
		322	<img src="../../assets/admin/layout3/img/avatar1.jpg" class="img-circle" alt="">
		323	</span>
		324	<span class="subject">
		325	<span class="from">
		326	Bob Nilson </span>
		327	<span class="time">2 hrs </span>
		328	</span>
		329	<span class="message">
		330	Vivamus sed nibh auctor nibh congue nibh. auctor nibh auctor nibh... </span>
		331	</a>
		332	</li>
		333	<li>
		334	<a href="inbox.html?a=view">
		335	<span class="photo">
		336	<img src="../../assets/admin/layout3/img/avatar2.jpg" class="img-circle" alt="">
		337	</span>
		338	<span class="subject">
		339	<span class="from">
		340	Lisa Wong </span>
		341	<span class="time">40 mins </span>
		342	</span>
		343	<span class="message">
		344	Vivamus sed auctor 40% nibh congue nibh... </span>
		345	</a>
		346	</li>
		347	<li>
		348	<a href="inbox.html?a=view">
		349	<span class="photo">
		350	<img src="../../assets/admin/layout3/img/avatar3.jpg" class="img-circle" alt="">
		351	</span>
		352	<span class="subject">
		353	<span class="from">
		354	Richard Doe </span>
		355	<span class="time">46 mins </span>
		356	</span>
		357	<span class="message">
		358	Vivamus sed congue nibh auctor nibh congue nibh. auctor nibh auctor nibh... </span>
		359	</a>
		360	</li>
		361	</ul>
		362	</li>
		363	</ul>
		364	</li>
		365	<!-- END INBOX DROPDOWN -->
		366	<!-- BEGIN USER LOGIN DROPDOWN -->
		367	<li class="dropdown dropdown-user dropdown-dark">
		368	<a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">
		369	<img alt="" class="img-circle" src="../../assets/admin/layout3/img/avatar9.jpg">
		370	<span class="username username-hide-mobile">Nick</span>
		371	</a>
		372	<ul class="dropdown-menu dropdown-menu-default">
		373	<li>
		374	<a href="extra_profile.html">
		375	<i class="icon-user"></i> My Profile </a>
		376	</li>
		377	<li>
		378	<a href="page_calendar.html">
		379	<i class="icon-calendar"></i> My Calendar </a>
		380	</li>
		381	<li>
		382	<a href="inbox.html">
		383	<i class="icon-envelope-open"></i> My Inbox <span class="badge badge-danger">
		384	3 </span>
		385	</a>
		386	</li>
		387	<li>
		388	<a href="javascript:;">
		389	<i class="icon-rocket"></i> My Tasks <span class="badge badge-success">
		390	7 </span>
		391	</a>
		392	</li>
		393	<li class="divider">
		394	</li>
		395	<li>
		396	<a href="extra_lock.html">
		397	<i class="icon-lock"></i> Lock Screen </a>
		398	</li>
		399	<li>
		400	<a href="login.html">
		401	<i class="icon-key"></i> Log Out </a>
		402	</li>
		403	</ul>
		404	</li>
		405	<!-- END USER LOGIN DROPDOWN -->
		406	</ul>
		407	</div>
		408	<!-- END TOP NAVIGATION MENU -->
		409	</div>
		410	</div>
		411	<!-- END HEADER TOP -->
		412	<!-- BEGIN HEADER MENU -->
		413	<div class="page-header-menu">
		414	<div class="container">
		415	<!-- BEGIN HEADER SEARCH BOX -->
		416	<form class="search-form" action="extra_search.html" method="GET">
		417	<div class="input-group">
		418	<input type="text" class="form-control" placeholder="Search" name="query">
		419	<span class="input-group-btn">
		420	<a href="javascript:;" class="btn submit"><i class="icon-magnifier"></i></a>
		421	</span>
		422	</div>
		423	</form>
		424	<!-- END HEADER SEARCH BOX -->
		425	<!-- BEGIN MEGA MENU -->
		426	<!-- DOC: Apply "hor-menu-light" class after the "hor-menu" class below to have a horizontal menu with white background -->
		427	<!-- DOC: Remove data-hover="dropdown" and data-close-others="true" attributes below to disable the dropdown opening on mouse hover -->
		428	<div class="hor-menu ">
		429	<ul class="nav navbar-nav">
		430	<li>
		431	<a href="index.html">Dashboard</a>
		432	</li>
		433	<li class="menu-dropdown mega-menu-dropdown ">
		434	<a data-hover="megamenu-dropdown" data-close-others="true" data-toggle="dropdown" href="javascript:;" class="dropdown-toggle">
		435	Features <i class="fa fa-angle-down"></i>
		436	</a>
		437	<ul class="dropdown-menu" style="min-width: 710px">
		438	<li>
		439	<div class="mega-menu-content">
		440	<div class="row">
		441	<div class="col-md-4">
		442	<ul class="mega-menu-submenu">
		443	<li>
		444	<h3>eCommerce</h3>
		445	</li>
		446	<li>
		447	<a href="ecommerce_index.html" class="iconify">
		448	<i class="icon-home"></i>
		449	eCommerce </a>
		450	</li>
		451	<li>
		452	<a href="ecommerce_orders.html" class="iconify">
		453	<i class="icon-basket"></i>
		454	Manage Orders </a>
		455	</li>
		456	<li>
		457	<a href="ecommerce_orders_view.html" class="iconify">
		458	<i class="icon-tag"></i>
		459	Order View </a>
		460	</li>
		461	<li>
		462	<a href="ecommerce_products.html" class="iconify">
		463	<i class="icon-handbag"></i>
		464	Manage Products </a>
		465	</li>
		466	<li>
		467	<a href="ecommerce_products_edit.html" class="iconify">
		468	<i class="icon-pencil"></i>
		469	Product Edit </a>
		470	</li>
		471	</ul>
		472	</div>
		473	<div class="col-md-4">
		474	<ul class="mega-menu-submenu">
		475	<li>
		476	<h3>Layouts</h3>
		477	</li>
		478	<li>
		479	<a href="layout_fluid.html" class="iconify">
		480	<i class="icon-cursor-move"></i>
		481	Fluid Layout </a>
		482	</li>
		483	<li>
		484	<a href="layout_mega_menu_fixed.html" class="iconify">
		485	<i class="icon-pin"></i>
		486	Fixed Mega Menu </a>
		487	</li>
		488	<li>
		489	<a href="layout_top_bar_fixed.html" class="iconify">
		490	<i class="icon-bar-chart"></i>
		491	Fixed Top Bar </a>
		492	</li>
		493	<li>
		494	<a href="layout_light_header.html" class="iconify">
		495	<i class="icon-paper-plane"></i>
		496	Light Header Dropdowns </a>
		497	</li>
		498	<li>
		499	<a href="layout_blank_page.html" class="iconify">
		500	<i class="icon-doc"></i>
		501	Blank Page Layout </a>
		502	</li>
		503	</ul>
		504	</div>
		505	<div class="col-md-4">
		506	<ul class="mega-menu-submenu">
		507	<li>
		508	<h3>More Layouts</h3>
		509	</li>
		510	<li>
		511	<a href="layout_click_dropdowns.html" class="iconify">
		512	<i class="icon-speech"></i>
		513	Click vs. Hover Dropdowns </a>
		514	</li>
		515	<li>
		516	<a href="layout_fontawesome_icons.html" class="iconify">
		517	<i class="icon-link"></i>
		518	Layout with Fontawesome </a>
		519	</li>
		520	<li>
		521	<a href="layout_glyphicons.html" class="iconify">
		522	<i class="icon-settings"></i>
		523	Layout with Glyphicon </a>
		524	</li>
		525	<li>
		526	<a href="layout_language_bar.html" class="iconify">
		527	<i class="icon-globe"></i>
		528	Language Switch Bar </a>
		529	</li>
		530	<li>
		531	<a href="layout_disabled_menu.html" class="iconify">
		532	<i class=" icon-lock"></i>
		533	Disabled Menu Links </a>
		534	</li>
		535	</ul>
		536	</div>
		537	</div>
		538	</div>
		539	</li>
		540	</ul>
		541	</li>
		542	<li class="menu-dropdown mega-menu-dropdown mega-menu-full active">
		543	<a data-hover="megamenu-dropdown" data-close-others="true" data-toggle="dropdown" href="javascript:;" class="dropdown-toggle">
		544	UI Components <i class="fa fa-angle-down"></i>
		545	</a>
		546	<ul class="dropdown-menu">
		547	<li>
		548	<div class="mega-menu-content">
		549	<div class="row">
		550	<div class="col-md-3">
		551	<ul class="mega-menu-submenu">
		552	<li>
		553	<h3>UI Components</h3>
		554	</li>
		555	<li>
		556	<a href="ui_general.html">
		557	<i class="fa fa-angle-right"></i>
		558	General </a>
		559	</li>
		560	<li>
		561	<a href="ui_buttons.html">
		562	<i class="fa fa-angle-right"></i>
		563	Buttons </a>
		564	</li>
		565	<li>
		566	<a href="ui_icons.html">
		567	<i class="fa fa-angle-right"></i>
		568	Font Icons </a>
		569	</li>
		570	<li>
		571	<a href="ui_colors.html">
		572	<i class="fa fa-angle-right"></i>
		573	Flat UI Colors </a>
		574	</li>
		575	<li>
		576	<a href="ui_typography.html">
		577	<i class="fa fa-angle-right"></i>
		578	Typography </a>
		579	</li>
		580	<li>
		581	<a href="ui_tabs_accordions_navs.html">
		582	<i class="fa fa-angle-right"></i>
		583	Tabs, Accordions & Navs </a>
		584	</li>
		585	<li>
		586	<a href="ui_tree.html">
		587	<i class="fa fa-angle-right"></i>
		588	Tree View </a>
		589	</li>
		590	<li>
		591	<a href="ui_page_progress_style_1.html">
		592	<i class="fa fa-angle-right"></i>
		593	Page Progress Bar <span class="badge badge-roundless badge-warning">new</span></a>
		594	</li>
		595	<li>
		596	<a href="ui_blockui.html">
		597	<i class="fa fa-angle-right"></i>
		598	Block UI </a>
		599	</li>
		600	<li>
		601	<a href="ui_notific8.html">
		602	<i class="fa fa-angle-right"></i>
		603	Notific8 Notifications </a>
		604	</li>
		605	</ul>
		606	</div>
		607	<div class="col-md-3">
		608	<ul class="mega-menu-submenu">
		609	<li>
		610	<h3>More UI Components</h3>
		611	</li>
		612	<li>
		613	<a href="ui_toastr.html">
		614	<i class="fa fa-angle-right"></i>
		615	Toastr Notifications </a>
		616	</li>
		617	<li>
		618	<a href="ui_alert_dialog_api.html">
		619	<i class="fa fa-angle-right"></i>
		620	Alerts & Dialogs API <span class="badge badge-roundless badge-danger">new</span></a>
		621	</li>
		622	<li>
		623	<a href="ui_session_timeout.html">
		624	<i class="fa fa-angle-right"></i>
		625	Session Timeout </a>
		626	</li>
		627	<li>
		628	<a href="ui_idle_timeout.html">
		629	<i class="fa fa-angle-right"></i>
		630	User Idle Timeout </a>
		631	</li>
		632	<li>
		633	<a href="ui_modals.html">
		634	<i class="fa fa-angle-right"></i>
		635	Modals </a>
		636	</li>
		637	<li>
		638	<a href="ui_extended_modals.html">
		639	<i class="fa fa-angle-right"></i>
		640	Extended Modals </a>
		641	</li>
		642	<li>
		643	<a href="ui_tiles.html">
		644	<i class="fa fa-angle-right"></i>
		645	Tiles </a>
		646	</li>
		647	<li>
		648	<a href="ui_datepaginator.html">
		649	<i class="fa fa-angle-right"></i>
		650	Date Paginator </a>
		651	</li>
		652	<li>
		653	<a href="ui_nestable.html">
		654	<i class="fa fa-angle-right"></i>
		655	Nestable List </a>
		656	</li>
		657	</ul>
		658	</div>
		659	<div class="col-md-3">
		660	<ul class="mega-menu-submenu">
		661	<li>
		662	<h3>Form Stuff</h3>
		663	</li>
		664	<li>
		665	<a href="form_controls.html">
		666	<i class="fa fa-angle-right"></i>
		667	Form Controls </a>
		668	</li>
		669	<li>
		670	<a href="form_icheck.html">
		671	<i class="fa fa-angle-right"></i>
		672	iCheck Controls </a>
		673	</li>
		674	<li>
		675	<a href="form_layouts.html">
		676	<i class="fa fa-angle-right"></i>
		677	Form Layouts </a>
		678	</li>
		679	<li>
		680	<a href="form_editable.html">
		681	<i class="fa fa-angle-right"></i>
		682	Form X-editable <span class="badge badge-roundless badge-success">new</span></a>
		683	</li>
		684	<li>
		685	<a href="form_wizard.html">
		686	<i class="fa fa-angle-right"></i>
		687	Form Wizard </a>
		688	</li>
		689	<li>
		690	<a href="form_validation.html">
		691	<i class="fa fa-angle-right"></i>
		692	Form Validation </a>
		693	</li>
		694	<li>
		695	<a href="form_image_crop.html">
		696	<i class="fa fa-angle-right"></i>
		697	Image Cropping </a>
		698	</li>
		699	<li>
		700	<a href="form_fileupload.html">
		701	<i class="fa fa-angle-right"></i>
		702	Multiple File Upload </a>
		703	</li>
		704	<li>
		705	<a href="form_dropzone.html">
		706	<i class="fa fa-angle-right"></i>
		707	Dropzone File Upload </a>
		708	</li>
		709	</ul>
		710	</div>
		711	<div class="col-md-3">
		712	<ul class="mega-menu-submenu">
		713	<li>
		714	<h3>Form Components</h3>
		715	</li>
		716	<li class="active">
		717	<a href="components_pickers.html">
		718	<i class="fa fa-angle-right"></i>
		719	Date & Time Pickers </a>
		720	</li>
		721	<li>
		722	<a href="components_context_menu.html">
		723	<i class="fa fa-angle-right"></i>
		724	Context Menu </a>
		725	</li>
		726	<li>
		727	<a href="components_dropdowns.html">
		728	<i class="fa fa-angle-right"></i>
		729	Custom Dropdowns </a>
		730	</li>
		731	<li>
		732	<a href="components_form_tools.html">
		733	<i class="fa fa-angle-right"></i>
		734	Form Tools </a>
		735	</li>
		736	<li>
		737	<a href="components_editors.html">
		738	<i class="fa fa-angle-right"></i>
		739	Markdown & WYSIWYG Editors </a>
		740	</li>
		741	<li>
		742	<a href="components_ion_sliders.html">
		743	<i class="fa fa-angle-right"></i>
		744	Ion Range Sliders </a>
		745	</li>
		746	<li>
		747	<a href="components_noui_sliders.html">
		748	<i class="fa fa-angle-right"></i>
		749	NoUI Range Sliders </a>
		750	</li>
		751	<li>
		752	<a href="components_jqueryui_sliders.html">
		753	<i class="fa fa-angle-right"></i>
		754	jQuery UI Sliders </a>
		755	</li>
		756	<li>
		757	<a href="components_knob_dials.html">
		758	<i class="fa fa-angle-right"></i>
		759	Knob Circle Dials </a>
		760	</li>
		761	</ul>
		762	</div>
		763	</div>
		764	</div>
		765	</li>
		766	</ul>
		767	</li>
		768	<li class="menu-dropdown classic-menu-dropdown ">
		769	<a data-hover="megamenu-dropdown" data-close-others="true" data-toggle="dropdown" href="javascript:;">
		770	Extra <i class="fa fa-angle-down"></i>
		771	</a>
		772	<ul class="dropdown-menu pull-left">
		773	<li class=" dropdown-submenu">
		774	<a href=":;">
		775	<i class="icon-briefcase"></i>
		776	Data Tables </a>
		777	<ul class="dropdown-menu">
		778	<li class=" ">
		779	<a href="table_basic.html">
		780	Basic Datatables </a>
		781	</li>
		782	<li class=" ">
		783	<a href="table_tree.html">
		784	Tree Datatables </a>
		785	</li>
		786	<li class=" ">
		787	<a href="table_responsive.html">
		788	Responsive Datatables </a>
		789	</li>
		790	<li class=" ">
		791	<a href="table_managed.html">
		792	Managed Datatables </a>
		793	</li>
		794	<li class=" ">
		795	<a href="table_editable.html">
		796	Editable Datatables </a>
		797	</li>
		798	<li class=" ">
		799	<a href="table_advanced.html">
		800	Advanced Datatables </a>
		801	</li>
		802	<li class=" ">
		803	<a href="table_ajax.html">
		804	Ajax Datatables </a>
		805	</li>
		806	</ul>
		807	</li>
		808	<li class=" dropdown-submenu">
		809	<a href=":;">
		810	<i class="icon-wallet"></i>
		811	Portlets </a>
		812	<ul class="dropdown-menu">
		813	<li class=" ">
		814	<a href="portlet_general.html">
		815	General Portlets </a>
		816	</li>
		817	<li class=" ">
		818	<a href="portlet_general2.html">
		819	New Portlets #1 <span class="badge badge-roundless badge-danger">new</span>
		820	</a>
		821	</li>
		822	<li class=" ">
		823	<a href="portlet_general3.html">
		824	New Portlets #2 <span class="badge badge-roundless badge-danger">new</span>
		825	</a>
		826	</li>
		827	<li class=" ">
		828	<a href="portlet_ajax.html">
		829	Ajax Portlets </a>
		830	</li>
		831	<li class=" ">
		832	<a href="portlet_draggable.html">
		833	Draggable Portlets </a>
		834	</li>
		835	</ul>
		836	</li>
		837	<li class=" dropdown-submenu">
		838	<a href=":;">
		839	<i class="icon-bar-chart"></i>
		840	Charts </a>
		841	<ul class="dropdown-menu">
		842	<li class=" ">
		843	<a href="charts_amcharts.html">
		844	amChart </a>
		845	</li>
		846	<li class=" ">
		847	<a href="charts_flotcharts.html">
		848	Flotchart </a>
		849	</li>
		850	</ul>
		851	</li>
		852	<li class=" dropdown-submenu">
		853	<a href=":;">
		854	<i class="icon-pointer"></i>
		855	Maps </a>
		856	<ul class="dropdown-menu">
		857	<li class=" ">
		858	<a href="maps_google.html">
		859	Google Maps </a>
		860	</li>
		861	<li class=" ">
		862	<a href="maps_vector.html">
		863	Vector Maps </a>
		864	</li>
		865	</ul>
		866	</li>
		867	<li class=" dropdown-submenu">
		868	<a href=":;">
		869	<i class="icon-puzzle"></i>
		870	Multi Level </a>
		871	<ul class="dropdown-menu">
		872	<li class=" ">
		873	<a href="javascript:;">
		874	<i class="icon-settings"></i>
		875	Item 1 </a>
		876	</li>
		877	<li class=" ">
		878	<a href="javascript:;">
		879	<i class="icon-user"></i>
		880	Item 2 </a>
		881	</li>
		882	<li class=" ">
		883	<a href="javascript:;">
		884	<i class="icon-globe"></i>
		885	Item 3 </a>
		886	</li>
		887	<li class=" dropdown-submenu">
		888	<a href="#">
		889	<i class="icon-folder"></i>
		890	Sub Items </a>
		891	<ul class="dropdown-menu">
		892	<li class=" ">
		893	<a href="javascript:;">
		894	Item 1 </a>
		895	</li>
		896	<li class=" ">
		897	<a href="javascript:;">
		898	Item 2 </a>
		899	</li>
		900	<li class=" ">
		901	<a href="javascript:;">
		902	Item 3 </a>
		903	</li>
		904	<li class=" ">
		905	<a href="javascript:;">
		906	Item 4 </a>
		907	</li>
		908	</ul>
		909	</li>
		910	<li class=" ">
		911	<a href="javascript:;">
		912	<i class="icon-share"></i>
		913	Item 4 </a>
		914	</li>
		915	<li class=" ">
		916	<a href="javascript:;">
		917	<i class="icon-bar-chart"></i>
		918	Item 5 </a>
		919	</li>
		920	</ul>
		921	</li>
		922	</ul>
		923	</li>
		924	<li class="menu-dropdown mega-menu-dropdown mega-menu-full ">
		925	<a data-hover="megamenu-dropdown" data-close-others="true" data-toggle="dropdown" href="javascript:;" class="dropdown-toggle">
		926	Pages <i class="fa fa-angle-down"></i>
		927	</a>
		928	<ul class="dropdown-menu">
		929	<li>
		930	<div class="mega-menu-content">
		931	<div class="row">
		932	<div class="col-md-3">
		933	<ul class="mega-menu-submenu">
		934	<li>
		935	<h3>User Pages</h3>
		936	</li>
		937	<li>
		938	<a href="page_timeline.html">
		939	<i class="fa fa-angle-right"></i>
		940	New Timeline <span class="badge badge-warning">2</span></a>
		941	</li>
		942	<li>
		943	<a href="extra_profile.html">
		944	<i class="fa fa-angle-right"></i>
		945	New User Profile <span class="badge badge-success badge-roundless">new</span></a>
		946	</li>
		947	<li>
		948	<a href="page_todo.html">
		949	<i class="fa fa-angle-right"></i>
		950	Todo & Tasks <span class="badge badge-danger">4</span></a>
		951	</li>
		952	<li>
		953	<a href="inbox.html">
		954	<i class="fa fa-angle-right"></i>
		955	User Inbox <span class="badge badge-success">4</span></a>
		956	</li>
		957	<li>
		958	<a href="page_calendar.html">
		959	<i class="fa fa-angle-right"></i>
		960	User Calendar <span class="badge badge-warning">14</span></a>
		961	</li>
		962	<li>
		963	<a href="page_timeline_old.html">
		964	<i class="fa fa-angle-right"></i>
		965	Old Timeline <span class="badge badge-warning">2</span></a>
		966	</li>
		967	<li>
		968	<a href="extra_profile_old.html">
		969	<i class="fa fa-angle-right"></i>
		970	Old User Profile </a>
		971	</li>
		972	</ul>
		973	</div>
		974	<div class="col-md-3">
		975	<ul class="mega-menu-submenu">
		976	<li>
		977	<h3>General Pages</h3>
		978	</li>
		979	<li>
		980	<a href="extra_faq.html">
		981	<i class="fa fa-angle-right"></i>
		982	FAQ Page </a>
		983	</li>
		984	<li>
		985	<a href="page_portfolio.html">
		986	<i class="fa fa-angle-right"></i>
		987	Portfolio </a>
		988	</li>
		989	<li>
		990	<a href="page_timeline.html">
		991	<i class="fa fa-angle-right"></i>
		992	Timeline <span class="badge badge-info">4</span></a>
		993	</li>
		994	<li>
		995	<a href="page_coming_soon.html">
		996	<i class="fa fa-angle-right"></i>
		997	Coming Soon </a>
		998	</li>
		999	<li>
		1000	<a href="extra_invoice.html">
		1001	<i class="fa fa-angle-right"></i>
		1002	Invoice </a>
		1003	</li>
		1004	<li>
		1005	<a href="page_blog.html">
		1006	<i class="fa fa-angle-right"></i>
		1007	Blog </a>
		1008	</li>
		1009	<li>
		1010	<a href="page_blog_item.html">
		1011	<i class="fa fa-angle-right"></i>
		1012	Blog Post </a>
		1013	</li>
		1014	</ul>
		1015	</div>
		1016	<div class="col-md-3">
		1017	<ul class="mega-menu-submenu">
		1018	<li>
		1019	<h3>Custom Pages</h3>
		1020	</li>
		1021	<li>
		1022	<a href="page_news.html">
		1023	<i class="fa fa-angle-right"></i>
		1024	News <span class="badge badge-success">9</span></a>
		1025	</li>
		1026	<li>
		1027	<a href="page_news_item.html">
		1028	<i class="fa fa-angle-right"></i>
		1029	News View </a>
		1030	</li>
		1031	<li>
		1032	<a href="page_about.html">
		1033	<i class="fa fa-angle-right"></i>
		1034	About Us </a>
		1035	</li>
		1036	<li>
		1037	<a href="page_contact.html">
		1038	<i class="fa fa-angle-right"></i>
		1039	Contact Us </a>
		1040	</li>
		1041	<li>
		1042	<a href="extra_search.html">
		1043	<i class="fa fa-angle-right"></i>
		1044	Search Results </a>
		1045	</li>
		1046	<li>
		1047	<a href="extra_pricing_table.html">
		1048	<i class="fa fa-angle-right"></i>
		1049	Pricing Tables </a>
		1050	</li>
		1051	<li>
		1052	<a href="login.html">
		1053	<i class="fa fa-angle-right"></i>
		1054	Login Form 1 </a>
		1055	</li>
		1056	<li>
		1057	<a href="login_2.html">
		1058	<i class="fa fa-angle-right"></i>
		1059	Login Form 2 </a>
		1060	</li>
		1061	<li>
		1062	<a href="login_3.html">
		1063	<i class="fa fa-angle-right"></i>
		1064	Login Form 3 </a>
		1065	</li>
		1066	<li>
		1067	<a href="login_soft.html">
		1068	<i class="fa fa-angle-right"></i>
		1069	Login Form 4 </a>
		1070	</li>
		1071	</ul>
		1072	</div>
		1073	<div class="col-md-3">
		1074	<ul class="mega-menu-submenu">
		1075	<li>
		1076	<h3>Miscellaneous</h3>
		1077	</li>
		1078	<li>
		1079	<a href="extra_lock.html">
		1080	<i class="fa fa-angle-right"></i>
		1081	Lock Screen 1 </a>
		1082	</li>
		1083	<li>
		1084	<a href="extra_lock2.html">
		1085	<i class="fa fa-angle-right"></i>
		1086	Lock Screen 2 </a>
		1087	</li>
		1088	<li>
		1089	<a href="extra_404_option1.html">
		1090	<i class="fa fa-angle-right"></i>
		1091	404 Page Option 1 </a>
		1092	</li>
		1093	<li>
		1094	<a href="extra_404_option2.html">
		1095	<i class="fa fa-angle-right"></i>
		1096	404 Page Option 2 </a>
		1097	</li>
		1098	<li>
		1099	<a href="extra_404_option3.html">
		1100	<i class="fa fa-angle-right"></i>
		1101	404 Page Option 3 </a>
		1102	</li>
		1103	<li>
		1104	<a href="extra_500_option1.html">
		1105	<i class="fa fa-angle-right"></i>
		1106	500 Page Option 1 </a>
		1107	</li>
		1108	<li>
		1109	<a href="extra_500_option2.html">
		1110	<i class="fa fa-angle-right"></i>
		1111	500 Page Option 2 </a>
		1112	</li>
		1113	<li>
		1114	<a href="email_newsletter.html">
		1115	<i class="fa fa-angle-right"></i>
		1116	Newsletter Email Template </a>
		1117	</li>
		1118	<li>
		1119	<a href="email_system.html">
		1120	<i class="fa fa-angle-right"></i>
		1121	System Email Template </a>
		1122	</li>
		1123	</ul>
		1124	</div>
		1125	</div>
		1126	</div>
		1127	</li>
		1128	</ul>
		1129	</li>
		1130	<li class="menu-dropdown">
		1131	<a href="angularjs" target="_blank" class="tooltips" data-container="body" data-placement="bottom" data-html="true" data-original-title="AngularJS version demo">
		1132	AngularJS Version </a>
		1133	</li>
		1134	</ul>
		1135	</div>
		1136	<!-- END MEGA MENU -->
		1137	</div>
		1138	</div>
		1139	<!-- END HEADER MENU -->
		1140	</div>
		1141	<!-- END HEADER -->
		1142	<!-- BEGIN PAGE CONTAINER -->
		1143	<div class="page-container">
		1144	<!-- BEGIN PAGE HEAD -->
		1145	<div class="page-head">
		1146	<div class="container">
		1147	<!-- BEGIN PAGE TITLE -->
		1148	<div class="page-title">
		1149	<h1>Date & Time Pickers <small>date, daterange, datetime, time & color pickers</small></h1>
		1150	</div>
		1151	<!-- END PAGE TITLE -->
		1152	<!-- BEGIN PAGE TOOLBAR -->
		1153	<div class="page-toolbar">
		1154	<!-- BEGIN THEME PANEL -->
		1155	<div class="btn-group btn-theme-panel">
		1156	<a href="javascript:;" class="btn dropdown-toggle" data-toggle="dropdown">
		1157	<i class="icon-settings"></i>
		1158	</a>
		1159	<div class="dropdown-menu theme-panel pull-right dropdown-custom hold-on-click">
		1160	<div class="row">
		1161	<div class="col-md-6 col-sm-6 col-xs-12">
		1162	<h3>THEME COLORS</h3>
		1163	<div class="row">
		1164	<div class="col-md-6 col-sm-6 col-xs-12">
		1165	<ul class="theme-colors">
		1166	<li class="theme-color theme-color-default" data-theme="default">
		1167	<span class="theme-color-view"></span>
		1168	<span class="theme-color-name">Default</span>
		1169	</li>
		1170	<li class="theme-color theme-color-blue-hoki" data-theme="blue-hoki">
		1171	<span class="theme-color-view"></span>
		1172	<span class="theme-color-name">Blue Hoki</span>
		1173	</li>
		1174	<li class="theme-color theme-color-blue-steel" data-theme="blue-steel">
		1175	<span class="theme-color-view"></span>
		1176	<span class="theme-color-name">Blue Steel</span>
		1177	</li>
		1178	<li class="theme-color theme-color-yellow-orange" data-theme="yellow-orange">
		1179	<span class="theme-color-view"></span>
		1180	<span class="theme-color-name">Orange</span>
		1181	</li>
		1182	<li class="theme-color theme-color-yellow-crusta" data-theme="yellow-crusta">
		1183	<span class="theme-color-view"></span>
		1184	<span class="theme-color-name">Yellow Crusta</span>
		1185	</li>
		1186	</ul>
		1187	</div>
		1188	<div class="col-md-6 col-sm-6 col-xs-12">
		1189	<ul class="theme-colors">
		1190	<li class="theme-color theme-color-green-haze" data-theme="green-haze">
		1191	<span class="theme-color-view"></span>
		1192	<span class="theme-color-name">Green Haze</span>
		1193	</li>
		1194	<li class="theme-color theme-color-red-sunglo" data-theme="red-sunglo">
		1195	<span class="theme-color-view"></span>
		1196	<span class="theme-color-name">Red Sunglo</span>
		1197	</li>
		1198	<li class="theme-color theme-color-red-intense" data-theme="red-intense">
		1199	<span class="theme-color-view"></span>
		1200	<span class="theme-color-name">Red Intense</span>
		1201	</li>
		1202	<li class="theme-color theme-color-purple-plum" data-theme="purple-plum">
		1203	<span class="theme-color-view"></span>
		1204	<span class="theme-color-name">Purple Plum</span>
		1205	</li>
		1206	<li class="theme-color theme-color-purple-studio" data-theme="purple-studio">
		1207	<span class="theme-color-view"></span>
		1208	<span class="theme-color-name">Purple Studio</span>
		1209	</li>
		1210	</ul>
		1211	</div>
		1212	</div>
		1213	</div>
		1214	<div class="col-md-6 col-sm-6 col-xs-12 seperator">
		1215	<h3>LAYOUT</h3>
		1216	<ul class="theme-settings">
		1217	<li>
		1218	Theme Style
		1219	<select class="theme-setting theme-setting-style form-control input-sm input-small input-inline tooltips" data-original-title="Change theme style" data-container="body" data-placement="left">
		1220	<option value="boxed" selected="selected">Square corners</option>
		1221	<option value="rounded">Rounded corners</option>
		1222	</select>
		1223	</li>
		1224	<li>
		1225	Layout
		1226	<select class="theme-setting theme-setting-layout form-control input-sm input-small input-inline tooltips" data-original-title="Change layout type" data-container="body" data-placement="left">
		1227	<option value="boxed" selected="selected">Boxed</option>
		1228	<option value="fluid">Fluid</option>
		1229	</select>
		1230	</li>
		1231	<li>
		1232	Top Menu Style
		1233	<select class="theme-setting theme-setting-top-menu-style form-control input-sm input-small input-inline tooltips" data-original-title="Change top menu dropdowns style" data-container="body" data-placement="left">
		1234	<option value="dark" selected="selected">Dark</option>
		1235	<option value="light">Light</option>
		1236	</select>
		1237	</li>
		1238	<li>
		1239	Top Menu Mode
		1240	<select class="theme-setting theme-setting-top-menu-mode form-control input-sm input-small input-inline tooltips" data-original-title="Enable fixed(sticky) top menu" data-container="body" data-placement="left">
		1241	<option value="fixed">Fixed</option>
		1242	<option value="not-fixed" selected="selected">Not Fixed</option>
		1243	</select>
		1244	</li>
		1245	<li>
		1246	Mega Menu Style
		1247	<select class="theme-setting theme-setting-mega-menu-style form-control input-sm input-small input-inline tooltips" data-original-title="Change mega menu dropdowns style" data-container="body" data-placement="left">
		1248	<option value="dark" selected="selected">Dark</option>
		1249	<option value="light">Light</option>
		1250	</select>
		1251	</li>
		1252	<li>
		1253	Mega Menu Mode
		1254	<select class="theme-setting theme-setting-mega-menu-mode form-control input-sm input-small input-inline tooltips" data-original-title="Enable fixed(sticky) mega menu" data-container="body" data-placement="left">
		1255	<option value="fixed" selected="selected">Fixed</option>
		1256	<option value="not-fixed">Not Fixed</option>
		1257	</select>
		1258	</li>
		1259	</ul>
		1260	</div>
		1261	</div>
		1262	</div>
		1263	</div>
		1264	<!-- END THEME PANEL -->
		1265	</div>
		1266	<!-- END PAGE TOOLBAR -->
		1267	</div>
		1268	</div>
		1269	<!-- END PAGE HEAD -->
		1270	<!-- BEGIN PAGE CONTENT -->
		1271	<div class="page-content">
		1272	<div class="container">
		1273	<!-- BEGIN SAMPLE PORTLET CONFIGURATION MODAL FORM-->
		1274	<div class="modal fade" id="portlet-config" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		1275	<div class="modal-dialog">
		1276	<div class="modal-content">
		1277	<div class="modal-header">
		1278	<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
		1279	<h4 class="modal-title">Modal title</h4>
		1280	</div>
		1281	<div class="modal-body">
		1282	Widget settings form goes here
		1283	</div>
		1284	<div class="modal-footer">
		1285	<button type="button" class="btn blue">Save changes</button>
		1286	<button type="button" class="btn default" data-dismiss="modal">Close</button>
		1287	</div>
		1288	</div>
		1289	<!-- /.modal-content -->
		1290	</div>
		1291	<!-- /.modal-dialog -->
		1292	</div>
		1293	<!-- /.modal -->
		1294	<!-- END SAMPLE PORTLET CONFIGURATION MODAL FORM-->
		1295	<!-- BEGIN PAGE BREADCRUMB -->
		1296	<ul class="page-breadcrumb breadcrumb">
		1297	<li>
		1298	<a href="#">Home</a><i class="fa fa-circle"></i>
		1299	</li>
		1300	<li>
		1301	<a href="components_pickers.html">UI Components</a>
		1302	<i class="fa fa-circle"></i>
		1303	</li>
		1304	<li class="active">
		1305	Date & Time Pickers
		1306	</li>
		1307	</ul>
		1308	<!-- END PAGE BREADCRUMB -->
		1309	<!-- BEGIN PAGE CONTENT INNER -->
		1310	<div class="row">
		1311	<div class="col-md-12">
		1312	<!-- BEGIN PORTLET-->
		1313	<div class="portlet light form-fit">
		1314	<div class="portlet-title">
		1315	<div class="caption">
		1316	<i class="fa fa-cogs font-green-sharp"></i>
		1317	<span class="caption-subject font-green-sharp bold uppercase">Date Pickers</span>
		1318	<span class="caption-helper">alert samples...</span>
		1319	</div>
		1320	<div class="tools">
		1321	<a href="javascript:;" class="collapse">
		1322	</a>
		1323	<a href="#portlet-config" data-toggle="modal" class="config">
		1324	</a>
		1325	<a href="javascript:;" class="reload">
		1326	</a>
		1327	<a href="javascript:;" class="remove">
		1328	</a>
		1329	</div>
		1330	</div>
		1331	<div class="portlet-body form">
		1332	<!-- BEGIN FORM-->
		1333	<form action="javascript:;" class="form-horizontal form-bordered">
		1334	<div class="form-body">
		1335	<div class="form-group">
		1336	<label class="control-label col-md-3">Default Datepicker</label>
		1337	<div class="col-md-3">
		1338	<input class="form-control form-control-inline input-medium date-picker" size="16" type="text" value=""/>
		1339	<span class="help-block">
		1340	Select date </span>
		1341	</div>
		1342	</div>
		1343	<div class="form-group">
		1344	<label class="control-label col-md-3">Disable Past Dates</label>
		1345	<div class="col-md-3">
		1346	<div class="input-group input-medium date date-picker" data-date-format="dd-mm-yyyy" data-date-start-date="+0d">
		1347	<input type="text" class="form-control" readonly>
		1348	<span class="input-group-btn">
		1349	<button class="btn default" type="button"><i class="fa fa-calendar"></i></button>
		1350	</span>
		1351	</div>
		1352	<!-- /input-group -->
		1353	<span class="help-block">
		1354	Select date </span>
		1355	</div>
		1356	</div>
		1357	<div class="form-group">
		1358	<label class="control-label col-md-3">Start With Years</label>
		1359	<div class="col-md-3">
		1360	<div class="input-group input-medium date date-picker" data-date="12-02-2012" data-date-format="dd-mm-yyyy" data-date-viewmode="years">
		1361	<input type="text" class="form-control" readonly>
		1362	<span class="input-group-btn">
		1363	<button class="btn default" type="button"><i class="fa fa-calendar"></i></button>
		1364	</span>
		1365	</div>
		1366	<!-- /input-group -->
		1367	<span class="help-block">
		1368	Select date </span>
		1369	</div>
		1370	</div>
		1371	<div class="form-group">
		1372	<label class="control-label col-md-3">Months Only</label>
		1373	<div class="col-md-3">
		1374	<div class="input-group input-medium date date-picker" data-date="10/2012" data-date-format="mm/yyyy" data-date-viewmode="years" data-date-minviewmode="months">
		1375	<input type="text" class="form-control" readonly>
		1376	<span class="input-group-btn">
		1377	<button class="btn default" type="button"><i class="fa fa-calendar"></i></button>
		1378	</span>
		1379	</div>
		1380	<!-- /input-group -->
		1381	<span class="help-block">
		1382	Select month only </span>
		1383	</div>
		1384	</div>
		1385	<div class="form-group">
		1386	<label class="control-label col-md-3">Date Range</label>
		1387	<div class="col-md-4">
		1388	<div class="input-group input-large date-picker input-daterange" data-date="10/11/2012" data-date-format="mm/dd/yyyy">
		1389	<input type="text" class="form-control" name="from">
		1390	<span class="input-group-addon">
		1391	to </span>
		1392	<input type="text" class="form-control" name="to">
		1393	</div>
		1394	<!-- /input-group -->
		1395	<span class="help-block">
		1396	Select date range </span>
		1397	</div>
		1398	</div>
		1399	<div class="form-group">
		1400	<label class="control-label col-md-3">Inline</label>
		1401	<div class="col-md-3">
		1402	<div class="date-picker" data-date-format="mm/dd/yyyy">
		1403	</div>
		1404	</div>
		1405	</div>
		1406	<div class="form-group last">
		1407	<label class="control-label col-md-3"></label>
		1408	<div class="col-md-3">
		1409	<a class="btn yellow" href="#form_modal2" data-toggle="modal">
		1410	View Datepicker in modal <i class="fa fa-share"></i>
		1411	</a>
		1412	</div>
		1413	</div>
		1414	</div>
		1415	</form>
		1416	<div id="form_modal2" class="modal fade" role="dialog" aria-hidden="true">
		1417	<div class="modal-dialog">
		1418	<div class="modal-content">
		1419	<div class="modal-header">
		1420	<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
		1421	<h4 class="modal-title">Datepickers In Modal</h4>
		1422	</div>
		1423	<div class="modal-body">
		1424	<form action="javascript:;" class="form-horizontal">
		1425	<div class="form-group">
		1426	<label class="control-label col-md-4">Default Datepicker</label>
		1427	<div class="col-md-8">
		1428	<input class="form-control input-medium date-picker" size="16" type="text" value=""/>
		1429	</div>
		1430	</div>
		1431	<div class="form-group">
		1432	<label class="control-label col-md-4">Disable Past Dates</label>
		1433	<div class="col-md-8">
		1434	<div class="input-group input-medium date date-picker" data-date-format="dd-mm-yyyy" data-date-start-date="+0d">
		1435	<input type="text" class="form-control" readonly>
		1436	<span class="input-group-btn">
		1437	<button class="btn default" type="button"><i class="fa fa-calendar"></i></button>
		1438	</span>
		1439	</div>
		1440	<!-- /input-group -->
		1441	<span class="help-block">
		1442	Select date </span>
		1443	</div>
		1444	</div>
		1445	<div class="form-group">
		1446	<label class="control-label col-md-4">Start With Years</label>
		1447	<div class="col-md-8">
		1448	<div class="input-group input-medium date date-picker" data-date="12-02-2012" data-date-format="dd-mm-yyyy" data-date-viewmode="years">
		1449	<input type="text" class="form-control" readonly>
		1450	<span class="input-group-btn">
		1451	<button class="btn default" type="button"><i class="fa fa-calendar"></i></button>
		1452	</span>
		1453	</div>
		1454	<!-- /input-group -->
		1455	</div>
		1456	</div>
		1457	<div class="form-group">
		1458	<label class="control-label col-md-4">Months Only</label>
		1459	<div class="col-md-8">
		1460	<div class="input-group input-medium date date-picker" data-date="10/2012" data-date-format="mm/yyyy" data-date-viewmode="years" data-date-minviewmode="months">
		1461	<input type="text" class="form-control" readonly>
		1462	<span class="input-group-btn">
		1463	<button class="btn default" type="button"><i class="fa fa-calendar"></i></button>
		1464	</span>
		1465	</div>
		1466	<!-- /input-group -->
		1467	</div>
		1468	</div>
		1469	<div class="form-group">
		1470	<label class="control-label col-md-4">Date Range</label>
		1471	<div class="col-md-8">
		1472	<div class="input-group input-medium date-picker input-daterange" data-date="10/11/2012" data-date-format="mm/dd/yyyy">
		1473	<input type="text" class="form-control" name="from">
		1474	<span class="input-group-addon">
		1475	to </span>
		1476	<input type="text" class="form-control" name="to">
		1477	</div>
		1478	<!-- /input-group -->
		1479	</div>
		1480	</div>
		1481	</form>
		1482	</div>
		1483	<div class="modal-footer">
		1484	<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
		1485	<button class="btn green" data-dismiss="modal">Save changes</button>
		1486	</div>
		1487	</div>
		1488	</div>
		1489	</div>
		1490	<!-- END FORM-->
		1491	</div>
		1492	</div>
		1493	<!-- END PORTLET-->
		1494	</div>
		1495	</div>
		1496	<div class="row">
		1497	<div class="col-md-12">
		1498	<!-- BEGIN PORTLET-->
		1499	<div class="portlet light form-fit">
		1500	<div class="portlet-title">
		1501	<div class="caption">
		1502	<i class="icon-calendar font-red-sunglo"></i>
		1503	<span class="caption-subject font-red-sunglo bold uppercase">Datetime Pickers</span>
		1504	<span class="caption-helper">alert samples...</span>
		1505	</div>
		1506	<div class="tools">
		1507	<a href="javascript:;" class="collapse">
		1508	</a>
		1509	<a href="#portlet-config" data-toggle="modal" class="config">
		1510	</a>
		1511	<a href="javascript:;" class="reload">
		1512	</a>
		1513	<a href="javascript:;" class="remove">
		1514	</a>
		1515	</div>
		1516	</div>
		1517	<div class="portlet-body form">
		1518	<!-- BEGIN FORM-->
		1519	<form action="javascript:;" class="form-horizontal form-bordered">
		1520	<div class="form-body">
		1521	<div class="form-group">
		1522	<label class="control-label col-md-3">Default Datetimepicker</label>
		1523	<div class="col-md-4">
		1524	<div class="input-group date form_datetime">
		1525	<input type="text" size="16" readonly class="form-control">
		1526	<span class="input-group-btn">
		1527	<button class="btn default date-set" type="button"><i class="fa fa-calendar"></i></button>
		1528	</span>
		1529	</div>
		1530	<!-- /input-group -->
		1531	</div>
		1532	</div>
		1533	<div class="form-group">
		1534	<label class="control-label col-md-3">Advance Datetimepicker</label>
		1535	<div class="col-md-4">
		1536	<div class="input-group date form_datetime" data-date="2012-12-21T15:25:00Z">
		1537	<input type="text" size="16" readonly class="form-control">
		1538	<span class="input-group-btn">
		1539	<button class="btn default date-reset" type="button"><i class="fa fa-times"></i></button>
		1540	<button class="btn default date-set" type="button"><i class="fa fa-calendar"></i></button>
		1541	</span>
		1542	</div>
		1543	<!-- /input-group -->
		1544	</div>
		1545	</div>
		1546	<div class="form-group">
		1547	<label class="control-label col-md-3">Meridian Format</label>
		1548	<div class="col-md-4">
		1549	<div class="input-group date form_meridian_datetime" data-date="2012-12-21T15:25:00Z">
		1550	<input type="text" size="16" class="form-control">
		1551	<span class="input-group-btn">
		1552	<button class="btn default date-reset" type="button"><i class="fa fa-times"></i></button>
		1553	<button class="btn default date-set" type="button"><i class="fa fa-calendar"></i></button>
		1554	</span>
		1555	</div>
		1556	<!-- /input-group -->
		1557	</div>
		1558	</div>
		1559	<div class="form-group">
		1560	<label class="control-label col-md-3">Inline</label>
		1561	<div class="col-md-4">
		1562	<div class="form_datetime" data-date="2012-12-21T15:25:00Z">
		1563	</div>
		1564	<!-- /input-group -->
		1565	</div>
		1566	</div>
		1567	<div class="form-group last">
		1568	<label class="control-label col-md-3"></label>
		1569	<div class="col-md-4">
		1570	<a class="btn yellow" href="#form_modal1" data-toggle="modal">
		1571	View Datetimepicker in modal <i class="fa fa-share"></i>
		1572	</a>
		1573	</div>
		1574	</div>
		1575	</div>
		1576	<div class="form-actions">
		1577	<div class="row">
		1578	<div class="col-md-offset-3 col-md-9">
		1579	<button type="submit" class="btn purple"><i class="fa fa-check"></i> Submit</button>
		1580	<button type="button" class="btn default">Cancel</button>
		1581	</div>
		1582	</div>
		1583	</div>
		1584	</form>
		1585	<div id="form_modal1" class="modal fade" role="dialog" aria-hidden="true">
		1586	<div class="modal-dialog">
		1587	<div class="modal-content">
		1588	<div class="modal-header">
		1589	<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
		1590	<h4 class="modal-title">Datetimepicker in Modal</h4>
		1591	</div>
		1592	<div class="modal-body">
		1593	<form action="javascript:;" class="form-horizontal">
		1594	<div class="form-group">
		1595	<label class="control-label col-md-4">Default Datetimepicker</label>
		1596	<div class="col-md-8">
		1597	<div class="input-group date form_datetime input-medium">
		1598	<input type="text" size="16" readonly class="form-control">
		1599	<span class="input-group-btn">
		1600	<button class="btn default date-set" type="button"><i class="fa fa-calendar"></i></button>
		1601	</span>
		1602	</div>
		1603	<!-- /input-group -->
		1604	</div>
		1605	</div>
		1606	<div class="form-group">
		1607	<label class="control-label col-md-4">Advance Datetimepicker</label>
		1608	<div class="col-md-8">
		1609	<div class="input-group date form_datetime input-large" data-date="2012-12-21T15:25:00Z">
		1610	<input type="text" size="16" readonly class="form-control">
		1611	<span class="input-group-btn">
		1612	<button class="btn default date-reset" type="button"><i class="fa fa-times"></i></button>
		1613	<button class="btn default date-set" type="button"><i class="fa fa-calendar"></i></button>
		1614	</span>
		1615	</div>
		1616	<!-- /input-group -->
		1617	</div>
		1618	</div>
		1619	<div class="form-group">
		1620	<label class="control-label col-md-4">Meridian Format</label>
		1621	<div class="col-md-8">
		1622	<div class="input-group date form_meridian_datetime input-large" data-date="2012-12-21T15:25:00Z">
		1623	<input type="text" size="16" class="form-control">
		1624	<span class="input-group-btn">
		1625	<button class="btn default date-reset" type="button"><i class="fa fa-times"></i></button>
		1626	<button class="btn default date-set" type="button"><i class="fa fa-calendar"></i></button>
		1627	</span>
		1628	</div>
		1629	<!-- /input-group -->
		1630	</div>
		1631	</div>
		1632	</form>
		1633	</div>
		1634	<div class="modal-footer">
		1635	<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
		1636	<button class="btn green btn-primary" data-dismiss="modal">Save changes</button>
		1637	</div>
		1638	</div>
		1639	</div>
		1640	</div>
		1641	<!-- END FORM-->
		1642	</div>
		1643	</div>
		1644	<!-- END PORTLET-->
		1645	</div>
		1646	</div>
		1647	<div class="row">
		1648	<div class="col-md-12">
		1649	<!-- BEGIN PORTLET-->
		1650	<div class="portlet light">
		1651	<div class="portlet-title">
		1652	<div class="caption">
		1653	<i class="fa fa-cogs font-green-sharp"></i>
		1654	<span class="caption-subject font-green-sharp bold uppercase">Time Pickers</span>
		1655	</div>
		1656	<div class="tools">
		1657	<a href="javascript:;" class="collapse">
		1658	</a>
		1659	<a href="#portlet-config" data-toggle="modal" class="config">
		1660	</a>
		1661	<a href="javascript:;" class="reload">
		1662	</a>
		1663	<a href="javascript:;" class="remove">
		1664	</a>
		1665	</div>
		1666	</div>
		1667	<div class="portlet-body form">
		1668	<!-- BEGIN FORM-->
		1669	<form action="javascript:;" class="form-horizontal form-bordered">
		1670	<div class="form-body form">
		1671	<div class="form-group">
		1672	<label class="control-label col-md-3">Default Timepicker</label>
		1673	<div class="col-md-3">
		1674	<div class="input-icon">
		1675	<i class="fa fa-clock-o"></i>
		1676	<input type="text" class="form-control timepicker timepicker-default">
		1677	</div>
		1678	</div>
		1679	</div>
		1680	<div class="form-group">
		1681	<label class="control-label col-md-3">Without Seconds</label>
		1682	<div class="col-md-3">
		1683	<div class="input-group">
		1684	<input type="text" class="form-control timepicker timepicker-no-seconds">
		1685	<span class="input-group-btn">
		1686	<button class="btn default" type="button"><i class="fa fa-clock-o"></i></button>
		1687	</span>
		1688	</div>
		1689	</div>
		1690	</div>
		1691	<div class="form-group">
		1692	<label class="control-label col-md-3">24hr Timepicker</label>
		1693	<div class="col-md-3">
		1694	<div class="input-group">
		1695	<input type="text" class="form-control timepicker timepicker-24">
		1696	<span class="input-group-btn">
		1697	<button class="btn default" type="button"><i class="fa fa-clock-o"></i></button>
		1698	</span>
		1699	</div>
		1700	</div>
		1701	</div>
		1702	<div class="form-group">
		1703	<label class="control-label col-md-3"></label>
		1704	<div class="col-md-3">
		1705	<a class="btn yellow" href="#form_modal4" data-toggle="modal">
		1706	View Timepicker in modal <i class="fa fa-share"></i>
		1707	</a>
		1708	</div>
		1709	</div>
		1710	</div>
		1711	</form>
		1712	<div id="form_modal4" class="modal fade" aria-hidden="true">
		1713	<div class="modal-dialog">
		1714	<div class="modal-content">
		1715	<div class="modal-header">
		1716	<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
		1717	<h4 class="modal-title">Timepickers In Modal</h4>
		1718	</div>
		1719	<div class="modal-body">
		1720	<form action="javascript:;" class="form-horizontal">
		1721	<div class="form-group">
		1722	<label class="control-label col-md-4">Default Timepicker</label>
		1723	<div class="col-md-5">
		1724	<div class="input-icon">
		1725	<i class="fa fa-clock-o"></i>
		1726	<input type="text" class="form-control timepicker timepicker-default">
		1727	</div>
		1728	</div>
		1729	</div>
		1730	<div class="form-group">
		1731	<label class="control-label col-md-4">Without Seconds</label>
		1732	<div class="col-md-5">
		1733	<div class="input-group">
		1734	<input type="text" class="form-control timepicker timepicker-no-seconds">
		1735	<span class="input-group-btn">
		1736	<button class="btn default" type="button"><i class="fa fa-clock-o"></i></button>
		1737	</span>
		1738	</div>
		1739	</div>
		1740	</div>
		1741	<div class="form-group">
		1742	<label class="control-label col-md-4">24hr Timepicker</label>
		1743	<div class="col-md-5">
		1744	<div class="input-group">
		1745	<input type="text" class="form-control timepicker timepicker-24">
		1746	<span class="input-group-btn">
		1747	<button class="btn default" type="button"><i class="fa fa-clock-o"></i></button>
		1748	</span>
		1749	</div>
		1750	</div>
		1751	</div>
		1752	</form>
		1753	</div>
		1754	<div class="modal-footer">
		1755	<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
		1756	<button class="btn green btn-primary" data-dismiss="modal">Save changes</button>
		1757	</div>
		1758	</div>
		1759	</div>
		1760	</div>
		1761	<!-- END FORM-->
		1762	</div>
		1763	</div>
		1764	<!-- END PORTLET-->
		1765	</div>
		1766	</div>
		1767	<div class="row">
		1768	<div class="col-md-12">
		1769	<!-- BEGIN PORTLET-->
		1770	<div class="portlet light">
		1771	<div class="portlet-title">
		1772	<div class="caption">
		1773	<i class="fa fa-cogs font-green-sharp"></i>
		1774	<span class="caption-subject font-green-sharp bold uppercase">Clockface Time Pickers</span>
		1775	</div>
		1776	<div class="tools">
		1777	<a href="javascript:;" class="collapse">
		1778	</a>
		1779	<a href="#portlet-config" data-toggle="modal" class="config">
		1780	</a>
		1781	<a href="javascript:;" class="reload">
		1782	</a>
		1783	<a href="javascript:;" class="remove">
		1784	</a>
		1785	</div>
		1786	</div>
		1787	<div class="portlet-body form">
		1788	<form action="javascript:;" class="form-horizontal form-bordered">
		1789	<div class="form-body">
		1790	<div class="form-group">
		1791	<label class="control-label col-md-3">Input</label>
		1792	<div class="col-md-3">
		1793	<input type="text" value="2:30 PM" data-format="hh:mm A" class="form-control clockface_1"/>
		1794	</div>
		1795	</div>
		1796	<div class="form-group">
		1797	<label class="control-label col-md-3">Button</label>
		1798	<div class="col-md-3">
		1799	<div class="input-group">
		1800	<input type="text" id="clockface_2" value="14:30" class="form-control" readonly=""/>
		1801	<span class="input-group-btn">
		1802	<button class="btn default" type="button" id="clockface_2_toggle"><i class="fa fa-clock-o"></i></button>
		1803	</span>
		1804	</div>
		1805	</div>
		1806	</div>
		1807	<div class="form-group">
		1808	<label class="control-label col-md-3">Inline</label>
		1809	<div class="col-md-4">
		1810	<div class="well clockface_3" style="padding: 0; width: 162px;">
		1811	</div>
		1812	</div>
		1813	</div>
		1814	<div class="form-group last">
		1815	<label class="control-label col-md-3"></label>
		1816	<div class="col-md-3">
		1817	<a class="btn yellow" href="#form_modal5" data-toggle="modal">
		1818	View Clockface Time Pickers in modal <i class="fa fa-share"></i>
		1819	</a>
		1820	</div>
		1821	</div>
		1822	</div>
		1823	</form>
		1824	<div id="form_modal5" class="modal fade" aria-hidden="true">
		1825	<div class="modal-dialog">
		1826	<div class="modal-content">
		1827	<div class="modal-header">
		1828	<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
		1829	<h4 class="modal-title">Clockface In Modal</h4>
		1830	</div>
		1831	<div class="modal-body">
		1832	<form action="javascript:;" class="form-horizontal">
		1833	<div class="form-group">
		1834	<label class="control-label col-md-3">Input</label>
		1835	<div class="col-md-4">
		1836	<input type="text" value="2:30 PM" data-format="hh:mm A" class="form-control clockface_1"/>
		1837	</div>
		1838	</div>
		1839	<div class="form-group">
		1840	<label class="control-label col-md-3">Button</label>
		1841	<div class="col-md-4">
		1842	<div class="input-group">
		1843	<input type="text" id="clockface_2_modal" value="14:30" class="form-control" readonly=""/>
		1844	<span class="input-group-btn">
		1845	<button class="btn default" type="button" id="clockface_2_modal_toggle"><i class="fa fa-clock-o"></i></button>
		1846	</span>
		1847	</div>
		1848	</div>
		1849	</div>
		1850	<div class="form-group">
		1851	<label class="control-label col-md-3">Inline</label>
		1852	<div class="col-md-4">
		1853	<div class="well clockface_3" style="padding: 0; width: 162px;">
		1854	</div>
		1855	</div>
		1856	</div>
		1857	</form>
		1858	</div>
		1859	<div class="modal-footer">
		1860	<button class="btn default" data-dismiss="modal" aria-hidden="true">Close</button>
		1861	<button class="btn green" data-dismiss="modal">Save changes</button>
		1862	</div>
		1863	</div>
		1864	</div>
		1865	</div>
		1866	</div>
		1867	</div>
		1868	</div>
		1869	</div>
		1870	<div class="row">
		1871	<div class="col-md-12">
		1872	<!-- BEGIN PORTLET-->
		1873	<div class="portlet light">
		1874	<div class="portlet-title">
		1875	<div class="caption">
		1876	<i class="fa fa-cogs font-green-sharp"></i>
		1877	<span class="caption-subject font-green-sharp bold uppercase">Daterangepickers</span>
		1878	</div>
		1879	<div class="tools">
		1880	<a href="javascript:;" class="collapse">
		1881	</a>
		1882	<a href="#portlet-config" data-toggle="modal" class="config">
		1883	</a>
		1884	<a href="javascript:;" class="reload">
		1885	</a>
		1886	<a href="javascript:;" class="remove">
		1887	</a>
		1888	</div>
		1889	</div>
		1890	<div class="portlet-body form">
		1891	<!-- BEGIN FORM-->
		1892	<form action="javascript:;" class="form-horizontal form-bordered">
		1893	<div class="form-body">
		1894	<div class="form-group">
		1895	<label class="control-label col-md-3">Default Date Ranges</label>
		1896	<div class="col-md-4">
		1897	<div class="input-group" id="defaultrange">
		1898	<input type="text" class="form-control">
		1899	<span class="input-group-btn">
		1900	<button class="btn default date-range-toggle" type="button"><i class="fa fa-calendar"></i></button>
		1901	</span>
		1902	</div>
		1903	</div>
		1904	</div>
		1905	<div class="form-group ">
		1906	<label class="control-label col-md-3">Advance Date Ranges</label>
		1907	<div class="col-md-4">
		1908	<div id="reportrange" class="btn default">
		1909	<i class="fa fa-calendar"></i>
		1910	<span>
		1911	</span>
		1912	<b class="fa fa-angle-down"></b>
		1913	</div>
		1914	</div>
		1915	</div>
		1916	<div class="form-group last">
		1917	<label class="control-label col-md-3"></label>
		1918	<div class="col-md-4">
		1919	<a class="btn yellow" href="#daterangepicker_modal" data-toggle="modal">
		1920	View Daterange Picker in modal <i class="fa fa-share"></i>
		1921	</a>
		1922	</div>
		1923	</div>
		1924	</div>
		1925	<div class="form-actions">
		1926	<div class="row">
		1927	<div class="col-md-offset-3 col-md-9">
		1928	<button type="submit" class="btn green"><i class="fa fa-check"></i> Submit</button>
		1929	<button type="button" class="btn default">Cancel</button>
		1930	</div>
		1931	</div>
		1932	</div>
		1933	</form>
		1934	<div id="daterangepicker_modal" class="modal fade" role="dialog" aria-hidden="true">
		1935	<div class="modal-dialog">
		1936	<div class="modal-content">
		1937	<div class="modal-header">
		1938	<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
		1939	<h4 class="modal-title">Daterange Picker in Modal</h4>
		1940	</div>
		1941	<div class="modal-body">
		1942	<form action="javascript:;" class="form-horizontal">
		1943	<div class="form-group">
		1944	<label class="control-label col-md-4">Default Date Ranges</label>
		1945	<div class="col-md-8">
		1946	<div class="input-group input-large" id="defaultrange_modal">
		1947	<input type="text" class="form-control">
		1948	<span class="input-group-btn">
		1949	<button class="btn default date-range-toggle" type="button"><i class="fa fa-calendar"></i></button>
		1950	</span>
		1951	</div>
		1952	</div>
		1953	</div>
		1954	</form>
		1955	</div>
		1956	<div class="modal-footer">
		1957	<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
		1958	<button class="btn green btn-primary" data-dismiss="modal">Save changes</button>
		1959	</div>
		1960	</div>
		1961	</div>
		1962	</div>
		1963	<!-- END FORM-->
		1964	</div>
		1965	</div>
		1966	<!-- END PORTLET-->
		1967	</div>
		1968	</div>
		1969	<div class="row">
		1970	<div class="col-md-12">
		1971	<!-- BEGIN PORTLET-->
		1972	<div class="portlet light">
		1973	<div class="portlet-title">
		1974	<div class="caption">
		1975	<i class="fa fa-cogs font-green-sharp"></i>
		1976	<span class="caption-subject font-green-sharp bold uppercase">Color Pickers</span>
		1977	</div>
		1978	<div class="tools">
		1979	<a href="javascript:;" class="collapse">
		1980	</a>
		1981	<a href="#portlet-config" data-toggle="modal" class="config">
		1982	</a>
		1983	<a href="javascript:;" class="reload">
		1984	</a>
		1985	<a href="javascript:;" class="remove">
		1986	</a>
		1987	</div>
		1988	</div>
		1989	<div class="portlet-body form">
		1990	<!-- BEGIN FORM-->
		1991	<form action="javascript:;" class="form-horizontal form-bordered">
		1992	<div class="form-body">
		1993	<div class="form-group">
		1994	<label class="control-label col-md-3">Default</label>
		1995	<div class="col-md-3">
		1996	<input type="text" class="colorpicker-default form-control" value="#8fff00"/>
		1997	</div>
		1998	</div>
		1999	<div class="form-group">
		2000	<label class="control-label col-md-3">RGBA</label>
		2001	<div class="col-md-3">
		2002	<input type="text" class="colorpicker-rgba form-control" value="rgb(0,194,255,0.78)" data-color-format="rgba"/>
		2003	</div>
		2004	</div>
		2005	<div class="form-group">
		2006	<label class="control-label col-md-3">As Component</label>
		2007	<div class="col-md-3">
		2008	<div class="input-group color colorpicker-default" data-color="#3865a8" data-color-format="rgba">
		2009	<input type="text" class="form-control" value="#3865a8" readonly>
		2010	<span class="input-group-btn">
		2011	<button class="btn default" type="button"><i style="background-color: #3865a8;"></i> </button>
		2012	</span>
		2013	</div>
		2014	<!-- /input-group -->
		2015	</div>
		2016	</div>
		2017	<div class="form-group last">
		2018	<label class="control-label col-md-3"></label>
		2019	<div class="col-md-4">
		2020	<a class="btn yellow" href="#form_modal3" data-toggle="modal">
		2021	View colorpicker in modal <i class="fa fa-share"></i>
		2022	</a>
		2023	</div>
		2024	</div>
		2025	</div>
		2026	</form>
		2027	<div id="form_modal3" class="modal fade" role="dialog" aria-hidden="true">
		2028	<div class="modal-dialog">
		2029	<div class="modal-content">
		2030	<div class="modal-header">
		2031	<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
		2032	<h4 class="modal-title">Colorpicker in Modal</h4>
		2033	</div>
		2034	<div class="modal-body">
		2035	<form action="javascript:;" class="form-horizontal">
		2036	<div class="form-group">
		2037	<label class="control-label col-md-3">Default</label>
		2038	<div class="col-md-5">
		2039	<input type="text" class="colorpicker-default form-control" value="#8fff00"/>
		2040	</div>
		2041	</div>
		2042	<div class="form-group">
		2043	<label class="control-label col-md-3">RGBA</label>
		2044	<div class="col-md-5">
		2045	<input type="text" class="colorpicker-rgba form-control" value="rgb(0,194,255,0.78)" data-color-format="rgba"/>
		2046	</div>
		2047	</div>
		2048	<div class="form-group last">
		2049	<label class="control-label col-md-3">As Component</label>
		2050	<div class="col-md-5">
		2051	<div class="input-group color colorpicker-default" data-color="#3865a8" data-color-format="rgba">
		2052	<input type="text" class="form-control" value="#3865a8" readonly>
		2053	<span class="input-group-btn">
		2054	<button class="btn default" type="button"><i style="background-color: #3865a8;"></i> </button>
		2055	</span>
		2056	</div>
		2057	<!-- /input-group -->
		2058	</div>
		2059	</div>
		2060	</form>
		2061	</div>
		2062	<div class="modal-footer">
		2063	<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
		2064	<button class="btn green btn-primary" data-dismiss="modal">Save changes</button>
		2065	</div>
		2066	</div>
		2067	</div>
		2068	</div>
		2069	<!-- END FORM-->
		2070	</div>
		2071	</div>
		2072	<!-- END PORTLET-->
		2073	</div>
		2074	</div>
		2075	<!-- END PAGE CONTENT INNER -->
		2076	</div>
		2077	</div>
		2078	<!-- END PAGE CONTENT -->
		2079	</div>
		2080	<!-- END PAGE CONTAINER -->
		2081	<!-- BEGIN PRE-FOOTER -->
		2082	<div class="page-prefooter">
		2083	<div class="container">
		2084	<div class="row">
		2085	<div class="col-md-3 col-sm-6 col-xs-12 footer-block">
		2086	<h2>About</h2>
		2087	<p>
		2088	Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam dolore.
		2089	</p>
		2090	</div>
		2091	<div class="col-md-3 col-sm-6 col-xs12 footer-block">
		2092	<h2>Subscribe Email</h2>
		2093	<div class="subscribe-form">
		2094	<form action="javascript:;">
		2095	<div class="input-group">
		2096	<input type="text" placeholder="mail@email.com" class="form-control">
		2097	<span class="input-group-btn">
		2098	<button class="btn" type="submit">Submit</button>
		2099	</span>
		2100	</div>
		2101	</form>
		2102	</div>
		2103	</div>
		2104	<div class="col-md-3 col-sm-6 col-xs-12 footer-block">
		2105	<h2>Follow Us On</h2>
		2106	<ul class="social-icons">
		2107	<li>
		2108	<a href="javascript:;" data-original-title="rss" class="rss"></a>
		2109	</li>
		2110	<li>
		2111	<a href="javascript:;" data-original-title="facebook" class="facebook"></a>
		2112	</li>
		2113	<li>
		2114	<a href="javascript:;" data-original-title="twitter" class="twitter"></a>
		2115	</li>
		2116	<li>
		2117	<a href="javascript:;" data-original-title="googleplus" class="googleplus"></a>
		2118	</li>
		2119	<li>
		2120	<a href="javascript:;" data-original-title="linkedin" class="linkedin"></a>
		2121	</li>
		2122	<li>
		2123	<a href="javascript:;" data-original-title="youtube" class="youtube"></a>
		2124	</li>
		2125	<li>
		2126	<a href="javascript:;" data-original-title="vimeo" class="vimeo"></a>
		2127	</li>
		2128	</ul>
		2129	</div>
		2130	<div class="col-md-3 col-sm-6 col-xs-12 footer-block">
		2131	<h2>Contacts</h2>
		2132	<address class="margin-bottom-40">
		2133	Phone: 800 123 3456<br>
		2134	Email: <a href="mailto:info@metronic.com">info@metronic.com</a>
		2135	</address>
		2136	</div>
		2137	</div>
		2138	</div>
		2139	</div>
		2140	<!-- END PRE-FOOTER -->
		2141	<!-- BEGIN FOOTER -->
		2142	<div class="page-footer">
		2143	<div class="container">
		2144	2014 © Metronic. All Rights Reserved.
		2145	</div>
		2146	</div>
		2147	<div class="scroll-to-top">
		2148	<i class="icon-arrow-up"></i>
		2149	</div>
		2150	<!-- END FOOTER -->
		2151	<!-- BEGIN JAVASCRIPTS(Load javascripts at bottom, this will reduce page load time) -->
		2152	<!-- BEGIN CORE PLUGINS -->
		2153	<!--[if lt IE 9]>
		2154	<script src="../../assets/global/plugins/respond.min.js"></script>
		2155	<script src="../../assets/global/plugins/excanvas.min.js"></script>
		2156	<![endif]-->
		2157	<script src="../../assets/global/plugins/jquery.min.js" type="text/javascript"></script>
		2158	<script src="../../assets/global/plugins/jquery-migrate.min.js" type="text/javascript"></script>
		2159	<!-- IMPORTANT! Load jquery-ui.min.js before bootstrap.min.js to fix bootstrap tooltip conflict with jquery ui tooltip -->
		2160	<script src="../../assets/global/plugins/jquery-ui/jquery-ui.min.js" type="text/javascript"></script>
		2161	<script src="../../assets/global/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
		2162	<script src="../../assets/global/plugins/bootstrap-hover-dropdown/bootstrap-hover-dropdown.min.js" type="text/javascript"></script>
		2163	<script src="../../assets/global/plugins/jquery-slimscroll/jquery.slimscroll.min.js" type="text/javascript"></script>
		2164	<script src="../../assets/global/plugins/jquery.blockui.min.js" type="text/javascript"></script>
		2165	<script src="../../assets/global/plugins/jquery.cokie.min.js" type="text/javascript"></script>
		2166	<script src="../../assets/global/plugins/uniform/jquery.uniform.min.js" type="text/javascript"></script>
		2167	<!-- END CORE PLUGINS -->
		2168	<!-- BEGIN PAGE LEVEL PLUGINS -->
		2169	<script type="text/javascript" src="../../assets/global/plugins/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
		2170	<script type="text/javascript" src="../../assets/global/plugins/bootstrap-timepicker/js/bootstrap-timepicker.min.js"></script>
		2171	<script type="text/javascript" src="../../assets/global/plugins/clockface/js/clockface.js"></script>
		2172	<script type="text/javascript" src="../../assets/global/plugins/bootstrap-daterangepicker/moment.min.js"></script>
		2173	<script type="text/javascript" src="../../assets/global/plugins/bootstrap-daterangepicker/daterangepicker.js"></script>
		2174	<script type="text/javascript" src="../../assets/global/plugins/bootstrap-colorpicker/js/bootstrap-colorpicker.js"></script>
		2175	<script type="text/javascript" src="../../assets/global/plugins/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
		2176	<!-- END PAGE LEVEL PLUGINS -->
		2177	<!-- BEGIN PAGE LEVEL SCRIPTS -->
		2178	<script src="../../assets/global/scripts/metronic.js" type="text/javascript"></script>
		2179	<script src="../../assets/admin/layout3/scripts/layout.js" type="text/javascript"></script>
		2180	<script src="../../assets/admin/layout3/scripts/demo.js" type="text/javascript"></script>
		2181	<script src="../../assets/admin/pages/scripts/components-pickers.js"></script>
		2182	<!-- END PAGE LEVEL SCRIPTS -->
		2183	<script>
		2184	jQuery(document).ready(function() {
		2185	// initiate layout and plugins
		2186	Metronic.init(); // init metronic core components
		2187	Layout.init(); // init current layout
		2188	Demo.init(); // init demo features
		2189	ComponentsPickers.init();
		2190	});
		2191	</script>
		2192	<!-- END JAVASCRIPTS -->
		2193	</body>
		2194	<!-- END BODY -->
		2195	</html>

Subversion Repositories Integrator Subversion

(root)/DOCUMENTOS E ANALISE/telas/templates/admin3/components_pickers.html - Rev 1