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

/* ------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ******************** page image ******************** */
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------ */

/* general defenitions */
/* ------------------------------------------------------------------------------------------------------------------------ */
#PageImage
{
	display: block;
	width: 418px;
	height: 218px;
	position: relative;
	top: 38px;
	margin: auto;
	border: solid 2px #000000;
}

#PageImageText
{
	display: block;
	width: 380px;
	position: absolute;
	left: 20px;
	bottom: 10px;
}


#PageImageText h2
{
	margin: 0px;
	font-size: 15px;
	color: #FFFFFF;
	font-weight: bold;
	letter-spacing: 0.1px;;
}

#PageImageText h2 b
{
	font-size: 18px;
	color: #9F1328;
}

#PageImageText span
{
	font-size: 12px;
	color: #FFFFFF;
	font-weight: normal;
}

/* page specific defenitions */
/* ------------------------------------------------------------------------------------------------------------------------ */
#Home #PageImageText {left: 220px; bottom: 20px;}

/* ------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ******************** box ******************** */
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------ */

/* general defenitions */
/* ------------------------------------------------------------------------------------------------------------------------ */
.BoxHeader
{
	position: absolute;
	top: 280px;
	padding: 2px;
}

.BoxHeader h2
{
	color: #9F1328;
	font-size: 18px;
	margin: 0px;
}

.BoxContentBg
{
	display: block;
	height: 230px;
	position: absolute;
	top: 305px;
	
	background-color: #FFFFFF;
	
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
}

.BoxContent
{
	display: block;
	height: 200px;
	position: absolute;
	top: 320px;
	font-size: 15px;
}

.BoxContent h1, .BoxContent h2, .BoxContent h3, .BoxContent h4, .BoxContent p {margin: 0px;}

