/*	CSS Document for: The Number 27
	Designed by : The Number 27 - Web Design
	Designer name : Matt.

/*	Colors used on site :

background : #f4f4f4
content background :


*/

/*------------------------------
			GLOBAL
-------------------------------*/

body {
	background: #fff url(../images/logoicon3a.png) top center no-repeat;
    background-attachment: fixed;
	font-family: "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;
	font-size: 62.5%;
    font-weight: lighter;
    margin: 0;
}


img {
	border: none;
}

.clear {
	clear:both;
}

a:active
{
  outline: none;
}

a:focus
{
  outline: none;
}
.clear {
    clear: both;
}


/*------------------------------
			LAYOUT
-------------------------------*/
#container {
    width: 1100px;
	margin: 0 auto;
    position: relative;
    padding: 0;
}

#header {
    position: relative;
    width: 1100px;
    height: 175px;
    border-bottom: 1px solid #ccc;
}

#logo {
    position: absolute;
    top: 20px;
    left: 0;
    width: 320px;
    height: 100px;
}

.subtext {
    position: absolute;
    top: 50px;
    left: 410px;
    color: #999;
    font-size: 3em;
    font-style: italic;
    font-family: "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
    font-weight: 100;
    text-shadow: 1px 1px 2px #ccc;
}

#camsquote {
    position: absolute;
    top: 0px;
    left: 699px;
    width: 400px;
    height: 50px;
}

#navcontainer {
    position: absolute;
    top: 110px;
    right: 0;
    width: 679px;
    height: 60px;
}

#nav {
    margin: 0;
    padding: 0;
}

#content {
    float: left;
    margin-bottom: 20px;
    left: 0px;
    width: 900px;
    min-height: 400px;
}
.fade {
    min-height: 400px;
    background: url(../images/quotes.png) no-repeat;
    margin-top: 10px;
}

.portfolio {
    height: 410px;
    margin-bottom: 20px;
}

#topleft {
    float: left;
    width: 450px;
}
#topleft ul li {
    font-size: 1.4em;
}
#topright {
    float: left;
    width: 450px;
    margin-bottom: 10px;

}
#topright ul li {
    font-size: 1.4em;
}
#bottomleft {
    float: left;
    width: 450px;
}
#bottomleft ul li {
    font-size: 1.4em;
}

#bottomright {
    float: left;
    width: 450px;
}

#bottomright ul li {
    font-size: 1.4em;
}

#sidebar {
    float: left;
    margin-top: 40px;
    margin-bottom: 20px;
    padding-bottom: 10px;
    width: 199px;
    border-left: 1px solid #ccc;
}

#footer {
    float: left;
}

#footercontent {
    position: relative;
    width: 1100px;
    height: 200px;
    border-top: 1px solid #ccc;
}
#twitter {
    margin: 0 10px;
}

.green {
    position: absolute;
    top: 113px;
    right: 0px;
}

#info-nav {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 180px;
    height: 128px;
    margin: 0;
    padding: 0;
    text-align: right;
}
#info-nav h2 {
    text-align: left;
    padding-left: 45px;
}

#footerbar {
    position: absolute;
    top: 100px;
    left: 0;
}

#contactform {
    width: 885px;
    height: 290px;
}


/*------------------------------
          NAV
-----------------------------*/


#footernav li {
	font-size: 1.4em;
    line-height: 1.6em;
	list-style: none;
    zoom: 1;
}
#footernav a:link, #footernav a:visited {
	color: #777;
	text-decoration: none;
    text-shadow: 1px 1px 2px #ccc;
}

#footernav a:hover {
    color: #fe5555;
}





body#support-page ul li.support a {
    color: #fe5555;
}
body#terms-page ul li.terms a {
    color: #fe5555;
}
body#sitemap-page ul li.sitemap a {
    color: #fe5555;
}
body#policy-page ul li.policy a {
    color: #fe5555;
}
/*------------------------------
          SOCIAL STUFF
-----------------------------*/

#twitter {
    margin: 0 10px;
}

#share {
    position: absolute;
    top: 0px;
    left: 500px;
    width: 178px;
    height: 64px;
}

.like {
    float: left;
    width: 50px;
    height: 62px;
}

.tweet {
    float: left;
    width: 58px;
    height: 64px;
    margin: 0 10px;
}

