/*
Theme Name: Palazzo del Gusto
Theme URI: http://www.palazzodelgusto.it/
Description: 2016 Versione 1
Author: Navone Associati
Author URI: mailto:otto@navoneassociati.com
Version: 1.0
Copyright: ©2016 Navone Associati
Tags: /
*/

body,html{
    width:100%;
    height:100%;
    min-width:1000px;
    min-height:660px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:Helvetica,Arial,sans-serif;
    font-size:12px;
    background:#FFF4E0;
    color:#632A0B;
}

@media all and ( max-width: 767px ) {
  body,
  html {
    min-width: 0;
    min-height: 0;
    font-size: 14px;
    height: auto !important;
  }
}

.hidden{
    display:none!important;
}
a{
    text-decoration:none;
}
a:hover{
    text-decoration:underline;
}
#wrapper{
    min-width:1000px;
    min-height:660px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    align-items:center;
}

@media all and ( max-width: 767px ) {
  #wrapper {
    min-width: 0;
    min-height: 0;
    width: 100%;
    height: 100%;
  }
}

#card{
    width:1000px;
    height:600px;
    background:#FFF;
    box-sizing:border-box;
    padding:50px;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
}

@media all and ( max-width: 767px ) {
  #card {
    width: 100%;
    height: auto;
    padding: 16px;
  }
}

#card header{
    width:100%;
    height:40px;
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    color:#632A0B;
    padding:0 0 5px 0;
    border-bottom:1px solid #632A0B;
    flex-shrink:0;
}
#card header a{
    color:#632a0b;
}
#card header a:hover{
    text-decoration:none;
}
#card header #logo{
    font-size:40px;
}

@media all and ( max-width: 767px ) {
  #card header {
    height: 30px;
  }

  #card header #logo {
    font-size: 30px;
  }
}


#card header nav ul{
    display:flex;
    text-transform:lowercase;
}
#card header nav li a,
#main-nav li a{
    padding:0 6px;
    height:13px;
    display:flex;
    justify-content:center;
    align-items:center;
    float:left;
}
#card header nav li a:hover,
#main-nav ul a:hover{
    color:#FFF;
    background:#c1193c;
}
#card header nav li::after,
#main-nav ul li::after{
    content:'|';
    display:inline-block;
    margin:0 5px;
    font-size:15px;
}

@media all and ( max-width: 767px ) {
  #card header nav li::after,
  #main-nav ul li::after {
    content: "";
    display: none;
  }

  #card header nav li a,
  #main-nav li a {
    padding: 0;
  }

  #card header nav li {
    padding-left: 8px;
  }

  #card header nav li:first-child {
    padding-left: 0;
  }
}

#card header nav li:last-child::after{
    display:none;
}
#main-nav ul{
    height:17px;
    width:100%;
    margin:5px 0;
    display:flex;
    align-items:center;
    background:#632A0B;
    color:#FFF;
    font-weight:bold;
    text-transform:lowercase;
    box-sizing:border-box;
    padding:0 5px;
}

@media all and ( max-width: 767px ) {
  #main-nav ul {
    height: 20px;
    justify-content: space-around;
  }
}

#main-nav ul a{
    color:#FFF;
    height:15px;
}
#main-nav ul a:hover{
    text-decoration:none;
}
#main-nav ul li::after{
    font-weight:normal;
}
#main-nav ul li.current a{
    color:#CCC4C0;
}
#main{
    height:386px;
    background-size:cover;
    display:flex;
}
#main.home .content{
    height:33.33%;
    display:flex;
    align-items:flex-end;
    width:71.5%;
    box-sizing:border-box;
    padding:0 0 0 37px;
    font-family:"Times New Roman",Times,serif;
    font-size:18px;
    line-height:14px;
    flex-shrink:0;
}

@media all and ( max-width: 767px ) {
  #main.home .content {
    width: 69%;
    padding: 16px;
    font-size: inherit;
    line-height: 1.2;
    display: flex;
    justify-content: center;
    flex-direction: column;
  }
}

