/* ==========================================================================
   KINDZIUK
   inspiractiv.com
   ========================================================================== */
@import url(http://fonts.googleapis.com/css?family=Marcellus+SC&subset=latin,latin-ext);


html,
button,
input,
select,
textarea {
    color: #222;
}



hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

a{
	text-decoration: none;
}

:focus,
:focus::-moz-focus-inner {
   outline: 0px;
   border: none;
}

img {
    vertical-align: middle;
}


.img-responsive {
    display: block;
    height: auto;
    max-width: 100%;
}


body.index {
	font-family: "Marcellus SC", Arial, Helvetica, sans-serif;
	font-weight: 400;
	font-size: 19px;
	line-height: normal;
	background: url(../img/bg-max-index.jpg)  repeat-x center top,
				url(../img/bg2.jpg) repeat center bottom
}

body.book,
body,rules {
	font-family: "Marcellus SC", Arial, Helvetica, sans-serif;
	font-weight: 400;
	font-size: 19px;
	line-height: normal;
	background: url(../img/bg-max-book.jpg)  repeat-x center top,
				url(../img/bg2-dark.jpg) repeat center bottom
}




/* PRELOADER */

#preloader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #f0f0f1;
    z-index: 99;
}

#preloader p {
    text-align: center;
    margin-top: 15%;
}

#preloader span {
    padding: 5px;
    display: block;
}

.loading * {
    -webkit-animation: none!important;
    -moz-animation: none!important;
    -ms-animation: none!important;
    -o-animation: none!important;
}




/*---- CHROMEFRAME ----*/

.chromeframe{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #FFF;
	background-color: #C00;
	text-align: center;
	border: 0px;
	margin: 0px;
	padding: 20px 0;
	display: block;
}

.chromeframe a{
	color: #FF0;
}

.chromeframe a:hover{
	color: #FFF;
	border-bottom: 1px dotted #FFF;
}






#header{
	width: 380px;
	height: 125px;
	margin: 0 auto;
	padding: 0;
}

#header h1{
	margin: 0;
	padding: 0;
}

#header h1 a{
	margin: 0 auto;
	padding: 0;
	width: 380px;
	height: 125px;
	display: block;
	z-index: 100;
	text-indent: -10000px;
}


h1, h2, h3, h4{
	font-family: "Marcellus SC", Arial, Helvetica, sans-serif;
	font-weight: 300;
	line-height: 1.2em;
	text-transform: uppercase;
}


#main {
	width: 960px;
	margin: 0 auto;
	padding: 0;
	position: relative;
	height: 700px;
}


#main:before,
#main:after {
    content: " ";
    display: table;
}

#main:after {
    clear: both;
}



#main .start{
	display: block;
	min-height: 760px;
	text-indent: -10000px;
}


.book #main a.link,
.rules #main a.link{
	display: block;
	position: absolute;
	right: 45px;
	top: -45px;
	padding: 10px 40px;
	color: #351f1c;
}

.book #main a.link:hover,
.rules #main a.link:hover{
	color: #BF0103;
}


.intro {
	background-image: url(../img/home.png);
	background-position: center 45px;
	background-repeat: no-repeat;
	display: block;
	width: 440px;
	height: 450px;
	float: left;
	padding-top: 240px;
	margin-left: 30px;
}



.intro  h1{
	background-image: url(../img/kindziuk.png);
	background-position: center center;
	background-repeat: no-repeat;
	height: 167px;
	text-indent: -10000px;
}


.intro .lead {
	font-size: 18px;
	font-family: "Marcellus SC", Arial, Helvetica, sans-serif;
	color: rgb( 53, 31, 28 );
	text-align: center;
	line-height: 1em;
	padding: 0 20px;
}





.product {
	display: block;
	width: 470px;
	height: 680px;
	float: right;
	position: relative;
}

.product:before,
.product:after {
    content: " ";
    display: table;
}

.product:after {
    clear: both;
}



.product h1 {
	display: none;
}

.product ul {
	margin: 0;
	padding: 0;
	height: 680px;
	display: block;
}


.product ul li {
	margin: 0;
	padding: 0;
	list-style-type: none;
	color: rgb( 53, 31, 28 );
	font-size: 22px;
	line-height: 22px;
}

