/*------------------------------------
 RESET by Harry Roberts
 http://csswizardry.com/2011/10/reset-restarted/
 ------------------------------------*/

* {
-webkit-box-sizing: border-box; 
-moz-box-sizing: border-box; 
box-sizing: border-box; 
}

html,body,div,span,applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,hr,
a,abbr,address,cite,code,
del,dfn,em,img,ins,kbd,q,s,samp,
small,strong,sub,sup,tt,var,
b,u,i,
dl,dt,dd,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary,
time,mark,audio,video{
	margin:0;
	padding:0;
}

article,aside,details,figcaption,figure,footer,
header,hgroup,menu,nav,section{
	display:block;
}
/*------------------------------------*\
  $GRIGLIA 
\*------------------------------------*/

/* .gc = grid container (racchiude gli elementi che compongono la griglia) */
.gc {margin: 5px;}

.gc--rev .grid {float: right;}

.gc > .gc {margin: 0;}

.grid {
 float: left;
 padding: 5px;
 position: relative; 
}

/*------------------------------------*\
  $LARGHEZZE
\*------------------------------------*/
.span-no, .span-0{
 	display:none;
}
.tablet-no, .tablet-0{
	display:block;
}
.span-1 {
 width: 100%;}

.span-1-2, .span-2-4, .span-3-6, .span-4-8, .span-5-10, .span-6-12 {
 width: 50%;}

.span-1-3, .span-2-6, .span-4-12 {
 width: 33.333%;}

.span-2-3, .span-4-6, .span-8-12 {
 width: 66.666%;}

.span-1-4, .span-2-8, .span-3-12 {
 width: 25%;}

.span-3-4, .span-6-8, .span-9-12 {
 width: 75%;}

.span-1-5, .span-2-10 {
 width: 20%;}

.span-2-5, .span-4-10 {
 width: 40%;}

.span-3-5, .span-6-10 {
 width: 60%;}

.span-4-5, .span-8-10 {
 width: 80%;}

.span-1-6, .span-2-12 {
 width: 16.666%;}

.span-5-6, .span-10-12 {
 width: 83.333%;}

.span-1-8 {
 width: 12.5%;}

.span-3-8 {
 width: 37.5%;}

.span-5-8 {
 width: 62.5%;}

.span-7-8 {
 width: 87.5%;}

.span-1-10 {
 width: 10%;}

.span-3-10 {
 width: 30%;}

.span-7-10 {
 width: 70%;}

.span-9-10 {
 width: 90%;}

.span-1-12 {
 width: 8.333%;}

.span-5-12 {
 width: 41.666%;}

.span-7-12 {
 width: 58.333%;}

.span-11-12 {
 width: 91.666%;}

/*------------------------------------*\
  $BREAKPOINT E MEDIA QUERY
\*------------------------------------*/

@media only screen and (min-width: 480px) and (max-width: 599px) {
.mobile-1 {
 width: 100%;}

.mobile-1-2, .mobile-2-4, .mobile-3-6, .mobile-4-8, .mobile-5-10, .mobile-6-12 {
 width: 50%;}

.mobile-1-3, .mobile-2-6, .mobile-4-12 {
 width: 33.333%;}

.mobile-2-3, .mobile-4-6, .mobile-8-12 {
 width: 66.666%;}

.mobile-1-4, .mobile-2-8, .mobile-3-12 {
 width: 25%;}

.mobile-3-4, .mobile-6-8, .mobile-9-12 {
 width: 75%;}

.mobile-1-5, .mobile-2-12 {
 width: 20%;}

.mobile-2-5, .mobile-4-10 {
 width: 40%;}

.mobile-3-5, .mobile-6-10 {
 width: 60%;}

.mobile-4-5, .mobile-8-10 {
 width: 80%;}

.mobile-1-6, .mobile-2-12 {
 width: 16.666%;}

.mobile-5-6, .mobile-10-12 {
 width: 83.333%;}

.mobile-1-8 {
 width: 12.5%;}

.mobile-3-8 {
 width: 37.5%;}

.mobile-5-8 {
 width: 62.5%;}

.mobile-7-8 {
 width: 87.5%;}

.mobile-1-10 {
 width: 10%;}

.mobile-3-10 {
 width: 30%;}

.mobile-7-10 {
 width: 70%;}

.mobile-9-10 {
 width: 90%;}

.mobile-1-12 {
 width: 8.333%;}

.mobile-5-12 {
 width: 41.666%;}

.mobile-7-12 {
 width: 58.333%;}

.mobile-11-12 {
 width: 91.666%;}
}

