*{
	margin:0;
	padding:0;
}
html{
    font-size:18px;
}
body{
    height:100%;
	line-height:26px;
	font-family: 'Inconsolata', monospace;
}

ul,ol{
	margin-left:25px;
}
li{
	margin:5px 0;
}
canvas{
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

sub{
    font-size:9px;
}
ul.compact li{
	margin:2px 0;
}
h1,h2,h3{
	font-weight:normal;
}
h1, h2, h2.article-title{
	font-family: 'Droid Serif', Georgia, serif;
	font-size:1.6em;
  font-weight:bold;
  line-height: 1.6em;
	padding-bottom:8px;
  color:#101010;
  text-decoration:none;
}
h1{
	color:#202020;
    font-size:24px;
}
h3{
	font-size:2em;
	font-weight:bold;
}
h3 a{
	color:#333;
	text-decoration:none;
}
td{
	vertical-align:top;
}
a img{
	border:none;
}
a, h1 a, h2 a{
	color:#333;
}
h1 a, h2 a{
    text-decoration:none;
}
p{
    padding-bottom:15px;
}
a img{
    transition:opacity 200ms ease-out;
}
a img:hover{
    opacity:0.86;
    transition:opacity 200ms ease-in;
}
#menu-placeholder, #menu-wrap, #topMenu{
    height:50px;
}

#menu-placeholder, #menu-wrap{
    background:#05a;
    width: 100%;
}
#menu-wrap{
    border-bottom:1px solid rgba(0,0,0,0.2);
    position:relative; top:0; z-index:5;
}
#menu-wrap.fixed{
    box-shadow:0 0 6px rgba(0,0,0,0.4);
    transition: box-shadow 400ms ease-in;
    opacity:0.97;
}
#menu-wrap.fixed #topMenu{
    background:url('/images/template/small-logo.png') right 9px no-repeat;
    transition: background 150ms ease-in;
    background-size: auto 25px;
}
#topMenu a{
	transition: color 400ms ease-out;
	-moz-transition: color 400ms ease-out;
	-webkit-transition: color 400ms ease-out;
	-o-transition: color 400ms ease-out;
}
#topMenu a:hover{
	transition: color 70ms ease-out;
	-moz-transition: color 70ms ease-out;
	-webkit-transition: color 70ms ease-out;
	-o-transition: color 70ms ease-out;
    background: #048;
}
a:hover, h1 a:hover{
	color:#05a;
}
a.betaLink,.meta a{
	color:#333;
}
.title{
	text-decoration:none;
}

#blog h1 a{
	text-decoration:none;
}


.large{
	font-size:16px;
}
.e-large{
    font-size:18px;
}
.small,.meta{
	font-size:12px;
	color:#444;
    line-height:16px;
}
.meta{
    text-transform:uppercase;
}
.meta a{
    text-decoration:none;
}
#menu-placeholder{
    border-top:1px solid #000;
    height:40px;
    overflow:hidden;
    min-width:1140px;
    position: relative;
    z-index:5;
}
#topMenu{
    width:1140px;
    margin:0 auto;
    background:url('/images/template/small-logo.png') right 40px no-repeat;
    background-size: auto 25px;
}
#topMenu ul{
    margin-left:5px;
}
#topMenu ul li, #mobMenu ul li{
	list-style-type:none;
    text-transform:uppercase;
    margin:0;
}

.item{
	width:220px;
	height:220px;
}
.item img{
	border:4px solid #f4f4f4;
}

.menuItem{
	float:left;
    font-size:18px;
    transition: padding 200ms;
}
.menuItem a:hover{
    padding-top: 7px;
}
.menuItem a{
	padding:6px 16px 7px 16px;
	color:#fff;
	text-decoration:none;
	outline:none;
    display:inline-block;
}
.menuItem.divide{
	border-left:1px solid #dadada;
}
.clear{
	clear:both;
}

.quote{
	border-left:3px solid #ddd;
	font-style:italic;
	padding:10px;
	background:#eee;
}

.hpad{
    margin:0 2px;
}