.product ul li.k1 {
	position: absolute;
	left: 300px;
	top: 232px;
	z-index: 3;
}

.product ul li.k1:before {
	content: url(../img/kindziuk1.png);
	position: absolute;
	left: -240px;
	top: -170px;
	width: 266px;
	height: 197px;
	z-index: 4;
	display: block;
}

.product ul li.k2 {
	position: absolute;
	left: 160px;
	top: 350px;
	z-index: 3;
	text-align: center;
	width: 100px;
	display: block;
}


.product ul li.k2:before {
	content: url(../img/kindziuk2.png);
	position: absolute;
	left: -90px;
	top: -80px;
	width: 162px;
	height: 106px;
	z-index: 4;
	display: block;
}

.product ul li.k3 {
  position: absolute;
  left: 334px;
  top: 364px;
  width: 84px;
  height: 32px;
  text-align: center;
  z-index: 3;
}

.product ul li.k3:before {
	content: url(../img/kindziuk3.png);
	position: absolute;
	left: -30px;
	top: -65px;
	width: 98px;
	height: 59px;
	z-index: 4;
	display: block;
}

.product ul li.k4 {
  position: absolute;
  left: 234px;
  top: 420px;
  width: 130px;
  text-align: center;
  z-index: 3;
}


.product ul li.k4:before {
	content: url(../img/kindziuk4.png);
	position: absolute;
	left: -160px;
	top: -5px;
	width: 138px;
	height: 72px;
	z-index: 4;
	display: block;
}

.product ul li.k5 {
  position: absolute;
  left: 112px;
  top: 645px;
  text-align: center;
  z-index: 3;
}

.product ul li.k5:before {
	content: url(../img/kindziuk5.png);
	position: absolute;
	left: -60px;
	top: -140px;
	width: 190px;
	height: 134px;
	z-index: 4;
	display: block;
}

.product ul li.k6 {
  position: absolute;
  left: 324px;
  top: 640px;
  width: 194px;
  height: 132px;
  z-index: 3;
}

.product ul li.k6:before {
	content: url(../img/kindziuk6.png);
	position: absolute;
	left: -60px;
	top: -140px;
	width: 138px;
	height: 72px;
	z-index: 4;
	display: block;
}




/*rules*/


.rules #main a.link{
	display: block;
	position: absolute;
	right: 45px;
	top: -45px;
	padding: 10px 40px;
	color: #351f1c;
}


.list-rules {
	font-size: 16px;
	display: block;
	width: 350px;
	/*height: 450px;*/
	float: left;
	padding: 120px 40px 0 80px;
}

.list-rules p{
	text-align: center;
	margin-bottom: 40px;
}

.list-rules > nav > ul{
	display: block;		
	margin: 0px;
	padding: 0px;		
}
.list-rules > nav > ul:before,
.list-rules > nav > ul:after {
    content: " ";
    display: table;
}

.list-rules > nav > ul:after {
    clear: both;
}



.list-rules > nav > ul > li{
	margin-bottom: 10px;	
}


.list-rules > nav > ul > li > a{
	color: #7F401D;
	display: block;
	line-height: 0.9em;
	text-align: center;
}

.list-rules > nav > ul > li > a:hover{
	color: #B90101;
}

.list-rules > nav > ul > li.activ > a {
	color: #B90101;
	font-weight: bold;
}


.content-rules {
	font-size: 14px;
	display: block;
	width: 370px;
	/*	height: 680px;*/
	float: right;
	position: relative;
	padding: 100px 50px 0 50px;
}


.content-rules{
	
}

.content-rules h1{
	font-size: 20px;
	text-align: center;
}

.content-rules h2{
	font-size: 16px;
	text-align: center;
}


.content-rules  p{
	text-align: center;
}

.content-rules > nav > ul{
	display: block;			
}

.content-rules  > nav > ol:before,
.content-rules  > nav > ol:after {
    content: " ";
    display: table;
}

.content-rules > nav > ol:after {
    clear: both;
}


.content-rules  > nav > ol > li{
	margin-bottom: 10px;	
}


.content-rules  > nav > ol > li{
	display: block;
	line-height: 0.9em;
}











#footer {
	position: relative;
	float: none;
	clear: both;
	min-height: 100px;
	width: 960px;
	margin: 0 auto;
}

