@import url(https://fonts.googleapis.com/css?family=Oswald:400,700);
@import url(https://fonts.googleapis.com/css?family=Lato:400,900);
@import url(https://fonts.googleapis.com/css?family=Kameron);

/*----------------------------------------------------------------
[Table of contents]

1. Reset
2. General
	2.1 Loading / #loading
	2.2 Pager / #pager 
3. Circles
	3.1 Circle Structure / .circle
	3.2 Tiny Circles / .circle.tiny
	3.3 Small Circles / .circle.small
4. Social Navigation
5. Header
	5.1 Banners / #[section]-banner
6. Main Navigation / #main-nav
	6.1 Sub Menu
7. Main Slider / .main-slider
	7.1 Pager / .pager-container
8. Our Dishes / #our-dishes
	8.1 Dishes / #dishes-[left/right]
9. Shows / #shows
10. Popular Dishes / #popular-dishes
	10.1 Dish Listing / .dishes
11. Specials / #specials
12. About / #about
13. Video / #video
	13.1 Radial Progress / .radial-progress
14. Reviews / #reviews
15. News / #news
16. Contact / #contact
17. Map / #map
18. Footer
	18.1 About Mozzarella
	18.2 Our Latests Posts
	18.3 Flickr Widget
	18.4 Opening Hours
	18.5 Copy / #copy
------------------------------------------------------------------
19. Menu / #menu
20. Events / #events
21. Calendar / #calendar
	21.1 Big Version
		21.1.1 Month / #month
		21.1.2 Week / #week
		21.1.3 Days / #days
	21.2 Small Version / .small
		21.2.1 Month / #month
		21.2.2 Week / #week
		21.2.3 Days / #days
		21.2.4 Events / #cal-events
22. Gallery / #gallery
	22.1 Three Columns
	22.2 Four Columns
23. Blog / #blog
	23.1 Post List / #post-list
	23.2 Side Nav / #side-nav
	23.3 Tags / .tags
24. Animations
	24.1 Plus Icon Roll
	24.2 Radial Progress Rotation
	24.3 Loading
25. Magnific Popup Lightbox Animation
26. Media Queries
-------------------------------------------------------------------*/
/***************************************/
/* 1. RESET */
/***************************************/
* {
    margin: 0;
    padding: 0;
    outline: none;
    border: none;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

a {
    text-decoration: none;
}

ul, ol {
    list-style: none;
}

main, header, nav,
article, section,
aside, footer {
    display: block;
}

figure {
    line-height: 0;
}

figure figcaption {
    display: none;
}

/***************************************/
/* 2. GENERAL */
/***************************************/
p {
    font-size: 0.85em; /* 12px / 16px */
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    color: #737373;
    line-height: 1.666666666666667em; /* 20px / 12px */
}

p + hr {
    margin: 20px auto 70px;
    border: none;
    border-bottom: 2px solid #ff7c00;
    width: 150px;
}

h1 {
    font-size: 5em; /* 80px / 16px */
    font-family: 'Oswald', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1em;
    color: #fff;
    margin-bottom: 10px;
}

h2 {
    font-size: 3.75em; /* 60px / 16px */
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
    color: #323232;
    line-height: 1em;
    text-align: center;
    margin-bottom: 15px;
}

h2 + p {
    text-align: center;
    margin: 0 auto;
    width: 65%;
}

h3 {
    font-size: 4.375em; /* 70px / 16px */
    font-family: 'Lato', sans-serif;
    font-weight: 900;
    color: #fff;
    text-transform: uppercase;
    line-height: 1em;
}

h3 span {
    font-size: 1.2em; /* 84x / 70px */
    font-family: 'Kameron', serif;
    color: #ff7c00;
    margin-left: 7px;
}

h4 {
    font-size: 2.25em; /* 36px / 16px */
    font-family: 'Oswald', sans-serif;
    font-weight: 700;
    color: #fff;
    line-height: 1em;
}

h4 span {
    color: #ff7c00;
}

h5 {
    font-size: 1.25em; /* 20px / 16px */
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
    color: #323232;
    line-height: 1em;
}

h5 span {
    color: #ff7c00;
    font-weight: 700;
}

h6 {
    font-size: 0.75em; /* 12px / 16px */
    font-family: 'Lato', sans-serif;
    font-weight: 900;
    letter-spacing: .2em;
    color: #fff;
    line-height: 1em;
    text-transform: uppercase;
    margin-bottom: 10px;
}

a.square-button {
    display: block;
    width: 240px;
    height: 45px;
    border: 1px solid #ff7c00;
    text-transform: uppercase;
    line-height: 45px;
    text-align: center;
    font-family: 'Lato', sans-serif;
    font-size: 0.75em; /* 12px / 16px */
    font-weight: 900;
    color: #ff7c00;
    letter-spacing: .2em;
    transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
}

a.square-button:hover {
    background-color: #ff7c00;
    color: #fff;
    border-color: #ff7c00;
}

img[alt='title-detail'] {
    display: block;
    margin: 0 auto 15px;
}

input, textarea {
    border: 1px solid #dcdcdc;
    padding: 10px 15px;
    font-size: 0.75em; /* 12px / 16px */
    font-family: color: #323232;
    font-weight: 400;
}

div.wrapper {
    max-width: 1230px;
    margin: 0 auto;
}

.error {
    border-color: #db2e2e;
}

/*---------------
  2.1 LOADING
---------------*/
#loading {
    font-size: 90px;
    overflow: hidden;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    margin: 1em auto 2.3em;
    position: relative;
    display: none;
    animation: loader 1.7s infinite ease;
    -webkit-animation: loader 1.7s infinite ease;
}

/*---------------
  2.2 PAGER
---------------*/
#pager {
    margin: 0 auto;
    overflow: hidden;
}

#pager > li {
    float: left;
    margin-right: 5px;
}

#pager > li:last-child {
    margin-right: 0;
}

#pager > li > a {
    display: block;
    width: 29px;
    height: 29px;
    font-size: 0.625em; /* 10px / 16px */
    font-family: 'Lato', serif;
    font-weight: 700;
    color: #323232;
    line-height: 29px;
    text-align: center;
    border: 1px solid #dfdfdf;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
}

#pager > li > a:hover,
#pager > li.selected > a {
    background-color: #ff7c00;
    border-color: #ff7c00;
    color: #fff;
}

/***************************************/
/* 3. CIRCLES */
/***************************************/
/*----------------------
  3.1 CIRCLE STRUCTURE
----------------------*/
div.circle {
    background-color: #373737;
    border-radius: 50%;
    padding: 3px 0 0 3px;
    position: relative;
    overflow: hidden;
}

div.circle > figure {
    border-radius: 50%;
}

div.circle > a {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 50%;
    transition: all .4s ease-in;
    -webkit-transition: all .4s ease-in;
}

div.circle > a:hover {
    background-color: rgba(0, 0, 0, .75);
}

div.circle > a:hover > img {
    opacity: 1;
}

div.circle > a > img {
    opacity: 0;
    transition: all .4s ease-in;
    -webkit-transition: all .4s ease-in;
}

/*-------------------
  3.2 TINY CIRCLE
-------------------*/
div.circle.tiny {
    width: 70px;
    height: 70px;
}

div.circle.tiny figure {
    width: 64px;
    height: 64px;
}

/*--------------------
  3.3 SMALL CIRCLE
--------------------*/
div.circle.small {
    width: 75px;
    height: 75px;
}

div.circle.small figure {
    width: 69px;
    height: 69px;
}

div.circle.small > a {
    width: 75px;
    height: 75px;
}

div.circle.small > a:hover > img {
    transform: translate(0, 25px);
    -webkit-transform: translate(0, 25px);
}

div.circle.small > a > img {
    margin-left: 26px;
}

/***************************************/
/* 4. SOCIAL NAVIGATION */
/***************************************/
aside {
    position: fixed;
    top: 200px;
    right: -100px;
    z-index: 5;
}

aside > a {
    display: block;
    position: relative;
    right: 0px;
    margin-bottom: 10px;
    transition: all .5s ease;
    -webkit-transition: all .5s ease;
    color: #fff;
}

aside svg text {
    font-size: 12px;
    font-family: 'Lato', serif;
    text-transform: uppercase;
    font-weight: 900;
    fill: #fff;
}

aside > a:hover {
    right: 100px;
}

/**************************************
/* 5. HEADER */
/*************************************/
header {
    position: relative;
}

