@import url("https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap");
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { background: transparent; border: 0; margin: 0; padding: 0; }


table { border-collapse: collapse; width: 100%; }

td { vertical-align: top; }

/* Make HTML 5 elements display block-level for consistent styling */
header, nav, article, footer, address { display: block; }


/*-------- COLORS --------

*/
/***** END RESET *****/
::-moz-selection { background: #000; color: #fff; text-shadow: none; }

::selection { background: #000; color: #fff; text-shadow: none; }

/* Clearfix */
.cf:before, .cf:after { content: " "; display: table; }

.cf:after { clear: both; }

.cf { *zoom: 1; }


/*---These are Variables. They are being used in place of the hex color easily changes site colors but updating these variables----*/
/*----These are Mixins. They work similarly to variables and are plugged in using @include in place of the CSS----*/
/*-------- BODY STYLES --------*/
* { box-sizing: border-box; }

body { font-family: "Roboto", sans-serif; }

h1, h2, h3, h4, h5 { font-family: "Nunito Sans", sans-serif; }

a { text-decoration: none; }

.blue-btn { width: 205px; height: 60px; transition: .3s ease; background: #2B66A0; border-radius: 50px; padding: 22px; display: flex; flex-direction: row; justify-content: space-between; }
.blue-btn span { font-size: 13px; color: #fff; font-family: "Nunito Sans", sans-serif; font-weight: 600; text-transform: uppercase; }
.blue-btn i { color: #fff; font-size: 16px; }

.blue-btn:hover, .trans-btn:hover { padding: 22px 30px; }

.trans-btn { width: 205px; transition: .3s ease; height: 60px; background: transparent; border: solid 2px #fff; border-radius: 50px; padding: 22px; display: flex; flex-direction: row; justify-content: space-between; }
.trans-btn span { font-size: 13px; color: #fff; font-family: "Nunito Sans", sans-serif; font-weight: 600; text-transform: uppercase; }
.trans-btn i { color: #fff; font-size: 16px; }

/*--- HEADER STYLES ---------------------*/
header { width: 100%; background: #10172B; }

.header { max-width: 1600px; margin: 0 auto; width: 100%; padding: 10px; box-sizing: border-box; display: flex; flex-direction: row; justify-content: space-between; }

.logo { max-width: 130px; width: 100%; }

/*--------Hero---------*/
.hero { width: 100%; background-color: #000; position: relative; height: 800px; }
.hero img { width: 100%; background-color: #000; height: 100%; background: #000; object-fit: cover; }
.hero .grad { position: absolute; z-index: 50; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, #10172B 0%, rgba(0, 0, 0, 0) 14%, rgba(0, 0, 0, 0) 70%, #10172B 100%); }

.hero-text { position: absolute; z-index: 100; bottom: -30px; right: 7%; }
.hero-text h1 { font-size: 60px; text-align: right; font-family: "Nunito Sans", sans-serif; font-weight: 900; color: #fff; text-transform: uppercase; letter-spacing: .85px; line-height: 65px; }
.hero-text h1 span { text-shadow: 2px 2px 0 white, -2px 2px 0 white, 2px -2px 0 white, -2px -2px 0 white; color: #10172B; }
.hero-text a { float: right; margin-top: 10px; }

/*------Home--------*/
.dark-back { background: #10172B; width: 100%; padding: 2% 0; }

.dark-back-grad { background: linear-gradient(to bottom, #10172B 30%, #2E4880 50%, #2E4880 65%, #10172B 100%); width: 100%; }

.wrap { max-width: 1600px; margin: 0 auto; width: 100%; padding: 10px; box-sizing: border-box; }

.feat { display: flex; flex-direction: row; justify-content: space-between; padding: 6% 0 2% 0; }

.feat-left { width: 50%; }
.feat-left h2 { font-size: 45px; font-family: "Nunito Sans", sans-serif; font-weight: 900; color: #fff; text-transform: uppercase; letter-spacing: .85px; line-height: 50px; background: linear-gradient(to right, #2B66A0 60px, transparent 60px); padding: 20px 0 20px 20px; }
.feat-left h2 span { text-shadow: 2px 2px 0 white, -2px 2px 0 white, 2px -2px 0 white, -2px -2px 0 white; color: #10172B; }
@media only screen and (max-width: 1200px) { .feat-left h2 { font-size: 35px; line-height: 37px; } }
@media only screen and (max-width: 900px) { .feat-left h2 { font-size: 30px; line-height: 33px; } }
@media only screen and (max-width: 600px) { .feat-left h2 { font-size: 26px; line-height: 30px; } }
@media only screen and (max-width: 450px) { .feat-left h2 { font-size: 22px; line-height: 25px; } }
.feat-left p { font-size: 14px; font-family: "Roboto", sans-serif; line-height: 24px; color: #fff; padding: 40px 0; }

.feat-right { width: 50%; padding-left: 40px; }
.feat-right video { width: 100%; }

.links { padding: 30px 0; }
.links hr { margin: 60px 0; }

.links-logo { width: 1005; padding-bottom: 20px; }
.links-logo img { max-width: 270px; width: 100%; display: block; margin: 0 auto; }

.links-row { width: 100%; display: flex; flex-direction: row; justify-content: center; }
.links-row a { width: 26%; display: block; }
.links-row a img { width: 80%; margin: 0 auto; transition: .3s ease; }
.links-row a h2 { font-size: 26px; font-weight: 800; color: #fff; text-align: center; padding-top: 20px; }
.links-row a:hover img { transform: scale(0.9); }
.back{display:none;}
/*--------Brands----------*/
.brands { width: 100%; }

.brands a { padding: 20px !important; width: calc(100% - 2px); box-sizing: border-box; border: solid 1px #fff; }

.brands a img { width: 80% !important; filter: grayscale(1); margin: 0 auto; display: block; transition: .3s ease; }

.brands a:hover img { filter: grayscale(0); }

.brandbar { background: transparent; margin: 0 auto; text-align: center; padding: 40px 0 20px 0; box-sizing: border-box; width: 100%; max-width: 1600px; top: 0; left: 0; right: 0; }

.slick-slider { margin-right: 2px !important; margin-bottom: 2px !important; }

.slick-track { margin-bottom: 5px; }

.brand-prev, .brand-next { display: inline-block; transition: .3s ease; background: transparent; justify-content: center; align-items: center; width: 50px; height: 50px; border: solid 1px #fff; color: #fff; font-size: 16px; }

.brand-prev:hover, .brand-next:hover { background: #fff; color: #000; cursor: pointer; }

.brand-arrows { display: flex; flex-direction: row; justify-content: center; }

/*----qls---------*/
.ql-text { width: 100%; display: flex; flex-direction: row; justify-content: space-between; padding: 4% 0; }

.ql-text-left p { font-size: 18px; color: #fff; font-weight: 400; }
.ql-text-left h2 { font-size: 45px; font-family: "Nunito Sans", sans-serif; font-weight: 900; color: #fff; text-transform: uppercase; letter-spacing: .85px; line-height: 50px; background: linear-gradient(to right, #2B66A0 60px, transparent 60px); padding: 20px 0 20px 20px; }
.ql-text-left h2 span { text-shadow: 2px 2px 0 white, -2px 2px 0 white, 2px -2px 0 white, -2px -2px 0 white; color: #10172B; }
@media only screen and (max-width: 1200px) { .ql-text-left h2 { font-size: 35px; line-height: 37px; } }
@media only screen and (max-width: 900px) { .ql-text-left h2 { font-size: 30px; line-height: 33px; } }
@media only screen and (max-width: 600px) { .ql-text-left h2 { font-size: 26px; line-height: 30px; } }
@media only screen and (max-width: 450px) { .ql-text-left h2 { font-size: 22px; line-height: 25px; } }

.ql-text-right { padding-top: 110px; display: flex; }

.inv-prev, .inv-next { display: flex; transition: .3s ease; background: transparent; justify-content: center; align-items: center; width: 50px; height: 50px; border: solid 1px #fff; color: #fff; font-size: 16px; }

.inv-prev:hover, .inv-next:hover { background: #fff; color: #000; cursor: pointer; }

.ql-slider { width: 100%; }

.ql-slide { margin: 10px !important; border-radius: 15px; background: #fff; padding: 20px; }
.ql-slide img { width: 100%; height: 180px; object-fit: cover; border-radius: 10px; }
.ql-slide h3 { font-size: 24px; font-weight: 800; text-transform: uppercase; padding: 15px 0 0; }
.ql-slide p { font-size: 14px; font-family: "Roboto", sans-serif; line-height: 24px; color: #333; padding: 15px 0; height: 120px; }

.map { max-width: 1200px; margin: 0 auto; width: 100%; }

.map-text { padding: 6% 0 3% 0; max-width: 800px; margin: 0 auto; }
.map-text h2 { font-size: 45px; font-family: "Nunito Sans", sans-serif; font-weight: 900; color: #fff; text-transform: uppercase; letter-spacing: .85px; line-height: 50px; text-align: center; }
.map-text h2 span { text-shadow: 2px 2px 0 white, -2px 2px 0 white, 2px -2px 0 white, -2px -2px 0 white; color: #10172B; }
@media only screen and (max-width: 1200px) { .map-text h2 { font-size: 35px; line-height: 37px; } }
@media only screen and (max-width: 900px) { .map-text h2 { font-size: 30px; line-height: 33px; } }
@media only screen and (max-width: 600px) { .map-text h2 { font-size: 26px; line-height: 30px; } }
@media only screen and (max-width: 450px) { .map-text h2 { font-size: 22px; line-height: 25px; } }
.map-text p { font-size: 14px; font-family: "Roboto", sans-serif; line-height: 24px; color: #fff; text-align: center; max-width: 550px; margin: 0 auto; }

#USA path { fill: #fff; cursor: pointer; transition: fill 0.3s ease; }

#USA a path { fill: #2B66A0; }

#USA a:hover path { transform: scale(1.02); transform-origin: center; }

.serv-wrap { width: 100%; display: flex; flex-direction: row; justify-content: center; padding: 0 10px; }

.serv-left { width: 50%; }
.serv-left p { font-size: 14px; font-family: "Roboto", sans-serif; line-height: 24px; color: #fff; padding-top: 50px; }
.serv-left h2 { font-size: 45px; font-family: "Nunito Sans", sans-serif; font-weight: 900; color: #fff; text-transform: uppercase; letter-spacing: .85px; line-height: 50px; background: linear-gradient(to right, #2B66A0 60px, transparent 60px); padding: 20px 0 20px 20px; }
.serv-left h2 span { text-shadow: 2px 2px 0 white, -2px 2px 0 white, 2px -2px 0 white, -2px -2px 0 white; color: #10172B; }
@media only screen and (max-width: 1200px) { .serv-left h2 { font-size: 35px; line-height: 37px; } }
@media only screen and (max-width: 900px) { .serv-left h2 { font-size: 30px; line-height: 33px; } }
@media only screen and (max-width: 600px) { .serv-left h2 { font-size: 26px; line-height: 30px; } }
@media only screen and (max-width: 450px) { .serv-left h2 { font-size: 22px; line-height: 25px; } }
.serv-left img { width: 100%; opacity: .2; }

.serv-right { width: 50%; }
.serv-right a { width: calc(100% - 10px); margin: 10px; background: #152142; display: flex; flex-direction: row; justify-content: space-between; border: solid 1px #fff; border-radius: 15px; }
.serv-right a:hover { background: transparent; }
.serv-right .link-text { width: calc(100% - 60px); padding: 30px; color: #fff; }
.serv-right .link-text h3 { font-size: 28px; color: #fff; font-weight: 800; }
.serv-right .link-text p { font-size: 14px; font-family: "Roboto", sans-serif; line-height: 24px; color: #fff; }
.serv-right .link-icon { width: 60px; border-left: solid 1px #fff; font-size: 16px; color: #fff; display: flex; justify-content: center; align-content: center; flex-wrap: wrap; }
.serv-right .link-icon i { color: #fff; }

/*---------Pages----------*/
.page-hero { width: 100%; height: 400px; position: relative; background: #000; }
.page-hero img { width: 100%; background: #000; height: 100%; object-fit: cover; filter: brightness(0.4); }

.page-top-text { position: absolute; bottom: 20%; left: 0; right: 0; margin: 0 auto; max-width: 1600px; margin: 0 auto; width: 100%; padding: 10px; box-sizing: border-box; }
.page-top-text h1 { font-size: 45px; font-family: "Nunito Sans", sans-serif; font-weight: 900; color: #fff; text-transform: uppercase; letter-spacing: .85px; line-height: 50px; text-align: center; }
.page-top-text h1 span { text-shadow: 2px 2px 0 white, -2px 2px 0 white, 2px -2px 0 white, -2px -2px 0 white; color: #10172B; }
@media only screen and (max-width: 1200px) { .page-top-text h1 { font-size: 35px; line-height: 37px; } }
@media only screen and (max-width: 900px) { .page-top-text h1 { font-size: 30px; line-height: 33px; } }
@media only screen and (max-width: 600px) { .page-top-text h1 { font-size: 26px; line-height: 30px; } }
@media only screen and (max-width: 450px) { .page-top-text h1 { font-size: 22px; line-height: 25px; } }
.page-top-text h2 { font-size: 28px; font-family: "Nunito Sans", sans-serif; font-weight: 800; color: #72B9FF; text-transform: uppercase; line-height: 34px; text-align: center; }
@media only screen and (max-width: 600px) { .page-top-text h2 { font-size: 22px; line-height: 26px; } }
@media only screen and (max-width: 400px) { .page-top-text h2 { font-size: 20px; line-height: 24px; } }
.page-top-text hr { height: 5px; width: 200px; border: none; color: #5FA8EF; background: #5FA8EF; margin: 20px auto; }

.text-full { width: 100%; padding: 2% 0; }
.text-full h2 { font-size: 45px; font-family: "Nunito Sans", sans-serif; font-weight: 800; color: #fff; text-transform: uppercase; line-height: 50px; padding: 20px 0; }
@media only screen and (max-width: 1200px) { .text-full h2 { font-size: 35px; line-height: 37px; } }
@media only screen and (max-width: 900px) { .text-full h2 { font-size: 30px; line-height: 33px; } }
@media only screen and (max-width: 600px) { .text-full h2 { font-size: 26px; line-height: 30px; } }
@media only screen and (max-width: 450px) { .text-full h2 { font-size: 22px; line-height: 25px; } }
@media only screen and (max-width: 350px) { .text-full h2 { font-size: 20px; line-height: 24px; } }
.text-full h3 { font-size: 28px; font-family: "Nunito Sans", sans-serif; font-weight: 800; color: #72B9FF; text-transform: uppercase; line-height: 34px; }
@media only screen and (max-width: 600px) { .text-full h3 { font-size: 22px; line-height: 26px; } }
@media only screen and (max-width: 400px) { .text-full h3 { font-size: 20px; line-height: 24px; } }
.text-full p { font-size: 16px; font-family: "Roboto", sans-serif; line-height: 26px; color: #fff; }
@media only screen and (max-width: 500px) { .text-full p { font-size: 14px; line-height: 24px; } }
.text-full ul li { font-size: 16px; font-family: "Roboto", sans-serif; line-height: 26px; color: #fff; }
@media only screen and (max-width: 500px) { .text-full ul li { font-size: 14px; line-height: 24px; } }

.light-blue-back { width: 100%; padding: 4% 0; background: #1A2649; color: #fff; }

.special { width: 100%; }
.special h2 { font-size: 45px; font-family: "Nunito Sans", sans-serif; font-weight: 800; color: #fff; text-transform: uppercase; line-height: 50px; padding-bottom: 20px; }
@media only screen and (max-width: 1200px) { .special h2 { font-size: 35px; line-height: 37px; } }
@media only screen and (max-width: 900px) { .special h2 { font-size: 30px; line-height: 33px; } }
@media only screen and (max-width: 600px) { .special h2 { font-size: 26px; line-height: 30px; } }
@media only screen and (max-width: 450px) { .special h2 { font-size: 22px; line-height: 25px; } }
@media only screen and (max-width: 350px) { .special h2 { font-size: 20px; line-height: 24px; } }
.special .list-row { display: flex; flex-direction: row; justify-content: flex-start; }
.special .list-row ul { padding-right: 8%; padding-left: 2%; }
.special .list-row ul li { line-height: 30px; font-size: 18px; }

.flex-2 { display: flex; flex-direction: row; justify-content: flex-start; }
.flex-2 .text { width: 65%; padding-right: 20px; }
.flex-2 .text h2 { font-size: 45px; font-family: "Nunito Sans", sans-serif; font-weight: 800; color: #fff; text-transform: uppercase; line-height: 50px; padding-bottom: 20px; }
@media only screen and (max-width: 1200px) { .flex-2 .text h2 { font-size: 35px; line-height: 37px; } }
@media only screen and (max-width: 900px) { .flex-2 .text h2 { font-size: 30px; line-height: 33px; } }
@media only screen and (max-width: 600px) { .flex-2 .text h2 { font-size: 26px; line-height: 30px; } }
@media only screen and (max-width: 450px) { .flex-2 .text h2 { font-size: 22px; line-height: 25px; } }
@media only screen and (max-width: 350px) { .flex-2 .text h2 { font-size: 20px; line-height: 24px; } }
.flex-2 .text p { font-size: 16px; font-family: "Roboto", sans-serif; line-height: 26px; color: #fff; }
@media only screen and (max-width: 500px) { .flex-2 .text p { font-size: 14px; line-height: 24px; } }
.flex-2 img { width: 35%; padding: 10px; object-fit: cover; }

.flex-3 { display: flex; flex-direction: row; justify-content: flex-start; }
.flex-3 .special { width: 40%; }
.flex-3 img { width: 30%; padding: 10px; max-height: 380px; object-fit: cover; }

.inv-links { display: flex; flex-direction: row; justify-content: flex-start; flex-wrap: wrap; }
.inv-links a { width: calc(50% - 20px); margin: 10px; overflow: hidden; }
.inv-links a img { width: 100%; height: 400px; object-fit: cover; transition: .3s ease; overflow: hidden; }
.inv-links a h3 { font-size: 28px; font-family: "Nunito Sans", sans-serif; font-weight: 800; color: #72B9FF; text-transform: uppercase; line-height: 34px; text-align: center; font-size: 20px; }
@media only screen and (max-width: 600px) { .inv-links a h3 { font-size: 22px; line-height: 26px; } }
@media only screen and (max-width: 400px) { .inv-links a h3 { font-size: 20px; line-height: 24px; } }
.inv-links a:hover img { filter: brightness(0.5); }

.cont { width: 100%; text-align: center; }
.cont h2 { font-size: 30px; font-family: "Nunito Sans", sans-serif; color: #fff; line-height: 36px; max-width: 1000px; margin: 0 auto; }
.cont hr { height: 5px; width: 200px; border: none; color: #5FA8EF; background: #5FA8EF; margin: 20px auto; }
.cont p { font-size: 28px; font-family: "Nunito Sans", sans-serif; font-weight: 800; color: #72B9FF; text-transform: uppercase; line-height: 34px; }
@media only screen and (max-width: 600px) { .cont p { font-size: 22px; line-height: 26px; } }
@media only screen and (max-width: 400px) { .cont p { font-size: 20px; line-height: 24px; } }
.cont a { margin: 10px auto; }

.cards { width: 100%; display: flex; flex-direction: row; justify-content: flex-start; }

.card { max-width: 350px; width: 100%; padding: 30px; margin: 20px; background: #fff; border-radius: 15px; }
.card img { width: 100%; height: 230px; object-fit: cover; }
.card h3 { font-size: 20px; font-weight: 800; padding: 15px 0; color: #000; }
.card ul li, .card p { font-size: 14px; font-family: "Roboto", sans-serif; line-height: 24px; color: #000; }

.flex-form h2 { font-size: 30px; color: #fff; font-family: "Nunito Sans", sans-serif; padding: 20px 0; text-transform: uppercase; }
.flex-form p { font-size: 16px; font-family: "Roboto", sans-serif; line-height: 26px; color: #fff; }
@media only screen and (max-width: 500px) { .flex-form p { font-size: 14px; line-height: 24px; } }

.finance { padding: 6% 0; }
.finance h1 { font-size: 45px; font-family: "Nunito Sans", sans-serif; font-weight: 800; color: #fff; text-transform: uppercase; line-height: 50px; color: #000; }
@media only screen and (max-width: 1200px) { .finance h1 { font-size: 35px; line-height: 37px; } }
@media only screen and (max-width: 900px) { .finance h1 { font-size: 30px; line-height: 33px; } }
@media only screen and (max-width: 600px) { .finance h1 { font-size: 26px; line-height: 30px; } }
@media only screen and (max-width: 450px) { .finance h1 { font-size: 22px; line-height: 25px; } }
@media only screen and (max-width: 350px) { .finance h1 { font-size: 20px; line-height: 24px; } }
.finance hr { height: 5px; width: 100%; border: none; background: #2B66A0; }
.finance p { font-size: 16px; font-family: "Roboto", sans-serif; line-height: 26px; color: #000; padding: 20px 0; }
@media only screen and (max-width: 500px) { .finance p { font-size: 14px; line-height: 24px; } }

/*--------Services---------*/
.services { width: 100%; }
.services h2 { font-size: 45px; font-family: "Nunito Sans", sans-serif; font-weight: 800; color: #fff; text-transform: uppercase; line-height: 50px; padding: 20px 0; text-align: center; }
@media only screen and (max-width: 1200px) { .services h2 { font-size: 35px; line-height: 37px; } }
@media only screen and (max-width: 900px) { .services h2 { font-size: 30px; line-height: 33px; } }
@media only screen and (max-width: 600px) { .services h2 { font-size: 26px; line-height: 30px; } }
@media only screen and (max-width: 450px) { .services h2 { font-size: 22px; line-height: 25px; } }
@media only screen and (max-width: 350px) { .services h2 { font-size: 20px; line-height: 24px; } }

.service-row { width: 100%; display: flex; flex-direction: row; justify-content: flex-start; gap: 20px; flex-wrap: wrap; }

.serv-card { width: calc(33.33% - 22px); border: solid 1px #fff; background: transparent; padding: 40px; }
.serv-card img { width: 180px; border-radius: 50%; margin: 0 auto; display: block; height: 180px; object-fit: cover; }
.serv-card h3 { font-size: 25px; color: #fff; font-weight: 800; padding: 20px 0; text-align: center; }
.serv-card p { font-size: 16px; font-family: "Roboto", sans-serif; line-height: 26px; color: #fff; text-align: center; }
@media only screen and (max-width: 500px) { .serv-card p { font-size: 14px; line-height: 24px; } }

/*-------Finance------*/
.fin-row { display: flex; flex-direction: row; justify-content: flex-start; gap: 20px; flex-wrap: wrap; }

.fin { width: calc(25% - 20px); border: solid 1px #fff; background: transparent; padding: 40px; }
.fin img { width: 180px; margin: 0 auto; display: block; height: 180px; object-fit: contain; }
.fin h3 { font-size: 25px; color: #fff; font-weight: 800; padding: 20px 0; text-align: center; }
.fin p.name { font-size: 18px; font-weight: 600; padding-top: 15px; text-align: center; }
.fin p.other { font-size: 16px; font-family: "Roboto", sans-serif; line-height: 26px; color: #fff; text-align: center; }
@media only screen and (max-width: 500px) { .fin p.other { font-size: 14px; line-height: 24px; } }
.fin a.link { color: #fff; display: block; margin: 5px auto; text-align: center; }
.fin a.link:hover { text-decoration: underline; }

.texas { width: 100%; }
.texas h1 { font-size: 45px; font-family: "Nunito Sans", sans-serif; font-weight: 800; color: #fff; text-transform: uppercase; line-height: 50px; padding-bottom: 20px; }
@media only screen and (max-width: 1200px) { .texas h1 { font-size: 35px; line-height: 37px; } }
@media only screen and (max-width: 900px) { .texas h1 { font-size: 30px; line-height: 33px; } }
@media only screen and (max-width: 600px) { .texas h1 { font-size: 26px; line-height: 30px; } }
@media only screen and (max-width: 450px) { .texas h1 { font-size: 22px; line-height: 25px; } }
@media only screen and (max-width: 350px) { .texas h1 { font-size: 20px; line-height: 24px; } }

.texas-row { display: flex; flex-direction: row; justify-content: flex-start; gap: 20px; flex-wrap: wrap; padding: 2% 0; }

.texas-loc { width: calc(25% - 12px); background: #fff; padding: 30px; }
.texas-loc img { width: 100%; height: 160px; object-fit: cover; }
.texas-loc h2 { padding: 20px 0; font-size: 22px; font-weight: 600; color: #000; }
.texas-loc a { width: 100%; padding: 15px; background: #2B66A0; color: #fff; text-align: center; display: block; }

/*-------Locations--------*/
.contact-page-back { padding: 1% 0; background: #2B66A0; }

.loc-head { width: 100%; padding: 3%; }
.loc-head h1 { font-size: 45px; font-family: "Nunito Sans", sans-serif; font-weight: 800; color: #fff; text-transform: uppercase; line-height: 50px; }
@media only screen and (max-width: 1200px) { .loc-head h1 { font-size: 35px; line-height: 37px; } }
@media only screen and (max-width: 900px) { .loc-head h1 { font-size: 30px; line-height: 33px; } }
@media only screen and (max-width: 600px) { .loc-head h1 { font-size: 26px; line-height: 30px; } }
@media only screen and (max-width: 450px) { .loc-head h1 { font-size: 22px; line-height: 25px; } }
@media only screen and (max-width: 350px) { .loc-head h1 { font-size: 20px; line-height: 24px; } }
.loc-head h1 span { white-space: nowrap; }

.btn-row { display: flex; flex-direction: row; justify-content: flex-start; padding-top: 20px; }
.btn-row a { margin: 3px; }

.contact-row { display: flex; flex-direction: row; justify-content: flex-start; width: 100%; }

.contact-left { width: 33.33%; }

.cont-info { width: 100%; padding: 12% 8%; display: flex; flex-direction: row; justify-content: space-between; }
.cont-info a { font-size: 18px; color: #000; line-height: 24px; }
.cont-info a i { color: #10172B !important; font-size: 20px; padding-right: 10px; }
.cont-info a:hover { color: #2B66A0; }

.cont-hours { width: 100%; padding: 8%; background: #f0f0f0; }
.cont-hours h2 { font-size: 20px; font-weight: 800; padding-bottom: 20px; }
.cont-hours table tr td { font-size: 16px; padding: 10px 0; }

.contact-right { width: 66.66%; display: flex; }
.contact-right img { width: 100%; height: 100%; object-fit: cover; }

.contact-map { width: 100%; }

.contact-left-btm { width: 50%; }
.contact-left-btm img { width: 100%; }

.contact-right-btm { width: 50%; }

/*--------FORM STYLES--------------------*/
#formpage h3 { color: #fff; padding: 15px 0 10px 0; font-size: 20px; }

#formpage { width: 100%; vertical-align: top; display: inline-block; text-align: left; }
#formpage label { margin: 5px; padding: 10px 0 5px 0; color: #fff; }
#formpage input, #formpage select { padding: 14px; border: #ccc; color: #444 !important; font-size: 14px; background: #F8F8F8; border-radius: 5px; }
#formpage input[type="text"], #formpage input[type="email"], #formpage input[type="date"], #formpage select, #formpage input[type="phone"] { width: 100%; box-sizing: border-box; }
#formpage textarea { font-family: 'Arial', sans-serif; border: #ccc; box-sizing: border-box; color: #000; background: #fff; width: 100%; height: 100px; border-radius: 2px; padding: 14px; color: #444 !important; font-size: 14px; background: #F8F8F8; border-radius: 5px; }
#formpage textarea:focus { border: 1px solid #ccc; border-radius: 2px; }
#formpage input:placeholder, #formpage select:placeholder, #formpage textarea:placeholder { color: #222; }

.flex-form { width: 100%; text-align: left; margin: 0 auto; flex-direction: row; justify-content: flex-start; align-items: flex-start; font-size: 15px; }

.flex-row { display: flex; flex-direction: row; justify-content: flex-start; width: 100%; }

.form-whole { width: calc(100% - 10px); display: block; vertical-align: middle; margin: 5px; }

.form-half { width: calc(50% - 10px); display: inline-block; vertical-align: middle; margin: 2px 5px; }

.form-third { width: calc(33.33% - 10px); display: inline-block; vertical-align: middle; margin: 2px 5px; }

#formpage .submit-button, #submit-btn button { width: 200px; padding: 14px; background: #2B66A0; border: solid 1px #2B66A0; display: block; box-sizing: border-box; border-radius: 5px; text-align: center; color: #fff; font-weight: 500; font-size: 14px; text-transform: uppercase; }

#formpage input.submit-button:hover, #submit-btn button:hover { transition: ease-out .3s; cursor: pointer; background: transparent; color: #fff; }

.submit-button, #submit-btn { padding: 10px 0px 10px 0px; position: relative; width: 100%; text-align: center; }

.captcha-button { width: 200px; }

#formpage input.submit-button { color: #fff !important; }

.include-captcha { display: none; }

.CaptchaPanel { text-align: left !important; }

.CaptchaMessagePanel, .CaptchaWhatsThisPanel a { color: #fff !important; }

/*-------- FOOTER STYLES ----------------*/
footer { width: 100%; background-color: #000 !important; background: url("/siteart/foot-back.jpg") center center no-repeat; background-size: cover; }

.foot-top { display: flex; flex-direction: row; justify-content: space-between; padding: 30px 0; }
.foot-top h2 { font-size: 45px; font-family: "Nunito Sans", sans-serif; font-weight: 900; color: #fff; text-transform: uppercase; letter-spacing: .85px; line-height: 50px; }
.foot-top h2 span { text-shadow: 2px 2px 0 white, -2px 2px 0 white, 2px -2px 0 white, -2px -2px 0 white; color: #10172B; }
@media only screen and (max-width: 1200px) { .foot-top h2 { font-size: 35px; line-height: 37px; } }
@media only screen and (max-width: 900px) { .foot-top h2 { font-size: 30px; line-height: 33px; } }
@media only screen and (max-width: 600px) { .foot-top h2 { font-size: 26px; line-height: 30px; } }
@media only screen and (max-width: 450px) { .foot-top h2 { font-size: 22px; line-height: 25px; } }

.footer-top-right { display: flex; flex-direction: row; justify-content: flex-end; margin-top: 40px; }
.footer-top-right a { width: 50px; transition: .3s ease; height: 50px; border-radius: 50%; border: solid 1px #fff; margin: 3px; color: #fff; display: flex; flex-wrap: wrap; justify-content: center; align-content: center; }
.footer-top-right a i { color: #fff; font-size: 15px; }
.footer-top-right a:hover { background: #2B66A0; }

.foot-locs { width: 100%; display: flex; flex-direction: row; justify-content: flex-start; flex-wrap: wrap; padding: 5% 0; }

.foot-loc { width: 50%; max-width: 600px; padding: 20px 100px 20px 0; color: #fff; display: flex; flex-direction: row; justify-content: space-between; }
.foot-loc .bold { font-size: 30px; transition: .3s ease; line-height: 26px; font-weight: 600; color: #fff; text-transform: uppercase; }
.foot-loc .bold span { font-size: 17px; font-weight: 200; }
.foot-loc .bold:hover { color: #59A7F4; }
.foot-loc .num { font-size: 28px; transition: .3s ease; font-weight: 200; color: #fff; padding-left: 20px; }
.foot-loc .num:hover { font-weight: 400; }

.foot-bottom { width: 100%; background: #10172B; border-top: solid 1px #fff; padding: 40px 10px; }
.foot-bottom img { width: 100%; max-width: 100px; }
.foot-bottom .row { display: flex; flex-direction: row; justify-content: space-between; }

.foot-left { display: flex; flex-direction: row; justify-content: flex-start; }
.foot-left a { padding: 10px 40px; transition: .3s ease; height: 35px; display: block; color: #fff; font-size: 15px; text-transform: uppercase; border-right: solid 1px #fff; }
.foot-left a:last-of-type { border-right: none; }
.foot-left a:hover { color: #59A7F4; }

/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/
.ts-disclaimer { color: #fff !important; }

.body-wrapper > div:not(.detail-wrapper) .list-main-section .list-container .list-listing .listing-top-right .buy-now-link, .body-wrapper > div:not(.detail-wrapper) .list-main-section .list-container .list-listing .listing-top-right .check-availability-link, .body-wrapper > div:not(.detail-wrapper) .list-main-section .list-container .list-listing .listing-top-right .email-seller-link, .body-wrapper > div:not(.detail-wrapper) .faceted-section-box .show-all-modal .show-all-modal-content-container .show-all-modal-content .title-close-row .apply-button, .body-wrapper > div:not(.detail-wrapper) .show-all-modal .show-all-modal-content-container .show-all-modal-content .title-close-row .apply-button, .body-wrapper > div:not(.detail-wrapper) button.page-nav { background: #2B66A0 !important; color: #fff !important; }

.body-wrapper > div:not(.detail-wrapper) .view-listing-details-link, .body-wrapper > div:not(.detail-wrapper) .contact-options a, .body-wrapper > div:not(.detail-wrapper) .fin-calc-mobile > a, .body-wrapper > div:not(.detail-wrapper) button.g-recaptcha.button, .body-wrapper > div:not(.detail-wrapper) .show-all-modal .apply-button, .body-wrapper > div:not(.detail-wrapper) .show-all-modal .nuf-button, .body-wrapper > div:not(.detail-wrapper) .list-error-container .info button, .body-wrapper > div:not(.detail-wrapper) .mobile-done-button-container .mobile-done-button, .body-wrapper > div:not(.detail-wrapper) a.buy-btn.gtm-buynow.des-buy-now, .body-wrapper > div:not(.detail-wrapper) a.buy-btn.des-buy-now, .body-wrapper > div:not(.detail-wrapper) button.selected-facet.ts-button, .body-wrapper > div:not(.detail-wrapper) .detail-contact-bar .contact-bar-btn { background: #2B66A0 !important; color: #fff !important; }

.body-wrapper > div:not(.detail-wrapper) .view-listing-details-link:hover, .body-wrapper > div:not(.detail-wrapper) .contact-options a:hover, .body-wrapper > div:not(.detail-wrapper) .fin-calc-mobile > a:hover, .body-wrapper > div:not(.detail-wrapper) button.g-recaptcha.button:hover, .body-wrapper > div:not(.detail-wrapper) .email-seller-link:hover, .body-wrapper > div:not(.detail-wrapper) .mc-nav-controls .mc-icon-navarrow span, .body-wrapper > div:not(.detail-wrapper) a.buy-btn.gtm-buynow.des-buy-now:hover, .body-wrapper > div:not(.detail-wrapper) a.buy-btn.des-buy-now:hover, .body-wrapper > div:not(.detail-wrapper) .detail-contact-bar .contact-bar-btn:hover { background: #10172B !important; color: #fff !important; }

.list-top-section .list-title .list-title-text { color: #fff !important; }

/*---------- RESPONSIVE STYLES ----------*/
@media only screen and (max-width: 1400px) { .hero-text h1 { font-size: 50px; line-height: 54px; }
  .hero { height: 700px; }
  .hero-text { right: 2%; } }
@media only screen and (max-width: 1200px) { .links-row a { width: 33%; }
  .contact-row { flex-direction: column; }
  .contact-left { width: 100%; }
  .cont-info { padding: 6% 8%; }
  .contact-right { width: 100%; flex-direction: column; }
  .contact-map { width: 100%; }
  .contact-map iframe { height: 300px; }
  .contact-img { width: 100%; height: 300px; }
  .fin { width: calc(33.33% - 20px); }
  .flex-2 { flex-direction: column; }
  .flex-2 .text { width: 100%; padding-bottom: 20px; }
  .flex-2 img { max-width: 300px; width: 100%; } }
@media only screen and (max-width: 1100px) { .hero-text h1 { font-size: 40px; line-height: 44px; }
  .hero { height: 500px; }
  .feat { padding: 8% 0 2% 0; }
  .serv-wrap { flex-direction: column; }
  .serv-left { width: 100%; padding-bottom: 20px; }
  .serv-left img { display: none; }
  .serv-right { width: 100%; }
  .foot-col { padding: 20px 50px 20px 0; }
  .foot-bottom img { display: none; }
  .serv-card { width: calc(50% - 22px); }
  .flex-3 { flex-wrap: wrap; }
  .flex-3 .special { width: 100%; }
  .flex-3 img { width: 50%; }
  .cards { flex-wrap: wrap; }
  .texas-loc { width: calc(33.33% - 15px); }
  .inv-links a img { height: 300px; } }
@media only screen and (max-width: 1000px) { .foot-loc .bold { font-size: 25px; line-height: 24px; }
  .foot-loc .bold span { font-size: 15px; }
  .foot-loc .num { font-size: 22px; }
  .foot-left { flex-wrap: wrap; justify-content: center; }
  .foot-left a { border: None; }
  .special .list-row { flex-direction: column; } }
@media only screen and (max-width: 900px) { .hero-text h1 { font-size: 30px; line-height: 33px; }
  .hero { height: 400px; }
  .feat { flex-direction: column; }
  .feat-left { width: 100%; padding: 15px 0; }
  .feat-right { width: 100%; padding: 20px; }
  .foot-loc { width: 100%; }
  .texas-loc { width: calc(50% - 15px); } }
@media only screen and (max-width: 800px) { .links-logo img { max-width: 220px; padding-bottom: 20px; }
  .fin { width: calc(50% - 20px); }
  .serv-card { width: 100%; } }
@media only screen and (max-width: 700px) { .hero-text h1 { font-size: 26px; line-height: 30px; }
  .hero { height: 350px; }
  .links-row { flex-wrap: wrap; justify-content: center; }
  .links-row a { width: 50%; padding: 20px; }
  .ql-text { flex-direction: column; }
  .ql-text-right { padding-top: 20px; }
  .flex-row { flex-direction: column; }
  .form-half { width: calc(100% - 10px); } }
@media only screen and (max-width: 600px) { .links-row a { width: 100%; }
  .foot-left { flex-direction: column; }
  .foot-loc { padding: 20px; }
  .hero img { filter: brightness(0.6); }
  .hero { height: 300px; }
  .flex-form h2 { font-size: 25px; }
  .fin { width: calc(100% - 20px); }
  .flex-3 img { width: 100%; }
  .texas-loc { width: 100%; }
  .texas iframe { height: 260px; }
  .inv-links a { width: 100%; } }
@media only screen and (max-width: 550px) { .hero { height: 260px; }
  .hero-text { bottom: -100px; }
  .hero-text h1 { font-size: 22px; line-height: 25px; }
  .brands { margin-top: 90px; } }
@media only screen and (max-width: 500px) { .serv-right .link-text { padding: 20px; }
  .serv-right .link-text h3 { font-size: 22px; }
  .serv-right a { margin: 10px 0; width: 100%; }
  .btn-row { flex-direction: column; }
  .serv-card h3 { font-size: 22px; }
  .special .list-row ul li { font-size: 16px; }
  .cont h2 { font-size: 22px; } }
@media only screen and (max-width: 450px) { .foot-loc { flex-direction: column; }
  .foot-loc .num { padding: 0; }
  .foot-top { flex-direction: column; }
  .footer-top-right { justify-content: flex-start; margin-top: 20px; }
  .cont-info { flex-direction: column; justify-content: flex-start; }
  .cont-info a { padding: 10px; }
  .serv-card { padding: 20px; }
  .hero-text h1 { font-size: 20px; line-height: 24px; }
  .inv-links a img { height: 220px; } }
@media only screen and (max-width: 380px) { .card img { height: 140px; } }