@charset "UTF-8";
/* CSS Document */
@font-face {
    font-family: 'KIAL';
    src: url('../fonts/KiaSignatureLight.eot');
    src: url('../fonts/KiaSignatureLight.eot?#iefix') format('embedded-opentype'),
        url('../fonts/KiaSignatureLight.woff2') format('woff2'),
        url('../fonts/KiaSignatureLight.woff') format('woff'),
        url('../fonts/KiaSignatureLight.svg#KiaSignatureLight') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'KIAB';
    src: url('../fonts/KiaSignatureBold.eot');
    src: url('../fonts/KiaSignatureBold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/KiaSignatureBold.woff2') format('woff2'),
        url('../fonts/KiaSignatureBold.woff') format('woff'),
        url('../fonts/KiaSignatureBold.svg#KiaSignatureBold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'KIA';
    src: url('../fonts/KiaSignatureRegular.eot');
    src: url('../fonts/KiaSignatureRegular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/KiaSignatureRegular.woff2') format('woff2'),
        url('../fonts/KiaSignatureRegular.woff') format('woff'),
        url('../fonts/KiaSignatureRegular.svg#KiaSignatureRegular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}





body,
html {
  height: 100%;
  width: 100%;
  margin: 0;font-family:'KIAL', sans-serif;-webkit-font-smoothing:antialiased;font-smoothing:antialiased;-webkit-transform: translateZ(0px);
}
strong {font-family: 'KIAB';}
header { position: relative; width: 100%; height: calc(100vh - 82px); text-align: center;color: #fff; background: url('../img/kia-telluride-dt.jpg') ;background-position: center center;background-size: cover;}
.bk-red, .tabs {background-color:#05141F}
nav {background-color:#fff; border-top:3px solid #05141F; border-bottom:3px solid #05141F; border-radius:0;}
.navbar-brand img {height:50px;}
.navbar-text a{font-family: 'KIAB', 'KIAB2'; text-transform: uppercase; color:#000;font-size:25px;}
#media {position: relative; width: 100%;  background-color:#222;}
h2 {font-size:25px; font-family:'KIAB', 'KIAB2';}
.h2 {font-size:23px;font-family:'KIAB';}
.h3 {font-size:23px;font-family:'KIAL';}
.callout {font-family: 'KIAB'; color:#05141F;text-align: center!important;}
.red {color:#05141F!important;}
.gray {font-size:14px; color:#333;}


.nav-pills { }
.nav-pills .nav-link.active, .nav-pills .show>.nav-link {background:none; border-radius:0; border-bottom:3px solid #fff;opacity:1;}
.nav-pills .nav-link {opacity:.6; color:#fff;text-transform:uppercase;  font-family: 'KIAB', 'KIAB2';    font-size: .9rem;}
.disclaimer {font-family:Arial, sans-serif;font-size:8px; text-align:right; color:#333;font-weight:400;webkit-font-smoothing:antialiased;font-smoothing:antialiased;-webkit-transform: translateZ(0px);}
.card a {color:cornflowerblue; text-decoration: underline;}
.card .h6 {color:#333333; font-family: 'KIAB', 'KIAB2';font-size: 20px; }
.card .dropdown {text-align:right}
#media .container { display: -ms-grid;display: grid; width: 100%; height: 100%; grid-template-areas: "tips posts" "resources posts" ; -ms-grid-columns: 4fr 2fr 2fr; grid-template-columns: 4fr 2fr 2fr; -ms-grid-rows: 1fr 1fr 1fr; grid-template-rows: 1fr 1fr 1fr;max-height:1600px;}

.teaser {  grid-area: teaser;-ms-grid-row:1;-ms-grid-row-span:3; -ms-grid-column:1;display: flex;align-items: center;background:url(../img/teaser6.jpg) right / cover no-repeat;position:relative;}
.teaser .btn {width:100%; height:100%; background-color:transparent; border:none; border-radius: 0;white-space:normal!important;
}.teaser div {width:100%; height:100%}
 .teaser .content {position:absolute; text-align: center; width:100%; padding:0 5% 0 0; color: #fff; }
.teaser h2 {text-transform:uppercase}
.teaser small {width:50%;position: absolute;bottom: 10px;white-space: normal;right: 10px;font-size: 8px;line-height: 12px;text-align: right;color: #fff;}
 .teaser svg {width:50%;font-size:15em; color:#fff; opacity:.2;position: absolute;top: 35%;
left: 25%;}
.modal-dialog {max-width: 1500px;  margin: 30px auto;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;min-height: calc(100% - (.5rem * 2)); }
.modal-body { position:relative; padding:0px;}
.close {  position:absolute;  right: 10px;top: -40px; z-index:999;  font-size:2rem;  font-weight: normal;  color:#fff;  opacity:1;}
#videos h2 {font-family: 'KIAB', 'KIAB2';}
#videos .btn {width:100%;text-align: center; border-radius:0;border:none; background-color:#fff;background-position: center;background-repeat: no-repeat;background-size: cover;overflow:hidden;position:relative;}
#videos .btn.not-active {filter: blur(6px); -webkit-filter: blur(6px);}
.btn.focus, .btn:focus {box-shadow:none;}
#videos .btn svg {width:50%;font-size:15em; color:#fff; opacity:.2;}
#videos .btn small {width: 80%;position: absolute;bottom: 0;white-space: normal;right: 5px;font-size: 8px;line-height: 12px;text-align: right;}
#videos .btn.video1 {background-image:url(../img/teaser.jpg);}
#videos .btn.video2 {background-image:url(../img/teaser2.jpg);}
#videos .btn.video3 {background-image:url(../img/teaser3.jpg);}
#videos .btn.video4 {background-image:url(../img/teaser4.jpg);}
#videos .btn.video5 {background-image:url(../img/teaser5.jpg);}
#videos .btn.video6 {background-image:url(../img/teaser6.jpg);}
#videos .btn.video7 {background-image:url(../img/iqs22-1.jpg);}
#videos h3 {font-size:16px; text-transform:uppercase; font-family: 'KIAB', 'KIAB2'; margin:10px 10px 30px 10px}

#videos h3 span.text-muted {text-transform: capitalize;font-family: 'KIAL', 'KIAL2';display:block;}
.not-active { pointer-events: none;  cursor: default;  text-decoration: none; }
.tips {  grid-area: tips;-ms-grid-row:1; -ms-grid-column:2;background: #05141F;overflow:hidden;position: relative;	}
.tips a {height: 100%;width: 100%;position: absolute;}
.tips img {width: 75%;position: absolute;bottom: 0;left: 32%;}
.launch-tips {margin:20px 0; border:2px solid #333; text-align: center;padding:10px;}
.launch-tips a {width:100%}
.launch-tips a svg {width:60px!important; color:#333;}
.launch-tips a h2{display:inline-block; text-transform: uppercase;color:#333;}
.tips-head {background-color: rgba(0,0,0,.05); padding:10px 15px;}
.tips-head h2 {width:60%; display: inline-block}
.tips-head h4 {width:38%; display: inline-block; text-align: right;}
.table.fit{  width: 1%;}

.table-striped tbody tr:nth-of-type(odd) {
background-color: rgba(255,255,255,1); border-top:1px solid #05141F!important;
}.table-striped tbody tr:nth-of-type(even) {
background-color: rgba(0,0,0,.05);
}
.table td, .table th {border-top:1px solid #05141F!important;padding:.5em .25em;}

.posts {  grid-area: posts;-ms-grid-row:1;-ms-grid-row-span:2; -ms-grid-column:3;position:relative; padding:5px;overflow-y: scroll;background-color:#fff;max-height: 55vh;}
.posts h2 {padding:0;  font-family: 'KIAB', 'KIAB2';    font-size: 18px;
    font-weight: 400;
    line-height: 1.5;text-transform:uppercase; -webkit-font-smoothing:antialiased;font-smoothing:antialiased;display:block;-webkit-transform: translateZ(0px);}
.posts h3 {padding:0;  font-family: 'KIAB', 'KIAB2';    font-size: 18px;
    font-weight: 400;
    line-height: 1.5;text-transform:uppercase; -webkit-font-smoothing:antialiased;font-smoothing:antialiased;display:block;-webkit-transform: translateZ(0px);}
.posts h5 {font-size: 14px;padding-top: 20px;margin-bottom: 5px;text-transform: uppercase;}
.bg-image {filter: blur(6px); -webkit-filter: blur(6px); width:100%; min-height:100px; background-position: center;background-repeat: no-repeat;background-size: cover;background-color:#333; overflow:hidden;}
.recent-post1,.recent-post2, .recent-post3, .recent-post4, .recent-post5, .recent-post6, .recent-post7, .recent-post8, .recent-post9, .recent-post10, .recent-post11, .recent-post12, .recent-post13, .recent-post14, .recent-post15, .recent-post16, .recent-post17, .recent-post18 , .recent-post19 {position:relative;}
.recent-post19 .bg-image {background-image: url("../img/exterior-design-style.jpg"); filter:none;}
.recent-post18 .bg-image {background-image: url("../img/post-18.jpg"); filter:none;}
.recent-post17 .bg-image {background-image: url("../img/post-17.png"); filter:none;}
.recent-post16 .bg-image {background-image: url("../img/post-16.jpg"); filter:none;}
.recent-post15 .bg-image {background-image: url("../img/post-15.png"); filter:none;}
.recent-post14 .bg-image {background-image: url("../img/post-11.jpg"); filter:none;}
.recent-post13 .bg-image {background-image: url("../img/post-13.jpg"); filter:none;}
.recent-post12 .bg-image {background-image: url("../img/post-12.jpg"); filter:none;}
.recent-post11 .bg-image {background-image: url("../img/post-14.jpg"); filter:none;}
.recent-post10 .bg-image {background-image: url("../img/post-10.jpg"); filter:none;}
.recent-post9 .bg-image {background-image: url("../img/post-9.jpg"); filter:none;}
.recent-post8 .bg-image {background-image: url("../img/post-8.jpg"); filter:none;}
.recent-post7 .bg-image {background-image: url("../img/post-7.jpg"); filter:none;}
.recent-post6 .bg-image {background-image: url("../img/post-6.jpg"); filter:none;}
.recent-post5 .bg-image {background-image: url("../img/post-5.jpg"); filter:none;}
.recent-post4 .bg-image {background-image: url("../img/post-4.jpg"); filter:none;}
.recent-post3 .bg-image {background-image: url("../img/post-3.jpg");filter:none;}
.recent-post2 .bg-image {background-image: url("../img/post-2.png");filter:none;}
.recent-post1 .bg-image {background-image: url("../img/post-1.jpg");filter:none;}

.bg-text { color: white;
font-weight: bold;
position: absolute;
bottom: 0px;
left: 0px;
padding: 5px;
width: 100%;
background-color: rgba(0,0,0,0.5);
z-index: 2;
text-align: left;}

.bg-text h1 {font-size:14px; font-family: 'KIAB', 'KIAB2';}
.resources {  grid-area: resources;-ms-grid-row:2; -ms-grid-column:2;background: #e4e5e8;overflow:hidden;position: relative;}
.resources a {height: 100%;width: 100%;position: absolute;}
.resources img {width: 95%;position: absolute;bottom: 0;left: 14%;}
#resources .download {background-color:#05141F;display: flex;align-items: center;text-align:center;}
#resources .download a{position: relative;height: 100%;width: 100%;display: flex;align-items: center;min-height:100px;}
#resources .col-6 { margin:10px 0;}
#resources .card {min-height:150px;}
.download img {left: 30%;position: absolute;width:50%}
#resources .download.disabled {background-color:#333!important}
.schedule {margin:20px 0; border:2px solid #333; text-align: center;padding:10px;}
.schedule img {width:60px;}
.schedule h2 {display:block; text-transform: uppercase; margin-top:5px;font-size:20px;}
.view-posts {  grid-area: view-posts;-ms-grid-row:3; -ms-grid-column:2;-ms-grid-column-span:2;background: #333;overflow:hidden;position: relative;}
.view-posts a {height: 100%;width: 100%;position: absolute;}
.view-posts img {width: 95%;position: absolute;bottom: 0;left: 7%;}
.card-img-top{flex-shrink: 0;}
.main-carousel {width:100%;}
.flickity-prev-next-button.previous {left:-10px!important;}
.flickity-prev-next-button.next {right:-10px!important;}
.carousel-cell {
  width: 55%;
  margin-right: 10px;
  counter-increment: carousel-cell;
}
.carousel-cell .card-title{min-height:75px}
.carousel-cell .card-text{min-height:180px}
/* transition height change */
.flickity-viewport {
  transition: height 0.2s;
}

/* Portrait */
@media (min-width: 1200px){.container {max-width: 1200px;}}
@media (min-width: 992px){.container {max-width: 1160px;}}
@media (min-width: 768px) and (max-width:1200px) {.container {max-width:900px;} header{background: url('../img/kia-telluride-ipad.jpg');background-size:cover; background-position: center center}}
@media (max-width: 500px){
	header{background: url('../img/kia-telluride-device.jpg');background-size:cover; background-position: center center}
	 .card .dropdown {
		 font-size: 12px;}
	 .card .h6 {font-size:16px;}
	 #media {}
	
 .carousel-cell {
	width: 75%;}
	 .tabs .container {padding:0}

}
@media (min-width: 300px)and (max-width: 500px) {
	#media .container {
		display:-ms-grid;
  display: grid;
  width: 100%;
  grid-template-areas: 
  "tips posts"
  "resources posts";
		-ms-grid-columns:1fr 1fr;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr ;
}

.teaser { grid-area: teaser;}
	.tips {grid-area: tips;}
	 
.posts { grid-area: posts;}
.resources { grid-area: resources;}
.view-posts { grid-area: view posts;}
	header{background: url('../img/kia-telluride-device.jpg');background-size:cover; background-position: center center}
	.teaser p {display:none}
	.teaser .content { width:100%; padding:20px;top:4%}
 .teaser h2 {font-size:18px;font-family: 'KIAB', 'KIAB2';margin-top: 15%;}


.carousel-cell {
	width: 75%;}
	#main-content .nav-link {padding:.5rem .6rem;}
	.teaser svg {top: -12%;left: 35%;width: .4em!important;}
	 .teaser .content {top:6%;    left: 0;}
	.navbar-brand img {max-width:50%!important; height:auto}
}
#videos .btn,  #posts .btn, .btn.video1 {width:100%; height:100px;text-align: center; border-radius:0;border:none; background-color:#fff;background-position: center;background-repeat: no-repeat;background-size: cover;overflow:hidden;position:relative;}
#videos .btn.not-active, #posts .btn.not-active {filter: blur(6px); -webkit-filter: blur(6px);}
.btn.focus, .btn:focus {box-shadow:none;}
.btn svg {width: 80%;position: absolute;bottom: 40%;white-space: normal;right: 50%;font-size: 48px;line-height: 12px;text-align: right;}
 .btn.video1 {background-image:url(../seltos-img/teaser.jpg);   
    width: 100%;
    background-size: cover;
    min-height: 300px;}
#videos .btn.video2, #posts .btn.video2 {background-image:url(../seltos-img/teaser2.jpg); width: 100%;
    background-size: cover;
    min-height: 300px;}
#videos .btn.video3, #posts .btn.video3 {background-image:url(../seltos-img/teaser3.jpg); width: 100%;
    background-size: cover;
    min-height: 300px;}
#videos .btn.video4, #posts .btn.video4 {background-image:url(../seltos-img/teaser4.jpg); width: 100%;
    background-size: cover;
    min-height: 300px;}
#videos .btn.video5, #posts .btn.video5 {background-image:url(../seltos-img/teaser5.jpg); width: 100%;
    background-size: cover;
    min-height: 300px;}
#videos .btn.video6, #posts .btn.video6 {background-image:url(../seltos-img/teaser6.jpg); width: 100%;
    background-size: cover;
    min-height: 300px;}
#videos h3, #posts h3 {font-size:16px; text-transform:uppercase; font-family: 'KIAB', 'KIAB2'; margin:10px 10px 30px 10px}

/* Accordion styles*/
tbody {vertical-align: top}
#accordion .tabs {
  font-size: 0;
  margin: 25px 0;
}

#accordion .tabs:after {
  clear: both;
  content: '';
  display: table;
}

#accordion .tabs .tab {
  display: inline;
}

#accordion .tabs .tab-label, #accordionExample .card-header, #accordionExample2 .card-header {
  background: #000; 
  border-bottom: 1px solid #05141F; 
  display: inline-block;
	color:#fff;width:100%;
	margin-bottom:0;
  font-size: 16px;
  font-size: 1rem;
  left: 1px;
  margin-left: -1px;
  padding: 10px; 
  position: relative;
  vertical-align: bottom;
}
#accordionExample .card-header .btn-link,#accordionExample2 .card-header .btn-link {
    font-weight: 400;white-space:normal;
    color: #fff!important;
	background-color: transparent;    width: 100%;
    text-align: left;}

#accordionExample .card-header .btn-link::after, #accordionExample2 .card-header .btn-link::after  {
  background : url("../seltos-img/minus-solid.png") no-repeat;

content : "";
  width: 1em;position:absolute; right:20px;
  height: 1em;color:#fff;
  text-align: center;
  transition: all .35s;
}
#accordion .tab-label::after, #accordionExample .card-header .collapsed::after, #accordionExample2 .card-header .collapsed::after  {
 background : url("../seltos-img/plus-solid.png") no-repeat;

content : "";
  width: 1em;position:absolute; right:20px;
  height: 1em;color:#fff;
  text-align: center;
  transition: all .35s;
}




#accordion .tabs .tab > [type="radio"] {
  clip: rect(0 0 0 0);
  height: 1px;
  opacity: 0;
  position: fixed;
  width: 1px;
  z-index: -1;
}

#accordion .tabs .tab-panel {
  display: inline;
  display: inline-block;
  overflow: hidden;
  position: relative;
  height: 0;
  width: 0;
}

#accordion .tabs .tab-content {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  background: white;
  padding: 20px;
  border: 1px solid #ccc;
  float: left;
  font-size: 16px;
  font-size: 1rem;
  margin-top: -1px;
  width: 100%;
}

#accordion .tabs .tab [type="radio"]:checked + .tab-label {
  background: #000;
  border-bottom-width: 0;
  padding-bottom: 11px;
  z-index: 1;
}

#accordion .tabs .tab [type="radio"]:checked ~ .tab-panel {
  display: inline;
}
#accordion .tabs [type="radio"]:checked + .tab-label::after {
  content: "\f068"; font-weight: 900;position:absolute; right:20px;
	font-family: "Font Awesome 5 Free";

}

/*

=======================================
INTERNET EXPLORER 8 and below 
=======================================

*/
@media \0screen\,screen\9 {
  /* IE7 and IE6 */
  #accordion .tabs {
    zoom: 1;
  }
  
  /* IE8 and below */
 #accordion .tabs .tab .tab-radio {
    filter: Alpha(opacity=0);
    position: absolute;
    z-index: -1;
  }
  
  /* IE7 and IE6 */
 #accordion .tabs .tab .tab-panel {
    display: none;
    height: auto;
    overflow: visible;
    position: static;
    width: auto;
  }
  
  /* IE7 and IE6 */
 #accordion .tabs .tab-content {
    float: none;
    padding-bottom: 1px;
    padding-top: 1px;
    width: auto;
  }
  
  /* IE8 and below */
 #accordion .tabs .checked label {
    background: white;
    border-bottom-width: 0;
    padding-bottom: 11px;
    z-index: 1;
  }
  
  /* IE8 */
 #accordion .tabs .checked .tab-panel {
    display: inline;
  }
  /* IE7 and IE6 */
 #accordion .tabs .checked .tab-panel {
    display: inline;
    float: left;
    width: 100%;
  }
}
.disclaimer {font-family:Arial, sans-serif;font-size:8px; text-align:right; color:#333;font-weight:400;webkit-font-smoothing:antialiased;font-smoothing:antialiased;-webkit-transform: translateZ(0px);}
.disclaimer p {margin-bottom: 5px; text-align: left;}
img.full-width {width:50%}
.width-3 {width:33%}
table.list ul {padding-left: 17px;}

table img {width:100%}
table {text-align:center;}
.table-striped tbody tr:nth-of-type(odd) {
background-color: rgba(255,255,255,1); border-top:1px solid #05141F!important;
}.table-striped tbody tr:nth-of-type(even) {
background-color: rgba(0,0,0,.05);
}
table td, table th {border-top:1px solid #05141F!important;padding:.5em .25em;}
@media screen and (max-width: 600px) {
  table.responsive,  table.responsive2{
    border: 0;
  }

  table.responsive caption,  table.responsive2 caption {
    font-size: 1.3em;
  }
  
  table.responsive thead, table.responsive2 thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }
  .width-3 {width:100%}
  table.responsive tr,   table.responsive2 tr {
 display: block;
    margin-bottom: 1.625em;    width: 100%;clear: both;
  }
  
  table.responsive td {
    display: block;
    font-size: .8em;
    text-align: right;
  }
  table.responsive2 td {
width:33%;
    font-size: .8em;
    text-align: center;display:list-item; list-style: none;float:left;
  }
	.no-border{border-top:0!important;}
	table.responsive2 th.row{display:block}
	td ul{padding-top: 20px;
    text-align: left;}
	img.full-width{width:100%!important;}
  table.responsive td::before,  table.responsive2 td::before {
    /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
    content: attr(data-label);
    float: left;
    font-weight: bold;
    text-transform: uppercase;
  }
  
  table.responsive td:last-child {
    border-bottom: 0;
  }
}