/*****************************************
                     Global Styles
*****************************************/

html, .footer-wrap {background:#000;}
body {}
body{ font-family:"Open Sans", helvetica, arial, sans-serif; background:transparent; color:#000;}

.ar_pgtitle {text-align:left; font-size:1.3em; margin:0;} 
.ar_pgdesc {text-align:left; font-size:1.1em; padding: 0 0 10px; font-weight:normal; margin:0;} 

.footer-links .ar {display:inline-block; color:#ccc; font-weight:normal; font-size:1em; text-decoration:none; margin:0; padding:.5em;}
.footer-links .ar:hover {color:#fff; background-color:#000;}

.ar-bold {font-weight:bold;}
.ar-italic {font-style:italic}
.ar-underline {text-decoration:underline;}
.ar-uppercase {text-transform:uppercase;}

.ar-border-solid {border: 0; height: 1px; background: #1a1a1a; background-image: linear-gradient(to right, #ccc, #1a1a1a, #ccc); margin:1em 0;}
.ar-border-solid-fade {border: 0; height: 1px; background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0)); margin:1em 0;}
.ar-border-double {border: 0; border-top: 3px double #1a1a1a; margin:1em 0;}
.ar-border-dashed {border: 0; border-top: 1px dashed #1a1a1a; margin:1em 0;}
.ar-border-dot {border: 0; border-top: 1px dotted #1a1a1a; margin:1em 0;}

.swiper-container {position:relative; width:100%; height:100%; margin-left: auto; margin-right: auto; overflow:hidden;}
.swiper-wrap{position:relative; width: 100%; height:auto;}
.swiper-slide {text-align: center; font-size: 18px; background: #000; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center;  justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center;}

.swiper-slide img{width: 100%; height: auto; max-width: 100%; max-height: 100%;}
.swiper-button-next:hover, .swiper-button-prev:hover{background-color:#053269;}
.swiper-pagination{right:0; left:0; bottom:.5em !important; text-align:center;}
.swiper-pagination .swiper-pagination-bullet {margin: 0 5px;}


/*****************************************
                     Container Styles++
*****************************************/

.header-wrap, .nav-wrap, .content-wrap, .footer-wrap{width:100%; display:block; clear:both; position:relative; padding:1em 0;}
.container {max-width:1250px; margin:0 auto; position:relative;}
.container:after{content: ""; display: block; height: 0; clear: both;}

.header-wrap{z-index: 9999; background:#000; padding:1.5em 0;}
.header-wrap .container{text-align:center;}

.header-logo {position:absolute; left: 12px; width: auto; top: -15px; max-width: 215px; z-index:999;}
.header-info {text-align:right;}
.header-info p {display: inline-block; font-size: 1.5em; font-weight: 600; margin: 0 0 0 1.4em; font-style: italic;}

.nav-wrap{background:#184475; padding:0; z-index:999; box-shadow:0 12px 25px -6px #051222; border-top: 1px solid #000000;
background: rgb(66,66,66);
background: -moz-linear-gradient(top,  rgba(66,66,66,1) 0%, rgba(14,14,14,1) 100%);
background: -webkit-linear-gradient(top,  rgba(66,66,66,1) 0%,rgba(14,14,14,1) 100%);
background: linear-gradient(to bottom,  rgba(66,66,66,1) 0%,rgba(14,14,14,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#424242', endColorstr='#0e0e0e',GradientType=0 );
}
.nav-wrap .container{}

.arBorder-diamond {position:relative; display:block; height:10px; width:100%; background:url('https://www.texasfrontlinetrucks.com/assets/images/bg-diamond-plate-seamless.png') center left; z-index: 9999; border-top: 1px solid #000; border-bottom: 1px solid #ccc;
-webkit-box-shadow: inset 0px -5px 13px -4px rgba(0,0,0,0.75); -moz-box-shadow: inset 0px -5px 13px -4px rgba(0,0,0,0.75); box-shadow: inset 0px -5px 13px -4px rgba(0,0,0,0.75);
}

.content-wrap{padding:0 0 30px; background:transparent;}
.content-wrap .container{background: #000; min-height: 450px; text-align: left; border-right: 1px solid #939393; border-left: 1px solid #939393; box-shadow: 0 0 100px 15px #000; padding: 2em 2em 0; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; overflow: hidden; border-bottom: 1px solid #939393;}

.footer-wrap{background:#000; z-index:999; border-top:3px solid #d42023;}
.footer-wrap .container{}


/*****************************************
                  Resp. Navigation Styles
*****************************************/

#menu {list-style-type:none; margin:0; padding:0; position:relative; text-align:right;}
#menu .hidden {list-style-type:none; margin:0; padding:0; position: absolute;}
#menu li {display:inline-block; float: none; position:relative;}

#menu li a {display:block; font-size:14px; text-align: left; color: #fff; text-decoration: none; padding:1em; text-transform:uppercase; font-weight:700;}
#menu li ul {display: none; top: 100%; z-index: 99999; }
#menu li ul li {display: block; float: none; border-bottom: 1px solid #ccc;}
#menu li ul li a {width: auto; min-width: 220px; padding:1em; background: #f1f1f1; color: #333;}
#menu li:hover .hidden, .hidden:hover {display: block; border: 1px solid #ccc;}
#menu li:hover ul a:hover {background: #f00; color: #fff;}

#menu li a:hover {background: #f00;}
#menu li > a.active-head {background: #f00;}
#menu li > a.active-head li a {background:#f3f3f3;}

.nav-wrap .show-menu {text-decoration: none;	color: #fff; background: #184475; text-align: center; padding: 1em; display: none; border-bottom:1px solid #ccc; cursor:pointer;
background: rgb(66,66,66);
background: -moz-linear-gradient(top,  rgba(66,66,66,1) 0%, rgba(14,14,14,1) 100%);
background: -webkit-linear-gradient(top,  rgba(66,66,66,1) 0%,rgba(14,14,14,1) 100%);
background: linear-gradient(to bottom,  rgba(66,66,66,1) 0%,rgba(14,14,14,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#424242', endColorstr='#0e0e0e',GradientType=0 );
}
.nav-wrap .show-menu span {float:left; color:#fff;}
.nav-wrap input[type=checkbox]{display: none; top: 100%; z-index: 99999;}
.nav-wrap input[type=checkbox]:checked ~ #menu{display: block;border-bottom: 1px solid #ccc;}

#menu li.has-dropdown > a:after {font-size:.5em; display: inline-block; height: 100%; vertical-align: middle; margin-left:2em; color: #fff; content: ' \25bc'; float:right; line-height:3em;}



/*****************************************
               Template Specific Styles
*****************************************/

.header-wrap .ar4 p {font-size: 2em; font-weight: 900; color: #0f253f; line-height: 1.1em; display: inline-block; margin: 43px auto 0;}
.header-wrap .ar4  p span {font-style:italic;}

.content-wrap .container .fp-options-container {padding:0 2em !important; z-index: 9999; position: relative;}
.fp-options-container .ar4 .box {margin: 0 auto 0;}

.hero img {width:100%;}
.hero {margin:0; padding:0 !important;}
.herow {padding:0em !important; border-bottom:3px solid #d42027;}

.desk-info {}
.resp-info {display:none;}

.store-hours-container:before, .store-hours-container:after {clear:both; content:""; display:table;}

form h3 {color:#fff !important; background:#184475;}
.arform_button {border:1px solid #184475; background:#f00 !important;}
.invtablein {color:#fff !important;}

.box h2 {color:#184475; margin:0 auto; padding-top:.5em; font-weight:900; text-transform:uppercase;}
.box p {margin-top:0; color:#184475;}
.box {border:1px solid #999999; text-align:center;}
.box img {margin:0 auto; width:25%;}

.box {text-align: center; padding: 1.5em 2em; box-shadow: 0 12px 25px -6px rgba(5, 18, 34, 0.21); border-radius: 10px; border: 2px solid #242424;display:block; text-decoration:none;
box-shadow: inset 0px 0px 176px 0px rgba(0,0,0,1);
background: #ffffff;
background: rgb(255,255,255);
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(246,246,246,1) 47%,rgba(237,237,237,1) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(246,246,246,1) 47%,rgba(237,237,237,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 );
}

.box span {display:block;}


.box p {margin: 0 0 5px; color: #fff; font-weight: 400; font-size: 1.2em; text-shadow: 0 0 15px #000, 0 0 10px #000, 0 4px 5px #000;}
.box h2 {margin: 0 auto; font-size: 2.5em; color: #fff; text-transform: uppercase; font-weight: 900; line-height: 1em; padding: 0; text-shadow: 0 0 15px #000, 0 0 10px #000, 0 4px 5px #000;}
.box .button {border: 1px solid #730100; color: #fff; text-transform: uppercase; font-size: 14px; margin: 1em auto 0;
background: #960000;
    background: -moz-linear-gradient(top,rgba(150,0,0,1) 0,rgba(113,1,0,1) 100%);
    background: -webkit-linear-gradient(top,rgba(150,0,0,1) 0,rgba(113,1,0,1) 100%);
    background: linear-gradient(to bottom,rgba(150,0,0,1) 0,rgba(113,1,0,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#960000',endColorstr='#710100',GradientType=0);
}

.text-section {padding:2em;}

a.button {display:block; padding:.6em; text-decoration:none; margin:25px auto; border-radius:4px; color:#184475;}

.section-1 h1 {font-size:1.5em; color: #fff; margin:0 0 4px; text-transform:uppercase; font-weight:900; line-height:.8em;}
.section-1 h1 span {font-weight:400; font-size:.7em;}
.section-1 p {line-height:1.6em; color:#e9e9e9;}

.footer-links {text-align:center;}
.footer-links .ar {display:inline-block; color:#ccc; font-weight:normal; font-size:1em; text-decoration:none; margin:0; padding:.5em;}
.footer-links .ar:hover {color:#fff; background-color:#000;}
.footer-links h5 {margin:0; padding:0; text-align:center;}

.f-02 .footer{text-align:center;}
.f-02 .footer ul.footer-nav{list-style:none; margin:0; padding:0; }
.f-02 .footer ul.footer-nav li{margin:0; padding:0; list-style:none; width:auto; float:none; display:inline-block;}
.f-02 .footer ul.footer-nav li a {color:#f1f1f1; display:inline-block; text-decoration:none; font-size:1em; padding:1em;}
.f-02 .footer ul.footer-nav li a:hover {color:#d42023;}



.form-formatting .ar_form_sub {display: inline-block; width: 50%; vertical-align: top; padding: 0 1em;}
.form-formatting .ar_form_rads label {width: 100% !important; text-align:left;}
.form-formatting form .ar_form_sub div.ar_form_rads label {text-align:left;}


.header-wrap, .content-wrap .container {background:url(<cfif cgi.server_name is tsitesets.website>../assets/</cfif>images/bg-body.png) #000;}
.header-wrap {padding:0; }
.header-logo {position: absolute; left: 12px; width: auto;  top: 5px; max-width: 194px;}
.header-info {font-size:0;}
.header-info p.header-info-phone {font-size: 6rem; font-style: normal;
text-shadow: 0 0 1px #000, 0 0 1px #000, 0 0 1px #000, 0 0 10px #910000, 0 0 20px #910000, 0 0 15px #e90000;
}

.header-info p.header-info-address {font-size: 2.2rem; font-style: normal; text-align: center;padding-left: 15px; vertical-align: text-bottom; line-height: 2.2rem; margin:0 auto;
text-shadow: 0 0 1px #000, 0 0 1px #000, 0 0 1px #000, 0 0 10px #910000, 0 0 20px #910000, 0 0 15px #e90000; text-transform: uppercase;
}
.header-info p.header-info-address span {display:block; }

.nav-wrap {
background: rgb(66,66,66);
background: -moz-linear-gradient(top,  rgba(66,66,66,1) 0%, rgba(14,14,14,1) 100%);
background: -webkit-linear-gradient(top,  rgba(66,66,66,1) 0%,rgba(14,14,14,1) 100%);
background: linear-gradient(to bottom,  rgba(66,66,66,1) 0%,rgba(14,14,14,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#424242', endColorstr='#0e0e0e',GradientType=0 );
}

a.box { font-size:80%;box-shadow:inset 0 0 176px 0 rgba(0,0,0,1), 0 5px 9px #000, 0 4px 17px #000;}
.box h2 {font-weight:600;}

.content-wrap .container .fp-options-container {background: #222; padding:2em 2em 0 !important;}
.header-info {text-align:center;}
.header-info p.header-info-phone {margin:0 auto;}
.header-info p.header-info-address {position: absolute; right: 12px; top: 50%; transform: translateY(-50%);}

.box {display:block; text-decoration:none;}
.box span {display:block;}
.section-1 h1 {line-height:1em;}
.fp-image {display:inline-block; max-width:200px; margin:0 auto; padding:1em; vertical-align:middle;}

.footer {height:150px;}
.footer .ar3 {position:absolute; left:1em;}
.footer .ar12 {text-align:left;}
.footer-info {padding-left:190px; text-align:left;}
.footer a {max-width:150px; display:block;}
.footer-info p {display:inline-block; font-weight:bold; text-transform:uppercase; padding: 0 15px; margin:35px auto 0; font-size:2em; text-align: right;}
.footer-links h5 {margin: 0; padding: 0 15px; text-align: left; padding-left: 190px;}
.footer-links h5 a {width:auto; max-width:none;}








/* General page COLORS
*****************************************/

body {color:#e9e9e9;}

h1, h2, h3, h4, h5, h6, p {color:#fff; }

a {color:#fff;}
a:hover {color:#ccc;}

.ar_pgtitle,
.ar_pgdesc {color:#fff;}



/* Form COLORS 
*****************************************/

.forms-container {background: #fff; border: 1px solid #bbb;}

.forms-container .forms-heading {color:#1a1a1a;}
.forms-container .ar_form_sub h3 {color:#fff; background: #929292;}
.forms-container label {color:#1a1a1a;}

.forms-container input,
.forms-container select,
.forms-container textarea {color:#1a1a1a;}

.forms-container .arform_text_disclaimer {color:#1a1a1a;}
.forms-container .arform_thanks * {color:#1a1a1a;}

.forms-container .arform_button {color:#fff; background: #1a1a1a; border: 1px solid #bbb;}
.forms-container .arform_button:hover {background:#444;}


/* Contact panel COLORS 
*****************************************/

.store-contact-container {background:#fff; border: 1px solid #bbb;}
.store-contact-container * {color:#1a1a1a;}
.store-contact-name h3 {}
.store-contact-phone a {color:#18181;}
.store-contact-fax a {}
.store-contact-email a {}
.store-contact-address {}
.store-contact-map a {}

.store-contact-phone a:hover, 
.store-contact-fax a:hover,
.store-contact-email a:hover,
.store-contact-map a:hover {color: #444;}

.store-hours-container {background:#fff; border: 1px solid #bbb;}
.store-hours-container * {color:#1a1a1a;}
.store-hours-row h3 {}
.store-hours-col-left {}
.store-hours-col-right {}


/* Location panel COLORS 
*****************************************/

.locations-container .store-hours-container {background:#fff;}
.locations-info h2,
.locations-left h3,
.locations-info p,
.locations-container .store-hours-container * {color:#1a1a1a;}



/*****************************************
                      All Resp. Styles
*****************************************/

@media (max-width: 1270px) {
.content-wrap {padding:0;}
.content-wrap .container {border-bottom-left-radius: 0px; border-bottom-right-radius: 0px;}
.header-logo {max-width: 198px;}
}

@media (max-width:1240px) {
.footer-info p {margin:0 auto 0;}
.footer-info p:first-child {margin:15px auto 0;}
}

@media (max-width: 1044px){
.header-info p {font-size:1.2em;}
.header-info p.header-info-phone {font-size:4rem; line-height: 9rem;}
.header-info p.header-info-address {font-size: 1.5rem; line-height: 1.5rem;}
#menu li a {font-size:12px;}
}

@media (max-width:1114px) {
.box {font-size:80%}
}

@media (max-width : 945px){
#menu li a {font-size:11px;}
.ar_pgtitle {display:none;}
.ar_pgdesc {display:none;}
}

@media (max-width : 890px){
.nav-wrap .show-menu {display:block;}
#menu {position: static !important; display: none;}
#menu li {margin-bottom: 1px;}
#menu li, #menu li a {width: 100% !important;}
#menu li .hidden{display: none !important;}
#menu li.has-dropdown ul.active {display:block !important; background: #f3f3f3; position: relative;}
#menu li:hover .hidden, .hidden:hover {border:none;}
.header-logo {position:relative; max-width:none; width:100%; text-align:center; margin: 0; left: 0;}
.header-info {text-align:center; margin:0 auto;}
}

@media (max-width:890px) {
.form-formatting .ar_form_sub {width:100%;}
.header-logo {padding-top:1em; position:relative; max-width: 194px; margin: 0 auto; text-align: center; display: block; width: 100%; top: 0; float: none;}
.header-info p.header-info-phone {font-size:4rem; line-height:normal; margin:0 auto;}
.header-info p.header-info-address {font-size: 2rem; line-height:normal; margin:0 auto 12px;}
.header-info p.header-info-phone,
.header-info p.header-info-address,
.header-info p.header-info-address span {display:inline-block; vertical-align: bottom; transform: initial; top: 0; right: 0; position: relative;}
.footer-info p {font-size:1.5em;}
.footer-info p:first-child {margin:24px auto 0;}
.header-info p.header-info-address {right:9px;}
}

@media (max-width: 812px) {
.desk-info {display:none;}
.resp-info {display:block;}
.header-wrap .ar4 p {font-size:1.2em; margin:0 auto;}
.fp-options-container .ar4 {float:none; display:inline-block;}
.fp-options-container .ar4 .box {margin:0 auto;}
}

@media (max-width:620px) {
.footer {height:100%;}
.footer .ar3 {position:relative; left:0;}
.footer .ar12 {text-align:center;}
.footer-info {padding:0 1em; text-align:center;}
.footer a {max-width:150px; display:block; margin:0 auto;}
.footer-info p:first-child {margin:0 auto;}
.footer-info p {display:inline-block; font-weight:bold; text-transform:uppercase; padding: 0 15px; margin:0 auto; font-size:1.5em; text-align: center; margin:0 auto;}
.footer-links h5 {margin: 0; padding: 0 1em; text-align: center;}
.footer-links h5 a {width:auto; max-width:none;}
}

@media (max-width:584px){
.header-info p {margin:0 auto;}
}

@media (max-width:470px) {
.header-info p.header-info-phone {font-size:2rem;}
.header-info p.header-info-address {font-size: 1.5rem;}
}

@media (max-width:400px){
.content-wrap .container .fp-options-container,
.text-section, 
.box {padding:1em !important;}
.text-section {padding-bottom:3em !important;}
.content-wrap .container {padding:2em 1em;}
}


