@charset "UTF-8";
/*
Theme Name: OZS Car Trailer
Text Domain: ozs-car-trailer
Template: twentytwentyone
*/
@import url("../twentytwentyone/style.css");

@import url('https://fonts.googleapis.com/css2?family=Archivo:ital,wdth,wght@0,62..125,100..900;1,62..125,100..900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700;900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Cookie&display=swap');


/*********************** Font source sans 3 link ***********************/
:root {
    /* Fonts */
    --primary-font-family: "Lato", sans-serif;
    --primary-nav--font-family: "Lato", sans-serif;
    --heading--font-family: "Lato", sans-serif;
    --primary-nav--font-family-mobile: "Lato", sans-serif;
    --button--font-family: "Lato", sans-serif;
    --list--font-family: "Lato", sans-serif;
	--stroke-font-family: "Archivo", sans-serif;
    /* color */
    --global-white: #FFFFFF;
    --global-black: #000;
	--black-1:#0B0E0E;
	--black-2:#0E1011;
	--black-3:#1E1E1E;
    --Primary-Color:vxvc;
	--pargraph-color: #666666;
	--blue-color:#1C579B;
	--border-blue-color:#5AC6EB;
	--light-blue-color:#F2F5F9;
	--border-color:#DADADA;
	--gray:#747474;
	--border-color-2:#EBEBEB;
	--gray-1:#E3EDF9;
	--green:#34A342;
	--stroke-color: #E5E5E5;
    
}
body 					{ overflow-x: hidden !important; background-color: var(--global-white)!important;font-family:var(--primary-font-family);max-width: 2560px;margin: auto;}
.clear 					{ clear:both;}
img 					{ border: 0px;}
a 						{ text-decoration: none; outline: none; transition: all ease-in-out 0.35s; }
input:focus             {outline: 0 !important;}
textarea                { resize: none;}
p:empty                 { display: none;}
a:focus, a:active, a:visited, a:hover, .btn:focus, .btn:active, .btn:visited, .btn:hover{ text-decoration: none; outline: none; box-shadow: none; }
input:-webkit-autofill, input:-webkit-autofill:focus, input:-webkit-autofill:hover, select:-webkit-autofill, select:-webkit-autofill:focus, select:-webkit-autofill:hover, textarea:-webkit-autofill, textarea:-webkit-autofill:focus, textarea:-webkit-autofill:hover { transition: background-color 1000s ease-in-out 0s, color 1000s ease-in-out 0s; -webkit-transition: background-color 1000s ease-in-out 0s, color 1000s ease-in-out 0s; -moz-transition: background-color 1000s ease-in-out 0s, color 1000s ease-in-out 0s; -o-transition: background-color 1000s ease-in-out 0s, color 1000s ease-in-out 0s; -ms-transition: background-color 1000s ease-in-out 0s, color 1000s ease-in-out 0s } header.wp-block-template-part .wp-block-navigation, header.wp-block-template-part .wp-block-navigation .wp-block-page-list, header.wp-block-template-part .wp-block-navigation__container, header.wp-block-template-part .wp-block-navigation__responsive-container-content { gap: unset !important; } /* Button */
input::-webkit-inner-spin-button, input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0 }
:focus-visible{outline: none;}
ul{padding: 0;margin: 0;}
img{max-width: 100%;height: auto;}
a{text-decoration-style:solid!important;}
a:hover{text-decoration-style:solid!important ;}
h1,h2,h3,h4,h5,h6{letter-spacing:normal ;}
.custom-padding{padding: 100px 0 100px 0;}
.custom-padding-bottom{padding-bottom: 100px;}
/*********************** wordpress - Comman section CSS -start ***********************/
.site-branding{ display: none;}
.site-main>*{margin: 0 ;}
.wp-site-blocks{ padding: 0 !important;}
.wp-block-group.alignfull>.wp-block-kadence-rowlayout>.kt-row-layout-inner>.kt-row-column-wrap { padding: 0; }
div.wp-block-group.alignfull>.wp-block-kadence-rowlayout, div.wp-block-group.alignfull { margin-top: 0; }
.site-main{ padding: 0;}
.has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button), .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button){background-color: transparent;}
.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) img{ outline: none;}
.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button){outline: none; text-decoration: none;}
.wpcf7-not-valid-tip{position: absolute; left: 0; bottom: 6px; font-size: 12px;}
textarea + .wpcf7-not-valid-tip { bottom: 22px; }
#sb_instagram .sbi_photo img{ aspect-ratio: 1 / 1; width: 100%; object-fit: cover; object-position: center;}
.wp-block-columns .wp-block-column > *{ margin: 0 !important;}
form br{display: none;}
.site .button:focus, button:focus, input[type=submit]:focus, input[type=reset]:focus, .wp-block-search .wp-block-search__button:focus, .wp-block-button .wp-block-button__link:focus, .wp-block-file a.wp-block-file__button:focus{ outline: none;}
.widget-area{display: none;}
/*********************** wordpress - Comman section CSS -end ***********************/
/*********************** Primary Button ***********************/
.primary-btn{ position: relative; padding: 14px 20px; border: 2px solid var(--border-blue-color); box-sizing: border-box; border-radius: 4px; font-size: 16px; line-height: 1; font-weight: 600; text-transform: uppercase; font-family: var(--primary-font-family); display: flex; align-items: center; gap: 6px; justify-content: center; color: var(--border-blue-color); transition: 0.5s all; }
.primary-btn:hover{ background: var(--border-blue-color); color: var(--global-white); }
.primary-btn:focus{background: var(--border-blue-color)!important;color: var(--global-white)!important;}

/*********************** Slick Button ***********************/
.slick-arrow { width: 50px; height: 50px; border-radius: 50%; background: transparent !important; border: 1px solid var(--global-white); transition: all 0.5s; -webkit-transition: all 0.5s; }
.slick-arrow::before { content: ''; background: url('./assets/images/slick-arrow.svg') no-repeat center center / 28px; width: 28px; height: 28px; display: block; margin: auto; transition: all 0.5s; -webkit-transition: all 0.5s; }
.slick-arrow.slick-next::before { transform: rotate(180deg); }
.slick-arrow:hover { background: var(--global-white) !important; }
.slick-arrow:hover::before { filter: brightness(0) invert(0); }	
/*********************** Typography start ***********************/
.title-style-1{ margin: 0; padding: 0; font-size: 46px; line-height: 62px; font-weight: 600; font-family: "Archivo", sans-serif; letter-spacing: -0.32px; color: var(--global-white);text-transform: uppercase; }
.title-style-2{ margin: 0; padding: 0; font-size: 40px; line-height: 52px; font-weight: 700; font-family: "Archivo", sans-serif; letter-spacing: -0.32px; color: var(--black-3);text-transform: uppercase; }
.title-style-3{ margin: 0; padding: 0; font-size: 50px; line-height: 65px; font-weight: 400; font-family: "Cookie", cursive; letter-spacing: -0.32px; color: var(--blue-color); }
.title-style-4{ margin: 0; padding: 0; font-size: 44px; line-height: 57px; font-weight: 700; font-family: "Archivo", sans-serif; letter-spacing: -0.32px; color: var(--black-3); }
.title-style-5{ margin: 0; padding: 0; font-size: 24px; line-height: 24px; font-weight: 500; font-family: "Archivo", sans-serif; letter-spacing: -0.32px; color: var(--gray);}
.title-style-6{ margin: 0; padding: 0; font-size: 20px; line-height: 21px; font-weight: 500; font-family:"Archivo", sans-serif; letter-spacing: 0; color: var(--black-3); }
p{font-size: 18px;font-weight: 400;line-height: 28px;color: var(--pargraph-color); font-family: var(--primary-font-family);}
/*********************** Typography End ***********************/

