.glossary-banner{ padding-top:30px;}
.head-title {text-align:center; padding-bottom:25px;}
.head-title h2{font-size:55px; color:#3c4445; font-family:"helveticaneuecyrbold";}
.head-title p{color:#fff;font-size:18px; color:#3c4445;}

/*---search box----*/
.blueBg{background:#0098db; padding:25px 0;}
.searchBox{text-align:center;}
.field_control{display:inline-block; vertical-align:top; width:290px; border-bottom:1px solid #cceaf8; padding:0 0 5px 0; position:relative; text-align:left;}
.field_control:after{ position: absolute; z-index: 3; bottom: 0;  left: 0;  height: 2px;  width: 0;  content: "";  -webkit-transition: all;  -o-transition: all;  transition: all;  -webkit-transition-duration: 300ms;  transition-duration: 300ms;}
.field_control.active:after{  background: #fff; width: 100%;}
.field_control input[type="submit"]{ background:url(../../img2/searchBtn.png) no-repeat center center; border:none;  position:absolute; left:0px; width:28px; height: 20px; bottom:4px; cursor:pointer;}
.field_control input[type="text"],.field_control input[type="search"]{border:none; background:none; width:100%; padding:3px 5px 0px 35px; font-size:15px; color:#fff; }

.field_label{position: absolute;top: 5px; left: 30px; font-weight: 400;pointer-events: none;z-index:1;white-space: nowrap;color:rgba(255,255,255,0.6); font-style:italic;
 -ms-transition: all 200ms ease 0s; /* IE 9 */
  -webkit-transition:all 200ms ease 0s; /* Chrome, Safari, Opera */
  transition: all 200ms ease 0s; font-size:15px;}

.field_control.active .field_label{top:-12px;font-size: 14px; left:35px;}
.field_control .select-wrap{position:relative;}
.field_control .select-wrap:after{position:absolute; border:6px solid transparent; border-top-color:#fff; content:""; right:2px; top:12px;}
.field_control .select-wrap select{-moz-appearance:none;-webkit-appearance:none;-o-appearance:none;-ms-appearance:none; appearance:none; background:none; border:none; color:rgba(255, 255, 255, 0.6); width:100%; font-size:15px; font-family:"Open Sans" !important;font-style:italic;}
.field_control .select-wrap select::-ms-expand {
    display: none;
}

.field_control .select-wrap select option{font-size:15px; background:#fff; padding:0px 10px; border:none; outline:none; }
.searchBox .or{display:inline-block; vertical-align:bottom; width:100px; text-align:center;font-size:18px; color:#fff;}
.letter-row{padding-top:30px; text-align:center;}
.letter-row ul{display:inline-block;}
.letter-row ul li{display:inline-block; margin:0 1px 0 0 ; font-size:17px; text-align:center; line-height:25px;}
.letter-row ul li a{height:29px; width:29px; border-radius:100px;color:#fff; display:block;}
.letter-row ul li a:hover, .letter-row ul li a.active{background:#12bfc3;}
.letter-row ul li a.disabled, .letter-row ul li a.disabled:hover{background:none;color:#61bbe2;}
.letter-row .numbering-char{border-left:2px solid #fff; margin-left:15px; padding-left:15px;}
.word-list{padding:35px 0;}
.word-list .letter{ height:46px; width:46px; border-radius:100%; color:#fff; font-size:24px; color:#fff; text-align:center; line-height:46px; margin-bottom:15px; position:relative; text-transform:uppercase; -webkit-transition: -webkit-transform ease-out 0.1s, background 0.2s;
	-moz-transition: -moz-transform ease-out 0.1s, background 0.2s;
	transition: transform ease-out 0.1s, background 0.2s;}
.letter:after {pointer-events: none;position: absolute;width: 100%;height: 100%;border-radius: 50%;content: '';-webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box;}
.letter:before {speak: none;font-size: 35px;line-height: 70px;font-style: normal;font-weight: normal;font-variant: normal;text-transform: none;display: block;-webkit-font-smoothing: antialiased;}
.word-list .letter:after {
	top: 0;
	left: 0;
	padding: 0;
	z-index: -1;
	box-shadow: 0 0 0 2px rgba(255,255,255,0.1);
	opacity: 0;
	-webkit-transform: scale(0.9);
	-moz-transform: scale(0.9);
	-ms-transform: scale(0.9);
	transform: scale(0.9);
}
@-webkit-keyframes sonarEffect {
	0% {
		opacity: 0.3;
	}
	40% {
		opacity: 0.5;
		box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 5px 5px #aaa, 0 0 0 5px rgba(255,255,255,0.5);
	}
	100% {
		box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 5px 5px #aaa, 0 0 0 5px rgba(255,255,255,0.5);
		-webkit-transform: scale(1.5);
		opacity: 0;
	}
}
@-moz-keyframes sonarEffect {
	0% {
		opacity: 0.3;
	}
	40% {
		opacity: 0.5;
		box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 5px 5px #aaa, 0 0 0 5px rgba(255,255,255,0.5);
	}
	100% {
		box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 5px 5px #aaa, 0 0 0 5px rgba(255,255,255,0.5);
		-moz-transform: scale(1.5);
		opacity: 0;
	}
}
@keyframes sonarEffect {
	0% {
		opacity: 0.3;
	}
	40% {
		opacity: 0.5;
		box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 5px 5px #aaa, 0 0 0 5px rgba(255,255,255,0.5);
	}
	100% {
		box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 5px 5px #aaa, 0 0 0 5px rgba(255,255,255,0.5);
		transform: scale(1.5);
		opacity: 0;
	}
}
.word-list.orange, .letter-row ul li a.orange{background:none;}
.blue .letter, .letter-row ul li a.blue:hover, .letter-row ul li a.blue.active{background: #12bfc3;}
.brown .letter, .letter-row ul li a.brown:hover, .letter-row ul li a.brown.active{background: #f18932}
.yellow .letter,.letter-row ul li a.yellow:hover, .letter-row ul li a.yellow.active{background: #FFC800}
.purple .letter, .letter-row ul li a.purple:hover, .letter-row ul li a.purple.active{background: #8569ba}
.orange .letter, .letter-row ul li a.orange:hover, .letter-row ul li a.orange.active{background: #f24130}
.letter.is-disabled {opacity: 0.25;pointer-events: none}
.word-list ul{min-width:100%; margin-left:-80px;}
.word-list ul li{ color:#595959; font-size:18px; display:inline-block; margin-right:-4px; padding-left:80px; width:33.33%;}
.word-list ul li a{padding:15px;color:#595959; display:block; position:relative;border-bottom:1px solid #dae5ea;}
.word-list ul li a:before{bottom:-1px;content: "";height:3px;left: 0;position: absolute;transform: scale(0);width: 100%;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
	-webkit-transition:all 250ms ease 0s;
    -o-transition: all 250ms ease 0s;
    transition: all 250ms ease 0s;}

/*---- hover effect ---*/
.word-list ul li a:hover:before{-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);} 
.word-list.blue ul li a:hover{color:#1dadb0;}
.word-list.blue ul li a:hover:before{background:#1dadb0;}
.word-list.brown ul li a:hover{color:#f18932;}
.word-list.brown ul li a:hover:before{background:#f18932;}
.word-list.purple ul li a:hover{color:#8569ba;}
.word-list.purple ul li a:hover:before{background:#8569ba;}
.word-list.orange ul li a:hover{color:#f24130;}
.word-list.orange ul li a:hover:before{background:#f24130;}
.word-list:hover  .letter:after {-webkit-animation: sonarEffect 1.3s ease-out 75ms;	-moz-animation: sonarEffect 1.3s ease-out 75ms;	animation: sonarEffect 1.3s ease-out 75ms;} 
.blueBg.fixed_strip{position:fixed;left:0; right:0; top:0; z-index:999999;}

/*----media query --*/

@media (min-width:1001px) and (max-width:1100px) {
.glossary-banner{padding-top:30px;}
.word-list{padding:25px 0;}
.word-list ul {margin-left:-40px;}
.word-list ul li{padding-left:40px;}
.letter-row .numbering-char{border-left:none; margin-left:0px; padding-left:0px;}
	
}
@media (min-width:768px) and (max-width:1000px) {
.glossary-banner{padding-top:25px;}
.head-title h2{font-size:45px;}
.head-title p{font-size:16px;}
.letter-row{padding:10px 0;}
.letter-row ul{width:100%; text-align:center; padding:5px 0;}
.letter-row ul li a{height:28px; width:28px;}
.letter-row ul li{font-size:13px; display:inline-block; vertical-align:top; float:none; margin-right:-4px;}
.letter-row .numbering-char{margin-left:0px; padding-left:0px; border:none;}
.blueBg{padding:25px 0 10px 0;}
.word-list{padding:15px 0;}
.word-list .letter{height:40px; width:40px; margin-bottom:10px; line-height:40px; font-size:16px;}
.word-list ul {margin-left:-20px;}
.word-list ul li{padding-left:20px; width:50%; font-size:15px;}
.word-list ul li a{padding:10px;}
}

@media (max-width:767px) {
.glossary-banner{padding-top:20px;}
.head-title h2{font-size:30px;}
.head-title{padding-bottom:15px;}
.head-title p{font-size:15px;}
.letter-row{padding:10px 0;}
.letter-row ul{width:100%; text-align:center; padding:5px 0;}
.letter-row ul li a{height:26px; width:26px;}
.letter-row ul li{font-size:13px; display:inline-block; vertical-align:top; float:none; margin-right:-4px; margin-bottom:2px;}
.letter-row .numbering-char{margin-left:0px; padding-left:0px; border:none;}
.blueBg{padding:15px 0 0px 0;}
.word-list{padding:15px 0;}
.word-list .letter{height:40px; width:40px; margin-bottom:10px; line-height:40px; font-size:16px;}
.word-list ul {margin-left:-10px;}
.word-list ul li{padding-left:10px; width:50%; font-size:13px;}
.word-list ul li a{padding:10px;}
	
}
@media (min-width:480px) and (max-width:767px) {
	.field_control{width:44%;}
	.searchBox .or{width:8%;}
	}
@media (max-width:479px) {
	.field_control{width:100%;}
	.searchBox .or{max-width:100%; padding:10px 0;}
	.word-list ul {margin-left:0px;}
.word-list ul li{padding-left:0px; width:100%; font-size:14px; margin-right:0px;}
}