/*
Theme Name: Michal's Framework
Version: 1.0
Author: Michal Pechardo
Author URI: http://www.revivalidea.com
*/   


/* ---------------------------------------------------------------------------------------
   CSS RESET
   --------------------------------------------------------------------------------------- */  
   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, 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-weight:inherit; font-style:inherit; font-size:100%; font-family:inherit; vertical-align:baseline; }
   :focus				{ outline:0; }
    body                { line-height:1; color:black; background:white; }
   ol, ul               { list-style:none; }
   table                { border-collapse:separate; border-spacing:0; }
   caption, th, td      { text-align:left; font-weight:normal; }
   blockquote:before    { content:""; }
   blockquote:after     { content:""; }
   q:before, q:after    { content:""; }
   blockquote, q        { quotes:"" ""; }

/* ---------------------------------------------------------------------------------------
   HTML ELEMENTS
   --------------------------------------------------------------------------------------- */  
	body                { font-size:16px; font-family: 'Lato', sans-serif; background:#fff; -webkit-font-smoothing: antialiased;/* Fix for webkit rendering */-webkit-text-size-adjust: 100%; line-height: 24px; }
	
	h1, h2, h3, h4, h5, h6 { color: #181818; font-weight: bold; line-height: 1.25; text-shadow: rgba(255, 255, 255, 0.4) 0px 1px 0px; }
	h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; }
	h1 { font-size: 4.6rem; margin-bottom: 12px; font-weight:400;}
	h2 { font-size: 3.5rem; margin-bottom: 9px; }
	h3 { font-size: 1.5rem; margin-bottom: 12px; font-weight:300;}
	h4 { font-size: 1.2rem; margin-bottom: 10px; line-height:30px; font-weight:400; }
	h5 { font-size: 1.4rem; font-weight: normal; margin-bottom: 10px;  }
	h6 { font-size: 1.2rem; font-weight: normal; margin-bottom:10px; }
	
	p                   { line-height:24px; margin:0 0 24px; text-shadow: rgba(255, 255, 255, 0.6) 0px 1px 0px; overflow:hidden; }
	blockquote          { line-height:24px; margin:0 0 24px; }
	a                   { color:#2ba8d1; text-decoration:none;}
	a:hover             { color:#187a9a;}
	a:active            { position:relative; top:1px; }
	ul                  { }
	ol                  { }
	pre                 { }
	
	em, i 				{ font-style: italic; line-height: inherit; }
	strong, b 			{ font-weight: bold; line-height: inherit; }
	small 				{ font-size: 80%; line-height: inherit; color:#989898; }

/* ---------------------------------------------------------------------------------------
   DEFAULT CLASSES
   --------------------------------------------------------------------------------------- */  
	.no-bg              { background:none; }
	.no-display         { display:none; }
	.no-border          { border:0; }
	.no-margin          { margin:0; }
	.no-padding         { padding:0; }
	.clear              { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; }
	.left               { float:left; }
	.right              { float:right; }
	.center             { text-align:center; }
	.text-left			{ text-align:left; }
	.text-right			{ text-align:right; }
	.text-center		{ text-align:center; }
	.alignleft          { float:left; margin:0 20px 10px 0; }
	.alignright         { float:right; margin:0 0 10px 20px; }
	.aligncenter        { margin:0 auto; }
	
/*	Advanced CSS  */
	hr 					{ border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 10px 0 30px; height: 0; }
	table tr:nth-child(even) { background: rgba(0,0,0,0.1);}
	.clearfix:before, 
	.clearfix:after 	{ content: " ";display: table;}
 	.clearfix:after 	{ clear: both;}
	.clearfix 			{ *zoom: 1;}
	.ir 				{ text-indent: 100%; white-space: nowrap;overflow: hidden;}
	*, *:before, *:after { -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; }
	
/*	Advanced Text CSS  */
	.content 			{ font: 1em/1.4 Segoe, "Segoe UI", "Helvetica Neue", Arial, sans-serif;}
 	.title 				{ font: 1.7em/1.2 Baskerville, "Baskerville old face", "Hoefler Text", Garamond, "Times New Roman", serif;}
 	.code 				{ font: 0.8em/1.6 Monaco, Mono-Space, monospace;}
	.disabled 			{ pointer-events: none;opacity: 0.5;}
	
/*	List  */
	ul, ol 				{ }
	ul 					{ list-style: none outside; }
	ol 					{ list-style: decimal; }
	ol, ul.square, ul.circle, ul.disc { margin-left: 30px; }
	ul.square 			{ list-style: square outside; }
	ul.circle			{ list-style: circle outside; }
	ul.disc				{ list-style: disc outside; }
	ul ul, ul ol,
	ol ol, ol ul 		{  }
	ul ul li, ul ol li,
	ol ol li, ol ul li 	{ margin-bottom: 0px; }
	li 					{  }
	ul.large li 		{ line-height: 21px; }
	li p 				{ line-height: 21px; }

/*	Advanced Styling CSS  */	
	.embossed-light 	{ border: 1px solid rgba(0,0,0,0.1); box-shadow: inset 0 1px 0 rgba(255,255,255,0.7);}
	.embossed-heavy 	{ border: 1px solid rgba(0,0,0,0.1); box-shadow:  inset 0 2px 3px rgba(255,255,255,0.3), inset 0 -2px 3px rgba(0,0,0,0.3), 0 1px 1px rgba(255,255,255,0.9);}
	.gradient-light-linear 	{ background-image: linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));}
	.gradient-dark-linear 	{ background-image: linear-gradient(rgba(0,0,0,.25), rgba(0,0,0,0));}
	.gradient-light-radial 	{ background-image: radial-gradient(center 0, circle farthest-corner, rgba(255,255,255,0.4), rgba(255,255,255,0));}
	.gradient-dark-radial 	{ background-image: radial-gradient(center 0, circle farthest-corner, rgba(0,0,0,0.15), rgba(0,0,0,0));}
	.light-rounded 		{ border-radius: 3px;}
	.heavy-rounded 		{ border-radius: 12px;}
	.full-rounded		{ border-radius: 50%;}
	.barrel-rounded 	{ border-radius: 20px/60px;}
	.mac {display: block;border: none;border-radius: 20px;padding: 5px 8px;color: #333;box-shadow: inset 0 2px 0 rgba(0,0,0,.2),  0 0 4px rgba(0,0,0,0.1);}
	.mac:focus {  outline: none;  box-shadow:  inset 0 2px 0 rgba(0,0,0,.2),  0 0 4px rgba(0,0,0,0.1), 0 0 5px 1px #51CBEE;}

/*	Advanced Inline CSS  */	
	.inline-link-1 		{ display: inline-block; margin: 0 0.2em; padding: 3px;background: #97CAF2; border-radius: 2px; transition: all 0.3s ease-out; text-decoration: none; font-weight: bold; color: white;}
	.inline-link-1:hover   { background: #53A7EA; }
	.inline-link-1:active  { background: #C4E1F8; }
	.inline-link-1:visited { background: #F2BF97; }
	.inline-link-3 		   { display: inline-block;position: relative; padding-left: 6px; text-decoration: none; color: #6AB3EC; text-shadow: 0 1px 1px rgba(255,255,255,0.9);}
	.inline-link-3:hover   { color: #3C9CE7;}
	.inline-link-3:before  { content: "\25BA"; font-size: 80%;  display: inline-block; padding-right: 3px; pointer-events: none;}
	.inline-link-3:hover:before { color: #F2BF97; }

/* ---------------------------------------------------------------------------------------
   SPECIFIC CLASSES
   --------------------------------------------------------------------------------------- */  
   /* Spacing */
    .top-10				{ margin-top:10px; }
	.top-20				{ margin-top:20px; }
	.top-30				{ margin-top:30px !important; }
	.bottom-30			{ margin-bottom:30px !important; }
	.top-20				{ margin-top:30px !important; }
	.bottom-20			{ margin-bottom:10px !important; }
	.x-top				{ margin-top:0px !important; }
	.x-bottom			{ margin-bottom:0px !important; }
	.x-bottom-pad		{ padding-bottom:0px !important; }

	.pad-bottom 		{ margin-bottom:25px; }
	
	.opac				{ opacity:1; -webkit-transition: all 0.4s ease;-moz-transition: all 0.4s ease; -o-transition: all 0.4s ease;-ms-transition: all 0.4s ease; transition: all 0.4s ease; }
    .opac:hover			{ opacity:.8; -webkit-transition: all 0.4s ease;-moz-transition: all 0.4s ease; -o-transition: all 0.4s ease;-ms-transition: all 0.4s ease; transition: all 0.4s ease; }
    .border				{ height:0px; border-top:1px solid rgba(0,0,0,.15); border-bottom:1px solid rgba(255,255,255,0.3); margin:15px 0px; clear:both;  }
	.frame				{ background:rgba(255,255,255,0.5); padding:5px; border:1px solid #ccc; }
	
	.download-box		{ width:615px; float:right; background:rgba(0,0,0,.1); border:1px solid rgba(0,0,0,.1); box-shadow: 0 1px 0 rgba(255,255,255,0.5); padding:20px;  }
	.download-box p		{ font-size:13px; text-align:right; margin-bottom:10px; }
	
	.download-box2		{ width:332px; float:right;  }
	.download-box2 p	{ font-size:13px; text-align:left; margin-bottom:10px; }
	.pad-right			{ margin-right:20px; }
	
	.list				{ list-style:disc; line-height:20px; margin:15px 0px; }
	.list li			{ margin-left:30px; margin-bottom:10px; }

/* ---------------------------------------------------------------------------------------
   LAYOUT
   --------------------------------------------------------------------------------------- */  
	#page-wrap          { width:960px; margin:0 auto; position:relative; }
	.wrap          		{ width:960px; margin:0 auto; position:relative; }
	.apple-bg			{ position:absolute; top:0px; width:100%; max-width:100%; height:524px; background:url(images/apple-store.jpg) no-repeat #fff center top; overflow: hidden; background-size: cover; }
	.gray-bg			{ background:#f1f1f1; position:relative; padding:30px 0px; border:solid #ccc; border-width:1px 0px; }
	.padded				{ padding:20px 0px; }
	
	.heading			{ width:auto; height:80px; position:absolute; right:0px; top:30px; }
	.half				{ width:600px; float:left; margin-right:20px; border-right:1px solid rgba(0,0,0,.1); padding-right:20px; }
	.half2				{ width:335px; float:right;}
	
	.videoWrapper 		{ position: relative;padding-bottom: 56.25%; /* 16:9 */padding-top: 25px;height: 0;}
    .videoWrapper iframe { position: absolute;top: 0;left: 0;width: 100%;height: 100%; }
	
	.hide				{ display:none; }
	.download-square	{ height:auto; background:#f2f2f2; padding:20px 20px 10px; border:0px solid #fff; }
	.download-square p	{ font-size:12px; text-align:center; margin-bottom:-10px; margin-top:-10px; }
	.full				{ width:47% !important; text-align:center; }
    
/* ---------------------------------------------------------------------------------------
   LOGO
   --------------------------------------------------------------------------------------- */  
	#logo               { width:153px; height:25px; display:block; float:left; padding-top:2px; }
	#logo a             { width:153px; height:25px; background:url(images/logo.png) left top no-repeat; text-indent:-9999px; display:block; }
	.logo-bg			{ width:100%; background:rgba(0,0,0,.1); border-bottom:1px solid rgba(0,0,0,.1); box-shadow: 0 1px 0 rgba(255,255,255,0.2); padding:10px 0px; }

/* ---------------------------------------------------------------------------------------
   PARALLAX
   --------------------------------------------------------------------------------------- */  
    .parallax-block      { position:fixed; top:0; left:0; overflow:hidden; z-index:-1; max-width:none !important; max-height:none !important; -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; 
                            -ms-backface-visibility:hidden; -o-backface-visibility:hidden; backface-visibility:hidden; -webkit-perspective:1000px; -moz-perspective:1000px; -ms-perspective:1000px;
							-o-perspective:1000px; perspective:1000px; }
    .parallax-image      { position:absolute; top:0; left:0; max-width:none !important; max-height:none !important; -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; -ms-backface-visibility:hidden;
                             -o-backface-visibility:hidden; backface-visibility:hidden; -webkit-perspective:1000px; -moz-perspective:1000px; -ms-perspective:1000px; -o-perspective:1000px; perspective:1000px; }
	#apple-store		{ height:524px; background:url(images/apple-store.jpg) no-repeat #fff center top; overflow: hidden; background-size: cover; }
	
	
/* ---------------------------------------------------------------------------------------
   FACEBOX="REL"
   --------------------------------------------------------------------------------------- */ 
	
	#facebox 			{ position: absolute;top: 0;left: 0;z-index: 100;text-align: left; }
	#facebox .popup		{ position:relative;border:3px solid rgba(0,0,0,0);-webkit-border-radius:5px;-moz-border-radius:5px; border-radius:5px;-webkit-box-shadow:0 0 18px rgba(0,0,0,0.4);-moz-box-shadow:0 0 18px rgba(0,0,0,0.4);box-shadow:0 0 18px rgba(0,0,0,0.4);}
	#facebox .content 	{ display:table;width: 400px;padding: 10px;background: #fff;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}
	#facebox .content > p:first-child { margin-top:0; }
	#facebox .content > p:last-child { margin-bottom:0; }	
	#facebox .close		{ position:absolute;top:-10px;right:-10px;padding:2px;}
	#facebox .close img	{ opacity:0.3;}
	#facebox .close:hover img{ opacity:1.0;}	
	#facebox .loading 	{ text-align: center;}
	#facebox .image 	{ text-align: center; }
	#facebox img 		{ border: 0;margin: 0;}
	#facebox_overlay 	{ position: fixed;top: 0px;left: 0px;height:100%;width:100%;}
	.facebox_hide 		{ z-index:-100;}
	.facebox_overlayBG 	{ background-color: none;z-index: 99;}
	
/* ---------------------------------------------------------------------------------------
   BUTTONS
   --------------------------------------------------------------------------------------- */ 
	.button, .button:visited {background: #222 url(/images/alert-overlay.png) repeat-x; display: inline-block; padding: 5px 10px 6px; color: #fff; text-decoration: none;-moz-border-radius: 5px; -webkit-border-radius: 5px;-moz-box-shadow: 0 1px 1px rgba(0,0,0,0.5);-webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.3);text-shadow: 0 -1px 1px rgba(0,0,0,0.25);border-bottom: 1px solid rgba(0,0,0,0.25);position: relative;cursor: pointer;}

	.button:hover								{ background-color: #111; color: #fff; }
	.button:active								{ top: 1px; }
	.small.button, .small.button:visited 		{ font-size: 11px; padding: ; }
	.button, .button:visited,
	.medium.button, .medium.button:visited 		{ font-size: 12px; font-weight: bold; line-height: 1; text-shadow: 0 -1px 1px rgba(0,0,0,0.25); }
	.large.button, .large.button:visited 		{ font-size: 14px; padding: 12px 24px; border-radius: 18px; }
	.x-large.button, .x-large.button:visited 	{ font-size: 18px; padding: 14px 42px; border-radius: 24px; }
	
	.green.button, .green.button:visited		{ background-color: #91bd09; }
	.green.button:hover							{ background-color: #749a02; }
	.blue.button, .blue.button:visited			{ background-color: #30b8e4; }
	.blue.button:hover							{ background-color: #2db2dd; }
	.blue.button:active							{ background-color: #2ba8d1; }
	.red.button, .red.button:visited			{ background-color: #e33100; }
	.red.button:hover							{ background-color: #872300; }
	.magenta.button, .magenta.button:visited	{ background-color: #a9014b; }
	.magenta.button:hover						{ background-color: #630030; }
	.orange.button, .orange.button:visited		{ background-color: #ff5c00; }
	.orange.button:hover						{ background-color: #d45500; }
	.yellow.button, .yellow.button:visited		{ background-color: #ffb515; }
	.yellow.button:hover	
	
	button.standard, a.standard, input[type=submit].standard { padding: 6px 10px; -webkit-border-radius: 2px 2px; border: solid 1px rgb(153, 153, 153); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(255, 255, 255)), to(rgb(221, 221, 221))); color: #333; text-decoration: none; cursor: pointer; display: inline-block; text-align: center; text-shadow: 0px 1px 1px rgba(255,255,255,1); line-height: 1; }
	.standard:hover 		{ background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(248, 248, 248)), to(rgb(221, 221, 221))); }
	.standard:active 		{ background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(204, 204, 204)), to(rgb(221, 221, 221))); }
	.standard.medium 		{ padding: 5px 8px; font-size: 12px; }
	.standard.large 		{ padding: 10px 15px; font-size: 21px; font-weight: bold; }
	.standard.scaled 		{ -webkit-transform: scale(2); -webkit-transform-origin: bottom left; }
	
	.standard.blue 			{ background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(255, 255, 255)), to(rgb(98,202,227))); border-color: rgb(98,202,227);  }
	.standard.green 		{ background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(255, 255, 255)), to(rgb(213,224,77))); border-color: rgb(213,224,77);  }
	.standard.red 			{ background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(241,93,34)), to(rgb(146,60,6))); border-color: rgb(146,60,6); text-shadow: 0px -1px 1px rgba(0,0,0,0.5); color: #fff; }
	.standard.purple 		{ background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(202,0,108)), to(rgb(124,0,64))); border-color: rgb(202,0,108); text-shadow: 0px -1px 1px rgba(0,0,0,0.5); color: #fff;  }
	.standard.orange 		{ background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(255, 255, 255)), to(rgb(245,132,38))); border-color: rgb(245,132,38);  }
	
/* ---------------------------------------------------------------------------------------
   GROWL
   --------------------------------------------------------------------------------------- */ 
#growl h6 { font-size:15px !important; color:#fff; text-shadow:none; }
#growl p  { font-size:13px !important; line-height:22px; text-shadow:none; }

.ui-notify { width:380px; position:fixed; top:10px; right:10px; z-index:1000; }
.ui-notify-message { padding:20px; margin-bottom:15px; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px }
.ui-notify-message h1 { font-size:14px; margin:0; padding:0 }
.ui-notify-message p { margin:3px 0; padding:0; line-height:18px }
.ui-notify-message:last-child { margin-bottom:0 }
.ui-notify-message-style { background:#000; background:rgba(0,0,0,0.8); }
.ui-notify-message-style h1 { color:#fff; font-weight:bold }
.ui-notify-message-style p { color:#fff }
.ui-notify-close { color:#fff; text-decoration:underline }
.ui-notify-click { cursor:pointer }
.ui-notify-cross { margin-top:-4px; float:right; cursor:pointer; text-decoration:none; font-size:12px; font-weight:bold; text-shadow:0 1px 1px #fff; padding:2px }
.ui-notify-cross:hover { color:#ffffab }
.ui-notify-cross:active { position:relative; top:1px }