/*
Theme Name: Signature Retail Services
Theme URI: http://signatureretailservices.com/
Description: Custom theme for SRS
Version: 1.0
Author: Medium Rare
Author URL: http://medrare.com/
Tags: 
*/

/* SRS Colors: red: #9f0000


9f0000


671100



*/

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

* {
	margin: 0;
	padding: 0;
	}

a {
	outline: none;
	}

a visited {color: #8fc3ea;}

a img {
	border: none;
	}

/* ======================== Page Layout Styles ========================= */

html {
	height: 100%;
	}

body {
	min-width: 960px;
	height: 100%;
	background: #121212;
	}

	#body-wrap {
		position: relative;
		width: 100%;
		height: 100%;
		margin: auto;
		background: #121212;
		}

/* HEADER */
	#spacer-wrap {
		position: relative; margin: auto;
		width: 100%; height: 18px;
		background: #4b4b4b url("images/srs-bg.gif");
		}
		
	#header-wrap {
		position: relative; margin: auto;
		width: 100%;height: 95px;
		background: #fff;
		border-top: solid 3px #000;
		border-bottom: solid 5px #333;
		}
		
		#header {
			position: relative; margin: auto;
			width: 960px; height: 140px;
			}

			#header-logo {
				position: absolute; display: block; text-indent: -9999px;
				left: 0px; top: 0px; width: 225px; height: 95px; padding: 0px;
				background: url("images/srs-logo.png") no-repeat;
				background-position: 0 0px;
				}
				
			#header-logo span {
				display: block;
				width: 225px; height: 95px; 
				cursor: pointer;
				}
			
			#header-logo:hover {
				background-position: 0 -95px;
				}
				
			#header-tabs {
				position: absolute; display: block;
				right: 8px; top: 20px;
				width: 500px; height: 25px;
				}	


				  #header-tab-applynow {
						  position: absolute; display: block;
						  right: 312px; top: 0px;		
						  height: 25px; width: 95px;
						  text-indent: -9999px;
						  background: url("images/applynow.png") no-repeat;
						  background-position: 0 0px;	
						  -webkit-transition: background 0.1s ease-out;
   						  -moz-transition: background 0.1s ease-out;
   						  -o-transition: background 0.1s ease-out;
						  }

				  #header-tab-sigengineered {
						  position: absolute; display: block;
						  right: 275px; top: 0px;		
						  height: 25px; width: 34px;
						  text-indent: -9999px;
						  background: url("images/ses.png") no-repeat;
						  background-position: 0 0px;	
						  -webkit-transition: background 0.1s ease-out;
   						  -moz-transition: background 0.1s ease-out;
   						  -o-transition: background 0.1s ease-out;
						  }
						  
				  #header-tab-login {
						  position: absolute; display: block;
						  right: 168px; top: 0px;	
						  height: 25px; width: 104px;
						  text-indent: -9999px;
						  background: url("images/employeelogin.png") no-repeat;
						  background-position: 0 0px;	
						  -webkit-transition: background 0.1s ease-out;
   						  -moz-transition: background 0.1s ease-out;
   						  -o-transition: background 0.1s ease-out;
						  }

				  #header-tab-facebook {
						  position: absolute; display: block;
						  right: 140px; top: 0px;		
						  height: 25px; width: 25px;
						  text-indent: -9999px;
						  background: url("images/icon-facebook.png") no-repeat;
						  background-position: 0 0px;	
						  -webkit-transition: background 0.1s ease-out;
   						  -moz-transition: background 0.1s ease-out;
   						  -o-transition: background 0.1s ease-out;
						  }

				  #header-tab-twitter {
						  position: absolute; display: block;
						  right: 112px; top: 0px;	
						  height: 25px; width: 25px;
						  text-indent: -9999px;
						  background: url("images/icon-twitter.png") no-repeat;
						  background-position: 0 0px;
						  -webkit-transition: background 0.1s ease-out;
   						  -moz-transition: background 0.1s ease-out;
   						  -o-transition: background 0.1s ease-out;
						  }

				  #header-tab-instagram {
						  position: absolute; display: block;
						  right: 84px; top: 0px;		
						  height: 25px; width: 25px;
						  text-indent: -9999px;
						  background: url("images/icon-instagram.png") no-repeat;
						  background-position: 0 0px;	
						  -webkit-transition: background 0.1s ease-out;
   						  -moz-transition: background 0.1s ease-out;
   						  -o-transition: background 0.1s ease-out;
						  }
				  #header-tab-google {
						  position: absolute; display: block;
						  right: 56px; top: 0px;		
						  height: 25px; width: 25px;
						  text-indent: -9999px;
						  background: url("images/icon-google+.png") no-repeat;
						  background-position: 0 0px;	
						  -webkit-transition: background 0.1s ease-out;
   						  -moz-transition: background 0.1s ease-out;
   						  -o-transition: background 0.1s ease-out;
						  }
				  #header-tab-pinterest {
						  position: absolute; display: block;
						  right: 28px; top: 0px;		
						  height: 25px; width: 25px;
						  text-indent: -9999px;
						  background: url("images/icon-pinterest.png") no-repeat;
						  background-position: 0 0px;	
						  -webkit-transition: background 0.1s ease-out;
   						  -moz-transition: background 0.1s ease-out;
   						  -o-transition: background 0.1s ease-out;
						  }
				  #header-tab-youtube {
						  position: absolute; display: block;
						  right: 0px; top: 0px;		
						  height: 25px; width: 25px;
						  text-indent: -9999px;
						  background: url("images/icon-youtube.png") no-repeat;
						  background-position: 0 0px;	
						  -webkit-transition: background 0.1s ease-out;
   						  -moz-transition: background 0.1s ease-out;
   						  -o-transition: background 0.1s ease-out;
						  }

				#header-tab-applynow:hover,#header-tab-sigengineered:hover, #header-tab-login:hover,
				#header-tab-facebook:hover, #header-tab-twitter:hover, #header-tab-instagram:hover,
				#header-tab-google:hover, #header-tab-pinterest:hover, #header-tab-youtube:hover {
					  background-position: 0 -25px;
					  }	
			
			#header-menu{
				position: absolute; display: block;
				right: 0px; top: 55px;
				height: 25px;
				/*background-color: #aaa;*/
				z-index:1000;
				text-align:right;
				}

				  #header-menu a, #header-menu a:visited, #header-menu a:active {
					  text-decoration: none;
					  color: #444;
					  }
					  
				  #header-menu a:hover {
					  text-decoration: none;
					  color: #9f0000;
					  }
			  
						  
				  #header-menu ul li {
					  list-style-type:none;
					  background-image: none;
					  padding: 0px;
					  line-height: 25px;
					  font-family: 'SignatureRetailRegular';
					  font-size:16px;
					  text-transform:uppercase;		
					  }