header > div.wrapper {
    background-color: #000000;
    max-width: 100%;
}

header > figure {
    width: 228px;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -114px;
    z-index: 1;
}

header > figure > img[alt='Mozzarella-logo'] {
    width: 100%;
}

/*--------------------
  5.1 BANNERS
--------------------*/
#menu-banner,
#events-banner,
#blog-banner,
#gallery-banner {
    background-size: 2px 2px, cover !important;
    height: 400px;
    text-align: center;
    padding-top: 190px;
}

#menu-banner {
    background: url('../images/dots-texture.png') repeat, url('../images/menu/menu-bg.jpg') no-repeat center;
}

#events-banner {
    background: url('../images/dots-texture.png') repeat, url('../images/events/events-bg.jpg') no-repeat center;
}

#blog-banner {
    background: url('../images/dots-texture.png') repeat, url('../images/blog/blog-bg.jpg') no-repeat center;
}

#gallery-banner {
    background: url('../images/dots-texture.png') repeat, url('../images/gallery/gallery-bg.jpg') no-repeat center;
}

/***************************************/
/* 6. MAIN NAVIGATION */
/***************************************/
#main-nav {
    max-width: 1230px;
    min-height: 70px;
    margin: 0 auto;
    background-color: #000000;
}

#main-nav > ul > li {
    float: left;
    height: 70px;
    width: 200px;
}

#main-nav > ul.responsive-nav {
    display: none;
}

#main-nav > ul > li:nth-child(3),
#main-nav > ul > li:nth-child(4) {
    float: right;
}

#main-nav > ul > li > a {
    display: block;
    text-align: center;
    line-height: 70px;
    color: #FFFFFF;
    font-size: 0.875em; /* 14px / 16px */
    font-weight: 400;
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    transition: all .1s ease-in-out;
    -webkit-transition: all .1s ease-in-out;
    position: relative;
}

#main-nav > ul > li.sub-items > a:after {
    content: url('../images/nav-arrow.png');
    position: absolute;
    bottom: 3px;
    right: 60px;
}

#main-nav > ul > li > a:hover {
    color: #ff7c00;
}

#main-nav > ul > li.sub-items > a:hover:after {
    content: url('../images/nav-arrow-hover.png');
}

/*---------------
  6.1 SUB MENU
---------------*/
#main-nav > ul > li > ul {
    width: 200px;
    background-color: #141414;
    position: relative;
    z-index: 2;
    margin-left: 57px;
    display: none;
}

#main-nav > ul > li > ul > li {
    border-bottom: 1px solid #373737;
}

#main-nav > ul > li > ul > li:last-child {
    border-bottom: none;
}

#main-nav > ul > li > ul > li > a {
    line-height: 40px;
    display: block;
    padding: 0 15px;
    font-size: 12px;
    font-family: 'Oswald', sans-serif;
    color: #FFFFFF;
    text-transform: uppercase;
    transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
}

#main-nav > ul > li > ul > li > a:hover {
    color: #000;
    background-color: #ff7c00;
}

/***************************************/
/* 7. MAIN SLIDER */
/***************************************/
header ul.main-slider li {
    height: 650px;
    padding-top: 230px;
    text-align: center;
}

header ul.main-slider li a.square-button {
    margin: 45px auto 0;
}

header ul.main-slider li.first {
    background: url('../images/dots-texture.png') repeat, url('../images/slider01.jpg') center;
    background-size: 2px 2px, cover;
    -webkit-background-size: 2px 2px, cover;
}

header ul.main-slider li.second {
    background: url('../images/dots-texture.png') repeat, url('../images/slider02.jpg') center;
    background-size: 2px 2px, cover;
    -webkit-background-size: 2px 2px, cover;
}

header ul.main-slider li.third {
    background: url('../images/dots-texture.png') repeat, url('../images/slider03.jpg') center;
    background-size: 2px 2px, cover;
    -webkit-background-size: 2px 2px, cover;
}

header ul.main-slider li.fourth {
    background: url('../images/dots-texture.png') repeat, url('../images/venues/slider01.jpg') center;
    background-size: 2px 2px, cover;
    -webkit-background-size: 2px 2px, cover;
}

header ul.main-slider li.fifth {
    background: url('../images/dots-texture.png') repeat, url('../images/venues/slider02.jpg') center;
    background-size: 2px 2px, cover;
    -webkit-background-size: 2px 2px, cover;
}

header ul.main-slider h2 {
    font-size: 5em; /* 80px / 16px */
    font-family: 'Oswald', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1em;
    color: #fff;
    margin-bottom: 8px;
}

/*-------------
  7.1 PAGER
-------------*/
.pager-container {
    width: 100px;
    position: absolute;
    bottom: 25px;
    left: 47%;
    margin-left: 0px;
}

.pager-container a {
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #fff;
    float: left;
    margin-right: 10px;
}

.pager-container a:last-child {
    margin-right: 0;
}

.pager-container a:hover {
    background-color: #ff7c00;
}

.pager-container a.active {
    background-color: #ff7c00;
}

/***************************************/
/* 8. OUR DISHES */
/***************************************/
#our-dishes {
    background-color: #fff;
    padding: 60px 0 130px;
    position: relative;
    overflow: hidden;
}

#our-dishes img[alt='deli-badge'] {
    position: absolute;
    left: 50%;
    margin-left: -135px;
}

/*---------------
  8.1 DISHES
---------------*/
#dishes-left {
    width: 430px;
    float: left;
    /*margin-left: 8%;*/
}

#dishes-right {
    width: 430px;
    float: right;
    /*margin-right: 8%;*/
}

#dishes-left > article,
#dishes-right > article {
    overflow: hidden;
    margin-bottom: 55px;
}

#dishes-left > article:last-child,
#dishes-right > article:last-child {
    margin-bottom: 0;
}

#dishes-left > article > div {
    width: 350px;
    float: left;
}

#dishes-right > article > div {
    width: 350px;
    float: right;
}

#dishes-left > article > div {
    text-align: right;
}

#dishes-left > article > div > h5,
#dishes-right > article > div > h5 {
    margin-bottom: 10px;
}

#dishes-left > article > img {
    float: right;
}

/***************************************/
/* 9. SHOWS */
/***************************************/
#shows {
    background: url('../images/dots-texture.png') repeat, url('../images/show-bg.jpg') center;
    padding-top: 100px;
    position: relative;
    min-height: 510px;
    background-size: 2px 2px, cover;
    -webkit-background-size: 2px 2px, cover;
}

#shows > div.wrapper {
    position: relative;
    width: 100%;
}

#shows img[alt='show-model'] {
    position: absolute;
    top: -145px;
    left: -5%;
}

#shows article {
    margin-left: 50%;
}

#shows article > p {
    color: #fff;
}

#shows article > h3 + p {
    font-size: 1.125em; /* 18px / 16px */
    letter-spacing: .15em;
    text-transform: uppercase;
    font-weight: 900;
    line-height: 1em;
    margin: 10px 0 25px;
}

#shows article > h3 + p:before {
    content: url('../images/show-left-decor.png');
    margin-right: 15px;
}

#shows article > h3 + p:after {
    content: url('../images/show-right-decor.png');
    margin-left: 8px;
}

#shows article > p + p {
    width: 84%;
    margin-bottom: 55px;
}

/***************************************/
/* 9. SHOWSPARTNERS */
/***************************************/
#showspartners {
    background: url('../images/dots-texture.png') repeat, url('../images/show-bg.jpg') center;
    padding-top: 100px;
    position: relative;
    min-height: 510px;
    background-size: 2px 2px, cover;
    -webkit-background-size: 2px 2px, cover;
}

#showspartners > div.wrapper {
    position: relative;
    width: 100%;
}

#showspartners img[alt='show-model'] {
    position: absolute;
    top: -145px;
    left: -5%;
}

#showspartners article {
    margin-left: 50%;
}

#showspartners article > p {
    color: #fff;
}

#showspartners article > h3 + p {
    font-size: 1.125em; /* 18px / 16px */
    letter-spacing: .15em;
    text-transform: uppercase;
    font-weight: 900;
    line-height: 1em;
    margin: 10px 0 25px;
}

#showspartners article > h3 + p:before {
    content: url('../images/show-left-decor.png');
    margin-right: 15px;
}

#showspartners article > h3 + p:after {
    content: url('../images/show-right-decor.png');
    margin-left: 8px;
}

