/*NAT Content Modules */

/*------------------ Content Modules ------------------------------ */

.module-left-align{
	float:left;
}

.module-right-align{
	float:right;
	
}

.module-image-box{
	width:38%;
	z-index:2;


}

.white-module{
	background:#fff;
	padding-top:5%;
	padding-bottom:0%;
	padding-left:5%;
	padding-right:5%;
	width:60%;
	
}

.nat30special .white-module{
	padding-top:2%;
}

.module-wrapper{
	position:relative;
	clear:both;
	overflow:hidden;
}

.module-wrapper-white{
	position:relative;
	clear:both;
	overflow:hidden;
	background:#ffffff;
}

.module-wrapper-grey{
	position:relative;
	clear:both;
	overflow:hidden;
	background:#4d4d4d;
}

.module-wrapper-red{
	position:relative;
	clear:both;
	overflow:hidden;
	background:#d62521;
}

.red-module-medium{
	background:#d62521;
	padding-top:5%;
	padding-bottom:0%;
	padding-left:5%;
	padding-right:5%;
	overflow:hidden;
	position:inherit;
	clear:both;
	color:#fff;
	z-index:1;
	width:60%;
}

.red-module-medium p{
	color:#fff !important;
}

.red-module-medium h3{
	color:#fff !important;
	/* font-style: italic !important; */
    font-size: 1.3em !important;
}

.white-module-full-content h3{
    color: #ff8621 !important;
    font-size: 1.3em !important;
	/* font-style: italic !important; */
}
.red-module-full-content h3{
	color:#fff !important;
	/* font-style: italic !important; */
}
.grey-module-full-content h3{
    color: #fff !important;
    font-size: 1.3em !important;
	/* font-style: italic !important; */
}
.orange-module-full-content h3{
    color: #fff !important;
    font-size: 1.3em !important;
	/* font-style: italic !important; */
}

.white-module h3{
    color: #ff8621 !important;
    font-size: 1.2em !important;
	/* font-style: italic !important; */
}
.nat30special .white-module h3{
    color: #DB291C !important;
    font-weight: bold;
}
.grey-module p{
	color:#fff !important;
}

.grey-module h3{
    color: #fff !important;
    font-size: 1.3em !important;
	/* font-style: italic !important; */
}

.orange-module-full p{
	color:#fff !important;
}

.orange-module-full h3{
    color: #fff !important;
    font-size: 1.3em !important;
	/* font-style: italic !important; */
}

.white-module-full-wrap{
	background:#fff;
	padding-top:5%;
	padding-left:0;
	padding-bottom:5%;
	padding-right:0;
	overflow:hidden;
	clear:both;
	position:relative;
}
.red-module-full-wrap{
	background:#d62521;
	padding-top:5%;
	padding-left:0;
	padding-bottom:5%;
	padding-right:0;
	overflow:hidden;
	clear:both;
	position:relative;
}
.grey-module-full-wrap{
	background:#4d4d4d;
	padding-top:5%;
	padding-left:0;
	padding-bottom:5%;
	padding-right:0;
	overflow:hidden;
	clear:both;
	position:relative;
}
.orange-module-full-wrap{
    background:#FF4438;
	padding-top:5%;
	padding-left:0;
	padding-bottom:5%;
	padding-right:0;
	overflow:hidden;
	clear:both;
	position:relative;
}
.white-module-full{
	background:#fff;
	padding-top:5%;
	padding-bottom:0%;
	padding-left:5%;
	padding-right:5%;
	overflow:hidden;
	clear:both;
	position:relative;
}

.white-module-full-content{
  padding-top: 5%;
  padding-left: 5%;
  padding-right: 5%;
}

.red-module-full-content{
  padding-top: 5%;
  padding-left: 5%;
  padding-right: 5%;
}

.grey-module-full-content{
  padding-top: 5%;
  padding-left: 5%;
  padding-right: 5%;
}

.orange-module-full-content{
  padding-top: 5%;
  padding-left: 5%;
  padding-right: 5%;
}

.white-module-full h2
{
	color:#d62521 !important;
	font-weight:bold;
	text-transform:uppercase !important;
	margin:0 0 3% 0;
	padding:0;
	font-size:1.6em;
}

.white-module-full-content h2
{
	color:#d62521 !important;
	font-weight:bold;
	text-transform:uppercase !important;
	margin:0 0 3% 0;
	padding:0;
	font-size:1.6em;
}
.red-module-full-content h2
{
	color:#fff !important;
	font-weight:bold;
	text-transform:uppercase !important;
	margin:0 0 3% 0;
	padding:0;
	font-size:1.6em;
}
.grey-module-full-content h2
{
	color:#fff !important;
	font-weight:bold;
	text-transform:uppercase !important;
	margin:0 0 3% 0;
	padding:0;
	font-size:1.6em;
}
.orange-module-full-content h2
{
	color:#fff !important;
	font-weight:bold;
	text-transform:uppercase !important;
	margin:0 0 3% 0;
	padding:0;
	font-size:1.6em;
}

