/*
Theme Name: Povar
Theme URI: //povar.me
Description: Тема для настоящих кулинаров
Version: 1.0
Text Domain: 
*/

.box-shadow (...) {
  box-shadow: @arguments;
  -moz-box-shadow: @arguments;
  -webkit-box-shadow: @arguments;
}
.gradient (@colortop, @colorbottom) {
  background-color: @colortop;
  background-image: -moz-linear-gradient(top, @colortop, @colorbottom);
  background-image: -webkit-gradient(linear, left top, left bottom,
  color-stop(0%,@colortop), color-stop(100%,@colorbottom));
  background-image: -webkit-linear-gradient(top, @colortop, @colorbottom);
  background-image: -o-linear-gradient(top, @colortop, @colorbottom);
  background-image: -ms-linear-gradient(top, @colortop, @colorbottom);
  filter: ~"progid:DXImageTransform.Microsoft.gradient(startColorstr="@colortop~", endColorstr="@colorbottom~",GradientType=0)";
  background-image: linear-gradient(top, @colortop, @colorbottom);
}

.border-radius (...) {
  border-radius: @arguments;
  -webkit-border-radius: @arguments;
  -moz-border-radius: @arguments;
}

.opacity(@opacity: 0.5) {
  -moz-opacity: @opacity;
  -khtml-opacity: @opacity;
  -webkit-opacity: @opacity;
  opacity: @opacity;
  @opperc: @opacity * 100;
  -ms-filter: ~"progid:DXImageTransform.Microsoft.Alpha(opacity=@{opperc})";
  filter: ~"alpha(opacity=@{opperc})";
}

.placeholder-color(@color){
  ::-webkit-input-placeholder {color: @color;}      /* WebKit browsers */
  ::-moz-placeholder { color:@color; }  /* Mozilla Firefox 19+ */
  :-moz-placeholder  { color: @color; }  /* Mozilla Firefox 4 to 18 */
  :-ms-input-placeholder { color:@color; }  /* Internet Explorer 10+ */
}


/* Переменные, определения цветов */
@orange: #f05f3b; //Ссылки
@lgrey: #efefef;
@dgrey: #364656;
@textcolor: #343434;

@width: 1020px; //Ширина сайта


/* Вспомогательные классы */
.alignleft{float: left;}
.alignright{float: right;}
.clearfix {clear: both;}


@font: 'Georgia';
@font2: 'Trebuchet MS';


 #sfield::-webkit-input-placeholder {color: #fff;}      /* WebKit browsers */
  #sfield::-moz-placeholder { color:#fff; }  /* Mozilla Firefox 19+ */
  #sfield:-moz-placeholder  { color: #fff; }  /* Mozilla Firefox 4 to 18 */
  #sfield:-ms-input-placeholder { color:#fff; }  /* Internet Explorer 10+ */

html, body {
  height: 100%;
  position: relative;
  font-family: @font, sans-serif;
  color: @textcolor;
  font-size: 1em;
}