#showspartners article > p + p {
    width: 84%;
    margin-bottom: 55px;
}

/***************************************/
/* 10. POPULAR DISHES */
/***************************************/
#popular-dishes {
    background-color: #fff;
    padding: 60px 0 100px;
    position: relative;
}

/*-------------------
  10.1 DISH LISTING
-------------------*/
ul.dishes {
    overflow: hidden;
    width: 1170px;
    margin: 0 auto;
}

ul.dishes > li {
    float: left;
    width: 270px;
    padding-bottom: 20px;
    margin: 0 30px 30px 0;
    border: 1px solid #dfdfdf;
    text-align: center;
    position: relative;
}

ul.dishes > li:nth-child(4n+4) {
    margin-right: 0;
}

ul.dishes > li > div {
    height: 190px;
    cursor: pointer;
    margin-bottom: 35px;
    position: relative;
    overflow: hidden;
}

ul.dishes.v3 > li > div {
    margin-bottom: 20px;
}

ul.dishes > li > div > div {
    background-color: rgba(0, 0, 0, .75);
    transition: all .3s ease-in;
    -webkit-transition: all .3s ease-in;
    height: 0;
    position: relative;
    z-index: 0;
}

ul.dishes > li > div:hover > div {
    height: 190px;
}

ul.dishes > li > div:hover img[alt='plus-icon'] {
    animation: plus-roll .5s ease-in forwards;
    -webkit-animation: plus-roll .5s ease-in forwards;
}

ul.dishes > li > div:hover img[alt='plus-icon'] + p {
    opacity: 1;
}

ul.dishes > li > div > img[alt='menu-dish'] {
    position: absolute;
    margin: auto;
    z-index: 0;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
}

ul.dishes img[alt='plus-icon'] {
    margin-top: 65px;
    margin-left: -200px;
    opacity: 0;
}

ul.dishes img[alt='plus-icon'] + p {
    font-size: 0.625em; /* 10px / 16px */
    color: #fff;
    text-transform: uppercase;
    font-weight: 900;
    line-height: 2em;
    opacity: 0;
    transition: all .5s ease-in;
    -webkit-transition: all .5s ease-in;
}

ul.dishes img[alt~='item'] {
    position: absolute;
    top: 155px;
    left: 50%;
    margin-left: -35px;
}

ul.dishes.v2 > li > h5,
ul.dishes.v3 > li > h5 {
    text-align: left;
    margin-left: 10px;
    font-size: 1.125em; /* 18px / 16px */
}

ul.dishes > li > p {
    width: 215px;
    margin: 10px auto 0;
}

ul.dishes.v2 > li > p,
ul.dishes.v3 > li > p {
    text-align: left;
    margin-left: 10px;
}

ul.dishes > li > p:last-child {
    font-size: 1.125em; /* 18px / 16px */
    color: #ff7c00;
    font-weight: 900;
    line-height: 1em;
}

ul.dishes.v2 > li > p:last-child {
    position: absolute;
    bottom: 70px;
    right: 10px;
    margin: 0;
    font-size: 1em; /* 16px / 16px */
    width: auto;
}

/***************************************/
/* 11. SPECIALS */
/***************************************/
#specials {
    background: url('../images/dots-texture.png') repeat, url('../images/bricks-bg.jpg') center;
    background-size: 2px 2px, cover;
    -webkit-background-size: 2px 2px, cover;
    min-height: 560px;
    padding-top: 73px;
    position: relative;
}

#specials > #board {
    width: 994px;
    height: 424px;
    margin: 0 auto;
    position: relative;
    background: url('../images/wood-sign.png');
}

#specials > #board > img[alt='specials-title'] {
    position: absolute;
    top: 110px;
    left: 48px;
}

#specials > img[alt='ivy'] {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
}

#specials > #board > article {
    float: right;
    margin: 80px 100px -20px 390px;
}

#specials > #board > article > article {
    float: left;
    width: 450px;
}

#specials > #board > article > article > h5 {
    font-size: 1.125em; /* 18px / 16px */
    color: #fff;
    float: left;
    margin-right: 10px;
    margin-bottom: 7px;
}

#specials > #board > article > article > hr {
    border: none;
    height: 4px;
    background: url('../images/dot-border.png') repeat-x;
    margin-top: 13px;
}

#specials > #board > article > article + p {
    float: left;
    color: #ff7c00;
    font-weight: 900;
    font-size: 1em;
    line-height: 1em;
    margin-left: 10px;
}

#specials > #board > article > p + p {
    clear: left;
    color: #acabab;
    line-height: 17px;
    margin-bottom: 20px;
}

/***************************************/
/* 12. ABOUT */
/***************************************/
#about {
    background-color: #fff;
    padding: 60px 0 130px;
    position: relative;
}

#about div.wrapper {
    position: relative;
}

#about article {
    width: 500px;
    margin-left: 8%;
    overflow: hidden;
}

#about article > h5 + p {
    margin: 10px 0 0;
}

#about article > ul {
    float: left;
    margin: 40px 30px 0 0;
}

#about article > ul > li {
    font-size: 1em; /* 16px / 16px */
    font-family: 'Oswald', sans-serif;
    color: #323232;
    font-weight: 400;
    position: relative;
    margin-bottom: 20px;
}

#about article > ul > li:last-child {
    margin-bottom: 0;
}

#about article > ul > li:before {
    content: url('../images/check-icon.png');
    position: relative;
    top: 2px;
    left: 0;
    margin-right: 20px;
}

#about img[alt='about-img'],
#about img[alt='quality-badge'] {
    position: absolute;
    right: 5%;
}

#about img[alt='about-img'] {
    top: 230px;
}

#about img[alt='quality-badge'] {
    top: 275px;
}

/***************************************/
/* 13. VIDEO */
/***************************************/
#video {
    min-height: 500px;
    background: url('../images/dots-texture.png') repeat, url('../images/video-bg.jpg') center;
    background-size: 2px 2px, cover;
    -webkit-background-size: 2px 2px, cover;
    padding-top: 145px;
    position: relative;
}

#video > p {
    font-size: 1em; /* 16px / 16px */
    color: #fff;
    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    margin-bottom: 7px;
}

#video > h2 {
    color: #fff;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 0;
}

#video > h2 span {
    color: #ff7c00;
}

#video > iframe {
    display: none;
    width: 100%;
    height: 500px;
    position: absolute;
    top: 0;
    left: 0;
}

/*----------------------
  13.1 RADIAL PROGRESS
----------------------*/
.radial-progress {
    width: 98px;
    height: 98px;
    background-color: transparent;
    border-radius: 50%;
    margin: 50px auto 0;
}

.radial-progress .r-circle .mask,
.radial-progress .r-circle .fill {
    width: 98px;
    height: 98px;
    position: absolute;
    border-radius: 50%;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.radial-progress .r-circle .mask {
    clip: rect(0, 98px, 98px, 49px);
}

.radial-progress .r-circle .mask .fill {
    clip: rect(0, 49px, 98px, 0);
    background-color: #ff7c00;
}

.radial-progress .inset {
    width: 90px;
    height: 90px;
    position: absolute;
    margin-left: 4px;
    margin-top: 4px;
    background-color: #000;
    border-radius: 50%;
    cursor: pointer;
}

.radial-progress .inset > img[alt='play-button'] {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -18px 0 0 -12px;
}

.radial-progress .r-circle .fill, .r-circle .mask.full {
    animation: rotate 3s linear infinite;
    -webkit-animation: rotate 3s linear infinite;
}

.radial-progress .r-circle .fill.fix {
    animation: rotate-fix 3s linear infinite;
    -webkit-animation: rotate-fix 3s linear infinite;
}

/***************************************/
/* 14. REVIEWS */
/***************************************/
#reviews-wrap {
    background-color: #fff;
}

#reviews {
    max-width: 1230px;
    margin: 0 auto;
    background-color: #fff;
    padding: 60px 0 90px;
}

#reviews > ul {
    width: 1030px;
    overflow: hidden;
    margin: 0 auto;
}

#reviews > ul > li {
    width: 500px;
    margin: 0 30px 40px 0;
    float: left;
}

#reviews > ul > li:nth-child(2n+2) {
    margin-right: 0;
}

#reviews > ul > li > article {
    float: left;
}

#reviews > ul > li > article > ul {
    width: 48px;
    margin: 3px auto;
    overflow: hidden;
}

#reviews > ul > li > article > ul > li {
    float: left;
    margin-right: 2px;
}

