body {
background-color:#1B4450;
padding:0;
margin:0 auto;
width:980px;
}

#page {
width:980px;
float:left;
background-color:#FFF;
margin:0px;
padding:0px;
position:relative;
}

#large-column {
width:100%;
float:left;
}

#sidebar {
width:425px;
float:left;
}

#shorturlform,#shorturlform_expand,#shorturlform_customize {
width:440px;
height:38px;
font-size:22px;
font-weight:100;
font-family:"Courier New", Courier, monospace;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
border:1px solid #000;
text-align:center;
padding:0;
margin: 20px 0px 10px 0px;
color:#000;
}

#listshorturl
{
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
width:500px;
height:160px;
font-size:18px;
font-weight:100;
font-family:"Courier New", Courier, monospace;
border:1px solid #000;
text-align:left;
padding:10px;
margin: 20px 0px 10px 0px;
color:#000;
}






/*
#shorturlform_expand {
margin: 20px 0px 10px 0px;
width:400px;
}

#shorturlform_customize {
margin: 20px 0px 10px 0px;
width:300px;
}
*/

#shorturlbutton,#shorturlbutton_expand,#shorturlbutton_customize {
width:180px;
height:40px;
font-size:22px;
font-weight:100;
font-family:"Courier New", Courier, monospace;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
border:1px solid #000;
margin: 20px 0px 10px 10px;
background:#EEE;
padding:0;
}

#shorturlbutton_expand {
margin: 20px 0px 10px 10px;
}

#shorturlbutton_customize {
margin: 20px 0px 10px 10px;
width:150px;
}

#shorturlbutton:hover,#shorturlbutton_expand:hover,#shorturlbutton_customize:hover {
background: #000;
color: #FFF;
}



#list_button {
width:180px;
height:40px;
font-size:22px;
font-weight:100;
font-family:"Courier New", Courier, monospace;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
border:1px solid #000;
margin: 5px 0px 0px 10px;
background:#EEE;
padding:0;
}

#list_button:hover {
background: #000;
color: #FFF;
}




a.menu_on {
text-decoration:none;
color:white;
border-bottom:1px solid white;
}

a.menu_on:hover {
text-decoration:none;
color:white;
}

a.menu_off {
text-decoration:none;
color:#ff6600;
}

a.menu_off:hover {
text-decoration:none;
color:#FFB300;
}

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

a:hover {
text-decoration:none;
color:#FFB300;
}

table { border-collapse: collapse; }

#call-to-action {
float:left;
width: 100%;
padding:30px 0px;
background:#FFDEC7;
}

#call-to-action h1 {
font-weight: 100;
text-align:center;
font-family:"open sans";
font-size:24px;
line-height:34px;
margin: 0px 10px 0px 0px;
padding: 0px 0px 0px 0px;
}






#social {
float:left;
margin:20px 0px 20px 40px;
padding:0px 0px 0px 0px;
width:420px;
}

#social h2 {
font-weight: 100;
font-family:"open sans";
font-size:36px;
line-height:38px;
margin:0px;
padding:0px 0px 5px 0px;
}

#social p {
font-family:"open sans";
font-weight:100;
font-size:16px;
line-height:24px;
margin:0px;
padding:10px 0px 0px 0px;
}




#safe-online {
float:right;
margin:20px 40px 20px 0px;
padding:0px 0px 0px 0px;
width:420px;
text-align:right;
}

#safe-online h2 {
font-weight: 100;
font-family:"open sans";
font-size:36px;
line-height:38px;
margin:0px;
padding:0px 0px 5px 0px;
}

#safe-online p {
font-family:"open sans";
font-weight:100;
font-size:16px;
line-height:24px;
margin:0px 0px 10px 0px;
padding:10px 0px 0px 0px;
}






#socialbuttons {
margin: 10px auto 0px;
width:980px;
clear:both;
/* height:60px; */
/* background: #FFDEC7; */
}



#thumbnails {
margin:20px 40px 0px 40px;
padding:20px 0px 0px 0px;
float:left;
border-top: 1px dotted #999;
/* border-bottom: 1px dotted #999; */
height:360px;
}

#thumbnails p {
font-style:italic;
font-family:"open sans";
font-weight:100;
margin:0px 0px 0px 0px;
text-align:center;
font-size:15px;
}

#thumbnails h2 {
font-weight: 100;
font-family:"open sans";
font-size:36px;
line-height:38px;
margin:0px;
padding:0px 10px 20px 0px;
text-align: left;
}



#customize_group {
background:white;
position:relative;
float:left;
width:900px;
height:210px;
margin:20px 0px 30px 40px;
}

