/*
Theme Name: Lets Design it
Theme URI: http://www.letsdesignit.com.au
Description: A simple responsive theme based on twitter's bootstrap framework. Includes multiple page templates, two different sidebars and a theme options panel.
Version: 1.0
Author: 5150 Studios
Author URI: http://www.5150studios.com.au
Tags: black, white, one-column, two-columns, flexible-width, custom-background, custom-colors, custom-menu, full-width-template, theme-options
License: GNU General Public License v2.0 & Apache License 2.0
License URI: http://www.gnu.org/licenses/gpl-2.0.html http://www.apache.org/licenses/LICENSE-2.0
*/

body.home #scroller {
	margin-top: 70px;
}

#main {
	min-height: 480px;
}

#welcome {
	background: none repeat scroll 0 0 #000000;
	height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999;
}

#welcome #loading h1 {
    background: url("img/white-logo.png") no-repeat scroll center center transparent;
    height: 164px;
    margin: 150px auto 0;
    overflow: hidden;
    position: relative;
    text-indent: -9999em;
    width: 158px;
}

#scroller div.scrollableArea *
{
	position: relative;
	display: block;
	float: left;
	padding: 0 10px;
	margin: 0;
}


/* You can alter this CSS in order to give Smooth Div Scroll your own look'n'feel */

/* Invisible left hotspot */
div.scrollingHotSpotLeft
{
	/* The hotspots have a minimum width of 100 pixels and if there is room the will grow
    and occupy 15% of the scrollable area (30% combined). Adjust it to your own taste. */
	min-width: 75px;
	width: 10%;
	height: 100%;
	/* There is a big background image and it's used to solve some problems I experienced
    in Internet Explorer 6. */
	background-image: url('img/big_transparent.gif');
	background-repeat: repeat;
	background-position: center center;
	position: absolute;
	z-index: 200;
	left: 0;
	/*  The first url is for Firefox and other browsers, the second is for Internet Explorer */
	cursor: url(../images/cursors/cursor_arrow_left.png), url(../images/cursors/cursor_arrow_left.cur),w-resize;
}

/* Visible left hotspot */
div.scrollingHotSpotLeftVisible
{
	background-image: url('img/arrow_left.gif');				
	background-color: #fff;
	background-repeat: no-repeat;
	opacity: 0.35; /* Standard CSS3 opacity setting */
	-moz-opacity: 0.35; /* Opacity for really old versions of Mozilla Firefox (0.9 or older) */
	filter: alpha(opacity = 35); /* Opacity for Internet Explorer. */
	zoom: 1; /* Trigger "hasLayout" in Internet Explorer 6 or older versions */
}

/* Invisible right hotspot */
div.scrollingHotSpotRight
{
	min-width: 75px;
	width: 10%;
	height: 100%;
	background-image: url('img/big_transparent.gif');
	background-repeat: repeat;
	background-position: center center;
	position: absolute;
	z-index: 200;
	right: 0;
	cursor: url('img/cursors/cursor_arrow_right.png'), url('img/cursors/cursor_arrow_right.cur'),e-resize;
}

/* Visible right hotspot */
div.scrollingHotSpotRightVisible
{
	background-image: url('img/arrow_right.gif');
	background-color: #fff;
	background-repeat: no-repeat;
	opacity: 0.35;
	filter: alpha(opacity = 35);
	-moz-opacity: 0.35;
	zoom: 1;
}

/* The scroll wrapper is always the same width and height as the containing element (div).
   Overflow is hidden because you don't want to show all of the scrollable area.
*/
div.scrollWrapper
{
	position: relative;
	overflow: hidden;
	width: 880px;
	height: 100%;
}

div.scrollableArea
{
	position: relative;
	width: auto;
	height: 100%;
}

#scroller img {
	opacity: 0.3;
	display: none;
}

#work img {
	opacity: 1.0;
	margin: 8px;
}


#scroller {
	position: relative;
}

.home-text p {
	font-size: 12px;
}

.home-text li {
	font-size: 1.1em;
    line-height: 1.4em;
    list-style-type: square;
    margin-left: 40px;
}