#reviews > ul > li > article > ul > li:last-child {
    margin-right: 0;
}

#reviews > ul > li > article > h5 {
    font-size: 1em; /* 16px / 16px */
    text-align: center;
}

#reviews > ul > li > article > p {
    font-size: 0.6875em; /* 11px / 16px */
    text-align: center;
    margin-top: 2px;
}

#reviews > ul > li > article.quote {
    width: 400px;
    margin-left: 30px;
    padding: 25px 40px 25px 45px;
    border: 1px solid #ccc;
    border-radius: 10px;
    position: relative;
}

#reviews > ul > li > article.quote > p {
    font-size: 1.0em; /* 12px / 16px */
    text-align: left;
}

#reviews > ul > li > article.quote > p span {
    font-weight: 900;
    color: #ff7c00;
}

#reviews img[alt~='quote'] {
    position: absolute;
}

#reviews img[alt~='right'] {
    bottom: 15px;
    right: 15px;
}

#reviews img[alt~='left'] {
    top: 15px;
    left: 15px;
}

#reviews img[alt~='triangle'] {
    top: 25px;
    left: -13px;
}

/***************************************/
/* 15. NEWS */
/***************************************/
#news {
    background: url('../images/dots-texture.png') repeat, url('../images/news-bg.jpg') center;
    background-size: 2px 2px, cover;
    -webkit-background-size: 2px 2px, cover;
    min-height: 400px;
    padding-top: 130px;
}

#news > p {
    font-size: 0.875em; /* 14px / 16px */
    color: #fff;
    font-weight: 900;
    line-height: 1em;
    text-transform: uppercase;
    text-align: center;
}

#news > h4 {
    margin-top: 15px;
    text-align: center;
    text-transform: uppercase;
}

#news > article {
    width: 400px;
    margin: 40px auto 0;
    position: relative;
}

#news input[type='email'] {
    min-width: 275px;
}

#news input[type='submit'] {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 125px;
    font-size: 0.75em; /* 12px / 16px */
    font-family: 'Lato', serif;
    font-weight: 900;
    color: #fff;
    letter-spacing: .2em;
    cursor: pointer;
    background-color: #ff7c00;
    text-transform: uppercase;
    border: none;
}

#news p.subs-error {
    font-family: 'Lato', serif;
    color: #db2e2e;
    font-weight: 700;
    float: left;
    margin-top: 5px;
    font-size: 0.75em;
    text-transform: none;
}

::-webkit-input-placeholder {
    font-size: 12px;
    font-family: 'Lato', serif;
    font-weight: 400;
    color: #ababab;
}

:-moz-placeholder { /* Firefox 18- */
    font-size: 12px;
    font-family: 'Lato', serif;
    font-weight: 400;
    color: #ababab;
}

::-moz-placeholder { /* Firefox 19+ */
    font-size: 12px;
    font-family: 'Lato', serif;
    font-weight: 400;
    color: #ababab;
}

:-ms-input-placeholder {
    font-size: 12px;
    font-family: 'Lato', serif;
    font-weight: 400;
    color: #ababab;
}

/***************************************/
/* 16. CONTACT */
/***************************************/
#contact {
    background-color: #fff;
    padding: 60px 0 130px;
}

#contact form {
    width: 83.73983739837398%;
    margin: 0 auto 30px;
}

#contact form > input[type='email'] {
    float: right;
}

#contact form > input {
    width: 48.54368932038835%;
}

#contact form > textarea {
    width: 100%;
    min-height: 160px;
    margin: 20px 0;
}

#contact form > input[type='submit'] {
    width: 62%;
    height: 45px;
    min-width: 200px;
    display: block;
    margin: 0 auto;
    border: none;
    cursor: pointer;
    background-color: #ff7c00;
    font-size: 12px;
    font-family: 'Lato', serif;
    font-weight: 900;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: .2em;
}

#contact ul {
    width: 90px;
    margin: 0 auto;
    overflow: hidden;
}

#contact ul > li {
    float: left;
    margin-right: 15px;
}

#contact ul > li:last-child {
    margin-right: 0;
}

/***************************************/
/* 17. MAP */
/***************************************/
#map {
    width: 100%;
    height: 530px;
}

/***************************************/
/* 18. FOOTER */
/***************************************/
footer {
    background-color: #141414;
}

footer > #info {
    width: 1170px;
    margin: 0 auto;
}

footer > #info {
    padding: 45px 0 20px;
    overflow: hidden;
}

#copy-wrapper {
    background-color: #000;
}

footer #copy {
    max-width: 1230px;
    margin: 0 auto;
    background-color: #000;
    overflow: hidden;
    padding: 0 30px;
}

footer > #info > article {
    width: 270px;
    float: left;
    margin-right: 30px;
}

footer > #info > article:last-child {
    margin-right: 0;
}

footer > #info > article > h5 {
    color: #fff;
    margin-bottom: 30px;
}

/*-----------------------
  18.1 ABOUT MOZZARELLA
-----------------------*/
footer > #info > article > p {
    color: #898989;
    margin-bottom: 20px;
}

footer > #info > article > ul.c-info > li {
    font-size: 0.625em; /* 10px / 16px */
    font-family: 'Lato', serif;
    color: #fff;
    font-weight: 900;
    text-transform: uppercase;
    margin-bottom: 10px;
}

footer > #info > article > ul.c-info > li:before {
    position: relative;
    margin-right: 10px;
    top: 8px;
}

footer > #info > article > ul.c-info > li:first-child:before {
    content: url('../images/pin-icon.png')
}

footer > #info > article > ul.c-info > li:nth-child(2):before {
    content: url('../images/mail-icon.png')
}

footer > #info > article > ul.c-info > li:nth-child(3):before {
    content: url('../images/phone-icon.png')
}

/*-----------------------
  18.2 OUR LATESTS POSTS
-----------------------*/
.side-posts > article {
    overflow: hidden;
    margin-bottom: 12px;
}

.side-posts > article > div.circle.small {
    float: left;
    margin-right: 10px;
}

.side-posts > article h6 {
    font-size: 0.6875em; /* 11px / 16px */
    letter-spacing: 0;
    margin-bottom: 0;
    margin-top: 15px;
}

.side-posts > article > h6 > a {
    color: #fff;
}

.side-posts > article > h6 > a:hover {
    color: #ff7c00;
}

.side-posts > article > p {
    margin-top: 3px;
    color: #898989;
}

/*---------------------
  18.3 FLICKR WIDGET
---------------------*/
#flickr-w {
    overflow: hidden;
}

#flickr-w > li {
    float: left;
    margin: 0 15px 10px 0;
}

#flickr-w > li:nth-child(3n+3) {
    margin-right: 0;
}

/*---------------------
  18.4 OPENING HOURS
---------------------*/
footer > #info > article > article.op-hours > div {
    overflow: hidden;
    height: 37px;
    border-bottom: 1px solid #373737;
}

footer > #info > article > article.op-hours > div:last-child {
    border-bottom: none;
}

footer > #info > article > article.op-hours > div > h6 {
    font-size: 0.6875em; /* 11px / 16px */
    letter-spacing: 0;
    line-height: 33px;
}

footer > #info > article > article.op-hours > div > h6 span {
    color: #e41c1c;
}

footer > #info > article > article.op-hours > div > h6:first-child {
    float: left;
}

footer > #info > article > article.op-hours > div > h6:last-child {
    float: right;
    color: #ff7c00;
}

/*-----------
  18.5 COPY
-----------*/
footer #copy > h5 {
    font-size: 0.8125em; /* 13px / 16px */
    color: #fff;
    line-height: 70px;
    float: left;
}

footer #copy > h5 {
    font-weight: 400;
}

footer #copy > nav > ul {
    float: right;
}

footer #copy > nav > ul > li {
    height: 70px;
    line-height: 70px;
    float: left;
    margin-right: 13px;
}

footer #copy > nav > ul > li:after {
    content: url('../images/copy-divider.png');
    margin-left: 13px;
}

footer #copy > nav > ul > li:last-child:after {
    content: '';
    margin-left: 0;
}

footer #copy > nav > ul > li:last-child {
    margin-right: 0;
}

footer #copy > nav > ul > li > a {
    font-size: 0.8125em; /* 13px / 16px */
    color: #fff;
    font-family: 'Oswald', sans-serif;
}

footer #copy > nav > ul > li > a:hover {
    color: #ff7c00;
}