#customize_service {
position:relative;
width:130px;
height:30px;
float:left;
padding:0px;
margin:10px 10px 0px 40px;
}




.logo {
top:0;
left:0;
position:absolute;
max-width:100px;
max-height:30px;
}


.question_mark {
width:40px;
margin:-3px 0px 0px 105px;
}  

#customize {
float:right;
margin: 20px 40px 30px 0px;
padding:0px 0px 0px 0px;
width:420px;
}

#customize h2 {
font-weight: 100;
font-family:"open sans";
font-size:36px;
line-height:38px;
margin:0px;
padding:10px 0px 0px 0px;
text-align:right;
}

#customize p {
font-family:"open sans";
font-weight:100;
font-size:16px;
line-height:24px;
margin:0px 0px 10px 0px;
padding:10px 0px 0px 0px;
text-align:right;
}

#load {
position:absolute;
z-index:1;
background:#000;
width:400px;
margin-left:-200px;
height:160px;
top:50%;
left:50%;
text-align:center;
line-height:40px;
font-family:"Courier New", Courier, monospace;
font-size:18px;
color:#FFF;
}




#extract-stat {
float:left;
margin:20px 0px 0px 40px;
padding:0px 0px 0px 0px;
width: 420px;
}

#extract-stat h2 {
text-align: left;
font-weight: 100;
font-family:"open sans";
font-size:36px;
line-height:38px;
margin: 0px 10px 0px 0px;
padding:10px 0px 5px 0px;
}

#extract-stat p {
font-family:"open sans";
font-weight:100;
font-size:16px;
text-align:left;
line-height:24px;
margin:0px 0px 20px 0px;
padding:10px 0px 0px 0px;
}

#mentions {
float:left;
width:890px;
padding:10px 0px 0px 0px;
margin:10px 0px 30px 45px;
}

#mentions h2 {
font-weight: 100;
font-family:"open sans";
font-size:26px;
line-height:28px;
margin:0px 0px 5px 0px;
padding:0px 0px 5px 0px;
text-align:center;
}








p.available a {
  top:8px;
  left:200px;
  position:absolute;
  color:green; 
  font-family:"Courier New", Courier, monospace;
  text-align:center; 
  font-size:15px;
}

p.nonavailable a {
  top:8px;
  left:200px;
  position:absolute;
  color:red; 
  text-decoration:line-through; 
  font-family:"Courier New", Courier, monospace;
  text-align:center; 
  font-size:15px;
}


p.available span, p.nonavailable span { 
  display: none;
}

p.available:hover span {
   z-index: 999; 
   display: block; 
   position: absolute;
   top: 30px; 
   left: -120px;
   font-family:"Courier New", Courier, monospace;
   text-align:left; 
   font-size:17px;
   font-weight:normal;
   width:300px;
   background: green;
   padding: 5px;
   border: 4px solid black;
   color: white;
   padding:10px;
   text-align:center;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;
}

p.nonavailable:hover span {
   z-index: 999; 
   display: block; 
   position: absolute;
   top: 30px; 
   left: -120px;
   font-family:"Courier New", Courier, monospace;
   text-align:left; 
   font-size:17px;
   font-weight:normal;
   width:300px;
   background: red;
   padding: 5px;
   border: 4px solid black;
   color:white;
   padding:10px;
   text-align:center;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;
}

#urlshortener {
height: 16px;      
position: absolute;
top: 5px;         
left: -30px;       
width: 16px;
}

.res_logo {
top:0;
left:20px;
position:absolute;
max-width:140px;
max-height:40px;
}

#customize_group_resultat {
background:white;
position:relative;
float:left;
width:900px;
margin:20px 0px 30px 40px;
}

#customize_service_resultat {
position:relative;
width:300px;
height:50px;
float:left;
padding:0px;
margin:10px 0px 0px 0px;
}


#customize_cochetout {
position:relative;
width:300px;
height:30px;
float:left;
padding:0px;
margin:10px 10px 0px 40px;
}

#customize_cochetout p {
font-family: 'open sans';
font-size: 16px;
font-weight: 100;
text-align: left;
margin-top: 5px;
}

#cochetout {
height: 16px;      
position: absolute;
top: 5px;         
left: -30px;       
width: 16px;
}

.moreinformation {
font-family:Courier New, Courier, monospace;
font-size:16px;
margin:5px 0px 0px 0px;
float:right;
width:130px;
text-align:center;
background:#EEE;
border:1px solid black;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
color: black;
}

.moreinformation a { color: black; display:block; padding:5px 0px; }
.moreinformation:hover { background: #000; }
.moreinformation:hover > a { color: white; display:block; padding:5px 0px; }

