/* Sun Jan 30 10:38 PM */
@media screen and (max-width: 640px){

/* Generic */
body,div,p,h1,h2,h3,ul,ol,li,br {margin: 0;padding:0}
body {font-family: Helvetica, Arial, Verdana, sans-serif;font-size:60%; background-color: #00ff00; }
a {color: green}
a:hover {background-color:#FF0}
#skip {display:none}
h1 {border-bottom: 4px solid #000; background-image:linear-gradient(to top right,#FCEEDF,#F1FEEF);}
h2 {border-bottom: 3px solid #666; background-image:linear-gradient(to top right,#FCEEDF,#FFF);}
h3 {border-bottom: 2px solid #CCC; background-image:linear-gradient(to top right,#F1FEEF,#FFF);}
h4 {border-bottom: 1px solid #DDD}
td, th {font-size: 130%}
iframe {border: 0;}
figure {margin:0;}

/* HighLights & UTIL */
.cool-highlight,.row-odd td {background-color:#ddeeff}
.warm-highlight,.row-even td {background-color:#ffeedd}
.green-hightlight {background-color:#CCFFCC}
.red-highlight {color:#FF0000}
.where-highlight {padding: 4px; font-size:150%;text-align:center}
.clear {clear:both;height:1px;width:1px;margin:0;padding:0}

/* Heading */
div#heading2015 {border-width: 0 1px 0 1px; border-style:solid; border-color:green; padding: 3px; height:100px; background: url("/images/navimagismol.jp2") no-repeat scroll 100% top #fff; overflow: hidden;}
#heading2015 p {padding: 0;}
#heading2015 p.brand {margin: 0 0 0 5px} 
#heading2015 p.slogan {margin: 0 0 0 9px; width: 60%; background:#FFF; } 
#heading2015 p a {text-decoration: none; text-shadow: 1px 1px 1px #ccc; color: green; font-size: 300%; padding: 0}

/* Search Box & Social */
form#cse-search-box { margin: 4px 0 0 8px;}
#cse-search-box input.input-text { border: 1px solid #000; height:28px; margin: 0; width:220px;}
#social-search2015 {background-color:#FFF;border-width: 1px 1px 0 1px; border-style:solid; border-color:#333;padding: 7px 0 0 5px;margin: 0; height:auto; overflow: auto;}
#searchform {padding:8px 0 0 13px;}
#input#s {background: #fff;border: 1px solid #000;color: #000; width: 150px;margin:1px;height:20px}

/* Global Nav */
div#newest-menu, div#species-menu {border-width: 1px; border-style:solid; border-color:green; padding: 5px; height:auto; background-image:linear-gradient(to top right,#FCEEDF,#F1FEEF); overflow: auto; margin-top: 0; text-align:center; }
#newest-menu li, #species-menu li {display: inline-block; margin: 0 1px 3px 1px; font-size: 200%; line-height:150% !important; background-color: rgb(230,255,230);  padding: 3px; border:1px solid #43962A; border-radius:4px;height:30px}
#newest-menu li a, #species-menu li a {text-decoration:none}
#newest-menu li a:hover, #species-menu li a:hover  {background-color:#FF0;}

#socialicons img {margin: 0 4px 0 4px; padding: 0;vertical-align:text-bottom;}

/* Content */
#content, #content-home {background-color:#FFF}
#content p, #content-home p, small {padding: .4em; font-size: 2em}
#content-home ul, #content ul {padding: 0 0 0 3em}
#content-home ol, #content ol {padding: 0 0 0 4em}
#content-home li, #content li {margin-left: 0.2em; padding: .4em .4em .4em 0; font-size: 1.9em}
#content #books li {font-size: 1em;}
#content #books ul {padding:0 0 0 20px}
#speciesform label, #speciesform select, #speciesform input{font-size: 2em}
#content li li {margin-left: 0.2em; padding: .4em .4em .4em .4em; font-size: .8em}
#content h1, #content-home h1 {padding: .4em; font-size: 2em}
#content h2, #content-home h2 {padding: .4em; font-size: 2em}
#content h3, #content-home h3 {padding: .4em; font-size: 2em}
#content h4, #content-home h4 {padding: .4em; font-size: 2em}
#content small, #content-home small {padding: .4em; font-size: 0.8em; display: block}
#content img, #content-home img {max-width:90% !important; height:auto !important; margin: 4px}
#content iframe, #content-home iframe {max-width:300px !important;  margin: 4px !important}
#content-home a, #content a {-ms-word-break: break-all; word-break: break-all; word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto;} 

/* Footer */
#footer {font-size:200%;height: auto;text-align:center;width:auto;background-image:linear-gradient(to top right,#FCEEDF,#F1FEEF); border-radius:25px;margin: 5px 0;}
#footer p {padding: 5px 0}
#footer a {color: green}

/* Page Specific */
.where-content td, .where-content th {border: 1px solid #999999; margin:1px}
.where-content table {border-collapse:collapse;}
textarea.codegrabs {width:90%; height:60px; padding:4px; margin: 4px; }
.big-screen {display:none !important}
div.species1 {width:290px;float:left; padding: 0 10px 0 10px}
div.species2 {width:290px;float:left; padding: 0 10px 0 10px}
div.species3 {width:290px;float:left; padding: 0 10px 0 10px}
#grid .species .species-name {text-align: center;background-color: #F8BB1B}

.nutable td {vertical-align:top}
.nutable .cell-decim {background-color:#EFF}
.nutable .cell-cassini {background-color:#FFE}
.nutable .cell-decula {background-color:#faf1b1}


#socialicons a span {color:#FFF;height:27px}
#socialicons a span.ifacebook {background-color:#46588f;padding:0 9px}
#socialicons a span.iX {background-color:#000000;padding:0 5px}
#socialicons a span.iinstagram {background-color:#c45360;background-image: linear-gradient(45deg,#edc06f,#c45360,#883ead);padding:0 8px}
#socialicons a span.iyoutube {background-color:#F00;padding:0 4px}

#cookieBanner {position:fixed;visibility: hidden;bottom: 0px; background:#DEF;text-align:center; padding:8px 0px;width:100%;font-size:12pt;}

#cookieBanner p {margin-block-end: 0px;margin-block-start:0px;padding:2px 0px}

#cookieBanner #OK {color:white;background:#963;display:inline-block;padding:5px;border-radius: 5px;}

#timealert p {background-color: yellow; text-align: center; font-weight: bold}

} /* End Mobile */

/* Start Desktop */
@media screen and (min-width: 641px) {

body { background-color: #00ff00; background-image:linear-gradient(to top right,#E0752F,#43962A); color:#000; font-family: Helvetica, Arial, Verdana, sans-serif; font-size: 80%; margin: 0; padding: 0;}
a {color:green;cursor: url("/cicadas/wp-content/uploads/2024/01/cursormxiii.gif"), default !important;}
a:active {color: #FF0000 !important;}
a:hover {background-color: #FF0; text-decoration: none;}
h1 {font-size: 15pt;margin: 3px;text-shadow: 1px 1px 1px #CCC;}
h2 {font-size: 13pt;margin: 3px;text-shadow: 1px 1px 1px #CCC;}
h3 {font-size: 11pt;margin: 3px;text-shadow: 1px 1px 1px #CCC;}
ul {margin: 0;padding: 0;}
iframe {border: 0;}
figure {margin:0;}

/* HighLights */
.cool-highlight {background-color:#ddeeff}
.warm-highlight {background-color:#ffeedd}
.green-hightlight {background-color:#CCFFCC}
.red-highlight {color:#FF0000}
.where-highlight {padding: 4px; font-size:150%;text-align:center}

/* Float Utilities */
.clear {clear:both;height:1px;width:1px;margin:0;padding:0}
.float-right {float:right}
.float-left {float:left}

/* Wrapper */
#thewrapper {margin-left: auto;margin-right: auto;width: 1010px;}

/* Heading */
#skip {display: none}
div#heading2015 {border-width: 0 1px 0 1px; border-style:solid; border-color:green; padding: 3px; height:98px; background: url(/images/navimagi.png) no-repeat scroll right top #fff; overflow: hidden; }
#heading2015 p {padding: 0;}
#heading2015 p.brand {margin: 0 0 0 10px} 
#heading2015 p.slogan {margin: 0 0 0 14px} 
div#heading2015 p a {text-decoration: none; text-shadow: 1px 1px 1px #ccc; color: green; font-size: 300%; padding: 0}

/* Search Box */
form#cse-search-box { margin: 3px 0 0 8px;}
#cse-search-box input.input-text { border: 1px solid #000; height:30px; width:300px; margin: 0 0 0 6px}
input#s {background: #fff;border: 1px solid #000;color: #000; width:150px;margin:1px;height:20px}
#searchform {padding:8px 0 0 13px;}


/* Menus */
div#newest-menu, div#species-menu  {border-width: 1px 1px 0 1px; border-style:solid; border-color:green; padding: 5px; height:auto; background-color: white; overflow: hidden; margin-top: 0;  background-image:linear-gradient(to top right,#FCEEDF,#F1FEEF);}
#newest-menu li, #species-menu li {display: block; float: left; margin: 0 4px; font-size: 150%; line-height: 150%; background-color: rgb(230,255,230);  padding: 3px; border:1px solid #43962A; border-radius:4px;height:26px}
#newest-menu li a, #species-menu li a {text-decoration:none}
#newest-menu li a:hover, #species-menu li a:hover {background-color: #FF0}
#socialicons img {margin: 0 4px 0 4px; padding: 0}

/* Content */
#content {border:0;margin: 0;padding: 0; line-height:150%}
#content-right ul { margin-left: 20px;}
#content-right{background-color:#FFF;border:1px solid #999;padding: 1em; border-bottom-right-radius:25px;border-bottom-left-radius:25px }

/* Footer */
#footer {font-size:120%;height: auto;text-align:center;width:auto;background-image:linear-gradient(to top right,#FCEEDF,#F1FEEF); border-radius:25px;margin: 5px 0;}
#footer p {padding: 5px 0}
#footer a {color: green}

/* Homepage */
div#content-home {background-color:#FFF;height:auto; border: 1px solid #000; font-size: 120%;  line-height:150%; border-bottom-right-radius:25px; border-bottom-left-radius:25px }
.content-main  {background-color:#FFF; margin:0 0 0 5px; padding:5px 5px 0 5px; width: 740px; float:left; border-radius:25px }
.content-supp {background-image:linear-gradient(to top right,#FCEEDF,#F1FEEF);margin:0 5px 0 0; padding:5px 5px 0 5px; width: 226px; float:left; border-radius:25px;}
#content-home .section { padding:5px 5px 0 5px; margin-bottom:5px;overflow:auto;}
#content-home ul {margin-left: 20px}
#content-home p {margin: 4px 0 8px 0}
.hello {min-height:85px}
.figure {border:1px solid #CCC} .figure p {padding: 0 8px}
.tymbal {width:260px; padding:2px}
.rostrum {width:207px; padding:2px; margin-right: 4px}
div.linkz {height:auto;}
.linkz ol {width:320px}

/* Where Page */
.where-content {background-color: #FFF; background-image: url('/images/hi.gif'); background-repeat:no-repeat; background-position:right top;}
.where-content td, .where-content th, .audio-chart td, .audio-chart th {border: 1px solid #999999}
.where-content table, table.audio-chart {border-collapse:collapse;}
.grid  {width:auto; height:auto; }
.grid div div{ padding: 0 4px 0 4px;  border:1px solid #999}
.grid .species {width:312px; float:left; height:auto;}
.grid .species .species-name {height:40px;}
.grid .species .species-name h3 {font-size:25px}
.grid .species .species-similar {height:350px;}
.grid .species .species-signs {height:430px;}
.grid .species .species-looks {height:460px;}
.grid .species .species-appearance {height:620px;}
.grid .species .species-features{height:300px;}
.grid .species .species-song {height:180px;}
.grid .species em {font-weight: bold}
.row-odd, .decim {background-color:#FFFFEE}
.row-even, .decula {background-color:#FFEEFF}
.cassini {background-color:#EEFFFF}

.nutable td {vertical-align:top}
.nutable .cell-decim {background-color:#EFF}
.nutable .cell-cassini {background-color:#FFE}
.nutable .cell-decula {background-color:#faf1b1}


#socialicons a span {color:#FFF;width:24px;height:27px;display:inline-block;text-align:center}
#socialicons a span.ifacebook {background-color:#46588f;}
#socialicons a span.iX {background-color:#000000;}
#socialicons a span.iinstagram {background-color:#c45360;background-image: linear-gradient(45deg,#edc06f,#c45360,#883ead);}
#socialicons a span.iyoutube {background-color:#F00;}

#cookieBanner {position:fixed;visibility: hidden;bottom: 0px; background:#DEF;text-align:center; padding:8px 0px;width:100%;font-size:12pt;}

#cookieBanner p {margin-block-end: 0px;margin-block-start:0px;padding:2px 0px}

#cookieBanner #OK {color:white;background:#963;display:inline-block;padding:5px;border-radius: 5px;}

div#crawler {position:fixed;visibility: visible;top: 10px; right:0px;width:69px;height:200px;background-image:url(/images/TRBG.png); color:green;cursor: url("/cicadas/wp-content/uploads/2024/01/cursormxiii.gif"), default !important;}
div#keyringer {position:fixed;visibility: visible;top: 260px; right:0px;width:112px;height:200px;background-image:url(/images/KeyChainA200.gif); color:green;cursor: url("/cicadas/wp-content/uploads/2024/01/cursormxiii.gif"), default !important;}
div#molter {position:fixed;visibility: visible;top: 200px; left:-10px;width:93px;height:300px;background-image:url(/images/CanicularisTR.png)}
#timealert p {background-color: yellow; text-align: center; font-weight: bold}
div#skyer {position:relative; top:0px; left:0px; width:100%;height:250px; z-index:2}
div#flyer {position:absolute; top:0px; left:0px; width:113px;height:250px;background-image:url(/images/clearRight.png);}
div#neottt {position:fixed; top:500px; right:0px; width:158px;height:250px;background-image:url(/images/neot2.gif);}
} /* End Desktop */