@charset "utf-8";
/* CSS Document */

* {
	margin:0;
	padding:0;
}

* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

html, body {
	width:100%;
	height:100%;
	margin:0;
	padding:0;
}

body {
	font-size:62.5%;
	font-family: Helvetica, arial, sans-serif; font-weight:300;
	background:#fff;
	color:#363636;
	}
	
a {color:#ea088c;}
a:hover { background-color:#333; color:#FFF; }
.clear {clear:both; display:block; height:0px;}
@media only screen and (min-width: 680px) { .rowclear {clear:none; display:block; height:0px;} }
@media only screen and (min-width: 1024px) { .rowclear {clear:both; display:block; height:0px;} }
.dashbot {background:transparent url(../images/site/dashed.gif) left bottom repeat-x;}
header h1 {color:#ea088c; font-family: 'Raleway', sans-serif; font-size:2.8em; font-weight:400; }
article {border-bottom:1px solid #CCC; padding-bottom:1em; margin-bottom:2em;}
article p {color:#666; font-size:1.4em; line-height:1.8em; margin-bottom:1em; }

/* HEADER AND NAVIGATION */
/* For Mobile Resolution */
#header {}
#nav_space ul {list-style:none; margin:0; padding:0; text-transform:uppercase;}
#nav_space ul li { margin-bottom:5px; display:inline; font-size:2.0em; margin-left:0.5em;}
#nav_space ul li a { color:#000; text-decoration:underline;  }
#nav_space ul li a:hover { background-color:#000; color:#FFF; }

#logo { width:100%; float:none; text-align:center;}
#roguebakerylogo { width:100px; float:none; }
#slogan {display:none;}
#mobilemenu {display:block; width:90%; margin:0 1em; padding:0.2em;}
#nav_space ul {display:none;}

@media only screen and (min-width: 460px) {
	#mobilemenu {display:none;}
	#nav_space ul {display:block;}
	#nav_space ul li { font-size:3.5em;}
}

@media only screen and (min-width: 680px) {
	
	#header {display:box; width:63.5em; margin:0 auto; padding-bottom:17px; background:transparent url(../images/site/dashed.gif) left bottom repeat-x; }
	#logo { width:174px; float:left; }
	#roguebakerylogo {width:174px; height:auto;}
	#slogan {display:block;}
	#slogan img { width:453px; height:auto; }
	#nav { width:45.3em; float:right; }
	#nav_space { margin-top:1px; }
	#nav_space ul li { display:inline; font-size:4.2em; line-height:1.2em;  margin-left:0;  }
	#nav_space ul li a { text-decoration:none; background:transparent url(../images/site/uline.gif) left bottom repeat-x;  }
}

@media only screen and (min-width: 1024px) {
	#header {display:box; width:96em; margin:0 auto; padding-bottom:17px; background:transparent url(../images/site/dashed.gif) left bottom repeat-x; }
	#logo { width:174px; float:left; }
	#roguebakerylogo {width:174px; height:auto;}
	#slogan img { width:100%; height:auto; }
	#nav { width:77.8em; float:right; }
	#nav_space { margin-top:1px; }
	#nav_space ul li { display:inline; font-size:5.8em; line-height:1.102em;   }
	#nav_space ul li a { background:transparent url(../images/site/uline.gif) left bottom repeat-x;  }
}


/* General Page */

h1.title { font-family:'Yanone Kaffeesatz', Helvetica, Arial, sans-serif; font-weight:700; text-transform:uppercase; color:#ea088c; font-size:2.6em; }
h1.title span { color:#000; }
h1.title-big { font-family:'Yanone Kaffeesatz', Helvetica, Arial, sans-serif; font-weight:700; text-transform:uppercase; color:#ea088c; font-size:2.6em; }
h1.title-big span { color:#000; }
blockquote {display:block; margin:0 2em;}

/* General Font Styles */
.rb_bigtext {font-size:4em;}
.rb_bigtext span {color:#ea088c;}
.rb_black {color:#000;}
.rb_pink {color:#ea088c;}
.upper {text-transform:uppercase;}
.l_lh {line-height:1em;}
.s_lh {line-height:1.5em;}
.m_m {margin:.5em 0;}
.quote {font-style:italic; margin-bottom:.25em;}
.quote_source {text-align:right;}
.no_botmargin {margin-bottom:0em;}


/* Homepage slider */
.rb_slide {background-color:#000; position:relative;}
.rb_slide .flink {width:100%; position:absolute; right:0; bottom:0;}
.rb_slide .flink a {color:#FFF; text-decoration:none;}
.rb_slide .flink a{ width: 100%; display:block; text-align: right; padding: 1em; background-color: #ea088c; font-size: 1.2em; right: 0px; bottom: 0px; width:auto;}
.rb_slide .fspace h2 {color:#fff; font-size:2em; background-color:#000; display:block; padding:0.5em;}
.rb_slide .fspace h3 {color:#fff; font-size:2em; background-color:#000; display:block; padding:0.5em; text-transform:uppercase;}
.rb_slide .fspace {width:100%; float:right; position:relative;}
.rb_slide .fspace p { line-height:1.6em; font-size:1.1em; display:block; padding:0 1em 0 1em; color:#CCC; height:6em; overflow:hidden;}

@media only screen and (min-width: 460px) {
	.rb_slide .fspace h2 {font-size:3em; padding:0.5em;}
	.rb_slide .fspace h3 {font-size:3em; padding:0.5em;}
	.rb_slide .fspace p {font-size:1.5em;}
}

@media only screen and (min-width: 680px) {
	.rb_slide {width:100%; height:30em; position:relative; background-color:#000;}
	.rb_slide .fimage {position:absolute; z-index:0; bottom:0; right:0;}
	.rb_slide .flink {position:absolute; bottom:0px; right:0px; display:block; background-color:transparent; width:100%;}
	.rb_slide .flink a{display:in-line; float:right; width: auto; text-align: right; padding: 0.6em; background-color: #ea088c; font-size: 1.2em; width:auto; margin-left:0.25em; /* position: absolute; right: 0px; bottom: 0px; */}
	.rb_slide .flink a:hover {background-color:#000;}
	.rb_slide .fspace {position:absolute; width:90%; top:1em; left:1em; }
	.rb_slide .fspace span { background-color:#FFF;  box-shadow:1px 1px 0 #666; padding:0px; margin-bottom:4px; }
	.rb_slide .fspace p { line-height:1.6em; font-size:1.2em; padding:0; color:#666; height:auto; }
	.rb_slide .fspace h2 {color:#ea088c; font-size:1.9em; text-transform:uppercase; margin-bottom:0.2em; background-color:transparent; padding:0;}
	.rb_slide .fspace h3 {color:#ea088c; font-size:3.6em; background-color:#fff; padding:0; margin-bottom:1em; display:inline; line-height:1.35em; }
	.rb_slide .fspace .ftitle {display:block; margin-top:8px;}
}


/* Featured Image Divs Universal */
.rb_col {position:relative; margin-bottom:1em;}
.featured {background-color:#000;}
.featured .flink {width:50%; position:absolute; right:0; bottom:0;}
.featured .flink a {color:#FFF; text-decoration:none;}
.featured .flink a{ width: 100%; display:block; text-align: right; padding: 1em; background-color: #ea088c; font-size: 1.2em; right: 0px; bottom: 0px; width:auto;}
.featured .ftitle { }
.featured .fspace h2 {color:#fff; font-size:2em; background-color:#000; display:block; padding:0.5em;}
.featured .fspace h3 {color:#fff; font-size:2em; background-color:#000; display:block; padding:0.5em; text-transform:uppercase;}
.featured .fspace {width:50%; float:right; position:relative;}
.featured .fspace p { line-height:1.6em; font-size:1.1em; display:block; padding:0 1em 0 1em; color:#CCC; height:6em; overflow:hidden;}
#content { background:transparent url(../images/site/dashed.gif) left bottom repeat-x; padding:0 1em 1.5em 1em;}
#featuredslider {display:none;}
.htext {visibility:visible;}
.span1, .span2, .span3 {width:100%;}
.featured img { width:50%; float:left; }


@media only screen and (min-width: 460px) {
	.featured .fspace h2 {font-size:3em; padding:0.5em;}
	.featured .fspace h3 {font-size:3em; padding:0.5em;}
	.featured .fspace p {font-size:1.5em;}
}

@media only screen and (min-width: 680px) {
	.htext {visibility:hidden;}
	#featuredslider {display:block;}
	.featured img { width:auto; }
	#content {width:63.5em; padding:1.3em 0; margin:0 auto;}
	.rb_col {display:block; float:left; margin-right:0em; margin-bottom:1.5em;}
	.coleven {float:right;}
	.span1 {width:31em;}
	.span2 {width:63.5em;}
	.span3 {width:63.5em;}
	#hfeature {display:none;}
	#habout, #side {width:100%;}
	.row {margin-top:.5em;}
	
	/* Featured Image Divs */
	.featured {width:31em; height:30em; position:relative; background-color:#000;}
	.featured .fimage {position:absolute; z-index:0; bottom:0; right:0;}
	.featured .flink {position:absolute; bottom:0px; right:0px; display:block; background-color:transparent; width:100%;}
	.featured .flink a{display:in-line; float:right; width: auto; text-align: right; padding: 0.6em; background-color: #ea088c; font-size: 1.2em; width:auto; margin-left:0.25em; /* position: absolute; right: 0px; bottom: 0px; */}
	.featured .flink a:hover {background-color:#000;}
	.featured .fspace {position:absolute; width:29em; top:1em; left:1em; }
	.featured .fspace span { background-color:#FFF;  box-shadow:1px 1px 0 #666; padding:0px; margin-bottom:4px; }
	.featured .fspace p { line-height:1.6em; font-size:1.2em; padding:0; color:#666; height:auto; }
	.featured .fspace h2 {color:#ea088c; font-size:1.9em; text-transform:uppercase; margin-bottom:0.2em; background-color:transparent; padding:0;}
	.featured .fspace h3 {color:#fff; font-size:3.6em; background-color:#ea088c; padding:0; margin-bottom:1em; display:inline; line-height:1.35em; }
	.featured .fspace .ftitle {display:block; margin-top:8px;}
	
}

@media only screen and (min-width: 1024px) {
	#content {width:96em; padding:13px 0; margin:0 auto;}
	#hfeature {display:block;}
	.rb_col {display:block; float:left; margin-right:1.5em; margin-bottom:0em;}
	.coleven {float:left;}
	.span1 {width:31em;}
	.span2 {width:63.5em;}
	.span3 {width:96em;}
	.colend {margin-right:0em !important;}
	.row {padding-bottom:15px;}
	#habout, #side {width:31em;}
}

/* Nutritional Pop Ups */
#nutripage {background-color:#F9F9F9;}
#nutritional {}
#nutritional>h1 {font-size:4em;}
#nutritional p {font-size:1.5em; line-height:1.4em;}
#nutritional #nutri_ingredients {margin-top:1em;} 

/* Contact Form */
#contactForm label {font-size:1.4em; display:block; margin:1em 0 0.4em;}
#contactForm input[type="text"], #contactForm input[type="email"], #contactForm textarea, #contactForm input[type="submit"]{width:100%; padding:0.45 0.5em; margin-bottom:0.25em;}

@media only screen and (min-width: 680px) {
	#contactForm input[type="submit"] {width:auto; padding:0.5em 1em;}
}

/* Footer */
#footer {display:box; width:100%; margin:0 1em; padding-bottom:17px; margin-top:1.5em;}
#footer_space ul {list-style:none;}
#footer_space ul li {text-transform:uppercase; display:inline; font-size:2em;  line-height:1.2em; }
#footer_space ul li a { color:#000; text-decoration:underline; margin-right:.65em;  }
#footer_space ul li a:hover { background-color:#000; color:#FFF; }
#footer_space ul li img {width:25px; height:25px;}
#footer_space ul li a.imgLink:hover { background-color:none; }

@media only screen and (min-width: 680px) {
	#footer {display:box; width:63.5em; margin:0 auto; padding-bottom:17px; margin-top:1.5em;}
	#footer_space ul li { display:inline; font-size:2em; line-height:1.2em;   }
	#footer_space ul li a {  }
}

@media only screen and (min-width: 1024px) {
	#footer {display:box; width:96em; margin:0 auto; padding-bottom:17px; margin-top:1.5em;}
	#footer_space ul li { display:inline; font-size:3em; line-height:1.102em;   }
	#footer_space ul li a {  }
	}