﻿/*******************************
Version : 2.0.0.4
Revised : jeudi 27 mars 2014, 14:47:44 (UTC+0100)
*******************************/

/* tag */
body {
	height:100%;
	background-color:#ffffff; margin:0px;
	font-family: "texgyreadventorregular", sans-serif; font-size:18px; color:#142947;
	text-align:justify;
	padding:0px;
}
img {
	border:0px;
}
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
h1,h2,h3,h4,h5,p{
	font-weight:normal;
	margin:0;
}
h1{
	width:100%;
	font-size:36px;
	line-height:46px;
	margin-bottom:6px;
	border-bottom:1px solid #ff761b;
	font-family:'latoregular', sans-serif;
	text-align:center;
}
h2{
	font-size:22px;
	color:#ff761b;
	line-height:22px;
	padding-bottom:6px;
	margin-top:25px;
	border-bottom:10px
}
h3{
    font-size:15px;
    color:#ff761b;
    line-height:22px;
    padding-bottom:6px;
	margin-top:20px;
	border-bottom:10px
}
h4{
	font-size:13px;
	font-style: italic;
	color:#ff761b;
	line-height:22px;
	padding-bottom:6px;
	margin-top:20px;
	border-bottom:10px
}
p{
	font-size:16px;
	color:#000;
}
ul{
	list-style-image:url('../images/tag-li.png');
}
li.col2{
	float:left;
	width:50%;
}
ol{
	margin:0;
	padding:0 10px 0 17px;
	float:left;
	width:50%;
	font-size:10px;
}
a{
	text-decoration:none;
}

/* Général */
.disableAutocomplete {}
.clear { clear:both; }
.pointer{
	cursor:pointer;
}
.hr {
	width:100%; height:1px;
    display: block;
	background-color:#333;
	margin:5px 0 5px 0;
}
.center {
	text-align: center;
}

/* Contenu */
#contenu {
	width:100%; min-height:280px;
	background:url('../images/bg-contenu.png') repeat-x #fff;
}
#inner-contenu {
	width:100%; max-width:1000px; min-height:350px;
	margin:auto;
	background-color:#fff;
	padding:16px 16px 0 16px;
}

@media screen and (min-width:640px) and (max-width:999px) {
	.centerimg {
		width:50%;
	}
}
@media screen and (min-width:320px) and (max-width:639px) {
	.centerimg {
		width:80%;
	}
}
@media screen and (max-width:319px) {
	.centerimg {
		width:95%;
	}
}


/* Bloc Ils nous font confiance */

@media screen and (min-width:1000px){
	#confiance{
		min-width:1000px;
	}
	#carousel{
		width:1000px;
	}
}
@media screen and (max-width:999px){
	#confiance{
		width:100%;
	}
	#carousel{
		width:100%;
	}
}
#confiance{
	height:100px;
	text-align:center;
	font-variant:small-caps;
	background-color:#eee;
}
#carousel{
	margin:auto;
}
#carousel .item{
	margin: 3px;
}
#carousel .item img{
	display: block;
	margin:auto;
	max-height:60px;
}

/* Panoramas entete */
@media screen and (min-width:1000px) {
	#panorama {
		height:490px;
	}
}
@media screen and (min-width:550px) and (max-width:999px){
	#panorama {
		height:390px;
	}
}
@media screen and (min-width:320px) and (max-width:549px){
	#panorama {
		height:290px;
	}
}
@media screen and (max-width:319px){
	#panorama {
		height: 190px;
	}
}
#panorama {
	width:100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}
.pano_conseil{
	background-image:url('/template/images/panorama/conseil.jpg');
}
.pano_attaques-cryptographie{
	background-image:url('/template/images/panorama/attaques-cryptographie.jpg');
}
.pano_cryptographie{
	background-image:url('/template/images/panorama/cryptographie.jpg');
}
.pano_documentation{
	background-image:url('/template/images/panorama/documentation.jpg');
}
.pano_hacking{
	background-image:url('/template/images/panorama/hacking.jpg');
}
.pano_legislation{
	background-image:url('/template/images/panorama/legislation.jpg');
}
.pano_securite-informatique-divers{
	background-image:url('/template/images/panorama/securite-informatique-divers.jpg');
}
.pano_securite-informatique-wifi{
	background-image:url('/template/images/panorama/securite-informatique-wifi.jpg');
}
.pano_malwares{
	background-image:url('/template/images/panorama/malwares.jpg');
}

/* Share */
#share img {
	padding-right: 10px;
}

/* social network */

@media screen and (min-width:1000px) {
	#socialnetwork{
		min-width:1000px;
	}
}
@media screen and (max-width:999px) {
	#socialnetwork{
		width:100%;
	}
}

