/*************************************************************************

C S S    H A N D C R A F T E D    B Y    M A M O K A        www.mamoka.com

..........................................................................
..........................................................................
..........................................................................
..........................................................................
..........................................................................

**************************************************************************

CODERS

Davide Cantelli d.cantelli@mamoka.com
Sacha Alexandre Bourdeaud'Hui a.bourdeaudhui@mamoka.com

*************************************************************************/

html {
    margin: 0 auto;
    border: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    min-height: 100%;
    font: normal 62.5%/1 'Signika', 'Trebuchet MS', Arial, Helvetica, sans-serif;
    -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
}
body {
    position: relative;
    top: 0;
    margin: 0;
    border: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    color: #888;
    background: #F4F4F4;
    -webkit-transition: top 0.5s;
    -moz-transition: top 0.5s;
    transition: top 0.5s;
}
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}
img {
    border: none;
}
/**************************************************************************

HEADER

*************************************************************************/

header {
    position: fixed;
    top: 0;
    z-index: 100;
    width: 100%;
    height: 50px;
    background: #00bfa5;
    -webkit-transform: translateZ(0); //fix rendering on chrome
}
header p {
    position: absolute;
    left: 50%;
    margin: 0;
    margin-left: -500px;
    height: 100%;
    overflow: hidden;
}
header p img {
    float: left;
    margin: 10px 10px 10px 0;
    height: 30px;
}
header p a {
    display: block;
    position: relative;
    height: 100%;
    font-size: 1.3em;
    color: #fff;
    line-height: 50px;
    text-decoration: none;
    text-transform: uppercase;
    overflow: hidden;
    -webkit-transition: margin 0.3s;
    -moz-transition: margin 0.3s;
    -ms-transition: margin 0.3s;
    -o-transition: margin 0.3s;
    transition: margin 0.3s;
}
header p a strong {
    position: absolute;
    top: -100px;
}
header p a.moveUp:first-child {
    margin-top: -50px;
}
header nav {
    position: absolute;
    right: 50%;
    margin-right: -500px;
}
header nav ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
header nav ul li {
    float: left;
    padding: 0 0 0 15px;
}
header nav ul li:not(:last-child):after {
    content: "/";
    float: right;
    margin-left: 15px;
    font-size: 1.4em;
    color: #fff;
    line-height: 50px;
}
header nav ul li a:not(.fa) {
    display: inline-block;
    position: relative;
    font-size: 1.4em;
    color: #fff;
    line-height: 50px;
    text-decoration: none;
    text-transform: uppercase;
    overflow: hidden;
}
header nav ul li a:not(.fa):after {
    content: "";
    position: absolute;
    top: 35px;
    left: -100%;
    width: 100%;
    height: 2px;
    background: #fff;
    -webkit-transition: left 0.3s;
    -moz-transition: left 0.3s;
    -ms-transition: left 0.3s;
    -o-transition: left 0.3s;
    transition: left 0.3s;
}
header nav ul li a:not(.fa):hover:after {
    left: 0;
}
header nav ul li.search {
    position: relative;
}
header nav ul li.search > a {
    font-size: 1.4em;
    color: #fff;
    line-height: 50px;
    text-decoration: none;
    text-transform: uppercase;
}
header nav ul li.search form {
    position: absolute;
    top: 50px;
    right: -20px;
    margin: 0;
    padding: 0;
    width: 200px;
    height: 30px;
    background: #00bfa5;
    overflow: hidden;
    opacity: 0;
    -webkit-transition: right 0.3s, opacity 0.3s;
    -moz-transition: right 0.3s, opacity 0.3s;
    -ms-transition: right 0.3s, opacity 0.3s;
    -o-transition: right 0.3s, opacity 0.3s;
    transition: right 0.3s, opacity 0.3s;
}
header nav ul li.search input[type="text"] {
    float: left;
    border: 2px solid #fff;
    border-radius: 0;
    width: 150px;
    height: 30px;
    padding: 0 10px;
    font-size: 1.3em;
    color: #fff;
    background: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
}
header nav ul li.search input[type="submit"] {
    float: left;
    padding: 0;
    height: 30px;
    width: 50px;
    border: 2px solid #fff;
    border-left: none;
    font-size: 1.3em;
    color: #fff;
    line-height: 26px;
    text-align: center;
    background: transparent;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
}
header nav ul li.search input[type="submit"]:hover {
    background: #fff;
    color: #00bfa5;
}
header nav ul li.search.open form {
    right: 0;
    opacity: 1;
}
header a.burgerIcon {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    height: 50px;
    width: 40px;
    cursor: pointer;
}
header a.burgerIcon div {
    position: absolute;
    top: 50%;
    right: 0px;
    margin: -1px 0 0 0;
    border-radius: 2px;
    width: 40px;
    height: 5px;
    background: #fff;
    opacity: 1;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
header a.burgerIcon div:before,
header a.burgerIcon div:after {
    content: "";
    position: absolute;
    border-radius: 2px;
    width: 40px;
    height: 5px;
    background: #fff;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
header a.burgerIcon div:before {
    top: -10px;
}
header a.burgerIcon div:after {
    top: 10px;
}
header .burgerOverlay {
    position: fixed;
    display: none;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 150;
    background: #000;
    background: rgba(0, 0, 0, 0.7);
}
@media only screen and (max-width: 1040px) {
    header p {
        left: 0;
        margin-left: 20px;
    }
    header nav {
        right: 0;
        margin-right: 20px;
    }
}
@media only screen and (max-width: 960px) {
    header nav {
        left: 0;
        right: 0;
        margin-right: 20px;
    }
    header nav ul {
        position: fixed;
        top: 0;
        right: -300px;
        z-index: 170;
        margin: 0;
        padding-top: 50px;
        width: 300px;
        /*height: 100%;*/
        background: #fff;
        overflow: scroll;
        -webkit-transition: right 0.3s;
        -moz-transition: right 0.3s;
        -ms-transition: right 0.3s;
        -o-transition: right 0.3s;
        transition: right 0.3s;
    }
    header nav ul li {
        margin: 0;
        padding: 0 30px;
        width: 100%;
    }
    header nav ul li:before,
    header nav ul li:after {
        display: none;
    }
    header nav ul li a:not(.fa) {
        display: block;
        font-size: 1.4em;
        color: #000;
        line-height: 50px;
    }
    header nav ul li a:not(.fa):before,
    header nav ul li a:not(.fa):after {
        display: none;
    }
    header nav ul li.search form {
        position: relative;
        top: 0;
        height: 0;
        margin-bottom: 20px;
        width: 100%;
        background: transparent;
        -webkit-transition: right 0.3s, opacity 0.3s, height 0.3s;
        -moz-transition: right 0.3s, opacity 0.3s, height 0.3s;
        -ms-transition: right 0.3s, opacity 0.3s, height 0.3s;
        -o-transition: right 0.3s, opacity 0.3s, height 0.3s;
        transition: right 0.3s, opacity 0.3s, height 0.3s;
    }
    header nav ul li.search form input[type="text"] {
        width: calc(100% - 50px);
        border-color: #00bfa5;
        background: #fff;
        color: #00bfa5;
    }
    header nav ul li.search form a.button {
        border-color: #00bfa5;
        background: #fff;
        color: #00bfa5;
    }
    header nav ul li.search.open form {
        height: 30px;
    }
    header nav a.burgerIcon {
        display: block;
        z-index: 200;
    }
    .active ul {
        right: 0;
    }
    .active a.burgerIcon div {
        background: rgba(255, 255, 255, 0);
    }
    .active a.burgerIcon div:before,
    .active a.burgerIcon div:after {
        background: #00bfa5;
    }
    .active a.burgerIcon div:before {
        top: 0px;
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
    .active a.burgerIcon div:after {
        top: 0px;
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg);
    }
    .burgerOverlay.active {
        display: block;
    }
}
/**************************************************************************

SLIDER

*************************************************************************/

ul.slider {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
    z-index: -1;
}
ul.slider div {
    position: relative;
    width: 100%;
    height: 100%;
}
ul.slider li {
    z-index: 1 !important;
    width: 100%;
    height: 100%;
    background: url('') 50% 50% no-repeat #F4F4F4;
    background-size: cover;
    background-attachment: fixed;
}
ul.slider li .overlay {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2);
}
/**************************************************************************

CONTENT

*************************************************************************/

.container {
    margin: 0px auto 0;
    padding-top: 50px;
    padding-bottom: 100px;
    width: 100%;
    min-height: 100%;
    -webkit-perspective: 5000px;
    -moz-perspective: 5000px;
    -ms-perspective: 5000px;
    -o-perspective: 5000px;
    perspective: 5000px;
    -webkit-overflow-scrolling: touch;
}
.container h1 {
    clear: both;
    margin: 10px 0px 15px;
    padding: 30px;
    font-size: 2em;
    font-weight: 300;
    color: #fff;
    background: #00bfa5;
}
.container h2 {
    clear: both;
    margin: 15px 0px;
    padding: 30px;
    font-size: 2em;
    font-weight: 300;
    color: #00bfa5;
    border-left: 10px solid #00bfa5;
}
.container h3 {
    clear: both;
    margin: 20px 30px;
    font-size: 1.8em;
    font-weight: 300;
    color: #00bfa5;
}
.container p {
    margin: 30px 30px;
    font-size: 1.5em;
    line-height: 1.5em;
}
.container a {
    color: inherit;
    text-decoration: none;
}
.container p a {
    text-decoration: underline;
}
.container p a:hover {
    color: #00bfa5;
}
.container ul,
.container ol {
    position: relative;
    margin: 30px 30px 30px 50px;
    padding: 0 0 0 20px;
    list-style: none;
}
.container ul ul,
.container ol ol {
    margin: 0 inherit;
}
.container ul li,
.container ol li {
    font-size: 1.5em;
    line-height: 1.5em;
}
.container ul li:before,
.container ol li:before {
    content: "• ";
position: absolute;
    left: 0px;
    color: #00bfa5;
}


.container .noPfix {
   margin: 30px 30px;
   font-size: 1.5em;
   line-height: 1.5em;
}
.container .noPfix h2{
   margin: 15px -30px;
   font-size: 1.333em;
   font-weight: 300;
}
.container .noPfix h3{
    margin: 20px 0px;
    font-size: 1.2em;
}
.container .noPfix p {
    margin: 30px 0px;
    font-size: 1em;
}
.container .noPfix a {
    text-decoration: underline;
}
.container .noPfix a:hover {
    color: #00bfa5;
}
.container .noPfix ul,
.container .noPfix ol {
    margin: 30px 0px 30px 20px;
}
.container .noPfix ul ul,
.container .noPfix ol ol {
    margin: 0 inherit;
}
.container .noPfix ul li,
.container .noPfix ol li {
    font-size: 1em;
}
.container p.roundpic img {
    float: right;
    margin: 0 0 30px 30px;
    width: 150px;
    height: auto;
    border-radius: 150px;
    background-clip: padding-box;
    box-shadow: 0 3px 8px #c0c0c0;
    /*
               +strong{ padding-left: 180px; }
               +strong+em{ padding-left: 180px; }
               +strong+em+p{ padding-left: 180px; }
               */
}
.icon-element{ 
   display: block;
   padding: 5px 0;
   border-bottom: 1px solid #e0e0e0;
}
.icon-element i {
      display: inline-block;
      margin-right: 10px;
      width: 20px;
      line-height: 1.6em;         
}


.container .smallGrid {
    margin: 0 auto;
    padding: 0 15px;
    width: 100%;
    max-width: 730px;
}
.container .mediumGrid {
    margin: 0 auto;
    padding: 0 15px;
    width: 100%;
    max-width: 1030px;
}
.container .smallGrid:before,
.container .smallGrid:after,
.container .mediumGrid:before,
.container .mediumGrid:after {
    content: "";
    display: table;
}
.container .smallGrid:after,
.container .mediumGrid:after {
    clear: both;
}
.container .smallGrid .col1,
.container .mediumGrid .col1,
.container .smallGrid .col2,
.container .mediumGrid .col2 {
    display: inline-block;
    vertical-align: top;
    width: 49%;
}
.container .whiteBox {
    margin: 0px auto 30px;
    border-radius: 2px;
    background: #fff;
    -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    overflow: auto;
}
.container section {
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
}
.container section.header {
    margin: 0 0 30px;
    padding: 50px 0 30px;
    background: rgba(0, 0, 0, 0.7);
    box-shadow: none;
    -webkit-box-shadow: none;
    overflow: auto;
}
.container section.header .title:not(h1) {
    display: block;
    margin: 0 0 0 30%;
    padding: 0;
    max-width: 700px;
    font-size: 4em;
    color: #00bfa5;
    font-weight: 300;
    background: none;
}
.container section.header .mediumGrid .title:not(h1) {
    margin: 0 0 0 20px;
    padding: 0 0 0 28%;
}
.container section.header h1.title {
    display: block;
    margin: 0;
    padding: 0;
    max-width: 700px;
    font-size: 4em;
    color: #00bfa5;
    font-weight: 300;
    background: none;
}
.container section.header p {
    margin: 20px 0px;
    font-size: 1.5em;
    color: #fff;
    line-height: 1.5em;
}
.container section.header .logo {
    float: left;
    margin-right: 2%;
    border-left: 5px solid #00bfa5;
    padding: 0 30px;
    width: 28%;
    font-size: 2em;
    color: #fff;
    text-transform: uppercase;
    -webkit-transition: margin 0.3s;
    -moz-transition: margin 0.3s;
    -ms-transition: margin 0.3s;
    -o-transition: margin 0.3s;
    transition: padding 0.3s;
}
.container section.header .logo:hover {
    padding: 0 20px 0 40px;
}
.container section.page {
    padding-bottom: 20px;
    background: transparent;
}
.container section.page .breadcrumbs {
    margin: 10px 30px 0;
    font-size: 1.3em;
}
.container section.page .breadcrumbs a:hover {
    text-decoration: underline;
}
.container section.page .content {
    float: left;
    border-radius: 2px;
    background: #fff;
}
.container section.page.smallGrid .content {
    width: 100%;
}
.container section.page.mediumGrid .content {
    width: 70%;
}
.container section.page aside {
    float: left;
    border-radius: 2px;
    width: 28%;
    margin-right: 2%;
    background: #fff;
    overflow: hidden;
}
.container section.page aside .search input {
    margin: 0px;
    padding: 20px;
    border: none;
    border-bottom: 3px solid #00bfa5;
    width: 100%;
    font-size: 1.6em;
    font-weight: 400;
    color: #00bfa5;
    background: transparent;
    outline: none;
    -webkit-transition: padding 0.2s;
    -moz-transition: padding 0.2s;
    -ms-transition: padding 0.2s;
    -o-transition: padding 0.2s;
    transition: padding 0.2s;
}
.container section.page aside .search input:focus {
    padding: 20px 25px;
}
.container section.page aside nav {
    clear: both;
    width: 100%;
    -webkit-transition: margin 0.3s;
    -moz-transition: margin 0.3s;
    -ms-transition: margin 0.3s;
    -o-transition: margin 0.3s;
    transition: margin 0.3s;
}
.container section.page aside nav a.controller {
    display: none;
    position: relative;
    padding: 15px 40px 15px 30px;
    width: 100%;
    font-size: 1.4em;
    font-weight: 700;
    color: #5c5c5c;
    line-height: 1.4em;
    cursor: pointer;
}
.container section.page aside nav a.controller i {
    float: right;
    -webkit-transition: transform 0.3s;
    -moz-transition: transform 0.3s;
    -ms-transition: transform 0.3s;
    -o-transition: transform 0.3s;
    transition: transform 0.3s;
}
.container section.page aside nav a.controller.active {
    border-bottom: 1px solid #ddd;
}
.container section.page aside nav a.controller.active i {
    -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    -o-transform: rotate(-180deg);
    transform: rotate(-180deg);
}
.container section.page aside nav ul {
    clear: left;
    float: left;
    margin: 0;
    padding: 0;
    width: 100%;
    list-style: none;
}
.container section.page aside nav ul li {
    clear: left;
    float: left;
    position: relative;
    width: 100%;
    font-size: 1em;
    line-height: 1em;
}
.container section.page aside nav ul li:before {
    content: none;
}
.container section.page aside nav ul li a {
    display: block;
    padding: 15px 40px 15px 30px;
    font-size: 1.4em;
    font-weight: 700;
    color: #5c5c5c;
    line-height: 1.4em;
    -webkit-transition: padding 0.2s;
    -moz-transition: padding 0.2s;
    -ms-transition: padding 0.2s;
    -o-transition: padding 0.2s;
    transition: padding 0.2s;
}
.container section.page aside nav ul li a:hover {
    background: #00bfa5;
    color: #fff;
    padding: 15px 30px 15px 40px;
}
.container section.page aside nav ul li a:hover span {
    color: #fff !important;
}
.container section.page aside nav ul li a.selected {
    background: #00bfa5;
    color: #fff;
}
.container section.page aside nav ul li.goBack a {
   font-size: 1.6em;
   color: #00bfa5;
}
.container section.page aside nav ul li.goBack a:hover {
   color: #fff;
}

.container section.page aside nav ul > li > ul > li {
    background: #E8E8E8;
}
.container section.page aside nav ul > li > ul > li a {
    padding: 15px 40px 15px 50px;
    font-weight: 400;
    color: #888;
}
.container section.page aside nav ul > li > ul > li a:hover {
    padding: 15px 30px 15px 60px;
}
.container section.page aside nav > ul {
    margin: 15px 0;
}
.container .searchForm {
    position: relative;
    margin-top: 0;
}
.container .searchForm.focused {
    padding: 5px 0;
    max-width: 720px;
}
.container .searchForm div.nome {
    float: left;
    position: relative;
    width: 60%;
}
.container .searchForm div.categoria {
    float: left;
    position: relative;
    border-left: 1px solid #d4d4d4;
    width: 40%;
}
.container .searchForm label {
    float: left;
    margin: 0px;
    padding: 10px 20px;
    font-size: 1.4em;
    font-weight: 400;
    color: #00bfa5;
    background-clip: padding-box;
}
.container .searchForm input {
    float: left;
    margin: 0px;
    padding: 20px 30px 20px;
    border: none;
    border-top: 1px solid #e0e0e0;
    background-clip: padding-box;
    width: 100%;
    height: 62px;
    font-size: 1.8em;
    font-weight: 400;
    color: #00bfa5;
    background: transparent;
    outline: none;
    -webkit-transition: padding 0.2s;
    -moz-transition: padding 0.2s;
    -ms-transition: padding 0.2s;
    -o-transition: padding 0.2s;
    transition: padding 0.2s;
}
.container .searchForm input:-webkit-autofill,
.container .searchForm textarea:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px #fff inset;
    -webkit-text-fill-color: inherit;
}
.container .searchForm select {
    position: relative;
    z-index: 10;
    margin: 0;
    padding: 20px 30px 20px;
    border: none;
    background-clip: padding-box;
    width: 100%;
    height: 62px;
    font-size: 1.4em;
    line-height: 1.5em;
    color: #888;
    outline: none;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
    opacity: 0;
}
.container .searchForm select:hover + span {
    color: #00bfa5;
}
.container .searchForm select + span {
    position: absolute;
    right: 0;
    top: 34px;
    z-index: 9;
    margin: 0;
    padding: 20px 30px 20px;
    border: none;
    border-top: 1px solid #e0e0e0;
    background-clip: padding-box;
    width: 100%;
    height: 62px;
    font-size: 1.4em;
    line-height: 1.5em;
    color: #888;
    outline: none;
    cursor: pointer;
    -webkit-transition: margin 0.2s;
    -moz-transition: margin 0.2s;
    -ms-transition: margin 0.2s;
    -o-transition: margin 0.2s;
    transition: margin 0.2s;
}
.container .searchForm select + span:before {
    content: "\f0d7";
    font-family: "FontAwesome";
    position: absolute;
    right: 30px;
    top: 20px;
    opacity: 1;
    -webkit-transition: opacity 0.2s, top 0.2s;
    -moz-transition: opacity 0.2s, top 0.2s;
    -ms-transition: opacity 0.2s, top 0.2s;
    -o-transition: opacity 0.2s, top 0.2s;
    transition: opacity 0.2s, top 0.2s;
}
.container .card {
    position: relative;
    background: transparent;
    overflow: visible;
    -webkit-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transition: -webkit-transform 1s, height 1s;
    -ms-transition: -moz-transform 1s, height 1s;
    transition: transform 1s, height 1s;
}
.container .card.flipped {
    -webkit-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    transform: rotateY(180deg);
}
.container .card .front,
.container .card .back {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    padding: 0px;
    width: 100%;
    height: 100%;
    background: #fff;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translateZ(0);
    -webkit-transform: translate3d(0, 0, 0);
}
.container .card .back {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
}
.container .card .goBack {
    margin: 30px;
    width: 40px;
    height: 40px;
    border-radius: 50px;
    background-clip: padding-box;
    background: transparent;
    font-size: 2em;
    color: #00bfa5;
    line-height: 40px;
    text-align: center;
    cursor: pointer;
    -webkit-transition: background 0.3s;
    -moz-transition: background 0.3s;
    -ms-transition: background 0.3s;
    -o-transition: background 0.3s;
    transition: background 0.3s;
}
.container .card .goBack:hover {
    background: #ddd;
}
.container .card .content {
    width: 100%;
    height: 100%;
    overflow-y: hidden;
}
.container .card .latestUpdate article,
.container .page .content article.event {
    clear: both;
    padding: 15px 30px;
    -webkit-transition: background 0.3s;
    -moz-transition: background 0.3s;
    -ms-transition: background 0.3s;
    -o-transition: background 0.3s;
    transition: background 0.3s;
}
.container .card .latestUpdate article:hover,
.container .page .content article.event:hover {
    background: #ececec;
}
.container .card .latestUpdate article strong,
.container .page .content article.event strong {
    display: block;
    margin: 0 0 10px;
    border-bottom: 1px solid #e0e0e0;
    padding: 15px 0;
    font-size: 1.6em;
    text-transform: uppercase;
    -webkit-transition: color 0.5s;
    -moz-transition: color 0.5s;
    -ms-transition: color 0.5s;
    -o-transition: color 0.5s;
    transition: color 0.5s;
}
.container .card .latestUpdate article:hover strong,
.container .page .content article.event:hover strong {
    color: #303030;
}
.container .card .latestUpdate article em,
.container .page .content article.event em {
    display: inline-block;
    margin: 0;
    font-size: 1.4em;
    font-style: normal;
}
.container .card .latestUpdate article em:before,
.container .page .content article.event em:before {
    margin-right: 10px;
    font-family: "FontAwesome";
}
.container .card .latestUpdate article em.data:before,
.container .page .content article.event em.data:before {
    content: "\f017";
}
.container .card .latestUpdate article em.luogo:before,
.container .page .content article.event em.luogo:before {
    content: "\f041";
}
.container .card .latestUpdate article.news em.data {
    display: none;
}
.container .card .latestUpdate article.news em.luogo {
    display: none;
}
.container .card .latestUpdate article em.categoria,
.container .page .content article.event em.categoria {
    margin-left: 10px;
}
.container .card .latestUpdate article em.luogo,
.container .page .content article.event em.luogo {
   display: block;
   margin-top: 5px;
}
.container .card .latestUpdate article em.categoria:before,
.container .page .content article.event em.categoria:before {
    content: "\f02b";
}
.container .card .latestUpdate article p,
.container .page .content article.event p {
    display: block;
    margin: 10px 0;
    font-size: 1.5em;
    line-height: 1.5em;
}
.container .card .latestUpdate article p.autore,
.container .page .content article.event p.autore {
    display: block;
    margin: 10px 0 20px;
    font-size: 1.2em;
    line-height: 1.4em;
}
.container .card .latestUpdate article p.tags,
.container .page .content article.event p.tags {
    display: block;
    margin: 10px 0;
    font-size: 1.2em;
    line-height: 1.4em;
}
.container .card .latestUpdate article img,
.container .page .content article.event img {
    float: right;
    margin: 0 0 30px 30px;
    width: 100px;
    height: auto;
    border-radius: 100px;
    background-clip: padding-box;
    box-shadow: 0 3px 8px #c0c0c0;
    /*
               +strong{ padding-left: 180px; }
               +strong+em{ padding-left: 180px; }
               +strong+em+p{ padding-left: 180px; }
               */
}
.container .card .latestUpdate article.news {
    padding: 10px 30px;
    /*min-height: 150px;*/
}
.container .card .latestUpdate article.news a {
    color: inherit;
    text-decoration: none;
}
.container .card .latestUpdate article.news em {
    float: right;
}
.container .card .latestUpdate article.news strong {
    padding: 5px 0;
}
.container .card .latestUpdate article.news p {
    margin: 5px 0;
}
.container .card .latestUpdate article.news img {
    clear: right;
    width: 100px; margin-top: 10px;
}
.container .card .latestUpdate .archiveButton {
    float: right;
    margin: 30px 0;
    border-top: 1px solid #00bfa5;
    padding: 15px 30px;
    font-size: 1.6em;
    color: inherit;
    text-decoration: none;
    text-transform: uppercase;
    -webkit-transition: padding 0.2s;
    -moz-transition: padding 0.2s;
    -ms-transition: padding 0.2s;
    -o-transition: padding 0.2s;
    transition: padding 0.2s;
}
.container .card .latestUpdate .archiveButton:before {
    content: "\f178";
    font-family: "FontAwesome";
    padding-right: 10px;
    width: 0;
}
.container .card .latestUpdate .archiveButton:hover {
    padding: 15px 25px 15px 35px;
}
.container .card .results ul#list {
    padding: 0 0px 30px;
    margin: 0;
    list-style: none;
}
.container .card .results ul li.resultListElement {
    padding: 15px 45px;
    font-size: 1em;
    color: #4a4a4a;
    cursor: pointer;
    -webkit-transition: background 0.3s;
    -moz-transition: background 0.3s;
    -ms-transition: background 0.3s;
    -o-transition: background 0.3s;
    transition: background 0.3s;
}
.container .card .results ul li.resultListElement:hover {
    background: #ececec;
}
.container .card .results ul li.resultListElement:before {
    content: none;
}
.container .card .results ul li .expandable {
    display: none;
    overflow: hidden;
}
.container .card .results ul li.resultListElement strong {
    display: block;
    margin: 0;
    padding: 15px 0;
    font-size: 1.6em;
}

