/* CSS Document */
/*

1.	Pagination
1.1 Sidebar Nav
2.	Full Width Image
3.	Promotion Banners
4.	Promotions
5.  Accessories	
6.	Product Images
7.	Product Offers
8.	MOTOTRBO
9.	MOTOTRBO Apps
10.	SchoolSAFE/WAVE
11.	Rule Line
12. Hide Accessories
13. Motorola Copyright
14. Maps
15. Formating Anchor Links
16. Footer
17. Phone Systems
18. Home Responsive Header
19. Clickable Phone Number
20. Offset Name Anchor
21. General Sytles
*/


/* =========== pagination =================== */

.pagination {
    padding: 0px;
    margin-bottom: 20px;
	float:right;
}

/* =========== /pagination =============== */

/* =========== side bar nav =============== */

#side-bar .categories ul .sidenav-indent {
	margin-left: 28px;
}

.sn-indent {
	margin-left: 20px;
}
/* =========== /side bar nav =============== */

/* =========== full width image =============== */

.fullwidthimage {	
	margin: auto;
	width:100%;
	margin-bottom: 30px;
	
}

.fullwidthimage-bio{	
	margin: auto;
	width:100%;
	margin-bottom: 20px;
	text-align: center;
}

.page-body-img {
	float: right; 
	padding: 8px; 
	width: 300px; 
	height: auto;
}

@media only screen and (max-width:500px) {
.page-body-img {
	float: none;
	width: 100%;
}
}
/* =========== /full width image =============== */

/* =========== banners =============== */

.banner{
	text-align:center;	
	width:100%;
	background-color:#999;
	margin-top: 10px;
	margin-bottom: 10px;
}

.side-banner{
	text-align:center;	
	width:100%;
	background-color:#999;
}

/* =========== /banners =============== */

/* =========== promotions =============== */

.promo-text {
	padding: 0px 7px 0px 7px;
}	

.specials-header1 {
	font-size:35px;
    font-weight:bold;
	margin-top: 30px;
    margin-bottom: 20px;
    padding-left: 5px;
    color: #EE2C3C;
}
 
.specials-header2 {
    font-size:19px;
    font-weight:bold;
    margin-bottom: 20px;
    padding-left: 5px;
}
	
.banner{
	text-align:center;	
	width:100%;
	background-color:#00a9da;
	margin-top: 15px;
}	
.quote {
	font-family: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size:36px;
	color: #B1B1B1;}

.offer{
	text-align:center;	
	margin: auto;
	width:98%;
	background-color:#A6A4A4;
	margin-bottom: 20px;
}

.details
{
	background-color:#C1C1C1;
	text-align:center;	
	margin: auto;
	width:98%;
	margin-bottom: 20px;
}
.details2
{
	background-color:#C1C1C1;
	text-align:center;	
	margin: auto;
	width:98%;
	margin-bottom: 20px;
}	

.promo-header {
	margin-top: 20px;
	font-size:19px;
	font-weight:500;
	}
	
.promo-btn{
text-align:center;
}

.promo-btn a{
	display: inline-block;
	background: #cc2727;
	position: relative;
	font-family: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size: 30px;
	line-height: 40px;
	font-weight: bold;
	padding: 20px 40px 20px 40px;
	margin-top: 16px;
	color: #fff !important;
	border: 1px solid #cc2727;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-ms-transition: 0.5s;
	-o-transition: 0.5s;
	transition: 0.5s;
}
.promo-btn a:hover{
	text-decoration: none;
	background: #2b3785;
	color: #fff !important;
	border: 1px solid #2b3785;
}

#tradeintable{
	width:100%;
	background:#cccccc;
	margin:20px 0 10px 0;   
}
 
#tradeintable .tbltext{
	color:#000;
	font-size:12px;
	font-weight:bold;
	padding: 10px 5px 10px 5px;
}
 
               
#tradeintable .tblheader{
	background:#000000;
	color:#fff;
	text-transform:uppercase;
	font-size:30px;
	font-weight:bold;
	padding-top:20px;
	padding-bottom:20px;
	padding-left:5px;
	text-indent: 10px;
}
               
 
#tradeintable .offer-header {
	width:75%;
	color:#000;
	font-size:20px;
	font-weight:bold;
	text-transform:uppercase;
	padding: 10px 5px 10px 0;
               
}
 