a.btn{
	padding:5px 10px;
	background:#eee;
	border-radius:6px;
	text-decoration:none;
  font-size: 0.8em;
}
a.btn:hover{
	color:#fff;
  background:#657;
}
a.btn:active,focus{
	color:#fff;
	background:#657;
}
a.btn.active{
	background: #333;
	color:#fff;
}
.small a.btn{
	font-size:11px;
	padding:4px 6px;
}

.code, .boxed-info, .boxed{
    padding:10px;
	   border:1px solid #d8d8d8;
    background:#fdfdfd;
    box-shadow:inset 0 0 5px #fbfbfb;
    overflow: auto;
    border-radius: 2px;
}

.code, .boxed-info{
	font-family:"Courier New", Courier, monospace;
	white-space:nowrap;
    font-size: 12px;
    line-height:125%;
    color:#1b1b1b;
}

.code .data_type, .code .statement{
	color:#0052CE;
}

.code .control_structure{
	color:#0052CE;
}


.code .string, .code .string *{
	color:#F93;
}

.code .comment, .code .comment span{
	color:#888;
    font-weight:normal;
}

.no_format .code_format{
	color:#484848;
    font-weight:normal;
}

.code::-webkit-scrollbar {
    width: 12px;
	height:8px;
	background:#f0f0f0;
}

.code::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.12);
	background:#eee;
}

.code::-webkit-scrollbar-thumb {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.30);
	background:#bababa;
}
.code:hover::-webkit-scrollbar-thumb {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.30);
	background:#a0a0a0;
}
.code::-webkit-scrollbar-thumb:hover{
	background:#999;
}

.message{
	padding: 5px 8px;
	background: #fff;
	border-left: 3px solid #657;
	display:block;
}

#content-wrap{
    width:1140px;
    margin:0 auto;
    position:relative;
    background:#fff;
}
#body-wrap{
    position:relative;
    width:100%;
    background:#fff;
}

#content{
	color:#333;
  background:#fff;
  border-top:none;
  font-size:1em;
  float:left;
  width:875px
}

#content img{
	margin:0 3px;
  max-width: 100%;
}

#bottom_ad, #right-ad{
    padding:0 15px;
}
#bottom_ad .adsbygoogle, #right-ad .adsbygoogle{
    margin-top:3px;
	padding:15px 0;
}
#subscribe-modal{
    position:fixed;
    bottom:0;
    left:50%;
    margin-left:220px;
    width:228px;
    padding:20px 15px;
    background:#fff;
    border:1px solid #ddd;
    border-top-left-radius:3px;
    border-top-right-radius:3px;
}
#subscribe-modal-close{
    padding:0 10px; background:#ddd; position:absolute; right:0; top:0; font-size:12px; cursor:pointer;
}
.pad{
	padding:15px 10px
}
.no-pad{
    margin:0;
    padding:0;
}
.fill{
	overflow:hidden;
}

.hr{
	border-top:1px solid #eaeaea;
    width:auto;
    display: none;
}
.bottomMargin{
	margin-bottom:10px;
}

.half{
    width:300px;
}
.left{
	float:left;
}
.right{
	float:right;
}

.math{
    font-family:"Times New Roman",Georgia,Serif;
    font-style:italic;
    font-size:16px;
}

#social-links img{
    margin:0;
}

#menuBar{
	float:right;
	width:240px;
  line-height:auto;
  font-size:14px;
  line-height: 20px;
}

#menuBar h3{
    color: #202020;
    font-family: 'Droid Serif', Georgia, serif;
    font-size: 2em;
    padding-bottom: 0;
    font-weight:normal;
    line-height:2em;
}

#header_wrap{
    background:url('/images/template/headerbg2.jpg') #101010 repeat-x;
    height:210px;
    border-top:2px solid #358;
    min-width:1140px;
}
#header{
    width:1140px;
    height:210px;
    margin:0 auto;
    background:url('/images/template/header2.jpg') no-repeat 0 0;
}
#header #logo{
	padding-left:3px;
}
#header #little-robot{
    width:270px;
    height:199px;
    float:right;
    background:url('/images/template/robot.png') no-repeat;
    margin-right:5px;
    margin-top: 11px;
}
#header #little-robot #robot-hello{
      background: url('/images/robot-hello.png') no-repeat;
      height: 150px;
      display:none;
      margin: 36px 78px;
}
#header #little-robot:hover #robot-hello{
    display:block;
}

