/* 
Document   : design.css
Created on : 2007-03-10, 00:00
Author     : Susanne Jarl, recepten.se
Description: Design of elements.
*/ /* Color scheme
# Red
Red (in logo): #d71921;
# Pink
Light light pink (bg): #f9ebec;
Light pink (bg): #f8d9da;
Light pink (darkest at bottom in logo, used in sidebar): #f1b6b8
Dark pink: #d57175;
#Gray
Light light gray (recipe bg): #f2f2f2;
Light gray (shadow in logo, page body bg): #c7c8ca;
*/

/** Content **/
.contentIntro {
	font-size: 14px;
	margin-top: 5px;
	margin-bottom: 15px;
}

/** Forms **/
div.formItem {
	margin-bottom: 10px;
}

div.formItem input {
	height: 25px;
	font-size: 18px;
	color: black;
	border-style: solid;
	border-width: 1px;
	border-color: black;
	background-color: white;
	padding: 2px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

div.formItem input[type=text], div.formItem input[type=password] {
	font-size: 18px;
	padding: 4px;
}

div.formItem textarea, div.formItem .ui-widget textarea {
	font-size: 18px;
	padding: 2px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

div .formLabel {
	margin: 10px 0px 0px 0px;
	font-size: 14px;
}

div .formButton {
	margin: 10px 0px 0px 0px;
}

div .formRow {
	
}

div .formRow input[type=text], div .formRow input[type=email] {
	font-size: 18px;
}

.formTextDiv {
	margin-top: 5px;
}

.formText {
	font-size: 16px;
	background-color: #fef8f9;
	padding: 5px 5px 5px 5px;
}

div .formRow label {
	display: block;
	padding: 10px 0px 0px 0px;
}

.formInputError {
	color: #ED322B;
}

.formInputError .rich-message-marker img {
	padding-right: 3px;
	vertical-align: middle;
}

.formInputError .rich-message-label {
	color: #ED322B;
}

.formCaptcha {
	vertical-align: middle;
}

.formButtons {
	margin: 30px 0px 20px 0px;
}

/* Messages */
.infoMarker img, .errorMarker img {
	padding-right: 5px;
}

.infoMessages {
	background-color: #e1f8d8;
	padding: 3px;
	margin-top: 5px;
}

.errorMessages {
	background-color: #fae5e1;
	padding: 3px;
	margin-top: 5px;
}

/* Images */
.mainImageText {
	margin: 0px 0px 12px 0px;
	font-style: italic;
}

/* Content */
.giantText {
	font-size: 25px;
}

.biggerText {
	font-size: 16px;
}

.bigText {
	font-size: 14px;
}

ul.list {
	list-style-type: disc;
	padding-left: 25px;
	margin-top: 10px;
	margin-bottom: 10px;
}

ol.list {
	list-style-type: decimal;
	padding-left: 14px;
}

ul.list li, ol.list li {
	margin: 5px 0px 5px 5px;
	font-size: 14px;
}

ul.list li ul {
	list-style-type: disc;
	padding-left: 25px;
}

.centerContent {
	width: 100%;
	text-align: center;
	margin: 10px;
}

.space10 {
	margin: 10px;
}

.bigFatText {
	font-size: 15px;
	font-weight: bold;
}

.textAlign {
	vertical-align: text-bottom;
}

.imgAlign {
	vertical-align: middle;
}

div.inline {
	margin-top: 5px;
	margin-bottom: 5px;
}

div.inline h2, div.inline h3 {
	display: inline;
}

div.inline p {
	display: inline;
}

.iconColor {
	color: #d57175;
	vertical-align: text-top;
}

div.property {
	min-height: 18px;
	margin-top: 8px;
	margin-bottom: 8px;
}

div.property img {
	vertical-align: text-top;
}

span.propertyTitle {
	font-weight: bold;
}

/* Categories */
td.categories {
	vertical-align: top;
	text-align: left;
}

ul.categories {
	margin: 5px 15px 0px 15px;
	padding: 0px;
	list-style-type: square;
}

li.categories {
	margin: 0px;
	padding: 0px;
}

div.categoriesTitle {
	font-size: 15px;
	color: #E25565;
}

li.cat a {
	color: white;
}

div.catTitle {
	color: white;
	font-size: 14px;
}

.catImage {
	padding: 1px;
	margin-right: 10px;
}

table.category {
	vertical-align: top;
	border-width: 0px;
}

td.category {
	vertical-align: top;
	padding: 2px;
	border-width: 1px 0px 1px 0px;
	border-style: solid;
	border-color: #d0cfcf;
}

td.category div.info {
	font-size: 13px;
	color: gray;
	margin: 7px 0px 0px 0px;
}

td.category p {
	letter-spacing: 1px;
	margin-left: 10px;
}

td.category h3 {
	margin-left: 0px;
	margin-top: 4px;
}

/* Ingredienser */
ul.ingredients {
	list-style-type: disc;
	margin: 0px 0px 0px 10px;
	padding: 0px 0px 0px 10px;
	line-height: 1.6;
}

ul.ingredients li {
	margin: 3px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
}

/* Show Recipe */
.instructions ol.instructionItem {
	font-weight: normal;
	font-size: 14px;
	font-family: 'PT Sans', 'Helvetica Neue', Helvetica, Arial;
}

.instructions ol.instructionItem p {
	font-weight: normal;
	font-size: 14px;
	font-family: 'PT Sans', 'Helvetica Neue', Helvetica, Arial;
}

.subPictures img {
	margin: 0px;
	padding: 0px;
	width:100%;
}

.subPicturesFigure {
	margin-bottom: 20px;
	margin-top: 0px;
}

/* Forum and post */
div.forumThreadImage {
	float: right;
	padding-left: 10px;
	max-width: 50%;
}
img.forumThreadImage {
	padding: 1px;
	margin-right: 10px;
	max-width: 100%;
}

p.forumThreadDescription {
	padding: 20px 20px 10px 40px;
	font-style: italic;
}

.post {
	margin-top: 10px;
	border-width: 1px 0px 1px 0px;
	border-style: solid;
	border-color: pink;
	padding: 0px;
	background-color: #f9ebec;
}

div.postAuthor {
	float: right;
	padding-bottom: 2px;
	padding-left: 2px;
}

.postAuthorStatusImage {
	padding-right: 5px;
}

.postAuthorStatusText {
	font-size: 13px;
}

.postRating {
	display: inline;
}

div.postReply {
	border-width: 0px 0px 1px 0px;
	border-style: solid;
	border-color: #d0cfcf;
	background-color: #f2d5d8;
	padding: 2px;
}

div.postContent {
	padding: 0px;
}

img.postIcon, span.postIcon {
	/*padding-left: 5px;*/
}

div.postMessage {
	padding: 5px;
	max-width: 100%;
	overflow-x: auto;
	overflow-wrap: break-word;
	word-break: break-word;
}

div.postMessageReported {
	padding: 6px 6px 6px 2px;
	color: #C10A03;
	background-color: #d0cfcf;
}

div.postBottom {
	position: relative;
	bottom: 0px;
	border-width: 1px 0px 0px 0px;
	border-style: solid;
	border-color: #d0cfcf;
	background-color: #f2d5d8;
	padding: 2px 6px 0px 4px;
}

/* Comments */
.writeLink {
	font-size:18px;
	margin:20px 10px 0px 5px;
	letter-spacing:1px;
}

.iconTop {
	vertical-align: text-top;
	padding-top: 2px;
}

.comment {
	border: 1px solid green;
	margin-bottom: 5px;
}

.commentHead {
	border-style: solid;
	border-width: 0px 0px 1px 0px;
	border-color: green;
	background-color: #FAD9CD;
	font-size: 14px;
}

.commentMsg {
	padding: 12px 2px 2px 2px;
	font-size: 14px;
	color: #C10A03;
}

.commentWrittenBy {
	padding-top: 10px;
	padding-bottom: 0px;
	margin-bottom: 0px;
	color: #1E5B0E;
}

.currentPageNumber {
	font-weight: bold;
	font-size: 19px;
	letter-spacing: 0px;
}

.paging {
	width: 100%;
	text-align: center;
	margin-top: 10px;
	margin-bottom: 10px;
}

.noHover:hover {
	background-color: white;
}

/* Rounded corners */
.appRoundedCorners {
	-moz-border-radius: 30px;
	border-radius: 30px;
	-moz-box-shadow: 0 0 2px 0 #888;
	-webkit-box-shadow: 0 0 2px 0 #888;
	box-shadow: 0 0 2px 0 #888;
}

.appSpace {
	margin: 10px;
}

/* Space in form table */
table.formSpace td {
	padding: 4px;
}

/* PinkBox design*/
h2.pinkBoxHeadline {
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 5px 0px;
}

/* Food Ingredient info */
h2.hideLink a {
	color: #670b0b;
}

.greenAd a, .greenAd a:visited {
	color: #005E1E;
}

.greenAd a:hover {
	color: white;
}

.redAd a, .redAd a:visited {
	color: #c92e28;
}

.redAd a:hover {
	color: white;
}

.smallText {
	font-size: 10px;
	color: red;
}

.siteMenuWeekDate {
	margin: 10px 0px 2px 0px;
	font-size: 16px;
}

/* Table */
table.contactInfo {
	margin-bottom: 10px;
}

table.contactInfo th {
	font-weight: bold;
	padding-right: 10px;
	text-align: left;
}

table.contactInfo td {
	padding: 2px;
}

table.contactForm td {
	vertical-align: top;
}

.contactFormHead {
	font-weight: bold;
	padding-right: 10px;
}

div.tableResponsive {
	overflow-x: auto;
}

table.table {
	border: 1px solid #d71921;
	width: 98%;
}

table.table td {
	background-color: #f9ebec;
	border: 1px solid black;
	padding: 2px 4px 2px 4px;
	font-family: 'PT Sans', 'Helvetica Neue', Helvetica, Arial;
}

table.table th {
	font-size: 14px;
	border: 1px solid black;
	color: black;
	background-color: #f1b6b8;
	letter-spacing: 1px;
	padding: 2px;
}

td.verticalTop {
	vertical-align: top;
}

/* BMI */
div.dittBMI {
	margin-top: 20px;
}

p.dittBMI {
	font-size: 20px;
}

p.dittBMI span {
	font-size: 22px;
	font-weight: bold;
}

span.error {
	color: red;
}

.questions {
	margin-top: 20px;
}

/* Tooltip */
.tooltipContent { /* left:-4px;
   top:-4px;    */
	margin-left: 10px;
	width: 400px;
	background-color: white;
	border: solid #d57175 2px;
	padding: 2px;
}

.tooltipContent div.tooltipImage {
	font-size: 14px;
	padding: 2px;
	margin: 2px;
	float: right;
	z-index: 10000;
}

.tooltipContent div.tooltipImage img {
	width: 150px;
	color: #d57175;
}

.tooltipShadow { /*background:url(shadow.png);   translucent shadow */
	
}

div .searchToolTip h4 {
	font-size: 26px;
	padding-bottom: 10px;
}

div .searchToolTip p {
	padding: 5px;
}

div .searchRecipeForm input[type=text], div .searchRecipeForm input[type=search]
	{
	font-size: 18px;
	max-width: 400px;
	min-width: 200px;
	padding: 6px 4px;
}

span.searchResultContentType {
	font-variant: small-caps;
}

span.searchResultItemTitle {
	font-size: 18px;
}

img.adjustTextToIcon {
	vertical-align: middle;
}

.cursorPointer {
	cursor: pointer;
}

/* webfeed */
ul.webfeed {
	list-style-image: url("/jakarta.faces.resource/images/content/webfeed.gif.xhtml?v=22");
	margin-left: 40px;
}

ul.webfeed li a {
	padding-left: 5px;
}

/* blog */
.latestBlogTeaser {
	color: white;
}

.latestBlogTeaser a {
	font-size: 12px;
	font-weight: normal;
}

.latestBlogTeaser span.teaserHeadText {
	color: gray;
	font-size: 13px;
	font-style: italic;
}

.latestBlogTeaser span.latestBlogEntryTitle {
	color: white;
	font-size: 17px;
	font-variant: small-caps;
	display: block;
}

.latestBlogTeaser span.latestBlogEntryTitle a {
	font-size: 17px;
	font-variant: small-caps;
}

/* Blog */
div.blogFont, div.blogFont p, div.blogFont h1, div.blogFont h2, div.blogFont h3
	{
	font-family: 'PT Sans', 'Helvetica Neue', Helvetica, Arial;
	letter-spacing: 0px;
}

div.blogFont h2 {
	font-size: 18px;
}

div.blogFont h3 {
	font-size: 16px;
}

div.blogEntryHeader {
	border-width: 1px 0px;
	border-style: solid;
	border-color: #c7c8ca;
	background-color: #f9ebec;
	padding: 0px 5px 0px 0px;
}

div.blogEntryHeader a {
	color: black;
}

div.blogEntryHeader h1, div.blogEntryHeader h2 {
	margin: 0px;
}

div.blogEntryHeader p {
	margin: 2px 0px 0px 0px;
	font-size: 12px;
}

div.blogEntryFooter {
	background-color: #f9ebec;
	margin-top: 10px;
	margin-bottom: 15px;
	padding: 0px 5px 0px 5px;
	font-size: 14px;
}

div.blogEntryFooter a {
	font-size: 14px;
}

/* Social Share */
div.socialShare {
	background-color: #FCF0F1;
	padding: 10px 4px 10px 10px;
	margin-bottom: 10px;
	margin-top: 2px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	/*width: 280px;*/
}

div.socialShare a {
	padding-right: 10px;
}

div.socialShare img {
	vertical-align: text-top;
}

.facebookShareButton {
	display: inline;
	vertical-align: top;
}

.pinterestShareButton {
	display: inline;
	position: relative;
	margin-left: 10px;
}

.tooltipRich {
	color: #49070a;
	background-color: #fae5e1;
	border: 1px solid #f68f98;
	font-weight: normal;
}

/* Member */
div.messages {
	background-color: #fae5e1;
	margin-bottom: 10px;
}

img.messages {
	padding-right: 5px;
}

.pickList {
	background-color: #fae5e1;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.errorMessage {
	background-repeat: no-repeat;
	padding: 1px 2px 1px 22px;
	background-position: 2px;
	background-image: url("/jakarta.faces.resource/images/icons/exclamation.png.xhtml?v=22");
}

/* Forum */ /* Space */
.spaceSmallTop {
	margin-top: 5px;
}

.spaceSmallBottom {
	margin-bottom: 5px;
}

.spaceMediumTop {
	margin-top: 10px;
}

.spaceMediumBottom {
	margin-bottom: 10px;
}

.spaceMediumLeft {
	margin-left: 10px;
}

.spaceLargeTop {
	margin-top: 20px;
}

.spaceLargeBottom {
	margin-bottom: 20px;
}

/* Yes, No, Maybe colors */
.yesColor {
	color: green;
}

.noColor {
	color: red;
}

.maybeColor {
	color: orange;
}

.articleCitat {
	background-color: #f9ebec;
	padding: 10px;
	font-size: 14px;
}

/* Gray box */
.grayBoxFloatRight {
	margin: 0px 20px 10px 20px;
	padding: 5px 15px 5px 15px;
	background-color: #c7c8ca;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	float: right;
}

.grayBoxFloatRight ul {
	margin: 0px;
	padding: 0px;
}

.grayBoxFloatRight ul li {
	list-style-type: none;
}

.letterList {
	float: left;
	width: 150px;
}

.ratingStar {
	font-size:16px;
	color: #d57175;
	width: 14px;
}


/* Star-rating */
.star-rating {
	display: inline-block;
}

.star {
	font-size: 30px;
	cursor: pointer;
	color: #ccc;
}

.star.selected,
.star.hover {
	color: #ffc107;
}

/* Star rating done */


/* Sponsored content */
div .sponsorMark {
	background-color: #c7c8ca;
	margin: 0px 0px 4px 0px;
	padding: 5px 5px 5px 5px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	font-variant: small-caps;
	font-size: 16px;
}

div .sidebarWideContentTeaser {
	position: relative;
}

div .sponsoredTeaser {
	position: absolute;
	top: 7px;
	right: 4px;
	background: #ffffff;
	font-size: 14px;
	padding-left: 5px;
	padding-right: 5px;
}