#tradeintable .models-header {
	width:25%;
	color:#000;
	font-size:20px;
	font-weight:bold;
	text-transform:uppercase;
	padding: 10px 5px 10px 0;
               
}
                                                                                                                                               
#tradeintable .savings-header {
	width:25%;
	color:#000;
	font-size:20px;
	font-weight:bold;
	text-transform:uppercase;
	padding: 10px 5px 10px 0;
               
}
#tradeintable .offer-header{
	padding-left:5px;
}
#tradeintable .models, #tradeintable .savings{
	color:#000;
	font-size:16px;
	font-weight:bold;
	padding-top:10px;
}
 
 
 
#tradeintable .offertext{
	color:#124572;
	font-size:16px;
	font-weight:bold;
	padding: 20px 0px 10px 10px;
	vertical-align:top;
}

#tradeintable .tblheader2{
	background:#666;
	color:#fff;
	text-transform:uppercase;
	font-size:30px;
	font-weight:bold;
	padding-top:20px;
	padding-bottom:20px;
	padding-left:5px;
	text-indent: 10px;
 }


/* =========== /promotions =============== */

/* =========== accessories =============== */

#accessory {
	width:100%;
}
 
#accessory table {
	border:0px solid #BBBBBB;
	margin: 10px 0 40px 0;
	width:100%;
	clear:both;
	padding:0px;
}
#accessory td {
	border:1px solid #BBBBBB;
	padding:5px;
	vertical-align:top;
}
 
#accessory .rowodd{
	background-color:#f8f8f8;
}
 
#accessory .col1{
	width:100px;
}
 
#accessory p{
	text-align:center;
	line-height:17px;
}
 
#accessory .subhead {
	color: #000000;
	font: 600 15px/1em Helvetica, Arial, sans-serif;
	text-decoration:none;
	text-align:center;
	margin-top: 25px;
}


/* =========== /accessories =============== */


/* =========== product images =============== */

#product-image {
    float:right; 
	padding:10px;
	margin:20px;	
}

.product-image {
    float:right; 
	padding:10px;
	margin:20px;	
}

.product-image-small {
    float:right; 
	padding:10px;
	margin:20px;	
}

.fullwidthimage-logo {
    float: right;
    margin: 0 0 15px 15px;
    max-width: 200px;
    padding: 5px;
}

@media (max-width: 600px) {
	.product-image {
		float: none;
		padding-left: 10px;
		text-align: center;
	}
	
	#product-image {
		float: none;
		padding-left: 10px;
		text-align: center;
	}
	
	.product-image-small {
		float: none;
		padding-left: 10px;
		text-align: center;
	}
	.fullwidthimage-logo {
		float: none;
		padding-left: 10px;
		text-align: center;
	}

}

/* =========== /product images =============== */

/* ================ product-offers ============== */

.product-offers {
    background-color: #f1f1f1;
    border: 1px dashed #999;
    border-radius: 5px;
    margin-bottom: 20px;
    padding: 10px;
    width: 98%;
}
.product-offers h3 {
	color: #053636;
    font-weight: 600;
    margin-bottom: 10px;
    margin-top: 10px;
}
.product-offers p {
	color: #494949;
}
.product-offers a {
	color: #38A1D1;
    transition: all 0.3s ease 0s;
}
.product-offers a:hover {
	color: #009390;
}
/* ============= /product-offers ============== */


/* =========== mototrbo =============== */

#trbo h1 {
	font-family: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size: 18px;
	font-weight: bold;
	color: #000000;
	text-transform: uppercase;
	margin-top:0px;
	margin-bottom:2px;
}
#trbo h2 {
	font-family: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size: 16px;
	font-weight: bold;
	color: #157fc4;
	text-transform: capitalize;
}
#trbo h3 {
	font-family: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #666666;
	margin-bottom: 0px; 
	margin-top: 0px; 
}
#trbo h4 {
	font-family: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-weight: bold;
	color: #000000;
}
#trbo .image{
	float:right;
	padding-left:10px;
	border:0px;
}
.systems{
                padding: 0px;
                font-size: 17px;
                color: #666666;
                margin-top: -11px;
                margin-right: 0px;
                margin-bottom: 10px;
                margin-left: 0px;
}
.tagline{
                padding: 0px;
                font-weight: bold;
                margin-top: 10px;
                margin-right: 0px;
                margin-bottom: 0px;
                margin-left: 0px;
                color: #000;
}

