/*
    RESET
*/

.clear { clear: both; }
img, a img { border: none; }
input { outline: 0; }
input[type=submit]{padding:10px 5px;margin-left:3px;}

  body {
    -webkit-text-size-adjust:none;
    font-family:Helvetica, Arial, Verdana, sans-serif;
    padding:0px 5px;
    margin:0;
  }

/*
    STRUCTURE
*/

#page-wrap {  margin: 0px auto 50px; position: relative; }
hr { height: 1px; background: #ccc; clear: both; margin: 20px 0; border: none; display: block; }
@media only screen 
and (min-width : 1224px) {
    #page-wrap {
        width:320px;
    }
}

/*
    TYPOGRAPHY
*/
a  { text-decoration: none; color: #900; border-bottom: 1px dotted #900; outline: none; }
h1 { font: bold 22px Helvetica, Sans-Serif;padding:0;margin:3px 3px;color:#900;}
#page-wrap>h1 {margin:0;}
h2 { font: bold 18px Helvetica, Sans-Serif;padding:0;margin:3px 0;}
h2 { margin: 0 0 10px 0; }
p { margin: 0 0 6px 0; }



/*
    header
*/
#header {  text-align:center; }
#header h1 { }
#header h1 a {  }
#control_top { width: 200px; float: right; padding: 00px 0px 0 0; text-align: right; } 
 
 
/*
    footer
*/
#footer {margin-top:60px;}
#control { width: 200px; float: right; padding: 00px 0px 0 0; text-align: right;margin:10px; }



/*
    LISTS
*/
#list { list-style: none; }
#list li { position: relative; margin: 0 0 8px 0; padding: 0 0 0 70px; width: 607px; }
#list li span { padding: 8px; -moz-border-radius: 5px; -webkit-border-radius: 5px; width: 589px; display: block; position: relative; }
.colorBlue span { background: rgb(115, 184, 191); }
.colorYellow span { background: rgb(255, 255, 255); }
.colorRed span { background: rgb(187, 49, 47); color: white; }
.colorGreen span { background: rgb(145, 191, 75); }
.tab { background: url(images/minibuttons.png) no-repeat; height: 21px; top: 4px; }
.draggertab { position: absolute; left: 0px; width: 31px; cursor: move; }
.draggertab:hover { background-position: 0 -21px; }
.colortab { position: absolute; left: 34px; width: 34px; background-position: -31px 0; cursor: pointer; }
.colortab:hover { background-position: -31px -21px; }
.deletetab { position: absolute; right: -35px; width: 15px; background-position: -82px 0; cursor: pointer; }
.deletetab:hover { background-position: -82px -21px; }
.donetab { position: absolute; right: -17px; width: 16px; background-position: -65px 0; cursor: pointer; }
.donetab:hover { background-position: -65px -21px; }
.crossout { position: absolute; top: 50%; left: 0; height: 1px; }

#share-area { margin: 20px 0 0 69px; width: 600px; }


/*
    FORM STUFF
*/
form {margin-bottom:10px;}
label { background: #999; color: white; padding: 3px; }
input[type="text"], input[type="password"], input[type="email"] {  border: 2px solid #999; font-size: 16px; padding: 5px; border-radius:4px;
  margin-top:4px;margin-left:4px; }                   
#add-new input[type="text"] { width: 532px; float: left; margin: 0 10px 0 69px; }
#add-new input[type="text"]:focus { border-color: #73B8BF; }
#add-new input[type="submit"] { padding: 10px 12px; }

ul#list li span input[style] { width: 90% !important; }


/*
    MESSAGING
*/
.message { padding: 10px; margin: 0 0 10px 0; width: 607px; }
.good { background: #9ff5b6; }
.bad { color: #ef0040; }


/*
    SIDEBAR
*/
#ribbon { position: absolute; right: 0; width: 125px; padding: 60px 30px 0 47px; height: 756px; top: -6px; background: url(images/ribbon-bg.png) no-repeat; }
#ribbon h4 { text-align: center; font: italic 20px Baskerville, Georgia, Serif; margin: 0 0 5px 0; }
#ribbon ul { list-style: none; }
#ribbon ul li { background: rgb(0,0,0); background: rgba(0,0,0,0.5); color: white; padding: 5px; margin: 0 0 5px 0; font-size: 12px; }


/* my stuff */


#header .button {margin:0 5px;}

.item {height:40px;border:1px solid #333;margin:3px;border-radius:3px;position:relative;
    background:#ccc;cursor:pointer;
    background: -moz-linear-gradient(
		top,
		#abd5f5 0%,
		#88add1);
	background: -webkit-gradient(
		linear, left top, left bottom, 
		from(#abd5f5),
		to(#88add1));
    }
.item1{height:40px;border:1px solid #333;margin:3px;border-radius:3px;position:relative;
    background:#ccc;cursor:pointer;
    background: -moz-linear-gradient(
		top,
		#8fe699 0%,
		#aae098);
	background: -webkit-gradient(
		linear, left top, left bottom, 
		from(#8fe699),
		to(#aae098));
}
.item span.item_text,
.item1 span.item_text{display:inline-block;height:30px;line-height:40px;float:left;margin-left:3px;}
.item img.checkmark,
.item1 img.checkmark {position:absolute;top:5%;right:10px;}
.item .is_checked,
.item1 .is_checked {display:none;}
.form_item_text,
.form_checklist_text {float:left;display: none;z-index:100;}


.input_new_item {with:200px;float:left;}
.form_submit {padding:4px;margin-left:5px;font-size:12px;border-radius:5px;border:1px solid #333;margin-top:8px;}
button.del_button,
button.del_button1 {position:absolute;top:0px;right:45px;display:none;cursor:pointer;}
button.del_cancel {position:absolute;top:0px;right:110px;display:none;cursor:pointer;}
button.del_button a,
button.del_button1 a{color:white;text-decoration:none;}

.hidden {display:none;}
/* Desktops */
@media only screen and (min-width : 1224px) {
    .hide_from_mobile {
        display:block;
    }
}
/* smartphones */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
    .hide_from_mobile {
        display:none;
    }
}
.right {float:right;}
.left {float:left;}
.green {background:#00cc66;}
.red {#faddde;}

#signup input,
#signup textarea,
#signup select,
 {
   border: 1px solid #555;
   padding: 0.5em;
   font-size: 15px;
   line-height: 1.2em;
   width: 80%;
   background: #fff;
   background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc));
   -webkit-appearance: none;
   -webkit-box-shadow: 1px 1px 1px #fff;
   -webkit-border-radius: 0.5em;
 }
.my_lists {text-align:center;}
.newlist button {margin-top:5px;}


#my_account {text-align:right;font-size:13px;}