/**
 * Content
 */

body {
	background-color: transparent;
	color: #000;
}

a:active {
	opacity: 0.9;
    color: red;
}

.page a.active {
	color: rgba(0, 0, 0, 1);
    background-color: transparent;
    text-decoration: underline;
}

.page a.active.image-link img {
	outline: 1px solid #06f;
    outline-offset: -1px;
}

i,
em {
	font-style: italic;
}

b,
strong {
	font-weight: bolder;
}

sub,
sup {
	position: relative;
	vertical-align: baseline;
}

sub {
	top: 0.3em;
}

sup {
	top: -0.4em;
}

s {
	text-decoration: line-through;
}

img {
	border: 0;
	padding: 0;
}

ul,
ol {
	margin: auto;
	padding: 0 0 0 1rem;
}

ol >li {
    padding-left: 0.75rem;
}

blockquote {
	margin: 0;
	padding: 0 0 0 2em;
}

hr {
	background: rgba(0, 0, 0, 0.16);
	border: 0;
	height: 1px;
	display: block;
}

.content img {
	float: none;
    margin-top: 0px;
	margin-bottom: 1.0rem;
    vertical-align: bottom;
}

.gallery_image_caption {
	font-size: 1.2rem;
	font-weight: 400;
	color: rgba(0, 0, 0, 1);
	font-family: "iA Writer Quattro", Icons;
	font-style: normal;
	line-height: 1.4;
    text-align: right;
    position: absolute;
    margin-top: -27px;
}

/**
 * Loading Animation
 */

.loading[data-loading] {
	position: fixed;
	bottom: 8px; 
    left: 8px;
}

/**
 * Editor styles
 */

[data-predefined-style="true"] bodycopy {
	font-size: 1.2rem;
	font-weight: 400;
	color: rgba(0, 0, 0, 1);
	font-family: "iA Writer Quattro", Icons;
	font-style: normal;
	line-height: 1.4;
}

[data-predefined-style="true"] bodycopy a {
    border-top: 0px solid transparent;
	border-bottom: 0px solid transparent;
    border-left: 0px solid transparent;
    border-right: 0px solid transparent;
    padding: 0px 0px 0px 0px;
	color: rgba(0, 0, 0, 1);
	padding-bottom: 0em;
	text-decoration: none;
    position: relative;
}

[data-predefined-style="true"] bodycopy a:hover {
	text-decoration: underline;
}

bodycopy a.image-link,
bodycopy a.icon-link,
bodycopy a.image-link:hover,
bodycopy a.icon-link:hover {
	border-bottom: 0;
	padding-bottom: 0;
}

[data-predefined-style="true"] h1 {
	font-family: "Infini GF", Icons;
	padding: 0;
	margin: 0;
	font-size: 2rem;
	line-height: 1.1;
	color: rgba(0, 0, 0, 0.85);
	font-style: normal;
	font-weight: 400;
}

[data-predefined-style="true"] h1 a {
	color: rgba(0, 0, 0, 0.85);
}

[data-predefined-style="true"] h2 {
	font-family: "Infini GF", Icons;
	font-style: normal;
	font-weight: 400;
	padding: 0px 0px 0px 0px;
	margin: -3px 0px 0px 0px;
	color: rgba(0, 0, 0, 0.7);
	font-size: 1.5rem;
	line-height: 1.3;
	letter-spacing: 0.01em;
    position: relative;
}

[data-predefined-style="true"] h2 a {
	color: rgba(0, 0, 0, 0.7);
}

[data-predefined-style="true"] small {
	display: inline-block;
	font-size: 1.2rem;
	line-height: 1.4;
	font-family: "iA Writer Quattro", Icons;
	font-style: normal;
	font-weight: 400;
	color: rgba(0, 0, 0, 1);
}

[data-predefined-style="true"] small a {
	color: rgba(0, 0, 0, 1);
}

[data-predefined-style="true"] small a:hover {
	color: rgba(0, 0, 0, 0.3);
}


/**
 * Breakpoints
 */

[data-css-preset] .page {
    background-color: initial /*!page_bgcolor*/;
}

.mobile .page,
[data-css-preset].mobile .page {
	position: relative;
	min-height: 10px;
	max-width: 100%;
	width: 100%;
	background-color: transparent /*!page_bgcolor*/;
}

[data-css-preset] .container {
	margin-left: auto /*!content_center*/;
	margin-right: auto /*!content_center*/;
	text-align: left /*!text_left*/;
    margin-bottom: -5px;
    margin-top: -5px;
}

[data-css-preset] body {
	background-color: transparent/*!body_bgcolor*/;
}

[data-css-preset] .container_width {
	width: 100%/*!content_center*/;
}

[data-css-preset] .content_padding {
	padding-top: 1.1rem/*!main_margin*/;
	padding-bottom: 1.1rem/*!main_margin*/;
	padding-left: 1.1rem/*!main_margin*/;
	padding-right: 1.1rem/*!main_margin*/;
}

[data-css-preset] text-limit {
	display: inline-block /*!text_width*/;
	max-width: 66rem/*!text_width*/;
}

[data-css-preset] .backdrop {
	width: 100% /*!background_cover*/;
}

/**
 * Thumbnails
 */

div[thumbnails] {
	justify-content: flex-start;
}

[data-css-preset] .thumbnails {
   	background-color: rgba(0, 0, 0, 0)/*!thumbnails_bgcolor*/;   
}

[data-css-preset] .thumbnails_width {
    width: 100%/*!thumbnails_width*/;
}

[data-css-preset] [thumbnails-pad] {
    padding: 0.5rem/*!thumbnails_padding*/;
}

[data-css-preset] [thumbnails-gutter] {
    margin: -1rem/*!thumbnails_padding*/;
}

[data-css-preset] [responsive-layout] [thumbnails-pad] {
    padding: 0.5rem/*!responsive_thumbnails_padding*/; 
}

[data-css-preset] [responsive-layout] [thumbnails-gutter] {
    margin: -1rem/*!responsive_thumbnails_padding*/; 
}

.thumbnails .thumb_image {
	outline: 0px solid rgba(0,0,0,.12);
    outline-offset: -1px;
}

.thumbnails .title {
    border-bottom: 0px solid rgba(0, 0, 0, 0.17);
    margin-top: .6rem;
    margin-bottom: 1.4rem;
    font-size: 1.1rem;
	font-weight: bold;
	color: rgba(0, 0, 0, 0.6);
	font-family: "Neue Haas Grotesk", Icons;
	font-style: normal;
	line-height: 1.3;
    letter-spacing: 0.04em;
    text-align: left;
}

.thumbnails .tags {
    margin-top: 0.5rem;
    margin-bottom: 1.4rem;
    font-size: 1.1rem;
	font-weight: 400;
	color: rgba(0, 0, 0, 0.75);
	font-family: "Neue Haas Grotesk", Icons;
	font-style: normal;
	line-height: 1.5;
    text-align: left;
    padding: 0;
}

.thumbnails .tags a {
	border-bottom: 0px solid rgba(0, 0, 0, 0.1);
    color: rgba(0, 0, 0, 0.6);
    text-decoration: none;
}

.thumbnails .has_title .tags {
	margin-top: -1.4rem;
}

/**
 * Site Menu
 */

[data-css-preset] #site_menu_button {
	color: rgba(0, 0, 0, 0.6);
	line-height: 1;
	font-size: 28px /*!site_menu_button*/;
	padding: 6px;
	line-height: 1;
	background: rgba(33, 32, 46, 0);
	position: fixed;
	top: .25rem /*!site_menu_button*/;
	right: 1rem /*!site_menu_button*/;
}

body.mobile #site_menu_button {
	margin: -6px;
	font-size: 28px;
}