.mdlnumb {
	padding-right:5px;
}
.opfordigitbl{
	width:99%;
	background-color:#0ca0dc;
	padding:0px;
}
.opfordigi{
	background-color:#0ca0dc;
	color:#FFF;
	padding-left:5px;
	padding-right:5px;
}
.pgheader{
	text-align:center;
}

.pgheader img {
	width:95%;
}

.hpimg{
	text-align:center;
	border:0px;
}
.featureshdr{
	font-weight:bold;
	padding-bottom:0px;
	margin-bottom:0px;
}
.features{

	padding-top:0px;
	margin-top:0px;
}

.isvimage{
	float:right;
	padding-left:10px;
	padding-right:5px;
}
 .appstbl, .appstbl td {
	background-color:#1ca6df;
	color:#FFF;
	padding-right:3px;
	padding-top:5px;
	vertical-align:top;
}

.appstbl td strong {
	background-color:#1ca6df;
	color:#FFF;
	padding-right:3px;
	font-weight:bold;
}


.appstblhdr{
	color:#000;
	font-weight:bold;
	font-size:14px;
	text-transform:uppercase;
	text-align:center;
	padding-top:10px;
}
#systbl td{
	padding-right:5px;
}

.optimized-background {
                background-color: #0ca0dc;
                height: 100px;
}
.optimized-copy {
                color: #ffffff;
                padding: 10px;
}
.optimized-image {
                float: right;
}

.trbo-lowercase{
	text-transform:lowercase;
}

/* =========== /mototrbo =============== */


/* =========== mototrbo apps =============== */

.icons{
float:left;
padding-bottom:30px;
padding-right:20px;
}

.partner-level{
font-weight:bold;
}

.partner-header{
	font-size: 33px;
	color: #002157;
	margin-bottom:10px;
	padding-bottom:10px;
	margin-top:10px;
	padding-top:10px;

}

.application-features{
	font-weight:bold;
	
	}
.application-systems{
	font-weight:bold;
}

.key-benefits{
	width:50%;
	float:left;
	vertical-align:top;
}
.key-features{
	width:50%;
	float:right;
	vertical-align:top;
}
@media (max-width: 479px) {
.key-benefits{
	width:100%;
	vertical-align:top;
}
.key-features{
	width:100%;
	vertical-align:top;
}
}

.app-boxes{
	width:50%;
	float:left;
	vertical-align:top;
}

.app-boxes img.fullwidthimage {
	width: 100%;
	padding:0px;
}

.app-container {
	padding: 0 10px 0 10px;
	height: 550px;
}

@media (max-width: 1199px) and (min-width: 768px) {
.app-container {
	padding: 0 10px 0 10px;
	height: 700px;
}
}
	
@media (max-width: 767px) {
.app-boxes{
	width:100%;
	vertical-align:top;
}
.app-container {
	padding: 0 10px 0 10px;
	height: 100%;
}
}

.app-title{
	height: 50px;
	vertical-align: top;
}

.app-image {
  float:left; 
	padding:10px;
	margin:20px;	
}

.app-image-sold {
  float:left; 
	padding:10px;
	margin:20px;	
}

@media (max-width: 479px) {
.app-image {
	float:none;
	text-align:center;
	width: 149px;
	padding:0px;
	margin:auto;
}

.app-image-sold {
	float:none;
	text-align:center;
	width: 183px;
	padding:0px;
	margin:auto;
}
}

/* =========== /mototrbo apps =============== */

/* =========== schoolsafe / wave =============== */

.schoolsafe-quote {
	display:block;
	margin-left:50px;
	margin-right:50px;
}
.schoolsafe-quote em{
	font-size:20px;
	font-weight:bold;
}

