/* Technotic Media Inc CSS 			*/
/* Copyright (c) 2007 Technotic Media Inc 	*/
/************************************************/

/* Tags */

body {
	background-color: #333;
	font: 8pt Arial, Helvetica, sans-serif;
}

a, a:visited, a:link, a:active {
	color: #000000;
}

a:hover {
	text-decoration: none;
}

img {
	border: none;
}


/* ID's */

#header {
	background-color: #000000; /* #1788C8 */
	height: 150px;
}

#header img { border: 0; }

#footer {
	width: 700px;
	margin: auto;
	text-align: center;
	font: 8pt Arial, Helvetica, sans-serif;
	color: #999999;
}

#lowermenu {
	background: #666666;
	color: #CCCCCC;
	width: 800px;
	height: 20px;
	margin: auto;
	text-align: center;
	font: 8pt Arial, Helvetica, sans-serif;
}

#lowermenu a { color: #CCCCCC; }

.footerlinks {
	margin: 15px;
}

#sitecont {
	background-color: #CCCCCC;
	margin: 15px auto 0;
	width: 800px;
	height: 100%;
}

#maincont {
	width: 100%;
	min-height: 700px;
}

#sidebar {
	width: 200px;
	height: 100%;
	margin: 0;
	padding: 0;
}

.sidebartitle {
	font: bold italic 12pt Arial, Helvetica, sans-serif;
	padding: 1px;
}

#latestnews {
	padding: 3px;
}

.latestnewsentry {
	padding-left: 10px;
	font: 8pt Arial, Helvetica, sans-serif;
	margin: 10px auto;
}

#main {
	float: right;
	width: 595px;
	min-height: 700px;
	margin: 0;
	padding: 0;
	border-left: 2px solid #666666;
}

#mainimg {
	margin: 10px auto;
	text-align: center;
	width: 550px;
	height: 200px;
}

#maintxt {
	margin: 10px auto;
	text-align: left;
	width: 550px;
}


/* Home Page */

#home {
	margin: auto;
}

#cloud {
	margin: 50px auto;
	width: 400px;
}

#cloud p {
	text-align: justify;
	line-height: 35px;
}

#cloud p a,
#cloud p a:link,
#cloud p a:visited {
	text-decoration: none;
	font-size: 10pt;
}

#cloud p a:hover {
	text-decoration: underline;
}


/* About Us */

#affiliates {
	margin: 50px auto;
	text-align: center;
}

#affiliates img {
	margin: auto 10px;
}


/* Site Map */

#sitemap ul li { margin: 3px auto; }

/* Contact Us */

#contacts {
	width: 500px;
	margin: auto;
}

#conaddr {
	background: url(../images/contactus/house.png) no-repeat;
	width: 125px;
	height: 150px;
	text-align: right;
	padding-left: 75px;
	float: left;
	margin: 10px auto;
}

#conphone {
	background: url(../images/contactus/people.png) no-repeat;
	width: 125px;
	height: 50px;
	text-align: right;
	padding-left: 75px;
	float: right;
	margin: 10px auto;
}

#conemail {
	background: url(../images/contactus/userinfo.png) no-repeat;
	width: 125px;
	height: 50px;
	text-align: right;
	padding-left: 75px;
	float:right;;
	margin: 10px auto;
}


#conaim {
	background: url(../images/contactus/chat.png) no-repeat;
	width: 125px;
	height: 50px;
	text-align: right;
	padding-left: 75px;
	float: right;
	margin: 10px auto;
}

#mapimgdiv {
	margin: 25px auto;
	width: 400px;
	height: 200px;
	border: 0;
}

#mapimg { border: 0; }


/* Links */

#links li {
	margin: 5px 0;
}

.linkgroupl {
	width: 270px;
	text-align: left;
	float: left;
	margin: 10px auto;
}	

.linkgroupr {
	width: 270px;
	text-align: left;
	float: right;
	margin: 10px auto;
}

.linkgroupb {
	width: 540px;
	text-align: left;
	margin: 10px auto;
}	

/* Customers */

#customers {
	margin: auto;
	text-align:center;
}

