.tzHide { display:none; }
.tzVisible { display:block; }


.tzSelect.expanded {
    z-index:2;
}
.tzSelect .selectBox {
    /*position:absolute;*/
    /*float:left;*/

	border: 1px solid #CCCCCC;
    box-shadow: 1px 1px 2px #999999 inset;
    height:100%;


    /* Font settings */
    background: white;
    color:black;
    line-height: 27px;
    /*	font:13px/34px "Lucida Sans Unicode", "Lucida Grande", sans-serif;
        text-align:center;
        text-shadow:1px 1px 0 #EEEEEE;
        color:#666666;*/

    padding: 3px 7px;
/*   padding-left: 7px;
    padding-top: 3px;*/
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    overflow: hidden;
}


/* Q&D. Too many qualifiers: too fragile. Add only one special CSS-class derived from PHP state of application? */
/* setting width:91% does not work on order confirmation page. Using setting width:172px; */
.bodyWrap .leftBlock .tile_set .tileWrap .product_tile .tile .controls .selectContainer .tzSelect .selectBox {
    width:173px; /* the only place across all site which must set this width except "template editor" */
}


.tzSelect .selectBox:hover,
.tzSelect .selectBox.expanded {
    /*	color:#2c5667;
        text-shadow:1px 1px 0 #9bc2d0;*/
}
 
.tzSelect .selectBox .copy {
    display: inline;
    float: left;
    font-weight: normal;
    height: 25px;
    margin-top: -5px;
    overflow: hidden;
    width: 90%;
}

.tzSelect .selectBox .icon {
    background-image: url("https://www.pizzahut.com/assets/w/images/sprites.png");
    background-position: -180px -80px;
    background-repeat: no-repeat;
    display: inline;
    float: right;
    height: 6px;
    margin-top: -8px;
    overflow: hidden;
    width: 9px;
}

.tzSelect .selectBox.expanded .icon {
    background-position: 1px -10px;
}

.tzOptions {
    display:block;
    position:absolute;
    box-shadow: 0 0 13px #000;
    z-index: -1;
}

.tzOptions .dropDown{
    position:relative;

    /*	left:0;*/
/*    border:1px solid #32333b;
    border-width:0 1px 1px;*/
    list-style:none;

    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;

    -moz-box-shadow:0 0 4px #111;
    -webkit-box-shadow:0 0 4px #111;
    box-shadow:0 0 4px #111;
}

.tzOptions ul {
    box-shadow: 2px 2px 16px #222;
    background-color: #1e1e1e;
    padding: 0;
}

.tzOptions li{
    cursor:pointer;
/*    position:relative;*/
    padding: 8px;
    margin:0;
/*    border-top: 1px solid #333;*/
}


.tzOptions li:last-child { padding-bottom:10px !important; }

.tzOptions li:hover{
    background-color: #cd0000;
}

.tzSelected { /* need this one so jquery can use a named class */
    background-color: #cd0000;
}

.tzOptions li span{
    left:88px;
    position:absolute;
    top:27px;
}

.tzOptions li i{
    color:#999999;
    display:block;
    font-size:12px;
}

.tzOptions li img{
    left:9px;
    position:absolute;
    top:13px;
}