/***************************************/
/* 19. MENU */
/***************************************/
#menu {
    background-color: #fff;
    padding: 60px 0 130px;
}

#menu-nav {
    width: 770px;
    overflow: hidden;
    margin: 0 auto 70px;
}

#menu-nav.text-nav {
    width: 1158px;
}

#menu-nav > li {
    float: left;
    margin-right: 70px;
    position: relative;
}

#menu-nav.text-nav > li {
    margin-right: 8px;
}

#menu-nav > li:last-child {
    margin-right: 0;
}

#menu-nav.img-nav > li > a {
    display: block;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    border: 4px solid #ff7c00;
    transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
}

#menu-nav.text-nav > li > a {
    display: block;
    font-size: 13px;
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
    text-align: center;
    line-height: 35px;
    padding: 0 30px;
    color: #6f6f6f;
    border: 1px solid #dfdfdf;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
}

#menu-nav.text-nav > li > a:hover {
    color: #fff;
    background-color: #ff7c00;
    border-color: #ff7c00;
}

#menu-nav.img-nav > li:first-child > a {
    background: url('../images/menu/ff-cat.png');
}

#menu-nav.img-nav > li:nth-child(2) > a {
    background: url('../images/menu/sc-cat.png');
}

#menu-nav.img-nav > li:nth-child(3) > a {
    background: url('../images/menu/pc-cat.png');
}

#menu-nav.img-nav > li:nth-child(4) > a {
    background: url('../images/menu/sa-cat.png');
}

#menu-nav.img-nav > li:nth-child(5) > a {
    background: url('../images/menu/db-cat.png');
}

#menu-nav.img-nav > li:nth-child(6) > a {
    background: url('../images/menu/ds-cat.png');
}

#menu-nav.img-nav > li:after {
    position: absolute;
    content: url('../images/menu/dot-div.png');
    top: 22px;
    left: 102px;
}

#menu-nav.img-nav > li:last-child:after {
    display: none;
}

#menu-nav.img-nav > li > a:hover {
    border-color: #f06600;
}

#menu-nav > li.selected > a {
    border-color: #f06600;
}

#menu-nav.text-nav > li.selected > a {
    color: #fff;
    background-color: #ff7c00;
    border-color: #ff7c00;
}

#menu ul.dishes {
    margin-bottom: 10px;
}

/***************************************/
/* 20. EVENTS */
/***************************************/
#events {
    background-color: #fff;
    padding: 60px 0 130px;
}

/***************************************/
/* 21. CALENDAR */
/***************************************/

/*--------------------
  21.1 BIG VERSION
--------------------*/
#calendar {
    max-width: 1030px;
    width: 83.53983739837398%;
    margin: 0 auto;
}

/*--------------------
    21.1.1 MONTH
--------------------*/
#calendar #month {
    height: 50px;
    text-align: center;
    background-color: #323232;
    position: relative;
}

#calendar #month > p {
    font-size: 1.125em; /* 18px / 16px */
    font-family: 'Oswald', sans-serif;
    font-weight: 700;
    line-height: 50px;
    color: #fff;
    text-transform: uppercase;
}

#calendar #month .arrow {
    display: block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 3px solid #ff7c00;
    position: absolute;
    top: 10px;
}

#calendar #month .arrow.left {
    background: url('../images/events/arrow-left.png') no-repeat 45% center #323232;
    left: 25px;
}

#calendar #month .arrow.right {
    background: url('../images/events/arrow-right.png') no-repeat 55% center #323232;
    right: 25px;
}

/*--------------------
    21.1.2 WEEK
--------------------*/
#calendar #week {
    height: 53px;
    border-left: 1px solid #dfdfdf;
    border-right: 1px solid #dfdfdf;
}

#calendar #week > li {
    width: 14.28571428571429%;
    float: left;
    font-size: 1em; /* 16px / 16px */
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
    line-height: 53px;
    color: #323232;
    text-align: center;
}

/*--------------------
    21.1.3 DAYS
--------------------*/
#calendar #days {
    overflow: hidden;
    border: 1px solid #dfdfdf;
    border-bottom: none;
}

#calendar #days > li {
    width: 14.28571428571429%;
    height: 120px;
    float: left;
    padding: 15px;
    border-bottom: 1px solid #dfdfdf;
    border-right: 1px solid #dfdfdf;
    position: relative;
    overflow: hidden;
}

#calendar #days > li:nth-child(7n+7) {
    border-right: none;
}

#calendar #days > li span {
    font-size: 0.75em; /* 12px / 16px */
    font-family: 'Lato', serif;
    font-weight: 900;
    color: #323232;
}

#calendar #days > li.inactive span {
    color: #b3b2b2;
}

#calendar #days > li.marked {
    padding: 10px 15px 15px 10px;
}

#calendar #days > li.marked span {
    display: block;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    text-align: center;
    line-height: 25px;
    background-color: #ff7c00;
    color: #fff;
}

#calendar #days > li.inactive.marked span {
    background-color: #bbbbbb;
}

#calendar #days > li > h6 {
    font-size: 0.625em; /* 10px / 16px */
    letter-spacing: 0;
    color: #323232;
    margin: 10px 0 5px;
}

#calendar #days > li.inactive > h6 {
    color: #bbbbbb;
}

#calendar #days > li > p {
    font-size: 0.6875em; /* 11px / 16px */
    line-height: 16px;
    color: #898989;
}

#calendar #days > li.inactive > p {
    color: #d1d1d1;
}

#calendar #days > li.featured:after {
    content: url('../images/events/star.png');
    position: absolute;
    top: 10px;
    right: 13px;
}

#calendar #days > li.inactive.featured:after {
    content: url('../images/events/star-inactive.png');
}

/*--------------------
  21.2 SMALL VERSION
--------------------*/
#calendar.small {
    min-width: 280px;
    width: 50%;
    margin: 0 auto;
}

/*--------------------
    21.2.1 MONTH
--------------------*/
#calendar.small #month {
    height: 40px;
}

#calendar.small #month > p {
    font-size: 0.875em; /* 14px / 16px */
    line-height: 40px;
}

#calendar.small #month .arrow {
    width: 20px;
    height: 20px;
    border-width: 2px;
}

#calendar.small #month .arrow.left {
    background: url('../images/events/arrow-left-small.png') no-repeat 35% center #323232;
    left: 10px;
}

#calendar.small #month .arrow.right {
    background: url('../images/events/arrow-right-small.png') no-repeat 60% center #323232;
    right: 10px;
}

/*--------------------
    21.2.2 WEEK
--------------------*/
#calendar.small #week {
    height: 42px;
}

#calendar.small #week > li {
    font-size: 0.75em; /* 12px / 16px */
    line-height: 42px;
}

/*--------------------
    21.2.3 DAYS
--------------------*/
#calendar.small #days > li.marked {
    padding: 5px 10px 0;
}

#calendar.small #days {
    border-bottom: 1px solid #dfdfdf;
    padding: 10px 0 20px;
}

#calendar.small #days > li {
    border-right: none;
    border-bottom: none;
    height: 30px;
    padding: 0 15px;
}

#calendar.small #days > li span {
    display: block;
    font-size: 0.6875em; /* 11px / 16px */
    text-align: center;
    line-height: 30px;
}

#calendar.small #days > li.marked span {
    width: 20px;
    height: 20px;
    line-height: 20px;
    margin: 0 auto;
}

/*--------------------
   21.2.4 EVENTS
--------------------*/
#calendar.small #cal-events {
    border: 1px solid #dfdfdf;
    border-top: none;
    border-bottom: none;
}

#calendar.small #cal-events > li {
    padding: 10px 10px 15px;
    border-bottom: 1px solid #dfdfdf;
    position: relative;
}

#calendar.small #cal-events > li.inactive > p {
    color: #d1d1d1;
}

#calendar.small #cal-events > li span {
    font-size: 0.75em; /* 12px / 16px */
    font-family: 'Lato', serif;
    font-weight: 900;
    display: block;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    text-align: center;
    line-height: 25px;
    background-color: #ff7c00;
    color: #fff;
}

#calendar.small #cal-events > li.inactive span {
    background-color: #bbbbbb;
}

#calendar.small #cal-events > li > h6 {
    font-size: 0.625em; /* 10px / 16px */
    letter-spacing: 0;
    color: #323232;
    margin: 10px 0 5px;
}

