/*  
Theme Name: Landisimo - facebook landing page
Description: Landing Page - clean and minimal design, it can be use to any kind of product with Facebook landing page template
Version: 1.0
Author: Moraru Razvan aka Hazmy
Author URI: http://themeforest.net/user/hazmy
*/

/* ========================================
		 ==== Reset Styles ==== 
========================================*/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;/*background:transparent*/
}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}
/* ========================================
		==== End Reset Styles ==== 
 ========================================*/





/*========================================
 	==== General Typorgraphy ====  
========================================*/
body { /*overflow:hidden;*/ position:relative; background: url(../images/bg/pt10.png) repeat; color:#fff; font-family: Arial, Helvetica, sans-serif; }
/* ==== Typography ==== */
p { line-height: 1.6em; font-size: 12px; }
a { font-size:14px; color: #fff; text-decoration: none; }
h1 { font-size:24px; }
h2 { font-size: 20px;}
h3 { font-size: 18px; }
h4 { font-size:16px; }
h1,h2, h3, h4, h5, h6 { color:#ffab00; }
span.hightlight { color: #ffab00; }
p.emphasize { font-size:14px; }
	/* h2.title - the title for every section (.stepWrap, .tabWrap, .fbWrap, .buyWrap) */
	h2.title { text-align:center; font-weight:700; font-size:22px; color:#ffab00; margin-bottom:35px; }
	/* ==== Begin span.pointer - the arrow for the tittles ====*/
	.pointer { background: url(../images/default/pointer.png) no-repeat; width:25px; height:18px; display:inline-block; position:relative; top:10px; left:0px; }
	/* ==== End span.pointer ====*/
	/*===== ul li styling =====*/
	.checkList li { background: url(../images/default/check.png) no-repeat; margin-bottom:10px; font-size: 12px; color: #a0a0a0; padding-left:25px; line-height:1.6em; }
	.checkList { margin-bottom:20px; }
	/*==== end ul li styling ====*/
	
	/*=== Begin h2.tagline === */
	h2.tagline {color:#fff;}
	/*=== End Begin h2.tagline === */
/* ========================================
 	==== End General Typography ====  
========================================*/




/*========================================
	 ==== Layout General Structure  ====  
	  (floats, clearfix and wrappers)
========================================*/
#wrapper { position:relative; width: 520px; margin:0 auto; }
.fleft { float:left; }  /* floats selements to left */
.fright { float:right; } /*floats elements to right */
.clearfix { clear:both; }


/* If you want to hide one or more of the section, just remove the css comments */
#stepWrap { /*display:none !important;*/}
#tabWrap { /*display:none !important;*/}
#fbWrap { /*display:none !important;*/}
#buyWrap { /*display:none !important;*/}
/* ========================================
	==== End Layout General Structure ==== 
 ========================================*/
 
 
 
 
 /*========================================
==== Background patterns for the main elements  ====
   (#mainContent, #stepWrap, #tabWrap, #fbWrap)   
========================================*/
/* Here you can change your background patterns for the main elements */
	/*==== #mainContent ==== */
	#mainContent {background: url(../images/bg/elements-pt7.png) repeat;}
	/*==== End #mainContent ==== */
	
	/*==== #stepWrap ==== */
	.step1, .step2, .step3 {background: url(../images/bg/elements-pt7.png) repeat;}
	/*==== End #stepWrap ==== */
	
	/*==== #tab_container(#tabWrap) ==== */
	.tab_container {background: url(../images/bg/elements-pt7.png) repeat;}
	/*==== End #tab_container ==== */
	
	/*==== #fbcomments(#fbWrap) ==== */
	#fbcomments {background: url(../images/bg/elements-pt7.png) repeat;}
	/*==== End #fbcomments ==== */
 	/*==== .modal-download ====*/
	.modal-download {background: url(../images/bg/elements-pt7.png) repeat;}
	
	/*==== End .modal-download ==== */
 /*========================================
====End Background patterns for the main elements  ====
   (#mainContent, #stepWrap, #tabWrap, #fbWrap)   
========================================*/ 
 
 
 
 
 
 
 /* ========================================
 ==== #header - the top section of the site, contains the logo and the tagline ==== 
  ========================================*/
#header { width:520px; border-top: 6px solid #000; }
#header #logo { margin:12px 0px 0px 6px; }
#header #logo a { background:url(../images/default/logo.png) no-repeat; width:119px; height:26px; display:block; }
#header h2 { margin:12px 0 10px 10px; }
/* ========================================
 		 ==== End #header ==== 
========================================*/




/* ========================================
 ==== #mainContent - contains the structure of the scrollable plugin, and the styling for the 3 slides, the #price and the #act-buttons ==== 
 			here you will find everything to change, customize this section
 ========================================*/
 #mainContent {margin: 0 auto; width: 510px; position: relative; border:1px solid #444444; -moz-box-shadow: 0px 1px 2px #000000; -webkit-box-shadow: 0px 1px 2px #000000; box-shadow: 0px 1px 2px #000000; /* Rounded Corners */ -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; }
 	
	/* ==== Slider Control Buttons ==== */
	a.sliderLeft { background:url(../images/default/navslider-left.png) no-repeat; display:block; height:60px; z-index:9999; position:absolute; top:117px; left:-4px; width:14px; cursor:pointer; }
	a.sliderRight { background: url(../images/default/navslider-right.png) no-repeat; display:block; position:absolute; z-index:9999; cursor:pointer; top:117px; right:-4px; height:60px; width:14px; }
	a.sliderRight:hover { background:url(../images/default/navslider-right-hover.png) no-repeat; }
	a.sliderLeft:hover { background:url(../images/default/navslider-left-hover.png) no-repeat; }
	/* ==== End Slider Control button ==== */
	
	/* ==== Begin .action-btns ==== */
	.action-btns { margin: 10px 10px 20px 0; }
	.action-btns ul li { float: left; }
	.action-btns ul li a { background: url(../images/default/act-btn.png) no-repeat; display: block; width: 124px; height:  43px; line-height:43px; text-align:center; font-size: 20px; color: #fff; font-weight: bold; }
	.or { margin: 0 10px; line-height:43px; font-size:24px; }
	/* ==== End .action-btns ==== */
	
	/*==== begin .mainCorner (mainContent sliced corner image) ====*/
	.mainCorner {
	position: absolute;
	width: 485px;
	height: 85px;
	display: block;
	top: 14px;
	left: 14px;
	background-image: url(../images/bg/pt111.png);
	background-repeat: no-repeat;
}
	/*==== End  .mainCorner ====*/

	/* ==== Scrollable ==== */
	
	/* root element for the scrollable. when scrolling occurs this element stays still. */
	.scrollable { /* required settings */
	position: relative;
	overflow: hidden;
	width: 510px;
	height: 100px;/* custom decorations */
}

	/*
		root element for scrollable items. Must be absolutely positioned
		and it should have a extremely large width to accomodate scrollable items.
		it's enough that you set the width and height for the root element and
		not for this element.
	*/
	.scrollable .items { /* this cannot be too large */ width:20000em; position:absolute; clear:both; }
	.items div.slide1, .items div.slide2, .items div.slide3 { float:left; width:510px; }
	/* ==== End scrollable structure setup ==== */
	
		/* ==== Slide 1 ( .description and .imageHolder) ==== */
		
			#mainContent .description { padding-right:10px; width:290px; }
			#mainContent .description h3 { margin: 20px 0 15px 0; text-align:center; }
			#mainContent .imageHolder img { padding-left:15px; margin-top:57px; }
			#mainContent p { margin-bottom:20px; }
			
		/* ==== End Slide 1 ==== */
	
		/* ==== Slide 2 ( .testimonials)  ==== */
		
			/* ==== .testimonials ===*/
			.slide2 h2, .slide3 h2 { margin-top:20px; margin-left:20px; margin-bottom:20px; color:#f7a904; }
			.slide2 .testimonials li { width:250px; float:left; margin-bottom:40px; }
			.slide2 h3 { text-align:left; margin-bottom:10px; margin-left:15px; font-size:16px; font-weight:700; }
			.slide2 .testimonials li img {  float:left; margin-right:10px; margin-left:15px; clear:both; -moz-border-radius: 5px; -webkit-border-radius:5px; }
			.slide2 h4 { margin-bottom:10px; font-size:14px; }
			.slide2 p { font-family: Georgia, "Times New Roman", Times, serif; font-size:12px; font-style:italic; color:#fff; }
			/*==== end .testimonials ==== */
			
		/* ==== End Slide 2 ==== */
		
		/* ==== Slide 3 (featuresTable and sliderform ====*/
			
				/* ====Slider-Form (slide )==== */
				.slide3 .quote { font-family: Georgia, "Times New Roman", Times, serif; font-size:16px; font-style:italic; line-height:1.6em; color:#ababae; display:block; margin: 0 20px; }
				.slide3 .info { font-family: Georgia, "Times New Roman", Times, serif; font-size:10px; font-style:italic; clear:both; display:block; color:#898989; margin-top:30px; margin-left:40px; }
				.slide3 { height:500px; z-index:2; overflow:visible; }
				
				/* ===== #subscribe-sliderForm Styling ===== */
				#subscribe-sliderForm { display:block; position:relative; width:340px; margin:30px auto 0; }
				#subscribe-sliderForm .error { line-height:12px; font-size:12px; color:#fd5b5b; float:right; z-index: 9999; display:inline; }
				#subscribe-sliderForm input.Email.required.email.error { border:1px solid #fd5b5b; }
				#subscribe-sliderForm input, #subscribe-sliderForm textarea { text-align:center; line-height:25px; width: 225px; height:25px; border: 1px solid #cacaca; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius:	5px; color:#999; float:right; margin-bottom:10px;background:#666; }
				#subscribe-sliderForm label { line-height:26px; font-size:14px; font-family: Arial, Helvetica, sans-serif; color:#fff; display:block; float:left; clear:both; }
				#subscribe-sliderForm textarea:focus, #subscribe-sliderForm input:focus { background:#fff; border: 1px solid #ffb96e; line-height:25px; color: #828282; text-align:left; }
				#subscribe-sliderForm .submit-button { float:right; font-size:14px; border:none; background: url(../images/default/submit-form.png) no-repeat; width: 109px; height:40px; line-height:40px; color:#fff; text-shadow: 0px -1px 1px #cf7500; letter-spacing:0.5px; cursor:pointer; clear:both; display:block; margin-top:10px; font-weight:700; }
				
				/* ===== End #subscribe-sliderForm Styling ===== */
				
		/* ==== End slide 3 ==== */
	
	/* ==== End .scrollable ==== */

/* ========================================
 	 ==== End #mainContent ==== 
========================================*/




  
/* ========================================
==== #stepWrapper contains the structure and the styling for the 3 column steps ==== 
========================================*/
#stepWrap {
	width: 510px;
	display: block;
	position: relative;
	margin: 40px auto;
	text-align: center;
}
#stepWrap h3 { font-size:20px; color:#ffab00; margin-top:10px; margin-bottom:20px; }
#stepWrap p { padding:0 10px; }
.step1, .step2, .step3 { position:relative; float:left; width:151px; height:200px; margin-right:20px;border:1px solid #444444; }
span.fb_edge_comment_widget.fb_iframe_widget { display: none !important; } /* hides the Facebook comment box after the user clicks like */
	
	
	/* ==== Begin span.line-middle ====*/
	span.line-middle { position:absolute; width:20px; height:1px; background: url(../images/default/line-middle.png); right:-21px; display:block; top:20px; }
	/* ==== End span.line-middle ====*/
	
	/*==== .step1 ====*/
	a.nextStep { background: url(../images/default/nextstep.png) no-repeat; width:38px; height:28px; display:block; margin:20px auto 0; }
	/*==== End .step1 ====*/
	
	/*==== .step2 ====*/
	.like-btn {
	height: 29px;
	width: 78px;
	display: block;
	overflow: hidden;
	margin-top: 20px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	visibility: visible;
}
	/*==== end .step2 ====*/
	
	/*==== .step3 ====*/
	.step3 { margin-right:0px; }
	a.download-btn { color:#fff; background: url(../images/default/download.png) no-repeat; width:109px; height:40px; display:block; font-size:16px; line-height:40px; text-align:center; margin:25px auto 0; font-weight:700; }
	/*==== end .step3 ====*/
	
	/* The modal window Download  styling */
	.modal-download {
	display: none;
	width: 300px;
	padding: 15px;
	text-align: center;
	border: 3px solid #dec89a; /* Rounded Corners */
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
}
	.modal-download .close { background:url(../images/default/close.png) center no-repeat; display:block; position:absolute; right:-5px; top:-5px; cursor:pointer; height:26px; width:26px; }
	.modal-download .close:hover { background:url(../images/default/close-hover.png) center no-repeat; height:26px; width:26px; display:block; position:absolute; right:-5px; top:-5px; }
	/* End modal window styling ).modal-subscribe */
	
		/* Overlay-subscribe styling elements */
		#overlay-download img.box { float:left; margin-right:15px; }
		#overlay-download h2.title { margin-top:0px; margin-bottom:20px }
		#overlay-download .quote {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 16px;
	font-style: italic;
	line-height: 1.6em;
	color: #ababae;
	display: block;
	margin-left: 0px;
	margin-bottom: 20px;
}
		#overlay-download .info { font-family: Georgia, "Times New Roman", Times, serif; font-size:10px; font-style:italic; clear:both; display:block; color:#898989; padding-top:30px; margin-left:40px; }
		/* End Overlay-subscribe styling elements */
		
		/* ====== #subscribe-overlayForm styling ====== */
		#download-overlayForm { margin-left:15px; float:left; display:block; position:relative; width:235px; }
		#download-overlayForm .error { line-height:12px; font-size:12px; color:#fd5b5b; float:right; z-index: 9999; display:inline; }
		#download-overlayForm input.Email.required.email.error { border:1px solid #fd5b5b; }
		#download-overlayForm input, #download-overlayForm textarea { background:#666; text-align:center; line-height:25px; width: 225px; height:25px; border: 1px solid #cacaca; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius:	5px; color:#999; float:right; margin-bottom:10px; }
		#download-overlayForm label { margin-left:10px; line-height:26px; font-size:14px; font-family: Arial, Helvetica, sans-serif; color:#fff; display:block; float:left; clear:both; }
		#download-overlayForm textarea:focus, #download-overlayForm input:focus {background:#fff; border: 1px solid #ffab00; line-height:25px; color: #828282; text-align:left; }
		#download-overlayForm .submit-button { float:right; font-size:14px; border:none; background: url(../images/default/submit-form.png) no-repeat; width: 109px; height:40px; line-height:40px; color:#fff; text-shadow: 0px -1px 1px #cf7500; letter-spacing:0.5px; cursor:pointer; clear:both; display:block; margin-top:10px; font-weight:700; }
		/* ====== #subscribe-overlayForm styling ====== */
		
/* ========================================
 	==== End #stepWrapper ====  
========================================*/




/* ========================================
==== #tabWrap - contains the structure and the styling for all the tabs ==== 
========================================*/
#tabWrap { width:510px; margin: 40px auto 40px; }

	
	/* ==== Tab Navigation ==== */
	ul.tabNav li.first { margin-left:10px; }
	ul.tabNav li { float:left; margin-right: 10px; display:block; background: url(../images/tab.png) no-repeat; width: 110px; height:25px; line-height: 25px; text-align: center; font-size:14px; }
	ul.tabNav li a { color: #fff; }
	ul.tabNav li:hover { background: url(../images/default/tab-active.png) no-repeat; }
	ul.tabNav li.active { background: url(../images/default/tab-active.png) no-repeat; }
	/* ==== End Tab Navigation ==== */
	
	/* ==== Tab Generals ====*/
	.tab_container { border-top: none; overflow: hidden; width: 100%;  /* Rounded Corners */ -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; /* Box Shadow */ border:1px solid #444444; -moz-box-shadow: 0px 1px 2px #000000; -webkit-box-shadow: 0px 1px 2px #000000; box-shadow: 0px 1px 2px #000000; }
	.tab_content { padding:20px 10px; }
	/* ==== End Tab Generals ==== */
	
		/* ==== Begin Tab1 ==== */	
			
			/* ==== Begin .tabFeatures ==== */
			.tabFeatures li { float:left; width:245px; margin-bottom:20px; }
			.tabFeatures li p { padding-left:65px; padding-right:10px; }
			.tabFeatures li img { margin:0px 20px 0px 10px; float:left; }
			.tabFeatures li a { background:#343434; float:left; margin-top:10px; margin-left: 65px; font-size: 11px; border: 1px solid #ccc; padding: 5px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; color:#fff; }
			.tabFeatures li a:hover { border:1px solid #ffab00; color: #828282; }
			.tabFeatures h4 { margin-bottom:10px;}
			/* ==== End .tabfeatures ==== */
					
		/* ==== End Tab1 ==== */
		
		/* Begin Tab2 ==== */		
		
			/*==== Begin .tabGallery ====*/
			ul.tabGallery { display:block; width:490px; }
			ul.tabGallery li { display:inline; margin:0 10px 20px 0; float:left; width:144px; height:90px; background:#fff; border: 1px solid #343434; padding:5px; /* Shadow */ -moz-box-shadow: 0px 3px 3px #000; -webkit-box-shadow: 0px 3px 3px #000; box-shadow: 0px 3px 3px #000; /* Rounded Corners */ -moz-border-radius:10px; -webkit-border-radius: 10px; border-radius: 10px; }
			ul.tabGallery li.last { margin-right: 0px; }
			#tab2.tab_content { padding-bottom:0px; }
			.tabGallery li.zoom { background: #2a2a2b url(../images/zoom.png) center no-repeat; }
			/* ==== End .tabGallery ==== */	
				
		/*==== End tab2 ====*/
		
		/*==== Begin tab3 ==== */	
			
			/* ---- featureTable ---- */
			.featuresTable { color: #828282; font-size: 12px; width:315px; height:300px; margin-right:10px; }
			.featuresTable thead { height: 60px; text-align:center; line-height: 60px; padding:0 10px; color: #f0efea; font-weight: bold; }
			.featuresTable td { border: 1px solid #828282; font-weight: bold; text-align:center; line-height:50px; padding:0 10px; }
			.featuresTable thead th { border: 1px solid #828282; color: #fff; }
			.featuresTable tr td.first {color:#434343; }
			.featuresTable thead tr {background: #333333;  }
			.featuresTable tr { background:#a4a1a1;color:#434343; }
			.featuresTable .alt { background-color: #f1f1f1; }
			table { border: 1px solid #828282; }
			/* ----End .featureTable ---- */
			
			/* ---- tableDescrip ----*/
			.tableDescrip { margin:0 10px 0px 0px; }
			.tableDescrip h3 { margin-bottom:15px; }
			.tableDescrip p { font-size: 12px; line-height:1.6em; margin-bottom:20px; }
			.tab_content#tab3 { padding-bottom:0px; }	
			/* ==== End .tableDescrip ==== */	
			
		/* ==== End tab3 ==== */
		
		
		
/* ========================================
 		 ====End #tabWrap ==== 
========================================*/




/* ========================================
 			==== #fbWrap  ==== 
========================================*/
#fbWrap { width:510px; margin:40px auto; }
#fbWrap h3 { margin-top:40px; text-align:center; }	

	/*==== Begin #fbcomments ==== */
	#fbcomments {margin:40px auto; width:510px; border: 1px solid #ccc; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; border:1px solid #444444; -moz-box-shadow: 0px 1px 2px #000000; -webkit-box-shadow: 0px 1px 2px #000000; box-shadow: 0px 1px 2px #000000; }	
	
		/*==== Begin .fb ==== */
		.fb { width:480px; margin:40px auto; }
		/*==== End .fb ==== */
		
	/*==== End #fbcomments ==== */

/* ========================================
 		 ==== End #commentsWrapper ==== 
  ========================================*/ 
  
  
  
  
/* ========================================
 		 ==== #buyWrap ==== 
========================================*/
#buyWrap { width:510px; margin:40px auto 0px; border-bottom:1px solid #b3b3b3; }

	/*==== Begin .buy-now ==== */
	.buy-now { position:relative; width:510px; margin:0 auto; }
	.buy-now img { float:left; }
	.buy-now p.offer { float:right; width:315px; font-family: Georgia, "Times New Roman", Times, serif; font-style:italic; font-size:16px; color:#ababae; }
	.buy-now a { font-size:24px; font-weight:700; text-align:center; line-height:68px; }
	a.buy-btn { color:#fff; margin-top:70px; margin-right:50px; margin-bottom:70px; float:right; background: url(../images/default/buy-button.png) no-repeat; width:244px; height:66px; display:block; }

		/*==== Begin .priceBottom ==== */
		.priceBottom { background:url(../images/default/seal.png) no-repeat; z-index:-999; width:92px; height:93px; position: absolute; top:85px; left:420px; }
		.priceBottom p { margin:0px auto; text-shadow: 0px -1px 1px #cf7500; color:#fff; font-size:30px; padding-top:3px; line-height:90px; text-align:center; }
		sup { vertical-align: baseline; position: relative; font-size: 60%; bottom: 0.6em; } /* 70% size of its parent element font-size which is good. */
		small { font-size: 16px; }
		/*==== End .priceBottom ==== */
		
	/*==== End .buy-now ==== */ 
  
/* ========================================
 		 ==== end #buyWrap ==== 
 ========================================*/ 





/* ========================================
 		 ==== #footer ==== 
 ========================================*/
#footer { padding-bottom:10px; position:relative; width:510px; }
 	/* ==== Social ==== */
	.social li { float:left; display:inline-block; margin: 10px 0px 15px 10px; }
	.social li a { width:20px; height:20px; display:block; }
	a.twitter { background: url(../images/twitter.png) no-repeat; }
	a.twitter:hover { background: url(../images/twitter-hover.png); }
	a.rss { background: url(../images/facebook.png) no-repeat; }
	a.rss:hover { background: url(../images/facebook-hover.png); }
	/* ==== End Social  ==== */
	
	/* ==== Copyrights ==== */
	.copyright { margin-top:15px; }
	.copyright li { float:left; border-right:1px solid #828282; font-size: 10px; line-height:10px; padding-right:10px; }
	.copyright .last { border-right: none; padding-right:0px; }
	.copyright a { margin-left:10px; color: #828282; font-size:10px; }
	.copyright a:hover { text-decoration:underline; }
	/*==== End Copyrights ====*/

/* ========================================
 		==== end #footer ====  
 ========================================*/
 
 
 
 
/* ========================================
 			==== MIsc ==== 
========================================*/ 
 
 /* ==== Tipsy ==== */
 .tipsy { padding: 5px; font-size: 12px; background-repeat: no-repeat; background-image: url(../images/tipsy.gif); }
.tipsy-inner { padding: 5px 8px 4px 8px; background-color:black; color: white; max-width: 200px; text-align: center; }
.tipsy-inner { -moz-border-radius:3px; -webkit-border-radius:3px; }
.tipsy-north { background-position: top center; }
.tipsy-south { background-position:  bottom center; margin:0 auto; }
.tipsy-east { background-position: right center; }
.tipsy-west { background-position: left center; }
 /* ==== End Tipsy ==== */	
 
/*========================================
 		==== End  MIsc ==== 
========================================*/