@font-face {
    font-family: bebasneue-webfont;
    src: url("../font/bebasneue-webfont.eot");
    src: url("../font/bebasneue-webfont.eot?#iefix") format("embedded-opentype"),
         url("../font/bebasneue-webfont.woff") format("woff"),
         url("../font/bebasneue-webfont.ttf") format("truetype"),
         url("../font/bebasneue-webfont.svg#bebasneue-webfont") format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: opensans-light-webfont;
    src: url("../font/opensans-light-webfont.eot");
    src: url("../font/opensans-light-webfont.eot?#iefix") format("embedded-opentype"),
         url("../font/opensans-light-webfont.woff") format("woff"),
         url("../font/opensans-light-webfont.ttf") format("truetype"),
         url("../font/opensans-light-webfont.svg#opensans-light-webfont") format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: opensans-bold-webfont;
    src: url("../font/opensans-bold-webfont.eot");
    src: url("../font/opensans-bold-webfont.eot?#iefix") format("embedded-opentype"),
         url("../font/opensans-bold-webfont.woff") format("woff"),
         url("../font/opensans-bold-webfont.ttf") format("truetype"),
         url("../font/opensans-bold-webfont.svg#opensans-bold-webfont") format("svg");
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: pictos-web;
    src: url("../font/pictos-web.eot");
    src: url("../font/pictos-web.eot?#iefix") format("embedded-opentype"),
         url("../font/pictos-web.woff") format("woff"),
         url("../font/pictos-web.ttf") format("truetype"),
         url("../font/pictos-web.svg#pictos-web") format("svg");
    font-weight: normal;
    font-style: normal;
}


html, body {
margin:0;
padding:0;
height: 100%; 
width:100%;
line-height:21px;
font-size:15px;
font-family:"opensans-light-webfont", Arial, Tahoma;
color:#000;
}


img { border:0;}
a, a:hover, a:active{ outline: none;}
::-moz-selection{background:#0ea4e2; color:#fff;} 
::selection {background:#0ea4e2; color:#fff;}


a{
color:#000;
	text-decoration:none;
}

a:hover{
color:#0ea4e2;
}


b {
font-family:"opensans-bold-webfont", Arial, Tahoma;
font-weight:normal;
}

/*---overall---*/



h1{
margin:0 0 20px 0;
padding:100px 0 0 0;
color:#000;
font-size:40px;
line-height:40px;
font-family:"bebasneue-webfont", Arial, Tahoma;
font-weight:normal;
text-align:center;
width:420px;
}

h2{
margin:0 0 30px 0;
padding:0;
color:#000;
font-size:30px;
line-height:30px;
font-family:"bebasneue-webfont", Arial, Tahoma;
font-weight:normal;
}

	
h3{
margin:0 0 20px 0;
padding:0;
color:#0ea4e2;
font-size:18px;
line-height:21px;
font-family:"opensans-bold-webfont", Arial, Tahoma;
font-weight:normal;
}



p {margin:0 0 20px 0;}





/*---main---*/

#logo {
margin:-55px 0 20px 0;
}

#header .ribbon {
position:absolute;
}

@media screen and (min-width: 1600px) {
#header .ribbon {
margin:-10px 0 0 1130px;
}
}


@media screen and (max-width: 1600px) {
#header .ribbon {
margin:-10px 0 0 0;
right:0;
}
}




.pictos {
margin:0 5px 0 0;
font-family:"pictos-web", Arial, Tahoma;
color:#0ea4e2;
}

#header .extrainfo {
position:absolute;
margin:360px 0 0 0;
}





.extrainfo {
display:block;
width:243px;
height:58px;
text-align:center;
padding:15px 0 0 0;
color:#fff;
font-size:40px;
line-height:40px;
font-family:"bebasneue-webfont", Arial, Tahoma;
background:url(../img/btn2.png) no-repeat left center;
}


.extrainfo:hover {
color:#fff;
background:url(../img/btn2.png) no-repeat right center;
}



