/*  ELEMENT LAYOUT   ============================================================================= */
body{
	margin : 0 auto;
	padding : 0;
	background-color: #ddd;
	font-family: myriad, Arial, Verdana;
}
#wrapper {
	width: 100%;
	position: relative;
	margin: 0 auto;
}

#headcontainer {
	width: 100%;
}
#headcontent{
	width: 100%;
	clear: both;
	margin: 0 auto;
	position: relative;
	max-width: 92,3 em;
	text-align: center;
	font-weight: 100;
	color: #333;
}

#navcontainer {
	width: 100%;
	position: fixed;
	z-index: 999;
}
#navcontent{
	width: 100%;
	clear: both;
	margin: 0 auto;
	/*position: relative;*/
	max-width: 92,3 em;
	background: #000;
}

#maincontainer{
	width: 100%;
}
#maincontent{
	width: 100%;
	clear: both;
	margin: 0 auto;
	position: relative;
	max-width: 92,3 em;
}

#footercontainer{
	width: 100%;
}
#footercontent{
	width: 100%;
	clear: both;
	margin: 0 auto;
	position: relative;
	max-width: 92,3 em;
	text-align: center;
	background: #fff;
}
/*	STYLEs		==============================================================================*/
#head{
	width:auto;
	padding-top: 50px;
	background-image:url(/images/rosina-header.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position:center; /* IE fix */	
}
#koncept{
	text-align: center;
	background-image:url(/images/koncept-bg.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position:center; /* IE fix */
}
#koncept p{
	color: #efefef;
}
#koncept h2{
	color: #fff;
}
.race{
	background: #fff;
}
.race ul{
	list-style-type: none;
	margin: 0;
	padding: 0;
}
.race ul li a{
	background: #fff;
	font-size: 22px;
}
.sign{
    color: #666;
}
.sign a{
    color: #666;
}

#kart{
	width:50%;
	padding-bottom: 650px;
	background-image:url(/images/kart.jpg);
	background-size: cover;
	background-position:center; /* IE fix */
}
#slide{
	width:50%;
	padding-bottom: 550px;
	background-image:url(/images/kart_arena.jpg);
	background-size: cover;
	background-position:center; /* IE fix */
}
#leon{
	width:50%;
	padding-bottom: 550px;
	background-image:url(/images/ring.jpg);
	background-size: cover;
	background-position:center; /* IE fix */
}
#fin3{
	width:50%;
	padding-bottom: 550px;
	background-image:url(/images/fin3.jpg);
	background-size: cover;
	background-position:center; /* IE fix */
}
.leon{
	list-style-type: none;
	display: inline;
}
.leon li{
	font-size: 22px;
	font-weight: 100;
	color: #757575;
}
#formula{
	width:auto;
	padding-bottom: 200px;
	background-image:url(/images/sup_fin.jpg);
	background-size: cover;
	background-position:center; /* IE fix */
}
#formula p{
	color: #c4c4c4;
}
#formula b{
	color: #fff;
}
#sp1{
	width:auto;
	background-image:url(/images/special1.jpg);
	background-size: cover;
	background-position:center; /* IE fix */
}
#nd{
	width:auto;
	background-image:url(/images/2nd.jpg);
	background-size: cover;
	background-position:center; /* IE fix */
}
#sp2{
	width:auto;
	background-image:url(/images/special2.jpg);
	background-size: cover;
	background-position:center; /* IE fix */
}
#reg{
    min-height: 500px;
}
h1{
	font-size: 3em;
	font-family: myriad, arial, verdana;
	color: #f2f2f2;
	text-transform: uppercase;
}
.raceStar{
	font-family: advent;
	background-color: #ed1c24;
	padding: 8px;
	text-transform: uppercase;
}
.error{
    color: #ff3333;
    font-weight: 100;
    font-size: 15px;
}

.cbp-mc-column div{
    margin: 0 auto;
    text-align: center;
}
.biger{
	font-size: 70px;
	text-transform: uppercase;
}
.bigeer{
	font-size: 100px;
}
h2{
	font-size: 2em;
	font-family: advent, arial, verdana;
	color: #ed1c24;
	/*
	background: -webkit-linear-gradient(#df1818, #8d0909);
  	-webkit-background-clip: text;
  	-webkit-text-fill-color: transparent;
	*/
}
.headline{
    color: white;
    text-shadow: 1px 1px #000;
}
b{
	color: #000;
	text-transform: uppercase;
}
.header{
	background-color: red;
	color: #fff;
	padding: 8px;
}

