@charset "UTF-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/
img, object, embed, video {
	max-width: 100%;
}
.tittle_head_h1 {
  position: absolute;
  top: 22%;
  right: 10%;
  font-size: 72px;
  color: black;
  display: block;
}
.subtittle_head_h1 {
  position: absolute;
  top: 34%;
  right: 10%;
  font-size: 28px;
  color: black;
  display: block;
}


.unselectable, .flex-control-thumbs img {
    /* For Opera and <= IE9, we need to add unselectable="on" attribute onto each element */
    /* Check this site for more details: http://help.dottoro.com/lhwdpnva.php */
    -moz-user-select: none; /* These user-select properties are inheritable, used to prevent text selection */
    -webkit-user-select: none;
    -ms-user-select: none; /* From IE10 only */
    user-select: none; /* Not valid CSS yet, as of July 2012 */

    -webkit-user-drag: none; /* Prevents dragging of images/divs etc */
    user-drag: none;
}

/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
	width:100%;
}

/*

@font-face {
  font-family: 'ecolight';
  src: url('../fonts/ModernH-EcoLight.eot?#iefix') format('embedded-opentype'),  url('../fonts/ModernH-EcoLight.woff') format('woff'), url('../fonts/ModernH-EcoLight.ttf')  format('truetype'), url('../fonts/ModernH-EcoLight.svg#ModernH-EcoLight') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'eco';
  src: url('../fonts/ModernH-Light.eot?#iefix') format('embedded-opentype'),  url('../fonts/ModernH-Light.woff') format('woff'), url('../fonts/ModernH-Light.ttf')  format('truetype'), url('../fonts/ModernH-Light.svg#ModernH-Light') format('svg');
  font-weight: normal;
  font-style: normal;
}
*/

@font-face {
    font-family: 'eco';
    src: url('../fonts/modern_h_light-webfont.eot');
    src: url('../fonts/modern_h_light-webfontd41d.eot?#iefix') format('embedded-opentype'),
         url('../fonts/modern_h_light-webfont.html') format('woff2'),
         url('../fonts/modern_h_light-webfont.woff') format('woff'),
         url('../fonts/modern_h_light-webfont.ttf') format('truetype'),
         url('../fonts/modern_h_light-webfont.svg#modern_hlight') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ecolight';
    src: url('../fonts/modern_h_eco_light-webfont.eot');
    src: url('../fonts/modern_h_eco_light-webfontd41d.eot?#iefix') format('embedded-opentype'),
         url('../fonts/modern_h_eco_light-webfont.html') format('woff2'),
         url('../fonts/modern_h_eco_light-webfont.woff') format('woff'),
         url('../fonts/modern_h_eco_light-webfont.ttf') format('truetype'),
         url('../fonts/modern_h_eco_light-webfont.svg#modern_hecolight') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
  font-family: "Hyundai Sans";
  font-style: italic;
  font-weight: 300;
  src: url("../font/HyundaiSansTextOffice-Italicd41d.html?") format("eot"), url("../font/HyundaiSansTextOffice-Italic.html") format("truetype"), url("../font/HyundaiSansTextOffice-Italic-2.html#Hyundai_Sans") format("svg");
}
@font-face {
  font-family: "Hyundai Sans";
  font-style: normal;
  font-weight: 300;
  src: url("../fonts/HyundaiSansTextOffice-Regulard41d.html?") format("eot"), url("../fonts/HyundaiSansTextOffice-Regular.ttf") format("truetype"), url("../fonts/HyundaiSansTextOffice-Regular.html#Hyundai_Sans") format("svg");
}
@font-face {
  font-family: "Hyundai Sans";
  font-style: normal;
  font-weight: 500;
  src: url("../font/HyundaiSansTextOffice-Mediumd41d.html?") format("eot"), url("../font/HyundaiSansTextOffice-Medium.html") format("truetype"), url("../font/HyundaiSansTextOffice-Medium-2.html#Hyundai_Sans") format("svg");
}
@font-face {
  font-family: "Hyundai Sans";
  font-style: normal;
  font-weight: 700;
  src: url("../font/HyundaiSansTextOffice-Boldd41d.html?") format("eot"), url("../font/HyundaiSansTextOffice-Bold.html") format("truetype"), url("../font/HyundaiSansTextOffice-Bold-2.html#Hyundai_Sans") format("svg");
}
@font-face {
  font-family: "Hyundai Sans H";
  font-style: normal;
  font-weight: 300;
  src: url("../font/HyundaiSansHeadOffice-Lightd41d.html?") format("eot"), url("../font/HyundaiSansHeadOffice-Light.html") format("truetype"), url("../font/HyundaiSansHeadOffice-Light-2.html#Hyundai_Sans_H") format("svg");
}
@font-face {
  font-family: "Hyundai Sans H";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/HyundaiSansHeadOffice-Regulard41d.html?") format("eot"), url("../fonts/HyundaiSansHeadOffice-Regular.ttf") format("truetype"), url("../fonts/HyundaiSansHeadOffice-Regular.html#Hyundai_Sans_H") format("svg");
}
@font-face {
  font-family: "Hyundai Sans H";
  font-style: normal;
  font-weight: 500;
  src: url("../fonts/HyundaiSansHeadOffice-Mediumd41d.html?") format("eot"), url("../fonts/HyundaiSansHeadOffice-Medium.ttf") format("truetype"), url("../fonts/HyundaiSansHeadOffice-Medium.html#Hyundai_Sans_H") format("svg");
}

/*
	Dreamweaver Fluid Grid Properties
	----------------------------------
	dw-num-cols-mobile:		5;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	10;
	dw-gutter-percentage:	25;
	
	Inspiration from "Responsive Web Design" by Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	and Golden Grid System by Joni Korpi
	http://goldengridsystem.com/
*/