.fltleft{
	float:left;
	padding-right:10px;
	padding-bottom:10px;
}

/* =========== /schoolsafe / wave =============== */

/* =========== team communications =============== */


.team-icons{
	float: left;
	padding-right: 20px;
}
@media (max-width: 479px) {
.team-icons{
width: 100%;
}
	.team-icons img{
width: 150px;
}

}
.info-graphic{
	float: left;
	padding-right: 5px;
	width: 24%;
	padding-bottom: 10px;
}
.info-graphic img{
	width: 100%;
	}
@media only screen and (max-width: 767px) {
.info-graphic{
	float: left;
	padding-bottom: 10px;
	padding-right: 5px;
	width: 48%;
	}
}
@media only screen and (max-width: 479px) {
.info-graphic{
	width: 100%;
}
}

.team-solutions-icons {
	float: left;
	padding-right: 5px;
	width: 24%;
	padding-bottom: 10px;
	}
.team-solutions-icons img{
	width: 100%;
	}
@media only screen and (max-width: 767px) {
.team-solutions-icons{
	float: left;
	padding-bottom: 10px;
	padding-right: 5px;
	width: 48%;
	}
}
@media only screen and (max-width: 479px) {
.team-solutions-icons{
	width: 100%;
}
}

.team-links {
	
}

/* =========== team communications =============== */


/* =========== ruleline =============== */

.dvdr {
	width: 95%;
	margin: 55px auto 35px auto;
	height:1px;
	background-color:#C1C1C1;
	clear:both;
}

/* =========== /ruleline =============== */

/* =========== hide accessories =============== 

.accessory{	
	display: none;
}

 =========== /hide accessories =============== */

/* =========== motorola copyright =============== */

#motorola-copyright {
	color: #666;
	margin-top: 0;	
	font-size: 15px;
	line-height: 19px;
	text-align: center;
	font-weight: 300;
	}


/* =========== /motorola copyrights =============== */

/* =========== maps =============== */

.fluid-wrapper {
    position: relative;
    padding-bottom: 82.25%; /* 16:9 */
    height: 0;
	margin-bottom: 50px;
	margin-top: 55px;
}
.fluid-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
}

/* =========== /maps =============== */

/* =========== Anchor Links =============== 

a[name] {
  padding-top: 140px;
  margin-top: -140px;
  display: block;
}
*/
/* =========== /Anchor Links =============== */

/* =========== Footer =============== */
.footer-1 .footer-img img{
	max-width: 300px;
	width: 100%;
	height: auto;
}

.credit {
	text-align: center;
}

.credit a {
	font-size: 14px;
	color: #555;
}

.credit a:hover {
	color: #6caedf;
}

/* =========== /Footer =============== */

/* =========== Phone Systems =============== */

.phone-systems h3 {
	font-size: 25px;
}

.phone-systems h4 {
	font-size: 23px;
}

.phone-systems h4.red {
	font-size: 23px;
	color:#CC0000;
}

.phone-systems h5 {
	font-size: 19px;
}

.phone-systems h5.red {
	font-size: 19px;
	color:#CC0000;
	font-style: italic;
	margin: 10px 0px 2px 15px;
}

.phone-systems p.red {
	margin: 0px 0px 15px 15px;
}

/* =========== /Phone Systems =============== */


/* =========== Home Responsive Header =============== */

 /* Container holding the image and the text */
.home-resp-header {
	display: none;
}

.home-resp-head-contain {
    position: relative;
	text-align: center;
}

.home-resp-head-contain h2 {
	color: #fff;
}

.home-resp-head-contain img {
	width: 100%;	
}

/* center text */
.text-block {
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.4);;
    color: #fff;
    padding: 10px 20px 15px 20px;
	height: 100%;
} 

@media only screen and (max-width:1025px) {
	.home-resp-header {
		display: block;
	}
	.main-slider-res {
		display: none;
	}
}

@media only screen and (max-width:415px) {
	.home-resp-head-contain img {
		min-height: 300px;
        width: auto;
		object-fit: cover;
	}
}

/* =========== /Home Responsive Header =============== */

 /* ========== Clickable Phone Number Responsive ========== */
