/* ===== Style Reset ===== */
html{color:#717071;}
body,h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;margin:0;padding:0;text-decoration: none;-webkit-text-size-adjust: none; position:relative; }
a { text-decoration: none; color:#717071;}

	.mainbody a:hover{ color:#999999; }

.mainbody p {margin-top:10px;}

.mainbody .readMore { color:#e10f06; }
	.mainbody .readMore:hover{ color:#004b8d; }


span.error, small.error {
display: block;
padding: 0.33333rem 0.5rem 0.5rem; 
margin-top: -1px;
margin-bottom: 0.88889rem;
font-size: 0.66667rem;
font-weight: normal;
font-style: italic;
background: #F04124;
color: #FFF;
}
.error input, .error textarea {
margin-bottom: 0;
}
[data-abide] .error small.error, [data-abide] span.error, [data-abide] small.error {
display: block;
padding: 0.33333rem 0.5rem 0.5rem;
margin-top: -1px;
margin-bottom: 0.88889rem;
font-size: 0.66667rem;
font-weight: normal;
font-style: italic;
background: #F04124;
color: #FFF;
}
[data-abide] span.error, [data-abide] small.error {
display: none;
}
select, .DropDownLists{font-size:1em; border: #004aa1 1px solid;  padding: 0.15em 0.1em 0.15em 0.2em; margin:3px 0;}
select{font-size:1em; border: #c3d9f9 1px solid;}

/* ===== MQs ===== */
@media screen and (max-width: 500px) {
	.xsm-only-show { display: block;}
	.xsm-only-hide { display:none}
}
@media screen and (min-width: 500px) {
	.xsm-only-show { display: none;}
	.xsm-only-hide { display:block}
}


@media only screen {
.ultraheading { font-size:3.8em; line-height:100%; margin:0.25em 0; padding:0; }
.superheading { font-size:2.25em; line-height:100%; margin:0.25em 0; padding:0; }
.small{font-size: 0.875em; }
h6, .h6, .verysmall {font-size:0.825em;}
}

@media only screen and (min-width: 40.063em) {
	
.ultraheading { font-size:4.5em; line-height:100%; margin:0.25em 0; padding:0; }
.superheading { font-size:3.25em; line-height:100%; margin:0.25em 0; padding:0; }
\}

@media only screen and (min-width: 64.063em) {
	
/* ======= Heading Declarations ======= */
.ultraheading { font-size:4.5em; line-height:100%; margin:0.25em 0; padding:0; }
.superheading { font-size:3.25em; line-height:100%; margin:0.25em 0; padding:0; }

}



/* ====== Colors ====== */

.white{color:#000;}
.dGray{color:#333333;}
.lGray {color:#646464; }
.black{color:#000000;}
.blue{color:#004b8d;}
.red { color:#e10f06;}

.bgWhite{background-color:#ffffff;}
.bgDGray{background-color:#333333;}
.bglGray{background-color:#ccc;}

.bgDGray25{background-color:rgba(51,51,51,.25);}
.bgBlack{background-color:#000000;}

/* ====== Fonts ====== */
.sample{
	font-family:"Sample", sans-serif;
}

/* ====== Common Classes ====== */
.vCenterContainer{
	display:table;
}
.vCenter{
	display:table-cell;
	vertical-align:middle;
}
.uc, .caps{
	text-transform:uppercase;
}
.bold{
	font-weight:700;
}
.ul{
	text-decoration:underline;
}
.navContainer{
	width:100%;
	max-width:75em;
	text-align:right;
}
.clear{
	clear:both;
}
.flrt {
	float:right;
}
.bebas{
	font-family: 'bebas_neue_regularregular', sans-serif;
}
.border {
	border: 2px solid #004B8D;
    border-radius: 25px;
	box-shadow: 10px 10px 5px #888888;
}
/* ====== RSS Classes ======= */
.rssRow h4{
	font-family: 'bebas_neue_regularregular', sans-serif; 
	
}
#Blog ul li{ list-style:none !important; padding-top:15px; }
#Blog .rssRow div.date { display:inline; width:73px;  float:left; font-family: 'bebas_neue_regularregular', sans-serif; font-size:1.3em}
#Blog .rssRow div.date:after{ content:" | "; }

#Blog .rssRow div.headlinetag  { display:inline;  text-align:left;     }
#Blog .rssRow div.posttext {  }
#Blog .rssRow p {  text-align:left;  }
#Blog .rssRow   .readmore a { display:block; clear:both; color:#e10f06; font-size:1.1em; text-align:right;  font-family: 'bebas_neue_regularregular', sans-serif}
#Blog img {	display:none; }

#Blog ul li.rssRow.odd{ clear:both;  display:block; } 
#Blog ul li.rssRow.even{ clear:both; border-top:1px solid #B8B8B8;   display:block; }
#Blog a.rss-item {font-size: 1.4em; margin-top:0;}


#News ul li{ list-style:none !important; padding-top:15px; }
#News .rssRow div.date { display:inline; width:73px;  float:left; font-family: 'bebas_neue_regularregular', sans-serif; font-size:1.3em}
#News .rssRow div.date:after{ content:" | "; }

#News .rssRow div.headlinetag  { display:inline;  text-align:left;     }
#News .rssRow div.posttext  {    }
#News .rssRow .posttext { max-height: 150px; overflow: hidden;  margin-bottom:14px  }
#News a.rss-item {font-size: 1.4em; margin-top:0;=}
#News li.rss-item {border-bottom:1px solid #ccc;padding-bottom:1em;}
#News li.rss-item:last-child{border-bottom:none;}

/*
   text-overflow: ellipsis;
   display: -webkit-box;
      
   -webkit-line-clamp: 2;  
   -webkit-box-orient: vertical;*/}
#News .rssRow p {  text-align:left;  }
#News .rssRow .readmore a{ display:block; clear:both; color:#e10f06; font-size:1.1em; text-align:right;  font-family: 'bebas_neue_regularregular', sans-serif}
#News img { display:block; width:150px;  }

#News ul li.rssRow.odd{ clear:both;  display:block; } 
#News ul li.rssRow.even{ clear:both; border-top:1px solid #B8B8B8;   display:block; }

/* ====== gry product  table detail classes ======= */
 table.bdr-btm-tr tbody tr td { border-bottom:1px solid #6B6B6B}

/* ====== Button Class ======= */
.mainbody  .whiteButton { display:inline-block; color:#333333; padding:0.5em 1.25em; background-color:#ffffff; text-decoration:none}
.mainbody  .whiteButton:hover { color:#ffffff; background-color:#004b8d; }

.mainbody  .redButton { display:inline-block; color:#fff; padding:0.5em 1.25em; background-color:#e10f06; text-decoration:none}
.mainbody  .redButton:hover { color:#ffffff; background-color:#004b8d; }

.bannerButton { display:inline-block; color:#fff; padding:0.5em 1.25em; background-color:#004b8d; text-decoration:none}
.bannerButton:hover { color:#fff; background-color:#333333; }

/* ====== Padding ====== */
.Pad5{padding:5px}
.PadB5{padding-bottom:5px}
.PadT5{padding-top:5px}
.PadL5{padding-left:5px}
.PadR5{padding-right:5px}

.Pad{padding:10px}
.PadT{padding-top:10px}
.PadL{padding-left:10px;}
.PadR{padding-right:10px}
.PadB{padding-bottom:10px}

.Pad15{padding:15px}
.PadT15{padding-top:15px}
.PadR15{padding-right:15px}
.PadB15{padding-bottom:15px}
.PadL15{padding-left:15px}

.Pad20{padding:20px}
.PadL20{padding-left:20px;}
.PadR20{padding-right:20px}
.PadB20{padding-bottom:20px}
.PadT20{padding-top:20px}

.Pad30 { padding:30px;}
.PadR30 { padding-right:30px;}
.PadT30 { padding-top:30px;}
.PadL30 { padding-left:30px;}
.PadB30 { padding-bottom:30px;}

.PadT40 { padding-top:40px;}
.PadB40 { padding-bottom:40px;}
.PadR40 { padding-right:40px;}
.PadL40 { padding-left:40px;}

/* ====== Margin ====== */
.Margin{margin:10px}
.Margin15{margin:15px}
.Margin20{margin:20px}

.MarginR5 { margin-right:5px;}
.MarginL5 { margin-left:5px;}
.MarginB5 { margin-bottom:5px;}
.MarginT5{margin-top:5px}

.MarginL{margin-left:10px;}
.MarginR{margin-right:10px}
.MarginB{margin-bottom:10px;}
.MarginT{margin-top:10px}

.MarginT15{margin-top:15px}
.MarginB15{margin-bottom:15px;}
.MarginL15{margin-left:15px;}
.MarginR15 { margin-right:15px;}

.MarginL20{margin-left:20px;}
.MarginR20{margin-right:20px}
.MarginB20{margin-bottom:20px}
.MarginT20{margin-top:20px}

.MarginT30 { margin-top:30px; }
.MarginR30 { margin-right:30px;}
.MarginB30 { margin-bottom:30px;}
.MarginL30 { margin-left:30px;}

.MarginT40{margin-top:40px}
.MarginL40{margin-left:40px}
.MarginR40{margin-right:40px}
.MarginB40 { margin-bottom:40px;}


body{
    overflow-x: hidden;
}
body, ul, li{
    margin: 0;
    padding: 0;
}

/* ===== Nav CSS ===== */
/* Desktop */
nav{
	position:relative;
	z-index:1;
	border-bottom:1px solid #ffffff;
}
ul.nav{width:830px; text-align: left; float:left; color:#ffffff; border-top: 1px solid #9F9FA0;}
ul.nav li{
    display: inline-block;
    position: relative;
	white-space:nowrap;
}
ul.nav li:after{
	content: "";
	clear:both;
}
ul.nav li a{
   line-height:35px; font-weight:bold;
height:35px;
    display: block;
    color: #000;
    text-decoration: none;
}
ul.nav li a:hover{
	color:#E50011;
    background-color: #fff;
}
/* Level 2 */
ul.nav ul.level2{
    position: absolute;
    text-align: left;
    background-color: #fff;
}
ul.nav ul.level2 li{
    display: block;
}
/* Level 3 */
ul.nav ul.level2 ul.level3{
    position: absolute;
    top: 0;
    left: 100%;
    text-align: left;
    background-color: #000000;
}



/* Mega Menu */
ul.nav .megaMenu{
    width:1105px;padding-bottom:10px;
    text-align: left;
    background-color: #fff;
    position: absolute;
    display: table;transform: translateX(-17%); padding-left:20px;
}
ul.nav .megaMenu ul{
    display: table-cell;
	min-width:125px;
}
ul.nav .megaMenu ul:nth-last-of-type(1){
	border-right:none;
}
ul.nav .megaMenu ul li{
    display: block;
}
ul.nav .megaMenu ul li a{
    padding:4px 12px;
}

ul.nav .megaMenu ul li a{
    padding:4px 12px;
	background-color:transparent;
}

ul.nav .megaMenu ul li:nth-child(2) a{
    background-color: #fff;
	display:inline-block;
	font-weight:bold;
}

ul.nav .megaMenu ul li a:hover{color:#E50011;}


ul.nav .megaMenu img{
width: 130px;
    height: 83px;
	/*width:100%;*/
	 max-width: 175px;
	padding:8px;
}
/* ~= Animations =~ */
/* animationFade */
ul.nav.animationFade li a{
    transition: background-color .35s ease;
}
ul.nav.animationFade ul.level2, ul.nav.animationFade ul.level2 ul.level3, ul.nav.animationFade .megaMenu{
    visibility: hidden;
    opacity: 0;
    transition: opacity .35s, visibility .35s ease;
}
ul.nav.animationFade li:hover ul.level2, ul.nav.animationFade ul.level2 li:hover ul.level3, ul.nav.animationFade li:hover .megaMenu{
    visibility: visible;
    opacity: 1;
}
/* animationNone */
ul.nav.animationNone ul.level2, ul.nav.animationNone ul.level2 ul.level3, ul.nav.animationNone .megaMenu{
    display: none;
}
ul.nav.animationNone li:hover ul.level2, ul.nav.animationNone ul.level2 li:hover ul.level3, ul.nav.animationNone li:hover .megaMenu{
    display: block;
}

.menuControl{
    display: none;
	line-height:50px;
}
.menuControl img{
	float:right;
	width:50px;
	height:50px;
}
ul.nav .mobileExpander{
    display: none;
}
nav .headerLogoContainer{
	float:right; margin-top:20px;
	width:20%;
	text-align:center;
}
nav .phone{ margin-top:30px;
	float:left;
	width:80%;
  text-align:left;
}
nav .navContainer{
	float:left;
	width:80%;
	text-align:right;
	margin-top:10px;
}
/* Mobile */
@media screen and (max-width: 1100px) {
	
	
	ul.nav .megaMenu ul li:nth-child(2) a{
	display:block;	
	}
	
	nav .headerLogoContainer{
		float:left;
		width:100%;
	}
	nav .phone{
		float:right;
		padding:10px;
		width:100%;
		text-align:center;
	}
	nav .navContainer{
		float:right;
		width:100%;
		text-align:right;
		margin-top:10px;
		max-width:100%;
		text-transform:uppercase;
	}
	
	
	
    .menuControl{
        color: #ffffff;
        display: block;
        padding: 3px 10px;
        cursor: pointer;
		text-align:left;background-color: #022E87;
    }
    .menuControl:hover{
        background-color: #717071;
    }
    ul.nav .mobileExpander, ul.nav .mobileExpander2{
        display: block;
        float: right;
		cursor: pointer;
		width:30px;
		font-size:20px;
    }
	ul.nav .mobileExpander:hover, ul.nav .mobileExpander2:hover{
		background-color:#333333;
    }
    ul.nav li .mobileExpander:after{
        content: "+";
    }
    ul.nav li.active .mobileExpander:after{
        content: "-";
    }
	ul.nav .megaMenu ul .mobileExpander2:after{
        content: "+";
    }
    ul.nav .megaMenu ul.active .mobileExpander2:after{
        content: "-";
    }
    ul.nav li{
        display:block;
        text-align: left;
		border-top:1px solid #ffffff;
    }
	ul.nav ul li a{
		padding-left:24px;
	}
    ul.nav ul.level2{
        display:block;
        position: relative;
    }
    ul.nav ul.level2 li{
        text-align: left;
    }
    ul.nav ul.level2 ul.level3{
          position: relative;
          left: 0;
    }
    ul.nav ul.level2 ul.level3 li{
        text-align: left;
    }
    ul.nav .megaMenu{
        position: relative;
        display: block;
        margin-left:0;
        transform:none;
    }
	ul.nav .megaMenu ul li a{
		padding:8px 15px 8px 36px;
	}
	ul.nav .megaMenu ul li:nth-of-type(1) a{
		padding:8px 15px 8px 24px;
	}
	ul.nav .megaMenu img{
		display:none;
	}
	ul.nav .lineBreak{
		display:none;
	}
    /* Mobile Animations */
    /* animationNone */
    ul.nav.animationNone{
        display: none;
    }
    ul.nav.animationNone.active{
        display: block;
    }
	ul.nav.animationNone ul.level2, ul.nav.animationNone ul.level2 ul.level3, ul.nav.animationNone .megaMenu{
		display: none;
	}
	ul.nav.animationNone li:hover ul.level2, ul.nav.animationNone ul.level2 li:hover ul.level3, ul.nav.animationNone li:hover .megaMenu{
		display: none; /*Overwrite desktop nav hover*/
	}
	ul.nav.animationNone li.active ul.level2, ul.nav.animationNone ul.level2 li.active ul.level3, ul.nav.animationNone li.active .megaMenu{
		display: block;
	}
	ul.nav .megaMenu ul{
        display: block;
    }
	ul.nav .megaMenu ul li{
        display: none;
    }
	ul.nav .megaMenu ul.active li{
        display: block;
    }
	ul.nav .megaMenu ul li:nth-of-type(1){
        display: block;
    }
}




/* ===== Main ===== */
.banner{
	background-image:url("../imgs/dev/bannerBack.jpg");
	background-position:center;
	background-size:cover;
	background-repeat:no-repeat;
}
.bannerContent{
	padding:160px 10px 160px 40px;
}
.banner hr{
	border:none;
	margin:3px 0px;
	background-color:#333333;
	height:2px;
}
@media only screen and (max-width: 64em) {
	.banner{
		background-image:url("../imgs/dev/bannerBackMobile.jpg");
		text-align:center;
	}
	
	.bx-controls{
		display:none;
	}
}
.productsGrid-gry{
	background-image:url("../imgs/dev/productsBack-gry.jpg");
	background-position:center;
	background-size:cover;
	background-repeat:no-repeat;
}
.productsGrid{
	background-image:url("../imgs/dev/productsBack.jpg");
	background-position:center;
	background-size:cover;
	background-repeat:no-repeat;
}
.prodSquare{
	position:relative;
}
.prodSquare:hover .prodImage{
	opacity:0.7;
}
.prodSquare .prodName{
	position: absolute;
	width: 100%;
	bottom: 0;
	color:#ffffff;
	font-size:2.5em;
	padding:40px 0px 20px 0px;
	background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.75) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.75))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.75) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.75) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.75) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.75) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#bf000000',GradientType=0 ); /* IE6-9 */
	transition:padding .5s;
}
@media (max-width:640px){
	.prodSquare .prodName{
		font-size:2em;
	}
}
.prodSquare:hover .prodName{
	padding:40px 0px 40px 0px;
}
.prodSquare .prodName span{
	font-size:70%;
}

.puzzleBack{
	background-image:url("../imgs/dev/puzzleBack.jpg");
	background-position:center;
	background-size:cover;
	background-repeat:no-repeat;
	padding:100px 0px;
}
.puzzleBack .footerBlock{
	position:relative;
	max-width:500px;
	margin:20px auto;
}
.puzzleBack .bgColor{
	position:absolute;
	width:100%;
	height:100%;
	z-index:15;
}
.puzzleBack .blur{
	-webkit-filter: blur(5px);
	-moz-filter: blur(5px);
	-o-filter: blur(5px);
	-ms-filter: blur(5px);
	filter: blur(5px);
}
.puzzleBack .textContainer{
	position:relative;
	z-index:20;
}

	
hr{
	border:none;
	width:100%;
	height:1px;
}

.sitemap ul{
	padding-left:40px;
}


.shadow, .img {
-webkit-box-shadow: 4px 4px 3px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    4px 4px 3px 0px rgba(50, 50, 50, 0.75);
box-shadow:         4px 4px 3px 0px rgba(50, 50, 50, 0.75);
}
/* ===== Footer ===== */
footer a {
	color:#ffffff; text-decoration:none
}
footer a:hover{
	color:#999999;
}
footer p{
	margin:3px 0px;
}
footer h4{
	margin:15px 0px 5px 0px;;
}
footer i{
	font-size:30px;
	margin:5px;
}
@media screen and (max-width: 1100px) {
	
ul.nav{width:100%;}
ul.nav .megaMenu{ width:100%; background-color:#022e87; padding-left:0px;}
ul.nav li{ background:#022e87;}
ul.nav li a{ color:#fff; width:100%;}
ul.nav ul.level2{ width:100%;}
ul.nav .mobileExpander:hover, ul.nav .mobileExpander2:hover{
		background-color:#022e87;
    }
	
.navbkspacing{ padding:0px;}
ul.nav .megaMenu ul li:nth-child(2) a{ background-color:transparent; color:#fff;}
ul.nav .mobileExpander, ul.nav .mobileExpander2{
        display: block;
        float: right;
		cursor: pointer;
		width:30px;
		font-size:20px;
    }
ul.nav li a:hover{ width:100%; }
	}

@media only screen and (max-width: 414px) {
ul.nav{width:100%;}
ul.nav .megaMenu{ width:100%; background-color:#022e87; padding-left:0px;}
ul.nav li{ background:#022e87;}
ul.nav li a{ color:#fff; }
ul.nav ul.level2{ width:100%;}
	ul.nav .mobileExpander:hover, ul.nav .mobileExpander2:hover{
		background-color:#022e87;
    }
	
	.navbkspacing{ padding:0px;}
ul.nav .megaMenu ul li:nth-child(2) a{ background-color:transparent; color:#fff;}
    ul.nav .mobileExpander, ul.nav .mobileExpander2{
        display: block;
        float: right;
		cursor: pointer;
		width:30px;
		font-size:20px;
    }

}