.white-module-full-content p{
	color:#AF231C !important;
}
.red-module-full-content p{
	color:#fff !important;
}
.grey-module-full-content p{
	color:#fff !important;
}
.orange-module-full-content p{
	color:#fff !important;
}

.white-module-full-content blockquote p {
    text-align: left;
    font-size: 26px;
    color: #d62521;
    width: 65%;
    margin-right: auto;
    margin-left: auto;
    padding: 2%;
}

.field-cb-body blockquote {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    margin-bottom: 0px !important;
}

.field-cb-body blockquote p {
    text-align: left;
    font-size: 20px !important;
    font-weight: bold !important;
    color: #d62521 !important;
    text-transform:none !important;
    width: 65%;
    margin-right: auto;
    margin-left: auto;
    padding: 2%;
}

.orange-module-full blockquote p {
    color: #fff;
}

.red-module-full blockquote p {
    color: #fff;
}

.red-module-medium blockquote p {
    color: #fff;
}

.grey-module blockquote p {
    color: #000;
}


.white-module a, .white-module-full a{
	color:#4b4b4b;
	text-decoration:none;
	font-weight:bold;
}

.white-module a:hover, .white-module-full a:hover{
	color:#ff8621;
}


.orange-module-full{
	/* background:url("../imgs/orange-content-bg.png") repeat-x; */
	padding-top:5%;
	padding-bottom:0%;
	padding-left:5%;
	padding-right:5%;
	overflow:hidden;
	text-align:center;
	color:#fff;

	
}


.grey-module{
	padding-top:5%;
	padding-bottom:0%;
	padding-left:5%;
	padding-right:5%;
	width:60%;
	height:100%;
	color:#fff;
	z-index:0;	
}

.red-module{
	background-color:#d62521;
}

.grey-module{
	background:#4d4d4d;
}

/*------------------ Stripes styles ------------------------------ */

.module-width-small{
	width:30%
}

.module-width-medium{
	width:67%
}

.module-width-large{
	width:90%
}

.module-width-full{
	width:100%
}

.module-linesbg-bottom-left{
	background-image:url("../imgs/diagonal-lines-bg.png");
	background-position:bottom;
	background-repeat:repeat-x;
	position:absolute;
	bottom:0px;
    left:0px;
	z-index:5;
	height:55px;
}

.module-linesbg-top-left{
	background-image:url("../imgs/diagonal-lines-bg.png");
	background-position:top;
	background-repeat:repeat-x;
	position:absolute;
	top:0px;
    left:0px;
	z-index:5;
	height:55px;
}

.module-linesbg-bottom-right{
	background-image:url("../imgs/diagonal-lines-bg.png");
	background-position:bottom;
	background-repeat:repeat-x;
	position:absolute;
	bottom:0px;
    right:0px;
	z-index:5;
	height:55px;
}

.module-linesbg-top-right{
	background-image:url("../imgs/diagonal-lines-bg.png");
	background-position:top;
	background-repeat:repeat-x;
	position:absolute;
	top:0px;
    right:0px;
	z-index:5;
	height:55px;
}

.module-img-left{
	left:0;
	padding:0 3% 3% 0;
	float:left;
}

.module-img-right{
	right:0;
	padding:0 0 3% 3%;
	float:right;
}

/* Timeline Elements */

.timeline-year-circle {
  height: 170px;
  width: 170px;
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  border-radius: 50%;
  background: #ff8621;
}

h4.timeline-year {
    color: #fff !important;
    font-size: 3.0em !important;
    font-style: italic !important;
    font-family: droid_serifregular;  
    margin-top: 10px !important;
    margin-right: 12px !important;
}

ul.nat-timeline .stpe-timeline__image {
  border: 0px !important;
  width: 170px !important;
  height: 100%  !important;
}

ul.nat-timeline .stpe-timeline__panel {
  padding-top: 30px !important;
  padding-bottom: 0px !important;
  width: 80% !important;
}

ul.nat-timeline .stpe-timeline__panel h4 {
    color: #ff8621 !important;
    font-size: 1.3em !important;
    font-weight: bold;
    font-style: italic !important;
    font-family: droid_serifregular;  
    margin-top: 10px !important;
    margin-right: 12px !important;
}

ul.nat-timeline li {
  margin-bottom: 0px !important;
}