#sub-header-wrap {
		position: relative; margin: auto;
		width: 100%;height: 150px;
		background: #4b4b4b url("images/srs-bg.gif");
		padding: 9px 0px 9px 0px;
		}

#sub-header {
		position: relative; margin: auto;
		width: 950px; height: 140px;
		background-color: #450b00;
		border: solid 5px #fff;
		}
		
		#sub-header-title{
			position: absolute; display: block;
			left: 40px; top: 55px; width: 800px; height: 50px; padding: 0px;
			text-align:left;
			/*background: #0f0;*/
			}
			
			#sub-header-title h1 {
				color:#fff;
				font-size: 40px;
				text-transform:uppercase;
				}
	
/* CONTENT */

	#home-content-wrap {
		position: relative;
		width: 100%;
		margin: auto;
		/*background: #0f0;*/
		padding: 0px 0px 0px 0px;
		}



	#content-wrap {
		position: relative;
		width: 100%;
		margin: auto;
		/* background: #ccc; */
		background: #4b4b4b url("images/srs-bg.gif");
		padding: 0px 0px 9px 0px;
		border-bottom: solid 1px #999;
		}

	#content-onecolumn {
		position: relative;
		width: 920px;
		padding: 20px 20px 20px 20px;
		margin: auto; position: relative;
		clear:both;
		overflow:hidden;
		min-height: 480px;
		background: #fff;
		}
		
	#content-twocolumn {
		position: relative;
		width: 960px;
		margin: auto; position: relative;
		clear:both;
		min-height: 400px;
		background:url(images/srs-2column-bg.gif) repeat-y;
		}	
		
		#column-main { 
			margin: auto; position: relative;
			float: left; width: 576px;
			/*background: #ff0;*/
			padding: 30px 30px 30px 30px;
			/* border-top: 3px solid #444; */
			} 
			
		#column-side {
			margin: auto; position: relative;
			float:right; width: 295px;
			padding: 10px;
			/*background:#f0f;*/
			/* border-top: 2px solid #999; */
			}
			
		#blog-sidebar {
			list-style-type: none;
		 	background: none;
			}
			
		#column-side p {
			font-size: 12px;
			}
			
		#column-side-copy {
			margin: auto; position: relative;
			float:left; width: 195px;
			min-height:450px;
			padding: 10px  15px  10px  15px;
		    background:#F90;
			}
			
		#column-side-copy p {
			font-size: .8em;
			line-height: 1.5em;
			}
		
		.clearfloat { 
			clear:both;
			height:0;
			font-size: 1px;
			line-height: 0px;
			}
	
		