#footer-wrap{
    font-size:12px;
    color:#fff;
    padding:20px 0;
    background:#222;
  margin-top:25px;
  min-width:1140px;
}
#footer-wrap a{
  color:#fff;
}
#footer{
    width:1140px;
    margin:0 auto;
}
#footer-content{
    padding:0 15px;
}
#footer-logo{
    background:url('/images/template/small-logo.png') 0 0 no-repeat;
    background-size: auto 25px;
    width:160px;
    height:35px;
}

.divide{
	padding:0 3px;
	color:#57a;
}
.sep{
    font-size: 14px;
    color:#358;
}

.tag{
	padding:1px 6px;
	margin:3px;
	border-radius:5px;
	background: #05a;
	color: #fff;
    display:inline-block;
    text-decoration:none;
}
.tag:hover{
	background:#049;
	color: #fff;
}

.search, .text-input{
    border: 1px solid #c4c4c4;
	border-top: 1px solid #bbb;
    padding: 4px 5px;
    box-shadow: inset 0 1px 3px #fafafa;
    background: #fff;
    font-size: 14px;
	outline:none;
	width:250px;
	color:#888;
}
.search:focus, .text-input:focus{
	color:#666;
	border: 1px solid #ccc;
	border-top: 1px solid #bbb;
	box-shadow: inset 0 1px 3px #eee, inset 0 1px 1px #ddd;
    background:#fff;
}

.light{
    color:#666;
}
.light-text{
    color:#888;
    font-size:11px;
}
.vpad{
    margin:5px 0;
}
.lvpad{
    padding:8px 0;
}

.warning{
    color:#d33;
    font-style:italic;
}

select{
    outline: none;
    width:150px;
    padding:3px 5px;
}
.small-input{
    width:215px;
    font-size:14px;
}
.large-input{
    font-size:16px;
    width:340px;
    padding:6px;
}
.input-btn, button, .large-btn{
    background: #05a;
    color: #f5f5f5;
    border:1px solid #05a;
    padding: 5px;
    margin-top: 2px;
    font-size: 11px;
    width: 100px;
    cursor:pointer;
    outline:none;
    text-decoration:none;
    display:inline-block;
}
.input-btn:hover, button:hover, .large-btn:hover{
    color:#fff;
    border:1px solid #049;
}
.large-btn{
    font-size:14px;
    padding:6px;
    width:140px;
    line-height:16px;
}

/* Twitter */
.twitter-post{
	background:#f3f3f3;
	padding:10px 14px;
	color:#777;
  line-height:18px;
}
.twitter-post-wrap{
	margin:2px 0 12px 0;
}
.two{
}
.twitter-post a{
  color:#777;
}
.twitter-post .divide{
	padding:0 3px;
	color:#eee;
}
.tweet1, .tweet2{
	height:12px;
    display:none;
}
.tweet1{
	width:160px;
	background:url('/images/endtweet.png') right top no-repeat;
}
.tweet2{
	width:70px;
	background:url('/images/endtweet2.png') right top no-repeat;
}
#twitter .post-date{
	font-size:9px;
}

#twitter .twitter-post .post-date{
	color:#888;
}
#twitter .two .post-date{
}

.popup-wrap{
	position: fixed;
	height: 100%;
	width: 100%;
	z-index: 10;
	background: -webkit-radial-gradient(rgba(0,0,0,0.25), rgba(0,0,0,0.85));
    background: -o-radial-gradient(rgba(0,0,0,0.25), rgba(0,0,0,0.85));
    background: -moz-radial-gradient(rgba(0,0,0,0.25), rgba(0,0,0,0.85));
    background: radial-gradient(rgba(0,0,0,0.25), rgba(0,0,0,0.85));
    background-size:100% 100%;
	top: 0;
	display:none;
}
.popup-msg{
	width: 490px;
	height: auto;
	top: 50%;
	margin-top: -200px;
	left: 50%;
	margin-left: -250px;
	background: #fff;
	position: fixed;
	z-index: 50;
	box-shadow:0 2px 8px rgba(0,0,0,0.6);
    border-radius:3px;
    border:2px solid #e2e2e2;
}

