﻿
/*
 *******************************************
	www.sonetworks.no
	santiago@sonetworks.no
 *******************************************/

/*----------------general------------------*/

body
{
	background-color: #231f20;
	background-image: url('Images/strips2.png' );
	background-repeat: no-repeat;
	background-position: center top;
	padding: 0;
	margin: 0;
	text-align: center;
	line-height:normal;
}

a
{
	color: White;
	font-size: 20px;
	text-decoration: none;
}

a:hover
{
	color: Black;
}

a:visited
{
	color: Black;
}

#wrapper
{
	margin: auto;
}

.mainContentGray
{
	padding-top:20px;
	padding-bottom:20px;
	text-align: left;
	background-image: url('Images/bgwhite.jpg' );
	background-repeat: repeat-x;
	background-color: #cccccc;
	min-height:480px;
	text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.8);
}

.mainContentSite
{
	text-align: left;
	background-image: url('Images/bgwhite.jpg' );
	background-repeat: repeat-x;
	background-color: #cccccc;
	min-height: 950px;
}

.mainContentRed
{
	padding-top:40px;
	padding-bottom:20px;
	text-align: left;
	background-image: url('Images/bgwhite.jpg' );
	background-repeat: repeat-x;
	background-color: #cccccc;
	min-height: 325px;
	text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.8);
}

.mainContentStaff
{
	text-align: left;
	background-image: url('Images/bgwhite.jpg' );
	background-repeat: repeat-x;
	background-color: #cccccc;
	clear: both;
	min-height: 490px;
	text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.9);
}

.mainContentFooter
{
	
	text-align: left;
	/*background-color: #a51b1e;
	text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.9);*/
	min-height: 500px;
}

.contentLeft
{
	margin-top:20px;
	text-align:left;
}

.contentRight
{
	margin-top:20px;
}

.contentSpacer
{
	min-height:30px;
	display:block;
}

.contentDetailSection
{
	margin-top:30px;
}

.spacerBottom
{
	margin-bottom:30px;
}

.lineaForm
{
	background-image: url('Images/linea.png' );
	width: 460px;
	height: 18px;
	background-repeat: no-repeat;
}


/* ----------banner for logo-----------------*/

#header
{
	background-image: url('Images/header2.png' );
	background-repeat: repeat-y;
	min-height: 140px;
}

.flags
{
	float: left;
	margin-top: 10px;
	margin-left: 0px;
	width: 40px;
	height: 20px;
}

#logo
{
	background-image: url('Images/logo3.png' );
	height: 140px;
	background-position: top;
	background-repeat: no-repeat;
}

#logo:hover
{
	background-image: url('Images/logo3.png' );
	height: 140px;
	background-repeat: no-repeat;
	background-position: bottom;
}

.line
{
	background-image: url('Images/line.jpg' );
	background-repeat: repeat-x;
	height: 30px;
}

.foot
{
	background-image: url('Images/foot.jpg' );
	background-position:center;
	background-repeat: no-repeat;
	height: 36px;
}

#logo a
{
	width: 300px;
	height: 150px;
}



/************ awesome buttons */

