/*



Theme Name: The Online Circle



Theme URI: http://theonlinecircle.com/



Description: The Online Circle



Version: 1.0



Author: The Online Circle



Author URI: http://theonlinecircle.com 



Copyright © The Online Circle



*/





body {

font-family: Tahoma, Geneva, Verdana, sans-serif;

font-size: 62.5%;

color: #000000;

margin: 15px 0 0 0;

background-color: #ffffff;

}



/* Wordpress Image Classes */



img.centered {

display: block;

margin-left: auto;

margin-right: auto;

}



img.alignright {

padding: 4px;

margin: 0 0 2px 7px;

display: inline;

}



img.alignleft {

padding: 4px;

margin: 0 7px 2px 0;

display: inline;

}



.alignright {

float: right;

}



.alignleft {

float: left;

}



.aligncenter {

margin: auto;

text-align: center;

display: block;

}



/* Text */



p {

font-size: 1.2em;

line-height: 1.3;

color: #58595b;

padding-bottom: 15px;

}



a, a:visited {

color: #0768b3;

font-weight: bold;

text-decoration: none;

}



a:hover {

color: #f7941d;

}



h1 {

font-size: 2.4em;

}



h2 {

font-size: 2.3em;

font-weight: normal;

color: #f7941d;

padding-bottom: 20px;

}



h2 img {

margin-right: 10px;

float: left;

}



h3 {

font-size: 1.2em;

}



h4 {

font-size: 1.1em;

}



ul {

list-style-position: inside;

list-style-type: disc;

padding-bottom: 15px;

}



ol {

list-style-position: inside;

padding-bottom: 15px;

}



li {

font-size: 1.2em;

line-height: 1.2;

color: #58595b;

}



/* DIVS */



.fxd {

width: 970px;

text-align: center;

margin: 0 auto;

}



.xpd {

width: 100%;

text-align: center;

margin: 0 auto;

}



#header {

height: 108px;

}



#logo {

float: left;

top:-5px;

}



#tagline {

float: right;

margin-top: 30px;

}



#sidebar {



}



#navbar {

float: right;

}



#content {

margin: 20px 0 0 0;

}



#homecont {



}



#footer {

clear: both;

background-image: url(footer-background.png);

background-repeat: repeat-x;

height: 112px;

margin: 20px 0 0 0;

}



#footercont {

padding: 20px 0 0 0;

}



#footer p {

clear: both;

color: #fff;

padding: 15px 0 0 0;

font-size: 1em;

}



#homefooter {

height: 70px;

padding-top: 20px;

}



#homefooter img, #footer img {

float: left;

}



#homebtaddress {

padding-left: 0;

}



.homebtnstack {

padding: 1px 0 2px 0;

}



#homebtnstack1 {

float: left;

width: 210px;

}



#homebtnstack2 {

float: left;

width: 180px;

}



#homebtnstack2 img {

margin: 0;

padding: 0;

}



#homebtnstack2 p {

margin: 15px 0 0 0;

padding: 0;

}



#homebtnstack2 #follow {

margin: 0 0 0 7px;

}



#homebtnstack3 {

float: left;

width: 80px;

}



.homebtnline {

margin: 0 59px;

}



#homecredit {

height: 16px;

background-image: url(copyright-background.png);

background-repeat: repeat-x;

color: #fff;

padding-top: 4px;

}



.clearall {

clear: both;

}



.mywidgets {



}



.navid {

margin: 0;

padding: 0;

}



div#post3 li.navhome,

{



}



#titlebar {

background-image: url(banner-background.png);

background-repeat: repeat-x;

height: 120px;

}



#titlebar img {

float: left;

margin-top: 50px;

}



#intcont {

margin: 50px auto;

text-align: left;

min-height: 300px;

}



#floatmenu {

position: absolute;

float: left; 

width: 340px;

text-align: left;

}



#floatmenu li {

list-style-position: inside;

list-style-image: url(TOCWEB-side-menu-arrow.png);

margin: 0 0 20px 0;

}



#floatmenu a, #floatmenu a:visited {

color: #0768b3;

font-size: 1.25em;

text-decoration: none;

font-weight: bold;

}



#maincol {

float: right;

text-align: left;

width: 640px;

}



.hidden { display: none; }

.unhidden { display: block; }



#contactform {

float: left;

width: 327px;

height: 343px;

background-image: url(contact_bkg1.png);

background-repeat: no-repeat;

margin-bottom: 40px;

}



#contact p {

padding: 0 0 3px 0;

}



#contact fieldset {

padding: 25px 0 0 35px;

}



#contact input {

margin: 0 0 15px 0;

width: 240px;

}



#contact textarea {

width: 240px;

height: 50px;

}



#contact input.btn {

background-image: url(contact_submit.png);

background-repeat: no-repeat;

background-color: #e5e6e7;

border: none;

width: 104px;

height: 36px;

margin: 20px 0 0 140px;

}



#contactmap {

float: right;

width: 617px;

height: 343px;

background-image: url(contact_bkg2.png);

background-repeat: no-repeat;

margin-bottom: 40px;

}



#contactmap img {

margin: 25px 25px 25px 25px;

}



#contactmap img.btn1 {

margin: 45px 25px 10px 25px;

}



#contactmap img.btn2 {

margin: 0 0 0 25px;

}



.pressgallery {

width: 600px;

margin-bottom: 15px;

height: 50px;

}



.mywidgets ul {

padding-bottom: 0;

}



#clientsgallery {

margin-left: 25px;

}



#clientsgallery img {



}



#clientsgallery div {

float: left;

margin: 0 30px 15px 0;

text-align: center;

}