.facebook{
	width: 19px;
	height: 19px;
	display: block;
	position: absolute;
	bottom: 5px;
	left: 340px;
}

.facebook img{
	width: 19px;
	height: 19px;
}

#footer address{
	text-align: center;
	font-style: normal;
	font-size: 18px;
	display: block;
	width: 300px;
	margin-left: 70px;
	padding-top: 10px
}

#footer address a{
	color: #760001;
}

#footer address a:hover{
	color: #BF0103;
}



/* ==============
    cookieinfo
   ============== */
/*
#cookieinfo * {
    margin: 0px;
    padding: 0px;
}

#cookieinfo {
	position: fixed;
	font-size: 12px;
	font-family: Arial, Verdana, sans-serif;
	left: 0px;
	bottom: 0px;
	right: 0px;
	background-color: rgba(49,35,35,0.95);
	padding: 20px;
	z-index: 1000;
	text-align: center;
}

#cookieinfo h4 {
	font-size: 16px;
	font-weight: bold;
	color: #FEEBD5;
	margin-bottom: 7px;
}

#cookieinfo p {
	font-size: 12px;
	color: #FEEBD5;
	line-height: 1.5em;
}

#cookieinfo a {
	color: #FEEBD5;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #FEEBD5;
}


#cookieinfo a.closeinfo {
	display: block;
	font-size: 16px;
	color: #FEEBD5;
	text-align: center;
	text-decoration: none;
	border: none;
	margin: 10px 0;	
}

#cookieinfo a.closeinfo:hover {
	color: #312323;
	background-color: #FEEBD5;
}

	
*/






/* ==========================================================================
   MEDIA QUERIES
   ========================================================================== */



@media (max-width: 1024px) { 


	body.book,
	body.rules
	 {
		font-family: "Marcellus SC", Arial, Helvetica, sans-serif;
		font-weight: 400;
		font-size: 19px;
		line-height: normal;
		
		/* IE9 SVG, needs conditional override of 'filter' to 'none' */
/*		background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzVhMzEwNCIgc3RvcC1vcGFjaXR5PSIwLjUiLz4KICAgIDxzdG9wIG9mZnNldD0iNDAlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjAiLz4KICAgIDxzdG9wIG9mZnNldD0iNjAlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjAiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzVhMzEwNCIgc3RvcC1vcGFjaXR5PSIwLjUiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
	*/
		background: 
		-moz-linear-gradient(left, rgba(90,49,4,0.5) 0%, rgba(255,255,255,0) 40%, rgba(255,255,255,0) 60%, rgba(90,49,4,0.5) 100%), /* FF3.6+ */
		url(../img/bg-mobile-book.jpg)  repeat-x center top,
		url(../img/bg-mobile.jpg)  repeat center 280px;
					
					
		background: 
		-webkit-gradient(linear, left top, right top, color-stop(0%,rgba(90,49,4,0.5)), color-stop(40%,rgba(255,255,255,0)), color-stop(60%,rgba(255,255,255,0)), color-stop(100%,rgba(90,49,4,0.5))), /* Chrome,Safari4+ */
		url(../img/bg-mobile-book.jpg)  repeat-x center top,
		url(../img/bg-mobile.jpg)  repeat center 280px;
					
		background: 
		-webkit-linear-gradient(left, rgba(90,49,4,0.5) 0%,rgba(255,255,255,0) 40%,rgba(255,255,255,0) 60%,rgba(90,49,4,0.5) 100%), /* Chrome10+,Safari5.1+ */
		url(../img/bg-mobile-book.jpg)  repeat-x center top,
		url(../img/bg-mobile.jpg)  repeat center 280px;
					
					
		background: 
		-o-linear-gradient(left, rgba(90,49,4,0.5) 0%,rgba(255,255,255,0) 40%,rgba(255,255,255,0) 60%,rgba(90,49,4,0.5) 100%), /* Opera 11.10+ */
		url(../img/bg-mobile-book.jpg)  repeat-x center top,
		url(../img/bg-mobile.jpg)  repeat center 280px;
					
		background: 
		-ms-linear-gradient(left, rgba(90,49,4,0.5) 0%,rgba(255,255,255,0) 40%,rgba(255,255,255,0) 60%,rgba(90,49,4,0.5) 100%), /* IE10+ */
		url(../img/bg-mobile-book.jpg)  repeat-x center top,
		url(../img/bg-mobile.jpg)  repeat center 280px;										
		
		background: 
		linear-gradient(to right, rgba(90,49,4,0.5) 0%,rgba(255,255,255,0) 40%,rgba(255,255,255,0) 60%,rgba(90,49,4,0.5) 100%), /* W3C */
		url(../img/bg-mobile-book.jpg)  repeat-x center top,
		url(../img/bg-mobile.jpg)  repeat center 280px;	
		
		}
	
	

	
	
	
	#main {
		width: 90%;
		margin: 0 auto;
		padding: 0;
		position: relative;
		height: auto;
	}