.popup-text{
	padding:20px;
	text-align:center;
}

.popup-confirm, .popup-message{
	text-align:center;
	padding:20px 10px;
    padding-top:0;
}


/* Responsive */
.mobile-only{
    display:none;
}

@media (max-width: 870px){
    html,body{
        width:100%;
        -ms-text-size-adjust: none;
        text-size-adjust: none;
        line-height:normal;
    }

    .no-mobile, .no-mobile{
        display:none;
    }
    .mobile-only{
        display:block;
    }

    #mob-header-wrap, #content-wrap, #body-wrap, #content, #footer-wrap, #footer, #mobMenu{
        width:100%;
        min-width:100%;
    }
    #footer-content{
        padding:0 10px;
    }

    #mobMenu{
        background:#05a;
        z-index:99;
    }
    #mobMenu ul{
        height:32px;
        overflow:auto;
        margin-left: 10px;
    }
    #mobMenu ul li{
        margin:0;
        display:inline-block;
    }
    #mobMenu ul li a {
      color:#fff;
      text-decoration: none;
      padding: 6px 15px;
      display: inline-block;
    }
    #mob-header-wrap, #mob-menu-selector-wrap{
        height:125px;
    }
    #mob-header{
      height:95px;
    }
    #mob-header-wrap{
        background:url('/images/template/headerbg2.jpg') repeat 0 0 #111;
        background-size:contain;
        width:100%;
        position:fixed;
        z-index:99;
        top:0;
    }
    #mob-header{
        color:#fff;
        text-align:center;
        font-size:20px;
        font-weight:bold;
        background-size:contain;
        width:100%;
        background:url('/images/template/header2.jpg') no-repeat 0 0;
        background-size:contain;
    }
    #mob-header a{
        display:inline-block;
        width:100%;
        height:100%;
    }
    #mob-menu-selector-wrap{
        position:fixed;
        top:0;
        right:0;
        width:90px;
    }
    #mob-menu-selector{
        height:32px;
        width:38px;
        padding:4px;
        float:right;
        margin:39px 21px;
        background:url('/images/template/mobile-menu.png') no-repeat center center;
        box-shadow:inset 0 0 5px rgba(0,0,0,0.6);
        border-radius:3px;
        border:1px solid rgba(255,255,255,0.05);
        cursor:pointer;
    }

    #body-wrap{
        margin-top:122px;
    }

    #content h1{
        font-size:1.5em;
    }
    #content h2{
        font-size:1.4em;
    }

    .menuItem a{
        margin:3px auto;
        display:block;
        width:97%;
        text-align:center;
        font-size:14px;
        background:#05a;
        padding:22px 0;
        box-shadow:inset 0 0 5px rgba(0,0,0,0.2);
        border-radius:3px;
    }

    #content{
        word-wrap:normal;
        word-break:normal;
        line-height:145%;
        font-size:1rem;
        border:none;
    }
    #content input{
        width:120px;
    }
    .math{
        font-size:1.2em;
    }
    .code{
        font-size:0.7em;
    }
    .pad{
        margin:0;
        padding:10px;
    }
    .tag{
        font-size:1.1em;
        padding:4px 10px;
    }

    .popup-msg{
        font-size:0.8em;
        width:300px;
        margin-left: -152px;
    }

    .right{
        clear:both;
        float:left;
    }
}

@media (max-width: 870px) and (max-height: 525px){
    #mob-header-wrap{
        height:76px;
    }
    #mob-header{
      height:56px;
    }
    #body-wrap{
        margin-top:80px;
    }
    .menuItem a{
        font-size:12px;
        padding:18px 0;
    }
}

@media (max-width: 870px) and (max-height: 310px){
    #mob-header-wrap, #mob-menu-selector-wrap{
      height:70px;
    }
    #mob-header{
      height:48px;
    }
    #mobMenu ul{
      height:22px;
    }
    #mobMenu ul li a{
      font-size: 0.9em;
      padding: 2px 15px;
    }
    #body-wrap{
        margin-top:64px;
    }

    .menuItem a{
        padding:15px 0;
    }
}