@charset "utf-8";
/* CSS Document */

* {
	margin: 0;
	padding: 0;
	}
.clear {
	clear: both;
	}
ul li {
	list-style: none;
	}
a {
	text-decoration: none;
	}
input[type=text] {
	border: 1px solid #d3d3d3;
	}

.Wrapper {
	margin: 0 auto;
	width: 960px;
	}
.ColorSpectra {
	width: 725px;
	}
	
.NavMenuWrap a, .ColorBoxWrap {
		font: 13px Arial, Helvetica, sans-serif !important;
		}
iframe {
	border: 0;
	overflow-x: scroll;
	  /*overflow-y: hidden;*/
	}
.NavMenuWrap {
	border: 1px solid #d3d3d3;
	margin: 40px 0 0;
	position: relative;
	border-bottom:0px;
	}
.NavMenuWrap a {
	color: #666666;
	display: block;
	}
	.NavMenuWrap ul li.Choose {
		height: 30px;
		}
	.NavMenuWrap ul li.Choose a {
		padding-left: 10px;
		}
	a.choose {
		line-height: 30px !important;
		}
	.NavMenuWrap ul li ul {
		display: none;
		position: absolute;
		z-index: 100;
		}
	.NavMenuWrap ul li.Choose:hover ul.NavMenu {
		display: block;
		}
ul.NavMenu {
	min-width: 250px;
	position: relative;
	}
ul.NavMenu li {
	background: #f2f2f2 url(../images/bgrep/nav-menu--.gif) repeat-x 0 0;
	border: 1px solid #d3d3d3;
	border-top: 0;
	min-height: 25px;
	padding-right: 5px;
	width: 265px;
	}
ul.NavMenu li:first-child {
	border-top: 1px solid #d3d3d3;
	}
ul.NavMenu li a {
	background: url(../images/icons/navmenu-arrow.png) no-repeat right -12px;
	display: block;
	font-size: 11px !important;
	line-height: 25px !important;
	text-align: right;
	padding-right: 15px;
	text-transform: uppercase;
	}
	
ul.NavMenu li a:hover {
	background: url(../images/icons/navmenu-arrow.png) no-repeat right 7px;
	color: #ee2e24;
	}
ul.NavMenu li:hover a {
	color: #ee2e24;
	}
	ul.NavMenu li ul {
		display: none;
		position: absolute;
		left: 270px;
		bottom: 0px;
		z-index: 1;
		padding-left: 5px;
		}
	ul.NavMenu li:first-child ul {
		top: 0px;
		}
	ul.NavMenu li:hover ul {
		display: block;
		}
	ul.NavMenu li ul li {
		width: 150px;
		}
	ul.NavMenu li ul li:hover {
		border: 1px solid #333333;
		}
		ul.LargeWidth li {
			width: 235px !important;
			}
	ul.NavMenu li ul li,
	ul.NavMenu li ul li a {
		background-image: none;
		}
	ul.NavMenu li:hover ul li a {
		color: #333333;
		}
	ul.NavMenu li ul li a {
		color: #333333;
		font-size: 11px;
		padding-left: 10px;
		text-align: left;
		}
	ul.NavMenu li ul li a:hover {
		color: #333333;
		background-image: none;
		}
	ul.NavMenu li ul li ul {
		left: 160px;
		top: -1px;
		}
/* Colors */
.BlackFont a {
	color: #333333 !important;
	}
.WhiteFont a {
	color: #ffffff !important;
	}
ul li.BluePurple {
	background-color: #8481ae;
	}
ul li.OrangeRed {
	background-color: #fb8758;
	}
ul li.YellowsGreen {
	background-color: #505d4b;
	}
ul li.YellowGreen {
	background-color: #e9d959;
	}
ul li.CreamBrown {
	background-color: #a07958;
	}
ul li.PinkPeach {
	background-color: #d3916e;
	}