.container .card .results ul li.resultListElement em, .container .card .results ul li.resultListElement div.aree {
    display: block;
    margin: 0px 0;
    font-size: 1.3em;
    font-style: normal;
}
.container .card .results ul li.resultListElement img {
   float: left !important;
   margin-right: 20px !important;
   margin-bottom: 20px !important;
   max-width: 150px;
   max-height: 100px;
}
.container .card .results ul.tareas{
   margin: 0;
   padding: 0;
   list-style: none;
}
.container .card .results ul.tareas > li {
   margin: 0 0 1px 0;
   padding: 0 5px 0 0;
   border-right: 1px solid #999;
   display: inline-block;
   font-size: 1em;
   font-weight: normal;
}
.container .card .results ul.tareas > li:before {
   content: none;
}

.container .card .results ul.tareas:before {
    content: '\f097';
    font-family: "FontAwesome";
    margin-right: 10px;
}
.container .card .results ul li.resultListElement p {
    display: block;
    margin: 30px 0;
    font-size: 1.3em;
    line-height: 1.3em;
}
.container .card .results ul li.resultListElement a {
    display: block;
    font-size: 1.3em;
    color: #00bfa5;
    line-height: 1.3em;
}
.container .card .results ul li.resultListElement a strong {
    font-size: 1.2em;
    color: #4a4a4a;
}
.container .card .results ul li.resultListElement a:hover strong {
   color: #00bfa5;
}
.container .card .results ul li.resultListElement p a { font-size: 1em; }
.container .card .results ul li.resultListElement a:hover {
    text-decoration: underline;
}
@media only screen and (max-width: 760px) {
    .container section.page aside {
        width: 100%;
    }
    .container section.page aside nav > ul {
        display: none;
    }
    .container section.page aside nav a.controller {
        display: block;
    }
    .container section.page.mediumGrid .content {
        width: 100%;
    }
}
@media only screen and (max-width: 680px) {
    .container section.header {
        padding: 20px 0 0px;
    }
    .container section.header .logo {
        font-size: 1.5em;
    }
    .container section.header .title:not(h1),
    .container section.header .mediumGrid .title:not(h1) {
        clear: left;
        margin: 0;
        padding: 20px 0;
        font-size: 3em;
    }
}
@media only screen and (max-width: 520px) {
    .container input {
        width: 100%;
    }
    .container section.header {
        margin-bottom: 0;
    }
    .container > .mediumGrid,
    .container > .smallGrid {
        padding: 0;
    }
    .container select {
        width: 100%;
    }
    .container select:hover + span:before {
        top: 31px;
    }
    .container select + span {
        top: auto;
        bottom: 0;
        margin: 0px 0 0px 0%;
        padding: 30px;
        width: 100%;
        border-left: 0;
        border-top: 2px solid #d4d4d4;
    }
    .container select + span:before {
        top: 31px;
        opacity: 1;
    }
    .container .searchForm.focused {
        padding: 0;
        max-width: 700px;
    }
    .container .searchForm.focused select + span {
        margin: 0%;
    }
    .container .searchForm div.nome {
        width: 100%;
    }
    .container .searchForm div.categoria {
        width: 100%;
        border-left: 0;
    }
}
@media only screen and (max-width: 440px) {
    .container {
        padding-bottom: 150px;
    }
    .container .card .latestUpdate article img {
        float: none;
        margin: 0 0 10px 0px;
    }
}
/**************************************************************************

FOOTER

*************************************************************************/

