*{font-family: 'Roboto', sans-serif;font-weight:300;}
body{background-color:#085191;padding:0;margin:0}
p{margin:0 0 15px}
.container{max-width:1200px;margin:auto;}
@media screen and (max-width: 640px) {
	.container{padding-left:20px;padding-right:20px;}
}
.strong-blue{background:#054984 url(../img/arrow-strong-blue.png) no-repeat top center;padding-top:35px;padding-bottom:25px}
.light-blue{background:#085191 url(../img/arrow-light-blue.png) no-repeat top center;padding-top:35px;padding-bottom:15px}
.content div.no-arrow{background-image:none} 
.ma{margin:auto;display: block}
header, footer{background-color:#FFF;max-height:150px;}
footer{text-align:center;padding:15px} 

#searchinput{margin:8px 3px 8px 20px;float:left;width:200px;}
#searchbutton{margin:8px 3px;float:left;width:100px;}
li.search{width:350px;}

h1{font-size:30px;color:#3FCCE8;text-align:center;font-weight:900;margin:10px 0 25px}
h2{font-size:20px;height:72px;text-align:center;background:url(../img/bkg-title.png) no-repeat top center;font-weight:900;line-height:72px;margin:0 0 40px}
p{font-size:26px;}

.w50{width:50%;float:left}
.diagrams{margin-top:60px}
.diagrams, .rating{text-align:center;overflow:hidden;}
.diagram{width:271px;height:271px;margin:0 auto 30px;background:url(../img/diagram.png) no-repeat;color:#53C7DC;font-size:56px;line-height:271px}
.diagrams .legend{background-color:#F7AE31;border-radius:4px;display:inline-block;padding:10px 25px;text-transform:uppercase;font-weight:900;font-size:16px}

table{margin:auto}
table td{border-top:1px solid #53c7dc;font-size:14px;}
table td, table th{padding:4px 10px;font-weight:400}
table th{font-size:14px;font-weight:700;color:#28acc4;text-align:left}
.pct-color{;border-radius:5px;display:inline-block;padding:4px 5px;font-size:20px;vertical-align:middle;font-weight:400}
.good{background-color:#1da45d}
.bad{background-color:#fc0808;}
table th .pct-color{padding:4px 10px;margin-left:20px}

.speed{text-align:center;font-size:36px;color:#53C7DC}
.speed-level{margin:auto;max-width:530px;background-color:#FFF;height:14px;border-radius:7px;overflow:hidden}
.speed-level span{background-color:#53C7DC;display:block;height:14px}

.states{text-align:center}
.state-icon{font-size:36px;display:inline-block;padding:20px 20px 20px 120px;height:110px;line-height:70px;border-radius:5px;margin:0 33px}
.valid{background: #409FB4 url(../img/icon-valid.png) 20px no-repeat;}
.unvalid{background: #62447C url(../img/icon-unvalid.png) 20px no-repeat;}

.rate{width:218px;height:218px;border:5px solid #53C7DC;border-radius:100%;font-size:50px;margin:auto;line-height:218px}
.rate .total{color:#53C7DC}

#chart_div{height:250px;max-width:1000px;margin:auto;}

.newsletter{max-width:800px;margin:auto}
.newsletter .title{color:#53C7DC;font-size:40px;font-weight:900;margin-bottom:10px}
.newsletter p{font-size:18px}
.newsletter form{overflow:hidden}
.newsletter input[type=text]{margin-bottom:10px;width:500px;padding:0 70px;height:70px;border:none;border-radius:5px;background:#FFF url(../img/bkg-input.png) 15px 23px no-repeat;color:#a0a0a0;vertical-align: top;margin-right:30px}
.newsletter button{text-transform:uppercase;border:1px solid #ffc969;text-transform:uppercase;background-color:#feb73d;height:70px;border-radius:5px;font-size:38px;font-weight:900;color:#835607;text-shadow: 0px 1px #ffcb73;box-shadow: 0px 3px 3px -1px #000;}

@media screen and (max-width: 1200px) {
	.container{padding-left:20px;padding-right:20px;}
}
@media screen and (max-width: 800px) {

	h1{font-size:40px;word-wrap: break-word}
	h2{font-size:20px}
	p{font-size:15px}
	.w50{width:100%;margin-bottom:30px}
	.state-icon{font-size:25px}
	.valid{margin-bottom:20px}
	.unvalid{margin-bottom:20px}
	.newsletter input[type=text]{width:100%;margin-bottom:10px}
	.newsletter button{width:100%}
}

/* Digimood */

.valeurdiag1, .valeurdiag2 {
	color:#53c7dc;
}

.diagram {
	background:transparent;
	position:relative;
}

.arc {
    position:absolute;
    top:0;
    left:0;
    width:271px;
    height:271px;
    border-radius:100%;
    border:44px solid;
   	transition:0.80s all ease;
}

.arc_start1, .arc_start2 {
    border-color:transparent #53c7dc #53c7dc transparent;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
}

.arc_end1, .arc_end2 {
    border-color:transparent #53c7dc #53c7dc transparent;
    -webkit-transform: rotate(89deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(180deg);
}

.speedred{background:#dc5353 !important;}
.speedblue{background:#53C7DC;}

.form button
{
	display: block;
	margin:auto;
	padding-left: 13px;
    padding-right: 13px;
	cursor: pointer;
}