#calendar.small #cal-events > li.inactive > h6 {
    color: #bbbbbb;
}

#calendar.small #cal-events > li.featured:after {
    content: url('../images/events/star.png');
    position: absolute;
    top: 10px;
    right: 13px;
}

#calendar.small #cal-events > li.inactive.featured:after {
    content: url('../images/events/star-inactive.png');
}

/***************************************/
/* 22. GALLERY */
/***************************************/
#gallery {
    background-color: #fff;
    padding: 60px 0 130px;
}

#gallery-pics,
.gallery {
    width: 1170px;
    margin: 0 auto;
    overflow: hidden;
}

.gallery > li {
    float: left;
    background-color: #333;
    margin: 0 30px 30px 0;
    position: relative;
    overflow: hidden;
    border: 1px solid #dfdfdf;
}

#gallery-pics > li {
    float: left;
    width: 150px;
    height: 150px;
    margin: 0 20px 20px 0;
    border: 1px solid #dfdfdf;
    position: relative;
    cursor: pointer;
}

#gallery-pics > li > div {
    width: 150px;
    height: 0;
    background-color: rgba(0, 0, 0, .7);
    text-align: center;
    position: absolute;
    top: 0;
    left: 0;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
}

#gallery-pics > li > div > img,
#gallery-pics > li > div > p {
    transition: all .6s ease;
    -webkit-transition: all .6s ease;
    opacity: 0;
}

#gallery-pics > li > div > p {
    font-size: 10px;
    font-family: 'Lato', serif;
    font-weight: 900;
    color: #fff;
    text-transform: uppercase;
}

#gallery-pics > li > div > img {
    margin-top: 50px;
}

#gallery-pics > li:hover > div > img,
#gallery-pics > li:hover > div > p {
    opacity: 1;
}

#gallery-pics > li:hover > div {
    height: 150px;
}

#gallery-pics > li > figure {
    width: 150px;
    height: 150px;
}

#gallery-pics > li:nth-child(7n+7) {
    margin-right: 0;
}

.gallery > li > a > div {
    width: 100%;
    background-color: rgba(0, 0, 0, .75);
    position: absolute;
    left: 0;
    bottom: 0;
    transition: all .5s ease;
    -webkit-transition: all .5s ease;
}

.gallery > li > a > div > h5 {
    color: #fff;
}

.gallery > li > a > div > p.date {
    font-size: 0.6875em; /* 11px / 16px */
    font-family: 'Lato', serif;
    font-weight: 900;
    color: #ff7c00;
    line-height: 1em;
    margin-top: 3px;
}

.gallery > li > a > div > p {
    margin-top: 16px;
    color: #898989;
}

.gallery > li > a > div:after {
    content: url('../images/plus-icon-small.png');
    position: absolute;
    top: 20px;
}

/*--------------------
  22.1 THREE COLUMNS
--------------------*/
#gallery-3c > li {
    width: 370px;
    height: 270px;
}

#gallery-3c > li:nth-child(3n+3) {
    margin-right: 0;
}

#gallery-3c > li > a > div {
    max-height: 70px;
    padding: 18px 20px 25px;
}

#gallery-3c > li > a > div:after {
    right: 20px;
}

#gallery-3c > li > a:hover > div {
    max-height: 270px;
}

/*--------------------
  22.2 FOUR COLUMNS
--------------------*/
#gallery-4c > li {
    width: 270px;
    height: 220px;
}

#gallery-4c > li:nth-child(4n+4) {
    margin-right: 0;
}

#gallery-4c > li > a > div {
    height: 70px;
    padding: 18px 20px 30px;
}

#gallery-4c > li > a > div:after {
    right: 15px;
}

#gallery-4c > li > a:hover > div {
    height: 220px;
}

/***************************************/
/* 23. BLOG */
/***************************************/
#blog {
    max-width: 1230px;
    margin: 0 auto;
    background-color: #fff;
    padding: 60px 0 130px;
    overflow: hidden;
}

#blog #post-list {
    max-width: 900px;
    width: 73.17073170731707%;
}

#blog #side-nav {
    max-width: 300px;
    width: 24.39024390243902%;
}

#blog #post-list.left,
#blog #side-nav.left {
    float: left;
    padding-left: 2.439024390243902%;
}

#blog #post-list.right,
#blog #side-nav.right {
    float: right;
    padding-right: 2.439024390243902%;
}

/*------------------
  23.1 POST LIST
------------------*/
#post-list .post {
    margin-bottom: 60px;
}

#post-list .post:last-child {
    margin-bottom: 0;
}

#post-list .post figure img {
    width: 100%;
}

#post-list .post > h4 {
    margin: 30px 0 15px;
    font-weight: 400;
    color: #323232;
}

#post-list .fb-share-button,
#post-list .twitter-share-button,
#post-list .gplus-share-button {
    float: right;
    margin-top: 20px;
    margin-right: 10px;
}

#post-list .fb-share-button {
    margin-right: 40px;
}

#post-list .post > p.info {
    font-size: 0.6875em; /* 11px / 16px */
    font-family: 'Lato', serif;
    font-weight: 900;
    text-transform: uppercase;
    color: #323232;
    line-height: 1em;
}

#post-list .post > p.info span:first-child {
    color: #ff7c00;
}

#post-list .post > div.description {
    margin: 18px 0 25px;
}

#post-list .post > a.more {
    display: block;
    width: 240px;
    height: 45px;
    font-size: 0.75em; /* 12px / 16px */
    font-family: 'Lato', serif;
    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    line-height: 45px;
    letter-spacing: .2em;
    color: #fff;
    background-color: #ff7c00;
}

#post-list .author {
    float: left;
    width: 100%;
    border-top: 1px solid #dfdfdf;
    border-bottom: 1px solid #dfdfdf;
    margin: 70px 0 50px;
    padding: 60px 0;
}

#post-list .author article:first-child {
    float: left;
    width: 70px;
    height: 100%;
    margin-right: 30px;
}

#post-list .author article > ul {
    width: 54px;
    margin: 5px auto 0;
    overflow: hidden;
}

#post-list .author article > ul > li {
    float: left;
    margin-right: 4px;
}

#post-list .author article > ul > li:last-child {
    margin-right: 0;
}

#post-list .author article p {
    margin-top: 8px;
}

#post-list .author article p span {
    color: #ff7c00;
    font-weight: 900;
}

#disqus_thread a {
    color: #ff7c00;
}

/*-----------------
  23.2 SIDE NAV
-----------------*/
#side-nav .side-posts {
    margin-bottom: 60px;
}

#side-nav > article > h5 {
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #dfdfdf;
}

#side-nav .side-posts > article > h6 > a {
    color: #323232;
}

#side-nav .side-posts > article > h6 > a:hover {
    color: #ff7c00;
}

/*--------------
  23.3 TAGS
--------------*/
.tags > a {
    display: block;
    float: left;
    padding: 5px 10px;
    border: 1px solid #dfdfdf;
    font-size: 0.6875em; /* 11px / 16px */
    font-family: 'Lato', serif;
    font-weight: 900;
    text-transform: uppercase;
    color: #323232;
    margin: 0 5px 5px 0;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
}

.tags > a:hover {
    color: #fff;
    background-color: #ff7c00;
    border-color: #ff7c00;
}

/***************************************/
/* 24. ANIMATIONS */
/***************************************/
/*----------------------
  24.1 PLUS ICON ROLL
----------------------*/
@keyframes plus-roll {
    0% {
        opacity: 0;
        transform: translate(0, 0) rotate(0deg);
    }

    100% {
        opacity: 1;
        transform: translate(100px, 0) rotate(360deg);
    }
}

@-webkit-keyframes plus-roll {
    0% {
        opacity: 0;
        -webkit-transform: translate(0, 0) rotate(0deg);
    }

    100% {
        opacity: 1;
        -webkit-transform: translate(100px, 0) rotate(360deg);
    }
}

/*--------------------------------
  24.2 RADIAL PROGRESS ROTATION
--------------------------------*/
@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(180deg);
    }
}

@-webkit-keyframes rotate {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(180deg);
    }
}

