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

	/*CSS Reset*/
	
	body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
		margin:0;
		padding:0;
	}
	table {
		border-collapse:collapse;
		border-spacing:0;
	}
	fieldset,img { 
		border:0;
	}
	address,caption,cite,code,dfn,em,th,var,small {
		font-style:normal;
		font-weight:normal;
	}
	ol,ul {
		list-style:none;
	}
	caption,th {
		text-align:left;
	}
	h1,h2,h3,h4,h5,h6 {
		font-weight:normal;
	}
	q:before,q:after {
		content:'';
	}
	abbr,acronym { border:0;
	}
	
	

	/* General styling */
	
	body {
		background:#f3f3ed;
		background-image:url(../images/bg.gif);
		font-family: Helvetica, Arial, sans-serif;
		font-size:125%;
		color:#202020;
	}
	
	h1, h2, h3, h4, h5, h6 {
		font-family: KulminoituvaRegular, "Arial Black", Gadget, sans-serif;
		font-size:1.5em;
	}
	
	p{
		padding-bottom:10px;
	}
	
	p a{
		color:#0018ff;
		text-decoration:none;
	}
	
	p a:hover{
		text-decoration:underline;
	}
	
	
	#header{
		background-image:url(../images/header-bg.gif);
		height:105px;
		text-align:center;
		padding-top:30px;
	}
	
	#wrapper {
		width:1144px;
		margin:0 auto;
		text-align:center;
		padding-top:0;
	}
	
	/* Index panel Styling */
	
	ul#panels {
		margin-top:30px;
		text-align:left;
	}
	
	ul#panels li {
		height:407px;
		width:286px;
		display:block;
		float:left;	
		
		position:relative;
	
		-moz-transition: all 0.5s ease-in-out;
		-webkit-transition: all 0.5s ease-in-out;
	}
	
	ul#panels li .content {
		padding-top:75px;
		padding-left:20px;
		padding-right:24px;
	}
	
	
	
	#panel-1 {
		background-image:url(../images/chat.png);
		-webkit-transform: scale(0.9) rotate(-12deg);
		-moz-transform: scale(0.9) rotate(-12deg);
		z-index:1;
		left:120px;
		top:0px;
	}
	
	#panel-2 {
		background-image:url(../images/contact.png);
		-webkit-transform: scale(0.9) rotate(-6deg);
		-moz-transform: scale(0.9) rotate(-6deg);
			
		z-index:2;
		left:50px;
		top:20px;
	}
	
	#panel-3 {
		background-image:url(../images/wedo.png);
		z-index:2;
		-webkit-transform: scale(0.9) rotate(4deg);
		-moz-transform: scale(0.9) rotate(4deg);
	}
	
	#panel-4 {
		background-image:url(../images/message.png);
		-webkit-transform: scale(0.9) rotate(10deg);
		-moz-transform: scale(0.9) rotate(10deg);
		z-index:1;
		right:50px;
		top:10px;
	}
	
	/* Hover States */
	
	ul#panels li:hover {
		z-index:4;
	}
	
	#panel-1:hover {
		-moz-transform: scale(1.0) rotate(-3deg);
   	 	-webkit-transform: scale(1.0) rotate(-3deg); 
	}
		
	#panel-2:hover {
		-moz-transform: scale(1.0) rotate(-2deg);
   	 	-webkit-transform: scale(1.0) rotate(-2deg); 
	}
	
	#panel-3:hover {
		-moz-transform: scale(1.0) rotate(2deg);
   	 	-webkit-transform: scale(1.0) rotate(2deg); 
	}
	
	#panel-4:hover {
		-moz-transform: scale(1.0) rotate(0deg);
   	 	-webkit-transform: scale(1.0) rotate(0deg); 
	}
	
	
	
	/* Content Styling */
	ul#panels li p {
		margin-top:4px;
		text-align:left;
		line-height:28px;	
	}	
	
	ul#panels .content ul{
		padding-top:10px;
	}
	
	ul#panels .content li{
		height:auto;
		line-height:60px;
		padding-left:60px;
		width:auto;
		display:block;		
		position:relative;
		background-repeat:no-repeat;
	}
	
	li#yahoo{
		background-image:url(../icons/yahoo.png);
	}
	li#msn{
		background-image:url(../icons/msn.png);
	}
	li#gtalk{
		background-image:url(../icons/google-talk.png);
	}
	li#aol{
		background-image:url(../icons/aol.png);
	}
	li#skype{
		background-image:url(../icons/skype_icon.png);
	}
	
	.content span{
		display:block;
		text-align:center;
		font-weight:bold;
		text-transform:uppercase;
		
	}
	
	.content span#media{
		font-size:67px;
		background-color:#000;
		color:#FFF;
		line-height:72px;
		margin-top:10px;
	}
	
	.content span#out{
		font-size:28px;
		line-height:60px;
	}
	
	.content span#ecom{
		font-size:31px;
		line-height:45px;
		background-color:#000;
		color:#FFF;
	}
	
	.content span#olc{
		font-size:23px;
		line-height:60px;
	}
	
	.content span#con{
		font-size:28px;
		line-height:45px;
		background-color:#000;
		color:#FFF;
	}
	
	/* contect form */
	#cForm input{
		border:solid;
		border-style:solid;
		border-width:2px;
		border-right-color:#1ca8f2;
		border-bottom-color:#1ca8f2;
		
		border-left-color:#0c78b1;
		border-top-color:#0c78b1;
		
		
		background-color:#f3f3ed;
		
		display:block;
		padding:4px;
		font-size:18px;
		margin-bottom:10px;
		width:200px;
		color:#888989;
		
		
		font-family:"Courier New", Courier, monospace;
	}
	
	#cForm label{
		display:block;
		font-size:18px;
		color:#000;
	}
	
	#cForm textarea{
		border:solid;
		border-style:solid;
		border-width:2px;
		border-right-color:#FFF;
		border-bottom-color:#1ca8f2;
		border-left-color:#1ca8f2;
		border-top-color:#0c78b1;
		
		background-color:#f3f3ed;
		
		display:block;
		padding:3px;
		font-size:18px;
		margin-bottom:10px;
		width:230px;
		height:100px;
		color:#888989;	
		
		font-family:"Courier New", Courier, monospace;
	}
	
	#cForm input.submit{
		background-color:#000;
		width:60px;
		border:solid 1px #3bdee8;
		font-weight:bold;
		color:#FFF;
	}
	
	#cForm input.submit:hover{
		border-color:#c7fcff;
		cursor:pointer;
	}
	
	#cForm input.submit:active{
		border-color:#c7fcff;
		background-color:#333;
	}