/* ---------------------------------------------------- */
/* RESET CSS
/* ---------------------------------------------------- */

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, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

/* END RESET CSS */


/* ---------------------------------------------------- */
/* BASE ELEMENT
/* ---------------------------------------------------- */

html, body {
	height:100%;
}
html {
	margin: 0;
	padding: 0;
}
body {
	font-family: "Century Gothic", Arial, Helvetica, sans-serif;
	font-size: 62.5%;
	text-align: left;
	color:#51646a;
}

/* END BASE ELEMENT */


/* ---------------------------------------------------- */
/* TYPOGRAPHY
/* ---------------------------------------------------- */

a { color:#FFF; }
a:hover {
	color:#fff;
	text-decoration:none;
	background-color: #F06;
}
p {	
	font-size: 1.5em; 
	color:#51646a;
	line-height: 30px;
	color: #5D6F74;
}
h1 {
	color:#ff3b77;
	font-size: 1.8em;
	font-style: italic;
	font-weight: bold;
}
h2 {
	font-family: "Museo-500", "Century Gothic", Arial, Helvetica, sans-serif;
	color:#ff3b77;
	font-size: 1.8em;
	text-align: right;
	padding-right: 40px;
	font-weight: bold;
	padding-top: 10px;
}
h2 a {
	font-family: "Museo-500", "Century Gothic", Arial, Helvetica, sans-serif;
	color:#5D6F74;
	font-size: 1em;
	text-align: right;
}
h3 {
	color:#51646a;
	font-size: 1.8em;
	font-style: normal;
	font-weight: normal;
}
h4 {
	color:#ff3b77;
	font-size: 1.2em;
	padding-bottom: 10px;
}
h5 { font-size: 1em; line-height: 6em; }

/* END TYPOGRAPHY */	


/* ---------------------------------------------------- */
/* LAYOUT
/* ---------------------------------------------------- */

#wrapper {
	min-height:100%;
	position:relative;
}	
* html #wrapper { height:100% }
#container{
	width:925px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	padding-top: 0px;
	padding-right: 15px;
	padding-bottom: 100px;
	padding-left: 15px;
}

/* END LAYOUT */


/* ---------------------------------------------------- */
/* HEADER AND MENU
/* ---------------------------------------------------- */

.home {
	background-color: #ffffff;
	background-image: url(../images/bg.jpg);
	background-repeat: repeat-x;
	background-position: left top;	
}
#logo {
	height: 90px;
	width: 393px;
	margin-top: 57px;
	float: left;
}
#logo a {
	text-decoration: none;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;	
}
#logo a:hover {
	text-decoration: none;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;	
}
#header {
	height: 198px;
	margin: 0px;
	position: relative;
}	
#email {
	float: right;
	font-size: 1.3em;
	margin-top: 8px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
#menu {
	float: right;
	font-size: 1.5em;
	color: #FFF;
	margin-top: 86px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
#keywords {
	float: left;
	font-size: 1em;
	font-weight: lighter;
	color: #595959;
	margin-top: 14px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

/* END HEADER AND MENU */	


/* ---------------------------------------------------- */
/* CONTENT
/* ---------------------------------------------------- */

#content {
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
#main {
	float:left;
	display:inline;
	width:555px;
	margin-top: 20px;
}

/* content - portfolio */
#web-design {
	background-color: #f3f3f3;
	height: 220px;
	width: 900px;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #ff3b77;
	border-bottom-color: #ff3b77;
}
#logo-design {
	background-color: #F3F3F3;
	float: left;
	height: 356px;
	width: 900px;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #ff3B77;
	border-bottom-color: #F39;
	margin-bottom: 40px;
}
/* end content - portfolio */

/* content - services */
.services {
	width: 277px;
	float: left;
	margin-bottom: 40px;
}
.services li {
	background: url(bullet.gif) left center no-repeat;
	padding-left: 45px;
	height: 24px;
	padding-top: 11px;
	font-size: 1.2em;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: -40px;
}
li.flash { background-image: url(../images/Services-bullets/flash.jpg); }
li.css { background-image:url(../images/Services-bullets/css.jpg); }
li.javascript { background-image:url(../images/Services-bullets/javascript.jpg); }
li.ecommerce { background-image:url(../images/Services-bullets/ecommerce.jpg); }
li.seo { background-image:url(../images/Services-bullets/seo.jpg); }
li.online-marketing { background-image:url(../images/Services-bullets/online-marketing.jpg); }
li.web-maintenance { background-image:url(../images/Services-bullets/web-maintenace.jpg); }
li.cms { background-image:url(../images/Services-bullets/cms.jpg); }

li.logo { background-image:url(../images/Services-bullets/logo.jpg); }
li.advertising { background-image:url(../images/Services-bullets/advertising.jpg); }
li.business-cards { background-image:url(../images/Services-bullets/business-cards.jpg); }
li.stationery { background-image:url(../images/Services-bullets/stationery.jpg); }
li.brochures { background-image:url(../images/Services-bullets/brochures.jpg); }
li.branding { background-image:url(../images/Services-bullets/branding.jpg); }
li.photography { background-image:url(../images/Services-bullets/photography.jpg); }
li.printing { background-image:url(../images/Services-bullets/printing.jpg); }
/* end content - services */