#cu3er-container {width:970px; outline:0;}
#sticker {margin: 0 0 0 320px;}
#productsimage {margin-right: 50px; width:250px;}
#productstext {width: 600px; overflow:visible;}
#productsimage2 {margin-right: 50px; width:500px;}
#productstext2 {width: 400px; overflow:visible; padding-top: 40px;}
.teamcol {float:left; background-color:#d1d2d4; width:290px; height:435px; margin-top:40px;}
.teamcol img.btn {margin:0; padding:0;}
.teamcolmid {float:left; width:390px; text-align:center;}
.teamheader {margin: 10px;}
.teamcol p {padding: 0 10px; font-size:1.2em;}
.teambtnline {margin: 10px 0;}
.orange {color:#e3af49; font-weight:bold;}

/* OUR TEAM */

/* Gallery styles */

#gallery{
	/* CSS3 Box Shadow */
	
	/* CSS3 Rounded Corners */
	
	
	/* The width of the gallery */
	width:920px;
	overflow:hidden;
}

#slides{
	/* This is the slide area */
	height:530px;
	
	/* jQuery changes the width later on to the sum of the widths of all the slides. */
	width:920px;
	overflow:hidden;
}

.slide{
	float:left;
}

.slideint {width:920px; height:530px; }
.slideint .mainimg {float:left; }
.slideint .teamarrow {float:left; margin-top:40px; }
.slidetxt {float:left; background-color:#d1d2d4; width:290px; min-height:300px; text-align:left; margin-top:25px; }
.slidetxt p {text-align:left; padding: 0 10px 10px 10px;}

#menu{
	/* This is the container for the thumbnails */
	height:143px;
}


#gallery li{
	/* Every thumbnail is a li element */
	width:110px;
	display:inline-block;
	list-style:none;
	height:143px;
	overflow:hidden;
}

#gallery li.act a{
	cursor:default;
}

.menuint, .menuint2 { height:143px; }
li.inact #menu1 { background-image: url(http://theonlinecircle.com/wp-content/uploads/2010/02/TOCWEB-thumbnail-faded-jeff.jpg); }
li.inact #menu2 { background-image: url(http://theonlinecircle.com/wp-content/uploads/2010/02/TOCWEB-thumbnail-faded-lucio.jpg); }
li.inact #menu3 { background-image: url(http://theonlinecircle.com/wp-content/uploads/2010/02/TOCWEB-thumbnail-faded-james.jpg); }
li.inact #menu4 { background-image: url(http://theonlinecircle.com/wp-content/uploads/2010/02/TOCWEB-thumbnail-faded-anita.jpg); }
li.inact #menu5 { background-image: url(http://theonlinecircle.com/wp-content/uploads/2010/02/TOCWEB-thumbnail-faded-fernando.jpg); }
li.inact #menu6 { background-image: url(http://theonlinecircle.com/wp-content/uploads/2010/02/TOCWEB-thumbnail-faded-delphine.jpg); }
li.inact #menu7 { background-image: url(http://theonlinecircle.com/wp-content/uploads/2010/02/TOCWEB-thumbnail-faded-leigh.jpg); }
li.act #menu1, li.inact #menu1:hover { background-image: url(http://theonlinecircle.com/wp-content/uploads/2010/02/TOCWEB-team-thumbnail-jeff.jpg); }
li.act #menu2, li.inact #menu2:hover { background-image: url(http://theonlinecircle.com/wp-content/uploads/2010/02/TOCWEB-team-thumbnail-lucio.jpg); }
li.act #menu3, li.inact #menu3:hover { background-image: url(http://theonlinecircle.com/wp-content/uploads/2010/02/TOCWEB-team-thumbnail-james.jpg); }
li.act #menu4, li.inact #menu4:hover { background-image: url(http://theonlinecircle.com/wp-content/uploads/2010/02/TOCWEB-team-thumbnail-anita.jpg); }
li.act #menu5, li.inact #menu5:hover { background-image: url(http://theonlinecircle.com/wp-content/uploads/2010/02/TOCWEB-team-thumbnail-fernando.jpg); }
li.act #menu6, li.inact #menu6:hover { background-image: url(http://theonlinecircle.com/wp-content/uploads/2010/02/TOCWEB-team-thumbnail-delphine.jpg); }
li.act #menu7, li.inact #menu7:hover { background-image: url(http://theonlinecircle.com/wp-content/uploads/2010/02/TOCWEB-team-thumnail-leigh.jpg); }

.fbar{
	/* The left-most vertical bar, next to the first thumbnail */
	width:2px;
}

#gallery { margin-left:100px; }

#gallery li a{
	display:block;
}

#gallery a img{
	border:none;
}


/* The styles below are only necessary for the demo page */

#gallery #main{
	/* The main container */
	margin:15px auto;
	text-align:center;
	width:920px;
	position:relative;
}

#gallery a, #gallery a:visited {
	color:#0196e3;
	text-decoration:none;
	outline:none;
}


/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
.scrollable {

	/* required settings */
	position:relative;
	overflow:hidden;
	width: 555px;
	height:143px;
	float:left;
}

/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a extremely large width to accommodate scrollable items.
	it's enough that you set width and height for the root element and
	not for this element.
*/
.scrollable .items {
	/* this cannot be too large */
	width:2000em;
	position:absolute;
}

/*
	a single item. must be floated in horizontal scrolling.
	typically, this element is the one that *you* will style
	the most.
*/
.items .scrldiv, .items .scrldiv2 {
	float:left;
}

.browse {height:38px; width:26px; float:left; display:block; margin-top:50px; }
.prev { background-image:url(http://theonlinecircle.com/wp-content/uploads/2010/02/TOCWEB-team-arrowleft.png); margin-right:10px; margin-left:75px; }
.next { background-image:url(http://theonlinecircle.com/wp-content/uploads/2010/02/TOCWEB-team-arrowright.png); }