/*** Pink Imp Stylesheet ***/

/* Reset */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video, min-height {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

html, body {margin:0; padding:0; width:100%; height:100%; overflow:hidden;}



/************************************* Common Settings *************************************/



img#bg {
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
} 

#sitecontainer {
	width: 100%;
	height: 100%;
	overflow: hidden;
}

a { text-decoration: none; color: #F4C; outline:none; }
a:hover { color: #F9C; }
h1 { color: #fff; font-size:14px !important; }
h2 { color: #fff; font-size:14px !important; margin:-5px 0 5px 0; padding-bottom:12px; height:13px; font-weight:bold; }
h3 { color: #fff; font-size:14px !important; margin:-5px 0 5px 0; padding-bottom:12px; height:13px; }
h4 { color: #fff; font-size: 11px; font-weight:bold; line-height:18px; padding-bottom: 5px; }
p { color: #fff; font-size:13px; line-height:1.3em; margin-bottom:15px; }
.pointer { cursor: pointer; }

body {
	padding: 0;     
	margin: 0;  
	font-size:70%;
	color: #CCC;
	background: #9c9c9c /*url(../images/bg2.jpg) 100% 100% no-repeat*/;
	background-attachment: fixed;
	border:0px;
}

body,input,textarea {
	/*font-family: helvetica, arial, sans-serif;*/
	font-family: 'Segoe Light', 'Segoe UI Light', Segoe, 'Segoe UI', Arial, sans-serif;
	font-size: 10px;
	color: #7f7e7e;
}

#centermaincontent { /* Main center container */
	width: 100%;
	height: 580px;
	overflow: hidden;
	border:0px;
}



/************************************ Welcome Layout ************************************/

#welcomeContainer {
	width:295px;
	height:90px;
	margin: 50px auto 0 auto;
	border:0px;
}

#welcomeText {
	width:295px;
	height:20px;
	margin-top:5px;
	font-size: 10px !important;
	text-align:center;
	color: #000;
}

#welcome {
	width:295px;
	height:38px;
	margin-left:5px;
}

#welcome #intro {
	float:left;
	width:295px;
	height:38px;
	background: transparent url("../images/pinkimp_logo_full.png") no-repeat left top;
}



/************************************* Header Layout *************************************/



/*** Header ***/

#headerContainer {	
	width: 970px;
	height: 42px;
	margin: 0 auto 5px auto;
}	

#header {
	margin:0;
	margin-left:-50px;
}

#header #logo {
	float:left;
	width:170px;
	height:22px;
	overflow:hidden;
	background: transparent url("../images/pinkimp_logo.png") no-repeat left top;
}

.noJS #header #logo:hover {
	opacity:0.7;
}



/*** Main Navigation ***/

#nav {
	float:left;
	width: 430px;
	height: 20px;
	font-size: 16px;
	font-weight: regular !important;
}

#nav ul {
	float:left;
	list-style:none;
}

#nav ul li {
	display:inline;
}

#nav ul li a {
	float:left;
	height:20px;
	margin:0 10px 0 0;
	color: #000;
}

#nav a:hover { 
	color: #fff;
}

#nav .selected { 
	color: #fff;
}

.noJS #nav ul li a:hover {
	opacity:0.5;
}

#a, #b, #c, #d, #e { margin-left:-7px; }



/*** Social Icons ***/

#social {
	float:right;
	width:64px;
	margin-top:3px;
}

#social #twitter {
	float:left;
	width:23px;
	height:18px;
	background: transparent url("../images/twitter.png") no-repeat left top;
	opacity:0.7;
}

#social #vimeo {
	float:left;
	width:23px;
	height:18px;
	background: transparent url("../images/vimeo.png") no-repeat left top;
	opacity:0.7;
}

#social #mail {
	float:left;
	width:18px;
	height:18px;
	background: transparent url("../images/mail.png") no-repeat left top;
	opacity:0.7;
}

.noJS #social a:hover { }



/*** Sub Navigation ***/

#subnav {
	float:left;
	width: 560px;
	height: 18px;
	font-size:14px;
}

#subnav ul {
	float:left;
	list-style:none;
}

#subnav ul li {
	display:inline;
}

#subnav ul li a {
	float:left;
	height:22px;
	margin:0 20px 0 0;
	color: #000;
}

#subnav a:hover { 
	color: #fff;
}

#subnav .selected { 
	/*color: #cb0081;*/
	color: #fff;
}

#h, #i, #j, #k, #l { margin-left:-8px; }



/************************************* Body Layout *************************************/

#content {
	width:970px;
	height:530px;
	margin:0 auto;
	overflow: hidden;
	/*border:1px solid #fff;
	background: #666; 
	background: rgba(0, 0, 0, 0.6);
	border: 1px solid #fff;*/
}

#contentScroller {
	width:12000px;
}

.page {
	float:left;
	width:970px;
	height:530px;
	margin:0px 970px 0px 0px;
}

.pageinner {
	width: 970px;	
	height: 530px;
	overflow: hidden;
}




/************************************* Content *************************************/



/*** Home Page ***/

#featurecontainer {
	width:640px;
	height:360px;
	float:left;
	margin:5px 0 15px;
	background:rgba(0,0,0,0.4);
	text-align:left;
}

#homepage {
	width: 270px;
    height: 320px;
    padding: 20px;
    background: rgba(0,0,0,0.4);
    float: right;
    margin: 5px 0 15px 0;
    text-align: justify;
}

#homenews {
	width: 948px;
	height: 120px;
	padding:10px;
	background:rgba(0,0,0,0.4);
	border:1px solid #CCC;
	float:left;
	margin:5px 15px 15px 0;
	text-align:justify;
}