@keyframes rotate-fix {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes rotate-fix {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

/*---------------
  24.3 LOADING 
---------------*/
@keyframes loader {
    0% {
        transform: rotate(0deg);
        box-shadow: -0.11em -0.83em 0 -0.4em #ff7c00, -0.11em -0.83em 0 -0.42em #ff7c00, -0.11em -0.83em 0 -0.44em #ff7c00, -0.11em -0.83em 0 -0.46em #ff7c00, -0.11em -0.83em 0 -0.477em #ff7c00;
    }
    5%,
    95% {
        box-shadow: -0.11em -0.83em 0 -0.4em #ff7c00, -0.11em -0.83em 0 -0.42em #ff7c00, -0.11em -0.83em 0 -0.44em #ff7c00, -0.11em -0.83em 0 -0.46em #ff7c00, -0.11em -0.83em 0 -0.477em #ff7c00;
    }
    30% {
        box-shadow: -0.11em -0.83em 0 -0.4em #ff7c00, -0.51em -0.66em 0 -0.42em #ff7c00, -0.75em -0.36em 0 -0.44em #ff7c00, -0.83em -0.03em 0 -0.46em #ff7c00, -0.81em 0.21em 0 -0.477em #ff7c00;
    }
    55% {
        box-shadow: -0.11em -0.83em 0 -0.4em #ff7c00, -0.29em -0.78em 0 -0.42em #ff7c00, -0.43em -0.72em 0 -0.44em #ff7c00, -0.52em -0.65em 0 -0.46em #ff7c00, -0.57em -0.61em 0 -0.477em #ff7c00;
    }
    100% {
        transform: rotate(360deg);
        box-shadow: -0.11em -0.83em 0 -0.4em #ff7c00, -0.11em -0.83em 0 -0.42em #ff7c00, -0.11em -0.83em 0 -0.44em #ff7c00, -0.11em -0.83em 0 -0.46em #ff7c00, -0.11em -0.83em 0 -0.477em #ff7c00;
    }
}

@-webkit-keyframes loader {
    0% {
        -webkit-transform: rotate(0deg);
        box-shadow: -0.11em -0.83em 0 -0.4em #ff7c00, -0.11em -0.83em 0 -0.42em #ff7c00, -0.11em -0.83em 0 -0.44em #ff7c00, -0.11em -0.83em 0 -0.46em #ff7c00, -0.11em -0.83em 0 -0.477em #ff7c00;
    }
    5%,
    95% {
        box-shadow: -0.11em -0.83em 0 -0.4em #ff7c00, -0.11em -0.83em 0 -0.42em #ff7c00, -0.11em -0.83em 0 -0.44em #ff7c00, -0.11em -0.83em 0 -0.46em #ff7c00, -0.11em -0.83em 0 -0.477em #ff7c00;
    }
    30% {
        box-shadow: -0.11em -0.83em 0 -0.4em #ff7c00, -0.51em -0.66em 0 -0.42em #ff7c00, -0.75em -0.36em 0 -0.44em #ff7c00, -0.83em -0.03em 0 -0.46em #ff7c00, -0.81em 0.21em 0 -0.477em #ff7c00;
    }
    55% {
        box-shadow: -0.11em -0.83em 0 -0.4em #ff7c00, -0.29em -0.78em 0 -0.42em #ff7c00, -0.43em -0.72em 0 -0.44em #ff7c00, -0.52em -0.65em 0 -0.46em #ff7c00, -0.57em -0.61em 0 -0.477em #ff7c00;
    }
    100% {
        -webkit-transform: rotate(360deg);
        box-shadow: -0.11em -0.83em 0 -0.4em #ff7c00, -0.11em -0.83em 0 -0.42em #ff7c00, -0.11em -0.83em 0 -0.44em #ff7c00, -0.11em -0.83em 0 -0.46em #ff7c00, -0.11em -0.83em 0 -0.477em #ff7c00;
    }
}

/*****************************************/
/* 25. MAGNIFIC POPUP LIGHTBOX ANIMATION */
/*****************************************/
.mfp-fade.mfp-bg {
    opacity: 0;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.mfp-fade.mfp-bg.mfp-ready {
    opacity: .95;
}

.mfp-fade.mfp-bg.mfp-removing {
    opacity: 0;
}

.mfp-fade.mfp-wrap .mfp-content {
    opacity: 0;
    -webkit-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;
}

.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
    opacity: 1;
}

.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
    opacity: 0;
}

/***************************************/
/* 26. MEDIA QUERIES */
/***************************************/
@media screen and (max-width: 1290px) {
    /*-------------------
        POPULAR DISHES
    -------------------*/
    ul.dishes {
        width: 570px;
    }

    ul.dishes > li:nth-child(2n+2) {
        margin-right: 0;
    }

    /*-------------
        ABOUT
    -------------*/
    #about article {
        width: 80%;
        margin: 0 auto;
    }

    #about article > ul {
        width: 50%;
        margin-left: auto;
        margin-right: auto;
    }

    #about img[alt='about-img'],
    #about img[alt='quality-badge'] {
        display: none;
    }

    /*-------------
        GALLERY
    -------------*/
    #gallery-3c {
        width: 770px;
    }

    #gallery-3c > li:nth-child(3n+3) {
        margin-right: 30px;
    }

    #gallery-3c > li:nth-child(2n+2),
    #gallery-4c > li:nth-child(2n+2) {
        margin-right: 0;
    }

    #gallery-4c {
        width: 570px;
    }

    #gallery-pics {
        width: 830px;
    }

    #gallery-pics > li:nth-child(7n+7) {
        margin-right: 20px;
    }

    #gallery-pics > li:nth-child(5n+5) {
        margin-right: 0;
    }

    /*-------------
        MENU
    -------------*/
    #menu-nav.text-nav {
        width: 320px;
    }

    #menu-nav.text-nav > li {
        margin-bottom: 8px;
    }

    /*-------------
        FOOTER
    -------------*/
    footer > #info {
        width: 570px;
        padding-bottom: 0;
    }

    footer > #info > article {
        margin-bottom: 50px;
    }

    footer > #info > article:nth-child(2n+2) {
        margin-right: 0;
    }

}

@media screen and (max-width: 1275px) {
    /*---------------
        DISHES
    ---------------*/
    #our-dishes img[alt='deli-badge'] {
        display: none;
    }

    #dishes-left {
        margin-left: 15%;
    }

    #dishes-right {
        margin-right: 15%;
    }

    /*---------------
        SHOWS
    ---------------*/
    #shows img[alt='show-model'] {
        left: 3%;
        display: none;
    }

    #shows article {
        margin-left: 30%;
    }
	
	/*---------------
        SHOWSPARTNERS
    ---------------*/
    #showspartners img[alt='show-model'] {
        left: 3%;
        display: none;
    }

    #showspartners article {
        margin-left: 30%;
    }

    /*---------------
        SPECIALS
    ---------------*/
    #specials > #board {
        width: 304px;
        height: 641px;
        background: url('../images/wood-sign-small.png');
    }

    #specials > #board > img[alt='specials-title'] {
        width: 203px;
        height: 123px;
        top: 35px;
    }

    #specials > #board > article {
        width: 245px;
        float: none;
        position: absolute;
        top: 205px;
        left: 30px;
        margin: 0;
    }

    #specials > #board > article > article {
        width: 245px;
    }

    #specials > #board > article > article > h5 {
        font-size: 0.875em; /* 14px / 16px */
    }

    #specials > #board > article > article > hr {
        display: none;
    }

    #specials > #board > article > article + p {
        float: right;
        margin-top: -18px;
        font-size: 12px;
    }

    #specials > #board > article > p + p {
        font-size: 0.6875em; /* 11px / 16px */
    }

    /*---------------
        REVIEWS
    ---------------*/
    #reviews > ul {
        width: 500px;
    }

    #reviews > ul > li {
        margin-right: 0;
    }

    /*---------------
        BLOG
    ---------------*/
    #side-nav .side-posts > article > div.circle.small {
        float: none;
        margin: 0 auto;
    }

    #side-nav .side-posts > article > h6,
    #side-nav .side-posts > article > p {
        text-align: center;
    }

    /*---------------------
        ASIDE NAVIGATION
    ---------------------*/
    aside {
        display: none;
    }
}