/* Mobile Layout: 480px and below. */
body{ background:#fff !important}
.title_h1{position: absolute; top:-30px; left: 50%; transform: translate(-50%,0)}
.title_h1 h3{color:#fff !important}
.title_h1 p{color:#fff !important; font-weight: 300 !important}
.tittle_head{position: absolute;top: 24%; left: 10%; font-size: 72px; color: black; display: block}
.tittle_headsanta{position: absolute;top: 24%; left: 10%; font-size: 72px; color: white;display: block}
.tittle_headsanta2{position: absolute;top: 24%; right: 10%; font-size: 72px; color: white;display: block; text-align: right}
.tittle_headi20{position: absolute;top: 10%; right: 10%; font-size: 72px; color: white; display: block}
.subtittle_headsanta{position: absolute;top: 34%; left: 10%; font-size: 28px; color: white;display: block}
.subtittle_headi10{position: absolute;top: 34%; left: 10%; font-size: 28px; color: black;display: block}
.award{position: absolute; bottom: 10%; right: 8%;display: block}
.awardsanta{position: absolute; bottom: 10%; left: 10%;display: block}
.awardsanta2{position: absolute; bottom: 20%; right: 10%;display: block}
.awardh1{position: absolute; bottom: 10%; left: 5%;display: block}
.sect3-2-tucson p{ font-size: 16px; margin-top: 20px; text-align: center}
.cta {
	width: 100%;
	display: block;
	position: relative;
	text-align: center;
margin-bottom: 30px;}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{ font-family: "Hyundai Sans H",Roboto,"Helvetica Neue",serif!important; font-weight: 500;
}
.brake{ 
	font-family: "Hyundai Sans H",Roboto,"Helvetica Neue",serif!important; font-weight: 500;
	margin-top: 30px;
}
.brake h3{font-size: 40px;}
.brake p{
	font-family: 'Hyundai Sans',serif!important; font-weight: 300;
	font-size: 18px;
}
.cta a{ color: white;}
.cta a:hover{ color: white;}
.cta a:active{ color: white;}
.cta a:focus{ color: white;}
.cta-btn {
    width: auto;
	margin: 20px 30px 15px 0;
	padding: 16px 20px;
	font-family: "Hyundai Sans H",Roboto,"Helvetica Neue",serif;
	font-size: 17px;
	font-weight: 400;
	color: #fff;
	transition: all .2s;
	display: inline-block;
	line-height: 1em;
	text-decoration: none;
	cursor: pointer;
	background-color: #002c5f;}
.gridContainer {
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	padding-left: 1.96%;
	padding-right: 1.96%;
}
#LayoutDiv1 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}

.row{ margin-left:0px !important;margin-right:0px !important}
.header{ padding:10px 0px}
.logo{ margin-top:10px;}
.logo img{ width:auto}
.top{ background: rgba(255,255,255,0.7);
    border-bottom: 1px solid #c5c5c5;
    position: fixed;
    width: 100%;
    z-index: 999;}
.scrolled{
	background: #fff;
	transition: all ease-in-out 0.3s;
}
.scrolled-sp{
  opacity: 0;
  transition: all ease-in-out 0.3s;
}
.section-bottom-home-image{ width:100%; height:210px; float:left; overflow:hidden; background-color: black }
.section-bottom-home-image img{ width:100%}
.section-bottom-home{ width:100%; height:180px; float:left; overflow:hidden; background:#fff; padding:20px; font-size:18px;}
.section-bottom-home span{font-size:14px;}
.section-bottom-home a{ color:inherit}
.section-bottom-home h2{ color:#3060a2; font-family:'Hyundai Sans',serif;font-weight: 300; padding:0; margin:0; font-size:22px; position:relative; margin-bottom:20px}
.section-bottom-home h2:after {
    content: "";
    width: 30px;
    height: 2px;
    position: absolute;
    bottom: -5px;
    left: 0%;
    text-align: center;
    background: #c0c0c0;
}
.section-bottom-home p{ color:#000; font-family: "Hyundai Sans H",Roboto,"Helvetica Neue",serif;font-weight: 500;
line-height: 1.3em; padding:0; margin:0; font-size:18px!important; margin:7px 0px; float:left;}
.footer{ background:#e4dcd3; padding:30px 0px; border-top:2px solid #fff}
.bottom-footer{ background:#fff;padding:10px 0px;}
.i-sosmed{ width:50px; height:50px; float:right; margin-left:7px; margin-right:7px; margin-top:0;}
.text-footer{ text-align:center; font-family:'Hyundai Sans',serif; color:#000; font-size:12px; padding-top:10px; font-weight: 300}
.wow{ z-index:100}
.col-article{ width:33%; padding-left:5px; padding-right:5px; float:left;margin-top:10px;}
.col-footer{width:50%; padding-left:5px; padding-right:5px; float:left;}
.col-community span{ font-family:Arial, Helvetica, sans-serif; color:#000; font-size:13px; margin:0; padding:0; font-weight:800}
.col-community p{ font-size:13px; margin:0;font-family:'Hyundai Sans',serif; font-weight: 300; line-height:28px; color:#000}
.col-community a{ color:inherit}
.community{ background:#dadada; padding:5px 0px;}
.community img, .footer img{ width:auto}
.col-community{width:75%; padding-left:5px; padding-right:5px; float:left;}
.col-community2{width:25%; padding-left:5px; padding-right:5px; float:right;}
.ebrochure{
  width:auto;
  height:28px;
  float:right;
  text-align:right;
  display: flex;
  align-items: center;
  /* background-color: #002c5f; */
  padding: 10px;
  border-radius: 5px;
}
.ebrochure img{ width:100%;}
/* SANTAFE */
.big-image{ width:100%; height:auto; text-align:center; float:left; position:relative; z-index:0;}
.big-main-image{ width:100%; height:auto; text-align:center; float:left; position:relative; z-index:0;padding: 120px 50px 0;
    background: center no-repeat url(../images/d-grey-sky-bg.jpg);
    background-size: cover;}
.big-image img{ width:100%;}
.wrap-menu-sticky{ width:100%; max-width:1250px;margin:auto;}
.container-sticky{ background:#fff; overflow:hidden}
.menu-sticky{width:100%; height:auto; background:#e4dcd3; float:left; height:72px; position:relative; z-index: 1000;}
.title-home{width:100%; margin:auto; margin-top:20px;overflow:hidden; padding:60px 60px; font-size:18px; max-width:1024px; line-height:30px; z-index:0}
.title-home h2{color:#000; font-family:"Hyundai Sans H",Roboto,"Helvetica Neue",serif; font-weight: 500; padding:0; margin:0; font-size:45px; position:relative; margin-bottom:20px; text-align:center; text-transform:none}
.title-santafe{ width:100%; margin:auto; margin-top:20px;overflow:hidden; padding:90px 60px; font-size:18px; max-width:1024px; line-height:30px; z-index:0}
.title-santafe h2{ color:#000; font-family:'Hyundai Sans',serif; font-weight: 300; padding:0; margin:0; font-size:45px; position:relative; margin-bottom:20px; text-align:center; text-transform:none}
.title-santafe h2:after {
    content: "";
    width: 150px;
    height: 3px;
    position: absolute;
    bottom: -30px;
    left: 50%;
	margin-left: -75px;
    text-align: center;
    background: #000000;
}
.title-santafe h3{ color:#000; font-family:'Hyundai Sans',serif; padding:0; margin:0; font-size:45px; position:relative; margin-bottom:20px; text-align:center; text-transform:normal}
.title-santafe p{ color:#000; font-family:'Hyundai Sans',serif; line-height: 1.4em;font-size: 20px;font-weight: 300; padding:0; margin:0; font-size:19px; margin:30px 0px; float:left; text-align:center; width:100%}
.stickit {
	position: fixed;
	top: 0;
	z-index:10000;
}

.stickit-end {
	bottom: 0px;
	position: absolute;
	right: 0;
}
.logo-santafe{ float:left; border-right:#4b4b4b 1px solid; text-align:center; padding:16px 18px; display:block}
.logo-santafe-mobile{ float:left; width:100%; text-align:center; padding-top:10px;}
.thumbnail-video{ width:67.5%; height:185px; position:absolute; right:150px; bottom:150px;}
.thumbnail-video-h1{ width:67.5%; height:185px; position:absolute; left:150px; bottom:150px;}
.section-1-3{ background:#e4dcd3; padding:90px 0px}
.sect3-1{ width:50%; float:left; height:auto; margin-bottom:0px; overflow:hidden; padding: 0 15px}
.sect3-1 img{ width:100%}
.sect3-1 h4{ color:#000; font-family:'Hyundai Sans',serif; font-weight: 300; padding:0 5px; margin:0; font-size:45px; position:relative; margin-bottom:20px; text-align:left; text-transform:none;}
.sect3-1 h4:after {
    content: "";
    width: 150px;
    height: 2px;
    position: absolute;
    bottom: -20px;
    left: 0%;
    text-align: center;
    background: #000;
}
.sect3-1 p{ color:#000; font-family:'Hyundai Sans',serif;font-weight: 300; padding:0; margin:0; font-size:19px; margin:25px 0px 35px 0px; float:left; text-align:left; width:100%}
.sect3-2{ width:23%; float:left; position:relative; margin:1%; height:160px; overflow:hidden}
.sect3-2 img{ width:100%}
.sect3-2new{ width:19%; float:left; position:relative; margin:0.5%; height:120px; overflow:hidden}
.sect3-2new img{ width:100%}
.sect3-2:first-child{ margin-left:0px; float:left;}
.gallery-convenience{ background:rgb(246, 243, 242); padding:20px 0px; width:100%; float:left;}
.sect2-1{ width:30%; margin:1%; float:left; height:180px; overflow:hidden}
.sect2-1 img{ width:100%}
.section-5{ background:#f0ebe5;}
.section-6{ float:left; width:100%}
.section-7{ float:left; width:100%}
.box-gallery-sf{ width:100%; max-width:1500px; margin:auto; margin-top:40px; position:relative}
.box-gallery-sf p{ margin:5px; text-align:left; font-style:italic; font-size:13px}
.thumb-gsf{ width:16.640625%; float:left; max-height:180px; overflow:hidden}
.thumb-gsf img{ width:100% !important}
.sect6-1{ width:50%; float:left; height:auto; margin-bottom:30px}
.sect6-1 h3{ color:#000; font-family:'Hyundai Sans',serif; font-weight: 300; padding:0; margin:0; font-size:45px; position:relative; margin-bottom:20px; text-align:left; text-transform:none;}
.sect6-1 h4{ color:#000; font-family:'Hyundai Sans',serif; font-weight: 300; padding:0; margin:0; font-size:18px; position:relative; margin-bottom:5px; text-align:left; text-transform:none;}
.sect6-1 p{ color:#000; font-family:'Hyundai Sans',serif; font-weight: 300; padding:0; margin:0; font-size:15px; margin:0px 0px; float:left; text-align:left; width:100%}
.maps{ width:100%; max-width:250px; float:left; margin-bottom:20px}
.white{ background:#e4dcd3; padding:70px 0px; float:left; width:100%}
.listacar{margin-left: 10px;font-size: 18px;border-bottom: 1px solid;margin-right: 10px;padding-bottom: 5px; display:block}
.sticki {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 9999;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
#topbox{ width:100%; height:100%}
nav {width: 100%;}
.bgvehicle{ width:100%; background:#929291 url(../images/vehiclebg.jpg) center top no-repeat; height:auto; padding-bottom:0;}
.wrap_vehicle{ position:relative; margin-top:50px; z-index:0}
.vgrandi10{ width:auto; float:left; margin-left:200px; margin-top:0;}
.vgrandavega{ width:auto; float:right; margin-right:170px; margin-top:0;}
.vsantafe{ width:auto; float:left; margin-left:20px}
.vtucson{ width:auto; float:right; margin-right:30px}
.vh1{ width:auto; float:left; margin-left:100px}
.vstarex{ width:auto; float:right; margin-right:130px}
.vgrandi10 img, .vgrandavega img, .vsantafe img, .vtucson img, .vh1 img, .vstarex img{-moz-transition:-moz-transform 0.3s ease-in; 
-webkit-transition:-webkit-transform 0.3s ease-in; 
-o-transition:-o-transform 0.3s ease-in;}
.vgrandi10 img:hover, .vgrandavega img:hover, .vsantafe img:hover, .vtucson img:hover, .vh1 img:hover, .vstarex img:hover{
-moz-transform:scale(1.03); 
-webkit-transform:scale(1.03);
-o-transform:scale(1.03);
}
/* ARTICLE */
.top-article{ width:98%; margin-left:5px; float:left; position:relative; background:#fff; margin-top:28px;position:relative; z-index:0}
.top-article-image{ width:66.4%; float:left;}
.top-article-image img{ width:100%;}
.top-article-title{ width:33.6%; float:left; padding:20px;}
.top-article-title a{ color:inherit}
.top-article-title h2{ color:#3060a2; font-family:'Hyundai Sans',serif; font-weight: 300; padding:0; margin:0; font-size:29px; position:relative; margin-bottom:20px}
.top-article-title h2:after {
    content: "";
    width: 50px;
    height: 3px;
    position: absolute;
    bottom: -10px;
    left: 0%;
    text-align: center;
    background: #c0c0c0;
}
.top-article-title p{ color:#000; font-family:'Hyundai Sans',serif; font-weight: 300; padding:0; margin:0; font-size:26px; margin:10px 0px; float:left;}
.breadcrumb-hyundai{ background:#e4dcd3; padding:10px 0; color:#000; font-family:'Hyundai Sans',serif; font-weight: 300; font-size:13px; text-transform:uppercase; z-index:0;}
.title-detailarticle{ width:100%; margin:auto; margin-top:20px;overflow:hidden; padding:30px; font-size:18px; max-width:1024px; line-height:30px; z-index:0}
.title-detailarticle h2{ color:#5b5b5b; font-family:'Hyundai Sans',serif; font-weight: 300; padding:0; margin:0; font-size:45px; position:relative; margin-bottom:20px; text-align:center;}
.title-detailarticle h2:after {
    content: "";
    width: 150px;
    height: 3px;
    position: absolute;
    bottom: -30px;
    left: 50%;
	margin-left: -75px;
    text-align: center;
    background: #060606;
}
.title-detailarticle h4{ color:#060606; font-family:'Hyundai Sans',serif; font-weight: 300; padding:0; margin:0; font-size:16px; position:relative; margin-top:50px; text-align:center;}
.article-body{ background:#fff; position:relative; padding:65px 0px}
.share-detailarticle{ width:100%; margin:auto; margin-top:0px;overflow:hidden; text-align:center; position:relative; z-index:0}
.share-detailarticle img{ width:auto; margin:0px 3px}
.detailarticle{ font-family:'Hyundai Sans',serif; font-weight: 300; font-size:18px;}
.article-related{ width:100%; float:left;}
.title-related{ width:100%; margin:auto; margin-top:20px;overflow:hidden; padding:30px; font-size:18px; max-width:1024px; line-height:30px;}
.title-related h2{ color:#000; font-family:'Hyundai Sans',serif; font-weight: 500; padding:0; margin:0; font-size:30px; position:relative; margin-bottom:20px; text-align:center; text-transform:uppercase}
.title-related h2:after {
    content: "";
    width: 150px;
    height: 3px;
    position: absolute;
    bottom: -30px;
    left: 50%;
	margin-left: -75px;
    text-align: center;
    background: #000000;
}

.foto-pm{ width:auto; margin:20px auto; text-align:center; z-index:0; position:relative}
.foto-pm h3{ text-align:center; font-family:'Hyundai Sans',serif; font-weight: 300; font-size:22px; font-weight:700}
/*PRICELIST */
.box-pricelist{ width:50%; float:left; position:relative; padding:10px; z-index:0}
.box-pricelist h1, .box-pricelist h2{ padding:0; margin:0; text-align:center; font-family:"Hyundai Sans H",Roboto,"Helvetica Neue",sans-serif; font-weight: 500; font-size:20px;}
.tabel{ background:#ebebeb; font-family:'Hyundai Sans',serif; font-weight: 300; padding:10px; font-size:14px; margin-top:10px;}
.tabel-list{ border-bottom:1px solid #000;}
.tabel-cell{ width:45%; padding:5px 0px;}
.tabel-transmisi{padding:5px 0px;}
/*NETWORKS*/
.sole{ background:#f3f3f3; margin-top:0px !important; padding:20px; position:relative; z-index:0}
.agent{ text-align:right;font-family:'Hyundai Sans',serif; font-weight: 300;}
.agent h1{ font-size:22px; text-align:right; margin-bottom:20px; padding-right:20px}
.agent p{ font-size:16px;padding-right:20px}
.distributor{ text-align:left;font-family:'Hyundai Sans',serif; font-weight: 300;}
.distributor h1{ font-size:22px; text-align:left; margin-bottom:20px;padding-left:20px}
.distributor p{ font-size:16px;padding-left:20px}
.box-network{ background:#f3f3f3; padding:10px;text-align:left;font-family:'Hyundai Sans',serif; font-weight: 300; width:100%; min-height:260px}
.box-network h1{ font-size:20px; text-align:left; margin-bottom:20px; margin-top:10px }
.box-network p{ font-size:15px;}
.select{ width:75% !important; float:left;}
.filter{ width:45%; position:absolute; left:30%; top:40%;font-family:'Hyundai Sans',serif; font-weight: 300;}
.form-control { border-radius:0px !important; height:43px !important}
.submit-gallery{ background:#000; color:#fff; text-align:center; padding:14px 15px; border:0; font-size:11px; float:left; margin-left:5px; min-width:54px;font-family:'Hyundai Sans',serif; font-weight: 300;}

/* TUCSON */
.section-1-3-tucson{ background:#f6f3f2; padding:0px 0px; padding-bottom:90px}
.sect3-2-tucson{ width:31.333%; float:left; position:relative; margin:1%; height:200px; overflow:hidden}
.sect3-2-tucson img{ width:100%}
.sect3-2-tucson:first-child{ margin-left:0px; float:left;}
.gallery-convenience-tucson{ background:#f6f3f2; padding:90px 0px; width:100%; float:left;}
.gallery-convenience-tucson-xg{ background:#f6f3f2; padding:90px 0px; width:100%; float:left;}
.sect2-1-tucson{ width:23%; margin:1%; float:left; height:140px; overflow:hidden}
.sect2-1-tucson img{ width:100%}

.table-hover>tbody>tr:hover{background-color:#e1e1e1 !important;}
.edw{ opacity:.5}
.edw:hover{ opacity:1;}

/* -------------------------------- 

Main Components 360

-------------------------------- */
.cd-product-viewer-wrapper {
  text-align: center;
  padding: 2em 0;
  padding-bottom: 0;
}
.cd-product-viewer-wrapper > div {
  display: inline-block;
  width: 100%;
}
.cd-product-viewer-wrapper .product-viewer {
  position: relative;
  z-index: 1;
  display: inline-block;
  overflow: hidden;
  width: 100%;
}
.cd-product-viewer-wrapper img {
  /* this is the image visible before the image sprite is loaded */
  display: block;
  position: relative;
  z-index: 1;
}
.cd-product-viewer-wrapper .product-sprite {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  height: 100%;
  /* our image sprite is composed by 16 frames */
  width: 3600%;
  background: url(../images/santafe/phantom-black-360.html) no-repeat center center;
  background-size: 100% !important;
  opacity: 0;
  -webkit-transition: background 0.3s;
  -moz-transition: background 0.3s;
  transition: background 0.3s;
}
.cd-product-viewer-wrapper .product-sprite2 {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  height: 100%;
  /* our image sprite is composed by 16 frames */
  width: 3600%;
  background: url(../images/kona/chalk-white.jpg) no-repeat center center;
  background-size: 100% !important;
  opacity: 0;
  -webkit-transition: background 0.3s;
  -moz-transition: background 0.3s;
  transition: background 0.3s;
}
.cd-product-viewer-wrapper.loaded .product-sprite {
  /* image sprite has been loaded */
  opacity: 1;
  cursor: ew-resize;
}

.cd-product-viewer-handle {
  position: relative;
  z-index: 2;
  width: 60%;
  max-width: 300px;
  border-radius: 50em;
  margin: 1em auto 3em;
  height: 4px;
  background: #4d4d4d;
}
.cd-product-viewer-handle .fill {
  /* this is used to create the loading fill effect */
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  border-radius: inherit;
  background: #b54240;
  -webkit-transform: scaleX(0);
  -moz-transform: scaleX(0);
  -ms-transform: scaleX(0);
  -o-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -ms-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
  -webkit-transition: -webkit-transform 0.5s;
  -moz-transition: -moz-transform 0.5s;
  transition: transform 0.5s;
}
.no-csstransitions .cd-product-viewer-handle .fill {
  display: none;
}
.loaded .cd-product-viewer-handle .fill {
  /* image sprite has been loaded */
  opacity: 0;
  -webkit-transition: -webkit-transform 0.3s, opacity 0.2s 0.3s;
  -moz-transition: -moz-transform 0.3s, opacity 0.2s 0.3s;
  transition: transform 0.3s, opacity 0.2s 0.3s;
}
.cd-product-viewer-handle .handle {
  position: absolute;
  z-index: 2;
  display: inline-block;
  height: 44px;
  width: 44px;
  left: 0;
  top: -20px;
  background: #b54240 url(../img/cd-arrows.html) no-repeat center center;
  border-radius: 50%;
  box-shadow: 0 0 0 6px rgba(181, 66, 64, 0.3), 0 0 20px rgba(0, 0, 0, 0.2);
  /* replace text with image */
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  color: transparent;
  -webkit-transform: translateX(-50%) scale(0);
  -moz-transform: translateX(-50%) scale(0);
  -ms-transform: translateX(-50%) scale(0);
  -o-transform: translateX(-50%) scale(0);
  transform: translateX(-50%) scale(0);
  -webkit-transition: box-shadow 0.2s;
  -moz-transition: box-shadow 0.2s;
  transition: box-shadow 0.2s;
}
.cd-product-viewer-handle .handle:active {
  box-shadow: 0 0 0 0 rgba(181, 66, 64, 0), 0 0 20px rgba(0, 0, 0, 0.2);
}
.loaded .cd-product-viewer-handle .handle {
  /* image sprite has been loaded */
  -webkit-transform: translateX(-50%) scale(1);
  -moz-transform: translateX(-50%) scale(1);
  -ms-transform: translateX(-50%) scale(1);
  -o-transform: translateX(-50%) scale(1);
  transform: translateX(-50%) scale(1);
  -webkit-animation: cd-bounce 0.3s 0.3s;
  -moz-animation: cd-bounce 0.3s 0.3s;
  animation: cd-bounce 0.3s 0.3s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
  cursor: ew-resize;
}
.btn-color{		
  padding-bottom: 60px !important;		
}		
.btn-360{		
  position: absolute !important;		
  top: 50%;		
  left: 50%;		
  transform: translate(-50%,-50%);		
  z-index: 20 !important;		
}		
.product-viewer:hover .btn-360{		
  opacity: 0;		
  transition: ease-in-out 0.5s;		
  z-index: 0 !important;		
}

@-webkit-keyframes cd-bounce {
  0% {
    -webkit-transform: translateX(-50%) scale(0);
  }
  60% {
    -webkit-transform: translateX(-50%) scale(1.1);
  }
  100% {
    -webkit-transform: translateX(-50%) scale(1);
  }
}
@-moz-keyframes cd-bounce {
  0% {
    -moz-transform: translateX(-50%) scale(0);
  }
  60% {
    -moz-transform: translateX(-50%) scale(1.1);
  }
  100% {
    -moz-transform: translateX(-50%) scale(1);
  }
}
@keyframes cd-bounce {
  0% {
    -webkit-transform: translateX(-50%) scale(0);
    -moz-transform: translateX(-50%) scale(0);
    -ms-transform: translateX(-50%) scale(0);
    -o-transform: translateX(-50%) scale(0);
    transform: translateX(-50%) scale(0);
  }
  60% {
    -webkit-transform: translateX(-50%) scale(1.1);
    -moz-transform: translateX(-50%) scale(1.1);
    -ms-transform: translateX(-50%) scale(1.1);
    -o-transform: translateX(-50%) scale(1.1);
    transform: translateX(-50%) scale(1.1);
  }
  100% {
    -webkit-transform: translateX(-50%) scale(1);
    -moz-transform: translateX(-50%) scale(1);
    -ms-transform: translateX(-50%) scale(1);
    -o-transform: translateX(-50%) scale(1);
    transform: translateX(-50%) scale(1);
  }
}

/* Flexnav Base Styles */
.flexnav {
	font-family:'Hyundai Sans H',Roboto,'Helvetica Neue',serif;
	font-weight: 400;
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  transition: none;
  -webkit-transform-style: preserve-3d;
  overflow: hidden;
  margin: 0 auto;
  width: 100%;
  max-height: 0; line-height:10px; }
  .flexnav.opacity {
    opacity: 0; }
  .flexnav.flexnav-show {
    max-height: 2000px;
    opacity: 1;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out; }
  .flexnav.one-page {
    position: fixed;
    top: 50px;
    right: 5%;
    max-width: 200px; }
  .flexnav li {
    font-size: 18px;
    position: relative;
    overflow: hidden; }
  .flexnav li a {
    font-size: 1.4rem;
    font-weight: 500;
    position: relative;
    display: block;
    padding: .80em;
    z-index: 2;
    overflow: hidden;
    color: #222222;
    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
  }
	.flexnav li a:hover{ color:#0057ac; text-decoration:none}
  .flexnav li ul {
    width: 100%; }
    .flexnav li ul li {
      font-size: 100%;
      position: relative;
      overflow: hidden; }
  .flexnav li ul.flexnav-show li {
    overflow: visible; }
  .flexnav li ul li a {
    display: block;
    background: #fff; color:#000; font-family:'Hyundai Sans',serif; font-weight: 300; font-size:16px }
  .flexnav li ul li a:hover{ color:#0057ac; text-decoration:underline}
  .flexnav ul li ul li a {
    background: #bfbfbc; }
  .flexnav ul li ul li ul li a {
    background: #cbcbc9; }
  .flexnav .touch-button {
    position: absolute;
    z-index: 8;
    top: 0;
    right: 0;
    width: 30px;
    height: 37px;
    display: inline-block;
    text-align: center; }
    .flexnav .touch-button:hover {
      cursor: pointer; }
    .flexnav .touch-button .navicon {
      content: '';
margin-left: -4px;
position: absolute;
border-left: 1px solid #000;
border-bottom: 1px solid #000;
width: 12px;
height: 12px;
top: 9px;
-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);}

.menu-button {
	height:50px;
  position: relative;
  font-family:'Hyundai Sans',serif; font-weight: 300;
  display: block;
  padding: 1em;
  background: #004282;
  color: #fff;
  cursor: pointer;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2); width:94.9% }
  .menu-button.one-page {
    position: fixed;
    top: 0;
    right: 5%;
    padding-right: 45px; }
  .menu-button .touch-button {
    background: transparent;
    position: absolute;
    z-index: 999;
    top: 0;
    right: 0;
    width: 50px;
    height: 50px;
    display: inline-block;
    text-align: center; }
    .menu-button .touch-button .navicon {
      font-size: 16px;font-family:Arial, Helvetica, sans-serif; font-style:normal !important;
      position: relative;
      top: 1em; right:0;
      color: #fff; }

@media all and (min-width: 800px) {
  body.one-page {
    padding-top: 70px; }

  .flexnav {
    overflow: visible; }
    .flexnav.opacity {
      opacity: 1; }
    .flexnav.one-page {
      top: 0;
      right: auto;
      max-width: 1080px; }
    .flexnav li {
      position: relative;
      list-style: none;
      float: left;
      display: block;
      /*background-color: #a6a6a2;*/
      overflow: visible;
      }
    .flexnav li a {
      
      border-bottom: none; }
    .flexnav li > ul {
      position: absolute;
      top: auto; z-index:10000;
      left: 0; }
      .flexnav li > ul li {
        width: 100%; }
    .flexnav li ul li > ul {
      margin-left: 100%;
      top: 0; }
    .flexnav li ul li a {
      border-bottom: none; }
    .flexnav li ul.open {
      display: block;
      opacity: 1;
      visibility: visible;
      z-index: 1; }
      .flexnav li ul.open li {
        overflow: visible;
        max-height: 100px; }
      .flexnav li ul.open ul.open {
        margin-left: 100%;
        top: 0; }

  .menu-button {
    display: none; } }
.oldie body.one-page {
  padding-top: 70px; }
.oldie .flexnav {
  overflow: visible; }
  .oldie .flexnav.one-page {
    top: 0;
    right: auto;
    max-width: 1080px; }
  .oldie .flexnav li {
    position: relative;
    list-style: none;
    float: left;
    display: block;
    background-color: #a6a6a2;
    width: 20%;
    min-height: 50px;
    overflow: visible; }
  .oldie .flexnav li:hover > ul {
    display: block;
    width: 100%;
    overflow: visible; }
    .oldie .flexnav li:hover > ul li {
      width: 100%;
      float: none; }
  .oldie .flexnav li a {
    border-left: 1px solid #acaca1;
    border-bottom: none;
    overflow: visible; }
  .oldie .flexnav li > ul {
    background: #acaca1;
    position: absolute;
    top: auto;
    left: 0;
    display: none;
    z-index: 1;
    overflow: visible; }
  .oldie .flexnav li ul li ul {
    top: 0; }
  .oldie .flexnav li ul li a {
    border-bottom: none; }
  .oldie .flexnav li ul.open {
    display: block;
    width: 100%;
    overflow: visible; }
    .oldie .flexnav li ul.open li {
      width: 100%; }
    .oldie .flexnav li ul.open ul.open {
      margin-left: 100%;
      top: 0;
      display: block;
      width: 100%;
      overflow: visible; }
  .oldie .flexnav ul li:hover ul {
    margin-left: 100%;
    top: 0; }
.oldie .menu-button {
  display: none; }
.oldie.ie7 .flexnav li {
  width: 19.9%; }
  
/* STICKY SANTAFE */
div.menu {
	text-align:center;
}

div.menuScroll {

}
.stmenu{ display:block}
nav.navScroll {
	 -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
	transition: all 0.5s;
	color: #fff;
}

li.nav-santafe, li.nav-santafe-limited {
	display:inline;
	text-decoration:none;
	padding:15px;
	float:left;
	font-size:16px;
	font-family:"Hyundai Sans",serif;
	font-weight: 300;
	margin:0px 20px;
}

	li.nav-santafe a, li.nav-santafe-limited a {
		list-style-type: none;
		text-decoration:none;
		color:#000;
		text-shadow:0.5px 0 0 rgba(255,255,255,0.5);
	}

	li.nav-santafe a:hover {
		color: #00aad2;
	}

.navScroll a.selected {
	border-bottom:5px solid #00aad2; 
	position:relative; float:left; padding-bottom:18px
}


/* I20 */
.section-1-3-i20{ background:#e4dcd3; padding:90px 0px; padding-bottom:90px}
.section-5-i20{ background:#fff; }

/* 
.navScroll a.selected:after {
    content: "";
    width: 50px;
    height: 5px;
    position: absolute;
    bottom: -21px;
    left: 20%;
	margin-left:-5px;
    text-align: center;
    background: #00aad2;
}*/

.section-santafe{ float:left; width:100%}
div.container {
	margin:0 auto;
	width:100%; padding-left:0 !important; padding-right:0 !important
}
.menumobil{ width:140px !important; float:left; text-align:center}
.flexnav li > ul li img{ width:auto}

/* dropdown menu */

.click-nav {
	position:absolute; right:10px; top:5px; display:block;
}
.click-nav ul {
	font-weight:600;
}
.click-nav ul li {
	position:relative;
	list-style:none;
	cursor:pointer;
	padding:0 0 0 0 !important;
}
.click-nav ul li ul {
	position:absolute;
	top:51px;
	right:-30px;
	width:200px;
	z-index:1000;
	
}
.click-nav ul .clicker {
	
	color:#FFF;
	background:none !important
}
.click-nav ul .clicker:hover,
.click-nav ul .active {
	background:none;
}
.click-nav img {
	position:absolute;
	top:9px;
	left:12px;
}
.click-nav ul li a {
	transition:background-color 0.2s ease-in-out;
	-webkit-transition:background-color 0.2s ease-in-out;
	-moz-transition:background-color 0.2s ease-in-out;
	display:block;
	padding:8px 30px 8px 10px;
	text-align:right;
	background:#253f57;
	color:#fff;
	text-decoration:none;
	width:100%;
}
.click-nav ul li a:hover {
	background:#00aad2; color:#fff
}
/* Fallbacks */
.click-nav .no-js ul {
	display:none;
}
.click-nav .no-js:hover ul {
	display:block;
}

/* H1 */
.section-1-3-h1{ background:#f0ebe5; padding:0px 0px; padding-bottom:30px}
.h1-dtm{ margin-top:40px}
.gallery-convenience-h1{ background:#f0ebe5; padding:20px 0px 90px 0px; width:100%; float:left;}
.sect2-1-h1{ width:23%; margin:1%; float:left; height:160px; overflow:hidden}
.sect2-1-h1 img{ width:100%}
.h1-mbt{ margin-bottom:40px}
.thumb-gh1{ width:33.3333%; float:left; max-height:250px; overflow:hidden}
.thumb-gh1 img{ width:100% !important}
.thumb-gh2{ width:25%; float:left; max-height:150px; overflow:hidden}
.thumb-gh2 img{ width:100% !important}
.h-tabel1{ height:191px}
.h-tabel2{ height:101px}

/* SONATA */
.sonata-green{ margin-bottom:30px;}
.box-interior{ width:35%; margin:7.5%; float:left; position:relative}
.interior-th{ width:100%; float:left;}
.interior-th img{ width:100%;}
.interior-title{width:100%; float:left; height:auto; margin-bottom:30px; overflow:hidden; height:225px}
.interior-title h4{ color:#000; font-family:'Hyundai Sans',serif; font-weight: 300; padding:25px 0px; margin:0; font-size:27px; position:relative; margin-bottom:10px; text-align:left; text-transform:uppercase;}
.interior-title p{ color:#000; font-family:'Hyundai Sans',serif; font-weight: 300; padding:0; margin:0; font-size:19px; margin:0px; float:left; text-align:left; width:100%}
.gallery-convenience-sonata{ background:#bcb1a1; padding:0px; width:100%; float:left;}
.performance-sonata{ background:#fff; padding:0px; width:100%; float:left;}
.box-safety{ width:35%; margin:5% 7.5% 0% 7.5%; float:left; position:relative}
.safety-title1{width:100%; float:left; height:auto; margin-bottom:0px; overflow:hidden; height:120px;}
.safety-title2{width:100%; float:left; height:auto; margin-bottom:0px; overflow:hidden; height:190px;}
.safety-title1 h4, .safety-title2 h4{ color:#000; font-family:'Hyundai Sans',serif; font-weight: 300; padding:15px 0px; margin:0; font-size:19px; position:relative; margin-bottom:10px; text-align:center; text-transform:uppercase;}
.safety-title1 p, .safety-title2 p{ color:#000; font-family:'Hyundai Sans',serif; font-weight: 300; padding:0; margin:0; font-size:16px; margin:0px; float:left; text-align:center; width:100%}
.box-gallery-sonata{ width:100%; max-width:1500px; margin:auto; margin-top:40px; position:relative}
.box-gallery-sonata p{ margin:5px; text-align:left;font-size:13px}
.thumb-gsonata{ width:16.6667%; float:left; max-height:145px; overflow:hidden}
.thumb-gsonata img{ width:100% !important}
.sonata-colorize{ width:100% !important; text-align: center !important;}
.sonata-colorize img{ width:auto !important; text-align:center; margin:auto}

/* GRAND AVEGA */
.box-gavega-1{ width:100%;  background:#f3f3f1; margin-bottom:-2px;}
.gallery-gavega-limited{ background:#eaeae7; padding:20px 0px; width:100%; float:left;}

/* i10 */
.section-1-3-i10{ background:#e4dcd3; padding:90px 0px; padding-bottom:90px}
.gallery-convenience-i10{ background:#e4dcd3; padding:70px 0px; width:100%; float:left;}
.colorize-i10{ float:left;}
.colorize-i10x{ float:right;}

.detail-slide { width:100% !important; text-align: center !important;}
.detail-slide img{ width:auto !important; text-align:center; margin:auto}

/* LIMITED */
li.nav-santafe-limited {
	display:inline;
	text-decoration:none;
	padding:15px 8px;
	float:left;
	font-size:17px;
	font-family:"Hyundai Sans",serif;
	font-weight: 300;
	margin:0px 20px;
}

	li.nav-santafe-limited a {
		list-style-type: none;
		text-decoration:none;
		color:#000;
		text-shadow:0.5px 0 0 rgba(255,255,255,0.5);
	}

	li.nav-santafe-limited a:hover {
		color: #000;
	}
.limited-video{ position:absolute; width:538px; height:316px; right:142px; bottom:118px; z-index:100}

/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 320px) {
	.wa_footer {
	clear: both;
	float: left;
	text-align: center;
	margin: 0 auto;
	/* width: 100%; */
  padding-left: 15px;
	display: block;
	color: rgba(255,255,255,1.00);
}
.wa_footer img{width:auto;float:left;}
.text_wa{ 
	float:right;
	margin-top:10px;
	font-weight: 300;
  color: #000000;
}
.icon_wa{ 
	float:right; margin-top:10px;width: 25px; height: 25px;}
.sonata-colorize{ width:auto !important; text-align: center !important;}
.sonata-colorize img{ width:100% !important; text-align:center; margin:auto}
.gridContainer {
	width: 100%;
	padding-left: 1.225%;
	padding-right: 1.225%;
}
#LayoutDiv1 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
/* .col-xs-6{ width:33% !important; padding-left: 5px !important; padding-right: 5px !important;} */
.col-sm-6{ width:65% !important }
.section-bottom-home{ padding:5px}
.section-bottom-home h2{font-size:18px !important; position:relative; margin-bottom:5px}
.section-bottom-home p{ font-size:14px}
.section-bottom-home{ width:100%; height:85px }
.col-article{ width:100%;}
.i-sosmed{width: 25px; height: 25px; margin-top:10px;margin-left:4px; margin-right:4px;}
.col-footer{width:100%;}
.flexnav li > ul li { width: 100%; }
.flexnav li ul { width: 100%; }
.menumobil{ width:100% !important; float:left; text-align:left}
.flexnav li > ul li img{ display:none}
.logo-santafe{display:none}
li.nav-santafe {font-size:15px;margin:0px 0px;}
li.nav-santafe-limited {font-size:15px;margin:0px 0px;}
.title-santafe h2, .title-santafe h3, .sect3-1 h4, .sect6-1 h3{ font-size:22px}
.title-santafe p{font-size:15px}
.thumbnail-video{ width:25%; height:auto; right:25px; bottom:45px}
.thumbnail-video-h1{ width:25%; height:auto; left:25px; bottom:45px}
.thumbnail-video.v-santafe {
  width: 25%;
  height: auto;
  left: 25px;
  right: auto;
  bottom: 70px;
}
.fancybox-type-iframe .fancybox-inner {
  height: 338px !important;}
.sect3-2, .sect2-1-h1{ height:55px}
.sect3-1 p { display: block}
.sect2-1{ height:65px}
.sect6-1{ width:100%}
.radio-inline { width:100%}
.checkbox-inline+.checkbox-inline, .radio-inline+.radio-inline{ margin-left:0 !important}
.listacar,.stmenu{ display:none}
.click-nav{ display:block}
.logo-santafe-mobile{ display:block;}
.navScroll a.selected, li.nav-santafe{ float:none; border-bottom:0}
.bgvehicle{ padding-bottom:80px;}
.vgrandi10{ margin-left:40px; width:35%; margin-top:30px;}
.vgrandavega{margin-right:40px;width:40%;margin-top:30px}
.vsantafe{ margin-left:0px;width:40%;margin-top:30px;}
.vtucson{ margin-right:0px;width:35%;margin-top:30px;}
.vh1{ margin-left:30px;width:40%;margin-top:30px;}
.vstarex{ margin-right:30px;width:40%;margin-top:30px;}
.top-article-image{ width:100%; float:left;}
.top-article-title{ width:100%; float:left;}
.top-article-title h2{font-size:22px !important; position:relative; margin-bottom:10px}
.top-article-title p{ font-size:18px}
.title-detailarticle h2{ font-size:25px;}
.title-related h2{ font-size:20px;}
.share-detailarticle img{ width:20%;}
.foto-pm h3{ font-size:18px;}
.tabel{font-size:10px;}
.box-pricelist{ width:100%;}
.box-pricelist h2{  font-size:14px;}
.h-tabel1{ height:auto}
.h-tabel2{ height:auto}
.agent{ text-align:center;padding-right: 0px}
.agent p{ text-align:center;padding-right: 0px}
.agent h1{ text-align:center;padding-right: 0px}
.distributor{ text-align:center;padding-left: 0px}
.distributor p{ text-align:center;padding-right: 0px}
.distributor h1{ text-align:center;padding-left: 0px}
.sect3-2-tucson { height:55px}
.sect2-1-tucson{ height:50px}
.interior-title{height:290px}
.safety-title1{height:165px}
.safety-title2{height:325px}
.interior-title h4{font-size:15px;}
.interior-title p{font-size:13px;}
.thumb-gsonata{ width:33.3333%;}
.safety-title1 h4, .safety-title2 h4{font-size:15px;}
.safety-title1 p, .safety-title2 p{ font-size:12px;}
.promo{ width:100%}
.thumb-gh2{ max-height:70px;}
}

.mwi-box{
  position: relative;
  width: 100%;
  margin-bottom: 15px;
  height: 290px;
  overflow: hidden;
}
.mwi-box img{
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, 0%);
  width: 100%;
}
.mwi{
  margin-bottom: 20px;
}
.mwi h4{
  margin-bottom: 15px;
  font-size: 16px;
}
.mwi a{
  padding: 5px 15px;
  background: red;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  margin-bottom: 60px;
  display: inline-block;
}
.mwi a:hover{
  color: #fff;
  text-decoration: none;
}
.mwi-wrap{
  padding-top: 90px;
}

@media only screen and (min-width: 768px) {
.gridContainer {
	width: 100%;
	padding-left: 0.98%;
	padding-right: 0.98%;
	margin: auto;
}
#LayoutDiv1 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
/* .col-xs-6{ width:33% !important} */
.col-sm-6{ width:65% !important }
.section-bottom-home{ width:100%; min-height: 150px; padding:10px}
.section-bottom-home p{ font-size:15px; min-height: 49px;}
.col-article{ width:33%;}
.i-sosmed{ margin-top:0;margin-left:3px; margin-right:3px;}
.col-footer{width:50%;}
.title-santafe h2, .title-santafe h3, .sect3-1 h4, .sect6-1 h3{ font-size:58px;padding: 0 10px; font-family: "Hyundai Sans H",Roboto,"Helvetica Neue",serif; font-weight: 500;}
.title-santafe p, .sect3-1 p{font-size:19px}
.sect3-1 p{ padding-right:20px;}
.thumbnail-video{ width:21%;right:60px; bottom:95px}
.thumbnail-video-h1{ width:21%;left:60px; bottom:95px}
.thumbnail-video.v-santafe {
  right: auto;
  left: 80px;
  bottom: auto;
  top: 180px;
}
.sect3-2, .sect2-1-h1{ height:106px}
.sect3-1 p { display:block}
.sect2-1{ height:130px}
.sect6-1{ width:50%}
.radio-inline { width:auto}
.checkbox-inline+.checkbox-inline, .radio-inline+.radio-inline{ margin-left:10px !important}
.stmenu{ display:block}
.click-nav{ display:block}
.logo-santafe-mobile{ display:none;}
li.nav-santafe{ float:left;}
.navScroll a.selected{ float:left; border-bottom:5px solid #00aad2}
.listacar, .click-nav{ display:none}
.bgvehicle{ padding-bottom:60px;}
.vgrandi10{ margin-left:70px; width:30%; margin-top:30px;}
.vgrandavega{margin-right:80px;width:35%;margin-top:30px}
.vsantafe{ margin-left:0px;width:35%;margin-top:0px;}
.vtucson{ margin-right:0px;width:30%;margin-top:0px;}
.vh1{ margin-left:70px;width:35%;margin-top:0px;}
.vstarex{ margin-right:70px;width:35%;margin-top:0px;}
.top-article-title { padding:10px;}
.top-article-title p { font-size:20px}
.top-article-image{ width:66.4%; float:left;}
.top-article-title{ width:33.6%; float:left;}
.title-detailarticle h2{ font-size:35px;}
.title-related h2{ font-size:30px;}
.share-detailarticle img{ width:auto;}
.foto-pm h3{ font-size:22px;}
.tabel{font-size:12px;}
.box-pricelist{ width:50%;}
.box-pricelist h2{  font-size:20px;}
.h-tabel1{ height:173px}
.h-tabel2{ height:96px}
.box-network{ min-height:340px}
.agent{ text-align:right;padding-right: 20px}
.agent p{ text-align:right;padding-right: 20px}
.agent h1{ text-align:right;padding-right: 20px}
.distributor{ text-align:left;padding-left: 20px}
.distributor p{ text-align:left;padding-right: 20px}
.distributor h1{ text-align:left;padding-left: 20px}
.sect3-2-tucson { height:145px}
.sect2-1-tucson{ height:100px}
.interior-title{height:305px}
.safety-title1{height:145px}
.safety-title2{height:235px}
.interior-title h4{font-size:22px;}
.interior-title p{font-size:19px;}
.thumb-gsonata{ width:33.3333%;}
.safety-title1 h4, .safety-title2 h4{font-size:19px;}
.sonata-colorize{ width:auto !important; text-align: center !important;}
.sonata-colorize img{ width:auto !important; text-align:center; margin:auto}
.thumb-gh2{ max-height:150px;}
}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 769px) {
.gridContainer {
	width: 100%;
	padding-left: 0.98%;
	padding-right: 0.98%;
	margin: auto;
}
#LayoutDiv1 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
.wa_footer {
	clear: both;
	float: right;
	text-align:right;
	margin-left: 0;
	width: 100%;
	display: block;
	color: rgba(255,255,255,1.00);
}
.wa_footer img{ width:auto;
float:right;}
.text_wa{ 
	float:right;
	margin-top:10px;
	color: rgba(0,0,0,1.00)}
.icon_wa{ float:right}
/*.flexnav li{ width:87px}*/
.flexnav li{width:87px}
.droplist{width:130px !important}
li.nav-santafe {padding:15px 0px;}

.flexnav li > ul li { width: 420px; }
.flexnav li ul { width: 420px;background: #fff;/*background: #004282;*/}
.menumobil{ width:140px !important; height:100px; float:left; text-align:center}
.corporate{ width:210px !important; float:left; text-align:center}
.droplist2{ width:165px !important}
.flexnav li > ul li img{ width:auto; display:block}
.listacar, .logo-santafe{display:block}
li.nav-santafe {font-size:1.4rem;margin:12px 12px;}
li.nav-santafe-limited {font-size:1.4rem;margin:0px 5px;}
.sect2-1{ height:auto}
.sect3-2{ height:160px}
.sect2-1-h1{ height:160px}
.thumbnail-video, .thumbnail-video-h1{bottom:160px}
.bgvehicle{ padding-bottom:40px;}
.vgrandi10{ margin-left:200px; width:auto;margin-top:0px}
.vgrandavega{margin-right:170px;width:auto;margin-top:0px}
.vsantafe{ margin-left:20px;width:auto;margin-top:0px;}
.vtucson{ margin-right:30px;width:auto;margin-top:0px;}
.vh1{ margin-left:100px;width:auto;margin-top:0px;}
.vstarex{ margin-right:80px;width:auto;margin-top:0px;}
.top-article-title { padding:20px;}
.top-article-title p { font-size:26px}
.title-detailarticle h2{ font-size:45px;}
.tabel{font-size:14px;}
.box-pricelist{ width:50%;}
.box-pricelist h2{  font-size:20px;}
.h-tabel1{ height:191px}
.h-tabel2{ height:101px}
.box-network{ min-height:250px}
.title-santafe h2, .title-santafe h3, .sect3-1 h4, .sect6-1 h3{ font-size:58px;padding: 0 5px;}
.sect3-2-tucson { height: auto}
.sect2-1-tucson{ height:140px}
.interior-title{height:225px}
.safety-title1{height:125px}
.safety-title2{height:190px}
.interior-title h4{font-size:27px;}
.interior-title p{font-size:19px;}
.thumb-gsonata{ width:16.6667%;}
.safety-title1 h4, .safety-title2 h4{font-size:19px;}
.safety-title1 p, .safety-title2 p{ font-size:16px;}
.promo{ width:auto!important}
.thumb-gh2{ max-height:200px;}
}

@media only screen and (min-width: 1025px) {
	.flexnav li{ width:auto;}
	li.nav-santafe {padding:15px 15px;}
	.box-network{ min-height:260px}
	li.nav-santafe-limited { padding:25px 12px; margin:0 12px}
	.promo{ width:auto !important}
}

@media only screen and (max-width: 992px) {
.mwi-box{
  height: 208px;
}
}

@media only screen and (max-width: 767px) {
.title-santafe h2, .title-santafe h3, .sect3-1 h4, .sect6-1 h3 {
    font-size: 18px;
}
.title-santafe p {
    font-size: 12px;
}
.title-santafe {
    padding: 50px 50px;
	margin-top: 0;
}
.safety-title1 {
    height: 185px;
}
.sect3-2new {
    width: 19%;
    height: 38px;
}
.section-1-3-h1 #LayoutDiv1 {
    margin-bottom: 40px !important;
}
.gallery-convenience-h1 {
    background: #f0ebe5;
    padding: 20px 0px 53px 0px;
    width: 100%;
    float: left;
}
.brake h3 {
    font-size: 30px;
}
.brake p {
    font-size: 16px;
}
.mwi-box {
  height: 208px;
}
.mwi .col-sm-3{
  width: 50%;
  float: left;
}
.mwi-box {
  height: 56vw;
}
.mwi-wrap {
  padding-top: 140px;
}
}

/* Search icon by IcoMoon, made with http://icomoon.io/app/ */
@font-face {
	font-family: 'icomoon';
	src:url('../fonts/icomoon/icomoon.eot');
	src:url('../fonts/icomoon/icomoond41d.eot?#iefix') format('embedded-opentype'),
		url('../fonts/icomoon/icomoon.woff') format('woff'),
		url('../fonts/icomoon/icomoon.ttf') format('truetype'),
		url('../fonts/icomoon/icomoon.svg#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

.cari{ position:absolute; top:-10px; right:80px; width:0%}

.sb-search {
	position: absolute;
	top:-10px;
	right:0px !important;
	width: 0%;
	min-width: 50px;
	height: 50px;
	float: right;
	overflow: hidden;
	-webkit-transition: width 0.3s;
	-moz-transition: width 0.3s;
	transition: width 0.3s;
	-webkit-backface-visibility: hidden;
	display:none
}

.sb-search-input {
	position: absolute;
	top: 0px;
	right: 0;
	border: none;
	outline: none;
	background: #d7d7d7;
	width: 100%;
	height: 60px;
	margin: 0;
	z-index: 10;
	padding: 20px 65px 20px 20px;
	font-family: inherit;
	font-size: 20px;
	color: #2c3e50;
}

.sb-search-input::-webkit-input-placeholder {
	color: #707070;
}

.sb-search-input:-moz-placeholder {
	color: #707070;
}

.sb-search-input::-moz-placeholder {
	color: #707070;
}

.sb-search-input:-ms-input-placeholder {
	color: #707070;
}

.sb-icon-search,
.sb-search-submit  {
	width: 50px;
	height: 50px;
	display: block;
	position: absolute;
	right: 0;
	top: 0;
	padding: 0;
	margin: 0;
	line-height: 53px;
	text-align: center;
	cursor: pointer;
}

.sb-search-submit {
	background: #fff; /* IE needs this */
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE 8 */
    filter: alpha(opacity=0); /* IE 5-7 */
    opacity: 0;
	color: transparent;
	border: none;
	outline: none;
	z-index: -1;
}

.sb-icon-search {
	color: #fff;
	background: #004282;
	z-index: 90;
	font-size: 22px;
	font-family: 'icomoon';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	-webkit-font-smoothing: antialiased;
}

.sb-icon-search:before {
	content: "\e000";
}

/* Open state */
.sb-search.sb-search-open,
.no-js .sb-search {
	width: 100%;
}

.sb-search.sb-search-open .sb-icon-search,
.no-js .sb-search .sb-icon-search {
	background: #004282;
	color: #fff;
	z-index: 11;
}

.sb-search.sb-search-open .sb-search-submit,
.no-js .sb-search .sb-search-submit {
	z-index: 90;
}
.aspect-ratio-16-9{
  position: relative;
  width: 100%;
  padding-top: 56.25%; /* 16:9 Aspect Ratio */
}
.aspect-ratio-16-10{
  position: relative;
  width: 100%;
  padding-top: 62.5%; /* 16:10 Aspect Ratio */
}
.aspect-ratio-1-1{
  position: relative;
  width: 100%;
  padding-top: 100%; /* 1:1 Aspect Ratio */
}
.aspect-ratio-10-4{
  position: relative;
  width: 100%;
  padding-top: 40%; /* 10:4 Aspect Ratio */
}
.image-ratio{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media only screen and (max-width: 480px){
  .title_h1{position: relative; top:-30px; left: 50%; transform: translate(-50%,0)}
  .title_h1 h3{color:#000!important;}
  .title_h1 p{color:#000!important; font-weight: 300}
  .sect3-1 {
      width: 100%;
      float: left;
      height: auto;
      margin-bottom: 0px;
      overflow: hidden;
      padding: 0 15px;
  }
  .footer img {
      width: 100%;
    }

  .tittle_head{position: absolute;top: 24%; left: 10%; font-size: 72px; color: black; display: none}
  .tittle_headsanta{position: absolute;top: 24%; left: 10%; font-size: 72px; color: white;display: none}
  .tittle_headsanta2{position: absolute;top: 24%; left: 10%; font-size: 72px; color: white;display: none}
  .tittle_headi20{position: absolute;top: 10%; right: 10%; font-size: 72px; color: white; display: none}
  .subtittle_headsanta{position: absolute;top: 34%; left: 10%; font-size: 28px; color: white;display: none}
  .subtittle_headi10{position: absolute;top: 34%; left: 10%; font-size: 28px; color: black;display: none}
  .award{position: absolute; bottom: 10%; right: 10%;display: block}
  .awardsanta{position: absolute; bottom: 10%; left: 10%;display: none}
  .awardh1{position: absolute; bottom: 10%; left: 5%;display: none}
    .big-main-image {
      width: 100%;
      height: auto;
      text-align: center;
      float: left;
      position: relative;
      z-index: 0;
      padding: 135px 19px 0;
      background: center no-repeat url(../images/d-grey-sky-bg.jpg);
          background-size: auto auto;
      background-size: cover;
  }
  .btn-360{		
    width: 50px;		
    height: auto;		
  }		
  .awardsanta2 {		
      display: none;		
  }		
  .cd-product-viewer-wrapper img.p-preview {		
      width: 3600%;		
  }
}
@media only screen and (min-width: 320px) {.sb-search{ top:0px}	.limited-video{ position:absolute; width:150px; height:87px; right:39px; bottom:33px;}}
@media only screen and (min-width: 768px) {.limited-video{ position:absolute; width:288px; height:169px; right:75px; bottom:64px;}}
@media only screen and (min-width: 769px) {.sb-search{ top:-10px} .limited-video{ position:absolute; width:383px; height:225px; right:101px; bottom:84px;}}
@media only screen and (min-width: 1024px) {.limited-video{ position:absolute; width:383px; height:225px; right:101px; bottom:84px;}}
@media only screen and (min-width: 1280px) {.limited-video{ position:absolute; width:478px; height:281px; right:126px; bottom:105px;}}
@media only screen and (min-width: 1366px) {.limited-video{ position:absolute; width:512px; height:301px; right:134px; bottom:112px;}}
@media only screen and (min-width: 1440px) {.limited-video{ position:absolute; width:538px; height:316px; right:142px; bottom:118px;}}