/* HOMEPAGE */

	  #home-content {
		position: relative; margin: auto;
		width: 960px; min-height: 660px;
		}
		
		#home-slideshow-wrap {
		position: relative; margin: auto;
		width: 100%; height: 420px;
		/*background:  #999;	*/
		background: #4b4b4b url("images/srs-bg.gif");
		}
		
		
/* -----------------  HOMEPAGE NEWS CALLOUT -------------------- */		
	  #home-slideshow{
		position: relative; margin: auto;
		width: 960px; height: 420px;
		top: 0px; left: 0px;
		/*background: #333;*/
		color: fff;
		}		
  
/* -----------------  BELOW SLIDESHOW -------------------- */
		#home-callouts-wrap {
		position: relative; margin: auto;
		width: 100%; height: 284px;
		background:  #fff;	
		border-top: solid 6px #9f0000;
		}
				
		#home-callouts {
		position: relative; margin: auto;
		width: 960px;
		height: 275px;
		}		
								
				#home-callouts  p {
					font-family: Arial, Helvetica, sans-serif
					font-size: 12px;
					line-height: 16px;
					color: #444;
					text-decoration: none;
					font-weight: normal;
					}

				#home-callouts p a, #home-callouts p a:visited, #home-callouts p a:active {
					text-decoration: none;
					color: #f00;
					}
			
				#home-callouts p a:hover {
					text-decoration: none;
					color: #333;
					}
					  
		#home-callout1 {
				position: absolute; display: block;
				top: 75px; left: 0px;
				width: 201px; height: 170px;
				padding: 15px 15px 15px 15px;
				border: 1px solid #999;
				background: #fff;
				z-index: 100;
				}
				
		#home-callout2 {
				position: absolute; display: block;
 				width: 201px; height: 170px;
				top: 75px; left: 0px;
				padding: 15px 15px 15px 15px;
				border: 1px solid #999;
				background: #fff;
				z-index: 100;
				}

				
		#home-callout3 {
				position: absolute; display: block;
				top: 75px; left: 0px;
				width: 201px; height: 170px;
				padding: 15px 15px 15px 15px;
				border: 1px solid #999;
				background: #fff;
				z-index: 100;
				}
				
		#home-callout4 {
				position: absolute; display: block;
				top: 75px; left: 0px;
				width: 201px; height: 170px;
				padding: 15px 15px 15px 15px;
				border: 1px solid #999;
				background: #fff;
				z-index: 100;
				overflow:hidden;
				}
		#home-callout4 ol li ul {	
				display: block;
				height: 130px;
				overflow:hidden;
				}	
		#home-callout4 ol li {	
				list-style: none;
				}	
				
