/*
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-family:Verdana, Geneva, sans-serif; background:url(images/bg-grey.jpg) repeat; overflow-x:hidden; }
	h1                  { line-height:24px; margin:0 0 10px; font-size:14px; font-family: 'Lato', sans-serif; color:#373737; text-shadow:rgba(255, 255, 255, 0.4) 0px 1px 0px;}
	h2                  { font-family: 'Yanone Kaffeesatz', sans-serif; font-size:30px; text-shadow:rgba(255, 255, 255, 0.3) 0px 1px 0px; color:#444444; margin-bottom: 15px; text-transform:uppercase; letter-spacing:3px;}
	h3                  { font-size:14px; font-family: 'Actor', sans-serif; text-shadow:rgba(255, 255, 255, 0.3) 0px 1px 0px; color:#616060; margin-bottom: 15px;}
	h4                  { font-size:14px; font-family: 'Actor', sans-serif; text-shadow:rgba(255, 255, 255, 0.3) 0px 1px 0px; color:#616060; margin-bottom: 15px; font-style:italic; -webkit-transition: all .5s ease-in-out;}
	h4:hover			{ color:#9c1965; -webkit-transition: all .5s ease-in-out;}
	h5                  { line-height:24px; font-size:12px; font-family: 'Actor', sans-serif; text-shadow:rgba(255, 255, 255, 0.4) 0px 1px 0px; color:#3b3246;}
	h6                  { }
	p                   { line-height:24px; margin:0 0 24px; font-size:16px; font-family: 'Lato', sans-serif; color:#fff; font-weight:300; }
	blockquote          { line-height:24px; margin:0 0 24px; }
	a                   { font-weight:bold; text-decoration:none; color:#9c1965; -webkit-transition: all .5s ease-in-out;}
	a:hover             { color:#6b0c43; text-decoration:none; -webkit-transition: all .5s ease-in-out;}
	a:active            { }
	ul                  { }
	ol                  { }
	pre                 { }

/* ---------------------------------------------------------------------------------------
   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; }
	.alignleft          { float:left; margin:0 20px 10px 0; }
	.alignright         { float:right; margin:0 0 10px 20px; }
	.aligncenter        { margin:0 auto; }

/* ---------------------------------------------------------------------------------------
   SPECIFIC CLASSES
   --------------------------------------------------------------------------------------- */  
   .intro-fix			{ width: 310px; height:155px; position:absolute; right:1px; top:110px;}
   .shade				{ background:url(images/shade.png) no-repeat; width:759px; height:279px; margin:0 auto;}
   .border	 			{ height: 0px;border-bottom: rgba(255, 255, 255, 0.296875) 1px solid;border-top: #373737 1px solid; clear:both;}
   .text-top			{ margin-top:7px;}
   .text-left			{ margin-left:-14px; margin-top:7px;}
   .high				{ margin-top:12px;}
   .low					{ margin-bottom:12px;}

/* ---------------------------------------------------------------------------------------
   LAYOUT
   --------------------------------------------------------------------------------------- */  
	#whole-wrap			{ width:860px; margin:0 auto; position:relative; }
	.page-wrap          { width:860px; margin:0 auto; position:relative; }
	.top				{ width:100%; height:180px; background:url(images/ad.jpg) no-repeat center #000; margin:0 auto; margin-bottom:40px; }
	
	#iphone				{ background:url(images/iphone.png) no-repeat; width:127px; height:171px; position:absolute; bottom:0px; left:405px; z-index:200;}
	.content-right		{ width:395px; float:right; margin-top:50px; }
	.content-left		{ width:395px; float:left; margin-top:50px;}
	.content-img		{ float:left; margin:0px 20px 10px 0px;}
	.footer				{ width:860px; margin:0 auto 20px; text-align:center; padding:10px; background-color:#e6e3ea; opacity:.9; }
	.dload-button		{ background:url(images/dload-button.png) no-repeat; width:201px; height:46px; padding:12px 0 0 32px;}
	.dload-button h2	{ font-size:20px !important; -webkit-transition: all .5s ease-in-out;}
	.dload-button:hover	{ opacity:.7; }
	.dload-button h2:hover { color:#9c1965; -webkit-transition: all .5s ease-in-out;}
    
/* ---------------------------------------------------------------------------------------
   LOGO
   --------------------------------------------------------------------------------------- */  
	#logo               { width:397px; height:97px; display:block; position:absolute; right:-33px; top:1px; }
	#logo a             { width:397px; height:97px; background:url(images/logo.png) no-repeat; text-indent:-9999px; display:block; }
	
/* ---------------------------------------------------------------------------------------
   SLIDER
   --------------------------------------------------------------------------------------- */  
   /* The left and right navigation buttons */
    #slider				{ background:url(images/ipad.png) no-repeat; width:498px; height:279px; float:left; margin-right:20px; position:relative;}
	#slideShim			{ position:absolute; top:41px; left:46px; z-index:100; }
   
    #slider .backLink, #slider .forwardLink {position: absolute; width: 106px; height: 44px; z-index:300;}
	#slider .backLink a, #slider .forwardLink a {display: block; width: 106px; height: 44px; text-indent: 9999em; background-image: url(images/controls.png); background-repeat: no-repeat; outline: 0;}
	#slider .backLink {right: -24px; top:228px;}
	#slider .forwardLink {right: -24px; top:182px;}
	#slider .backLink a {background-position: left bottom; left: 0px;}
	#slider .backLink a:hover, #slider .backLink a:active  {opacity:.8;}
	#slider .forwardLink a {opacity:1;}
	#slider .forwardLink a:hover, #slider .forwardLink a:active  {opacity:.8;}