#main.home .content p:first-line {
    line-height:28px;
}

@media all and ( max-width: 767px ) {
  #main.home .content p:first-line {
    line-height: inherit;
  }
}

#main.home .link-aside{
    width:68.7%;
    height:66.67%;
    display:flex;
    justify-content:center;
    align-items:center;
}
#main.home .link-aside a{
    display:block;
    width:50%;
    height:50%;
}

#main.home .link-aside img{
    width:100%;
    height:100%;
}
#main.category,
#main.single{
    flex-wrap:wrap;
}
#main.category a,
#main.category span.empty,
#main.single a.matrix,
#main.single span.empty{
    display:block;
    width:14.285%;
    height:33.333%;
}
#main.single{
    position:relative;
}
#main.single .caption{
    height:100%;
    width:14.285%;
    position:absolute;
    right:14.285%;
    top:0;
    box-sizing:border-box;
    padding:87px 9px 9px 9px;
    font-size:9px;
}
#main.single .caption.empty{
    width:100%;
    right:0!important;
    padding:0;
    display:flex;
    justify-content:center;
    align-items:center;
}
#main.single .caption .pdg-coming-soon{
    font-size:20px;
    width:105px;
    color:#C1193C;
}
#main.single.territorio .caption{
    right:28.57%;
}
#main.single.territorio .caption a{
    font-weight:bold;
    color:#000;
}
#main.single.uomini .caption,
#main.single.racconti .caption{
    left:14.285%;
    right:initial;
}
#main.single .caption b,
#main.single .caption strong{
    text-transform:uppercase;
    color:#C1193C;
    margin-bottom:5px;
    display:block;
    line-height:10px;
}
#main.istituzionale .images,
#main.istituzionale .column-right{
    width:14.285%;
    background-size:cover;
    flex-shrink:0;
}
#main.istituzionale .column-left,
#main.istituzionale .column-center,
#main.istituzionale .column-right{
    font-size:9px;
    line-height:12px;
    box-sizing:border-box;
    padding:40px 20px 0px 20px;
    flex-shrink:0;
}
#main.istituzionale .column-left{
    width:28.57%;
}
#main.istituzionale .column-center{
    width:42.86%;
    width:calc(42.86% - 5px);
    height:100%;
    margin-right:5px;
    border-left:1px solid #C1193C;
    border-right:1px solid #C1193C;
}
#main.istituzionale .column-center.map-container{
    display:flex;
    flex-direction:column;
    height:100%;
}

#gmap_canvas{
    height:100%;
    width:100%;
    margin:25px 0 15px 0;
}
.gm-style .gm-style-iw{
    font-size:9px!important;
    color:#464648!important;
}
#main.istituzionale .column-right{
    padding-right:0;
    padding-left:15px;
}
#main.istituzionale h1,
#main.istituzionale h2{
    color:#C1193C;
    font-weight:bold;
}
#main.istituzionale h1{
    text-transform:uppercase;
    margin-bottom:25px;
}
#main.istituzionale a{
    color:#000;
}
#main.istituzionale li{
    list-style-type:disc;
    margin-left:25px;
}
#main.crova .column-left{
    line-height:10px;
    padding:15px 15px 0 15px;
}
#main.crova .column-center{
    padding-top:0;
}
#main.crova .column-right{
    background-size:cover;
    background-position:center right;
}
#main.crova img{
    width:100%;
}
#main.crova h1{
    margin:10px 0;
}
#main.blog #post-list{
    width:71.425%;
    box-sizing:border-box;
    height:100%;
    margin:0;
    padding:0 25px 0 0;
    overflow-y:scroll;
}
#post-list h1{
    box-sizing:border-box;
    padding:0 0 0 20%;
    margin:60px 0;
    font-size:13px;
    line-height:16px;
    color:#C1193C;
}
#post-list div{
    display:inline-block;
    width:79%;
    vertical-align:top;
    line-height:15px;
}
#post-list div.date{
    width:19.5%;
    font-size:9px;
    text-transform:uppercase;
    text-align:center;
}
#post-list li:last-child{
    margin-bottom:30px;
}
#card footer{
    height:35px;
    flex-shrink:0;
    display:flex;
    justify-content:space-between;
    align-items:center;
    border-top:1px solid #632A0B;
    margin:5px 0 0 0;
}
#card footer nav:first-child{
    width:100%;
}
#bottom-nav{
    display:flex;
    text-transform:lowercase;
    font-size:9px;
    color:#C1193C;
    width:74%;
    flex-wrap:wrap;
    line-height:12px;
}
#bottom-nav.caps{
    text-transform:capitalize;
}
#bottom-nav a{
    color:#C1193C;
}
#bottom-nav li.current a{
    font-weight:bold;
}
#bottom-nav li::after{
    content:'|';
    display:block;
    float:right;
    margin:0 7px;
}