.BoxContent span, .BoxContent a {text-decoration: none; color: #9F1328;}
.BoxContent a:hover {color: #444466;}
.BoxContent a.ReadMore {float: right;}

.BoxContent ul
{
	margin: 0px;
	padding: 0px 0px 0px 15px;
	list-style-image: url(../images/styles/squarelistimage.gif);
	font-size: 13px;
}

.BoxContent li {padding: 2px 0px 2px 0px;}

.BoxContent ul a {color: #000000;}
.BoxContent ul a:hover {color: #9F1328;}


.Box1.BoxHeader {left: 20px;}
.Box1.BoxContentBg {width: 190px; left: 20px;}
.Box1.BoxContent {width: 160px; left: 35px;}

.Box2.BoxHeader {left: 220px;}
.Box2.BoxContentBg {width: 350px; left: 220px;}
.Box2.BoxContent {width: 320px; left: 235px;}

.Box3.BoxHeader {left: 580px;}
.Box3.BoxContentBg {width: 350px; left: 580px;}
.Box3.BoxContent {width: 320px; left: 595px;}

/* page / box specific defenitions */
/* ------------------------------------------------------------------------------------------------------------------------ */

/* news feed */
#NewsFeedContent {font-size: 12px;}
#NewsFeedContent h3, #NewsFeedContent b
{
	font-size: 12px;
	font-weight: bold;
}
#NewsFeedContent .NewsFeedSum {color: #000000;}

/* portfolio */
#ClientsContentBg
{
	width: 910px;
	background-color: #000000;
	
	filter: alpha(opacity=75);
	-moz-opacity: 0.75;
	opacity: 0.75;
}
#ClientsContent {width: 910px;}


.ClientImg
{
	display: block;
	position: absolute;
}
.ClientImg img {border: none;}

#DonaldRussell {left: 205px; top: 15px;}
#Fanshirt {left: 540px; bottom: 10px;}
#Handel {left: 45px; bottom: 15px;}
#HenriLorenzi {left: 480px; top: 15px;}
#Ots {left: 30px; top: 15px;}
#Pebble {left: 165px; top: 95px;}
#Safor {left: 550px; top: 85px;}
#Saretta {left: 720px; top: 15px;}
#WheelFreedom {left: 300px; bottom: 15px;}
#YorkshireGame {left: 720px; bottom: 15px;}

/* useful links */
#UsefulLinksContent ul {margin-left: 15px;}

#UsefulLinksContent li
{
	width: 140px;
	float: left;
	padding: 3px 0px 3px 0px;
}

/* contact */
#Contact #WriteContent
{
	font-size: 14px;
	line-height: 14px;
}

#Contact #Name, #Contact #Email
{
	width: 100%;
}
#Contact #Message
{
	width: 100%;
	height: 45px;
}
#Contact #Clear
{
	display: inline;
	width: 50px;
	position: absolute;
	right: 60px;
}
#Contact #Send
{
	display: inline;
	width: 50px;
	position: absolute;
	right: 0px;
}

#Contact #Registered
{
	float: right;
	text-align: right;
	font-size: 12px;
	margin-top: -28px;
}

/* services */
.Service .Box1.BoxHeader {left: 20px; top: 5px;}
.Service .Box1.BoxContent {width: 140px; left: 20px; top: 30px;}

.Service .Box2.BoxHeader {left: 170px; top: 5px;}
.Service .Box2.BoxContent {width: 140px; left: 170px; top: 30px;}

.Service .Box3.BoxHeader {left: 340px; top: 5px;}
.Service .Box3.BoxContent {width: 140px; left: 340px; top: 30px;}

.Service .BoxHeader h2 {font-size: 16px;}
.Service .BoxContent li {font-size: 15px; line-height: 20px;}
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ******************** services ******************** */
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------ */

/* general defenitions */
/* ------------------------------------------------------------------------------------------------------------------------ */
.Services
{
	display: block;
	width: 154px;
	height: 180px;
	position: absolute;
	background-color: #000000;
	text-align: center;
}

.Services img
{
	position: absolute;
	left: 6px;
	bottom: 6px;
	border: none;
}

.ServicesLink
{
	position: relative;
	top: 5px;
	color: #FFFFFF;
	text-decoration: none;
}

/* page specific defenitions */
/* ------------------------------------------------------------------------------------------------------------------------ */
#AboutUs #GraphicDesign {left: 60px; top: 38px;}
#AboutUs #Photography {left: 230px; top: 38px;}
#AboutUs #WordingPrint {left: 400px; top: 38px;}
#AboutUs #Retouching {left: 570px; top: 38px;}
#AboutUs #BrandManagement {left: 740px; top: 38px;}
#ServiceImg {left: 10px; top: 10px;}

/* ------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ******************** service page ******************** */
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------ */
#TopServiceBg
{
	display: block;
	width: 500px;
	height: 240px;
	position: absolute;
	left: 0px;
	top: 0px;
	background-color: #FFFFFF;
	
	filter: alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}

#TopService
{
	display: block;
	width: 500px;
	height: 240px;
}

#ServiceHeader
{
	position: absolute;
	left: 180px;
	top: 5px;
}

#ServiceHeader h2
{
	margin: 0px;
	font-size: 20px;
	color: #9F1328;
	letter-spacing: 3px;
}

#ServiceText
{
	display: block;
	width: 300px;
	position: absolute;
	left: 180px;
	top: 35px;
}

#ServiceText p
{
	margin: 0px;
	font-size: 13px;
	line-height: 16px;
	font-weight: bold;
}

#MiddleServiceBg
{
	display: block;
	width: 500px;
	height: 230px;
	position: absolute;
	left: 0px;
	top: 250px;
	background-color: #FFFFFF;
	
	filter: alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}

#MiddleService
{
	display: block;
	width: 500px;
	height: 230px;
	position: absolute;
	left: 0px;
	top: 250px;
}

#BottomService
{
	display: block;
	width: 500px;
	position: absolute;
	left: 0px;
	top: 485px;
	text-align: right;
	font-size: 13px;
	font-weight: bold;
}

#BottomService a
{
	color: #9F1328;
	text-decoration: none;
}

/* ------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ******************** client page ******************** */
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------ */
#ClientLogo
{
	display: block;
	width: 500px;
	height: 240px;
	position: absolute;
	left: 0px;
	top: 15px;
	text-align: center;
}
#Fanshirt #ClientLogo, #PebbleIT #ClientLogo{top: 40px;}
#Saretta #ClientLogo{top: 2px;}

#ClientLogo h1, #ClientLogo a, #ClientLogo img
{
	margin: 0px;
	text-decoration: none;
	border: 0px;
}

.Client .Img1, .Client .Img2, .Client .Img3
{
	display: block;
	position: absolute;
	top: 140px;
}
.Client .Img1 img, .Client .Img2 img, .Client .Img3 img {border: 0px;}

.Client .Img1 {left: 0px;}
.Client .Img2 {left: 170px;}
.Client .Img3 {left: 340px;}

#ClientHeader
{
	position: absolute;
	left: 50px;
	top: 330px;
}

#ClientHeader h1, #ClientHeader h1 a
{
	margin: 0px;
	font-size: 24px;
	color: #9F1328;
	letter-spacing: 1px;
	text-decoration: none;
}

#ClientHeader h2
{
	margin: 0px;
	font-size: 14px;
}

#ClientText
{
	display: block;
	width: 420px;
	position: absolute;
	left: 50px;
	top: 380px;
}

#ClientText p
{
	margin: 0px;
	font-size: 15px;
	line-height: 19px;
}

.Client #Previous, .Client #Next
{
	position: absolute;
	bottom: 0px;
}
.Client #Previous {left: 5px;}
.Client #Next {right: 5px;}

.Client #Previous a, .Client #Next a
{
	color: #9F1328;
	text-decoration: none;
}
.Client #Previous a:hover, .Client #Next a:hover {color: #666666;}

/* ------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ******************** gallery ******************** */
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------ */

.Gallery .Icon
{
	display: none;
	width: 56px;
	height: 56px;
}

.Gallery .Thumbnail
{
	display: block;
	width: 145px;
	height: 145px;
	position: absolute;
}
.Gallery .Thumbnail img {border: none;}

.Gallery .Thumb1 {left: 7px; top: 7px;}
.Gallery .Thumb2 {left: 177px; top: 7px;}
.Gallery .Thumb3 {left: 347px; top: 7px;}
.Gallery .Thumb4 {left: 7px; top: 177px;}
.Gallery .Thumb5 {left: 177px; top: 177px;}
.Gallery .Thumb6 {left: 347px; top: 177px;}
.Gallery .Thumb7 {left: 7px; top: 347px;}
.Gallery .Thumb8 {left: 177px; top: 347px;}
.Gallery .Thumb9 {left: 347px; top: 347px;}


.Gallery .Large.Thumbnail
{
	display: block;
	width: 218px;
	height: 218px;
	position: absolute;
}
.Gallery .Large.Thumb1 {left: 20px; top: 20px;}
.Gallery .Large.Thumb2 {left: 260px; top: 20px;}
.Gallery .Large.Thumb3 {left: 20px; top: 260px;}
.Gallery .Large.Thumb4 {left: 260px; top: 260px;}

.Gallery #Images
{
	position: absolute;
	left: 0px;
	top: 0px;
}

.Gallery .Image
{
	display: none;
	width: 400px;
	height: 400px;
	position: absolute;
	left: 50px;
	top: 50px;
}
.Gallery .Image img
{
	width: 100%;
	height: 100%;
}

.Gallery #Loading
{
	display: block;
	width: 500px;
	position: absolute;
	left: 0px;
	top: 70px;
	text-align: center;
	font-weight: bold;
	color: #BBBBFF;
}


.Gallery #BlackSquare
{
	display: block;
	width: 500px;
	height: 500px;
	position: absolute;
	left: 0px;
	top: 0px;
	background-color: #000000;
}

.Gallery #BackToGallery
{
	display: none;
	position: absolute;
	left: 20px;
	top: 10px;
	color: #999999;
	text-decoration: none;
	font-weight: bold;
}

.Gallery #Previous
{
	display: none;
	position: absolute;
	left: 20px;
	bottom: 10px;
	color: #999999;
	text-decoration: none;
	font-weight: bold;
}

.Gallery #Next
{
	display: none;
	position: absolute;
	right: 20px;
	bottom: 10px;
	color: #999999;
	text-decoration: none;
	font-weight: bold;
}

.Gallery #AlbumPrevious
{
	display: none;
	position: absolute;
	left: -5px;
	bottom: -8px;
	color: #9F1328;
	text-decoration: none;
	font-weight: bold;
	font-size: 14px;
}

.Gallery #AlbumNext
{
	display: none;
	position: absolute;
	right: -5px;
	bottom: -8px;
	color: #9F1328;
	text-decoration: none;
	font-weight: bold;
	font-size: 14px;
}

/* ------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ******************** text page  ******************** */
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------ */
.Textpage #CentralContent {overflow: auto; font-size: 11px;}

.Textpage #CentralContent h2
{
	margin: 0px;
	color: #9F1328;
	font-size: 20px;
	font-weight: normal;
}

.Textpage #CentralContent h3
{
	font-size: 12px;
}

.Textpage #CentralContent ol ol {list-style-type: lower-latin;}

/* ------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ******************** sitemap ******************** */
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------ */
#Sitemap #CentralContent {color: #9F1328;}

#Sitemap #CentralContent h2, #Sitemap #CentralContent ul{margin: 0px;}

#Sitemap #CentralContent h2 {font-size: 18px;}

#Sitemap #CentralContent a
{
	color: #9F1328;
	text-decoration: none;
}
#Sitemap #CentralContent a:hover {color: #666666;}

#Sitemap #CentralContent ul {padding-left: 18px;}

#Sitemap #CentralContent li
{
	font-size: 14px;
	padding: 1px 0px 1px 0px;
	
}

#Sitemap #CentralContent li li
{
	font-size: 12px;
	list-style-type: circle;
}

#Sitemap #CentralContent li li li
{
	font-size: 12px;
	list-style-type: none;
}

/* ------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ******************** news feed page ******************** */
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------ */
.NewsFeed #NewsFeedLogo
{
	display: block;
	width: 500px;
	height: 240px;
	position: absolute;
	left: 0px;
	top: 15px;
	text-align: center;
}

.NewsFeed #NewsFeedLogo h1, .NewsFeed #NewsFeedLogo a, .NewsFeed #NewsFeedLogo img
{
	margin: 0px;
	text-decoration: none;
	border: 0px;
}


.NewsFeed #NewsFeedHeader
{
	position: absolute;
	left: 35px;
	top: 140px;
}

.NewsFeed #NewsFeedHeader h1, .NewsFeed #NewsFeedHeader h1 a
{
	margin: 0px;
	font-size: 20px;
	color: #9F1328;
	letter-spacing: 1px;
	text-decoration: none;
	font-weight: normal;
}

.NewsFeed #NewsFeedHeader h2
{
	margin: 5px 0px 0px 0px;
	font-size: 14px;
}

.NewsFeed #NewsFeedText
{
	display: block;
	width: 420px;
	position: absolute;
	left: 35px;
	top: 180px;
}

.NewsFeed #NewsFeedText p
{
	margin: 20px 0px 20px 0px;
	font-size: 15px;
	line-height: 22px;
}

.NewsFeed #NewsFeedText p a
{
	text-decoration: none;
	color: #9F1328;
}
.NewsFeed #NewsFeedText p a:hover {color: #666666;}

.NewsFeed #Previous, .NewsFeed #Next
{
	position: absolute;
	bottom: 0px;
}
.NewsFeed #Previous {left: 5px;}
.NewsFeed #Next {right: 5px;}

.NewsFeed #Previous a, .NewsFeed #Next a
{
	color: #9F1328;
	text-decoration: none;
}
.NewsFeed #Previous a:hover, .NewsFeed #Next a:hover {color: #666666;}