.smallerbtn {
width:190px;
height:31px;
padding:8px 0 0 0;
color:#fff;
font-size:24px;
line-height:24px;
background:url(../img/btn.png) no-repeat left center;
}

.smallerbtn:hover {
background:url(../img/btn.png) no-repeat right center;
}




#header .smallerbtn {
position:absolute;
margin:380px 0 0 250px;
background:url(../img/btn.png) no-repeat right center;
}


#header .smallerbtn:hover {
background:url(../img/btn.png) no-repeat left center;
}




/*---front---*/




.content {
float:left;
margin:0;
padding:50px  0;
width:100%;
min-width:980px;
}


.content_inner {
padding:0 10px;
margin:0 auto;
width:960px;
}



#header {
height:448px;
padding:40px  0 0 0;
background:url(../img/hdr.jpg) no-repeat bottom center;
}



#header p {
width:420px;
font-size:21px;
line-height:30px;
text-align:center;
}

#options {
height:747px;
background:url(../img/options.png) no-repeat center;
}




#gray {
background:url(../img/gray.png) repeat-y center;
}



#gray h3 {
margin:0 0 5px 0;
}





.content .left {
float:left;
width:450px;
margin:0 60px 0 0;
}



.content .right {
float:left;
width:450px;
}






.content_inner p .tooltip{
display:none;
position:absolute;
color:#fff;
width:215px;
font-size:13px;
line-height:16px;;
padding:10px 10px 22px 10px;
background:url(../img/tooltip.png) no-repeat bottom center;
}

.content_inner .box_2 p .tooltip{
margin-left:135px;
}

.content_inner .box_2 h2{
font-size:50px;
}


.content_inner  .bubble{
position:absolute;
color:#fff;
font-size:55px;
line-height:21px;
margin:-95px 0 0 78px;
}

.content_inner .box_2  .bubble{
margin:-155px 0 0 218px;
}

.content_inner .box_3  .bubble{
margin:-95px 0 0 68px;
}

.content_inner p:hover  .tooltip{
display:block;
}






#about ul, #moreinfo ul {
list-style-type:none;
margin:0 0 20px 0;
padding:0;
}


#about ul li {
margin:0 0 0 5px;
padding:0 0 0 15px;
background:url(../img/arw.png) no-repeat left center;
}





#moreinfo {
font-size:18px;
line-height:36px;
}

#moreinfo ul li {
margin:0 0 0 5px;
padding:0 0 0 15px;
background:url(../img/arw2.png) no-repeat left center;
}



#facebook {
padding:50px  0 50px 0;
background:#e1e5ec;
}


#moreinfo  .left {
float:left;
width:300px;
margin:0 60px 0 0;
}



#moreinfo  .right {
float:left;
width:600px;
}


#about .left{
width:600px;
}

#about .right{
width:300px;
}

#about   {
padding:50px 0 20px 0;
}


#options   {
text-align:center;
padding:0 0 20px 0;
}



#options  .box_1 {
float:left;
width:225px;
padding:200px 0 0 0;
}


#options  .box_2 {
float:left;
width:510px;
padding:200px 0 0 0;
}



#options  .box_3 {
float:left;
width:225px;
padding:200px 0 0 0;
}

#options  .box_3 p {
margin:0 0 15px 0;
}

#options  .smaller {
font-size:18px;
}


.box_1 .extrainfo , .box_3 .extrainfo {
position:absolute;
margin:470px 0 0 20px;
}

.box_2 .extrainfo  {
position:absolute;
margin:500px 0 0 130px;
}




.testimonial {
float:left;
width:200px;
text-align:center;
}






.testimonial .image{
width:200px;
height:200px;
margin:0 0 20px 0;
-moz-border-radius:100px; /* Firefox */ 
-webkit-border-radius: 100px; /* Safari, Chrome */ 
border-radius: 100px; /* CSS3 */

}