#home-callout1-bg, #home-callout2-bg, #home-callout3-bg, #home-callout4-bg {
	position: absolute; display: block;
    height: 275px; width: 234px; top: 0px; 
	-webkit-transition: background 0.2s ease-out;
    -moz-transition: background 0.2s ease-out;
    -o-transition: background 0.2s ease-out;
	}

	  #home-callout1-bg {
		  left: 0px;
		  background:url(images/callout-rollover-1-off.png) no-repeat 0px 50px;
		  }
	  #home-callout2-bg {
		  left: 243px;
		  background:url(images/callout-rollover-2-off.png) no-repeat 0px 50px;
		  }
	  #home-callout3-bg {
		  left: 486px;
		  background:url(images/callout-rollover-3-off.png) no-repeat 0px 50px;
		  }
	  #home-callout4-bg {
		  left: 729px;
		  background:url(images/callout-rollover-4-off.png) no-repeat 0px 50px;
		  }
		  
	  #home-callout1-bg:hover {
		  background:url(images/callout-rollover-1-on.png) no-repeat 0px 0px;
		  }
	  #home-callout2-bg:hover {
		  background:url(images/callout-rollover-2-on.png) no-repeat 0px 0px;
		  }
	  #home-callout3-bg:hover {
		  background:url(images/callout-rollover-3-on.png) no-repeat 0px 0px;
		  }
	  #home-callout4-bg:hover {
		  background:url(images/callout-rollover-4-on.png) no-repeat 0px 0px;
		  }	
				
				
/* FOOTER */
	#footer-wrap {
		position: relative; width: 100%;
		background-color: #121212;
		height: 129px;
		}
		
	#footer {
		position: relative; margin: auto;
		width: 960px; 
		}
		

	#footer-callout1, #footer-callout2, #footer-callout3 {
		position: absolute;  display: block;
		width: 314px; height: 85px;	top: 9px;
		opacity: .60;
	    z-index:0;
	    filter: alpha(opacity=60)
		}

	#footer-callout1 {
		left: 0px;
		background: url(images/srs-callout1.png) no-repeat #fff;
		}
		
	#footer-callout2 {
		left: 323px;
		background: url(images/srs-callout2.png) no-repeat #fff;
		}

	#footer-callout3 {
		left: 646px;
		background: url(images/srs-callout3.png) no-repeat #fff;
		}		

			.footer-callout-left {
				position: absolute; display block;
				/*background-color: #00f;*/
				float: left;
				top: 16px; left: 16px;
				padding: 0px;
				font-family: 'SignatureRetailRegular';
				font-size: 28px;
				line-height: 26px;
				text-align:left;
				color: #999;
				}
			
			.footer-callout-right {
				position: absolute; display block;
				/*background-color: #f00;*/
				float:right;
				top: 10px; right: 10px;
				padding: 0px;
				font-family: Arial, Helvetica, sans-serif;
				font-size: 9px;
				line-height: 12px;
				text-align:right;
				color: #aaa;
				}


.clickable { /* Containing div must have a position value */
    position:relative;
}
.clickable a {
    position:absolute;
    width:100%;
    height:100%;
    top:0;
    left:0;
    text-decoration:none; /* Makes sure the link   doesn't get underlined */
    z-index:10; /* raises anchor tag above everything else in div */
    background-color:white; /*workaround to make clickable in IE */
    opacity: 0; /*workaround to make clickable in IE */
    filter: alpha(opacity=1); /*workaround to make clickable in IE */
}



	#footer-callout1:hover, #footer-callout2:hover, #footer-callout3:hover {
	    opacity: 1.0;
	    z-index:0;
	    filter: alpha(opacity=100); /*workaround to make clickable in IE */
		}


	  #footer-leftcopy {
		  position: absolute;  display: block;
		  top: 103px; left: 0px;
		  width: 637px; height: 17px;
		  /*background-color: #606;*/
		  }
		  
	  #footer-rightcopy {
		  position: absolute; display: block;
		  top: 103px; right:0px; 
		  width:314px; height: 17px;
		  text-align:right;
		  /*background:#0ff;*/
		  }
			  
	  .footer-copy, .footer-copy a, .footer-copy a:visited, .footer-copy a:active {
		  font-family: Arial, Helvetica, sans-serif;
		  font-size: 11px;
		  color: #666;
		  text-decoration: none;
		  vertical-align:bottom;
		  }
		  
	  .footer-copy a:hover {
		  color: #a00; 
		  text-decoration: none;
		  }
		
.button1 {
	font-family:'MuseoSlab500', sans-serif;
	font-size: 11px;
	background-color:#666;
	/*display:inline-block;*/
	color:#fff;
	font-weight:normal;
	padding:6px 12px;
	text-decoration:none;
	}.button1:hover {
	background-color:#f00;
	color:#fff;
	}.button1:active {
	position:relative;
	top:0px;
	right:0px;
	}		

