/*
Theme Name: Skylights of Los Angeles Custom Theme
Theme URI: http://www.jakobortiz.com
Description: Custom Wordpress theme created by JakobOrtiz
Version: 2.0
Author: Jacobo Ortiz Hernandez
Author URI: http://www.jakobortiz.com
*/

body {
	line-height: 1;
	text-align:center;
	background-image: url('images/bg-body.jpg');
	background-repeat:repeat-x;
	background-color:#f0f1f5;
	font-family:helvetica,arial;
	font-size:12px;
	color:#2c2f31;
	line-height:165%;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/*General Use Classes*/
h1,h2,h3,.menu-item,.hc{
	font-family: "Roboto", sans-serif;	
	line-height: 1.25;
}
p{
	font-family: "Open Sans", sans-serif;	
}
strong{
	font-weight:bold;
}
div.clear{
	clear:both;	
	overflow:hidden;	
}
.fleft{
	float:left;
}
.fright{
	float:right;
}
/*Theme Layout*/
div.page-wrapper{
	width: 100%;
	max-width: 960px;	
	margin:auto;
	text-align:left;
}
div#header{	
	background-repeat:no-repeat;
	width: 100%;
	max-width: 960px;
	height:97px;	
	margin:auto;
}
/*Menu*/
div#index-bg{
	background-image: url('images/bg-index.jpg');
	background-repeat:no-repeat;
	background-position:top center;
}
div#banner-right{
	background-image: url('images/bg-banner-title.jpg');
	background-repeat:no-repeat;
	width:284px;
	height:458px;
	overflow:hidden;
	padding-left:50px;
	padding-right:50px;
}
div#banner-right h1.title{
	display:Block;
	width:384px;
	height:200px;
	text-indent: -1000em;
	overflow:hidden;
	padding-bottom:18px;
}
div#banner-right p{
	font-size:15px;
	color:#FFFFFF;
	padding-bottom:15px;
	text-align:justify;	
}
div#banner-right ul li{
	font-size:16px;	
	color:#FFFFFF;
	padding-top:9px;
	padding-bottom:9px;
	list-style-type:square;		
	border-bottom:1px dotted #bfcbd7;
}
/*Gallery CSS*/
div#mg-wrapper{
	margin-top:42px;
	margin-left:25px;
	background-image: url('images/bg-index-gallery.png');
	background-repeat:no-repeat;
	width:525px;
	height:341px;
	overflow:hidden;
	padding-left:24px;	
	padding-top:22px;	
}
div#mg-wrapper div.picture-holder{
	width:501px;
	height:318px;
	overflow:hidden;
}
div#mg-wrapper div.slide{
	width:501px;
	height:318px;
	overflow:hidden;
}
/*Page Shadow*/
div#page-shadow{	
	background-repeat:repeat-y;
	margin:auto;	
}
div#content{
	width:593px;
	overflow:hidden;
	padding:25px;
	background-color:#f2f2f2;
}
div.single-row{
	padding-bottom:10px;
}
div.single-row p{
	color: #2C2F31;
    font-size: 12px;
    text-align: justify;
    text-decoration: none;
	padding-bottom:10px;
}
div.single-row ul{
	padding-left:20px;
	padding-bottom:20px;	
}
div.single-row ul li{
	border-bottom: 1px dotted #BFCBD7;    
    font-size: 12px;
    list-style-type: square;
    padding-bottom: 9px;
    padding-top: 9px;
	font-weight:bold;
}
div.two-column.row{
	padding-bottom:20px;
}
div.two-column.row div.col{
	width:270px;
	overflow:hidden;	
}
div.two-column.row div.col.fleft{
	padding-right:20px;	
}
div.two-column.row div.picture{
	width:250px;
	padding:10px;
	background-color:#d8dfe3;
	text-align:center;
}
div.two-column.row p.small-paragraph{
	padding-top:10px;
	padding-bottom:10px;
}
div.two-column.row p.small-paragraph,
div.two-column.row p.small-paragraph a{
	font-size:12px;
	color:#2c2f31;
	text-decoration:none;
	text-align:justify;
}
div.two-column.row h2{
	text-align:left;
	padding-bottom:5px;
	background-image: url('images/bullet-arrow.png');
	background-repeat:no-repeat;
	background-position:10px 3px;
	padding-left:25px;	
}
div.two-column.row h2 a{
	color: #2c2f31;
	font-size: 19px;	
	letter-spacing: -1px;
	line-height: 28px;
	text-decoration: none;	
	text-transform:uppercase;
}
/*sidebar*/
div#sidebar{
	width:317px;
	overflow:hidden;
	padding-top:10px;
	background-color:#f9f9f9;
}
div.sidebar-ad{
	text-align:center;
	padding-top:20px;
	padding-bottom:20px;
}
ul#menu-sidebar-menu li.menu-item{
	border-bottom:1px solid #ced3d4;
	padding-top:15px;
	padding-bottom:15px;
	padding-left:50px;
	background-image: url('images/bullet-arrow-bold.png');
	background-repeat:no-repeat;
	background-position:26px 16px;
}
ul#menu-sidebar-menu li.menu-item a{
	text-decoration:none;
	font-size:22px;
	font-weight:bold;
	letter-spacing:-1px;
	text-transform:uppercase;
	color:#393c3e;	
}
div#sidebar-form{
	width:317px;
	height:379px;
	background-image: url('images/bg-sidebar-form.png');
	background-repeat:no-repeat;	
}
form#consultation-form{
	padding-top:85px;
}
div#sidebar-form div.row{
	padding-bottom:39px;
	padding-left:115px;
}
div#sidebar-form div.row.last{	
	padding-bottom:0px;
}
div#sidebar-form div.button-row{
	padding-left:162px;
	padding-top:32px;
}
div#sidebar-form input.input_text{
	border:0px;	
	font-size:16px;
	padding:3px;
	width:175px;
	color:#707070;
}
div#sidebar-form input.input_text.error{
	background-image: url('images/error-sign.png');
	background-repeat:no-repeat;
	background-position:145px 3px;
}
form#consultation-form label.error{
	width:1px;
	height:1px;
	overflow:hidden;
	float:left;
}
div#sidebar div.contact-info{
	padding-left:20px;
	padding-right:20px;
	padding-top:20px;
}
div#sidebar h2.hc{
	font-size:22px;
	font-weight:bold;
	text-transform:uppercase;
}
div#sidebar p.paragraph{
	font-size:16px;
	line-height:22px;
}