.tzOptions li .header { color:#FFF; font-size:14px; font-weight:bold; white-space: nowrap;}
.tzOptions li .subheader {
    color: #999999;
    font-size: 10px;
    line-height: 13px;
	padding-bottom:0;
}
.tzOptions li:hover .subheader{
    color: #fff;
}
.tzOptions li .optkey { display:none; }

.tzOptions li.inactive:hover { background-color: #1e1e1e; cursor:default; }
.tzOptions li.inactive .header { color:#666; }
.tzOptions li.inactive .subheader { margin-top:10px 5px; color:#666; font-size:12px; line-height:1.2; }

.tzOptions .navUpArrow, .tzOptions .navDownArrow { width:100%; padding:5px 0; color:#000; background-color:#FFD300; text-align:center; float:left; cursor:pointer; }
.tzOptions .scrollBlock {
    border-bottom: 24px solid #FFD441;
    float: left;
    overflow: auto;
    width: 235px;
}

.yScrollBar {
background-color:#ffd441;
height:24px;
width:235px;
}

.subText {
text-transform:uppercase;
color:#999999;
font-size:12px;
}

.tzSelectAlt1 {
    height:25px;
    display:block;
    min-width:200px;
    position:relative;
    display:inline-block;
    z-index:1;

    /* Preloading the background image for the dropdown */
    /*	background:url("../img/dropdown_bkg.png") repeat-x -99999px;*/
}

.tzSelectAlt1.expanded {
    z-index:2;
}

.tzSelectAlt1 .selectBox:hover,
.tzSelectAlt1 .selectBox.expanded {
    /*	color:#2c5667;
        text-shadow:1px 1px 0 #9bc2d0;*/
}

.tzSelectAlt1 .selectBox .copy {
    width:90%;
    height:25px;
    margin-top:-5px;
    overflow: hidden;
    float:left;
    display:inline;
}

.tzSelectAlt1 .selectBox .icon {
    width:10%;
    height:25px;
    overflow: hidden;
    background-image:url('../img/ui-icons_454545_256x240.png');
    background-position: -64px -10px;
    float:left;
    display:inline;
}

.tzSelectAlt1 .selectBox.expanded .icon {
    background-position: 1px -10px;
}

.tzSelectAlt1 .selectBox {
    padding: 2px 0 0 5%;
    
    box-shadow: 0 1px 1px #999999 inset;
    border: 1px solid #e5e5e5;

    height: 33px;
    width: 95%;

    /* Font settings */
    background: white;
    color: #555555;
    line-height: 31px;
    font-size: 20px;
    font-weight: bold;

    cursor:pointer;
    
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    overflow: hidden;
}

.tzSelectAlt1 .selectBox .sbContent {
    width: 90%;
    overflow: hidden;
    float: left;
    display: inline;
}

.tzSelectAlt1 .selectBox .arrow {
    margin: 5px;
    float: right;
    display: inline;
}
.tzStateDropdown .selectBox .sbContent {
  
    font-size: 17px;
}

.tzSelectAlt1 .selectBox .calendar {
    margin: 10px 10px 0 0;
    float: right;
    display: inline;
}

.tzSelectAlt1 .selectBoxDisabled {
    padding: 2px 0 0 5%;
    
    box-shadow: 0 1px 3px #a4a4a4 inset;
    border: 1px solid #bababa;

    height: 33px;
    width: 95%;

    /* Font settings */
    background: #dedede;
    color: #bababa;
    line-height: 31px;
    font-size: 20px;
    font-weight: bold;

    cursor:pointer;
    
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    overflow: hidden;
}

.tzSelectAlt1 .selectBoxDisabled .calendar {
    margin: 10px 10px 0 0;
    float: right;
    display: inline;
}

.tzSelectFontSize16 .selectBox .sbContent {
    font-size:16px;
}

/* used with registration modal dropdowns */
.marginLeft10 { margin-left:10px; }
.tzSelectAlt2 { height:25px; display:block; min-width:200px; position:relative; display:inline-block; z-index:1; }
.tzSelectAlt2.expanded { z-index:2; }
.tzSelectAlt2 .selectBox:hover, .tzSelectAlt1 .selectBox.expanded { }
.tzSelectAlt2 .selectBox .copy { width:90%; height:25px; margin-top:-5px; overflow: hidden; float:left; display:inline; }
.tzSelectAlt2 .selectBox .icon { width:10%; height:25px; overflow: hidden; background-image:url('../img/ui-icons_454545_256x240.png'); background-position: -64px -10px; float:left; display:inline; }
.tzSelectAlt2 .selectBox.expanded .icon { background-position: 1px -10px; }
.tzSelectAlt2 .selectBox { padding: 0 0 0 10%; box-shadow: 0 1px 2px #999 inset; border: 1px solid #ccc; height: 30px; width: 90%; background: white; color: #555555; line-height: 31px; font-size: 12px; font-weight: bold; cursor:pointer; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; overflow: hidden; }
.tzSelectAlt2 .selectBox .sbContent { width: 90%; overflow: hidden; float: left; display: inline; }
.tzSelectAlt2 .selectBox .arrow { margin: 2px 5px 5px 5px; float: right; display: inline; }
.tzSelectAlt2 .selectBoxDisabled { padding: 0 0 0 10%; box-shadow: 0 1px 3px #a4a4a4 inset; border: 1px solid #bababa; height: 33px; width: 95%; background: #dedede; color: #bababa; line-height: 31px; font-size: 20px; font-weight: bold; cursor:pointer; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; overflow: hidden; }