#socialnetwork{
	height:56px;
	text-align:center;
	background-color:#eee;
}
#socialnetwork > div{
	padding-top: 5px;
}
/* OLD */
#social-twitter{
	position:absolute; bottom:-46px; right:46px;
	width:46px; height:46px;
	z-index:12;
}
#social-boinc{
	position:absolute; bottom:-46px; right:92px;
	width:46px; height:46px;
	z-index:12;
}
#social-fb{
	position:absolute; bottom:-46px; right:0px;
	width:46px; height:46px;
	z-index:12;
}
/* OLD */
#socialn-twitter{
	width:46px; height:46px;
	z-index:12;
	display: inline-block;
	margin-right: 10px;
}
#socialn-fb{
	width:46px; height:46px;
	z-index:12;
	display: inline-block;
	margin-right: 10px;
}
#socialn-boinc{
	width:46px; height:46px;
	z-index:12;
	display: inline-block;
}

/* Adaptation ancien design */
.t_titre {
	width:100%;
}

#SousTitre2Doc {
	font-family:"texgyreadventorregular", sans-serif; font-size:18px; color:#ff761b; font-weight:normal; font-style:normal;
}
#TexteNormal {
	font-family:"texgyreadventorregular", sans-serif; font-size:16px; color:#142947; font-weight:normal; font-style:normal; text-align:justify;
}
#CodeSource {
	font-family:Courier New, courier, sans-serif; font-size: 10pt;
}
#CodeSourceColor {
	color:#4941a8; font-family:Courier New, courier, sans-serif; font-size: 8pt;
}
#TextePetit {
	color: #000000; font-family: Tahoma, Arial, Helvetica, sans-serif; font-size: 8pt;
}
#TexteCadre {
        color: #000000; font-family: Tahoma, Arial, Helvetica, sans-serif; font-size: 10pt;
}
#TexteSousImage {
        color: #4941a8; font-family: Tahoma, Arial, Helvetica, sans-serif; font-size: 9pt; font-style: italic;
}

/*******************************
Version : 2.0.0.4
Revised : jeudi 27 mars 2014, 14:33:31 (UTC+0100)
*******************************/

@font-face {
    font-family: 'texgyreadventorregular';
    src: url('../fonts/texgyreadventor-regular-webfont.eot');
    src: url('../fonts/texgyreadventor-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/texgyreadventor-regular-webfont.woff') format('woff'),
         url('../fonts/texgyreadventor-regular-webfont.ttf') format('truetype'),
         url('../fonts/texgyreadventor-regular-webfont.svg#texgyreadventorregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'texgyreadventorbold';
    src: url('../fonts/texgyreadventor-bold-webfont.eot');
    src: url('../fonts/texgyreadventor-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/texgyreadventor-bold-webfont.woff') format('woff'),
         url('../fonts/texgyreadventor-bold-webfont.ttf') format('truetype'),
         url('../fonts/texgyreadventor-bold-webfont.svg#texgyreadventorbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'latoregular';
    src: url('../fonts/lato-reg-webfont.eot');
    src: url('../fonts/lato-reg-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-reg-webfont.woff') format('woff'),
         url('../fonts/lato-reg-webfont.ttf') format('truetype'),
         url('../fonts/lato-reg-webfont.svg#latoregular') format('svg');
    font-weight: normal;
    font-style: normal;
}


/*******************************
Version : 2.0.0.4
Revised : jeudi 27 mars 2014, 14:56:21 (UTC+0100)
*******************************/

/* Tétière */

@media screen and (min-width:1000px) {
	#tetiere {
		min-width:1000px;
		height:130px;
	}
	#inner-tetiere {
		width:1000px;
		height:130px;
	}
}
@media screen and (max-width:999px) {
	#tetiere {
		min-width:100%;
	}
	#inner-tetiere {
		width:100%;
	}
}

@media screen and (min-width: 800px) {
	#tetiere-search{
		float:right;
		top:50px;
		height:30px;
		width:385px;
	}
}
@media screen and (max-width:799px) {
	#tetiere-search{
		padding-top: 10px;
		clear: both;
		height:50px;
		width:385px;
	}
}
@media screen and (max-width:384px) {
	#tetiere-search{
		width:100%;
	}
}
@media screen and (max-width:287px) {
	#logosi img{
		width:100%;
	}
}
#tetiere {
	background-color:#fff;
}
#inner-tetiere {
	position:relative;
	margin:auto;
}
#tetiere-bandeau{
	position:absolute;
	width:1000px; height:5px;
	background-color:#a6a6a6;
}
#tetiere-search{
	position:relative;
	z-index:2;
	background-color:#fff;
}
#logosi{
	float:left;
	padding-top:20px;
}
#tetiere-texte{
	font-size:16px; color:#FF761B; text-align:left;
	
}
/* OLD */
#tetiere-bandeau-droit{
	float:right;
	position:relative; top:50px;
	z-index:2;
	width:385px; height:30px;
	background-color:#fff;
}
#texte-tetiere {
	width:500px; height:30px;
	position:absolute; top:95px; left:16px;
	font-size:16px; color:#FF761B; text-align:left;
}
#logo-si {
	position:absolute; top:20px; left:16px;
	width:287px; height:66px;
}
/* OLD */