.intro {
	width: 100%;
	height: auto;
	float: none;
	clear: both;
	padding-top: 250px;
	margin-left: 0px;
}


.product {
	display: block;
	width: 480px;
	height: 1500px;
	float: none;
	position: relative;
	margin: 40px auto 0px auto;
	float: none;
	clear: both;
}

.product ul li {
	margin-bottom: 40px;
	position: relative !important;
	width: 100% !important;
	height: auto !important;
	left: 0px !important;
	top: 0px !important;
	text-align: center !important;
}


.product ul li.k1:before {
	content: url(../img/kindziuk1.png);
	position: relative;
	left: 50%;
	margin-left: -133px;
	top: 0;
	width: 266px;
	height: 197px;
	z-index: 4;
	display: block;
}


.product ul li.k2:before {
	content: url(../img/kindziuk2-big.png);
	position: relative;
	left: 50%;
	margin-left: -142px;
	top: 0px;
	width: 285px;
	height: 168px;
	z-index: 4;
	display: block;
}


.product ul li.k3:before {
	content: url(../img/kindziuk3-big.png);
	position: relative;
	left: 50%;
	margin-left: -142px;
	top: 0px;
	width: 285px;
	height: 168px;
	z-index: 4;
	display: block;
}


.product ul li.k4:before {
	content: url(../img/kindziuk4-big.png);
	position: relative;
	left: 50%;
	margin-left: -142px;
	top: 0px;
	width: 285px;
	height: 168px;
	z-index: 4;
	display: block;
}


.product ul li.k5:before {
	content: url(../img/kindziuk5-big.png);
	position: relative;
	left: 50%;
	margin-left: -142px;
	top: 0px;
	width: 285px;
	height: 191px;
	z-index: 4;
	display: block;
}

.product ul li.k6:before {
	content: url(../img/kindziuk6-big.png);
	position: relative;
	left: 50%;
	margin-left: -142px;
	top: 0px;
	width: 285px;
	height: 191px;
	z-index: 4;
	display: block;
}




.list-rules {
	width: 100%;
	height: auto;
	margin: 80px 0 0 0;
	padding: 0;
	float: none;
	clear: both;
	font-size: 18px;
}


.content-rules {
	width: 100%;
	height: auto;
	position: relative;
	margin: 40px 0 0 0;
	padding: 0;
	float: none;
	clear: both;
	font-size: 18px;
}


.book #main a.link,
.rules #main a.link{
	display: block;
	position: absolute;
	right: 50%;
	top: 0px;
	padding: 15px 0;
	color: #351f1c;
	width: 160px;
	text-align: center;
	margin-right: -80px;
}

.book #main a.link:hover,
.rules #main a.link:hover{
	font-weight: bold;
}


















#footer {
	width: 100%;
}

#footer address{
	text-align: center;
	font-style: normal;
	font-size: 18px;
	display: block;
	width: 100%;
	margin: 0;
	padding: 50px 0 20px 0;
}

.facebook{
	width: 100%;
	height: 19px;
	display: block;
	position: relatiwe;
	bottom: 20px;
	left: auto;
	right: auto;
	text-align: center;
}




}

@media (min-width: 768px) and (max-width: 1023px) { 
    
		
	
}


@media (max-width: 767px) {
	
	
}



@media (max-width: 600px) {



	


	
	
}
@media (max-width: 480px) {
	

	

}
@media (max-width: 380px) {

}
/*


/* ==========================================================================
   Helper classes
   ========================================================================== */


.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   Print styles
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}*/