@media screen and (max-width: 1024px) {
    /*---------------
        HEADER
    ---------------*/
    header > figure {
        width: 145px;
        top: 10px;
        margin-left: -72px;
    }

    /*---------------
        MAIN NAV
    ---------------*/
    #main-nav {
        min-height: 65px;
        position: relative;
    }

    #main-nav > ul {
        display: none;
        position: absolute;
        z-index: 3;
        top: 65px;
        left: 0;
        width: 100%;
    }

    #main-nav > ul > li {
        width: 100%;
        height: auto;
        background-color: #000;
    }

    #main-nav a#pull {
        display: block;
        position: absolute;
        left: 90%;
        bottom: 18px;
        margin-left: -13px;
    }

    #main-nav a#pull:after {
        content: url('../images/nav-icon.png');
    }

    /*---------------
        SUB MENU
    ---------------*/
    #main-nav > ul > li > ul {
        margin-left: 0;
        width: 100%;
    }

    #main-nav > ul > li > ul > li > a {
        text-align: center;
    }

    /*---------------
        DISHES
    ---------------*/
    #dishes-left, #dishes-right {
        width: 50%;
    }

    #dishes-left {
        float: none;
        margin: 0 auto;
    }

    #dishes-left > article > div {
        width: 75%;
        float: right;
        text-align: left;
    }

    #dishes-left > article > img {
        float: left;
    }

    #dishes-right {
        float: none;
        margin: 55px auto 0;
    }

    #dishes-right > article > div {
        width: 75%;
    }

    /*---------------
        SHOWS
    ---------------*/
    #shows img[alt='show-model'] {
        display: none;
    }

    #shows article {
        margin: 0 auto;
        text-align: center;
    }

    #shows article > p + p {
        margin: 0 auto 55px;
    }

    #shows article > a.square-button {
        margin: 0 auto;
    }
	
	/*---------------
        SHOWSPARTNERS
    ---------------*/
    #showspartners img[alt='show-model'] {
        display: none;
    }

    #showspartners article {
        margin: 0 auto;
        text-align: center;
    }

    #showspartners article > p + p {
        margin: 0 auto 55px;
    }

    #showspartners article > a.square-button {
        margin: 0 auto;
    }

    /*---------------
        MENU
    ---------------*/
    #menu-nav {
        width: 350px;
    }

    #menu-nav > li {
        margin-bottom: 30px;
    }

    #menu-nav > li:nth-child(3) {
        margin-right: 0;
    }

    #menu-nav > li:nth-child(3):after {
        display: none;
    }

    /*---------------
        GALLERY
    ---------------*/
    #gallery-pics {
        width: 490px;
    }

    #gallery-pics > li:nth-child(5n+5) {
        margin-right: 20px;
    }

    #gallery-pics > li:nth-child(3n+3) {
        margin-right: 0;
    }

    /*---------------
        LIGHTBOX
    ---------------*/
    .mfp-gallery .mfp-close {
        right: 30px !important;
    }

    .mfp-close {
        right: 0 !important;
    }
}

@media screen and (max-width: 855px) {
    /*------------
        BLOG
    ------------*/
    #blog #side-nav {
        display: none;
    }

    #blog #post-list.right,
    #blog #post-list.left {
        float: none;
        width: 90%;
        margin: 0 auto;
        padding-left: 0;
        padding-right: 0;
    }

    #blog #post-list a.more {
        margin-left: auto;
        margin-right: auto;
    }

    /*-------------
        GALLERY
    -------------*/
    #gallery-3c {
        width: 370px;
    }

    #gallery-3c > li {
        margin-right: 0;
    }
}

@media screen and (max-width: 750px) {
    /*---------------
        DISHES
    ---------------*/
    #dishes-left, #dishes-right {
        width: 90%;
    }

    #dishes-left > article > div,
    #dishes-right > article > div {
        float: none;
        text-align: center;
        margin: 0 auto;
    }

    #dishes-left > article,
    #dishes-right > article {
        position: relative;
        padding-top: 90px;
    }

    #dishes-left > article > img,
    #dishes-right > article > img {
        float: none;
        position: absolute;
        top: 0;
        left: 50%;
        margin-left: -35px;
    }

    /*-------------------
        POPULAR DISHES
    -------------------*/
    ul.dishes {
        width: 270px;
    }

    ul.dishes > li {
        margin-right: 0;
    }

    /*---------------
        SPECIALS
    ---------------*/
    #specials > img[alt="ivy"] {
        display: none;
    }

    /*-------------
        ABOUT
    -------------*/
    #about article > ul {
        float: none;
        width: 600px;
    }

    #about article > ul:last-child {
        margin-top: 20px;
    }

    /*-------------
        GALLERY
    -------------*/
    #gallery-4c {
        width: 270px;
    }

    #gallery-4c > li {
        margin-right: 0;
    }

    #gallery-pics {
        width: 320px;
    }

    #gallery-pics > li:nth-child(3n+3) {
        margin-right: 20px;
    }

    #gallery-pics > li:nth-child(2n+2) {
        margin-right: 0;
    }

    /*-------------
        FOOTER
    -------------*/
    footer > #info {
        width: 270px;
    }

    footer > #info > article {
        margin-right: 0;
    }

    footer #copy > h5 {
        margin-top: 50px;
        float: none;
        text-align: center;
    }

    footer #copy {
        position: relative;
    }

    footer #copy > nav > ul {
        width: 336px;
        position: absolute;
        top: 0;
        left: 50%;
        margin-left: -168px;
    }
}

@media screen and (max-width: 600px) {
    /*---------------
        HEADER
    ---------------*/
    header ul.main-slider img {
        display: none;
    }

    header h1,
    header h2 {
        font-size: 4.375em; /* 70px / 16px */
    }

    /*---------------
        SHOWS
    ---------------*/
    #shows article > h3 + p:before,
    #shows article > h3 + p:after {
        display: none;
    }

    #shows article > h3 {
        font-size: 2.5em; /* 40px / 16px */
    }

	
	/*---------------
        SHOWSPARTNERS
    ---------------*/
    #showspartners article > h3 + p:before,
    #showspartners article > h3 + p:after {
        display: none;
    }

    #showspartners article > h3 {
        font-size: 2.5em; /* 40px / 16px */
    }
    /*---------------
        VIDEO
    ---------------*/
    #video > h2 {
        font-size: 2.5em; /* 40px / 16px */
    }

    /*---------------
        REVIEWS
    ---------------*/
    #reviews > ul {
        width: 90%;
    }

    #reviews > ul > li {
        width: 100%;
    }

    #reviews > ul > li > article > div.circle.tiny {
        margin: 0 auto;
    }

    #reviews > ul > li > article {
        float: none;
        width: 90% !important;
        margin: 10px auto !important;
    }

    #reviews img[alt~='triangle'] {
        display: none;
    }

    /*---------------
        NEWS
    ---------------*/
    #news > h4 {
        font-size: 1.875em; /* 30px / 16px */
    }

    #news > article {
        width: 80%;
        text-align: center;
    }

    #news input[type='email'] {
        min-width: 0;
        width: 95%;
        margin-bottom: 20px;
    }

    #news input[type='submit'] {
        position: static;
        height: 38px;
        display: block;
        margin: 0 auto;
    }

    /*---------------
        CONTACT
    ---------------*/
    #contact form > input[type='text'] {
        width: 100%;
    }

    #contact form > input[type='email'] {
        float: none;
        width: 100%;
        margin-top: 20px;
    }
}

@media screen and (max-width: 480px) {
    /*---------------
        HEADER
    ---------------*/
    header h1,
    header h2 {
        font-size: 3.125em; /* 60px / 16px */
    }

    /*-------------
        GALLERY
    -------------*/
    #gallery-3c {
        width: 90%;
    }

    #gallery-3c > li {
        width: 100%;
    }

    #gallery-3c > li > a > div > h5 {
        font-size: 1em; /* 16px / 16px */
    }

    /*-------------
        POSTS
    -------------*/
    #post-list .author article:first-child {
        float: none;
        margin: 0 auto;
    }

    /*-------------
        FOOTER
    -------------*/
    footer #copy > nav > ul {
        display: none;
    }

    footer #copy > h5 {
        margin-top: 0;
        font-size: 0.75em; /* 12px / 16px */
    }

    /*---------------
        MENU NAV
    ---------------*/
    #menu-nav {
        width: 210px;
    }

    #menu-nav > li:nth-child(odd) {
        margin-right: 70px;
    }

    #menu-nav > li:nth-child(odd):after {
        display: block;
    }

    #menu-nav > li:nth-child(even) {
        margin-right: 0;
    }

    #menu-nav > li:nth-child(even):after {
        display: none;
    }
}

@media screen and (max-width: 400px) {
    /*---------------
        GALLERY
    ---------------*/
    #gallery-pics {
        width: 150px;
    }

    #gallery-pics > li {
        margin-right: 0;
    }
}