#global-ux .mediaCarousel .media-carousel .carousel-btn:hover .icon { color: #2d96cd; } #global-ux .mediaCarousel .media-carousel .image-caption { position: static; max-width: 53.75rem; margin: 0; padding: 0; } #global-ux .mediaCarousel .media-carousel .image-caption h2, #global-ux .mediaCarousel .media-carousel .image-caption h3, #global-ux .mediaCarousel .media-carousel .image-caption h4, #global-ux .mediaCarousel .media-carousel .image-caption h5, #global-ux .mediaCarousel .media-carousel .image-caption h6 { text-shadow: none; } #global-ux .mediaCarousel .media-carousel .image-caption p { visibility: visible; text-shadow: none; } @media only screen and (min-width: 48em) { #global-ux .mediaCarousel .media-carousel .image-caption p { display: block; } } @media only screen and (min-width: 48em) { #global-ux .mediaCarousel .media-carousel .image-caption { margin: 1.4375rem auto 3.375rem; } } @media only screen and (max-width: 768px) { #global-ux .mediaCarousel .media-carousel .image-caption.richtext { text-align: center; } } #global-ux .mediaCarousel .media-carousel.media-carousel-white { background: #000; } #global-ux .mediaCarousel .media-carousel.media-carousel-white .media-carousel-description, #global-ux .mediaCarousel .media-carousel.media-carousel-white .image-caption { color: #fff; } #global-ux .mediaCarousel .media-carousel.media-carousel-white .media-carousel-description h2, #global-ux .mediaCarousel .media-carousel.media-carousel-white .media-carousel-description h3, #global-ux .mediaCarousel .media-carousel.media-carousel-white .media-carousel-description h4, #global-ux .mediaCarousel .media-carousel.media-carousel-white .media-carousel-description h5, #global-ux .mediaCarousel .media-carousel.media-carousel-white .media-carousel-description h6, #global-ux .mediaCarousel .media-carousel.media-carousel-white .image-caption h2, #global-ux .mediaCarousel .media-carousel.media-carousel-white .image-caption h3, #global-ux .mediaCarousel .media-carousel.media-carousel-white .image-caption h4, #global-ux .mediaCarousel .media-carousel.media-carousel-white .image-caption h5, #global-ux .mediaCarousel .media-carousel.media-carousel-white .image-caption h6 { color: #fff; } #global-ux .mediaCarousel .media-carousel.media-carousel-white .media-carousel-description p, #global-ux .mediaCarousel .media-carousel.media-carousel-white .image-caption p { color: #7f7f7f; } #global-ux .mediaCarousel .media-carousel.media-carousel-black { background: #fff; } #global-ux .mediaCarousel .media-carousel.media-carousel-black .media-carousel-description, #global-ux .mediaCarousel .media-carousel.media-carousel-black .image-caption { color: #000; } #global-ux .mediaCarousel .media-carousel.media-carousel-black .media-carousel-description h2, #global-ux .mediaCarousel .media-carousel.media-carousel-black .media-carousel-description h3, #global-ux .mediaCarousel .media-carousel.media-carousel-black .media-carousel-description h4, #global-ux .mediaCarousel .media-carousel.media-carousel-black .media-carousel-description h5, #global-ux .mediaCarousel .media-carousel.media-carousel-black .media-carousel-description h6, #global-ux .mediaCarousel .media-carousel.media-carousel-black .media-carousel-description p, #global-ux .mediaCarousel .media-carousel.media-carousel-black .image-caption h2, #global-ux .mediaCarousel .media-carousel.media-carousel-black .image-caption h3, #global-ux .mediaCarousel .media-carousel.media-carousel-black .image-caption h4, #global-ux .mediaCarousel .media-carousel.media-carousel-black .image-caption h5, #global-ux .mediaCarousel .media-carousel.media-carousel-black .image-caption h6, #global-ux .mediaCarousel .media-carousel.media-carousel-black .image-caption p { color: #000; } @media only screen and (min-width: 48em) { #global-ux .mediaCarousel .media-carousel { padding-bottom: 40px; } } #global-ux .mediaCarousel .white-bkg { background: #fff; } #global-ux .mediaCarousel .black-bkg { background: #000; } #global-ux .mediaCarousel .grey-bkg { background: #616161; } #global-ux .mediaCarousel .lightgrey-bkg { background: #7f7f7f; } #global-ux .mediaCarousel .darkgrey-bkg { background: #121212; } #global-ux .mediaCarousel .blue-bkg { background: #2d96cd; } #global-ux .mediaCarousel .darkblue-bkg { background: #1b394e; } #global-ux .mediaCarousel .blue-bkg .flex-control-nav, #global-ux .mediaCarousel .blue-bkg .carousel-controls .flex-control-nav, #global-ux .mediaCarousel .darkblue-bkg .flex-control-nav, #global-ux .mediaCarousel .darkblue-bkg .carousel-controls .flex-control-nav { margin: 0; padding: 0; text-align: center; list-style: none; } #global-ux .mediaCarousel .blue-bkg .flex-control-nav li, #global-ux .mediaCarousel .blue-bkg .carousel-controls .flex-control-nav li, #global-ux .mediaCarousel .darkblue-bkg .flex-control-nav li, #global-ux .mediaCarousel .darkblue-bkg .carousel-controls .flex-control-nav li { margin: 1.25rem .375rem .625rem; line-height: normal; } #global-ux .mediaCarousel .blue-bkg .flex-control-nav li, #global-ux .mediaCarousel .blue-bkg .flex-control-nav li a, #global-ux .mediaCarousel .blue-bkg .carousel-controls .flex-control-nav li, #global-ux .mediaCarousel .blue-bkg .carousel-controls .flex-control-nav li a, #global-ux .mediaCarousel .darkblue-bkg .flex-control-nav li, #global-ux .mediaCarousel .darkblue-bkg .flex-control-nav li a, #global-ux .mediaCarousel .darkblue-bkg .carousel-controls .flex-control-nav li, #global-ux .mediaCarousel .darkblue-bkg .carousel-controls .flex-control-nav li a { display: inline-block; } #global-ux .mediaCarousel .blue-bkg .flex-control-nav li a, #global-ux .mediaCarousel .blue-bkg .carousel-controls .flex-control-nav li a, #global-ux .mediaCarousel .darkblue-bkg .flex-control-nav li a, #global-ux .mediaCarousel .darkblue-bkg .carousel-controls .flex-control-nav li a { width: 10px !important; height: 10px !important; background: #fff; text-indent: -9999em; border-radius: 100%; } #global-ux .mediaCarousel .blue-bkg .flex-control-nav li a.flex-active, #global-ux .mediaCarousel .blue-bkg .carousel-controls .flex-control-nav li a.flex-active, #global-ux .mediaCarousel .darkblue-bkg .flex-control-nav li a.flex-active, #global-ux .mediaCarousel .darkblue-bkg .carousel-controls .flex-control-nav li a.flex-active { background: transparent; -webkit-transform: scale(1.5, 1.5); -moz-transform: scale(1.5, 1.5); -ms-transform: scale(1.5, 1.5); -o-transform: scale(1.5, 1.5); transform: scale(1.5, 1.5); border: #fff solid 1px; } #global-ux .mediaCarousel .blue-bkg .flex-control-nav li a:after, #global-ux .mediaCarousel .blue-bkg .carousel-controls .flex-control-nav li a:after, #global-ux .mediaCarousel .darkblue-bkg .flex-control-nav li a:after, #global-ux .mediaCarousel .darkblue-bkg .carousel-controls .flex-control-nav li a:after { display: none; } #global-ux .mediaCarousel .white-text .media-carousel-description, #global-ux .mediaCarousel .white-text .media-carousel-description h1, #global-ux .mediaCarousel .white-text .media-carousel-description h2, #global-ux .mediaCarousel .white-text .media-carousel-description h3, #global-ux .mediaCarousel .white-text .media-carousel-description h4, #global-ux .mediaCarousel .white-text .media-carousel-description h5, #global-ux .mediaCarousel .white-text .media-carousel-description h6, #global-ux .mediaCarousel .white-text .media-carousel-description p, #global-ux .mediaCarousel .white-text .image-caption, #global-ux .mediaCarousel .white-text .image-caption h1, #global-ux .mediaCarousel .white-text .image-caption h2, #global-ux .mediaCarousel .white-text .image-caption h3, #global-ux .mediaCarousel .white-text .image-caption h4, #global-ux .mediaCarousel .white-text .image-caption h5, #global-ux .mediaCarousel .white-text .image-caption h6, #global-ux .mediaCarousel .white-text .image-caption p { color: #fff; } #global-ux .mediaCarousel .black-text .media-carousel-description, #global-ux .mediaCarousel .black-text .media-carousel-description h1, #global-ux .mediaCarousel .black-text .media-carousel-description h2, #global-ux .mediaCarousel .black-text .media-carousel-description h3, #global-ux .mediaCarousel .black-text .media-carousel-description h4, #global-ux .mediaCarousel .black-text .media-carousel-description h5, #global-ux .mediaCarousel .black-text .media-carousel-description h6, #global-ux .mediaCarousel .black-text .media-carousel-description p, #global-ux .mediaCarousel .black-text .image-caption, #global-ux .mediaCarousel .black-text .image-caption h1, #global-ux .mediaCarousel .black-text .image-caption h2, #global-ux .mediaCarousel .black-text .image-caption h3, #global-ux .mediaCarousel .black-text .image-caption h4, #global-ux .mediaCarousel .black-text .image-caption h5, #global-ux .mediaCarousel .black-text .image-caption h6, #global-ux .mediaCarousel .black-text .image-caption p { color: #000; } #global-ux .mediaCarousel .grey-text .media-carousel-description, #global-ux .mediaCarousel .grey-text .media-carousel-description h1, #global-ux .mediaCarousel .grey-text .media-carousel-description h2, #global-ux .mediaCarousel .grey-text .media-carousel-description h3, #global-ux .mediaCarousel .grey-text .media-carousel-description h4, #global-ux .mediaCarousel .grey-text .media-carousel-description h5, #global-ux .mediaCarousel .grey-text .media-carousel-description h6, #global-ux .mediaCarousel .grey-text .media-carousel-description p, #global-ux .mediaCarousel .grey-text .image-caption, #global-ux .mediaCarousel .grey-text .image-caption h1, #global-ux .mediaCarousel .grey-text .image-caption h2, #global-ux .mediaCarousel .grey-text .image-caption h3, #global-ux .mediaCarousel .grey-text .image-caption h4, #global-ux .mediaCarousel .grey-text .image-caption h5, #global-ux .mediaCarousel .grey-text .image-caption h6, #global-ux .mediaCarousel .grey-text .image-caption p { color: #616161; } #global-ux .mediaCarousel .lightgrey-text .media-carousel-description, #global-ux .mediaCarousel .lightgrey-text .media-carousel-description h1, #global-ux .mediaCarousel .lightgrey-text .media-carousel-description h2, #global-ux .mediaCarousel .lightgrey-text .media-carousel-description h3, #global-ux .mediaCarousel .lightgrey-text .media-carousel-description h4, #global-ux .mediaCarousel .lightgrey-text .media-carousel-description h5, #global-ux .mediaCarousel .lightgrey-text .media-carousel-description h6, #global-ux .mediaCarousel .lightgrey-text .media-carousel-description p, #global-ux .mediaCarousel .lightgrey-text .image-caption, #global-ux .mediaCarousel .lightgrey-text .image-caption h1, #global-ux .mediaCarousel .lightgrey-text .image-caption h2, #global-ux .mediaCarousel .lightgrey-text .image-caption h3, #global-ux .mediaCarousel .lightgrey-text .image-caption h4, #global-ux .mediaCarousel .lightgrey-text .image-caption h5, #global-ux .mediaCarousel .lightgrey-text .image-caption h6, #global-ux .mediaCarousel .lightgrey-text .image-caption p { color: #7f7f7f; } #global-ux .mediaCarousel .darkgrey-text .media-carousel-description, #global-ux .mediaCarousel .darkgrey-text .media-carousel-description h1, #global-ux .mediaCarousel .darkgrey-text .media-carousel-description h2, #global-ux .mediaCarousel .darkgrey-text .media-carousel-description h3, #global-ux .mediaCarousel .darkgrey-text .media-carousel-description h4, #global-ux .mediaCarousel .darkgrey-text .media-carousel-description h5, #global-ux .mediaCarousel .darkgrey-text .media-carousel-description h6, #global-ux .mediaCarousel .darkgrey-text .media-carousel-description p, #global-ux .mediaCarousel .darkgrey-text .image-caption, #global-ux .mediaCarousel .darkgrey-text .image-caption h1, #global-ux .mediaCarousel .darkgrey-text .image-caption h2, #global-ux .mediaCarousel .darkgrey-text .image-caption h3, #global-ux .mediaCarousel .darkgrey-text .image-caption h4, #global-ux .mediaCarousel .darkgrey-text .image-caption h5, #global-ux .mediaCarousel .darkgrey-text .image-caption h6, #global-ux .mediaCarousel .darkgrey-text .image-caption p { color: #121212; } #global-ux .mediaCarousel .blue-text .media-carousel-description, #global-ux .mediaCarousel .blue-text .media-carousel-description h1, #global-ux .mediaCarousel .blue-text .media-carousel-description h2, #global-ux .mediaCarousel .blue-text .media-carousel-description h3, #global-ux .mediaCarousel .blue-text .media-carousel-description h4, #global-ux .mediaCarousel .blue-text .media-carousel-description h5, #global-ux .mediaCarousel .blue-text .media-carousel-description h6, #global-ux .mediaCarousel .blue-text .media-carousel-description p, #global-ux .mediaCarousel .blue-text .image-caption, #global-ux .mediaCarousel .blue-text .image-caption h1, #global-ux .mediaCarousel .blue-text .image-caption h2, #global-ux .mediaCarousel .blue-text .image-caption h3, #global-ux .mediaCarousel .blue-text .image-caption h4, #global-ux .mediaCarousel .blue-text .image-caption h5, #global-ux .mediaCarousel .blue-text .image-caption h6, #global-ux .mediaCarousel .blue-text .image-caption p { color: #2d96cd; } #global-ux .mediaCarousel .darkblue-text .media-carousel-description, #global-ux .mediaCarousel .darkblue-text .media-carousel-description h1, #global-ux .mediaCarousel .darkblue-text .media-carousel-description h2, #global-ux .mediaCarousel .darkblue-text .media-carousel-description h3, #global-ux .mediaCarousel .darkblue-text .media-carousel-description h4, #global-ux .mediaCarousel .darkblue-text .media-carousel-description h5, #global-ux .mediaCarousel .darkblue-text .media-carousel-description h6, #global-ux .mediaCarousel .darkblue-text .media-carousel-description p, #global-ux .mediaCarousel .darkblue-text .image-caption, #global-ux .mediaCarousel .darkblue-text .image-caption h1, #global-ux .mediaCarousel .darkblue-text .image-caption h2, #global-ux .mediaCarousel .darkblue-text .image-caption h3, #global-ux .mediaCarousel .darkblue-text .image-caption h4, #global-ux .mediaCarousel .darkblue-text .image-caption h5, #global-ux .mediaCarousel .darkblue-text .image-caption h6, #global-ux .mediaCarousel .darkblue-text .image-caption p { color: #1b394e; } .flex-control-nav, .carousel-controls .flex-control-nav { margin: 0; padding: 0; text-align: center; list-style: none; } .flex-control-nav li, .carousel-controls .flex-control-nav li { margin: 1.25rem .375rem .625rem; line-height: normal; } .flex-control-nav li, .flex-control-nav li a, .carousel-controls .flex-control-nav li, .carousel-controls .flex-control-nav li a { display: inline-block; } .flex-control-nav li a, .carousel-controls .flex-control-nav li a { width: 10px !important; height: 10px !important; background: #2c95cd; text-indent: -9999em; border-radius: 100%; } .flex-control-nav li a.flex-active, .carousel-controls .flex-control-nav li a.flex-active { background: transparent; -webkit-transform: scale(1.5, 1.5); -moz-transform: scale(1.5, 1.5); -ms-transform: scale(1.5, 1.5); -o-transform: scale(1.5, 1.5); transform: scale(1.5, 1.5); border: #2c95cd solid 1px; } .flex-control-nav li a:after, .carousel-controls .flex-control-nav li a:after { display: none; } .flex-control-nav li a, .carousel-controls .flex-control-nav li a { -webkit-transition: all 300ms ease-out 0s; transition: all 300ms ease-out 0s; } .flex-control-nav li a.flex-active, .carousel-controls .flex-control-nav li a.flex-active { margin: 0; } #global-ux .mediaCarousel .flex-control-nav li a, #global-ux .mediaCarousel .carousel-controls .flex-control-nav li a { position: relative; top: -1px; } #global-ux .mediaCarousel .flex-control-nav li a.flex-active, #global-ux .mediaCarousel .carousel-controls .flex-control-nav li a.flex-active { position: static; } .ie8 #global-ux .mediaCarousel { display: block; } .ie8 #global-ux .mediaCarousel .media-carousel { display: block; } .ie8 #global-ux .mediaCarousel .media-carousel .image-caption { margin: 23px auto 54px; } .ie8 #global-ux .mediaCarousel .media-carousel .image-caption p { margin: 0 0 10px; display: block; } .ie8 #global-ux .mediaCarousel .media-carousel .media-carousel-container { display: block; } .ie8 #global-ux .mediaCarousel .media-carousel .media-carousel-inner .carousel-arrows { position: absolute; top: 150px; display: block; } .ie8 #global-ux .mediaCarousel .media-carousel .carousel-btn.carousel-next .icon, .ie8 #global-ux .mediaCarousel .media-carousel .carousel-btn.carousel-previous .icon { margin-top: 0; } .ie8 #global-ux .mediaCarousel .media-carousel .carousel-btn.carousel-previous { top: 62px; } .ie8 #global-ux .mediaCarousel .media-carousel:hover .carousel-btn.carousel-next, .ie8 #global-ux .mediaCarousel .media-carousel:hover .carousel-btn.carousel-previous { right: 0; } #global-ux .mediaCarousel .media-carousel.max-item-1 .media-carousel-container .carousel-slide .media-carousel-video { border: none; } .ie8 #global-ux .mediaCarousel .media-carousel .media-carousel-container .carousel-slide .media-carousel-video { border-right: 10px solid transparent; } .ie8 #global-ux .mediaCarousel .media-carousel.max-item-1 .media-carousel-container .carousel-slide .media-carousel-video { border: none; } .ie8 #global-ux .mediaCarousel .media-carousel .media-carousel-container .carousel-slide .media-carousel-video .component-content>a { display: block; } .ie8 #global-ux .mediaCarousel .media-carousel-description { padding: 67px 0 47px; } .rtl #global-ux .mediaCarousel .media-carousel.carousel { direction: ltr; } .rtl #global-ux .mediaCarousel .media-carousel.carousel .carousel-arrows { right: auto; left: -62px; } .rtl #global-ux .mediaCarousel .media-carousel.carousel:hover .carousel-arrows { right: auto; left: 0; } .rtl #global-ux .mediaCarousel .media-carousel .image-caption h2 { font-size: 22px; font-size: 1.375rem; } @media only screen and (min-width: 48em) { .rtl #global-ux .mediaCarousel .media-carousel .image-caption h2 { font-size: 28px; font-size: 1.75rem; } } .rtl #global-ux .mediaCarousel .media-carousel .image-caption p { font-size: 18px; font-size: 1.125rem; } @media only screen and (min-width: 48em) { .rtl #global-ux .mediaCarousel .media-carousel .image-caption p { font-size: 22px; font-size: 1.375rem; } } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .image { display: block !important; } } .image img { -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; user-select: none; } #global-ux .splitter-column .image img { width: auto; max-width: 100%; } #global-ux .splitter-column .image .component-content { text-align: center !important; } #global-ux .origin img { width: auto !important; height: auto !important; max-width: 100%; } @media only screen and (max-width: 767px) { #global-ux .splitter-column .image img { width: 40%; } #global-ux .splitter-2-columns .splitter-column .image img, #global-ux .splitter-3-columns .splitter-column .image img { width: auto; } #global-ux .splitter-2-columns.next-steps .splitter-column .image img, #global-ux .splitter-3-columns.next-steps .splitter-column .image img { width: 30px; } } #global-ux .image .features-category-tile { -moz-box-shadow: 0 2px 2px rgba(0,0,0,0.2); -webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.2); box-shadow: 0 2px 2px rgba(0,0,0,0.2); position: relative; overflow: hidden; height: 215px; } #global-ux .image .features-category-tile:hover img, #global-ux .image .features-category-tile a:focus img { -webkit-transform: scale(1.15); -moz-transform: scale(1.15); -ms-transform: scale(1.15); -o-transform: scale(1.15); transform: scale(1.15); opacity: 0.7; } @media only screen and (min-width: 48em) { #global-ux .image .features-category-tile { margin: 0 15px 30px; height: auto; } } #global-ux .image .features-category-tile picture { display: block; background: #000; } #global-ux .image .features-category-tile picture img { -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease; transition: all 0.6s ease; opacity: 0.6; } #global-ux .image .features-category-tile .image-caption { position: absolute; top: 40%; width: 100%; text-align: center; } #global-ux .image .features-category-tile .image-caption h5, #global-ux .image .features-category-tile .image-caption p { color: #fff; text-shadow: 1px 1px 1px rgba(0,0,0,0.5); } #global-ux .image .features-category-tile .image-caption h5 { font-weight: 200; font-size: 30px; font-size: 1.875rem; margin-bottom: 0; line-height: 1; } #global-ux .image .features-category-tile .image-caption p { font-weight: 700; font-size: 14px; font-size: .875rem; position: relative; margin: 0; line-height: 1.5em; } #global-ux .image .features-category-tile .image-caption p .hidden-mobile:after { display: -moz-inline-stack; display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); font-weight: 400; font-size: 25px; font-size: 1.5625rem; position: absolute; content: "\e615"; font-family: "icomoon"; top: 50%; margin-left: 10px; } @media only screen and (min-width: 48em) { #global-ux .image .features-category-tile .image-caption p { display: block; } } #global-ux .image .video-link-overlay, #global-ux .image .link-overlay-video { text-align: left; } #global-ux .image .video-link-overlay picture, #global-ux .image .link-overlay-video picture { font-size: 4.0625rem; color: #fff; position: relative; display: none; } #global-ux .image .video-link-overlay picture:before, #global-ux .image .link-overlay-video picture:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #global-ux .image .video-link-overlay picture img, #global-ux .image .link-overlay-video picture img { width: auto; max-width: 100%; } #global-ux .image .video-link-overlay picture:before, #global-ux .image .link-overlay-video picture:before { content: "\e632"; position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); } @media only screen and (min-width: 48em) { #global-ux .image .video-link-overlay picture, #global-ux .image .link-overlay-video picture { display: inline-block; } } #global-ux .image .video-link-overlay .image-caption, #global-ux .image .link-overlay-video .image-caption { text-align: center; } @media only screen and (min-width: 48em) { #global-ux .image .video-link-overlay .image-caption, #global-ux .image .link-overlay-video .image-caption { text-align: left; } } #global-ux .image .video-link-overlay .image-caption a, #global-ux .image .link-overlay-video .image-caption a { color: #fff; text-decoration: none; font-weight: 400; font-size: 0.875rem; line-height: 1.875rem; letter-spacing: -0.05em; } #global-ux .image .image-fullscreen { position: relative; } #global-ux .image .image-fullscreen .button-container { position: absolute; bottom: 10px; right: 10px; padding: 7px; background: rgba(0,0,0,0.6); cursor: pointer; } #global-ux .image .image-fullscreen .button-toggle-fullscreen { text-indent: 100%; white-space: nowrap; overflow: hidden; background: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/fullscreen.png") 0 0 no-repeat; height: 21px; width: 21px; line-height: 21px; vertical-align: middle; text-align: center; display: block; } .overlay-fullscreen-container { position: fixed; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 10000; } #global-ux .overlay-fullscreen { -webkit-transition: opacity 0.5s ease; -moz-transition: opacity 0.5s ease; -ms-transition: opacity 0.5s ease; -o-transition: opacity 0.5s ease; transition: opacity 0.5s ease; position: relative; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; visibility: hidden; overflow-y: scroll; } #global-ux .overlay-fullscreen .icon-download { background-position: -594px -578px; } #global-ux .overlay-fullscreen .overlay-close { position: absolute; display: block; top: 0; right: 0; width: 65px; height: 65px; cursor: pointer; z-index: 2; overflow: hidden; } #global-ux .overlay-fullscreen .overlay-close .icon-plus { font-size: 28px; font-size: 1.75rem; display: block; height: 65px; width: 65px; line-height: 65px; font-weight: 200; text-align: center; vertical-align: middle; color: #fff; margin: 0; margin-left: 17px; } @media only screen and (min-width: 48em) { #global-ux .overlay-fullscreen .overlay-close .icon-plus { -webkit-transform: scale(1.35, 1.35); -ms-transform: scale(1.35, 1.35); -moz-transform: scale(1.35, 1.35); -o-transform: scale(1.35, 1.35); transform: scale(1.35, 1.35); margin: 8px 0 0 11px; } } #global-ux .overlay-fullscreen .overlay-close .icon-x { background-position: -63px -203px; } @media only screen and (min-width:48em) { #global-ux .overlay-fullscreen { -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; top: 0; } } body.fullscreen-active #global-ux .overlay-fullscreen { opacity: 1; visibility: visible; } #global-ux .overlay-fullscreen img { width: 100%; cursor: pointer; z-index: 1; } #global-ux .overlay-fullscreen .fullscreen-caption { position: relative; width: 100%; } #global-ux .overlay-fullscreen .fullscreen-caption h3 { font-weight: 200; font-size: 24px; font-size: 1.5rem; position: absolute; bottom: 0; margin: 0; width: 100%; padding: 30px; line-height: 1.1; color: #fff; background: rgba(0,0,0,0.6); cursor: pointer; } @media only screen and (min-width:30.0625em) { #global-ux .overlay-fullscreen .fullscreen-caption h3 { padding: 30px 60px; } } #global-ux .overlay-fullscreen .fullscreen-caption .actionsPanel .action { width: auto; } #global-ux .overlay-fullscreen .actionsPanel { position: absolute; right: 30px; bottom: 0; padding: 0; } @media only screen and (min-width:30.0625em) { #global-ux .overlay-fullscreen .actionsPanel { right: 60px; } } @media screen and (max-width: 767px) { #global-ux .overlay-fullscreen .actionsPanel { bottom: -50px; } } #global-ux .overlay-fullscreen .actionsPanel .action { font-size: 12px; font-size: .75rem; display: inline-block; color: #fff; margin: 0 0 13px 10px; } #global-ux .overlay-fullscreen .actionsPanel .action a { color: inherit; } #global-ux .overlay-fullscreen .actionsPanel .action [class*='icon-'] { display: block; text-align: center; } @media only screen and (max-width: 768px) { #global-ux .overlay-fullscreen img { position: absolute; top: 50%; transform: translateY(-50%); } #global-ux .overlay-fullscreen .fullscreen-caption { position: absolute; top: 0; height: 100%; } #global-ux .overlay-fullscreen .fullscreen-caption h3 { top: 0; bottom: auto; background: none; padding: 20px 50px 20px 20px; } #global-ux .overlay-fullscreen .fullscreen-caption .actionsPanel { bottom: 10px; } } #global-ux .brandGallery .image .black-caption .image-caption { background: rgba(0,0,0,0.5); } #global-ux .brandGallery .image .black-caption:hover .image-caption, #global-ux .brandGallery .image .black-caption a:active .image-caption, #global-ux .brandGallery .image .black-caption a:focus .image-caption { background: rgba(0,0,0,0.8); } .ie8 #global-ux .image .features-category-tile { margin: 0 15px 30px; height: auto; } .ie8 #global-ux .image .features-category-tile .image-caption p { line-height: 24px; display: block; } .ie8 #global-ux .image .image-fullscreen .button-container { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=60)"; background-color: black; } .ie8 #global-ux .overlay-fullscreen { top: 0; } .ie8 #global-ux .overlay-fullscreen .fullscreen-caption h3 { background-color: #666666; padding: 30px 60px; } .ie8 #global-ux .overlay-fullscreen .actionsPanel { right: 60px; } .ie8 #global-ux .image picture { font-size: 65px; margin-bottom: 20px; display: inline-block; } .ie8 #global-ux .image .image-caption { text-align: left; } .ie8 #global-ux .image .image-caption a { font-size: 14px; line-height: 30px; letter-spacing: -0.8px; letter-spacing: -0.05em; } .rtl #global-ux .overlay-fullscreen .overlay-close { left: 0; right: auto; direction: rtl; } .rtl #global-ux .overlay-fullscreen .actionsPanel { right: auto; left: 30px; } @media only screen and (min-width: 30.0625em) { .rtl #global-ux .overlay-fullscreen .actionsPanel { right: auto; left: 60px; } } #global-ux .accordion, #global-ux .accordionModelDetails { background-color: #fff; } @media only screen and (min-width: 48em) { #global-ux .accordion, #global-ux .accordionModelDetails { padding-bottom: 0; } } #global-ux .accordion ul, #global-ux .accordionModelDetails ul { list-style: none; padding: 0; margin: 0; } #global-ux .accordion li, #global-ux .accordionModelDetails li { position: relative; padding: 18px 0 4px; margin: 0; } #global-ux .accordion li:nth-of-type(1), #global-ux .accordionModelDetails li:nth-of-type(1) { animation-delay: 0.5s; } #global-ux .accordion li:nth-of-type(2), #global-ux .accordionModelDetails li:nth-of-type(2) { animation-delay: 0.75s; } #global-ux .accordion li:nth-of-type(3), #global-ux .accordionModelDetails li:nth-of-type(3) { animation-delay: 1.0s; } #global-ux .accordion li:last-of-type, #global-ux .accordionModelDetails li:last-of-type { padding-bottom: 0; } #global-ux .accordion li input[type=checkbox], #global-ux .accordionModelDetails li input[type=checkbox] { position: absolute; cursor: pointer; width: auto; height: auto; z-index: 1; opacity: 0; } #global-ux .accordion li input[type=checkbox]:checked ~ p, #global-ux .accordionModelDetails li input[type=checkbox]:checked ~ p { margin-top: 0; max-height: 0; opacity: 0; transform: translate(0, 50%); } #global-ux .accordion li input[type=checkbox]:checked ~ i:before, #global-ux .accordionModelDetails li input[type=checkbox]:checked ~ i:before { transform: translate(2px, 0) rotate(45deg); } #global-ux .accordion li input[type=checkbox]:checked ~ i:after, #global-ux .accordionModelDetails li input[type=checkbox]:checked ~ i:after { transform: translate(-2px, 0) rotate(-45deg); } #global-ux .accordion .richtext.section ul, #global-ux .accordionModelDetails .richtext.section ul { list-style-type: disc; padding-left: 20px; } #global-ux .accordion .richtext.section ul li, #global-ux .accordionModelDetails .richtext.section ul li { padding: 5px 0; } #global-ux .accordion .accordion-details-button, #global-ux .accordion .accordion-indicator, #global-ux .accordionModelDetails .accordion-details-button, #global-ux .accordionModelDetails .accordion-indicator { display: table-cell; vertical-align: middle; line-height: 1; } #global-ux .accordion .accordion-indicator, #global-ux .accordionModelDetails .accordion-indicator { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); -webkit-transition: -webkit-transform 0.2s ease; -moz-transition: -moz-transform 0.2s ease; -ms-transition: -ms-transform 0.2s ease; transition: transform 0.2s ease; font-size: 16px; font-size: 1rem; margin-left: 10px; line-height: 1; } @media only screen and (min-width: 48em) { #global-ux .accordion .accordion-indicator, #global-ux .accordionModelDetails .accordion-indicator { font-size: 18px; font-size: 1.125rem; } } @media only screen and (min-width: 62em) { #global-ux .accordion .accordion-indicator, #global-ux .accordionModelDetails .accordion-indicator { font-size: 24px; font-size: 1.5rem; } } #global-ux .accordion .accordion-item, #global-ux .accordionModelDetails .accordion-item { animation: none; margin: 0; padding: 0; } #global-ux .accordion .accordion-item.active .accordion-handle .accordion-indicator, #global-ux .accordionModelDetails .accordion-item.active .accordion-handle .accordion-indicator { -webkit-transform: rotate(270deg); -moz-transform: rotate(270deg); -ms-transform: rotate(270deg); -o-transform: rotate(270deg); transform: rotate(270deg); } #global-ux .accordion .accordion-item.active .accordion-body, #global-ux .accordionModelDetails .accordion-item.active .accordion-body { opacity: 1; } #global-ux .accordion .accordion-handle, #global-ux .accordionModelDetails .accordion-handle { font-size: 16px; font-size: 1rem; font-weight: 200; position: absolute; right: 70px; top: 50%; display: table; max-width: 30%; -webkit-transform: translateY(-40%); -moz-transform: translateY(-40%); -ms-transform: translateY(-40%); -o-transform: translateY(-40%); transform: translateY(-40%); } @media only screen and (max-width: 74.9375em) { #global-ux .accordion .accordion-handle, #global-ux .accordionModelDetails .accordion-handle { right: 40px; } } @media only screen and (max-width: 47.9375em) { #global-ux .accordion .accordion-handle, #global-ux .accordionModelDetails .accordion-handle { right: 10px; max-width: 35%; } } #global-ux .accordion .accordion-title, #global-ux .accordionModelDetails .accordion-title { position: relative; border-top: solid 1px rgba(206,206,206,0.5); background: #f7f7f7; padding: 1.9375rem 20px; overflow: hidden; cursor: pointer; } @media only screen and (min-width: 48em) { #global-ux .accordion .accordion-title, #global-ux .accordionModelDetails .accordion-title { padding: 1.3437rem 6.59722%; } } #global-ux .accordion .accordion-title a, #global-ux .accordionModelDetails .accordion-title a { text-decoration: none; display: block; } #global-ux .accordion .accordion-title h3, #global-ux .accordion .accordion-title i, #global-ux .accordionModelDetails .accordion-title h3, #global-ux .accordionModelDetails .accordion-title i { font-weight: 200; color: #2d96cd; float: left; line-height: 1; } #global-ux .accordion .accordion-title p, #global-ux .accordionModelDetails .accordion-title p { margin: 0; } #global-ux .accordion .accordion-title h3, #global-ux .accordionModelDetails .accordion-title h3 { font-size: 16px; font-size: 1rem; margin: 0; max-width: 70%; } @media only screen and (min-width: 48em) { #global-ux .accordion .accordion-title h3, #global-ux .accordionModelDetails .accordion-title h3 { font-size: 18px; font-size: 1.125rem; } } @media only screen and (min-width: 62em) { #global-ux .accordion .accordion-title h3, #global-ux .accordionModelDetails .accordion-title h3 { font-size: 24px; font-size: 1.5rem; } } @media only screen and (max-width: 47.9375em) { #global-ux .accordion .accordion-title h3, #global-ux .accordionModelDetails .accordion-title h3 { max-width: 60%; } } #global-ux .accordion .accordion-body, #global-ux .accordionModelDetails .accordion-body { -webkit-transition: height 0.5s linear,opacity 0.8s linear; -moz-transition: height 0.5s linear,opacity 0.8s linear; -ms-transition: height 0.5s linear,opacity 0.8s linear; -o-transition: height 0.5s linear,opacity 0.8s linear; transition: height 0.5s linear,opacity 0.8s linear; overflow: hidden; height: 0; opacity: 0; } #global-ux .accordion .accordion-body .accordion-content, #global-ux .accordionModelDetails .accordion-body .accordion-content { font-size: 16px; font-size: 1rem; font-weight: 200; color: #616161; border-top: none; padding: 0; } #global-ux .accordion .transition, #global-ux .accordionModelDetails .transition { -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -ms-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; } #global-ux .accordion .flipIn, #global-ux .accordion li, #global-ux .accordion .accordionModelDetails li, #global-ux .accordionModelDetails .accordion li, #global-ux .accordionModelDetails .flipIn, #global-ux .accordionModelDetails .accordion li, #global-ux .accordion .accordionModelDetails li, #global-ux .accordionModelDetails li { animation: flipdown 0.5s ease both; } #global-ux .accordion .no-select, #global-ux .accordionModelDetails .no-select { -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } #global-ux .accordion .actionsPanel, #global-ux .accordionModelDetails .actionsPanel { font-size: 12px; font-size: .75rem; width: 25%; float: right; text-align: right; color: #2d96cd; padding: 0; } .cq-wcm-edit #global-ux .accordion .actionsPanel, .cq-wcm-edit #global-ux .accordionModelDetails .actionsPanel { float: none; width: 100%; } #global-ux .accordion .actionsPanel+.richtext, #global-ux .accordionModelDetails .actionsPanel+.richtext { width: 75%; } #global-ux .accordion .actionsPanel+.richtext:after, #global-ux .accordionModelDetails .actionsPanel+.richtext:after { content: ""; display: table; clear: both; } .cq-wcm-edit #global-ux .accordion .actionsPanel+.richtext, .cq-wcm-edit #global-ux .accordionModelDetails .actionsPanel+.richtext { width: 100%; } #global-ux .accordion[data-disable-items-activation="1"] .accordion-title, #global-ux .accordionModelDetails[data-disable-items-activation="1"] .accordion-title { cursor: auto !important; } @keyframes flipdown { 0% { opacity: 0; transform-origin: top center; transform: rotateX(-90deg); } 5% { opacity: 1; } 80% { transform: rotateX(8deg); } 83% { transform: rotateX(6deg); } 92% { transform: rotateX(-3deg); } 100% { transform-origin: top center; transform: rotateX(0deg); } } .cq-wcm-design .accordion:not(.accordion-compare) .accordion-body, .cq-wcm-edit .accordion:not(.accordion-compare) .accordion-body { height: auto !important; opacity: 1 !important; } #global-ux .accordion-overlay { background: #fff; } #global-ux .accordion-overlay .accordion-item { position: relative; } @media only screen and (max-width: 768px) { #global-ux .accordion-overlay .accordion-item { padding-bottom: 60px !important; } } #global-ux .accordion-overlay .accordion-item.active { padding-bottom: 60px !important; } #global-ux .accordion-overlay .accordion-title { cursor: default; position: relative; padding-right: 170px; padding-bottom: 10px; } @media only screen and (max-width: 768px) { #global-ux .accordion-overlay .accordion-title { padding-right: 20px; } } #global-ux .accordion-overlay .accordion-title .accordion-handle { position: absolute; bottom: 15px; right: 20px; white-space: nowrap; cursor: pointer; } #global-ux .accordion-overlay .accordion-title h3 { color: #616161; line-height: normal; font-weight: 300; line-height: 1.8rem; } @media only screen and (min-width: 48em) { #global-ux .accordion-overlay .accordion-title { cursor: default; padding-left: 40px; padding-right: 170px; padding-bottom: 21px; } #global-ux .accordion-overlay .accordion-title .accordion-handle { bottom: 28px; right: 40px; } #global-ux .accordion-overlay .accordion-title h3 { font-weight: 200; line-height: 2.2rem; } } @media only screen and (max-width: 768px) { #global-ux .accordion-overlay .accordion-title { padding-top: 10px; } } #global-ux .accordion-overlay .accordion-handle { display: none; } @media only screen and (min-width: 48em) { #global-ux .accordion-overlay .accordion-handle { display: table; } } #global-ux .accordion-overlay .accordion-title { background: #fff; } #global-ux .accordion-overlay .accordion-title>a { cursor: default; } #global-ux .accordion-overlay .accordion-title .accordion-indicator { font-size: 16px; font-size: 1rem; } #global-ux .accordion-overlay .accordion-body { border-top: 0; opacity: 1; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; -webkit-transition: height 0.5s linear,opacity 0.8s linear; -moz-transition: height 0.5s linear,opacity 0.8s linear; -ms-transition: height 0.5s linear,opacity 0.8s linear; -o-transition: height 0.5s linear,opacity 0.8s linear; transition: height 0.5s linear,opacity 0.8s linear; border-top: 1px solid #e0e0e0; } #global-ux .accordion-overlay .accordion-body .actionsPanel { display: none; } #global-ux .accordion-overlay .accordion-body.active .actionsPanel { display: block; } #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content { padding: 6.59722%; } #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content:after { content: ""; display: table; clear: both; } #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content p { font-size: 16px; font-size: 1rem; color: #616161; line-height: 1.5rem; font-weight: 200; } @media screen and (max-width: 767px) { #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content p { font-size: 13px; font-size: .8125rem; } #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content p .icon-share { font-size: 1.2rem; } #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content p .icon-download { transform: scale(0.8, 0.8); } } @media only screen and (min-width: 48em) { #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content { padding: 40px 6.59722% 40px; } #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content p { font-weight: 300; } } #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .richText p { font-size: 16px; font-size: 1rem; color: #616161; } @media screen and (max-width: 767px) { #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .richText p { font-size: 13px; font-size: .8125rem; } } #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content { padding-right: 20px; padding-bottom: 0; position: static; overflow: visible !important; } #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .richtext { float: none; width: 100%; } #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .actionsPanel { position: absolute; right: 20px; bottom: 20px; margin: 0; float: none; width: 120px; } @media screen and (max-width: 767px) { #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .actionsPanel { bottom: 15px; } } @media only screen and (min-width: 48em) { #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .actionsPanel { width: 160px; } } #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .share-overlay { width: 100%; height: 100%; top: 0; left: 0; } #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .share-overlay, #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .share-overlay .share-overlay-bg, #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .share-overlay .share-wrapper { position: absolute; } #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .share-overlay .share-wrapper { top: 10%; left: -154px; -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); } @media only screen and (max-width: 47.9375em) { #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .share-overlay .share-wrapper { left: auto; right: -10px; } } #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .share-overlay .share-overlay-bg { width: 5000px; height: 1000px; left: -2000px; top: -450px; } @media only screen and (min-width: 48em) { #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .share-overlay .share-wrapper { left: -150px; top: auto; bottom: 0; -moz-transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); } #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .share-overlay .share-overlay-bg { width: 20000px; height: 20000px; left: -10000px; top: auto; bottom: -20px; } } @media only screen and (min-width: 48em) { #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content { padding-left: 40px; padding-right: 40px; } #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .actionsPanel { right: 40px; } } #global-ux .accordion-overlay .accordion-body .accordion-content .actionsPanel .action { width: auto; } #global-ux .accordion-overlay .accordion-body .accordion-content .actionsPanel .action a { font-size: 12px; } #global-ux .accordion-compare { margin-left: 0; background: #fff; line-height: 0; } #global-ux .accordion-compare .accordion-title { color: #2d96cd; cursor: default; padding: 20px 6.59722%; } @media only screen and (min-width: 48em) { #global-ux .accordion-compare .accordion-title { cursor: pointer; } } #global-ux .accordion-compare .accordion-title h3 { color: #2d96cd; font-weight: 200; } #global-ux .accordion-compare .accordion-title .accordion-indicator { font-size: 24px; font-size: 1.5rem; } #global-ux .accordion-compare .accordion-title.active { background: #fff; } #global-ux .accordion-compare .accordion-title.active .accordion-indicator { transform: rotate(-90deg); } #global-ux .accordion-compare .accordion-body { border-top: 0; opacity: 0; } #global-ux .accordion-compare .accordion-body.active { border-top: 0; opacity: 1; } @media only screen and (min-width: 48em) { #global-ux .accordion-compare .accordion-body { -webkit-transition: height 0.5s linear,opacity 0.8s linear; -moz-transition: height 0.5s linear,opacity 0.8s linear; -ms-transition: height 0.5s linear,opacity 0.8s linear; -o-transition: height 0.5s linear,opacity 0.8s linear; transition: height 0.5s linear,opacity 0.8s linear; } } #global-ux .accordion-compare .accordion-body .accordion-content { padding: 20px 6.59722%; } #global-ux .accordion-compare .accordion-body .compare-filter { position: relative; padding: 0 1.8rem 2.5rem; text-align: right; height: 25px; } #global-ux .accordion-compare .accordion-body .compare-filter .compare-filter-trigger { display: inline-block; height: 25px; } #global-ux .accordion-compare .accordion-body .compare-filter input[type=checkbox] { display: inline-block; height: 25px; } #global-ux .accordion-compare .accordion-body .compare-filter input[type=checkbox]:checked+label:before { background-color: #1b394e; } #global-ux .accordion-compare .accordion-body .compare-filter label { font-size: 12px; font-size: .75rem; } #global-ux .accordion-compare .accordion-body .compare-filter label:before { width: 21px; height: 21px; } #global-ux .accordion-compare .feature { position: relative; padding: 40px 0; border-top: 1px solid #EBEBEB; } #global-ux .accordion-compare .feature-title { position: static; } @media only screen and (min-width: 62em) { #global-ux .accordion-compare .feature-title { width: 25%; } } #global-ux .accordion-compare .feature-title>.scroll-follow.scf { max-width: 25%; } #global-ux .accordion-compare .feature-title .feature-heading { font-weight: 200; color: #333; } @media only screen and (min-width: 48em) { #global-ux .accordion-compare .feature-title .feature-heading { font-size: 24px; font-size: 1.5rem; max-width: 290px; } } @media only screen and (min-width: 62em) { #global-ux .accordion-compare .feature-title .feature-heading { font-size: 30px; font-size: 1.875rem; max-width: 345px; } } @media only screen and (min-width: 75em) { #global-ux .accordion-compare .feature-title .feature-heading { font-size: 36px; font-size: 2.25rem; max-width: 345px; } } @media only screen and (min-width: 62em) { #global-ux .accordion-compare .feature-table { width: 75%; } } #global-ux .accordion-compare .feature-table .table-content table td span>strong, #global-ux .accordion-compare .feature-table .table-content table td span>b { font-size: 12px; font-size: .75rem; font-weight: 400; } @media only screen { #global-ux .accordion-compare .feature-table { padding-left: 0; } } #global-ux .cols-3 .accordion-compare .feature.row, #global-ux .cols-3 .accordion-compare .feature.genericCarousel, #global-ux .cols-3 .accordion-compare .feature.dynamicCarousel, #global-ux .cols-3 .accordion-compare .feature.billboardCarousel, #global-ux .cols-3 .accordion-compare .feature.mediaCarousel, #global-ux .cols-3 .accordion-compare .feature.accessoriesTile, #global-ux .cols-3 .accordion-compare .mediaCarousel .feature.media-carousel, #global-ux .mediaCarousel .cols-3 .accordion-compare .feature.media-carousel, #global-ux .cols-3 .accordion-compare .feature.threesixtyColouriser { padding-left: 0; } #global-ux .accordionModelDetails .common-richtext ul, #global-ux .accordionModelDetails .common-billboard ul, #global-ux .accordionModelDetails .common-richtext ol, #global-ux .accordionModelDetails .common-billboard ol { list-style-type: disc; margin-bottom: 0; } @media only screen and (min-width: 769px) and (max-width: 991px) { #global-ux .accordionModelDetails .common-richtext ul, #global-ux .accordionModelDetails .common-billboard ul, #global-ux .accordionModelDetails .common-richtext ol, #global-ux .accordionModelDetails .common-billboard ol { font-size: 14px; font-size: .875rem; } } @media only screen and (min-width: 480px) and (max-width: 768px) { #global-ux .accordionModelDetails .common-richtext ul, #global-ux .accordionModelDetails .common-billboard ul, #global-ux .accordionModelDetails .common-richtext ol, #global-ux .accordionModelDetails .common-billboard ol { font-size: 14px; font-size: .875rem; } } @media only screen and (max-width: 479px) { #global-ux .accordionModelDetails .common-richtext ul, #global-ux .accordionModelDetails .common-billboard ul, #global-ux .accordionModelDetails .common-richtext ol, #global-ux .accordionModelDetails .common-billboard ol { font-size: 14px; font-size: .875rem; } } #global-ux .accordionModelDetails .content-two-col { width: 100%; display: block; } #global-ux .accordionModelDetails .content-table .section-title { margin-bottom: 35px; } #global-ux .accordionModelDetails .content-table table { margin-bottom: 35px; width: 100%; } #global-ux .accordionModelDetails .content-table table tr:nth-child(even) { background-color: #fff; } #global-ux .accordionModelDetails .content-table table tr:nth-child(odd) { background-color: #f3f3f3; } @media only screen and (min-width: 480px) and (max-width: 768px) { #global-ux .accordionModelDetails .content-table table .title { width: 80%; } #global-ux .accordionModelDetails .content-table table .data { width: 20%; } } @media only screen and (max-width: 479px) { #global-ux .accordionModelDetails .content-table table tr:nth-child(even) { background-color: #fff; } #global-ux .accordionModelDetails .content-table table tr:nth-child(odd) { background-color: #f3f3f3; } } #global-ux .accordionModelDetails .content-table .title { color: #231f20; width: 70%; } #global-ux .accordionModelDetails .content-table .data { color: #231f20; font-weight: 500; width: 30%; } @media only screen and (min-width: 480px) and (max-width: 768px) { #global-ux .accordionModelDetails .content-table .title { width: 80%; } #global-ux .accordionModelDetails .content-table .data { width: 20%; } } @media only screen and (max-width: 479px) { #global-ux .accordionModelDetails .content-table .title { width: 60%; } #global-ux .accordionModelDetails .content-table .data { width: 40%; } } #global-ux .accordionModelDetails .col-wrapper:after { content: ""; display: table; clear: both; } #global-ux .accordionModelDetails .col-wrapper .col-1, #global-ux .accordionModelDetails .col-wrapper .col-2 { width: 45%; display: inline-block; } #global-ux .accordionModelDetails .col-wrapper .col-1 { float: left; } #global-ux .accordionModelDetails .col-wrapper .col-2 { float: right; } @media only screen and (max-width: 479px) { #global-ux .accordionModelDetails .col-wrapper .col-1, #global-ux .accordionModelDetails .col-wrapper .col-2 { width: 90%; float: none; display: block; } } #global-ux .accordionModelDetails .section-title { margin: 0; } #global-ux .accordionModelDetails .section-subtitle { margin: 35px 0; } #global-ux .accordionModelDetails .section-subtitle:after { content: ""; display: table; clear: both; } .ie8 #global-ux .accordion .accordion-title, .ie8 #global-ux .accordionModelDetails .accordion-title { padding: 20px 6.59722%; border-top: 1px solid #e2e2e2; } .ie8 #global-ux .accordion .accordion-title h3, .ie8 #global-ux .accordionModelDetails .accordion-title h3 { font-size: 24px; } .ie8 #global-ux .accordion .accordion-title .accordion-handle, .ie8 #global-ux .accordionModelDetails .accordion-title .accordion-handle { margin-top: 5px; } .ie8 #global-ux .accordion, .ie8 #global-ux .accordionModelDetails { padding-bottom: 0; } .ie8 #global-ux .accordion .accordion-indicator, .ie8 #global-ux .accordionModelDetails .accordion-indicator { font-size: 18px; font-size: 1.125rem; font-size: 24px; font-size: 1.5rem; } .ie8 #global-ux .accordion .accordion-indicator:before, .ie8 #global-ux .accordionModelDetails .accordion-indicator:before { content: "\e641"; } .ie8 #global-ux .accordion .accordion-item.active .accordion-handle .accordion-indicator:before, .ie8 #global-ux .accordionModelDetails .accordion-item.active .accordion-handle .accordion-indicator:before { content: "\e640"; } .ie8 #global-ux .accordion .accordion-title, .ie8 #global-ux .accordionModelDetails .accordion-title { border-top: solid 1px #E7E7E7; padding: 22px 6.59722%; } .ie8 #global-ux .accordion .accordion-title h3, .ie8 #global-ux .accordionModelDetails .accordion-title h3 { font-size: 24px; font-size: 1.5rem; } @keyframes flipdown { 0% { } 80% { } 83% { } 92% { } 100% { } } .ie8 #global-ux .accordion .accordion-content>.box>.box-content, .ie8 #global-ux .accordionModelDetails .accordion-content>.box>.box-content { padding: 40px 6.59722% 55px; } .ie8 #global-ux .accordion-overlay .accordion-title { cursor: default; padding-left: 40px; padding-right: 170px; padding-bottom: 21px; } .ie8 #global-ux .accordion-overlay .accordion-title h3 { font-weight: 300; line-height: 35px; } .ie8 #global-ux .accordion-overlay .accordion-title .accordion-handle { position: absolute; bottom: 26px; right: 40px; white-space: nowrap; cursor: pointer; } .ie8 #global-ux .accordion-overlay .accordion-handle { display: table; } .ie8 #global-ux .accordion-overlay .accordion-body { border-top: 1px solid #e0e0e0; } .ie8 #global-ux .accordion-overlay .accordion-body .actionsPanel { display: none; } .ie8 #global-ux .accordion-overlay .accordion-body.active .actionsPanel { display: block; } .ie8 #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content { padding: 40px 6.59722% 40px; } .ie8 #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content p { line-height: 24px; font-weight: 300; } .ie8 #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content { padding-left: 40px; padding-right: 40px; } .ie8 #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .share-overlay .share-wrapper { left: -150px; top: auto; bottom: 0; } .ie8 #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .share-overlay .share-overlay-bg { width: 20000px; height: 20000px; left: -10000px; top: auto; bottom: -20px; } .ie8 #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .actionsPanel { right: 40px; } @media only screen and (min-width: 48em) { .rtl #global-ux .accordion-overlay .accordion-title { padding-right: 40px; padding-left: 170px; } } .rtl #global-ux .accordion-overlay .accordion-title h3 { font-size: 24px; font-size: 1.5rem; float: right; } .rtl #global-ux .accordion-overlay .accordion-title .accordion-handle { font-size: 20px; font-size: 1.25rem; right: auto; left: 0; } .rtl #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .actionsPanel { right: auto; left: 40px; width: 220px; } @media only screen and (min-width: 48em) { .rtl #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .actionsPanel { width: 220px; } } .rtl #global-ux .accordion-overlay .accordion-body .accordion-content .box .box-content .actionsPanel .action a { font-size: 18px; font-size: 1.125rem; } .rtl #global-ux .accordion .accordion-title h3, .rtl #global-ux .accordionModelDetails .accordion-title h3 { font-size: 24px; font-size: 1.5rem; float: right; } @media only screen and (max-width: 479px) { .rtl #global-ux .accordion .accordion-title h3, .rtl #global-ux .accordionModelDetails .accordion-title h3 { font-size: 16px; font-size: 1rem; } } .rtl #global-ux .accordion .accordion-title .accordion-indicator, .rtl #global-ux .accordionModelDetails .accordion-title .accordion-indicator { margin-right: 10px; } .rtl #global-ux .accordion .accordion-handle, .rtl #global-ux .accordionModelDetails .accordion-handle { right: auto; left: 60px; } @media only screen and (max-width: 74.9375em) { .rtl #global-ux .accordion .accordion-handle, .rtl #global-ux .accordionModelDetails .accordion-handle { left: 40px; } } @media only screen and (max-width: 47.9375em) { .rtl #global-ux .accordion .accordion-handle, .rtl #global-ux .accordionModelDetails .accordion-handle { left: 0; } } .rtl #global-ux .accordion .accordion-content .richtext p, .rtl #global-ux .accordionModelDetails .accordion-content .richtext p { font-size: 20px; font-size: 1.25rem; padding: 10px; } .rtl #global-ux .accordion .content-table .title, .rtl #global-ux .accordion .content-table .data, .rtl #global-ux .accordionModelDetails .content-table .title, .rtl #global-ux .accordionModelDetails .content-table .data { float: left; text-align: right; direction: ltr; } #global-ux .threesixtyColouriser { display: none; } #global-ux .threesixtyColouriser.service-ok { display: block; } #global-ux .threesixtyColouriser>.columns { padding-left: 0; padding-right: 0; } #global-ux .threesixtyColouriser a { color: #2d96cd; } #global-ux .threesixtyColouriser a:hover { color: #19678e; } #global-ux .threesixtyColouriser .image-list { border-bottom: 1px solid #cbcbcb; position: relative; } #global-ux .threesixtyColouriser .image-list ol { list-style: none; margin: 0; overflow: hidden; } #global-ux .threesixtyColouriser .image-list ol.multiple { cursor: pointer; } #global-ux .threesixtyColouriser .image-list .threesixty-control { background-color: transparent; color: #2d96cd; font-family: icomoon; font-size: 2.5rem; font-weight: bold; padding: 0; position: absolute; top: 50%; -webkit-tap-highlight-color: transparent; } @media only screen and (min-width: 62em) { #global-ux .threesixtyColouriser .image-list .threesixty-control { -webkit-tap-highlight-color: initial; } } #global-ux .threesixtyColouriser .image-list .threesixty-prev { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); left: 10px; margin-top: -28px; } #global-ux .threesixtyColouriser .image-list .threesixty-next { -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg); margin-top: -22px; right: 10px; } #global-ux .threesixtyColouriser .menu-container { padding-bottom: 80px; position: relative; } @media only screen and (min-width: 48em) { #global-ux .threesixtyColouriser .menu-container { padding-bottom: 0; } } #global-ux .threesixtyColouriser .menu-container .menu { background-color: #fff; list-style: none; margin: 0; position: absolute; width: 100%; z-index: 1; } @media only screen and (min-width: 48em) { #global-ux .threesixtyColouriser .menu-container .menu { position: relative; text-align: center; } } #global-ux .threesixtyColouriser .menu-container .menu li { display: none; font-size: 1.125rem; } @media only screen and (min-width: 48em) { #global-ux .threesixtyColouriser .menu-container .menu li { display: inline-block; } } #global-ux .threesixtyColouriser .menu-container .menu li.selected { display: block; } @media only screen and (min-width: 48em) { #global-ux .threesixtyColouriser .menu-container .menu li.selected { display: inline-block; } #global-ux .threesixtyColouriser .menu-container .menu li.selected a { border-bottom: 4px solid #1b394e; color: #1b394e; } } @media only screen and (min-width: 48em) { #global-ux .threesixtyColouriser .menu-container .menu li:hover a { color: #2d96cd; border-bottom: 4px solid #2d96cd; } } #global-ux .threesixtyColouriser .menu-container .menu li a { -webkit-transition: border-bottom 0.2s; -moz-transition: border-bottom 0.2s; -ms-transition: border-bottom 0.2s; -o-transition: border-bottom 0.2s; transition: border-bottom 0.2s; font-weight: 300; border-bottom: 4px solid transparent; color: #2d96cd; display: block; padding: 24px 20px 20px 20px; text-decoration: none; } @media only screen and (min-width: 48em) { #global-ux .threesixtyColouriser .menu-container .menu li a { padding: 21px 20px; } } #global-ux .threesixtyColouriser .menu-container .menu li a span.icon-chevron-thin-down { font-weight: bold; font-size: 2rem; } @media only screen and (min-width: 48em) { #global-ux .threesixtyColouriser .menu-container .menu li a span.icon-chevron-thin-down { display: none; } } #global-ux .threesixtyColouriser .menu-container.menu-open .menu li { display: block; } @media only screen and (min-width: 48em) { #global-ux .threesixtyColouriser .menu-container.menu-open .menu li { display: inline-block; } } #global-ux .threesixtyColouriser .features { background-color: #f7f7f7; border-top: 1px solid #cbcbcb; padding-bottom: 80px; } @media only screen and (min-width: 48em) { #global-ux .threesixtyColouriser .features { padding-bottom: 46px; } } #global-ux .threesixtyColouriser .features .feature-heading { font-weight: 300; color: #616161; font-size: 1.25rem; padding-bottom: 20px; padding-top: 34px; text-align: center; } @media only screen and (min-width: 48em) { #global-ux .threesixtyColouriser .features .feature-heading { margin-bottom: 22px; padding-bottom: 0; } } #global-ux .threesixtyColouriser .features .features-container { margin-bottom: 60px; overflow-x: auto; position: relative; width: 100%; } @media only screen and (min-width: 48em) { #global-ux .threesixtyColouriser .features .features-container { margin-bottom: 40px; } } #global-ux .threesixtyColouriser .features .feature-swatches { list-style: none; margin-left: 0; margin-bottom: 0; position: relative; text-align: center; white-space: nowrap; } #global-ux .threesixtyColouriser .features .feature-swatches li { -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; display: inline-block; } #global-ux .threesixtyColouriser .features .feature-swatches li a { background-color: transparent; background-repeat: no-repeat; color: #fff; cursor: pointer; display: block; margin-right: 5px; position: relative; background-size: cover; height: 60px; width: 60px; border-radius: 50%; } #global-ux .threesixtyColouriser .features .feature-swatches li a .icon-checked { -webkit-transition: opacity 0.2s; -moz-transition: opacity 0.2s; -ms-transition: opacity 0.2s; -o-transition: opacity 0.2s; transition: opacity 0.2s; color: #fff; font-size: 2rem; margin: -1rem 0 0 -1rem; left: 50%; position: absolute; top: 50%; } #global-ux .threesixtyColouriser .features .feature-swatches li:hover { opacity: 1; filter: alpha(opacity=100); } @media only screen and (min-width: 48em) { #global-ux .threesixtyColouriser .features .feature-swatches li:hover { opacity: .7; filter: alpha(opacity=70); } } #global-ux .threesixtyColouriser .features .feature-swatches li:hover .icon-checked { opacity: 1; filter: alpha(opacity=100); } @media only screen and (min-width: 48em) { #global-ux .threesixtyColouriser .features .feature-swatches li:hover .icon-checked { opacity: .5; filter: alpha(opacity=50); } } #global-ux .threesixtyColouriser .three-sixty-cta { text-align: center; } #global-ux .threesixtyColouriser .three-sixty-cta a { border: 1px solid #2d96cd; box-shadow: 0 2px 3px rgba(0,0,0,0.15); font-size: 1rem; padding: 22px 82px; } @media only screen and (min-width: 48em) { #global-ux .threesixtyColouriser .three-sixty-cta a { font-size: 1rem; padding: 8px 42px; } } #global-ux .threesixtyColouriser .three-sixty-cta a:hover, #global-ux .threesixtyColouriser .three-sixty-cta a:active, #global-ux .threesixtyColouriser .three-sixty-cta a:focus { background-color: #fff; border-color: #003478; color: #003478; } #global-ux .threesixtyColouriser .repeat-animation.ng-enter { -webkit-transition: all linear 0.3s; -moz-transition: all linear 0.3s; -ms-transition: all linear 0.3s; -o-transition: all linear 0.3s; transition: all linear 0.3s; opacity: 0; } #global-ux .threesixtyColouriser .repeat-animation.ng-enter.ng-enter-active { opacity: 1; } #global-ux .threesixtyColouriser .repeat-animation.ng-leave { opacity: 1; } #global-ux .threesixtyColouriser .repeat-animation.ng-leave.ng-leave-active { opacity: 0; } #global-ux .threesixtyColouriser .repeat-animation.ng-move { opacity: 0.5; } #global-ux .threesixtyColouriser .repeat-animation.ng-move.ng-move-active { opacity: 1; } #global-ux .threesixtyColouriser .component-content.white .threesixty-control { color: #fff; } #global-ux .threesixtyColouriser .component-content.blue .threesixty-control { color: #2d96cd; } #global-ux .vehicleAttribute { font-weight: 200; font-size: 30px; font-size: 1.875rem; display: none; position: relative; padding: 18px 0; color: #1b394e; width: 100%; } #global-ux .vehicleAttribute .component-content { font-size: 20px; font-size: 1.25rem; display: inline-block; margin-right: 0; position: relative; } @media only screen and (min-width: 30.0625em) { #global-ux .vehicleAttribute .component-content { display: inline-block; margin-right: 25px; } } #global-ux .vehicleAttribute .component-content sup[data-disclosure] { font-size: 70%; position: absolute; left: 105%; top: 0; line-height: 1; white-space: nowrap; } @media only screen and (min-width: 30.0625em) { #global-ux .vehicleAttribute .component-content sup[data-disclosure] { top: -5px; } } #global-ux .vehicleAttribute.service-ok { display: block; } @media (max-width: 767px) { #global-ux .vehicleAttribute.service-ok { width: 100%; } } @media only screen and (min-width: 30.0625em) { #global-ux .vehicleAttribute { padding: 28px 0 20px; width: auto; } } #global-ux .vehicleAttribute .attribute-prefix, #global-ux .vehicleAttribute .attribute-suffix, #global-ux .vehicleAttribute .attribute { display: -moz-inline-stack; display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; } #global-ux .vehicleAttribute .attribute-prefix { line-height: normal; margin: 3px 0 8px; } #global-ux .vehicleAttribute sup { cursor: pointer; } .ie8 #global-ux .vehicleAttribute { padding: 28px 0 20px !important; width: auto !important; font-size: 30px; float: left; } .ie8 #global-ux .vehicleAttribute .price-retail span.attribute-prefix, .ie8 #global-ux .vehicleAttribute .price-retail span.attribute-group { display: block !important; } .ie8 #global-ux .vehicle-attributes>div>.splitter-column { border-bottom: none; width: 49%; } .ie8 #global-ux .vehicleAttribute .component-content { font-size: 20px; display: inline-block; margin-right: 25px; margin-left: 10px; } .ie8 #global-ux .vehicle-attributes { border-top: 1px solid #979797; border-bottom: 1px solid #979797; } .ie8 #global-ux .vehicle-attributes .fuel-seating-segment .fuel-segment { width: 70%; } .ie8 #global-ux .vehicle-attributes .fuel-seating-segment .seating-segment { width: 30%; } .ie8 #global-ux .vehicle-attributes .pricing-segment, .ie8 #global-ux .vehicle-attributes .fuel-seating-segment { margin-bottom: -3px; } .ie8 #global-ux .vehicle-attributes .pricing-segment { width: 50.15%; } .ie8 #global-ux .vehicle-attributes>div>.splitter-column .sameHeightSplitter { min-height: 120px; } .ie8 .borderRightIE { border-right: 1px solid #979797; } .ie9 #global-ux .vehicleAttribute { padding: 28px 0 20px !important; width: auto !important; font-size: 30px; float: left; } .ie9 #global-ux .vehicle-attributes>div>.splitter-column { border-bottom: none; width: 49%; } .ie9 #global-ux .vehicleAttribute .component-content { font-size: 20px; } .ie9 #global-ux .vehicle-attributes { border-top: 1px solid #979797; border-bottom: 1px solid #979797; } .ie9 .borderRightIE { border-right: 1px solid #979797; } #global-ux .price-promotional, #global-ux .price-retail, #global-ux .price-minimal, #global-ux .price-maximal, #global-ux .startingPrice, #global-ux .maxPrice, #global-ux .seatingNo, #global-ux .fuelEfficiencyFrom, #global-ux .fuelEfficiencyTo { display: -moz-inline-stack; display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; margin-right: 25px; } @media only screen and (min-width: 30.0625em) { #global-ux .price-promotional, #global-ux .price-retail, #global-ux .price-minimal, #global-ux .price-maximal, #global-ux .startingPrice, #global-ux .maxPrice, #global-ux .seatingNo, #global-ux .fuelEfficiencyFrom, #global-ux .fuelEfficiencyTo { margin-right: 15px; margin-left: 10px; } } #global-ux .price-promotional .attribute-prefix, #global-ux .price-retail .attribute-prefix, #global-ux .price-minimal .attribute-prefix, #global-ux .price-maximal .attribute-prefix, #global-ux .startingPrice .attribute-prefix, #global-ux .maxPrice .attribute-prefix, #global-ux .seatingNo .attribute-prefix, #global-ux .fuelEfficiencyFrom .attribute-prefix, #global-ux .fuelEfficiencyTo .attribute-prefix { font-size: 14px; font-size: .875rem; font-weight: 300; display: inline-block; color: #616161; } @media only screen and (min-width: 30.0625em) { #global-ux .price-promotional .attribute-prefix, #global-ux .price-retail .attribute-prefix, #global-ux .price-minimal .attribute-prefix, #global-ux .price-maximal .attribute-prefix, #global-ux .startingPrice .attribute-prefix, #global-ux .maxPrice .attribute-prefix, #global-ux .seatingNo .attribute-prefix, #global-ux .fuelEfficiencyFrom .attribute-prefix, #global-ux .fuelEfficiencyTo .attribute-prefix { display: block; } } #global-ux .price-promotional .attribute, #global-ux .price-retail .attribute, #global-ux .price-minimal .attribute, #global-ux .price-maximal .attribute, #global-ux .startingPrice .attribute, #global-ux .maxPrice .attribute, #global-ux .seatingNo .attribute, #global-ux .fuelEfficiencyFrom .attribute, #global-ux .fuelEfficiencyTo .attribute { font-size: 21px; font-size: 1.3125rem; color: #1b394e; } @media only screen and (min-width: 30.0625em) { #global-ux .price-promotional .attribute, #global-ux .price-retail .attribute, #global-ux .price-minimal .attribute, #global-ux .price-maximal .attribute, #global-ux .startingPrice .attribute, #global-ux .maxPrice .attribute, #global-ux .seatingNo .attribute, #global-ux .fuelEfficiencyFrom .attribute, #global-ux .fuelEfficiencyTo .attribute { font-size: 31px; font-size: 1.9375rem; } } #global-ux .loading-price { position: relative; color: transparent !important; } #global-ux .loading-price:after { content: ''; display: block; position: absolute; width: 30px; height: 30px; background-image: url(/etc/designs/guxfoap/clientlibs/guxfoap/img/loader-blue-small-30.gif); top: 0; left: 12px; } .ie8 #global-ux .price-retail .attribute-prefix { display: block; } .ie8 #global-ux .price-retail .attribute { font-size: 30px; } #global-ux .vehicle-attributes .specs-engine-mpg-0, #global-ux .vehicle-attributes .specs-engine-mpg-1, #global-ux .vehicle-attributes .specs-engine-mpg-0-extended, #global-ux .vehicle-attributes .specs-engine-mpg-1-extended, #global-ux .vehicle-attributes .specs-engine-mpg-0-standard, #global-ux .vehicle-attributes .specs-engine-mpg-1-standard { float: right; width: 100%; } @media only screen and (min-width: 30.0625em) { #global-ux .vehicle-attributes .specs-engine-mpg-0, #global-ux .vehicle-attributes .specs-engine-mpg-1, #global-ux .vehicle-attributes .specs-engine-mpg-0-extended, #global-ux .vehicle-attributes .specs-engine-mpg-1-extended, #global-ux .vehicle-attributes .specs-engine-mpg-0-standard, #global-ux .vehicle-attributes .specs-engine-mpg-1-standard { width: auto; } } #global-ux .component-content.specs-engine-mpg-0, #global-ux .component-content.specs-engine-mpg-1, #global-ux .component-content.specs-engine-mpg-1-extended, #global-ux .component-content.specs-engine-mpg-0-standard, #global-ux .component-content.specs-engine-mpg-1-standard { font-size: 20px; font-size: 1.25rem; } #global-ux .component-content.specs-engine-mpg-0 .engine-name, #global-ux .component-content.specs-engine-mpg-1 .engine-name, #global-ux .component-content.specs-engine-mpg-1-extended .engine-name, #global-ux .component-content.specs-engine-mpg-0-standard .engine-name, #global-ux .component-content.specs-engine-mpg-1-standard .engine-name { font-size: 20px; font-size: 1.25rem; display: inline; float: none; vertical-align: baseline; width: 100%; } #global-ux .splitter .specs-engine-mpg-0, #global-ux .splitter .specs-engine-mpg-1, #global-ux .splitter .specs-engine-mpg-0-extended, #global-ux .splitter .specs-engine-mpg-1-extended, #global-ux .splitter .specs-engine-mpg-0-standard, #global-ux .splitter .specs-engine-mpg-1-standard { display: -moz-inline-stack; display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; float: none; padding-bottom: 10px; text-align: center; } @media only screen and (min-width: 30.0625em) { #global-ux .splitter .specs-engine-mpg-0, #global-ux .splitter .specs-engine-mpg-1, #global-ux .splitter .specs-engine-mpg-0-extended, #global-ux .splitter .specs-engine-mpg-1-extended, #global-ux .splitter .specs-engine-mpg-0-standard, #global-ux .splitter .specs-engine-mpg-1-standard { margin-right: 25px; padding: 0; } } #global-ux .splitter .specs-engine-mpg-0 .attribute, #global-ux .splitter .specs-engine-mpg-1 .attribute, #global-ux .splitter .specs-engine-mpg-0-extended .attribute, #global-ux .splitter .specs-engine-mpg-1-extended .attribute, #global-ux .splitter .specs-engine-mpg-0-standard .attribute, #global-ux .splitter .specs-engine-mpg-1-standard .attribute { font-size: 18px; font-size: 1.125rem; color: #1b394e; text-align: right; width: 100%; } @media only screen and (min-width: 30.0625em) { #global-ux .splitter .specs-engine-mpg-0 .attribute, #global-ux .splitter .specs-engine-mpg-1 .attribute, #global-ux .splitter .specs-engine-mpg-0-extended .attribute, #global-ux .splitter .specs-engine-mpg-1-extended .attribute, #global-ux .splitter .specs-engine-mpg-0-standard .attribute, #global-ux .splitter .specs-engine-mpg-1-standard .attribute { font-size: 31px; font-size: 1.9375rem; text-align: center; position: initial; } } #global-ux .splitter .specs-engine-mpg-0 .attribute .engine-name, #global-ux .splitter .specs-engine-mpg-1 .attribute .engine-name, #global-ux .splitter .specs-engine-mpg-0-extended .attribute .engine-name, #global-ux .splitter .specs-engine-mpg-1-extended .attribute .engine-name, #global-ux .splitter .specs-engine-mpg-0-standard .attribute .engine-name, #global-ux .splitter .specs-engine-mpg-1-standard .attribute .engine-name { font-size: 12px; font-size: .75rem; font-weight: 200; display: -moz-inline-stack; display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; float: left; line-height: 22px; margin-bottom: 5px; text-align: left; width: 50%; } @media only screen and (min-width: 30.0625em) { #global-ux .splitter .specs-engine-mpg-0 .attribute .engine-name, #global-ux .splitter .specs-engine-mpg-1 .attribute .engine-name, #global-ux .splitter .specs-engine-mpg-0-extended .attribute .engine-name, #global-ux .splitter .specs-engine-mpg-1-extended .attribute .engine-name, #global-ux .splitter .specs-engine-mpg-0-standard .attribute .engine-name, #global-ux .splitter .specs-engine-mpg-1-standard .attribute .engine-name { display: block; line-height: 1; float: none; width: auto; position: initial; text-align: center; text-transform: uppercase; } } #global-ux .splitter .specs-engine-mpg-0 .attribute-prefix, #global-ux .splitter .specs-engine-mpg-0 .attribute-suffix, #global-ux .splitter .specs-engine-mpg-1 .attribute-prefix, #global-ux .splitter .specs-engine-mpg-1 .attribute-suffix, #global-ux .splitter .specs-engine-mpg-0-extended .attribute-prefix, #global-ux .splitter .specs-engine-mpg-0-extended .attribute-suffix, #global-ux .splitter .specs-engine-mpg-1-extended .attribute-prefix, #global-ux .splitter .specs-engine-mpg-1-extended .attribute-suffix, #global-ux .splitter .specs-engine-mpg-0-standard .attribute-prefix, #global-ux .splitter .specs-engine-mpg-0-standard .attribute-suffix, #global-ux .splitter .specs-engine-mpg-1-standard .attribute-prefix, #global-ux .splitter .specs-engine-mpg-1-standard .attribute-suffix { display: none; } #global-ux .richtext+.vehicleAttribute .specs-engine-mpg-0, #global-ux .richtext+.vehicleAttribute .specs-engine-mpg-1, #global-ux .richtext+.vehicleAttribute .specs-engine-mpg-0-extended, #global-ux .richtext+.vehicleAttribute .specs-engine-mpg-1-extended, #global-ux .richtext+.vehicleAttribute .specs-engine-mpg-0-standard, #global-ux .richtext+.vehicleAttribute .specs-engine-mpg-1-standard { padding-top: 10px; padding-bottom: 0; } @media only screen and (min-width: 30.0625em) { #global-ux .richtext+.vehicleAttribute .specs-engine-mpg-0, #global-ux .richtext+.vehicleAttribute .specs-engine-mpg-1, #global-ux .richtext+.vehicleAttribute .specs-engine-mpg-0-extended, #global-ux .richtext+.vehicleAttribute .specs-engine-mpg-1-extended, #global-ux .richtext+.vehicleAttribute .specs-engine-mpg-0-standard, #global-ux .richtext+.vehicleAttribute .specs-engine-mpg-1-standard { padding: 0; } } #global-ux .specs-number-of-seats .attribute-prefix { font-size: 20px; font-size: 1.25rem; } #global-ux .splitter .specs-number-of-seats { display: block; padding-bottom: 20px; } @media only screen and (min-width: 30.0625em) { #global-ux .splitter .specs-number-of-seats { margin-right: 25px; padding: 0; } } #global-ux .splitter .specs-number-of-seats.component-content.component-content sup[data-disclosure] { left: 102%; } @media only screen and (min-width: 48em) { #global-ux .splitter .specs-number-of-seats.component-content.component-content sup[data-disclosure] { left: 105%; } } #global-ux .splitter .specs-number-of-seats .attribute-prefix { font-size: 12px; font-size: .75rem; font-weight: 300; display: -moz-inline-stack; display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; color: #333; } @media only screen and (min-width: 30.0625em) { #global-ux .splitter .specs-number-of-seats .attribute-prefix { font-size: 14px; font-size: .875rem; display: block; } } #global-ux .splitter .specs-number-of-seats .attribute { font-size: 18px; font-size: 1.125rem; position: absolute; right: 0; bottom: 20px; color: #1b394e; } @media only screen and (min-width: 30.0625em) { #global-ux .splitter .specs-number-of-seats .attribute { font-size: 31px; font-size: 1.9375rem; position: relative; bottom: 0; } } #global-ux .richtext sup[data-disclosure] { cursor: pointer; font-size: 12px; font-size: .75rem; line-height: 1; white-space: nowrap; } @media only screen and (max-width: 30em) { #global-ux .richtext sup[data-disclosure] { font-size: 15px; font-size: .9375rem; } } #global-ux .richtext h2 { color: #616161; margin: 0 0 10px; font-weight: 200; } #global-ux .richtext h3, #global-ux .richtext h4 { font-weight: 200; } #global-ux .richtext p { color: #616161; } #global-ux .richtext h1, #global-ux .richtext h2, #global-ux .richtext h3, #global-ux .richtext h4, #global-ux .richtext h5, #global-ux .richtext h6 { font-weight: 200; line-height: 1.1; text-indent: 0; } @media screen and (max-width: 480px) { #global-ux .richtext h1 { font-size: 1.875rem; } } @media only screen and (min-width: 481px) and (max-width: 768px) { #global-ux .richtext h1 { font-size: 2.25rem; } } @media only screen and (min-width: 769px) and (max-width: 991px) { #global-ux .richtext h1 { font-size: 2.625rem; } } @media only screen and (min-width: 992px) { #global-ux .richtext h1 { font-size: 3rem; } } @media screen and (max-width: 480px) { #global-ux .richtext h2 { font-size: 1.5rem; } } @media only screen and (min-width: 481px) and (max-width: 768px) { #global-ux .richtext h2 { font-size: 1.875rem; } } @media only screen and (min-width: 769px) and (max-width: 991px) { #global-ux .richtext h2 { font-size: 2.25rem; } } @media only screen and (min-width: 992px) { #global-ux .richtext h2 { font-size: 2.625rem; } } @media screen and (max-width: 480px) { #global-ux .richtext h3 { font-size: 1.3rem; } } @media only screen and (min-width: 481px) and (max-width: 768px) { #global-ux .richtext h3 { font-size: 1.5rem; } } @media only screen and (min-width: 769px) and (max-width: 991px) { #global-ux .richtext h3 { font-size: 1.875rem; } } @media only screen and (min-width: 992px) { #global-ux .richtext h3 { font-size: 2.25rem; } } @media screen and (max-width: 480px) { #global-ux .richtext h4 { font-size: 1.125rem; } } @media only screen and (min-width: 481px) and (max-width: 768px) { #global-ux .richtext h4 { font-size: 1.3rem; } } @media only screen and (min-width: 769px) and (max-width: 991px) { #global-ux .richtext h4 { font-size: 1.5rem; } } @media only screen and (min-width: 992px) { #global-ux .richtext h4 { font-size: 1.875rem; } } @media screen and (max-width: 480px) { #global-ux .richtext h5 { font-size: 1.5rem; } } @media only screen and (min-width: 481px) and (max-width: 768px) { #global-ux .richtext h5 { font-size: 1.125rem; } } @media only screen and (min-width: 769px) and (max-width: 991px) { #global-ux .richtext h5 { font-size: 1.125rem; } } @media only screen and (min-width: 992px) { #global-ux .richtext h5 { font-size: 1.5rem; } } @media screen and (max-width: 480px) { #global-ux .richtext h6 { font-size: 1rem; } } @media only screen and (min-width: 481px) and (max-width: 768px) { #global-ux .richtext h6 { font-size: 1rem; } } @media only screen and (min-width: 769px) and (max-width: 991px) { #global-ux .richtext h6 { font-size: 1rem; } } @media only screen and (min-width: 992px) { #global-ux .richtext h6 { font-size: 1.125rem; } } #global-ux .richtext p { line-height: 1.4rem; } @media only screen and (max-width: 991px) { #global-ux .richtext p { font-size: 0.875rem; } } @media only screen and (min-width: 992px) { #global-ux .richtext p { font-size: 1rem; } } #global-ux .richtext small { font-size: 0.75rem; } #global-ux .feature-container .richtext h2 { font-weight: 200; } .ie8 #global-ux .richtext h4 { font-size: 30px; margin-bottom: 8px; } .ie8 #global-ux .richtext h6 { font-size: 18px; line-height: 20px; } .ie8 #global-ux .richtext p { font-size: 16px; line-height: 22px; } .ie8 #global-ux .richtext h5 { font-size: 24px; margin-bottom: 8px; } .ie8 #global-ux .richtext h3 { font-size: 34px; } .ie8 #global-ux .richtext .link-chevron { position: relative; } .ie8 #global-ux .richtext .link-chevron:after { top: 50%; margin-top: -12px; } .ie8 #global-ux .feature-container .richtext h2 { font-size: 40px; color: #616161; } .ie8 #global-ux .feature-container .richtext h2 a { color: #616161; } .ie8 #global-ux .feature-container .richtext h3 { font-size: 34px; } .ie8 #global-ux .splitter .image .image-caption h6 a { font-size: 18px; } #global-ux .richtext-gridgallery-header { width: 100%; padding: 40px 7.5% 35px; margin: 0 auto; background: #f7f7f7; } @media only screen and (min-width: 30.0625em) { #global-ux .richtext-gridgallery-header { padding: 60px 7.5% 55px; } } #global-ux .richtext-gridgallery-header h2 { font-weight: 200; margin: 0 0 10px; color: #616161; line-height: 1.4; } @media only screen and (min-width: 30.0625em) { #global-ux .richtext-gridgallery-header h2 strong { color: #1b394e; } } #global-ux .richtext-gridgallery-header p { color: #616161; } @media only screen and (min-width: 48em) { .richtext .hidden-desktop, .image-caption .hidden-desktop { display: none; } } .ie8 .richtext .hidden-desktop, .ie8 .image-caption .hidden-desktop { display: none; } @media only screen and (max-width: 768px) { .richtext .hidden-mobile, .image-caption .hidden-mobile { display: none; } } @media only screen and (min-width: 769px) { .richtext .hidden-mobile, .image-caption .hidden-mobile { display: none; } } @media only screen and (min-width: 48em) { .richtext .bold-desktop { font-weight: 400; } } .richtext .dark-blue { color: #1b394e; } .richtext .quote { font-size: 14px; font-size: .875rem; font-weight: 700; display: block; margin: 0 30px; color: #1b394e; line-height: 1.6rem; } @media only screen and (min-width: 48em) { .richtext .quote { font-size: 25px; font-size: 1.5625rem; font-weight: 300; margin: 0 60px 0 150px; line-height: 2.6rem; } } .richtext .quote:before, .richtext .quote:after { font-size: 35px; font-size: 2.1875rem; position: absolute; margin-top: 2px; } @media only screen and (min-width: 48em) { .richtext .quote:before, .richtext .quote:after { font-size: 65px; font-size: 4.0625rem; margin-top: 8px; } } .richtext .quote:before { content: "\201C"; margin-left: -25px; } @media only screen and (min-width: 48em) { .richtext .quote:before { margin-left: -29px; } } .richtext .quote:after { content: "\201D"; } .richtext .small { font-size: 11px; font-size: .6875rem; } .richtext .grey-reference-block { display: -moz-inline-stack; display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; background-color: #f7f7f7; padding: 30px 20px; } @media only screen and (min-width: 48em) { .richtext .grey-reference-block { padding: 40px 30px; } } #global-ux .richtext .link-chevron { position: relative; display: initial; align-items: center; text-shadow: none; text-decoration: none; width: 100%; } #global-ux .richtext .link-chevron:after { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #global-ux .richtext .link-chevron:after { display: inline; margin: 0 0 0 0.5em; font-size: 151%; position: absolute; top: 46%; left: auto; -ms-transform: translate(0px, -50%); -moz-transform: translate(0px, -50%); -webkit-transform: translate(0px, -50%); -o-transform: translate(0px, -50%); transform: translate(0px, -50%); } #global-ux .richtext .link-chevron.multi-break:after { margin: 0 0 0 1.375em; } @media only screen and (max-width: 479px) { #global-ux .richtext .link-chevron.multi-break:after { margin: 0 0 0 1.25em; } } @media only screen and (min-width: 30.0625em) { #global-ux .richtext .link-chevron { width: auto; } #global-ux .richtext .link-chevron+.link-chevron { margin-left: 1em; } } #global-ux .richtext .link-chevron-thin { position: relative; display: inline-block; text-shadow: none; text-decoration: none; } #global-ux .richtext .link-chevron-thin:after { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #global-ux .richtext .link-chevron-thin:after { display: inline; margin: 0 0 0 0.25em; } #global-ux .richtext .link-blue-and-bold-new-window { font-weight: 700; text-decoration: none; } #global-ux .richtext .link-blue-and-bold-new-window:after { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #global-ux .richtext .link-blue-and-bold-new-window:after { font-size: 12px; font-size: .75rem; display: inline; margin: 0 0.5em; vertical-align: super; } #global-ux .richtext .link-white-underline { color: #fff; text-decoration: underline; } div#global-ux.page .content div.richtext p.link-blue-and-bold:focus, div#global-ux.page .content div.richtext a.link-blue-and-bold:focus, div#global-ux.page .content div.richtext span.link-blue-and-bold:focus, div#global-ux.page .main-nav div.richtext p.link-blue-and-bold:focus, div#global-ux.page .main-nav div.richtext a.link-blue-and-bold:focus, div#global-ux.page .main-nav div.richtext span.link-blue-and-bold:focus { color: #fff; background: #2d96cd; } div#global-ux.page .content div.richtext li a.link-blue-and-bold, div#global-ux.page .content div.richtext p a.link-blue-and-bold, div#global-ux.page .main-nav div.richtext li a.link-blue-and-bold, div#global-ux.page .main-nav div.richtext p a.link-blue-and-bold { font-weight: 700; text-decoration: none; } div#global-ux.page .content div.richtext h1 a.link-blue-and-bold, div#global-ux.page .content div.richtext h2 a.link-blue-and-bold, div#global-ux.page .content div.richtext h3 a.link-blue-and-bold, div#global-ux.page .content div.richtext h4 a.link-blue-and-bold, div#global-ux.page .main-nav div.richtext h1 a.link-blue-and-bold, div#global-ux.page .main-nav div.richtext h2 a.link-blue-and-bold, div#global-ux.page .main-nav div.richtext h3 a.link-blue-and-bold, div#global-ux.page .main-nav div.richtext h4 a.link-blue-and-bold { font-weight: 400; } #global-ux .white-background .richtext-f-single h2, #global-ux .light-grey-background .richtext-f-single h2, #global-ux .dark-grey-background .richtext-f-single h2 { font-size: 24px; font-size: 1.5rem; font-weight: 200; margin: 0 0 20px 0; color: #333; line-height: 1.1; } @media only screen and (min-width: 48em) { #global-ux .white-background .richtext-f-single h2, #global-ux .light-grey-background .richtext-f-single h2, #global-ux .dark-grey-background .richtext-f-single h2 { margin: 0 0 10px 0; } } @media only screen and (min-width: 48em) and (max-width: 61.9375em) { #global-ux .white-background .richtext-f-single h2, #global-ux .light-grey-background .richtext-f-single h2, #global-ux .dark-grey-background .richtext-f-single h2 { font-size: 36px; font-size: 2.25rem; } } @media only screen and (min-width: 62em) { #global-ux .white-background .richtext-f-single h2, #global-ux .light-grey-background .richtext-f-single h2, #global-ux .dark-grey-background .richtext-f-single h2 { font-size: 48px; font-size: 3rem; } } #global-ux .white-background .richtext-f-single p, #global-ux .light-grey-background .richtext-f-single p, #global-ux .dark-grey-background .richtext-f-single p { font-size: 14px; font-size: .875rem; font-weight: 200; margin-bottom: 20px; color: #333; line-height: 1.6; } @media only screen and (min-width: 48em) { #global-ux .white-background .richtext-f-single p, #global-ux .light-grey-background .richtext-f-single p, #global-ux .dark-grey-background .richtext-f-single p { font-size: 16px; font-size: 1rem; margin-bottom: 10px; } } #global-ux .white-background .richtext-f-single a[name]:not([href]), #global-ux .light-grey-background .richtext-f-single a[name]:not([href]), #global-ux .dark-grey-background .richtext-f-single a[name]:not([href]) { display: none; } #global-ux .dark-grey-background .richtext-f-single h2, #global-ux .dark-grey-background .richtext-f-single p { color: #fff; } #global-ux .richtext-article { padding: 45px 30px; } @media only screen and (min-width: 62em) { #global-ux .richtext-article { padding: 70px 200px 50px; } } #global-ux .richtext-article h2, #global-ux .richtext-article h3, #global-ux .richtext-article ul li, #global-ux .richtext-article ol li, #global-ux .richtext-article p { color: #616161; } #global-ux .richtext-article h2 { font-size: 23px; font-size: 1.4375rem; font-weight: 200; line-height: 1.9rem; margin-bottom: 20px; } @media only screen and (min-width: 48em) { #global-ux .richtext-article h2 { font-size: 49px; font-size: 3.0625rem; line-height: 3.65rem; margin-bottom: 0.5rem; } } #global-ux .richtext-article h3 { font-size: 13px; font-size: .8125rem; font-weight: 700; } @media only screen and (min-width: 48em) { #global-ux .richtext-article h3 { font-size: 16px; font-size: 1rem; } } #global-ux .richtext-article a { text-decoration: none; } #global-ux .richtext-article p { font-size: 14px; font-size: .875rem; font-weight: 300; line-height: 1.65rem; } @media only screen and (min-width: 48em) { #global-ux .richtext-article p { font-size: 15px; font-size: .9375rem; font-weight: 400; line-height: 2rem; } } #global-ux .richtext-article ul li, #global-ux .richtext-article ol li { font-size: 14px; font-size: .875rem; font-weight: 300; line-height: 1.85rem; } @media only screen and (min-width: 48em) { #global-ux .richtext-article ul li, #global-ux .richtext-article ol li { font-size: 15px; font-size: .9375rem; font-weight: 400; line-height: 2rem; } } #global-ux .richtext-article ol, #global-ux .richtext-article ul { margin-left: 1.4rem; } #global-ux .richtext-article ol li, #global-ux .richtext-article ul li { margin-bottom: 25px; } @media only screen and (min-width: 48em) { #global-ux .richtext-article ol, #global-ux .richtext-article ul { margin-left: 3rem; } #global-ux .richtext-article ol li, #global-ux .richtext-article ul li { margin-bottom: 10px; } } #global-ux .richtext-awards-headline { text-align: center; padding: 45px 0; margin: 0 3%; } @media only screen and (min-width: 48em) { #global-ux .richtext-awards-headline { padding: 0; margin: 0 15%; width: 70%; } } #global-ux .richtext-awards-headline h2, #global-ux .richtext-awards-headline h4, #global-ux .richtext-awards-headline p { color: #616161; } #global-ux .richtext-awards-headline h2 { font-size: 30px; font-size: 1.875rem; font-weight: 200; } @media only screen and (min-width: 48em) { #global-ux .richtext-awards-headline h2 { font-size: 48px; font-size: 3rem; margin-bottom: 0; } } #global-ux .richtext-awards-headline h4 { font-weight: 200; font-size: 22px; font-size: 1.375rem; padding-bottom: 2px; } @media only screen and (min-width: 48em) { #global-ux .richtext-awards-headline h4 { font-size: 30px; font-size: 1.875rem; } } #global-ux .richtext-awards-headline p { font-size: 16px; font-size: 1rem; line-height: 1.8rem; } #global-ux .richtext-dynamic-key-features { padding-left: 1.5625rem; } @media only screen and (min-width: 48em) { #global-ux .richtext-dynamic-key-features { padding-left: 5.625rem; } } #global-ux .richtext-dynamic-key-features h2 { font-weight: 200; color: #616161; padding-left: 10px; } @media only screen and (min-width: 48em) { #global-ux .richtext-dynamic-key-features h2 { padding-left: 15px; } } #global-ux .accordion .section.richtext .feature-spec-rte, #global-ux .accordionModelDetails .section.richtext .feature-spec-rte { color: #616161; font-weight: 300; } #global-ux .accordion .section.richtext .feature-spec-rte h3, #global-ux .accordionModelDetails .section.richtext .feature-spec-rte h3 { font-size: 24px; font-size: 1.5rem; font-weight: 200; color: #616161; line-height: 1.1; margin-top: 20px; margin-bottom: 10px; } #global-ux .accordion .section.richtext .feature-spec-rte h5, #global-ux .accordionModelDetails .section.richtext .feature-spec-rte h5 { font-size: 12px; font-size: .75rem; font-weight: 700; color: #616161; line-height: 1.1; margin: 25px 0 15px; } @media only screen and (min-width: 48em) { #global-ux .accordion .section.richtext .feature-spec-rte h5, #global-ux .accordionModelDetails .section.richtext .feature-spec-rte h5 { margin: 45px 0 25px; font-size: 14px; font-size: .875rem; } } #global-ux .accordion .section.richtext .feature-spec-rte p, #global-ux .accordionModelDetails .section.richtext .feature-spec-rte p { color: #616161; font-size: 0.75rem; margin-bottom: 16px; margin-top: 16px; } @media only screen and (min-width: 48em) { #global-ux .accordion .section.richtext .feature-spec-rte p, #global-ux .accordionModelDetails .section.richtext .feature-spec-rte p { font-size: 0.875rem; margin-bottom: 20px; margin-top: 25px; } } #global-ux .accordion .section.richtext .feature-spec-rte ul, #global-ux .accordionModelDetails .section.richtext .feature-spec-rte ul { list-style: none; margin-bottom: 0; } #global-ux .accordion .section.richtext .feature-spec-rte li, #global-ux .accordionModelDetails .section.richtext .feature-spec-rte li { color: #616161; font-size: 0.75rem; margin-bottom: 10px; padding: 0; position: relative; } @media only screen and (min-width: 48em) { #global-ux .accordion .section.richtext .feature-spec-rte li, #global-ux .accordionModelDetails .section.richtext .feature-spec-rte li { font-size: 0.875rem; } } #global-ux .accordion .section.richtext .feature-spec-rte li:before, #global-ux .accordionModelDetails .section.richtext .feature-spec-rte li:before { content: '\2022'; position: absolute; left: -15px; } #global-ux .accordion .accordion-content>.box>.box-content, #global-ux .accordionModelDetails .accordion-content>.box>.box-content { padding: 15px 20px 40px; } @media only screen and (min-width: 48em) { #global-ux .accordion .accordion-content>.box>.box-content, #global-ux .accordionModelDetails .accordion-content>.box>.box-content { padding: 40px 6.59722% 55px; } } .richtext-read-more .ellipsis, .richtext-read-more .more-link { display: none; } .richtext-read-more .desktop { display: block; } .box-content .feature-container .richtext-read-more .desktop { padding-top: 60px; padding-bottom: 60px; } .richtext-read-more .mobile { display: none; } .richtext-read-more .mobile.show-mob-only p { display: block !important; text-align: left; } .richtext-read-more .mobile.show-mob-only p.text-center { display: block; text-align: center !important; } .richtext-read-more .mobile.show-mob-only p.text-center a.link-chevron { margin-left: -27px; } .richtext-read-more .mobile.small-devices { bottom: 50px; position: relative; } @media only screen and (max-width: 47.9375em) { .richtext-read-more .ellipsis, .richtext-read-more .more-link { display: inline-block; text-decoration: none !important; } .richtext-read-more .desktop.hideForMobile { display: none; } .richtext-read-more .mobile { display: block; } .richtext-read-more .mobile .showmoreText { display: none; } .richtext-read-more .mobile.show-mob-only p { display: inline-block; } .richtext-read-more .ellipsis { color: #1b394e; } .richtext-read-more .hidden { display: none; } } @media only screen and (max-width: 767px) { .richtext-read-more .mobile.show-mob-only .txt-inline { display: inline; } .richtext-read-more .mobile.show-mob-only .txt-inline p:last-child { display: inline; } .richtext-read-more .mobile.show-mob-only .showmoreText p { display: inline; } .richtext-read-more .mobile.show-mob-only a.showmore { display: inline-block; text-align: center; margin-top: -15px; margin-bottom: 15px; font-size: .875rem; padding-left: 5px; } } .lang_vi #global-ux .richtext h1, .lang_vi #global-ux .richtext h2, .lang_vi #global-ux .richtext h3, .lang_vi #global-ux .richtext h4, .lang_vi #global-ux .richtext h5, .lang_vi #global-ux .richtext h6, .lang_vi #global-ux .richtext b, .lang_vi #global-ux .richtext strong { font-family: "Arial","Tahoma","Helvetica",sans-serif; } .lang_ar #global-ux .richtext h1, .lang_ar #global-ux .richtext h2, .lang_ar #global-ux .richtext h3, .lang_ar #global-ux .richtext h4, .lang_ar #global-ux .richtext h5, .lang_ar #global-ux .richtext h6, .lang_ar #global-ux .richtext b, .lang_ar #global-ux .richtext strong { font-family: "Frutiger",Arial,Helvetica,"Microsoft YaHei","微软雅黑","STXihei","华文细黑","SimSun","宋体"; } .lang_ko #global-ux .richtext h1, .lang_ko #global-ux .richtext h2, .lang_ko #global-ux .richtext h3, .lang_ko #global-ux .richtext h4, .lang_ko #global-ux .richtext h5, .lang_ko #global-ux .richtext h6, .lang_ko #global-ux .richtext b, .lang_ko #global-ux .richtext strong { font-family: "Antenna",Arial,Helvetica,"Microsoft YaHei","微软雅黑","STXihei","华文细黑","SimSun","宋体"; } .rtl #global-ux .richtext .link-chevron { font-size: 24px; font-size: 1.5rem; } .rtl #global-ux .richtext .link-chevron:after { top: 50%; right: 100%; left: auto; margin-right: 0.5em; transform: rotateY(-180deg) translate(0px, -50%); font-size: 100%; content: "\e618"; position: absolute; } .rtl #global-ux .richtext _::-webkit-:not(:root:root):after, .rtl #global-ux .richtext .link-chevron:after { display: none; } .rtl #global-ux .richtext _::-webkit-:not(:root:root):before, .rtl #global-ux .richtext .link-chevron:before { content: "\e618"; font-family: "icomoon"; left: 0; margin: 0 10px 0 0; position: relative; top: 50%; -webkit-transform: scaleX(-1); transform: scaleX(-1); -webkit-backface-visibility: hidden; backface-visibility: hidden; display: inline-block; } .rtl #global-ux .richtext .cta-button { font-size: 24px; font-size: 1.5rem; } #global-ux .f-single { padding-bottom: 80px; padding-top: 60px; } @media only screen and (min-width: 48em) { #global-ux .f-single { padding-bottom: 100px; padding-top: 100px; } #global-ux .f-single.initialized { clear: both; padding-bottom: 0; padding-top: 0; } } #global-ux .f-single .columns { padding-left: 8.33%; padding-right: 8.33%; } @media only screen and (min-width: 48em) { #global-ux .f-single .columns:first-child { padding-right: 13px; } #global-ux .f-single .columns:last-child { padding-left: 13px; } } #global-ux .f-single h2, #global-ux .f-single p { text-align: center; } @media only screen and (min-width: 48em) { #global-ux .f-single h2, #global-ux .f-single p { text-align: left; } } #global-ux .f-single .remaining-text.hidden { display: none; } @media only screen and (min-width: 48em) { #global-ux .f-single .remaining-text.hidden { display: inline; } } #global-ux .f-single .more-link.hidden, #global-ux .f-single .ellipsis.hidden { display: none; } @media only screen and (min-width: 48em) { #global-ux .f-single .more-link, #global-ux .f-single .ellipsis { display: none; } } #global-ux .f-single .more-link { text-decoration: none; } #global-ux .row-feature-icon { width: 100%; display: none; } .ie8 #global-ux .row-feature-icon, .ie9 #global-ux .row-feature-icon { display: block; } #global-ux .row-feature-icon .column-feature-icon { width: 26%; text-align: center; display: inline-block; vertical-align: top; margin: 0 2%; } #global-ux .row-feature-icon .box .features-trigger { padding: .625rem 0; margin-top: .625rem; margin-left: 0; margin-right: 0; } #global-ux .row-feature-icon .feature-container .richtext.section .regular .cta-button { padding-left: .625rem; padding-right: .625rem; min-width: inherit; } #global-ux .billboard .billboard-features-trigger img { display: block; } #global-ux .splitter-column-mobile { height: auto; } .ie8 #global-ux .splitter-column-mobile, .ie9 #global-ux .splitter-column-mobile { display: none; } #global-ux .splitter-column-mobile .flex-viewport .slides { margin: 0; } #global-ux .splitter-column-mobile .image .component-content img { display: block; } #global-ux .splitter-column-mobile .flexslider .slides img { width: auto; height: auto; max-width: 100%; max-height: 100%; margin: 0 auto; vertical-align: middle; } #global-ux .splitter-column-mobile .feature-container .richtext.section .regular .cta-button { padding-left: .625rem; padding-right: .625rem; min-width: inherit; width: auto; } #global-ux .splitter-column-mobile .image .component-content img { display: inline-block; text-align: center !important; width: auto; } @media only screen and (min-width: 48em) { #global-ux .row-feature-icon .column-feature-icon .component-content { display: inline-block; } #global-ux .row-feature-icon .column-feature-icon .component-content img { width: auto; height: auto; margin: auto; } #global-ux .splitter-column-mobile { display: none; } #global-ux .row-feature-icon { display: inline-block; } } .ie8 #global-ux .billboard .billboard-features-trigger .billboard-inner .billboard-image+.billboard-paragraph { position: absolute; } .ie8 #global-ux .box .splitter.row-feature-icon .splitter-column.column-feature-icon .image.section .component-content img { height: auto; } .ie9 #global-ux .splitter.row-feature-icon .splitter-column.column-feature-icon .image.section .component-content { position: relative; } #global-ux .social-share-section { display: block; padding: 80px 0 50px; } #global-ux .social-share-section:after { content: ""; display: table; clear: both; } #global-ux .social-share-section .richtext { text-align: center; display: block; margin: 0 0 70px; } #global-ux .social-share-section .richtext:after { content: ""; display: table; clear: both; } #global-ux .social-share-section .richtext h1, #global-ux .social-share-section .richtext h2, #global-ux .social-share-section .richtext h3, #global-ux .social-share-section .richtext h4, #global-ux .social-share-section .richtext h5, #global-ux .social-share-section .richtext h6, #global-ux .social-share-section .richtext p { font-size: 36px; font-size: 2.25rem; line-height: 1.3; font-weight: 200; margin: 0; } #global-ux .social-share-section a { -webkit-transition: opacity 0.25s linear; -moz-transition: opacity 0.25s linear; -ms-transition: opacity 0.25s linear; -o-transition: opacity 0.25s linear; transition: opacity 0.25s linear; } #global-ux .social-share-section a:hover { opacity: .8; filter: alpha(opacity=80); } #global-ux .social-share-section .social-icons { list-style: none; display: block; text-align: center; } #global-ux .social-share-section .social-icons li { display: inline-block; vertical-align: top; margin: 0 44px 44px; } #global-ux .social-share-section .social-icons img { width: 120px; height: auto; display: block; margin: 0; } #global-ux .social-share-section .mobile-share { display: block; overflow: hidden; position: relative; height: 0; } #global-ux .social-share-section .mobile-share:after { content: ""; display: table; clear: both; } #global-ux .social-share-section .mobile-share .social-slider { position: absolute; left: -9999px; top: -9999px; float: left; width: 100%; } @media screen and (max-width: 47.9375em) { #global-ux .social-share-section { padding: 45px 0; } #global-ux .social-share-section .richtext { margin: 0 0 40px; } #global-ux .social-share-section .richtext h1, #global-ux .social-share-section .richtext h2, #global-ux .social-share-section .richtext h3, #global-ux .social-share-section .richtext h4, #global-ux .social-share-section .richtext h5, #global-ux .social-share-section .richtext h6, #global-ux .social-share-section .richtext p { font-size: 24px; font-size: 1.5rem; } #global-ux .social-share-section .social-icons { display: none; visibility: hidden; } #global-ux .social-share-section .mobile-share { height: auto; text-align: center; } #global-ux .social-share-section .mobile-share .social-slider { position: relative; left: auto; top: auto; display: block; float: none; margin: 0 auto; width: 240px; } #global-ux .social-share-section .mobile-share .social-slider ul { list-style: none; display: block; margin: 0; padding: 0; } #global-ux .social-share-section .mobile-share .social-slider ul:after { content: ""; display: table; clear: both; } #global-ux .social-share-section .mobile-share .social-slider li { text-align: center; margin-bottom: 15px; } #global-ux .social-share-section .mobile-share .social-slider img { width: 58px; height: auto; } #global-ux .social-share-section .mobile-share .flexslider.none-slider li { float: left; width: 33.33333%; } } .box-content { background-size: cover; width: 100%; } .box-content:before, .box-content:after { content: " "; display: table; } .box-content:after { clear: both; } .column+.column:last-child, .columns+.column:last-child, .column+.columns:last-child, .columns+.columns:last-child { float: left; } .ie8 #global-ux .box .generic-wrapper { padding: 25px; } .ie8 #global-ux p { margin: 0 0 17.5px; font-size: 14px; line-height: 17.5px; } .ie8 ul { margin-left: 17.6px; font-size: 16px; margin-bottom: 17.5px; } .ie8 #global-ux .cta-button { font-size: 17px; margin: 7.5px; width: auto; padding: 15px 40px; } .ie8 #global-ux h3 { font-size: 36px; margin-bottom: 8px; margin-top: 3px; } .ie8 .medium-pull-6 { left: auto; position: relative; right: 50%; } .ie8 .medium-push-6 { left: 50%; position: relative; right: auto; } .black-background { background-color: #231f20; } .light-grey-background { background-color: #f7f7f7; } #global-ux .dark-grey-background { background-color: #41423E; } .white-background { background-color: #fff; } .transparent-background { background-color: transparent; } #global-ux .gallery-trigger-reveal { background: #fff; padding-top: 68px; } #global-ux .gallery-trigger-reveal .richtext .regular { padding-bottom: 30px; margin: 0 8.3%; } #global-ux .gallery-trigger-reveal .richtext .regular h2, #global-ux .gallery-trigger-reveal .richtext .regular p { font-weight: 200; color: #616161; text-shadow: none; } #global-ux .gallery-trigger-reveal .richtext .regular p { font-size: 14px; font-size: .875rem; margin: .9375rem auto; line-height: 1.8; } @media only screen and (min-width: 48em) { #global-ux .gallery-trigger-reveal .richtext .regular p { font-size: 18px; font-size: 1.125rem; width: 65%; } } #global-ux .gallery-trigger-reveal .richtext .regular h2 { font-size: 24px; font-size: 1.5rem; } @media only screen and (min-width: 48em) { #global-ux .gallery-trigger-reveal .richtext .regular h2 { font-size: 48px; font-size: 3rem; } } #global-ux .gallery-trigger-reveal .tabs .component-content { padding-top: 0; } #global-ux .gallery-trigger-reveal .tabs .tabs-nav { height: auto; padding: 1.25rem 0 3.125rem 0; position: static; } #global-ux .gallery-trigger-reveal .tabs .tabs-nav-list { float: left; text-align: center; width: 100%; } #global-ux .gallery-trigger-reveal .tabs .tabs-nav-item { font-size: 16px; font-size: 1rem; font-weight: 200; background: #fff; border: 1px solid #2d96cd; cursor: pointer; display: inline-block; float: none; height: auto; line-height: 1.25; margin: 0 7px; padding: 1.5rem 1.25rem; top: 0; text-decoration: none; text-align: center; max-width: 270px; width: 45%; } @media only screen and (min-width: 48em) { #global-ux .gallery-trigger-reveal .tabs .tabs-nav-item { padding: .875rem 1.25rem; } } #global-ux .gallery-trigger-reveal .tabs .tabs-nav-item a { color: #2d96cd; text-decoration: none; } #global-ux .gallery-trigger-reveal .tabs .tabs-nav-item:hover { background: #2d96cd; } #global-ux .gallery-trigger-reveal .tabs .tabs-nav-item:hover a { color: #fff; text-decoration: none; } #global-ux .gallery-trigger-reveal .tabs .tabs-nav-item.is-active, #global-ux .gallery-trigger-reveal .tabs .tabs-nav-item.is-active:hover { background-color: #fff; border-color: #1b394e; cursor: default; } #global-ux .gallery-trigger-reveal .tabs .tabs-nav-item.is-active a, #global-ux .gallery-trigger-reveal .tabs .tabs-nav-item.is-active:hover a { cursor: default; color: #1b394e; } #global-ux .gallery-trigger-reveal .tabs .tabs-content { background: #fff; } #global-ux .box .features-trigger { overflow: hidden; margin: 1.875rem auto; } #global-ux .box .features-trigger .section { float: left; width: 50%; } @media only screen and (min-width: 48em) { #global-ux .box .features-trigger .section { margin-bottom: .625rem; } } @media only screen and (min-width: 75em) { #global-ux .box .features-trigger .section { width: 50%; margin-bottom: 0; } } #global-ux .box .features-trigger .richtext p { font-size: 16px; font-size: 1rem; margin: 0 auto; line-height: 1.2; } #global-ux .box .features-trigger .richtext p:first-of-type { font-size: 46px; font-size: 2.875rem; color: #1b394e; } #global-ux .box .features-trigger .section:last-child { border-left: 1px solid rgba(151,151,151,0.3); } @media only screen and (min-width: 48em) { #global-ux .box .features-trigger .section:last-child { border: 0; } } @media only screen and (min-width: 48em) { #global-ux .box .features-trigger { margin: 1.875rem 1.875rem 0; padding: 1.25rem 0 0; border-top: solid 1px rgba(151,151,151,0.3); } } @media only screen and (min-width: 75em) { #global-ux .box .features-trigger { margin: 1.875rem; } } @media only screen and (min-width: 768px) and (max-width: 1129px) { #global-ux .box .features-trigger .richtext p { font-size: 13px; font-size: .8125rem; white-space: nowrap; } #global-ux .box .features-trigger .richtext p:first-of-type { font-size: 30px; font-size: 1.875rem; } } #global-ux .box .features-overview { margin: 5px 0; background: #fff; } #global-ux .box .features-overview>div { overflow: auto; } @media only screen and (min-width: 75em) { #global-ux .box .features-overview { padding: 0 75px; } } #global-ux .box .features-overview .image, #global-ux .box .features-overview .box { float: left; width: 100%; } @media only screen and (min-width: 48em) { #global-ux .box .features-overview .image, #global-ux .box .features-overview .box { width: 50%; } } @media only screen and (min-width: 62em) { #global-ux .box .features-overview .image, #global-ux .box .features-overview .box { width: 33.33%; } } .box-content.divider { border-bottom: 1px solid #EBEBEB; } #global-ux .box .expanded-feature { padding: 20px; text-align: center; color: #616161; } #global-ux .box .expanded-feature.box-content { padding: 0; } #global-ux .box .expanded-feature h2, #global-ux .box .expanded-feature p { font-weight: 200; color: #616161; text-shadow: none; } #global-ux .box .expanded-feature p { font-size: 14px; font-size: .875rem; margin: .9375rem auto; line-height: 1.8; } @media only screen and (min-width: 48em) { #global-ux .box .expanded-feature p { font-size: 18px; font-size: 1.125rem; width: 65%; } } #global-ux .box .expanded-feature a { text-decoration: none; } #global-ux .box .expanded-feature h2 { font-size: 21px; font-size: 1.3125rem; } @media only screen and (min-width: 48em) { #global-ux .box .expanded-feature h2 { font-size: 48px; font-size: 3rem; } } #global-ux .box .expanded-feature h3 { font-size: 21px; font-size: 1.3125rem; margin: .625rem 0; color: #1b394e; } @media only screen and (min-width: 769px) { #global-ux .box .expanded-feature h3 .hidden-mobile { display: none; } } @media only screen and (min-width: 48em) { #global-ux .box .expanded-feature h3 { font-size: 24px; font-size: 1.5rem; } } @media only screen and (min-width: 62em) { #global-ux .box .expanded-feature h3 { font-size: 26px; font-size: 1.625rem; } } @media only screen and (min-width: 48em) { #global-ux .box .expanded-feature img { display: inline-block; } } #global-ux .box .expanded-feature .image { position: relative; } @media only screen and (min-width: 48em) { #global-ux .box .expanded-feature .image img { width: auto; } } #global-ux .box .expanded-feature .heading { margin: 15px 0 0 0; } #global-ux .box .expanded-feature .splitter-carousel { margin: 1.5625rem auto; padding: 1.5625rem 0; box-shadow: 0 1px 3px rgba(0,0,0,0.15); background-color: transparent; } @media only screen and (min-width: 48em) { #global-ux .box .expanded-feature .splitter-carousel { width: auto; box-shadow: none; background-color: transparent; } } @media only screen and (min-width: 48em) { #global-ux .box .expanded-feature .splitter-carousel p { width: 100%; } } #global-ux .box .expanded-feature .features-trigger { margin-left: 0; margin-right: 0; } #global-ux .box .expanded-feature .features-trigger .section { width: 50%; } #global-ux .box .expanded-feature .features-trigger .box-content { width: 100%; } @media only screen and (max-width: 767px) { #global-ux .box .expanded-feature .splitter-column .image picture img { width: 40%; } } @media only screen and (max-width: 1024px) and (min-width: 768px) { #global-ux .box .expanded-feature .splitter-column .image picture img { width: 110px; } } @media only screen and (min-width: 48em) { #global-ux .box .expanded-feature .splitter-column .image picture { display: block; position: relative; } } @media only screen and (min-width: 48em) { #global-ux .box .expanded-feature>div>.richtext, #global-ux .box .expanded-feature>div>.splitter { padding: 0 5% 0; } } @media only screen and (min-width: 48em) { #global-ux .box .expanded-feature>div>.image img { width: 100%; } } .ie8 #global-ux .box .expanded-feature h2 { font-size: 48px; margin-top: 3px; margin-bottom: 8px; } .ie8 #global-ux .box .expanded-feature p { font-size: 18px; width: 65%; margin: 15px auto; } .ie8 #global-ux .box .expanded-feature .column-feature-icon .image img { width: auto; height: 20px; } .ie8 #global-ux .box .splitter-column-mobile { display: none; } .ie8 #global-ux .box .splitter-column-mobile .box.section { border-top: 1px solid #dcdcdc; } .ie8 #global-ux .box .row-feature-icon { display: block; } .ie8 #global-ux .box .row-feature-icon .box .features-trigger { margin-top: 10px; padding: 10px 0; margin-bottom: 30px; border-top: 1px solid #dcdcdc; } .ie8 #global-ux .box .features-trigger.box-content { margin-top: 10px; padding: 10px 0; margin-bottom: 30px; border-top: 1px solid #dcdcdc; } .ie8 #global-ux .box .expanded-feature .splitter-carousel { margin: 25px 0; padding: 25px 0; } .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column:hover .image, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column:hover .image:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column:hover .section, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column:hover .section:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter:hover .image, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter:hover .image:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter:hover .section, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter:hover .section:hover { top: 0 !important; margin-top: 0 !important; } .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column:hover .image .component-content, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column:hover .image .component-content:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column:hover .image:hover .component-content, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column:hover .image:hover .component-content:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column:hover .section .component-content, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column:hover .section .component-content:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column:hover .section:hover .component-content, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column:hover .section:hover .component-content:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter:hover .image .component-content, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter:hover .image .component-content:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter:hover .image:hover .component-content, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter:hover .image:hover .component-content:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter:hover .section .component-content, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter:hover .section .component-content:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter:hover .section:hover .component-content, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter:hover .section:hover .component-content:hover { margin-top: 0 !important; } .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column .image, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column .image:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column .section, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column .section:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter .image, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter .image:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter .section, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter .section:hover { top: 0 !important; margin-top: 0 !important; } .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column .image .component-content, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column .image .component-content:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column .image:hover .component-content, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column .image:hover .component-content:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column .section .component-content, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column .section .component-content:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column .section:hover .component-content, .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column .section:hover .component-content:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter .image .component-content, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter .image .component-content:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter .image:hover .component-content, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter .image:hover .component-content:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter .section .component-content, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter .section .component-content:hover, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter .section:hover .component-content, .ie8 #global-ux .box .expanded-feature .splitter-carousel .sameHeightSplitter .section:hover .component-content:hover { margin-top: 0 !important; } .ie8 #global-ux .box .expanded-feature .splitter-carousel .splitter-column .image img { width: auto; height: 130px !important; } #global-ux .box .sitemap-wrapper { background-color: #fff; padding: 1.25rem 1.5625rem; } #global-ux .box .sitemap-wrapper .richtext:after { content: ""; display: table; clear: both; } #global-ux .box .sitemap-wrapper h2 { margin-bottom: 1.25rem; } #global-ux .box .sitemap-wrapper h3 { font-size: 18px; font-size: 1.125rem; } @media only screen and (min-width: 30.0625em) { #global-ux .box .sitemap-wrapper h3 { font-size: 21px; font-size: 1.3125rem; } } @media only screen and (min-width: 48em) { #global-ux .box .sitemap-wrapper h3 { font-size: 24px; font-size: 1.5rem; } } @media only screen and (min-width: 62em) { #global-ux .box .sitemap-wrapper h3 { font-size: 30px; font-size: 1.875rem; } } #global-ux .box .sitemap-wrapper h3, #global-ux .box .sitemap-wrapper h4 { margin: 1rem 0; padding-bottom: .75rem; border-bottom: 2px solid #EBEBEB; } #global-ux .box .sitemap-wrapper ul { font-size: 14px; font-size: .875rem; list-style: none; width: auto; margin: 0; padding: 0; } #global-ux .box .sitemap-wrapper ul li { list-style-image: none; list-style-type: none; margin: 0 0 1em; padding: 0; } #global-ux .box .sitemap-wrapper ul a { text-decoration: none; } #global-ux .box .sitemap-wrapper ul ul { width: auto; margin: 1em 0 2.5em; } #global-ux .box .sitemap-wrapper ul:last-child ul { margin-bottom: 0; } @media only screen and (min-width: 48em) { #global-ux .box .sitemap-wrapper { padding: 2.5rem 2.1875rem 7.5rem; } #global-ux .box .sitemap-wrapper h3, #global-ux .box .sitemap-wrapper h4 { margin: 2.5rem 0 2rem; padding-bottom: .75rem; } #global-ux .box .sitemap-wrapper ul { width: 15%; margin-right: 2%; float: left; } #global-ux .box .sitemap-wrapper ul:first-of-type { margin-left: 0; } #global-ux .box .sitemap-wrapper ul ul { float: none; margin: 1em 0 0; } #global-ux .box .sitemap-wrapper .regular ul { float: none; width: auto; } } #global-ux .light-grey-background-mobile-only { background: #f7f7f7; } @media only screen and (min-width: 48em) { #global-ux .light-grey-background-mobile-only { background: #fff; } } #global-ux .light-grey-background-mobile-only .richtext.section { width: 100%; padding: 35px 7.5% 20px; margin: 0 auto; text-align: center; } @media only screen and (min-width: 48em) { #global-ux .light-grey-background-mobile-only .richtext.section { padding: 35px 7.5%; } } #global-ux .light-grey-background-mobile-only .richtext.section h2 { font-size: 21px; font-size: 1.3125rem; font-weight: 200; margin: 0 0 12px; color: #616161; line-height: 1.4; } @media only screen and (min-width: 48em) { #global-ux .light-grey-background-mobile-only .richtext.section h2 { font-size: 46px; font-size: 2.875rem; } } #global-ux .light-grey-background-mobile-only .richtext.section p { font-weight: 200; color: #626466; font-size: 1rem; line-height: 1.8em; margin-bottom: 0; } @media only screen and (max-width: 47.9375em) { .specification-quick-view { background: #f7f7f7; padding-bottom: 80px; } } @media only screen and (min-width: 48em) { .specification-quick-view { background: #fff; padding-bottom: 100px; } } .specification-quick-view img { display: block; margin: 0 auto; } #global-ux .specification-quick-view img { max-width: 100%; width: auto; } .specification-quick-view .richtext-read-more { padding: 110px 0 120px; text-align: center; } @media only screen and (max-width: 47.9375em) { .specification-quick-view .richtext-read-more { padding: 40px; text-align: center; } } #global-ux .specification-quick-view .richtext-read-more h2 { font-size: 48px; font-size: 3rem; text-transform: uppercase; margin-bottom: 40px; } @media only screen and (max-width: 47.9375em) { #global-ux .specification-quick-view .richtext-read-more h2 { font-size: 26px; font-size: 1.625rem; margin-bottom: 20px; } } #global-ux .specification-quick-view .richtext-read-more p { font-size: 18px; font-size: 1.125rem; line-height: 30px; max-width: 600px; margin: 0 auto; } @media only screen and (max-width: 47.9375em) { #global-ux .specification-quick-view .richtext-read-more p { font-size: 16px; font-size: 1rem; margin: 0 auto; } } .specification-quick-view .richtext-read-more .more-link { color: #1b394e; text-decoration: none; } .specification-quick-view .tabs { max-width: 700px; margin: 0 auto; } .specification-quick-view .tabs .tabs-mobile-category-name { display: none; } @media only screen and (max-width: 47.9375em) { .specification-quick-view .tabs .tabs-mobile-category-name { font-size: 14px; font-size: .875rem; display: block; max-width: 220px; color: white; margin: 0 auto; background: #1b394e url("/etc/designs/guxfoap/clientlibs/guxfoap/img/icon-dots.png") no-repeat right center; background-size: 20px 5px; padding-right: 20px; border-right: 20px transparent solid; line-height: 4.3; text-align: center; letter-spacing: -1px; } } .specification-quick-view .tabs>.component-content { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; padding: 0; overflow: hidden; } @media only screen and (max-width: 47.9375em) { .specification-quick-view .tabs .tabs-nav.is-open .tabs-nav-list { max-height: 300px; } } .specification-quick-view .tabs .tabs-nav-item { margin: 0; } .specification-quick-view .tabs .tabs-nav-item a { display: inline-block; vertical-align: middle; position: relative; width: 100%; margin: .4375rem 0; text-align: center; } #global-ux .specification-quick-view .tabs .tabs-nav-item a { text-decoration: none; } @media only screen and (max-width: 47.9375em) { .specification-quick-view .tabs .tabs-nav-list { -webkit-transition: max-height 0.5s; -moz-transition: max-height 0.5s; -ms-transition: max-height 0.5s; -o-transition: max-height 0.5s; transition: max-height 0.5s; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; -webkit-box-direction: normal; -webkit-box-orient: horizontal; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; background: #e6e6e6; overflow: visible; max-height: 0; } } @media only screen and (min-width: 48em) { .specification-quick-view .tabs .tabs-nav-list { overflow: visible; } } .specification-quick-view .tabs .tabs-container { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); position: static; max-width: 100%; } .specification-quick-view .tabs .tabs-container img { margin: 0; } .specification-quick-view .tabs .tabs-container .tabs-content { left: 0; top: 0; margin: 0; background: none; } @media only screen and (min-width: 48em) { .specification-quick-view .tabs .tabs-container .tabs-content { margin: 0; background: none; } } .specification-quick-view .tabs>.component-content:not(.tabs-vertical) .tabs-nav { position: absolute; padding: 0; height: auto; top: calc(100% - 210px); } @media only screen and (min-width: 48em) { .specification-quick-view .tabs>.component-content:not(.tabs-vertical) .tabs-nav { top: auto; bottom: 0; overflow: visible; } } .specification-quick-view .tabs>.component-content:not(.tabs-vertical) .tabs-nav-list { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; overflow: visible; } .specification-quick-view .tabs>.component-content:not(.tabs-vertical) .tabs-container { width: 100%; } .specification-quick-view .tabs>.component-content:not(.tabs-vertical) .tabs-container .tabs-content { padding-bottom: 240px; } @media only screen and (min-width: 48em) { .specification-quick-view .tabs>.component-content:not(.tabs-vertical) .tabs-container .tabs-content { padding-bottom: 120px; } } .specification-quick-view .tabs>.component-content:not(.tabs-vertical) .tabs-nav-item { -moz-box-shadow: 0 2px 3px 0 rgba(0,0,0,0.15); -webkit-box-shadow: 0 2px 3px 0 rgba(0,0,0,0.15); box-shadow: 0 2px 3px 0 rgba(0,0,0,0.15); height: auto; background: none; padding: 40px 0 20px; } @media only screen and (min-width: 48em) { .specification-quick-view .tabs>.component-content:not(.tabs-vertical) .tabs-nav-item { margin: 40px 5px 20px; width: auto; height: auto; background: #fff; border: 1px solid #1b394e; padding: 15px 32px; } } .specification-quick-view .tabs>.component-content:not(.tabs-vertical) .tabs-nav-item:hover, .specification-quick-view .tabs>.component-content:not(.tabs-vertical) .tabs-nav-item.is-active { background: #1b394e; } @media only screen and (min-width: 48em) { .specification-quick-view .tabs>.component-content:not(.tabs-vertical) .tabs-nav-item:hover, .specification-quick-view .tabs>.component-content:not(.tabs-vertical) .tabs-nav-item.is-active { background: #1b394e; } } .specification-quick-view .tabs>.component-content:not(.tabs-vertical) .tabs-nav-item:hover a, .specification-quick-view .tabs>.component-content:not(.tabs-vertical) .tabs-nav-item.is-active a { color: #fff; background: none; } .specification-quick-view .tabs>.component-content:not(.tabs-vertical) .tabs-nav-item:hover { background: #35709a; } @media only screen and (min-width: 48em) { .specification-quick-view .tabs>.component-content:not(.tabs-vertical) .tabs-nav-item:hover { background: #1b394e; } } .specification-quick-view .tabs>.component-content:not(.tabs-vertical) .tabs-nav-item a { font-weight: 400; color: #1b394e; padding: 13px; margin: 0; } @media only screen and (min-width: 48em) { .specification-quick-view .tabs>.component-content:not(.tabs-vertical) .tabs-nav-item a { font-size: 18px; font-size: 1.125rem; display: inline-block; vertical-align: middle; position: relative; width: 100%; padding: 0; text-align: center; color: #1b394e; } #global-ux .specification-quick-view .tabs>.component-content:not(.tabs-vertical) .tabs-nav-item a { text-decoration: none; margin: 0; } } @media only screen and (max-width: 47.9375em) { .specification-quick-view .tabs .tabs-vertical { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } } .specification-quick-view .tabs .tabs-vertical .tabs-nav { position: static; } @media only screen and (max-width: 47.9375em) { .specification-quick-view .tabs .tabs-vertical .tabs-nav { position: relative; display: table; margin-bottom: 20px; width: 100%; } .specification-quick-view .tabs .tabs-vertical .tabs-nav:after { -webkit-transition: left 0.5s; -moz-transition: left 0.5s; -ms-transition: left 0.5s; -o-transition: left 0.5s; transition: left 0.5s; content: ""; position: absolute; width: 0; height: 0; border-style: solid; border-width: 10px 12px 10px 0; border-color: transparent transparent transparent #1b394e; z-index: -1; border-color: #1b394e transparent transparent transparent; border-width: 10px 12px 10px 10px; left: 42%; left: calc(50% - 20px / 2); top: 3.4375rem; z-index: 100; } } @media only screen and (min-width: 48em) { .specification-quick-view .tabs .tabs-vertical .tabs-nav { -webkit-box-ordinal-group: 2; -webkit-order: 1; -moz-order: 1; -ms-flex-order: 1; order: 1; -webkit-align-self: center; -moz-align-self: center; -ms-flex-item-align: center; align-self: center; overflow: visible; width: 175px; } } @media only screen and (min-width: 48em) { .specification-quick-view .tabs .tabs-vertical .tabs-container { width: 450px; } } .specification-quick-view .tabs .tabs-vertical .tabs-nav-item.is-active { background: #1b394e; } .specification-quick-view .tabs .tabs-vertical .tabs-nav-item.is-active .tab-active-image { display: block; } .specification-quick-view .tabs .tabs-vertical .tabs-nav-item.is-active .tab-image { display: none; } .specification-quick-view .tabs .tabs-vertical .tabs-nav-item.is-active a { color: white; } .specification-quick-view .tabs .tabs-vertical .tabs-nav-item.is-active:after { left: -12px; } @media only screen and (min-width: 48em) { .specification-quick-view .tabs .tabs-vertical .tabs-nav-item.is-active { background: #1b394e; } } .specification-quick-view .tabs .tabs-vertical .tabs-nav-item:hover { background: #35709a; } .specification-quick-view .tabs .tabs-vertical .tabs-nav-item:hover .tab-active-image { display: block; } .specification-quick-view .tabs .tabs-vertical .tabs-nav-item:hover .tab-image { display: none; } .specification-quick-view .tabs .tabs-vertical .tabs-nav-item:hover a { color: white; } @media only screen and (max-width: 47.9375em) { .specification-quick-view .tabs .tabs-vertical .tabs-nav-item { -webkit-flex-basis: 33%; -moz-flex-basis: 33%; -ms-flex-preferred-size: 33%; flex-basis: 33%; vertical-align: middle; background: none; margin: 0; padding: 40px 0 20px; text-align: center; clear: none; float: none; } } @media only screen and (min-width: 48em) { .specification-quick-view .tabs .tabs-vertical .tabs-nav-item { background: #e6e6e6; width: 175px; height: 115px; position: relative; margin-bottom: 10px; } .specification-quick-view .tabs .tabs-vertical .tabs-nav-item:after { -webkit-transition: left 0.5s; -moz-transition: left 0.5s; -ms-transition: left 0.5s; -o-transition: left 0.5s; transition: left 0.5s; content: ""; position: absolute; width: 0; height: 0; border-style: solid; border-width: 10px 12px 10px 0; border-color: transparent transparent transparent #1b394e; z-index: -1; border-color: transparent #1b394e transparent transparent; border-width: 10px 12px 10px 0; top: 42%; top: calc(50% - 20px / 2); left: 0; } } .specification-quick-view .tabs .tabs-vertical .tabs-nav-item a { font-size: 14px; font-size: .875rem; color: #1b394e; text-decoration: none !important; letter-spacing: -1.5px; display: block; text-align: center; font-weight: normal; padding: 0 10px; } @media only screen and (max-width: 47.9375em) { .specification-quick-view .tabs .tabs-vertical .tabs-nav-item a { font-size: 10px; font-size: .625rem; line-height: 20px; text-decoration: none; letter-spacing: normal; padding: 0 15px; } } @media only screen and (max-width: 47.9375em) { .specification-quick-view .tabs .tabs-vertical .tabs-nav-item img { max-width: 90px !important; max-height: 40px !important; } } @media only screen and (min-width: 48em) { .specification-quick-view .tabs .tabs-vertical .tabs-nav-item .tab-image, .specification-quick-view .tabs .tabs-vertical .tabs-nav-item .tab-active-image { margin-top: 15px; } } .specification-quick-view .tabs .tabs-vertical .tabs-nav-item .tab-active-image { display: none; } #global-ux .box .generic-wrapper { padding: 1.5625rem; } @media only screen and (min-width: 48em) { #global-ux .box .generic-wrapper .feature-container .richtext .cta-button { margin-top: 49px; } } #global-ux .box .generic-wrapper .richtext h2 { font-weight: 200; margin: 0 0 23px; } #global-ux .box .generic-wrapper .richtext, #global-ux .box .generic-wrapper .richtext ul, #global-ux .box .generic-wrapper .richtext li, #global-ux .box .generic-wrapper .richtext p { font-size: 16px; line-height: 1.8rem; font-weight: 300; } #global-ux .box .generic-wrapper .richtext strong { font-weight: 400; } #global-ux .box .generic-wrapper .richtext ul { margin-left: 17px !important; } #global-ux .box .generic-wrapper .richtext ul li { margin-bottom: 0 !important; } #global-ux .box .generic-wrapper .richtext ul, #global-ux .box .generic-wrapper .richtext p { margin-bottom: 29px !important; } @media only screen and (max-width: 479px) { #global-ux .box .generic-wrapper .richtext .cta-button { padding-left: 5px !important; padding-right: 5px !important; font-size: 17px; margin: 0; } } #global-ux .box .vehicle-types-list { padding: 0 25px; } #global-ux .box .vehicle-types-list:after { content: ""; display: table; clear: both; } #global-ux .box .vehicle-types-list .richtext.section { float: left; width: 100%; padding-bottom: 30px; min-height: 100px; } @media only screen and (min-width: 48em) { #global-ux .box .vehicle-types-list .richtext.section { width: 50%; padding-left: 15px; padding-right: 15px; } #global-ux .box .vehicle-types-list .richtext.section:nth-child(2n+3) { clear: left; } } @media only screen and (min-width: 62em) { #global-ux .box .vehicle-types-list .richtext.section { width: 33.3333%; } #global-ux .box .vehicle-types-list .richtext.section:nth-child(2n+3) { clear: none; } #global-ux .box .vehicle-types-list .richtext.section:nth-child(3n+4) { clear: left; } } #global-ux .box .vehicle-types-list .richtext.section .richtext { position: relative; } #global-ux .box .vehicle-types-list .richtext.section img { position: absolute; top: 35px; left: 0; width: 100px; height: auto; } #global-ux .box .vehicle-types-list .richtext.section h5 { font-size: 16px; font-size: 1rem; margin-left: 120px; font-weight: 100; } #global-ux .box .vehicle-types-list .richtext.section p { font-size: 14px; font-size: .875rem; color: #333; margin-left: 120px; margin-bottom: 0; } body.cq-wcm-edit #global-ux .box .vehicle-types-list .richtext.section { clear: none; } @media only screen and (min-width: 48em) { body.cq-wcm-edit #global-ux .box .vehicle-types-list .richtext.section:nth-child(4n+6) { clear: left; } } @media only screen and (min-width: 62em) { body.cq-wcm-edit #global-ux .box .vehicle-types-list .richtext.section:nth-child(4n+6) { clear: none; } body.cq-wcm-edit #global-ux .box .vehicle-types-list .richtext.section:nth-child(6n+8) { clear: left; } } #global-ux .box .share-brochureware { position: relative; padding-bottom: 130px; } @media only screen and (min-width: 62em) { #global-ux .box .share-brochureware { padding-bottom: 0; position: static; } } #global-ux .box .share-brochureware .actionsPanel { bottom: 0; left: 0; padding: 35px 0; position: absolute; text-align: center; width: 100%; } @media only screen and (min-width: 62em) { #global-ux .box .share-brochureware .actionsPanel { padding: 40px 200px; position: static; text-align: left; width: auto; } } #global-ux .box .share-brochureware .actionsPanel .action { margin-bottom: 0; } @media only screen and (min-width: 62em) { #global-ux .box .share-brochureware .richtext-article { padding-top: 0; padding-bottom: 0; margin-bottom: 30px; } } #global-ux .actionsPanel .fm-actions.actionsPanel-content { text-align: center; margin-top: 20px; } .ie8 #global-ux .actionsPanel .fm-actions.actionsPanel-content .action-share .icon-share { font-size: 24px; } .ie8 #global-ux .share-overlay .share-wrapper .share-data, .ie9 #global-ux .share-overlay .share-wrapper .share-data { border: 1px solid #dcdcdc; border-top: none; } .ie8 #global-ux .share-overlay .share-wrapper .social-links, .ie9 #global-ux .share-overlay .share-wrapper .social-links { float: none; display: block; overflow: hidden; } .ie8 #global-ux .share-overlay .share-wrapper .social-links li, .ie9 #global-ux .share-overlay .share-wrapper .social-links li { width: 20%; } .ie8 #global-ux .share-overlay .share-wrapper .social-links a, .ie9 #global-ux .share-overlay .share-wrapper .social-links a { background-image: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/social-icons.png"); background-repeat: no-repeat; } .ie8 #global-ux .share-overlay .share-wrapper .social-links a:before, .ie9 #global-ux .share-overlay .share-wrapper .social-links a:before { font-size: 0; } .ie8 #global-ux .share-overlay .share-wrapper .social-links .icon-share-facebook, .ie9 #global-ux .share-overlay .share-wrapper .social-links .icon-share-facebook { background-position: -7px 0; } .ie8 #global-ux .share-overlay .share-wrapper .social-links .icon-share-twitter, .ie9 #global-ux .share-overlay .share-wrapper .social-links .icon-share-twitter { background-position: -92px 0; } .ie8 #global-ux .share-overlay .share-wrapper .social-links .icon-share-pinterest, .ie9 #global-ux .share-overlay .share-wrapper .social-links .icon-share-pinterest { background-position: -177px 0; } .ie8 #global-ux .share-overlay .share-wrapper .social-links .icon-share-email, .ie9 #global-ux .share-overlay .share-wrapper .social-links .icon-share-email { background-position: -263px 0; } .ie8 #global-ux .share-overlay .share-wrapper .social-links .icon-share-googleplus, .ie9 #global-ux .share-overlay .share-wrapper .social-links .icon-share-googleplus { background-position: -345px 0; } .box .brochureware-download { margin: 30px; } @media only screen and (min-width: 62em) { .box .brochureware-download { margin: 30px 200px; } } .box .brochureware-download>.feature-container>.richtext { background-color: #f7f7f7; margin-bottom: 30px; } #global-ux .box .brochureware-download>.feature-container>.richtext h4 { font-size: 18px; font-size: 1.125rem; padding: 15px 20px; } #global-ux .box .brochureware-download>.feature-container>.richtext h4:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #global-ux .box .brochureware-download>.feature-container>.richtext h4:before { font-size: 35px; margin: -5px 20px 0 0; display: inline-block; color: #2d96cd; } @media only screen and (min-width: 48em) { .box .brochureware-download .splitter { display: table; width: 100%; } .cq-wcm-edit .box .brochureware-download .splitter { display: block; } } @media only screen and (min-width: 48em) { .box .brochureware-download .splitter .row, .box .brochureware-download .splitter #global-ux .genericCarousel, #global-ux .box .brochureware-download .splitter .genericCarousel, .box .brochureware-download .splitter #global-ux .dynamicCarousel, #global-ux .box .brochureware-download .splitter .dynamicCarousel, .box .brochureware-download .splitter #global-ux .billboardCarousel, #global-ux .box .brochureware-download .splitter .billboardCarousel, .box .brochureware-download .splitter #global-ux .mediaCarousel, #global-ux .box .brochureware-download .splitter .mediaCarousel, .box .brochureware-download .splitter #global-ux .accessoriesTile, #global-ux .box .brochureware-download .splitter .accessoriesTile, .box .brochureware-download .splitter #global-ux .mediaCarousel .media-carousel, #global-ux .mediaCarousel .box .brochureware-download .splitter .media-carousel, .box .brochureware-download .splitter #global-ux .threesixtyColouriser, #global-ux .box .brochureware-download .splitter .threesixtyColouriser { display: table-row; } .cq-wcm-edit .box .brochureware-download .splitter .row, .cq-wcm-edit .box .brochureware-download .splitter #global-ux .genericCarousel, #global-ux .cq-wcm-edit .box .brochureware-download .splitter .genericCarousel, .cq-wcm-edit .box .brochureware-download .splitter #global-ux .dynamicCarousel, #global-ux .cq-wcm-edit .box .brochureware-download .splitter .dynamicCarousel, .cq-wcm-edit .box .brochureware-download .splitter #global-ux .billboardCarousel, #global-ux .cq-wcm-edit .box .brochureware-download .splitter .billboardCarousel, .cq-wcm-edit .box .brochureware-download .splitter #global-ux .mediaCarousel, #global-ux .cq-wcm-edit .box .brochureware-download .splitter .mediaCarousel, .cq-wcm-edit .box .brochureware-download .splitter #global-ux .accessoriesTile, #global-ux .cq-wcm-edit .box .brochureware-download .splitter .accessoriesTile, .cq-wcm-edit .box .brochureware-download .splitter #global-ux .mediaCarousel .media-carousel, #global-ux .mediaCarousel .cq-wcm-edit .box .brochureware-download .splitter .media-carousel, .cq-wcm-edit .box .brochureware-download .splitter #global-ux .threesixtyColouriser, #global-ux .cq-wcm-edit .box .brochureware-download .splitter .threesixtyColouriser { display: block; } } .box .brochureware-download .splitter-column { float: none; overflow: hidden; } @media only screen and (min-width: 48em) { .box .brochureware-download .splitter-column { display: table-cell; } .cq-wcm-edit .box .brochureware-download .splitter-column { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; display: block; float: left; } } .box .brochureware-download .splitter-column>div { padding: 50px 0; } @media only screen and (min-width: 48em) { .box .brochureware-download .splitter-column>div { padding: 0; } } .box .brochureware-download .splitter-column:first-child>div { padding-top: 0; } @media only screen and (min-width: 48em) { .box .brochureware-download .splitter-column:first-child { padding-left: 0; width: 20%; } } .box .brochureware-download .splitter-column:nth-child(2)>div, .box .brochureware-download .splitter-column:nth-child(3)>div { border-top: 1px solid #dfdfdf; } @media only screen and (min-width: 48em) { .box .brochureware-download .splitter-column:nth-child(2)>div, .box .brochureware-download .splitter-column:nth-child(3)>div { border: none; } } @media only screen and (min-width: 48em) { .box .brochureware-download .splitter-column:nth-child(2), .box .brochureware-download .splitter-column:nth-child(3) { width: 40%; padding-left: 50px; padding-right: 50px; } .box .brochureware-download .splitter-column:nth-child(2):before, .box .brochureware-download .splitter-column:nth-child(3):before { content: ''; display: block; float: left; position: absolute; height: calc(100% - 30px); padding-top: 100%; width: 1px; background-color: #dfdfdf; top: 30px; left: 0; } .cq-wcm-edit .box .brochureware-download .splitter-column:nth-child(2):before, .cq-wcm-edit .box .brochureware-download .splitter-column:nth-child(3):before { content: none; display: none; } } #global-ux .box .brochureware-download .splitter-column h5 { font-size: 18px; font-size: 1.125rem; margin-bottom: 20px; } #global-ux .box .brochureware-download .splitter-column p { font-size: 12px; font-size: .75rem; color: #A8A8A8; margin-bottom: .3125rem; } #global-ux .box .brochureware-download .splitter-column a { font-size: inherit; text-decoration: none; font-family: inherit; color: #2d96cd; } #global-ux .box .brochureware-download .splitter-column a[class*='icon-']:before { font-size: 19px; font-family: 'icomoon'; color: #A8A8A8; margin-right: 10px; display: inline-block; position: relative; top: 2px; } .box .brochureware-download .splitter-column .image { clear: both; } .cq-wcm-edit .box .brochureware-download .splitter-column .image { float: left; } .box .brochureware-download .splitter-column .image+.image { margin-top: 30px; } .box .brochureware-download .splitter-column .image img { margin-bottom: 30px; } @media only screen and (min-width: 48em) { .box .brochureware-download .splitter-column .image img { float: left; max-width: 30%; margin-bottom: 0; } } @media only screen and (min-width: 48em) { .box .brochureware-download .splitter-column .image .image-caption { margin-left: 30%; padding-left: 20px; } } #global-ux .box-image-overlay { min-height: 68px; padding: 8px 20px; } @media only screen and (min-width: 48em) { #global-ux .box-image-overlay { padding: 8px 6.5972%; } } #global-ux .box-image-overlay .richtext { float: left; } #global-ux .box-image-overlay .richtext h3 { font-size: 16px; font-size: 1rem; font-weight: 200; color: #616161; line-height: 150%; margin: 0; padding-top: 30px; } @media only screen and (min-width: 48em) { #global-ux .box-image-overlay .richtext h3 { font-size: 24px; font-size: 1.5rem; padding: 8px 0; } } #global-ux .box-image-overlay .actionsPanel { float: right; padding: 0; width: auto; } #global-ux .box-image-overlay .actionsPanel p { margin-bottom: 0; } #global-ux .box-image-overlay .actionsPanel .action { width: auto; margin-left: 30px; } #global-ux .overlay-content-inner .box .box-image-overlay { padding: 0; } .rtl #global-ux .box-image-overlay .actionsPanel { float: left; } .rtl #global-ux .box .generic-wrapper .richtext h3 { font-size: 48px; font-size: 3rem; } .rtl #global-ux .box .generic-wrapper .richtext h5 { font-size: 28px; font-size: 1.75rem; } .rtl #global-ux .box .generic-wrapper .richtext p, .rtl #global-ux .box .generic-wrapper .richtext ul li { font-size: 24px; font-size: 1.5rem; } .rtl #global-ux .box .generic-wrapper .richtext p:before, .rtl #global-ux .box .generic-wrapper .richtext ul li:before { margin: -3px -15px 10px 0; } .rtl #global-ux .box .generic-wrapper .richtext ul { margin-left: 0; margin-right: 2.5rem; } .rtl #global-ux .box .features-trigger .section { float: right; } #global-ux .brightcove { background: #fff; } #global-ux .brightcove .fsVideoContainer { z-index: 10000; top: 0px !important; right: 0px !important; left: 0px !important; display: grid !important; min-height: 100vh !important; } #global-ux .brightcove .fsVideoContainer .icon-plus.icon-x { background-image: url("../../guxfoap/img/icons.svg"); background-repeat: no-repeat; font-size: 40px; display: block; background-position: -80px -220px; position: absolute; right: 2%; top: 2%; height: 30px; width: 30px; cursor: pointer; } #global-ux .brightcove .vjs-tech.fsVideo { padding: 0; margin: 0; margin-top: 50px; height: 100%; position: absolute; } #global-ux .brightcove .brightcove-player { position: relative; width: 100%; height: 100%; } #global-ux .brightcove .brightcove-player iframe { display: block; border: none; overflow: visible; width: 100%; height: 100%; margin: 0; padding: 0; } #global-ux .brightcove .brightcove-player .video-js { position: absolute; width: 100%; height: 100%; } #global-ux .brightcove .brightcove-player .vjs-fullscreen { position: relative !important; } #global-ux .brightcove .brightcove-player .vjs-big-play-button { -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); position: absolute; left: 50%; top: 50%; font-family: VideoJS; font-size: 48px; padding: 0px; margin: 0px; background-color: rgba(0,0,0,0.45); } #global-ux .brightcove .brightcove-player .vjs-button { font-family: VideoJS; padding: 0px; font-size: 10px; background: none; } #global-ux .brightcove .brightcove-player object.vjs-tech, #global-ux .brightcove .brightcove-player .BrightcoveExperience { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } #global-ux .brightcove .brightcove-player .start-image { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 1; display: none; overflow: hidden; cursor: pointer; } #global-ux .brightcove .brightcove-player .start-image a picture { font-size: 4.0625rem; display: block; color: #fff; position: relative; cursor: pointer; } #global-ux .brightcove .brightcove-player .start-image a picture:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #global-ux .brightcove .brightcove-player .start-image a picture:before { -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); content: "\e632"; position: absolute; top: 50%; left: 50%; z-index: 9; cursor: pointer; } #global-ux .brightcove .brightcove-player .start-image .component-content, #global-ux .brightcove .brightcove-player .start-image .component-content picture { position: static !important; } #global-ux .brightcove .brightcove-player .start-image .component-content img { position: absolute; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); top: 50%; left: 50%; } #global-ux .brightcove .brightcove-player .end-image { display: none; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 1; } #global-ux .brightcove .brightcove-player .end-image a picture { font-size: 4.0625rem; display: block; color: #fff; position: relative; } #global-ux .brightcove .brightcove-player .end-image a picture:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #global-ux .brightcove .brightcove-player .end-image a picture:before { -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); content: "\e632"; position: absolute; top: 50%; left: 50%; z-index: 1; } #global-ux .brightcove .brightcove-player .end-image .component-content, #global-ux .brightcove .brightcove-player .end-image .component-content picture { position: static !important; } #global-ux .brightcove .brightcove-player .end-image .component-content img { position: absolute; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); top: 50%; left: 50%; max-width: none; width: auto; height: auto; min-width: 100%; min-height: 100%; } #global-ux .brightcove .brightcove-player .start-image .component-content, #global-ux .brightcove .brightcove-player .end-image .component-content { position: relative; } #global-ux .brightcove .brightcove-player .start-image .brightcove-text, #global-ux .brightcove .brightcove-player .end-image .brightcove-text { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%); -moz-transform: translate(-50%); -webkit-transform: translate(-50%); -o-transform: translate(-50%); transform: translate(-50%); width: 100%; text-align: center; color: #fff; margin-top: 2.6875rem; font-weight: 700; font-size: 15px; font-size: .9375rem; } @media only screen and (min-width: 48em) { #global-ux .brightcove .brightcove-player .start-image .brightcove-text, #global-ux .brightcove .brightcove-player .end-image .brightcove-text { font-size: 18px; font-size: 1.125rem; margin-top: 3.9375rem; } } #global-ux .brightcove .brightcove-player.auto-play .start-image { display: none !important; } #global-ux .brightcove .video-description { background: #000; padding: .625rem 1.25rem; } #global-ux .brightcove .video-description, #global-ux .brightcove .video-description h2 { color: #fff; font-weight: 200; } #global-ux .brightcove .video-description h2 { font-size: 15px; font-size: .9375rem; } @media only screen and (min-width: 48em) { #global-ux .brightcove .video-description h2 { font-size: 30px; font-size: 1.875rem; padding: 1.25rem 2.5rem; } } .csstransforms #global-ux .overlay-container.overlay-video .overlay-content { top: 0; margin-top: 3rem; margin-bottom: 3rem; -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0); } .brightcove .outer-container { position: relative; height: 0; padding-bottom: 56.25%; display: block; } .brightcove .outer-container .BrightcoveExperience { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .ie8 #global-ux .brightcove .brightcove-player .start-image a .component-content, .ie8 #global-ux .brightcove .brightcove-player .end-image a .component-content { display: block; color: #fff; position: relative; font-size: 65px; } .ie8 #global-ux .brightcove .brightcove-player .start-image a .component-content:before, .ie8 #global-ux .brightcove .brightcove-player .end-image a .component-content:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .ie8 #global-ux .brightcove .brightcove-player .start-image a .component-content:before, .ie8 #global-ux .brightcove .brightcove-player .end-image a .component-content:before { content: "\e632"; position: absolute; top: 50%; left: 50%; margin: -33px 0 0 -33px; } .ie8 #global-ux .brightcove .video-description { padding: 10px 20px; } .ie8 #global-ux .brightcove .video-description h2 { font-size: 30px; font-size: 1.875rem; padding: 20px 40px; } .ie8 #global-ux .brightcove .brightcove-player .start-image .component-content img, .ie8 #global-ux .brightcove .brightcove-player .end-image .component-content img { top: 0; left: 0; z-index: -1; } .ie8 #global-ux .brightcove .brightcove-player .start-image .brightcove-text, .ie8 #global-ux .brightcove .brightcove-player .end-image .brightcove-text { left: 0; padding: 0 15%; margin-top: 70px; } @media screen and (min-width: 0\0) { #global-ux .brightcove .brightcove-player .start-image a picture:before { display: none; } } .ie9 #global-ux .brightcove .brightcove-player .start-image:before { color: #fff !important; content: "\e632" !important; display: block !important; font-family: "icomoon" !important; font-size: 4.0625rem !important; left: 50% !important; overflow: visible !important; position: absolute !important; top: 50% !important; z-index: 5 !important; zoom: 1 !important; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } .ie9 #global-ux .brightcove .js-brightcove-player .video-js { width: 100% !important; height: 100% !important; } @media screen and (min-width: 0\0) { #global-ux .brightcove .brightcove-player .start-image:before { color: #fff !important; content: "\e632" !important; display: block !important; font-family: "icomoon" !important; font-size: 4.0625rem !important; left: 50% !important; overflow: visible !important; position: absolute !important; top: 50% !important; z-index: 5 !important; zoom: 1 !important; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } } #global-ux .brightcove.section .billboard-paragraph { position: absolute; top: 50%; padding-left: 7%; width: 40%; transform: translate(0, -50%); z-index: 999; } #global-ux .brightcove.section .billboard-paragraph .richtext h2 { font-weight: 200; color: #fff; margin: 0; font-size: 48px; display: inline-block; padding: 0; padding-bottom: 28px; } #global-ux .brightcove.section .billboard-paragraph .richtext p { padding: 0; margin: 0; } #global-ux .brightcove.section .billboard-paragraph .richtext p .cta-button { box-sizing: border-box; text-align: center; display: inline-block; padding: 23px 68px; border: none; margin: 0 auto; text-transform: uppercase; font-weight: normal; font-size: 18px; margin-bottom: 17px; } .ie8 #global-ux .brightcove.section .billboard-paragraph { top: 20%; } .ie8 #global-ux .brightcove.section .billboard-paragraph .richtext h2 { font-size: 40px; } .ie8 #global-ux .brightcove.section .billboard-paragraph .richtext p .cta-button { padding-left: 30px; padding-right: 30px; } @media (min-width: 768px) and (max-width: 1024px) { #global-ux .brightcove.section .billboard-paragraph .richtext h2 { font-size: 25px; text-shadow: none; padding-bottom: 18px; } #global-ux .brightcove.section .billboard-paragraph .richtext p .cta-button { display: inline-block; margin: 0 auto 15px; font-size: 10px; text-align: center; width: 25%; min-width: inherit !important; padding: 10px 0; } } @media (max-width: 767px) { #global-ux .brightcove.section .billboard-paragraph { width: 100%; left: 0%; top: 70%; padding-left: 15px; padding-bottom: 15px; padding-right: 15px; } #global-ux .brightcove.section .billboard-paragraph .richtext h2 { font-size: 24px; padding: 18px 10px; line-height: 33px; padding-bottom: 0; } #global-ux .brightcove.section .billboard-paragraph .richtext h2+h2 { margin-top: 0; padding-top: 0; padding-bottom: 15px; } #global-ux .brightcove.section .billboard-paragraph .richtext p .cta-button { display: inline-block; margin: 0 auto 15px; font-size: 13px; text-align: center; width: auto; min-width: inherit !important; } } @media (max-width: 767px) { .rtl .billboard.section .billboard-content.billboard-smart-next-steps .billboard-inner .billboard-paragraph .richtext h2 { line-height: 1.2 !important; } } .rtl #global-ux .brightcove-description h5 { font-size: 30px; font-size: 1.875rem; } .rtl #global-ux .brightcove-description p { font-size: 20px; font-size: 1.25rem; } #back-to-the-top { -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); position: fixed; top: 90px; width: 100%; max-width: 90rem; left: 50%; max-height: 0; z-index: 10; } #back-to-the-top.scrollUp a { right: 10px; opacity: 1; } @media only screen and (min-width: 30.0625em) { #back-to-the-top.scrollUp a { right: 5px; } } @media only screen and (min-width: 30.0625em) { #back-to-the-top { top: auto; bottom: 105px; } } @media only screen and (min-width: 48em) { #back-to-the-top { bottom: 127px; } } @media only screen and (max-width: 479px) { #back-to-the-top { top: auto; bottom: 100px; } } #back-to-the-top a { -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; display: block; position: absolute; right: -50px; width: 65px; height: 65px; padding: 10px; opacity: 0; text-indent: 200%; white-space: nowrap; overflow: hidden; } #back-to-the-top a:before { font-size: 25px; font-size: 1.5625rem; font-weight: 700; font-family: "icomoon"; content: "\e640"; display: block; position: absolute; z-index: 3; top: 10px; left: 10px; width: 45px; height: 45px; line-height: 43px; color: #fff; text-indent: 0; text-align: center; opacity: inherit; } #back-to-the-top a:after { content: ''; display: block; position: absolute; z-index: 2; top: 10px; left: 10px; width: 45px; height: 45px; background-color: rgba(0,0,0,0.7); border-radius: 50%; border: 2px solid rgba(255,255,255,0.6); opacity: inherit; } .ie8 #back-to-the-top { left: 20px; top: auto; bottom: 127px; } .ie8 #back-to-the-top a { border: 2px solid gray; background: black; filter: alpha(opacity=70); } .ie8 #back-to-the-top.scrollUp { left: -15px; } #global-ux .brandGallery { margin: 0; background: #fff; overflow: hidden; height: auto !important; } @media only screen and (min-width: 90.125rem) { #global-ux .brandGallery { margin: 0 -1px -1px; } } #global-ux .brandGallery .item { position: relative; display: none; } #global-ux .brandGallery .item:nth-child(-n+4) { display: block; } @media only screen and (min-width: 48em) { #global-ux .brandGallery .item { display: block !important; float: left; width: 50%; } } @media only screen and (min-width: 48em) { #global-ux .brandGallery .item { display: block !important; float: left; width: 25%; } } #global-ux .brandGallery .image { overflow: hidden; position: relative; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); } #global-ux .brandGallery .image .image-caption { -webkit-transition: background 0.5s ease 0.1s; -moz-transition: background 0.5s ease 0.1s; -ms-transition: background 0.5s ease 0.1s; -o-transition: background 0.5s ease 0.1s; transition: background 0.5s ease 0.1s; pointer-events: none; display: block; position: absolute; bottom: 0; width: 100%; height: 20%; background: rgba(45,150,205,0.6); } #global-ux .brandGallery .image .image-caption p { font-weight: 300; position: relative; margin-left: 0.625rem; color: #fff; line-height: 1; padding: 0 50px 0 3%; margin-bottom: 0; height: auto; top: 50%; -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); } #global-ux .brandGallery .image .image-caption p span { line-height: 1.2rem; } #global-ux .brandGallery .image .image-caption p:before { content: "\e618"; font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; text-rendering: auto; text-transform: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; float: right; font-size: 1.9rem; margin-top: -0.45rem; vertical-align: middle; margin-right: -35px; } @media only screen and (min-width: 48em) { #global-ux .brandGallery .image .image-caption p:before { margin-top: 0; font-size: 1.1rem; } } #global-ux .brandGallery .image picture img { -webkit-transition: all 0.5s ease 0.1s; -moz-transition: all 0.5s ease 0.1s; -ms-transition: all 0.5s ease 0.1s; -o-transition: all 0.5s ease 0.1s; transition: all 0.5s ease 0.1s; -webkit-transform: scale(1.01); -moz-transform: scale(1.01); -ms-transform: scale(1.01); -o-transform: scale(1.01); transform: scale(1.01); -webkit-filter: blur(0px); -moz-filter: blur(0px); -ms-filter: blur(0px); filter: none; filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius='0'); box-shadow: 0 0 1px rgba(0,0,0,0.05); outline: 1px solid transparent; } #global-ux .brandGallery .image:hover .image-caption, #global-ux .brandGallery .image a:active .image-caption, #global-ux .brandGallery .image a:focus .image-caption { background: rgba(45,150,205,0.8); } #global-ux .brandGallery .image:hover .zoom picture img, #global-ux .brandGallery .image a:active .zoom picture img, #global-ux .brandGallery .image a:focus .zoom picture img { -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05); } #global-ux .brandGallery .image .link-overlay-video .image-caption p:before { content: "" !important; font-size: 15px; font-size: .9375rem; margin-top: .1875rem; } #global-ux .brandGallery .image .component-content { overflow: hidden; } #global-ux .brandGallery .image .video-link-overlay picture, #global-ux .brandGallery .image .link-overlay-video picture { margin: 0; } #global-ux .brandGallery .heading { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); margin-top: -1px; text-align: center; padding: 7% 5% 1.875rem; } #global-ux .brandGallery .heading h2 { font-weight: 200; font-size: 24px; font-size: 1.5rem; margin: 20px 0 10px; line-height: 1.1; color: #626466; } @media only screen and (min-width: 48em) { #global-ux .brandGallery .heading h2 { font-size: 40px; font-size: 2.5rem; } } @media only screen and (min-width: 48em) { #global-ux .brandGallery .heading h2 { font-size: 32px; font-size: 2rem; } } @media only screen and (min-width: 48em) { #global-ux .brandGallery .heading h2 { font-size: 36px; font-size: 2.25rem; } } #global-ux .brandGallery .heading p { font-size: 14px; font-size: .875rem; margin: 1.25rem 0 .625rem; color: #626466; } @media only screen and (min-width: 48em) { #global-ux .brandGallery .heading { width: 75%; float: left; padding: 5% 5% 0 1.875rem; } } @media only screen and (min-width: 48em) { #global-ux .brandGallery .one { width: 50%; } } @media only screen and (min-width: 1440px) { #global-ux .brandGallery .one.hero { width: 50% !important; } } #global-ux .brandGallery .hero .image .link-overlay img { width: 100%; margin-bottom: 1px; } @media only screen and (min-width: 48em) { #global-ux .brandGallery .hero .image .image-caption p { font-size: 19px; font-size: 1.1875rem; text-align: center; } #global-ux .brandGallery .hero .image .image-caption p span { vertical-align: middle; } #global-ux .brandGallery .hero .image .image-caption p:before { content: none; } #global-ux .brandGallery .hero .image .image-caption p:after { content: "\e618"; font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; text-rendering: auto; text-transform: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; float: none; font-size: 1.5rem; margin-top: -0.45rem; vertical-align: middle; margin-right: -35px; margin-left: 1rem; } } @media only screen and (min-width: 48em) { #global-ux .brandGallery .hero .image .link-overlay-video .image-caption p:after { display: none; } } #global-ux .brandGallery .view-toggle { font-size: 24px; font-size: 1.5rem; font-weight: 200; display: block; text-align: center; padding: 12px 0; width: 100%; background-color: #2d96cd; border-top: 5px solid #fff; border-bottom: 5px solid #fff; cursor: pointer; color: #fff; } @media only screen and (min-width: 48em) { #global-ux .brandGallery .view-toggle { display: none; } } #global-ux .brandGallery .view-toggle .icon-plus, #global-ux .brandGallery .view-toggle .icon-minus { font-size: 19px; font-size: 1.1875rem; vertical-align: top; } #global-ux .brandGallery .view-toggle .view-less { display: none; } #global-ux .brandGallery .view-toggle.in .view-less { display: block; } #global-ux .brandGallery .view-toggle.in .view-all { display: none; } #global-ux .brandGallery .ieImg { overflow: hidden; } #global-ux .brandGallery .ieImg .brandGallery-fake-img { position: absolute; max-width: none !important; top: 50%; left: 50%; float: none !important; z-index: 1; width: 100%; height: auto; transition: none !important; } #global-ux .brandGallery .ieImg .image-caption { z-index: 2; } @media only screen and (min-width: 768px) { #global-ux .brandGallery .heading { display: table; padding: 0 5% 0 1.875rem; } #global-ux .brandGallery .heading .richtext { display: table-row; } #global-ux .brandGallery .heading .richtext .richtext-read-more { display: table-cell; vertical-align: middle; } #global-ux .brandGallery .heading .richtext .richtext-read-more h2, #global-ux .brandGallery .heading .richtext .richtext-read-more p { overflow: hidden; } #global-ux .brandGallery .heading .richtext .richtext-read-more h2 { height: 40px; margin-top: 0; } #global-ux .brandGallery .heading .richtext .richtext-read-more p { max-height: 42px; margin-bottom: 0; margin-top: 0; } #global-ux .brandGallery .heading .richtext .richtext-read-more .gux-tooltip:after { top: 0; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { #global-ux .brandGallery .heading { padding: 0 .9375rem; } #global-ux .brandGallery .heading, #global-ux .brandGallery .heading .richtext, #global-ux .brandGallery .heading .richtext .richtext-read-more { display: block; } #global-ux .brandGallery .heading .richtext-read-more .desktop { position: absolute; width: 100%; left: 0; top: 50%; -moz-transform: translate(0, 0%); -webkit-transform: translate(0, 0%); -ms-transform: translate(0, 0%); -o-transform: translate(0, 0%); transform: translate(0, 0%); } #global-ux .brandGallery .image .image-caption { height: 30%; } #global-ux .brandGallery .hero .image .image-caption { height: 20%; } } .ie8 #global-ux .brandGallery .view-toggle, .ie9 #global-ux .brandGallery .view-toggle { display: none; } .ie8 #global-ux .brandGallery .heading, .ie9 #global-ux .brandGallery .heading { padding: 0 5% 0; float: left; width: 75%; display: table; } .ie8 #global-ux .brandGallery .heading .richtext, .ie9 #global-ux .brandGallery .heading .richtext { display: table-row; } .ie8 #global-ux .brandGallery .heading .richtext .richtext-read-more, .ie9 #global-ux .brandGallery .heading .richtext .richtext-read-more { display: table-cell; vertical-align: middle; height: 300px; } .ie8 #global-ux .brandGallery .heading h2, .ie9 #global-ux .brandGallery .heading h2 { font-size: 36px; } .ie8 #global-ux .brandGallery .heading p, .ie9 #global-ux .brandGallery .heading p { font-size: 14px; margin: 20px 0 10px; line-height: 20px; } .ie8 #global-ux .brandGallery .item, .ie9 #global-ux .brandGallery .item { display: block !important; float: left; width: 25%; } .ie8 #global-ux .brandGallery .one, .ie9 #global-ux .brandGallery .one { width: 50%; } .ie8 #global-ux .brandGallery .image .image-caption, .ie9 #global-ux .brandGallery .image .image-caption { background: #2d96cd; filter: alpha(opacity=60); cursor: pointer; } .ie8 #global-ux .brandGallery .image .image-caption p::before, .ie9 #global-ux .brandGallery .image .image-caption p::before { font-size: 15px; margin-top: 30px; } .ie8 #global-ux .brandGallery .image .image-caption p, .ie9 #global-ux .brandGallery .image .image-caption p { text-align: left; top: 30%; } .ie8 #global-ux .brandGallery .image .black-caption .image-caption, .ie9 #global-ux .brandGallery .image .black-caption .image-caption { background: #000000; opacity: 0.5; } .ie8 #global-ux .brandGallery .hero, .ie9 #global-ux .brandGallery .hero { margin-bottom: -1px; } .ie8 #global-ux .brandGallery .hero .image .image-caption p, .ie9 #global-ux .brandGallery .hero .image .image-caption p { font-size: 19px; } .ie8 #global-ux .brandGallery .hero .image .link-overlay img, .ie9 #global-ux .brandGallery .hero .image .link-overlay img { margin-bottom: 0; } #global-ux .brandGallery .image .black-caption .image-caption { background: rgba(0,0,0,0.5); } #global-ux .brandGallery .image .black-caption:hover .image-caption, #global-ux .brandGallery .image .black-caption a:active .image-caption, #global-ux .brandGallery .image .black-caption a:focus .image-caption { background: rgba(0,0,0,0.8); } @media only screen and (min-width: 48em) { .rtl #global-ux .brandGallery .heading { float: right; } } .rtl #global-ux .brandGallery .heading .richtext .richtext-read-more h2 { font-size: 54px; font-size: 3.375rem; height: 80px; } @media only screen and (max-width: 479px) { .rtl #global-ux .brandGallery .heading .richtext .richtext-read-more h2 { height: auto; } } .rtl #global-ux .brandGallery .heading .richtext .richtext-read-more p { font-size: 24px; font-size: 1.5rem; max-height: 60px; padding-bottom: 15px; } @media only screen and (min-width: 48em) { .rtl #global-ux .brandGallery .item { float: right; } } .rtl #global-ux .brandGallery .image .image-caption p { font-size: 22px !important; padding-right: 3%; } .rtl #global-ux .brandGallery .image .image-caption p:after { transform: rotateY(-180deg); padding-top: 4px; } @media (max-width: 767px) { .rtl #global-ux .brandGallery .image .image-caption p.text-left { padding-left: 50px; } .rtl #global-ux .brandGallery .image .image-caption p.text-left:before { left: -40px; position: relative; } } #global-ux .cookie-disclaimer { display: none; background: #1b394e; } #global-ux .cookie-disclaimer .close { display: -moz-inline-stack; display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; float: right; padding: 10px; color: #fff; cursor: pointer; } #global-ux .cookie-disclaimer .text { padding: 30px; } #global-ux .cookie-disclaimer .text p { color: #fff; text-align: center; padding-right: 10px; } #global-ux .cookie-disclaimer .text p a { font-weight: 700; color: #fff; text-decoration: underline; } #global-ux .youMightAlsoLike { display: none; } #global-ux .youMightAlsoLike.service-ok { display: block; position: relative; padding: 4.0625rem 1.5625rem 7.1875rem; overflow: hidden; text-align: center; } @media only screen and (min-width: 30.0625em) { #global-ux .youMightAlsoLike.service-ok { padding: 4.0625rem 1.5625rem 4.375rem 1.5625rem; } } #global-ux .youMightAlsoLike.service-ok h2 { font-weight: 200; color: #616161; } @media only screen and (min-width: 48em) { #global-ux .youMightAlsoLike.service-ok h2 { text-align: center; } } #global-ux .youMightAlsoLike.service-ok .slide-container { width: 440px; margin: 0 auto; } @media only screen and (min-width: 30.0625em) { #global-ux .youMightAlsoLike.service-ok .slide-container { width: 660px; } } @media only screen and (min-width: 62em) { #global-ux .youMightAlsoLike.service-ok .slide-container { width: 920px; } } #global-ux .youMightAlsoLike.service-ok .slide-container.three-items { width: 660px; } @media only screen and (min-width: 30.0625em) { #global-ux .youMightAlsoLike.service-ok .slide-container.three-items { width: 660px; } } @media only screen and (min-width: 62em) { #global-ux .youMightAlsoLike.service-ok .slide-container.three-items { width: 1080px; } } #global-ux .youMightAlsoLike.service-ok .carousel { outline-width: 0; overflow-x: scroll; } @media only screen and (min-width: 62em) { #global-ux .youMightAlsoLike.service-ok .carousel { overflow: hidden; } } #global-ux .youMightAlsoLike.service-ok .carousel .carousel-slide { width: 220px; float: left; } @media only screen and (min-width: 30.0625em) { #global-ux .youMightAlsoLike.service-ok .carousel .carousel-slide { width: 330px; } } @media only screen and (min-width: 62em) { #global-ux .youMightAlsoLike.service-ok .carousel .carousel-slide { width: 450px; } } @media only screen and (min-width: 30.0625em) { #global-ux .youMightAlsoLike.service-ok .carousel .three-items .carousel-slide { width: 220px; } } @media only screen and (min-width: 62em) { #global-ux .youMightAlsoLike.service-ok .carousel .three-items .carousel-slide { width: 360px; } } #global-ux .youMightAlsoLike.service-ok .model { padding: 0 .9375rem; text-align: center; } #global-ux .youMightAlsoLike.service-ok .model h6 { font-weight: 300; color: #2d96cd; } @media only screen and (max-width: 768px) { #global-ux .youMightAlsoLike.service-ok .model h6 { padding: 0; } } #global-ux .youMightAlsoLike.service-ok .model h6:hover { color: #19678e; } #global-ux .youMightAlsoLike.service-ok .model p { margin-bottom: .3125rem; cursor: pointer; color: #231f20; } #global-ux .youMightAlsoLike.service-ok .model sup[data-disclosure] { cursor: pointer; } #global-ux .youMightAlsoLike.service-ok .model a { color: #2596cf; } .ie8 #global-ux .youMightAlsoLike.service-ok { padding: 35px 25px 115px; } .ie8 #global-ux .youMightAlsoLike.service-ok h2 { margin-bottom: 70px; text-align: center; font-size: 40px; } .ie8 #global-ux .youMightAlsoLike.service-ok .slide-container { width: 660px; width: 920px; } .ie8 #global-ux .youMightAlsoLike.service-ok .slide-container.three-items { width: 1080px; } .ie8 #global-ux .youMightAlsoLike.service-ok .carousel { overflow: hidden; } .ie8 #global-ux .youMightAlsoLike.service-ok .carousel .carousel-slide { width: 450px; } .ie8 #global-ux .youMightAlsoLike.service-ok .carousel .three-items .carousel-slide { width: 360px; } .ie8 #global-ux .youMightAlsoLike.service-ok .model { padding: 0px 15px; } .ie8 #global-ux .youMightAlsoLike.service-ok .model h6 { margin: 20px 0px 10px; } .ie8 #global-ux .youMightAlsoLike.service-ok .model p { margin-bottom: 5px; } #global-ux .gallery-trigger { position: relative; overflow: hidden; } #global-ux .gallery-trigger:after { content: ""; display: table; clear: both; } #global-ux .gallery-trigger .image { position: relative; display: none; float: left; overflow: hidden; width: 50%; margin: 0; padding: 0; max-height: 200px; } .ie8 #global-ux .gallery-trigger .image, .ie9 #global-ux .gallery-trigger .image { width: 25%; display: block; max-height: none; } #global-ux .gallery-trigger .image:nth-child(-n+7), #global-ux .gallery-trigger .image:last-child { display: block; } @media only screen and (min-width: 30.0625em) { #global-ux .gallery-trigger .image { width: 50%; max-height: 320px; } } @media only screen and (min-width: 48em) { #global-ux .gallery-trigger .image { width: 25%; display: block; } } #global-ux .gallery-trigger .image .image-caption { font-weight: 300; pointer-events: none; display: block; position: absolute; color: white; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; background: rgba(45,150,205,0.9); } .ie8 #global-ux .gallery-trigger .image .image-caption, .ie9 #global-ux .gallery-trigger .image .image-caption { background: #2d96cd; } #global-ux .gallery-trigger .image .image-caption p { font-size: 24px; font-size: 1.5rem; -ms-word-break: break-all; word-break: break-all; word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; position: relative; top: 50%; padding: 0 5%; margin: -12px 0 0 0; line-height: 26.4px; color: white; text-align: center; text-decoration: none; } #global-ux .gallery-trigger .image .image-caption p:after { content: "\e615"; font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; text-rendering: auto; text-transform: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; margin-left: 5px; display: inline-block; vertical-align: top; margin-top: 1px; } #global-ux .gallery-trigger .image .component-content a:focus picture img { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); } #global-ux .gallery-trigger .image picture img { -webkit-transition: all 0.5s ease 0.1s; -moz-transition: all 0.5s ease 0.1s; -ms-transition: all 0.5s ease 0.1s; -o-transition: all 0.5s ease 0.1s; transition: all 0.5s ease 0.1s; -webkit-transform: scale(1.01) translateZ(0); -moz-transform: scale(1.01) translateZ(0); -ms-transform: scale(1.01) translateZ(0); -o-transform: scale(1.01) translateZ(0); transform: scale(1.01) translateZ(0); height: 100%; } #global-ux .gallery-trigger .image picture:hover img { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); } @media only screen and (min-width: 30.0625em) { #global-ux .gallery-trigger .splitter-column .image { width: auto; } } @media only screen and (min-width: 48em) { #global-ux .gallery-trigger .splitter-column .image { width: auto; } } @media only screen and (min-width: 30.0625em) { #global-ux .gallery-trigger .splitter-column .sameHeightSplitter .image { width: 100%; } } @media only screen and (min-width: 48em) { #global-ux .gallery-trigger .splitter-column .sameHeightSplitter .image { width: 100%; } } #global-ux .overlay-container.gallery-trigger-carousel .slides-container { position: relative; transition-duration: 0ms; } @media only screen and (min-width: 48em) { #global-ux .overlay-container.gallery-trigger-carousel .slides-container { width: auto !important; } } #global-ux .overlay-container.gallery-trigger-carousel .slides-container.is-loading { transition-duration: 200ms; } #global-ux .overlay-container.gallery-trigger-carousel .slides-container>div:not(.carousel-arrows) { float: left; max-width: 90rem; } #global-ux .overlay-container.gallery-trigger-carousel .slides-container .slide { position: relative; display: none; } #global-ux .overlay-container.gallery-trigger-carousel .slides-container .slide.is-active, #global-ux .overlay-container.gallery-trigger-carousel .slides-container .slide.is-loading { display: block; } #global-ux .overlay-container.gallery-trigger-carousel.overlay-hide .carousel-arrows { display: none; right: 0; } @media only screen and (min-width: 48em) { #global-ux .overlay-container.gallery-trigger-carousel.visible .carousel-arrows { display: block; } } #global-ux .overlay-container.gallery-trigger-carousel .overlay-content { width: 90rem; max-width: 1130px; overflow-x: hidden; } #global-ux .overlay-container.gallery-trigger-carousel .overlay-content:hover .carousel-arrows { right: 0; } @media only screen and (min-width: 48em) { #global-ux .overlay-container.gallery-trigger-carousel .accordion-handle { margin-top: 3px; } } #global-ux .overlay-container.gallery-trigger-carousel .gallery-counter { font-size: 14pxpx; font-size: .875rem; font-weight: 200; float: right; color: #616161; } @media only screen and (min-width: 48em) { #global-ux .overlay-container.gallery-trigger-carousel .gallery-counter { position: absolute; top: 31px; right: 250px; } } @media only screen and (max-width: 768px) { #global-ux .overlay-container.gallery-trigger-carousel .gallery-counter { display: none; } } #global-ux .overlay-container.gallery-trigger-carousel .carousel-arrows { display: none; right: 0; } @media only screen and (min-width: 48em) { #global-ux .overlay-container.gallery-trigger-carousel .carousel-arrows { -webkit-transition: right 0.2s ease; -moz-transition: right 0.2s ease; -ms-transition: right 0.2s ease; -o-transition: right 0.2s ease; transition: right 0.2s ease; position: absolute; top: -100px; right: 0px !important; margin-top: -15px; z-index: 1; } #global-ux .overlay-container.gallery-trigger-carousel .carousel-arrows .icon { line-height: 47px; } } #global-ux .overlay-container.gallery-trigger-carousel .carousel-arrows .carousel-btn { -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); display: block; height: 47px; width: 47px; border-radius: 0; border: none; background-color: #2d96cd; cursor: pointer; } #global-ux .overlay-container.gallery-trigger-carousel .carousel-arrows .carousel-btn.darkened { background-color: rgba(0,0,0,0.5); } #global-ux .overlay-container.gallery-trigger-carousel .carousel-arrows .carousel-btn:hover { background-color: #fff; } #global-ux .overlay-container.gallery-trigger-carousel .carousel-arrows .carousel-btn:hover .icon { color: #2d96cd; } #global-ux .overlay-container.gallery-trigger-carousel .carousel-arrows .carousel-btn .icon { color: #fff; display: block; text-align: center; } #global-ux .overlay-container.gallery-trigger-carousel .carousel-arrows .carousel-btn+ul { display: inline-block; vertical-align: middle; } @media only screen and (max-width: 767px) { #global-ux .gallery-trigger .image:nth-of-type(4), #global-ux .gallery-trigger .image:nth-of-type(5), #global-ux .gallery-trigger .image:nth-of-type(6), #global-ux .gallery-trigger .image:nth-of-type(7) { display: none; } #global-ux .gallery-trigger .image:nth-of-type(1), #global-ux .gallery-trigger .image:nth-of-type(2), #global-ux .gallery-trigger .image:nth-of-type(3), #global-ux .gallery-trigger .image:last-child { display: block !important; } } .ie8 #global-ux .gallery-trigger .image { width: 25%; display: block; margin-bottom: -1px; } .ie8 #global-ux .gallery-trigger .image .image-caption { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=90)"; cursor: hand; } .ie8 #global-ux .gallery-trigger .splitter-column .image { width: auto; } .ie8 #global-ux .gallery-trigger .splitter-column .sameHeightSplitter .image { width: 100%; } .ie8 #global-ux .overlay-container.gallery-trigger-carousel .slides-container>div:not(.carousel-arrows) { max-width: 1440px; } .ie8 #global-ux .overlay-container.gallery-trigger-carousel .gallery-counter { border-right: 1px solid rgba(151,151,151,0.4); padding-right: 15px; margin-right: 15px; } .ie8 #global-ux .overlay-container.gallery-trigger-carousel .carousel-arrows { position: absolute; top: -100px; right: -47px; margin-top: -15px; display: block; z-index: 1; } .ie8 #global-ux .overlay-container.gallery-trigger-carousel .carousel-arrows .icon { line-height: 47px; } .ie8 #global-ux .overlay-container.gallery-trigger-carousel .carousel-arrows .carousel-btn.darkened { background-color: #808080; } .ie8 #global-ux .overlay-container.gallery-trigger-carousel .carousel-arrows .carousel-btn:hover { background-color: #fff; } .ie8 #global-ux .overlay-container.gallery-trigger-carousel .carousel-arrows .carousel-btn:hover .icon { color: #2d96cd; } .ie8 #global-ux .richtext-gridgallery-header h2 { font-size: 48px; } .rtl #global-ux .gallery-trigger .image { float: right; } .rtl #global-ux .gallery-trigger .image .image-caption p { font-size: 40px; font-size: 2.5rem; } .rtl #global-ux .gallery-trigger .image .image-caption p:after { transform: rotateY(-180deg); } .rtl #global-ux .overlay-container.gallery-trigger-carousel .gallery-counter .gallery-counter-current { float: right; margin-left: .3125rem; } .rtl #global-ux .overlay-container.gallery-trigger-carousel .gallery-counter .gallery-counter-all { float: left; margin-right: .3125rem; } #global-ux .search { overflow: hidden; height: 100%; } @media only screen and (max-width: 768px) { #global-ux .search.search-form-sa .search-header { padding: 60px 30px; } } #global-ux .search.search-form-sa .search-header .search-button { display: block; top: 5px; font-size: 2.375rem; } @media only screen and (max-width: 768px) { #global-ux .search.search-form-sa .search-header .search-button { font-size: 1.625rem; } } #global-ux .search.search-form-sa .search-header.focused input[type="search"] { background: #fafafa; -webkit-transition: background 0.2s ease; -moz-transition: background 0.2s ease; -ms-transition: background 0.2s ease; -o-transition: background 0.2s ease; transition: background 0.2s ease; } @media only screen and (max-width: 768px) { #global-ux .search.search-form-sa .search-header input[type="search"] { font-size: 18px; } } #global-ux .search.search-form-sa .search-main { padding: 284px 100px 0; } @media only screen and (max-width: 768px) { #global-ux .search.search-form-sa .search-main { padding: 174px 100px 0; } } #global-ux .search.search-form-sa .search-main .search-popular-items, #global-ux .search.search-form-sa .search-main .search-how-to { display: none; } #global-ux .search .search-header { position: fixed; top: 0; left: 0; right: 0; width: 100%; max-width: 90rem; padding: 35px 60px; margin: 0 auto; background: #fff; } #global-ux .search .search-header .search-button { -moz-box-shadow: none; -webkit-box-shadow: none; -o-box-shadow: none; -ms-box-shadow: none; box-shadow: none; } #global-ux .search .search-header.focused .search-button { visibility: visible; opacity: 1; } #global-ux .search .search-header.focused .header-search-teaser p:before { margin: 0; visibility: hidden; opacity: 0; font-size: 0; } @media only screen and (min-width: 48em) { #global-ux .search .search-header { padding: 75px 100px; max-width: 70.63rem; } } @media only screen and (max-width: 768px) { #global-ux .search .search-header { padding: 30px; } } #global-ux .search .header-search-teaser p { display: -moz-inline-stack; display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; margin-bottom: 14px; color: #A8A8A8; } #global-ux .search .header-search-teaser p:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #global-ux .search .header-search-teaser p:before { -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; margin-right: 10px; visibility: visible; opacity: 1; } #global-ux .search .search-input { position: relative; } #global-ux .search .search-input .twitter-typeahead { width: 100%; } #global-ux .search .search-input input[type="search"], #global-ux .search .search-input .search-button { font-size: 2rem; line-height: 46px; } @media only screen and (min-width: 48em) { #global-ux .search .search-input input[type="search"], #global-ux .search .search-input .search-button { font-size: 3rem; line-height: 68px; } } @media only screen and (max-width: 768px) { #global-ux .search .search-input input[type="search"], #global-ux .search .search-input .search-button { font-size: 1.625rem; line-height: 1; } } #global-ux .search .search-input input[type="search"] { font-weight: 200; background: transparent; height: auto; width: 100%; padding-left: 10px; padding-right: 85px; color: #616161; border-width: 0; border-left: 1px solid #979797; box-shadow: none; } #global-ux .search .search-input input[type="search"]::-webkit-input-placeholder, #global-ux .search .search-input input[type="search"]:-moz-placeholder, #global-ux .search .search-input input[type="search"]:-ms-input-placeholder, #global-ux .search .search-input input[type="search"]::-moz-placeholder { color: #A8A8A8; } @media only screen and (max-width: 768px) { #global-ux .search .search-input input[type="search"] { padding-right: 10px; } } #global-ux .search .search-input .search-button { -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; position: absolute; top: 0; right: 10px; visibility: hidden; padding: 0; opacity: 0; background: none; color: #2d96cd; display: none; } #global-ux .search .search-input .search-button:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #global-ux .search .search-input .search-button span { display: none; } #global-ux .search .search-input .search-button:hover, #global-ux .search .search-input .search-button:focus { color: #66afe9; } #global-ux .search .search-input input::-webkit-input-placeholder { color: #616161; } #global-ux .search .search-input input::-moz-placeholder { color: #616161; } #global-ux .search .search-input input:-ms-input-placeholder { color: #616161; } #global-ux .search .search-basic .search-input .search-button:after { content: ""; } #global-ux .search .tt-menu { -webkit-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.15); box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.15); width: 100%; padding: 0 40px; background-color: #fff; border: 1px solid #e0e0e0; } #global-ux .search .tt-menu .tt-suggestion { -webkit-transition: background 0.2s ease; -moz-transition: background 0.2s ease; -ms-transition: background 0.2s ease; -o-transition: background 0.2s ease; transition: background 0.2s ease; padding: 20px 25px; border-top: 1px solid #e0e0e0; } #global-ux .search .tt-menu .tt-suggestion a { -webkit-transition: color 0.2s ease; -moz-transition: color 0.2s ease; -ms-transition: color 0.2s ease; -o-transition: color 0.2s ease; transition: color 0.2s ease; font-weight: 200; } #global-ux .search .tt-menu .tt-suggestion a:hover { color: #0078a0; } #global-ux .search .tt-menu .tt-suggestion:first-child { border-top: 0; } #global-ux .search .tt-menu .tt-suggestion.tt-cursor { background-color: #fafafa; } #global-ux .search .tt-menu .tt-suggestion.tt-cursor a { color: #0078a0; } @media only screen and (min-width: 48em) { #global-ux .search .tt-menu { width: auto; } } #global-ux .search .search-main { display: none; padding: 185px 60px 0; } #global-ux .search .search-main .search-col { font-weight: 200; float: left; width: 100%; padding: 30px 0; vertical-align: top; } #global-ux .search .search-main .search-col+.search-col { padding-top: 0; } @media only screen and (min-width: 48em) { #global-ux .search .search-main .search-col+.search-col { padding-top: 30px; padding-left: 45px; border-width: 0; } } #global-ux .search .search-main .search-col h5 { font-weight: 200; margin-bottom: 15px; color: white; font-size: 1.5rem; } #global-ux .search .search-main .search-col p { margin: 0; } #global-ux .search .search-main .search-col a { font-size: 1rem; line-height: 40px; text-decoration: none; } #global-ux .search .search-main .search-col a:hover, #global-ux .search .search-main .search-col a:focus { color: #66afe9; } @media only screen and (min-width: 48em) { #global-ux .search .search-main .search-col { width: auto; padding-right: 45px; border-right: 1px solid rgba(203,203,203,0.45); } } @media only screen and (min-width: 48em) { #global-ux .search .search-main { display: block; padding: 330px 100px 0; } } @media only screen and (max-width: 768px) { #global-ux .search .search-main { display: block; } } #global-ux .search .component-content { overflow-y: auto; height: 100%; } .configuration-page .search { overflow: hidden; background-color: #1F1F1F; } .ie8 #global-ux .search .search-header, .ie8 #global-ux .search .search-main { display: block; max-width: 980px; margin: 0 auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .ie8 #global-ux .search .search-header:after, .ie8 #global-ux .search .search-main:after { content: ""; display: table; clear: both; } .ie8 #global-ux .search .search-header { padding: 75px 100px; } .ie8 #global-ux .search .search-input { padding: 0 84px 0 0; } .ie8 #global-ux .search .search-input input[type="search"] { height: 84px; line-height: 84px; padding: 0 10px; color: #616161; font-size: 48px; text-shadow: none; } .ie8 #global-ux .search .search-header:hover .header-search-teaser p, .ie8 #global-ux .search .search-header.focused .header-search-teaser p { padding: 0; } .ie8 #global-ux .search .search-header:hover .header-search-teaser p:before, .ie8 #global-ux .search .search-header.focused .header-search-teaser p:before { content: ' '; } .ie8 #global-ux .search .search-header:hover .search-input .search-button, .ie8 #global-ux .search .search-header.focused .search-input .search-button { text-shadow: none; background: transparent; color: #2d96cd; opacity: 1; filter: alpha(opacity=100); position: absolute; right: 10px; top: -5px; visibility: visible; font-size: 48px; line-height: 84px; padding: 0; text-align: center; } .ie8 #global-ux .search .search-main { max-width: 960px; padding-left: 0; padding-right: 0; padding-top: 330px; } .ie8 #global-ux .search .search-main .search-col { max-width: 33%; padding: 30px 45px 30px 0; } .ie8 #global-ux .search .search-main .search-col:first-child { border-right: 1px solid #ccc; } .ie8 #global-ux .search .search-main .search-col+.search-col { padding: 30px 45px; } .ie8 #global-ux .search .search-main .search-col .richtext h5 { font-size: 24px; } .ie8 #global-ux .search.footer-search .search-input input[type="search"] { color: #fff; font-size: 24px; line-height: normal; height: auto; margin-bottom: 0; margin-top: 9px; padding: 0 0 0 35px; } .ie8 #global-ux .cusPlaceholder { color: #616161 !important; } #global-ux .footer-search { overflow: visible; padding: 36px 5px 33px; background: #343434; } #global-ux .footer-search .component-content { overflow: visible; } #global-ux .footer-search .search-input { position: relative; display: inline-block; width: 100%; margin-bottom: 20px; color: #fff; } #global-ux .footer-search .search-input:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #global-ux .footer-search .search-input:before { font-size: 22px; font-size: 1.375rem; position: absolute; top: 50%; left: 0; z-index: 1; margin-top: -8px; } @media screen and (-webkit-min-device-pixel-ratio: 0) { #global-ux .footer-search .search-input:before { margin-top: -10px; } } #global-ux .footer-search .search-input .twitter-typeahead { width: 100%; } #global-ux .footer-search .search-input input[type="search"] { font-size: 24px; font-size: 1.5rem; padding: 0 0 0 35px; margin-bottom: 0; background: #343434; border-width: 0; color: #fff; line-height: normal; margin-top: 9px; } @media screen and (-webkit-min-device-pixel-ratio: 0) { #global-ux .footer-search .search-input input[type="search"] { margin-top: 0; } } #global-ux .footer-search .search-input input::-webkit-input-placeholder { color: #fff; } #global-ux .footer-search .search-input input::-moz-placeholder { color: #fff; } #global-ux .footer-search .search-input input:-ms-input-placeholder { color: #fff; } #global-ux .footer-search .search-input label { display: none; } @media only screen and (min-width: 48em) { #global-ux .footer-search .search-input { margin-bottom: 0; } } #global-ux .footer-search .footer-search-terms { margin-top: 8px; } @media screen and (-webkit-min-device-pixel-ratio: 0) { #global-ux .footer-search .footer-search-terms { margin-top: 5px; } } #global-ux .footer-search .footer-search-terms h5 { font-weight: 700; font-size: 14px; font-size: .875rem; display: inline-block; margin-right: 16px; color: #fff; } @media only screen and (min-width: 48em) { #global-ux .footer-search .footer-search-terms h5 { margin-right: 0; } } #global-ux .footer-search .footer-search-terms ul, #global-ux .footer-search .footer-search-terms li { list-style: none; } #global-ux .footer-search .footer-search-terms ul { display: inline; margin: 0; } #global-ux .footer-search .footer-search-terms li { display: inline-block; margin-right: 16px; } #global-ux .footer-search .footer-search-terms li a { -webkit-transition: color 0.2s ease; -moz-transition: color 0.2s ease; -ms-transition: color 0.2s ease; -o-transition: color 0.2s ease; transition: color 0.2s ease; font-size: 14px; font-size: .875rem; color: #A8A8A8; } #global-ux .footer-search .footer-search-terms li a:hover, #global-ux .footer-search .footer-search-terms li a:focus { color: #fff; } #global-ux .footer-search .footer-search-terms li:nth-child(n+4) { display: none; } #global-ux .footer-search .footer-search-terms li:last-child { margin-right: 0; } @media only screen and (min-width: 48em) { #global-ux .footer-search .footer-search-terms li { margin-left: 16px; margin-right: 0; } #global-ux .footer-search .footer-search-terms li:nth-child(n+4) { display: inline-block; } } #global-ux .footer-search .tt-menu { background-color: #343434; border-color: #252525; } #global-ux .footer-search .tt-menu .tt-suggestion { line-height: normal; border-color: #252525; } #global-ux .footer-search .tt-menu .tt-suggestion a { font-size: 14px; font-size: .875rem; } #global-ux .footer-search .tt-menu .tt-suggestion a:hover { color: #fff; } #global-ux .footer-search .tt-menu .tt-suggestion .tt-highlight { color: #fff; } #global-ux .footer-search .tt-menu .tt-suggestion.tt-cursor { background-color: #252525; } #global-ux .footer-search .tt-menu .tt-suggestion.tt-cursor a { color: #fff; } @media only screen and (min-width: 48em) { #global-ux .footer-search { padding-left: 25px; padding-right: 25px; } #global-ux .footer-search .richtext { margin-bottom: -6px; } } @media only screen and (max-width: 767px) { #global-ux .footer-search .search-input { margin-bottom: 0; } #global-ux .footer-search .search-input input[type="search"] { margin-top: 0; } #global-ux .footer-search .footer-search-terms { margin-top: 0; } #global-ux .footer-search .richtext { margin-top: 15px; margin-bottom: -4px; } } .ie8 #global-ux .footer-search { padding-left: 25px; padding-right: 25px; } #global-ux .search-results { position: relative; padding: 55px 25px 10px 25px; padding: 3.4375rem 1.5625rem .625rem 1.5625rem; max-width: 890px; max-width: 55.625rem; } @media only screen and (max-width: 47.9375em) { #global-ux .search-results { padding: 40px 25px 10px; padding: 2.5rem 1.5625rem .625rem; } } #global-ux .search-results .keyword { font-weight: 700; } #global-ux .search-results.search-result-sa { padding: 3.4375rem 0 0 0; max-width: none; } #global-ux .search-results.search-result-sa .search-results-header { background-color: #fafafa; padding: 30px 1.5625rem 10px 1.5625rem; border-top: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb; } #global-ux .search-results.search-result-sa .search-results-header .with-results, #global-ux .search-results.search-result-sa .search-results-header .no-results { font-size: 28px; font-size: 1.75rem; margin: 0; line-height: 27px; } #global-ux .search-results.search-result-sa .search-results-header .keyword { font-weight: 700; } #global-ux .search-results.search-result-sa .search-results-header a { font-weight: 700; display: inline-block; padding: 15px 0; font-size: 16px; font-size: 1rem; line-height: 28px; } @media only screen and (max-width: 768px) { #global-ux .search-results.search-result-sa .search-results-header a { font-size: 19px; font-size: 1.1875rem; line-height: 28px; } } #global-ux .search-results.search-result-sa .search-results-header a:after { content: "\e618"; font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; margin-left: 10px; font-size: 30px; font-size: 1.875rem; } #global-ux .search-results.search-result-sa .search-results-header a:hover:after { content: "\e619"; } #global-ux .search-results.search-result-sa .search-results-list .search-results-item { padding: 25px 20% 30px 1.5625rem; border-bottom: 1px solid #dbdbdb; margin-bottom: 0; } #global-ux .search-results.search-result-sa .search-results-list .search-results-item .item-name a { font-weight: 700; font-size: 25px; font-size: 1.5625rem; line-height: 35px; } #global-ux .search-results.search-result-sa .search-results-list .search-results-item .item-url a { font-weight: 700; font-size: 16px; font-size: 1rem; line-height: 22px; } @media only screen and (max-width: 768px) { #global-ux .search-results.search-result-sa .search-results-list .search-results-item .item-url a { font-size: 15px; font-size: .9375rem; } } #global-ux .search-results.search-result-sa .search-results-list .search-results-item .item-description p { line-height: 20px; } #global-ux .search-results.search-result-sa .search-results-pagination { padding: 35px 1.5625rem 35px 1.5625rem; background-color: #fafafa; text-align: center; } #global-ux .search-results.search-result-sa .search-results-pagination .pagination-btn { vertical-align: middle; } #global-ux .search-results.search-result-sa .search-results-pagination .pagination-btn .icon { font-size: 28px; font-size: 1.75rem; } #global-ux .search-results-header h2 { font-size: 36px; font-size: 2.25rem; line-height: 47px; line-height: 2.9375rem; font-weight: 200; margin: 0 0 45px; margin: 0 0 2.8125rem; } @media only screen and (max-width: 47.9375em) { #global-ux .search-results-header h2 { font-size: 24px; font-size: 1.5rem; line-height: 26px; line-height: 1.625rem; margin: 0 0 30px; margin: 0 0 1.875rem; } } #global-ux .search-results-header h3 { font-size: 24px; font-size: 1.5rem; line-height: 26px; line-height: 1.625rem; font-weight: 300; margin: 0 0 21px; margin: 0 0 1.3125rem; padding: 0 4px; padding: 0 .25rem; letter-spacing: 2px; letter-spacing: .125rem; color: #616161; } @media only screen and (max-width: 47.9375em) { #global-ux .search-results-header h3 { font-size: 16px; font-size: 1rem; line-height: 18px; line-height: 1.125rem; padding: 0; } } #global-ux .search-results-header .search-form { margin: 0 0 68px; margin: 0 0 4.25rem; } @media only screen and (max-width: 47.9375em) { #global-ux .search-results-header .search-form { margin: 0 0 40px; margin: 0 0 2.5rem; } } #global-ux .search-results-header .search-form .title { font-size: 24px; font-size: 1.5rem; line-height: 26px; line-height: 1.625rem; font-weight: 300; margin: 0 0 21px; margin: 0 0 1.3125rem; padding: 0 4px; padding: 0 .25rem; letter-spacing: 2px; letter-spacing: .125rem; color: #616161; } @media only screen and (max-width: 47.9375em) { #global-ux .search-results-header .search-form .title { font-size: 16px; font-size: 1rem; line-height: 18px; line-height: 1.125rem; padding: 0; } } #global-ux .search-results-header .search-form .form-textfield { position: relative; max-width: 560px; max-width: 35rem; } #global-ux .search-results-header .search-form .search { height: 3.125rem; -moz-border-radius: 2; -webkit-border-radius: 2; border-radius: 2; padding: 10px 48px 10px 18px; padding: .625rem 3rem .625rem 1.125rem; font-size: 16px; font-size: 1rem; } @media only screen and (max-width: 47.9375em) { #global-ux .search-results-header .search-form .search { font-size: 14px; font-size: .875rem; padding: 10px 37px 10px 10px; padding: .625rem 2.3125rem .625rem .625rem; height: 40px; height: 2.5rem; } } #global-ux .search-results-header .search-form .search-btn { position: absolute; top: 0; right: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; color: #2794cd; background: none; padding: 14px 16px 13px; padding: .875rem 1rem .8125rem; margin: 0; } @media only screen and (max-width: 47.9375em) { #global-ux .search-results-header .search-form .search-btn { padding: 12px 12px 9px; padding: .75rem .75rem .5625rem; } } #global-ux .search-results-header .search-form .search-btn:hover { opacity: .8; filter: alpha(opacity=80); } #global-ux .search-results-header .search-form .search-btn .icon-search { font-size: 17px; font-size: 1.0625rem; } #global-ux .search-results-list .search-results-item { margin: 0 0 58px; margin: 0 0 3.625rem; } @media only screen and (max-width: 47.9375em) { #global-ux .search-results-list .search-results-item { margin: 0 0 35px; margin: 0 0 2.1875rem; } } #global-ux .search-results-list .search-results-item .item-name h3 { font-size: 14px; font-size: .875rem; line-height: 16px; line-height: 1rem; margin: 0 0 10px; margin: 0 0 .625rem; } #global-ux .search-results-list .search-results-item .item-url { font-size: 14px; font-size: .875rem; line-height: 16px; line-height: 1rem; font-weight: 400; margin: 0 0 10px; margin: 0 0 .625rem; } #global-ux .search-results-list .search-results-item a { font-weight: 400; word-wrap: break-word; } #global-ux .search-results-list .search-results-item p { margin: 0; color: #616161; font-size: 14px; font-size: .875rem; line-height: 28px; line-height: 1.75rem; } @media only screen and (max-width: 47.9375em) { #global-ux .search-results-list .search-results-item p { line-height: 18px; line-height: 1.125rem; } } #global-ux .search-results-pagination { width: 100%; padding: 0 0 30px; padding: 0 0 1.875rem; } #global-ux .search-results-pagination .content { display: block; } #global-ux .search-results-pagination .content:after { content: ""; display: table; clear: both; } #global-ux .search-results-pagination .pagination-btn { display: inline-block; color: #2596cf; vertical-align: text-bottom; } #global-ux .search-results-pagination .pagination-btn .icon { font-size: 20px; font-size: 1.25rem; } #global-ux .search-results-pagination .pagination-previous.inactive a, #global-ux .search-results-pagination .pagination-next.inactive a { pointer-events: none; cursor: default; color: #dadada; } #global-ux .search-results-pagination .pagination-previous { margin-right: 10px; margin-right: .625rem; } #global-ux .search-results-pagination .pagination-next { margin-left: 10px; margin-left: .625rem; } #global-ux .search-results-pagination .pagination-numbers { font-size: 16px; font-size: 1rem; display: inline-block; color: #2596cf; } #global-ux .search-results-pagination .pagination-numbers .page-number { margin-left: 2px; margin-right: 2px; color: #dadada; } #global-ux .search-results-pagination .pagination-numbers .page-current { font-weight: 700; color: #008CBA; } #global-ux .search-results-pagination:hover { right: 0; } #global-ux .search-basic { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 100%; padding: 15px 20px; } #global-ux .search-basic .search-input { position: relative; } @media only screen and (min-width: 48em) { #global-ux .search-basic { padding: 0; width: 50%; } } #global-ux .search-basic input[type=search] { border-radius: 2px; box-shadow: none; padding: 0 15px; margin: 0; } #global-ux .search-basic input[type=search]:-ms-input-placeholder { line-height: 1; color: #999; } #global-ux .search-basic input[type=search]::-ms-clear { display: none; } #global-ux .search-basic .search-button { font-size: 20px; font-size: 1.25rem; background-color: transparent; color: #2d96cd; padding: 0; margin: 0; position: absolute; right: 10px; top: 5px; } #global-ux .search-basic .search-button:after { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } @media only screen and (min-width: 48em) { #global-ux .search-basic .search-button { font-size: 16px; font-size: 1rem; top: 9px; } } #global-ux .search-basic .search-button span { display: none; } .rtl #global-ux .search-results-header h2 { font-size: 48px; font-size: 3rem; } .rtl #global-ux .search-results-header .link-overlay-search { font-size: 24px; font-size: 1.5rem; } .rtl #global-ux .search-results-header .link-overlay-search:after { display: inline-block; padding-left: 10px; transform: rotateY(-180deg); } .rtl #global-ux .search-results-item { padding-right: 30px; padding-left: 20%; } .rtl #global-ux .search-results-item .item-name h3 { font-size: 32px; font-size: 2rem; } .rtl #global-ux .search-results-item p { font-size: 24px; font-size: 1.5rem; } .rtl #global-ux .search-results-pagination .pagination-btn .icon { display: inline-block; transform: rotateY(-180deg); } #global-ux .icon-x, #global-ux .icon-download { background-image: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/icons.svg"); background-repeat: no-repeat; } #global-ux .icon-x:before, #global-ux .icon-download:before { display: none; } #global-ux .icon-x { background-position: -71px -206px; } #global-ux .icon-download { background-position: -257px -578px; width: 24px; height: 26px; -webkit-transform: scale(1.1, 1.1); -ms-transform: scale(1.1, 1.1); -moz-transform: scale(1.1, 1.1); -o-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1); } #global-ux .overlay-container { -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate(0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-overflow-scrolling: touch; position: fixed; display: block; width: 100%; height: 100%; top: 0; left: 0; opacity: 0; z-index: 10000; overflow-x: hidden; overflow-y: auto; background: rgba(0,0,0,0.8); } #global-ux .overlay-container.visible { opacity: 1; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; } #global-ux .overlay-container.visible .overlay-content { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 1; visibility: visible; overflow-x: hidden; overflow-y: auto; min-height: inherit; } #global-ux .overlay-container.visible .overlay-content .common-box .box-content { position: relative; } #global-ux .overlay-container.visible .overlay-content .common-box .box-content .splitter-box .mediaCarouselItem .mediaCarouselItem-content h4 { padding: 1.25rem 1.875rem; border-bottom: none; padding: 0px; margin: 0px; } #global-ux .overlay-container.overlay-hide { display: none; } #global-ux .overlay-container .overlay-content { -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; position: relative; margin: 0 auto; width: 100%; min-height: 100%; background: #fff; opacity: 0; } #global-ux .overlay-container .overlay-content:focus { outline: none; } #global-ux .overlay-container .overlay-content .overlay-msg-content-inner, #global-ux .overlay-container .overlay-content .overlay-content-inner { display: none !important; } #global-ux .overlay-container .overlay-content .overlay-msg-content-inner>.sameHeightSplitter, #global-ux .overlay-container .overlay-content .overlay-content-inner>.sameHeightSplitter { background: #fff; padding: 30px 60px; padding: 1.875rem 3.75rem; } @media only screen and (max-width: 47.9375em) { #global-ux .overlay-container .overlay-content .overlay-msg-content-inner>.sameHeightSplitter, #global-ux .overlay-container .overlay-content .overlay-content-inner>.sameHeightSplitter { padding: 30px 40px; padding: 1.875rem 2.5rem; } } #global-ux .overlay-container .overlay-content .overlay-msg-content-inner.is-active, #global-ux .overlay-container .overlay-content .overlay-content-inner.is-active { display: block !important; } body.fullscreen-active #global-ux .overlay-container .overlay-content { opacity: 0; visibility: hidden; } @media only screen and (min-width: 48em) { #global-ux .overlay-container .overlay-content { width: 90%; max-width: 1130px; min-height: 0; margin-top: 3rem; margin-bottom: 3rem; } } #global-ux .overlay-container .overlay-content h4:first-of-type { font-size: 21px; font-size: 1.3125rem; margin: 0 0 30px 0; padding: 30px 100px 30px 30px; border-bottom: 1px solid #dbdbdb; } @media only screen and (max-device-width: 481px) { #global-ux .overlay-container .overlay-content h4:first-of-type { padding: 30px 30px 30px 30px; } } #global-ux .overlay-container .overlay-content .row.splitter, #global-ux .overlay-container .overlay-content .splitter.genericCarousel, #global-ux .overlay-container .overlay-content .splitter.dynamicCarousel, #global-ux .overlay-container .overlay-content .splitter.billboardCarousel, #global-ux .overlay-container .overlay-content .splitter.mediaCarousel, #global-ux .overlay-container .overlay-content .splitter.accessoriesTile, #global-ux .overlay-container .overlay-content .mediaCarousel .splitter.media-carousel, #global-ux .mediaCarousel .overlay-container .overlay-content .splitter.media-carousel, #global-ux .overlay-container .overlay-content .splitter.threesixtyColouriser { padding: 0 20px; } #global-ux .overlay-container .overlay-content .row.splitter .splitter-column, #global-ux .overlay-container .overlay-content .splitter.genericCarousel .splitter-column, #global-ux .overlay-container .overlay-content .splitter.dynamicCarousel .splitter-column, #global-ux .overlay-container .overlay-content .splitter.billboardCarousel .splitter-column, #global-ux .overlay-container .overlay-content .splitter.mediaCarousel .splitter-column, #global-ux .overlay-container .overlay-content .splitter.accessoriesTile .splitter-column, #global-ux .overlay-container .overlay-content .mediaCarousel .splitter.media-carousel .splitter-column, #global-ux .mediaCarousel .overlay-container .overlay-content .splitter.media-carousel .splitter-column, #global-ux .overlay-container .overlay-content .splitter.threesixtyColouriser .splitter-column { padding: 15px; } #global-ux .overlay-container .overlay-content .secondaryNavigation { display: none !important; visibility: hidden !important; } #global-ux .overlay-container .overlay-content .header-search-teaser p:before { display: none !important; } #global-ux .overlay-container .overlay-close { position: absolute; display: block; top: 0; right: 0; width: 65px; height: 65px; cursor: pointer; z-index: 2; overflow: hidden; } #global-ux .overlay-container .overlay-close .icon-plus { font-size: 37px; font-size: 2.3125rem; display: block; height: 65px; width: 65px; line-height: 65px; font-weight: 200; text-align: center; vertical-align: middle; color: #2d96cd; margin: 0; margin-left: 17px; } @media only screen and (min-width: 48em) { #global-ux .overlay-container .overlay-close .icon-plus, #global-ux .overlay-container .overlay-close .icon-plus.icon-x { height: 64px; line-height: 64px; margin: 0; background-image: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/search_icon.png"); background-position: 50% 50%; background-size: auto auto; } } #global-ux .overlay-container .carousel-arrows { right: 0; position: absolute; top: 48px; } @media only screen and (min-width: 48em) { #global-ux .overlay-container .carousel-arrows { -webkit-transition: right 0.2s ease; -moz-transition: right 0.2s ease; -ms-transition: right 0.2s ease; -o-transition: right 0.2s ease; transition: right 0.2s ease; top: -100px; right: 0px !important; margin-top: -15px; z-index: 1; } #global-ux .overlay-container .carousel-arrows .icon { line-height: 47px; } } #global-ux .overlay-container .carousel-arrows .carousel-btn { -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); display: block; height: 47px; width: 47px; border-radius: 0; border: none; background-color: #2d96cd; cursor: pointer; } #global-ux .overlay-container .carousel-arrows .carousel-btn.darkened { background-color: rgba(0,0,0,0.5); } #global-ux .overlay-container .carousel-arrows .carousel-btn:hover { background-color: #fff; } #global-ux .overlay-container .carousel-arrows .carousel-btn:hover .icon { color: #2d96cd; } #global-ux .overlay-container .carousel-arrows .carousel-btn .icon { color: #fff; display: block; text-align: center; } #global-ux .overlay-container .carousel-arrows .carousel-btn+ul { display: inline-block; vertical-align: middle; } @media screen and (max-width: 480px) { #global-ux .overlay-container .carousel-arrows .carousel-btn .icon { line-height: 47px !important; } } @media only screen and (max-width: 47.9375em) { #global-ux .overlay-container .box-image-overlay .image .carousel-arrows { top: 50% !important; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); position: absolute; } } #global-ux .overlay-container.has-form .overlay-close { top: 13px; right: 8px; } #global-ux .overlay-container.has-form .overlay-close .icon-plus { font-size: 40px; font-size: 2.5rem; } @media only screen and (min-width: 48em) { #global-ux .overlay-container.has-form .overlay-close .icon-plus, #global-ux .overlay-container.has-form .overlay-close .icon-plus.icon-x { background-image: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/icons.svg"); background-repeat: no-repeat; } #global-ux .overlay-container.has-form .overlay-close .icon-plus:before, #global-ux .overlay-container.has-form .overlay-close .gux-tooltip-overlay .close-icon:before, #global-ux .gux-tooltip-overlay .overlay-container.has-form .overlay-close .close-icon:before, #global-ux .overlay-container.has-form .overlay-close .showroom .model-item-overlay .model-item-close:before, #global-ux .showroom .model-item-overlay .overlay-container.has-form .overlay-close .model-item-close:before, #global-ux .overlay-container.has-form .overlay-close .icon-plus.icon-x:before, #global-ux .overlay-container.has-form .overlay-close .gux-tooltip-overlay .icon-x.close-icon:before, #global-ux .gux-tooltip-overlay .overlay-container.has-form .overlay-close .icon-x.close-icon:before, #global-ux .overlay-container.has-form .overlay-close .showroom .model-item-overlay .icon-x.model-item-close:before, #global-ux .showroom .model-item-overlay .overlay-container.has-form .overlay-close .icon-x.model-item-close:before { display: none; } } @media only screen and (min-width: 48em) { #global-ux .overlay-container.has-form .overlay-close { top: 40px; right: 20px; } #global-ux .overlay-container.has-form .overlay-close.desktop-align-title { top: 30px; } } #global-ux .overlay-navigation { border: 1px solid #cecece; } #global-ux .overlay-navigation:after { content: ""; display: table; clear: both; } #global-ux .overlay-navigation.hide { display: none; } #global-ux .overlay-navigation .button-previous, #global-ux .overlay-navigation .button-next { font-size: 13px; font-size: .8125rem; font-weight: 200; display: block; line-height: 2.3846153846; width: 50%; } #global-ux .overlay-navigation .button-previous span, #global-ux .overlay-navigation .button-next span { font-size: 28px; font-size: 1.75rem; line-height: 1; } #global-ux .overlay-navigation .button-previous { border-right: 1px solid #cecece; float: left; padding: 13px 17.0666666667% 9px 3.7333333333%; text-align: right; } #global-ux .overlay-navigation .button-previous span { float: left; } #global-ux .overlay-navigation .button-next { float: right; padding: 13px 3.7333333333% 9px 17.8666666667%; text-align: left; } #global-ux .overlay-navigation .button-next span { float: right; } @media only screen and (min-width: 48em) { #global-ux .overlay-navigation .button-previous, #global-ux .overlay-navigation .button-next { font-size: 26px; font-size: 1.625rem; line-height: 1.9615384615; } #global-ux .overlay-navigation .button-previous span, #global-ux .overlay-navigation .button-next span { font-size: 51px; font-size: 3.1875rem; } #global-ux .overlay-navigation .button-previous { padding: 19px 17.7449168207% 13px 4.1589648799%; } #global-ux .overlay-navigation .button-next { padding: 19px 4.1589648799% 13px 17.7449168207%; } } #global-ux .overlay-container.overlay-image .overlay-content { width: 100%; min-height: inherit; } @media only screen and (min-width: 48em) { #global-ux .overlay-container.overlay-image .overlay-content { padding-bottom: 0; max-width: 1130px; } .csstransforms #global-ux .overlay-container.overlay-image .overlay-content { -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; top: 0; } } @media only screen and (min-width: 30.0625em) { #global-ux .overlay-container.overlay-image .overlay-content { overflow: hidden !important; position: relative; max-width: 1130px; } } #global-ux .overlay-container.overlay-image .overlay-close { background: transparent; top: 0; right: 0; } #global-ux .overlay-container.overlay-image .overlay-close .icon-plus { color: #fff; } #global-ux .share-overlay { height: 100%; left: 0; position: fixed; width: 100%; z-index: 10001; top: 0; } #global-ux .share-overlay .share-overlay-bg { background: #000; background: rgba(0,0,0,0.55); left: 0; height: 100%; position: fixed; top: 0; width: 100vw; z-index: 10001; } #global-ux .share-overlay .social-links { display: flex; list-style: none; margin: 0; width: 300px; } #global-ux .share-overlay .social-links li { animation: none; float: left; padding: 0; width: 25%; } #global-ux .share-overlay .social-links a { font-size: 32px; font-size: 2rem; width: 100%; display: block; float: left; text-align: center; height: 64px; position: relative; color: #fff; text-decoration: none; } #global-ux .share-overlay .social-links a:before { -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); position: absolute; top: 50%; left: 50%; z-index: 1001; } #global-ux .share-overlay .social-links a.icon-share-facebook { background-color: #5071AA; font-size: 0; } #global-ux .share-overlay .social-links a.icon-share-facebook:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 1.75rem; font-size: 35px; } #global-ux .share-overlay .social-links a.icon-share-twitter { background-color: #68C6E1; font-size: 0; } #global-ux .share-overlay .social-links a.icon-share-twitter:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 1.75rem; font-size: 35px; } #global-ux .share-overlay .social-links a.icon-share-googleplus { background-color: #F35E47; font-size: 0; } #global-ux .share-overlay .social-links a.icon-share-googleplus:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 1.75rem; font-size: 35px; } #global-ux .share-overlay .social-links a.icon-share-email { background-color: #6F6f6F; font-size: 0; } #global-ux .share-overlay .social-links a.icon-share-email:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 1.75rem; font-size: 35px; } #global-ux .share-overlay .social-links a.icon-share-pinterest { background-color: #bd081C; font-size: 0; } #global-ux .share-overlay .social-links a.icon-share-pinterest:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 1.75rem; font-size: 35px; } #global-ux .share-overlay .social-links a.icon-share-instagram { background-color: #517FA4; font-size: 0; } #global-ux .share-overlay .social-links a.icon-share-instagram:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 1.75rem; font-size: 35px; } #global-ux .share-overlay .social-links a.icon-share-weibo { background: #fff url("/etc/designs/guxfoap/clientlibs/guxfoap/img/weibo.png") no-repeat 50% 50%; background-size: 40px auto; } #global-ux .share-overlay .social-links a.icon-share-qzone { background: #fff url("/etc/designs/guxfoap/clientlibs/guxfoap/img/qzone.png") no-repeat 50% 50%; background-size: 40px auto; } #global-ux .share-overlay .social-links a.icon-share-kaixin { background: #d7083b url("/etc/designs/guxfoap/clientlibs/guxfoap/img/kaixin.png") no-repeat 50% 50%; background-size: 40px auto; } #global-ux .share-overlay .share-wrapper { -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); position: fixed; left: 50%; top: 10%; width: 300px; z-index: 10002; } #global-ux .share-overlay .share-wrapper fieldset { background: #f7f7f7; border: 0; margin: 0; padding: 25px 15px; } @media only screen and (min-width: 48em) { #global-ux .share-overlay .share-wrapper { -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); top: 50%; left: 75%; } } #global-ux .share-overlay .share-wrapper .share-content { box-shadow: 0 1px 3px rgba(0,0,0,0.2); } #global-ux .share-overlay .share-data input { font-weight: 300; font-size: 14px; font-size: .875rem; color: #2d96cd; display: block; margin: 5px 0 10px; overflow: hidden; padding: 10px; text-overflow: ellipsis; width: 100%; line-height: 1.5; } #global-ux .share-overlay .share-data label { color: #616161; display: block; text-align: left; } .ie8 #global-ux .share-overlay .social-links a.icon-share-weibo { background-image: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/weibo-ie8.png"); } .ie8 #global-ux .share-overlay .social-links a.icon-share-qzone { background-image: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/qzone-ie8.png"); } .ie8 #global-ux .share-overlay .social-links a.icon-share-kaixin { background-image: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/kaixin-ie8.png"); } #global-ux .overlay-container.overlay-search-sa .overlay-content { height: auto; } #global-ux .overlay-container.overlay-search { overflow: hidden; bottom: 0; background: rgba(31,31,31,0.9); } #global-ux .overlay-container.overlay-search.overlay-search-sa { height: auto; } #global-ux .overlay-container.overlay-search.overlay-search-sa .overlay-content { height: auto; } #global-ux .overlay-container.overlay-search .overlay-content { height: 100%; margin-bottom: 0; } #global-ux .overlay-container.overlay-search .overlay-content-inner { height: 100%; } #global-ux .overlay-container.overlay-search .overlay-close { top: 18px; right: 18px; z-index: 1; background: transparent; } #global-ux .overlay-container.overlay-search .overlay-close .icon-plus { color: #A8A8A8; } .ie8 #global-ux .icon-x, .ie9 #global-ux .icon-x { background: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/colorizer/icons.png") no-repeat -71px -204px; -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1.35, M12=0, M21=0, M22=1.35, SizingMethod='auto expand')"; filter: progid:DXImageTransform.Microsoft.Matrix( M11=1.35, M12=0, M21=0, M22=1.35, SizingMethod='auto expand'); margin-left: -14px; margin-top: -14px; } .ie8 #global-ux .icon-download, .ie9 #global-ux .icon-download { background: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/colorizer/icons.png") no-repeat -260px -578px; } .ie8 #global-ux .overlay-container, .ie9 #global-ux .overlay-container { background: #323232; } .ie8 #global-ux .overlay-container .overlay-content, .ie9 #global-ux .overlay-container .overlay-content { position: relative; margin-top: 48px; margin-bottom: 48px; margin-left: auto; margin-right: auto; width: 90%; max-width: 1130px; min-height: 0; } .ie8 #global-ux .overlay-container .overlay-content.visible, .ie9 #global-ux .overlay-container .overlay-content.visible { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=100)"; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100); } .ie8 #global-ux .overlay-container .overlay-content.visible .overlay-content, .ie9 #global-ux .overlay-container .overlay-content.visible .overlay-content { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=100)"; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100); } body.fullscreen-active .ie8 #global-ux .overlay-container .overlay-content, body.fullscreen-active .ie9 #global-ux .overlay-container .overlay-content { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=0)"; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0); } .csstransforms .ie8 #global-ux .overlay-container .overlay-content, .csstransforms .ie9 #global-ux .overlay-container .overlay-content { top: 50%; } .ie8 #global-ux .overlay-container .overlay-close .icon-plus, .ie8 #global-ux .overlay-container .overlay-close .icon-plus.icon-x, .ie9 #global-ux .overlay-container .overlay-close .icon-plus, .ie9 #global-ux .overlay-container .overlay-close .icon-plus.icon-x { margin: 0; height: 40px; line-height: 64px; background-image: url(/etc/designs/guxfoap/clientlibs/guxfoap/img/search_icon.png); background-position: 50% 50%; -ms-filter: none; filter: none; } .ie8 #global-ux .overlay-container.has-form, .ie9 #global-ux .overlay-container.has-form { top: 0px; right: 20px; } .ie8 #global-ux .overlay-container.has-form.desktop-align-title, .ie9 #global-ux .overlay-container.has-form.desktop-align-title { top: 30px; } .ie8 #global-ux .overlay-container.has-form .overlay-close, .ie9 #global-ux .overlay-container.has-form .overlay-close { top: 40px; right: 20px; height: 40px; width: 40px; } .ie8 #global-ux .overlay-container.has-form .form-group-input .fieldsGroup .section label.error small.error, .ie9 #global-ux .overlay-container.has-form .form-group-input .fieldsGroup .section label.error small.error { color: #f34c32; background: #fff; font-size: 11px; font-style: normal; line-height: 16.5px; padding-top: 6px; } .ie8 #IPEinvL, .ie9 #IPEinvL { width: 843px; height: 592px; } .ie8 #global-ux .overlay-container.overlay-image .overlay-content { width: 100%; max-width: 1130px; } .csstransforms .ie8 #global-ux .overlay-container.overlay-image .overlay-content { top: 0; } .ie8 #global-ux .overlay-container.overlay-image .overlay-close { background: transparent; top: 0; right: 0; } .ie8 #global-ux .overlay-container.overlay-image .overlay-close .icon-plus { color: #fff; } .ie8 #global-ux .share-overlay .share-overlay-bg { filter: progid:DXImageTransform.Microsoft.Alpha(opacity=55); background: #000000; height: 100%; width: 100%; } .ie8 #global-ux .share-overlay .share-wrapper { top: 50%; left: 75%; } .rtl #global-ux .overlay-container .overlay-close { direction: rtl; right: inherit !important; left: 0; } .rtl #global-ux .overlay-container .overlay-close .icon-plus { margin-left: 0; } .rtl #global-ux .overlay-container.gallery-trigger-carousel { direction: ltr; } .rtl #global-ux .overlay-container.gallery-trigger-carousel .slide { direction: rtl; } .rtl #global-ux .share-overlay .share-data label { text-align: right; } .tabs { position: relative; width: 100%; overflow: hidden; } .no-js .tabs-nav { display: none; } .no-js .tabs-content { display: block !important; visibility: visible !important; } .no-js .tabs>.component-content { padding-top: 0; } .tabs>.component-content { padding-top: 39px; } .tabs-nav { height: 39px; left: 0; overflow: hidden; position: absolute; top: 0; width: 100%; z-index: 1; } .tabs-nav .tabs-nav-list { left: 0; list-style: none; margin: 0; overflow: hidden; padding: 0; position: relative; width: 100%; } .tabs-nav-item { font-weight: 700; font-size: 12px; font-size: .75rem; background: #fff; border: 2px 2px 0 2px solid #2d96cd; cursor: pointer; display: inline; float: left; height: 30px; margin-left: 5px; padding: 7px 10px; top: 4px; } .tabs-nav-item a { color: #2d96cd; } .tabs-nav-item:hover { background: #2d96cd; } .tabs-nav-item:hover a { color: #fff; text-decoration: none; } .tabs-nav-item:first-child { margin-left: 0; } .tabs-nav-item.is-active, .tabs-nav-item.is-active:hover { cursor: default; color: #1b394e; background-color: #fff; border-color: #1b394e; border-bottom: none; padding-bottom: 9px; } .tabs-nav-item.is-active a, .tabs-nav-item.is-active:hover a { cursor: default; color: #1b394e; } .tabs-container { overflow: hidden; width: 100%; } .tabs-container .tabs-content { position: relative; z-index: 8; top: -2px; min-height: 50px; background: rgba(151,151,151,0.4); float: left; } .tabs>.tabs-vertical { padding: 0 0 0 20%; } .tabs-vertical .tabs-nav { height: auto; width: 20%; } .tabs-vertical .component-content { padding-top: 0; } .tabs-vertical .tabs-nav-list { width: 100%; } .tabs-vertical .tabs-nav-item { border-width: 2px; height: auto; margin: 0 0 5px; width: auto; clear: both; } .tabs-vertical .tabs-nav-item .is-active, .tabs-vertical .tabs-nav-item .is-active:hover { border-bottom: 2px solid; border-right: medium; padding: 7px 12px 7px 10px; } .tabs-vertical .tabs-container .tabs-content { left: -2px; top: 0; } .cq-wcm-edit .tabs-container .tabs-content:not(.active) { left: -9999px; } #global-ux .tabPanel .tabs-nav { position: relative; text-align: center; min-height: 45px; height: auto; } #global-ux .tabPanel .tabs-nav .tabs-nav-list { width: 100%; white-space: nowrap; overflow-x: auto; display: block; } #global-ux .tabPanel .tabs-nav .tabs-nav-list li.tabs-nav-item { margin-left: 20px; margin-right: 20px; height: auto; padding: 0 10px; display: inline-block; float: none; vertical-align: baseline; } #global-ux .tabPanel .tabs-nav .tabs-nav-list li.tabs-nav-item.is-active { border-bottom: 5px solid #1b394e; } #global-ux .tabPanel .tabs-nav .tabs-nav-list li.tabs-nav-item.is-active a { color: #1b394e; font-weight: 700; } #global-ux .tabPanel .tabs-nav .tabs-nav-list li.tabs-nav-item.is-active a p { color: #1b394e; font-weight: 700; } #global-ux .tabPanel .tabs-nav .tabs-nav-list li.tabs-nav-item.is-active:hover { background-color: #2d96cd !important; } #global-ux .tabPanel .tabs-nav .tabs-nav-list li.tabs-nav-item:hover { background-color: #f7f7f7 !important; } #global-ux .tabPanel .tabs-nav .tabs-nav-list li.tabs-nav-item:hover a { color: #1b394e; font-weight: 700; } #global-ux .tabPanel .tabs-nav .tabs-nav-list li.tabs-nav-item a { font-size: 1.125rem; text-decoration: none !important; font-weight: 700; } #global-ux .tabPanel .tabs-nav .tabs-nav-list li.tabs-nav-item a p { color: #2d96cd; font-weight: 700; } #global-ux .tabPanel .tabs-container { margin-top: 2px; } #global-ux .tabPanel .tabs-container .tabs-content { margin-bottom: 0; } #global-ux .tabPanel .mob-accordion-tab { display: none; height: 80px; padding: 30px 60px 30px 20px; background-color: #f7f7f7; } @media screen and (max-width: 767px) { #global-ux .tabPanel .tabs-nav { display: none; } #global-ux .tabPanel .mobile-scrolling-tabs { display: block; } #global-ux .tabPanel .mobile-scrolling-tabs .tabs-nav { display: block; } #global-ux .tabPanel .accordion-on-mobile .mob-accordion-tab { display: block; border-bottom: solid 1px rgba(206,206,206,0.5); clear: both; position: relative; font-size: 16px; font-weight: 300; } #global-ux .tabPanel .accordion-on-mobile .mob-accordion-tab:first-child { border-top: solid 1px rgba(206,206,206,0.5); } #global-ux .tabPanel .accordion-on-mobile .mob-accordion-tab:last-child { border-bottom: none; } #global-ux .tabPanel .accordion-on-mobile .mob-accordion-tab .accordion-indicator { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); display: inline-block; float: right; position: absolute; right: 20px; top: 50%; margin-top: -14px; transition: all .3s ease; } #global-ux .tabPanel .accordion-on-mobile .mob-accordion-tab .accordion-indicator.active { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); } #global-ux .tabPanel .accordion-on-mobile .tabs-content.active { top: 0; display: inline-block; } #global-ux .tabPanel .carousel-on-mobile .flex-direction-nav { display: none; } } .myProfileTabOwner .tabs-nav { position: relative; text-align: center; height: 45px; } .myProfileTabOwner .tabs-nav .tabs-nav-list { display: inline-block; width: auto; } .myProfileTabOwner .tabs-nav .tabs-nav-list li.tabs-nav-item { margin-left: 20px; margin-right: 20px; height: 45px; padding: 0 10px; } .myProfileTabOwner .tabs-nav .tabs-nav-list li.tabs-nav-item.is-active { border-bottom: 5px solid #1b394e; } .myProfileTabOwner .tabs-nav .tabs-nav-list li.tabs-nav-item.is-active a { color: #1b394e; } .myProfileTabOwner .tabs-nav .tabs-nav-list li.tabs-nav-item:hover { background-color: inherit; } .myProfileTabOwner .tabs-nav .tabs-nav-list li.tabs-nav-item:hover a { color: #1b394e; } .myProfileTabOwner .tabs-nav .tabs-nav-list li.tabs-nav-item a { font-size: 1.125rem; text-decoration: none !important; } .myProfileTabOwner .tabs-container { margin-top: 2px; } .myProfileTabOwner .tabs-container .tabs-content { margin-bottom: 0; } .myProfileTabOwner .tabs-container .tabs-content.hide { display: block; min-height: inherit; height: 0; overflow-y: hidden; } .myProfileTabOwner .tabs-container .tabs-content.active { display: block; min-height: 50px; height: auto; overflow: inherit; } .myProfileTabOwner .mob-accordion-tab { display: none; height: 80px; padding: 30px 60px 30px 20px; background-color: #f7f7f7; } @media screen and (max-width: 767px) { .myProfileTabOwner .zebraChartTile thead .gux-variable { word-wrap: break-word; } .myProfileTabOwner .tabs-nav { display: none; } .myProfileTabOwner .accordion-on-mobile .mob-accordion-tab { display: block; border-bottom: solid 1px rgba(206,206,206,0.5); clear: both; position: relative; font-size: 16px; font-weight: 300; } .myProfileTabOwner .accordion-on-mobile .mob-accordion-tab:first-child { border-top: solid 1px rgba(206,206,206,0.5); } .myProfileTabOwner .accordion-on-mobile .mob-accordion-tab .accordion-indicator { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); display: inline-block; float: right; position: absolute; right: 20px; top: 50%; margin-top: -14px; transition: all .3s ease; } .myProfileTabOwner .accordion-on-mobile .mob-accordion-tab .accordion-indicator.active { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); } .myProfileTabOwner .accordion-on-mobile .tabs-content.active { top: 0; display: inline-block; } .myProfileTabOwner .carousel-on-mobile .flex-direction-nav { display: none; } } #global-ux .myProfileTabOwner .zebraChartTile-table.sticky-column tbody tr td:last-child { padding: 10px 20px; } #global-ux .myProfileTabOwner .zebraChartTile-table tbody tr td:last-child { padding: 28px 29px; text-align: left; } .image-tabs-panel.wcmmode-edit-wrap .tabs-content:not(.active) { display: none; } .image-tabs-panel.wcmmode-edit-wrap .tabs-content { position: relative; display: block; height: 600px; } .image-tabs-panel.wcmmode-edit-wrap .tabs-nav-item { min-height: 180px; width: 33%; position: relative; display: block; } #global-ux .tabPanel .image-tabs-panel { display: block; position: relative; } #global-ux .tabPanel .image-tabs-panel:after { content: ""; display: table; clear: both; } #global-ux .tabPanel .image-tabs-panel .tabs-nav { position: relative; display: block; height: auto; overflow: visible; z-index: 9; margin-bottom: 20px; } #global-ux .tabPanel .image-tabs-panel .tabs-nav .tabs-nav-list { width: 100%; display: block; overflow: visible; } #global-ux .tabPanel .image-tabs-panel .tabs-nav li.tabs-nav-item { display: inline-block; position: relative; width: 33.3333333333%; height: auto; float: left; top: 0; box-sizing: border-box; padding: 20px 10px; text-align: center; margin: 0; background: #f7f7f7; } #global-ux .tabPanel .image-tabs-panel .tabs-nav li.tabs-nav-item a { text-decoration: none; color: inherit; } #global-ux .tabPanel .image-tabs-panel .tabs-nav li.tabs-nav-item a p { margin: 0; font-size: 12px; font-weight: 400; color: #000; } #global-ux .tabPanel .image-tabs-panel .tabs-nav li.tabs-nav-item.is-active { background: #2d96cd; border-bottom: none; } #global-ux .tabPanel .image-tabs-panel .tabs-nav li.tabs-nav-item.is-active a p { color: inherit; font-weight: 400; color: #fff; } #global-ux .tabPanel .image-tabs-panel .tabs-nav li.tabs-nav-item.is-active .arrow-left { display: none; } #global-ux .tabPanel .image-tabs-panel .tabs-nav li.tabs-nav-item.is-active .arrow-down { position: absolute; display: block; width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid blue; bottom: -8px; left: 44%; } #global-ux .tabPanel .image-tabs-panel .tabs-container { margin: 0; } #global-ux .tabPanel .image-tabs-panel .tabs-container .mobile-only, #global-ux .tabPanel .image-tabs-panel .tabs-container .desktop-only { display: none; } @media (max-width: 61.875em) { #global-ux .tabPanel .image-tabs-panel .tabs-content { min-height: 0 !important; } } @media (min-width: 61.9375em) { #global-ux .tabPanel .image-tabs-panel .tabs-nav { float: right; width: 20.6896551724%; } #global-ux .tabPanel .image-tabs-panel .tabs-nav .tabs-nav-list { overflow: visible; } #global-ux .tabPanel .image-tabs-panel .tabs-nav li.tabs-nav-item { display: block; margin: 0; width: 100%; border: none; float: none; } #global-ux .tabPanel .image-tabs-panel .tabs-nav li.tabs-nav-item.is-active { background: #2d96cd; } #global-ux .tabPanel .image-tabs-panel .tabs-nav li.tabs-nav-item.is-active a p { color: #fff; } #global-ux .tabPanel .image-tabs-panel .tabs-nav li.tabs-nav-item.is-active .arrow-down { display: none; } #global-ux .tabPanel .image-tabs-panel .tabs-nav li.tabs-nav-item.is-active .arrow-left { position: absolute; display: block; top: 44%; left: -10px; width: 0; height: 0; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-right: 10px solid blue; } #global-ux .tabPanel .image-tabs-panel .tabs-nav li img { width: 100%; max-width: 100%; margin: 0 auto; } #global-ux .tabPanel .image-tabs-panel .tabs-container { width: 77.5862068966%; margin-right: 1.724137931%; float: left; } #global-ux .tabPanel .image-tabs-panel .tabs-container .tabs-content { position: relative; } #global-ux .tabPanel .image-tabs-panel .tabs-container .component-content { position: absolute; width: 100%; top: 50%; transform: translateY(-50%); } } #global-ux .formMiniDealerLocator .search-block input[type=text]::-ms-clear, #global-ux .formMiniDealerLocator .search-block input[type=search]::-ms-clear { display: none; } #global-ux .miniDealerLocator { background: #f3f3f3; display: block; } #global-ux .miniDealerLocator:after { content: ""; display: table; clear: both; } #global-ux .miniDealerLocator input::-webkit-input-placeholder { color: #626466; opacity: 1; filter: alpha(opacity=100); font-style: italic; text-overflow: ellipsis; white-space: nowrap; font-weight: 300; } #global-ux .miniDealerLocator input::-moz-placeholder { color: #626466; opacity: 1; filter: alpha(opacity=100); font-style: italic; text-overflow: ellipsis; white-space: nowrap; font-weight: 300; } #global-ux .miniDealerLocator input:-ms-input-placeholder { color: #626466; opacity: 1; filter: alpha(opacity=100); font-style: italic; text-overflow: ellipsis; white-space: nowrap; font-weight: 300; } #global-ux .miniDealerLocator input:-moz-placeholder { color: #626466; opacity: 1; filter: alpha(opacity=100); font-style: italic; text-overflow: ellipsis; white-space: nowrap; font-weight: 300; } #global-ux .miniDealerLocator .search-form-container { text-align: center; display: block; } #global-ux .miniDealerLocator .search-form-container:after { content: ""; display: table; clear: both; } #global-ux .miniDealerLocator .mn-search-header h1, #global-ux .miniDealerLocator .mn-search-header h2, #global-ux .miniDealerLocator .mn-search-header h3, #global-ux .miniDealerLocator .mn-search-header h4 { font-size: 1.64286rem; line-height: 1.2; padding: 0 0 30px 0; font-weight: 200; color: #616161; margin: 0; } #global-ux .miniDealerLocator .mn-search-header h1 span, #global-ux .miniDealerLocator .mn-search-header h2 span, #global-ux .miniDealerLocator .mn-search-header h3 span, #global-ux .miniDealerLocator .mn-search-header h4 span { display: inline-block; } @media only screen and (min-width: 48em) { #global-ux .miniDealerLocator .mn-search-header { margin-top: -6px; display: block; } } @media only screen and (min-width: 62em) { #global-ux .miniDealerLocator .mn-search-header { margin: 0; } } .ie8 #global-ux .miniDealerLocator .wrap, .ie9 #global-ux .miniDealerLocator .wrap { width: 870px; margin: 0 auto; padding: 0; display: inline-block; } .ie8 #global-ux .miniDealerLocator .wrap:after, .ie9 #global-ux .miniDealerLocator .wrap:after { content: ""; display: table; clear: both; } .ie8 #global-ux .miniDealerLocator .wrap h1, .ie8 #global-ux .miniDealerLocator .wrap h2, .ie8 #global-ux .miniDealerLocator .wrap h3, .ie8 #global-ux .miniDealerLocator .wrap h4, .ie9 #global-ux .miniDealerLocator .wrap h1, .ie9 #global-ux .miniDealerLocator .wrap h2, .ie9 #global-ux .miniDealerLocator .wrap h3, .ie9 #global-ux .miniDealerLocator .wrap h4 { float: left; text-align: left; padding: 0 60px 0 0; width: 40%; font-size: 40px; font-size: 2.5rem; line-height: 1.4; } #global-ux .miniDealerLocator .wrap .search-panel { text-align: left; position: relative; z-index: 1; } .ie8 #global-ux .miniDealerLocator .wrap .search-panel, .ie9 #global-ux .miniDealerLocator .wrap .search-panel { float: right; margin: 0 auto; width: 55%; } #global-ux .miniDealerLocator .mini-dl-error { display: none; padding: 15px; border-top: 1px solid #ccc; background: #fff; } #global-ux .miniDealerLocator .mini-dl-error.show-msg { display: block; } #global-ux .miniDealerLocator .mini-dl-error p { margin: 0; } .ie8 #global-ux .miniDealerLocator .mini-dl-error, .ie9 #global-ux .miniDealerLocator .mini-dl-error { padding: 20px 15px; } .ie8 #global-ux .miniDealerLocator .dealer-unaware.search-panel, .ie9 #global-ux .miniDealerLocator .dealer-unaware.search-panel { max-width: 600px !important; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none !important; } @media only screen and (min-width: 48em) { #global-ux .miniDealerLocator .search-form-container { padding: 0 15px; } #global-ux .miniDealerLocator .wrap { width: 95%; margin: 0 auto; padding: 0; display: inline-block; } #global-ux .miniDealerLocator .wrap:after { content: ""; display: table; clear: both; } #global-ux .miniDealerLocator .wrap h1, #global-ux .miniDealerLocator .wrap h2, #global-ux .miniDealerLocator .wrap h3, #global-ux .miniDealerLocator .wrap h4 { font-size: 40px; font-size: 2.5rem; float: left; text-align: left; padding: 0 60px 0 0; width: 49%; line-height: 1.4; } #global-ux .miniDealerLocator .wrap .search-panel { float: right; width: 50%; } #global-ux .miniDealerLocator .dealer-unaware.search-panel { max-width: 600px !important; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none !important; } } @media only screen and (min-width: 62em) { #global-ux .miniDealerLocator .wrap { width: 870px; } #global-ux .miniDealerLocator .wrap h1, #global-ux .miniDealerLocator .wrap h2, #global-ux .miniDealerLocator .wrap h3, #global-ux .miniDealerLocator .wrap h4 { float: left; text-align: left; padding: 0 60px 0 0; width: 40%; line-height: 1.4; } #global-ux .miniDealerLocator .wrap .search-panel { margin: 0 auto; width: 55%; } #global-ux .miniDealerLocator .mini-dl-error { padding: 20px 15px; } } @media only screen and (min-width: 75em) { #global-ux .miniDealerLocator h2 { font-size: 3rem; line-height: 1.5; } } #global-ux .miniDealerLocator .component-content { padding: 50px 0; } @media only screen and (min-width: 48em) { #global-ux .miniDealerLocator .component-content { padding-top: 80px; padding-bottom: 90px; } } @media only screen and (min-width: 75em) { #global-ux .miniDealerLocator .component-content { padding-top: 100px; padding-bottom: 110px; } } #global-ux .miniDealerLocator .header-alignment { position: relative; } @media only screen and (min-width: 48em) { #global-ux .miniDealerLocator .header-alignment { float: right; } } #global-ux .miniDealerLocator .header-alignment .icon-find-dealer-open { font-size: 56px; font-size: 3.5rem; margin-bottom: 10px; margin-bottom: .625rem; color: #2d96cd; display: block; text-align: center; } #global-ux .miniDealerLocator .header-alignment h3, #global-ux .miniDealerLocator .header-alignment label, #global-ux .miniDealerLocator .header-alignment p { color: #626466; } #global-ux .miniDealerLocator .header-alignment h3 { font-size: 28px; font-size: 1.75rem; padding-bottom: 20px; padding-bottom: 1.25rem; text-align: center; } @media only screen and (min-width: 48em) { #global-ux .miniDealerLocator .header-alignment h3 { font-size: 32px; font-size: 2rem; line-height: 40px; line-height: 2.5rem; margin: 0 auto; width: 350px; } } #global-ux .miniDealerLocator input[type=radio].custom-radio+label .radio-button { margin-right: 2px; } #global-ux .miniDealerLocator input[type=radio].custom-radio:checked+label { color: #1b394e; font-weight: bold; } #global-ux .miniDealerLocator input[type=radio].custom-radio:checked+label .radio-button { background-color: #1b394e; } @media only screen and (min-width: 48em) { #global-ux .miniDealerLocator .component-content>.columns { padding-top: 12px; padding-bottom: 12px; } } @media only screen and (min-width: 48em) { #global-ux .miniDealerLocator .component-content>.columns:first-child { padding-right: 60px; } } @media only screen and (min-width: 48em) { #global-ux .miniDealerLocator .component-content .search-form>.columns:last-child { border-left: 1px solid #ccc; padding: 0 0 50px 60px; } } #global-ux .miniDealerLocator .search-type-radio { display: inline-block; margin: 0 20px 12px 0; } #global-ux .miniDealerLocator .mdl-use-location .btn-geo-location { padding: 0 15px; padding: 0 .9375rem; font-size: 20px; font-size: 1.25rem; line-height: 70px; line-height: 4.375rem; display: block; background: #2596cf; color: #fff; -webkit-transition: all 0.3 ease-in-out; -moz-transition: all 0.3 ease-in-out; -ms-transition: all 0.3 ease-in-out; -o-transition: all 0.3 ease-in-out; transition: all 0.3 ease-in-out; font-weight: 300; } #global-ux .miniDealerLocator .mdl-use-location .btn-geo-location span { font-size: 37px; font-size: 2.3125rem; margin: -5px 12px 0 0; margin: -.3125rem .75rem 0 0; display: inline-block; } #global-ux .miniDealerLocator .mdl-use-location .btn-geo-location:hover { background: #fff; border: 1px solid #2596cf; line-height: 68px; color: #003478; } #global-ux .miniDealerLocator .mdl-use-location .btn-geo-location:hover span { color: #2596cf; } @media only screen and (max-width: 74.9375em) { #global-ux .miniDealerLocator .mdl-use-location .btn-geo-location { font-size: 18px; font-size: 1.125rem; line-height: 60px; line-height: 3.75rem; } #global-ux .miniDealerLocator .mdl-use-location .btn-geo-location:hover { line-height: 58px; line-height: 3.625rem; } #global-ux .miniDealerLocator .mdl-use-location .btn-geo-location span { font-size: 30px; font-size: 1.875rem; margin: -2px 12px 0 0; margin: -.125rem .75rem 0 0; } } @media only screen and (max-width: 61.9375em) { #global-ux .miniDealerLocator .mdl-use-location .btn-geo-location { font-size: 16px; font-size: 1rem; line-height: 50px; line-height: 3.125rem; } #global-ux .miniDealerLocator .mdl-use-location .btn-geo-location:hover { line-height: 48px; line-height: 3rem; } #global-ux .miniDealerLocator .mdl-use-location .btn-geo-location span { font-size: 24px; font-size: 1.5rem; margin: -2px 10px 0 0; margin: -.125rem .625rem 0 0; } } #global-ux .miniDealerLocator .search-input { margin: 0; position: relative; overflow: hidden; width: 100%; } #global-ux .miniDealerLocator .search-input input { padding-right: 40px; font-size: 16px; font-size: 1rem; } @media only screen and (min-width: 48em) { #global-ux .miniDealerLocator .search-input input { font-size: 14px; font-size: .875rem; } } #global-ux .miniDealerLocator .input-text { display: block; position: relative; } #global-ux .miniDealerLocator .input-text:after { content: ""; display: table; clear: both; } #global-ux .miniDealerLocator .input-text input[type='text'] { height: 60px; height: 3.75rem; font-size: 20px; font-size: 1.25rem; padding: 0 60px 0 15px; padding: 0 3.75rem 0 .9375rem; margin: 0; color: #626466; font-weight: 300; line-height: 1; display: block; width: 100%; border: none; } .ie8 #global-ux .miniDealerLocator .input-text input[type='text'], .ie9 #global-ux .miniDealerLocator .input-text input[type='text'] { line-height: 60px; } #global-ux .miniDealerLocator .input-text .search-submit { width: 60px; width: 3.75rem; height: 60px; height: 3.75rem; line-height: 60px; line-height: 3.75rem; margin: 0; padding: 0; color: #bbb; background: transparent; position: absolute; right: 0; top: 0; text-align: center; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } #global-ux .miniDealerLocator .input-text .search-submit i { font-size: 33px; font-size: 2.0625rem; } #global-ux .miniDealerLocator .input-text .search-submit span { display: none; } @media only screen and (max-width: 74.9375em) { #global-ux .miniDealerLocator .input-text input[type='text'] { height: 50px; height: 3.125rem; font-size: 16px; font-size: 1rem; padding: 0 50px 0 15px; padding: 0 3.125rem 0 .9375rem; } #global-ux .miniDealerLocator .input-text .search-submit { width: 50px; width: 3.125rem; height: 50px; height: 3.125rem; line-height: 50px; line-height: 3.125rem; } #global-ux .miniDealerLocator .input-text .search-submit i { font-size: 25px; font-size: 1.5625rem; } } @media only screen and (max-width: 47.9375em) { #global-ux .miniDealerLocator .input-text input[type='text'] { height: 40px; height: 2.5rem; font-size: 12px; font-size: .75rem; padding: 0 40px 0 15px; padding: 0 2.5rem 0 .9375rem; } #global-ux .miniDealerLocator .input-text .search-submit { width: 40px; width: 2.5rem; height: 40px; height: 2.5rem; line-height: 40px; line-height: 2.5rem; } #global-ux .miniDealerLocator .input-text .search-submit i { font-size: 20px; font-size: 1.25rem; } } #global-ux .miniDealerLocator .mini-dl-text { text-align: center; padding: 10px 15px 0; } #global-ux .miniDealerLocator .mini-dl-text p { margin: 0; } #global-ux .miniDealerLocator .mini-dl-text p:last-of-type { display: inline; } #global-ux .miniDealerLocator .mini-dl-text p:last-of-type:after { content: " "; } #global-ux .miniDealerLocator .mini-dl-text a { font-size: 14px; font-size: .875rem; font-weight: bold; text-decoration: none; } @media only screen and (min-width: 48em) { #global-ux .miniDealerLocator .mini-dl-text { text-align: left; margin-bottom: 17px; margin-bottom: 1.0625rem; padding: 10px 0 0 15px; } #global-ux .miniDealerLocator .mini-dl-text p:last-of-type { display: block; margin: 0; } } @media only screen and (min-width: 62em) { #global-ux .miniDealerLocator .mini-dl-text { margin: 0; } #global-ux .miniDealerLocator .mini-dl-text p:last-of-type { display: inline; } } #global-ux .miniDealerLocator .loading-icon { display: block; background: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/loader-blue.gif") no-repeat transparent right 2px; background-size: contain; width: 36px; height: 36px; margin: -18px 0 0 0; position: absolute; right: 13px; top: 50%; } @media only screen and (max-width: 74.9375em) { #global-ux .miniDealerLocator .loading-icon { right: 8px; } } @media only screen and (max-width: 47.9375em) { #global-ux .miniDealerLocator .loading-icon { right: 3px; } } #global-ux .miniDealerLocator .search-form { display: block; } #global-ux .miniDealerLocator .map-container { display: block; } #global-ux .miniDealerLocator .map-container:after { content: ""; display: table; clear: both; } #global-ux .miniDealerLocator .dealer-item, #global-ux .miniDealerLocator .error-messages { display: none; } #global-ux .miniDealerLocator p.error { position: relative; } #global-ux .miniDealerLocator p.error:after { font-size: 24px; font-size: 1.5rem; margin-top: -4px; } .ie8 #global-ux .miniDealerLocator p.error:after, .ie9 #global-ux .miniDealerLocator p.error:after { top: 0; margin: 0; } #global-ux .miniDealerLocator .autocomplete { background-color: white; border: 1px solid #ccc; left: 0; padding: 0 0 5px; position: absolute; top: 90px; width: 100%; margin: 0; } .ie8 #global-ux .miniDealerLocator .autocomplete { top: 130px; } #global-ux .miniDealerLocator .autocomplete div p { font-style: italic; font-weight: 300; line-height: 30px; margin: 0; padding: 8px 0 5px 0; color: #626466; } #global-ux .miniDealerLocator .autocomplete ul { list-style: outside none none; margin: 0; max-height: 200px; overflow-x: hidden; overflow-y: auto; padding: 0; } #global-ux .miniDealerLocator .autocomplete ul li { font-size: 14px; font-size: .875rem; display: block; padding-bottom: 10px; } #global-ux .miniDealerLocator .autocomplete ul li a { font-weight: bold; text-decoration: none; } @media only screen and (min-width: 48em) { #global-ux .miniDealerLocator .autocomplete { top: 100px; } } @media only screen and (min-width: 62em) { #global-ux .miniDealerLocator .autocomplete { top: 110px; } } @media only screen and (min-width: 75em) { #global-ux .miniDealerLocator .autocomplete { top: 130px; } #global-ux .miniDealerLocator .autocomplete div p { font-size: 16px; font-size: 1rem; padding: 15px 0 10px 0; } #global-ux .miniDealerLocator .autocomplete ul li { font-size: 18px; font-size: 1.125rem; padding-bottom: 15px; } } #global-ux .miniDealerLocator .dl-first-info { padding: 0 25px; padding: 0 1.5625rem; display: none; position: relative; color: #616161; } #global-ux .miniDealerLocator .dl-first-info:after { content: ""; display: table; clear: both; } #global-ux .miniDealerLocator .dl-first-info.show-info { display: block; } #global-ux .miniDealerLocator .dl-first-info a { text-decoration: none; } #global-ux .miniDealerLocator .dl-first-info p { color: #616161; } #global-ux .miniDealerLocator .dl-first-info .dl-search-info { padding: 0 0 20px; padding: 0 0 1.25rem; display: block; } #global-ux .miniDealerLocator .dl-first-info .search-info { font-size: 16px; font-size: 1rem; display: block; font-weight: 300; overflow: hidden; } #global-ux .miniDealerLocator .dl-first-info .search-info h3 { float: left; margin: 0 10px 0 0; } #global-ux .miniDealerLocator .dl-first-info .search-info a { display: inline-block; line-height: 50px; line-height: 3.125rem; } #global-ux .miniDealerLocator .dl-first-info .dl-name { font-size: 24px; font-size: 1.5rem; margin: 0; line-height: 1.2; } #global-ux .miniDealerLocator .dl-first-info .search-again { display: block; padding: 10px 0 0 0; font-weight: 300; text-transform: uppercase; } #global-ux .miniDealerLocator .dl-first-info .search-again .icon { margin: 0 8px 0 0; font-size: 32px; font-size: 2rem; padding: 1px; } #global-ux .miniDealerLocator .dl-first-info .search-again span { font-size: 14px; font-size: .875rem; } #global-ux .miniDealerLocator .dl-first-info .search-again a:hover .icon-search2:before { content: "\e61E"; } #global-ux .miniDealerLocator .dl-first-info .dl-info { padding: 0 0 30px; padding: 0 0 1.875rem; display: block; } #global-ux .miniDealerLocator .dl-first-info .dl-phone { font-size: 20px; font-size: 1.25rem; font-weight: 200; } #global-ux .miniDealerLocator .dl-first-info .dl-services { font-size: 14px; font-size: .875rem; line-height: 1.5; font-weight: 300; } #global-ux .miniDealerLocator .dl-first-info .dl-opening, #global-ux .miniDealerLocator .dl-first-info .dl-addess { font-size: 14px; font-size: .875rem; margin: 0; line-height: 1.5; font-weight: 300; } #global-ux .miniDealerLocator .dl-first-info .dl-contact-info { margin: 0 -25px; margin: 0 -1.5625rem; display: block; } #global-ux .miniDealerLocator .dl-first-info .dl-contact-info:after { content: ""; display: table; clear: both; } #global-ux .miniDealerLocator .dl-first-info .dl-contact-info>p { font-size: 12px; font-size: .75rem; font-weight: normal; float: left; width: 33.33333%; text-align: center; margin: 0; text-transform: none; white-space: nowrap; } #global-ux .miniDealerLocator .dl-first-info .dl-contact-info>p a { display: inline-block; margin: 0 auto; } #global-ux .miniDealerLocator .dl-first-info .dl-contact-info>p i { font-size: 44px; font-size: 2.75rem; } #global-ux .miniDealerLocator .dl-first-info .dl-contact-info>p span { display: block; padding: 5px 0 0; white-space: normal; } #global-ux .miniDealerLocator .dl-first-info .dl-telephone .icon-phone-circled-2:before { content: "\e638"; } #global-ux .miniDealerLocator .dl-first-info .dl-telephone a:hover .icon-phone-circled-2:before { content: "\e658"; } @media only screen and (min-width: 48em) { #global-ux .miniDealerLocator .dl-first-info { padding: 0; } #global-ux .miniDealerLocator .dl-first-info .dl-search-info { float: left; position: absolute; left: 0; top: 50%; -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -o-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); } #global-ux .miniDealerLocator .dl-first-info .dl-info { float: left; text-align: center; border-left: 1px solid #c5c5c5; border-right: 1px solid #c5c5c5; } #global-ux .miniDealerLocator .dl-first-info .dl-contact-info { float: left; position: absolute; top: 50%; -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -o-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); margin: 0; } } @media only screen and (min-width: 48em) and (max-width: 74.9375em) { #global-ux .miniDealerLocator .dl-first-info .dl-search-info { width: 33%; padding: 0 35px; } #global-ux .miniDealerLocator .dl-first-info .search-info { font-size: 17px; font-size: 1.0625rem; } #global-ux .miniDealerLocator .dl-first-info .dl-name { font-size: 30px; font-size: 1.875rem; } #global-ux .miniDealerLocator .dl-first-info .dl-info { width: 33%; padding: 30px 35px; margin-left: 33%; } #global-ux .miniDealerLocator .dl-first-info .dl-phone { font-size: 21px; font-size: 1.3125rem; } #global-ux .miniDealerLocator .dl-first-info .dl-contact-info { width: 34%; left: 66%; padding: 0 35px; } #global-ux .miniDealerLocator .dl-first-info .dl-contact-info>p { font-size: 14px; font-size: .875rem; width: 100%; white-space: nowrap; text-align: left; padding: 8px 0; } #global-ux .miniDealerLocator .dl-first-info .dl-contact-info>p br { display: none; visibility: hidden; } #global-ux .miniDealerLocator .dl-first-info .dl-contact-info>p i { margin: 0 10px 0 0; } #global-ux .miniDealerLocator .dl-first-info .dl-contact-info>p span { display: inline-block; padding: 0; } } @media only screen and (min-width: 75em) { #global-ux .miniDealerLocator .dl-first-info .dl-search-info { width: 35.7%; float: left; padding: 0 35px; } #global-ux .miniDealerLocator .dl-first-info .search-info { font-size: 18px; font-size: 1.125rem; } #global-ux .miniDealerLocator .dl-first-info .dl-name { font-size: 38px; font-size: 2.375rem; } #global-ux .miniDealerLocator .dl-first-info .dl-info { width: 22.7%; margin-left: 35.7%; padding: 40px 30px; } #global-ux .miniDealerLocator .dl-first-info .dl-contact-info { width: 41.6%; left: 58.4%; padding: 0 44px; margin-top: 10px; } #global-ux .miniDealerLocator .dl-first-info .dl-contact-info>p { font-size: 16px; font-size: 1rem; font-weight: 300; } #global-ux .miniDealerLocator .dl-first-info .dl-contact-info>p i { font-size: 50px; font-size: 3.125rem; } #global-ux .miniDealerLocator .dl-first-info .dl-contact-info>p span { padding: 10px 0 0; } } .ie8 #global-ux .miniDealerLocator .hide-for-large-up, .ie9 #global-ux .miniDealerLocator .hide-for-large-up { display: none; } .ie8 #global-ux .miniDealerLocator .component-content { padding-top: 80px; padding-bottom: 90px; } .ie8 #global-ux .miniDealerLocator .mini-dl-text { text-align: left; margin: 0; padding: 10px 0 0 15px; } .ie8 #global-ux .miniDealerLocator .input-text input[type="text"] { text-overflow: clip; overflow: hidden; } .ie8 #global-ux .miniDealerLocator .dl-first-info .dl-search-info { width: 35.7%; float: left; position: absolute; left: 0; top: 30%; -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0); padding: 0 35px; margin-top: -52px; } .ie8 #global-ux .miniDealerLocator .dl-first-info .dl-info { height: auto; min-height: 150px; margin: 0; box-sizing: border-box; } .ie8 #global-ux .miniDealerLocator .dl-first-info .dl-contact-info { position: relative; left: auto; top: auto; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; } .ie8 #global-ux .miniDealerLocator .dl-first-info .search-info { font-size: 18px; font-size: 1.125rem; } .ie8 #global-ux .miniDealerLocator .dl-first-info .dl-name { font-size: 38px; font-size: 2.375rem; } .ie8 #global-ux .miniDealerLocator .dl-first-info .dl-info { float: left; text-align: center; border-left: 1px solid #c5c5c5; border-right: 1px solid #c5c5c5; margin: 0 0 0 33%; padding: 30px 35px; width: 33%; } .ie8 #global-ux .miniDealerLocator .dl-first-info .dl-contact-info { float: left; position: absolute; top: 50%; -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0); margin: -35px 0 0; left: 66%; padding: 0 35px; width: 34%; } .ie8 #global-ux .miniDealerLocator .dl-first-info .dl-contact-info>p { font-size: 16px; font-size: 1rem; font-weight: 300; margin: 0; } .ie8 #global-ux .miniDealerLocator .dl-first-info .dl-contact-info>p i { font-size: 50px; font-size: 3.125rem; } .ie8 #global-ux .miniDealerLocator .dl-first-info .dl-contact-info>p span { padding: 10px 0 0; } .ie8 #global-ux .miniDealerLocator .loading-icon { background: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/loader-blue-small.gif") 50% 50% no-repeat; } .ie8 #global-ux .miniDealerLocator .columns { position: relative; } #global-ux .miniDealerLocator .search-form .form-group-input, #global-ux .miniDealerLocator .search-form .mdl-use-location .icon-navigation, #global-ux .miniDealerLocator .search-form .mn-search-header .icon-find-dealer-open { display: none; } #global-ux .miniDealerLocator .search-form .hide-this-field { display: none !important; visibility: hidden !important; } #global-ux .miniDealerLocator .search-form.dropdown-search .form-group-input { display: block; } #global-ux .miniDealerLocator .search-form.dropdown-search .mdl-use-location .icon-navigation, #global-ux .miniDealerLocator .search-form.dropdown-search .mn-search-header .icon-find-dealer-open { display: inline-block; } #global-ux .miniDealerLocator .search-form.dropdown-search .input-text, #global-ux .miniDealerLocator .search-form.dropdown-search .mini-dl-text, #global-ux .miniDealerLocator .search-form.dropdown-search .mdl-use-location .btn-geo-location .icon-get-location { display: none; } #global-ux .miniDealerLocator .search-form.dropdown-search .wrap { width: 930px; position: relative; } #global-ux .miniDealerLocator .search-form.dropdown-search .wrap .mn-search-header { width: 52%; -webkit-box-sizing: corder-box; -moz-box-sizing: corder-box; box-sizing: corder-box; float: left; padding: 60px 25px 0; margin: 0; position: absolute; left: 0; top: 50%; -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -o-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); text-align: center; } #global-ux .miniDealerLocator .search-form.dropdown-search .wrap .mn-search-header:before { font-family: "icomoon"; font-size: 1.75rem; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\e639"; color: #2596cf; font-size: 52px; position: absolute; left: 0; top: 0; float: left; width: 100%; text-align: center; } .ie8 #global-ux .miniDealerLocator .search-form.dropdown-search .wrap .mn-search-header { top: 30px; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; } #global-ux .miniDealerLocator .search-form.dropdown-search .wrap .mn-search-header h1, #global-ux .miniDealerLocator .search-form.dropdown-search .wrap .mn-search-header h2, #global-ux .miniDealerLocator .search-form.dropdown-search .wrap .mn-search-header h3, #global-ux .miniDealerLocator .search-form.dropdown-search .wrap .mn-search-header h4, #global-ux .miniDealerLocator .search-form.dropdown-search .wrap .mn-search-header h5 { font-size: 32px; font-size: 2rem; line-height: 1.1; float: none; display: block; width: auto; padding: 0; margin: 0; text-align: center; } #global-ux .miniDealerLocator .search-form.dropdown-search .wrap .search-panel { width: 48%; -webkit-box-sizing: corder-box; -moz-box-sizing: corder-box; box-sizing: corder-box; float: right; margin: 0; padding-left: 120px; border-left: 1px solid #dbdbdb; } #global-ux .miniDealerLocator .search-form.dropdown-search .mdl-use-location .btn-geo-location { font-size: 14px; font-size: .875rem; line-height: 48px; } #global-ux .miniDealerLocator .search-form.dropdown-search .mdl-use-location .btn-geo-location:hover, #global-ux .miniDealerLocator .search-form.dropdown-search .mdl-use-location .btn-geo-location:focus { line-height: 46px; } #global-ux .miniDealerLocator .search-form.dropdown-search .mdl-use-location .btn-geo-location span { font-size: 18px; font-size: 1.125rem; margin: -2px 12px 0 0; margin: -.125rem .75rem 0 0; } #global-ux .miniDealerLocator .search-form .form-group-input { position: relative; } #global-ux .miniDealerLocator .search-form .form-group-input .select2-container { margin: 0; overflow: hidden; } #global-ux .miniDealerLocator .search-form .form-group-input .select2-container input { position: absolute; float: left; left: -200%; top: -100px; } #global-ux .miniDealerLocator .search-form .form-group-input .dropdown { display: block; margin: 20px 0 0; } #global-ux .miniDealerLocator .search-form .form-group-input .dropdown:after { content: ""; display: table; clear: both; } #global-ux .miniDealerLocator .search-form .form-group-input .form-dropdown label { display: block; } #global-ux .miniDealerLocator .search-form .form-group-input span.error, #global-ux .miniDealerLocator .search-form .form-group-input small.error { margin: 0; background: transparent; color: #f34c32; padding: 5px 20px 0; } #global-ux .miniDealerLocator .search-form .form-group-input span.error.hide, #global-ux .miniDealerLocator .search-form .form-group-input small.error.hide { display: none; } #global-ux .miniDealerLocator .search-form .form-group-input .dd-loading { background: rgba(255,255,255,0.5); float: left; height: 100%; left: 0; position: absolute; text-align: center; top: 0; width: 100%; } #global-ux .miniDealerLocator .search-form .form-group-input .dd-loading span { float: left; width: 50px; height: 50px; position: absolute; left: 50%; top: 50%; margin: -25px 0 0 -25px; } #global-ux .miniDealerLocator .search-form .dropdown-search-submit { display: block; margin: 20px 0; width: 100%; } @media screen and (max-width: 61.9375em) { #global-ux .miniDealerLocator .search-form.dropdown-search .wrap { width: 100%; } #global-ux .miniDealerLocator .search-form.dropdown-search .wrap .search-panel { padding-left: 60px; padding-right: 30px; } } @media screen and (max-width: 47.9375em) { #global-ux .miniDealerLocator .search-form.dropdown-search .wrap .mn-search-header { width: 100%; padding: 60px 25px 50px; position: relative; left: auto; top: auto; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; } #global-ux .miniDealerLocator .search-form.dropdown-search .wrap .mn-search-header:before { font-size: 52px; } #global-ux .miniDealerLocator .search-form.dropdown-search .wrap .mn-search-header h1, #global-ux .miniDealerLocator .search-form.dropdown-search .wrap .mn-search-header h2, #global-ux .miniDealerLocator .search-form.dropdown-search .wrap .mn-search-header h3, #global-ux .miniDealerLocator .search-form.dropdown-search .wrap .mn-search-header h4, #global-ux .miniDealerLocator .search-form.dropdown-search .wrap .mn-search-header h5 { font-size: 24px; font-size: 1.5rem; line-height: 1.3; } #global-ux .miniDealerLocator .search-form.dropdown-search .wrap .search-panel { width: 100%; padding: 0 25px; border: none; } } #global-ux .miniDealerLocator .search-form .hidden { display: none; } #global-ux .miniDealerLocator .expander-section .expander-body { overflow: hidden; padding: 0 35px; } #global-ux .miniDealerLocator .expander-section .expander-body.collapsed { max-height: 0; -webkit-transition: max-height 0.2s ease-in-out,0.3s linear; -moz-transition: max-height 0.2s ease-in-out,0.3s linear; -ms-transition: max-height 0.2s ease-in-out,0.3s linear; -o-transition: max-height 0.2s ease-in-out,0.3s linear; transition: max-height 0.2s ease-in-out,0.3s linear; } #global-ux .miniDealerLocator .expander-section .expander-body.expanded { min-height: 465px; max-height: 1000px; -webkit-transition: max-height 0.2s ease-in-out,0.3s linear; -moz-transition: max-height 0.2s ease-in-out,0.3s linear; -ms-transition: max-height 0.2s ease-in-out,0.3s linear; -o-transition: max-height 0.2s ease-in-out,0.3s linear; transition: max-height 0.2s ease-in-out,0.3s linear; margin-top: 35px; } #global-ux .miniDealerLocator .expander-section .expander-body .map-container { min-height: 465px; margin: 0 -35px; -webkit-transition: min-height 0.2s ease-in-out,0.3s linear; -moz-transition: min-height 0.2s ease-in-out,0.3s linear; -ms-transition: min-height 0.2s ease-in-out,0.3s linear; -o-transition: min-height 0.2s ease-in-out,0.3s linear; transition: min-height 0.2s ease-in-out,0.3s linear; } #global-ux .miniDealerLocator .expander-section .expander-head .expander { font-size: 30px; font-size: 1.875rem; display: block; height: 60px; width: 60px; margin: 35px auto -60px; -webkit-transition: all 0.2s ease 0.3s; -moz-transition: all 0.2s ease 0.3s; -ms-transition: all 0.2s ease 0.3s; -o-transition: all 0.2s ease 0.3s; transition: all 0.2s ease 0.3s; outline: none; padding: 1px; } #global-ux .miniDealerLocator .expander-section .expander-head .expander:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #global-ux .miniDealerLocator .expander-section .expander-head .expander:hover:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #global-ux .miniDealerLocator .expander-section .expander-head .expander:before { font-size: 60px; font-size: 3.75rem; position: relative; } #global-ux .miniDealerLocator .expander-section .expander-head .expander.open { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .ie8 #global-ux .miniDealerLocator .expander-section .expander-head .expander.open:before { content: "\e610"; } #global-ux .miniDealerLocator .first-result .dl-first-info .search-info h2 { line-height: 1; margin: 0; font-size: 40px; font-size: 2.5rem; } #global-ux .miniDealerLocator .first-result h3 { margin: 0 0 0 68px; text-align: left; } #global-ux .miniDealerLocator .first-result .dealer-details { overflow: hidden; position: relative; padding: 0 0 0 25px; } #global-ux .miniDealerLocator .first-result .dealer-details a { text-decoration: none; } #global-ux .miniDealerLocator .first-result .result-number { font-size: 16px; font-size: 1rem; font-weight: 300; font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; position: absolute; padding: 0; top: 5px; left: 1px; text-align: center; width: 30px; height: 30px; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; cursor: pointer; background-color: #0078a0; } .lang_vi #global-ux .miniDealerLocator .first-result .result-number { font-family: "Arial","Tahoma","Helvetica",sans-serif; } #global-ux .miniDealerLocator .first-result .result-number.result-number-active { background-color: #1B394E; } #global-ux .miniDealerLocator .first-result .result-number span { display: block; color: #fff; line-height: 30px; } #global-ux .miniDealerLocator .first-result section { background-color: transparent; } #global-ux .miniDealerLocator .first-result .dealer header { position: relative; top: -8px; } #global-ux .miniDealerLocator .first-result .dealer .dealer-info .dealer-address, #global-ux .miniDealerLocator .first-result .dealer .dealer-info .dealer-services { margin: 0 0 10px; } #global-ux .miniDealerLocator .first-result .dealer .dealer-info .address-line { margin: 0; } #global-ux .miniDealerLocator .first-result .dealer h4 a { font-size: 24px; font-size: 1.5rem; } @media only screen and (min-width: 48em) and (max-width: 61.9375em) { #global-ux .miniDealerLocator .first-result .dealer h4 a { font-size: 20px; font-size: 1.25rem; display: block; } #global-ux .miniDealerLocator .first-result .dealer .dealer-info p { font-size: 12px; font-size: .75rem; } } #global-ux .miniDealerLocator .first-result .dealer-contact-info { padding: 3px 0 0 0; } #global-ux .miniDealerLocator .first-result .dealer-contact-info .dealer-details { padding: 0; } #global-ux .miniDealerLocator .first-result .dealer-contact-info .dealer-direction a { text-decoration: none; } #global-ux .miniDealerLocator .first-result .dealer-contact-info i.icon { margin-right: 10px; } @media only screen and (min-width: 48em) and (max-width: 61.9375em) { #global-ux .miniDealerLocator .first-result .dealer-contact-info p { font-size: 12px; font-size: .75rem; } } #global-ux .miniDealerLocator .first-result .cta { margin: 0 0 0 68px; } #global-ux .miniDealerLocator .first-result .cta a { font-size: 17px; font-size: 1.0625rem; margin: 0 0 10px; } #global-ux .miniDealerLocator .first-result .cta a i { margin: 0 5px 0 0; } #global-ux .miniDealerLocator .first-result .cta a:hover i:before { content: "\e61E"; } #global-ux .miniDealerLocator .first-result .cta .mini-dl-text { margin: 10px 0 0 8px; } #global-ux .miniDealerLocator .first-result .cta .mini-dl-text a { font-weight: bold; } @media only screen and (min-width: 48em) and (max-width: 61.9375em) { #global-ux .miniDealerLocator .first-result .cta a { font-size: 14px; font-size: .875rem; } #global-ux .miniDealerLocator .first-result .cta .mini-dl-text p:last-of-type { display: inline; } } #global-ux .miniDealerLocator .collapsed .additional-results { border-top: none; } #global-ux .miniDealerLocator .additional-results { margin: 0 auto; padding: 35px 0; width: 100%; border-top: 1px solid #ccc; clear: both; } #global-ux .miniDealerLocator .additional-results.active { margin-top: 35px; } #global-ux .miniDealerLocator .additional-results .columns { padding: 0 10px 0 25px; float: left; } #global-ux .miniDealerLocator .additional-results .columns .result-number { font-size: 16px; font-size: 1rem; font-weight: bold; position: absolute; padding: 0; top: 5px; left: 1px; text-align: center; width: 30px; height: 30px; border-radius: 15px; cursor: pointer; background-color: #0078a0; display: block; color: #fff; line-height: 30px; } #global-ux .miniDealerLocator .additional-results .columns .result-number.result-number-active { background-color: #1B394E; } #global-ux .miniDealerLocator .additional-results .columns .dealer { padding: 0 15px; background-color: transparent; } #global-ux .miniDealerLocator .additional-results .columns .dealer-details a { text-decoration: none; } #global-ux .miniDealerLocator .additional-results .columns .dealer-details a i.icon { margin-right: 10px; } #global-ux .miniDealerLocator .additional-results h4 { font-size: 20px; font-size: 1.25rem; margin: 7px 0 12px; font-weight: 200; } #global-ux .miniDealerLocator .additional-results p { font-size: 17px; font-size: 1.0625rem; line-height: 1.5; margin: 0 0 10px; font-weight: 200; } @media only screen and (min-width: 48em) and (max-width: 61.9375em) { #global-ux .miniDealerLocator .additional-results p { font-size: 15px; font-size: .9375rem; } } #global-ux .miniDealerLocator .map-container .map-marker span { font-family: "Antenna",Arial,Helvetica,"Microsoft YaHei","微软雅黑","STXihei","华文细黑","SimSun","宋体"; font-size: 13px; font-size: .8125rem; line-height: 31px; font-weight: bold; display: block; width: 100%; position: absolute; top: 0; left: 0; text-align: center; color: #fff; } .lang_vi #global-ux .miniDealerLocator .map-container .map-marker span { font-family: "Arial","Tahoma","Helvetica",sans-serif; } @media only screen and (min-width: 48em) { #global-ux .miniDealerLocator .map-container .map-marker span { font-size: 14px; font-size: .875rem; } } #global-ux .miniDealerLocator .map-container .info-window { z-index: 1; max-width: 400px; } #global-ux .miniDealerLocator .map-container .info-window .content { width: 330px; height: 100%; position: relative; padding: 20px 50px 10px 20px; background-color: #fff; border: 1px solid #ccc; left: -25px; } #global-ux .miniDealerLocator .map-container .info-window h4 { font-size: 18px; font-size: 1.125rem; color: #0078a0; margin: 0 0 2px; } #global-ux .miniDealerLocator .map-container .info-window p { font-size: 13px; font-size: .8125rem; margin-bottom: 10px; color: #616161; } #global-ux .miniDealerLocator .map-container .info-window a { text-decoration: none; } #global-ux .miniDealerLocator .map-container .info-window .dl-service, #global-ux .miniDealerLocator .map-container .info-window .dl-time { font-size: 11px; font-size: .6875rem; line-height: 1.5; } #global-ux .miniDealerLocator .map-container .info-window .address { margin-bottom: 10px; } #global-ux .miniDealerLocator .map-container .info-window .address p { margin: 0; font-size: 13px; font-size: .8125rem; } #global-ux .miniDealerLocator .map-container .info-window .dealer-telephone .icon-phone { margin: 0 0 0 -6px; } #global-ux .miniDealerLocator .map-container .info-window .dealer-fax { margin: -5px 0 15px; } #global-ux .miniDealerLocator .map-container .info-window .dealer-fax .icon-fax { font-size: 18px; font-size: 1.125rem; margin: 0 5px 0 0; } #global-ux .miniDealerLocator .map-container .info-window .ext-link { display: inline-block; position: relative; overflow: hidden; } #global-ux .miniDealerLocator .map-container .info-window .ext-link .offscreen { position: absolute; left: -9999px; top: -99999px; } #global-ux .miniDealerLocator .map-container .info-window .ext-link:after { color: #616161; font-family: icomoon; font-size: 0.75em; padding-left: 4px; } #global-ux .miniDealerLocator .map-container .info-window .directions, #global-ux .miniDealerLocator .map-container .info-window .dealer-details-link { text-decoration: none; text-transform: uppercase; } #global-ux .miniDealerLocator .map-container .info-window .directions i, #global-ux .miniDealerLocator .map-container .info-window .dealer-details-link i { font-size: 20px; font-size: 1.25rem; } #global-ux .miniDealerLocator .map-container .info-window .pointer { display: block; width: 11px; height: 17px; position: absolute; top: 20px; left: -11px; background: transparent url("/etc/designs/guxfoap/clientlibs/guxfoap/img/info-window-pointer.png") 0 0 no-repeat; } #global-ux .miniDealerLocator .map-container .info-window .close { position: absolute; right: 20px; top: 23px; display: block; height: 21px; width: 21px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); cursor: pointer; } #global-ux .miniDealerLocator .map-container .info-window .close i { font-size: 20px; font-size: 1.25rem; color: #0078a0; } .ie8 #global-ux .miniDealerLocator .map-container .info-window .close i:before { content: "\e610"; } #global-ux .miniDealerLocator .mobile-results-carousel { margin: 15px 10% 60px; position: relative; } #global-ux .miniDealerLocator .mobile-results-carousel li.slide { display: inline-block; margin-bottom: 50px; width: 100%; } #global-ux .miniDealerLocator .mobile-results-carousel li.slide a { text-decoration: none; } #global-ux .miniDealerLocator .mobile-results-carousel li.slide h3 { color: #616161; font-size: 22px; font-size: 1.375rem; font-weight: 300; display: inline; } #global-ux .miniDealerLocator .mobile-results-carousel li.slide .slide { text-align: center; } #global-ux .miniDealerLocator .mobile-results-carousel .dealer .heading h4 { color: #2d96cd; font-size: 22px; font-size: 1.375rem; font-weight: 300; } #global-ux .miniDealerLocator .mobile-results-carousel .dealer-address { margin-bottom: 20px; margin-bottom: 1.25rem; } #global-ux .miniDealerLocator .mobile-results-carousel .dealer-address .address-line { margin: 0; } #global-ux .miniDealerLocator .mobile-results-carousel .detail p { color: #616161; font-size: 20px; font-size: 1.25rem; line-height: 24px; line-height: 1.5rem; font-weight: 200; } #global-ux .miniDealerLocator .mobile-results-carousel .contact-info { min-height: 50px; position: relative; } #global-ux .miniDealerLocator .mobile-results-carousel .contact-info .columns { padding: 0; } #global-ux .miniDealerLocator .mobile-results-carousel .contact-info a { display: block; text-align: center; } #global-ux .miniDealerLocator .mobile-results-carousel .contact-info a i { font-size: 50px; font-size: 3.125rem; font-weight: 200; } #global-ux .miniDealerLocator .mobile-results-carousel .contact-info a span { font-size: 12px; font-size: .75rem; margin-top: 24px; margin-top: 1.5rem; font-weight: 200; display: block; text-transform: none; } #global-ux .miniDealerLocator .mobile-results-carousel .contact-info a:hover i.icon-directions:before { content: "\e631"; } #global-ux .miniDealerLocator .mobile-results-carousel .contact-info .contact-info-container { left: -8%; position: absolute; width: 110%; } #global-ux .miniDealerLocator .mobile-results-carousel .flex-control-nav { bottom: -60px; display: block; list-style: outside none none; margin: 0; position: absolute; text-align: center; width: 100%; } #global-ux .miniDealerLocator .mobile-results-carousel .flex-control-nav li { display: inline-block; margin: 0 17px; text-align: center; } #global-ux .miniDealerLocator .mobile-results-carousel .flex-control-nav li a { background: #2d96cd none repeat scroll 0 0; border: 1px solid #2d96cd; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; cursor: pointer; display: block; height: 8px !important; width: 8px !important; margin: 8px 0 0 !important; text-indent: -99999px; -webkit-transition: all 300ms ease-out 0s; -moz-transition: all 300ms ease-out 0s; -ms-transition: all 300ms ease-out 0s; -o-transition: all 300ms ease-out 0s; transition: all 300ms ease-out 0s; } #global-ux .miniDealerLocator .mobile-results-carousel .flex-control-nav a:hover:not(.flex-active) { -webkit-transform: scale(1.5, 1 0.5); -moz-transform: scale(1.5, 1 0.5); -ms-transform: scale(1.5, 1 0.5); -o-transform: scale(1.5, 1 0.5); transform: scale(1.5, 1 0.5); } #global-ux .miniDealerLocator .mobile-results-carousel .flex-control-nav a.flex-active { background: transparent; -webkit-transform: scale(1.5, 1.5); -moz-transform: scale(1.5, 1.5); -ms-transform: scale(1.5, 1.5); -o-transform: scale(1.5, 1.5); transform: scale(1.5, 1.5); } .rtl #global-ux .miniDealerLocator .mdl-use-location .btn-geo-location { font-size: 26px; font-size: 1.625rem; text-align: right; } .rtl #global-ux .miniDealerLocator .mdl-use-location .btn-geo-location span { margin-right: 0; margin-left: 0.75rem; } .rtl #global-ux .miniDealerLocator .input-text input[type='text'] { padding-right: 0.9375rem; padding-left: 3.125rem; font-size: 26px; font-size: 1.625rem; } .rtl #global-ux .miniDealerLocator .input-text .search-submit { right: auto; left: 0; } .rtl #global-ux .miniDealerLocator p.error { font-size: 18px; font-size: 1.125rem; text-align: right; } .rtl #global-ux .miniDealerLocator p.error:after { top: 0; } .rtl #global-ux .miniDealerLocator .mini-dl-text { padding-right: 15px; padding-left: 0; text-align: right; } .rtl #global-ux .miniDealerLocator .mini-dl-text p, .rtl #global-ux .miniDealerLocator .mini-dl-text a { font-size: 20px; font-size: 1.25rem; } .rtl #global-ux .miniDealerLocator .wrap h3 { float: right; padding-right: 0; padding-left: 60px; text-align: right; } .rtl #global-ux .miniDealerLocator .wrap .search-panel { float: left; width: 100%; } @media only screen and (min-width: 48em) { .rtl #global-ux .miniDealerLocator .wrap .search-panel { width: 50%; } } @media only screen and (min-width: 62em) { .rtl #global-ux .miniDealerLocator .wrap .search-panel { width: 55%; } } @media only screen and (max-width: 47.9375em) { .rtl #global-ux .miniDealerLocator .component-content.search-completed { direction: ltr; } } #global-ux .overlay-container.has-form .overlay-close { width: 30px; height: 30px; } #global-ux .overlay-container.has-form .overlay-close .icon-plus { background-position: -620px -215px; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); width: 30px; height: 30px; margin: 0; } #global-ux .form { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 60px 25px; margin: 0; background: #fff; display: block; } #global-ux .form:after { content: ""; display: table; clear: both; } @media only screen and (min-width: 75em) { #global-ux .form { padding: 35px 60px 90px; } } #global-ux .form.section { overflow: hidden; } #global-ux .form .form-group-input { margin-left: -15px; margin-left: -.9375rem; margin-right: -15px; margin-right: -.9375rem; display: block; } #global-ux .form .form-group-input:after { content: ""; display: table; clear: both; } #global-ux .form .form-group-input .richtext { padding: 0 15px; padding: 0 .9375rem; } #global-ux .form .form-group-input .richtext .richtext { padding: 0; } #global-ux .form .form-group-input .richtext .richtext .mobile hr { margin: 0 -30px; } #global-ux .form .emailfield .clearleft { float: none !important; } #global-ux .form .richtext { color: #616161; } #global-ux .form .richtext.first hr { margin-left: -35px; margin-right: -35px; margin-bottom: 0; } #global-ux .form .richtext.first h1 { margin-bottom: 32px; } #global-ux .form .richtext.first h1+p { margin-top: -25px; } #global-ux .form .richtext.first .mobile>* { padding-right: 30px; } @media only screen and (min-width: 75em) { #global-ux .form .richtext.first hr { margin-left: -60px; margin-right: -60px; } #global-ux .form .richtext.first h1 { margin-bottom: 42px; } #global-ux .form .richtext.first h1+p { margin-top: -35px; } } #global-ux .form .richtext p { font-size: 14px; font-size: .875rem; line-height: 24px; line-height: 1.5rem; font-weight: 300; color: #616161; display: block; } #global-ux .form .richtext .richtext-read-more .desktop { padding-bottom: 0; padding-top: 0; } #global-ux .form .richtext .richtext-read-more .desktop.hideForMobile p, #global-ux .form .richtext .richtext-read-more .mobile.show-mob-only p { display: block; text-align: left; } #global-ux .form h1, #global-ux .form h2 { text-indent: inherit; line-height: 100%; margin-bottom: 30px; margin-top: 0; font-size: 24px; font-size: 1.5rem; color: #616161; font-weight: 200; } #global-ux .form h1+p, #global-ux .form h2+p { margin-top: -25px; } @media only screen and (min-width: 48em) { #global-ux .form h1, #global-ux .form h2 { font-size: 36px; font-size: 2.25rem; margin-bottom: 40px; } #global-ux .form h1+p, #global-ux .form h2+p { margin-top: -35px; } } #global-ux .form input[type="text"], #global-ux .form input[type="password"], #global-ux .form input[type="date"], #global-ux .form input[type="datetime"], #global-ux .form input[type="datetime-local"], #global-ux .form input[type="month"], #global-ux .form input[type="week"], #global-ux .form input[type="email"], #global-ux .form input[type="number"], #global-ux .form input[type="search"], #global-ux .form input[type="tel"], #global-ux .form input[type="time"], #global-ux .form input[type="url"], #global-ux .form input[type="color"], #global-ux .form select, #global-ux .form button, #global-ux .form textarea, #global-ux .form .select2-container { margin: 0; } #global-ux .form input[type="text"], #global-ux .form input[type="password"], #global-ux .form input[type="date"], #global-ux .form input[type="datetime"], #global-ux .form input[type="datetime-local"], #global-ux .form input[type="month"], #global-ux .form input[type="week"], #global-ux .form input[type="email"], #global-ux .form input[type="number"], #global-ux .form input[type="search"], #global-ux .form input[type="tel"], #global-ux .form input[type="time"], #global-ux .form input[type="url"], #global-ux .form input[type="color"], #global-ux .form textarea { border-color: #a8a8a8; } #global-ux .form .select2-container.select2-container-disabled .select2-choice { background-color: #ddd; border-color: #a8a8a8; } #global-ux .form .form-recaptchav2 { margin-bottom: 10px; } #global-ux .form div.form-textarea, #global-ux .form div.form-textfield, #global-ux .form div.form-dropdown, #global-ux .form div.form-recaptcha { margin-bottom: 25px; } @media only screen and (min-width: 48em) { #global-ux .form div.form-textarea, #global-ux .form div.form-textfield, #global-ux .form div.form-dropdown, #global-ux .form div.form-recaptcha { margin-bottom: 42px; } } #global-ux .form div.fieldsGroup { display: block; } #global-ux .form div.fieldsGroup:after { content: ""; display: table; clear: both; } #global-ux .form div.fieldsGroup .form-fields-group { padding: 28px 0 24px; float: left; width: 100%; position: relative; } #global-ux .form div.fieldsGroup .form-fields-group:before, #global-ux .form div.fieldsGroup .form-fields-group:after { content: " "; position: absolute; left: 0; width: 15px; float: left; height: 15px; bottom: -5px; background: #fff; } #global-ux .form div.fieldsGroup .form-fields-group:after { left: auto; right: 0; } #global-ux .form div.fieldsGroup .form-fields-group>.richtext { float: left; width: 100%; } @media only screen and (min-width: 48em) { #global-ux .form div.fieldsGroup .form-fields-group { padding: 60px 0 35px; } } #global-ux .form div.fieldsGroup:last-child .form-fields-group { border-bottom: none; } #global-ux .form div.fieldsGroup.last .form-fields-group { border: none; padding-bottom: 0; } #global-ux .form div.fieldsGroup.last .form-fields-group:before, #global-ux .form div.fieldsGroup.last .form-fields-group:after { display: none; } #global-ux .form span.title { display: block; margin: 0; padding: 0 0 9px; color: #868686; } #global-ux .form input, #global-ux .form select, #global-ux .form .postfix, #global-ux .form .prefix { font-size: 12px; font-size: .75rem; padding: 0 20px; border-radius: 2px; height: 46px; } #global-ux .form input.error, #global-ux .form select.error, #global-ux .form .postfix.error, #global-ux .form .prefix.error { border-color: #972637; color: #972637; } #global-ux .form input:focus, #global-ux .form input.valid, #global-ux .form select:focus, #global-ux .form select.valid, #global-ux .form .postfix:focus, #global-ux .form .postfix.valid, #global-ux .form .prefix:focus, #global-ux .form .prefix.valid { border-color: #2d96cd; background-color: #fff; } #global-ux .form .postfix { border-top-left-radius: 0; border-bottom-left-radius: 0; } #global-ux .form .prefix { border-top-right-radius: 0; border-bottom-right-radius: 0; } #global-ux .form select { padding: 12px 20px; color: #7d7d7d; } #global-ux .form select.valid { color: #2d96cd; } #global-ux .form textarea { min-height: 90px; padding: 12px 20px; color: #7d7d7d; } #global-ux .form textarea.valid { color: #2d96cd; } #global-ux .form hr { border: none; background: #adadad; height: 1px; } @media screen and (max-width: 1024px) and (min-width: 768px) { #global-ux .form .large-3, #global-ux .form .large-4 { width: 50%; } } @media screen and (max-width: 1024px) and (min-width: 768px) { #global-ux .form .large-8 { width: 100%; } } #global-ux .form .form-checkbox { margin: 0; padding-top: 8px; padding-bottom: 8px; } #global-ux .form .form-checkbox label { font-size: 12px; font-size: .75rem; font-weight: 300; } #global-ux .form .form-checkbox label.disabled:before { border: 1px solid #ccc; } @media only screen and (min-width: 48em) { #global-ux .form .form-checkbox { padding-top: 12px; padding-bottom: 12px; } #global-ux .form .form-checkbox label { font-size: 14px; font-size: .875rem; font-weight: normal; } } #global-ux .form .form-textarea small.hint, #global-ux .form .form-textfield small.hint, #global-ux .form .form-dropdown small.hint { font-size: 11px; font-size: .6875rem; color: #868686; font-weight: 400; padding-top: 6px; display: block; text-transform: none; } #global-ux .form .textfield-email.null-email input { font-size: 0; color: #fff; } #global-ux .form .form-submit { width: 100%; padding-top: 15px; } @media only screen and (min-width: 48em) { #global-ux .form .form-submit { width: auto; padding-top: 5px; } } #global-ux .form .form-cancel { width: 100%; padding-top: 40px; } #global-ux .form .form-cancel .cta-button { padding: 14px 40px; padding: .875rem 2.5rem; } @media only screen and (min-width: 48em) { #global-ux .form .form-cancel { width: auto; padding-top: 5px; } } #global-ux .form .checkbox+.recaptcha .form-recaptcha { padding-top: 30px; } @media only screen and (min-width: 48em) { #global-ux .form .checkbox+.recaptcha .form-recaptcha { padding-top: 30px; } } #global-ux .form .checkbox+.richtext { padding-top: 10px; } #global-ux .form .checkbox+.richtext, #global-ux .form .checkbox+.richtext p { font-size: 12px; font-size: .75rem; font-weight: 300; line-height: 1.5; } @media only screen and (min-width: 48em) { #global-ux .form .checkbox+.richtext { padding-top: 12px; } #global-ux .form .checkbox+.richtext, #global-ux .form .checkbox+.richtext p { font-size: 14px; font-size: .875rem; } } #global-ux .form .recaptcha .form-recaptcha .input-field { display: inline-block; width: 55%; } @media only screen and (min-width: 48em) { #global-ux .form .recaptcha .form-recaptcha .input-field { width: 100%; } } #global-ux .form .recaptcha .form-recaptcha .input-field .captcha-refresh { color: #008CBA; } #global-ux .form .recaptcha .form-recaptcha .input-field .captcha-wrap { position: absolute; bottom: 8px; left: 100%; width: 100%; height: 30px; } #global-ux .form .recaptcha .form-recaptcha .input-field .captcha-wrap img { width: auto; height: 30px; } #global-ux .form .recaptcha .form-recaptcha input[type="text"] { width: 100%; } #global-ux .form .recaptcha .form-recaptcha #errRecaptcha.invalid { font-size: 11px; font-size: .6875rem; color: #f34c32; font-weight: normal; padding: 6px 0 0 0; display: block; } #global-ux .form label, #global-ux .form .input-field, #global-ux .form .area-field { display: block; position: relative; color: #616161; } #global-ux .form label.error:before, #global-ux .form .error.input-field:before, #global-ux .form .error.area-field:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #global-ux .form label.error:before, #global-ux .form .error.input-field:before, #global-ux .form .error.area-field:before { content: "\e623"; font-size: 1.15rem; color: #972637; position: absolute; top: auto; right: 12px; right: .75rem; bottom: 38px; bottom: 2.375rem; } #global-ux .form label.valid:before, #global-ux .form .valid.input-field:before, #global-ux .form .valid.area-field:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #global-ux .form label.valid:before, #global-ux .form .valid.input-field:before, #global-ux .form .valid.area-field:before { content: "\e602"; font-size: 20px; font-size: 1.25rem; color: #2d96cd; position: absolute; top: auto; right: 12px; right: .75rem; bottom: 13px; bottom: .8125rem; } #global-ux .form label.error:not(label), #global-ux .form .error.input-field:not(label), #global-ux .form .error.area-field:not(label), #global-ux .form label small.error, #global-ux .form .input-field small.error, #global-ux .form .area-field small.error, #global-ux .form label span.error, #global-ux .form .input-field span.error, #global-ux .form .area-field span.error { font-size: 11px; font-size: .6875rem; font-style: normal; background: transparent; color: #f34c32; padding: 6px 0 0 0; margin: 0; text-transform: none; } #global-ux .form label.error input[type="text"], #global-ux .form .error.input-field input[type="text"], #global-ux .form .error.area-field input[type="text"], #global-ux .form label.error input[type="password"], #global-ux .form .error.input-field input[type="password"], #global-ux .form .error.area-field input[type="password"], #global-ux .form label.error input[type="date"], #global-ux .form .error.input-field input[type="date"], #global-ux .form .error.area-field input[type="date"], #global-ux .form label.error input[type="datetime"], #global-ux .form .error.input-field input[type="datetime"], #global-ux .form .error.area-field input[type="datetime"], #global-ux .form label.error input[type="datetime-local"], #global-ux .form .error.input-field input[type="datetime-local"], #global-ux .form .error.area-field input[type="datetime-local"], #global-ux .form label.error input[type="month"], #global-ux .form .error.input-field input[type="month"], #global-ux .form .error.area-field input[type="month"], #global-ux .form label.error input[type="week"], #global-ux .form .error.input-field input[type="week"], #global-ux .form .error.area-field input[type="week"], #global-ux .form label.error input[type="email"], #global-ux .form .error.input-field input[type="email"], #global-ux .form .error.area-field input[type="email"], #global-ux .form label.error input[type="number"], #global-ux .form .error.input-field input[type="number"], #global-ux .form .error.area-field input[type="number"], #global-ux .form label.error input[type="search"], #global-ux .form .error.input-field input[type="search"], #global-ux .form .error.area-field input[type="search"], #global-ux .form label.error input[type="tel"], #global-ux .form .error.input-field input[type="tel"], #global-ux .form .error.area-field input[type="tel"], #global-ux .form label.error input[type="time"], #global-ux .form .error.input-field input[type="time"], #global-ux .form .error.area-field input[type="time"], #global-ux .form label.error input[type="url"], #global-ux .form .error.input-field input[type="url"], #global-ux .form .error.area-field input[type="url"], #global-ux .form label.error input[type="color"], #global-ux .form .error.input-field input[type="color"], #global-ux .form .error.area-field input[type="color"], #global-ux .form label.error textarea, #global-ux .form .error.input-field textarea, #global-ux .form .error.area-field textarea, #global-ux .form label.valid input[type="text"], #global-ux .form .valid.input-field input[type="text"], #global-ux .form .valid.area-field input[type="text"], #global-ux .form label.valid input[type="password"], #global-ux .form .valid.input-field input[type="password"], #global-ux .form .valid.area-field input[type="password"], #global-ux .form label.valid input[type="date"], #global-ux .form .valid.input-field input[type="date"], #global-ux .form .valid.area-field input[type="date"], #global-ux .form label.valid input[type="datetime"], #global-ux .form .valid.input-field input[type="datetime"], #global-ux .form .valid.area-field input[type="datetime"], #global-ux .form label.valid input[type="datetime-local"], #global-ux .form .valid.input-field input[type="datetime-local"], #global-ux .form .valid.area-field input[type="datetime-local"], #global-ux .form label.valid input[type="month"], #global-ux .form .valid.input-field input[type="month"], #global-ux .form .valid.area-field input[type="month"], #global-ux .form label.valid input[type="week"], #global-ux .form .valid.input-field input[type="week"], #global-ux .form .valid.area-field input[type="week"], #global-ux .form label.valid input[type="email"], #global-ux .form .valid.input-field input[type="email"], #global-ux .form .valid.area-field input[type="email"], #global-ux .form label.valid input[type="number"], #global-ux .form .valid.input-field input[type="number"], #global-ux .form .valid.area-field input[type="number"], #global-ux .form label.valid input[type="search"], #global-ux .form .valid.input-field input[type="search"], #global-ux .form .valid.area-field input[type="search"], #global-ux .form label.valid input[type="tel"], #global-ux .form .valid.input-field input[type="tel"], #global-ux .form .valid.area-field input[type="tel"], #global-ux .form label.valid input[type="time"], #global-ux .form .valid.input-field input[type="time"], #global-ux .form .valid.area-field input[type="time"], #global-ux .form label.valid input[type="url"], #global-ux .form .valid.input-field input[type="url"], #global-ux .form .valid.area-field input[type="url"], #global-ux .form label.valid input[type="color"], #global-ux .form .valid.input-field input[type="color"], #global-ux .form .valid.area-field input[type="color"], #global-ux .form label.valid textarea, #global-ux .form .valid.input-field textarea, #global-ux .form .valid.area-field textarea { padding-right: 45px; } #global-ux .form label { font-size: 12px; font-size: .75rem; font-weight: 700; } #global-ux .form label input, #global-ux .form label .postfix, #global-ux .form label .prefix, #global-ux .form label select, #global-ux .form label textarea { margin-top: .5rem; color: #616161; font-size: 14px; font-size: .875rem; font-weight: 200; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; } #global-ux .form label input:focus, #global-ux .form label .postfix:focus, #global-ux .form label .prefix:focus, #global-ux .form label select:focus, #global-ux .form label textarea:focus { border-color: #2d96cd; } @media screen and (max-width: 767px) { #global-ux .form label input, #global-ux .form label .postfix, #global-ux .form label .prefix, #global-ux .form label select, #global-ux .form label textarea { font-size: 16px; font-size: 1rem; } } #global-ux .form .input-field.error, #global-ux .form .area-field.error { padding-top: 0 !important; } #global-ux .form .input-field.error:before, #global-ux .form .area-field.error:before { bottom: 50%; margin-bottom: -9px; } #global-ux .form .input-field.valid, #global-ux .form .area-field.valid { padding-top: 0 !important; } #global-ux .form .input-field.valid:before, #global-ux .form .area-field.valid:before { bottom: 50%; margin-bottom: -10px; } #global-ux .form fieldset { margin: 0; padding: 0; } #global-ux .form input[type="checkbox"], #global-ux .form input[type="radio"] { opacity: 0; display: block; height: 0; margin: 0; padding: 0; width: 0; } #global-ux .form input[type="checkbox"]+label, #global-ux .form input[type="checkbox"]+.error+label, #global-ux .form input[type="radio"]+label, #global-ux .form input[type="radio"]+.error+label { padding-left: 2rem; } #global-ux .form input[type="checkbox"]+label:before, #global-ux .form input[type="checkbox"]+.error+label:before, #global-ux .form input[type="radio"]+label:before, #global-ux .form input[type="radio"]+.error+label:before { display: -moz-inline-stack; display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; content: ""; position: absolute; width: 1rem; height: 1rem; margin-right: .625rem; border: 1px solid #A8A8A8; vertical-align: middle; margin-left: -2rem; margin-top: 1px; } #global-ux .form input[type="checkbox"]:checked+label:before, #global-ux .form input[type="checkbox"]:checked+.error+label:before, #global-ux .form input[type="radio"]:checked+label:before, #global-ux .form input[type="radio"]:checked+.error+label:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #global-ux .form input[type="checkbox"]:checked+label:before, #global-ux .form input[type="checkbox"]:checked+.error+label:before, #global-ux .form input[type="radio"]:checked+label:before, #global-ux .form input[type="radio"]:checked+.error+label:before { font-size: 9px; font-size: .5625rem; font-weight: normal; width: 1rem; height: 1rem; padding-top: .125rem; background-color: #2d96cd; border: 1px solid #2d96cd; color: #fff; text-align: center; } #global-ux .form input[type="checkbox"].checked-parent+label, #global-ux .form input[type="checkbox"].checked-parent+.error+label, #global-ux .form input[type="radio"].checked-parent+label, #global-ux .form input[type="radio"].checked-parent+.error+label { padding-left: 2rem; } #global-ux .form input[type="checkbox"].checked-parent+label:before, #global-ux .form input[type="checkbox"].checked-parent+.error+label:before, #global-ux .form input[type="radio"].checked-parent+label:before, #global-ux .form input[type="radio"].checked-parent+.error+label:before { display: -moz-inline-stack; display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; content: ""; position: absolute; width: 1rem; height: 1rem; margin-right: .625rem; border: 1px solid #A8A8A8; vertical-align: middle; margin-left: -2rem; margin-top: 1px; background: transparent; } #global-ux .form input[type="checkbox"].un-checked-parent+label:before, #global-ux .form input[type="checkbox"].un-checked-parent+.error+label:before, #global-ux .form input[type="radio"].un-checked-parent+label:before, #global-ux .form input[type="radio"].un-checked-parent+.error+label:before { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #global-ux .form input[type="checkbox"].un-checked-parent+label:before, #global-ux .form input[type="checkbox"].un-checked-parent+.error+label:before, #global-ux .form input[type="radio"].un-checked-parent+label:before, #global-ux .form input[type="radio"].un-checked-parent+.error+label:before { font-size: 9px; font-size: .5625rem; font-weight: normal; width: 1rem; height: 1rem; padding-top: .125rem; background-color: #2d96cd; border: 1px solid #2d96cd; color: #fff; text-align: center; } #global-ux .form .form-checkbox { overflow: hidden; } #global-ux .form .form-checkbox input[type="checkbox"] { position: absolute; } #global-ux .form .form-checkbox fieldset { padding: 0; border: 0; } #global-ux .form .form-checkbox small.error { font-size: 11px; font-size: .6875rem; font-style: normal; background: transparent; color: #f34c32; padding: 6px 0 0 32px; margin: 0; } #global-ux .form .form-checkbox .error input[type="checkbox"]+label:before { border-color: #972637; } #global-ux .form input[type="radio"]+label:before { border-radius: 50%; content: " "; position: relative; margin: -2px 10px 0px 0px; display: inline-block; height: 12px; width: 12px; border: 1px solid #1b394e; } #global-ux .form input[type="radio"]:checked+label:before { font-size: 12px; font-size: .75rem; font-weight: normal; background-color: #1b394e; } #global-ux .form .form-radioButtons.radio-button { margin-bottom: 2.625rem; } #global-ux .form .form-radioButtons.radio-button .config label.error, #global-ux .form .form-radioButtons.radio-button .config label.valid { clear: both; position: static; cursor: default; } #global-ux .form .form-radioButtons.radio-button .config label.error:before, #global-ux .form .form-radioButtons.radio-button .config label.valid:before { top: 2px; top: .125rem; right: 22px; right: 1.375rem; } #global-ux .form .form-radioButtons.radio-button .config small.error { font-size: 11px; font-size: .6875rem; clear: both; font-style: normal; background: transparent; color: #f34c32; padding-left: 0; } #global-ux .form .form-radioButtons.radio-button .config ul { padding-top: .3125rem; padding-left: 0; margin: 0; list-style-type: none; display: block; } #global-ux .form .form-radioButtons.radio-button .config ul:after { content: ""; display: table; clear: both; } #global-ux .form .form-radioButtons.radio-button .config ul li { float: left; margin-right: 3.125rem; } #global-ux .form .form-radioButtons.radio-button .config label { display: inline-block; cursor: pointer; position: relative; padding-left: 1.875rem; } #global-ux .form .form-radioButtons.radio-button .config label:before { content: ""; display: inline-block; width: 1.375rem; height: 1.375rem; margin-right: .625rem; position: absolute; left: 0; bottom: -2px; border: solid 2px #2d96cd; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%; } #global-ux .form .form-radioButtons.radio-button .config input[type=radio]:checked ~ label:before { background-color: #2d96cd; border: none; } #global-ux .form .cta-button { margin-left: 0; margin-right: 0; } #global-ux .form input:focus ~ label { outline: none; } #global-ux .form div.form-radioButtons.buttons { margin-bottom: 12px; } @media only screen and (min-width: 48em) { #global-ux .form div.form-radioButtons.buttons { margin-bottom: 30px; } } #global-ux .form div.form-radioButtons.buttons input[type="radio"] { position: absolute; left: -9999px; } #global-ux .form div.form-radioButtons.buttons input[type="radio"]+label:before { display: none; } #global-ux .form div.form-radioButtons.buttons>label { padding-right: 48px; padding-right: 3rem; } #global-ux .form div.form-radioButtons.buttons label.error, #global-ux .form div.form-radioButtons.buttons label.valid { clear: both; position: static; cursor: default; } #global-ux .form div.form-radioButtons.buttons label.error:before, #global-ux .form div.form-radioButtons.buttons label.valid:before { top: 2px; top: .125rem; right: 22px; right: 1.375rem; } #global-ux .form div.form-radioButtons.buttons small.error { font-size: 11px; font-size: .6875rem; clear: both; font-style: normal; background: transparent; color: #f34c32; padding-left: 0; } #global-ux .form div.form-radioButtons.buttons ul { padding-top: 1rem; padding-left: 0; margin: 0; list-style-type: none; display: block; } #global-ux .form div.form-radioButtons.buttons ul:after { content: ""; display: table; clear: both; } #global-ux .form div.form-radioButtons.buttons ul li { display: block; width: 48%; float: left; margin: 0 0 13px; } @media only screen and (max-width: 30em) { #global-ux .form div.form-radioButtons.buttons ul li { width: 100%; } } #global-ux .form div.form-radioButtons.buttons ul li:nth-child(2n) { margin-left: 4%; } @media only screen and (max-width: 30em) { #global-ux .form div.form-radioButtons.buttons ul li:nth-child(2n) { margin-left: 0; } } #global-ux .form div.form-radioButtons.buttons ul label { -webkit-transition: 0.3s ease-out; -moz-transition: 0.3s ease-out; -ms-transition: 0.3s ease-out; -o-transition: 0.3s ease-out; transition: 0.3s ease-out; font-weight: 300; font-size: 16px; font-size: 1rem; display: block; height: auto; width: auto; line-height: 24px; padding: 13px 40px; background: #fff; color: #2d96cd; border-radius: 1px; border: solid 1px #2d96cd; text-align: center; align-items: center; justify-content: center; white-space: normal; } #global-ux .form div.form-radioButtons.buttons ul label:hover, #global-ux .form div.form-radioButtons.buttons ul input[type="radio"]:checked+label { background: #2d96cd; border: solid 1px #2d96cd; color: white; } @media only screen and (min-width: 48em) { #global-ux .form div.form-radioButtons.buttons ul li, #global-ux .form div.form-radioButtons.buttons ul li:nth-child(2n) { min-width: 270px; min-width: 16.875rem; margin: 0 20px 13px 0; margin: 0 1.25rem .8125rem 0; width: auto; } #global-ux .form div.form-radioButtons.buttons ul label { padding: 16px 40px; } } #global-ux .form div.fieldsGroup .form-fields-group.group-disabled { padding-top: 0; margin-bottom: 35px; } @media only screen and (min-width: 48em) { #global-ux .form div.fieldsGroup .form-fields-group.group-disabled { padding-top: 0; margin-bottom: 24px; } } #global-ux .form-checkbox-carousel { float: left; width: 100%; display: block; position: relative; background: #fff; overflow: hidden; } @media only screen and (max-width: 47.9375em) { #global-ux .form-checkbox-carousel.full-image .flex-viewport { width: 100%; } #global-ux .form-checkbox-carousel.full-image .flex-viewport.end { margin-left: 0; } } #global-ux .form-checkbox-carousel .flex-viewport { float: left; width: 100%; -webkit-transition: margin 0.8s linear; -moz-transition: margin 0.8s linear; -ms-transition: margin 0.8s linear; -o-transition: margin 0.8s linear; transition: margin 0.8s linear; margin: 0; } @media only screen and (max-width: 47.9375em) { #global-ux .form-checkbox-carousel .flex-viewport { width: 120%; } #global-ux .form-checkbox-carousel .flex-viewport.end { margin-left: -20%; } #global-ux .form-checkbox-carousel.not-hidden-item .flex-viewport { width: 100%; margin-left: 0; } } #global-ux .form-checkbox-carousel .carousel { outline-width: 0; overflow: hidden; display: block; position: relative; padding: 0 0 30px 0; padding: 0 0 1.875rem 0; } @media only screen and (min-width: 48em) { #global-ux .form-checkbox-carousel .carousel { padding: 0 0 100px 0; padding: 0 0 6.25rem 0; } } #global-ux .form-checkbox-carousel .carousel .carousel-slide { color: #000; } #global-ux .form-checkbox-carousel .carousel .carousel-slide * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } #global-ux .form-checkbox-carousel .carousel .carousel-slide *:before, #global-ux .form-checkbox-carousel .carousel .carousel-slide *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #global-ux .form-checkbox-carousel .carousel .carousel-slide .item-wrap { padding: 0 15px; padding: 0 .9375rem; display: block; } #global-ux .form-checkbox-carousel .carousel .carousel-slide .item-content { display: block; padding: 16px; cursor: pointer; border: 1px solid #fff; } #global-ux .form-checkbox-carousel .carousel .carousel-slide .item-content:hover { padding: 10px 10px 9px; border: 1px solid #2e97d0; } #global-ux .form-checkbox-carousel .carousel .carousel-slide .img { display: block; margin: 0 0 15px; text-align: center; } #global-ux .form-checkbox-carousel .carousel .carousel-slide label { font-size: 11px; font-size: .6875rem; padding: 0 0 0 22px; position: relative; display: block; overflow: hidden; font-weight: 300; text-transform: uppercase; color: #000; } #global-ux .form-checkbox-carousel .carousel .carousel-slide label input { position: absolute; left: -9999px; top: -9999px; } #global-ux .form-checkbox-carousel .carousel .carousel-slide label:before { width: 14px; height: 14px; border: 1px solid #2e97d0; float: left; position: absolute; left: 0; top: 0; content: " "; text-indent: -9999px; overflow: hidden; } #global-ux .form-checkbox-carousel .carousel .carousel-slide label.checked:before { background: #2e97d0; } #global-ux .form-checkbox-carousel .carousel .carousel-slide label.checked:after { font-family: "icomoon"; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-rendering: auto; text-transform: none; vertical-align: middle; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #global-ux .form-checkbox-carousel .carousel .carousel-slide label.checked:after { font-size: 9px; color: #fff; position: absolute; left: 1px; top: 2px; z-index: 2; } @media only screen and (min-width: 48em) { #global-ux .form-checkbox-carousel .carousel .carousel-slide .item-wrap { padding: 0 15px; padding: 0 .9375rem; } #global-ux .form-checkbox-carousel .carousel .carousel-slide .item-content { display: block; padding: 26px 26px 16px; -webkit-transition: all 0.1s ease-in !important; -moz-transition: all 0.1s ease-in !important; -ms-transition: all 0.1s ease-in !important; -o-transition: all 0.1s ease-in !important; transition: all 0.1s ease-in !important; } #global-ux .form-checkbox-carousel .carousel .carousel-slide .img { margin: 0 0 25px; } #global-ux .form-checkbox-carousel .carousel .carousel-slide label { font-size: 16px; font-size: 1rem; padding: 0 0 0 36px; } #global-ux .form-checkbox-carousel .carousel .carousel-slide label:before { width: 20px; height: 20px; } #global-ux .form-checkbox-carousel .carousel .carousel-slide label.checked:after { font-size: 12px; left: 2px; top: 3px; } } #global-ux .form-checkbox-carousel .carousel .carousel-arrows { display: none; } @media only screen and (min-width: 48em) { #global-ux .form-checkbox-carousel .carousel .carousel-arrows { -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; margin: -48px 0 0 0; margin: -3rem 0 0 0; display: block; position: absolute; z-index: 1; top: 50%; right: -100px; } #global-ux .form-checkbox-carousel .carousel .carousel-arrows .icon { line-height: 47px; } #global-ux .form-checkbox-carousel .carousel .carousel-arrows .carousel-btn { height: 47px; width: 47px; -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); display: block; border-radius: 0; border: none; background-color: #2d96cd; cursor: pointer; outline-width: 0; } #global-ux .form-checkbox-carousel .carousel .carousel-arrows .carousel-btn.darkened { background-color: rgba(0,0,0,0.5); } #global-ux .form-checkbox-carousel .carousel .carousel-arrows .carousel-btn .icon { color: #fff; display: block; text-align: center; } #global-ux .form-checkbox-carousel .carousel .carousel-arrows .carousel-btn+ul { display: -moz-inline-stack; display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; vertical-align: middle; } #global-ux .form-checkbox-carousel .carousel .carousel-arrows .carousel-btn:hover { background-color: #fff; } #global-ux .form-checkbox-carousel .carousel .carousel-arrows .carousel-btn:hover .icon { color: #2d96cd; } } #global-ux .form-checkbox-carousel .carousel:hover .carousel-arrows { right: 16px; } #global-ux .form-checkbox-carousel .carousel .carousel-controls { bottom: 5px; bottom: .3125rem; line-height: 12px; left: 0; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); display: block; width: 100%; position: absolute; right: auto; top: auto; margin: 0; z-index: 1; text-align: center; } #global-ux .form-checkbox-carousel .carousel .carousel-controls ol, #global-ux .form-checkbox-carousel .carousel .carousel-controls ul { line-height: 12px; } #global-ux .form-checkbox-carousel .carousel .carousel-controls li { margin: 0 6px; margin: 0 .375rem; line-height: 12px; vertical-align: top; } #global-ux .form-checkbox-carousel .carousel .carousel-controls li a { display: block; margin-top: 0; -webkit-box-sizing: content-box !important; -moz-box-sizing: content-box !important; box-sizing: content-box !important; } #global-ux .form-checkbox-carousel .carousel .carousel-controls li a:before, #global-ux .form-checkbox-carousel .carousel .carousel-controls li a:after { -webkit-box-sizing: content-box !important; -moz-box-sizing: content-box !important; box-sizing: content-box !important; } #global-ux .form-checkbox-carousel .carousel .carousel-controls li a.flex-active { margin: 0; -webkit-box-sizing: border-box !important; -moz-box-sizing: border-box !important; box-sizing: border-box !important; } #global-ux .form-checkbox-carousel .carousel .carousel-controls li a.flex-active:before, #global-ux .form-checkbox-carousel .carousel .carousel-controls li a.flex-active:after { -webkit-box-sizing: border-box !important; -moz-box-sizing: border-box !important; box-sizing: border-box !important; } @media only screen and (min-width: 48em) { #global-ux .form-checkbox-carousel .carousel .carousel-controls { bottom: 20px; bottom: 1.25rem; } } #global-ux .form-range-slider { margin-bottom: 35px; display: block; } @media only screen and (min-width: 48em) { #global-ux .form-range-slider { margin-bottom: 62px; } } #global-ux .form-range-slider .ui-helper-hidden { display: none; } #global-ux .form-range-slider .ui-helper-hidden-accessible { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } #global-ux .form-range-slider .ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; } #global-ux .form-range-slider .ui-helper-clearfix:before, #global-ux .form-range-slider .ui-helper-clearfix:after { content: ""; display: table; border-collapse: collapse; } #global-ux .form-range-slider .ui-helper-clearfix:after { clear: both; } #global-ux .form-range-slider .ui-helper-clearfix { min-height: 0; } #global-ux .form-range-slider .ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter: Alpha(Opacity=0); } #global-ux .form-range-slider .ui-front { z-index: 100; } #global-ux .form-range-slider .ui-state-disabled { cursor: default !important; } #global-ux .form-range-slider .ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; } #global-ux .form-range-slider .ui-widget-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; } #global-ux .form-range-slider .ui-slider { position: relative; text-align: left; } #global-ux .form-range-slider .ui-slider .ui-slider-handle { background: #5d94cb; width: 23px; height: 23px; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; color: #555555; font-weight: normal; position: absolute; z-index: 2; cursor: default; -ms-touch-action: none; touch-action: none; } #global-ux .form-range-slider .ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background: #ccc; } #global-ux .form-range-slider .ui-slider.ui-state-disabled .ui-slider-handle, #global-ux .form-range-slider .ui-slider.ui-state-disabled .ui-slider-range { filter: inherit; } #global-ux .form-range-slider .ui-slider-horizontal { height: 5px; } #global-ux .form-range-slider .ui-slider-horizontal .ui-slider-handle { top: -9px; margin-left: -9px; } #global-ux .form-range-slider .ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; } #global-ux .form-range-slider .ui-slider-horizontal .ui-slider-range-min { left: 0; } #global-ux .form-range-slider .ui-slider-horizontal .ui-slider-range-max { right: 0; } #global-ux .form-range-slider .ui-slider-vertical { width: 5px; height: 150px; } #global-ux .form-range-slider .ui-slider-vertical .ui-slider-handle { left: -9px; margin-left: 0; margin-bottom: -12px; } #global-ux .form-range-slider .ui-slider-vertical .ui-slider-range { left: 0; width: 100%; } #global-ux .form-range-slider .ui-slider-vertical .ui-slider-range-min { bottom: 0; } #global-ux .form-range-slider .ui-slider-vertical .ui-slider-range-max { top: 0; } #global-ux .form-range-slider .ui-widget-content { background: #f3f3f3; display: block; border: none; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; } #global-ux .form-range-slider .rs-wrap { position: relative; margin-top: 36px; } #global-ux .form-range-slider .rs-wrap .rs-txt { float: right; position: absolute; right: 0; top: 50%; margin: -10px 0 0 0; text-align: right; } #global-ux .form-range-slider .rs-wrap .range-slider-wrap { margin: 12px 9px; display: block; } #global-ux .form-range-slider.single-slider .range-slider-wrap .ui-slider-range+.ui-slider-handle { display: none !important; } #global-ux .form-range-slider .ui-corner-all { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; } .clearleft { clear: left; } #global-ux .form div.form-province-dropdown, #global-ux .form div.form-city-dropdown, #global-ux .form div.form-preferred-dealer-dropdown, #global-ux .form div.form-model-dropdown, #global-ux .form div.form-series-dropdown, #global-ux .form div.form-first-dropdown, #global-ux .form div.form-second-dropdown, #global-ux .form div.form-third-dropdown { margin-bottom: 42px; } #global-ux .form div.form-province-dropdown label select, #global-ux .form div.form-city-dropdown label select, #global-ux .form div.form-preferred-dealer-dropdown label select, #global-ux .form div.form-model-dropdown label select, #global-ux .form div.form-series-dropdown label select, #global-ux .form div.form-first-dropdown label select, #global-ux .form div.form-second-dropdown label select, #global-ux .form div.form-third-dropdown label select { margin-top: 0 !important; } #global-ux .form .form-group-input .richtext h1, #global-ux .form .form-group-input .richtext h2 { clear: both; } #global-ux .form .form-group-input .country-code-container { float: left; overflow: visible; width: 100%; } @media only screen and (min-width: 48em) { #global-ux .form .form-group-input .country-code-container { width: 50%; clear: left; } } #global-ux .form .form-group-input .country-code-container .dropdown { width: 35%; } @media only screen and (min-width: 48em) { #global-ux .form .form-group-input .country-code-container .dropdown { width: auto; } } #global-ux .form .form-group-input .country-code-container .dropdown select { margin-top: 0; } #global-ux .form .form-group-input .country-code-container .form-dropdown { padding-right: 0; } #global-ux .form .form-group-input .country-code-container .mobile-container { float: left; width: 65%; } @media only screen and (min-width: 48em) { #global-ux .form .form-group-input .country-code-container .mobile-container { float: none; width: auto; } } #global-ux .form .form-group-input .country-code-container .mobile-container .form-textfield { padding-left: 5px; width: 100%; } @media only screen and (min-width: 48em) { #global-ux .form .form-group-input .country-code-container .mobile-container .form-textfield { width: 75%; } } #global-ux .form .form-group-input .country-code-container .mobile-container .title { transform: translate(-54%, 0); } @media only screen and (min-width: 48em) { #global-ux .form .form-group-input .country-code-container .mobile-container .title { transform: translate(-32%, 0); } } #global-ux .form div.fieldsGroup .form-fields-group { margin-bottom: 20px; } #global-ux .preferredDealerdropdown .column+.column:last-child, #global-ux .preferredDealerdropdown .columns+.column:last-child, #global-ux .preferredDealerdropdown .column+.columns:last-child, #global-ux .preferredDealerdropdown .columns+.columns:last-child, #global-ux .dropdownCustomize .column+.column:last-child, #global-ux .dropdownCustomize .columns+.column:last-child, #global-ux .dropdownCustomize .column+.columns:last-child, #global-ux .dropdownCustomize .columns+.columns:last-child, #global-ux .dropdownCustomizemap .column+.column:last-child, #global-ux .dropdownCustomizemap .columns+.column:last-child, #global-ux .dropdownCustomizemap .column+.columns:last-child, #global-ux .dropdownCustomizemap .columns+.columns:last-child, #global-ux .dropdownDynamic .column+.column:last-child, #global-ux .dropdownDynamic .columns+.column:last-child, #global-ux .dropdownDynamic .column+.columns:last-child, #global-ux .dropdownDynamic .columns+.columns:last-child, #global-ux .modelSeriesdropdown .column+.column:last-child, #global-ux .modelSeriesdropdown .columns+.column:last-child, #global-ux .modelSeriesdropdown .column+.columns:last-child, #global-ux .modelSeriesdropdown .columns+.columns:last-child { float: left; } #global-ux .input-field.hidden-field-validation { height: 0 !important; overflow: hidden !important; } #global-ux .input-field.hidden-field-validation.error { height: auto !important; overflow: inherit !important; } body .select2-results .select2-result-label { text-transform: none !important; } .select2-search input { background: #fafafa !important; } @media only screen and (-webkit-min-device-pixel-ratio: 1.5) { .select2-search input { background: #fafafa !important; } .select2-search input:focus { background: #fafafa !important; } } #global-ux .error-msg-sa { margin-top: 10px; display: none; color: #f34c32; font-size: 11px; font-size: .6875rem; } #global-ux .error-msg-sa .columns { padding: 0; } #global-ux .pt30 { padding-top: 30px; } #global-ux .email-confirmation-wrap { color: #fff; font-size: 16px; font-size: 1rem; font-weight: 200; text-align: center; z-index: 9999999; float: left; left: 0; top: 0; } #global-ux .email-confirmation-wrap.hidden-msg { display: none; visibility: hidden; } #global-ux .email-confirmation-wrap .email-confirmation-bg { float: left; width: 100%; height: 100%; background: #000; position: absolute; left: 0; top: 0; z-index: 1; opacity: 0.8 !important; filter: alpha(opacity=80); } #global-ux .email-confirmation-wrap .email-confirmation { float: left; width: 100%; left: 0; bottom: 0; text-align: center; -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -o-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); padding: 50px 25px; position: absolute; z-index: 2; } #global-ux .email-confirmation-wrap .email-confirmation h4 { color: #fff; border-bottom: none !important; margin: 0 !important; padding: 20px 0 !important; } #global-ux .email-confirmation-wrap .email-confirmation p { color: #fff; font-size: 16px; font-size: 1rem; } #global-ux .email-confirmation-wrap .email-confirmation .cta-button { font-size: 16px; font-size: 1rem; line-height: 2; padding: 12px 40px; font-weight: 300; margin: 0; border: none; min-width: 265px; } #global-ux .email-confirmation-wrap .email-confirmation .cta-button+.cta-button { margin: 25px 0 0; } #global-ux .email-confirmation-wrap .email-confirmation .cta-transparent { border: none; color: #2596cf; } @media only screen and (min-width: 48em) { #global-ux .email-confirmation-wrap { font-size: 18px; font-size: 1.125rem; } #global-ux .email-confirmation-wrap .email-confirmation { padding: 60px 0; } #global-ux .email-confirmation-wrap .email-confirmation .cancel-content { display: block; max-width: 680px; margin: 0 auto; } #global-ux .email-confirmation-wrap .email-confirmation .cancel-content:after { content: ""; display: table; clear: both; } #global-ux .email-confirmation-wrap .email-confirmation p { font-size: 18px; font-size: 1.125rem; margin: 0 0 10px; } #global-ux .email-confirmation-wrap .email-confirmation .cta-button { margin: 0 15px; } #global-ux .email-confirmation-wrap .email-confirmation .cta-button+.cta-button { margin: 0 15px; } #global-ux .email-confirmation-wrap .email-confirmation .cta-button.disabled { cursor: pointer; } } #global-ux .form-textfield.addressfield label { width: 100%; } #global-ux .form-textfield.addressfield .address-wrap { overflow: hidden; display: block; position: relative; padding-right: 150px; } #global-ux .form-textfield.addressfield .address-wrap:after { content: ""; display: table; clear: both; } #global-ux .form-textfield.addressfield .address-wrap .cta-button { width: 140px; height: auto; float: left; min-width: 0; margin: 0; padding: 6px 10px; position: absolute; right: 0; top: 0; white-space: nowrap; text-align: center; overflow: hidden; } #global-ux .form-textfield.addressfield .daum_post_wrap { border: 1px solid; width: 500px; height: 300px; margin: 0; position: absolute; z-index: 10; left: 0; top: 56px; } #global-ux .form-textfield.addressfield .daum_post_wrap img { width: 16px; } #global-ux .form-textfield.addressfield .input_container input[type="text"] { margin: 10px 0 0 0; } @media screen and (max-width: 47.9375em) { #global-ux .form-textfield.addressfield .address-wrap .cta-button { font-size: 16px; font-size: 1rem; } #global-ux .form-textfield.addressfield .daum_post_wrap { width: 310px; } #global-ux .form-textfield.addressfield .daum_post_wrap .post_search .placeholder { max-width: 75%; overflow: hidden; white-space: nowrap; } } .ie8 #global-ux .form { padding: 35px 60px 90px; } .ie8 #global-ux .form .richtext.first hr { margin-left: -60px; margin-right: -60px; } .ie8 #global-ux .form .richtext.first h1 { margin-bottom: 42px; } .ie8 #global-ux .form .richtext.first h1+p { margin-top: -35px; } .ie8 #global-ux .form h1, .ie8 #global-ux .form h2 { font-size: 36px; margin-bottom: 40px; } .ie8 #global-ux .form h1+p, .ie8 #global-ux .form h2+p { margin-top: -35px; } .ie8 #global-ux .form div.form-textarea, .ie8 #global-ux .form div.form-textfield, .ie8 #global-ux .form div.form-dropdown, .ie8 #global-ux .form div.form-recaptcha { margin-bottom: 42px; } .ie8 #global-ux .form div.fieldsGroup .form-fields-group { padding: 60px 0 35px; } .ie8 #global-ux .form .form-checkbox { padding-top: 12px; padding-bottom: 12px; } .ie8 #global-ux .form .form-checkbox label { font-size: 14px; font-size: .875rem; font-weight: normal; } .ie8 #global-ux .form .form-checkbox input[type='checkbox'] { position: absolute; left: -9999px; top: -9999px; } .ie8 #global-ux .form .form-checkbox label.checked:before { font-family: "icomoon"; background: #2596cf; border-color: #2596cf; content: "\e603"; text-indent: 0; text-align: center; color: #fff; font-size: 10px; line-height: 14px; } .ie8 #global-ux .form .form-checkbox label.checked:after { display: none; } .ie8 #global-ux .form .form-submit { width: auto; padding-top: 5px; } .ie8 #global-ux .form .form-cancel { width: auto; padding-top: 5px; } .ie8 #global-ux .form .checkbox+.recaptcha .form-recaptcha { padding-top: 30px; } .ie8 #global-ux .form .checkbox+.richtext { padding-top: 12px; } .ie8 #global-ux .form .checkbox+.richtext, .ie8 #global-ux .form .checkbox+.richtext p { font-size: 14px; font-size: .875rem; } .ie8 #global-ux .form .recaptcha .form-recaptcha .input-field { width: 100%; } .ie8 #global-ux .form .recaptcha .form-recaptcha span.input-field.error input[name="recaptcha"].error { margin-top: 0px; } .ie8 #global-ux .form .recaptcha .form-recaptcha label small.error { color: #f34c32; background: #fff; font-size: 11px; font-style: normal; line-height: 16.5px; padding-top: 6px; } .ie8 #global-ux .form label input[type="text"], .ie8 #global-ux .form label input[type="password"] { line-height: 46px; } .ie8 #global-ux .form input[type="checkbox"], .ie8 #global-ux .form input[type="radio"] { width: 16px; height: 16px; margin-top: 1px; border: none; filter: alpha(opacity=100); opacity: 1; } .ie8 #global-ux .form input[type="checkbox"]+label, .ie8 #global-ux .form input[type="checkbox"]+.error+label, .ie8 #global-ux .form input[type="radio"]+label, .ie8 #global-ux .form input[type="radio"]+.error+label { padding-left: 32px; } .ie8 #global-ux .form input[type="checkbox"]+label:before, .ie8 #global-ux .form input[type="checkbox"]+.error+label:before, .ie8 #global-ux .form input[type="radio"]+label:before, .ie8 #global-ux .form input[type="radio"]+.error+label:before { margin-right: 10px; width: 16px; height: 16px; margin-left: -32px; } .ie8 #global-ux .form input[type="checkbox"]:checked+label:before, .ie8 #global-ux .form input[type="checkbox"]:checked+.error+label:before, .ie8 #global-ux .form input[type="radio"]:checked+label:before, .ie8 #global-ux .form input[type="radio"]:checked+.error+label:before { width: 16px; height: 16px; padding-top: 2px; } .ie8 #global-ux .form input[type="checkbox"]+label.active:before { font-family: "icomoon"; content: "\e603"; font-size: 9px; font-size: .5625rem; font-weight: normal; width: 16px; height: 16px; padding-top: .125rem; background-color: #2d96cd; border: 1px solid #2d96cd; color: #fff; text-align: center; } .ie8 #global-ux .form input[type="radio"]+label.active:before { content: " "; font-size: 12px; font-size: .75rem; font-weight: normal; background-color: #1b394e; } .ie8 #global-ux .form .form-radioButtons.radio-button input[type="radio"] { opacity: 0; display: inline-block; height: 0; margin: 0; padding: 0; width: 0; } .ie8 #global-ux .form .form-radioButtons.radio-button li input[type="hidden"]+label { padding-left: 25px; } .ie8 #global-ux .form .form-radioButtons.radio-button li label:before { content: ""; display: inline-block; width: 16px; height: 16px; margin-right: 16px; position: absolute; left: 0; bottom: 2px; top: 5px; border: solid 2px #2d96cd; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%; } .ie8 #global-ux .form .form-radioButtons.radio-button li input[type=radio]:checked+input[type="hidden"]+label:before { background-color: #2d96cd; border: none; } .ie8 #global-ux .form div.form-radioButtons.buttons { margin-bottom: 30px; } .ie8 #global-ux .form div.form-radioButtons.buttons ul label { padding: 16px 40px; } .ie8 #global-ux .form label.error:before, .ie8 #global-ux .form .error.input-field:before, .ie8 #global-ux .form .error.area-field:before { font-size: 18px; } .ie8 #global-ux .form .large-3 { width: 25%; } .ie8 #global-ux .form .large-4 { width: 33%; } .ie8 #global-ux .form .large-6 { width: 50%; } .ie8 #global-ux .form .large-9 { width: 75%; } .ie8 #global-ux .form .large-12 { width: 100%; } .ie8 #global-ux .form-checkbox-carousel .carousel { padding: 0 0 100px 0; padding: 0 0 6.25rem 0; } .ie8 #global-ux .form-checkbox-carousel .carousel .carousel-slide .item-wrap { padding: 0 15px; padding: 0 .9375rem; } .ie8 #global-ux .form-checkbox-carousel .carousel .carousel-slide .item-content { display: block; padding: 26px 26px 16px; } .ie8 #global-ux .form-checkbox-carousel .carousel .carousel-slide .item-content:hover { padding: 25px 25px 15px; } .ie8 #global-ux .form-checkbox-carousel .carousel .carousel-slide .img { margin: 0 0 25px; } .ie8 #global-ux .form-checkbox-carousel .carousel .carousel-slide label { font-size: 16px; font-size: 1rem; padding: 0 0 0 36px; } .ie8 #global-ux .form-checkbox-carousel .carousel .carousel-slide label:before { width: 20px; height: 20px; font-size: 14px; line-height: 18px; } .ie8 #global-ux .form-checkbox-carousel .carousel .carousel-slide label.checked:before { font-family: "icomoon"; content: "\e603"; text-indent: 0; color: #fff; } .ie8 #global-ux .form-checkbox-carousel .carousel .carousel-slide label.checked:after { display: none; } .ie8 #global-ux .form-checkbox-carousel .carousel .carousel-arrows { display: block; position: absolute; z-index: 1; top: 50%; right: -100px; margin: -120px 0 0 0; } .ie8 #global-ux .form-checkbox-carousel .carousel .carousel-arrows .icon { line-height: 47px; } .ie8 #global-ux .form-checkbox-carousel .carousel .carousel-arrows .carousel-btn { height: 74px; width: 74px; display: block; border-radius: 0; border: none; background-color: #2d96cd; cursor: pointer; outline-width: 0; height: 74px; width: 74px; } .ie8 #global-ux .form-checkbox-carousel .carousel .carousel-arrows .carousel-btn.darkened { background-color: #808080; } .ie8 #global-ux .form-checkbox-carousel .carousel .carousel-arrows .carousel-btn .icon { color: #fff; display: block; text-align: center; } .ie8 #global-ux .form-checkbox-carousel .carousel .carousel-arrows .carousel-btn+ul { display: -moz-inline-stack; display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; vertical-align: middle; } .ie8 #global-ux .form-checkbox-carousel .carousel .carousel-arrows .carousel-btn:hover { background-color: #fff; } .ie8 #global-ux .form-checkbox-carousel .carousel .carousel-arrows .carousel-btn:hover .icon { color: #2d96cd; } .ie8 #global-ux .form-checkbox-carousel .carousel .carousel-arrows .carousel-btn .icon { line-height: 74px; font-size: 62px; } .ie8 #global-ux .form-checkbox-carousel .carousel .carousel-controls { bottom: 20px; bottom: 1.25rem; } .ie8 #global-ux .form-checkbox-carousel .carousel:hover .carousel-arrows { right: 16px; } .ie8 #global-ux .form .recaptcha .form-recaptcha input[type="text"] { width: 100%; } .ie8 .select2-container .select2-choice:after { top: 13px; } .ie8 .select2-results { margin: 4px; padding: 0; display: block; } .ie8 #global-ux .form label { font-size: 18px; font-style: normal; } .ie8 #global-ux .form label span.title { font-size: 12px; } .ie8 #global-ux span.error, .ie8 #global-ux small.error { background: transparent; color: #f34c32; font-size: 0.6875rem; font-style: normal; margin: 0; padding: 6px 0 0; font-style: normal; } .ie9 .cancel .columns { left: -80px; } .rtl .select2-offscreen { left: auto; right: -10000px; } .rtl .select2-container .select2-choice { padding: 0 1.25rem 0 0; } .rtl .select2-container .select2-choice:after { right: auto; left: 12px; } .rtl .select2-container .select2-choice span { margin-left: 26px; margin-right: 0; } .rtl #global-ux .form-textfield, .rtl #global-ux .form-dropdown, .rtl #global-ux .form-textarea, .rtl #global-ux .form-recaptcha, .rtl #global-ux .form-submit, .rtl #global-ux .form-cancel, .rtl #global-ux .form-checkbox { float: right; clear: right; } .rtl #global-ux .form-cancel { clear: left; } .rtl #global-ux .form h1 { font-size: 42px; font-size: 2.625rem; } .rtl #global-ux .form .richtext { clear: both; } .rtl #global-ux .form .richtext p { font-size: 24px; font-size: 1.5rem; } .rtl #global-ux .form .richtext .richtext-read-more .desktop.hideForMobile p, .rtl #global-ux .form .richtext .richtext-read-more .mobile.show-mob-only p { text-align: right; line-height: 1.3; } .rtl #global-ux .form .form-group-input .country-code-container .mobile-container { float: right; } @media only screen and (min-width: 48em) { .rtl #global-ux .form .form-group-input .country-code-container .mobile-container { float: none; } } .rtl #global-ux .form .form-group-input .country-code-container .mobile-container .title { transform: none; white-space: nowrap; } .rtl #global-ux .form .form-group-input .country-code-container .dropdown { float: right; direction: ltr; } .rtl #global-ux .form .form-group-input .country-code-container .dropdown .select2-container .select2-choice span { margin-left: 50px; } @media only screen and (min-width: 48em) { .rtl #global-ux .form .form-group-input .country-code-container .dropdown { float: none; } } .rtl #global-ux .form label { font-size: 24px; font-size: 1.5rem; } .rtl #global-ux .form label input[type="text"], .rtl #global-ux .form label textarea { font-size: 20px; font-size: 1.25rem; } .rtl #global-ux .form label .error, .rtl #global-ux .form label .hint { font-size: 18px; font-size: 1.125rem; } .rtl #global-ux .form label.error:before { bottom: 3rem; } .rtl #global-ux .form .cta-button { font-size: 20px; font-size: 1.25rem; } .rtl #global-ux .form input[type="checkbox"]+label:before, .rtl #global-ux .form input[type="checkbox"]+.error+label:before, .rtl #global-ux .form input[type="radio"]+label:before, .rtl #global-ux .form input[type="radio"]+.error+label:before { position: relative; margin-right: 0; margin-left: 0.625rem; } .rtl #global-ux .form .recaptcha .form-recaptcha .captcha-wrap { left: auto; right: 100%; } .rtl #global-ux .form .recaptcha .form-recaptcha img { right: 100%; } .rtl #global-ux .form .form-checkbox-carousel .carousel .carousel-slide { float: right !important; } .rtl #global-ux .form .form-checkbox-carousel .carousel .carousel-slide label { padding: 0 36px 0 0; text-align: right; } @media only screen and (max-width: 47.9375em) { .rtl #global-ux .form .form-checkbox-carousel .carousel .carousel-slide label { padding: 0 20px 0 0; } } .rtl #global-ux .form .form-checkbox-carousel .carousel .carousel-slide label:before { left: auto; right: 0; text-align: right; } .rtl #global-ux .form .form-checkbox-carousel .carousel .carousel-slide label.checked:after { left: auto; right: 2px; } .rtl #global-ux .form .form-checkbox-carousel .carousel .carousel-arrows { right: auto !important; left: 0; } .rtl #global-ux .form .form-checkbox-carousel .carousel .carousel-arrows .icon-chevron-thin-right:before, .rtl #global-ux .form .form-checkbox-carousel .carousel .carousel-arrows .disclaimers .disclaimer-inner.accordian>h3:after, .rtl #global-ux .disclaimers .form .form-checkbox-carousel .carousel .carousel-arrows .disclaimer-inner.accordian>h3:after, .rtl #global-ux .form .form-checkbox-carousel .carousel .carousel-arrows .disclaimers .disclaimer-inner.accordian>h5:after, .rtl #global-ux .disclaimers .form .form-checkbox-carousel .carousel .carousel-arrows .disclaimer-inner.accordian>h5:after, .rtl #global-ux .form .form-checkbox-carousel .carousel .carousel-arrows .common-richtext a.link-chevron-thin:after, .rtl #global-ux .common-richtext .form .form-checkbox-carousel .carousel .carousel-arrows a.link-chevron-thin:after, .rtl #global-ux .form .form-checkbox-carousel .carousel .carousel-arrows .common-billboard a.link-chevron-thin:after, .rtl #global-ux .common-billboard .form .form-checkbox-carousel .carousel .carousel-arrows a.link-chevron-thin:after, .rtl #global-ux .form .form-checkbox-carousel .carousel .carousel-arrows .richtext .link-chevron-thin:after, .rtl #global-ux .richtext .form .form-checkbox-carousel .carousel .carousel-arrows .link-chevron-thin:after { content: "\e612"; } .rtl #global-ux .form .form-checkbox-carousel .carousel .carousel-arrows .icon-chevron-thin-left:before { content: "\e615"; } .rtl #global-ux .form .error .area-field:before { left: 12px; left: .75rem; right: auto; } .rtl #global-ux .form .form-radioButtons.buttons ul li { float: right; } .rtl #global-ux .form .form-radioButtons.buttons ul li:nth-child(2n) { margin-right: 4%; } @media only screen and (min-width: 48em) { .rtl #global-ux .form .form-radioButtons.buttons ul li, .rtl #global-ux .form .form-radioButtons.buttons ul li:nth-child(2n) { margin: 0 0 13px 20px; } } .rtl #global-ux .singleDropdown .form-dropdown { float: none; } .rtl #dealer-locator .dl-search .dl-search-field .input-field input[type="text"] { padding: 0 15px 0 70px; } .rtl #dealer-locator .dl-search .dl-search-field .input-field .search-submit { right: auto; left: 0; } .rtl #dealer-locator .dl-results .dl-results-header .dl-count h2 { text-align: right; padding: 0 28px 0 50px !important; } .rtl #dealer-locator .dl-results .dl-filter-toggle { right: auto; left: 0; text-align: right; } .rtl #dealer-locator .dl-results .dl-filter-toggle a { padding: 0 18px 0 65px; } .rtl #dealer-locator .dl-results .dl-filter-toggle a .icon-filter { position: absolute; left: 23px; top: 17px; padding: 0; } .rtl #dealer-locator .dl-results .dl-results-list .result .dl-telephone .icon-phone, .rtl #dealer-locator .dl-results .dl-results-list .dealer-details .dl-telephone .icon-phone { -ms-transform: scale(-1, 1); -webkit-transform: scale(-1, 1); transform: scale(-1, 1); } .rtl #dealer-locator .dl-results .dl-results-list .result .dl-distance, .rtl #dealer-locator .dl-results .dl-results-list .dealer-details .dl-distance { float: right; padding: 0 10px 0 0 !important; } .rtl #dealer-locator .dl-results .dl-results-list .result .dl-index, .rtl #dealer-locator .dl-results .dl-results-list .dealer-details .dl-index { float: right; } .rtl #dealer-locator .info-window .dl-telephone { position: relative; min-height: 28px; padding-right: 25px; } .rtl #dealer-locator .info-window .dl-telephone .icon-phone, .rtl #dealer-locator .info-window .dl-telephone .icon-fax { position: absolute; right: 0; top: 0; } .rtl #dealer-locator .info-window .dl-telephone .icon-phone { -ms-transform: scale(-1, 1); -webkit-transform: scale(-1, 1); transform: scale(-1, 1); margin: 0; right: -5px; top: -5px; } .rtl #dealer-locator .info-window .dl-telephone.dl-fax .icon-fax { margin: 0 !important; } .rtl #dealer-locator .info-window .dl-ctas a span { margin: 0 0 0 5px; } .rtl #dealer-locator .info-window .close-info-window { right: auto; left: -4px; } .rtl #dealer-locator .select-style select { background-position: 5% 60%; } .rtl #global-ux #dealer-locator .dl-distance-display { left: 62px; right: auto; } .rtl #global-ux #dealer-locator .accordian>h5::after { right: auto; left: 20px; } .rtl #global-ux #dealer-locator .accordian .accordian-content .clear-filter { right: auto; left: 0; } .rtl #global-ux #dealer-locator .accordian .accordian-content .filter-sub-title { text-align: right; } .rtl #global-ux #dealer-locator .filter-row input.custom-checkbox[type="checkbox"]+label { padding: 0 40px 0 0 !important; } .rtl #global-ux #dealer-locator .filter-row input.custom-checkbox[type="checkbox"]+label:after { left: auto; right: 0; } .rtl .email-confirmation-wrap .confirm-mobile-number span { display: inline-block; direction: ltr; } @media only screen and (max-width: 991px) { .rtl #dealer-locator .dl-results .dl-details, .rtl #dealer-locator .dl-results .dl-directions { right: -25px; } .rtl #dealer-locator .dl-results .dl-details .icon-details { left: -30px !important; } } @media only screen and (max-width: 767px) { .rtl #dealer-locator .dl-search .dl-search-field .input-field input[type="text"] { padding: 0 25px 0 75px; } } .country-code-dropdown-added .select2-drop { direction: ltr; } #global-ux .hotspots.section { margin: 20px 20px; background: #fff; box-shadow: 0 0 3px 1px rgba(0,0,0,0.15); } #global-ux .hotspots.section ul { margin-left: 0; list-style: none; } @media only screen and (min-width: 48em) { #global-ux .hotspots.section { box-shadow: none; background: none; } } #global-ux .hotspots.section .component-content { position: relative; } #global-ux .hotspots.section .hotspot-trigger { -webkit-transition: all 0.25s ease-out; -moz-transition: all 0.25s ease-out; -ms-transition: all 0.25s ease-out; -o-transition: all 0.25s ease-out; transition: all 0.25s ease-out; position: absolute; color: rgba(0,0,0,0.3); border-radius: 100px; width: 1.5625rem; height: 1.5625rem; line-height: 25px; font-size: 25px; font-size: 1.5625rem; font-weight: 300; margin-left: -12.5px; margin-top: -12.5px; text-align: center; box-shadow: 0 0 0 3px rgba(0,0,0,0.25); background-color: white; display: block; } #global-ux .hotspots.section .hotspot-trigger:after { content: '+'; display: inline-block; vertical-align: middle; position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } #global-ux .hotspots.section .hotspot-trigger.number { font-size: 18px; font-size: 1.125rem; } #global-ux .hotspots.section .hotspot-trigger.number:after { content: ''; } @media only screen and (max-width: 768px) { #global-ux .hotspots.section .hotspot-trigger.active { background-color: #2d96cd; color: #ffffff; } } @media only screen and (min-width: 48em) { #global-ux .hotspots.section .hotspot-trigger { width: 2.8125rem; height: 2.8125rem; line-height: 2.8125rem; } } @media only screen and (min-width: 62em) { #global-ux .hotspots.section .hotspot-trigger { width: 2.1875rem; height: 2.1875rem; line-height: 2.25rem; } } #global-ux .hotspots.section .popup { display: none; width: 16.0625rem; background: #fff; padding: .9375rem; border: solid 1px #dbdbdb; position: absolute; background: #fff; } #global-ux .hotspots.section .popup .title { font-size: 18px; font-size: 1.125rem; font-weight: 700; color: #1b394e; margin-bottom: .625rem; margin-top: .625rem; } #global-ux .hotspots.section .popup .title p { font-size: 18px; font-size: 1.125rem; font-weight: 700; color: #1b394e; margin-bottom: 0; } #global-ux .hotspots.section .popup .txt-content { font-size: 14px; font-size: .875rem; color: #86827b; line-height: 1.4375rem; } #global-ux .hotspots.section .popup .txt-content p { margin-bottom: 0; font-size: 14px; font-size: .875rem; color: #86827b; line-height: 1.4375rem; } #global-ux .hotspots.section .popup.left:after { content: ""; height: 0; width: 0; border-right: 1.25rem solid #fff; border-left: 1.25rem solid transparent; border-bottom: 1.25rem solid transparent; border-top: 1.25rem solid transparent; position: absolute; top: 50%; left: -2.5rem; -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); } #global-ux .hotspots.section .popup.left:before { content: ""; height: 0; width: 0; border-right: 1.3125rem solid #dbdbdb; border-left: 1.3125rem solid transparent; border-bottom: 1.3125rem solid transparent; border-top: 1.3125rem solid transparent; position: absolute; top: 50%; left: -2.6875rem; -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); } #global-ux .hotspots.section .popup.right:after { content: ""; height: 0; width: 0; border-left: 1.25rem solid #fff; border-right: 1.25rem solid transparent; border-bottom: 1.25rem solid transparent; border-top: 1.25rem solid transparent; position: absolute; top: 50%; right: -2.5rem; -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); } #global-ux .hotspots.section .popup.right:before { content: ""; height: 0; width: 0; border-left: 1.3125rem solid #dbdbdb; border-right: 1.3125rem solid transparent; border-bottom: 1.3125rem solid transparent; border-top: 1.3125rem solid transparent; position: absolute; top: 50%; right: -2.6875rem; -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); } #global-ux .hotspots.section .popup .close { position: absolute; right: 0; top: 0; display: none; } #global-ux .hotspots.section .prepopulate-imgs { display: none; } #global-ux .hotspots.section .hotspots-pointer, #global-ux .hotspots.section .popup-carousel-mobile { text-align: center; } #global-ux .hotspots.section .hotspots-pointer .title, #global-ux .hotspots.section .popup-carousel-mobile .title { font-size: 24px; font-size: 1.5rem; font-weight: 700; color: #616161; padding: 1.875rem .625rem 0 .625rem; margin-bottom: .625rem; } #global-ux .hotspots.section .hotspots-pointer .title p, #global-ux .hotspots.section .popup-carousel-mobile .title p { font-weight: 700; color: #616161; margin-bottom: 0; } #global-ux .hotspots.section .hotspots-pointer .description, #global-ux .hotspots.section .popup-carousel-mobile .description { color: #86827b; font-size: 14px; font-size: .875rem; line-height: 1.5625rem; width: 100%; margin: 0 auto; margin-bottom: 1.875rem; padding: 0 .625rem; } #global-ux .hotspots.section .hotspots-pointer .description p, #global-ux .hotspots.section .popup-carousel-mobile .description p { color: #86827b; font-size: 14px; font-size: .875rem; line-height: 1.5625rem; margin-bottom: 0; } #global-ux .hotspots.section .background-img { background-position: left top; background-repeat: repeat; } #global-ux .hotspots.section .background-img.image1 { background-image: url(/etc/designs/guxfoap/clientlibs/guxfoap/img/modelCompare/check-icon.jpg); } #global-ux .hotspots.section .background-color { background-repeat: repeat; background-position: left top; } #global-ux .hotspots.section .background-color.red { background-color: red; } #global-ux .hotspots.section .background-color.yellow { background-color: yellow; } #global-ux .hotspots.section .background-color.green { background-color: green; } #global-ux .hotspots.section .background-color.white { background-color: white; } #global-ux .hotspots.section .background-color.black { background-color: black; } #global-ux .hotspots.section .background-color.gray { background-color: #fafafa; } #global-ux .hotspots.section .text-color.red, #global-ux .hotspots.section .text-color.red p { color: red; } #global-ux .hotspots.section .text-color.yellow, #global-ux .hotspots.section .text-color.yellow p { color: yellow; } #global-ux .hotspots.section .text-color.green, #global-ux .hotspots.section .text-color.green p { color: green; } #global-ux .hotspots.section .text-color.white, #global-ux .hotspots.section .text-color.white p { color: white; } #global-ux .hotspots.section .text-color.black, #global-ux .hotspots.section .text-color.black p { color: black; } #global-ux .hotspots.section .text-color.gray, #global-ux .hotspots.section .text-color.gray p { color: #fafafa; } @media only screen and (min-width: 48em) { #global-ux .hotspots.section .popup-carousel-mobile { display: none; } #global-ux .hotspots.section .hotspots-pointer, #global-ux .hotspots.section .popup-carousel-mobile { text-align: center; } #global-ux .hotspots.section .hotspots-pointer .title, #global-ux .hotspots.section .popup-carousel-mobile .title { font-size: 45px; font-size: 2.8125rem; font-weight: 200; color: #616161; padding-top: 0; } #global-ux .hotspots.section .hotspots-pointer .description, #global-ux .hotspots.section .popup-carousel-mobile .description { font-size: 18px; font-size: 1.125rem; color: #616161; line-height: 1.875rem; width: 80%; } #global-ux .hotspots.section .hotspots-pointer .description p, #global-ux .hotspots.section .popup-carousel-mobile .description p { line-height: 1.5; font-size: 18px; font-size: 1.125rem; } } .arrowie8 { display: none; } .ie8 #global-ux .hotspots.section .hotspot-trigger { width: 35px; height: 35px; line-height: 36px; color: #888888; } .ie8 #global-ux .hotspots.section .hotspot-trigger:after { margin-top: -17px; margin-left: -9px; } .ie8 #global-ux .hotspots.section .hotspot-trigger.active { color: #ffffff; } .ie8 #global-ux .hotspots.section .hotspot-trigger.number { font-size: 18px; line-height: 30px; color: rgba(0,0,0,0.3); } .ie8 #global-ux .hotspots.section .popup-carousel-mobile { display: none; } .ie8 #global-ux .hotspots.section .hotspots-pointer .title { font-size: 45px; padding: 0px 10px 0px 10px; margin-bottom: 10px; font-weight: 200; color: #616161; } .ie8 #global-ux .hotspots.section .hotspots-pointer .description { font-size: 18px; line-height: 30px; padding: 0 10px; margin-bottom: 30px; } .ie8 #global-ux .hotspots.section .hotspots-pointer .description p { font-size: 18px; font-weight: 300; line-height: 1.5; } .ie8 #global-ux .hotspots.section .popup { width: 257px; } .ie8 .arrowie8 { position: absolute; left: -24px; top: 45%; display: block; width: 24px !important; height: 44px !important; background: none !important; } .ie8 #global-ux .hotspots.section .popup .content-popup { padding: 15px; background-color: #fff; } .ie8 #global-ux .hotspots.section .popup .title { font-size: 18px; margin-bottom: 10px; margin-top: 10px; background-color: #fff; } .ie8 #global-ux .hotspots.section .popup .title p { font-size: 18px; color: #1b394e; } .ie8 #global-ux .hotspots.section .popup .txt-content { font-size: 18px; line-height: 23px; background-color: #fff; } .ie8 #global-ux .hotspots.section .popup .txt-content p { color: #86827b; } .ie8 #global-ux .hotspots.section .popup img { background-color: #fff; } .rtl #global-ux .hotspots.section .hotspots-pointer .title { font-size: 48px; font-size: 3rem; } .rtl #global-ux .hotspots.section .text-color.black p { font-size: 32px; font-size: 2rem; line-height: 1.2; } @media screen and (max-width: 767px) { .rtl #global-ux .hotspots.section .text-color.black p { font-size: 24px; font-size: 1.5rem; } } .rtl #global-ux .hotspots.section .popup .title p { font-size: 32px; font-size: 2rem; } .rtl #global-ux .hotspots.section .popup .txt-content p { font-size: 22px; font-size: 1.375rem; } .rtl #global-ux .hotspots.section .popup-carousel-mobile .flex-viewport { direction: ltr !important; } .rtl #global-ux .hotspots.section .popup-carousel-mobile .description p { font-size: 20px; font-size: 1.25rem; } .rtl #global-ux .hotspots.section .popup-carousel-mobile .title p { font-size: 24px; font-size: 1.5rem; } #global-ux .colorizer.section { text-align: center; } #global-ux .colorizer.section .component-label { width: 100%; padding: 85px 0 10px 0; text-align: center; } #global-ux .colorizer.section .component-label h3 { color: #616161; font-weight: 200; } #global-ux .colorizer.section .tabs { font-weight: 300; } #global-ux .colorizer.section .tabs .tab-links { display: inline-block; margin-bottom: 0; margin-left: 0; } #global-ux .colorizer.section .tabs .tab-links:after { display: block; clear: both; content: ''; } #global-ux .colorizer.section .tabs .tab-links li { padding: 0 20px; float: left; list-style: none; } #global-ux .colorizer.section .tabs .tab-links li.active a { border-bottom: 5px solid #1a394e; color: #1a394e; } #global-ux .colorizer.section .tabs .tab-links a { padding: 28px 0 15px; display: inline-block; text-decoration: none; color: #2c97cf; } #global-ux .colorizer.section .tab-content { margin-top: -5px; border-radius: 3px; box-shadow: -1px 1px 1px rgba(0,0,0,0.15); background: #fff; position: relative; overflow: hidden; display: block; } #global-ux .colorizer.section .tab-content .mobile-nav { text-indent: 99999px; font-weight: 200; height: 0; font-size: 1.3125rem; color: #616161; } @media only screen and (min-width: 30.0625em) { #global-ux .colorizer.section .tab-content .mobile-nav { display: none; } } #global-ux .colorizer.section .tab-content .mobile-nav sup[data-disclosure] { font-size: 70%; line-height: 1; white-space: nowrap; } #global-ux .colorizer.section .tab-content .image-360 { position: relative; float: left; width: 100%; } #global-ux .colorizer.section .tab-content .image-360 .flex-control-nav { display: none; } #global-ux .colorizer.section .tab-content .image-360 .flex-direction-nav { position: absolute; top: 50%; list-style: none; display: block; width: 100%; margin: 0; z-index: 98; } #global-ux .colorizer.section .tab-content .image-360 .flex-direction-nav li { display: inline-block; } #global-ux .colorizer.section .tab-content .image-360 .flex-direction-nav li:first-child { float: left; padding-left: 64px; } #global-ux .colorizer.section .tab-content .image-360 .flex-direction-nav li:last-child { float: right; padding-right: 64px; } #global-ux .colorizer.section .tab-content .image-360 .flex-direction-nav li .flex-next { text-decoration: none; background: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/colorizer/360arrows.png") no-repeat 0 100%; height: 16px; width: 10px; display: inline-block; text-indent: -9999px; } #global-ux .colorizer.section .tab-content .image-360 .flex-direction-nav li .flex-prev { text-decoration: none; background: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/colorizer/360arrows.png") no-repeat 0 0; height: 16px; width: 10px; display: inline-block; text-indent: 9999px; } #global-ux .colorizer.section .tab-content .image-360 .flex-direction-nav li .flex-next, #global-ux .colorizer.section .tab-content .image-360 .flex-direction-nav li .flex-prev { background-size: 10px auto; } @media only screen and (min-width: 48em) { #global-ux .colorizer.section .tab-content .image-360 .flex-direction-nav li .flex-next, #global-ux .colorizer.section .tab-content .image-360 .flex-direction-nav li .flex-prev { height: 30px; width: 19px; background-size: 19px auto; } } #global-ux .colorizer.section .tab-content .color-swatch-component ul { list-style: none; } #global-ux .colorizer.section .tab-content .color-swatch-component .main-picture { margin: 0 auto; padding-top: 10px; } #global-ux .colorizer.section .tab-content .color-swatch-component .main-picture .item { display: none; } #global-ux .colorizer.section .tab-content .color-swatch-component .main-picture .item.active { display: block; } #global-ux .colorizer.section .tab-content .color-swatch-component .main-picture .item .item-label { color: #1a394e; padding: 10px; font-weight: 500; } @media only screen and (min-width: 48em) { #global-ux .colorizer.section .tab-content .color-swatch-component .main-picture .item .item-label { font-size: 22px; } } #global-ux .colorizer.section .tab-content .color-swatch-component .main-picture .item img { width: 100%; } #global-ux .colorizer.section .tab-content .color-swatch-component .color-items { display: inline-block; text-align: center; margin: 0 auto 10px; } #global-ux .colorizer.section .tab-content .color-swatch-component .color-items li { display: inline-block; position: relative; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: pointer; width: 70px; height: 70px; margin: 0 5px !important; } #global-ux .colorizer.section .tab-content .color-swatch-component .color-items li.active .icon { position: absolute; top: 50%; left: 50%; display: block; width: 44px; height: 44px; margin: -22px 0 0 -22px; } #global-ux .colorizer.section .tab-content .color-swatch-component .color-items li .icon { background: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/colorizer/tick-icon.png") 0 0 no-repeat; background-size: cover; } @media only screen and (min-width: 768px) { #global-ux .colorizer.section .tab-content .color-swatch-component .color-items { margin-bottom: 3.125rem; } } #global-ux .colorizer.section .tab { display: block; position: absolute; top: -99999px; } #global-ux .colorizer.section .tab.active { position: inherit; top: inherit; } @media only screen and (min-width: 48em) { #global-ux .colorizer.section section { padding-bottom: 0; } } @media screen and (max-width: 767px) { #global-ux .colorizer.section .component-label { display: none; } #global-ux .colorizer.section .tabs .tab-links { display: none; } #global-ux .colorizer.section .tabs .tab-content .mobile-nav { font-weight: 200; display: block; text-align: left; border-top: 1px solid #d5d5d5; position: relative; height: auto; text-indent: 0px; padding: 30px 0 30px 25px; } #global-ux .colorizer.section .tabs .tab-content .mobile-nav .icon { background-image: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/chevron-thin-down_cta-blue.svg"); background-repeat: no-repeat; background-position: -3px -10px; display: block; height: 13px; right: 25px; margin: 0 auto; position: absolute; width: 25px; top: 40%; } #global-ux .colorizer.section .tabs .tab-content .mobile-nav.last-item { border-bottom: 1px solid #d5d5d5; } #global-ux .colorizer.section .tabs .tab-content .mobile-nav sup[data-disclosure] { font-size: 70%; line-height: 1; white-space: nowrap; } #global-ux .colorizer.section .tabs .tab-content .mobile-nav.centered { text-align: center; } #global-ux .colorizer.section .tabs .tab-content .color-swatch-component ul { list-style: none; } #global-ux .colorizer.section .tabs .tab-content .color-swatch-component .main-picture { margin: 0 auto; } #global-ux .colorizer.section .tabs .tab-content .color-swatch-component .main-picture .item { display: none; } #global-ux .colorizer.section .tabs .tab-content .color-swatch-component .main-picture .item.active { display: block; } #global-ux .colorizer.section .tabs .tab-content .color-swatch-component .color-items { text-align: center; } #global-ux .colorizer.section .tabs .tab-content .image-360 .flex-direction-nav { top: 45%; } #global-ux .colorizer.section .tabs .tab-content .image-360 .flex-direction-nav li:first-child { padding-left: 14px; } #global-ux .colorizer.section .tabs .tab-content .image-360 .flex-direction-nav li:last-child { padding-right: 14px; } } @media only screen and (max-width: 320px) { #global-ux .colorizer.section .tabs .tab-content .color-swatch-component .color-items { text-align: center; } } @media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) { #global-ux .colorizer.section .tabs .tab-content .color-swatch-component .color-items { text-align: center; } #global-ux .colorizer.section .colorizer { margin-bottom: -5px; } } @media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) { #global-ux .colorizer.section .tabs .tab-content .color-swatch-component .color-items { text-align: center; } } @media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2) { #global-ux .colorizer.section .tabs .tab-content .color-swatch-component .color-items { text-align: center; } } @media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2) { #global-ux .colorizer.section .tabs .tab-content .color-swatch-component .color-items { text-align: center; } } @media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2) { #global-ux .colorizer.section .tabs .tab-content .color-swatch-component .color-items { text-align: center; } } @media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2) { #global-ux .colorizer.section .tabs .tab-content .color-swatch-component .color-items { text-align: center; } } @media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2) { #global-ux .colorizer.section .tabs .tab-content .color-swatch-component .color-items { text-align: center; } } #global-ux .image-360 ul.slides { margin-left: 0; } #global-ux .colorizer.section .tab-content .color-swatch-component .color-items { overflow: hidden; } @media only screen and (min-width: 667px) and (max-width: 767px) { #global-ux .colorizer.section .tab-content .color-swatch-component .color-items li { width: 48px; height: 48px; } #global-ux .colorizer.section .tab-content .color-swatch-component .color-items li.active .icon { top: 9px; left: 9px; width: 30px; height: 30px; margin: 0; } } @media only screen and (max-width: 666px) { #global-ux .colorizer.section .tab-content .color-swatch-component .color-items li { width: 29px; height: 29px; margin: 0 2px !important; } #global-ux .colorizer.section .tab-content .color-swatch-component .color-items li.active .icon { top: 5px; left: 5px; width: 19px; height: 19px; margin: 0; } } .ie8 #global-ux .colorizer.section .tab-content .mobile-nav { display: none; } .ie8 #global-ux .colorizer.section .tab-content .image-360 .flex-direction-nav li .flex-prev, .ie8 #global-ux .colorizer.section .tab-content .image-360 .flex-direction-nav li .flex-next { height: 30px; width: 19px; background-size: 19px auto; } .ie8 #global-ux .colorizer.section .tab-content .color-swatch-component .color-items img { width: auto; height: auto; } .ie8 #global-ux .colorizer.section .tab-content .color-swatch-component .color-items li.active .icon { position: absolute; top: 50%; left: 50%; width: 44px; height: 44px; margin: -22px; } .rtl #global-ux .colorizer.section .component-label h3 { font-size: 48px; font-size: 3rem; } .rtl #global-ux .colorizer.section .tabs .tab-links { font-size: 24px; font-size: 1.5rem; } .rtl #global-ux .colorizer.section .tabs .tab-links li { float: right; } .rtl #global-ux .colorizer.section .tabs .tab-content .mobile-nav { padding-right: 55px; padding-left: 0; text-align: right; } @media screen and (max-width: 767px) { .rtl #global-ux .colorizer.section .tabs .tab-content .mobile-nav { font-size: 24px; font-size: 1.5rem; } } .rtl #global-ux .colorizer.section .tabs .tab-content .mobile-nav .icon { left: 8%; } .rtl #global-ux .colorizer.section .tab-content .color-swatch-component .main-picture .item .item-label { font-size: 24px; font-size: 1.5rem; } @media only screen and (min-width: 48em) { .rtl #global-ux .colorizer.section .tab-content .color-swatch-component .main-picture .item .item-label { font-size: 36px; font-size: 2.25rem; } } #global-ux .component-iframe .loader-holder { text-align: center; padding: 100px 0; } #global-ux .component-iframe .loader-holder .loading { width: auto; display: inline-block; } #global-ux .colorizerthreesixty.section { text-align: center; } #global-ux .colorizerthreesixty.section .component-label { width: 100%; padding: 85px 0 10px 0; text-align: center; } #global-ux .colorizerthreesixty.section .component-label h3 { color: #616161; font-weight: 200; } #global-ux .colorizerthreesixty.section .content-hldr { margin-top: 20px; border-radius: 3px; box-shadow: -1px 1px 1px rgba(0,0,0,0.15); background: #fff; position: relative; overflow: hidden; display: block; } #global-ux .colorizerthreesixty.section .content-hldr .mobile-nav { text-indent: 99999px; font-weight: 200; height: 0; font-size: 1.3125rem; color: #616161; } @media only screen and (min-width: 30.0625em) { #global-ux .colorizerthreesixty.section .content-hldr .mobile-nav { display: none; } } #global-ux .colorizerthreesixty.section .content-hldr .mobile-nav sup[data-disclosure] { font-size: 70%; line-height: 1; white-space: nowrap; } #global-ux .colorizerthreesixty.section .content-hldr .image-360 { position: relative; float: left; width: 100%; } #global-ux .colorizerthreesixty.section .content-hldr .image-360 .flex-control-nav { display: none; } #global-ux .colorizerthreesixty.section .content-hldr .image-360 .flex-direction-nav { position: absolute; top: 50%; list-style: none; display: block; width: 100%; margin: 0; z-index: 98; } #global-ux .colorizerthreesixty.section .content-hldr .image-360 .flex-direction-nav li { display: inline-block; } #global-ux .colorizerthreesixty.section .content-hldr .image-360 .flex-direction-nav li:first-child { float: left; padding-left: 64px; } #global-ux .colorizerthreesixty.section .content-hldr .image-360 .flex-direction-nav li:last-child { float: right; padding-right: 64px; } #global-ux .colorizerthreesixty.section .content-hldr .image-360 .flex-direction-nav li .flex-next { text-decoration: none; background: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/colorizer/360arrows.png") no-repeat 0 100%; height: 16px; width: 10px; display: inline-block; text-indent: -9999px; } #global-ux .colorizerthreesixty.section .content-hldr .image-360 .flex-direction-nav li .flex-prev { text-decoration: none; background: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/colorizer/360arrows.png") no-repeat 0 0; height: 16px; width: 10px; display: inline-block; text-indent: 9999px; } #global-ux .colorizerthreesixty.section .content-hldr .image-360 .flex-direction-nav li .flex-next, #global-ux .colorizerthreesixty.section .content-hldr .image-360 .flex-direction-nav li .flex-prev { background-size: 10px auto; } @media only screen and (min-width: 48em) { #global-ux .colorizerthreesixty.section .content-hldr .image-360 .flex-direction-nav li .flex-next, #global-ux .colorizerthreesixty.section .content-hldr .image-360 .flex-direction-nav li .flex-prev { height: 30px; width: 19px; background-size: 19px auto; } } #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component ul { list-style: none; } #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .main-picture { margin: 0 auto; padding-top: 10px; } #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .main-picture .item { display: none; } #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .main-picture .item.active { display: block; } #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .main-picture .item .item-label { color: #1a394e; padding: 10px; font-weight: 500; } @media only screen and (min-width: 48em) { #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .main-picture .item .item-label { font-size: 22px; } } #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .main-picture .item img { width: 100%; } #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .color-items { display: inline-block; text-align: center; margin: 10px auto 10px; } #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .color-items li { display: inline-block; position: relative; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: pointer; width: 50px; height: 50px; margin: 0 5px !important; } #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .color-items li.active .icon { position: absolute; top: 53%; left: 52%; display: block; width: 30px; height: 30px; margin: -16px 0 0 -16px; } #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .color-items li .icon { background: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/colorizer/tick-icon.png") 0 0 no-repeat; background-size: cover; } @media only screen and (min-width: 768px) { #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .color-items { margin-bottom: 3.125rem; } } @media only screen and (min-width: 48em) { #global-ux .colorizerthreesixty.section section { padding-bottom: 0; } } @media screen and (max-width: 767px) { #global-ux .colorizerthreesixty.section .component-label { display: none; } #global-ux .colorizerthreesixty.section .tab-links { display: none; } #global-ux .colorizerthreesixty.section .content-hldr .mobile-nav { font-weight: 200; display: block; text-align: left; border-top: 1px solid #d5d5d5; position: relative; height: auto; text-indent: 0px; padding: 30px 0 30px 25px; } #global-ux .colorizerthreesixty.section .content-hldr .mobile-nav .icon { background-image: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/chevron-thin-down_cta-blue.svg"); background-repeat: no-repeat; background-position: -3px -10px; display: block; height: 13px; right: 25px; margin: 0 auto; position: absolute; width: 25px; top: 40%; } #global-ux .colorizerthreesixty.section .content-hldr .mobile-nav.last-item { border-bottom: 1px solid #d5d5d5; } #global-ux .colorizerthreesixty.section .content-hldr .mobile-nav sup[data-disclosure] { font-size: 70%; line-height: 1; white-space: nowrap; } #global-ux .colorizerthreesixty.section .content-hldr .mobile-nav.centered { text-align: center; } #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component ul { list-style: none; } #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .main-picture { margin: 0 auto; } #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .main-picture .item { display: none; } #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .main-picture .item.active { display: block; } #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .color-items { text-align: center; } #global-ux .colorizerthreesixty.section .content-hldr .image-360 .flex-direction-nav { top: 45%; } #global-ux .colorizerthreesixty.section .content-hldr .image-360 .flex-direction-nav li:first-child { padding-left: 14px; } #global-ux .colorizerthreesixty.section .content-hldr .image-360 .flex-direction-nav li:last-child { padding-right: 14px; } } @media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) { #global-ux .colorizerthreesixty.section .colorizer { margin-bottom: -5px; } } #global-ux .image-360 ul.slides { margin-left: 0; } #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .color-items { overflow: hidden; ext-align: center; } @media only screen and (min-width: 667px) and (max-width: 767px) { #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .color-items li { width: 48px; height: 48px; } #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .color-items li.active .icon { top: 9px; left: 10px; width: 30px; height: 30px; margin: 0; } } @media only screen and (max-width: 666px) { #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .color-items li { width: 29px; height: 29px; margin: 0 2px !important; } #global-ux .colorizerthreesixty.section .content-hldr .color-swatch-component .color-items li.active .icon { top: 7px; left: 7px; width: 15px; height: 15px; margin: 0; } } .ie8 #global-ux .colorizer.section .tab-content .mobile-nav { display: none; } .ie8 #global-ux .colorizer.section .tab-content .image-360 .flex-direction-nav li .flex-prev, .ie8 #global-ux .colorizer.section .tab-content .image-360 .flex-direction-nav li .flex-next { height: 30px; width: 19px; background-size: 19px auto; } .ie8 #global-ux .colorizer.section .tab-content .color-swatch-component .color-items img { width: auto; height: auto; } .ie8 #global-ux .colorizer.section .tab-content .color-swatch-component .color-items li.active .icon { position: absolute; top: 50%; left: 50%; width: 44px; height: 44px; margin: -22px; } .rtl #global-ux .colorizer.section .component-label h3 { font-size: 48px; font-size: 3rem; } .rtl #global-ux .colorizer.section .tabs .tab-links { font-size: 24px; font-size: 1.5rem; } .rtl #global-ux .colorizer.section .tabs .tab-links li { float: right; } .rtl #global-ux .colorizer.section .tabs .tab-content .mobile-nav { padding-right: 55px; padding-left: 0; text-align: right; } @media screen and (max-width: 767px) { .rtl #global-ux .colorizer.section .tabs .tab-content .mobile-nav { font-size: 24px; font-size: 1.5rem; } } .rtl #global-ux .colorizer.section .tabs .tab-content .mobile-nav .icon { left: 8%; } .rtl #global-ux .colorizer.section .tab-content .color-swatch-component .main-picture .item .item-label { font-size: 24px; font-size: 1.5rem; } @media only screen and (min-width: 48em) { .rtl #global-ux .colorizer.section .tab-content .color-swatch-component .main-picture .item .item-label { font-size: 36px; font-size: 2.25rem; } } #global-ux .smartNextSteps.section .content { position: relative; min-height: 670px; background-position: center top; } #global-ux .smartNextSteps.section .content .wrap-text { position: absolute; width: 100%; text-align: center; top: 50%; transform: translate(0, -50%); } #global-ux .smartNextSteps.section .content .wrap-text .title { font-weight: 200; color: #fff; margin: 0; font-size: 48px; padding: 0; padding-bottom: 15px; } #global-ux .smartNextSteps.section .content .wrap-text .title br { display: none; } #global-ux .smartNextSteps.section .content .wrap-text .btn-cta { text-align: center; } #global-ux .smartNextSteps.section .content .wrap-text .btn-cta .btn { display: block; width: 270px; height: 60px; border: 1px solid #67758f; margin: 0 auto; text-transform: uppercase; background: none; font-family: "Anntenna Regular",Arial,Helvetica,sans-serif; font-size: 18px; margin-bottom: 18px; } .lang_vi #global-ux .smartNextSteps.section .content .wrap-text .btn-cta .btn { font-family: "Arial","Tahoma","Helvetica",sans-serif; } #global-ux .smartNextSteps.section .content .wrap-text .btn-cta .btn.hover { background: #2d96cd; border: none; } #global-ux .smartNextSteps.section .content .wrap-text .btn-cta .btn:hover { background: #2d96cd; border: none; } @media (max-width: 720px) { #global-ux .smartNextSteps.section .content .wrap-text .title { font-size: 36px; } #global-ux .smartNextSteps.section .content .wrap-text .title br { display: block; } #global-ux .smartNextSteps.section .content .wrap-text .btn-cta { max-width: 83.3333333333%; margin: 0 auto; } #global-ux .smartNextSteps.section .content .wrap-text .btn-cta .btn { width: 100%; padding: 20px 0; border: 1px solid #67758f; box-sizing: border-box; background: none; margin: 0 0 30px; font-size: 20px; } } #global-ux .billboardShowroom.section { position: relative; } #global-ux .billboardShowroom.section ul { margin: 0; } #global-ux .billboardShowroom.section .flex-direction-nav { position: absolute; top: 50%; right: 51px; margin: 0; list-style: none; text-decoration: none; background: #2d96cd; width: 100%; } #global-ux .billboardShowroom.section .flex-direction-nav li { display: block; position: relative; } #global-ux .billboardShowroom.section .flex-direction-nav li .flex-next { display: block; background-image: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/modelDisplay/icons.svg"); background-repeat: no-repeat; background-position: -121px -1px; width: 51px; height: 51px; text-indent: -9999px; position: absolute; top: 0; overflow: hidden; background-color: #2d96cd; right: -51px; } #global-ux .billboardShowroom.section .flex-direction-nav li .flex-prev { display: block; background-image: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/modelDisplay/icons.svg"); background-repeat: no-repeat; background-position: -244px -1px; width: 51px; height: 51px; text-indent: -9999px; overflow: hidden; background-color: #999; position: absolute; top: -51px; right: -51px; } #global-ux .billboardShowroom.section .flex-control-nav { position: absolute; width: 100%; bottom: 40px; } #global-ux .billboardShowroom.section .content { text-align: center; position: relative; background-position: center center; } #global-ux .billboardShowroom.section .content .wrap-text { position: absolute; width: 100%; text-align: center; top: 30%; transform: translate(0, -50%); } #global-ux .billboardShowroom.section .content .wrap-text .heading { color: #626466; font-size: 48px; font-size: 3rem; font-weight: 200; } #global-ux .billboardShowroom.section .content .wrap-text .heading p { font-size: 48px; font-size: 3rem; font-weight: 200; } #global-ux .billboardShowroom.section .content .wrap-text .heading br { display: none; } #global-ux .billboardShowroom.section .content .wrap-text .sub-title { color: #626466; font-size: 18px; font-size: 1.125rem; padding-bottom: 2.1875rem; line-height: 1.875rem; font-weight: 200; } #global-ux .billboardShowroom.section .content .wrap-text .sub-title p { margin-bottom: 0; color: #626466; font-size: 18px; font-size: 1.125rem; line-height: 1.875rem; font-weight: 200; } #global-ux .billboardShowroom.section .content .wrap-text button { padding: 1.5rem 5.1875rem; background: #2d96cd; font-size: 18px; font-size: 1.125rem; } @media screen and (max-width: 767px) { #global-ux .billboardShowroom.section .content { background-size: 250%; background-repeat: no-repeat; } #global-ux .billboardShowroom.section .content .wrap-text .heading { font-size: 24px; margin: 0 auto; padding-bottom: 30px; } #global-ux .billboardShowroom.section .content .wrap-text .heading p { font-size: 24px; font-size: 1.5rem; margin: 0 auto; padding-bottom: 1.875rem; } #global-ux .billboardShowroom.section .content .wrap-text .heading br { display: block; } #global-ux .billboardShowroom.section .content .wrap-text .sub-title { display: none; } #global-ux .billboardShowroom.section .content .wrap-text button { padding: 1rem 3.9375rem; background: #2d96cd; font-size: 14px; font-size: .875rem; box-sizing: border-box; } } .ie8 #global-ux .billboardShowroom.section .content .wrap-text { top: 10%; } .ie8 #global-ux .billboardShowroom.section .content .wrap-text .sub-title p { line-height: 30px; } .ie8 #global-ux .billboardShowroom.section .flex-direction-nav li .flex-next, .ie8 #global-ux .billboardShowroom.section .flex-direction-nav li .flex-prev { background-image: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/modelDisplay/icons.png"); } .ie8 .flex-control-nav li, .ie8 .carousel-controls .flex-control-nav li { margin: 20px 6px 10px; } #global-ux .modelDisplay.section { position: relative; } #global-ux .modelDisplay.section .top-content { padding: 4.7222222222% 6.8055555556%; font-weight: 200; } #global-ux .modelDisplay.section .top-content .title { font-size: 36px; color: #616161; } #global-ux .modelDisplay.section .top-content button { font-size: 16px; background: #fff; color: #2d96cd; border: 1px solid #2d96cd; float: right; padding: 18px 60px; margin: 0; } #global-ux .modelDisplay.section .top-content .mobile-title { display: none; } #global-ux .modelDisplay.section .bottom-content { display: none; } #global-ux .modelDisplay.section .model-display-slider .item span { display: inline-block; width: 100%; text-align: center; } #global-ux .modelDisplay.section .model-display-slider .item .label-feature { color: #2d96cd; font-size: 20px; font-weight: 200; } #global-ux .modelDisplay.section .model-display-slider .item .model-name { font-size: 16px; font-weight: 200; } #global-ux .modelDisplay.section .model-display-slider .flex-viewport { box-sizing: border-box; margin: 0 6.8055555556%; } #global-ux .modelDisplay.section .model-display-slider .flex-direction-nav { position: absolute; top: 50%; right: 0; margin: 0; list-style: none; text-decoration: none; background: #2d96cd; } #global-ux .modelDisplay.section .model-display-slider .flex-direction-nav li { display: block; position: relative; } #global-ux .modelDisplay.section .model-display-slider .flex-direction-nav li .flex-next { display: block; background-image: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/modelDisplay/icons.svg"); background-repeat: no-repeat; background-position: -121px -1px; width: 51px; height: 51px; text-indent: -9999px; position: absolute; top: -102px; overflow: hidden; background-color: #2d96cd; } #global-ux .modelDisplay.section .model-display-slider .flex-direction-nav li .flex-prev { display: block; background-image: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/modelDisplay/icons.svg"); background-repeat: no-repeat; background-position: -244px -1px; width: 51px; height: 51px; text-indent: -9999px; overflow: hidden; background-color: #999999; } #global-ux .modelDisplay.section .model-display-slider .flex-control-nav { list-style: none; text-align: center; padding: 40px 0; margin: 0 auto; } #global-ux .modelDisplay.section .model-display-slider .flex-control-nav.flex-control-paging li { display: inline; padding: 0 11px; width: 8px; height: 8px; } #global-ux .modelDisplay.section .model-display-slider .flex-control-nav.flex-control-paging li a { color: #fff; text-decoration: none; width: 8px; height: 8px; display: inline-block; background: #2d96cd; cursor: pointer; text-indent: -9999px; -webkit-box-shadow: inset 0 0 3px transparent; -moz-box-shadow: inset 0 0 3px transparent; -o-box-shadow: inset 0 0 3px transparent; box-shadow: inset 0 0 3px transparent; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } #global-ux .modelDisplay.section .model-display-slider .flex-control-nav.flex-control-paging li a.flex-active { width: 12px; height: 12px; border: 2px solid #2d96cd; background: #fff; } @media (max-width: 767px) { #global-ux .modelDisplay.section .top-content .title { display: none; } #global-ux .modelDisplay.section .top-content .mobile-title { text-align: center; font-weight: 200; font-size: 24px; display: block; color: #616161; } #global-ux .modelDisplay.section .top-content button { display: none; } #global-ux .modelDisplay.section .bottom-content { display: block; font-weight: 200; text-align: center; } #global-ux .modelDisplay.section .bottom-content button { font-size: 16px; background: #fff; color: #2d96cd; border: 1px solid #2d96cd; padding: 13px 49px; margin: 0; display: inline-block; } #global-ux .modelDisplay.section .model-display-slider .item .label-feature { padding: 5px 0; } #global-ux .modelDisplay.section .model-display-slider .item .model-name { padding-bottom: 5px; } #global-ux .modelDisplay.section .model-display-slider .flex-direction-nav { display: none; } #global-ux .modelDisplay.section .model-display-slider .flex-control-nav.flex-control-paging { padding: 10px 0; } } .model-details-compare #title-wrapper .page-title, .model-details-compare #compare-container .grid-container { display: block; max-width: 1368px; max-width: 85.5rem; margin: 0 auto; } .model-details-compare #title-wrapper .page-title:after, .model-details-compare #compare-container .grid-container:after { content: ""; display: table; clear: both; } @media screen and (max-width: 1199px) { .model-details-compare #title-wrapper .page-title, .model-details-compare #compare-container .grid-container { max-width: 100%; } } .ie8 .model-details-compare #title-wrapper .page-title, .model-details-compare #title-wrapper .ie8 .page-title, .ie8 .model-details-compare #compare-container .grid-container, .model-details-compare #compare-container .ie8 .grid-container { max-width: none; max-width: none; width: 1368px; } #global-ux .model-details-compare h2, #global-ux .model-details-compare h3, #global-ux .model-details-compare h4, #global-ux .model-details-compare h5, #global-ux .model-details-compare h6, #global-ux .model-details-compare p, #global-ux .model-details-compare li, #global-ux .model-details-compare label { color: #616161; font-weight: 300; } .model-details-compare, .model-details-compare .compare-container { display: block; } .model-details-compare:after, .model-details-compare .compare-container:after { content: ""; display: table; clear: both; } .model-details-compare, .model-details-compare * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .model-details-compare:before, .model-details-compare:after, .model-details-compare *:before, .model-details-compare *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .model-details-compare { padding: 60px 0 0 0; padding: 3.75rem 0 0 0; } .model-details-compare .btn { font-size: 14px; font-size: .875rem; line-height: 29px; line-height: 1.8125rem; padding: 5px; padding: .3125rem; font-weight: 300; background: #2c94ca; color: #fff; text-align: center; display: block; text-decoration: none; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear; text-decoration: none !important; } .model-details-compare .btn:hover { background: #1b394e; } .model-details-compare .btn.btn-white { background: #fff; color: #2c94ca; padding: 4px 10px; padding: .25rem .625rem; border: 1px solid #2c94ca; } .model-details-compare .btn.btn-white:hover { background: #1b394e; border-color: #1b394e; color: #fff; } .model-details-compare #title-wrapper { display: block; color: #616161; } .model-details-compare #title-wrapper .page-title { padding: 0 270px 40px 0; padding: 0 16.875rem 2.5rem 0; position: relative; } .model-details-compare #title-wrapper .page-title .print-holder { font-size: 16px; font-size: 1rem; padding: 6px 0 0; padding: .375rem 0 0; line-height: 1.2; clear: both; } @media screen and (max-width: 767px) { .model-details-compare #title-wrapper .page-title .print-holder { font-size: 14px; font-size: .875rem; padding: 8px 0 0; padding: .5rem 0 0; margin-bottom: 20px; } } .model-details-compare #title-wrapper .page-title .print-holder .title-text { display: inline-block; position: relative; top: 1px; } .model-details-compare #title-wrapper h1 { font-size: 36px; font-size: 2.25rem; margin: 0 0 12px; margin: 0 0 .75rem; line-height: 1; line-height: 1; color: #616161; font-weight: 200; display: block; text-indent: 0; } .model-details-compare #title-wrapper p { margin: 0; font-size: 12px; font-size: .75rem; } .model-details-compare #title-wrapper a { text-decoration: none; } .model-details-compare #title-wrapper .btn.back-to-overview { float: right; position: absolute; right: 0; top: 0; } .model-details-compare #title-wrapper .location-overlay { float: left; clear: both; text-align: left; font-size: 12px; font-size: .75rem; line-height: 1.6; color: #616161; } .model-details-compare #title-wrapper .location-overlay>span { float: left; } .model-details-compare #title-wrapper .location-overlay p { font-size: 12px; font-size: .75rem; line-height: 1.6; margin: 0; display: inline; } .model-details-compare #title-wrapper .location-overlay .notFirstTime { display: none; } .model-details-compare #title-wrapper .location-overlay a { text-decoration: none; } .model-details-compare .btn.back-to-overview { font-size: 18px; font-size: 1.125rem; line-height: 60px; line-height: 3.75rem; padding: 0 55px; padding: 0 3.4375rem; font-weight: normal; } .model-details-compare #compare-container { font-size: 14px; font-size: .875rem; line-height: 24px; line-height: 1.5rem; color: #616161; font-weight: 300; display: block; } .model-details-compare #compare-container:after { content: ""; display: table; clear: both; } .model-details-compare #compare-container .compare-grid { float: left; width: 100%; } .model-details-compare #compare-container .grid-container { border-top: 1px solid #d9d9d9; border-top: .0625rem solid #d9d9d9; } .model-details-compare #compare-container .group-label { font-size: 32px; font-size: 2rem; margin: 0 0 -10px; margin: 0 0 -.625rem; line-height: 50px; line-height: 3.125rem; font-weight: 200; width: 25.83733%; padding: 0; float: left; } .model-details-compare #compare-container .scroll-wrapper { float: right; width: 74.16267%; overflow: hidden; } .model-details-compare #compare-container .scroll-wrapper>ul { margin: 0 0 -30px; margin: 0 0 -1.875rem; padding: 0 0 30px; padding: 0 0 1.875rem; display: block; overflow: hidden; overflow-x: auto; list-style: none; white-space: nowrap; } .model-details-compare #compare-container .scroll-wrapper>ul:after { content: ""; display: table; clear: both; } @media only screen and (max-width: 74.9375em) { .model-details-compare #compare-container .scroll-wrapper>ul { margin: 0 0 -10px; } } .model-details-compare #compare-container .scroll-wrapper>ul>li { width: 339px; margin: 0 -4px 0 0; display: inline-block; vertical-align: top; white-space: normal; } @media only screen and (max-width: 768px) { .model-details-compare #compare-container .scroll-wrapper>ul>li { margin: 0; } } .model-details-compare #compare-container .scroll-wrapper>ul ul { margin: 0; padding: 0; list-style: none; } .model-details-compare #compare-container .scroll-wrapper div[data-toggle] { display: none; visibility: hidden; } .model-details-compare #compare-container .scroll-wrapper div[data-toggle].show { display: block; visibility: visible; } .model-details-compare #compare-container .compare-header .grid-container { padding: 0 0 10px; padding: 0 0 .625rem; border: none; } .model-details-compare #compare-container .compare-header .btn.back-to-overview, .model-details-compare #compare-container .compare-header .group-label { display: none; visibility: hidden; } .model-details-compare #compare-container .compare-header .scroll-wrapper>ul>li { padding: 0 30px 0 20px; padding: 0 1.875rem 0 1.25rem; } .model-details-compare #compare-container .compare-header .scroll-wrapper .model-name { font-size: 16px; font-size: 1rem; line-height: 29px; line-height: 1.8125rem; margin: 0 0 17px; margin: 0 0 1.0625rem; color: #1b394e; padding: 0; display: block; text-indent: -9999px; overflow: hidden; } .model-details-compare #compare-container .compare-header .scroll-wrapper .model-name.active { text-indent: 0; } .model-details-compare #compare-container .compare-header .scroll-wrapper .image { margin: 0 -20px 25px; margin: 0 -1.25rem 1.5625rem; text-align: center; display: block; opacity: .1; filter: alpha(opacity=10); } .model-details-compare #compare-container .compare-header .scroll-wrapper .image img { margin: 0; padding: 0; width: 100%; height: auto; display: block; } .model-details-compare #compare-container .compare-header .scroll-wrapper .image.active { opacity: 1; filter: alpha(opacity=100); } .model-details-compare #compare-container .compare-header .scroll-wrapper [data-toggle] ul { padding: 0 0 15px; padding: 0 0 .9375rem; margin: -10px 0 0; margin: -.625rem 0 0; display: block; } .model-details-compare #compare-container .compare-header .scroll-wrapper [data-toggle] ul li { display: block; border-bottom: 1px solid #d9d9d9; font-size: 14px; } .model-details-compare #compare-container .compare-header .scroll-wrapper [data-toggle] ul li:after { content: ""; display: table; clear: both; } .model-details-compare #compare-container .compare-header .scroll-wrapper [data-toggle] ul li:last-child { border: none; } .model-details-compare #compare-container .compare-header .scroll-wrapper [data-toggle] ul li span, .model-details-compare #compare-container .compare-header .scroll-wrapper [data-toggle] ul li label { font-size: 14px; font-size: .875rem; line-height: 40px; line-height: 2.5rem; color: #616161; vertical-align: middle; } .model-details-compare #compare-container .compare-header .scroll-wrapper .btn { margin: 0 0 10px; margin: 0 0 .625rem; } .model-details-compare #compare-container .compare-header .sticky-wrapper.stick { padding: 25px 0 30px; padding: 1.5625rem 0 1.875rem; background: #fff; border-bottom: 1px solid #d9d9d9; float: left; width: 100%; position: fixed; top: 0; left: 0; z-index: 8; } .model-details-compare #compare-container .compare-header .sticky-wrapper.stick .grid-container .btn.back-to-overview { display: none; visibility: hidden; float: right; margin: 50px 0 10px; margin: 3.125rem 0 .625rem; } .model-details-compare #compare-container .compare-header .sticky-wrapper.stick .grid-container .scroll-wrapper .image { display: none; } .model-details-compare #compare-container .compare-header .sticky-wrapper.stick .grid-container [data-toggle] ul, .model-details-compare #compare-container .compare-header .sticky-wrapper.stick .grid-container [data-toggle] .btn { display: none; } .model-details-compare #compare-container .compare-header .sticky-wrapper.stick .grid-container [data-toggle] .btn.select-to-compare { display: block; } .model-details-compare #compare-container .compare-header .sticky-wrapper.stick .scroll-wrapper { overflow: visible; } .model-details-compare #compare-container .compare-header .sticky-wrapper.stick .compare-bot.show-diff { bottom: -15px; } @media only screen and (max-width: 47.9375em) { .model-details-compare #compare-container .compare-header .sticky-wrapper.stick .compare-bot.show-diff { bottom: 7px; } } .model-details-compare #compare-container .compare-details .grid-container { padding: 40px 0 30px; padding: 2.5rem 0 1.875rem; } .model-details-compare #compare-container .compare-details .scroll-wrapper>ul>li { border-left: 1px solid #d9d9d9; } .model-details-compare #compare-container .compare-details .scroll-wrapper>ul>li:first-child { border-left: none; } .model-details-compare #compare-container .compare-details .scroll-wrapper>ul ul li { font-size: 14px; font-size: .875rem; line-height: 20px; line-height: 1.25rem; padding: 10px 20px; padding: .625rem 1.25rem; color: #616161; font-weight: 300; display: block; } .model-details-compare #compare-container .compare-details .scroll-wrapper>ul ul li>span { display: block; overflow: hidden; text-indent: -99999px; opacity: 0; } .model-details-compare #compare-container .compare-details .scroll-wrapper>ul ul li>span.icon-info { display: none; } .model-details-compare #compare-container .compare-details .scroll-wrapper>ul>li.show ul li>span { text-indent: 0; opacity: 1; } .model-details-compare #compare-container .compare-details .scroll-wrapper>ul>li.show ul li>span.equal-height { display: block; min-height: 16px; } .model-details-compare #compare-container .compare-details .scroll-wrapper>ul>li.show ul li>span .gux-tooltip { display: inline-block; line-height: 20px; line-height: 1.25rem; position: relative; top: 4px; vertical-align: top; } .model-details-compare #compare-container .compare-details .scroll-wrapper>ul>li.show ul li>span .gux-tooltip:after { font-size: 14px; font-size: .875rem; display: inline-block; vertical-align: top; margin: 0 0 0 3px; color: #2c94ca; } .model-details-compare #compare-container .compare-details .scroll-wrapper>ul ul li:nth-child(2n) { background: #f7f7f7; } .model-details-compare #compare-container .compare-footer { display: none; visibility: hidden; } @media screen and (max-width: 1439px) { .model-details-compare { padding-left: 35px; padding-left: 2.1875rem; padding-right: 35px; padding-right: 2.1875rem; } .model-details-compare #compare-container .scroll-wrapper>ul>li { width: 310px; } } @media screen and (max-width: 1199px) { .model-details-compare { padding-left: 35px; padding-left: 2.1875rem; padding-right: 35px; padding-right: 2.1875rem; } .model-details-compare #title-wrapper .page-title { padding: 0 250px 40px 0; padding: 0 15.625rem 2.5rem 0; } .model-details-compare #title-wrapper h1 { font-size: 30px; font-size: 1.875rem; margin: 0 0 10px; margin: 0 0 .625rem; } .model-details-compare .btn.back-to-overview { font-size: 16px; font-size: 1rem; line-height: 50px; line-height: 3.125rem; padding: 0 45px; padding: 0 2.8125rem; } .model-details-compare #compare-container .group-label { font-size: 26px; font-size: 1.625rem; line-height: 40px; line-height: 2.5rem; } .model-details-compare #compare-container .scroll-wrapper>ul>li { width: 268px; } .model-details-compare #compare-container .compare-header .grid-container { padding-bottom: 20px; padding-bottom: 1.25rem; } .model-details-compare #compare-container .compare-header .sticky-wrapper.stick .grid-container { padding-left: 35px; padding-left: 2.1875rem; padding-right: 35px; padding-right: 2.1875rem; } .model-details-compare #compare-container .compare-header .scroll-wrapper .btn { font-size: 13px; font-size: .8125rem; } .model-details-compare #compare-container .compare-header .scroll-wrapper>ul>li { padding: 0 20px; padding: 0 1.25rem; } .model-details-compare #compare-container .compare-header .scroll-wrapper [data-toggle] ul li span, .model-details-compare #compare-container .compare-header .scroll-wrapper [data-toggle] ul li label { font-size: 12px; font-size: .75rem; padding-right: 0; padding-right: 0; } } @media screen and (max-width: 767px) { .hidden-mobile { display: none; visibility: hidden; } .model-details-compare { padding: 50px 0; padding: 3.125rem 0; } .model-details-compare .btn { font-size: 20px; font-size: 1.25rem; line-height: 45px; line-height: 2.8125rem; } .model-details-compare #title-wrapper .page-title { padding: 0 25px 60px; padding: 0 1.5625rem 3.75rem; text-align: center; } .model-details-compare #title-wrapper h1 { font-size: 42px; font-size: 2.625rem; margin: 0 0 12px; margin: 0 0 .75rem; } .model-details-compare #title-wrapper .btn.back-to-overview { margin-top: 20px; margin-top: 1.25rem; float: none; position: relative; right: auto; top: auto; display: inline-block; } .model-details-compare #title-wrapper p { font-size: 14px; font-size: .875rem; } .model-details-compare .btn.back-to-overview { font-size: 21px; font-size: 1.3125rem; line-height: 64px; line-height: 4rem; padding: 0 95px; padding: 0 5.9375rem; } .model-details-compare #compare-container .group-label { font-size: 45px; font-size: 2.8125rem; padding: 0 25px 25px; padding: 0 1.5625rem 1.5625rem; margin: 0; line-height: 1.2; width: 100%; } .model-details-compare #compare-container .scroll-wrapper { width: 100%; } .model-details-compare #compare-container .scroll-wrapper>ul { margin: 0; margin: 0; padding: 0 0 25px; padding: 0 0 1.5625rem; } .model-details-compare #compare-container .scroll-wrapper>ul>li { width: 295px; } .model-details-compare #compare-container .compare-header .grid-container { padding: 0 5px 28px; padding: 0 .3125rem 1.75rem; } .model-details-compare #compare-container .compare-header .scroll-wrapper>ul>li { padding: 0 10px; padding: 0 .625rem; } .model-details-compare #compare-container .compare-header .scroll-wrapper .model-name { font-size: 20px; font-size: 1.25rem; line-height: 29px; line-height: 1.8125rem; margin: 0 0 18px; margin: 0 0 1.125rem; text-indent: 0; text-align: center; } .model-details-compare #compare-container .compare-header .scroll-wrapper .image { margin: 0 -15px 25px; margin: 0 -.9375rem 1.5625rem; } .model-details-compare #compare-container .compare-header .scroll-wrapper .image.active { margin: 0; width: 100%; } .model-details-compare #compare-container .compare-header .scroll-wrapper [data-toggle] ul { padding: 0 0 20px; padding: 0 0 1.25rem; margin: 0; margin: 0; } .model-details-compare #compare-container .compare-header .scroll-wrapper [data-toggle] ul li span, .model-details-compare #compare-container .compare-header .scroll-wrapper [data-toggle] ul li label { font-size: 15px; font-size: .9375rem; padding-right: 0; padding-right: 0; line-height: 48px; line-height: 3rem; } .model-details-compare #compare-container .compare-header .scroll-wrapper [data-toggle] ul li span { margin-top: -10px; margin-top: -.625rem; } .model-details-compare #compare-container .compare-header .scroll-wrapper .btn { font-size: 20px; font-size: 1.25rem; } .model-details-compare #compare-container .compare-header .scroll-wrapper .btn.btn-white { display: none; visibility: hidden; } .model-details-compare #compare-container .compare-header .sticky-wrapper.stick { padding: 0; } .model-details-compare #compare-container .compare-header .sticky-wrapper.stick .grid-container { padding: 0; } .model-details-compare #compare-container .compare-header .sticky-wrapper.stick .grid-container .image, .model-details-compare #compare-container .compare-header .sticky-wrapper.stick .grid-container [data-toggle], .model-details-compare #compare-container .compare-header .sticky-wrapper.stick .grid-container .btn, .model-details-compare #compare-container .compare-header .sticky-wrapper.stick .grid-container .btn.back-to-overview { display: none; visibility: hidden; } .model-details-compare #compare-container .compare-header .sticky-wrapper.stick .grid-container .model-name { margin: 0; font-size: 28px; font-size: 1.75rem; line-height: 43px; line-height: 2.6875rem; padding: 12px 25px; padding: .75rem 1.5625rem; text-align: center; } .model-details-compare #compare-container .compare-header .sticky-wrapper.stick .scroll-wrapper>ul>li { padding: 0; border-right: 1px solid #d9d9d9; } .model-details-compare #compare-container .compare-details .grid-container { padding: 40px 0 30px; padding: 2.5rem 0 1.875rem; } .model-details-compare #compare-container .compare-details .scroll-wrapper>ul>li { border: none; } .model-details-compare #compare-container .compare-details .scroll-wrapper>ul ul li { font-size: 25px; font-size: 1.5625rem; line-height: 29px; line-height: 1.8125rem; padding: 16px 25px; padding: 1rem 1.5625rem; } .model-details-compare #compare-container .compare-footer { background: #fff; padding: 0 5px; padding: 0 .3125rem; border-top: 1px solid #d9d9d9; border-top: .0625rem solid #d9d9d9; display: block; visibility: visible; position: fixed; z-index: 499; bottom: 0; left: 0; } .model-details-compare #compare-container .compare-footer .group-label { display: none; visibility: hidden; } .model-details-compare #compare-container .compare-footer .grid-container { border: none; } .model-details-compare #compare-container .compare-footer .scroll-wrapper>ul { padding: 45px 0 60px; padding: 2.8125rem 0 3.75rem; } .model-details-compare #compare-container .compare-footer .scroll-wrapper>ul>li { padding: 0 20px; padding: 0 1.25rem; } } @media screen and (max-width: 767px) { .modelDetailsCompare.resultsPage .model-details-compare #compare-container .compare-header .scroll-wrapper>ul>li { width: 50% !important; } .modelDetailsCompare.resultsPage .model-details-compare #compare-container .compare-details .scroll-wrapper>ul>li { width: 50% !important; } .modelDetailsCompare.resultsPage .model-details-compare #compare-container .compare-footer .scroll-wrapper>ul>li { width: 50% !important; } .modelDetailsCompare.detailsPage .model-details-compare #compare-container .compare-header .scroll-wrapper>ul>li, .modelDetailsCompare.detailsPage .model-details-compare #compare-container .compare-details .scroll-wrapper>ul>li, .modelDetailsCompare.detailsPage .model-details-compare #compare-container .compare-footer .scroll-wrapper>ul>li { display: none; } .modelDetailsCompare.detailsPage .model-details-compare #compare-container .compare-header .scroll-wrapper>ul>li:first-child, .modelDetailsCompare.detailsPage .model-details-compare #compare-container .compare-details .scroll-wrapper>ul>li:first-child, .modelDetailsCompare.detailsPage .model-details-compare #compare-container .compare-footer .scroll-wrapper>ul>li:first-child { display: block !important; margin: 0 auto; } } @media screen and (max-width: 639px) { .model-details-compare { padding: 40px 0; padding: 2.5rem 0; } .model-details-compare .btn { font-size: 16px; font-size: 1rem; line-height: 30px; line-height: 1.875rem; } .model-details-compare #title-wrapper .page-title { padding: 0 25px 40px; padding: 0 1.5625rem 2.5rem; } .model-details-compare #title-wrapper h1 { font-size: 22px; font-size: 1.375rem; margin: 0 0 8px; margin: 0 0 .5rem; } .model-details-compare #title-wrapper .btn.back-to-overview { margin-top: 15px; margin-top: .9375rem; } .model-details-compare #title-wrapper p { font-size: 12px; font-size: .75rem; } .model-details-compare .btn.back-to-overview { font-size: 14px; font-size: .875rem; line-height: 40px; line-height: 2.5rem; padding: 0 50px; padding: 0 3.125rem; } .model-details-compare #compare-container .group-label { font-size: 26px; font-size: 1.625rem; padding: 0 25px 20px; padding: 0 1.5625rem 1.25rem; } .model-details-compare #compare-container .compare-header .scroll-wrapper .model-name { font-size: 16px; font-size: 1rem; line-height: 24px; line-height: 1.5rem; } .model-details-compare #compare-container .compare-header .scroll-wrapper .image { margin: 0 0 10px; margin: 0 0 .625rem; } .model-details-compare #compare-container .compare-header .scroll-wrapper [data-toggle] ul { padding: 0 0 10px; padding: 0 0 .625rem; margin: 0; margin: 0; } .model-details-compare #compare-container .compare-header .scroll-wrapper [data-toggle] ul li span, .model-details-compare #compare-container .compare-header .scroll-wrapper [data-toggle] ul li label { font-size: 13px; font-size: .8125rem; line-height: 38px; line-height: 2.375rem; } .model-details-compare #compare-container .compare-header .scroll-wrapper .btn { font-size: 14px; font-size: .875rem; line-height: 25px; line-height: 1.5625rem; } .model-details-compare #compare-container .compare-header .sticky-wrapper.stick .grid-container .model-name { font-size: 18px; font-size: 1.125rem; line-height: 24px; line-height: 1.5rem; padding: 10px 25px; padding: .625rem 1.5625rem; } .model-details-compare #compare-container .compare-details .grid-container { padding: 25px 0; padding: 1.5625rem 0; } .model-details-compare #compare-container .compare-details .scroll-wrapper>ul ul li { font-size: 12px; font-size: .75rem; line-height: 16px; line-height: 1rem; padding: 8px 15px; padding: .5rem .9375rem; } .model-details-compare #compare-container .compare-footer .scroll-wrapper>ul { padding: 20px 0 35px; padding: 1.25rem 0 2.1875rem; } .model-details-compare #compare-container .compare-footer .scroll-wrapper>ul>li { padding: 0 10px; padding: 0 .625rem; } .model-details-compare #compare-container .compare-footer .scroll-wrapper>ul .btn { line-height: 30px; font-size: 11px; font-size: .6875rem; } } .model-popup-background { height: 100%; width: 100%; position: fixed; left: 0; top: 0; z-index: 9999; float: left; background: rgba(0,0,0,0.4); } .popup-select-other-model { position: fixed; z-index: 10000; left: 50%; top: 50%; -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 875px; background: #fff; padding: 40px 40px 55px; padding: 2.5rem 2.5rem 3.4375rem; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; float: left; display: none; } .popup-select-other-model.before-show, .popup-select-other-model.active { display: block; } .popup-select-other-model * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .popup-select-other-model *:before, .popup-select-other-model *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .popup-select-other-model .popup-wrapper { display: block; } .popup-select-other-model .popup-wrapper:after { content: ""; display: table; clear: both; } .popup-select-other-model a.close { margin: 5px 0 0; margin: .3125rem 0 0; background: transparent url("/etc/designs/guxfoap/clientlibs/guxfoap/img/modelDetailsCompare/model-details-compare.png") no-repeat left bottom; background-image: url(/etc/designs/guxfoap/clientlibs/guxfoap/img/modelDetailsCompare/model-details-compare.png); background-position: left bottom; float: right; width: 29px; height: 29px; text-indent: -9999px; overflow: hidden; } @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3 / 2), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { .popup-select-other-model a.close { background-image: url(/etc/designs/guxfoap/clientlibs/guxfoap/img/modelDetailsCompare/model-details-compare@2x.png); -moz-background-size: 29px 76px; -webkit-background-size: 29px 76px; -o-background-size: 29px 76px; background-size: 29px 76px; } } .popup-select-other-model #popup-content { font-weight: 300; } .popup-select-other-model #popup-content h2 { font-size: 36px; font-size: 2.25rem; margin: -12px 0 40px; margin: -.75rem 0 2.5rem; color: #616161; font-weight: 200; } .popup-select-other-model #popup-content .list-model { float: left; width: 100%; height: auto; max-height: 350px; overflow-x: hidden; overflow-y: auto; } .popup-select-other-model #popup-content .list-model ul { display: block; margin: 0 -2px; margin: 0 -.125rem; padding: 0; } .popup-select-other-model #popup-content .list-model li { padding: 8px 2px; padding: .5rem .125rem; margin: 0 -4px 0 0; display: inline-block; width: 50%; vertical-align: top; } @media only screen and (max-width: 768px) { .popup-select-other-model #popup-content .list-model li { margin: 0; } } .popup-select-other-model #popup-content .list-model .desc { padding: 10px 120px 10px 44px; padding: .625rem 7.5rem .625rem 2.75rem; border: 1px solid transparent; border: .0625rem solid transparent; display: block; position: relative; min-height: 60px; } .popup-select-other-model #popup-content .list-model .desc:after { content: ""; display: table; clear: both; } @media screen and (max-width: 767px) { .popup-select-other-model #popup-content .list-model .desc { min-height: 82px; } } .popup-select-other-model #popup-content .list-model .desc h3 { font-size: 16px; font-size: 1rem; line-height: 21px; line-height: 1.3125rem; margin: -3px 0 5px; margin: -.1875rem 0 .3125rem; font-weight: 300; color: #000; } .popup-select-other-model #popup-content .list-model .desc p { margin: 0 0 2px; margin: 0 0 .125rem; color: #616161; } .popup-select-other-model #popup-content .list-model .desc .img { float: right; position: absolute; right: 3px; top: 0; bottom: 0; width: 115px; overflow: hidden; } .popup-select-other-model #popup-content .list-model .desc .img img { display: block; width: 100%; height: auto; } .popup-select-other-model #popup-content .list-model .desc .input-checkbox { float: left; position: absolute; left: 10px; top: 10px; } .popup-select-other-model #popup-content .list-model .desc:hover { padding: 10px 120px 10px 44px; padding: .625rem 7.5rem .625rem 2.75rem; border: 1px solid #2c94ca; border: .0625rem solid #2c94ca; } .popup-select-other-model #popup-content .list-model .desc.disabled { opacity: .3; filter: alpha(opacity=30); } .popup-select-other-model #popup-content .list-model .desc.disabled:hover { border-color: #fff; } .popup-select-other-model #popup-content .action { float: left; width: 100%; text-align: center; padding: 35px 0 0; padding: 2.1875rem 0 0; } .popup-select-other-model #popup-content .action .btn { font-size: 16px; font-size: 1rem; line-height: 48px; line-height: 3rem; width: 230px; width: 14.375rem; margin: 0 4px; margin: 0 .25rem; padding: 0px 0px; padding: 0rem 0rem; font-weight: normal; background: #2c94ca; color: #fff; text-align: center; display: inline-block; text-decoration: none; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear; text-decoration: none !important; border: 1px solid #2c94ca; } .popup-select-other-model #popup-content .action .btn:hover { background: #1b394e; border-color: #1b394e; } .popup-select-other-model #popup-content .action .btn.btn-white { background: #fff; color: #2c94ca; border: 1px solid #2c94ca; } .popup-select-other-model #popup-content .action .btn.btn-white:hover { background: #1b394e; border-color: #1b394e; color: #fff; } @media screen and (max-width: 1199px) { .popup-select-other-model { width: 720px; padding: 30px 30px 40px; padding: 1.875rem 1.875rem 2.5rem; } .popup-select-other-model #popup-content h2 { margin: -12px 0 30px; margin: -.75rem 0 1.875rem; } .popup-select-other-model #popup-content .action { padding: 25px 0 0; padding: 1.5625rem 0 0; } } @media screen and (max-width: 767px) { .model-popup-background { display: none !important; visibility: hidden !important; } .popup-select-other-model { width: 100%; height: 100%; padding: 56px 0 80px; padding: 3.5rem 0 5rem; left: 0; top: 0; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; } .popup-select-other-model .popup-wrapper { height: 100%; } .popup-select-other-model a.close { width: 22px; height: 22px; margin: 2px 0 0 0; margin: .125rem 0 0 0; background-position: -4px -51px; position: absolute; top: 16px; right: 20px; z-index: 10; } .popup-select-other-model #popup-content { display: block; height: 100%; } .popup-select-other-model #popup-content h2 { font-size: 14px; font-size: .875rem; padding: 15px 20px; padding: .9375rem 1.25rem; line-height: 26px; line-height: 1.625rem; border-bottom: 1px solid #d9d9d9; border-bottom: .0625rem solid #d9d9d9; margin: 0; float: left; width: 100%; position: absolute; left: 0; top: 0; z-index: 9; } .popup-select-other-model #popup-content .list-model { height: 100%; max-height: 100%; } .popup-select-other-model #popup-content .list-model ul { padding: 10px 12px; padding: .625rem .75rem; margin: 0; } .popup-select-other-model #popup-content .list-model li { margin: 0; display: block; width: auto; } .popup-select-other-model #popup-content .list-model .desc p { font-size: 13px; font-size: .8125rem; } .popup-select-other-model #popup-content .action { padding: 22px 18px; padding: 1.375rem 1.125rem; border-top: 1px solid #d9d9d9; border-top: .0625rem solid #d9d9d9; background: #fff; position: absolute; z-index: 10; left: 0; bottom: 0; } .popup-select-other-model #popup-content .action .btn { font-size: 12px; font-size: .75rem; line-height: 32px; line-height: 2rem; float: left; width: 49%; margin: 0; } .popup-select-other-model #popup-content .action .btn+.btn { float: right; } } .input-checkbox { border: 1px solid #2c94ca; border: .0625rem solid #2c94ca; background: #fff url("/etc/designs/guxfoap/clientlibs/guxfoap/img/modelDetailsCompare/model-details-compare.png") no-repeat; background-image: url(/etc/designs/guxfoap/clientlibs/guxfoap/img/modelDetailsCompare/model-details-compare.png); background-position: -9999px -9999px; cursor: pointer; display: inline-block; width: 21px; height: 21px; text-indent: -9999px; overflow: hidden; position: relative; } @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3 / 2), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { .input-checkbox { background-image: url(/etc/designs/guxfoap/clientlibs/guxfoap/img/modelDetailsCompare/model-details-compare@2x.png); -moz-background-size: 29px 76px; -webkit-background-size: 29px 76px; -o-background-size: 29px 76px; background-size: 29px 76px; } } .input-checkbox input { float: left; position: absolute; left: -999px; top: -999px; } .input-checkbox.checked { background-color: #2c94ca; background-position: 3px 4px; } .input-checkbox.disabled { cursor: default; } .ie8 #global-ux .model-popup-background { background: #959595; } .ie8 #global-ux .model-details-compare h2 { font-size: 2.625rem; } .ie8 .input-checkbox { background-image: none; border: 1px solid #2e97d0; } .ie8 .input-checkbox input { float: left; position: absolute; left: -999px; top: -999px; } .ie8 .input-checkbox.checked { background-color: #2c94ca; background-image: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/modelCompare/check-icon.jpg"); background-position: center center; } .ie8 .input-checkbox.checked span { background-color: #2c94ca !important; background-image: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/modelCompare/check-icon.jpg") !important; background-position: center center !important; } .ie8 .input-checkbox.disabled { cursor: default; } .ie8 .popup-select-other-model #popup-content .list-model .desc.disabled { filter: alpha(opacity=30); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; } .ie8 .popup-select-other-model a.close { background: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/modelDetailsCompare/model-details-compare.jpg") 0 0 no-repeat; display: block; } #global-ux .model-details-compare .scroll-wrapper { position: relative; padding-bottom: 20px; margin-bottom: 20px; } @media only screen and (max-width: 74.9375em) { #global-ux .model-details-compare .scroll-wrapper { padding-bottom: 30px; } } @media only screen and (max-width: 47.9375em) { #global-ux .model-details-compare .scroll-wrapper { padding-bottom: 40px; margin-bottom: 0; } } #global-ux .model-details-compare .scroll-wrapper .compare-bot.show-diff { position: absolute; bottom: 0; right: 35px; color: #2C94CA; white-space: nowrap; transition: all 0s !important; } #global-ux .model-details-compare .scroll-wrapper .compare-bot.show-diff .input-checkbox input[type="checkbox"] { left: 0; top: 0; z-index: 3; } #global-ux .model-details-compare .scroll-wrapper .compare-bot.show-diff .input-checkbox input[type="checkbox"], #global-ux .model-details-compare .scroll-wrapper .compare-bot.show-diff .input-checkbox input[type="checkbox"]+span { width: 21px; height: 21px; transition: all 0.25s ease-in 0s; } #global-ux .model-details-compare .scroll-wrapper .compare-bot.show-diff .input-checkbox input[type="checkbox"]+span { position: absolute; display: block; border: 1px solid #2c94ca; border: .0625rem solid #2c94ca; background: #fff url("/etc/designs/guxfoap/clientlibs/guxfoap/img/modelDetailsCompare/model-details-compare.png") no-repeat; background-image: url(/etc/designs/guxfoap/clientlibs/guxfoap/img/modelDetailsCompare/model-details-compare.png); background-position: -9999px -9999px; } @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3 / 2), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { #global-ux .model-details-compare .scroll-wrapper .compare-bot.show-diff .input-checkbox input[type="checkbox"]+span { background-image: url(/etc/designs/guxfoap/clientlibs/guxfoap/img/modelDetailsCompare/model-details-compare@2x.png); -moz-background-size: 29px 76px; -webkit-background-size: 29px 76px; -o-background-size: 29px 76px; background-size: 29px 76px; } } #global-ux .model-details-compare .scroll-wrapper .compare-bot.show-diff .input-checkbox input[type="checkbox"]:checked+span { background-color: #2c94ca; background-position: 3px 4px; } #global-ux .model-details-compare .scroll-wrapper .compare-bot.show-diff .input-checkbox { margin-right: 15px; top: 4px; border: none; background: transparent; } #global-ux .model-details-compare .scroll-wrapper .compare-bot.show-diff .input-checkbox.checked input[type="checkbox"]>span { background-color: #2c94ca; background-position: 3px 4px; } @media only screen and (max-width: 767px) { #global-ux .model-details-compare .scroll-wrapper .compare-bot.show-diff { right: auto; left: 50%; -ms-transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); } } #global-ux .model-details-compare .btn.select-to-compare.btn-disabled, #global-ux .model-details-compare .btn.addto-compare.btn-disabled { display: none !important; } #global-ux .model-details-compare #compare-container .compare-header .scroll-wrapper .this-page-of-this-model .btn.select-to-compare, #global-ux .model-details-compare #compare-container .compare-footer .scroll-wrapper>ul .this-page-of-this-model .btn { background: #dfdfdf; color: #616161; border-color: #dadada; cursor: default; } #global-ux .model-details-compare #compare-container .compare-header.single-model .scroll-wrapper>ul>li, #global-ux .model-details-compare #compare-container #detailsSection .single-model .scroll-wrapper>ul>li { width: 100% !important; display: none !important; } #global-ux .model-details-compare #compare-container .compare-header.single-model .scroll-wrapper>ul>li:first-child, #global-ux .model-details-compare #compare-container #detailsSection .single-model .scroll-wrapper>ul>li:first-child { display: block !important; } #global-ux .model-details-compare #compare-container .compare-footer.single-model .scroll-wrapper>ul>li { width: 100% !important; display: none !important; } #global-ux .model-details-compare #compare-container .compare-footer.single-model .scroll-wrapper>ul>li:nth-child(2) { display: block !important; } .rtl .model-details-compare #compare-container .compare-details .scroll-wrapper>ul>li.show ul li>span.icon-info:after { margin: 0 3px 0 0; } .rtl .popup-select-other-model #popup-content .list-model .desc { padding: 10px 125px 10px 44px; padding: .625rem 7.8125rem .625rem 2.75rem; border: 1px solid transparent; border: .0625rem solid transparent; } .rtl .popup-select-other-model #popup-content .list-model .desc:hover { padding: 10px 125px 10px 44px; padding: .625rem 7.8125rem .625rem 2.75rem; border: 1px solid #2c94ca; border: .0625rem solid #2c94ca; } @media only screen and (max-width: 479px) { .rtl .popup-select-other-model #popup-content .list-model .desc { padding: 10px 130px 10px 44px; padding: .625rem 8.125rem .625rem 2.75rem; border: 1px solid transparent; border: .0625rem solid transparent; } .rtl .popup-select-other-model #popup-content .list-model .desc:hover { padding: 10px 130px 10px 44px; padding: .625rem 8.125rem .625rem 2.75rem; border: 1px solid #2c94ca; border: .0625rem solid #2c94ca; } } #store-locator-wrapper { display: block; position: relative; } #store-locator-wrapper:after { content: ""; display: table; clear: both; } #store-locator-wrapper * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #store-locator-wrapper *:before, #store-locator-wrapper *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #store-locator-wrapper a { text-decoration: none !important; outline: none !important; } #store-locator-wrapper input::-webkit-input-placeholder { color: #626466; opacity: 1; filter: alpha(opacity=100); font-style: italic; text-overflow: ellipsis; white-space: nowrap; } #store-locator-wrapper input::-moz-placeholder { color: #626466; opacity: 1; filter: alpha(opacity=100); font-style: italic; text-overflow: ellipsis; white-space: nowrap; } #store-locator-wrapper input:-ms-input-placeholder { color: #626466; opacity: 1; filter: alpha(opacity=100); font-style: italic; text-overflow: ellipsis; white-space: nowrap; } #store-locator-wrapper input:-moz-placeholder { color: #626466; opacity: 1; filter: alpha(opacity=100); font-style: italic; text-overflow: ellipsis; white-space: nowrap; } #store-locator-wrapper .store-locator-sidebar { width: 488px; width: 30.5rem; left: 45px; left: 2.8125rem; top: 70px; top: 4.375rem; float: left; position: absolute; z-index: 100; } #store-locator-wrapper .store-locator-sidebar>h2 { font-size: 44px; font-size: 2.75rem; margin: 0 0 15px; margin: 0 0 .9375rem; line-height: 1.2; text-shadow: 1px 1px 1px #555; font-weight: 200; color: #fff; } @media only screen and (max-width: 74.9375em) { #store-locator-wrapper .store-locator-sidebar { width: 400px; width: 25rem; } #store-locator-wrapper .store-locator-sidebar>h2 { font-size: 40px; font-size: 2.5rem; margin: 0 0 12px; margin: 0 0 .75rem; } } @media only screen and (max-width: 61.9375em) { #store-locator-wrapper .store-locator-sidebar { width: 300px; width: 18.75rem; left: 35px; left: 2.1875rem; top: 50px; top: 3.125rem; } #store-locator-wrapper .store-locator-sidebar>h2 { font-size: 32px; font-size: 2rem; margin: 0 0 10px; margin: 0 0 .625rem; } } @media only screen and (max-width: 47.9375em) { #store-locator-wrapper .store-locator-sidebar { float: none; position: relative; left: auto; top: auto; display: block; width: auto; } #store-locator-wrapper .store-locator-sidebar:after { content: ""; display: table; clear: both; } #store-locator-wrapper .store-locator-sidebar>h2 { display: none; } } #store-locator-wrapper .store-locator-background { display: block; text-align: center; } #store-locator-wrapper .store-locator-background img { display: block; width: 100%; height: auto; margin: 0; } #store-locator-wrapper .store-locator-search-form { background: #fff; display: block; position: relative; z-index: 50; -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=135, Color=#666666)"; -moz-box-shadow: 2px 2px 2px rgba(0,0,0,0.3); -webkit-box-shadow: 2px 2px 2px rgba(0,0,0,0.3); box-shadow: 2px 2px 2px rgba(0,0,0,0.3); } #store-locator-wrapper .store-locator-search-form:after { content: ""; display: table; clear: both; } #store-locator-wrapper .store-locator-search-form .btn-geo-location { padding: 0 25px; padding: 0 1.5625rem; font-size: 20px; font-size: 1.25rem; line-height: 80px; line-height: 5rem; font-weight: normal; display: block; background: #2596cf; color: #fff; } #store-locator-wrapper .store-locator-search-form .btn-geo-location span { font-size: 40px; font-size: 2.5rem; margin: -5px 12px 0 0; margin: -.3125rem .75rem 0 0; display: inline-block; } @media only screen and (max-width: 74.9375em) { #store-locator-wrapper .store-locator-search-form .btn-geo-location { padding: 0 20px; padding: 0 1.25rem; font-size: 18px; font-size: 1.125rem; line-height: 60px; line-height: 3.75rem; } #store-locator-wrapper .store-locator-search-form .btn-geo-location span { font-size: 30px; font-size: 1.875rem; margin: -2px 12px 0 0; margin: -.125rem .75rem 0 0; } } @media only screen and (max-width: 61.9375em) { #store-locator-wrapper .store-locator-search-form .btn-geo-location { padding: 0 15px; padding: 0 .9375rem; font-size: 14px; font-size: .875rem; line-height: 50px; line-height: 3.125rem; } #store-locator-wrapper .store-locator-search-form .btn-geo-location span { font-size: 24px; font-size: 1.5rem; margin: -2px 10px 0 0; margin: -.125rem .625rem 0 0; } } @media only screen and (max-width: 47.9375em) { #store-locator-wrapper .store-locator-search-form .btn-geo-location { padding: 0 25px; padding: 0 1.5625rem; } } #store-locator-wrapper .store-locator-search-form .locator-input { display: block; position: relative; } #store-locator-wrapper .store-locator-search-form .locator-input:after { content: ""; display: table; clear: both; } #store-locator-wrapper .store-locator-search-form .locator-input .input-text { height: 80px; height: 5rem; font-size: 20px; font-size: 1.25rem; padding: 0 70px 0 25px; padding: 0 4.375rem 0 1.5625rem; margin: 0; color: #626466; font-weight: 300; line-height: 1; display: block; width: 100%; border: none; } #store-locator-wrapper .store-locator-search-form .locator-input .button { width: 70px; width: 4.375rem; height: 80px; height: 5rem; line-height: 80px; line-height: 5rem; margin: 0; padding: 0; color: #bbb; background: transparent; position: absolute; right: 0; top: 0; text-align: center; } #store-locator-wrapper .store-locator-search-form .locator-input .button span { font-size: 35px; font-size: 2.1875rem; } @media only screen and (max-width: 74.9375em) { #store-locator-wrapper .store-locator-search-form .locator-input .input-text { height: 60px; height: 3.75rem; font-size: 16px; font-size: 1rem; padding: 0 60px 0 20px; padding: 0 3.75rem 0 1.25rem; } #store-locator-wrapper .store-locator-search-form .locator-input .button { width: 60px; width: 3.75rem; height: 60px; height: 3.75rem; line-height: 60px; line-height: 3.75rem; } #store-locator-wrapper .store-locator-search-form .locator-input .button span { font-size: 30px; font-size: 1.875rem; } } @media only screen and (max-width: 61.9375em) { #store-locator-wrapper .store-locator-search-form .locator-input .input-text { height: 50px; height: 3.125rem; font-size: 12px; font-size: .75rem; padding: 0 50px 0 15px; padding: 0 3.125rem 0 .9375rem; } #store-locator-wrapper .store-locator-search-form .locator-input .button { width: 50px; width: 3.125rem; height: 50px; height: 3.125rem; line-height: 50px; line-height: 3.125rem; } #store-locator-wrapper .store-locator-search-form .locator-input .button span { font-size: 24px; font-size: 1.5rem; } } @media only screen and (max-width: 47.9375em) { #store-locator-wrapper .store-locator-search-form .locator-input .input-text { padding: 0 75px 0 25px; padding: 0 4.6875rem 0 1.5625rem; } #store-locator-wrapper .store-locator-search-form .locator-input .button { width: 75px; width: 4.6875rem; } } #store-locator-wrapper .store-locator-search-form .suggestion-block { padding: 25px 25px 15px 25px; padding: 1.5625rem 1.5625rem .9375rem 1.5625rem; font-size: 20px; font-size: 1.25rem; border-top: 1px solid #dbdbdb; border-top: .0625rem solid #dbdbdb; display: block; position: absolute; left: 0; top: 100%; float: left; width: 100%; background: #fff; -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=135, Color=#666666)"; -moz-box-shadow: 2px 2px 2px rgba(0,0,0,0.3); -webkit-box-shadow: 2px 2px 2px rgba(0,0,0,0.3); box-shadow: 2px 2px 2px rgba(0,0,0,0.3); z-index: 60; } #store-locator-wrapper .store-locator-search-form .suggestion-block:after { content: ""; display: table; clear: both; } #store-locator-wrapper .store-locator-search-form .suggestion-block em { margin-bottom: 5px; margin-bottom: .3125rem; font-weight: 300; color: #626466; display: block; } #store-locator-wrapper .store-locator-search-form .suggestion-block ul { list-style: none; margin: 0; padding: 0; } #store-locator-wrapper .store-locator-search-form .suggestion-block li { padding: 10px 0; padding: .625rem 0; font-size: 20px; font-size: 1.25rem; display: block; line-height: 1.2; color: #2596cf; font-weight: bold; } #store-locator-wrapper .store-locator-search-form .suggestion-block li a { color: #2596cf; } @media only screen and (max-width: 74.9375em) { #store-locator-wrapper .store-locator-search-form .suggestion-block { padding: 20px 20px 15px 20px; padding: 1.25rem 1.25rem .9375rem 1.25rem; font-size: 16px; font-size: 1rem; } #store-locator-wrapper .store-locator-search-form .suggestion-block li { padding: 8px 0; padding: .5rem 0; font-size: 16px; font-size: 1rem; } } @media only screen and (max-width: 61.9375em) { #store-locator-wrapper .store-locator-search-form .suggestion-block { padding: 15px 15px 10px 15px; padding: .9375rem .9375rem .625rem .9375rem; font-size: 12px; font-size: .75rem; } #store-locator-wrapper .store-locator-search-form .suggestion-block li { padding: 6px 0; padding: .375rem 0; font-size: 12px; font-size: .75rem; } } @media only screen and (max-width: 47.9375em) { #store-locator-wrapper .store-locator-search-form .suggestion-block { padding: 15px 25px 10px 25px; padding: .9375rem 1.5625rem .625rem 1.5625rem; } } #store-locator-wrapper .store-locator-search-form .search-msg { padding: 25px 60px 25px 25px; padding: 1.5625rem 3.75rem 1.5625rem 1.5625rem; font-size: 15px; font-size: .9375rem; border-top: 1px solid #dbdbdb; border-top: .0625rem solid #dbdbdb; color: #f34c32; display: block; font-weight: normal; position: relative; } #store-locator-wrapper .store-locator-search-form .search-msg:after { content: ""; display: table; clear: both; } #store-locator-wrapper .store-locator-search-form .search-msg i { right: 25px; right: 1.5625rem; margin: -14px 0 0 0; margin: -.875rem 0 0 0; font-size: 24px; font-size: 1.5rem; float: left; position: absolute; top: 50%; } @media only screen and (max-width: 74.9375em) { #store-locator-wrapper .store-locator-search-form .search-msg { padding: 20px 50px 20px 20px; padding: 1.25rem 3.125rem 1.25rem 1.25rem; font-size: 14px; font-size: .875rem; } #store-locator-wrapper .store-locator-search-form .search-msg i { right: 20px; right: 1.25rem; margin: -12px 0 0 0; margin: -.75rem 0 0 0; font-size: 22px; font-size: 1.375rem; } } @media only screen and (max-width: 61.9375em) { #store-locator-wrapper .store-locator-search-form .search-msg { padding: 15px 50px 15px 15px; padding: .9375rem 3.125rem .9375rem .9375rem; font-size: 12px; font-size: .75rem; } #store-locator-wrapper .store-locator-search-form .search-msg i { right: 15px; right: .9375rem; margin: -10px 0 0 0; margin: -.625rem 0 0 0; font-size: 20px; font-size: 1.25rem; } } @media only screen and (max-width: 47.9375em) { #store-locator-wrapper .store-locator-search-form .search-msg { padding: 15px 75px 15px 25px; padding: .9375rem 4.6875rem .9375rem 1.5625rem; } #store-locator-wrapper .store-locator-search-form .search-msg i { right: 25px; right: 1.5625rem; } } #store-locator-wrapper .demo-page-title { display: none; visibility: hidden; } .demo-page-title { display: block; margin: 0; padding: 60px 45px 20px; font-size: 30px; font-weight: bold; text-transform: uppercase; color: red; } @media only screen and (max-width: 61.9375em) { .demo-page-title { padding: 60px 35px 20px; } } @media only screen and (max-width: 47.9375em) { .demo-page-title { padding: 60px 25px 20px; font-size: 14px; } } #global-ux .accessories.section .accessories, #global-ux .nameplateAccessories.section .accessories { padding: 110px 30px; font-weight: 200; } #global-ux .accessories.section .accessories p, #global-ux .nameplateAccessories.section .accessories p { color: inherit; } #global-ux .accessories.section .accessories p, #global-ux .accessories.section .accessories .name-item p, #global-ux .nameplateAccessories.section .accessories p, #global-ux .nameplateAccessories.section .accessories .name-item p { color: #2596cf; } #global-ux .accessories.section .accessories .heading, #global-ux .nameplateAccessories.section .accessories .heading { text-align: center; position: relative; margin-bottom: 30px; } #global-ux .accessories.section .accessories .heading .title, #global-ux .nameplateAccessories.section .accessories .heading .title { font-size: 42.32px; margin-bottom: 5px; } #global-ux .accessories.section .accessories .heading .description, #global-ux .nameplateAccessories.section .accessories .heading .description { font-size: 14.72px; } #global-ux .accessories.section .accessories .heading .dropdown-filter, #global-ux .nameplateAccessories.section .accessories .heading .dropdown-filter { display: block; position: absolute; z-index: 5; font-size: 20px; top: 25%; right: 16px; } #global-ux .accessories.section .accessories .heading .dropdown-filter .selected-type, #global-ux .nameplateAccessories.section .accessories .heading .dropdown-filter .selected-type { font-size: 16px; color: #40abe7; border: 1px solid; padding: 17px 14px 17px 50px; } #global-ux .accessories.section .accessories .heading .dropdown-filter .selected-type .icon, #global-ux .nameplateAccessories.section .accessories .heading .dropdown-filter .selected-type .icon { background-image: url("/etc/designs/guxfoap/clientlibs/guxfoap/img/colorizer/icons.svg"); background-repeat: no-repeat; background-position: -755px -500px; display: inline-block; height: 10px; left: 87%; margin: 0 14px 0 50px; width: 19px; } #global-ux .accessories.section .accessories .heading .dropdown-filter .selections, #global-ux .nameplateAccessories.section .accessories .heading .dropdown-filter .selections { display: none; list-style: none; margin: 0; padding: 0; } #global-ux .accessories.section .accessories .heading .dropdown-filter .selections li, #global-ux .nameplateAccessories.section .accessories .heading .dropdown-filter .selections li { background: #fff; } #global-ux .accessories.section .accessories .heading .dropdown-filter .selections li a, #global-ux .nameplateAccessories.section .accessories .heading .dropdown-filter .selections li a { text-decoration: none; color: #40abe7; font-size: 16px; display: block; border: 1px solid #40abe7; border-top: none; padding: 17px 0 17px 15px; text-align: left; } #global-ux .accessories.section .accessories .heading .dropdown-filter .selections li:hover a, #global-ux .nameplateAccessories.section .accessories .heading .dropdown-filter .selections li:hover a { background: #40abe7; color: #fff; } @media only screen and (min-width: 768px) { #global-ux .accessories.section .accessories .heading, #global-ux .nameplateAccessories.section .accessories .heading { line-height: normal; padding: 0 210px; } } @media only screen and (min-width: 1025px) { #global-ux .accessories.section .accessories .heading, #global-ux .nameplateAccessories.section .accessories .heading { line-height: normal; padding: 0 220px; } } #global-ux .accessories.section .accessories .filter-content .list-items, #global-ux .nameplateAccessories.section .accessories .filter-content .list-items { list-style: none; font-size: 0px; text-align: center; margin: 0 auto; } #global-ux .accessories.section .accessories .filter-content .list-items .item, #global-ux .nameplateAccessories.section .accessories .filter-content .list-items .item { display: block; padding: 16.5px 16.5px 40px; font-size: 16px; font-size: 1rem; vertical-align: top; width: 25%; float: left; text-align: left; } @media only screen and (min-width: 48em) { #global-ux .accessories.section .accessories .filter-content .list-items .item.clearl, #global-ux .nameplateAccessories.section .accessories .filter-content .list-items .item.clearl { clear: left; } } #global-ux .accessories.section .accessories .filter-content .list-items .item img, #global-ux .nameplateAccessories.section .accessories .filter-content .list-items .item img { max-width: 100%; height: auto; margin: 0; } #global-ux .accessories.section .accessories .filter-content .list-items .item .name-item, #global-ux .nameplateAccessories.section .accessories .filter-content .list-items .item .name-item { font-size: 12px; left: 0; display: inline-block; padding: 15px 0 0; }