/*
    --------------------------
	Global Styles
	--------------------------
*/

/*  Custom Classes
--------------------------  */

.hidden	{ display: none; }
.invisible	{ visibility: hidden; }
.clear	{ clear: both; }
.bold	{ font-weight: 700; }

.centre	{ text-align: center; }
.left { float: left; }
.right { float: right; }

img.left    { margin-right: 1em; }
img[style*="left"]  { margin-right: 1em; }
img[style*="right"]  { margin-left: 1em; }

.red    { color: #ed1c24; }
.burgundy    { color: #c1272d; }
.green { color:#638b68; }
strong { font-weight: 700;}
/*  Typography 
--------------------------  */

article, aside, figure, footer, header, hgroup, nav, section    { display: block; }

body	{ font-family: 'Roboto Slab', serif;  color: #000; background-color: #f1f1f1; text-align: center;  color: #231f20;}
h1 		{ font-size: 1.75em;    color: #980e45; font-weight: 700;    margin: 0px 0px 0.5em 0px;     text-transform: uppercase; }
h2 		{ font-size: 1.25em;    color: #980e45; font-weight: 700;    margin: 0px 0px 0.15em 0px;    text-transform: uppercase; }
h3 		{ font-size: 1em;       color: #000;    font-weight: normal; margin: 0px;                   text-transform: uppercase; }
h4 		{ font-size: 1em;       color: #000;    font-weight: normal; margin: 0px;                   text-transform: uppercase; }
h5 		{ font-size: 0.95em;    color: #000;    font-weight: normal; margin: 0px;                   text-transform: uppercase; }
h6 		{ font-size: 0.95em;    color: #000;    font-weight: normal; margin: 0px;                   text-transform: uppercase; }

hgroup      { margin: 0px 0px 1em 0px; }
hgroup h1   { margin: 0px; }
hgroup h2   { margin: 0px; }
hgroup h3   { margin: 0px; }

p, li, td, dd, label, input, textarea, select { font-size: 0.75em;line-height: 1.5em; }
li li, li p, li input	{ font-size: 1em; }

p		{ margin: 0px 0px 1em 0px; font-size: 0.78125em; }
a		{ text-decoration: none; color: #980e45; }
a:hover	{ text-decoration: underline; }
img     { border: 0px; }
input, select, textarea   { font-family: 'Roboto Slab', serif;  }
strong  { font-weight: 700; }

table   { width: 100%; background-color: #f7f7f7; margin-bottom: 1.5em; }
table thead { font-weight: 700; }
table  tr td    { padding: 0.5em 0px; border-left: solid 4px transparent; text-align: center; }
table thead tr td { background-color: #dbdbdb; text-transform:capitalize; border-color:#fff; }
table tr td:first-child    { border-left: none; }
/*table td:first-child    { border-left: none; }*/
table tbody tr td      { border-bottom: 2px solid #dbdbdb; background-color: #fff; }
table tbody tr:first-child td      { padding-top:1.125em; }


/*  Structure 
--------------------------  */
body	{ width: 100%; margin: 0px; padding: 0px; background-color: #968880;}

div.outer   {  width: 64.125em; margin: 0px auto; padding: 0px; }
div.outer div.inner    { float: left; background-color: #fff; min-height: 5em; padding: 1em 1.875em;}

header , div.body div#scrollmenu { width: 60.375em;   /*padding-bottom: 1.625em*/; background-color: #ffffff; height: 5.3125em;  z-index:2; position: relative;}

header div.contact  { float: right; display: inline-block;  font-weight: 400; font-size: 1em; /*padding: 0px 0px 1em 0px;*/ width: 100%; text-align: right; }
header div.contact span  {  margin-top: 0.3em;  float: right;  border-right: 1px solid #e46f1c; color: #e46f1c; padding-right: 1em; }

header div.contact span.country  {  width: auto;  margin-left: 1em; margin-top: 0px; border: none; padding-right: 0px;}
header div.contact span.country a   {  margin-left: 0.75em; display: inline-block; float: left; }
header div.contact span.country a:first-child   {  margin-left: 0px; }
header div.contact span.country a img   {  float: left }


header a.logo, div.body div#scrollmenu a.logo { float: left; display: inline-block; margin: 0px 1.875em 0px 0px; width: 14.5em;  }
header a.logo img, div.body div#scrollmenu a.logo img  { float: left; width: auto;}

header nav, div.body div#scrollmenu nav   { position: relative; width: auto; float: left;  /*width: 44em;*/}
header nav ul, div.body div#scrollmenu nav ul  { width: 100%; padding: 0px; margin: 0.5em 0px; list-style-type: none; text-transform: uppercase;  float: left;  text-align: left ;  }
header nav ul li, div.body div#scrollmenu nav ul li  { display: inline;  padding: 0px 1em; border-right: 1px solid #000;  font-size: 0.78em;  font-family: "minion-pro",sans-serif; font-style: normal; font-weight: 700;}
header nav ul li:first-child, div.body div#scrollmenu nav ul li:first-child  { border-left: 1px solid #000; }
header nav ul li a, div.body div#scrollmenu nav ul li a   { color: #534f4c; padding-bottom: 0.25em; text-decoration: none; }
header nav ul li a:hover, div.body div#scrollmenu nav ul li a:hover  { text-decoration: none; color: #7a1618; }


/*div.body  {  margin-top: 5.75em; z-index: -1}*/

div.body div#scrollmenu {  z-index: 1; position: fixed; height: auto ; top: 0px; padding-top: 1em; padding-bottom: 1em; }


div.body div.banner  {  width: 100%; clear: both; float:left; padding-bottom: 4.75em}
div.body div.banner section {  height: 21.5625em; overflow: hidden; background-color: #e0e0e0;  width: 23.75em; padding: 0px; }
div.body div.banner section:first-child { background-color: #f1f1f1; text-align: center; /*width: 32.1875em;*/ height: 21.5625em;  width: 32.1875em; padding: 0px; float: left;  margin-right: 0.625em; }
div.body div.banner section:first-child div { float: left; height: 21.5625em; overflow: hidden; padding: 0px; width: 32.1875em;  position: relative;}
div.body div.banner section:first-child div img { width: 100%; }
div.body div.banner p.certificate  {  width: 100%; clear: both; float:left; margin-top: 0.5em; text-align: right;background-color: #E0E0E0; padding: 0.5em 0px; margin-bottom: 0px;}
div.body div.banner p.certificate a  {  font-weight: bold; margin-right: 2em;  font-size: 0.9em; }


div.body div.banner section.quality  { padding: 0.5em 1.5em 0.75em 2.25em; height: 20.375em; background: #e0e0e0 url('/msp/_resources/files/images/msp-genuine-t.png') no-repeat right top; } 
div.body div.banner section.quality p:first-child  {  width: auto; padding-right: 5.3125em; min-height: 5.3125em; padding-top: 1.5em; line-height: 2em; margin-bottom: 0px;} 
div.body div.banner section.quality p:first-child span { clear: both; color:#4287ba; font-size: 2.25em; font-family: "Garamond Premier Pro",Arial;  font-style: normal; display:  inline-block} 
div.body div.banner section.quality p:first-child span:first-child  {  font-style: italic;  color: #405e6e; } 

div.body div.banner section.quality ul { list-style-type: none; margin: 0px; padding:  0px; } 
div.body div.banner section.quality ul li  { clear: both; margin-bottom: 0.75em; border-bottom: 1px dotted #ccc; padding-bottom: 0.75em; background: transparent url('../../_resources/files/images/tick.png') no-repeat left 3px; padding-left: 2.4375em; } 
div.body div.banner section.quality ul li:first-child  { border-top: 1px dotted #ccc; padding-top: 0.75em;  background: url('../../_resources/files/images/tick.png') no-repeat left 10px; } 

div.body section, div.body footer    { float: left; width: 100%; padding: 4.75em 0px; text-align: left; background: url('../../_resources/files/images/section-border.jpg') repeat-x top center; }
div.body>section    { background: url('../../_resources/files/images/section-border.jpg') repeat-x top center, transparent url(/msp/_resources/files/images/msp-genuine.png) no-repeat bottom center; }
div.body section div   { width: 31.1875em; float: left; padding-right: 3.75em; padding-left: 1em; }
div.body section div h1    {color: #405e6e; font-weight: 700; text-transform: uppercase;  font-size: 1.1875em; }
div.body section aside   {   float: right; width: 24em;  background-color: #e0e0e0; }
div.body section aside img    { float: left; margin-top: 1.4375em;  max-width: 100%;}
div.body section aside img:first-child    { margin-top: 0px;}
div.body section aside p  { float: left; color:#442f09; font-size: 0.825em; line-height: 1.5em;  }
div.body section div ul   { margin: 0px; padding: 0px 0px 0px 1em; list-style-type: none; }
div.body section div ul li   { color: #231F20; background: url('../../_resources/files/images/li-bg.png') no-repeat  left 0.4em; padding-left: 1.5em; }

div.body section.selected   { padding-top: 6.75em;}

div.body section#about aside   { background-color: #fff;}

div.body section#why aside   { padding: 0px 2em 2em 2em; width: 20em; }
div.body section#why div ul li   { margin-bottom: 1.4375em; }
div.body section#why aside img    { margin:0px 0px 0.75em 0px;}
div.body section#why aside p     { line-height: 1.35em;  font-size:1.25em;  padding: 0px 0px 2em 0px;}
div.body section#why aside p:last-child     { padding-bottom:2em; margin-bottom: 0px; border-bottom: 0.375em solid #d3d3d3;  }

div.body section#why aside p span:first-child    { color: #b22c09;}
div.body section#why aside p span:nth-child(2)   { color: #7b2f09;}
div.body section#why aside p span:nth-child(3)    { color: #cd693d;}

div.body section#contact p  { width: 100%;clear: both; }
div.body section#contact p.ct   { margin-bottom: 2.4375em; float: left; }

div.body section#contact p.ct span, div.body section#contact p.ct span:nth-child(2n+3)    { display: inline-block; float: left; width: 5em; margin-right: 2em; margin-bottom: 0.25em; }
div.body section#contact p.ct span:nth-child(2n+2)   { width: auto;}
div.body section#contact p.ct span:nth-child(2n+3)   {clear: both; }



div.body section aside.bsp    { padding: 1em; width: 22em; margin-bottom: 0.5em;}
div.body section aside.bsp h1    { font-size: 0.75em; color:#902178;  border-bottom: 1px dotted #ccc; padding-bottom: 1em; margin-bottom: 1em; text-transform: capitalize; }
div.body section aside.bsp p.enquire     { margin-bottom: 0px;}
div.body section aside.bsp p.enquire a , div.body section aside.bsp.mail input[type="submit"]    { display:block; padding: 0.35em 2.5em; background-color: #902178; color: #fff;  border-radius: 0.25em 0.25em 0.25em 0.25em; font-size: 0.75em; font-weight: 700; } 
div.body section aside.bsp p.brochure a { display:block; padding: 0.35em 2.5em; background-color: #902178; color: #fff;  border-radius: 0.25em 0.25em 0.25em 0.25em; font-size: 0.75em; font-weight: 700; margin-right:0.5em; }
div.body section aside.bsp:nth-child(3) h1    {  color:#433f7f;  }
div.body section aside.bsp:nth-child(3) p.enquire span    {  background-color: #433f7f;   }

div.body section aside.bsp.mail h1    { color:#df6726; }
div.body section aside.bsp.mail form    { float: left; }
div.body section aside.bsp.mail input, div.body section aside.bsp.mail textarea {  clear: both;  width: 17em; float: left; margin-bottom: 1.25em;  padding: 0.5em; color:#414042; }
div.body section aside.bsp.mail input[type="submit"]   {  width: 8em; background-color: #df6726;  margin-top: 0.5em;  margin-bottom: 0.5em; border: none; }

/* Pop Up Overlay */
#overlay 
	{ visibility: hidden; position: absolute; top: 0; width: 100%; height:100%; margin: 0 auto; text-align:center; z-index: 1000; background: rgba(0, 0, 0, .7); }
#overlay > div 
	{ width:62em; margin: 6em auto 0; background-color: #fff; padding: 2em 1em; text-align:center; position: relative; }
#overlay > div > img 
	{ position: absolute; right: 2em; top: 0.6em; cursor: pointer; }
#overlay div.innerimage 
	{ float: left; width: 50%; overflow: hidden; margin: 1em; padding: 0; height: 349px; }
#overlay div.innerimage image 
	{ width: 100%; }
#overlay div.innertext 
	{ float: right; width: 45%; overflow: hidden; background-color: #e0e0e0; text-align: left; margin: 1em 1em 1em 0; padding: 0; position: relative; height: 349px; }
#overlay div.innertext > img 
	{ position: absolute; right: 1em; top: 1.5em; transform: rotate(10deg); }
#overlay div.innertext > div 
	{ padding: 0.5em 1em; background: none; text-align: left; }
#overlay div.innertext > div > span 
	{ padding: 0.15em 1.25em 0.05em 0.5em; background-color: #eb552d; color: #fff; font-family: "garamond-premier-pro",serif; font-weight: 600; font-style:italic; font-size: 1.5em; overflow: hidden; display: inline-block; }
#overlay div.innertext > div > h2 
	{ font-family: "garamond-premier-pro",serif; font-weight: 400; font-size: 2.25em; width: 55%; text-transform: none; color: #749ec3; margin: 0.5em 0 0.25em 0.3em; line-height: 1em; }
#overlay div.innertext > div > p
	{ font-size: 1.25em; width: 90%; font-weight: 300; margin-left: 0.5em; margin-bottom: 1.25em; }
#overlay div.innertext div.purple:first-of-type 
	{ width: 35%; float: left; padding-left: 0.6em; }
#overlay div.innertext div.purple:nth-of-type(2) 
	{ width: 20%; float: left; }
#overlay div.innertext div.purple:last-of-type 
	{ width: 42%; float: left; }
#overlay div.innertext div.purple > p 
	{ color: #903a90; font-size: 1em; line-height: 1.25em; }
#overlay div.innertext div.purple > p > span 
	{ font-weight: 700; }
#overlay div.bottom 
	{ width: 60em; clear: both; line-height: 1.25em; }
#overlay div.bottom > ul
	{ display: inline-block; margin: 0.5em 0 0 0; padding: 0; text-align: left; width: 93%; }
#overlay div.bottom > ul li
	{ display: inline; margin-left: 0.5em; font-size: 0.90em; }
#overlay div.bottom > ul li:before
	{ content:url(../files/images/tick.png); margin-right:0.5em; }
#overlay div.bottom > a
	{ float: right; }


/*----footer----*/
div.body footer { text-align: left; padding: 1em 0px 0px 0px; }
div.body footer p  { font-size: 0.55em; color:#020000; font-weight: 400; font-size: 0.5em; margin-top: 5em; }
div.body footer p a  { float:right; font-size: 2em;  }
/*div.body footer p img  { float:right; border: 0px; margin-right: 1.5em; margin-top: -5em; }*/
div.body footer a.logo   { float:right; border: 0px; margin-right: 1em; margin-top: -3.5em; font-size: 1em;  }
div.body footer .chevlerlogo { font-size: 0.5em; text-align: center; float: right; margin-top: -7em; margin-right: 2.5em; }
div.body footer .chevlerlogo img { padding: 0px; }