#moteur-recherche{
	position:absolute; top:0px; left:0px;
	width:355px; height:30px;
	border:1px solid #a6a6a6;
}
#form-recherche{
	position:relative; z-index:2;
}
#search{
	padding:0 7px;
	font-family:"texgyreadventorregular", sans-serif; 
	background:transparent;
	width:353px; height:29px; border:0;
}
#moteur-recherche-ok{
	position:absolute; top:0px; right:0px;
	width:30px; height:30px;
	font-size: 16px; line-height:30px; 
}

/* Menu */
#menu-bandeau-droite {
	position:relative; bottom:00px;
	float:right;
	width:50%; height:46px;
	background-color:#eee;
	z-index:0;
}
#menu {
	position:relative; bottom:0px; left:0px;
	width:1000px; height:46px;
	margin:auto;
	padding-left:16px; padding-right:16px;
	background-color:#eee;
	color:#142947;
	text-align:left;
	line-height:46px;
	font-size:16px;
	z-index:10;
}
#menu a{	color:#142947;}
#menu a:hover{ color:#000; }
#menu a:active{ color:#ff761b; }
#menu > div {
	position:absolute;
	cursor:pointer;
}
#menu_block{
	background-color: #142947;
    height: 3px;
    position: absolute;
    top: 0px; left:14px;
    width: 74px;
}
.ss-menu {
	display:none;
	position:absolute; top:46px;
	line-height:20px;
	width:1000px;
	padding:10px;
	background-color:#aaa;
}
.ssm-cat {
	float:left;
	padding:0 20px 10px 0;
}
.ssm-titre {
	font-weight:bold;
	border-bottom:1px solid #142947;
}
.ssm-item a{
	display:inline-block;
	padding:10px 0;
}
.ssm-item a:hover{
	color:#fff !important;
}
#menu_accueil { left:16px; }
#menu_audits { left:100px; }
#menu_services { left:257px; }
#menu_hebergements { left:502px; }
#menu_literrature{ left:661px; }
#ssm-a { left:-100px; }
#ssm-s { left:-257px; }
#ssm-h { left:-502px; }
#ssm-l { left:-661px; }

/* Diaporama */

#bg-diapo {
	width:100%; height:270px;
	background-color:#142947;
}
#slider{
	position:relative;
	width:1000px; height:270px;
	margin:auto;
}
#diaporama {
	position:absolute; top:0px; left:0px;
	width:1000px; height:270px;
}
#dp-square{
	position:absolute; bottom:0px; left:0px;
	width:50px; height:50px;
	background-color:#282828;
	z-index:6;
}
#dp-strip{
	position:absolute; bottom:0px; left:50px;
	width:466px; height:50px;
	background-color:#ff761b;
	z-index:6;
}
.dp-titre{
	font-family:'texgyreadventordemi', sans-serif; font-weight:bold;
}

/*******************************
Version : 2.0.0.4
Revised : jeudi 27 mars 2014, 17:18:23 (UTC+0100)
*******************************/

/* Pied de page */

@media screen and (min-width:1000px) {
	#pied-de-page {
		min-width:1000px;
	}
	#inner-pied-de-page {
		width:1000px;
	}
	.bloc-sitemap{
		width:327px;
		float:left;
		padding-right:26px;
	}
}
@media screen and (max-width:999px) {
	#pied-de-page {
		min-width:100%;
	}
	#inner-pied-de-page {
		width:100%;
	}
	.bloc-sitemap{
		width:100%;
		float:left;
		padding-right:26px;
	}
}

#pied-de-page {
	position:relative;
	background-color:#565656;
	color:#fff;
	border-top:3px solid #a6a6a6;
	padding-bottom:20px;
}
#inner-pied-de-page {
	margin:auto;
	padding:16px 16px 0 16px;
	color:#fff;
}
#inner-pied-de-page a{
	color:#fff;
	text-decoration: none;
}
#inner-pied-de-page a:hover{
	color:#fff;
	text-decoration: underline;
}
.bloc-sm-titre{
	width:100%;
	border-bottom:1px solid #fff;
	margin-bottom:8px;
}
.bloc-sm-contenu{
	line-height:24px;
}
.bloc-sm-contenu a {color:#fff;}
.bloc-sm-contenu a:hover {color:#000;}
.bloc-sm-contenu a:active{ color:#ff761b; }
.bloc-sm-detail{
	font-size:14px; color:#b3b3b3;
}

@media screen and (min-width:1000px) {
	#mentions {
		min-width:1000px;
		height:30px;
	}
	#inner-mentions{
		width:1000px;
	}
}
@media screen and (max-width:999px) {
	#mentions {
		width:100%;
	}
	#inner-mentions{
		width:100%;
	}
}

#mentions {
	position:relative;
	background-color:#ff761b;
	border-bottom:3px solid #282828;
}
#inner-mentions{
	margin:auto;
	padding:0 16px;
	font-size:14px; color:#fff;
	line-height:25px;
}
#inner-mentions a { color:#fff; }
#inner-mentions a:hover { color:#222; }
#inner-mentions a:active{ color:#000; }
#mentions-gauche{
	float:left; text-align:left;
}
#mentions-droite{
	font-size:1.1em;
	float:right; text-align:right;
}
