@charset "UTF-8";



/* •••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••

   ••  Project: Project’s Name                                      ••

   ••  Author:  peter@riddle.pl                                     ••

   ••  Date:    2010                                                ••

   •••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••   

   

    1. Global Styles

       1.1 Reset

       1.2 Default

      

    2. Layout

       2.1 Clearfix

       2.2 Columns

      

---------------------------------------------------------------------- */



/* 1. =Global Styles

•••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••• */



/* 1.1 =Reset

---------------------------------------------------------------------- */

legend { 

	margin: 0;

	padding: 0;

	border: 0;

	font-size: 100%;

	vertical-align: baseline;

	background: transparent; 

}



address, cite, q, dfn {

  font-style: normal; 

}



article, aside, dialog, figure, 

hgroup, nav, section { 

  display: block;

}



a, ins, del {

  text-decoration: none

}



q, blockquote {

	quotes: none;

}



q:after, q:before,

blockquote:after, blockquote:before {

	content: "";

	content: none;

}







/* 1.2 =Default

---------------------------------------------------------------------- */



html, body {

}



html {

  overflow-x: auto;

  overflow-y: scroll;

}







#wrapper {

	position:relative; 

  width: 960px;



  margin: 20px auto;

  -webkit-border-radius: 5px;

  -moz-border-radius: 5px;

  border-radius: 5px;

  text-align:left;

}



#wrapper-inside {

	width:900px;

	margin:20px 30px;



}







del { text-decoration: line-through; }

li  { list-style: none; }



button,

input[type="submit"],

input[type="image"],

label,

label > input[type="checkbox"],

label > input[type="radio"] {

  cursor: pointer;

}





/* 2. CONTENT

•••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••• */





/* 2.1 =Actions

---------------------------------------------------------------------- */



.actions:after {

  content: "";

  display: block;

  height: 0;

  overflow: hidden;

  clear: both;

}



.actions {

  margin-left: -40px;

}



.actions-two {

  padding-left: 155px;

}



.actions p {

  float: left;

  width: 260px;

  margin: 0 0 0 40px;

}



.actions p a {

  color: #fff;

  display: block;

  font: bold 24px/1 "Helvetica Neue", sans-serif; 

  background: url("i/actions.png") no-repeat;

  border-bottom: 0;

  min-height: 42px;

  padding-top: 24px;

  opacity: 0.5;

  text-decoration: none;

  -webkit-transition: opacity 0.25s ease-out;

  -moz-transition: opacity 0.25s ease-out;

}



.actions p a strong {

  text-shadow: none;

}



.actions p a:hover,

.actions p a:focus {

  opacity: 0.9999;

}



.actions p a.download {

  padding-left: 74px;

}



.actions p a.demos-n-docs {

  background-position: -270px 0;

  padding-left: 60px;

}



.actions p a.fork {

  background-position: -540px 0;

  padding-left: 76px;

}



.actions p a.download > span {

  font-size: 13px;

  display: block;

  opacity: 0.25;

  font-variant: small-caps;

  text-transform: lowercase;

}



/* 3. DEMO

•••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••• */



/* 3.1 =Demo Area

---------------------------------------------------------------------- */



.demo p,

.demo ul {

  margin-right: 0;

}



#performance-toggle {

  text-align: center;

  margin-right: 0;

  font-size: 11px;

  opacity: 0.5;

  -webkit-transition: opacity 0.25s linear;

  -moz-transition: opacity 0.25s linear;

}



#performance-toggle:hover {

  opacity: 0.999;

}



/* 3.2 =Image Grid

---------------------------------------------------------------------- */



.image-grid {

  margin: 0px;

  padding: 0px

  width: 924px;

}



.image-grid:after {

  content: "";

  display: block;

  height: 0;

  overflow: hidden;

  clear: both;

}



.image-grid li {

  width: 145px; 

  margin: 5px 5px 0 5px;

  float: left;

  text-align: center;

font-size: 10px; 

  font-family: "Helvetica Neue", sans-serif;

  line-height: 12px;

  color: #666;

  height: 300px;

  overflow: hidden; 

}



.image-grid li img,

.image-grid li strong {

  display: block;

}



.image-grid li strong {

  color: #333;

}



.image-grid li h4 { text-align: center; line-height: 16px; }
.image-grid li h4:hover { text-decoration:underline; }



.image-grid li img {  margin: auto auto; }





p.question {

	font-weight: bolder;

}



q { 

	background-color: #1D1F21;

}



ol.faq { 

	margin-right: 0;

}