.page-header {
	border-bottom: 1px solid #333333;
    margin: 18px 0;
    padding-bottom: 11px;
}

a {
	color: #b4021a;
}

a:hover, a:active {
	color:#d5021e;
}

.thumbnail {
	border: 1px solid #333333;
}

a.thumbnail:hover {
	border-color:#b4021a;
}

p {
	line-height: 25px;
	margin-bottom: 25px;
}

ul, ol {
	margin: 0 0 9px 0;
}

.featured-image {
	margin-bottom: 20px;
}

.post_content ul li {
    list-style-type: square;
    margin: 20px 0 20px 25px;
}

/****** Footer ******/

.footer-facebook a, .footer-twitter a, .footer-linkedin a {
	display: block;
}

.footer-facebook a {
	background: url("img/footer-social-media.png") no-repeat scroll 0 -17px transparent;
    height: 16px;
    text-indent: -9999em;
    width: 67px;
}

.footer-facebook a:hover {
	background: url("img/footer-social-media.png") no-repeat scroll 0 0 transparent;
}

.footer-twitter a {
	background: url("img/footer-social-media.png") no-repeat scroll -80px -17px transparent;
    height: 16px;
    text-indent: -9999em;
    width: 65px;
}

.footer-twitter a:hover {
	background: url("img/footer-social-media.png") no-repeat scroll -80px 0 transparent;
}

.footer-linkedin a {
	background: url("img/footer-social-media.png") no-repeat scroll -160px -17px transparent;
    height: 16px;
    text-indent: -9999em;
    width: 68px;
}

.footer-linkedin a:hover {
	background: url("img/footer-social-media.png") no-repeat scroll -160px 0 transparent;
}

img {
	margin: 10px 0;
}


.blogposts header {
	margin-bottom: 20px;
}

#comment-form-elements {
	list-style-type: none;
}

#sidebar1 .widget {
    margin: 20px 0;
}



blockquote {
	border-left: 5px solid #FF9900;
    margin: 30px 0;
}

blockquote p {
	font-size: 1.3em;
    font-weight: 300;
    line-height: 1.7em;
    margin-bottom: 0;
}

.post_content img.first {
	margin-left: 0;
}

.post_content img.last {
	margin-right: 0;
}

#sidebar1 ul li {
	list-style-type: none;
    margin: 10px 0;
}

#contact-map {
    margin: -2.5em -50px 2.5em;
}

#content .thumbnail {
	margin-bottom: 1.5em;
}

.home #content h3 a:hover {
	color:#0088CC;
	text-decoration: none;
}


#nav .container > #main-nav > li.current-menu-item a, #nav .container > #main-nav > li.current-menu-parent a {
	color: #ffffff;
}


#nav .container ul li ul li.current-menu-item a {
    color: #b4021a !important;
}

#nav .container ul li ul li a:hover, #nav .current-page-parent a, #nav .current_page_item a {
    color: #FFFFFF !important;
}

/* Footer Menu */

#footer ul li {
	list-style-type: square;
    margin: 7px 0;
}

#footer ul li a {
	color:#BBBBBB;
}

.footer-links ul {
	margin: 0;
}

.footer-links ul li {
	display: inline-block;
    margin: 0 7px;
}

#copyright .footer-links ul li a {
	color:#777777;
}

#copyright .footer-links ul li a:hover, #copyright .footer-links ul li a:active {
	color:#fafafa;
	text-decoration: none;
}


.about-container .about-item {
	padding-right: 2em;
}

.about-container .choose-item h3 i {
	margin-right: .4em;
	
	color: #F90;
}

.about-container .choose-item h3 {
	margin-bottom: 0;
	
	font-size: 12px;
}

.work-container .work-item .thumbnail {
	margin-bottom: 1.5em;
}

.service-container .service-item h3 {
	font-size: 12px;	
}

.service-container .service-item h3 i {
	position: relative;
	top: 3px;
	
	margin-right: .25em;
	
	color: #F90;
	
	font-size: 12px;
}


@media only screen and (max-width:767px){

#wrapper {
	padding: 0 20px;
}

#callnow {
	display: none;
}

#content {
	padding: 0;
}

}