.g-plusone {
    float: left;
    width: 50px;
    height: 60px;

}

/*------------------------------
           BLOG STUFF
-----------------------------*/

.ditto_info {
    display: none;
}
.ditto_tags {
    display: none;
}

.reflect_archive, .reflect_months, .reflect_items {
    list-style: none;
    margin: 0;
    padding: 0;
    padding-left: 10px;
    font-size: 1.1em;
}

#sidebar {
    color: #666;
}

#sidebar h3 {
    color: #777;
    font-size: 1.6em;
    font-weight: lighter;
    margin: 0 0 5px 10px;
    padding: 0;
    text-shadow: 1px 1px 2px #ccc;
}
.ditto_summaryPost h3 {
    color: #777;
    font-size: 2em;
    font-weight: lighter;
    margin: 5px 0 5px 0;
    padding: 0;
    text-shadow: 1px 1px 2px #ccc;
}

#sidebar .ditto_summaryPost h3 {
    display: none;
}
#commentsAnchor {
    font-size: inherit;
    color: #666;
}

.return {
    font-size: 1.1em;
}

/*------------------------------
			TEXT
-------------------------------*/

#content p {
   color: #666;
   font-size: 1.6em;
   margin: 5px 10px 5px 0;
}
body#blog-page p {
    font-size: 1.4em;
    margin-bottom: 15px;
}

#sidebar p {
   color: #666;
   font-size: 1.4em;
   margin: 0 10px 10px 10px;
}

#content .tab_content p {
    font-size: 1.3em;
    margin-left: 30px;
    margin-bottom: 10px;
}

#topleft p {
    font-size: 1.4em;
    margin-bottom: 10px;
}
#topright p {
    font-size: 1.4em;
    margin-bottom: 10px;
}

#bottomright p {
    font-size: 1.4em;
    margin-top: 10px;
}


body#links-page #topleft p {
    font-size: 1.3em;
    margin-left: 30px;
    margin-bottom: 10px;
}
body#links-page #topright p {
    font-size: 1.3em;
    margin-left: 30px;
    margin-bottom: 10px;
}
body#links-page #wide p {
    font-size: 1.3em;
    margin-left: 30px;
    margin-bottom: 10px;
}
body#testimonials-page #wide p {
    font-family: "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
    font-size: 1.8em;
    line-height: 1.6em;
    font-style: italic;
    text-shadow: 1px 1px 2px #ccc;
}
body#testimonials-page #wide strong {
    font-style: normal;
}

#social p {
    color: #666;
    font-size: 1.4em;
    margin: 0;
    margin-top: 2px;
}

#advert p {
    position: absolute;
    top: -10px;
    left: 20px;
    margin: 0;
    padding: 0 10px;
    background: #f9f9f9;
    color: #666;
    font-size: 1.2em;
}

.copywrite {
   position: absolute;
   top: 177px;
   left: 350px;
   color: #666;
   font-size: 1.4em;
}
.copywrite a {
  color: #666;
  text-decoration: none;
}
.copywrite a:hover {
    color: #fe5555;
}

.green {
   position: absolute;
   top: 158px;
   right: 0px;
   color: #33cc33;
   font-size: 1.4em;
   text-align: right;
}
.green a {
  color: #33cc33;
  text-decoration: none;
}
.green a:hover {
    color: #666;
}
.quote {
    position: absolute;
    top: 5px;
    right: 0;
    text-align: right;
    color: #999;
    font-size: 1.5em;
    text-shadow: 1px 1px 2px #ccc;
    cursor: pointer;
}


#commentbox p {
    font-size: 1.4em;
}


/*------------------------------
			HEADINGS
-------------------------------*/

#content h1 {
    color: #777;
    font-size: 1.5em;
    line-height: 20px;
    font-weight: lighter;
    margin: 5px 0 5px 0;
    padding: 0;
    padding-left: 30px;
    text-shadow: 1px 1px 2px #ccc;
    background: url(../images/smalltick.png) no-repeat;
}
body#links-page #content h1 {
    background: url(../images/smalloutlink.png) no-repeat;
}

h2 {
    color: #777;
    font-size: 2em;
    font-weight: lighter;
    margin: 15px 0;
    padding: 0;
    text-shadow: 1px 1px 2px #ccc;
}
#sidebar h2 {
    margin: 0 0 5px 10px;
    padding: 0;
}

