div.planner_main_hdr {display: inline-block;
background-color: #454677;
background: -webkit-linear-gradient(#7172a9, #454677);
background: linear-gradient(#7172a9, #454677);
border: 1px solid #000; border-bottom: 0; margin: 12px 3px 0px 3px; border-radius: 5px 5px 0px 0px; padding: 2px 8px 3px 8px; font-family: verdana, serif; font-size: 90%; color: #fff; font-weight: bold;
}

div.planner_section_outer {display: block; font-family: verdana, serif; background-color: #fff; border: 1px solid #000; margin: 0px 3px 0px 3px; border-radius: 0px 5px 5px 5px;}
div.planner_section_inner {display: block; border-top: 1px solid #000;}

div.planner_grey {display: block; background-color: #eee; margin: 0px; padding: 5px; font-family: verdana, serif; font-size: 90%; color: #000; border-top: 1px solid #888; border-bottom: 1px solid #888;}

/* ----------------------------------------------------------------- PLANNER DAY */

div.planner_day_holder {display: inline-block; width: 32.7%; margin: 6px 0px 6px 0px; vertical-align: top;}

div.planner_day_outer {margin: 0 auto; overflow: hidden; width: 97%; font-family: verdana, serif; background-color: #fff; border: 1px solid #fff;  border-radius: 5px 5px 0px 0px;}

div.planner_day_name {display: block; background-color: #666; border-bottom: 1px solid #000; margin: 0px; padding: 2px; font-size: 100%; color: #fff; text-align: center;}
div.planner_day_date {display: block; background-color: #333; border-bottom: 1px solid #000; margin: 0px; padding: 2px; font-size: 90%; color: #fff; text-align: center;}

div.planner_day_type {display: block; background-color: #eee; margin: 0px; padding: 4px; color: #000; font-weight: bold; border-bottom: 1px solid #888;}
div.planner_day_dish {display: block; background-color: #fff; margin: 0px; padding: 3px; color: #000; border-bottom: 1px solid #000;}
div.planner_day_dish_empty {display: block; background-color: #f6f6f6; margin: 0px; padding: 3px; color: #900; border-bottom: 1px solid #000;}

div.planner_day_edit {float: right; margin: 2px 4px 4px 0px; padding: 2px; font-size: 100%; color: #fff; text-align: center;}
div.planner_day_view {float: left; margin: 2px 0px 4px 4px; padding: 2px; font-size: 100%; color: #fff; text-align: center;}

A:link.planner_day_edit, A:visited.planner_day_edit, A:active.planner_day_edit {background-color: #ddd; color: #000; text-decoration: none; display: inline-block; margin-top: 3px; padding: 0px 5px 0px 5px; border-radius: 3px; border: 1px solid #000;}
A:hover.planner_day_edit {background-color: #ddd; color: #000; text-decoration: underline; margin-top: 3px; padding: 0px 5px 0px 5px; display: inline-block; border-radius: 3px; border: 1px solid #000;}

A:link.planner_day_view, A:visited.planner_day_view, A:active.planner_day_view {background-color: #ddd; color: #000; text-decoration: none; display: inline-block; margin-top: 3px; padding: 0px 5px 0px 5px; border-radius: 3px; border: 1px solid #000;}
A:hover.planner_day_view {background-color: #ddd; color: #000; text-decoration: underline; margin-top: 3px; padding: 0px 5px 0px 5px; display: inline-block; border-radius: 3px; border: 1px solid #000;}

/* ----- MEDIA QUERIES */

@media (max-width: 400px) {
div.planner_main_hdr {font-size: 110%;}
}

@media (max-width: 600px) {
div.planner_day_holder {display: block; width: 98%; margin-top: 10px;}
div.planner_day_outer {width: 96%;}

div.planner_day_dish, div.planner_day_type, div.planner_day_dish_empty {font-size: 110%;}

.planner_sel_box {width: 290px;}
}

@media (min-width: 601px) and (max-width: 700px){
div.planner_day_holder {width: 49%; margin-top: 10px;}
}


/* -------- */

div.planner_type_out {display: block; background-color: #eee; border: 1px solid #000; border-bottom: 0; margin: 0px 3px 0px 3px; padding: 1px;}
div.planner_type_div {display: inline-block; width: 90px; padding: 2px 5px 2px 5px; font-size: 90%; color: #333; font-weight: bold;}
div.planner_inp_div {display: inline-block; padding: 1px;}

.planner_inp {width: 240px; border: 1px solid #000; font-size: 90%; color: #000; padding: 3px; margin-top:3px; margin-bottom:3px;}

.planner_sel_box {background-color: #fff; border: 1px solid #000; font-size: 90%; margin: 4px 3px 4px 3px; padding: 1px;}
.planner_sel_box > option {padding: 1px 0px 1px 2px;}


.planner_day_note {width: 390px; border: 1px solid #000; font-family: verdana, serif; font-size: 90%; color: #000; padding: 2px; margin-top:3px; margin-bottom:3px;}

div.planner_submit_out {display: block; background-color: #eee; border: 1px solid #000;  margin: 0px 3px 0px 3px; padding: 1px;}


/* ----------------------------------------------------------------- VIEW DAY */

div.planner_view_type_hdr {display: block; padding: 4px; color: #444; font-weight: bold;}
div.planner_view_blk {display: block; font-family: verdana, serif; padding: 4px; border-bottom: 1px solid #000;}

/* -------- */




/* ----------------------------------------------------------------- RECIPES */

div.planner_rec_blk {display: block; padding: 4px; border-bottom: 1px solid #000;}
div.planner_rec_hdr {display: inline-block; padding: 4px; color: #444; font-weight: bold;}

span.radio {cursor: pointer;  font-weight: bold; margin: 5px 0px 5px 0px;}

input[type="radio"]:checked + label {color: #209020;}

div.planner_rec_results_title {float: left; color: #159115; font-weight: bold; padding: 8px 6px 3px 2px;}
div.planner_rec_results_buttons {float: right;}

.edit_button {background-color: #000; font-size: 90%; color: #fff; padding: 3px; margin: 0px 0px 0px 0px; border-radius: 5px; cursor: pointer;}
.del_button {background-color: #a00; font-size: 90%; color: #fff; padding: 3px; margin: 0px 0px 0px 0px; border-radius: 5px; cursor: pointer;}

A:link.view_button, A:visited.view_button, A:active.view_button {
display: inline-block;
background-color: #454677;
background: -webkit-linear-gradient(#7172a9, #454677);
background: linear-gradient(#7172a9, #454677);
font-family: verdana, serif; font-size: 85%;  color: #fff; text-decoration: none;
margin: 5px 0px 3px 0px; padding: 2px 10px 2px 10px;
border-radius: 3px; border: 1px solid #000;
}

A:hover.view_button {background-color: #000; color: #fff; text-decoration: underline;}



/* ----- MEDIA QUERIES */

@media (max-width: 600px) {
div.planner_rec_results_title {float: none; font-size: 110%; font-weight: 500;}
div.planner_rec_results_buttons {float: none;}
.del_button, .edit_button {padding: 3px 6px 3px 6px;}

}


/* -------------------------- INGREDIENTS */

div.planner_rec_ing_hdr {display: inline-block; width: 14%; padding: 4px; font-size: 90%; color: #444; font-weight: bold;}
div.planner_rec_ing_right {display: inline-block; width: 80%; padding: 4px;}
.planner_rec_ing_inp {width: 60%; border: 1px solid #000; font-size: 90%; color: #000; padding: 3px; margin-top:3px; margin-bottom:3px;}

@media (max-width: 720px) {
div.planner_rec_ing_hdr {display: block; width: 98%; font-size: 100%;}
div.planner_rec_ing_right {display: block; width: 98%; padding: 4px;}
.planner_rec_ing_inp {width: 80%;}
}

/* -------------------------- METHOD */

div.planner_rec_met_hdr {display: inline-block; width: 12%; padding: 4px; font-size: 90%; color: #444; font-weight: bold;}
div.planner_rec_met_right {display: inline-block; width: 85%; padding: 4px;}
.planner_rec_met_inp {width: 98%; border: 1px solid #000; font-size: 90%; color: #000; padding: 3px; margin-top:3px; margin-bottom:3px;}

@media (max-width: 720px) {
div.planner_rec_met_hdr {display: block; width: 98%; font-size: 100%;}
div.planner_rec_met_right {display: block; width: 98%; padding: 4px;}
.planner_rec_met_inp {width: 97%;}
}

/* -------- */




/* -------------------------- STANDARD */

div.planner_txt_intro {line-height: 120%; padding: 5px;}
div.login_box {float: right; width: 300px; vertical-align: top;}

@media (max-width: 450px) {
div.planner_txt_intro {display: block;}
div.login_box {display: block; float: none; width: 96%;}
}

div.planner_h1 {float: left; padding: 3px 0px 0px 0px;}
div.planner_logout {float: right; text-align: right; padding: 0px 6px 0px 0px; font-face: verdana, serif;}

A:link.plan_logout, A:visited.plan_logout, A:active.plan_logout {font-family: verdana, serif; font-size: 80%; background-color: #f2f2f2; color: #000; text-decoration: none; display: inline-block; margin: 3px; padding: 2px 5px 2px 5px; border-radius: 3px; border: 1px solid #000;}
A:hover.plan_logout {background-color: #000; color: #fff; text-decoration: underline;}


A:link.register, A:visited.register, A:active.register {
display: inline-block;
background-color: #454677;
background: -webkit-linear-gradient(#7172a9, #454677);
background: linear-gradient(#7172a9, #454677);
font-family: verdana, serif; font-size: 100%;  color: #fff; text-decoration: none;
margin: 5px 0px 3px 0px; padding: 2px 10px 2px 10px;
border-radius: 3px; border: 1px solid #000;
}

A:hover.register {background-color: #000; color: #fff; text-decoration: underline;}


A:link.blk_button, A:visited.blk_button, A:active.blk_button {
display: inline-block;
background-color: #000;
font-family: verdana, serif;
  color: #fff; text-decoration: none;
margin: 4px 3px 4px 3px; padding: 3px 10px 3px 10px;
border-radius: 5px; border: 1px solid #000;
box-shadow: 2px 2px 1px #999;
}

A:hover.blk_button {background-color: #333; color: #fff; text-decoration: none;}


A:link.del_button, A:visited.del_button, A:active.del_button {
display: inline-block;
background-color: #a00;
font-family: verdana, serif;
font-size: 90%;  color: #fff; text-decoration: none;
margin: 4px 3px 4px 3px; padding: 3px 10px 3px 10px;
border-radius: 5px; border: 1px solid #000;
box-shadow: 2px 2px 1px #999;
}

A:hover.del_button {background-color: #c00; color: #fff; text-decoration: none;}



div.planner_set_fnt {font-family: verdana, serif;}

div.planner_std_inl {display: inline-block; padding: 4px;}
div.planner_std_blk {display: block; padding: 4px;}

div.img_left {float: left; padding: 0px; margin-left: 3px; margin-right: 3px;}
div.img_txt {padding: 4px; font-size: 120%;}

.blk_button {background-color: #000; font-size: 90%; color: #fff; padding: 2px 8px 2px 8px; margin: 3px; border-radius: 5px; cursor: pointer;}
.dis_button {background-color: #eee; font-size: 90%; color: #000; padding: 2px 8px 2px 8px; margin: 3px; border: 1px solid #000; border-radius: 5px; cursor: default;}

span.green_txt {color: #159115; font-weight: bold;}
span.blue_txt {color: #000077; font-weight: bold;}
span.red_txt {color: #aa0000; font-weight: bold;}
span.grey_txt {color: #444; font-weight: bold;}

ul.features {margin: 2px;}
.features > li {padding: 4px 0px 2px 0px;}

ul.recipes, ol.method {margin-top: 3px;}
ul.recipes > li {padding: 4px 0px 2px 0px;}
ol.method > li {padding: 4px 0px 2px 0px;}

/* -------- */


input[type=submit] {border-radius: 8px;}






@font-face {
	font-family: 'icomoon';
	src:url('../fonts/icomoon.eot?h4m6va');
	src:url('../fonts/icomoon.eot?h4m6va#iefix') format('embedded-opentype'),
		url('../fonts/icomoon.ttf?h4m6va') format('truetype'),
		url('../fonts/icomoon.woff?h4m6va') format('woff'),
		url('../fonts/icomoon.svg?h4m6va#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
	font-family: 'icomoon' !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icon-search:before {
	content: "\f002";
}
.icon-star:before {
	content: "\f005";
}
.icon-star-o:before {
	content: "\f006";
}
.icon-check:before {
	content: "\f00c";
}
.icon-close:before {
	content: "\f00d";
}
.icon-cog:before {
	content: "\f013";
}
.icon-trash-o:before {
	content: "\f014";
}
.icon-clock-o:before {
	content: "\f017";
}
.icon-repeat:before {
	content: "\f01e";
}
.icon-tags:before {
	content: "\f02c";
}
.icon-print:before {
	content: "\f02f";
}
.icon-camera:before {
	content: "\f030";
}
.icon-pencil:before {
	content: "\f040";
}
.icon-plus-circle:before {
	content: "\f055";
}
.icon-minus-circle:before {
	content: "\f056";
}
.icon-info-circle:before {
	content: "\f05a";
	vertical-align: bottom;
	color: #0a0;
	font-size: 150%;
	
}
.icon-plus:before {
	content: "\f067";
}
.icon-minus:before {
	content: "\f068";
}
.icon-eye:before {
	content: "\f06e";
}
.icon-calendar:before {
	content: "\f073";
}
.icon-comment:before {
	content: "\f075";
}
.icon-shopping-cart:before {
	content: "\f07a";
}
.icon-thumbs-o-up:before {
	content: "\f087";
}
.icon-thumbs-o-down:before {
	content: "\f088";
}
.icon-bell-o:before {
	content: "\f0a2";
}
.icon-arrow-circle-left:before {
	content: "\f0a8";
}
.icon-arrow-circle-right:before {
	content: "\f0a9";
	font-size: 110%;
		
}
.icon-group:before {
	content: "\f0c0";
}
.icon-comment-o:before {
	content: "\f0e5";
}
.icon-cutlery:before {
	content: "\f0f5";
}
.icon-smile-o:before {
	content: "\f118";
	vertical-align: bottom;
	color: #0a0;
	font-size: 130%;
	margin-right: 2px;
}
.icon-frown-o:before {
	content: "\f119";
	vertical-align: bottom;
	color: #a00;
	font-size: 130%;
	margin-right: 2px;
}
.icon-info:before {
	content: "\f129";
}
.icon-spoon:before {
	content: "\f1b1";
}