.custcolumn {
	width: 175px;
	text-align: left;
	float: left;
	margin: 10px auto;
}

/* Website Portfolio */

.webcontent {
	margin: 0 auto 25px;
	border: 2px solid;
}

.webcontent h3 { margin:0; }

.siteeven {
	padding: 15px;
	background: #EEEEEE;
}

.siteodd {
	padding: 15px;
	background: #DDDDDD;
}

.websitepic {
	width: 150px;
	padding-left: 50px;
	float: left;
}

.websitetext {
	width: 300px;
	float: right;
}


/* News */

.nitem {
	width: 400px;
	margin: 25px auto;
}

.ndate {
	float: left;
	font-weight: bold;
}

.ntitle {
	float: left;
	padding-left: 10px;
	font-weight: bold;
}

.nbodysm {
	clear: both;
	padding-left: 10px;
	padding-top: 5px
}

#newsbig {
	width: 400px;
	margin: auto;
}

#nbigdate {
	float: left;
	font: bold 12pt Arial, Helvetica, sans-serif;
}

#nbigtitle {
	float: left;
	padding-left: 25px;
	font: bold 10pt Arial, Helvetica, sans-serif;
}

#nbigbody {
	clear: both;
	padding-left: 10px;
	padding-top: 10px;
	min-height: 400px;
}

#newsback {
	margin: 20px auto;
	text-align: center;
}


/* Services */

#services a { display: block; width:275px; height: 100px; }

#service-video {
	width: 275px;
	height: 100px;
	margin: 10px auto;
	background: url(../images/services/videosmall.jpg) no-repeat;
	font: bold italic 10pt Arial, Helvetica, sans-serif;
	padding: 10px;
}

#service-photo {
	width: 275px;
	height: 100px;
	margin: 10px auto;
	background: url(../images/services/photosmall.jpg) no-repeat;
	font: bold italic 10pt Arial, Helvetica, sans-serif;
	padding: 10px;
}

#service-web {
	width: 275px;
	height: 100px;
	margin: 10px auto;
	background: url(../images/services/websmall.jpg) no-repeat;
	font: bold italic 10pt Arial, Helvetica, sans-serif;
	padding: 10px;
}

#service-anim {
	width: 275px;
	height: 100px;
	margin: 10px auto;
	background: url(../images/services/animsmall.jpg) no-repeat;
	font: bold italic 10pt Arial, Helvetica, sans-serif;
	padding: 10px;
}

#service-design {
	width: 275px;
	height: 100px;
	margin: 10px auto;
	background: url(../images/services/designsmall.jpg) no-repeat;
	font: bold italic 10pt Arial, Helvetica, sans-serif;
	padding: 10px;
}

#service-wed {
	width: 275px;
	height: 100px;
	margin: 10px auto;
	background: url(../images/services/weddingsmall.jpg) no-repeat;
	font: bold italic 10pt Arial, Helvetica, sans-serif;
	padding: 10px;
}


/* Portfolio */

#portfolio a { display: block; width:275px; height: 100px; }

#portfolio-dreel {
	width: 275px;
	height: 100px;
	margin: 10px auto;
	background: url(../images/portfolio/videoportfoliosmall.jpg) no-repeat;
	font: bold italic 10pt Arial, Helvetica, sans-serif;
	padding: 10px;
}

#portfolio-web {
	width: 275px;
	height: 100px;
	margin: 10px auto;
	background: url(../images/portfolio/websitessmall.jpg) no-repeat;
	font: bold italic 10pt Arial, Helvetica, sans-serif;
	padding: 10px;
}

#portfolio-gallery {
	width: 275px;
	height: 100px;
	margin: 10px auto;
	background: url(../images/portfolio/gallerysmall.jpg) no-repeat;
	font: bold italic 10pt Arial, Helvetica, sans-serif;
	padding: 10px;
}


/* Corporate */

#corporate a { display: block; width:275px; height: 100px; }