.footer{
	font-size: 18px;
	text-align: justify;
	margin: 15px 10px;
}
h3{
	color:red;
	font-size: 22px;
}
#koncept p{
	font-size: 22px;
}
p{
	font-family: myriad, arial, verdana;
	font-size: 22px;
	color: #666;
}
a{
	text-decoration: none;
	color: red;
}
sup{
	font-size: 25px;
	font-weight: 100;
}
hr{
	border: none;
	margin-top: -1px;
	height: 1px;
	background-color: #c0c8c9;
	background-image: -webkit-linear-gradient(0deg, #fff, #c0c8c9, #fff);
}

/* NAV STYLE ================================================================================= */
#menu li ul{
	/*position: absolute;*/
	z-index: 100;
}

/*Strip the ul of padding and list styling*/
 #navcontent ul {
	list-style-type:none;
	margin:0;
	padding:0;
	position: relative;	
}

/*Create a horizontal list with spacing*/
 #navcontent li {
	display:inline-block;
	float: left;
	margin-right: 1px;
	text-align: center;
}

/*Style for menu links*/
#navcontent li a {
	display:block;
	min-width:140px;
	height: 50px;
	text-align: center;
	line-height: 50px;
	font-family: myriad, arial, verdana;
	font-size: 18px;
	color: #fff;
	background: #000;
	text-decoration: none;
}

/*Hover state for top level links*/
#navcontent li:hover a {
	background: #ed1c24;
	color: #fff;
}

/*Style 'show menu' label button and hide it by default*/
.show-menu {
	text-decoration: none;
	color: #000000;
	background: #fff;
	text-align: center;
	padding: 10px 0;
	display: none;
}

/*Hide checkbox*/
input[type=checkbox]{
    display: none;
}

/*Show menu when invisible checkbox is checked*/
input[type=checkbox]:checked ~ #menu{
    display: block;
}


/*Responsive Styles*/

@media screen and (max-width : 1150px){
	/*Make dropdown links appear inline*/
	#navcontent ul {
		position: static;
		display: none;
	}
	/*Create vertical spacing*/
	#navcontent li {
		margin-bottom: 1px;
	}
	/*Make all menu links full width*/
	#navcontent ul li, li a {
		width: 100%;
	}
	/*Display 'show menu' link*/
	.show-menu {
		display:block;
		border-bottom: 1px solid #000;
		text-align: left;
		color: #efefef;
		padding-left: 30px;
		background: rgba( 76, 76, 76, 0.848 );
	}
	#menu {
		position: absolute;
		z-index: 100;
		background-color: #fff;
	}
	#menu li a {
		background-color: #fff;
		color: #000;
	}
	#menu li a:hover{
		background-color: #ccc;
	}
	#menu > li:first-child { display: none; }
	
}
@media screen and (max-width : 720px){
	.slogan{ margin-left: 0;}
}

/*  GRID SYSTEM  ============================================================================= */

/*  SECTIONS  */
.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}
.section.higher.slogan{
	z-index: 9999;
	position: absolute;
	bottom: 50px;
	margin-left: 250px;
	text-shadow: 2px 2px #000000;
	
}
/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
}
.col:first-child { margin-left: 0; }


/*  GROUPING  */
.group:before,
.group:after {
	content:"";
	display:table;
}
.group:after {
	clear:both;
}
.group {
    zoom:1; /* For IE 6/7 */
}

/*  GRID OF four   ============================================================================= */


.span_3_of_3 {
	width: 100%; 
}

.span_2_of_3 {
	width: 66.13%; 
}

.span_1_of_3 {
	width: 32.26%; 
}
.span_1_of_4{
	width: 25%;
	text-align: center;
}
.span_2_of_4{
	width: 50%;
	text-align: center;
}
.span_1_of_2{
	width: 50%;
	text-align: center;
}



/*  GO FULL WIDTH AT LESS THAN 960 PIXELS */

@media only screen and (max-width: 1100px) {
	.span_3_of_3 {
		width: 100%; 
	}
	.span_2_of_3 {
		width: 100%; 
	}
	.span_1_of_4 {
		width: 100%;
	}
	.span_1_of_3 {
		width: 100%;
	}
	.span_1_of_2{
	width: 100% !important;
	}
	
	
	h1{
	font-size: 3em !important;
	}
	h2{
	font-size: 1.5em !important;
	}
	#leon ul{
		text-align: center;
	}
	#maincontent{
		width: 100%;
	}
	#headcontainer{
		padding-top: 40px;
	}
}
@media only screen and (min-width: 1925px) {
	.higher h1, h1{
	font-size: 5em;
	}
}
@media only screen and (max-width: 720px) {
	p{
	font-size: 15px;
	}
	h1{
	font-size: 2em !important;
	}
	.higher{
		margin-left: 25px !important;
	}
	.biger{
	font-size: 45px;
	}
	.bigeer{
	font-size: 65px;
	}
}
@font-face {
    font-family: advent;
    src: url(/fonts/advent-Re.otf);
}
@font-face {
    font-family: myriad;
    src: url(/fonts/MYRIADPRO-COND.OTF);
}