/* stack all grids below 40em (640px) */
@media all and (max-width: 1600px) {
    .recipe-image
    {
        width:300px;
    }
    
}

@media all and (max-width: 768px) {
	.break768 .ui-block-a,
	.break768 .ui-block-b,
	.break768 .ui-block-c,
	.break768 .ui-block-d,
	.break768 .ui-block-e {
		width: 100%;
		float: none;
	}

    .recipe-image
    {
        width:300px;
    }
}

@media all and (max-width: 640px) {
	.break640 .ui-block-a,
	.break640 .ui-block-b,
	.break640 .ui-block-c,
	.break640 .ui-block-d,
	.break640 .ui-block-e {
		width: 100%;
		float: none;
	}

    .recipe-image
    {
        width:200px;
    }
}

@media all and (max-width: 400px)
{
    .ui-li-aside
    {
        display:none;
    }
    
    .recipe-image
    {
        width:100px;
    }
}

#loader
{
    display: none;
}

.help
{
    display:block;
    float:right;
    margin-top:0px;
}

.add_button
{
    display:block;
    float:right;
    margin-top:-8px;
}

.banner
{
    margin:0 auto;
    max-width:980px;
}

.guts
{
    margin:0 auto;
    max-width:960px;
}

img
{
    max-width:100%;
}

img.rounded
{
    border-radius: 10px;
    -moz-border-radius: 10px;
    -khtml-border-radius: 10px;
    -webkit-border-radius: 10px;
}

label
{
    margin-top:6px !important;
    margin:0;
}

.pt
{
    font-family: 'PT Sans Narrow', sans-serif;
}

.ingredients
{
    font-family: 'PT Sans Narrow', sans-serif;
    font-size:11pt;
}

.ozzy
{
    font-family: 'Oswald', sans-serif;
}

p
{
    font-family: 'PT Sans Narrow', sans-serif;
    
}

.thumb
{
    min-width:80px !important;
    min-height:80px !important;
}

h1, h2, h3, h4, h5
{
    color: #4e4e4e;
    font-family: 'Oswald', sans-serif;
    font-weight: normal;
    margin:0 0 12px 0;
}

.section_header
{
    font-size:12pt;
    color:#4e4e4e;
    font-family: 'Oswald', sans-serif;
    margin:0 0 0 0;
    
}

ul.bux
{
    font-family: 'PT Sans Narrow', sans-serif;
    font-size: 11pt;
}

ul.sf li
{
    color:#ce252d;
    font-size:14pt;
}

ul.sf li span
{
    color:#6e6c6c;
    font-size:11pt;
}

.valid
{
	font-size: 11pt;
	color:#cc0000 !important;
	font-weight:bold;
	font-style:italic;
}

.msg
{
	font-size: 11pt;
	color:#4779AA !important;
	font-weight:bold;
	font-style:italic;
}

.success
{
	font-size: 11pt;
	color:#468847 !important;
	font-weight:bold;
	font-style:italic;
}


.error
{
    color:#cc0000 !important;
}

.dinky
{
    font-size: 8pt;
}

 .ui-dialog
{
    background: rgb(34,34,34) !important ;
    -moz-border-radius: 0em;
    -webkit-border-radius: 0em;
    border-radius: 0em;
}

.divider
{
    font-family: 'Oswald', sans-serif;
    font-weight:normal;
}
​
/*
input {
     transition: all 2s !important;
     -moz-transition: all 2s !important;
     -webkit-transition: all 2s !important;
     -o-transition: all 2s !important;
} 

textarea {
     transition: all 2s !important;
     -moz-transition: all 2s !important;
     -webkit-transition: all 2s !important;
     -o-transition: all 2s !important;
} 
*/

