/* 
    COLORS

    color:#469BF2;  /* blue, light
    color:#B157FF;  /* purple, light 
    color:#6FD138;  /* green, skittle
    color:#E66C3F;  /* red, orange
    color:#FCE042;  /* yellow
                    /* 71% black (arrow)
*/

root { 
    display: block;
}
@font-face {
    font-family: 'GandhiSans';
    src: url('font/GandhiSans-Regular-webfont.eot');
    src: url('font/GandhiSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/GandhiSans-Regular-webfont.woff') format('woff'),
         url('font/GandhiSans-Regular-webfont.ttf') format('truetype'),
         url('font/GandhiSans-Regular-webfont.svg#GandhiSansRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'GandhiSans';
    src: url('font/GandhiSans-Italic-webfont.eot');
    src: url('font/GandhiSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/GandhiSans-Italic-webfont.woff') format('woff'),
         url('font/GandhiSans-Italic-webfont.ttf') format('truetype'),
         url('font/GandhiSans-Italic-webfont.svg#GandhiSansItalic') format('svg');
    font-weight: normal;
    font-style: italic;

}

@font-face {
    font-family: 'GandhiSans';
    src: url('font/GandhiSans-Bold-webfont.eot');
    src: url('font/GandhiSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/GandhiSans-Bold-webfont.woff') format('woff'),
         url('font/GandhiSans-Bold-webfont.ttf') format('truetype'),
         url('font/GandhiSans-Bold-webfont.svg#GandhiSansBold') format('svg');
    font-weight: bold;
    font-style: normal;

}

@font-face {
    font-family: 'GandhiSans';
    src: url('font/GandhiSans-BoldItalic-webfont.eot');
    src: url('font/GandhiSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/GandhiSans-BoldItalic-webfont.woff') format('woff'),
         url('font/GandhiSans-BoldItalic-webfont.ttf') format('truetype'),
         url('font/GandhiSans-BoldItalic-webfont.svg#GandhiSansBoldItalic') format('svg');
    font-weight: bold;
    font-style: italic;

}
/* zero out */
h1, h2, h3, h4, h5, h6 {
    /*margin:0px;*/
}
body{
    margin:0px;
    font-family: "GandhiSans", serif;
}
#screenRecipe{
    display:none;
}
#wrapper{    
    background-image: url('../img/bg.png');
}
#wrapperD{
    position:relative;
}
header{
    /*-webkit-box-shadow:  0px 0px 14px 5px rgba(120, 120, 120, .95);        
    box-shadow-bottom:  0px 0px 14px 5px rgba(120, 120, 120, .95);*/
    width:100%;
    background: rgb(230, 230, 230);
    z-index:100;
}
#logo{
    width:95%;
    max-width:310px;
    margin:auto;
}
#dividing_line{
    width:100%;
    height:3px;
    margin: auto;
    padding:0px;
    background-color:#B157FF;/*purple*/    
}
#wrapper_recipe{
    position:relative;
    margin: 1% 2% 1% 1%;
    width:98%;    
    min-width:170px;
    min-height:300px;    
}
.ingredientsInput_label{    
    margin: 29px 0px 18px 18px;
}
textarea{  
    padding: 5px 5px 5px 5px;
    width:100%;
    /*min-width:170px;
    //min-height:130px;
   /*-moz-border-radius: 9px;
   //-webkit-border-radius: 9px;
   //border-radius: 9px 9px 9px 9px;*/
}
.wrapper_recipe{
    background-color:white;
    clear:both; 
    padding: 1% 1% 1% 1%;
    width:76%;
    margin:auto;
    min-width:170px;
    min-height:130px;    
   -moz-border-radius: 9px;
   -webkit-border-radius: 9px;
   border-radius: 9px 9px 9px 9px;    
}
.button_search{
    float:left;
}
nav{
    clear:both;
    width:100%;
}
h1{  /*recipe title*/
    color:#469BF2;  /* blue, light */
    font-size:23px;  /*3em;*/
    font-style: italic;
    font-weight: bold;
    text-transform: none;
    letter-spacing: -.01%;  /*-.05em;*/
    line-height: 5%;  /*1.2em;*/
}
h2, h3{  /*servings, time to prep*/
    font-size:12px; 
    color:#B157FF;  /* purple, light */
    /*font-size: 240%; 1.2em*/
    /*line-height: 6%; /*1.4em;*/
    margin-left: 1%;/*.25em;*/   
    float:left;
}
h4, p{  /*ingredients title*/
    font-size:110%;
    font-weight:normal;
}
a{
    text-decoration:none;
}

.previous, .next, .back{    
    width:30%;    
    margin: 2% 0%;
    padding-right:0px;
    padding-left:11px;
    padding-top:0px;
    padding-bottom: 0px;
    text-align:center;
}
.previous{
    float:left;
}
.next{
    float:right;
    padding-right:11px;
    padding-left:0px;
}
.back{
    float:none;
}
nav h6{
    color:green; 
    display:block;
    background-color:rgba(0,0,0,.4);
    width: 100%;
    margin:11px 0px;
    padding:6px 0px 7px 25px;
    font-size:200%;
    font-weight:normal;
    margin: 0px 0px 23px 0px;
}
.previous, .back{
   -moz-border-top-right-radius: 9px;
   -moz-border-bottom-right-radius: 9px;   
   -webkit-bord-top-right-radius: 9px;
   -webkit-bord-bottom-right-radius: 9px;   
   border-radius: 0px 9px 9px 0px;
}
.next{
   -moz-border-top-left-radius: 9px;
   -moz-border-bottom-left-radius: 9px;   
   -webkit-bord-top-left-radius: 9px;
   -webkit-bord-bottom-left-radius: 9px;   
   border-radius: 9px 0px 0px 9px;
}
.previous h6:before, .back:before{
    width:20px;
    content: "\2190";
    margin-right:4px;
}
.next h6:after{
    content: "\2192";
    margin-left:4px;
}   
.ingredientsInput_label h2, .ingredientsInput_label h3{       
    color:#B157FF;  /* purple, light */
    font-size: 78%; /*1.2em*/
    margin: 0px 0px 10px 4px;/*.25em;*/    
    clear:both;
}
.wrapper_recipe h6{
    color:#6FD138;
    font-weight:bold;
    letter-spacing:5px;
    margin: 0px 0px 0px 0px;
    clear:both;
}
ul{  /*ingredients list*/
}
li{
}
span{
    width:13%;
    height:3px;
    float:left;
    display:inline-block;
    margin:0px;
    padding:0px;
}

/* dividingline */
.b1{    
    background-color:#6FD138;/*green*/
}
.b2{
    background-color:#B157FF;/*purple*/
}
.b3{
    background-color:#E66C3F;/*red*/
}
.b4{
    background-color:#469BF2;/*blue*/
}
.b5{
    background-color:#FCE042;  /*yellow*/
}