@media only screen and (min-width: 600px) and (max-width: 1024px) {
.span-no, .span-0{
 	display:block;
}
.tablet-no, .tablet-0{
 	display:none;
}
.tablet-1 {
 width: 100%;}

.tablet-1-2, .tablet-2-4, .tablet-3-6, .tablet-4-8, .tablet-5-10, .tablet-6-12 {
 width: 50%;}

.tablet-1-3, .tablet-2-6, .tablet-4-12 {
 width: 33.333%;}

.tablet-2-3, .tablet-4-6, .tablet-8-12 {
 width: 66.666%;}

.tablet-1-4, .tablet-2-8, .tablet-3-12 {
 width: 25%;}

.tablet-3-4, .tablet-6-8, .tablet-9-12 {
 width: 75%;}

.tablet-1-5, .tablet-2-12 {
 width: 20%;}

.tablet-2-5, .tablet-4-10 {
 width: 40%;}

.tablet-3-5, .tablet-6-10 {
 width: 60%;}

.tablet-4-5, .tablet-8-10 {
 width: 80%;}

.tablet-1-6, .tablet-2-12 {
 width: 16.666%;}

.tablet-5-6, .tablet-10-12 {
 width: 83.333%;}

.tablet-1-8 {
 width: 12.5%;}

.tablet-3-8 {
 width: 37.5%;}

.tablet-5-8 {
 width: 62.5%;}

.tablet-7-8 {
 width: 87.5%;}

.tablet-1-10 {
 width: 10%;}

.tablet-3-10 {
 width: 30%;}

.tablet-7-10 {
 width: 70%;}

.tablet-9-10 {
 width: 90%;}

.tablet-1-12 {
 width: 8.333%;}

.tablet-5-12 {
 width: 41.666%;}

.tablet-7-12 {
 width: 58.333%;}

.tablet-11-12 {
 width: 91.666%;}
}

@media only screen and (min-width: 1025px) {
.span-no, .span-0{
 display:block;
}
.tablet-no, .tablet-0{
 	display:none;
}
.desktop-1 {
 width: 100%;}

.desktop-1-2, .desktop-2-4, .desktop-3-6, .desktop-4-8, .desktop-5-10, .desktop-6-12 {
 width: 50%;}

.desktop-1-3, .desktop-2-6, .desktop-4-12 {
 width: 33.333%;}

.desktop-2-3, .desktop-4-6, .desktop-8-12 {
 width: 66.666%;}

.desktop-1-4, .desktop-2-8, .desktop-3-12 {
 width: 25%;}

.desktop-3-4, .desktop-6-8, .desktop-9-12 {
 width: 75%;}

.desktop-1-5, .desktop-2-12, .desktop-2-10 {
 width: 20%;}

.desktop-2-5, .desktop-4-10 {
 width: 40%;}

.desktop-3-5, .desktop-6-10 {
 width: 60%;}

.desktop-4-5, .desktop-8-10 {
 width: 80%;}

.desktop-1-6, .desktop-2-12 {
 width: 16.666%;}

.desktop-5-6, .desktop-10-12 {
 width: 83.333%;}

.desktop-1-8 {
 width: 12.5%;}

.desktop-3-8 {
 width: 37.5%;}

.desktop-5-8 {
 width: 62.5%;}

.desktop-7-8 {
 width: 87.5%;}

.desktop-1-10 {
 width: 10%;}

.desktop-3-10 {
 width: 30%;}

.desktop-7-10 {
 width: 70%;}

.desktop-9-10 {
 width: 90%;}

.desktop-1-12 {
 width: 8.333%;}

.desktop-5-12 {
 width: 41.666%;}

.desktop-7-12 {
 width: 58.333%;}

.desktop-11-12 {
 width: 91.666%;}

.desktop-1-7 {
 width: 14.2%;}

.desktop-2-7 {
 width: 28.5%;}
 
}
/*------------------------------------*\
    $PUSH
\*------------------------------------*/
.push, .push--1-2, .push--2-4, .push--3-6, .push--4-8, .push--6-12, .push--1-3, .push--2-6, .push--4-12, .push--2-3, .push--4-6, .push--8-12, .push--1-4, .push--2-8, .push--3-12, .push--3-4, .push--6-8, .push--9-12, .push--1-5, .push--2-10, .push--2-5, .push--4-10, .push--3-5, .push--6-10, .push--4-5, .push--8-10, .push--1-6, .push--2-12, .push--5-6, .push--10-12, .push--1-8, .push--3-8, .push--5-8, .push--7-8, .push--1-10, .push--3-10, .push--5-10, .push--7-10, .push--9-10, .push--1-12, .push--5-12, .push--7-12, .push--11-12 {position: relative; }

