/* reset css*/
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed,figure, figcaption, footer, header, hgroup,menu, nav, output, ruby, section, summary,time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}
/* remove shadows for input elements in mobile browsers*/
input[type="text"], input[type="email"], input[type="search"], input[type="password"]{-webkit-appearance:none;-moz-appearance:none;}
/* end reset */
/* ie */
.ie7,
.ie8{text-shadow:0 0 1px #b6b8b9;}
.ie7 h1,
.ie8 h1{text-shadow:0 0 1px #999;}
.ie7 h2,.ie7 h3,
.ie7 h2,.ie7 h3{text-shadow:0 0 1px #bfbfbf;}
.ie7 a,
.ie8 a{text-shadow:0 0 1px #c2dbe3;}
/* end ie */
body{font-family:Times New Roman;color:#333;}
a{color:#006f94;text-decoration:none;}
a:hover{text-decoration:underline;}
a:visited,a:active{color:#3dabcc;}
img{max-width:100%;}
h1{font-size:70px;padding:16px 16px 0 0;display:block;float:left;text-transform:capitalize;word-wrap:break-word;width:100%;}
h2{clear:both;font-size:30px;color:#666;padding:0 0 16px 48px;}
h2#related{padding:16px 0 0 48px;}
h3{font-size:24px;color:#666;padding:0 0 16px 0;}
.cBoth{clear:both;}
.relWords h3{padding:16px 0;}
.remark{font-size:14px;font-weight:bold;position:relative;top:-0.7em;cursor:help;color:#AAA;}
#header{width:100%;}
.topLine{width:100%;height:8px;background: url("./images/sprite.png") repeat-x scroll 0 0 transparent;display:block;}
.greyTop{background-color: #dedede;padding: 8px;overflow:auto;}
.container{width:980px;margin:0 auto;}
#logo{float:left;display:block;margin:2px 0 0;width:156px;height:24px;background: url("./images/sprite.png") no-repeat scroll 0 -13px transparent;}
#logo span{display:none;}
#searchContainer{display:block;float:right;}
#searchField{background:#fff;border:1px solid #dcdcdc;overflow:auto;}
#searchField:hover{box-shadow:0 0 4px rgba(0, 0, 0, 0.1);}
#searchButton{background: url("./images/sprite.png") no-repeat scroll -242px -39px #FFFFFF;border: 0 none;border-collapse: collapse;cursor: pointer;float:right;font-size: 0;height: 24px;margin: 0 0 -14px;overflow: hidden;padding: 24px 0 0;width: 24px;}
#searchInput{padding:4px;height:16px;float:right;border:0 none;border-collapse:collapse;font-size:16px;width:170px;background:none;}
.topLinks{clear:both;text-align:center;padding:8px 0;}
.topLinks li{display:inline;text-align:center;font-size:16px;}
.line{background-color:#e0e0e0;border:0 none;color:#e0e0e0;height:1px;margin:0;}
.playContainer{float:left;margin:34px 16px 0 0;}
.playContainer span{text-align:center;font-size:14px;font-style:italic;}
.playMe{width:47px;height:47px;margin:0 auto;background: url("./images/sprite.png") no-repeat scroll -185px -43px transparent;}
.subContainer{clear:both;padding:0 0 0 96px;}
.illustration{background-color:#FFFFFF;border:1px solid #666666;float:left;margin:0 12px 0 0;max-width:420px;}
.caption{background:black;color:#FFFFFF;font-family:sans-serif;font-size:12px;line-height:1.2em;opacity:0.7;overflow:hidden;padding:0.3em;}
.caption span{font-style:italic;}
.subContainer table,.subContainer table td{vertical-align:top;}
.dName{font-size:16px;font-style:italic;border-bottom:1px solid #999999;line-height:22px;}
.dMeanings{display:inline;}
.dMeanings ul{list-style:decimal inside;font-size:20px;margin-top:8px;}
.meanings{margin-top:8px;list-style:decimal inside none;line-height:24px;}
.meanings li{font-size:20px;}
.searchResults li{float:left;font-size:20px;margin-right:16px;overflow:hidden;white-space:nowrap;width:200px;}
.tSpeech{color:#cc3300;}
.tSpeech:before{content: "(";}
.tSpeech:after{content: ")";}
.term,.bld{font-weight:bold;}
.quot,.itl{font-style:italic;}
.wuQuot{display:block;}
li.separator,.separatorSmall{display:block;font-size:24px;font-weight:bold;letter-spacing:0.75em;padding:1em 0 0;text-align:center;clear:both;}
.separatorSmall{font-size:18px;padding:0.1em 0;letter-spacing:0.45em;clear:both;}
hr.double{border:none;border-top:medium double #999;color:#999;clear:both;}
.thumbContainer{width:200px;height:132px;font-size:12px;font-family:sans-serif;float:left;margin:0 8px 4px 0;overflow:hidden;}
.thumbContainer img{box-shadow:0 0 4px #333333;float:left;margin-right:8px;}
.thumbContainer span{display:block;}
.lines{background: url("./images/grey-back.gif") repeat;padding:16px;}
.left .lines{float:left;}
.lineContainer.left{padding:8px 16px 16px 0;background-color:#fff;float:left;}
.lineContainer.right{padding:8px 0 16px 16px;background-color:#fff;float:right;}
.lines span{border:1px solid #b6b4b1;background-color: #fff;padding:8px;display:block;}
span.fact{font-size:18px;font-style:italic;max-width:304px;min-width:220px;}
span.fHeader{border:0;padding:0;font-weight:bold;display:block;margin-bottom:0.3em;}
.quotContainer{float:left;width:400px;min-width: 400px;width:48%;}
.quotContainer img{margin-top:-114px;display:block;}
.authorContainer{width:100px;height:114px;overflow:hidden;background: url("./images/sprite.png") no-repeat scroll 0 -43px transparent;position:relative;z-index:1;}
.aName{display: block;font-size:12px;margin:100px 0 10px;text-align:center;width:100%;white-space:nowrap;}
.aInfo,.quote{float:left;}
.aInfo{width:100px;}
.quoteContainer{width:284px;padding:0 0 0 16px;height:94px;display:table;overflow:hidden;}
.qSubContainer{display:table-cell;vertical-align:middle;}
.quote{font-size:20px;}
.quote span{background-color:#E9F1F6;border:1px solid #D9E7EF;border-radius:4px 4px 4px 4px;margin:0 -1px;padding:0 1px;}
.quotesUl li{margin:0 0 24px 0;float:left;}
.idioms,.etymology{font-size:20px;}
.etymology{padding-bottom:16px;}
.idioms span{font-weight:bold;}
.etymology span{font-weight:bold;font-style:italic;}
.usageContainer{clear:both;padding:0 0 0 48px;}
.usage,.rhyme{font-size:18px;font-style:italic;}
.usage:first-letter{color:#111;}
.usage:hover{color:#111;}
.usage span,.rhyme span{font-weight:bold;}
.uAuthor,.poet{color:#777777;font-size:14px;padding:4px 0;text-align:right;}
.uAuthor span,.poet span{color:#cc3300;}
.poet{text-align:right;display:block;padding:0;}
.poemQuote{border-radius:8px 8px 8px 8px;box-shadow:0 0 16px #D6D6D6;font-size:18px;font-style:italic;line-height:1.1em;margin:0 0 10px 32px;overflow:hidden;padding:16px 32px;float:left;}
.rhyme{clear:both;padding:0 0 8px 0;}
.misspellings,.related{font-size:20px;font-style:italic;word-spacing:0.2em;}
.synGroup{display:inline;}
.synGroup:hover{background:#DDDDDD;border-radius:5px;}
hr.footer{background-color:#000;color:#3c3c3c;height:3px;clear:both;margin:24px 0;}
#footer{background-color:#000;padding:16px;box-shadow:0 0 16px #333;font-family:sans-serif;font-size:12px;margin:48px 0 0;}
.copyright{margin:auto;text-align:center;color:#777;}
#monogram{background: url("./images/sprite.png") repeat-x scroll -107px -42px transparent;width:61px;height:61px;margin:0 auto 8px auto;}
/* main page */
#topContainer{position:fixed;top:0;width:100%;}
#mainContainer{height:276px;display:block;overflow:hidden;text-align:center;width:654px;position:absolute;margin-top:-138px;margin-left:-327px;top:50%;left:50%;}
#mainContainer #logo{float:none;margin:16px auto 0 auto;}
#mainContainer #searchContainer{float:none;width:210px;margin:4px auto 16px auto;}
#searchResults{position:absolute;width:194px;background-color:#fff;border:1px solid #BBB;box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);overflow:hidden;padding:4px;white-space:nowrap;text-align:left;z-index:100;}
#searchResults.off{display:none;}
.result{display:block;font-size:16px;padding:4px 0 4px 8px;overflow:hidden;}
.showAll{display:block;float:left;text-align:center;width:170px;font-size:14px;line-height:20px;}
.closeSearch{background:url("./images/sprite.png") no-repeat scroll -270px -43px transparent;border:1px solid #FFFFFF;display:block;float:right;width:17px;height:17px;opacity:0.8;margin:1px;}
.closeSearch:hover{opacity:1;cursor:pointer;}
.result:hover{background-color:#EEE;}
#searchResults a{color:#333;}
#mainContainer #searchField{border-width:4px;}
.bottomLine{font-size:10px;height:1em;width:100%;bottom:1px;position:fixed;text-align:center;color:#aaa;font-family:sans-serif;}
img.center{display:block;margin:0 auto;}
.errorMsg{text-align:center;font-size:30px;margin:18px 0;}
.dex{text-align: center;position: fixed;bottom: 50px;width: 100%; font-family:sans-serif; font-size: 12px; color: #666;}
/* ads */
.responsive-ad{max-width: 728px; margin: 10px auto -5px auto;}
/* profiling styles */
.profiler{width:920px;margin:30px auto;background: #e6e6e6;}
.groupTotals{font-size: 14px;padding: 10px;background-color:#ACBCFF;border: 1px dotted black;box-shadow:0 9px 17px #D6D6D6;position:relative;}
.profPercent{color: #2768ea;}
.groupTotals span, .SQLtotals span, .profPercent{font-weight: bold;}
.profilerQuery{overflow: auto;padding:5px 10px 5px 30px;border-bottom: 1px solid white; color:#666;}
div.profilerQuery:hover,.profilerGroup{color: black;background: #f4f4f4;}
div.profilerQuery:hover{border-left:8px solid darkgrey;padding-left:22px;}
.profilerGroup{padding:15px;margin-right: 67%;border-bottom: 3px solid grey;}
.profilerQuery span{font-weight: bold;}
.moderate{background-color: #efef98;}
.severe{background-color: #ecafaf;}
/* end profiling styles */
/* Mobile and Table Layout */
@media screen and (min-width: 1px) and (max-width: 1005px) {
h2,h2#related{padding-left:0;padding-right:0;}
.container{width:100%;overflow:hidden;}
.subContainer{padding-left:0;}
.bigSubContainer{padding:0 16px;}
.usageContainer{padding-left:0;}
}
@media screen and (min-width: 1px) and (max-width: 654px) {
#mainContainer{width:100%;height:auto;top:0;left:0;margin:0;}
.illustration{width:100%;}
}
/* fix quotes */
@media screen and (min-width: 1px) and (max-width: 400px) {
#illustrations,#quotations,#idioms,#etymology,#usage,#related{display:none;}
#logo{margin:2px auto;float:none;}
#searchContainer{float:none;width:auto;}
#mainContainer #searchContainer{width:auto;margin:16px;}
#searchInput{width:auto;float:left;}
.navHolder{display:none;}
.quotContainer{min-width:0;width:100%;}
.quoteContainer{display:block;width:100%;clear:both;padding:16px 0 0;height:auto;}
.poemQuote{margin:0 0 10px 0px;}
h2.header{-moz-border-bottom-colors:none;-moz-border-left-colors:none;-moz-border-right-colors:none;-moz-border-top-colors:none;background-color:#3E9ED6;border-color:#2F71A3 #265A82 #1E4766;border-image:none;border-radius:8px 8px 8px 8px;border-style:solid;border-width:1px;box-shadow:0 -4px 5px rgba(255, 255, 255, 0.2) inset, 0 1px 5px rgba(255, 255, 255, 0.2) inset, 0 2px 0 #1E4766, 0 1px 0 #1E4766, 0 1px 0 #1E4766, 0 3px 7px rgba(0, 0, 0, 0.5);clear:both;color:#FFFFFF;display:block;font-size:24px;font-weight:bold;margin:0 auto 8px auto;padding:10px 15px;position:relative;text-align:center;cursor:pointer;}
}
/*
*
* Sound recorder
*
*/
#recorder{
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
font-style: normal;
padding: 5px;
text-align: center;
width: 294px;
min-height: 180px;
}
#recorder h2{
font-size: 20px;
margin: 15px 0;
text-align: center;
font-weight: bold;
padding: 0;
}
#recorder #slide3 h2{
color: #3C3C3C;
font-size: 26px;
font-weight: bold;
margin: 26px 0;
padding: 0;
text-align: center;
}
#recorder #slide5 .status{
margin-top: 60px;
}
#recorder p{
font-size: 14px;
margin: 0 0 15px 0;
line-height: 1.2em;
text-align: left;
}
#recorder .text-center{
text-align: center;
}
#recorder .hidden{
display: none;
}
#recorder .button{
color: #FFFFFF;
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset;
border-radius: 4px;
cursor: pointer;
display: inline-block;
font-size: 14px;
font-weight: normal;
line-height: 1.42857;
margin: 2px;
padding: 6px 12px;
text-align: center;
vertical-align: middle;
white-space: nowrap;
text-decoration: none;
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
}
#recorder .button.green{
background-color: #61BA9E;
border-color: #4FB393;
}
#recorder .button.red{
background-color: #D9534F;
border-color: #D43F3A;
}
#recorder .button.red:hover{
background-color: #D2322D;
border-color: #AC2925;
}
#recorder .button.big{
border-radius: 6px;
font-size: 18px;
line-height: 1.33;
padding: 10px 16px;
}
#recorder .button.small{
border-radius: 3px;
font-size: 12px;
line-height: 1.5;
padding: 1px 5px;
}
#recorder .button:hover{
background-color: #49A98A;
border-color: #3B8970;
color: #FFFFFF;
text-decoration: none;
}
#recorder #slide2 h2{
margin-top: 50px;
}
#recorder #slide4 .status{
margin: 45px 0 5px 0;
}
#recorder .inline{
display: inline;
}
#recorder .blinking {
-webkit-animation-name: blinker;
-webkit-animation-duration: 1s;
-webkit-animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
-moz-animation-name: blinker;
-moz-animation-duration: 1s;
-moz-animation-timing-function: linear;
-moz-animation-iteration-count: infinite;
animation-name: blinker;
animation-duration: 1s;
animation-timing-function: linear;
animation-iteration-count: infinite;
}
@-moz-keyframes blinker {
0% { opacity: 1.0; }
50% { opacity: 0.0; }
100% { opacity: 1.0; }
}
@-webkit-keyframes blinker {
0% { opacity: 1.0; }
50% { opacity: 0.0; }
100% { opacity: 1.0; }
}
@keyframes blinker {
0% { opacity: 1.0; }
50% { opacity: 0.0; }
100% { opacity: 1.0; }
}
@media screen and (min-width: 1px) and (max-width: 1005px) {
.hideOnSmall{
display: none;
}
}
/* Hi there mysterious programmer ! If you have reached this part you have studied css code thoroughly. As you can see it has been crafted with love and attention to details. But right now this is not important. Please take a break and drink some coffee. Take care ! */