ul.nat-timeline .stpe-timeline__heading {
  text-align: left;
}
ul.nat-timeline .stpe-timeline-body {
  text-align: left;
}

ul.nat-timeline .vertical-line-top {
  width: 3px;
  background-color: #d2d2d2;
  height: 25%; /* 30%; */
  margin-left:49%;
}

ul.nat-timeline .vertical-line-bottom {
  width: 3px;
  background-color: #d2d2d2;
  height: 100%;
  margin-left:49%;
}

div.timeline-row {
  height: 306px !important;
}

.stpe-timeline:before {
  background-color: white !important;
}

@media (min-width: 768px) {
  .stpe-timeline:before {
    background-color: white !important;
  }
  .stpe-timeline>li .stpe-timeline__image {
    left: 75% !important;
  }
  .stpe-timeline>li .stpe-timeline__panel {
    width: 60% !important;
  }
}
@media (min-width: 1200px) {
  .stpe-timeline:before {
    background-color: white !important;
  }
  .stpe-timeline>li .stpe-timeline__panel {
    padding-left: 100px !important;
  }
  .stpe-timeline>li .stpe-timeline__panel {
    width: 60% !important;
  }
}

/* Vertical Spacers */

.spacer1 { height: 1px; width: 100%; font-size: 0; margin: 0; padding: 0; border: 0; display: block; }
.spacer2 { height: 2px; width: 100%; font-size: 0; margin: 0; padding: 0; border: 0; display: block; }
.spacer3 { height: 3px; width: 100%; font-size: 0; margin: 0; padding: 0; border: 0; display: block; }
.spacer5 { height: 5px; width: 100%; font-size: 0; margin: 0; padding: 0; border: 0; display: block; }
.spacer10 { height: 10px; width: 100%; font-size: 0; margin: 0; padding: 0; border: 0; display: block; }
.spacer15 { height: 15px; width: 100%; font-size: 0; margin: 0; padding: 0; border: 0; display: block; }
.spacer20 { height: 20px; width: 100%; font-size: 0; margin: 0; padding: 0; border: 0; display: block; }
.spacer40 { height: 40px; width: 100%; font-size: 0; margin: 0; padding: 0; border: 0; display: block; }

/* Image Block Hover Effects */
.hover-image-blockZZ img {
    -webkit-filter:none;
    filter:none;
    -webkit-transition: all .3s;
    transition: all .3s;
}
.hover-image-blockZZ img:hover {
    filter: sepia(50%) hue-rotate(180deg) brightness(60%);
    -webkit-filter: sepia(50%) hue-rotate(180deg) brightness(60%);
    -webkit-transition: all .3s;
    transition: all .3s;
}

.hover-image-block .az-image
{
    position: relative !important;
    float: left !important;
}

.hover-image-block .az-image:before
{
    content: "" !important;
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    background: none !important; 
    -webkit-transition: all .3s;
    transition: all .3s;
}
.hover-image-block .az-image.dont-clear-content:before
{
    content: inherit !important;
}
.hover-image-block .az-image:hover:before
{
    background: rgba(214, 37, 33, 0.5) !important;
    -webkit-transition: all .3s;
    transition: all .3s;
}

/* 30th Birthday Styles */
.30th-red-panel .red-module-full-wrap {
    padding-top: 0px !important;
}

.module-wrapper.nat30special  img.img-responsive {
    max-width: inherit;
    width: 100%;
}

/* 30th anniversary content */
.page-node-818 .region-content h3, .wrap-containers .main-container h3 {
    font-family: Arial, Helvetica, sans-serif /*clear_sans_mediumregular*/;
    color: #F9423A;
    /* text-transform: capitalize; */
    font-size: 21px !important;
}

.page-node-818 .region-content .30th-red-panel-letsendit .callout {
    background-color: #d8081b !important;
}

.page-node-818 .region-content p, .wrap-containers .main-container p strong {
    font-family: Arial, Helvetica, sans-serif /*clear_sans_mediumregular*/;
}
.page-node-818 .region-content p, .wrap-containers .main-container callout.light p strong {
    font-family: Arial, Helvetica, sans-serif /*clear_sans_lightregular*/;
}

.page-node-818 form.webform-client-form-822 button.form-submit {
    padding: 5px 25px !important;
    background: none;
    border: 1px solid #fff !important;
    border-radius: 0;
    text-transform: uppercase;
}

ul.white-text li a {
    color: white !important;
    font-weight: bold;
    font-style: italic;
    text-decoration: none !important;
}
ul.white-text li a:hover {
    color: white !important;
    font-weight: bold;
    font-style: italic;
    text-decoration: none !important;
}