#footer h2 {
    margin: 5px 0;
}

h3 {
    color: #999;
    font-weight: lighter;
    margin: 30px 0 0 0;
    padding: 0;
    clear: both;
}

#sidebar h3 {
    margin: 0 0 0 10px;
}

h4 {
    color: #777;
    font-size: 1.6em;
    font-weight: lighter;
    margin: 0;
    margin-bottom: 35px;
    padding: 0;
    text-shadow: 1px 1px 2px #ccc;
}


/*------------------------------
			LINKS
-------------------------------*/
#content a:link, #content a:visited {
	color: #fe5555;
	text-decoration: none;
    text-shadow: 1px 1px 2px #ccc;
}
#content a:hover {
	color: #666;
    text-decoration: none;
}
#content .tabs a:link, #content .tabs a:visited {
	color: #666;
	text-decoration: none;
    text-shadow: 1px 1px 2px #ccc;
}
#content .tabs a:hover, #content .tabs .active a {
	color: #fe5555;
    text-decoration: none;
}

.rss a:hover {
	color: #fe5555;
    text-decoration: none;
}

#twitter a:link, #twitter a:visited {
	color: #fe5555;
    text-decoration: none;
    font-size: 1.1em;
    text-shadow: 1px 1px 2px #ccc;
}
#twitter a:hover {
	color: #666;
    text-decoration: none;
    font-size: 1.1em;
}

#sidebar a:link, #sidebar a:visited {
	color: #fe5555;
	text-decoration: none;
    text-shadow: 1px 1px 2px #ccc;
}
#sidebar a:hover {
	color: #666;
    text-decoration: none;
}



/*------------------------------
			LISTS
-------------------------------*/
#content ul {
    margin: 2px;
    margin-left: 0;
    padding: 0;
}

#content .tabs li {
    display: inline;
	font-size: 20px;
    padding-right: 100px;
    zoom: 1;
}

#content li {
    list-style: none;
    color: #666;
    font-size: 1.6em;
    line-height: 1.6em;
}

#content .ticklist li {
    list-style: none;
    line-height: 20px;
    margin: 0 0 10px 0;
    padding-left: 30px;
    background: url(../images/smalltick.png) no-repeat;
}
#content .outlink li {
    list-style: none;
    line-height: 20px;
    margin: 0 0 10px 0;
    padding-left: 30px;
    background: url(../images/smalloutlink.png) no-repeat;
}

#twitter_div ul {
    font-size: 1.4em;
    color: #666;
    list-style: none;
    padding: 0;
    margin: 0;
    margin-bottom: 10px;
}
#twitter_div ul li {
    margin-bottom: 5px;
}


#content .facts li {
    list-style: decimal;
    margin-left: 27px;
    margin-right: 10px;
    font-size: 1.4em;
}

body#guides-page #content ul {
    margin-bottom: 10px;
}

body#guides-page #content li {
    list-style: none;
    background: url(../images/pdf.png) no-repeat;
    line-height: 20px;
    margin: 5px 0;
    padding: 0;
}
body#guides-page #content li a {
    padding-left: 30px;
    font-weight: normal;
}

#footercontent .social {
    position: absolute;
    top: 35px;
    left: 0;
    color: #666;
    font-size: 1.4em;
    padding: 0;
    margin: 0;
}
#content .social li {
    line-height: 32px;
}

.social li {
    list-style: none;
    line-height: 32px;
    margin: 0 0 10px 0;
    padding-left: 40px;
}
.social li a {
    font-weight: normal;
    color: #666;
    text-decoration: none;
}
.social li a:hover {
    color: #fe5555;
}
#sidebar .social {
    margin: 0 0 0 10px;
    padding: 0;
}

#sidebar .social li {
    list-style: none;
    line-height: 32px;
    margin: 0 0 10px 0;
    padding-left: 40px;
}
#sidebar .social li a {
    font-size: 1.4em;
}

#sidebar ul#myajaxmenu {
    list-style: none;
    font-size: 1.4em;
    margin: 0;
    padding: 10px;
}
#sidebar ul#myajaxmenu li {
    margin: 0 0 10px 0;
}

li.rss {
    background: url(../images/rss.png) no-repeat;
}

