/* HS Search CSS */

.ad-slot { display:inline-block; width: 320px; height: 50px; margin:25px 0px;}
@media (min-width: 336px) { .ad-slot { width: 336px; height: 280px; } }
@media (min-width:600px) { .ad-slot { width: 728px; height: 100px; } }
@media (min-width:900px) { .ad-slot { width: 928px; height: 90px; } }

/* LAYOUT */
@media only screen and (min-width: 1024px) {
.grid-main-dict {max-width: 800px; margin:0px auto; }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
.grid-main-dict {max-width: 700px; margin:0px auto; }
}
@media only screen and (min-width : 480px) and (max-width: 768px) {
.grid-main-dict {max-width: 600px; margin:0px auto;}
}
@media only screen and (min-width: 300px) and (max-width: 479px) {
.grid-main-dict { max-width: 460px; margin:0px; }
}

/* SEARCH ASL WORD */
.search-grid {background:#fbfbfb; padding:20px; -webkit-flex: 1 0 auto;   flex: 1 0 auto;}
.search-form {width:100%; }

.search-input
{
	border: 1px solid #ced8df;
    border-radius: 4px;
    font-size: 24px;
    height: 45px;
    line-height: 30px;
    padding: 10px;
 width: 90%;     /*ori 400px */

}
.search-input:focus {border: 1px solid #aad5e3;}

/*.search-button {
	background: #c79e2c; color:#fff; border:0px; padding:15px; cursor:hand; font-size:16px;
	margin-left:1px; border-radius: 1px 4px 4px 1px; 
-webkit-box-shadow: 1px 1px 5px 0px rgba(50, 50, 50, 0.5);
-moz-box-shadow:    1px 1px 5px 0px rgba(50, 50, 50, 0.5);
box-shadow:         1px 1px 5px 0px rgba(50, 50, 50, 0.5);
}
*/

/* multiple COLUMNS */
.col-abc {
text-align: left;
-moz-column-count: 6;
-moz-column-width: 5em;
-moz-column-gap: 1em;
-webkit-column-count: 6;
-webkit-column-width: 5em;
-webkit-column-gap: 1em;
padding:20px;
}
.col-abc li {
display: block; text-decoration: none;
list-style-type: none; 
padding: 2px 0px; 
font-size: 1.0em; 
font-weight: normal; font-family: sans-serif;
}
.col-abc li a:hover {
  color: #a33446; text-decoration:none;
}

/* video */
@media only screen and (max-width: 1800px) {
.video-asl {width: auto;    height: auto; max-width: 640px;}
}
/* tablet browsers, mini ipad*/
@media only screen and (max-width: 768px){	
.video-asl { width: auto; height: auto; max-width: 440px;}

.col-abc {
text-align: left;
-moz-column-count: 3;
-moz-column-width: 4em;
-moz-column-gap: 1em;
-webkit-column-count: 3;
-webkit-column-width: 4em;
-webkit-column-gap: 1em;
}

}
/* */
@media only screen and (max-width: 480px){
.video-asl {max-width: 100%; height: auto;}
.col-abc {
text-align: left;
-moz-column-count: 2;
-moz-column-width: 1.5em;
-moz-column-gap: 1em;
-webkit-column-count: 2;
-webkit-column-width: 1.5em;
-webkit-column-gap: 1em;
}

}

/* FORM 
select {
flex: 1 0 auto; -webkit-flex: 1 0 auto; }

input, select {
background:#fbfbfb; border:1px solid #efefef; padding:10px; margin-top:3px; font-size:0.9em;color:#000;}*/

/* SIGNING CONTENT */

.grid-dictbox, .grid-ad { 
display: flex; display: -webkit-flex; 
-webkit-flex-flow: column wrap;      flex-flow: column wrap;
/* equal height 
-webkit-align-items: stretch; align-items: stretch; 
-webkit-align-content: flex-start;    align-content: flex-start;
*/
-webkit-align-items: start-end; align-items: start-end; 
-webkit-align-content: stretch;    align-content: stretch;
-webkit-flex: 1 0 350px;	flex: 1 0 350px;
background: #fff;
}
.grid-dictbox {border:1px solid #f6f6f6;  margin:0px;}
.grid-ad {padding:20px;}
@media (min-width:600px) { .grid-dictbox { margin:10px } }
@media (min-width:900px) { .grid-dictbox { margin:25px } }
@media only screen and (max-width: 1800px) {
.grid-dictbox, .grid-ad { -webkit-flex: 1 0 400px;	flex: 1 0 400px;}
}
@media only screen and (max-width: 768px){
.grid-dictbox, .grid-ad { -webkit-flex: 1 0 350px;	flex: 1 0 350px;}
}

.grid-dictbox > h2 {
flex: 0 1 auto; -webkit-flex: 0 1 auto; /* push content below down */	
background:#f6f6f6; padding:15px 20px;
font: bold 14px arial,tahoma,geneva, verdana; letter-spacing:1px; color: #222; margin:0px;
}

.grid-box > h2 {
flex: 0 1 auto; -webkit-flex: 0 1 auto; /* push content below down */	
background:#f6f6f6; padding:15px 20px;
font: bold 14px arial,tahoma,geneva, verdana; letter-spacing:1px; color: #222; margin:0px;
}

.dictvideo {padding:5px 5px;}
@media (min-width:600px) { .grid-video { padding:15px 15px; } }
@media (min-width:900px) { .grid-video { padding:20px 20px; } }

.dictext {
padding:15px 20px;}
.dictext p {font-size: 0.85em; font-weight: normal; font-family:Verdana, Arial, Helvetica, sans-serif; line-height: 1.6em; margin:1.3em 0;}
.dictad {flex: 1 0 auto; -webkit-flex: 1 0 auto; } /* push content below down */
.dictpaging {background:#fbfbfb; padding:15px 20px; font: bold 16px arial,tahoma,geneva, verdana; letter-spacing:4px; text-align:center; } /* to del if not used? */

/* VIDEO control menu */
.video-button, .video-speed {
font-family: Verdana, Arial, Helvetica, Tahoma; font-size: 9pt; font-weight: bold;	cursor:hand;color: #ffffff; border: 0px; text-transform:uppercase; padding:10px;}
.video-button { background:#d1e0ca; color:#7f9274;}/* E6D7D5 transparent red*/
.video-speed {background: #eeeecc; color:#c79e2c;}
.video-button:hover, .video-speed:hover {
	background: #d2b04c; color:#fff;}
.video-speed:focus {
	border: 1px solid #c79e2c;}


/* word list 
.dictlist {clear:both;}
.dictlist ul li {list-style:none; line-height:1.6em; }
.dictlist a, .col-abc a {
font: 1.0em arial,verdana, lucida, sans-serif;
color: #b44745;
}
.dictlist a:hover, .col-abc a:hover {color: #cd5c5c;}
.dictlist a:visited, .col-abc a:visited {color:#666666; font-weight:normal;}
.dictlist ul li a.active {background:#f1bf35; padding: 5px; color:#a33446;
-moz-border-radius: 2px; -moz-border-radius:2px;
-webkit-border-radius: 2px; -webkit-border-radius: 2px;}
*/

/* SEARCH BOX to ID url */
 /* highlight results */
.ui-autocomplete span.hl_results {
    background-color: #ffff66;
}
 
/* loading - the AJAX indicator */
.ui-autocomplete-loading {
    background: #ecf4ff;
}
 
/* scroll results */
.ui-autocomplete {
    max-height: 250px;
    overflow-y: hidden;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
    /* add padding for vertical scrollbar */
    padding-right: 5px;

width: auto; /* ori 400px */
  margin-top: 2px;
  padding: 5px 0px;
  background-color: #fbfbfb;
  border: 1px solid #f6f6f6; /*  border: 1px solid rgba(0, 0, 0, 0.2); */
  border-radius: 2px 2px 4px 4px;
  font-size: 18px;
  color: #111;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  -moz-box-shadow: 0px 0.5px 1.0px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24);
  -webkit-box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24);
  box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24);
}
 
.ui-autocomplete li {
    font-size: 24px;
}

.ul-autocomplete li:hover {
	color: #fff;
  background-color: #aad5e3;}

/* IE 6 doesn't support max-height
* we use height instead, but this forces the menu to always be this tall
*/
* html .ui-autocomplete {
    height: 250px;
}

.ui-autocomplete {
cursor: default;
left: 0;
position: absolute;
top: 0;
}
/* end IE */

.ui-menu {
display: block;
list-style: none outside none;
margin: 0;
outline: medium none;
padding: 2px;
}

.ui-menu .ui-menu-item {
margin: 0;
padding: 0;
width: 100%;
}
.ui-menu .ui-menu-divider {
border-width: 1px 0 0;
font-size: 0;
height: 0;
line-height: 0;
margin: 5px -2px;
}
.ui-menu .ui-menu-item a {
display: block;
font-weight: normal;
line-height: 1.5;
min-height: 0;
padding: 5px 0.4em;
text-decoration: none;
font-size:0.72em;
cursor: pointer;
border-bottom: 1px solid #f6f6f6;
}
.ui-menu .ui-menu-item a.ui-state-focus, .ui-menu .ui-menu-item a.ui-state-active {
font-weight: normal;
margin: -1px;
}
.ui-menu .ui-state-disabled {
font-weight: normal;
line-height: 1.5;
margin: 0.4em 0 0.2em;
}
.ui-menu .ui-state-disabled a {
cursor: default;
}
.ui-menu-icons {
position: relative;
}
.ui-menu-icons .ui-menu-item a {
padding-left: 2em;
position: relative;
}
.ui-menu .ui-icon {
left: 0.2em;
position: absolute;
top: 0.2em;
}
.ui-menu .ui-menu-icon {
float: right;
position: static;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
background: red;
border: 1px solid #CCCCCC;
color: #1C94C4;
font-weight: bold;
}
.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited {
color: #1C94C4;
text-decoration: none;
}
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {
background:#aad5e3;
color: #fff;
}

/* SEARCH LISTWORDS */

/* PAGINATION */
.pagination{display:inline-block;padding-left:0;border-radius:3px; display: flex; display: -webkit-flex;flex-flow: row wrap;      -webkit-flex-flow: row wrap;}
.pagination>li{display:inline; -webkit-flex: 1 0 auto;	flex: 1 0 auto;}
.pagination>li>a,.pagination>li>span{position:relative;float:left;padding:6px 12px;line-height:1.42857143;text-decoration:none;color:#428bca;background-color:#fff;border:1px solid #ddd;margin-left:-1px}
.pagination>li:first-child>a,.pagination>li:first-child>span{margin-left:0;border-bottom-left-radius:4px;border-top-left-radius:4px}
.pagination>li:last-child>a,.pagination>li:last-child>span{border-bottom-right-radius:4px;border-top-right-radius:4px}
.pagination>li>a:hover,.pagination>li>span:hover,.pagination>li>a:focus,.pagination>li>span:focus{color:#2a6496;background-color:#f6f6f6;border-color:#ddd;}
.pagination>.active>a,.pagination>.active>span,.pagination>.active>a:hover,.pagination>.active>span:hover,.pagination>.active>a:focus,.pagination>.active>span:focus{z-index:2;color:#fff;background-color:#E0AE00;border-color:#E0AE00;cursor:default}.pagination>.disabled>span,.pagination>.disabled>span:hover,.pagination>.disabled>span:focus,.pagination>.disabled>a,.pagination>.disabled>a:hover,.pagination>.disabled>a:focus{color:#999;background-color:#fff;border-color:#ddd;cursor:not-allowed}.pagination-lg>li>a,.pagination-lg>li>span{padding:10px 16px;font-size:18px}
.pagination-lg>li:first-child>a,.pagination-lg>li:first-child>span{border-bottom-left-radius:6px;border-top-left-radius:6px}
.pagination-lg>li:last-child>a,.pagination-lg>li:last-child>span{border-bottom-right-radius:6px;border-top-right-radius:6px}
.pagination-sm>li>a,.pagination-sm>li>span{padding:5px 10px;font-size:12px}
.pagination-sm>li:first-child>a,.pagination-sm>li:first-child>span{border-bottom-left-radius:3px;border-top-left-radius:3px}.pagination-sm>li:last-child>a,.pagination-sm>li:last-child>span{border-bottom-right-radius:3px;border-top-right-radius:3px}
/*  blue active */

.form-control{	
display:inline-block;-webkit-flex: 1 0 250px;	flex: 1 0 250px; height:35px; 
padding:6px 12px;font-size:14px;line-height:1.42857143;color:#555;background-color:#fff;border:1px solid #ccc;border-radius:3px;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075);-webkit-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s}
.form-control[disabled],.form-control[readonly],fieldset[disabled],

.form-control:focus{border-color:#E0AE00;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #c0a16b;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #c0a16b}

