body {
text-decoration: none; 
font-family: 'Roboto', sans-serif;
color: #333333;
margin :0px;
background: #FFFFFF;
}

#headerbarouter {
 width:100%;
 background-color:#013348;
 border-bottom:1px solid #013348;
 margin-bottom:4px;
}

#headerbarinner {
 max-width:1200px;
  margin:auto;
  position:relative;
  display:flex;
  justify-content:space-between;
  align-items:center;
}

#pagebodyouter {
 width:100%;
}
#pagebodyinner {
  max-width:1200px;
  margin:auto;
  text-align:center;
}

#menuouter {

}

#menuinner {

}

#footerouter {
 width:100%;
 background-color:	#013348;
 min-height:100px;
}

#footerinner {
 margin:auto;
 max-width:1200px;
}

A.menulink { 
text-decoration: none; color: #FFFFFF; font-size: 12pt;
font-weight:400;
display:inline-block;
padding:20px;
 }
A.menulink:hover { text-decoration: underline; 
     
	}
	
#callus {
text-decoration:none;
color:#FFFFFF;
font-size:20pt;
font-weight:500;	
text-align:right;
box-sizing:border-box;
}

.strap, h1 {
 color:#013348;
  font-size:20pt;
 font-weight:700;
 margin:auto;
 padding:0 15 0 15px;
 max-width:1200px;
 text-shadow: 2px 2px 10px #DEDEDE;
}

h2 {
 color:#013348;
  font-size:16pt;
 font-weight:700;
 margin:auto;
 text-shadow: 2px 2px 10px #DEDEDE;
 text-align:center;
}

.subtitle {
 color:#DEE6F3;
  font-size:16pt;
 font-weight:500;
 text-align:left;
 max-width:1200px;
 margin-bottom:10px;
 padding-left:8px;
}

.product {
display:inline-block;
position:relative;
background-color: #013348;
background: linear-gradient(to right bottom, rgba(1,43,61,1), rgba(2,83,117,1));
border: 0px solid #013348;
border-radius:20px;
width:250px;
height:300px;
vertical-align:top;
margin:8px;
cursor:pointer;
}

.product:hover {
z-index:1;
transform: scale(1.1);
transition: all 0.5s ease;	
box-shadow: 6px 6px 10px #23365C;
}

.product_title {
 font-size:14pt;
 font-weight:500;	
 color:#DEE6F3;
 padding:8px;
}

.product_desc {
 font-size:12pt;
 font-weight:400;	
 color:#DEE6F3;
 padding:8px;
 text-shadow: 2px 2px #104172;
}

.product_img {
position:absolute;	
}

#footerlogos {
max-width:1200px;
margin:auto;
}

#footerlinks {
color:#ffffff;
font-size:10pt;
font-weight:400;
padding:8px;
}

.textcontent {
	font-size:11pt;
 font-weight:400;	
 color:#333333;
 margin:auto;
 padding:8px;
 text-align:left;
}