/* content - contact */
#contact-bg {
	background-image: url(../images/bg-contact.png);
	background-repeat: no-repeat;
	background-position: left top;
	padding: 50px;
	float: left;
	height: 481px;
	width: 801px;
	margin-bottom: 40px;
}
/* end content - services */

/* END CONTENT */


/* ---------------------------------------------------- */
/* SLIDESHOW
/* ---------------------------------------------------- */

#slideshow {
	width: 555px;
	background-color: #eee;
	border: 1px solid #ddd;
	margin-bottom: 40px;
}
#slideshow ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	height: 1%; /* IE fix */
}
#slideshow ul:after {
	content: ".";
	clear: both;
	display: block;
	height: 0;
	visibility: hidden;
}            

/* slideshow > slides */
#slideshow .slides { overflow: hidden; width: 555px; }
#slideshow .slides ul {
/* total width of all slides -
960px multiplied by 3 in this case */
	width: 4440px;
}
#slideshow .slides li {
	width: 515px;
	float: left;
	padding: 20px;
}

/* slideshow > navigation */
#slideshow .slides-nav {
	background-color: #5d6f74;
	border-top: 2px solid #ff3b77;
}
#slideshow .slides-nav li { float: left; }
#slideshow .slides-nav li a {
	display: block;
	outline: none;
	padding-top: 10px;
	padding-right: 15px;
	padding-bottom: 10px;
	padding-left: 15px;
}
.js #slideshow .slides-nav li.on,
.js #slideshow .slides-nav li.on a { background-color: #ff3b77; }
.js #slideshow .slides-nav li.on a { position: relative; top: -2px; }

/* END SLIDESHOW */
	
	
/* ---------------------------------------------------- */
/* SIDEBAR
/* ---------------------------------------------------- */

/* sidebar - services */
#services-testimonial {
	float: right;
	width: 325px;
	margin-top: 20px;
	height: 544px;
	background-image: url(../images/bg-testimonial.png);
	background-repeat: no-repeat;
	background-position: left top;
}
#testimonial-text {
	margin-top: 80px;
	margin-right: 48px;
	margin-left: 58px;
}
.testimonial-bold {
	font-size: 0.8em;
	font-style:italic;
	font-weight:bold;
	color:#ff3b77;
}
.testimonial-regular {
	font-size: 0.8em;
	font-style: italic;
	line-height: 3.0em;
}
/* ende sidebar - services */

/* sidebar - index */
#image {
	float: right;
	width: 325px;
	margin-top: 20px;
	height: 544px;
	background-image: url(../images/bg-services.png);
	background-repeat: no-repeat;
	background-position: left top;
}
.yo a {
	display: block;
	width: 325px;
	height: 246px;
	background-color: transparent;
	background-image: url(../images/bg-services-hover.png);
	background-repeat: no-repeat;
}
.yo a:hover {
	background-color: transparent;
	background-position: 0px -246px;
} 
.services-container {
	float: left;
	margin-top: 5px;
	margin-left: 75px;
	width: 200px;
}
.services-container li {
	background: url(bullet.gif) left center no-repeat;
	padding-left: 60px;
	height: 30px;
	padding-top: 10px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: -50px;
}
.services-container li a {
	color:#51646a;
	font-style: normal;
	font-weight: normal;
	text-decoration:none;
}
.services-container li a:hover {
	color:#FFF;
	font-style: normal;
	font-weight: normal;
	text-decoration: none;
	padding: 5px;
}
li.logo-design { background-image:url(../images/Services-bullets/logo-design.jpg); }
li.web-design { background-image:url(../images/Services-bullets/web-design.jpg); }
li.graphic-design { background-image:url(../images/Services-bullets/graphic-design.jpg); }
li.brand-design { background-image:url(../images/Services-bullets/brand-design.jpg); }
/* end sidebar - index */

/* END SIDEBAR */


/* ---------------------------------------------------- */
/* FOOTER
/* ---------------------------------------------------- */
	
#footer{
	position:relative;
	margin-top:-108px;
	height:100px;
	min-width:930px;
	color:#ffffff;
	background-color: #FE3B77;
	border-top-width: thick;
	border-top-style: solid;
	border-top-color: #51646a;
}
.footer-block {
	clear:both;
	width:925px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	padding-top: 25px;
	padding-right: 0px;
	padding-bottom: 0;
	padding-left: 0px;
}
.smallprint { font-size: 1.3em; }

td { vertical-align: middle; }

/* END FOOTER */


/* ---------------------------------------------------- */
/* TOOLS
/* ---------------------------------------------------- */

.hidden { display:none;	}
.center { margin:0 auto; }	
.last {	margin:0px;	padding:0px; }
.clear, .clearline {
	clear:both; 
	height:1px; 
	margin:0; 
	padding:0; 
	font-size: 15px;
	line-height: 1px;
}
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

.left {	float:left;	display:inline;	}
::-moz-selection{ background:#FE3B77; color:#fff; }
::selection { background:#FE3B77; color:#fff; }