#site_menu_button.custom_icon {
	width: 40px;
	height: auto;
}

#site_menu_button.active {
	display: none;
}

/**
 * Site Menu
 */

#site_menu {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif, "Sans Serif", Icons;
	background: rgba(20, 20, 20, 0.95);
	font-size: 20px;
	font-style: normal;
	font-weight: 400;
	padding: 20px 30px 90px 30px;
	max-width: 400px;
	min-width: 300px;
	text-align: left;
	display: flex;
	justify-content: flex-start;
}

body.mobile #site_menu {
	width: 100%;
}

#site_menu .page-link a {
	color: rgba(255, 255, 255, 0.75);
}

#site_menu .set-link > a {
	color: rgba(255, 255, 255, 0.75);
	font-weight: bold;
}

#site_menu a:active {
	opacity: .7;
}

#site_menu a.active {
	opacity: .4;
}

#site_menu .close {
	display: none;
	color: rgba(255, 255, 255, 0.4);
	line-height: .85em;
	font-size: 45px;
}

body.mobile #site_menu .close {
	display: block;
	font-size: 50px;
	line-height: 1em;
}

#site_menu .break {
	height: 28px;
}

#site_menu .indent {
	margin-left: 28px;
}

/**
 * Shop Button
 */

[data-css-preset] #shop_button {
	color: rgba(0, 0, 0, 0.6);
    background: transparent;
	font-size: 32px;
    font-style: normal;
	font-weight: 400;
    line-height: 1.;
    position: fixed;
	padding: 6px;
	right: 2rem /*!shop_button*/;
	bottom: 2rem /*!shop_button*/;
}

#shop_button.text {
    font-family: "Neue Haas Grotesk", Icons;
	font-size: 1.3rem;
    padding: 0;
	font-weight: 400;
	color: rgba(0, 0, 0, 0.6);
	font-style: normal;
    line-height: 1.3;
    letter-spacing: .07em;
}

#shop_button.custom_icon {
	width: 40px;
    height: auto;
}

body.mobile #shop_button:not(.text) {
	margin: -10px;
    font-size: 36px;
}

/**
 * Shop Product Widget
 */

.shop_product {
    width: 100%;
	max-width: 22rem;
    position: relative;
    display: block;
}

.shop_product .price {
	font-family: "Neue Haas Grotesk", Icons;
	font-style: normal;
	font-weight: 400;
	margin-bottom: 1rem;
	font-size: 1.1rem;
	line-height: 1.1;
	color: rgba(0, 0, 0, 0.6);
}