/* 2nd */	
ul li.Blue {
	background-color: #7bb8d9;
	}
ul li.BlueGreen {
	background-color: #008eb8;
	}
ul li.Brown {
	background-color: #cba37e;
	}
ul li.Grey {
	background-color: #cccccc;
	}
ul li.Orange {
	background-color: #ffb239;
	}
ul li.Pink {
	background-color: #feafc2;
	}
	
ul li.Red {
	background-color: #c13d44;
	}
ul li.Violet {
	background-color: #8c75a2;
	}
ul li.White {
	background-color: #f5f2e6;
	}
ul li.Whites {
	background-color: #c09fb7;
	}
ul li.Yellow {
	background-color: #ffeb7a;
	}
ul li.GreenYellow {
	background-color: #e9d959;
	}
	
ul li.BlueSilver {
	background-color: #bdbad5;
	}
ul li.Gold {
	background-color: #f5af50;
	}
ul li.GoldenGreen {
	background-color: #818b4c;
	}
ul li.GreenSilver {
	background-color: #ebdea7;
	}
ul li.PinkSilver {
	background-color: #f1a2a7;
	}
ul li.PureSilver {
	background-color: #fcf5ed;
	}
	
ul li.VioletSilver {
	background-color: #9e80be;
	}
ul li.YellowSilver {
	background-color: #ffac7a;
	}
	
ul li.PreGE {
	background-color: #ecfae7;
	}
ul li.PreSGE {
	background-color: #edece5;
	}
ul li.TractorSAD {
	background-color: #fff4d9;
	}


ul li.Silver {
	background-color: #ebe0da;
	}
	
ul li.Green {
	background-color: #009966;
	}


/* ColorBox */
.ColorBoxWrap {
	border: 1px solid #d3d3d3;
	}
.ColorBox {
	min-height: 300px;
	padding: 10px 0px 10px 10px;
	background:#FFFFFF;
	}
.ColorBox ul li {
	border: 1px solid #d3d3d3;
	float: left;
	margin: 0 10px 10px 0;
	padding: 3px;
	}
.ColorBox ul li a {
	display: block;
	width: 119px;
	height: 50px;
	}
.ColorBox ul li span {
	color: #666666;
	font-size: 11px;
	}
.BoxHead {
	background: #f2f2f2;
	height: 25px;
	line-height: 25px;
	padding-left: 10px;
	}
/* Colors */
.SubtleGreen {
	background-color: #d1efea;
	}
.FreshMint {
	background-color: #d0f0e9;
	}
.MysticalGreen {
	background-color: #dbebe5;
	}
.BabyAqua {
	background-color: #bfeae6;
	}
.GreenIcicle {
	background-color: #bfede6;
	}
.Oasis {
	background-color: #bde4db;
	}
	
.BlueHarmony {
	background-color: #edefef;
	}
.SoftStream {
	background-color: #d0d9e3;
	}
.MountainSpring {
	background-color: #d9dde0;
	}
.BrushStroke {
	background-color: #e3e7ea;
	}
.Fairytale {
	background-color: #dde5ef;
	}
.BreezyBlue {
	background-color: #c2cfe0;
	}


.ColorBox ul li a {
	position: relative;
	}
.ColorBox ul li a span.Code {
	background: #ffffff;
	border-radius: 0 10px 0 0;
	bottom: 0;
	display: none;
	left: 0;
	opacity: 0.7;
	padding: 1px 15px 1px 5px;
	position: absolute;
	z-index: 1;
	}
	

/* MyShortList */
.MyShortList {
	border: 1px solid #d3d3d3;
	border-bottom: 0;
	border-radius: 10px 10px 0 0;
	height: 25px;
	padding: 0px 15px;
	position: absolute;
	z-index: 1;
	top: -26px;
	right: 10px;
	}
.MyShortList a {
	padding-top: 2px;
	}
	
/* Close */
.ColorBox ul li {
	position: relative;
	}
