@import url('//fonts.googleapis.com/css?family=Lato:300,300i,400,400i,700,700i');

/************ 
Red: #720B02
Gray: #b0b1b5
Navy: #000a2d
Black text: #414042

All Fonts = Lato
************/



/************ COLORS & FONTS *********/
:root { --main-color: #720B02; } /* Used for titles and buttons */
:root { --accent-color: #720B02; } /* Used for titles */
:root { --secondary-color: #720B02; } /* Used for links */
:root { --base-font-color: #333; } 

body {#414042; font-size: 1.1rem;}

/* DEFAULT FOR ALL */
h1, h2, h3, h4, h5, h6 { margin: .75rem 0; line-height: 1.3; font-weight: normal;}

/* SIZES */
h1 {font-size: 2.5rem; }
h2, h3, h4, h5, h6 { font-size: 2rem;}

/* FONTS */
body, p, h6 { font-family: 'Lato', sans-serif; }
h1, h2, h3, h4, h5 { font-family: 'Lato', sans-serif; }

/* STYLING */
h1 {color: #720B02; font-size: 2.5rem;}
h2 {color: #720B02; font-size: 2rem; border-bottom: 1px solid #333;}
h3 {color: #720B02; font-size: 2rem;}
h4 {background: #720B02; font-size: 1.75rem;color: white; border-radius: .2rem; padding: .1rem .4rem;}
h5 {color: #720B02; font-size: 1.5rem; text-transform: uppercase;}
h6 {color: #333; font-size: 1.5rem;}
a { color: #720B02 ; }
#g-above a { color: #ffffff ; }
#g-above a:hover { color: #b0b1b5 ; }

/************ CENTER SOCIAL MEDIA VERTICALLY  ************/

.g-block.size-8 { display: flex; justify-content: center; align-items: center; }

blockquote {
  color: #333;     
  padding: 0 0 0 15px;
  margin: 0 0 20px;
  border-left: 5px solid #d5d5d5;
  font: italic 16px/22px Georgia, Serif;
  line-height: 1.2;
  font-size: 1.3rem;
}

address {
  font-style: italic;
  font-weight: bold;
  font-size: 1.2rem;
  line-height: 1.2;
}

/************ BUTTONS  ************/
.readon, .button { 
  color: #720B02 !important; 
  font-size: 1rem;
  text-transform: none;
  font-weight: normal;
  background: #b0b1b5; 
  padding: .7rem 1.3rem; 
  border-radius: .5rem; 
  display: inline-block;
  font-weight: 500;
  line-height: 1.125rem;
  border: none;
  transition: all .2s ease-in;
}
.readon:hover, .button:hover {background: #777; color: white !important;}


/************ TABLES  ************/
.fancytable th {color: white; background: #720B02; border: 1px solid #720B02;}
.fancytable td { border: 1px solid #720B02;}

/************ TABLES  ************/

table, tr, td {border: none;}



/************ FLEX TABLE  ************/
table.flextable, .flextable tbody, .flextable tr {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}
 
.flextable td {
	display: list-item; 
    list-style-type: none;
	margin: 0px;
	padding: 10px 0 0 0;
}

@media only screen and (max-width: 767px) { 
	table.flextable, .flextable tbody, .flextable tr, .flextable td {display: block; width: 100%;}
	.flextable tr { border-bottom: 2px #ddd solid; } 
	.flextable td {text-align: center;}
}

/********** EQUAL TABLE ********************/
.equaltable { width: 100%; display: table; table-layout: fixed;}
.equaltable > tbody > tr { display: table-row;}
.equaltable > tbody > tr > td  {	display: table-cell; margin: 10px; width: 2%; border: 10px solid rgba(0,0,0,0); vertical-align: top; word-break: break-word;}
.equaltable td img {padding: 0px !important; margin: 0px !important;}

@media only screen and (max-width: 767px){ 
	.equaltable, .equaltable > tbody > tr, .equaltable > tbody > tr > td { display: block; table-layout:auto; width: 100%; border: none; margin: 0;}
	.equaltable img { display: block; margin: 0 auto;}	
}

/************ BREAKDOWN TABLES ON RESPONSIVE ************/ 
@media only screen and (max-width: 767px) { 
	#rt-mainbody table tr { border-bottom: 2px #ddd solid; } 
	#rt-mainbody table td { display: block; width: auto !important; } 
}


/************ ALERT ************/
.alert .g-content {padding: 0; margin: 0;}
.alert {border: none; padding: 0; margin: 0; background-color: #FFCFCF; color: #FF0000;}
.alert h1, .alert h2, .alert h3, .alert h4, .alert h5, .alert h6, .alert p { margin-left: 20px; color: red; background: transparent;}

@media only screen and (max-width: 767px) {.alert h1, .alert h2, .alert h3, .alert h4, .alert h5, .alert h6, .alert p { margin-left: 70px; color: red; background: transparent;}}



/************ HEADER AND MENU  ************/
/* MENU IN FLEX TABLE  - OPTIONAL CSS */
.g-main-nav ul.g-toplevel {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-around;
}

.g-main-nav .g-toplevel > li.g-parent .g-menu-parent-indicator:after {display: none; }
.g-main-nav .g-menu-item-title { font-weight: normal; text-transform: uppercase; letter-spacing: 1px; }
.g-main-nav .g-sublevel > li > .g-menu-item-container > .g-menu-item-content > .g-menu-item-title { text-transform: none; }

#g-navigation h1 { color: white; line-height: 1.1; }
#g-navigation .font-normal { font-weight: 300; font-size: 2rem;}

@media only screen and (max-width: 767px) { 
	#g-navigation h1, #g-navigation .font-normal {font-size: 1.6rem; }
}

/************ SIDE MENU  ************/

.sidebar-a .moduletable ul.nav.menu {
	background: #b0b1b5; 
	padding: 10px;
}

.sidebar-a .moduletable ul.nav.menu a { color: #720B02 }

.sidebar-a .moduletable .nav.menu > li {
	padding: 6px 0 6px 0;
	border-bottom: 1px #777 solid;
}

.sidebar-a .moduletable .nav.menu > li > a:hover, .sidebar-a .moduletable .nav.menu > li > ul.nav-child > li > a:hover {color: white; }

#g-mainbar .g-grid .sidebar-a .g-content {
	margin: 0 0 0.625rem 0.625rem;
	padding: .45rem 0 0.938rem 0.938rem;
}

	
/************ ROTATOR  ************/




/************ QUICKLINKS  ************/



/************ QUICKLINK PICS  ************/
.quicklinkpics {display: flex;}
.quicklinkpics > div {
	flex: 1; 
	height: 20vh; 
	max-height: 200px;
	position: relative; 
	transition: all .35s ease-in-out;
	margin: 0 1%;
}
.quicklinkpics > div > a { 
  position: absolute; 
  top: 0; bottom: 0; right: 0; left: 0; 
  font-size: 1.6rem; 
  background: rgba(114, 11, 2, .6);
  color: white;
  transition: all .35s ease-in-out;
}
.quicklinkpics > div > a > div { 
  position: absolute; 
  top: 0; bottom: 0; right: 0; left: 0; 
	border: 1px white solid; 
	margin: 5%; 
	text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;	
  transition: all .35s ease-in-out;
}

.quicklinkpics > div:hover > a > div { margin: 0; border: 1px rgba(255,255,255,.1) solid; }


.quicklinkpics > div:hover {
}
.quicklinkpics > div:hover > a {background: rgba(114, 11, 2, .8);;}

.quicklinkpics > div > div > img {
  object-fit: cover; 
  object-position: center;
  height: 200px;
  width: 100%;
}

@media only screen and (max-width: 767px) {
	.quicklinkpics { display: block; border-top: 10px #ffffff solid;}
	.quicklinkpics > div > a, .quicklinkpics > div > a > div { position: relative; }
	.quicklinkpics > div > div > img { height:  90px; width:  120px;}
	.quicklinkpics > div > a > div img { max-height: 90px; padding: 10px 0; }
	.quicklinkpics > div { display: flex; }
	.quicklinkpics > div { background: #464646; margin: 0;}
	.quicklinkpics > div > a { background: none; flex:1; }
	.quicklinkpics > div { height: auto; border-bottom: 1px #ffffff solid;}
	.quicklinkpics > div > a > div { border: none; }
	.quicklinkpics > div > a { display: flex;  align-items: center; justify-content: flex-start; }
	.quicklinkpics > div > a > div {  margin: 0 0 0 20px;}
	.quicklinkpics > div:hover > a > div {margin: 0 0 0 20px; border: none; }
}

/************ MODULES  ************/



/************ FOOTER  ************/

#g-footer a { color: white; }
#g-footer a:hover { color: #6592F7; }

#g-footer h1 { color: white; line-height: 1.1; }
#g-footer .font-normal { font-weight: 300; font-size: 2rem;}
#g-footer body, p {font-size: 1.1rem; }

@media only screen and (max-width: 767px) { 
	#g-footer { background: #720b02; }
	#g-footer h1, #g-footer .font-normal {font-size: 1.6rem; }
}


/************ HOMELAYOUT  ************/

#g-container-main { background: url(../images/homepage/background.jpg) 100% 100% no-repeat; background-size: 50%;}
#g-page-surround { position: initial; }
.g-container {width: auto; }

#g-container-main {
    margin: 0;
    padding-left: 10%;
    padding-right: 10%;
}

#g-container-main h3.g-title, #g-feature h3.g-title {
	text-transform: none;
	border-bottom: 1px #720B02 solid;
	font-size: 1.75rem;
	font-weight: 500;
	letter-spacing: 0px;
	margin: 1.3rem 0 0.75rem 0;
}

#g-container-main .g-block.size-30 h3.g-title { text-align: center; }

#g-mainbar h4.sprocket-lists-title {
	background: none;
	color: #414042;
	text-transform: none;
	font-weight: 400;
	font-size: 1.4rem !important;
	border-bottom: 1px #b0b1b5 solid !important;
	border-radius: none !important;
	padding: 10px !important;
}

#g-mainbar li.active h4.sprocket-lists-title { border-bottom: none !important; padding-bottom: 0px !important; }
#g-mainbar li.active .sprocket-lists-item { border-bottom: 1px #b0b1b5 solid !important; }
#g-mainbar li.active .sprocket-padding: { padding-top: 0px !important; }

#g-mainbar h4.sprocket-lists-title .indicator {display: none; }

body #g-mainbar { line-height: 1.3; }

.sprocket-lists-title {border: none; border-radius: 0; }

.button a { color: #720b02; }


@media only screen and (min-width: 768px) and (max-width: 959px) {}

@media only screen and (max-width: 767px) {
	#g-container-main { background: url(../images/homepage/background.jpg) 100% 100% no-repeat; }
	#g-container-main { padding: 0 3%;}
}

/************ ALS CHANGES  ************/
#g-page-surround {height:  auto; min-height:  auto;}
#g-above .g-content, #g-above td, .home-mass h1 { padding: 0; margin: 0;}
.g-main-nav { padding-top: 12px; padding-bottom: 20px;}

#g-above, #g-above h1 { color: white; text-shadow: 1px 1px 3px #000 ;}

#g-navigation { z-index: 1; position: relative;}

.sprocket-features-img-container { background: black;}

#g-navigation, .layout-slideshow .sprocket-features-img-container img {height: 100vh !important;}

.layout-slideshow .sprocket-features-img-container img {
  object-fit: cover; 
  object-position: center;
  width: 100%;
  opacity: .7;
}

#g-navigation .g-block > .g-content { padding: 0; margin: 0;}

.g-toplevel  li  a { color: white;}
.g-toplevel  li  a:hover { color: rgba(255,255,255,.8) ;}
.g-main-nav .g-standard .g-fade-in-up.g-active {     background: rgba(0,0,0,.8); } 

#g-above img { width: 40vw;}
.home-mass h1 { font-size: 2.5vw;}
.home-mass p { font-size: 1.45vw;}

#g-above { background: #720B02;}
.homelayout #g-above { background: white;}

#g-above > .g-grid:nth-child(3) > .g-block { display: flex; align-items: center; justify-content: center; }

@media only screen and (min-width: 768px)  {
	.homelayout #g-above { z-index: 2; position: absolute; top: 0; right: 0; bottom: 3%; left: 0; display: flex; flex-direction: column; background: none;}
	#g-above .g-grid:nth-child(3) { flex: 1; }
}

@media only screen and (max-width: 767px) {
		#g-navigation, .layout-slideshow .sprocket-features-img-container img {height: 20vh !important;}
		.homelayout #g-above { background: #720B02; }
		#g-above img { width: 80vw;}
		.quicklinkpics > div > a > div { text-align: left;}	
		h1 { font-size: 1.75rem;}	
}


/************ HOVER NEWS  ************/
#g-feature .button { background: #b0b1b5;}

.sprocket-strips-container { display: flex; justify-content: center; }
.sprocket-strips .readon span { font-size: 1.5rem;}
.sprocket-strips { position: relative; }
.sprocket-strips-item { background: url(../images/template/article.png) 0 0 no-repeat; }

.sprocket-strips-arrows .arrow { background: none; color: rgba(0,0,0,.5); font-size: 5rem; box-shadow: none;}
.layout-slideshow .sprocket-features-pagination li, .layout-slideshow .sprocket-features-arrows .arrow {box-shadow: none; }
.layout-slideshow .sprocket-features-arrows .arrow { top: 50%;}
.sprocket-strips .sprocket-strips-nav .arrow { position: absolute; top: 50% }
.sprocket-strips .sprocket-strips-nav .arrow.next { right: -50px; }
.sprocket-strips .sprocket-strips-nav .arrow.prev { left: -50px; }
.sprocket-strips-content > a.readon { position: absolute; top: 0; right:0; bottom: 0; left: 0; background: none; display: flex; justify-content: center;  align-items: center; }
.sprocket-strips-item { position: relative; }
.sprocket-strips-item .readon { padding: 0; margin: 0;}
.sprocket-strips-item .readon:hover { background: rgba(114,11,2,0.9);}
.sprocket-strips-item .readon span  { flex: 1; text-align: center; transition: all .2s ease-in; opacity: 0; }
.sprocket-strips-item .readon:hover span  { opacity: 1; }
.sprocket-strips-content h4 { 
	position: absolute; left: 0; right: 0; bottom: 0; 
	background: rgba(114,11,2,0.85); font-size: 1.4rem; text-shadow: 1px 1px 3px rgba(0,0,0,.5); 
	margin-bottom: 0px; min-height: 72px; text-align: center; transition: all .2s ease-in; border-radius: 0 0 .5rem .5rem; 
	display: flex;   align-items: center;   justify-content: center;
}
.sprocket-strips-item { box-shadow: 0px 0px 10px rgba(0,0,0,0.35); }
.sprocket-strips-content h4 a { color: white; }
.sprocket-strips-item { height: 24vw; border-radius: .5rem; }
.sprocket-strips .cols-4 > li { width:  19%;}
.sprocket-strips-container > li { margin: 10px 3%;}
.sprocket-strips-item:hover .sprocket-strips-content h4 { opacity: 0;}
.sprocket-strips-item { background-position: 50% 50%; background-size: cover; }
.sprocket-lists-title { padding: 15px 10px !important;}
.sprocket-lists-item .sprocket-padding { padding-top: 0px;}

@media only screen and (max-width: 767px) {	
	.sprocket-strips-container { display: block; }	
	.sprocket-strips .cols-4 > li { width: 43%; float: left; }
	.sprocket-features-content img { display: none;}
	.sprocket-strips .sprocket-strips-nav .arrow.next { right: -20px; }
	.sprocket-strips .sprocket-strips-nav .arrow.prev { left: -20px; }
	.sprocket-strips-item { height: 45vw;  }
}