.shop_product .dropdown {
    font-family: "Neue Haas Grotesk", Icons;
    font-size: 1.1rem;
    display: inline-block;
	width: 100%;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 10rem;
    background:  white url(https://static.cargo.site/assets/images/select-line-arrows.svg) no-repeat right;
    margin-bottom: 1rem;
    line-height: 1.2;
    padding: .7rem 1rem;
	font-style: normal;
	font-weight: 400;
    color: rgba(0, 0, 0, 0.6);
}

.shop_product .button {
    font-family: "Neue Haas Grotesk", Icons;
	font-size: 1.1rem;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 10rem;
    color: rgba(255,255,255,1);
    flex: 0 0 50%;
    text-align: left;
    display: inline-block;
	line-height: 1;
    padding: .8rem 1rem;
	font-style: normal;
	font-weight: 400;
}

/**
 * Image Zoom
 */

.content img.image-zoom:active {
    opacity: .7;
}

/**
 * Quick View
 */

[data-css-preset] .quick-view {
    padding-top: 2.5rem /*!quick_view_padding*/;
    padding-bottom: 2.5rem /*!quick_view_padding*/;
    padding-left: 2.5rem /*!quick_view_padding*/;
    padding-right: 2.5rem /*!quick_view_padding*/;
    height: 100% /*!quick_view_height*/;
    width: 100% /*!quick_view_width*/;
}

body.mobile .quick-view {
    width: 100%;
    height: 100%;
    margin: 0;
}


[data-css-preset] .quick-view-background {
    background: rgba(0, 0, 0, 0.8) /*!quick_view_bgcolor*/;
}

.quick-view-caption {
    font-family: "Neue Haas Grotesk", Icons;
    transition: 100ms opacity ease-in-out;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 3.5rem 0;
    text-align: center;
    font-size: 1rem;
	font-style: normal;
	font-weight: 400;
}

.quick-view-caption span {
    padding: 0.5rem 1rem;
    display: inline-block;
    background: rgba(0,0,0,0.5);
    color: white;
}

/**
 * Quick View Navigation 
 */

.quick-view-navigation .left-arrow {
    left: 10px;
}

.quick-view-navigation .right-arrow {
    right: 10px;
}

.quick-view-navigation .left-arrow,
.quick-view-navigation .right-arrow {
    /* Change height/width together to scale */
    height: 36px;
    width: 36px;
}

.quick-view-navigation .left-arrow .inner-color,
.quick-view-navigation .right-arrow .inner-color {
    stroke: #fff;
    stroke-width: 1.5px;
}

.quick-view-navigation .left-arrow .outer-color,
.quick-view-navigation .right-arrow .outer-color {
    stroke: rgba(0, 0, 0, 0.6);
    stroke-width: 2.5px;
}

.quick-view-navigation .close-button {  
    top: 10px;
    right: 10px;
    /* Change height/width together to scale */
    width: 36px;
    height: 36px;
}

.quick-view-navigation .close-button .inner-color {
    stroke: #fff;
    stroke-width: 1.5px;
}

.quick-view-navigation .close-button .outer-color {
    stroke: rgba(0, 0, 0, 0.6);
    stroke-width: 2.5px;
}

/** 
 * Image Gallery Navigation Arrows 
 */
 
.image-gallery-navigation .left-arrow,
.image-gallery-navigation .right-arrow {
    /* Change height/width together to scale */
    height: 30px;
    width: 30px;
    position: absolute;
}

.image-gallery-navigation .left-arrow .inner-color,
.image-gallery-navigation .right-arrow .inner-color {
    stroke: rgba(81, 81, 81, 1);
    stroke-width: 3px;
}

.image-gallery-navigation .left-arrow .outer-color,
.image-gallery-navigation .right-arrow .outer-color {
    stroke: rgba(0, 0, 0, 0.6);
    stroke-width: 2.5px;
}

/**
 * Wallpaper Backdrop Navigation Arrows 
 */

.wallpaper-navigation .left-arrow,
.wallpaper-navigation .right-arrow {
   /* Change height/width together to scale */
   width: 36px;
   height: 36px;
}

.wallpaper-navigation .left-arrow .inner-color,
.wallpaper-navigation .right-arrow .inner-color {
   stroke: #fff;
   stroke-width: 1.5px;
}

.wallpaper-navigation .left-arrow .outer-color,
.wallpaper-navigation .right-arrow .outer-color {
    stroke: rgba(0, 0, 0, 0.6);
    stroke-width: 2.5px;
}

/**
 * Feed
 */

.feed .content_container .page {
    border-top: 0px dashed rgba(0, 0, 0, 0.2);
}

.feed .content_container .page_container:first-child .page {
	border-top: 0;
}

/**
 * Audio Player
 */

.audio-player {
    max-width: 26rem;
    height: 3.3rem;
    outline: 1px solid rgba(0,0,0,0.15);
    color: rgba(0, 0, 0, 0.6);
    background: transparent;
    font-size: 1.1rem;
    line-height: 1.3;
    font-family: "Neue Haas Grotesk", Icons;
    font-style: normal;
    font-weight: 400;
    text-align: left;
    margin: 1px 1px 1em 1px;
}

body.mobile .audio-player {
    max-width: 100%;
}

.audio-player .separator {
    width: 1px;
    background-color: rgba(0,0,0,0.15);
}

.audio-player .button {
    background: transparent;
    cursor: pointer;
    fill: rgba(0, 0, 0, 0.85);
}

.audio-player .icon {
    fill: rgba(0, 0, 0, 0.85);
    padding: 30%;
    width: 100%;
    margin: auto;
}

.audio-player .buffer {
    background: rgba(0,0,0,0.03);
}

.audio-player .progress {
    background: rgba(0,0,0,0.1);
}

.audio-player .progress-indicator {
    border: 1px solid rgba(0, 0, 0, 0.7);
    width: 1px;
    height: 100%;
    right: 0;
    position: absolute;
    cursor: ew-resize;
}

.audio-player .note-icon {
    height: 100%;
    width: 3.8rem;
    padding: 1rem;
    fill: rgba(0, 0, 0, 0.5);
}

.audio-player .current-time {
    padding-left: 1rem;
}

.audio-player .total-time {
    padding-right: 1rem;
}


/**
 * Pure CSS Responsive Horizontal Accordion 
 */

/**
 * The basic CSS styles for the accordion.
 */
/**
 * PRODUCT/SWATCH SISTEM–51 
 */

.accordion {
  width: 100%;
  max-width: 100%;
  height: 250px;
  overflow: hidden;
  margin: 10px auto;

}
.accordion ul {
  width: 100%;
  display: table;
  table-layout: fixed;
  margin: 0;
  padding: 0;
}
.accordion ul li {
  display: table-cell;
  vertical-align: bottom;
  position: relative;
  width: 16.666%;
  height: 150px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  transition: all 500ms ease;

}
.accordion ul li div {
  display: block;
  overflow: hidden;
  width: 100%;
}
.accordion ul li div a {
  display: block;
  height: 250px;
  width: 100%;
  position: relative;
  z-index: 3;
  vertical-align: bottom;
  padding: 10px 15px;
  box-sizing: border-box;
  color: #000;
  text-decoration: none;
  font-family: "iA Writer Quattro", Icons;
  transition: all 200ms ease;
	font-style: normal;
    font-size: 2px;
	font-weight: 400;
}
.accordion ul li div a * {
  opacity: 0;
  margin: 0;
  width: 100%;
  text-overflow: clip;
  position: relative;
  z-index: 5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-transform: translateX(-20px);
  transform: translateX(-20px);
  -webkit-transition: all 400ms ease;
  transition: all 400ms ease;
}
.accordion ul li div a h2 {
  font-family: "Infini GF", Icons;
  text-overflow: clip;
  font-size: 15px;
  text-transform: capitalize;
  margin-bottom: 1px;
  top: 180px;
	font-style: normal;
	font-weight: 700;
}
.accordion ul li div a p {
  top: 180px;
  font-size: 13.5px;
}

/**
 * Add background images to the accordion items.
 */

.accordion ul li:nth-child(1) {
  background-image: url("https://freight.cargo.site/t/original/i/6b266b16aa4d59eefbe75ec76e17155a18cf3a57b7b9ddc9d193b358c25275c4/Antonio_Fazio_Swatch_s51_less-faster_thumb_black_def_Homepage_small.gif");
}
.accordion ul li:nth-child(2) {
  background-image: url("https://freight.cargo.site/t/original/i/2e76802cd6a4531c520909da515d3998e73a999cbdf21036ac9633c2d37f14d9/Antonio-Fazio_sistem51_Swatch_movement-animated_Homepage_small_optimized_2.gif");
}
.accordion ul li:nth-child(3) {
  background-image: url("https://freight.cargo.site/t/original/i/dc28bd9675c5a16383bd231f924f8214fb6bd5a39f581f365838f80cd5f013be/Antonio_Fazio_Swatch_sistem51_Plastic_Visual-Identity_Homepage_small_2.gif");
}
.accordion ul li:nth-child(4) {
  background-image: url("https://freight.cargo.site/t/original/i/f08ed2ceb5796e564d31c277f27e0f2d33ce3a9f1388ed4ff30a7cb90189f1d8/Antonio_Fazio_Swatch_Project_Sistem51_-Form-Study---December-2011_02_TOPOGRAPHY_Homepage_2_small.jpg");
}
.accordion ul li:nth-child(5) {
  background-image: url("https://freight.cargo.site/t/original/i/d5699554f62157a454ddc6363bc13d3beca1314d76f34907a22ef31b2edcbc19/Antonio_Fazio_Swatch_sistem51_Dial-design_prototype_Homepage_small.jpg");
}
.accordion ul li:nth-child(6) {
  background-image: url("https://freight.cargo.site/t/original/i/743d4585b560a3cddc4710a597a3704373ea0d578e99255769e554f9c27cec0e/Antonio-Fazio_sistem51_Swatch_design_packaging_prototype_Homepage.jpg");
}
.accordion ul li:nth-child(7) {
  background-image: url("https://freight.cargo.site/t/original/i/fb25750aa5733ef690947282bc9328218858f362bc17ff38d57bc79581b12212/Antonio-Fazio_sistem51_Swatch_Launch-collection_all-colors_horizontal_Homepage_small_optimized.gif");
}


/**
 * Expand the accordion item on mouse hover using :hover pseudo element.
 */
.accordion ul:hover li {
  width: 9%;
}
.accordion ul:hover li:hover {
  width: 30%;
}
.accordion ul:hover li:hover a {
  background: transparent;
}
.accordion ul:hover li:hover a * {
  opacity: 2;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

/**
 * Make the accordion responsive using CSS media queries.
 */

@media screen and (max-width: 800px) {
  body {
    margin: 0;
  }

  .accordion {
    height: auto;
  }
  .accordion ul li, .accordion ul li:hover, .accordion ul:hover li, .accordion ul:hover li:hover {
    position: relative;
    display: table;
    table-layout: fixed;
    width: 100%;
    -webkit-transition: none;
    transition: none;
  }
}
/**
 * PRODUCT/SWATCH SISTEM–51 IRONY
 */

.accordion2 {
  width: 100%;
  max-width: 100%;
  height: 250px;
  overflow: hidden;
  margin: 10px auto;
}
.accordion2 ul {
  width: 100%;
  display: table;
  table-layout: fixed;
  margin: 0;
  padding: 0;
}
.accordion2 ul li {
  display: table-cell;
  vertical-align: bottom;
  position: relative;
  width: 16.666%;
  height: 150px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  transition: all 500ms ease;
}
.accordion2 ul li div {
  display: block;
  overflow: hidden;
  width: 100%;
}
.accordion2 ul li div a {
  display: block;
  height: 250px;
  width: 100%;
  position: relative;
  z-index: 3;
  vertical-align: bottom;
  padding: 10px 15px;
  box-sizing: border-box;
  color: #000;
  text-decoration: none;
  font-family: "iA Writer Quattro", Icons;
  transition: all 200ms ease;
	font-style: normal;
    font-size: 2px;
	font-weight: 400;
}
.accordion2 ul li div a * {
  opacity: 0;
  margin: 0;
  width: 100%;
  text-overflow: clip;
  position: relative;
  z-index: 5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-transform: translateX(-20px);
  transform: translateX(-20px);
  -webkit-transition: all 400ms ease;
  transition: all 400ms ease;
}
.accordion2 ul li div a h2 {
  font-family: "Infini GF", Icons;
  text-overflow: clip;
  font-size: 15px;
  text-transform: capitalize;
  margin-bottom: 1px;
  top: 180px;
	font-style: normal;
	font-weight: 700;
}
.accordion2 ul li div a p {
  top: 180px;
  font-size: 13.5px;
}

/**
 * Add background images to the accordion items.
 */
.accordion2 ul li:nth-child(1) {
  background-image: url("https://freight.cargo.site/t/original/i/16295ca780d76bfe5d8a7b1fc84b624e22f2287cc5bf78bc1c6306c43992fce5/Antonio-Fazio_Swatch-Sistem51-Irony-presentation_Homepage_Grey_large_optimized_3a.gif");
}
.accordion2 ul li:nth-child(2) {
  background-image: url("https://freight.cargo.site/t/original/i/1b9b7480f2df7aa72206e524188fce65eab5abd17bbb308b69b28d50927cd313/Antonio_Fazio_Swatch_Sistem51-Irony_Right-Handed-Film-Strip-showing-the-metallic-case-of-the-S51-Irony-model-YIS403_Homepage.jpg");
}
.accordion2 ul li:nth-child(3) {
  background-image: url("https://freight.cargo.site/t/original/i/95a34ac5acc7666f1f909708b18d30b5679a3d1f0a361020f09d05715faf9793/Antonio_Fazio_Swatch_Sistem51_Irony_familiarization-manual-1.-Product-Identity--written-and-compiled-by-Antonio_Fazio--March-15--2015_p12-13_Homepage.jpg");
}
.accordion2 ul li:nth-child(4) {
  background-image: url("https://freight.cargo.site/t/original/i/6559574c581e4553b3f200d3449fd25eaa2c268877be4af27cfbaf08d6ffeebf/Antonio_Fazio_Swatch_Sistem51_Irony_YIS403_thumbnail_2_vertical_Homepage.jpg");
}
.accordion2 ul li:nth-child(5) {
  background-image: url("https://freight.cargo.site/t/original/i/df0f2a73b8824d972a18277348d07024aef55a249eb8983efc833404cb619dba/Antonio_Fazio_Swatch_Sistem51_Irony_YIS403_thumbnail_2_horizontal_Homepage_2.jpg");
}
/**
 * Expand the accordion item on mouse hover using :hover pseudo element.
 */
.accordion2 ul:hover li {
  width: 9%;
}
.accordion2 ul:hover li:hover {
  width: 30%;
}
.accordion2 ul:hover li:hover a {
  background: transparent;
}
.accordion2 ul:hover li:hover a * {
  opacity: 2;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

/**
 * Make the accordion responsive using CSS media queries.
 */
@media screen and (max-width: 800px) {
  body {
    margin: 0;
  }

  .accordion2 {
    height: auto;
  }
  .accordion2 ul li, .accordion2 ul li:hover, .accordion2 ul:hover li, .accordion2 ul:hover li:hover {
    position: relative;
    display: table;
    table-layout: fixed;
    width: 100%;
    -webkit-transition: none;
    transition: none;
  }
}
/**
 * PRODUCT/The KDU for 361º
 */

.accordion3 {
  width: 100%;
  max-width: 100%;
  height: 250px;
  overflow: hidden;
  margin: 10px auto;
}
.accordion3 ul {
  width: 100%;
  display: table;
  table-layout: fixed;
  margin: 0;
  padding: 0;
}
.accordion3 ul li {
  display: table-cell;
  vertical-align: bottom;
  position: relative;
  width: 16.666%;
  height: 150px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  transition: all 500ms ease;
}
.accordion3 ul li div {
  display: block;
  overflow: hidden;
  width: 100%;
}
.accordion3 ul li div a {
  display: block;
  height: 250px;
  width: 100%;
  position: relative;
  z-index: 3;
  vertical-align: bottom;
  padding: 10px 15px;
  box-sizing: border-box;
  color: #000;
  text-decoration: none;
  font-family: "iA Writer Quattro", Icons;
  transition: all 200ms ease;
	font-style: normal;
    font-size: 2px;
	font-weight: 400;
}
.accordion3 ul li div a * {
  opacity: 0;
  margin: 0;
  width: 100%;
  text-overflow: clip;
  position: relative;
  z-index: 5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-transform: translateX(-20px);
  transform: translateX(-20px);
  -webkit-transition: all 400ms ease;
  transition: all 400ms ease;
}
.accordion3 ul li div a h2 {
  font-family: "Infini GF", Icons;
  text-overflow: clip;
  font-size: 15px;
  text-transform: capitalize;
  margin-bottom: 1px;
  top: 180px;
	font-style: normal;
	font-weight: 700;
}
.accordion3 ul li div a p {
  top: 180px;
  font-size: 13.5px;
}

/**
 * Add background images to the accordion items.
 */
.accordion3 ul li:nth-child(1) {
  background-image: url("https://freight.cargo.site/t/original/i/f77972d6dbe55064b3ded6f43568e72ee90f3c4348ee85b177a6107671e4cc66/Antonio_Fazio_The-KDU-for-361-degrees_Footwear-Design_Collection-of-16-Footwear-Drawings_3.jpg");
}
.accordion3 ul li:nth-child(2) {
  background-image: url("https://freight.cargo.site/t/original/i/54383a8940f270cafe643b44a61ee6b128fbc28035c5bef5688b9d94087f4256/KDU_361_footwear_5_Homepage_small.jpg");
}
.accordion3 ul li:nth-child(3) {
  background-image: url("https://freight.cargo.site/t/original/i/6ef02fa49097e626a613b05902f5099f46c335bce75528535740e4923308f7b2/Antonio_Fazio_THE_KDU_FootwearDesign_BASKETBALL_animation_1_Homepage.gif");
}
.accordion3 ul li:nth-child(4) {
  background-image: url("https://freight.cargo.site/t/original/i/6ef02fa49097e626a613b05902f5099f46c335bce75528535740e4923308f7b2/Antonio_Fazio_THE_KDU_FootwearDesign_BASKETBALL_animation_1_Homepage.gif");
}
/**
 * Expand the accordion item on mouse hover using :hover pseudo element.
 */
.accordion3 ul:hover li {
  width: 9%;
}
.accordion3 ul:hover li:hover {
  width: 30%;
}
.accordion3 ul:hover li:hover a {
  background: transparent;
}
.accordion3 ul:hover li:hover a * {
  opacity: 2;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

/**
 * Make the accordion responsive using CSS media queries.
 */

@media screen and (max-width: 800px) {
  body {
    margin: 0;
  }

  .accordion3 {
    height: auto;
  }
  .accordion3 ul li, .accordion3 ul li:hover, .accordion3 ul:hover li, .accordion3 ul:hover li:hover {
    position: relative;
    display: table;
    table-layout: fixed;
    width: 100%;
    -webkit-transition: none;
    transition: none;
  }
}
/**
 * PRODUCT/Eterna / New SuperKonTiki 
 */

.accordion4 {
  width: 100%;
  max-width: 100%;
  height: 250px;
  overflow: hidden;
  margin: 10px auto;
}
.accordion4 ul {
  width: 100%;
  display: table;
  table-layout: fixed;
  margin: 0;
  padding: 0;
}
.accordion4 ul li {
  display: table-cell;
  vertical-align: bottom;
  position: relative;
  width: 16.666%;
  height: 150px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  transition: all 500ms ease;
}
.accordion4 ul li div {
  display: block;
  overflow: hidden;
  width: 100%;
}
.accordion4 ul li div a {
  display: block;
  height: 250px;
  width: 100%;
  position: relative;
  z-index: 3;
  vertical-align: bottom;
  padding: 10px 15px;
  box-sizing: border-box;
  color: #000;
  text-decoration: none;
  font-family: "iA Writer Quattro", Icons;
  transition: all 200ms ease;
	font-style: normal;
    font-size: 2px;
	font-weight: 400;
}
.accordion4 ul li div a * {
  opacity: 0;
  margin: 0;
  width: 100%;
  text-overflow: clip;
  position: relative;
  z-index: 5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-transform: translateX(-20px);
  transform: translateX(-20px);
  -webkit-transition: all 400ms ease;
  transition: all 400ms ease;
}
.accordion4 ul li div a h2 {
  font-family: "Infini GF", Icons;
  text-overflow: clip;
  font-size: 15px;
  text-transform: capitalize;
  margin-bottom: 1px;
  top: 180px;
	font-style: normal;
	font-weight: 700;
}
.accordion4 ul li div a p {
  top: 180px;
  font-size: 13.5px;
}

/**
 * Add background images to the accordion items.
 */
.accordion4 ul li:nth-child(1) {
  background-image: url("https://freight.cargo.site/t/original/i/24a0e0a3fca64b4d92ce5ee82b6a807a195a3a8ebb21095699ba37306cc78068/Antonio_Fazio_Eterna_SuperKonTiki_Kontiki_raft_2.jpg");
}
.accordion4 ul li:nth-child(2) {
  background-image: url("https://freight.cargo.site/t/original/i/db8549c99a0baa3755058bbcae8d1afb6e59a4f0d9a3f6e0330dd14d5bb37ec5/Antonio_Fazio_Eterna_SuperKonTiki_Kontiki_final-design_2_Homepage.jpg");
}
.accordion4 ul li:nth-child(3) {
  background-image: url("https://freight.cargo.site/t/original/i/845d6ee299080fc8e28c471e3733ef6b748fbf7ccff46814e9d08c9a93262c1f/Antonio_Fazio_Eterna_SuperKonTiki_Launch-Collection_Homepage_1.jpg");
}
.accordion4 ul li:nth-child(4) {
  background-image: url("https://freight.cargo.site/t/original/i/9f8a658ac67e91d0fe55b5da7a29b44edbdc0e82b75883a5c0a237168686a4da/Antonio_Fazio_Eterna-Super-Kontiki-Baselworld-2015_Black-Limited-Edition_Homepage.jpg");
}
.accordion4 ul li:nth-child(5) {
  background-image: url("https://freight.cargo.site/t/original/i/53c1d292090e936fcd5396d121a3c1228e504d981e7ef6ec4c60a813ce363543/Antonio_Fazio_Eterna_SuperKontiki_BlackEditionvideo_2bis_smaller_large_Homepage_small_optimized.gif");
}
/**
 * Expand the accordion item on mouse hover using :hover pseudo element.
 */
.accordion4 ul:hover li {
  width: 9%;
}
.accordion4 ul:hover li:hover {
  width: 30%;
}
.accordion4 ul:hover li:hover a {
  background: transparent;
}
.accordion4 ul:hover li:hover a * {
  opacity: 2;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

/**
 * Make the accordion responsive using CSS media queries.
 */

@media screen and (max-width: 800px) {
  body {
    margin: 0;
  }

  .accordion4 {
    height: auto;
  }
  .accordion4 ul li, .accordion4 ul li:hover, .accordion4 ul:hover li, .accordion4 ul:hover li:hover {
    position: relative;
    display: table;
    table-layout: fixed;
    width: 100%;
    -webkit-transition: none;
    transition: none;
  }
}
/**
 * PRODUCT/Swatch / Space Chocolate
 */

.accordion5 {
  width: 100%;
  max-width: 100%;
  height: 250px;
  overflow: hidden;
  margin: 10px auto;
}
.accordion5 ul {
  width: 100%;
  display: table;
  table-layout: fixed;
  margin: 0;
  padding: 0;
}
.accordion5 ul li {
  display: table-cell;
  vertical-align: bottom;
  position: relative;
  width: 16.666%;
  height: 150px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  transition: all 500ms ease;
}
.accordion5 ul li div {
  display: block;
  overflow: hidden;
  width: 100%;
}
.accordion5 ul li div a {
  display: block;
  height: 250px;
  width: 100%;
  position: relative;
  z-index: 3;
  vertical-align: bottom;
  padding: 10px 15px;
  box-sizing: border-box;
  color: #000;
  text-decoration: none;
  font-family: "iA Writer Quattro", Icons;
  transition: all 200ms ease;
	font-style: normal;
    font-size: 2px;
	font-weight: 400;
}
.accordion5 ul li div a * {
  opacity: 0;
  margin: 0;
  width: 100%;
  text-overflow: clip;
  position: relative;
  z-index: 5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-transform: translateX(-20px);
  transform: translateX(-20px);
  -webkit-transition: all 400ms ease;
  transition: all 400ms ease;
}
.accordion5 ul li div a h2 {
  font-family: "Infini GF", Icons;
  text-overflow: clip;
  font-size: 15px;
  text-transform: capitalize;
  margin-bottom: 1px;
  top: 180px;
	font-style: normal;
	font-weight: 700;
}
.accordion5 ul li div a p {
  top: 180px;
  font-size: 13.5px;
}

/**
 * Add background images to the accordion items.
 */
.accordion5 ul li:nth-child(1) {
  background-image: url("https://freight.cargo.site/t/original/i/3dfea67e6d8d8fa74473697373acb0ab1f1bd37c51115e8e2f4adb1dd6c064e2/Antonio_Fazio_Swatch_Space_Chocolate_STRAP-Model-1-grey_color_Homepage.gif");
}
.accordion5 ul li:nth-child(2) {
  background-image: url("https://freight.cargo.site/t/original/i/95371c89c35be09c4eccb2548b9057fd7c7b8325da001ecbccf8da1ff2b534d5/Antonio-Fazio_Swatch_Special-Project_Space-Chocolate_shape_Homepage.jpg");
}
.accordion5 ul li:nth-child(3) {
  background-image: url("https://freight.cargo.site/t/original/i/e1592ddb5aec13b5b1046650353ff2f60432730ed1ff7e8abd64dd288d8ab05e/Antonio-Fazio_Swatch_Special-Project_Space-Chocolate_vacuum-sealed_5_Homepage_small.jpg");
}
/**
 * Expand the accordion item on mouse hover using :hover pseudo element.
 */
.accordion5 ul:hover li {
  width: 9%;
}
.accordion5 ul:hover li:hover {
  width: 30%;
}
.accordion5 ul:hover li:hover a {
  background: transparent;
}
.accordion5 ul:hover li:hover a * {
  opacity: 2;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

/**
 * Make the accordion responsive using CSS media queries.
 */

@media screen and (max-width: 800px) {
  body {
    margin: 0;
  }

  .accordion5 {
    height: auto;
  }
  .accordion5 ul li, .accordion5 ul li:hover, .accordion5 ul:hover li, .accordion5 ul:hover li:hover {
    position: relative;
    display: table;
    table-layout: fixed;
    width: 100%;
    -webkit-transition: none;
    transition: none;
  }
}
/**
 * GRAPHIC / Her Line
 */

.accordion6 {
  width: 100%;
  max-width: 100%;
  height: 250px;
  overflow: hidden;
  margin: 10px auto;
}
.accordion6 ul {
  width: 100%;
  display: table;
  table-layout: fixed;
  margin: 0;
  padding: 0;
}
.accordion6 ul li {
  display: table-cell;
  vertical-align: bottom;
  position: relative;
  width: 16.666%;
  height: 150px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  transition: all 500ms ease;
}
.accordion6 ul li div {
  display: block;
  overflow: hidden;
  width: 100%;
}
.accordion6 ul li div a {
  display: block;
  height: 250px;
  width: 100%;
  position: relative;
  z-index: 3;
  vertical-align: bottom;
  padding: 10px 15px;
  box-sizing: border-box;
  color: #000;
  text-decoration: none;
  font-family: "iA Writer Quattro", Icons;
  transition: all 200ms ease;
	font-style: normal;
    font-size: 2px;
	font-weight: 400;
}
.accordion6 ul li div a * {
  opacity: 0;
  margin: 0;
  width: 100%;
  text-overflow: clip;
  position: relative;
  z-index: 5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-transform: translateX(-20px);
  transform: translateX(-20px);
  -webkit-transition: all 400ms ease;
  transition: all 400ms ease;
}
.accordion6 ul li div a h2 {
  font-family: "Infini GF", Icons;
  text-overflow: clip;
  font-size: 15px;
  text-transform: capitalize;
  margin-bottom: 1px;
  top: 180px;
	font-style: normal;
	font-weight: 700;
}
.accordion6 ul li div a p {
  top: 180px;
  font-size: 13.5px;
}

/**
 * Add background images to the accordion items.
 */
.accordion6 ul li:nth-child(1) {
  background-image: url("https://freight.cargo.site/t/original/i/436e8777e157aae232e5ffb56054b2170dcc8a9785125eede32c86d5605148d9/Antonio_Fazio_Her-Line_Logo-Solo_Homepage_3.jpg");
}
.accordion6 ul li:nth-child(2) {
  background-image: url("https://freight.cargo.site/t/original/i/f4d381ab715e3a347bc20ec203dfcc40d90d9c9a3c698e917c838e8630feb57d/Antonio_Fazio_Her-Line_Art-Direction-Lilya-Turki---Antonio-Fazio-Packaging_Homepage_small.jpg");
}
.accordion6 ul li:nth-child(3) {
  background-image: url("https://freight.cargo.site/t/original/i/17aedd948c675eec9c6b028f82a4912a68be7b408b78ecfad1535969d11caa6b/Antonio_Fazio_Her-Line_Magnificent-vintage-matte_Art-Direction-Lilya-Turki---Antonio-Fazio--Photography-by-Virginie-Kateeb_Homepage.jpg");
}
.accordion6 ul li:nth-child(4) {
  background-image: url("https://freight.cargo.site/t/original/i/49e49f48125cd176df87746883140a509167a0eb40d0fb6c73b737333b59f324/HER-LINE--Intro--Antonio-Fazio---Lilya-Turki_2_low_Homepage_small_optimized.gif");
}
/**
 * Expand the accordion item on mouse hover using :hover pseudo element.
 */
.accordion6 ul:hover li {
  width: 9%;
}
.accordion6 ul:hover li:hover {
  width: 30%;
}
.accordion6 ul:hover li:hover a {
  background: transparent;
}
.accordion6 ul:hover li:hover a * {
  opacity: 2;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

/**
 * Make the accordion responsive using CSS media queries.
 */

@media screen and (max-width: 800px) {
  body {
    margin: 0;
  }

  .accordion6 {
    height: auto;
  }
  .accordion6 ul li, .accordion6 ul li:hover, .accordion6 ul:hover li, .accordion6 ul:hover li:hover {
    position: relative;
    display: table;
    table-layout: fixed;
    width: 100%;
    -webkit-transition: none;
    transition: none;
  }
}
/**
 * GRAPHIC / Manifacto
 */

.accordion7 {
  width: 100%;
  max-width: 100%;
  height: 250px;
  overflow: hidden;
  margin: 10px auto;
}
.accordion7 ul {
  width: 100%;
  display: table;
  table-layout: fixed;
  margin: 0;
  padding: 0;
}
.accordion7 ul li {
  display: table-cell;
  vertical-align: bottom;
  position: relative;
  width: 16.666%;
  height: 150px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  transition: all 500ms ease;
}
.accordion7 ul li div {
  display: block;
  overflow: hidden;
  width: 100%;
}
.accordion7 ul li div a {
  display: block;
  height: 250px;
  width: 100%;
  position: relative;
  z-index: 3;
  vertical-align: bottom;
  padding: 10px 15px;
  box-sizing: border-box;
  color: #000;
  text-decoration: none;
  font-family: "iA Writer Quattro", Icons;
  transition: all 200ms ease;
	font-style: normal;
    font-size: 2px;
	font-weight: 400;
}
.accordion7 ul li div a * {
  opacity: 0;
  margin: 0;
  width: 100%;
  text-overflow: clip;
  position: relative;
  z-index: 5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-transform: translateX(-20px);
  transform: translateX(-20px);
  -webkit-transition: all 400ms ease;
  transition: all 400ms ease;
}
.accordion7 ul li div a h2 {
  font-family: "Infini GF", Icons;
  text-overflow: clip;
  font-size: 15px;
  text-transform: capitalize;
  margin-bottom: 1px;
  top: 180px;
	font-style: normal;
	font-weight: 700;
}
.accordion7 ul li div a p {
  top: 180px;
  font-size: 13.5px;
}

/**
 * Add background images to the accordion items.
 */
.accordion7 ul li:nth-child(1) {
  background-image: url("https://freight.cargo.site/t/original/i/ced85045d3f9c70ef6dd876653deb6ba48029263f38faf1c7e973007a2313525/Antonio-Fazio_Manifacto_logo-animated_FINAL_BLACK_Homepage_invert.gif");
}
.accordion7 ul li:nth-child(2) {
  background-image: url("https://freight.cargo.site/t/original/i/93fe6a1c10f36f31a7e3625255f195646e6563a9cd8fcbef8ae760ffa8c33d82/Antonio_Fazio_Manifacto_Stationery_Set-of-13-envelopes-and-approximately-100-sheets-of-letterhead-featuring-Manifacto-logo_Homepage_small.jpg");
}
.accordion7 ul li:nth-child(3) {
  background-image: url("https://freight.cargo.site/t/original/i/ca4eecb49e5a99f4a3936c9072558bc1e13ad6dcc150c8f9916166fd1e6c045f/Antonio_Fazio_Manifacto_siteweb_1_Homepage_1.jpg");
}
/**
 * Expand the accordion item on mouse hover using :hover pseudo element.
 */
.accordion7 ul:hover li {
  width: 9%;
}
.accordion7 ul:hover li:hover {
  width: 30%;
}
.accordion7 ul:hover li:hover a {
  background: transparent;
}
.accordion7 ul:hover li:hover a * {
  opacity: 2;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

/**
 * Make the accordion responsive using CSS media queries.
 */

@media screen and (max-width: 800px) {
  body {
    margin: 0;
  }

  .accordion7 {
    height: auto;
  }
  .accordion7 ul li, .accordion7 ul li:hover, .accordion7 ul:hover li, .accordion7 ul:hover li:hover {
    position: relative;
    display: table;
    table-layout: fixed;
    width: 100%;
    -webkit-transition: none;
    transition: none;
  }
}
/**
 * GRAPHIC / MAR
 */

.accordion8 {
  width: 100%;
  max-width: 100%;
  height: 250px;
  overflow: hidden;
  margin: 10px auto;
}
.accordion8 ul {
  width: 100%;
  display: table;
  table-layout: fixed;
  margin: 0;
  padding: 0;
}
.accordion8 ul li {
  display: table-cell;
  vertical-align: bottom;
  position: relative;
  width: 16.666%;
  height: 150px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  transition: all 500ms ease;
}
.accordion8 ul li div {
  display: block;
  overflow: hidden;
  width: 100%;
}
.accordion8 ul li div a {
  display: block;
  height: 250px;
  width: 100%;
  position: relative;
  z-index: 3;
  vertical-align: bottom;
  padding: 10px 15px;
  box-sizing: border-box;
  color: #000;
  text-decoration: none;
  font-family: "iA Writer Quattro", Icons;
  transition: all 200ms ease;
	font-style: normal;
    font-size: 2px;
	font-weight: 400;
}
.accordion8 ul li div a * {
  opacity: 0;
  margin: 0;
  width: 100%;
  text-overflow: clip;
  position: relative;
  z-index: 5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-transform: translateX(-20px);
  transform: translateX(-20px);
  -webkit-transition: all 400ms ease;
  transition: all 400ms ease;
}
.accordion8 ul li div a h2 {
  font-family: "Infini GF", Icons;
  text-overflow: clip;
  font-size: 15px;
  text-transform: capitalize;
  margin-bottom: 1px;
  top: 180px;
	font-style: normal;
	font-weight: 700;
}
.accordion8 ul li div a p {
  top: 180px;
  font-size: 13.5px;
}

/**
 * Add background images to the accordion items.
 */
.accordion8 ul li:nth-child(1) {
  background-image: url("https://freight.cargo.site/t/original/i/d08c1f7f650bf10ffcee8bbd289d5674be63ad268c1a915798dc6219095955a2/Antonio_Fazio_MAR_LOGO_construction_Homepage_1_color_3.jpg");
}
.accordion8 ul li:nth-child(2) {
  background-image: url("https://freight.cargo.site/t/original/i/8153f8db7210c51ea26b063bebf8c81ab198f33bcb2a403372dc4b4e4f74bbc7/Antonio_Fazio_MAR_Business-Cards_2_Homepage.jpg");
}
.accordion8 ul li:nth-child(3) {
  background-image: url("https://freight.cargo.site/t/original/i/aceee53baad9cfa5412685213fd29489e05285dae0613e290fc59bea71f4e2db/Antonio-Fazio_MAR_LogoPattern_Moving_1_Homepage_small_optimized.gif");
}
/**
 * Expand the accordion item on mouse hover using :hover pseudo element.
 */
.accordion8 ul:hover li {
  width: 9%;
}
.accordion8 ul:hover li:hover {
  width: 30%;
}
.accordion8 ul:hover li:hover a {
  background: transparent;
}
.accordion8 ul:hover li:hover a * {
  opacity: 2;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

/**
 * Make the accordion responsive using CSS media queries.
 */

@media screen and (max-width: 800px) {
  body {
    margin: 0;
  }

  .accordion8 {
    height: auto;
  }
  .accordion8 ul li, .accordion8 ul li:hover, .accordion8 ul:hover li, .accordion8 ul:hover li:hover {
    position: relative;
    display: table;
    table-layout: fixed;
    width: 100%;
    -webkit-transition: none;
    transition: none;
  }
}
/**
 * GRAPHIC / Patterns
 */

.accordion9 {
  width: 100%;
  max-width: 100%;
  height: 250px;
  overflow: hidden;
  margin: 10px auto;
}
.accordion9 ul {
  width: 100%;
  display: table;
  table-layout: fixed;
  margin: 0;
  padding: 0;
}
.accordion9 ul li {
  display: table-cell;
  vertical-align: bottom;
  position: relative;
  width: 16.666%;
  height: 150px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  transition: all 500ms ease;
}
.accordion9 ul li div {
  display: block;
  overflow: hidden;
  width: 100%;
}
.accordion9 ul li div a {
  display: block;
  height: 250px;
  width: 100%;
  position: relative;
  z-index: 3;
  vertical-align: bottom;
  padding: 10px 15px;
  box-sizing: border-box;
  color: #000;
  text-decoration: none;
  font-family: "iA Writer Quattro", Icons;
  transition: all 200ms ease;
	font-style: normal;
    font-size: 2px;
	font-weight: 400;
}
.accordion9 ul li div a * {
  opacity: 0;
  margin: 0;
  width: 100%;
  text-overflow: clip;
  position: relative;
  z-index: 5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-transform: translateX(-20px);
  transform: translateX(-20px);
  -webkit-transition: all 400ms ease;
  transition: all 400ms ease;
}
.accordion9 ul li div a h2 {
  font-family: "Infini GF", Icons;
  text-overflow: clip;
  font-size: 15px;
  text-transform: capitalize;
  margin-bottom: 1px;
  top: 180px;
	font-style: normal;
	font-weight: 700;
}
.accordion9 ul li div a p {
  top: 180px;
  font-size: 13.5px;
}

/**
 * Add background images to the accordion items.
 */
.accordion9 ul li:nth-child(1) {
  background-image: url("https://freight.cargo.site/t/original/i/bdb7f38bcca3deedd6484f8e5dbab31489be3dccd6d10e01bf07ddc104d6d23f/patterns-animated-thumbnail-400x280-3_Homepage_small.gif");
}
.accordion9 ul li:nth-child(2) {
  background-image: url("https://freight.cargo.site/t/original/i/5a39b337fbc50478e91cbbe39dafebeafe679af9e104e6fa556f720b4e64808f/Antonio-Fazio_Pattern-Study_Beta-Cloth-with-pattern-no_02to05_Homepage_small.jpg");
}
/**
 * Expand the accordion item on mouse hover using :hover pseudo element.
 */
.accordion9 ul:hover li {
  width: 9%;
}
.accordion9 ul:hover li:hover {
  width: 30%;
}
.accordion9 ul:hover li:hover a {
  background: transparent;
}
.accordion9 ul:hover li:hover a * {
  opacity: 2;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

/**
 * Make the accordion responsive using CSS media queries.
 */

@media screen and (max-width: 800px) {
  body {
    margin: 0;
  }

  .accordion9 {
    height: auto;
  }
  .accordion9 ul li, .accordion9 ul li:hover, .accordion9 ul:hover li, .accordion9 ul:hover li:hover {
    position: relative;
    display: table;
    table-layout: fixed;
    width: 100%;
    -webkit-transition: none;
    transition: none;
  }
}
/**
 * GRAPHIC / Lvx Aeterna
 */

.accordion10 {
  width: 100%;
  max-width: 100%;
  height: 250px;
  overflow: hidden;
  margin: 10px auto;
}
.accordion10 ul {
  width: 100%;
  display: table;
  table-layout: fixed;
  margin: 0;
  padding: 0;
}
.accordion10 ul li {
  display: table-cell;
  vertical-align: bottom;
  position: relative;
  width: 16.666%;
  height: 250px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  transition: all 500ms ease;
}
.accordion10 ul li div {
  display: block;
  overflow: hidden;
  width: 100%;
}
.accordion10 ul li div a {
  display: block;
  height: 250px;
  width: 100%;
  position: relative;
  z-index: 3;
  vertical-align: bottom;
  padding: 10px 15px;
  box-sizing: border-box;
  color: #000;
  text-decoration: none;
  font-family: "iA Writer Quattro", Icons;
  transition: all 200ms ease;
	font-style: normal;
    font-size: 2px;
	font-weight: 400;
}
.accordion10 ul li div a * {
  opacity: 0;
  margin: 0;
  width: 100%;
  text-overflow: clip;
  position: relative;
  z-index: 5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-transform: translateX(-20px);
  transform: translateX(-20px);
  -webkit-transition: all 400ms ease;
  transition: all 400ms ease;
}
.accordion10 ul li div a h2 {
  font-family: "Infini GF", Icons;
  text-overflow: clip;
  font-size: 15px;
  text-transform: capitalize;
  margin-bottom: 1px;
  top: 180px;
	font-style: normal;
	font-weight: 700;
}
.accordion10 ul li div a p {
  top: 180px;
  font-size: 13.5px;
}

/**
 * Add background images to the accordion items.
 */
.accordion10 ul li:nth-child(1) {
  background-image: url("https://freight.cargo.site/t/original/i/935fcae1590deb8ec6d55da2641022cd44f96e629a269f546c77c018404a7de5/Antonio-Fazio_lvx-aeterna_cards_pyramide-eye_silhouette_Homepage_color_2.jpg");
}
.accordion10 ul li:nth-child(2) {
  background-image: url("https://freight.cargo.site/t/original/i/de08097312eefe8187216fe698d09a68d06a8b66c9a9daad8ce53399c12e08a3/Antonio-Fazio_lvx-aeterna_sequence_design_Homepage_small.jpg");
}
.accordion10 ul li:nth-child(3) {
  background-image: url("https://freight.cargo.site/t/original/i/9eeccb89ed016f0eae70b724a8522dd3f7f40916dc52a17917520acfb8e9d140/Antonio_Fazio_Lvx-Aeterna_Zodiac-and-Stellar-Connection_3.jpg");
}
.accordion10 ul li:nth-child(4) {
  background-image: url("https://freight.cargo.site/t/original/i/c913c27e7b6501950ebfdd6fc66c1b7a06c32c4c3a264c37545facb471f16619/Antonio_Faizo_Lvx-Aeterna_Animation_Eye-solo_first-part_Homepage.gif");
}
/**
 * Expand the accordion item on mouse hover using :hover pseudo element.
 */
.accordion10 ul:hover li {
  width: 9%;
}
.accordion10 ul:hover li:hover {
  width: 30%;
}
.accordion10 ul:hover li:hover a {
  background: transparent;
}
.accordion10 ul:hover li:hover a * {
  opacity: 2;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}
/**
 * Make the accordion responsive using CSS media queries.
 */

@media screen and (max-width: 800px) {
  body {
    margin: 0;
  }

  .accordion10 {
    height: auto;
  }
  .accordion10 ul li, .accordion10 ul li:hover, .accordion10 ul:hover li, .accordion10 ul:hover li:hover {
    position: relative;
    display: table;
    table-layout: fixed;
    width: 100%;
    -webkit-transition: none;
    transition: none;
  }
}
/**
 * GRAPHIC / Maserati
 */

.accordion13 {
  width: 100%;
  max-width: 100%;
  height: 250px;
  overflow: hidden;
  margin: 10px auto;
}
.accordion13 ul {
  width: 100%;
  display: table;
  table-layout: fixed;
  margin: 0;
  padding: 0;
}
.accordion13 ul li {
  display: table-cell;
  vertical-align: bottom;
  position: relative;
  width: 16.666%;
  height: 250px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  transition: all 500ms ease;
}
.accordion13 ul li div {
  display: block;
  overflow: hidden;
  width: 100%;
}
.accordion13 ul li div a {
  display: block;
  height: 250px;
  width: 100%;
  position: relative;
  z-index: 3;
  vertical-align: bottom;
  padding: 10px 15px;
  box-sizing: border-box;
  color: #000;
  text-decoration: none;
  font-family: "iA Writer Quattro", Icons;
  transition: all 200ms ease;
	font-style: normal;
    font-size: 2px;
	font-weight: 400;
}
.accordion13 ul li div a * {
  opacity: 0;
  margin: 0;
  width: 100%;
  text-overflow: clip;
  position: relative;
  z-index: 5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-transform: translateX(-20px);
  transform: translateX(-20px);
  -webkit-transition: all 400ms ease;
  transition: all 400ms ease;
}
.accordion13 ul li div a h2 {
  font-family: "Infini GF", Icons;
  text-overflow: clip;
  font-size: 15px;
  text-transform: capitalize;
  margin-bottom: 1px;
  top: 180px;
	font-style: normal;
	font-weight: 700;
}
.accordion13 ul li div a p {
  top: 180px;
  font-size: 13.5px;
}

/**
 * Add background images to the accordion items.
 */
.accordion13 ul li:nth-child(1) {
  background-image: url("https://freight.cargo.site/t/original/i/4deb70b2de7a5af7e9c8ef4d6aef3cafd304932a0687119650313951808d7f99/FONT-STUDY10_Homepage.jpg");
}
/**
 * Expand the accordion item on mouse hover using :hover pseudo element.
 */
.accordion13 ul:hover li {
  width: 9%;
}
.accordion13 ul:hover li:hover {
  width: 30%;
}
.accordion13 ul:hover li:hover a {
  background: transparent;
}
.accordion13 ul:hover li:hover a * {
  opacity: 2;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}
/**
 * Make the accordion responsive using CSS media queries.
 */

@media screen and (max-width: 800px) {
  body {
    margin: 0;
  }

  .accordion13 {
    height: auto;
  }
  .accordion13 ul li, .accordion13 ul li:hover, .accordion13 ul:hover li, .accordion13 ul:hover li:hover {
    position: relative;
    display: table;
    table-layout: fixed;
    width: 100%;
    -webkit-transition: none;
    transition: none;
  }
}
/**
 * GRAPHIC / Hennessy for the NBA
 */

.accordion12 {
  width: 100%;
  max-width: 100%;
  height: 250px;
  overflow: hidden;
  margin: 10px auto;
}
.accordion12 ul {
  width: 100%;
  display: table;
  table-layout: fixed;
  margin: 0;
  padding: 0;
}
.accordion12 ul li {
  display: table-cell;
  vertical-align: bottom;
  position: relative;
  width: 16.666%;
  height: 250px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  transition: all 500ms ease;
}
.accordion12 ul li div {
  display: block;
  overflow: hidden;
  width: 100%;
}
.accordion12 ul li div a {
  display: block;
  height: 250px;
  width: 100%;
  position: relative;
  z-index: 3;
  vertical-align: bottom;
  padding: 10px 15px;
  box-sizing: border-box;
  color: #000;
  text-decoration: none;
  font-family: "iA Writer Quattro", Icons;
  transition: all 200ms ease;
	font-style: normal;
    font-size: 2px;
	font-weight: 400;
}
.accordion12 ul li div a * {
  opacity: 0;
  margin: 0;
  width: 100%;
  text-overflow: clip;
  position: relative;
  z-index: 5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-transform: translateX(-20px);
  transform: translateX(-20px);
  -webkit-transition: all 400ms ease;
  transition: all 400ms ease;
}
.accordion12 ul li div a h2 {
  font-family: "Infini GF", Icons;
  text-overflow: clip;
  font-size: 15px;
  text-transform: capitalize;
  margin-bottom: 1px;
  top: 180px;
	font-style: normal;
	font-weight: 700;
}
.accordion12 ul li div a p {
  top: 180px;
  font-size: 13.5px;
}

/**
 * Add background images to the accordion items.
 */
.accordion12 ul li:nth-child(1) {
  background-image: url("https://freight.cargo.site/t/original/i/ac604dcedee781aa24a382a68acac71b0f813368de238f68f65b731656bac3bb/FlawlessDimpledCaiman-size_restricted_9_Homepage_optimized.gif");
}
/**
 * Expand the accordion item on mouse hover using :hover pseudo element.
 */
.accordion12 ul:hover li {
  width: 9%;
}
.accordion11 ul:hover li:hover {
  width: 30%;
}
.accordion12 ul:hover li:hover a {
  background: transparent;
}
.accordion12 ul:hover li:hover a * {
  opacity: 2;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}
/**
 * Make the accordion responsive using CSS media queries.
 */

@media screen and (max-width: 800px) {
  body {
    margin: 0;
  }

  .accordion12 {
    height: auto;
  }
  .accordion12 ul li, .accordion12 ul li:hover, .accordion12 ul:hover li, .accordion12 ul:hover li:hover {
    position: relative;
    display: table;
    table-layout: fixed;
    width: 100%;
    -webkit-transition: none;
    transition: none;
  }
}
/**
 * About (can be removed).
 */

.about {
  text-align: center;
  font-family: 'Open Sans', sans-serif;
  font-size: 12px;
  color: #666;
}
.about a {
  color: blue;
  text-decoration: none;
}
.about a:hover {
  text-decoration: underline;
}