@font-face {
font-family: 'contb';
src: url(//maritime-agency.fr/wp-content/themes/portfolio/fonts/contb.eot);
src: url(//maritime-agency.fr/wp-content/themes/portfolio/fonts/contb.otf) format('truetype'),
url(//maritime-agency.fr/wp-content/themes/portfolio/fonts/contb.eot?#iefix) format('embedded-opentype'),
url(//maritime-agency.fr/wp-content/themes/portfolio/fonts/contb.woff) format('woff'),
url(//maritime-agency.fr/wp-content/themes/portfolio/fonts/contb.ttf) format('truetype'),
url(//maritime-agency.fr/wp-content/themes/portfolio/fonts/contb.svg#contb) format('svg');
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'contl';
src: url(//maritime-agency.fr/wp-content/themes/portfolio/fonts/contl.eot);
src: url(//maritime-agency.fr/wp-content/themes/portfolio/fonts/contl.otf) format('truetype'),
url(//maritime-agency.fr/wp-content/themes/portfolio/fonts/contl.eot?#iefix) format('embedded-opentype'),
url(//maritime-agency.fr/wp-content/themes/portfolio/fonts/contl.woff) format('woff'),
url(//maritime-agency.fr/wp-content/themes/portfolio/fonts/contl.ttf) format('truetype'),
url(//maritime-agency.fr/wp-content/themes/portfolio/fonts/contl.svg#contl) format('svg');
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'contm';
src: url(//maritime-agency.fr/wp-content/themes/portfolio/fonts/contm.eot);
src: url(//maritime-agency.fr/wp-content/themes/portfolio/fonts/contm.otf) format('truetype'),
url(//maritime-agency.fr/wp-content/themes/portfolio/fonts/contm.eot?#iefix) format('embedded-opentype'),
url(//maritime-agency.fr/wp-content/themes/portfolio/fonts/contm.woff) format('woff'),
url(//maritime-agency.fr/wp-content/themes/portfolio/fonts/contm.ttf) format('truetype'),
url(//maritime-agency.fr/wp-content/themes/portfolio/fonts/contm.svg#contm) format('svg');
font-weight: normal;
font-style: normal;
font-display: swap;
}
* {
margin: 0;
padding: 0;
}
.clear { clear: both; }
body {
font-family: arial;
font-size: 15px;
color: #333;
}
#contener {
position: relative;
width: 100%;
margin: 0 auto;
}
.ariane {
width: 950px;
margin: 10px auto 0 auto;
}
.ariane a { color: #fc4242; text-decoration: none; }
.ariane a:hover { text-decoration: underline; }
.content {
width: 950px;
margin: 0 auto;
}
.fleft, img.alignleft { float: left; }
.titre_trait {
color: #fc4242;
font-size: 47.6px;
font-family: 'contl';
text-transform: uppercase;
text-align: center;
margin: 50px 0 40px 0;
font-weight: normal;
max-width: 1250px;
overflow: hidden;
}
.titre_trait span:before,
.titre_trait span:after {
content: "";
position: absolute;
border-bottom: 1px solid black;
height: 7px;
top: 50%;
margin-top: -4px;
width: 300%;
}
.titre_trait span:before {
right: 100%;
margin-right: 15px;
}
.titre_trait span:after {
left: 100%;
margin-left: 15px;
}
.titre_trait span { position: relative; } #header {
}
#header #top {
height: 30px;
background-color: #e5432c;
color: #2e2d30;
font-size: 13px;
padding-top: 7px;
}
#header #top #tel-fixe {
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/sprite.png) no-repeat 0 -386px;
padding: 3px 0 0 30px;
height: 19px;
display: inline-block;
float: right;
margin-right: 50px;
}
#header #top #tel-port {
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/sprite.png) no-repeat 0 -408px;
padding: 3px 0 0 30px;
height: 19px;
display: inline-block;
float: right;
margin-right: 50px;
}
#header #top #email {
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/sprite.png) no-repeat 0 -430px;
padding: 3px 0 0 30px;
height: 19px;
display: inline-block;
float: right;
}
#header #nav {
height: 69px;
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/nav.jpg) repeat-x;
}
#header #nav a#logo { 
text-transform: uppercase;
display: block;
text-decoration: none;
font-family: 'contm';
font-size: 31px;
color: #666;
}
#header #nav a#logo span {
font-size: 14px;
display: block;
color: #fc4242;
}
#header #nav .fleft { margin-top: 8px; }
#header #nav #menu p { display: none; }
#header #nav ul { list-style: none; float: right; }
#header #nav ul li{ float: left; position: relative; }
#header #nav ul li a { 
font-family: 'contm';
font-size: 15px;
color: #000;
text-transform: uppercase;
text-decoration: none;
padding: 25px 20px;
display: block;
}
#header #nav ul li a:hover { background-color: #fc4242; color: #fff; } #contener #main {
width: 100%;
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/fond-acier.jpg) repeat-y center top;
}
#contener #slideshow {
height: 452px;
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/back-slide.jpg) no-repeat left top;
}
#contener #slideshow .blueberry {
height: 452px;
position: relative;
width: 1025px;
margin: 0 auto;
}
#contener #slideshow .blueberry .cont {
position: absolute;
top: 200px;
cursor: pointer;
}
#contener #slideshow .blueberry .prev:hover { background-position: 0 -57px; }
#contener #slideshow .blueberry .next:hover { background-position: 0 -171px; }
#contener #slideshow .blueberry .next {
width: 57px;
height: 57px;
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/sprite.png) no-repeat 0 -114px;
right: -20px;
}
#contener #slideshow .blueberry .prev {
width: 57px;
height: 57px;
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/sprite.png) no-repeat 0 0;
left: 0;
}
#contener #slideshow .blueberry a.info {
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/lien-slider.png) no-repeat;
display: block;
position: absolute;
left: 670px;
top: 225px;
height: 28px;
width: 137px;
color: #fff;
font-family: 'contm';
font-size: 20.6px;
text-decoration: none;
padding: 2px 0 5px 47px;
}
#contener #main #accroche {
width: 950px;
margin: 0 auto;
background-color: #fff;
color: #333;
text-align: justify;
}
#contener #main #accroche #gauche {
width: 950px;
padding: 40px 20px 40px 0;
margin: 0 auto;
}
#contener #main #accroche #gauche h2 {
color: #fc4242;
font-size: 26px;
font-family: 'contb';
}
#contener #main #accroche #gauche span {
font-family: 'contm';
font-size: 15px;
margin-bottom: 10px;
display: block;
}
#contener #main #accroche #gauche a { text-decoration: none; color: #fc4242; }
#contener #main #accroche #droite {
background-color: #fafafa;
width: 190px;
float: left;
padding: 40px 20px 123px 20px;
}
#contener #main #accroche #droite h2 {
color: #fc4242;
font-size: 25px;
font-family: 'contl';
font-weight: normal;
margin-bottom: 35px;
}
#contener #main #accroche #droite p.telFixe {
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/picto-home.png) no-repeat 0 0;
padding: 2px 0 2px 30px;
margin: 15px 0 10px 0;
font-size: 13px;
height: 18px;
}
#contener #main #accroche #droite p.telPort {
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/picto-home.png) no-repeat 0 -22px;
padding: 2px 0 2px 30px;
margin-bottom: 10px;
font-size: 13px;
height: 18px;
}
#contener #main #accroche #droite p.mail {
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/picto-home.png) no-repeat 0 -44px;
padding: 2px 0 2px 30px;
margin-bottom: 10px;
font-size: 13px;
height: 18px;
}
#contener #main #prestation {
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/back-code.jpg) no-repeat left top;
padding: 30px 0;
background-size: cover;
}
#contener #main #prestation .content {
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/barre-lien.png) no-repeat 104px 63px;
}
#contener #main #prestation h2 {
color: #fc4242;
font-size: 47.6px;
font-family: 'contl';
text-transform: uppercase;
font-weight: normal;
text-align: center;
margin-bottom: 90px;
}
#contener #main #prestation .bloc-presta {
position: relative;
width: 210px;
height: 200px;
float: left;
margin-right: 22px;
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
-moz-box-shadow: 0px 0px 5px 2px #c0c0c0;
-webkit-box-shadow: 0px 0px 5px 2px #c0c0c0;
-o-box-shadow: 0px 0px 5px 2px #c0c0c0;
box-shadow: 0px 0px 5px 2px #c0c0c0;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=NaN, Strength=5);
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/bloc-presta.jpg) no-repeat left top;
color: #d9dadb;
padding: 45px 5px 0 5px;
text-align: center;
}
#contener #main #prestation .bloc-presta img {
position: absolute;
left: 81px;
top: -30px;
}
#contener #main #prestation .bloc-presta.last { margin-right: 0; }
#contener #main #prestation .bloc-presta h3 {
color: #fc4242;
font-size: 26px;
font-family: 'contm';
text-transform: uppercase;
text-align: center;
margin-bottom: 25px;
padding: 0;
}
#contener #main #prestation .bloc-presta a {
color: #fff;
font-size: 17px;
font-family: 'contm';
display: block;
text-transform: uppercase;
text-decoration: none;
background-color: #fc4242;
-webkit-border-bottom-right-radius: 7px;
-webkit-border-bottom-left-radius: 7px;
-moz-border-radius-bottomright: 7px;
-moz-border-radius-bottomleft: 7px;
border-bottom-right-radius: 7px;
border-bottom-left-radius: 7px;
position: absolute;
left: 0;
bottom: 0;
height: 32px;
width: 100%;
padding: 10px 0 0 0;
}
#contener #main #prestation .bloc-presta a:hover { background-color: #001b3b; }
#contener #main #clients { padding-bottom: 30px; }
#contener #main #clients .titre_trait { margin-top: 30px; }
#contener #main #clients img { margin-right: 43px; }
#contener #main #temoignages { 
padding: 1px 0;
background: #e4e4e6;
}
#contener #main #temoignages .titre_trait { margin: 20px 0; }
#contener #main #temoignages .slide-temoignage {
position: relative;
overflow: hidden;
}
#contener #main #contact {
background-color: #fafafa;
width: 100%;
padding: 40px 0;
text-align: center;
box-shadow: inset 0px 20px 20px -20px #525252;
}
#contener #main #contact h2 {
color: #fc4242;
font-size: 45px;
font-family: 'contm';
font-weight: normal;
margin-bottom: 20px;
}
#contener #main  #contact p {
color: #000;
font-family: 'contm';
font-size: 25px;
} #contener #main.page-default a { color: #fc4242; text-decoration: none; }
#contener #main.page-default a:hover { text-decoration: underline; }
#contener #main.page-default h2 { font-family: 'contm'; font-size: 26px; color: #fc4242; margin: 15px 0; }
#contener #main.page-default p { margin: 15px 0; }
#contener #main .header-page {
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/back-code.jpg) no-repeat left top;
height: 60px;
padding: 20px 0;
background-size: cover;
}
#contener #main .header-page h1, .page-annexe h1 {
font-family: 'contm' !important;
font-size: 47.6px;
color: #fff !important;
text-align: center;
}
#contener #main.partenaire .content { width: 850px; padding: 40px 0; }
#contener #main.partenaire  .bloc-partenaire {
width: 390px;
height: 200px;
float: left;
text-align: justify;
margin: 30px 30px 30px 0;
}	
#contener #main.partenaire .bloc-partenaire img {
margin-right: 10px;
float: left;
}
#contener #main.partenaire .bloc-partenaire h2 {
color: #fc4242;
text-transform: uppercase;
font-size: 17px;
font-family: 'contm';
margin-bottom: 10px;
}
#contener #main.partenaire .bloc-partenaire a {
color: #fc4242;
} #contener #main .pack {
width: 305px;
float: left;
margin-right: 17px;
margin-bottom: 20px;
}
#contener #main .pack.last { margin-right: 0; }
#contener #main .pack h3 {
color: #fff;
font-size: 31.6px;
font-family: 'contm';
background-color: #fc4242;
padding: 3px 0 4px 0;
text-align: center;
margin-bottom: 17px;
}
#contener #main .pack p { 
margin-top: 10px; 
font-size: 28px;
font-family: 'contl';
color: #fc4242;
}
#contener #main .pack p span, #contener #main .pack p sup { font-family: 'contm'; } 
#contener #main .pack ul { 
list-style: none;
border: 1px solid #dddedf;
margin-top: 20px;
-moz-box-shadow: 0px 5px 20px 0px #c0c0c0;
-webkit-box-shadow: 0px 5px 20px 0px #c0c0c0;
-o-box-shadow: 0px 5px 20px 0px #c0c0c0;
box-shadow: 0px 5px 20px 0px #c0c0c0;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=180, Strength=20);
}
#contener #main .pack ul li { 
padding: 10px 0 10px 50px;
font-size: 19px;
font-family: 'contm';
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/liste.png) no-repeat 10px center #fff;
}
#contener #main .pack ul li:nth-child(odd) { background-color: #eceded; }
#contener #main .pack ul li.fonce { background-color: #eceded; }
#contener #main .pack a { 
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/lien-visite.png) no-repeat;
display: block;
height: 34px;
width: 124px;
color: #fff;
font-family: 'contm';
font-size: 20.6px;
text-decoration: none;
padding: 2px 0 5px 47px;
margin: 25px 0;
float: right;
}
#contener #main .pack a:hover { background-position: 0 -41px; }
#contener #main.page-pack .pack-content { text-align: justify; }
#contener #main.page-pack .pack-content img {
float: left;
margin: 0 40px 20px 0;
}
#contener #main.page-pack .pack-content h2.titre_trait { font-size: 29px; font-family: 'contl'; }
#contener #main.page-pack .pack-content h2 {
color: #fc4242;
font-size: 21px;
font-family: 'contb';
margin-top: 10px;
}
#contener #main.page-pack .pack-content h3 {
color: #fc4242;
font-size: 18px;
font-family: 'contb';
margin-top: 10px;
}
#contener #main.page-pack .pack-content p#tarif { 
color: #fc4242; 
font-size: 26px;
font-family: 'contl';
margin-top: 25px;
}
#contener #main.page-pack .pack-content p#tarif span { font-family: 'contm'; }
#contener #main.page-pack .pack-content #inclus {
float: left;
width: 445px;
border-right: 1px solid #000;
padding-right: 30px;
margin: 25px 30px 0 0;
}
#contener #main.page-pack .pack-content #options {
float: left;
width: 444px;
margin-top: 25px;
}
#contener #main.page-pack .pack-content #inclus h4, 
#contener #main.page-pack .pack-content #options h4 { 
font-family: 'contb'; 
color: #fc4242; 
font-size: 26px;
margin-bottom: 15px;
}
#contener #main.page-pack .pack-content #inclus ul,
#contener #main.page-pack .pack-content #options ul { 
list-style: none;
}
#contener #main.page-pack .pack-content #inclus ul li { 
height: 38px;
padding: 7px 0 0 50px;
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/liste.png) no-repeat 10px center #fff;
}
#contener #main.page-pack .pack-content #options ul li { 
height: 38px;
padding: 7px 0 0 50px;
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/option.png) no-repeat 10px center #fff;
}
#contener #main.page-pack .pack-content .separ { 
width: 100%;
height: 1px;
background-color: #000;
margin: 50px 0 30px 0;
}
#contener #main.page-pack .pack-content a { 
color: #fc4242;
text-decoration: none;
font-weight: bold;
}
#contener #main.page-pack .pack-content a:hover { text-decoration: underline; }
#contener #main.page-pack .pack-content a.devis { 
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/lien-devis.png) no-repeat;
display: block;
height: 34px;
width: 193px;
color: #fff;
font-family: 'contm';
font-size: 20.6px;
text-decoration: none;
padding: 2px 0 5px 47px;
margin: 0 0 30px 0;
float: right;
}
#contener #main.page-pack .pack-content a:hover { background-position: 0 -41px; } #contener #main.page-presentation #gauche {
float: left;
margin: 25px 15px 15px 0;
}
#contener #main.page-presentation #droite {
margin: 25px 0 0 0;
width: 485px;
float: left;
text-align: justify;
}
#contener #main.page-presentation #droite h2 {
font-family: 'contm';
font-size: 17px;
color: #fc4242;
margin-bottom: 10px;
}
#contener #main.page-presentation .bloc_raison {
float: left;
width: 200px;
text-align: justify;
margin: 0 50px 50px 0;
}
#contener #main.page-presentation .bloc_raison.last { margin-right: 0; }
#contener #main.page-presentation .bloc_raison h4 {
padding: 5px 0 10px 40px;
font-size: 17px;
font-family: 'contb';
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/liste.png) no-repeat 0 center #fff;
margin-bottom: 5px;
}
#contener #main.page-presentation .demande {
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/lien-devis.png) no-repeat;
display: block;
height: 34px;
width: 193px;
color: #fff;
font-family: 'contm';
font-size: 20.6px;
text-decoration: none;
padding: 2px 0 5px 47px;
line-height: 26px;
margin: 0 auto 50px auto;
position: relative;
}
#contener #main.page-presentation .demande:hover { background-position: 0 -41px; }  #contener #main.rea #filtre { background-color: #fff; padding: 20px 0; margin-bottom: 20px; }
#contener #main.rea #filtre { background-color: #fafafa; padding: 30px 0; }
#contener #main.rea #filtre ul { list-style: none; text-align: center; margin: 0 auto; }
#contener #main.rea #filtre li { display: inline; margin-right: 25px; }
#contener #main.rea #filtre li.current-cat a { background-position: 0 -22px; }
#contener #main.rea #filtre a {
font-family: 'contl';
font-size: 26px; 
color: #fc4242;
text-decoration: none;
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/filtre.png) no-repeat 0 0;
padding: 0 0 0px 30px;
display: inline-block;
height: 22px;
line-height: 19px;
}
#contener #main.rea .project li {
line-height: 0;
position: relative;
width: 400px;
height: 275px;
overflow: hidden;
display: inline-block;
margin: 20px 20px 20px 0;
list-style: none;
}
#contener #main.rea .project li.last { margin-right: 0; }
#contener #main.rea .project li > a { position: absolute;
width: 100%;
height: 100%;
display: block;
z-index: 50;
}
#contener #main.rea .project li img {
z-index: 1;
width: 100%;
height: auto;
transition: transform .9s;
}
#contener #main.rea .project li a:hover { }
#contener #main.rea .project li:hover img { 
filter: grayscale(100%);
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
-ms-transform: scale(1.5); -webkit-transform: scale(1.5); transform: scale(1.5);
}
#contener #main.rea .project li .nameCat{ position: absolute;
background: rgba(0, 0, 0, 0.60);
top: 0;
left: 0;
width: 100%;
height: 100%;
text-align: center;
z-index: 0;
display: none;
}
#contener #main.rea .project li .nameCat a {
font-size: 26px;
color: #fff;
font-family: 'contm';
text-decoration: none;
position: absolute;
text-align: center;
left: 0;
right: 0;
top: 50%;
-webkit-transition: all .3s;
-moz-transition: all .3s;
-o-transition: all .3s;
-ms-transition: all .3s;
transition: all .3s;
opacity: .9;
} 
#contener #main.rea .project li .nameCat span { position: absolute; top: 63%; left: 0; right: 0; color: #fff; }
#contener #main.rea .project li:hover .nameCat { 
display: block;
z-index: 5;
}
#contener #main.rea  h3 {
font-family: 'contb';
color: #fc4242;
font-size: 26px;
margin-bottom: 15px;
}
#contener #main.rea .sp-slides {
position: relative;
float: left;
width: 626px;
margin-right: 19px;
}
#contener #main.rea .sp-slides li {
line-height: 0;
position: relative;
width: 578px;
overflow: hidden;
display: inline-block;
list-style: none;
padding: 24px;
height: 712px;
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/tablette.png) no-repeat left top;
}
#contener #main.rea .project li.last { margin-right: 0; }
#contener #main.rea .slider { margin-bottom: 20px; }
#contener #main.rea .sp-slides li a { 
position: absolute;
bottom: 11px;
right: 20px;
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/lien-visite.png) no-repeat;
display: block;
height: 34px;
width: 124px;
color: #fff;
font-family: 'contm';
font-size: 20.6px;
text-decoration: none;
padding: 2px 0 5px 47px;
line-height: 26px;
}
#contener #main.rea .sp-slides li a:hover { background-position: 0 -41px; }
#contener #main.rea .sp-thumb {
width: 305px;
float: left;
}
#contener #main.rea .sp-thumb li {
list-style: none;
margin-bottom: 20px;
position: relative;
height: 210px;
overflow: hidden;
}
#contener #main.rea .sp-thumb li img {
top: 9px;
left: 9px;
position: relative;
}
#contener #main.rea .sp-thumb li .cadre { 
border: 6px solid #000;
border-radius: 10px;
box-sizing: border-box;
position: absolute;
width: 100%;
height: 100%;
display: block;
z-index: 50;
cursor: pointer;
}
#contener #main.rea .sp-thumb li .cadre.selected, #contener #main.rea .sp-thumb li .cadre:hover { border: 6px solid #e5432c; }
#contener #main.rea .sp-thumb li:hover img, #contener #main.rea .sp-thumb li img.selected { 
filter: grayscale(100%);
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
}
#contener #main.rea .detail { margin-bottom: 20px; }
#contener #main.rea .detail p { margin-bottom: 10px; }
#contener #main.rea .detail h2 { font-family: 'contb'; color: #fc4242; font-size: 26px; margin-bottom: 10px; }
#contener #main.rea .detail h3 { font-family: 'contb'; color: #fc4242; font-size: 18px; margin-bottom: 10px; }
#contener #main.rea .detail ul li {
list-style: none;
height: 28px;
padding: 3px 0 0 45px;
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/liste-small.png) no-repeat left center;
margin-bottom: 5px;
}
#contener #contact .demande {
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/lien-devis.png) no-repeat;
display: block;
height: 34px;
width: 193px;
color: #fff !important;
font-family: 'contm';
font-size: 20.6px;
text-decoration: none;
padding: 2px 0 5px 47px;
line-height: 26px;
margin: 25px auto 0 auto;
}
#contener #main.rea .demande:hover { background-position: 0 -41px; }
#contener #main.rea .bandeau { height: 350px; position: relative; text-align: center; }
#contener #main.rea .bandeau .noir { position: absolute; width: 100%; height: 100%; background: oklch(0 0 0 / 0.5); }
#contener #main.rea .bandeau .noir h2 { color: #fff; padding-top: 9%; padding-bottom: 0%; font-family: 'contb'; font-size: 43px; } #contener #main.page-contact #gauche {
width: 380px;
float: left;
margin: 0 20px 0 70px;
font-family: 'contm';
}
#contener #main.page-contact #gauche h2 {
color: #fc4242;
font-size: 26px;
font-family: 'contl';
font-weight: normal;
margin-bottom: 10px;
}
#contener #main.page-contact #gauche h3 {
color: #fc4242;
font-size: 26px;
font-family: 'contm';
margin-bottom: 10px;
font-weight: normal;
}
#contener #main.page-contact #gauche p { margin-bottom: 5px; }
#contener #main.page-contact #gauche .mail { color: #fc4242; }
#contener #main.page-contact #droite {
width: 410px;
float: left;
}
#contener #main.page-contact #droite input[type=text] {
color: #000;
padding-left: 10px;
margin: 0 20px 20px 0;
width: 181px;
height: 30px;
border: 1px solid #ededee;
background-color: #eee;
outline: none;
float: left;
}
#contener #main.page-contact #droite input[type=text].long { width: 397px; }
#contener #main.page-contact #droite input[type=text]#bot { display: none; }
#contener #main.page-contact #droite input[type=text]:focus, #contener #main.page-contact #droite textarea:focus { border: 1px solid #3A84DF; }
#contener #main.page-contact #droite input[type=text].error, #contener #main.page-contact #droite textarea.error { border: 1px solid #fc4242 !important; }
#contener #main.page-contact #droite textarea {
border: 1px solid #ededee;
outline: none;
width: 387px;
padding: 10px;
margin: 0 0 20px 0;
border: 1px solid #ededee;
background-color: #eee;
height: 100px;
}
#contener #main.page-contact #droite input[type=submit] {
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/lien-visite.png) no-repeat;
height: 41px;
width: 171px;
color: #fff;
font-family: 'contm';
font-size: 20.6px;
border: none;
padding: 2px 0 12px 30px;
outline: none;
cursor: pointer;
}
#contener #main.page-contact #droite input[type=submit]:hover { background-position: 0 -41px; }
#contener #main.page-contact #droite p.text-succes {
display: none;
font-family: 'contm';
color: #fc4242;
font-size: 16px;
margin-top: 5px;
}
#contener #main.page-contact #droite p.text-error {
font-family: 'contm';
color: #fc4242;
font-size: 16px;
margin-top: 5px;
}
#contener #main.page-contact iframe { margin: 30px 0 0 0; } #contener #main.plan ul {	margin-left: 15px; }
#contener #main.plan ul li a { color: #fc4242; font-weight: bold; font-size: 16px; text-decoration: none; margin-bottom: 10px; display: block; }
#contener #main.plan ul li a:hover { text-decoration: underline; }
#contener #main.plan ul li ul { margin-left: 30px; }
#contener #main.plan ul li ul li a { font-size: 14px; } #contener #main.page-annexe a { color: #fc4242; text-decoration: none; }
#contener #main.page-annexe a:hover { text-decoration: underline; }
#contener #main.page-annexe h2 {
margin: 15px 0;
font-size: 24px;
font-weight: normal;
font-family: 'contm';
color: #fc4242;
}
#contener #main.page-annexe h3 {
margin: 0 0 15px 0;
font-size: 20px;
font-family: 'contm';
}
#contener #main.page-annexe .flip {
height: 285px;
width: 300px;
text-align: center;
float: left;
margin-right: 23px;
margin-bottom: 23px;
}
#contener #main.page-annexe .flip .front {
background-color: #fc4242;
}
#contener #main.page-annexe .flip .front img { margin-top: 75px; }
#contener #main.page-annexe .flip .front h2 {
margin-top: 25px;
text-transform: uppercase;
font-size: 24px;
font-weight: normal;
font-family: 'contm';
color: #000;
}
#contener #main.page-annexe .flip .back {
background: #001b3b;
color: #fff;
text-align: center;
}
#contener #main.page-annexe .flip .back h3 {
margin: 50px 0 30px 0;
font-family: 'contm';
font-size: 24px;
font-weight: normal;
}
#contener #main.page-annexe .flip .back p {
width: 280px;
margin-left: 10px;
} #footer {
background-color: #2e2d30;
height: 135px;
padding-top: 25px;
color: #fff;
}
#footer ul {
list-style: none;
float: left;
font-family: 'contm';
margin-right: 15px;
border-right: 1px solid #585759;
padding-right: 84px;
height: 115px;
}
#footer ul.first { width: 230px; }
#footer ul.coord { font-size: 13px; }
#footer ul.last { margin-right: 0; padding-right: 0; border-right: 0; }
#footer ul li a {
text-decoration: none;
color: #fff;
text-transform: uppercase;
margin-bottom: 10px;
display: block;
}
#footer ul li a:hover { color: #fc4242; }
#footer ul li.telFixe {
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/picto.png) no-repeat 0 0;
padding: 2px 0 2px 30px;
font-size: 13px;
height: 18px;
margin-bottom: 5px;
}
#footer ul li.telPort {
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/picto.png) no-repeat 0 -22px;
padding: 2px 0 2px 30px;
font-size: 13px;
height: 18px;
margin-bottom: 5px;
}
#footer ul li.mail {
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/picto.png) no-repeat 0 -44px;
padding: 2px 0 2px 30px;
font-size: 13px;
height: 18px;
margin-bottom: 5px;
}
#footer ul li.adresse {
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/picto.png) no-repeat 0 -66px;
padding: 0 0 0 30px;
font-size: 13px;
} .blueberry { position: relative; }
.blueberry .slides {
display: block;
position: relative;
overflow: hidden;
width: 1025px;
}
.blueberry .slides li {
position: absolute;
top: 0;
left: 0;
overflow: hidden;
}
.blueberry .slides li img { width: 1017px; }
.blueberry .slides li.active { display: block; position: relative; }
.blueberry .crop li img { width: auto; }
.blueberry .slides .accroche1 {
position: absolute;
top: 110px;
left: 670px;
color: #fc4242;
font-size: 33px;
font-family: 'contm';
}
.blueberry .slides .accroche2 {
position: absolute;
top: 150px;
left: 670px;
color: #812228;
font-size: 27px;
font-family: 'contm';
}
.blueberry.crea .pager {
display: none;
}
.blueberry .pager {
position: absolute;
bottom: 40px;
left: 470px;
height: 19px;
text-align: center;
}
.blueberry .pager li { display: inline-block; margin-left: 15px; }
.blueberry .pager li a,
.blueberry .pager li a span {
display: block;
height: 4px;
width: 4px;
}
.blueberry .pager li a {
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/sprite.png) no-repeat 0 -348px;
width: 19px;
height: 19px;
}
.blueberry .pager li.active a {
background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/sprite.png) no-repeat 0 -367px;
width: 19px;
height: 19px;
} .slide-wrapper {
margin: 20px auto;
position: relative;
width: 550px;
}
.slide-wrapper .photo-credits a {
color: #fff;
} .slide-temoi {
width: 20000em;
position: relative;
list-style: none;
margin: 0;
padding: 0;
}
.slide-temoi ul {
width: 20000em;
position: relative;
list-style: none;
margin: 0;
padding: 0;
}
.slide-temoi li {
float: left;
text-align: center;
}
.slide-temoi li img { margin-bottom: 10px; }
.slide-temoi li p {
max-width: 515px;
text-align: justify;
background-image: url(//maritime-agency.fr/wp-content/themes/portfolio/images/right-quote.png),url(//maritime-agency.fr/wp-content/themes/portfolio/images/left-quote.png);
background-position: right bottom,left top;
background-repeat: no-repeat;
padding: 10px 45px 0;
}
.slide-temoi li p.nom-client {
font-family: 'contm';
margin-top: 5px;
background: none;
} .jcarousel-control-prev,
.jcarousel-control-next {
position: absolute;
top: 110px;
width: 30px;
height: 30px;
cursor: pointer;
}
.jcarousel-control-prev { left: -80px; background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/sprite.png) no-repeat 0 -228px; }
.jcarousel-control-next { right: -80px; background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/sprite.png) no-repeat 0-288px; }
.jcarousel-control-prev:hover { background-position: 0 -258px; }
.jcarousel-control-next:hover  { background-position: 0 -318px; } .slide-temoi-pagination {
position: absolute;
bottom: 0;
left: 15px;
}
.slide-temoi-pagination a {
text-decoration: none;
display: inline-block;
font-size: 11px;
line-height: 14px;
min-width: 14px;
background: #fff;
color: #4E443C;
border-radius: 14px;
padding: 3px;
text-align: center;
margin-right: 2px;
opacity: .75;
}
.slide-temoi-pagination a.active {
background: #4E443C;
color: #fff;
opacity: 1;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.75);
} .sl-slider-wrapper {
width: 800px;
height: 400px;
margin: 0 auto;
position: relative;
overflow: hidden;
}
.sl-slider {
position: absolute;
top: 0;
left: 0;
} .sl-slide,
.sl-slides-wrapper,
.sl-slide-inner {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
} 
.sl-slide-inner .caption {
position: absolute;
left: -10px;
bottom: 75px;
width: 110%;
background: rgba(229, 67, 44, 0.8);
-ms-transform: rotate(-8deg);
-webkit-transform: rotate(-8deg);
transform: rotate(-8deg);
text-align: center;
padding: 20px;
font-family: 'contm';
color: #fff;
}
.sl-slide {
z-index: 1;
} .sl-content-slice {
overflow: hidden;
position: absolute;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
background: #fff;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-o-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden;
opacity : 1;
} .sl-slide-horizontal .sl-content-slice {
width: 100%;
height: 50%;
left: -200px;
-webkit-transform: translateY(0%) scale(1);
-moz-transform: translateY(0%) scale(1);
-o-transform: translateY(0%) scale(1);
-ms-transform: translateY(0%) scale(1);
transform: translateY(0%) scale(1);
}
.sl-slide-horizontal .sl-content-slice:first-child {
top: -200px;
padding: 200px 200px 0px 200px;
}
.sl-slide-horizontal .sl-content-slice:nth-child(2) {
top: 50%;
padding: 0px 200px 200px 200px;
} .sl-slide-vertical .sl-content-slice {
width: 50%;
height: 100%;
top: -200px;
-webkit-transform: translateX(0%) scale(1);
-moz-transform: translateX(0%) scale(1);
-o-transform: translateX(0%) scale(1);
-ms-transform: translateX(0%) scale(1);
transform: translateX(0%) scale(1);
}
.sl-slide-vertical .sl-content-slice:first-child {
left: -200px;
padding: 200px 0px 200px 200px;
}
.sl-slide-vertical .sl-content-slice:nth-child(2) {
left: 50%;
padding: 200px 200px 200px 0px;
}  .sl-content-wrapper {
position: absolute;
}
.sl-content {
width: 100%;
height: 100%;
background: #fff;
} .sl-slide-horizontal .sl-slide-inner {
background: #ddd;
}
.sl-slide-vertical .sl-slide-inner {
background: #ccc;
}
.demo-1 .sl-slider-wrapper {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.sl-slider-wrapper {
width: 100%;
height: 600px;
overflow: hidden;
position: relative;
}
.sl-slider h2 {
font-size: 50px;
text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
}
.sl-slider blockquote {
font-size: 24px;
padding-top: 10px;
font-weight: 300;
text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
}
.sl-slider blockquote cite {
font-size: 16px;
font-weight: 700;
font-style: normal;
text-transform: uppercase;
letter-spacing: 5px;
padding-top: 30px;
display: inline-block;
}
.bg-img {
padding: 200px;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
position: absolute;
top: -200px;
left: -200px;
width: 100%;
height: 100%;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
background-position: center center;
} .nav-arrows span {
position: absolute;
z-index: 2000;
top: 50%;
width: 40px;
height: 40px;
border: 8px solid #ddd;
border: 8px solid rgba(150,150,150,0.4);
text-indent: -90000px;
margin-top: -40px;
cursor: pointer;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.nav-arrows span:hover {
border-color: rgba(150,150,150,0.9);
}
.nav-arrows span.nav-arrow-prev {
left: 5%;
border-right: none;
border-top: none;
}
.nav-arrows span.nav-arrow-next {
right: 5%;
border-left: none;
border-bottom: none;
} .nav-dots {
text-align: center;
position: absolute;
bottom: 2%;
height: 30px;
width: 100%;
left: 0;
z-index: 1000;
}
.nav-dots span {
display: inline-block;
position: relative;
width: 16px;
height: 16px;
border-radius: 50%;
margin: 3px;
background: #ddd;
background: rgba(150,150,150,0.4);
cursor: pointer;
box-shadow: 
0 1px 1px rgba(255,255,255,0.4), 
inset 0 1px 1px rgba(0,0,0,0.1);
}
.nav-dots span {
background: rgba(150,150,150,0.1);
margin: 6px;
-webkit-transition: all 0.2s;
-moz-transition: all 0.2s;
-ms-transition: all 0.2s;
-o-transition: all 0.2s;
transition: all 0.2s;
box-shadow: 
0 1px 1px rgba(255,255,255,0.4), 
inset 0 1px 1px rgba(0,0,0,0.1),
0 0 0 2px rgba(255,255,255,0.5);
}
.nav-dots span.nav-dot-current,
.nav-dots span:hover {
box-shadow: 
0 1px 1px rgba(255,255,255,0.4), 
inset 0 1px 1px rgba(0,0,0,0.1),
0 0 0 5px rgba(255,255,255,0.5);
}
.nav-dots span.nav-dot-current:after {
content: "";
position: absolute;
width: 10px;
height: 10px;
top: 3px;
left: 3px;
border-radius: 50%;
background: rgba(255,255,255,0.8);
} .demo-1 .deco {
width: 260px;
height: 260px;
border: 2px dashed #ddd;
border: 2px dashed rgba(150,150,150,0.4);
border-radius: 50%;
position: absolute;
bottom: 50%;
left: 50%;
margin: 0 0 0 -130px;
}
.demo-1 [data-icon]:after {
content: attr(data-icon);
font-family: 'AnimalsNormal';
color: #999;
text-shadow: 0 0 1px #999;
position: absolute;
width: 220px;
height: 220px;
line-height: 220px;
text-align: center;
font-size: 100px;
top: 50%;
left: 50%;
margin: -110px 0 0 -110px;
box-shadow: inset 0 0 0 10px #f7f7f7;
border-radius: 50%;
}
.demo-1 .sl-slide h2 {
color: #000;
text-shadow: 0 0 1px #000;
padding: 20px;
position: absolute;
font-size: 34px;
font-weight: 700;
letter-spacing: 13px;
text-transform: uppercase;
width: 80%;
left: 10%;
text-align: center;
line-height: 50px;
bottom: 50%;
margin: 0 0 -120px 0;
}
.demo-1 .sl-slide blockquote {
position: absolute;
width: 100%;
text-align: center;
left: 0;
font-weight: 400;
font-size: 14px;
line-height: 20px;
height: 70px;
color: #8b8b8b;
z-index: 2;
bottom: 50%;
margin: 0 0 -200px 0;
padding: 0;
}
.demo-1 .sl-slide blockquote p{
margin: 0 auto;
width: 60%;
max-width: 400px;
position: relative;
}
.demo-1 .sl-slide blockquote p:before {
color: #f0f0f0;
color: rgba(244,244,244,0.65);
font-family: "Bookman Old Style", Bookman, Garamond, serif;
position: absolute;
line-height: 60px;
width: 75px;
height: 75px;
font-size: 200px;
z-index: -1;
left: -80px;
top: 35px;
content: '\201C';
}
.demo-1 .sl-slide blockquote cite {
font-size: 10px;
padding-top: 10px;
display: inline-block;
font-style: normal;
text-transform: uppercase;
letter-spacing: 4px;
}  .demo-1 .bg-1 .sl-slide-inner,
.demo-1 .bg-1 .sl-content-slice {
background: #fff;
} .demo-1 .bg-2 .sl-slide-inner,
.demo-1 .bg-2 .sl-content-slice {
background: #000;
}
.demo-1 .bg-2 [data-icon]:after,
.demo-1 .bg-2 h2 {
color: #fff;
}
.demo-1 .bg-2 blockquote:before {
color: #222;
} .demo-1 .bg-3 .sl-slide-inner,
.demo-1 .bg-3 .sl-content-slice {
background: #db84ad;
}
.demo-1 .bg-3 .deco {
border-color: #fff;
border-color: rgba(255,255,255,0.5);
}
.demo-1 .bg-3 [data-icon]:after {
color: #fff;
text-shadow: 0 0 1px #fff;
box-shadow: inset 0 0 0 10px #b55381;
}
.demo-1 .bg-3 h2,
.demo-1 .bg-3 blockquote{
color: #fff;
text-shadow: 0px 1px 1px rgba(0,0,0,0.3);
}
.demo-1 .bg-3 blockquote:before {
color: #c46c96;
} .demo-1 .bg-4 .sl-slide-inner,
.demo-1 .bg-4 .sl-content-slice {
background: #5bc2ce;
}
.demo-1 .bg-4 .deco {
border-color: #379eaa;
}
.demo-1 .bg-4 [data-icon]:after {
text-shadow: 0 0 1px #277d87;
color: #277d87;
}
.demo-1 .bg-4 h2,
.demo-1 .bg-4 blockquote{
color: #fff;
text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
}
.demo-1 .bg-4 blockquote:before {
color: #379eaa;
} .demo-1 .bg-5 .sl-slide-inner,
.demo-1 .bg-5 .sl-content-slice {
background: #ffeb41;
}
.demo-1 .bg-5 .deco {
border-color: #ECD82C;
}
.demo-1 .bg-5 .deco:after {
color: #000;
text-shadow: 0 0 1px #000;
}
.demo-1 .bg-5 h2,
.demo-1 .bg-5 blockquote{
color: #000;
text-shadow: 1px 1px 1px rgba(0,0,0,0.1);
}
.demo-1 .bg-5 blockquote:before {
color: #ecd82c;
}
.bg-img-1 {
background-image: url(//maritime-agency.fr/wp-content/themes/portfolio/images/1.webp);
}
.bg-img-2 {
background-image: url(//maritime-agency.fr/wp-content/themes/portfolio/images/2.webp);
}
.bg-img-3 {
background-image: url(//maritime-agency.fr/wp-content/themes/portfolio/images/3.jpg);
}
.bg-img-4 {
background-image: url(//maritime-agency.fr/wp-content/themes/portfolio/images/4.webp);
} .sl-trans-elems .deco{
-webkit-animation: roll 1s ease-out both, fadeIn 1s ease-out both;
-moz-animation: roll 1s ease-out both, fadeIn 1s ease-out both;
-o-animation: roll 1s ease-out both, fadeIn 1s ease-out both;
-ms-animation: roll 1s ease-out both, fadeIn 1s ease-out both;
animation: roll 1s ease-out both, fadeIn 1s ease-out both;
}
.sl-trans-elems h2{
-webkit-animation: moveUp 1s ease-in-out both;
-moz-animation: moveUp 1s ease-in-out both;
-o-animation: moveUp 1s ease-in-out both;
-ms-animation: moveUp 1s ease-in-out both;
animation: moveUp 1s ease-in-out both;
}
.sl-trans-elems blockquote{
-webkit-animation: fadeIn 0.5s linear 0.5s both;
-moz-animation: fadeIn 0.5s linear 0.5s both;
-o-animation: fadeIn 0.5s linear 0.5s both;
-ms-animation: fadeIn 0.5s linear 0.5s both;
animation: fadeIn 0.5s linear 0.5s both;
}
.sl-trans-back-elems .deco{
-webkit-animation: scaleDown 1s ease-in-out both;
-moz-animation: scaleDown 1s ease-in-out both;
-o-animation: scaleDown 1s ease-in-out both;
-ms-animation: scaleDown 1s ease-in-out both;
animation: scaleDown 1s ease-in-out both;
}
.sl-trans-back-elems h2{
-webkit-animation: fadeOut 1s ease-in-out both;
-moz-animation: fadeOut 1s ease-in-out both;
-o-animation: fadeOut 1s ease-in-out both;
-ms-animation: fadeOut 1s ease-in-out both;
animation: fadeOut 1s ease-in-out both;
}
.sl-trans-back-elems blockquote{
-webkit-animation: fadeOut 1s linear both;
-moz-animation: fadeOut 1s linear both;
-o-animation: fadeOut 1s linear both;
-ms-animation: fadeOut 1s linear both;
animation: fadeOut 1s linear both;
}
@-webkit-keyframes roll{
0% {-webkit-transform: translateX(500px) rotate(360deg);}
100% {-webkit-transform: translateX(0px) rotate(0deg);}
}
@-moz-keyframes roll{
0% {-moz-transform: translateX(500px) rotate(360deg); opacity: 0;}
100% {-moz-transform: translateX(0px) rotate(0deg); opacity: 1;}
}
@-o-keyframes roll{
0% {-o-transform: translateX(500px) rotate(360deg); opacity: 0;}
100% {-o-transform: translateX(0px) rotate(0deg); opacity: 1;}
}
@-ms-keyframes roll{
0% {-ms-transform: translateX(500px) rotate(360deg); opacity: 0;}
100% {-ms-transform: translateX(0px) rotate(0deg); opacity: 1;}
}
@keyframes roll{
0% {transform: translateX(500px) rotate(360deg); opacity: 0;}
100% {transform: translateX(0px) rotate(0deg); opacity: 1;}
}
@-webkit-keyframes moveUp{
0% {-webkit-transform: translateY(40px);}
100% {-webkit-transform: translateY(0px);}
}
@-moz-keyframes moveUp{
0% {-moz-transform: translateY(40px);}
100% {-moz-transform: translateY(0px);}
}
@-o-keyframes moveUp{
0% {-o-transform: translateY(40px);}
100% {-o-transform: translateY(0px);}
}
@-ms-keyframes moveUp{
0% {-ms-transform: translateY(40px);}
100% {-ms-transform: translateY(0px);}
}
@keyframes moveUp{
0% {transform: translateY(40px);}
100% {transform: translateY(0px);}
}
@-webkit-keyframes fadeIn{
0% {opacity: 0;}
100% {opacity: 1;}
}
@-moz-keyframes fadeIn{
0% {opacity: 0;}
100% {opacity: 1;}
}
@-o-keyframes fadeIn{
0% {opacity: 0;}
100% {opacity: 1;}
}
@-ms-keyframes fadeIn{
0% {opacity: 0;}
100% {opacity: 1;}
}
@keyframes fadeIn{
0% {opacity: 0;}
100% {opacity: 1;}
}
@-webkit-keyframes scaleDown{
0% {-webkit-transform: scale(1);}
100% {-webkit-transform: scale(0.5);}
}
@-moz-keyframes scaleDown{
0% {-moz-transform: scale(1);}
100% {-moz-transform: scale(0.5);}
}
@-o-keyframes scaleDown{
0% {-o-transform: scale(1);}
100% {-o-transform: scale(0.5);}
}
@-ms-keyframes scaleDown{
0% {-ms-transform: scale(1);}
100% {-ms-transform: scale(0.5);}
}
@keyframes scaleDown{
0% {transform: scale(1);}
100% {transform: scale(0.5);}
}
@-webkit-keyframes fadeOut{
0% {opacity: 1;}
100% {opacity: 0;}
}
@-moz-keyframes fadeOut{
0% {opacity: 1;}
100% {opacity: 0;}
}
@-o-keyframes fadeOut{
0% {opacity: 1;}
100% {opacity: 0;}
}
@-ms-keyframes fadeOut{
0% {opacity: 1;}
100% {opacity: 0;}
}
@keyframes fadeOut{
0% {opacity: 1;}
100% {opacity: 0;}
} @media screen and (max-width: 660px) {
.demo-1 .deco {
width: 130px;
height: 130px;
margin-left: -65px;
margin-bottom: 50px;
}
.demo-1 [data-icon]:after {
width: 110px;
height: 110px;
line-height: 110px;
font-size: 40px;
margin: -55px 0 0 -55px;
}
.demo-1 .sl-slide blockquote {
margin-bottom: -120px;
}
.demo-1 .sl-slide h2 {
line-height: 22px;
font-size: 18px;
margin-bottom: -40px;
letter-spacing: 8px;
}
.demo-1 .sl-slide blockquote p:before {
line-height: 10px;
width: 40px;
height: 40px;
font-size: 120px;
left: -45px;
}
.sl-slider-wrapper {
height: 500px;
}
.sl-slider h2 {
font-size: 36px;
}
.sl-slider blockquote {
font-size: 16px;
}
}   #header .content {
margin-right: auto;
margin-left: auto; }
@media (min-width: 320px) and (max-width: 550px) {
.content { width: auto; }
.ariane { width: auto; }
#header #nav { height: auto; }
#header #nav a#logo { float: none; text-align: center; margin: 0 0 10px 0; padding: 10px 0 0 0; }
#header #nav a > img { margin: 15px 0 0 30px; }
#header #nav #menu { position: relative; background-color: #2e2d30; height: 30px; margin: 0 auto; }
#header #nav #menu p { display: inline !important; color: #fff; font-size: 20px; font-family: 'contm'; float: right; margin-right: 40px; position: relative; }
#header #nav #menu div#responsive_menu_button { position: absolute; display: block; top: 0; left: 100%; height: 30px; width: 23px; margin-left: -30px; background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/select-icons.png) 0 5px no-repeat; cursor: pointer; }
#header #nav ul { display: none; position: absolute; width: 100%; height: auto; z-index: 1000; top: 30px; margin: 0 0 20px 0; }
#header #nav ul li { float: none; height: auto; background-color: #fff; border-bottom: 1px solid #D2D1D1; margin: 0; }
#header #nav ul li a { text-align: center; }
#header #nav ul.sub-menu { display: none !important; }
.titre_trait { font-size: 30px; }
#contener #main #accroche { width: auto; padding: 0 10px; margin: 0 auto; }
#contener #main #accroche #gauche { width: auto; float: none; padding: 40px 0; }
#contener #main #accroche #droite { width: auto; float: none; padding: 40px 20px; }
#contener #main #prestation .content { background: none; }
#contener #main #prestation .bloc-presta, #contener #main #prestation .bloc-presta.last { margin: 50px auto; float: none; }
#contener #main #clients .content { text-align: center; }
#contener #main #contact { padding: 40px 10px; width: auto; }
.bg-img-1 { background-image: url(//maritime-agency.fr/wp-content/themes/portfolio/images/1-mobile.webp); }
.bg-img-2 { background-image: url(//maritime-agency.fr/wp-content/themes/portfolio/images/2-mobile.webp); }
.bg-img-3 { background-image: url(//maritime-agency.fr/wp-content/themes/portfolio/images/3-mobile.jpg); }
.bg-img-4 { background-image: url(//maritime-agency.fr/wp-content/themes/portfolio/images/4-mobile.webp); }
.sl-slide-inner .caption { width: auto; transform: none; -webkit-transform: none; }
.slide-wrapper { width: 230px; }
.slide-temoi li { width: 236px; }
.jcarousel-control-prev { left: -40px; top: 170px; }
.jcarousel-control-next { right: -40px; top: 170px; }
#contener #main .header-page { height: auto; }
#contener #main .header-page h1 { font-size: 33px; }
#contener #main.page-presentation #gauche img { width: 100%; }
#contener #main.page-presentation #droite { padding: 0 10px; width: auto; float: none; }
#contener #main.page-presentation .contener .bloc_raison { width: 200px; float: none; margin: 0 auto 50px auto; }
#contener #main.page-presentation #gauche { float: none; margin: 0px 0px 15px 0; }
#contener #main .pack { margin: 0 auto 90px auto; float: none; }
#contener #main.page-pack .pack-content p#tarif { text-align: center; }
#contener #main.page-pack .pack-content #inclus h4, #contener #main.page-pack .pack-content #options h4 { text-align: center; }
#contener #main.page-pack .pack-content #inclus { border: 0; margin: 20px auto 0 auto; float: none; width: auto; }
#contener #main.page-pack .pack-content #options { margin: 20px auto 0 auto; float: none; width: auto; }
#contener #main.rea .project li { width: auto; margin: 20px auto; display: block; padding: 0 10px; box-sizing: border-box; }
#contener #main.rea .project li > a { background: none; position: relative; width: auto; height: auto;  display: block; z-index: 50; }
#contener #main.rea .project li img { position: initial; z-index: 1; width: 100%; height: auto; transition: transform .9s; }
#contener #main.rea .project li.last { margin: 20px auto; }
#contener #main.rea #filtre a { margin-bottom: 15px; }
#contener #main.rea .sp-slides { width: 300px; margin: 0 auto; float: none; }
#contener #main.rea .sp-slides li { width: 252px; height: 380px; background-size: contain; }
#contener #main.rea .sp-slides li img { max-width: 300px; width: 100%; height: auto; }
#contener #main.rea .sp-thumb { float: none; margin: 20px auto; }
#contener #main.page-contact #gauche { width: 290px; margin: 0 auto; float: none; }
#contener #main.page-contact #droite { margin: 40px auto 0 auto; float: none; width: auto; padding: 0 10px; }
#contener #main.page-contact #droite input[type=text] { margin: 0 0 20px 0; width: 95%; }
#contener #main.page-contact #droite input[type=text].long { width: 95%; }
#contener #main.page-contact #droite textarea { width: 92%; }
#footer { height: auto; padding: 25px 0; }
#footer .content { width: 300px; }
#footer ul.first { margin-left: 20px; width: auto; border: 0; }
#footer ul.first li img { margin-left: 20px; }
#footer ul.coord { margin-left: 20px; }
#footer ul { margin-right: 15px; padding-right: 25px; }
#slideshow { display: none; }
}
@media (max-width: 550px) {
#header #top { height: auto; padding-bottom: 5px; }
#header #top #email { display: block; float: none; margin: 0 0 5px 25%; }
#header #top #tel-fixe { display: block; float: none; margin: 0 0 5px 25%; }
#header #top #tel-port { display: block; float: none; margin: 0 0 5px 25%; }
}
@media (min-width: 550px) {
.content { width: 530px; }
.ariane { width: auto; }
#header #top .content  { width: auto; max-width: 930px; padding-right: 15px; }
#header #nav { height: auto; }
#header #nav #menu { width: 530px; margin: 0 auto; }
#header #nav ul { float: none; }
#header #nav a#logo { float: none; text-align: center; margin: 0 0 10px 0; padding: 10px 0 0 0; }
#contener #main #accroche { padding-left: 10px; margin: 0 auto; width: auto; }
#contener #main #accroche #gauche { width: auto; float: none; padding: 40px 0; }
#contener #main #accroche #droite { width: auto; float: none; padding: 40px 20px; }
#contener #main #prestation .content { background: none; }
#contener #main #prestation .bloc-presta { margin: 0 20px 50px 50px; }
#contener #main #clients .content { text-align: center; }
.slide-wrapper { width: 330px; }
.slide-temoi li { width: 336px; }
#contener #main .header-page { height: auto; }
#contener #main.page-presentation #gauche { margin: 25px auto 15px auto; width: 450px; float: none; }
#contener #main.page-presentation #droite { margin: 25px auto 0 auto; float: none; }
#contener #main.page-presentation .contener { width: 530px; margin: auto; }
#contener #main.page-presentation .contener .bloc_raison { width: 200px; margin: 0 0 50px 50px; }
#contener #main .pack { margin: 0 0 20px 100px; }
#contener #main.page-pack .pack-content p#tarif { text-align: center; }
#contener #main.page-pack .pack-content #inclus h4, #contener #main.page-pack .pack-content #options h4 { text-align: left; }
#contener #main.page-pack .pack-content #inclus { border: 0; margin: 20px auto 0 auto; float: none; }
#contener #main.page-pack .pack-content #options { margin: 20px auto 0 auto; float: none; }
#contener #main.rea .project li { margin: 20px auto; display: block; }
#contener #main.rea .project li.last { margin: 20px auto; }
#contener #main.rea #filtre a { margin-bottom: 15px; }
#contener #main.rea .sp-slides { width: 530px; margin-right: 0; float: none; }
#contener #main.rea .sp-slides li { width: 482px; height: 600px; background-size: contain; }
#contener #main.rea .sp-slides li img { max-width: 530px; width: 100%; height: auto; }
#contener #main.rea .sp-thumb { float: none; margin: 20px auto; }
#contener #main.page-contact #gauche { width: 290px; margin: 0 auto; float: none; }
#contener #main.page-contact #droite { margin: 40px auto 0 auto; float: none; }
#footer { height: auto; padding: 25px 0; }
#footer .content { width: 530px; }
#footer ul.first { margin-left: 20px; width: auto; border: 0; }
#footer ul.first li img { margin-left: 150px; }
#footer ul.coord { margin-left: 20px; }
#footer ul { margin-right: 15px; padding-right: 25px; }
#slideshow { display: none; }
}
@media (max-width: 768px) {
#header #nav #menu ul.sub-menu { display: none; }
}
@media (min-width: 768px) {
.content { width: 750px; }
.ariane { width: auto; }
#header .content { width: 738px; }
#header #nav a#logo { float: none; }
#header #nav ul { float: right; }
#header #nav ul li a { padding: 30px 15px; }
#contener #main #accroche { padding: 0 10px; margin: 0 auto; }
#contener #main #accroche #gauche { width: 480px; padding: 40px 20px 40px 0; }
#contener #main #accroche #droite { width: 190px; float: left; padding: 40px 20px 123px 20px; }
#contener #main #prestation .content { background: none; }
#contener #main #prestation .bloc-presta { margin: 0 20px 50px 100px; }	
.slide-wrapper { width: 550px; }
.slide-temoi li { width: 555px; }
#contener #main.page-presentation #gauche { margin: 25px auto 15px auto; width: 450px; float: none; }
#contener #main.page-presentation #droite { margin: 25px auto 0 auto; width: 750px; float: none; }
#contener #main.page-presentation .contener { width: 750px; margin: auto; }
#contener #main.page-presentation .contener .bloc_raison { width: 250px; margin: 0 0 50px 100px; }
#contener #main .pack { margin: 0 0 0 50px; }
#contener #main.page-pack .pack-content p#tarif { text-align: left; }
#contener #main.page-pack .pack-content #inclus, #contener #main.page-pack .pack-content #options { width: 340px; float: left; }
#contener #main.page-pack .pack-content #inclus { border-right: 1px solid #000; margin-right: 30px; }
#contener #main.rea .project li { margin: 20px 0 20px 35px; display: inline-block; }
#contener #main.rea .project li.last { margin: 20px 0 20px 35px; }
#contener #main.rea #filtre a { margin-bottom: 0; }
#contener #main.rea .sp-slides { float: none; margin: 0 auto; width: 625px; }
#contener #main.rea .sp-slides li { width: 578px; height: 712px; background-size: contain; }
#contener #main.rea .sp-slides li img { max-width: 530px; width: 100%; height: auto; }
#contener #main.page-contact #gauche { width: 290px; margin: 0 20px 0 20px; float: left; }
#contener #main.page-contact #droite { width: 410px; margin: 0; float: left; }
#footer { height: auto; padding: 25px 0; }
#footer .content { width: 750px; }
#footer ul.first { margin-left: 20px; width: 230px; border-right: 1px solid #5857; }
#footer ul.first li img { margin-left: 0px; }
#footer ul { margin-right: 10px; padding-right: 10px; }
#slideshow { display: none; }
}
@media (min-width: 970px) {
.content { width: 950px; }
.page-annexe .content { width: 975px; margin-top: 25px; }
.content.large { width: 1250px; }
.ariane { width: 950px; }
#header .content { width: 930px; }
#header #nav a#logo { float: left; margin: 0; }
#header #nav #menu ul li:hover ul.sub-menu, #header #nav #menu ul li ul.sub-menu:hover { display: block; }
#header #nav #menu { width: auto; }
#header #nav #menu ul.sub-menu { transition: 0.4s; width: 165px; float: none; position: absolute; display: none; z-index: 2; background: #fff; top: 79px; }
#header #nav #menu ul.sub-menu li { float: none; }
#header #nav #menu ul.sub-menu li a { padding: 15px 20px; }
#header #top .content { width: auto; max-width: 930px; }
#contener #main #accroche #gauche { width: 950px; }
#contener #main #accroche { width: 950px; padding: 0; }
#contener #main #prestation .content { background: url(//maritime-agency.fr/wp-content/themes/portfolio/images/barre-lien.png) no-repeat 104px 63px; }
#contener #main #prestation .bloc-presta { margin: 0 22px 0 0; }
#contener #main .header-page { height: 60px; }
#contener #main .elementor-widget-container .header-page { height: 100px; }
#contener #main.page-presentation .content { width: 950px; }
#contener #main.page-presentation #gauche { float: left; margin: 25px 15px 15px 0; width: auto; }
#contener #main.page-presentation #droite { margin: 25px 0 0 0; width: 485px; float: left; }
#contener #main.page-presentation .contener { width: 950px; margin: auto; }
#contener #main.page-presentation .contener .bloc_raison { width: 200px; margin: 0 50px 50px 0; }
#contener #main.page-presentation .bloc_raison.last { margin-right: 0; }
#contener #main .pack { margin: 0 17px 20px 0; }
#contener #main.page-pack .pack-content #inclus, #contener #main.page-pack .pack-content #options { width: 440px; }
#contener #main.rea .project li { margin: 0px 20px 20px 0; }
#contener #main.rea .project li.last { margin: 0px 0 20px 0; }
#contener #main.rea .sp-slides { float: left; margin: 0 19px 0 0; }
#contener #main.rea .sp-slides li img { max-width: 577px; width: 100%; height: auto; }
#contener #main.rea .sp-thumb { float: left; margin: 0; }
#contener #main.page-contact #gauche { width: 380px; margin: 0 20px 0 70px; float: left; }
#contener #main.page-contact #droite { width: 410px; margin: 0; float: left; }
#footer { height: 135px; padding-top: 25px; }
#footer .content { width: 950px; }
#footer ul.first { margin-left: 0px; }
#footer ul.coord { margin-left: 0px; }
#footer ul { margin-right: 15px; padding-right: 84px; }
#slideshow { display: block; }
}