/*********************** header ***********************/
.header-navigation{position: fixed;top: 0;left: 0;  padding: 20px 58px;margin: 0; width: 100%;max-width: 100%;z-index: 999;transition: 0.5s all;}
.header-navigation .header-inner{display: flex;align-items: center;justify-content: space-between;gap: 15px;width: 100%;}
.sticky { position: fixed; top: 0; box-shadow: 1px 1px 25px rgb(0 0 0 / 10%); background: var(--black-1); }
.header-navigation .site-logo{margin: 0;}
.header-navigation .primary-menu-container{margin: 0;}
.header-navigation .header-inner .book-btn a{ position: relative; padding: 16px 20px!important;text-decoration: none!important; background: var(--global-white)!important;color: var(--black-2)!important; display: flex; flex-direction: row-reverse; gap: 6px; align-items: center; font-size: 16px; font-weight: 600; text-transform: uppercase; border-radius: 4px; text-decoration: none; transition: 0.5s all; }
.header-navigation .header-inner .book-btn a:hover{background: var(--border-blue-color)!important;color: var(--global-white)!important;}
.header-navigation .header-inner .book-btn a div img{transition: 0.5s all;}
.header-navigation .header-inner .book-btn a:hover div img{filter: brightness(1) invert(1);}
.header-right{display: flex;align-items: center;gap: 24px;}
.call-header{display: flex;align-items: center;gap: 16px;}
.call-header .wp-block-image a {width: 48px;height: 48px;padding: 10px;transition: 0.2s all; border: 1.15px solid var(--global-white);border-radius: 50%;line-height: 40px;display: flex;align-items: center;justify-content: center;}
.call-header .wp-block-image a:hover{border-color: #528ed2;}
.call-header .wp-block-image a{line-height: normal;}
.call-header .wp-block-image a:hover img{filter: invert(62%) sepia(67%) saturate(551%) hue-rotate(169deg) brightness(107%) contrast(84%);}
.call-header .wp-block-image img{height: 24px;width: 24px;transition: 0.2s all;}
.call-header p { font-size: 16px; line-height: 23px; color: var(--global-white); font-weight: 700; }
.call-header p a { margin-top: 2px; display: block; font-size: 18px; line-height: 27px; color: var(--global-white)!important; font-weight: 900; text-decoration: none; transition: 0.5s all; }
.call-header p a:hover{ color: var(--border-blue-color)!important; }
/*********************** Banner ***********************/
.banner { background: var(--black-1); display: flex; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; position: relative; }
.banner .black-section { background: var(--black-1);  position: relative; width: 30%; z-index: 1; }
.black-section .ozs-title { position: absolute; top: 103px; right: 0px; font-size: 158px; line-height: 1; font-weight: 900; font-family: var(--stroke-font-family); color: transparent; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: rgba(229, 229, 229, 0.2); transform: translateX(32%); -webkit-transform: translateX(32%); }
.black-section .two-lines { position: absolute; right: 0; bottom: 12%; }
.black-section .two-lines::before { content: ''; position: absolute; top: 0; right: 0; width: 84px; height: 1px; background: rgba(255, 255, 255, 0.2); }
.black-section .two-lines::after { content: ''; position: absolute; bottom: -40px; right: 0; width: 146px; height: 1px; background: rgba(255, 255, 255, 0.2); }	

.black-section .trailer-txt { position: absolute; bottom: 0; left: 0; transform: translateX(-104%) rotate(90deg); transform-origin: bottom right; font-family: var(--stroke-font-family); font-size: 87px; line-height: 1; font-weight: 700; text-transform: uppercase; color: rgba(242, 242, 242, 0.05); }
.banner-img-slider { width: 70%; }
.banner-img-slider  .img-wrapper { min-height: 100svh; height: 100%; max-height: min(100svh, 700px); position: relative; }
.banner-img-slider .img-wrapper::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); }
.banner-img-slider .img-wrapper img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.banner-img-slider .slick-slide > div > div {  display: block !important; }
.banner-desc-slider{ position: absolute; top: 50%; left: 0%; transform: translate(0%,-50%); width: 100%; z-index: 2; }
.banner-content { padding-right: 14%; }
.banner-content h1 { margin-bottom: 26px; }
.banner-content h6 { margin-bottom: 26px; color: var(--global-white); }
.banner-content .primary-btn { width: fit-content; }
.banner-content .primary-btn img { transition: all 0.5s; -webkit-transition: all 0.5s; }
.banner-content .primary-btn:hover img { filter: brightness(0) invert(1); -webkit-filter: brightness(0) invert(1); }
.banner .slick-arrow { position: absolute; top: auto; bottom: 67px; left: auto; right: 0px; z-index: 10; transform: translate(0); }
.banner .slick-arrow.slick-next {  transform: translateX(-220%); }
.banner .slick-arrow.slick-prev {transform: translateX(-350%); }
/*********************** Error page ***********************/
.error-404 { background: var(--black-1); min-height: max(80vh , 600px); }
.error-404 .page-content { width: 100%; }
.error-404  .error-msg-wrapper h1 { font-weight: 700; color: transparent; font-family: var(--stroke-font-family); font-size: 150px; line-height: 1; margin-bottom: 16px; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: var(--global-white); }
.error-404  .error-msg-wrapper p { color: var(--global-white); font-family: var(--stroke-font-family); margin: 0px; font-size: 18px; line-height: 1.5; }
.error-404  .error-msg-wrapper p a { color: var(--blue-color); text-decoration: none; position: relative; }
.error-404  .error-msg-wrapper p a::after { content: ''; position: absolute; bottom: -6px; left: 0; width: 0%; height: 1.8px; background: var(--blue-color); transition: all 0.5s; -webkit-transition: all 0.5s; }
.error-404  .error-msg-wrapper p a:hover::after { width: 100%; }
/*********************** Error page style ends ***********************/
/*********************** Footer ***********************/
.footer-main-section{padding: 70px 0 78px;background: var(--black-1);}
.footer-main-section .footer-logo{padding-right: 30px;}
.footer-main-section .footer-logo figure{text-align: left;margin-bottom: 34px;}
.footer-main-section .footer-logo p{color: rgb(255 255 255 / 60%);}
.footer-main-section .footer-social{padding-left: 24px;}
.footer-main-section .footer-social .footer-social-media ul{display: flex;flex-direction: column;gap: 16px;}
.footer-main-section .footer-social .footer-social-media ul  li a{display: flex;gap: 16px;align-items: center;text-decoration: none;}
.footer-main-section .footer-social .footer-social-media ul li a div{ width: 40px;height: 40px;padding: 10px;border: 1.15px solid var(--global-white);border-radius: 50%;line-height: 40px;display: flex;align-items: center;justify-content: center;}
.footer-main-section .footer-social .footer-social-media ul li a span{font-size: 18px; font-weight: 500; line-height: 27px; color: rgb(255 255 255 / 60%); text-decoration: none; transition: 0.5s all;}
.footer-main-section .footer-social .footer-social-media ul li a span:hover{color: var(--border-blue-color);}
.footer-main-section .footer-connect .wp-block-heading{ font-size: 22px; line-height: 24px; color: var(--global-white); margin-bottom: 24px; text-transform: uppercase; font-family: "Archivo", sans-serif!important; }
.footer-main-section .footer-connect .wp-block-media-text{display: flex;gap: 16px;align-items: center;margin-bottom: 16px;}
.footer-main-section .footer-connect .wp-block-media-text .wp-block-media-text__content{padding: 0;align-self: center;}
.footer-main-section .footer-connect .wp-block-media-text .wp-block-media-text__media{width: 40px;height: 40px;padding: 10px;border: 1.15px solid var(--global-white);border-radius: 50%;line-height: 40px;display: flex;align-items: center;justify-content: center;}
.footer-main-section .footer-connect .wp-block-media-text .wp-block-media-text__media img{max-width: 100%;height: auto;width: auto;}
.footer-main-section .footer-connect .wp-block-media-text .wp-block-media-text__content p,
.footer-main-section .footer-connect .wp-block-media-text .wp-block-media-text__content p a{ font-size: 18px; font-weight: 500; line-height: 27px; color: rgb(255 255 255 / 60%); text-decoration: none; transition: 0.5s all; }
.footer-main-section .footer-connect .wp-block-media-text .wp-block-media-text__content p a:hover{color: var(--border-blue-color);}
.footer-copy-right{padding: 20px 0;background: #171A1A;}
.footer-copy-right p,.footer-copy-right p a{text-align: center;margin-bottom: 0;font-size: 16px;font-weight: 500;font-family: var(--primary-font-family);color: rgb(255 255 255 / 60%)!important;text-decoration: none;}
.footer-copy-right p a:hover { color: var(--blue-color)!important; }
.footer-copy-right .container{display: flex;align-items: center;justify-content: space-between;gap: 20px;}
/*********************** Footer Contact ***********************/
.contact-section{padding: 100px 0;background: var(--light-blue-color);}
.map iframe{border: 1px solid var(--border-color)!important;border-radius: 18px;}
.map iframe:focus{outline: none!important;box-shadow: none!important;border-color:var(--border-color)!important ;}
.contact-box{padding: 47px 40px;background: var(--global-white);border-radius: 16px;}
.contact-box .main-title{margin-bottom: 36px;}
.contact-deatil{display: flex;flex-direction: column;gap: 24px;}
.contact-inner{display: flex;gap: 16px;}
.contact-inner .contact-icon{width: 50px;height: 50px;padding: 13px;border: 1.15px solid var(--blue-color);border-radius: 50%;line-height: 50px;display: flex;align-items: center;justify-content: center;flex-shrink: 0;}
.contact-right .title-style-6{margin-bottom: 2px;}
.contact-right p,.contact-right p a{color: var(--black-3); margin-bottom: 0;text-decoration: none;}
.contact-right p a:hover{color: var(--blue-color);}
.gm-style iframe+div { border: none !important; }
/*********************** Instagram section ***********************/
.instagram-section { background: var(--light-blue-color); }
#sb_instagram .sb_instagram_header .sbi_header_text,
.sb_instagram_header .sbi_header_text { justify-content: center; -webkit-justify-content: center; gap: 16px; margin-bottom: 20px; }
.sbi_feedtheme_header_text { flex: unset; }
#sb_instagram .sb_instagram_header h3,
.sb_instagram_header h3 { font-size: 30px; color: var(--black-3); font-weight: 500; font-family: var(--stroke-font-family);  }
.sbi_no_avatar .sbi_header_img { background: transparent; border: 1px solid var(--blue-color); }
.sb_instagram_header .sbi_header_hashtag_icon { background: transparent; }
#sb_instagram .sb_instagram_header .sbi_header_img_hover .sbi_new_logo path,
#sb_instagram .sb_instagram_header .sbi_header_hashtag_icon .sbi_new_logo path,
.sb_instagram_header .sbi_header_img_hover .sbi_new_logo path,
.sb_instagram_header .sbi_header_hashtag_icon .sbi_new_logo  path{ fill: var(--blue-color); }
.sbi_photo_wrap > a { position: relative; }
.sbi_photo_wrap > a::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0); transition: all 0.5s; -webkit-transition: all 0.5s; z-index: 1; }
.sbi_photo_wrap > a:hover::before { background: rgba(0, 0, 0, 0.7); }
#sb_instagram #sbi_images .sbi_item  { border-radius: 8px; }
/*********************** Our Rates ***********************/
.our-rate-section{padding: 40px 0 100px;}
.our-title{text-align: center;max-width: 636px;margin: auto auto 60px;}
.our-rate-box{ position: relative; padding: 47px 30px;height: 100%;overflow: hidden; background: var(--global-white); border: 3px solid var(--border-color-2); border-radius: 12px; display: flex; flex-direction: column;justify-content: center; align-items: center; }
.our-rate-box .title-style-5{margin-bottom: 16px;}
.our-rate-box .title-style-4{margin-bottom: 28px;}
.our-rate-box .primary-btn{width: 100%;color: var(--global-black);}
.our-rate-box .primary-btn img{filter: brightness(0) invert(0);transition: 0.5s all;}
.our-rate-box .primary-btn:hover{color: var(--global-white);}
.our-rate-box .primary-btn:hover img{filter: brightness(0) invert(1);}