@media screen and (min-width: 768px) {
   a[href*="tel:"] {
       pointer-events: none;
   }
}
/* ========== / Clickable Phone Number Responsive ========== */

/* ========== Offset ========== */

:target {
  display: block;
  position: relative;
  top: -190px; 
  visibility: hidden;
}

/* ========== /Offset ========= */

/* ========== General Styles =========== */
blockquote {
	margin-left: 30px !important;
	margin-right: 30px !important;
}

.body-link::after {
    padding-left: 7px;
    content: '\f061';
    font: 400 16px 'FontAwesome';
    color: #1D98CE;
	-webkit-transition: all 0.3s ease-out 0s;
	-moz-transition: all 0.3s ease-out 0s;
	-ms-transition: all 0.3s ease-out 0s;
	-o-transition: all 0.3s ease-out 0s;
	transition: all 0.3s ease-out 0s;
}
.test-quote {
	background: #E5E5E5;
	margin: 0 20px 30px 20px;
	padding: 20px;
	border-left: solid 6px #666;
	
}
.quote-mark {
    float: left;
    margin: 20px;
}

.test-quote p em {
	font-style: italic;
	font-size: 14px;
	color: #999;
}

.gps-imgs p {
	margin: 10px 0 50px 0;
}

.gps-imgs img {
	width: 100%;
}

.sidenav-indent {
	margin-left: 25px;
}

/* ========== /General Styles =========== */


/* ====== Thank You Page ===== */

   .thank-you-wrap {
        min-height: 70vh;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 60px 20px;
        /* background: linear-gradient(135deg, #f7f9fc 0%, #eef3f8 100%); */
        font-family: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    }

    .thank-you-card {
        max-width: 700px;
        width: 100%;
        padding: 60px 50px;
        /* box-shadow: 0 20px 60px rgba(0,0,0,0.08); */
        text-align: center;
    }

    .thank-you-icon {
        width: 90px;
        height: 90px;
        margin: 0 auto 30px;
        border-radius: 50%;
        background: #457D3D;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #fff;
        font-size: 42px;
        font-weight: bold;
    }

    .thank-you-card h1 {
        font-size: 42px;
        margin-bottom: 20px;
        color: #1f2937;
        line-height: 1.2;
    }

    .thank-you-card p {
        font-size: 18px;
        line-height: 1.7;
        color: #5b6470;
        margin-bottom: 18px;
    }

    .thank-you-actions {
        margin-top: 35px;
        display: flex;
        gap: 15px;
        justify-content: center;
        flex-wrap: wrap;
    }

    .thank-btn {
        display: inline-block;
        padding: 15px 28px;
        border-radius: 8px;
        text-decoration: none;
        font-weight: 600;
        font-size: 16px;
        transition: all 0.3s ease;
    }

    .thank-btn-primary {
        background: #457D3D;
        color: #fff;
    }

    .thank-btn-primary:hover {
        background: #F9AE21;
        transform: translateY(-2px);
		color: #fff;
    }

    .thank-btn-secondary {
        background: #f1f5f9;
        color: #457D3D;
        border: 1px solid #457D3D;
    }

    .thank-btn-secondary:hover {
        background: #e7edf5;
    }

    @media (max-width: 768px) {
        .thank-you-card {
            padding: 40px 25px;
        }

        .thank-you-card h1 {
            font-size: 32px;
        }

        .thank-you-card p {
            font-size: 16px;
        }

        .thank-you-icon {
            width: 75px;
            height: 75px;
            font-size: 34px;
        }
    }

/* ===== Contact Us Page ===== */

.contact-info-wrap {
    display: flex;
    align-items: stretch;
    gap: 40px;
    max-width: 1200px;
    width: 100%;
}

.contact-info-text {
    width: 35%;
}

.contact-info-image {
    width: 65%;
}

.contact-info-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 8px;
}

.contact-info-text p {
    margin-bottom: 20px;
    line-height: 1.6;
}

@media (max-width: 768px) {
    .contact-info-wrap {
        flex-direction: column;
        gap: 20px;
    }

    .contact-info-text,
    .contact-info-image {
        width: 100%;
    }

    .contact-info-image {
        order: -1; /* puts image on top in mobile */
    }
}