.feature {
	width: 307px;
	height: 173px;
	margin:5px 11px 0 0;
	border:1px solid #999;
	background:rgba(0,0,0,0.4);
	float:left;
}

.feature:hover { border:1px solid #ccc; }

.featureright {
	width: 306px;
	margin:5px 0;
	height: 173px;
	border:1px solid #444;
	background:rgba(0,0,0,0.4);
	float:left;
}

.featureright:hover { border:1px solid #666; }

#feat1 { background: transparent url("../images/promofeature.jpg") no-repeat left top; }



/*** About ***/

#aboutcontainer {
	width: 948px;
	height: 407px;
	margin-top:5px;
	padding:10px;
	background:rgba(0,0,0,0.4);
	text-align:left;
	border:1px solid #ccc;
}


/*** Services ***/

.servicescolumn {
	float: left;
    width: 272px;
    height: 500px;
    margin: 5px 15px 0 0;
    padding: 20px;
    background: rgba(0,0,0,0.4);
    text-align: justify;
}

.servicescolumn2 {
	float: left;
    width: 272px;
    height: 500px;
    margin-top: 5px;
    padding: 20px;
    background: rgba(0,0,0,0.4);
    text-align: justify;
}



/*** Portfolio ***/

#submenu {
	width: 940px;
	height: 16px;
	padding-bottom:5px;
	margin-bottom:10px;
}

.portfoliocontainer {
	width: 970px;
	height: auto;
}

.portcont {
	width: 304px;
	padding:10px;	
	background:rgba(0,0,0,0.4);
	border:1px solid #ccc;
	float: left;
}

.portfolio {
	width: 304px;
	height: 171px;
	border:1px solid #999;
	margin:0 26px 30px 0;
	background:rgba(0,0,0,0.4);
	float:left;
}

.portfolio:hover { border:1px solid #ccc; }


#port1 { background: transparent url("../images/portfolio/europeanpensions.jpg") no-repeat left top; }
#port2 { background: transparent url("../images/portfolio/businesscontinuity2012.jpg") no-repeat left top; }
#port3 { background: transparent url("../images/portfolio/fstech2012.jpg") no-repeat left top; }
#port4 { background: transparent url("../images/portfolio/riskmanagement2011.jpg") no-repeat left top; }
#port5 { background: transparent url("../images/portfolio/retailsystems2011.jpg") no-repeat left top; }
#port6 { background: transparent url("../images/portfolio/charitytimes2011.jpg") no-repeat left top; }




/*** Portfolio - Video ***/

#mainVideoContainer {
	float:left;
	width: 500px;
	height: 281px;
	margin: 0 15px 0 0;
	background: #000;
	border:1px solid #000;
	overflow:hidden;
}

#boxContainer {
	float:left;
	width: 681px;
	height: 383px;
	margin: 5px 10px 0 0;
	background: rgba(0, 0, 0, 0.5);
	overflow: hidden;
	border:1px solid #000;
}



/*** Contact Us ***/

.contactleft {
	float: left;
    width: 500px;
    height: 400px;
    margin: 5px 15px 0 0;
    padding: 20px;
    background: rgba(0,0,0,0.4);
}

.contactright {
	float: right;
    width: 370px;
    margin: 5px 0 0;
    text-align: justify;
    padding: 20px;
    background: rgba(0,0,0,0.4);
}



/************************************* Arrows Layout *************************************/



#controlContainer {
	width:970px;
	padding:0px 20px;
	margin:0 auto;
	position: relative;
	overflow: visible;
	border: 1px solid #000;
}

#arrows {
	width:940px;
	padding:0px 20px;
	margin:10px auto 0 auto;
	position:relative;
}

#prevControl {
	position:absolute;
	right:58px;
	bottom:-28px;
	width:25px;
	height:25px;
	background:url("../images/left_arrow.png") no-repeat 0px -25px;
	text-indent:-9999em;
	overflow:hidden;
}

#prevControl.noScroll {
	background:url("../images/left_arrow.png") no-repeat 0px 0px;
	cursor:default;
}

#nextControl {
	position:absolute;
	right:27px;
	bottom:-28px;
	width:25px;
	height:25px;
	background:url("../images/right_arrow.png") no-repeat 0px -25px;
	text-indent:-9999em;
	overflow:hidden;
}

#nextControl.noScroll {
	background:url("../images/right_arrow.png") no-repeat 0px 0px;
	cursor:default;
}

.noJS #prevControl, .noJS #nextControl {
	display:none;
}





/************************************* Contact Form *************************************/

label {
	display:block;
	font-size:14px;
	font-weight:bold;
	padding:0px 0px 5px 0px;
	color:#fff;
}

input {
	display:block;
	font-size:12px;
	padding:3px;
	background:#CCC;
	border:solid 1px #999;
	color:#222222;
	width:280px;
	margin:0px 0px 10px 0px;
	display:block;
}

textarea {
	display:block;
	font-size:12px;
	padding:3px;
	background:#CCC;
	border:solid 1px #999;
	color:#222222;
	width:492px;
	margin:0px 0px 10px 0px;
	height:180px;
}

input.error, textarea.error {
	background: #BB6767;
}

input.submit {
	border:none;
	width:auto;
	display:block;
	padding:0px;
	background:none;
}



/************************************* Footer *************************************/



#footerContainer {
	width: 100%;
	padding: 0 0 10px 0;
	position: absolute;
	bottom: -30px;
}

#footer {
	width:540px;
	color: #999;
	font-weight:bolder;
	font-size: 11px;
	margin:0 auto;
	text-align: center;
	/*background: transparent url("../images/footerimg.png") no-repeat center top;*/
}

#footer a {
	color: #999;
}


#footer a:hover {
	color: #fff;
}