li.me {
    background: url(../images/me.png) no-repeat;
}
li.phone {
    background: url(../images/phone.png) no-repeat;
}
li.email {
    background: url(../images/email.png) no-repeat;
}
li.twit {
    background: url(../images/twitter.png) no-repeat;
}
li.fbook {
    background: url(../images/facebook.png) no-repeat;
}
li.mspace {
    background: url(../images/myspace.png) no-repeat;
}
li.ytube {
    background: url(../images/youtube.png) no-repeat;
}
li.tblr {
    background: url(../images/tumblr.png) no-repeat;
}
li.aboutme {
    background: url(../images/aboutme.png) no-repeat;
}
li.linkin {
    background: url(../images/linkedin.png) no-repeat;
}
li.wpress {
    background: url(../images/wordpress.png) no-repeat;
}
li.outlink {
    background: url(../images/outlink.png) no-repeat;
}
li.reverb {
    background: url(../images/reverbnation.png) no-repeat;
}
li.flash {
    background: url(../images/flash.png) no-repeat;
}
/*------------------------------
			IMAGES
--------------------------------*/
.twittericon {
    position: absolute;
    top: 10px;
    left: 0;
}

.facebookicon {
    position: absolute;
    top: 55px;
    left: 0;
}

.icon {
    margin-top: 60px;
    margin-right: 10px;
}

.curio {
    position: absolute;
    top: 160px;
    left: 850px;
    cursor: pointer;
}



/*------------------------------
			FORMS
-------------------------------*/

form .contactform {
    margin: 0;
	padding: 0;
}

fieldset {
    float: left;
    border: none;
    padding: 0;
    margin: 0 30px 10px 0;
}

label {
	display:  block;
	color: #666;
    padding-top: 10px;
    margin: 0;
}

input {
	width:  230px;
	background: none;
	border: 1px solid #ccc;
    border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	font-size: 1em;
	color: #666;
}
select {
	width: 230px;
    height: 24px;
    padding: 2px;
	background: none;
	border: 1px solid #ccc;
    border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	color: #666;
}

textarea {
	width:  502px;
    height: 205px;
	background: none;
	border: 1px solid #ccc;
    border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
    font-family: "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;
	font-size: 1em;
	color: #666;
    margin-top: 0;
}

input.btn {
    background: url(../images/submit.png) no-repeat;
	width: 125px;
    height: 24px;
	font-size: 1.1em;
    color: #fff;
    font-weight: lighter;
    border: none;
    margin-top: 10px;
    padding: 0 0 2px 10px;
    cursor: pointer;
}

fieldset p {
   padding-left: 25px;
   padding: 0;
   margin: 0;
}
.veriword {
    margin-top: 30px;
}


/*--------------------------------
       FORM SUBSCRIBER
---------------------------------*/

.subscribe label {
    width: 185px;
}
.subscribe input {
    width: 185px;
}
.subscribe input.btn {
    background: url(../images/subscribe.jpg) no-repeat;
	width: 100px;
    height: 27px;
	font-size: 1em;
    color: #777;
    font-weight: lighter;
    border: none;
    margin-top: 5px;
    padding: 0;
}



/*--------------------------------
       TABLES
---------------------------------*/
.response {
   color: #666;
   font-size: 1.6em;
   margin: 10px 25px 0 0;
}

/*-------------------------------
       SLIDER
---------------------------------*/

.i-slider-frame {
	position: relative;
	z-index: 100;
	overflow: hidden;
}
.i-slider-sections {
	float: left;
	position: relative;
}
.i-slider-section {
	position: relative;
	float: left;
}


.slider {
	position: relative;
	width: 895px;
	height: 170px;
	margin-bottom: 15px;
}

#slider {
	position: relative;
	float: left;
	width: 895px;
	height: 170px;
}

#slider .i-slider-section h1 {
	margin: 0 20px 0 0;
    padding: 0;
	float: left;
	width: 460px;
    color: #999;
    font-size: 3em;
    line-height: 1.5em;
    font-family: "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
    font-weight: 100;
    text-shadow: 1px 1px 2px #ccc;
    background: none;
}
#slider .i-slider-section img {
	position: absolute;
	top: 10px;
	right: 10px;
	background: url(../images/shadow.jpg) no-repeat;
}