#corporate-aboutus {
	width: 275px;
	height: 100px;
	margin: 10px auto;
	background: url(../images/corporate/aboutussmall.jpg) no-repeat;
	font: bold italic 10pt Arial, Helvetica, sans-serif;
	padding: 10px;
}

#corporate-news {
	width: 275px;
	height: 100px;
	margin: 10px auto;
	background: url(../images/corporate/newsimagesmall.jpg) no-repeat;
	font: bold italic 10pt Arial, Helvetica, sans-serif;
	padding: 10px;
}

#corporate-partners {
	width: 275px;
	height: 100px;
	margin: 10px auto;
	background: url(../images/corporate/partnerssmall.jpg) no-repeat;
	font: bold italic 10pt Arial, Helvetica, sans-serif;
	padding: 10px;
}

#corporate-emp {
	width: 275px;
	height: 100px;
	margin: 10px auto;
	background: url(../images/corporate/employmentsmall.jpg) no-repeat;
	font: bold italic 10pt Arial, Helvetica, sans-serif;
	padding: 10px;
}


/* Clientele */

#clientele a { display: block; width:275px; height: 100px; }

#client-customers {
	width: 275px;
	height: 100px;
	margin: 10px auto;
	background: url(../images/clientele/customerssmall.jpg) no-repeat;
	font: bold italic 10pt Arial, Helvetica, sans-serif;
	padding: 10px;
}

#client-testimonials {
	width: 275px;
	height: 100px;
	margin: 10px auto;
	background: url(../images/clientele/testimonialssmall.jpg) no-repeat;
	font: bold italic 10pt Arial, Helvetica, sans-serif;
	padding: 10px;
}

#client-sponsored {
	width: 275px;
	height: 100px;
	margin: 10px auto;
	background: url(../images/clientele/sponsoredsmall.jpg) no-repeat;
	font: bold italic 10pt Arial, Helvetica, sans-serif;
	padding: 10px;
}


/* Photo Gallery */

#photogallery { margin: auto; }

#photogallery a, #photogalery a:visited, #photogallery a:link, #photogallery a:active {
	color: #000000;
	text-decoration: none;
}

.toplevel, .photo {
	width: 120px;
	margin: 10px 30px;
	float: left;
	text-align: center;
	font-weight: bold;
}

#photocopyright {
	margin: 25px auto;
	text-align: center;
}

#photoreturn {
	margin: 25px auto;
	text-align: center;
	font-weight: bold;
	text-decoration: underline;
}


/* Testimonials */

#testimonials {
	margin: auto;
	width: 450px;
}

.tmon {
	font: bold italic 8pt Arial, Helvetica, sans-serif;
}

.tauthor {
	width: 400px;
	text-align:right;
}


/* Partners */

#partners {
	margin: auto;
	text-align: center;
}

.partner {
	margin: 25px auto;
	width: 400px;
}


/* Main Menu */

#menu {
    width: 100%;
    float: left;
	background: #666666;
	text-align:center;
	margin: auto;
}

#menu ul {
        list-style: none;
        margin: 0;
        padding: 0;
        width: 112px;
        float: left;
}

#menu a, #menu h2 {
        font: bold 8pt Arial, Helvetica, sans-serif;
        display: block;
        margin: 0;
        padding: 2px 3px;
}

#menu h2 {
        color: #fff;
        text-transform: uppercase;
        cursor: default;
}

#menu a {
        color: #000;
        text-decoration: none;
}

#menu a:hover {
        color: #006600;
        background: #fff;
        z-index: 500;
}

#menu a.menu-title {
	color: #FFF;
	background: #666;
	display: inline;
}

#menu a.menu-title:hover {
	color: #006600;
}

#menu li {position: relative;}

#menu ul ul {
	position: absolute;
	z-index: 500;
	background: #efefef;
	/* for IE */
	filter:alpha(opacity=80);
	/* CSS3 standard */
	opacity:0.8;
}

#menu ul ul ul {
        top: 0;
        left: 100%;
        background: #efefef;
}

div#menu ul ul,
div#menu ul li:hover ul ul,
div#menu ul ul li:hover ul ul
{display: none;}

div#menu ul li:hover ul,
div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul
{display: block;}