.push--1-2, .push--2-4, .push--3-6, .push--4-8, .push--6-12 {
  left: 50%; }

.push--1-3, .push--2-6, .push--4-12 {
  left: 33.333%; }

.push--2-3, .push--4-6, .push--8-12 {
  left: 66.666%; }

.push--1-4, .push--2-8, .push--3-12 {
  left: 25%; }

.push--3-4, .push--6-8, .push--9-12 {
  left: 75%; }

.push--1-4, .push--2-10 {
  left: 20%; }

.push--2-5, .push--4-10 {
  left: 40%; }

.push--3-5, .push--6-10 {
  left: 60%; }

.push--4-5, .push--8-10 {
  left: 80%; }

.push--1-6, .push--2-12 {
  left: 16.666%; }

.push--5-6, .push--10-12 {
  left: 83.333%; }

.push--1-8 {
  left: 12.5%; }

.push--3-8 {
  left: 37.5%; }

.push--5-8 {
  left: 62.5%; }

.push--7-8 {
  left: 87.5%; }

.push--1-10 {
  left: 10%; }

.push--3-10 {
  left: 30%; }

.push--5-10 {
  left: 50%; }

.push--7-10 {
  left: 70%; }

.push--9-10 {
  left: 90%; }

.push--1-12 {
  left: 8.333%; }

.push--5-12 {
  left: 41.666%; }

.push--7-12 {
  left: 58.333%; }

.push--11-12 {
  left: 91.666%; }

/*------------------------------------*\
    $PULL
\*------------------------------------*/

.pull, .pull--1-2, .pull--2-4, .pull--3-6, .pull--4-8, .pull--6-12, .pull--1-3, .pull--2-6, .pull--4-12, .pull--2-3, .pull--4-6, .pull--8-12, .pull--1-4, .pull--2-8, .pull--3-12, .pull--3-4, .pull--6-8, .pull--9-12, .pull--1-4, .pull--2-10, .pull--2-5, .pull--4-10, .pull--3-5, .pull--6-10, .pull--4-5, .pull--8-10, .pull--1-6, .pull--2-12, .pull--5-6, .pull--10-12, .pull--1-8, .pull--3-8, .pull--5-8, .pull--7-8, .pull--1-10, .pull--3-10, .pull--5-10, .pull--7-10, .pull--9-10, .pull--1-12, .pull--5-12, .pull--7-12, .pull--11-12 {position: relative;}

.pull--1-2, .pull--2-4, .pull--3-6, .pull--4-8, .pull--6-12 {
  right: 50%; }

.pull--1-3, .pull--2-6, .pull--4-12 {
  right: 33.333%; }

.pull--2-3, .pull--4-6, .pull--8-12 {
  right: 66.666%; }

.pull--1-4, .pull--2-8, .pull--3-12 {
  right: 25%; }

.pull--3-4, .pull--6-8, .pull--9-12 {
  right: 75%; }

.pull--1-5, .pull--2-10 {
  right: 20%; }

.pull--2-5, .pull--4-10 {
  right: 40%; }

.pull--3-5, .pull--6-10 {
  right: 60%; }

.pull--4-5, .pull--8-10 {
  right: 80%; }

.pull--1-6, .pull--2-12 {
  right: 16.666%; }

.pull--5-6, .pull--10-12 {
  right: 83.333%; }

.pull--1-8 {
  right: 12.5%; }

.pull--3-8 {
  right: 37.5%; }

.pull--5-8 {
  right: 62.5%; }

.pull--7-8 {
  right: 87.5%; }

.pull--1-10 {
  right: 10%; }

.pull--3-10 {
  right: 30%; }

.pull--5-10 {
  right: 50%; }

.pull--7-10 {
  right: 70%; }

.pull--9-10 {
  right: 90%; }

.pull--1-12 {
  right: 8.333%; }

.pull--5-12 {
  right: 41.666%; }

.pull--7-12 {
  right: 58.333%; }

.pull--11-12 {
  right: 91.666%; }

/*------------------------------------*\
  $CLEARFIX
\*------------------------------------*/
.cf, .gc, .nav, .media {zoom: 1;}
.cf:before, .gc:before, .nav:before, .media:before, 
.cf:after, .gc:after, .nav:after, .media:after {
 content: " ";
 display: table; 
}
.cf:after, .gc:after, .nav:after, .media:after {clear: both;}