<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="container">
<div class="row">
<div class="col-md-12">
<nav id="navbar" class="navbar navbar-default yamm" role="navigation">
<div class="navbar-collapse collapse" id="navbar-collapsible">
<div class="navbar-btn navbar-left">
<button type="button" class="btn btn-nav btn-default dropdown-toggle" data-toggle="dropdown">
<span class="fa fa-bars"></span>
<span class="nav-label"> Menu</span>
</button>
<ul class="dropdown-menu col-lg-12">
<li class="">
<!--#INCLUDE FILE="yamm-content.asp"-->
</li>
</ul>
<button type="button" id="dashboard" class="btn btn-nav btn-default active" href="/sergiotest/support/tixdashboard/index.asp">
<span class="fa fa-dashboard nav-icon"></span>
<span class="nav-label">Dashboard</span>
</button>
</div>
<div class="navbar-btn navbar-right">
<div class="dropdown" id="preferences-dropdown">
<button type="button" class="btn btn-nav btn-default dropdown-toggle" data-toggle="dropdown">
<span class="glyphicon glyphicon-cog"></span>
<span class="nav-label"> Preferences</span>
</button>
<ul class="dropdown-menu" style="width:300px; padding:0px;">
<li>
<form class="form-horizontal" id="preferences" action="" method="post" accept-charset="utf-8">
<div class="panel panel-default" id="preferences" style="margin:0px;">
<div class="panel-heading">
<span class="panel-label">User Preferences</span>
</div>
<div class="panel-body">
<div class="form-group">
<label for="theme_name" class="col-lg-6 control-label">
Theme
</label>
<div class="col-lg-6">
<select class="form-control" id="theme_name" name="theme_name">
<option value="amelia"> Amelia </option>
<option value="cerulean"> Cerulean </option>
<option value="cosmo"> Cosmo </option>
<option value="cyborg"> Cyborg </option>
<option value="darkly"> Darkly </option>
<option value="bootstrap"> Default </option>
<option value="flatly"> Flatly </option>
<option value="journal"> Journal </option>
<option value="lumen"> Lumen </option>
<option value="readable"> Readable </option>
<option value="simplex"> Simplex </option>
<option value="slate"> Slate </option>
<option value="spacelab"> Spacelab </option>
<option value="superhero"> Superhero </option>
<option value="united"> United </option>
<option value="yeti"> Yeti </option>
</select>
</div>
</div>
<div class="form-group">
<label for="navbar_style" class="col-lg-6 control-label" >
Navbar Style
</label>
<div class="col-lg-6">
<select class="form-control" id="navbar_style" name="navbar_style">
<option value="navbar-default">Default</option>
<option value="navbar-inverse">Inverse</option>
</select>
</div>
</div>
<div class="form-group">
<label for="btn_style" class="col-lg-6 control-label" >
Nav Btn Style
</label>
<div class="col-lg-6">
<select class="form-control" id="btn_style" name="btn_style">
<option value="btn-primary">Primary</option>
<option value="btn-default">Default</option>
<option value="btn-success">Success</option>
<option value="btn-info">Info</option>
<option value="btn-warning">Warning</option>
<option value="btn-danger">Danger</option>
<option value="btn-inverse">Inverse</option>
</select>
</div>
</div>
<div class="form-group">
<label for="panel_style" class="col-lg-6 control-label" >
Panel Style
</label>
<div class="col-lg-6">
<select class="form-control" id="panel_style" name="panel_style">
<option value="panel-primary">Primary</option>
<option value="panel-default">Default</option>
<option value="panel-success">Success</option>
<option value="panel-info">Info</option>
<option value="panel-warning">Warning</option>
<option value="panel-danger">Danger</option>
</select>
</div>
</div>
<div class="form-group">
<label for="text_size" class="col-lg-6 control-label">
Icon Labels
</label>
<div class="col-lg-6">
<select class="form-control" id="display_label" name="display_label">
<option value="hide">Icons Only</option>
<option value="">Icons/Labels</option>
</select>
</div>
</div>
</div>
<div class="panel-footer">
<div class="form-group">
<div class="col-lg-12">
<button type="submit" class="btn btn-primary btn-block">Update</button>
<button type="submit" class="btn btn-default btn-block">Reset</button>
</div>
</div>
</div>
</div>
</form>
</li>
</ul>
</div>
</div>
<div class="navbar-btn navbar-right">
<button type="button" class="btn btn-nav btn-default"><span class="fa fa-bell"></span><span class="nav-label"> Alerts</span></button>
</div>
<form action="clientsearch/index.asp" method="post" class="navbar-form" name="search-form" id="search-form" accept-charset="utf-8">
<div class="form-group" style="display:inline;">
<div class="input-group">
<span class="input-group-btn btn-block" >
<button id="btn-search" class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">
<span class="glyphicon glyphicon-search"></span>
<span class="nav-label"> Search</span>
<span class="fa fa-caret-down"></span>
</button>
<ul id="search-option" class="dropdown-menu pull-left" role="menu">
<li>
<a href="#" data-searchtype="search-user" data-placeholder="Enter User Name (first, last or both)" data-toggle="tooltip" data-placement="right" title="Search Users">
<span class="glyphicon glyphicon-user"></span>
<span class="nav-label">User</span>
</a>
</li>
<li>
<a href="#" data-searchtype="search-org" data-placeholder="Enter Organization Name" data-toggle="tooltip" data-placement="right" title="Search Organizations">
<span class="fa fa-building-o"></span>
<span class="nav-label">Organization</span>
</a>
</li>
<li>
<a href="#" data-searchtype="search-kb" data-placeholder="Enter Search Terms" data-toggle="tooltip" data-placement="right" title="Search Knowledgebase">
<span class="fa fa-book"></span>
<span class="nav-label">KnowledgeBase</span>
</a>
</li>
<li>
<a href="#" data-searchtype="search-venue" data-placeholder="Enter Venue Name" data-toggle="tooltip" data-placement="right" title="Search Venues">
<span class="fa fa-map-marker"></span>
<span class="nav-label">Venue</span>
</a>
</li>
<li>
<a href="#" data-searchtype="search-pl" data-placeholder="Enter Private Label" data-toggle="tooltip" data-placement="right" title="Search Private Label">
<span class="fa fa-ticket"></span>
<span class="nav-label">Private Label</span>
</a>
</li>
</ul>
</span>
<div class="input-group col-lg-12 center-block ui-helper-clearfix">
<!--<input class="form-control" id="search-input" class="search-input" type="text" placeholder="blank placeholder"> -->
<input type="text" name="search-query" id="search-query" class="form-control green" autocomplete="off" placeholder=" << Please Select Search Type">
</div>
<div class="input-group-btn navbar-btn">
<button class="btn btn-default btn-nav">
GO
</button>
</div>
</div>
</div>
</form>
</div>
</nav>
<div class="panel panel-primary">
<nav id="navbar" class="navbar navbar-default yamm" role="navigation">
<div class="navbar-collapse collapse" id="navbar-collapsible">
<div class="navbar-header">
<a class="navbar-brand" href="#">Project name</a>
</div>
<div class="navbar-btn navbar-right">
<div class="dropdown" id="preferences-dropdown">
<button type="button" class="btn btn-nav btn-default dropdown-toggle" data-toggle="dropdown">
<span class="glyphicon glyphicon-cog"></span>
<span class="nav-label"> Preferences</span>
</button>
<ul class="dropdown-menu" style="width:300px; padding:0px;">
<li>
<form class="form-horizontal" id="preferences" action="" method="post" accept-charset="utf-8">
<div class="panel panel-default" id="preferences" style="margin:0px;">
<div class="panel-heading">
<span class="panel-label">User Preferences</span>
</div>
<div class="panel-body">
<div class="form-group">
<label for="theme_name" class="col-lg-6 control-label">
Theme
</label>
<div class="col-lg-6">
<select class="form-control" id="theme_name" name="theme_name">
<option value="amelia"> Amelia </option>
<option value="cerulean"> Cerulean </option>
<option value="cosmo"> Cosmo </option>
<option value="cyborg"> Cyborg </option>
<option value="darkly"> Darkly </option>
<option value="bootstrap"> Default </option>
<option value="flatly"> Flatly </option>
<option value="journal"> Journal </option>
<option value="lumen"> Lumen </option>
<option value="readable"> Readable </option>
<option value="simplex"> Simplex </option>
<option value="slate"> Slate </option>
<option value="spacelab"> Spacelab </option>
<option value="superhero"> Superhero </option>
<option value="united"> United </option>
<option value="yeti"> Yeti </option>
</select>
</div>
</div>
<div class="form-group">
<label for="navbar_style" class="col-lg-6 control-label" >
Navbar Style
</label>
<div class="col-lg-6">
<select class="form-control" id="navbar_style" name="navbar_style">
<option value="navbar-default">Default</option>
<option value="navbar-inverse">Inverse</option>
</select>
</div>
</div>
<div class="form-group">
<label for="btn_style" class="col-lg-6 control-label" >
Nav Btn Style
</label>
<div class="col-lg-6">
<select class="form-control" id="btn_style" name="btn_style">
<option value="btn-primary">Primary</option>
<option value="btn-default">Default</option>
<option value="btn-success">Success</option>
<option value="btn-info">Info</option>
<option value="btn-warning">Warning</option>
<option value="btn-danger">Danger</option>
<option value="btn-inverse">Inverse</option>
</select>
</div>
</div>
<div class="form-group">
<label for="panel_style" class="col-lg-6 control-label" >
Panel Style
</label>
<div class="col-lg-6">
<select class="form-control" id="panel_style" name="panel_style">
<option value="panel-primary">Primary</option>
<option value="panel-default">Default</option>
<option value="panel-success">Success</option>
<option value="panel-info">Info</option>
<option value="panel-warning">Warning</option>
<option value="panel-danger">Danger</option>
</select>
</div>
</div>
<div class="form-group">
<label for="text_size" class="col-lg-6 control-label">
Icon Labels
</label>
<div class="col-lg-6">
<select class="form-control" id="display_label" name="display_label">
<option value="hide">Icons Only</option>
<option value="">Icons/Labels</option>
</select>
</div>
</div>
</div>
<div class="panel-footer">
<div class="form-group">
<div class="col-lg-12">
<button type="submit" class="btn btn-primary btn-block">Update</button>
<button type="submit" class="btn btn-default btn-block">Reset</button>
</div>
</div>
</div>
</div>
</form>
</li>
</ul>
</div>
</div>
<form action="clientsearch/index.asp" method="post" class="navbar-form" name="search-form" id="search-form" accept-charset="utf-8">
<div class="form-group" style="display:inline;">
<div class="input-group">
<span class="input-group-btn btn-block" >
<button id="btn-search" class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">
<span class="glyphicon glyphicon-search"></span>
<span class="nav-label"> Search</span>
<span class="fa fa-caret-down"></span>
</button>
<ul id="search-option" class="dropdown-menu pull-left" role="menu">
<li>
<a href="#" data-searchtype="search-user" data-placeholder="Enter User Name (first, last or both)" data-toggle="tooltip" data-placement="right" title="Search Users">
<span class="glyphicon glyphicon-user"></span>
<span class="nav-label">User</span>
</a>
</li>
<li>
<a href="#" data-searchtype="search-org" data-placeholder="Enter Organization Name" data-toggle="tooltip" data-placement="right" title="Search Organizations">
<span class="fa fa-building-o"></span>
<span class="nav-label">Organization</span>
</a>
</li>
<li>
<a href="#" data-searchtype="search-kb" data-placeholder="Enter Search Terms" data-toggle="tooltip" data-placement="right" title="Search Knowledgebase">
<span class="fa fa-book"></span>
<span class="nav-label">KnowledgeBase</span>
</a>
</li>
<li>
<a href="#" data-searchtype="search-venue" data-placeholder="Enter Venue Name" data-toggle="tooltip" data-placement="right" title="Search Venues">
<span class="fa fa-map-marker"></span>
<span class="nav-label">Venue</span>
</a>
</li>
<li>
<a href="#" data-searchtype="search-pl" data-placeholder="Enter Private Label" data-toggle="tooltip" data-placement="right" title="Search Private Label">
<span class="fa fa-ticket"></span>
<span class="nav-label">Private Label</span>
</a>
</li>
</ul>
</span>
<div class="input-group col-lg-12 center-block ui-helper-clearfix">
<!--<input class="form-control" id="search-input" class="search-input" type="text" placeholder="blank placeholder"> -->
<input type="text" name="search-query" id="search-query" class="form-control green" autocomplete="off" placeholder=" << Please Select Search Type">
</div>
<div class="input-group-btn navbar-btn">
<button class="btn btn-default btn-nav">
GO
</button>
</div>
</div>
</div>
</form>
</div>
</nav>
<div class="panel-body">
<h4>Search Results</h4>
<FORM ACTION="" METHOD="post">
<INPUT TYPE="hidden" NAME="FormName" VALUE="PrintLetters">
<TABLE class="table table-striped">
<THEAD>
<TR><TH>Print</TH><TH style="text-align:left">Subscription</TH><TH style="text-align:left">Venue</TH><TH>Date/Time</TH><TH>Quantity</TH></TR>
</THEAD>
<TBODY>
<TR><TD><INPUT TYPE="checkbox" NAME="EventCode" VALUE=588031></TD><TD>Season Subscription (Winter)</TD><TD>Downtown Theater</TD><TD>1/1/2015 12:00 PM</TD><TD>8</TD></TR>
<TR><TD><INPUT TYPE="checkbox" NAME="EventCode" VALUE=588031></TD><TD>Season Subscription (Spring)</TD><TD>Downtown Theater</TD><TD>1/1/2015 12:00 PM</TD><TD>8</TD></TR>
<TR><TD><INPUT TYPE="checkbox" NAME="EventCode" VALUE=588031></TD><TD>Season Subscription (Summer)</TD><TD>Downtown Theater</TD><TD>1/1/2015 12:00 PM</TD><TD>8</TD></TR>
<TR><TD><INPUT TYPE="checkbox" NAME="EventCode" VALUE=588031></TD><TD>Season Subscription (Fall)</TD><TD>Downtown Theater</TD><TD>1/1/2015 12:00 PM</TD><TD>8</TD></TR>
</TBODY>
</TABLE>
Select events and click below<BR><BR>
<INPUT TYPE="submit" CLASS="btn btn-outline btn-default" VALUE="Submit">
</FORM>
</div>
</div>
</div>
</div>
</div>
@import url(http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css);
@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:400,700);
/* remove outline and underscore from buttons - nasty things I hate 'em*/
a.btn {outline:0px !important; -webkit-appearance:none; text-decoration:none;}
a.btn:active {outline:0px !important; -webkit-appearance:none; text-decoration:none;}
a.btn:focus {outline:0px !important; -webkit-appearance:none; text-decoration:none;}
button.btn:active {outline:0px !important; -webkit-appearance:none; text-decoration:none; }
button.btn:focus {outline:0px !important; -webkit-appearance:none; text-decoration:none; }
button.btn:active {outline:0px !important; -webkit-appearance:none; text-decoration:none; }
button.btn:focus {outline:0px !important; -webkit-appearance:none; text-decoration:none; }
ul.dropdown-menu li a:active {outline:0px !important; -webkit-appearance:none; text-decoration:none; }
ul.dropdown-menu li a:focus {outline:0px !important; -webkit-appearance:none; text-decoration:none; }
ul.nav-tabs li a:active {outline:0px !important; -webkit-appearance:none; text-decoration:none;}
ul.nav-tabs li a:focus {outline:0px !important; -webkit-appearance:none; text-decoration:none;}
/* navbar search */
nav#navbar form.navbar-form .input-group-btn ul.dropdown-menu { min-width: 25px;}
nav#navbar form.navbar-form div.form-group div.input-group div.input-group input.form-control { width: 100%;}
nav#navbar form.navbar-form div.form-group div.input-group div.input-group input.form-control { color: rgb(69, 76, 84); border-width: 3px; border-color: rgb(189, 195, 199); border-radius: 2px; box-shadow: none; }
nav#navbar form.navbar-form div.form-group div.input-group div.input-group input.form-control:focus { border-color: rgb(22, 160, 133); outline: 0px none; box-shadow: none; }
.ui-autocomplete { max-height: 400px; overflow-y: auto; /* prevent horizontal scrollbar */ overflow-x: hidden; }
.ui-autocomplete .ui-menu-item > a:hover,
.ui-autocomplete .ui-menu-item > a.ui-state-hover,
.ui-autocomplete .ui-menu-item > a.ui-state-active,
.ui-autocomplete .ui-menu-item > a.ui-state-focus
{ color: #ffffff; text-decoration: none; background-color: #0088cc; border-radius: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px; background-image: none; color: #ffffff; text-decoration: none; background-color: #0088cc; }
/* navbar buttons */
nav#navbar div#navbar-collapsible div.navbar-btn.navbar-left button.btn.btn-nav { margin-right: 5px; }
nav#navbar div#navbar-collapsible div.navbar-btn.navbar-right button.btn.btn-nav { margin-left: 5px; }
/* outlined buttons */
a.btn-outline { background-color: transparent !important; border-width: 2px !important; }
a.btn-outline.btn-square { border-radius: 0; }
a.btn-primary.btn-outline { color: #428bca !important; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
a.btn-success.btn-outline { color: #5cb85c !important; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; }
a.btn-info.btn-outline { color: #5bc0de !important; -webkit-transition: all 0.75s; -moz-transition: all 0.75s; transition: all 0.75s; }
a.btn-warning.btn-outline { color: #f0ad4e !important; -webkit-transition: all 1s; -moz-transition: all 1s; transition: all 1s; }
a.btn-danger.btn-outline { color: #d9534f !important; -webkit-transition: all 2s; -moz-transition: all 2s; transition: all 2s; }
a.btn-primary.btn-outline:hover, .btn-success.btn-outline:hover, .btn-info.btn-outline:hover, .btn-warning.btn-outline:hover, .btn-danger.btn-outline:hover { color: #fff; }
/* navbar preferences form */
navv#navbar div#navbar-collapsible div.navbar-btn div.dropdown ul.dropdown-menu {width: 350px; padding:0; margin:0;}
navv#navbar div#preferences.panel {padding: 0px; margin-bottom:0;}
/* carousel image slider */
.carousel-caption { background: none repeat scroll 0 0 rgba(0, 0, 0, 0.45); left: 0; right: 0; bottom: 0; padding: 1px; position: absolute; }
.carousel-caption .item-name { padding-top: 10px; }
div.panel-footer div.btn-group button.btn { border-left:2px solid white; border-right:2px solid white; }
/* header */
header .well-sm h3 { text-decoration: none; line-height: 31px; letter-spacing: -1px; padding:0; margin:0;}
header .well-sm h3 a { text-decoration: none; letter-spacing: -1px; padding:0; margin:0;}
header .well-sm h3 a .dark { font-weight: 700; text-shadow: 1px 1px 1px rgba(51,51,51,.30); }
header .well-sm h3 a .light { font-weight: 400; text-shadow: 0px 0px 1px rgba(0,0,0,.30); }
/* category listing */
.badge {background-color: transparent;}
a.list-group-item {text-decoration: none;}
/* form input border */
.form-control { color: rgb(69, 76, 84); border-width: 2px; border-color: rgb(189, 195, 199); border-radius: 2px; box-shadow: none; }
.form-control:focus { border-color: rgb(22, 160, 133); outline: 0px none; box-shadow: none; }
/* alert notifications */
#alert-panel .alert { padding-left: 450px; text-align: left; }
#alert-panel .alert h3,
#alert-panel .alert .h3 { margin-top:0; margin-bottom:0; font-size: 24px; }
#alert-panel .alert p { margin-top:0; margin-bottom:0; font-size: 14px; }
#alert-panel { z-index:10; position: fixed; top:1px; left: 1px; width: 100%; height: 100px; margin: 0px; padding: 0px; background-color: transparent; border:0px; box-shadow: 0px; }