/*pages*/
div.page-bg{	
	background-repeat:no-repeat;
	background-position:top center;
}
div.page-bg.bg-1{
	background-image: url('images/bg-page-1.jpg');	
}
div.page-bg.bg-2{
	background-image: url('images/bg-page-2.jpg');	
}
div.page-bg.bg-3{
	background-image: url('images/bg-page-3.jpg');	
}
div.page-bg.bg-4{
	background-image: url('images/bg-page-4.jpg');	
}
div.page-bg.bg-5{
	background-image: url('images/bg-page-5.jpg');	
}
div#page h1.hc{
	font-size:30px;
	color:#FFFFFF;
	font-weight:bold;
	padding:15px;
	margin-top:40px;
	margin-bottom:40px;
	background-image: url('images/bg-title.png');
}
div#page p{
	 color: #252525;
    font-family: arial,tahoma,verdana;
    font-size: 14px;
    line-height: 20px;
    padding-bottom: 20px;
    text-align: justify;
}
.alignright{
	float:right;
	padding-left:20px;
	padding-bottom:10px;
	padding-top:10px;
}
.alignleft {
	float:left;
	padding-right:20px;
	padding-bottom:10px;
	padding-top:10px;
}
div#page h1,
div#page h2,
div#page h3,
div#content h1,
div#content h2,
div#content h3{
	font-weight:bold;
	padding-bottom:10px;
}
div#content h1{
	font-size:30px;	
	font-weight:bold;
}
div#content div.picture h1,
div#content div.picture h2,
div#content div.picture h3{
	font-weight:normal;
}
div#content h2{
	font-size:25px;		
}
div#content h3{
	font-size:20px;		
}
/*footer*/
div#footer{
	background-color:#303030;
	padding-bottom:100px;	
	text-align:left;
	padding-top:20px;
}
div#footer .hc{
	display:block;
	font-size:15px;
	font-weight:bold;
	color:#FFFFFF;
	text-align:center;
	padding-top:10px;
	text-transform:uppercase;
}
ul#menu-footer{
	padding-left:160px;
}
ul#menu-footer li.menu-item{
	float:left;
	padding-left:10px;
	padding-right:10px;
	background-image: url('images/bullet-footer.jpg');
	background-position:left center;
	background-repeat:no-repeat;
}
ul#menu-footer li:first-child {
  background-image: none;
}
ul#menu-footer li.menu-item a{
	font-size:15px;
	text-decoration:none;
	color:#b9b9b9;	
}
/*gallery*/
div#gallery-thumbnails{
	padding-left:40px;
	padding-top:20px;
	padding-bottom:100px;
}
div#gallery-thumbnails div.row{
	width:150px;	
	padding:5px;	
	background-color:#313131;
	overflow:hidden;
	margin-right:15px;
	text-align:center;
	margin-bottom:15px;
}
div#gallery-thumbnails h2.subtitle{
	padding-top:5px;
}
div#gallery-thumbnails h2.subtitle a.link{
	font-size:14px;
	font-weight:normal;
	color:#FFFFFF;
	text-decoration:none;
}
div#content.gallery div#slides{
	height:600px;
	overflow:hidden;
	margin-bottom:10px;
	margin-top:20px;
	padding-top:40px;
	background-color:#FFFFFF;
	padding-bottom:40px;
	border-bottom:40px solid #FFFFFF;
}
div#content.gallery div#slides div.slide{
	width:593px;	
	height:640px;
	background-repeat:no-repeat;
	background-position:center top;			
}
div#content.gallery div#slides div.slide a.gallery{
	display:block;
	width:593px;
	height:600px;
}
div#content.gallery ul.breadcrumb li{
	font-size:18px;
}
div#content.gallery ul.breadcrumb li a.link{
	text-decoration:none;	
}
/*Contact Us Form*/
form#contactus-form{
	padding:20px;
	background-color:#303030;
}
form#contactus-form div.row{
	padding-bottom:10px;
}
form#contactus-form label.formlabel{
	display:block;
	font-size:20px;
	font-weight:bold;
	padding-bottom:5px;
	padding-top:10px;
	color:white;
}
form#contactus-form input.input_text,
form#contactus-form textarea.textarea{
	font-size:16px;
	padding:5px;
	width:530px;
	font-family:arial,tahoma,verdana;
	color:#393939;
}
form#contactus-form div.col{
	width:256px;	
}
form#contactus-form div.col{
	padding-right:20px;
}
form#contactus-form div.col input.input_text{
	width:256px;
}
form#contactus-form div.col select.select{
	width:268px;
	padding:5px;
}
form#contactus-form label.error{
	display:block;
	padding:5px;
	background-color:red;
	width:532px;
	color:white;
}
form#contactus-form div.col label.error{
	width:258px;	
}
div#page p.paragraph.pass{
	padding:10px;
	background-color:#e0ffbf;
	border:1px solid green;
	color:green;
	margin-bottom:10px;
}
/*colorbox*/
/*
    ColorBox Core Style
    The following rules are the styles that are consistant between themes.
    Avoid changing this area to maintain compatability with future versions of ColorBox.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative; overflow:hidden;}
#cboxLoadedContent{overflow:auto;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}

/* 
    Example user style
    The following rules are ordered and tabbed in a way that represents the
    order/nesting of the generated HTML, so that the structure easier to understand.
*/
#cboxOverlay{background:url(images/overlay.png) repeat 0 0;}
#colorbox{}
    #cboxTopLeft{width:21px; height:21px; background:url(images/controls.png) no-repeat -100px 0;}
    #cboxTopRight{width:21px; height:21px; background:url(images/controls.png) no-repeat -129px 0;}
    #cboxBottomLeft{width:21px; height:21px; background:url(images/controls.png) no-repeat -100px -29px;}
    #cboxBottomRight{width:21px; height:21px; background:url(images/controls.png) no-repeat -129px -29px;}
    #cboxMiddleLeft{width:21px; background:url(images/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(images/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(images/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(images/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff;}
        #cboxLoadedContent{margin-bottom:28px;}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom:0; left:0px; background:url(images/controls.png) no-repeat -75px 0px; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious.hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(images/controls.png) no-repeat -50px 0px; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext.hover{background-position:-50px -25px;}
        #cboxLoadingOverlay{background:url(images/loading_background.png) no-repeat center center;}
        #cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}
        #cboxClose{position:absolute; bottom:0; right:0; background:url(images/controls.png) no-repeat -25px 0px; width:25px; height:25px; text-indent:-9999px;}
        #cboxClose.hover{background-position:-25px -25px;}
        #cboxClose.hover{background-position:-25px -25px;}