@media all and ( max-width: 767px ) {
  #bottom-nav li::after {
    content: "";
    display: none;
  }
}

#bottom-nav li:last-child::after{
    display:none;
}
#social li{
    width:18px;
    height:18px;
    background-size:18px 18px;
    background-repeat:no-repeat;
    background-position:center;
}
#social li a{
    display:block;
    width:100%;
    height:100%;
}
#social li.facebook{
    background:url(img/facebook.png);
    background:url(img/facebook.svg),linear-gradient(transparent,transparent);
}
footer#bottom{
    text-align:center;
    font-size:11px;
    line-height:14px;
    color:#70706f;
}
footer#bottom a{
    color:#70706f;
}

@media all and ( max-width: 767px ) {
  footer#bottom {
    box-sizing: border-box;
    padding: 16px;
  }
}

@media all and ( max-width: 767px ) {
  body,
  html {
    display: block;
  }

  #main.istituzionale {
    flex-direction: column;
    height: auto;
  }

  #main.istituzionale > div {
    width: 100% !important;
    padding: 16px 0 16px !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    border: 0 !important;
  }

  #main.istituzionale > div.images {
    display: none;
  }

  #main.single {
    position: static;
    background-image: none !important;
    height: auto;
  }

  #main.single .caption {
    position: static;
    width: 100%;
    padding: 16px 0 !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    align-self: flex-start !important;
    height: auto !important;
  }

  #card footer {
    height: auto;
    align-items: flex-start;
  }

  #card footer nav ul {
    padding-top: 16px;
    font-size: 14px;
    line-height: 1.2;
  }

  #card footer nav:not(#social) ul > li {
    padding-right: 8px;
  }

  #main.single .caption b,
  #main.single .caption strong {
    line-height: 1 !important;
  }

  #main.blog {
    height: auto;
  }

  #main.blog #post-list {
    width: 100%;
    padding: 16px 0 !important;
    height: auto;
  }

  #post-list h1 {
    margin: 32px 0 24px;
    padding: 0 16px 0 16px;
  }

  #post-list div {
    display: block;
    padding: 0 16px 0 16px;
    width: 100% !important;
    box-sizing: border-box;
  }

  #post-list div.date {
    text-align: left;
    font-size: 12px;
    margin-bottom: 12px;
  }

  #main.home,
  #main.category {
    position: relative;
    padding-top: 100%;
    height: auto !important;
  }

  #main.home > * {
    position: absolute;
  }

  #main.home > .content {
    top: 0; left: 0;
    width: 66.6666%;
    height: 33.33333%;
  }

  #main.home > .link-aside {
    top: 0; right: 0;
    width: 33.333333%;
    height: 33.3333%;
  }

  #main.home > .link-aside > a {
    height: 100% !important;
    width: 100% !important;
  }

  #main.category > * {
    display: none !important;
  }

  #wrapper {
    min-height: 100vh;
  }
}