.our-best{background: var(--blue-color);border: none;}
.our-best span { position: absolute; top: 111px; right: -69px; transform: rotate(45deg); transform-origin: top right; display: block; width: 100%; padding: 8px; text-align: center; font-size: 12px; letter-spacing: -0.32px; font-weight: 700; line-height: 18px; font-family: "Archivo", sans-serif; color: var(--blue-color); background: var(--gray-1); }
.our-best .title-style-5,.our-best .title-style-4{color: var(--global-white);}
.our-best .primary-btn{border-color: var(--global-white);background: var(--global-white);}
.our-best .primary-btn:hover{background: var(--border-blue-color);border-color: var(--border-blue-color);}
/*********************** Sub Banner ***********************/
.sub-banner-main{ position: relative; min-height: 470px;max-height: 470px; background-size: cover!important; background-position: center!important; z-index: 1; }
.sub-banner-main::before{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgb(0, 0, 0); background: linear-gradient(180deg, rgba(0, 0, 0, 0.7343312324929971) 0%, rgba(0, 0, 0, 0) 100%);}
.sub-content{ position: absolute; top: 0; left: 0; width: 100%; height: 100%;text-align: center; display: flex; flex-direction: column; justify-content: center; align-items: center; z-index: 2;padding: 50px 16px; }
.sub-content .title-style-1{ font-size: 50px; line-height: 68px; color: var(--global-white); font-weight: 700; }
/*********************** Contact Form ***********************/
.contact-form-section{padding-bottom: 100px;}
.contact-wrapper{ position: relative; margin: -90px auto auto;max-width: 924px; padding: 60px; background-color: var(--global-white); box-shadow: 0px 7px 40px 0px rgb(0 0 0 / 9%); border-radius: 16px; z-index: 11; }
.contact-wrapper .form-group label,.contact-wrapper label{ font-size: 18px; line-height: 23px; font-weight: 600; font-family: var(--primary-font-family); letter-spacing: -0.32px; margin-bottom: 12px; }
.contact-wrapper .form-group label span{color: red;}
.contact-wrapper .form-group .form-control{ position: relative; padding: 12px 18px; font-size: 18px; line-height: 23px; font-family: var(--primary-font-family); letter-spacing: -0.32px; border: 1px solid #8897AB; border-radius: 0; }
.contact-wrapper .form-group .form-control::placeholder{ color: #8897AB; }
.contact-wrapper .form-group textarea.form-control{ height: 96px; }
.contact-wrapper .form-group .form-control:focus{outline: none!important;box-shadow: none!important;}
.contact-wrapper .form-group .date-input{padding-right: 35px; background-image: url('./assets/images/date-icon.svg'); background-repeat: no-repeat; background-size: 24px; background-position: right 12px center; font-size: 17px; }

/* placeholder text style */ 
input[type="date"]::-webkit-datetime-edit-text, input[type="date"]::-webkit-datetime-edit-month-field, input[type="date"]::-webkit-datetime-edit-day-field, input[type="date"]::-webkit-datetime-edit-year-field { color: #8897AB; text-transform: uppercase; }
/* regular text style */
input[type="date"].date-input--has-value::-webkit-datetime-edit-text, input[type="date"].date-input--has-value::-webkit-datetime-edit-month-field, input[type="date"].date-input--has-value::-webkit-datetime-edit-day-field, input[type="date"].date-input--has-value::-webkit-datetime-edit-year-field { color: #8897AB; text-transform: uppercase; }


.contact-wrapper .form-check { margin: 30px 0 40px; display: flex; align-items: center; }
.contact-wrapper .form-check-input:focus{box-shadow: none;}
input[type=checkbox]:checked:after{opacity: 0;}

.contact-wrapper .form-check-input:checked{ background-color: var(--black-3); border-color: var(--black-3); }
.contact-wrapper .form-check-label{margin: 0;display: flex; align-items: center;flex-wrap: wrap; font-size: 18px; font-weight: 600; color: var(--black-3); font-family: var(--primary-font-family); }
.contact-wrapper .form-check-label a{margin-left: 5px;color: var(--blue-color);text-decoration: underline;}
.form-group .submit{ position: relative; padding: 16px 20px!important; text-transform: uppercase; font-size: 16px; font-weight: 600; font-family: var(--primary-font-family); color: var(--global-white)!important; background: var(--black-3)!important; border-radius: 4px; display: flex; align-items: center; justify-content: center; gap: 6px; border: none!important; transition: 0.5s all; margin: auto; }
.form-group .submit img{ filter: brightness(0) invert(1);}
.form-group .submit:hover{ background: var(--blue-color)!important; }

/* ================================== */
/* -- Single Select Dropdown Start -- */
.single-select-dropdown-main .select2 { width:100% !important; }
.single-select-dropdown-main .select2-container--default .select2-selection--single{ border: 1px solid #8897ab; border-radius:0px; height:100%; padding:12px 30px 12px 18px; }
.single-select-dropdown-main .select2-selection--single .select2-selection__rendered{font-family: var(--primary-font-family); padding-left:0; padding-right:0; font-size:18px; line-height:23px;letter-spacing: -0.32px; font-weight:500; color:#8897AB; text-transform:capitalize; } 
.single-select-dropdown-main .select2-container--default .select2-selection--single .select2-selection__arrow { position: absolute; top: 50%; right: 5px; width:24px; height:24px; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); background: url("./assets/images/down-arrow.svg");}
.single-select-dropdown-main .select2-container--default .select2-selection--single .select2-selection__arrow b{ display:none;}
.single-select-dropdown-main .select2-container--default.select2-container--open .select2-selection__arrow{ transform: translate(-50%, -50%) rotate(-180deg);}
.single-select-dropdown-main .select2-selection__rendered .selected-img-flag { width:26px; max-height: 18px; object-fit: cover; object-position: center center; vertical-align:middle; margin-top: -1px; margin-right: 5px; }
.single-select-dropdown-open-main.select2-dropdown { border-radius:4px; border-top-left-radius: 0; border-top-right-radius: 0; border: 1px solid #8897AB; border-top: none;} 
.single-select-dropdown-open-main .select2-results__options .select2-results__option { font-family: var(--primary-font-family); font-size:16px; line-height:20px; font-weight:500; color:var(--global-black); text-transform:capitalize; padding:10px 14px; } 
.single-select-dropdown-open-main .select2-results__options .select2-results__option.select2-results__option--highlighted { background:var(--blue-color);color: var(--global-white); } 
.single-select-dropdown-open-main .select2-results__options .select2-results__option--selected { background:var(--blue-color); color:var(--global-white); }
.single-select-dropdown-open-main .select2-results__options img { width: 26px; max-height: 20px; vertical-align: middle; margin-top: -2px; margin-right: 5px; }


/*********************** Booking Confirmation CSS ***********************/
.booking-confirmation{ position: relative; margin: -90px auto auto; max-width: 924px; padding: 60px; background-color: var(--global-white); box-shadow: 0px 7px 40px 0px rgb(0 0 0 / 9%); border-radius: 16px; z-index: 11; }
.booing-title{display: flex;gap: 16px;margin-bottom: 60px;}
.booing-title .check-icon{flex-shrink: 0;}
.booing-title .title-style-5{color:var(--green); font-weight: 700;margin-bottom: 6px;}
.booking-name{margin-bottom: 24px;}
.booking-name .title-style-6{font-family: var(--primary-font-family);font-weight: 800;text-transform: uppercase;}
.booking-deatil { display: flex; align-items: center; justify-content: flex-start; width: 100%; margin-bottom: 16px; gap: 10px; }
.booking-deatil p:nth-child(2){font-weight: 800;color: var(--black-3);}
.booking-confirmation .form-group {margin-top: 24px;}
.booking-confirmation .form-group .submit{opacity: 1!important;pointer-events: all!important;display: inline-block;margin: auto;}
.booking-failed .title-style-5{color: red;margin: 20px 0;font-weight: 700;}
.booking-failed p a{text-decoration: underline;color: var(--blue-color);}
/*********************** general content css ***********************/
.site-main .general-content { margin: 100px 0px; }
.general-content h1, .general-content h2, .general-content h3, .general-content h4, .general-content h5, .general-content h6 { color: var(--black-3); margin-bottom: 20px; }
.general-content p, .general-content li, .general-content span, .general-content a { font-size: 18px; line-height: 1.3; color: var(--pargraph-color);  }
.general-content li strong { color: var(--black-3); font-weight: 700; font-size: 20px; line-height: 1.3; text-transform: uppercase; }
.general-content li ul li strong { color: var(--black-3); font-weight: 700; font-size: 16px; line-height: 1.3; text-transform: uppercase; }
.general-content .container > ol, .general-content .container > ul { margin-bottom: 48px; }
.general-content .container > ol > li:last-child, .general-content .container > ul > li:last-child { margin-bottom: 0px; }
.general-content ol:last-child, .general-content ul:last-child{ margin-bottom: 0px; }
.general-content ul { padding-left: 20px; }
.general-content li { padding-left: 0px; margin-bottom: 16px; }
.general-content ul li { padding-left: 10px; }
.general-content ol { counter-reset: item; padding: 0px; padding-left: 40px; list-style: none; }
.general-content ul { list-style-position: outside; }
.general-content ol>li>ol, .general-content ol>li>ul, .general-content ul>li>ol, .general-content ul>li>ul { margin-top: 20px; }
.general-content ol>li, .general-content ul>li { position: relative; margin-bottom: 16px; }
.general-content .container > ol>li, .general-content .container > ul>li { margin-bottom: 48px; }
.general-content ol>li>ol>li:last-child,  .general-content ol>li>ul>li:last-child,  .general-content ul>li>ol>li:last-child,
.general-content ul>li>ul>li:last-child { margin-bottom: 0px; }
.general-content li:before { counter-increment: item; font-weight: 600; color: var(--black-3); }
.general-content ol>li:before { content: counters(item, ".") ". "; position: absolute; top: 0; left: -40px; width: 40px; }
.general-content ol>li>ol>li:before { content: counters(item, ".") " "; }

/*********************** Hire section css ***********************/
.hire-section{ padding: 100px 0 50px; }
.hire-box{ position: relative; padding: 46px 40px;transition: 0.5s all; border: 3px solid var(--blue-color); border-radius: 16px; height: 100%; display: flex; align-items: center; flex-direction: column; text-align: center; }
.hire-box .hire-img{width: 215px;height: 70px;margin-bottom: 16px;transition: 0.5s all;position: relative;background: transparent;}
.hire-box .hire-img img{transition: 0.5s all;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.hire-box .hire-img .hover-img{opacity: 0;visibility: hidden;}
.hire-box .title-style-5 { color: var(--blue-color); text-transform: uppercase; font-weight: 700; margin-bottom: 12px;transition: 0.5s all; }
.hire-box p{margin-bottom: 0;transition: 0.5s all;}
.hire-box:hover{background: var(--blue-color);}
.hire-box:hover .title-style-5{color: var(--global-white);}
.hire-box:hover p{color: var(--global-white);}
.hire-box:hover .hire-img .hover-img{opacity: 1;visibility: visible;}
.hire-box:hover .hire-img .static-img{opacity: 0;visibility: hidden;}

/*********************** About section css ***********************/
.about-section{padding: 50px 0 100px;}
.about-content .title-style-3{ margin-bottom: 12px; }
.about-content .title-style-2{ margin-bottom: 16px; }
.about-content p{letter-spacing: -0.32px;}

.about-video-part{position: relative;overflow: hidden; padding: 30px 46px 46px; text-align: center; background: var(--black-1); border-radius: 16px; margin-left: 47px; }
.about-video-part .title-style-3{font-size: 46px;line-height: 59px;font-weight: 400; color: var(--global-white);margin-bottom: 16px;}
.about-video-part .two-line { position: absolute; right: 46px; top: 0; }
.about-video-part .two-line::before { content: ''; position: absolute; top: 0; right: 22px; width: 1px; height: 46px; background: rgba(255, 255, 255, 0.2); }
.about-video-part .two-line::after { content: ''; position: absolute; top: 0; right: 0; width: 1px; height: 74px; background: rgba(255, 255, 255, 0.2); }


/*********************** Ramp section css ***********************/
.ramp-section{position: relative; padding: 64px 0;background: var(--black-1);}
.ramp-section .ozs-title { position: absolute; top: 40px; left: 28px; font-size: 96px; line-height: 1; font-weight: 900; font-family: var(--stroke-font-family); color: transparent; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: rgba(229, 229, 229, 0.2); }
.ramp-section .container{position: relative;}
.ramp-image img { position: absolute; left: -60px; bottom: -150px; max-width: 576px;z-index: 11; }
.ramp-content .title-style-5{ font-size: 36px; line-height: 46px; color: var(--global-white); text-transform: uppercase; font-weight: 700; margin-bottom: 20px; }
.ramp-content p{ color: var(--global-white); opacity: 60%; margin-bottom: 0; letter-spacing: -0.32px; }

.ramp-section .two-line { position: absolute; right: 0; bottom: 30%; }
.ramp-section .two-line::before { content: ''; position: absolute; top: 0; right: 0; width: 84px; height: 1px; background: rgba(255, 255, 255, 0.2); }
.ramp-section .two-line::after { content: ''; position: absolute; bottom: -40px; right: 0; width: 146px; height: 1px; background: rgba(255, 255, 255, 0.2); }

/*********************** Our Trailers section css ***********************/
.our-trailers{ position: relative; padding: 135px 0 70px; background: var(--light-blue-color); }
.our-trailers .two-line { position: absolute; right: 0; top: 5%; }
.our-trailers .two-line::before { content: ''; position: absolute; top: 0; right: 0; width: 146px; height: 1px; background: rgb(0 0 0 / 10%); }
.our-trailers .two-line::after { content: ''; position: absolute; bottom: -40px; right: 0; width: 84px; height: 1px; background: rgb(0 0 0 / 10%); }

.our-trailers .line-bottom{position: absolute;left: 40px;bottom: 0;}
.our-trailers .line-bottom::before{content: ''; position: absolute; width: 1px; height: 146px;background: rgb(0 0 0 / 10%);bottom: 0;left: 0px;}
.our-trailers .line-bottom::after{content: ''; position: absolute; width: 1px;height: 84px;background: rgb(0 0 0 / 10%);bottom: 0;left: 32px;}

.trailers-content { width: calc(1140px / 2); margin-left: auto; }
.our-trailers .title-style-3{margin-bottom: 12px;}
.our-trailers .title-style-2{margin-bottom: 28px;}

.safety-content{padding-top: 50px;}
.safety-content .title-style-6{color: var(--black-3);font-weight: 700; text-transform: uppercase; margin-bottom: 16px;}
.safety-content p{margin-bottom: 12px;}
.safety-content p:last-child{margin-bottom: 0;}
.trailer-image{position: relative;text-align: right	;}
.trailer-image img{width: 80%;}
.trailer-image .ozs-title { position: absolute; bottom: -100px; right: 0; font-size: 124px; line-height: 1; font-weight: 800; font-family: var(--stroke-font-family); color: transparent; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: rgb(0 0 0 / 10%); text-transform: uppercase; letter-spacing: -0.32px; }

/** custom-accordion **/
.custom-accordion .accordion-item{border: none!important;border-radius: 0!important;background-color: transparent!important	;border-bottom: 1px solid #B7B7B7!important; }
.custom-accordion .accordion-item:last-child{border-bottom: none!important;}
.custom-accordion .accordion-button{ padding: 16px 30px 16px 0; background: transparent!important; border: none!important; border-radius:0!important ; font-size: 20px; line-height: 26px; color: var(--black-3)!important; text-transform: uppercase	; font-weight: 700; font-family: "Archivo", sans-serif; letter-spacing: -0.32px; box-shadow: none!important; }
.custom-accordion .accordion-body{ padding: 0 0 16px; }
.custom-accordion .accordion-body p{ color: #666666; margin-bottom: 14px; letter-spacing: -0.32px; }
.custom-accordion .accordion-body p:last-child{margin-bottom: 0;}
.custom-accordion .accordion-button::after{ position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 26px; height: 26px; background-image: url('./assets/images/plus-icon.svg'); background-size: cover; }
.accordion-button:not(.collapsed)::after{ transform: translateY(-50%) rotate(45deg); }



/** modal **/
.modal-content .close { background: var(--global-white) !important; position: relative; padding: 0 !important; color: #000 !important; }
.modal-body .form-group{margin-bottom: 15px;}
.modal-body .form-group label{ display: block; font-size: 18px; font-weight: 500; color: var(--black-3); }

.modal-body .form-group input { font-size: 16px; font-weight: 400; border-radius: 0; border: 1px solid var(--black-3) !important; width: 100%; padding: 6px 10px; color: var(--black-3); }
.modal-body .form-group input::placeholder{color: var(--black-3);}

.modal-body .form-group .StripeElement{ border-radius: 0!important; border: 1px solid var(--black-3) !important; width: 100%!important; box-shadow: none!important; } 
#submit-button{ background: var(--black-3); }
#submit-button:hover{ background: var(--blue-color); }
.modal-body #card-errors{ margin-bottom: 17px; font-size: 18px; color: red; font-weight: 500; }

.modal-blur{filter: blur(4px);}
.loader{
	position: absolute;
    width: 70px;
    height: 70px;
    top: calc(50% - 50px);
    left: calc(50% - 50px);
}

/* Absolute Center Spinner */
.loading {
	position: fixed;
	z-index: 999;
	height: 2em;
	width: 2em;
	overflow: show;
	margin: auto;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	/* display: none; */
  }
  
  /* Transparent Overlay */
  .loading:before {
	content: '';
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	  background: radial-gradient(rgba(20, 20, 20,.8), rgba(0, 0, 0, .8));
  
	background: -webkit-radial-gradient(rgba(20, 20, 20,.8), rgba(0, 0, 0,.8));
  }
  
  /* :not(:required) hides these rules from IE9 and below */
  .loading:not(:required) {
	/* hide "loading..." text */
	font: 0/0 a;
	color: transparent;
	text-shadow: none;
	background-color: transparent;
	border: 0;
  }
  
  .loading:not(:required):after {
	content: '';
	position: fixed;
    top: calc(50% - 50px);
    left: calc(50% - 50px);
	display: block;
	font-size: 10px;
	width: 1em;
	height: 1em;
	margin-top: -0.5em;
	-webkit-animation: spinner 150ms infinite linear;
	-moz-animation: spinner 150ms infinite linear;
	-ms-animation: spinner 150ms infinite linear;
	-o-animation: spinner 150ms infinite linear;
	animation: spinner 150ms infinite linear;
	border-radius: 0.5em;
	-webkit-box-shadow: rgba(255,255,255, 0.75) 1.5em 0 0 0, rgba(255,255,255, 0.75) 1.1em 1.1em 0 0, rgba(255,255,255, 0.75) 0 1.5em 0 0, rgba(255,255,255, 0.75) -1.1em 1.1em 0 0, rgba(255,255,255, 0.75) -1.5em 0 0 0, rgba(255,255,255, 0.75) -1.1em -1.1em 0 0, rgba(255,255,255, 0.75) 0 -1.5em 0 0, rgba(255,255,255, 0.75) 1.1em -1.1em 0 0;
  box-shadow: rgba(255,255,255, 0.75) 1.5em 0 0 0, rgba(255,255,255, 0.75) 1.1em 1.1em 0 0, rgba(255,255,255, 0.75) 0 1.5em 0 0, rgba(255,255,255, 0.75) -1.1em 1.1em 0 0, rgba(255,255,255, 0.75) -1.5em 0 0 0, rgba(255,255,255, 0.75) -1.1em -1.1em 0 0, rgba(255,255,255, 0.75) 0 -1.5em 0 0, rgba(255,255,255, 0.75) 1.1em -1.1em 0 0;
  }
  
  /* Animation */
  
  @-webkit-keyframes spinner {
	0% {
	  -webkit-transform: rotate(0deg);
	  -moz-transform: rotate(0deg);
	  -ms-transform: rotate(0deg);
	  -o-transform: rotate(0deg);
	  transform: rotate(0deg);
	}
	100% {
	  -webkit-transform: rotate(360deg);
	  -moz-transform: rotate(360deg);
	  -ms-transform: rotate(360deg);
	  -o-transform: rotate(360deg);
	  transform: rotate(360deg);
	}
  }
  @-moz-keyframes spinner {
	0% {
	  -webkit-transform: rotate(0deg);
	  -moz-transform: rotate(0deg);
	  -ms-transform: rotate(0deg);
	  -o-transform: rotate(0deg);
	  transform: rotate(0deg);
	}
	100% {
	  -webkit-transform: rotate(360deg);
	  -moz-transform: rotate(360deg);
	  -ms-transform: rotate(360deg);
	  -o-transform: rotate(360deg);
	  transform: rotate(360deg);
	}
  }
  @-o-keyframes spinner {
	0% {
	  -webkit-transform: rotate(0deg);
	  -moz-transform: rotate(0deg);
	  -ms-transform: rotate(0deg);
	  -o-transform: rotate(0deg);
	  transform: rotate(0deg);
	}
	100% {
	  -webkit-transform: rotate(360deg);
	  -moz-transform: rotate(360deg);
	  -ms-transform: rotate(360deg);
	  -o-transform: rotate(360deg);
	  transform: rotate(360deg);
	}
  }
  @keyframes spinner {
	0% {
	  -webkit-transform: rotate(0deg);
	  -moz-transform: rotate(0deg);
	  -ms-transform: rotate(0deg);
	  -o-transform: rotate(0deg);
	  transform: rotate(0deg);
	}
	100% {
	  -webkit-transform: rotate(360deg);
	  -moz-transform: rotate(360deg);
	  -ms-transform: rotate(360deg);
	  -o-transform: rotate(360deg);
	  transform: rotate(360deg);
	}
  }

/*********************** Welcome Section section css ***********************/
.welcome-section{padding-top: 100px;}
.welcome-section .title-style-2{margin-bottom: 15px;}
.welcome-section .custom-accordion{margin-bottom: 15px;}

.welocme-btn{margin-top: 20px;}
.welocme-btn .primary-btn{display: inline-block;}


.genral-button{margin-top: 20px;}
.genral-button {display: flex;gap: 20px;justify-content: center;}
.genral-button a{width: fit-content;}
/*********************** Media Query CSS Start ***********************/
@media (min-width: 1400px){
    .container{max-width: 1140px;padding: 0;}
    /*********************** Footer Section CSS ***********************/
   

}

@media ( min-width: 1200px) and ( max-width: 1499px) {

	/*********************** Typography start ***********************/
	.title-style-1 { font-size: 40px; line-height: 56px; }
	.title-style-2 { font-size: 34px; line-height: 46px; }
	.title-style-3 { font-size: 44px; line-height: 59px; }
	.title-style-4 { font-size: 38px; line-height: 51px; }
	.title-style-5 { font-size: 18px; line-height: 24px; }
	.title-style-6 { font-size: 16px; line-height: 21px; }
	p { font-size: 16px; line-height: 26px; 	}
	/*********************** Typography end ***********************/

	/*********************** Primary Button ***********************/
	.primary-btn { padding: 12px 18px; font-size: 14px; }

	/*********************** slick arrow ***********************/
	.slick-arrow { width: 45px; height: 45px; }

	/*********************** banner styling starts ***********************/
	.black-section .ozs-title { font-size: 140px; }
	.black-section .trailer-txt  { font-size: 70px; }
	/*********************** banner styling end ***********************/

	/*********************** Instagram section ***********************/
	#sb_instagram .sb_instagram_header h3, .sb_instagram_header h3 { font-size: 28px;
	}

	/*********************** Error page ***********************/
	.error-404 { min-height: max(80vh, 500px); }
	.error-404 .error-msg-wrapper h1 { font-size: 120px; }
	/*********************** Error page style ends ***********************/

	/*********************** Ramp section css ***********************/
	.ramp-image img { left: -10px; bottom: -145px; max-width: 525px; }
	.our-trailers .container{padding: 0;}

}


@media (min-width: 992px) and (max-width: 1199px) {
	.our-trailers .container{padding: 0;}
	.trailers-content { width: calc(960px / 2); margin-left: auto; }
	.trailer-image .ozs-title{font-size: 94px;}
	.ramp-image img { left: -20px; bottom: -140px; max-width: 496px; }
	.ramp-content .title-style-5 { font-size: 30px; line-height: 40px; }
	.our-best span { top: 99px; right: -58px; }
}

@media (max-width: 1199px) {


	/*********************** Typography start ***********************/
	.title-style-1 { font-size: 36px; line-height: 50px; }
	.title-style-2 { font-size: 30px; line-height: 40px; }
	.title-style-3 { font-size: 40px; line-height: 55px; }
	.title-style-4 { font-size: 34px; line-height: 46px; }
	.title-style-5 { font-size: 18px; line-height: 24px; }
	.title-style-6 { font-size: 16px; line-height: 21px; }
	p { font-size: 15px; line-height: 24px; }

	/*********************** Typography end ***********************/


	/*********************** Primary Button ***********************/
	.primary-btn { padding: 12px 18px; font-size: 14px; }

	/*********************** slick arrow ***********************/
	.slick-arrow { width: 42px; height: 42px; }

	/*********************** banner styling starts ***********************/
	.black-section .ozs-title { font-size: 120px; }
	.black-section .trailer-txt { font-size: 60px; }
	.black-section .two-lines::before  { width: 70px; }
	.black-section .two-lines::after { width: 120px; }
	/*********************** banner styling end ***********************/

	/*********************** Footer ***********************/
	.footer-main-section .footer-logo{padding-right: 0px;}
	.footer-main-section .footer-social{padding-left: 0;}

	/*general content css*/
	.site-main .general-content { margin: 60px 0px; }

	.general-content .container>ol>li,
	.general-content .container>ul>li { margin-bottom: 30px; }
	.general-content ol>li:before { left: -30px; width: 25px; }
	.general-content .container>ol>li:before { left: -30px; }
	/*********************** Instagram section ***********************/
	#sb_instagram .sb_instagram_header h3,
	.sb_instagram_header h3 { font-size: 24px; }
	/*********************** Error page ***********************/
	.error-404 { min-height: max(75vh, 500px); }
	.error-404 .error-msg-wrapper h1 { font-size: 100px; }
	/*********************** Error page style ends ***********************/

	/*********************** Hire section css ***********************/
	.hire-box{padding: 36px 30px;}

	.custom-accordion .accordion-button { padding: 14px 30px 13px 0; font-size: 16px; line-height: 26px; }
	

}


@media(min-width: 768px) and (max-width: 991px) {

	/*********************** Typography start ***********************/
	.title-style-1 { font-size: 30px; line-height: 40px; }
	.title-style-2 {font-size: 24px; line-height: 36px; }
	.title-style-3 { font-size: 34px; line-height: 50px; }
	.title-style-4 { font-size: 30px; line-height: 40px; }
	.title-style-5 { font-size: 18px; line-height: 24px; }
	.title-style-6 { font-size: 16px; line-height: 21px; }
	p { font-size: 15px; line-height: 24px; }
	/*********************** Typography end ***********************/

	/*********************** Primary Button ***********************/
	.primary-btn { padding: 12px 18px; font-size: 14px; }

	/*********************** slick arrow ***********************/
	.slick-arrow { width: 40px; height: 40px; }

	/*********************** banner styling starts ***********************/
	.black-section .ozs-title { font-size: 100px; }
	.black-section .trailer-txt { font-size: 50px; }
	.black-section .two-lines::before { width: 60px; }
	.black-section .two-lines::after { width: 100px; }
	/*********************** banner styling end ***********************/

	/*********************** header ***********************/
	.header-navigation .header-inner .book-btn a{ padding: 12px 15px !important;  }
	.call-header p{font-size: 14px;line-height: 21px;}
	.call-header p a{font-size: 16px;}
	/*general content css*/
	.site-main .general-content { margin: 50px 0px; }
	.general-content li strong { font-size: 18px; }
	.general-content p, .general-content li, .general-content span, .general-content a { font-size: 16px; }
	.general-content .container>ol>li,
	.general-content .container>ul>li { margin-bottom: 30px; }
	.general-content ol>li:before { left: -30px; width: 25px; }
	.general-content .container>ol>li:before { left: -24px; }
	/*********************** Instagram section ***********************/
	#sb_instagram .sb_instagram_header h3,
	.sb_instagram_header h3 { font-size: 22px; }

	/*********************** Error page ***********************/
	.error-404 { min-height: max(70vh, 500px); }
	.error-404 .error-msg-wrapper h1 { font-size: 80px; }
	.error-404 .error-msg-wrapper p { font-size: 16px; }
	/*********************** Error page style ends ***********************/

	
	/*********************** Hire section css ***********************/
	.hire-box{padding: 30px 24px;}
	
	/*********************** Ramp section css ***********************/
	.ramp-section .ozs-title { font-size: 76px; }
	.ramp-content .title-style-5 { font-size: 26px; line-height: 36px; margin-bottom: 12px; }

	.our-best span { top: 145px; right: -90px; }

	/*********************** Sub Banner ***********************/
	.sub-banner-main { min-height: 300px; }
	.sub-content .title-style-1 { font-size: 40px; line-height: 50px; }

}

@media (max-width: 991px){
	/*********************** Footer section css ***********************/
	.contact-section { padding: 50px 0; }
	.our-rate-section { padding: 40px 0; }
	.our-title { margin: auto auto 30px; }
	.contact-form-section { padding-bottom: 50px; }
	/*********************** Hire section css ***********************/
	.hire-section { padding: 50px 0px 25px; }	
	/*********************** About section css ***********************/ 
	.about-section { padding: 25px 0 50px; }
	.about-content .title-style-3 { margin-bottom: 6px; }
	.about-video-part{margin-left: 0;padding: 30px 26px;}
	.about-video-part .title-style-3 { font-size: 34px; line-height: 50px; }
	/*********************** Ramp section css ***********************/
	.ramp-section{padding: 50px 0 0;}
	.ramp-image img { position: relative; left: unset; bottom: unset; max-width: 100%; margin-bottom: -100px; }
	.ramp-section .row{flex-direction: column-reverse;}
	/*********************** Our Trailers section css ***********************/
	.trailers-content { width: 100%;max-width: 720px;margin: auto;padding: 0px 12px; }
	.trailer-image { text-align: center;margin-top: 30px; }
	.trailer-image .ozs-title{display: none;}
	.our-trailers{padding: 110px 0 50px;}
	.our-trailers .title-style-2 { margin-bottom: 15px; }
	.custom-accordion .accordion-body p { margin-bottom: 10px; }

	.contact-wrapper .form-group .form-control { padding: 12px 18px; font-size: 16px; line-height: 1; }
	.contact-wrapper .form-group label, .contact-wrapper label { font-size: 16px; }
		.welcome-section {
			padding-top: 50px;
		}
}


@media (max-width: 767px) {
	/*********************** Typography start ***********************/
	.title-style-1 { font-size: 30px; line-height: 40px; }
	.title-style-2 { font-size: 24px; line-height: 36px; }
	.title-style-3 { font-size: 34px; line-height: 50px; }
	.title-style-4 { font-size: 30px; line-height: 40px; }
	.title-style-5 { font-size: 18px; line-height: 24px; }
	.title-style-6 { font-size: 16px; line-height: 21px; }
	p { font-size: 15px; line-height: 24px; }

	/*********************** Typography end ***********************/
	.contact-box { padding: 35px 20px; }
	/*********************** Primary Button ***********************/
	.primary-btn { padding: 12px 18px; font-size: 14px; }
	/*********************** slick arrow ***********************/
	.slick-arrow { width: 40px; height: 40px; }
	/*********************** banner styling starts ***********************/
	.black-section { width: 0%; display: none;}
	.banner-img-slider { width: 100%; }
	.banner-content { padding: 0px; }
	.banner-img-slider .img-wrapper::after  { background: rgba(0, 0, 0, 0.7); }
	.banner .slick-arrow.slick-next { transform: translateX(-100%); }
	.banner .slick-arrow.slick-prev { transform: translateX(-220%); }
	.black-section .ozs-title { font-size: 100px; }
	.black-section .trailer-txt { font-size: 50px; }
	/*********************** banner styling end ***********************/
	/*********************** header ***********************/
	.header-navigation{padding: 10px 20px;}
	.header-navigation .site-logo img{max-width: 115px}
	.header-right{gap: 14px;}
	.header-navigation .header-inner .book-btn a{ padding: 6px 10px !important; font-size: 12px; line-height: 22px;gap: 0; }
	.header-navigation .header-inner .book-btn a div img{display: none;}
	.call-header .wp-block-image a { width: 35px; height: 35px; padding: 8px; line-height: 35px; }
	.call-header{gap: 0;}
	.call-header p{display: none;}
	.call-header .wp-block-image a{line-height: normal;pointer-events:auto;}
	/*********************** Footer ***********************/
	.footer-main-section{padding: 50px 0 15px;}
	.footer-main-section .footer-logo figure{margin-bottom: 20px;}
	.footer-main-section .footer-connect .wp-block-heading{font-size: 18px;line-height: 20px;margin-bottom: 18px;}
	.footer-main-section .footer-social .footer-social-media ul li a{gap: 10px;}
	.footer-main-section .footer-connect .wp-block-media-text { gap: 10px; }
	.footer-main-section .footer-social .footer-social-media ul li a span{font-size: 14px;line-height: 24px;}
	.footer-main-section .footer-connect .wp-block-media-text .wp-block-media-text__content p, .footer-main-section .footer-connect .wp-block-media-text .wp-block-media-text__content p a { font-size: 14px; line-height: 24px; }
	.footer-copy-right{padding: 12px;}
	.footer-copy-right p,.footer-copy-right p a{font-size: 12px;line-height: 22px;}
	.footer-main-section .footer-social{margin-bottom: 15px;}
	.footer-copy-right .container{flex-direction: column;gap: 10px;}
	/*general content css*/
	.site-main .general-content { margin: 40px 0px; }
	.general-content li strong { font-size: 18px; }
	.general-content p, .general-content li, .general-content span, .general-content a { font-size: 16px; }
	.general-content .container>ol>li, .general-content .container>ul>li { margin-bottom: 30px; }
	.general-content ol>li:before { left: -30px; width: 25px; }
	.general-content ol  { padding-left: 30px; }
	.general-content .container > ol>li:before { left: -24px; }
	/*********************** Instagram section ***********************/
	#sb_instagram .sb_instagram_header h3,
	.sb_instagram_header h3 { font-size: 22px; }
	/*********************** Error page ***********************/
	.error-404 { min-height: max(75vh, 500px); }	
	.error-404 .error-msg-wrapper h1 { font-size: 80px; }
	.error-404 .error-msg-wrapper p { font-size: 16px; }
	/*********************** Error page style ends ***********************/
	.trailers-content { max-width: 540px; }
	/*********************** Ramp section css ***********************/
	.ramp-section .ozs-title { font-size: 76px; }
	.ramp-content .title-style-5 { font-size: 22px; line-height: 32px; margin-bottom: 12px; }

	.safety-content { padding-top: 30px; }

	.our-best span { top: 125px; right: -62px; }
	.our-rate-box { max-width: 267px; margin: auto; }

	.contact-wrapper { padding: 35px; }

	.sub-banner-main { min-height: 250px; }
	.sub-content .title-style-1 { font-size: 30px; line-height: 40px; }
}
@media (max-width: 481px){
	/*********************** header ***********************/
	.menu-button-container{display: none;}
	.header-navigation	.primary-menu-container{ position: relative!important; height: unset; top: unset; right: unset; padding: 0; bottom: auto; visibility: visible; opacity: 1; transform: unset!important; background: unset; }
	.header-navigation .primary-menu-container	.menu-wrapper{padding: 0;}
}



/* availability-error css */
.availability-error {
    color: red;
	font-size: 16px;
}