.awesome, .awesome:visited {
	background: #222 url(/images/alert-overlay.png) repeat-x; 
	display: inline-block; 
	padding: 5px 10px 6px; 
	color: #fff; 
	text-decoration: none;
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
	border-bottom: 1px solid rgba(0,0,0,0.25);
	position: relative;
	cursor: pointer;
}

	.awesome:hover							{ background-color: #111; color: #fff; }
	.awesome:active							{ top: 1px; }
	.small.awesome, .small.awesome:visited 			{ font-size: 11px; padding: ; }
	.awesome, .awesome:visited,
	.medium.awesome, .medium.awesome:visited 		{ font-size: 13px; line-height: 1; text-shadow: 0 -1px 1px rgba(0,0,0,0.25); }
	.large.awesome, .large.awesome:visited 			{ font-size: 14px; padding: 8px 14px 9px; }
	
	.green.awesome, .green.awesome:visited		{ background-color: #91bd09; }
	.green.awesome:hover						{ background-color: #749a02; }
	.blue.awesome, .blue.awesome:visited		{ background-color: #d11e22; }
	.blue.awesome:hover							{ background-color: #bb1c20; }
	.red.awesome, .red.awesome:visited			{ background-color: #e33100; }
	.red.awesome:hover							{ background-color: #872300; }
	.magenta.awesome, .magenta.awesome:visited		{ background-color: #a9014b; }
	.magenta.awesome:hover							{ background-color: #630030; }
	.orange.awesome, .orange.awesome:visited		{ background-color: #ff5c00; }
	.orange.awesome:hover							{ background-color: #d45500; }
	.yellow.awesome, .yellow.awesome:visited		{ background-color: #ffb515; }
	.yellow.awesome:hover							{ background-color: #fc9200; }
/******************** */
#boton
{
	background-image: url('Images/boton.png' );
	background-repeat: no-repeat;
	background-position: bottom;
	margin-top: 17px;
	width: 440px;
	height: 48px;
}

#boton:hover
{
	background-image: url('Images/boton.png' );
	background-repeat: no-repeat;
	background-position: top;
	margin-top: 17px;
	width: 440px;
	height: 48px;
}

.send
{
    background-image: url('Images/send.png');
    background-repeat:no-repeat;
    height:48px;
    background-position:bottom;
    margin-top:15px;
	}
	
.send:active
{
    background-image: url('Images/send.png');
    background-repeat:no-repeat;
    height:48px;
    background-position:top;
    margin-top:15px;
	}


.graybox
{
    background-image: url('Images/homecarrless.png');
    background-repeat:no-repeat;
    height:110px;
    width:460px;
    padding:15px 0px 15px 15px;
	}
	
	
.grid_3 img
{
	float: left;
    margin: 0 15px 5px 0;
    border: solid 1px #bbb;
}


#textTop
{
	float: left;
	font-size: 20px;
	height: 33px;
	font-weight: bold;
	color: White;
	padding: 8px 0px 7px 26px;
}

.label
{
	width: 205px;
	font-size: 15px;
	color: White;
	font-weight: bold;
	float: left;
	line-height: 14px;
	text-align: center;
	padding: 213px 0px 0px 0px;
}

.label a
{
	font-size: 15px;
	font-weight: bold;
	line-height: 14px;
	text-align: center;
}

.staffTextTitle
{
	font-size: 35px;
	font-weight: bold;
	width: 195px;
	color: Black;
	padding: 0px 5px 5px 5px;
	text-align: left;
	line-height: 31px;
	float: left;
	clear: both;
}

.staffText
{
	font-size: 17px;
	width: 195px;
	color: Red;
	padding: 0px 5px 5px 5px;
	text-align: left;
	line-height: 19px;
	float: left;
	clear: both;
}

.staffChago
{
	background-image: url('Images/chago2.png');
	background-repeat: no-repeat;
	width: 220px;
	float: left;
	margin: 20px 0px 0px 15px;
	height: 200px;
	clear: both;
}

.staffRonny
{
	background-image: url('Images/ronny2.png');
	background-repeat: no-repeat;
	width: 220px;
	float: left;
	margin: 20px 0px 0px 15px;
	height: 200px;
	clear: both;
}

.staffRolf
{
	background-image: url(  'Images/rolf.png');
	background-repeat: no-repeat;
	width: 220px;
	float: left;
	margin: 20px 0px 0px 15px;
	height: 200px;
	clear: both;
}

.staffPipe
{
	background-image: url('Images/pipe.png');
	background-repeat: no-repeat;
	width: 220px;
	float: left;
	margin: 20px 0px 0px 15px;
	height: 200px;
	clear: both;
}

.staffNan
{
	background-image: url('Images/nan2.png');
	background-repeat: no-repeat;
	width: 220px;
	float: left;
	margin: 20px 0px 0px 15px;
	height: 200px;
	clear: both;
}

.staffLina
{
	background-image: url('Images/lina.png');
	background-repeat: no-repeat;
	width: 220px;
	float: left;
	margin: 20px 0px 0px 15px;
	height: 200px;
	clear: both;
}

.staffInfo
{
	background-image: url('Images/staffmid.png');
	background-repeat: repeat-y;
	margin: 0px 0px 0px 15px;
	padding: 5px 0px 5px 0px;
	width: 220px;
	height: 160px;
	float: left;
	clear: both;
}

.staffBot
{
	background-image: url('Images/staffbot.png');
	background-repeat: no-repeat;
	margin: 0px 0px 0px 15px;
	width: 220px;
	height: 19px;
	float: left;
	clear: both;
}

.clientShadow
{
	background-image: url('Images/sitio.png');
	background-repeat: no-repeat;
	width: 220px;
	float: left;
	margin: 20px 0px 0px 15px;
	height: 264px;
}

.clientHover
{
	width: 205px;
	float: left;
	height: 264px;
}

.clientHover:hover
{
	background-image: url('Images/blackroll.png');
	background-repeat: no-repeat;
	width: 205px;
	float: left;
	z-index: 1000;
	height: 204px;
}


.boxWeb
{
	background-image: url('Images/web.png');
	background-repeat: no-repeat;
	width: 440px;
	margin: 0px 0px 0px 10px;
	height: 153px;
}

.boxWeb:hover
{
	background-image: url('Images/webroll.png');
	background-repeat: no-repeat;
	width: 440px;
	height: 153px;
}

.boxMob
{
	background-image: url('Images/mobil.png');
	background-repeat: no-repeat;
	width: 440px;
	margin: 0px 0px 0px 10px;
	height: 153px;
}

.boxMob:hover
{
	background-image: url(  'Images/mobilroll.png' );
	background-repeat: no-repeat;
	width: 440px;
	height: 153px;
}

.boxDes
{
	background-image: url(  'Images/design.png' );
	background-repeat: no-repeat;
	width: 440px;
	margin: 0px 0px 0px 10px;
	height: 153px;
}

.boxDes:hover
{
	background-image: url('Images/designroll.png');
	background-repeat: no-repeat;
	width: 440px;
	height: 148px;
}

/* --------------menu------------- */

#menu
{height: 140px;}

.menuList
{width: 660px;}

.menuItem
{
	width: 90px;
	height: 140px;
	float: left;
	padding: 0px;
	margin-left: 10px;
	font-size: 14px;
}

.menuItem:hover
{
	background-image: url('Images/roll.png');
	background-repeat: repeat-x;
	height: 140px;
	color: White;
}

.hoverBtn
{
	position: 		relative;
	float:			left;
	
}

.hoverBtn a
{
	position: 		relative;
	z-index: 		2;
	display: 		block;
	width: 			100px;
	height: 		140px;
	text-align: 	center;
	font-size:		1.2em;
	text-decoration:none;
	color:			#000;
	padding-top:	55px;
	background:		transparent none repeat-x 0 0 scroll;
}

.hoverBtn div
{
	display:		none;
	position: 		absolute;
	z-index: 		1;
	top: 			0px;
	background:		white url(images/roll.png) repeat-x 0 0 scroll;
}

.menuItem a
{
	display: block;
	color: Black;
	height: 90px;
	padding-top: 60px;
}

.menuItem a:hover
{
	color: White;
}


/* -----------social--------------------------- */

.facebook
{
	background-image: url('Images/facebook.png');
	background-repeat: no-repeat;
	background-position: top;
	height: 30px;
	width: 31px;
	float: left;
	margin: 0px 0px 0px 5px;
}

.facebook:hover
{
	background-image: url('Images/facebook.png');
	background-repeat: no-repeat;
	background-position: bottom;
	width: 31px;
	height: 30px;
	float: left;
	margin: 0px 0px 0px 5px;
}

.facebook a
{
	width: 31px;
	height: 30px;
	float: left;
	margin: 0px 0px 0px 5px;
}

.twitter
{
	background-image: url('Images/twitter.png');
	background-repeat: no-repeat;
	background-position: top;
	height: 30px;
	float: left;
	width: 34px;
	margin: 0px 0px 0px 5px;
}

.twitter:hover
{
	background-image: url('Images/twitter.png');
	background-repeat: no-repeat;
	background-position: bottom;
	height: 30px;
	width: 34px;
	float: left;
	margin: 0px 0px 0px 5px;
}

.twitter a
{
	height: 30px;
	width: 34px;
	float: left;
	margin: 0px 0px 0px 5px;
}

.skype
{
	background-image: url( 'Images/skype.png');
	background-repeat: no-repeat;
	background-position: top;
	width: 33px;
	height: 30px;
	float: right;
	margin: 0px 0px 0px 5px;
}

.skype a
{
	width: 33px;
	height: 30px;
	float: right;
	margin: 0px 0px 0px 5px;
}

.skype:hover
{
	background-image: url('Images/skype.png');
	background-repeat: no-repeat;
	background-position: bottom;
	width: 33px;
	height: 30px;
	float: right;
	margin: 0px 0px 0px 5px;
}


/* -----------footer--------------------------- */

#footer_links
{
	float: right;
	margin-top: 15px;
	padding: 1em 1em 0em 1em;
}

#footerText
{
	font-size: 15px;
	color: White;
	float: left;
	margin-top: 20px;
}

#poweredby
{
	width: 70px;
	height: 13px;
	background-image: url('Images/poweredby.png');
	background-position: top;
	background-repeat: no-repeat;
	text-decoration: none;
}

#poweredby:hover
{
	width: 70px;
	height: 13px;
	background-image: url('images/poweredby.png');
	background-position: bottom;
	background-repeat: no-repeat;
}

ul.hover_block li
{
	list-style: none;
	float: left;
	background: #231f20;
	padding: 10px;
	height: 250px;
	width: 205px;
	position: relative;
	margin: 15px 8px 0px 7px;
}

ul.hover_block li a
{
	display: block;
	position: relative;
	float: left;
	overflow: hidden;
	height: 203px;
	width: 205px;
	color: #cccccc;
	line-height: 18px;
	text-align: left;
	padding-top: 10px;
	font-size: 1.2em;
	font-weight: bold;
}

ul.hover_block li a
{
	text-decoration: none;
}

ul.hover_block li img
{
	position: absolute;
	top: 0;
	left: 0;
	border: 0;
}

/* -----------javabox--------------------------- */

.boxgrid
{
	width: 205px;
	height: 206px;
	margin-top: 25px;
	margin-left: 28px;
	float: left;
	background: #161613;
	border: solid 0px #8399AF;
	overflow: hidden;
	position: relative;
}
.boxgrid img
{
	position: absolute;
	top: 0;
	left: 0;
	border: 0;
}
.boxgrid p
{
	padding: 0 10px;
	color:#ffffff;
}

.boxcaption
{
	float: left;
	position: absolute;
	background: #000;
	height: 100px;
	width: 100%;
	color:#ffffff;
	opacity: .8; /* For IE 5-7 */
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80); /* For IE 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
}
.captionfull .boxcaption
{
	top: 260;
	left: 0;
}
.caption .boxcaption
{
	top: 400;
	left: 0;
}

.cover
{
}

.deffoto
{
	margin-top:-80px;
	margin-left:50px;
}

.twitterDefault
{
	/*background-image: url('Images/twitterlogo.png');
	background-repeat: no-repeat;*/
	background-position: top;
	height: 300px;
	float: left;
	width: 220px;
	margin: 0px 0px 0px 35px;
}

.twitterDefault:hover
{
	background-position: top;
	height: 300px;
	width: 220px;
	float: left;
	margin: 0px 0px 0px 35px;
}