/*STD PLACEHOLDER*/
::-webkit-input-placeholder {font-style:italic; color: #aaa; }
:-moz-placeholder  { /* Firefox 18- */color: #aaa; font-style:italic;}
::-moz-placeholder  {  /* Firefox 19+ */color: #aaa; font-style:italic;}
:-ms-input-placeholder {color: #aaa; font-style:italic;}

/*DARK PLACEHOLDER*/
.dark::-webkit-input-placeholder {color: #444 !important; font-style:italic !important;}
input.dark:-moz-placeholder, textarea.dark:-moz-placeholder { /* Firefox 18- */ color: #444; font-style:italic;}
input.dark::-moz-placeholder, textarea.dark::-moz-placeholder {  /* Firefox 19+ */ color: #444; font-style:italic;}
input.dark:-ms-input-placeholder, textarea.dark:-ms-input-placeholder { color: #444; font-style:italic;}

/*ERROR PLACEHOLDER*/
.error::-webkit-input-placeholder {color: #cc0000 !important; font-style:italic !important;}
input.error:-moz-placeholder, textarea.error:-moz-placeholder {/* Firefox 18- */ color: #cc0000; font-style:italic;}
input.error::-moz-placeholder, textarea.error::-moz-placeholder { /* Firefox 19+ */ color: #cc0000; font-style:italic;}
input.error:-ms-input-placeholder, textarea.error:-ms-input-placeholder {  color: #cc0000; font-style:italic;}


.jqm-well
{
    /*width:100%;
    min-height:38px;*/
    margin:0;
    padding:8px;
    border-collapse:separate;
    *border-collapse: collapse; /* IE7 and lower */
    border-spacing: 0;
    font-size: 12pt;
    /*line-height:38px;*/
    border: solid #aaa 1px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background-color:#f9f9f9;
 
    -moz-box-shadow: inset 0 1px 3px 0 rgba(0,0,0,0.2);
    -webkit-box-shadow: inset 0 1px 3px 0 rgba(0,0,0,0.2);
    box-shadow: inset 0 1px 3px 0 rgba(0,0,0,0.2);
}

.jqm-table
{
    width:100%;
    margin:0;
    padding:0;
    border-collapse:separate;
    *border-collapse: collapse; /* IE7 and lower */
    border-spacing: 0;
    font-size: 11pt;
    border: solid #aaa 1px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background-color:#f9f9f9;
 
    -moz-box-shadow: inset 0 1px 3px 0 rgba(0,0,0,0.2);
    -webkit-box-shadow: inset 0 1px 3px 0 rgba(0,0,0,0.2);
    box-shadow: inset 0 1px 3px 0 rgba(0,0,0,0.2);
 }

.jqm-table td
{
    padding:8px;
    border-bottom:1px solid #aaa;
    border-right: 1px solid #aaa;
    vertical-align:top;
}

.jqm-table td:last-child
{
    border-right:0;
}

.jqm-table tr:last-child td
{
    border-bottom:0;
}

.jqm-table tr:nth-child(even)
{
    background-color:#f5f5f5;
}

.jqm-table tr:first-child
{
}

.jqm-table tr:first-child td:first-child
{
    -moz-border-radius: 10px 0 0 0;
    -webkit-border-radius: 10px 0 0 0;
    border-radius: 10px 0 0 0;
    
}

.jqm-table tr:first-child td:last-child
{
    -moz-border-radius: 0 10px 0 0;
    -webkit-border-radius: 0 10px 0 0;
    border-radius: 0 10px 0 0;
    
}

.jqm-table tr:last-child td:first-child
{
    -moz-border-radius: 0 0 0 10px;
    -webkit-border-radius: 0 0 0 10px;
    border-radius: 0 0 0 10px;
    
}

.jqm-table tr:last-child td:last-child
{
    -moz-border-radius: 0 0 10px 0;
    -webkit-border-radius: 0 0 10px 0;
    border-radius: 0 0 10px 0;
    
}

textarea
{
    /*because jquery mobile auto grows*/
    overflow:hidden;
    line-height:26px;
}

table
{
    border-spacing:0;
    border-collapse:collapse;
}

.ui-header .ui-title {
    margin-right: 10%;
    margin-left: 10%;
}


/* Red button theme for JQuery Mobile
 * - Use data-theme="r" for red versions of the default JQuery Mobile Buttons.
 ******************************************************************************************/
 
.ui-btn-up-r {
    border: 1px solid #721414;
    background: #AB2525;
    font-weight: bold;
    color: #fff;
    text-shadow: 0 -1px 1px #000;
    background-image: -moz-linear-gradient(top, #C54E4E, #AB2525);
    background-image: -webkit-gradient(linear,left top,left bottom,
        color-stop(0, #C54E4E),
        color-stop(1, #AB2525));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#C54E4E', EndColorStr='#AB2525')";
}
.ui-btn-up-r a.ui-link-inherit {
    color: #fff;
}
.ui-btn-hover-r {
    border: 1px solid #6E0000;
    background: #B64B4B;
    font-weight: bold;
    color: #fff;
    text-shadow: 0 -1px 1px #000;
    background-image: -moz-linear-gradient(top, 
        #D47272, 
        #B64B4B);
    background-image: -webkit-gradient(linear,left top,left bottom,
        color-stop(0, #D47272),
        color-stop(1, #B64B4B));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#D47272', EndColorStr='#B64B4B')";
}
.ui-btn-hover-r a.ui-link-inherit {
    color: #fff;
}
.ui-btn-down-r {
    border: 1px solid #772222;
    background: #C54E4E;
    font-weight: bold;
    color: #fff;
    text-shadow: 0 -1px 1px #000;
    background-image: -moz-linear-gradient(top, #9E3939, #C54E4E);
    background-image: -webkit-gradient(linear,left top,left bottom,
        color-stop(0, #9E3939),
        color-stop(1, #C54E4E));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#9E3939', EndColorStr='#C54E4E')";
}
.ui-btn-down-r a.ui-link-inherit {
    color: #fff;
}
.ui-btn-up-r,
.ui-btn-hover-r,
.ui-btn-down-r {
    font-family: Helvetica, Arial, sans-serif;
    text-decoration: none;
}

/* Green button theme for JQuery Mobile
 * - Use data-theme="g" for green versions of the default JQuery Mobile Buttons.
 ******************************************************************************************/


/* G
 -----------------------------------------------------------------------------------------------------------
 normal green: 019901
 light green: 00bf00
 dark green: 006b00
 
 */
.ui-btn-up-g, .ui-btn-hover-g, .ui-btn-down-g {
    color: white;
    font-weight: bold;
    text-decoration: none; }
 
.ui-btn-up-g {
    border: 1px solid #003700;
    background: #006b00;
    text-shadow: 0 1px 1px #003700;
    background-image: -moz-linear-gradient(top, #4b944b, #006b00);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #4b944b), color-stop(1, #006b00));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#4b944b', EndColorStr='#006b00')"; }
 
.ui-btn-hover-g {
    border: 1px solid #003700;
    background: #4b944b;
    text-shadow: 0 1px 1px #003700;
    background-image: -moz-linear-gradient(top, #019901, #006000);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #019901), color-stop(1, #006000));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#019901', EndColorStr='#006000')"; }
 
.ui-btn-down-g {
    border: 1px solid #003700;
    background: #5ea45e;
    text-shadow: 0 1px 1px #003700;
    background-image: -moz-linear-gradient(top, #006000, #00bf00);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #006000), color-stop(1, #00bf00));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#006000', EndColorStr='#00bf00')"; }


.sidebyside {
    float: left;
    position: relative;
    display: inline-block;
}