A.footlink { display:inline-block;margin-top:3px;margin-bottom:3px;margin-right:15px;text-decoration: none; color: #DDE6F3; font: 11pt }
A.footlink:hover { text-decoration: underline; color: #FFFFFF; font: 10pt }

A.themenu { text-decoration: none; color: #ffffff;}
A.themenu:hover { text-decoration: underline; color: #FFFF00;}
A.slink { text-decoration: none; color: #1D66AB; font: bold 10pt }
A.slink:hover { text-decoration: underline; color: #dd0000; font: bold 10pt }


.footer { text-decoration: none; color: #000000; font: 9pt }
.pagetitle { text-decoration: none; color: #013348; font: Bold 11pt }
.pagetitle_rev { text-decoration: none; color: #013348; font: Bold 11pt }
.normal { text-decoration: none; color: #000000; font: 10pt }
.normalsmall { text-decoration: none; color: #000000; font: 9pt }
.db { text-decoration: none; color: #013348; font: 10pt }
.lb { text-decoration: none; color: #C5DDFA; font: 10pt }
.menutitle { text-decoration: none; color: #FFFFFF; font: bold 10pt }



#rotating_container {
 display:block;	
 width:100%;
 background-color:#FFFFFF;
 margin-top:0px;
}
.rotating_wrapper {
 width:100%;	
}
.rotating_image {
display:inline-block;
vertical-align:top;
box-sizing:border-box;
cursor:pointer;
width:70%;
border:0px solid #EFEFEF;
background-size:cover;
background-repeat:none;
height:400px;
}
.rotating_content_outer {
display:inline-block;
vertical-align:top;
box-sizing:border-box;
width:30%;
background-color: #013348;
vertical-align:middle;
text-align: center;
height:400px;
}
.rotating_content_inner {
 display: table;
 width:100%;	
}
.rotating_content {
width:100%;
height:400px;
padding-left:50px;
padding-right:50px;
display:table-cell;
vertical-align:middle;
text-align: center;
color:#FFFFFF;
}

.rotating_title {
font-weight:600;
font-size:13pt;
color:#FFFFFF;
margin-bottom:20px;
}
a.rotating_link {
display:block;
margin:auto;
margin-top:20px;
font-weight:600;
font-size:9pt;
width:90px;
line-height:25px;
border-radius:5px;
border:0px solid #686868;
background:#686868;
color:#FFFFFF;
text-decoration:none;
}
a.rotating_link:hover {
	background:#C65000;
}

#jssor_1 {
position:relative;margin:0 auto;top:0px;left:0px;width:1500px;height:400px;overflow:hidden;visibility:hidden;	
}

.slides {
	cursor:default;position:relative;top:0px;left:0px;width:1500px;height:400px;overflow:hidden;
}

/*jssor slider loading skin spin css*/
        .jssorl-009-spin img {
            animation-name: jssorl-009-spin;
            animation-duration: 1.6s;
            animation-iteration-count: infinite;
            animation-timing-function: linear;
        }

        @keyframes jssorl-009-spin {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }

        /*jssor slider bullet skin 032 css*/
        .jssorb032 {position:absolute;}
        .jssorb032 .i {position:absolute;cursor:pointer;}
        .jssorb032 .i .b {fill:#fff;fill-opacity:0.7;stroke:#000;stroke-width:1200;stroke-miterlimit:10;stroke-opacity:0.25;}
        .jssorb032 .i:hover .b {fill:#000;fill-opacity:.6;stroke:#fff;stroke-opacity:.35;}
        .jssorb032 .iav .b {fill:#000;fill-opacity:1;stroke:#fff;stroke-opacity:.35;}
        .jssorb032 .i.idn {opacity:.3;}

        /*jssor slider arrow skin 051 css*/
        .jssora051 {display:block;position:absolute;cursor:pointer;}
        .jssora051 .a {fill:none;stroke:#000;stroke-width:360;stroke-miterlimit:10;}
        .jssora051:hover {opacity:.8;}
        .jssora051.jssora051dn {opacity:.5;}
        .jssora051.jssora051ds {opacity:.3;pointer-events:none;}
        
A.catlink { text-decoration: none; color: #013348;font-weight:bold; }
A.catlink:hover { text-decoration: underline; color: #ff0000; }
        
        
.prodbox {
font-size:11pt;
margin:auto;
text-decoration: none; 
border:2px solid #013348;
border-radius:4px;
border-radius:0px 0px 4px 4px;
padding:10px;
box-sizing:border-box;
}

.prodboxtitle {
font-size:11pt;
margin:auto;
text-decoration: none; 
color: #FFFFFF;
border-radius:4px 4px 0px 0px;
background-color:#013348;
border:2px solid #013348;
box-sizing:border-box;
}

.gridform {
	display: grid;
 	grid-gap: 5px;
	grid-template-columns: auto auto;
	justify-items:  center;
	justify-content: space-around;    
	width:100%;
}

.gridformcell {
 justify-self: start;	
}

.gridformcellright {
 justify-self: end;	
}

.checkoutinputwrapper{
  position: relative;
  text-align:left;
  box-sizing:border-box;
  margin:8px 0px 8px 0px !important;
  width:100%;
}

.formbox {
color: #013348; 
font-family: 'Roboto', sans-serif;
border:1px solid #013348;
border-radius:4px;
font-size:11pt;
padding:3px;
}

.checkoutinput  {
color: #013348; 
box-sizing:border-box;
font-family: 'Roboto', sans-serif;
border:1px solid #013348;
border-radius:4px;
font-size:12pt;
padding:10px 8px 10px 8px !important;
width:100%;
}

.checkoutinput:focus {
outline-color: #FFCB05;
}

.checkoutinput_select {
    cursor:pointer;
}


.placeholder {
  position: absolute;
  font-weight:400;
  font-size:10px;
  font-family: 'Roboto', sans-serif;
  pointer-events: none;
  left: 4px;
  top: 2px;
}

.checkoutinput_error {
	border:2px solid #FF0000;
}
.checkoutinput_error::placeholder {
	color: #FF0000;
	opacity: 1;
}

input[type=checkbox] {
    transform: scale(1.6);
}

.formerror {
 color:#FF0000;
 text-align:left;
 padding:5px;	
}


input[type="button"],input[type="submit"],a.button {
	display:inline-block;
background: #013348;
color:#FFFFFF;
font-size: 11pt;
border-radius:6px;
border:0px;
padding:8px 15px 8px 15px;
cursor:pointer;
margin:5px;
font-family: 'Roboto', sans-serif;
-webkit-appearance: none;
text-decoration:none;
}

input[type="button"]:hover,input[type="submit"]:hover ,a.button:hover {
background-color:#DDE6F3;
color:#013348;
}



/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 100; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.modal-outer {
	display: flex;
  justify-content: center;
  align-items: center; 
  height: 100%; /* Full height */
 }
 
/* Modal Content/Box */
.modal-content {
  text-align:left;
  background-color: #fefefe;
  padding: 20px;
  border: 1px solid #888;
  border-radius:20px;
  max-width: 1000px;
  max-height:95vh;
  overflow-y:auto;
  width:90%;
  filter: drop-shadow(5px 5px 10px #232323);
}

/* The Close Button */
.close {
  color: #aaa;
  float: right;
  position:relative;
  top:-20px;
  right:-5px;
  font-size: 35px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

#mobiletop {
 display:none;	
}

#logo {
 width:260px;height:auto;
 box-sizing:border-box;
}

.logocontainer {
 box-sizing:border-box;
 padding:10px;	
}

.aboutusimage {
 float:right;
 border-radius:10px;
 filter: drop-shadow(3px 3px 5px #232323);
 margin-left:20px;
 margin-bottom:20px;
}

/************************************************************************************************************************************************/
/************************************************************************************************************************************************/
/************************************************************************************************************************************************/
@media only screen and (max-width: 1210px) { 
	
	#callus {
padding:0 20 0 20px;
}

.rotating_title {
font-size:16pt;
}

.rotating_content {
font-size:15pt;
}
	
}

/************************************************************************************************************************************************/
/************************************************************************************************************************************************/
/************************************************************************************************************************************************/
@media only screen and (max-width: 900px) { 
	

#jssor_1 {
height:950px;
}

.slides {
height:950px;
}


.rotating_image {
display:block;
width:100%;
height:600px;
}
.rotating_content_outer {
display:block;
width:100%;
height:350px;
}
.rotating_content {
width:100%;
height:350px;
padding-left:15px;
padding-right:15px;
padding-bottom:75px;
font-size:22pt;
}

.rotating_title {
font-size:24pt;
}

#menuouter {
display:none;	
}

#mobiletop {
 display:flex;
 height:30px;
 background: #FFFFFF;
 width:100%;
 align-items: center; 
}

a.mobilemenulink {
 display:block;
 text-decoration:none;
 color:#013348;
 font-size:11pt;
 padding:0 15 0 15px;	
}

.aboutusimage {
 display:block;
 margin:auto;
 margin-bottom:15px;
 float:none;
 max-width:90%;
   
}



/************************************************************************************************************************************************/
/************************************************************************************************************************************************/
/************************************************************************************************************************************************/
@media only screen and (max-width: 600px) { 
	
#callus {
font-size:16pt;
white-space: nowrap;
}

#jssor_1 {
height:1100px;
}

.slides {
height:1100px;
}


#logo {
 width:100%;height:auto;
}

.rotating_content_outer {
height:500px;
}
.rotating_content {
font-size:29pt;
height:500px;
}

.rotating_title {
font-size:31pt;
}



}


/************************************************************************************************************************************************/
/************************************************************************************************************************************************/
/************************************************************************************************************************************************/
@media only screen and (max-width: 500px) { 
	
#callus {
font-size:12pt;
}


}