.container footer {
    clear: both;
    position: absolute;
    bottom: 0;
    width: 100%;
    min-height: 80px;
    background: rgba(0, 0, 0, 0.7);
    overflow: auto;
}
.container footer a.logo {
    display: block;
    position: relative;
    float: left;
    margin: 10px 10px 10px 0;
    font-size: 1.3em;
    color: #fff;
    line-height: 50px;
    text-decoration: none;
    text-transform: uppercase;
    overflow: hidden;
}
.container footer a.logo img {
    float: left;
    margin: 10px 10px 10px 0;
    height: 30px;
}
.container footer p {
    float: right;
    margin: 20px 0 20px 30px;
    font-size: 1.2em;
    color: #fff;
    text-align: right;
}
.container footer p a {
    color: #00bfa5;
}

/* cristina 2017 
.agenda2 img {
float: left;
margin-right: 10px;
} */

/* MAMOKA 2017 */

.catalogevento {

}
.catalogevento:after {
   content: " ";
   display: block;
   clear: both;
}
.catalogevento .periodo {
   border-bottom: 1px solid #f0f0f0;
   padding-bottom: 10px;
   margin: 40px 0 10px !important;
}
.catalogevento h3{
   margin-top: 0px !important;
}
.catalogevento .image {
   display: block;
   float: left;
   margin: 0 20px 20px 0;
}