::-moz-selection { background: #f05f3b; color: #fff; text-shadow: none; }
::selection { background: #f05f3b; color: #fff; text-shadow: none; }

a,.orange {
    color: @orange;
    &:hover{
        text-decoration: none;
    }
}

.waves {margin: 0;  background: url('../images/separator.png') left bottom repeat-x; border:0px none; height:6px;  clear:both;}
.button{display: inline-block; cursor: pointer; border: none; background-color: @orange; color: #fff!important; font-family: @font2!important; text-transform: uppercase!important; text-decoration: none; font-size: 0.9em!important; padding: 10px 10px; }
.button.red,.button.bookmarked{background-color: #9d1f00;}
* { -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale; }

body {background: url('../images/bg.png') 0 0 repeat; }
#site {width: @width; margin: 0 auto;}
.content{margin-top: 40px; padding: 40px; background-color: #fff;}

#ingredients{background-color: @lgrey; padding: 20px 0px;  margin-top: 30px;}
.contentblock{background-color: @lgrey; padding: 20px 30px;  margin-top: 30px;
    &.nopadding{padding: 20px 0px;}
    p{
        margin: 10px 0;
        font-size: 0.9em;
    }
    .item{
        
        font-size: 0.9em;
        float: left;
        text-align: center;
        width: 120px;
        padding: 5px;
        height: 165px;
        overflow: hidden;
        margin-top: 10px;
        margin-left: 23px;
        //&:first-child{margin-left: 0!important;}
        //&:nth-child(6n+1){margin-left: 0px!important;}
        &:hover,.selected{
            .gradient(#f0b63b,#f0603b);
            a{color: #fff;}
        }
    }
    .block-foot{text-align: center;}
    
    #letters_list{
        padding: 20px 28px;
        .let{
            font: @font2;
            margin: 3px;
            //padding: 2px 5px;
            display: inline-block;
            width: 25px;
            height: 25px;
            text-transform: uppercase;
            text-decoration: none;
            line-height: 25px;
            text-align: center;
            background-color: @orange;
            color: #fff;
        }
        
    }
    .letter-heading{
        margin: 0 28px;
        padding: 20px 0;
        background: url('../images/separator-g.png') left bottom repeat-x;
        .letter{
            font-size: 4.5em;
            font-weight: bold;
            margin: 0 20px 0 22px;
        }
        .l_desc{
            font-style: italic;
            color: #a6a39f;
        }
    }
    
}


.in404{
    position: absolute;
    top: 50%;
    margin-top: -178px;
    padding: 40px;
    h1{
        font-size: 1.85em;
        font-family: @font2;
        color: @dgrey;
        text-transform: uppercase;
        font-weight: bold;
        margin-bottom: 30px;
        text-align: center;
    }
    p{
        line-height: 1.5em;
    }
     .text404{
        width: 430px;
        padding: 40px;
        .button{width: 100%; text-align: center; padding: 15px 0; margin-top: 20px;}
        }
    .logo404{
        width: 350px;
        height: 257px;
        background: url('../images/404.png') center center no-repeat;
    }
}

 .block-heading{
            text-align: center;
            //margin-bottom: 10px;
            h1,h2,h3{
                
                
                display: inline-block;
                font-family: @font2;
                text-transform: uppercase;
                font-weight: bold;
                padding-bottom: 10px;
                width: auto;
                 background: url('../images/separator-g.png') left bottom repeat-x;
            }
        }

  .fixedmenu{
        height: 40px;
        background-color: @dgrey;
        position: relative;
        padding: 0 40px;
        bottom: -40px;
        &.fixed{position: fixed; top:0; width: 940px; z-index: 100; opacity: 0.9;}
        >a,.phrase{
            color: #fff;
            font-family: @font2;
            font-size: 0.9em;
            line-height: 40px;
            padding-right: 20px;
        }
      .social-icons{
        height: 24px;
        padding: 8px 0;  
        li{
            float: left;
            height: 24px;
            a{padding: 0 0 0 10px;}
            .icon{
                display: inline-block;
                width: 24px;
                height: 24px;
                background: url('../images/soc-icons.png') 0 0 no-repeat;
                &.twi{background-position: -24px 0px;}
                &.fb{background-position: -48px 0px;}
                &.okl{background-position: -72px 0px;}
                &.gp{background-position: -96px 0px;}
                &.sb{background-position: -120px 0px;}
            }
        
        }
      }
    }

header{
    #logo{
        background: url('../images/logo.png') left bottom no-repeat;
        margin: 0 auto;
        width: 276px;
        height: 111px;
        text-indent: -99999px;
    }
  
    .mainmenu{
        position: relative;
        @menuheight: 50px;
        height: @menuheight;
        margin-top: 30px;
        background-color: @dgrey;
        font-family: @font2;
        font-weight: bold;
        .menu-right{
        position: absolute; top: 0; right: 0;
        }
        .menu-button{
            display: block; 
            height: @menuheight;
            line-height: @menuheight;
            background-color: @orange;
            color: #fff; 
            font-size: 14px; 
            text-transform: uppercase;
            padding: 0px 20px;
            text-decoration: none;
        }
        .add-recept{
            margin-right: @menuheight;
            //position: absolute;
            //right: @menuheight;
        }
        .search-button{
            position: absolute;
            right: 0;
            top: 0;
            outline: 0;
            width: @menuheight;
            height: @menuheight;
            cursor: pointer;
            border: none;
            background: url('../images/searchbutton.png') center center no-repeat;
            &.active{background-color:#4d6782;}
        }
        #sfield{
            display: none;
            color: #fff; 
            //&.placeholder-color('#fff!important');
            font-style: italic;
            .box-shadow(inset, 0px, 0px, 5px, #000);
            background-color: #5d7997;
            background-origin: padding-box, border-box;
            background-clip: padding-box, border-box;
            border: none;
            height: @menuheight;
            width: 149px;
            position: absolute;
            right: @menuheight;
            top: 0;
            //margin: 0 @menuheight 0 0;  
            padding: 0 10px;
            outline: 0;
        }
        
        ul{
            li{
                float:left;
                position: relative;
                &:hover,&.active{background-color: @orange;}
                &:hover > ul {opacity: 0.9;	visibility: visible;}
                a{
                    .menu-button;        
                    background-color: transparent;
                }
                ul{
                    visibility:hidden; 
                    position: absolute; 
                    width: 120%;  
                    background-color: @orange; 
                    top: @menuheight;	
                    left: 0px;	
                    li{
                        width: 100%;
                        &:hover{background-color: @dgrey;}
                        a{}
                    }
                }
            }
        }
    }

}

#foodtypes{
    margin-top: 30px;
    .item{
        float: left;
        padding: 10px;
        background-color: #f7f4ed;
        width: 120px;
        margin-left: 20px;
        &:first-child{margin-left: 0;}
        ul{
            margin-top: 7px;
            li{
                font-family: @font2;
                font-size: 0.9em;
                a{text-decoration: none;}
            }
        }
        .icon{
            //display: inline-block;
            margin: 0 auto;
            width: 40px;
            height: 29px;
            background:url('../images/icons.png') 0 center no-repeat;
            &.second{background-position: -40px center; }
            &.snack{background-position: -80px center; }
            &.drinks{background-position: -120px center; }
            &.desert{background-position: -160px center; }
            &.other{background-position: -200px center; }
        }
     }
}

#promoposts{
    margin-top: 30px;
    .thumbnail{
        float:left;
        margin-left:20px;
        &:first-child{margin: 0;}
    }
}

/* миниатюры */
.thumbnail {
    overflow: hidden;
    &.medium{
        width: 120px;
        height: 120px;
        margin-bottom: 10px;
        background: grey;
    }
    &.large{ /* промо посты */
        width: 300px;
        height: 140px; 
        background: grey;
    } 
    &.fullsize {
        width: 620px; 
        height: 200px; 
        position: relative; 
        z-index: 1; 
        background: grey;}
    
    &.wide{ /* промо посты */
        width: 100%;
        height: 140px; 
        position: relative; 
        background: grey;
        margin-top: 30px;
        .ingr-desc{
        position: absolute; 
        top: 20px;
        left: 20px;
        max-width: 400px;
        padding: 10px;
        font-size: 1.5em;
        font-family: @font;
        background: rgba(0,0,0,0.55); 
        color:#fff;
        }
        
    } 
    
    .desc {
        text-align: center;
        position: absolute; 
        font-family: @font2;
        height: 17px;
        max-height: 100px;
        
        left: 0;  
        bottom: 0; 
        padding: 25px 50px; 
        color: #fff; 
        background: rgba(0,0,0,0.55); 
        transition: .2s;
        
        h1,h2{
            font-size: 1.4em;
            
            margin-bottom: 20px;
            a{color: #fff; text-decoration: none;}
        }
        p{
            margin-top: 18px;
            font-style: italic;
            font-size: 0.9em;
            &#breadcrumbs{
            *{color: #bbbaba; text-decoration: none; text-transform: uppercase; font-style: normal;}
                margin-top: 20px;
            }
        }
        &:hover,&.active{min-height:150px;}
    }
}
//.thumbnail.small {width: 72px; height: 72px; background: grey; margin-right: 10px;}  /* лучшие моды итд */
//.thumbnail.large{width: 170px;height: 170px; background: grey; margin-bottom: 10px!important;} /* похожие и лучшие посты */


#posts{
    margin-top: 30px;
    width: 620px;
    article{
        background-color: @lgrey;
        margin-bottom: 30px;
        .post-text{
            position: relative;
            padding: 30px 30px 20px 30px;
            line-height: 1.4em;
            img.size-full,img.align-full{margin: 15px auto; /*display: block;*/ max-width: 98%; height: auto;}
            h1,h2,h3,h4,h5{font-style: italic!important; font-weight: bold; font-family: @font; margin: 10px 0;}
            strong {font-weight: bold;}
            ol, ul {margin: 0 0 15px 0; padding:0;}
            ol>li { margin-left: 0px; }
            >ul>li{ margin: 0 0 0 20px; &:before{content: "\2014"; margin-right: 5px;}}
            em{font-style: italic;}
            blockquote{/*margin-left: 50px; */padding-left: 10px; border-left: 7px solid @orange; font-style: italic; font-size: 0.9em;}
            .ingredients ul>li:before  {content: "\2014"; margin-right: 5px;}
             .recipe-details, .recipe-taxes {
             text-align: center;
             li{ b,span,time{ font-weight: bold; font-style: italic; font-family: @font;}  b {font-size: 0.9em!important;}}
             }
            .recipe-taxes{ text-align: left;}
            p{margin-bottom: 15px; line-height: 1.4em;}
            .post-footer{
                padding-top: 15px;
                border-top: 2px solid #fff;
               
            }
            .rate{position: absolute; right: 30px; bottom: 115px;}
            .print{position: absolute; right: 100px; bottom: 40px;}
            
          
            
            .socbuttons{margin-top:10px;}
             .socbutton{
                    width: 23.5%;
                    margin-right: 2%!important;
                    color: #fff;
                    text-decoration: none;
                    font-family: @font2;
                    height: 40px;
                    line-height: 40px;
                    text-align: center;
                    background: #5e83a7;
                    display: inline-block;
                    margin:0;
                    &:last-child{margin-right: 0!important;}
                    &.vk:hover{background-color:#506f8e;}
                    &.fb{
                        background-color: #486ebd;
                        &:hover{background-color:#3d5ea1;}
                    }
                    &.tw{
                        background-color: #00acee;
                        &:hover{background-color:#0091cb;}
                    }
                    &.gp{
                        background-color: #d84e30;
                        &:hover{background-color:#b84229;}
                    }
                }
            
            .recipe-details,.ingredients,.instructions,.recipe-taxes,.recipe-author{
                border-top: 2px dashed #a19e99; 
                margin-top: 20px;
                .amount{font-style: italic!important; font-weight: bold; font-size: 0.9em; font-family: @font;}
                &:before{content:''; display:block; width: 40px; height: 32px; margin: -16px auto 0 auto; background: url('../images/icons.png') -240px center no-repeat @lgrey;}
            }
            
            //.summary:before{background-position: -280px center; }
            .ingredients:before{background-position: -280px center; }
            .instructions:before{background-position: -320px center; }
            .recipe-taxes:before{background-position: -360px center; }
            .recipe-author:before{background-position: -440px center; }
            
            .recipe-author{
                .avatar{width: 60px; height: 60px; display: block; margin: 0; float: left; .border-radius(50px);}
                .author-text{padding-left: 70px; padding-top: 5px; font-size: 0.9em;
                    .author-name{color: #a19e99;}
                }
            }
        }
        
          .social-footer{
                height: 40px;
                line-height: 40px;
                background-color: @orange;
                font-family: @font2;
                font-weight: bold;
                font-size: 0.9em;
                text-align:center;
                text-transform: uppercase;
                color: #fff;
                li{
                    float: left;
                    position:relative;
                    width: 33.3333%;
                    background-color: @dgrey;
                    &:hover > ul {opacity: 1;	visibility: visible; display: block; }
                    a{display: block; text-decoration: none;color: #fff; width: 100%;
                      &:hover,&.active{background-color: @orange;}
                      //&.active{width:208px;}
                    }
                    
                     ul{
                    display: none;     
                    //visibility:hidden; 
                    position: absolute; 
                    width: 207px;  
                    //background-color: @orange; 
                    top: 40px;	
                    left: 0px;	
                    li{
                        width: 100%;
                        &:hover{background-color: @dgrey;}
                        .socbutton{
                            background: #5e83a7;
                            &.vk:hover{background-color:#506f8e;}
                            &.fb{
                                background-color: #486ebd;
                                &:hover{background-color:#3d5ea1;}
                            }
                            &.tw{
                                background-color: #00acee;
                                &:hover{background-color:#0091cb;}
                            }
                            &.gp{
                                background-color: #d84e30;
                                &:hover{background-color:#b84229;}
                            }
                        }
                        
                    }
                     }
                }
                .icon{ 
                    background: url('../images/form-icons.png') -42px 0 no-repeat;
                    display: inline-block;
                    width: 16px;
                    height: 16px;
                    margin: 0 5px -2px 0;
                    &.bookmark{ background-position: -58px 0;}
                }
            }
       
    }
    
    .advices-head{padding: 20px 0px; height: 112px; background: url(../images/garlic.png) center center no-repeat @lgrey;}
    .advice{
        margin: 0;
        
        //padding-bottom: 60px;
        .post-text{
            padding-top: 20px;
            padding: 20px 30px 10px 30px;
            h2.advice-heading {
                margin: 0 0 10px 0; 
                a {color: @dgrey; font-weight: bold; font-style: normal; text-decoration: none; margin-bottom: 30px;}
                
                }
        }
        &:last-child{padding-bottom: 20px; margin-bottom: 30px;}
        .more-advices{
            ul{
                padding: 10px 25px 30px 25px;
                li{width: 46%;padding: 3px 2%; float: left;}
            }
        }
    }
    .contentblock .item {margin-left: 13px;}
    
}

#pagination{ background-color: @lgrey; padding: 30px 30px; font-family: @font2;}


aside{
    margin-top: 30px;
    width: 300px;
    .sideblock{
        background: @lgrey;
        padding: 20px;        
        margin-bottom: 30px;
       p{font-size: 0.9em;}
        ul{
            li{
                padding: 10px 0;
                border-bottom: 2px solid #fff;
                font-size: 0.9em;
                &:last-child{
                    border: none;
                    padding-bottom: 0;
                }
            }
        }
        .timechoose{
            margin-top: 10px;
            text-align: center;
            .tc{
                color: @orange;
                &:after{content:' |';}
                &:last-child:after{content:'';}
                a{
                    font-style: italic;
                    margin: 0 10px;
                    font-size: 0.9em;
                    text-decoration: none;
                    border-bottom: 1px dotted @orange;
                    
                }
            }
        }
        .tab{
            display: none;
            &.active{display: block;}
        }
        .item{
            float: left; 
            text-align:center;  
            width: 120px; 
            margin-top: 20px;
            font-size: 0.9em;
            height: 160px;
            overflow: hidden;
            //padding: 10px; 
            &:nth-child(2n){margin-left: 20px;}
        
        }
        &.wline{background: url('../images/line.png') 0 0 repeat-x @lgrey;}
        .side-section{
            //font-size: 0.9em;
            padding-top: 12px;
            padding-bottom: 12px;
            
            border-bottom: 1px dashed #9b9893;
            &.center{text-align: center; margin-bottom: 20px;}
           
            .button{width: 92%; padding: 10px 4%;}
        }
    



    }
    #aside-profile{
        background: #efefef;
        padding:0 20px 10px 20px;
        margin-bottom: 30px;
        .section{
        *{font-size: 14px;}    
         border-bottom: 1px dashed #a19e99;
         padding: 10px 0;
        }
        .head{
            text-align: center;
            .avatar{
                .border-radius(9999px);
                margin: 0 auto 10px auto;
                display: block;
                padding: 5px !important;
                background: #364656 !important;
            }
            .profile-name{
                color: @dgrey;
                font-weight: bold;
                font-size: 1.5em;
                text-decoration: none;
                padding-top: 20px;
            }
        }    
        .profile-counters{
            text-align: center;
            li{
                padding: 0px 20px;
                border: none;
                display: inline-block;
                 * {color: @orange;}
                b{
                    font-weight: bold;
                    
                    font-size: 18px;
                }
            }
        }
        .profile-links{
            li{
                border: none;
                padding: 5px 0;
                &:before{content:'—'; padding-right: 5px; color: #a19e99;}
            }    
        }
        .button.logout{background-color: #9d1f00; display: block; text-align: center; font-weight: bold; margin-top:10px;}
    }
}

#national{
    text-align: center;
    .national{
        padding: 20px 0;
        overflow: hidden;
        li{
            float: left;
            text-align: left;
            width: 230px;
            max-width: 230px;   
            font-size: 0.9em;
            line-height: 20px;
            &:nth-child(4n+4){width: auto;}
            .flag{
                display: inline-block;
                width: 16px;
                height: 11px;
                margin-right: 10px;
                background: url('../images/flags.png') 0 0 no-repeat;
                &.f1{ background-position: 0px 0px;}
                &.f2{ background-position: -16px 0px;}
                &.f3{ background-position: -32px 0px;}
                &.f4{ background-position: -48px 0px;}
                &.f5{ background-position: -64px 0px;}
                &.f6{ background-position: -80px 0px;}
                &.f7{ background-position: -96px 0px;}
                &.f8{ background-position: -112px 0px;}
                &.f9{ background-position: -128px 0px;}
                &.f10{ background-position: -144px 0px;}
                &.f11{ background-position: -160px 0px;}
                &.f12{ background-position: -176px 0px;}
                &.f13{ background-position: -192px 0px;}
                &.f14{ background-position: -208px 0px;}
                &.f15{ background-position: -224px 0px;}
                &.f16{ background-position: -240px 0px;}
                
                &.f17{ background-position: 0px -11px;}
                &.f18{ background-position: -16px -11px;}
                &.f19{ background-position: -32px -11px;}
                &.f20{ background-position: -48px -11px;}
                &.f21{ background-position: -64px -11px;}
                &.f22{ background-position: -80px -11px;}
                &.f23{ background-position: -96px -11px;}
                &.f24{ background-position: -112px -11px;}
                &.f25{ background-position: -128px -11px;}
                &.f26{ background-position: -144px -11px;}
                &.f27{ background-position: -160px -11px;}
                &.f28{ background-position: -176px -11px;}
                &.f29{ background-position: -192px -11px;}
                &.f30{ background-position: -208px -11px;}
                &.f31{ background-position: -224px -11px;}
                &.f32{ background-position: -240px -11px;}
            }
        }
    }
}
footer{
    padding: 20px 250px;
    text-align: center;
    font-family: @font2;
    color: #fff; 
    text-shadow: 0px 1px 0px rgba(0,0,0,0.5);
    .heading{text-transform: uppercase;}
    a{
        color: #fff;
        margin: 0 5px;
    }
    p{
        margin-bottom: 20px;
        margin-top: 10px;
        font-size: 0.8em;
    }
}

.block-heading{
            text-align: center;
            //margin-bottom: 10px;
            h1,h2,h3{
                
                
                display: inline-block;
                font-family: @font2;
                text-transform: uppercase;
                font-weight: bold;
                padding-bottom: 10px;
                width: auto;
                
            }
        }

.contentblock .heading, #povar-profile .heading{font-style: italic; font-weight: bold;  text-align: center; font-size: 1.8em; padding-bottom: 20px;  margin-bottom: 20px;  background: url('../images/separator-g.png') left bottom repeat-x;}
#feedback{

    .heading{font-style: italic; font-weight: bold;  text-align: center; font-size: 1.8em;  margin-bottom: 20px;}
.text{width: 550px;
    p{line-height: 1.5em;font-size: 1em; }
    }
    .button{width: 100%; cursor: pointer; text-align: center; background: url('../images/airplane.png') center center no-repeat @orange;}
    .social {margin-top: 10px;b{font-weight: bold; }}
}

 input[type=text], input[type=email],input[type=password], textarea, select, .com-nologin{
                background-color: #f7f4ed;
                font-style: italic;
                color: #9b9893;
                .placeholder-color('#9b9893');
                
                border: none;
                outline: none;
                width: 92%;
                padding: 6px 4%;
                margin-bottom: 10px;
                .box-shadow(inset, 0px, 0px, 5px, rgba(0,0,0,0.3));
            }

            
#instafood{
    text-align: center;
    .heading{font-style: italic; font-weight: bold; font-size: 1.8em;  margin-bottom: 20px;}
    p{font-size: 1em;  margin-bottom: 20px;}
    .paginate{text-align: center;}
    .photo{ float: left; width: 120px; height: 120px; margin-left: 30px; margin-bottom: 30px;}
}
@media only screen and  (max-width: 1099px) { 
 #site,aside,.content,#povar-profile .profile-content{width: 100%!important; float: none;}
 .content,#posts{width: auto; float:none;}
 .content,aside{float: none;}

 .thumbnail.fullsize{margin: 0 auto;}
 
 #promoposts{display: none;}
 .fixedmenu{display: none;}
 
    
 header .mainmenu{
    .add-recept,#sfield{display: none;}
 }
 
 #feedback{

   
.text{width: auto;
      float: none;
    }
    
    .social {float: none; text-align: center;}
}
 
 .in404{
    top: 120px;
    margin-top: 0;
  
    p{
        text-align: center;
    }
     .text404{
        float:none;
        width: auto;
        padding: 40px;
        .button{width: 100%; text-align: center; padding: 15px 0; margin-top: 20px;}
        }
    .logo404{
        float: none;
        width: 100%;
        height: 257px;
        background: url('../images/404.png') center center no-repeat;
    }
}
 
 #foodtypes{
    margin-top: 30px;
    
    .item{ 
        text-align: center;
        margin: 30px 0 0 0;
        overflow: hidden;
        width: 96%;
        padding: 2%;
        .icon{display: block; margin: 0 auto;}
        ul{
            li{
                float: left; 
                padding: 0 3%;
                a{
                    border-bottom: 1px dotted @orange;
                }
            
            }
        }
    }
}    
#national{.national{
      li{width: 25%;}
}}

.contentblock{
    .item{
        margin-left: 3%;
        //width: 15%;
        padding: 2%;
    }
}
aside{ 
    .sideblock{
        .item{
            .thumbnail{display: inline-block;}
        margin: 20px 2% 0 0;
        width: 23%;
        &:nth-child(2n){margin: 20px 2% 0 0;}

        }
    }
}

    .social-footer{
        li{
            &:first-child {display: none;}  
            width: 50%!important;
            height:40px;
            overflow: hidden;
        }
    }
 
 }

@media only screen and  (max-width: 600px) {
#site,.content{padding: 20px 0;}
header{
.mainmenu{
    height: auto;
    ul{
        li{
            float: none;
            ul{
            width: auto;
            }
        }
    }
    .menu-right{
        position: relative;
        width: 100%;
        height: 50px;
        background-color: @orange;
        .add-recept,#sfideld{background-color: @dgrey; display: block;}
        #sfield{width: 80%}
        
    }
}
}

#foodtypes{
   
    
    .item{ 
       
        .icon{display: block; margin: 0 auto;}
        ul{
            li{
                float: none; 
                //padding: 0 3%;
                a{
                    border:none;
                }
            
            }
        }
    }
}    
.thumbnail.fullsize{width: 100%!important;}
 
.post-footer{
    a:last-child{display: none;}
} 
 
#national{
    .national{
        text-align: center;
        li{float: none; width: 70%; margin: 0 auto;
            &:nth-child(4n+4){width: 70%;}
        }
    }
}
 
.rate{}
 
 aside{ 
    .sideblock{
        .item{
            //.thumbnail{display: inline-block;}
        margin: 10px auto;
        padding: 0;
        float:left;
        //clear: both;
        width: 50%;
        max-width: 170px;
        &:nth-child(2n){margin: 10px auto; padding: 0;}

        }
    }
}
 footer{padding: 2%;}
}



.comments{
    .pre-comment{ color: @dgrey; font-size: 1em; font-weight: bold;}
    .comment{
        padding: 10px 0;
        border-bottom: 2px solid #f5f5f5;
        overflow:hidden;
        &:last-child{border: none;}
        .com-userinfo{
            width: 60px;
            
            .avatar{
                .border-radius(50px);
            }
            .comment-reply-link{font-size: 0.7em; text-decoration: none; border-bottom: 1px dotted @orange;}
        }
        .com-text{
        padding-left: 70px;
        p{font-size: 1em;}
        .author, .author .url{            
                color: @dgrey;
                font-weight: bold;
                text-decoration: none;
            
            
        }
        small{
                font-size: 0.8em;
                color: #a19e99;
            }
        }
    }
    .response{
        border-top: 2px dashed #a19e99;
        margin-top: 20px;
        &:before{content:''; display:block; width: 40px; height: 32px; margin: -16px auto 0 auto; background: url('../images/icons.png') -400px center no-repeat @lgrey;}
        textarea{min-height: 100px;}
    }
    .button{width: 100%;}
    .com-nologin{text-decoration: none; display: block; height: 100px; margin-top: 15px;}
}


                

#scroller {display:none;z-index:999; cursor: pointer; position:fixed;right:50px;bottom:0px;width:120px; height: 35px; background: url('../images/top-button.png') 0 0 no-repeat;
    &:hover{background-position: 0 -35px;}
}

.ac_results {
padding: 0;
margin: 0;
list-style: none;
position: absolute;
z-index: 10000;
display: none;
border-width: 1px;
border-style: solid;
background-color: @orange;
border-color: grey;
    li {
	padding: 2px 5px;
	white-space: nowrap;
	text-align: left;
    &:hover{background-color: @dgrey;}
}
}


.wp-customizer .ac_results {
	z-index: 500000;
}


.ac_over {
	cursor: pointer;
}

.ac_match {
	text-decoration: underline;
}


.login-body{
background: url('../images/form-bg.jpg') center center fixed no-repeat;
-moz-background-size: cover;
background-size: cover;
}

.povar-login-body {
    border-radius: 5px!important;
    position: relative;
    margin-top: 70px;
    top: 20%;
    .form-logo{
        width: 140px;
        height: 140px;
        margin: -70px auto 10px auto;
        background: url('../images/forms-logo.png') center center no-repeat;
        &.userpro-pic{position: absolute; top: 0px; left: 50%; margin-left: -70px;}
    }
    .loginform-bottom{
        padding: 20px 30px;
        border-bottom: 1px dashed #e1e1e1;
        &.reg-tip{
            padding: 10px 0!important;
            color: #a5a9af!important;
        }
    }
    .loginform-block{padding: 10px 30px;}
}

userpro-field{
    
}

.povar-field { 
    border-top: 1px dashed #e1e1e1!important;
    height: 60px!important;
    position: relative;
    .icon{ 
        background: url('../images/form-icons.png') 0 0 no-repeat;
        display: inline-block;
        width: 14px;
        height: 14px;
        position: absolute;
        top: 50%;
        margin-top: -7px;
        margin-left: 30px;
        &.key{background-position: -14px 0;}
        &.user{background-position: -28px 0;}
    }
    &.last {border-bottom: 1px dashed #e1e1e1;}
    input{
        background: none!important;
        box-shadow: none!important;
        //padding: 20px 0!important;
       
        }
        
    .userpro-warning{margin-left: 200px;}    
}

.povar-tip {position: absolute; right: 30px; top: 50%; margin-top: -6px!important;}

.social-login{
    height: 24px;
    padding: 20px 30px!important;
    max-width: 60%;
}

.loginbutton{
width: 100%!important;
padding: 10px 0!important;
margin-bottom: 10px!important;
background: #364656 !important;
color: #fff  !important;
font-weight: bold;
font-size: 0.9em!important;
display: inline-block;
}

#TB_window{position: fixed; top:50%; left:50%;}

#recipress_recipe .instructions ol li{margin-bottom: 10px;}
.warning-plate{
        padding: 10px 30px;
        margin-bottom: 20px;
        background-color: #e3a3a3;
        position:relative;
        *{color: #fff;}
        a{color: #9d1f00;}
        .warning-close{
            width: 10px;
            height: 10px;
            background: url('../images/cross.png') 0 0 no-repeat;
            display: block;
            position: absolute;
            top: 5px;
            right: 5px;
        }
    }
.povar-add{background-color: @lgrey!important;width: 100%!important; max-width: 100%!important;
    .type_select {    
        
        margin-bottom: 30px;
        
    }
    .heading{color: @dgrey!important; font-family: @font; font-size: 24px!important;}
    .recipe-add-tooltip{font-family: @font2; font-size: 12px;font-style: italic; color: #8c8a87; padding-left: 50px; background: url('../images/arrow.png') 0 center no-repeat;}
    div.button.userpro-pic-upload.ajax-file-upload { background: @orange!important;}   
    .povar-image-controls{margin-bottom: 20px;}
    .userpro-body form .userpro-field .userpro-input .recipe-title{color: #8c8a87;font-family: @font2!important;; font-style: italic; font-size: 12px!important; padding: 2%!important; margin-top: 0!important; width: 100%!important; line-height: 20px!important;}
    
   
    
    .types-table{
         td{ 
            vertical-align:middle; 
            padding: 10px;
            }
        .time_output{
            td{
                border-right: 1px solid #8c8a87;
                padding: 0px 10px;
                &:last-child{border: none;}
            }
        }
    }

    .button{padding: 7px 30px!important; margin-right: 10px!important; font-size: 14px!important; height: auto!important; line-height: inherit!important;}
}
    .table-link{text-align: center; a{text-decoration: none; border-bottom: 1px dotted @orange;}}
    #products-size .heading {font-style: italic; font-weight: bold;  text-align: center; font-size: 1.8em; padding-bottom: 20px;  margin-bottom: 20px;  background: url('../images/separator-g.png') left bottom repeat-x;}
    .products_table {
        width: 100%;
        th {font-size: 12px!important; text-transform: none!important;}
    }
    #ingredients_table,#instructions_table,.products_table{
        
        vertical-align:middle;
        margin-bottom: 10px;
        thead {background-color: @orange;}
        tr:nth-child(2n){background-color: #efd2cb;}
        th{
            
            height: 50px;
            vertical-align:middle;
            color: #fff;
            font-size: 1em;
            font-weight: bold;
            text-transform: uppercase;
            padding: 0 10px;
        }
        td{ 
            vertical-align:middle; 
            text-align: center;
            padding: 10px;
            &.inst-remove{vertical-align:top;}
            input{margin:0!important; font-size: 12px!important;}
        }
    }

.addrecipe-top{
    padding: 0 30px;
    .heading{color: @dgrey!important; font-family: @font; font-size: 24px!important;}
    p{font-size: 16px; line-height: 25px;}
}

#povar-profile{
    background-color: @lgrey;
    margin-top: 30px;
    &.contentblock{padding:0!important;}
    div.userpro {background-color: @lgrey!important; border:none!important;}
    .povar-profpic-container {height: 140px!important; padding: 0!important; margin-bottom: 35px;}
    .povar-userinfo{
        text-align: center;
        position:relative;
        //padding-bottom: 20px;
    }
    
    .profile-counters{
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
     li{
         display:inline-block; 
         padding: 5px 15px;
         font-size: 14px;
        b{font-weight: bold; color: @orange; font-size: 18px;}
     }
    }
    .profile-details{
        padding: 0 30px 30px 30px;
        .tab_content .item{margin-left: 14px;}
        article{
            padding-top: 30px;
            .thumbnail.fullsize{
                width: 100%;
                .desc{
                    width: 94%;
                    padding: 25px 3%;
                }
                img{
                    width:100%;
                    height:auto;                    
                    filter: blur(3px); -webkit-filter: blur(3px); -moz-filter: blur(3px);
                    -o-filter: blur(3px); -ms-filter: blur(3px);
                    filter: url(blur.svg#blur);
                    filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='3'); 
                }
            }
        }
    }
    
    .profile-tabs{
        width: 100%;
        font-family: @font2;
        font-weight: bold;
        text-align:center;
        background-color: @dgrey;
         li {
            //float: left;
            position: relative;
             display: inline-block; 
            height: 50px;
            line-height: 50px;
            background-color: @dgrey;
            color: #fff; 
            font-size: 14px; 
            text-transform: uppercase;
            padding: 0px 5%;
            text-decoration: none; 
             cursor: pointer;
             &:hover,.active{background-color: @orange;}
         }

    }
    .heading{color: @dgrey!important; text-align: left; font-family: @font; font-size: 24px!important;}
    .profile-content{
        float:left;
        margin-top: 30px;
        padding-right: 20px;
        width: 560px;
        .soc-icons{
            margin-bottom: 20px;
            a{font-size: 14px; margin-right: 20px;}
            .prof_icon{
                background: url('../images/soc-icons.png') 0 0 no-repeat;
                display: inline-block;
                width: 24px;
                height: 24px;
                margin-bottom:-6px;
                margin-right: 5px;
                &.twi{background-position: -24px 0px;}
                &.fb{background-position: -48px 0px;}
                &.okl{background-position: -72px 0px;}
            }
        }
        .about-user p {font-size: 1em; line-height: 1.4em;}
        .author-recipes{
            text-align: center;
            //margin-bottom: 30px;
            .item{margin-left: 0; float:none; display: inline-block;}
        }
        
    }
    .profile-aside{
        width: 300px;
        float: right;
    }
}