@media screen and (min-width: 1201px) and (max-width: 1499px) {
header {
padding: 0 15px;
}
header .headercontainer .headermain .navListing {
gap: 55px;
} header .headercontainer .headermain .navListing li.logoWrap {
margin: 0 25px;
} .heroHeader .paralaxContain .heroInfo {
top: 105px !important;
}
.heroHeader .paralaxContain .heroInfo .gotoBttn {
bottom: 10px;
}
footer .footerContainer {
width: 1238px;
float: left;
}
.vidPopWrap .vidPopMain {
width: 800px;
height: 450px;
}
footer .footerContainer .footerMain .foot__main {
flex-flow: row;
}
}
@media screen and (min-width: 240px) and (max-width: 600px) {
.mainContainer {
width: 100%;
float: left;
}
header {
position: absolute;
}
header .headercontainer .headermain {
justify-content: space-between;
align-items: center;
padding: 15px 20px;
}
header .headercontainer .headermain .navListing {
width: 100%;
position: fixed;
height: 100%;
background-color: #262626;
top: 0 !important;
margin: 0 !important;
left: -101%;
flex-flow: column;
gap: 25px;
padding: 110px 40px 0;
transition: 0.4s ease-in-out;
}
header .headercontainer .headermain .navListing li {
position: relative;
}
header .headercontainer .headermain .navListing li.logoWrap {
display: none;
}
header .headercontainer .headermain .navListing li.menuBtyn {
display: none;
}
header .headercontainer .headermain .navListing li a {
width: 100%;
padding: 0 0;
text-align: center;
font-size: 16px;
}
header .headercontainer .headermain .navListing.activeNav {
left: 0;
}
header .headercontainer .headermain .responsiveLogo {
display: block;
}
header .headercontainer .headermain .toggle_icon {
display: block;
}
.heroHeader {
height: 100vh;
margin: 0;
}
.heroHeader .paralaxContain {
position: relative !important;
top: 0 !important;
transform: translate3d(0px, 0px, 0px) !important;
}
.heroHeader .paralaxContain .heroInfo {
top: 150px !important;
padding: 0 15px;
}
.heroHeader .paralaxContain .heroInfo span.text h1 {
width: 100%;
font-size: 68px;
}
.heroHeader .paralaxContain .heroInfo .gotoBttn {
margin: 190px 0 0 0;
}
.handcraftWrap {
margin: 0;
}
.handcraftWrap .hc__Inner {
border-radius: 0;
padding: 24px 24px;
gap: 30px;
}
.handcraftWrap .hc__Inner article h1 {
font-size: 42px;
}
.catWrap {
margin: 50px 0;
}
.catWrap .catInner {
padding: 0 12px;
}
.catWrap .catInner .catBoxes {
gap: 25px;
}
.catWrap .catInner .catBoxes .catBox {
height: 390px;
}
.galleryHeader {
margin: 0 0 0px 0;
}
.galleryHeader .gParalax .gHeadBack {
width: auto;
transform: translate(-238px, -352px);
-o-object-position: center;
object-position: center;
}
.galleryHeader h1 {
margin: 77px 0 0 0;
font-size: 64px;
padding: 0 27px;
}
.galleryWrap {
margin: 55px 0;
}
.galleryWrap .galleryInner {
padding: 0 10px;
}
.galleryWrap .galleryInner .galleryBoxesWrap {
position: relative;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn {
flex-flow: column;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .bigBoxVideo {
min-width: unset;
max-width: unset;
width: 100%;
height: 450px;
background-color: transparent;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .galleryMain {
flex-flow: row wrap;
row-gap: 25px;
-moz-column-gap: 10px;
column-gap: 10px;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .galleryMain .g__box {
width: 48%;
float: left;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .galleryMain .g__box picture {
height: auto;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .galleryMain .g__box picture img {
height: auto;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .galleryMain .g__box h4 {
font-size: 12px;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .galleryMain .g__box h4 small {
font-size: 11px;
}
footer .footerContainer {
width: 100%;
float: left;
}
footer .footerContainer .footerMain {
padding: 50px 12px;
}
footer .footerContainer .footerMain .foot__top {
flex-flow: row wrap;
justify-content: center;
gap: 39px;
}
footer .footerContainer .footerMain .foot__main {
margin: 22px 0;
display: block;
padding: 0 12px;
gap: 0;
}
footer .footerContainer .footerMain .foot__main .footBox {
width: 50%;
margin: 17px 0;
}
footer .footerContainer .footerMain .foot__main .footBox ul {
margin: 6px 0 0 0;
}
.vidPopWrap .vidPopMain {
width: 90%;
height: 60%;
}
.vidPopWrap .vidPopMain .closeBttn {
transform: scale(0.8);
} .gallerytopWrap {
position: relative;
}
.gallerytopWrap .galleryMainImage {
width: 100%;
height: 277px;
}
.gallerytopWrap .galleryMainImage img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.gallerytopWrap .galleryThumb {
width: 100% !important;
float: left;
position: relative;
bottom: 0;
right: 0;
margin: 8px 0 0 0;
transition: 0s ease-in-out;
}
.gallerytopWrap .galleryThumb .arrowRight {
display: none;
}
.gallerytopWrap .galleryThumb .arrowLeft {
display: none;
}
.gallerytopWrap .galleryThumb .gtSlide {
gap: 8px;
padding: 0 40px 0 25px;
-webkit-mask-image: linear-gradient(90deg, #000 85%, transparent);
mask-image: linear-gradient(90deg, #000 85%, transparent);
} .gallerytopWrap article {
width: 100%;
top: unset;
right: unset;
padding: 0 24px;
position: relative;
transition: 0.4s ease-in-out;
float: left;
margin: 23px 0 63px 0;
right: 0 !important;
}
.gallerytopWrap article .targetWheel {
margin: 34px 0 0 0;
}
.gallerytopWrap article .expantBttn {
margin: 24px 18px 0 0;
}
.gallerytopWrap.animateTop {
position: relative;
overflow: visible;
padding: 0 0 0;
}
.gallerytopWrap.animateTop .minViewGallery {
transform: scale(1);
z-index: 99999;
}
.gallerytopWrap.animateTop::after {
content: "";
position: fixed;
z-index: 9999;
background-color: rgba(0, 0, 0, 0.85);
top: 0;
left: 0;
width: 100%;
height: 100%;
-webkit-backdrop-filter: blur(8px);
backdrop-filter: blur(8px);
}
.gallerytopWrap.animateTop .galleryMainImage {
position: absolute;
z-index: 99999;
height: 277px;
top: 45%;
}
.gallerytopWrap.animateTop .galleryThumb {
width: 100% !important;
position: absolute;
z-index: 99999;
bottom: -51%;
transition: 0s ease-in-out;
left: 0;
}
.gallerytopWrap.animateTop .galleryThumb .arrowRight {
display: none;
}
.gallerytopWrap.animateTop .galleryThumb .gtSlide {
padding: 0 12px;
}
.wheelDetailsSection {
padding: 0 24px;
}
.wheelDetailsSection .wheelContainer {
width: 100%;
}
.wheelDetailsSection .wheelContainer .wdTop {
flex-flow: row wrap;
padding: 0 0 46px 0;
}
.wheelDetailsSection .wheelContainer .wdTop .wDetails {
display: inline-block;
}
.wheelDetailsSection .wheelContainer .wdTop .wDetails picture {
width: 50%;
float: right;
margin: 0;
}
.wheelDetailsSection .wheelContainer .wdTop .wDetails .dBox {
width: 50%;
float: left;
margin: 40px 0 0 0 !important;
font-size: 18px;
}
.wheelDetailsSection .wheelContainer .wdTop .wDetails .dBox small {
font-size: 10px;
}
.wheelDetailsSection .wheelContainer .wdTop .wDetails .dBox.veBox {
margin: 16px 0 0 0 !important;
}
.wheelDetailsSection .wheelContainer .wdTop .goDetails {
margin: 0px 0 0 0;
}
.wheelDetailsSection .wheelContainer .wdMid {
padding: 40px 0;
flex-flow: column;
gap: 40px;
}
.wheelDetailsSection .wheelContainer .wdMid .sizes {
width: 100%;
}
.wheelDetailsSection .wheelContainer .wdMid .sizes .wmDetails {
gap: 8px;
}
.wheelDetailsSection .wheelContainer .wdMid .sizes .wmDetails p {
font-size: 14px;
line-height: 25.6px;
}
.wheelDetailsSection .wheelContainer .wdMid .outFitted {
width: 100%;
}
.wheelDetailsSection .wheelContainer .vehicleGallries {
margin: 40px 0 88px 0;
}
.wheelDetailsSection .wheelContainer .vehicleGallries .galleryPart {
width: 100%;
}
.wheelDetailsSection .wheelContainer .vehicleGallries .galleryPart h3 {
font-size: 24px;
}
.wheelDetailsSection .wheelContainer .vehicleGallries .galleryPart .vgInner {
margin: 16px 0 0 0;
gap: 16px;
}
.wheelDetailsSection .wheelContainer .vehicleGallries .galleryPart .vgInner .vgBox {
width: calc(50% - 8px);
}
.wheelDetailsSection .wheelContainer .vehicleGallries .galleryPart .vgInner .vgBox article {
width: 100%;
}
.wheelDetailsSection .wheelContainer .vehicleGallries .galleryPart .vgInner .vgBox article h5 {
font-size: 14px;
}
.wheelDetailsSection .wheelContainer .vehicleGallries .galleryPart .vgInner .vgBox article p {
font-size: 12px;
}
.wheelDetailsSection .wheelContainer .vehicleGallries .otherGallleryLinkPart {
margin: 40px 0 0 0;
width: 100%;
}
.wheelDetailsSection .wheelContainer .vehicleGallries .otherGallleryLinkPart a {
gap: 12px;
} .single-vossen_gallery header {
position: relative !important;
}
.single-vossen_gallery header .headercontainer {
background-image: none !important;
padding: 0 !important;
}
.single-vossen_gallery header .headercontainer .headermain {
padding: 23px 20px;
}
.single-vossen_gallery header .toggle_icon {
position: absolute;
right: 15px;
}
.single-vossen_gallery header .toggle_icon b {
background: #000;
}
.single-vossen_gallery header .toggle_icon b::after {
background: #000;
}
.single-vossen_gallery header .toggle_icon b::before {
background: #000;
}
.single-vossen_gallery header .toggle_icon b.creatCross {
background: #fff;
}
.single-vossen_gallery header .toggle_icon b.creatCross::after {
background: #fff;
}
.single-vossen_gallery header .toggle_icon b.creatCross::before {
background: #fff;
} .iPopupWrap {
z-index: 999999;
}
.ipopContain {
width: 97%;
height: 400px;
}
.closeIpop {
width: 49px;
height: 49px;
}
.gallerytopWrap .playVideo {
bottom: inherit;
top: 50%;
left: 50%;
width: 68px;
height: 68px;
font-size: 26px;
padding: 0;
}
.galleryThumb .fa {
display: none !important;
} .archiveBoxNotice {
width: 100%;
margin: 0px 0 40px 0;
}  .heroHeader {
height: 700px;
margin: 0;
}
.paralaxContain {
height: 700px !important;
}
.forDesktop {
display: block !important;
transform: scale(1) translate(-50%, -50%) !important;
position: absolute !important;
width: 400vw !important;
top: 50% !important;
left: 50%;
} }
@media screen and (min-width: 601px) and (max-width: 900px) {
.mainContainer {
width: 100%;
float: left;
}
header {
position: absolute;
}
header .headercontainer .headermain {
justify-content: space-between;
align-items: center;
padding: 15px 20px;
}
header .headercontainer .headermain .navListing {
width: 100%;
position: fixed;
height: 100%;
background-color: #262626;
top: 0;
left: -101%;
flex-flow: column;
gap: 25px;
padding: 110px 40px 0;
transition: 0.4s ease-in-out;
}
header .headercontainer .headermain .navListing li {
position: relative;
}
header .headercontainer .headermain .navListing li.logoWrap {
display: none;
}
header .headercontainer .headermain .navListing li.menuBtyn {
display: none;
}
header .headercontainer .headermain .navListing li a {
width: 100%;
padding: 0 0;
text-align: center;
font-size: 16px;
}
header .headercontainer .headermain .navListing.activeNav {
left: 0;
}
header .headercontainer .headermain .responsiveLogo {
display: block;
}
header .headercontainer .headermain .toggle_icon {
display: block;
}
.heroHeader {
height: 100vh;
margin: 0;
}
.heroHeader .paralaxContain {
position: relative !important;
top: 0 !important;
}
.heroHeader .paralaxContain .heroInfo {
top: 150px !important;
padding: 0 15px;
}
.heroHeader .paralaxContain .heroInfo .mainContainer {
display: flex;
flex-flow: row wrap;
justify-content: center;
}
.heroHeader .paralaxContain .heroInfo span.text h1 {
width: 100%;
font-size: 68px;
text-align: center;
}
.heroHeader .paralaxContain .heroInfo .gotoBttn {
margin: 190px 0 0 0;
}
.handcraftWrap {
margin: 0;
}
.handcraftWrap .hc__Inner {
border-radius: 0;
padding: 24px 24px;
gap: 30px;
justify-content: center;
}
.handcraftWrap .hc__Inner article h1 {
font-size: 42px;
}
.catWrap {
margin: 50px 0;
}
.catWrap .catInner {
padding: 0 12px;
}
.catWrap .catInner .catBoxes {
gap: 0;
}
.catWrap .catInner .catBoxes .catBox {
width: 48%;
}
.galleryHeader {
margin: 0 0 0px 0;
}
.galleryHeader .gParalax .gHeadBack {
width: auto;
transform: translate(-238px, -352px);
-o-object-position: center;
object-position: center;
}
.galleryHeader h1 {
margin: 77px 0 0 0;
font-size: 64px;
padding: 0 27px;
}
.galleryWrap {
margin: 55px 0;
}
.galleryWrap .galleryInner {
padding: 0 10px;
}
.galleryWrap .galleryInner .galleryBoxesWrap {
position: relative;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn {
flex-flow: column;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .bigBoxVideo {
min-width: unset;
max-width: unset;
width: 100%;
height: 450px;
background-color: transparent;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .galleryMain {
flex-flow: row wrap;
row-gap: 25px;
-moz-column-gap: 10px;
column-gap: 10px;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .galleryMain .g__box {
width: 32%;
float: left;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .galleryMain .g__box picture {
height: auto;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .galleryMain .g__box picture img {
height: auto;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .galleryMain .g__box h4 {
font-size: 12px;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .galleryMain .g__box h4 small {
font-size: 11px;
}
footer .footerContainer {
width: 100%;
float: left;
}
footer .footerContainer .footerMain {
padding: 50px 33px;
}
footer .footerContainer .footerMain .foot__top {
flex-flow: row wrap;
justify-content: center;
gap: 39px;
}
footer .footerContainer .footerMain .foot__main {
margin: 50px 0;
display: flex;
flex-flow: row wrap;
gap: 50px;
}
footer .footerContainer .footerMain .foot__main .footBox ul {
margin: 6px 0 0 0;
}
.vidPopWrap .vidPopMain {
width: 90%;
height: 60%;
}
.vidPopWrap .vidPopMain .closeBttn {
transform: scale(0.8);
} .gallerytopWrap {
position: relative;
}
.gallerytopWrap .galleryMainImage {
width: 100%;
height: 465px;
}
.gallerytopWrap .galleryMainImage img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.gallerytopWrap .galleryThumb {
width: 100% !important;
float: left;
position: relative;
bottom: 0;
right: 0;
margin: 8px 0 0 0;
}
.gallerytopWrap .galleryThumb .arrowRight {
display: none !important;
}
.gallerytopWrap .galleryThumb .arrowLeft {
display: none !important;
}
.gallerytopWrap .galleryThumb .gtSlide {
gap: 8px;
padding: 0 0px 0 25px;
}
.gallerytopWrap .galleryThumb .gtSlide .thumb {
max-width: 88px;
min-width: 88px;
height: 60px;
}
.gallerytopWrap article {
width: 100%;
top: unset;
right: unset;
padding: 0 24px;
position: relative;
transition: 0.4s ease-in-out;
float: left;
margin: 23px 0 63px 0;
right: 0 !important;
}
.gallerytopWrap article .targetWheel {
margin: 34px 0 0 0;
}
.gallerytopWrap article .expantBttn {
margin: 24px 18px 0 0;
}
.gallerytopWrap.animateTop {
position: relative;
overflow: visible;
padding: 0 0 0;
height: 100%;
}
.gallerytopWrap.animateTop .minViewGallery {
transform: scale(1);
z-index: 99999;
}
.gallerytopWrap.animateTop::after {
content: "";
position: fixed;
z-index: 9999;
background-color: rgba(0, 0, 0, 0.85);
top: 0;
left: 0;
width: 100%;
height: 100%;
-webkit-backdrop-filter: blur(8px);
backdrop-filter: blur(8px);
}
.gallerytopWrap.animateTop .galleryMainImage {
position: absolute;
z-index: 99999;
height: 100%;
}
.gallerytopWrap.animateTop .galleryMainImage img {
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
-o-object-position: center;
object-position: center;
}
.gallerytopWrap.animateTop .galleryThumb {
width: 100% !important;
position: fixed;
z-index: 99999;
bottom: inherit;
transition: 0s ease-in-out;
top: 75%;
left: 0;
}
.gallerytopWrap.animateTop .galleryThumb .arrowRight {
display: none;
}
.gallerytopWrap.animateTop .galleryThumb .gtSlide {
padding: 0 12px;
}
.wheelDetailsSection {
padding: 0 24px;
}
.wheelDetailsSection .wheelContainer {
width: 100%;
}
.wheelDetailsSection .wheelContainer .wdTop {
flex-flow: row wrap;
padding: 0 0 46px 0;
}
.wheelDetailsSection .wheelContainer .wdTop .wDetails {
display: inline-block;
}
.wheelDetailsSection .wheelContainer .wdTop .wDetails picture {
width: 50%;
float: left;
margin: 0 0 25px 0;
}
.wheelDetailsSection .wheelContainer .wdTop .wDetails .dBox {
width: 50%;
float: right;
margin: 40px 0 0 0 !important;
font-size: 18px;
}
.wheelDetailsSection .wheelContainer .wdTop .wDetails .dBox small {
font-size: 10px;
}
.wheelDetailsSection .wheelContainer .wdTop .wDetails .dBox.veBox {
margin: 16px 0 0 0 !important;
}
.wheelDetailsSection .wheelContainer .wdTop .goDetails {
margin: -30px 0 0 0;
}
.wheelDetailsSection .wheelContainer .wdMid {
padding: 40px 0;
justify-content: inherit;
gap: 40px;
}
.wheelDetailsSection .wheelContainer .wdMid .sizes {
width: 366px;
}
.wheelDetailsSection .wheelContainer .wdMid .sizes .wmDetails {
gap: 8px;
}
.wheelDetailsSection .wheelContainer .wdMid .sizes .wmDetails p {
font-size: 14px;
line-height: 25.6px;
}
.wheelDetailsSection .wheelContainer .wdMid .outFitted {
width: 100%;
}
.wheelDetailsSection .wheelContainer .vehicleGallries {
margin: 40px 0 88px 0;
}
.wheelDetailsSection .wheelContainer .vehicleGallries .galleryPart {
width: 100%;
}
.wheelDetailsSection .wheelContainer .vehicleGallries .galleryPart h3 {
font-size: 24px;
}
.wheelDetailsSection .wheelContainer .vehicleGallries .galleryPart .vgInner {
margin: 16px 0 0 0;
gap: 16px;
}
.wheelDetailsSection .wheelContainer .vehicleGallries .galleryPart .vgInner .vgBox {
width: calc(33.33% - 11px);
}
.wheelDetailsSection .wheelContainer .vehicleGallries .galleryPart .vgInner .vgBox article {
width: 100%;
}
.wheelDetailsSection .wheelContainer .vehicleGallries .galleryPart .vgInner .vgBox article h5 {
font-size: 14px;
}
.wheelDetailsSection .wheelContainer .vehicleGallries .galleryPart .vgInner .vgBox article p {
font-size: 12px;
}
.wheelDetailsSection .wheelContainer .vehicleGallries .otherGallleryLinkPart {
margin: 40px 0 0 0;
width: 100%;
}
.wheelDetailsSection .wheelContainer .vehicleGallries .otherGallleryLinkPart a {
gap: 12px;
} .single-vossen_gallery header {
position: relative !important;
}
.single-vossen_gallery header .headercontainer {
background-image: none !important;
padding: 0 !important;
}
.single-vossen_gallery header .headercontainer .headermain {
padding: 23px 20px;
}
.single-vossen_gallery header .toggle_icon {
position: absolute;
right: 15px;
}
.single-vossen_gallery header .toggle_icon b {
background: #000;
}
.single-vossen_gallery header .toggle_icon b::after {
background: #000;
}
.single-vossen_gallery header .toggle_icon b::before {
background: #000;
}
.single-vossen_gallery header .toggle_icon b.creatCross {
background: #fff;
}
.single-vossen_gallery header .toggle_icon b.creatCross::after {
background: #fff;
}
.single-vossen_gallery header .toggle_icon b.creatCross::before {
background: #fff;
} .archiveBoxNotice {
width: 100%;
margin: 0px 0 40px 0;
}  .heroHeader {
height: 700px;
margin: 0;
}
.paralaxContain {
height: 700px !important;
}
.forDesktop {
display: block !important;
transform: scale(1) translate(-50%, -50%) !important;
position: absolute !important;
width: 422vw !important;
top: 50% !important;
left: 50%;
} }
@media screen and (min-width: 901px) and (max-width: 1200px) {
.mainContainer {
width: 100%;
float: left;
}
header .headercontainer .headermain .navListing {
gap: 30px;
}
header .headercontainer .headermain .navListing li.logoWrap {
margin: 11px 7px 0;
}
.heroHeader {
height: 100vh;
margin: 0;
}
.heroHeader .paralaxContain {
position: relative !important;
top: 0 !important;
}
.heroHeader .paralaxContain .heroInfo {
top: 150px !important;
padding: 0 15px;
}
.heroHeader .paralaxContain .heroInfo .mainContainer {
display: flex;
flex-flow: row wrap;
justify-content: center;
}
.heroHeader .paralaxContain .heroInfo span.text h1 {
width: 100%;
font-size: 68px;
text-align: center;
}
.heroHeader .paralaxContain .heroInfo .gotoBttn {
margin: 190px 0 0 0;
}
.handcraftWrap {
margin: 0;
}
.handcraftWrap .hc__Inner {
border-radius: 0;
padding: 24px 24px;
gap: 30px;
justify-content: center;
}
.handcraftWrap .hc__Inner article h1 {
font-size: 42px;
}
.catWrap {
margin: 50px 0;
}
.catWrap .catInner {
padding: 0 12px;
}
.catWrap .catInner .catBoxes {
gap: 0;
}
.catWrap .catInner .catBoxes .catBox {
width: 48%;
}
.galleryHeader {
margin: 0 0 0px 0;
}
.galleryHeader .gParalax .gHeadBack {
width: auto;
transform: translate(-238px, -352px);
-o-object-position: center;
object-position: center;
}
.galleryHeader h1 {
margin: 77px 0 0 0;
font-size: 64px;
padding: 0 27px;
}
.galleryWrap {
margin: 55px 0;
}
.galleryWrap .galleryInner {
padding: 0 10px;
}
.galleryWrap .galleryInner .galleryBoxesWrap {
position: relative;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn {
flex-flow: column;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .bigBoxVideo {
min-width: unset;
max-width: unset;
width: 100%;
height: 450px;
background-color: transparent;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .galleryMain {
flex-flow: row wrap;
row-gap: 25px;
-moz-column-gap: 10px;
column-gap: 10px;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .galleryMain .g__box {
width: 32%;
float: left;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .galleryMain .g__box picture {
height: auto;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .galleryMain .g__box picture img {
height: auto;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .galleryMain .g__box h4 {
font-size: 12px;
}
.galleryWrap .galleryInner .galleryBoxesWrap .galleryboxWrap .gBoxWrapInn .galleryMain .g__box h4 small {
font-size: 11px;
}
footer .footerContainer {
width: 100%;
float: left;
}
footer .footerContainer .footerMain {
padding: 50px 33px;
}
footer .footerContainer .footerMain .foot__top {
flex-flow: row wrap;
justify-content: center;
gap: 39px;
}
footer .footerContainer .footerMain .foot__main {
margin: 50px 0;
display: flex;
flex-flow: row wrap;
gap: 50px;
}
footer .footerContainer .footerMain .foot__main .footBox ul {
margin: 6px 0 0 0;
}
.vidPopWrap .vidPopMain {
width: 90%;
height: 60%;
}
.vidPopWrap .vidPopMain .closeBttn {
transform: scale(0.8);
} .gallerytopWrap {
position: relative;
}
.gallerytopWrap .galleryMainImage {
width: 100%;
height: 630px;
}
.gallerytopWrap .galleryMainImage img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.gallerytopWrap .galleryThumb {
width: 100% !important;
float: left;
position: relative;
bottom: 0;
right: 0;
margin: 8px 0 0 0;
}
.gallerytopWrap .galleryThumb .arrowRight {
display: none;
}
.gallerytopWrap .galleryThumb .arrowLeft {
display: none;
}
.gallerytopWrap .galleryThumb .gtSlide {
gap: 8px;
padding: 0 0px 0 25px;
}
.gallerytopWrap .galleryThumb .gtSlide .thumb {
max-width: 88px;
min-width: 88px;
height: 60px;
}
.gallerytopWrap article {
width: 100%;
top: unset;
right: unset;
padding: 0 24px;
position: relative;
transition: 0.4s ease-in-out;
float: left;
margin: 23px 0 63px 0;
right: 0 !important;
}
.gallerytopWrap article .targetWheel {
margin: 34px 0 0 0;
}
.gallerytopWrap article .expantBttn {
margin: 24px 18px 0 0;
}
.gallerytopWrap.animateTop {
position: relative;
overflow: visible;
padding: 0 0 0;
height: 100%;
}
.gallerytopWrap.animateTop .minViewGallery {
transform: scale(1);
z-index: 99999;
}
.gallerytopWrap.animateTop::after {
content: "";
position: fixed;
z-index: 9999;
background-color: rgba(0, 0, 0, 0.85);
top: 0;
left: 0;
width: 100%;
height: 100%;
-webkit-backdrop-filter: blur(8px);
backdrop-filter: blur(8px);
}
.gallerytopWrap.animateTop .galleryMainImage {
position: absolute;
z-index: 99999;
height: 100%;
}
.gallerytopWrap.animateTop .galleryMainImage img {
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
-o-object-position: center;
object-position: center;
}
.gallerytopWrap.animateTop .galleryThumb {
width: 100% !important;
position: fixed;
z-index: 99999;
bottom: 50px;
transition: 0s ease-in-out;
top: inherit;
left: 0;
}
.gallerytopWrap.animateTop .galleryThumb .arrowRight {
display: none;
}
.gallerytopWrap.animateTop .galleryThumb .gtSlide {
padding: 0 12px;
}
.wheelDetailsSection {
padding: 0 24px 45px 0;
}
.wheelDetailsSection .wheelContainer {
width: 100%;
padding: 0 12px;
} .heroHeader {
height: 700px;
margin: 0;
}
.paralaxContain {
height: 700px !important;
}
.forDesktop {
display: block !important;
transform: scale(1) translate(-50%, -50%) !important;
position: absolute !important;
width: 422vw !important;
top: 50% !important;
left: 50%;
} }
@media screen and (min-width: 1201px) and (max-width: 1400px) { .gallerytopWrap {
position: relative;
}
.gallerytopWrap .galleryMainImage {
width: calc(100% - 330px);
}
.gallerytopWrap .galleryThumb .gtSlide {
-webkit-mask-image: linear-gradient(90deg, #000 70%, transparent);
mask-image: linear-gradient(90deg, #000 70%, transparent);
}
.gallerytopWrap article {
width: 330px;
top: 115px;
right: 0;
padding: 0 38px;
position: absolute;
transition: 0.4s ease-in-out;
}
.wheelDetailsSection .wheelContainer {
width: 96%;
float: left;
}
} .storeBlockWrap {
display: none;
}
@media screen and (min-width: 240px) and (max-width:900px) {
header .headercontainer .headermain .navListing {
background-color: #F8F9FA !important;
background-image: none;
overflow: auto;
padding: 99px 24px 0 !important;
gap: 24px !important;
height: 100%;
}
header .headercontainer .headermain .navListing::after {
content: '';
position: absolute;
height: 60px;
width: 100%;
background-color: #fff;
background-image: url(//vossenwheels.com/wp-content/themes/vossen/assets/v2/images/menuLogo.svg) !important;
background-size: 140px !important;
background-repeat: no-repeat;
background-position: 24px 24px, top !important;
top: 0;
left: 0;
}
.toggle_icon.stkBttn b {
background: #000000 !important;
}
.toggle_icon.stkBttn b::before {
background: #000000 !important;
}
.toggle_icon.stkBttn b::after {
background: #000000 !important;
}
header .headercontainer .headermain .navListing li {
z-index: 9;
width: 100%;
float: left;
background-image: url(//vossenwheels.com/wp-content/themes/vossen/assets/v2/images/arrowRight.svg);
background-repeat: no-repeat;
background-position: right center;
}
header .headercontainer .headermain .navListing li a {
color: #000 !important;
text-transform: capitalize;
letter-spacing: 1px;
font-size: 18px;
font-weight: 600 !important;
width: 100%;
float: left;
text-align: left;
}
.toggle_icon {
padding: 0px 0 !important;
}
.storeBlockWrap {
width: 100%;
position: relative;
z-index: 99;
padding: 0 0;
float: left;
transition: 0.4s ease-in-out;
display: block;
}
.storeBlockInner {
width: 100%;
float: left;
border-top: 1px solid #A7A7A7;
padding: 24px 0;
}
.storeBlockInner h5 {
width: 100%;
float: left;
color: #838383;
font-family: "Open Sans";
font-size: 10px;
font-style: normal;
font-weight: 700;
line-height: 12px;
letter-spacing: 2.4px;
text-transform: uppercase;
margin: 0;
}
.storeBlockInner a.storeLink {
width: 100%;
float: left;
color: #0E0E0E;
font-family: "Open Sans";
font-size: 18px;
font-style: normal;
font-weight: 600;
line-height: normal;
letter-spacing: 1px;
margin: 10px 0 0 0;
background-image: url(//vossenwheels.com/wp-content/themes/vossen/assets/v2/images/arrowRight.svg);
background-repeat: no-repeat;
background-position: right center;
}
.storeBlockInner a.btnNav {
width: 100%;
float: left;
border: 1px solid #2B2929;
padding: 20px 16px;
text-align: center;
color: #000;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 1.2px;
text-transform: uppercase;
margin: 24px 0 0 0;
}
.phoneLink {
width: 100%;
float: left;
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
color: #0E0E0E;
font-family: "Open Sans";
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: normal;
letter-spacing: 0.4px;
margin: 24px 0 0 0;
}
.noScroll {
overflow: hidden;
}
.stkBttn {
background: #fff;
padding: 3px 3px 0px 3px !important;
top: 10px;
}
}