/*
Theme Name:esProc 英文博客 
Theme URI: http://blog.esproc.com
Version: 202504
*/

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0; }
body {margin:0; padding:0; background: #fff; font-family: sohne, "Helvetica Neue", Helvetica, Arial, sans-serif;text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased;  color: rgba(0,0,0,0.8); }

h1, h1 a{ color: rgba(41, 41, 41, 1); font-size: 36px; line-height: 46px; font-weight: bold;    font-family: sohne, "Helvetica Neue", Helvetica, Arial, sans-serif;    letter-spacing: 0; margin-bottom: 20px;     letter-spacing: -0.011em;}
h2, h2 a{color: rgba(41, 41, 41, 1); font-size:20px; line-height: 24px; font-weight: bold; font-family: sohne, "Helvetica Neue", Helvetica, Arial, sans-serif;}
h3, h3 a, h4, h4 a {color:#333333;	margin-bottom:0.875em; }
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover {color:#397BE9;}

a {	text-decoration:none;  color: #000; outline:none;}
a:hover {text-decoration: none;	color:#397BE9;}

p { font-size: 16px;  font-weight: 400;    line-height: 24px;  font-family: charter, Georgia, Cambria, "Times New Roman", Times, serif; color: rgba(41, 41, 41, 1);  display: block; margin-bottom: 1em;}
table {	margin-bottom:20px;}
th,td {	padding: 0 5px; line-height:2em;}
 
hr{ border-top: 1px dashed #e6e6e6; margin: 20px 0;}
hr.wp-block-separator{border-bottom: none!important; border-top: 1px dashed #e6e6e6;}
img { border:none; margin:0 0 0 0; max-width: 100%;}
.width10{width: 10%;}
.width15{width: 15%;}
.width20{width: 20%;}
.width30{width: 30%;}
.width35{width: 35%;}
.width40{width: 40%;}
.width45{width: 45%;}
.width50{width: 50%;}
.width55{width: 55%;}
.width60{width: 60%;}
.width65{width: 65%;}
.width70{width: 70%;}
.width80{width: 80%;}
.width90{width: 90%;}
.width100{width: 100%;}
.gray{ color: gray;}
.bgBlue{ background: #397BE9; }
.bgGreen{ background:#4DA053 }

.clearBoth{ clear:both; height: 0; line-height: 0; font-size: 0; }
.floatRight, .right{ float:right; display: inline;}
.floatLeft, .left{ float:left; display: inline;}
.displayNone{ display:none;}
.pcDisplayNone{display: none;}
.mobileDisplayNone{display:inherit ;}
.button{ display:inline-block;transition: 0.5s;  color:#fff; -moz-border-radius: 4px;-webkit-border-radius:4px;border-radius:4px;text-align: center;  background: #397BE9; text-shadow: 0 -1px 0 rgba(0,0,0,.12);  box-shadow: 0 2px #0000000b;font-weight: 400; }
.button:hover {background: #40a9ff;  color:#fff;  }

.container{width: 1000px; margin: 0 auto;}
 
#header{ height: 60px; position: relative;  z-index: 2;  max-width: 100%;  background: #fff;   }
#header .mobileDisplayNone{position:fixed;  top: 0;  left: 0;  right: 0;  background: #fff; box-shadow: 0 0px 5px rgba(0,0,0,0.1);  }
#logo{ height: 40px; width: 40px;  margin: 10px 0px 10px 0; float: left;}
.logoTitle{height: 30px; margin: 15px 0 ;  float: left;   color:#080e29;}
.logoTitle .SCUDATA{font-size: 13px; line-height: 17px; font-weight: bold;}
.logoTitle .esProc{font-size: 13px; line-height: 14px;  }
.logoTitle .spl{height: 30px; margin:0px 0px 0 10px ;  float: left;  border-left: 1px solid rgba(0,0,0,0.05); padding-left: 10px;color: #2881ee; font-size: 26px; line-height: 30px; font-weight: bold; }
#mainNav{float:right;}
.primaryNav{float: left; }
#mainNav ul {  line-height: 60px; margin: 0;font-size: 14px;}
#mainNav ul li{ float: left;  margin: 0 00 0 10px; padding: 0 3px; list-style: none;  }

.buttonDownload a{ display: block; -moz-border-radius: 20px;-webkit-border-radius:20px;border-radius:20px; margin: 14px 0 10px 0px; line-height:30px;height:30px; padding: 0 15px 0px 30px;  background:#397BE9 url(images/download.svg) no-repeat 10px 6px / 16px auto;  color:#fff; }
.buttonDownload a:hover {  background:#2663cb url(images/download.svg) no-repeat 10px 8px / 16px auto;  color:#fff;  }
.buttonGithub a{ display: block; -moz-border-radius: 20px;-webkit-border-radius:20px;border-radius:20px; margin: 14px 0 10px 0px; line-height:30px;height:30px; padding: 0 15px 0px 30px;  background:#4DA053 url(images/github.svg) no-repeat 10px 6px / 16px auto;  color:#fff; }
.buttonGithub a:hover {  background:#3B7E40 url(images/github.svg) no-repeat 10px 8px / 16px auto;  color:#fff;  }

/*------------------------------------*\移动端导航\*------------------------------------*/
#nav{padding:0 0; }
.main-nav{position:fixed;right:0;overflow-y:auto;margin:60px 0 0 0;width:0%;height:calc(100vh - 60px);max-width:250px;background:#012c72;-webkit-box-shadow:0 80px 0 0 #1c1d21;box-shadow:0 80px 0 0 #1c1d21;-webkit-transition:.2s all;transition:.2s all;-webkit-transform:translateX(100%);transform:translateX(100%);-ms-transform:translateX(100%);transition: 0.5s; }
#nav.open .main-nav{width:100%;-webkit-transform:translateX(0);transform:translateX(0);-ms-transform:translateX(0)}
.main-nav .primaryNav{float: none; }
.main-nav li{border-top:1px solid rgba(250,250,250,.1);width:100%}
.main-nav li a{display:block;color:#fff;-webkit-transition:.2s all;transition:.2s all;padding:10px 10px;}
.main-nav li a.button{ padding:8px 0px; margin: 10px;}
.main-nav>li.active{border-left:6px solid #397BE9}
.main-nav li a:focus,.main-nav li a:hover{background-color:#397BE9;color:#fff;opacity:1}
/*子菜单样式*/	
.has-dropdown>a:after{float:right;content:"\f054";font-family:FontAwesome;-webkit-transition:.2s -webkit-transform;transition:.2s -webkit-transform;transition:.2s transform;transition:.2s transform,.2s -webkit-transform}
.dropdown{visibility:hidden;height:0;background:rgba(250,250,250,.1);opacity:0}
.dropdown li a{padding:10px 10px}
.has-dropdown.open-drop>a:after{-webkit-transform:rotate(90deg);transform:rotate(90deg);-ms-transform:rotate(90deg)}
.has-dropdown.open-drop>.dropdown{visibility:visible;height:auto;opacity:1;-webkit-transition:.2s all;transition:.2s all}
	
/*展开折叠按钮*/
.nav-collapse span{position:absolute;top:50%;right:0%;display:block;width:25px;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transition: 0.5s; }
.nav-collapse span:after,.nav-collapse span:before{display:block;content:""}
.nav-collapse span,.nav-collapse span:after,.nav-collapse span:before{height:4px;background:#0C6AFF;-webkit-transition:.2s all;transition:.2s all}
.nav-collapse span:before{-webkit-transform:translate(0,10px);transform:translate(0,10px);-ms-transform:translate(0,10px)}
.nav-collapse span:after{-webkit-transform:translate(0,-14px);transform:translate(0,-14px);-ms-transform:translate(0,-14px)}
#nav.open .nav-collapse span{background:0 0}
#nav.open .nav-collapse span:before{-webkit-transform:translateY(0) rotate(-135deg);transform:translateY(0) rotate(-135deg);-ms-transform:translateY(0) rotate(-135deg)}
#nav.open .nav-collapse span:after{-webkit-transform:translateY(-4px) rotate(135deg);transform:translateY(-4px) rotate(135deg);-ms-transform:translateY(-4px) rotate(135deg)}
.navbar{position:fixed;top:0;right:0;left:0;z-index:50;background:#fff;box-shadow:0 1px 2px #ddd}
 
.navbar-brand img{height: 60px;}
#nav.open .main-nav{z-index:9}
 
/*--存档页面--*/
#archive{  display:inline; text-align:left;   margin:0; padding: 0 0 1em 0; }	
.section{ clear:both;  margin:0 0 0 0em ; padding: 24px 0px 0 0px;  border-bottom:1px rgba(230, 230, 230, 1) solid; }
.section:hover{ background-color: rgba(0,0,0,0.015); }
.section h2{margin-bottom: 4px;  }
.section h2 a{ color: #242424; }
.sectionText{width: calc(100% - 0px) ;}
.excerpt{ margin:8px 0px;  }
.excerpt p{ font-family: sohne, "Helvetica Neue", Helvetica, Arial, sans-serif; color: #6B6B6B; display: inline; margin-bottom: 8px; }
.excerpt ul,.excerpt ol{list-style-position: outside; margin-left: 1em; margin-bottom: 20px;font-size: 16px;}
.excerpt ul li,.excerpt ol li{ margin-bottom: 10px;}
.excerpt h2{font-size: 18px; color: rgba(41, 41, 41, 1);}
.readMore{ display:inline-block; color: rgba(41, 41, 41, 1); margin: 0 10px; padding: 0px 0px;-webkit-transition:.2s all;transition:.2s all;text-decoration: none!important; font-size: 13px; border:1px dotted rgba(0,0,0,0.00); background: rgba(0,0,0,0.00) ; border-radius: 100px; }
.readMore:hover{ }
.ecae-button {display: none!important;}
.thumbnail{ float:right; display:inline;  padding:0; border: none; margin:0 0px 20px 30px ;   height: auto; }
.thumbnail img{  max-height: 112px; width: 200px;}

#page,#post,#archive{ text-align:left; margin:0;  }	
#page .entry a ,#post .entry a {	text-decoration:underline;  color: #397BE9; outline:5px;}
#page .container, #post .container, #archive .container{ box-shadow: 0 0px 5px rgba(0,0,0,0.1); border-radius: 10px; margin: 20px auto ; padding: 20px 20px; width: 960px; }
 
#page h1, #post h1{  padding: 20px 0 ;  }

#post .entry{font-family: fell, Georgia, Cambria, "Times New Roman", Times, serif;font-size: 20px;    line-height: 32px;letter-spacing: -0.003em; word-break: break-word; }
#post .entry p{margin-bottom: 30px; font-size: 20px; font-weight: 400; line-height: 32px;}
#post .entry img{margin-bottom: 30px;  }
#post .entry .wp-block-image {margin-bottom: 30px;  }
#post .entry .wp-block-image img{margin-bottom: 0px;  }
#post .entry .wp-block-image figcaption{ font-size: 14px; text-align: center; color: #999; font-family: sohne, "Helvetica Neue", Helvetica, Arial, sans-serif; }

#post .entry h2{margin-top: 2.37em ; margin-bottom: 30px;font-size: 24px; }
#post .entry h3{margin-top: 1.37em ; margin-bottom: 30px;font-size: 20px; }
#post .entry h4{ margin-top: 1em; margin-bottom: 30px; font-size: 16px; padding-left:10px; border-left:8px solid #d8d8d8; line-height:1em; font-weight: 700; font-style:italic; }

#post .entry ul,#post .entry ol{list-style-position: outside; margin-left: 1em; margin-bottom: 20px;}
#post .entry ul li,#post .entry ol li{ margin-bottom: 10px;}

#Guide .entry { font-size: 16px; line-height: 24px;}
#Guide h1{  font-size: 42px;  padding: 15px 0;}
#Guide .entry h2{  color: #fff; line-height: 2em; border-radius: 5px; padding: 0 10px; }
#Guide .entry h2 a{  color: #fff;  }
#Guide .entry h3{ margin-left: 10px;}
#Guide .entry ul{ margin-bottom: 30px;list-style: none;  margin-left: 10px;}
#Guide .entry ul a { text-decoration: none;  color: #397BE9; }
#Guide .entry ul a:hover {  border-bottom: 1px solid #397BE9; }


.postMeta { line-height: 2em; padding: 0 0 24px 0px;font-size: 13px; color: #b8b8b8; font-family: sohne, "Helvetica Neue", Helvetica, Arial, sans-serif;}
.postMeta span { margin-right: 16px; padding: 2px 0px;}
.postMeta .category{}
.postMeta .category a{ transition: background 300ms ease;  padding: 2px 10px; border-radius: 100px;  background-color: rgba(242, 242, 242, 1); }
.postMeta .category a:hover{ color:#fff; background:  #397BE9; }
.postMeta .tag{ transition: background 300ms ease; ;}
 
#RelatedPosts{margin: 20px 10px;}
#RelatedPosts ul li{list-style: outside; margin-left: 1em; }

table,.spl table{ width: 100%; margin:0 0 30px 0!important;  line-height:22px;font-size:13px; font-weight: normal;border:0.5px solid #ccc;border-collapse:collapse;border-spacing:0px;}
table tr td,.spl table tr td{padding: 0 5px 0 5px;  line-height: 2em; border:0.5px solid #ccc; font-family: "Source Code Pro","Liberation Mono","Courier New",Courier,monospace;}
table.spl tr td:first-of-type{ background:#f8f8f8; color:#000; text-align:center;}
table.spl tr:first-of-type td{ background:#f8f8f8; color:#000; text-align:center;}
.spl table tr td:first-of-type{ background:#f8f8f8; color:#000; text-align:center;width: 24px;}
.spl table tr:first-of-type td{ background:#f8f8f8; color:#000; text-align:center; }


table.Thead ,.Thead table{ width: 100%; margin:0 0 30px 0!important;  line-height:22px;font-size:13px; font-weight: normal;border:0.5px solid #ccc;border-collapse:collapse;border-spacing:0px;}
table.Thead tr td,.Thead table tr td{padding: 0 5px 0 5px;  line-height: 2em; border:0.5px solid #ccc; font-family: "Source Code Pro","Liberation Mono","Courier New",Courier,monospace;}
table.Thead tr:first-of-type td,.Thead table tr:first-of-type td,table thead tr th{ background:#f8f8f8; color:#000; text-align:center;border-bottom: 2px solid #ccc!important; }

.wp-block-table{margin-bottom: 20px;}
.wp-block-table td, .wp-block-table th{padding: 0 5px 0 5px!important; border: 0.5px solid #ccc!important;}
.wp-block-table thead{border-bottom: 2px solid #ccc!important; }

.enlighter-default{margin-bottom: 30px!important;}
.enlighter-v-inline { margin: 0!important;}
.enlighter span { line-height: 2em!important;}
figure { display: block; -webkit-margin-before: 0em; -webkit-margin-after: 0em; -webkit-margin-start: 0px;  -webkit-margin-end: 0px;}

.sharedaddy {margin: 50px 0 0 0;}

.recommend ul {list-style: none;  margin:30px 0 0;  padding:30px 0px ; border-top: 1px rgba(230, 230, 230, 1) solid;  }
.recommend li {margin: 10px 20px 10px 0; float: left; width: calc( 50% - 10px);}
.recommend li:nth-of-type(even) {margin-right: 0;  }
.recommend li a{ line-height:36px;height:36px; padding:0 20px; text-align: center; color: #fff; display: block; -moz-border-radius: 20px;-webkit-border-radius:20px;border-radius:20px; }
.recommend li a.recommend-official-website{  background:#397BE9 ; }
.recommend li a.recommend-official-website:hover { background:#2663cb ; }
.recommend li a.recommend-reddit{ background:#ff4500  ; }
.recommend li a.recommend-reddit:hover { background:#c13300  ;  }
.recommend li a.recommend-forum{ background:#375591  ; }
.recommend li a.recommend-forum:hover { background:#253a63  ;  }
.recommend li a.recommend-github{ background:#4DA053  ; }
.recommend li a.recommend-github:hover { background:#3B7E40  ;  }


#post .jp-relatedposts { font-family: sohne, "Helvetica Neue", Helvetica, Arial, sans-serif;}
#post .jp-relatedposts img{  margin-bottom: 10px;}



/*--sidebar--*/
#sidebar{ float:right; display:block ;margin:0; padding: 20px 0 20px 20px; width:220px; text-align: left; font-size:13px; box-shadow: -1px 0px 0px rgba(0,0,0,0.08); }
#sidebar ul {padding: 10px 0 20px 0;}
#sidebar ul li { list-style:none;  line-height:1.2em; padding: 0  ;margin: 0;}
#sidebar ul li a{ width:100%;  display: inline-block;padding:10px 5px; }
#sidebar ul li a:hover{background-color: rgba(0,0,0,0.02);}
#sidebar ul ul li { margin:0 0 0 1em;}
#sidebar h3 {  line-height:20px; margin:  0.83em 0 0.5em; padding:0; font-size: 16px;font-weight: 700;   } 
#searchform{border: 1px solid rgba(230, 230, 230, 1);border-radius: 0px;width:100%;height: 30px; margin: 0 0 30px 0;}
#searchform input{border:none; line-height: 30px; height: 30px; }
#searchform input#s{ width:calc(100% - 40px); float: left; padding: 0 5px; }
#searchform input#searchsubmit{  width: 30px;  background:#fff url(images/search.svg) no-repeat center center/ 16px auto; float: right;}

#sidebar ul.guideSide li{ color: #fff; border-radius: 5px; height: 32px; line-height: 32px; padding: 0; margin-bottom: 10px; clear: both; font-weight: bold; display: block; font-size:12px;}
#sidebar ul.guideSide li span{ display: inline-block; height: 32px; width: 30px; background-color: rgba(255,255,255,.12); margin: 0 5px 0 0;  border-radius: 5px 0 0 5px; float: left; border-right: 1px solid rgba(255,255,255,0.2)}
#sidebar ul.guideSide li img{ width: 16px; margin: 8px 7px 8px 8px;}
#sidebar ul.guideSide li a{ padding: 0; color: #fff; }
#sidebar ul.guideSide li a:hover { background-color: rgba(0,0,0,0.1); border-radius: 5px; }
#sidebar ul.guideSide li.guideSide-1{ background-color: #3F85EB; }
#sidebar ul.guideSide li.guideSide-2{ background-color: #3F85EB;}
#sidebar ul.guideSide li.guideSide-3{ background-color: #3F85EB; }
#sidebar ul.guideSide li.guideSide-4{ background-color: #3F85EB;  }
#sidebar ul.guideSide li.guideSide-5{ background-color: #3F85EB;  }
#sidebar ul.guideSide li.guideSide-6{ background-color: #3F85EB;/*background-color: #599F56;*/ }
#sidebar ul.guideSide li.guideSide-7{ background-color: #599F56; }
#sidebar ul.guideSide li.guideSide-8{ background-color: #3F85EB;/*background-color: #599F56;*/ }
#sidebar ul.guideSide li.guideSide-9{ background-color: #CC3333;  }
#sidebar ul.guideSide li.guideSide-10{ background-color: #3b414f; border-right:5px solid #fed000; }

#content{ float:left; display:block ;margin:0; padding:20px 20px 20px 0px;  width: calc(100% - 260px); }
#content100{ margin:0; padding:20px 20px 20px 20px;     }

/*--pagination--*/
.pagination{ margin-top: 20px;  }
.pagination li.next-page,.pagination li.prev-page{ }
.pagination ul{display: inline-flex; list-style: none;}
.pagination li span, .pagination li a{ margin: 0 1px; padding: 4px 12px 4px; background: rgba(21,110,217,0.05);  line-height: 20px;}
.pagination ul > li > a:hover, .pagination ul > li > a:focus, .pagination ul > li.active span { background-color: #156ED9; color: #fff;}

/*--footer--*/
#footer{color:rgba(255,255,225,0.7) ; background: linear-gradient(135deg,#195ac3,#195ac3); padding: 20px 0; line-height: 2em; font-size: 13px; }
#footer a{color:rgba(255,255,225,0.9) ;  }
#footer .right {display: inline-flex;}
#footer .right a{ width: 36px ; margin:  0px 5px; }
#footer .right img{ width: 32px ; padding:2px; transition: 0.3s;}
#footer .right img:hover{ width: 36px ; padding: 2px 0px;  }
 

@media only screen and (max-width: 900px){
    .pcDisplayNone{display: inherit;}
    .mobileDisplayNone{display: none;}
    .floatRight, .right{ float:none; display: inline;}
    .floatLeft, .left{ float:none; display: inline;}
    .width20,.width30,.width35,.width40,.width45,.width50,.width55,.width60,.width70,.width80,.width90,.width100{width: 100%;}

    #header { height: auto;}

    .buttonDownload a{ margin: 10px; line-height:20px;height:20px; padding: 0px;  background:#397BE9 ; text-align: center;   }
    .buttonDownload a:hover {  background:#2663cb ; }
    .buttonGithub a{  margin: 10px ; line-height:20px;height:20px; padding: 0  ;  background:#4DA053  ; text-align: center;   }
    .buttonGithub a:hover {  background:#3B7E40  ;  }
    .buttonGithub2{float: right;  margin-right: 60px;}
    .buttonGithub2 a{ display: inline-block; -moz-border-radius: 20px;-webkit-border-radius:20px;border-radius:20px; margin: 14px 0 10px 0px; line-height:30px;height:30px; padding: 0 10px 0px 30px;  background:#4DA053 url(images/github.svg) no-repeat 10px 6px / 16px auto;  color:#fff; font-size: 14px; }
    
    #page, #post, #archive {   margin: 80px 0 30px 0; }
    .container{width: calc(100% - 48px); margin: 0; padding: 0 24px; }
    h1,h1 a{ line-height: 28px; font-size: 22px; text-overflow: ellipsis;  }
    .section h2 { line-height: 20px;  font-size: 16px; text-overflow: ellipsis;    display: -webkit-box;overflow: hidden;  margin: 0 0 1em 0;}
    .sectionText{width: calc(100% - 0px) ;}
    .excerpt{ margin: 16px 0 0 0; }
    .excerpt h2 { line-height: 20px;  font-size: 16px; text-overflow: ellipsis;    display: -webkit-box;overflow: hidden;  margin: 0 0 1em 0;}
    .excerpt p{font-size: 14px;line-height: 20px;  }
    .excerpt ul,.excerpt ol{ font-size: 14px;}
    .readMore{margin: 0 0 10px 0; display: block; text-align: center; }

    .thumbnail{ float:right; display:none;  padding:0; border: none; width:56px;aspect-ratio: auto 56 / 56;  height: 56px; margin:0 0 16px 30px ;}
    .thumbnail img{ height: 56px;width: 56px;}
    .postMeta {line-height: 2em; padding: 16px 0 16px 0px; font-size: 12px; }
    .postMeta .time{display: none;}
 
    .pagination li span, .pagination li a{   padding: 4px 8px 4px;  }
 
    #page .container, #post .container, #archive .container{width:  calc(100% - 48PX ); margin: 30px 0;  padding:0 24px;  box-shadow: none; }
 
    #content{width: 100%;   padding: 0 0%; }
    #post .entry { font-size: 16px; line-height: 28px;}
    #post .entry p{ font-size: 16px; line-height: 28px;}
    #post h1,#page h1{ line-height: 40px; font-size: 32px; font-weight: 700;}
    #post .entry h2 { font-size: 20px; margin-top: 1.5em;margin-bottom: 1em;font-weight: 600;font-family: sohne, "Helvetica Neue", Helvetica, Arial, sans-serif;}
    #post .entry h3 { font-size: 16px; }
    .logoTitle .left{  float: left!important;  }
    #post img.attachment-post-thumbnail{height: auto!important; margin-bottom: 30px; max-width: 100%;}
    #post .entry .wp-block-image figcaption{ font-size: 13px; }

    #Guide .entry li{ font-size: 14px;}
    #Guide .entry h2{ font-size: 18px;}
    #Guide .entry h3{ font-size: 16px;}

    table tr td { word-break: break-word;}
    .enlighter-linenumbers div.enlighter>div::before { display: none!important;}
    .enlighter-default {overflow-x: scroll!important;  white-space: nowrap!important;  padding: 5px 0!important;}

    .recommend li {margin: 15px 0px; float: none; width: 100% ;}

    #sidebar{width: 100%; margin: 30px 0 0 0; padding: 30px 0; box-shadow: 0px -1px 0px rgba(0,0,0,0.08); }
    #sidebar ul.guideSide li{  height: 40px; line-height: 40px; font-size: 16px;}
    #sidebar ul.guideSide li span{  height: 40px; width: 40px; margin: 0 8px 0 0;}
    #sidebar ul.guideSide li img{ width: 24px; }

}