.ColorBox ul li a.Close {
	background: url(../fancybox/source/icons/close.png) no-repeat 0 0;
	display: none;
	height: 9px;
	left: 42px;
	position: absolute;
	top: 6px;
	z-index: 1;
	width: 9px;
	}
.ColorBox ul li a:hover span,
.ColorBox ul li:hover a.Close {
	display: block;
	}
	

/* ColorShade */
.noborderright {
	border-right: 0 !important;
	}
.ColorShade .BoxModule1 {
	/*border-right: 1px solid #d3d3d3;
	margin-right: 5px;
	padding-right: 5px;*/
	margin-right: 10px;
	float: left;
	width: 219px; /* 218px if border */
	}
.ColorShade ul li {
	margin-left: 10px;
	}
.ColorShade ul li,
.ColorShade ul li a {
	width: 172px;
	}
.Featured ul li {
	height: 195px;
	}
.Featured ul li a {
	height: 175px;
	}
.ColorShade .ColorBox {
	min-height: 195px;
	}
.Similar ul li {
	height: 85px;
	margin-bottom: 16px;
	}
.Similar ul li a {
	height: 65px;
	}
.Combination ul li {
	height: 52px;
	margin-bottom: 10px;
	}
.Combination ul li a {
	height: 32px;
	}
	
/* ColourNameCode */
.ColourNameCode {
	width: 230px;
	}
.SpectraBulletinAdm {
	padding: 10px;
	}
.ColourNameCode table tr th {
	background-color: #f2f2f2;
	}
.ColourNameCode table tr th,
.ColourNameCode table tr td {
	font-size: 12px;
	text-align: left;
	padding: 2px;
	}

/* Button */
.Button {
	background-color: #ff2219;
    background-image: linear-gradient(to bottom, #ff2219, #e10c00);
    background-repeat: repeat-x;
	border: 1px solid #c10a00;
	border-radius: 4px;
	color: #ffffff !important;
	padding: 5px 10px;
	}

.Button:hover {
	background: #dd0b00;
	text-decoration: none;
	}
	
/* editDelete */
.ColorShade {
	height: 270px;
	/*position: relative;*/
	}
.editDelete {
	bottom: 0;
	position: absolute;
	width: 200px;
	left: 20px;
	z-index: 1;
	}
.editDelete a {
	color: #666666;
	}
.editDelete a img {
	margin-right: 15px;
	opacity: 0.4;
	}
.editDelete a img:hover {
	opacity: 0.8;
	}
	
/* fancybox - popup */	
.fancybox-wrap {
	top: 45px !important;
	}
.searchBoxWrap {
	/*border: 1px solid #d3d3d3;*/
	border-bottom: 0;
	float: left;
	margin: 95px 0 0 20px;
	padding: 5px;
	}
.searchBox {
	float: right;
	}
.searchBox input[type=text] {
	background: #f2f2f2;
	border: 1px solid #cccccc !important;
	height: 25px;
	padding: 0 5px;
	width: 110px;
	}
.searchBox input[type=text]:focus {
	background: #ffffff;
	-moz-transition: 0.3s all ease-in;
	-webkit-transition: 0.3s all ease-in;
	-o-transition: 0.3s all ease-in;
	transition: 0.3s all ease-in;
	width: 150px;
	}


/* ShadeSearch */
.ShadeSearch {
	background: #ffffff;
	border: 1px solid #d3d3d3;
	font-size: 13px;
	padding: 15px;
	}
.ShadeSearch .BoxHead {
	background: none;
	background: url(../images/icons/search.png) no-repeat 5px 4px;
	margin-bottom: 10px;
	padding-left: 30px;
	}
.ShadeSearch input[type=text] {
	margin-bottom: 10px;
	}
.ShadeSearch .RadioBtn {
	margin-bottom: 5px;
	}
.ShadeSearch .SubBtn {
	margin-top: 10px;
	}