.button2 {
	font-family:'MuseoSlab500', sans-serif;
	font-size: 9px;
	background-color:#666;
	
	-webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
	
    -webkit-transition: all 0.1s linear;
    -moz-transition: all 0.1s linear;
    -o-transition: all 0.1s linear;
    transition: all 0.1s linear;
	
    padding:10px 4px 0px 4px;
    display: block;
    text-align: center;


    color: #ffffff;
    font-weight: 100;

    height: 20px;
		text-decoration:none;
}
.button2:hover {
    background: #ff0000;
    font-size: 11px;

}
.button2:active {
    background: #a30000;
    -webkit-transition: font-size 0s linear;
    -moz-transition: font-size 0s linear;
    -o-transition: font-size 0s linear;
    transition: font-size 0s linear;
    -webkit-transform: translateY(2px);
    -moz-transform: translateY(2px);
    transform: translateY(2px);
}		

.shadow, #home-slideshow-wrap {
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.80);
    -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.80);
    -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.80);
	}
/* ======================== Contact Form ========================= */	


	#contact-address-layout {
		  position: relative; display: block;
		  top: 0px; left:0px; 
		  background:#ff;
		  float: left;
		  }

	#contact-form-layout {
		  position: relative; display: block;
		  top: 0px; right:0px; 
		  width:330px; min-height: 330px;
		  padding: 15px;
		  background: #d4d4d4;
		  float: right;
		  }
	
	#contact-form-layout ul li {
		  list-style-type: none;
		  background: none;
		  }
	
		.contact-form {
			/* background-color:#eee;
			border:none; outline: 0;
			padding: 5px;
			border: solid 1px #444;
			font-family: Arial, Helvetica, sans-serif;
			font-size: 12px;
			line-height: 14px;
			color: #9f0000;
			resize: none;
			width: 318px;
			margin-bottom: 0px; */
			}	
			
		.submit input {
			/*width: auto;
			padding: 9px 15px;
			background:#444;
			border: 0;
			font-size: 14px;
			color: #FFFFFF;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;*/
			cursor:pointer;
			float: right;
			}

		.submit input:hover {
			color:#fff;			
			background: #9f0000;
			}

		 
/* ========================================================= */

#retailclients {
	/* position: relative; display: block;*/
	width: 576px;
	background-color: #f0f;
	padding: 0px;
	}	

#retailclients ul li{
    display: block;
    width: 135px;
    float: left;
    margin: 0px;
	padding:0px 9px 9px 0px;
	line-height:0px;
	background: #fff;
	}
	
#supplierpartners {
	/* position: relative; display: block;*/
	width: 295px;
	background-color: #f0f;
	padding: 0px;
	}	

#supplierpartners ul li {
    display: block;
    width: 95px;
    float: left;
    margin: 0px;
	padding:0px 3px 3px 0px;
	line-height:0px;
	background: #fff;
	}
	
/* EMPLOYMENT VIDEO LINK ========================================================= */

#header-video-link {
	position: absolute; display: block;
	right: 0px; top: 48px;		
	height: 25px; width: 197px;
	text-indent: -9999px;
	background: url("images/sigretail-joinourteam.png") no-repeat;
	background-position: 0 -25px;	
	-webkit-transition: background 0.1s ease-out;
	-moz-transition: background 0.1s ease-out;
	-o-transition: background 0.1s ease-out;
	}

#header-video-link:hover {
	background-position: 0 0px;	
	}

/* EMPLOYMENT VIDEO Popup ========================================================= */

#vimeo-join-vid .modal-body {
	padding: 0;
	}

#vimeo-join-vid .modal-dialog {
	width: 900px;
	}

#vimeo-join-vid .modal-content {
	line-height: 0;
	margin-top: 100px;
	}

#vimeo-join-vid.modal {
	background-color: rgba(0,0,0,0.5);
	}

#vimeo-join-vid a.close {
	position: absolute;
   	top: -40px;
   	right: 0;
   	color: #eee;
   	opacity: 1;
   	font-size: 2em;
   	text-shadow: none;
	outline: none;
	text-decoration: none;
	}