
/**********************
 * Piwgo website font *
 **********************/

* {
    font-family: 'Open Sans', sans-serif;
    -moz-osx-font-smoothing: grayscale;
}

/*************************
 * My Bootstrap Elements *
 *************************/

/* Bootstrap 5 elements in columns - new classes */

.col-xs-15,
.col-sm-15,
.col-md-15,
.col-lg-15 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.col-xs-15 {
    width: 20%;
    float: left;
}

@media (min-width: 768px) {
.col-sm-15 {
        width: 20%;
        float: left;
    }
}

@media (min-width: 992px) {
    .col-md-15 {
        width: 20%;
        float: left;
    }
}

@media (min-width: 1200px) {
    .col-lg-15 {
        width: 20%;
        float: left;
    }
}

.popover {
    max-width: 500px;
}

.popover-title {
    color: #FF7700;
    text-align: center;
}

.bold {
    font-weight: bold;
}

.text-white {
    color: #FFFFFF;
}

.equal {
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
}

.container-fluide-shadow {
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
}

.container-orange {
    background-color: #FF7700;
    height: 5px;
}

.container-grey {
    background-color: #54616F;
    height: 5px;
}

.container-red-salmon {
    background-color: #F46755;
    height: 50px;
}

/*********************************
 * Patterns common to many pages *
 *********************************/

.btn.pwg-cta {
    margin-top: 40px;
    background-color: #ff3363;
    border: none;
    border-radius: 0;
    color:#ffffff;
    font-size:14px;
    padding: 15px 25px;
    transition: all 0.2s;
    font-weight: 700;
    text-transform: uppercase;
}

.btn.pwg-cta.btn:hover, .btn.pwg-cta:focus, .btn.pwg-cta:active {
    color:#ffffff;
    background-color: #ff3363;
    box-shadow: 0 0 6px #888;
}

h2 {
    color: #3c3c3c;
    font-size: 40px;
    font-weight: 900;
    text-align: center;
}

@media (max-width: 991px) {
    h2 {
        font-size: 25px;
        padding: 0 15px;
    }
}

@media (max-width: 767px) {
    h2 {
        text-align: left;
    }
}

p.h2-intro {
    padding: 20px 100px;
    color: #7e7e7e;
    font-weight: 700;
    font-size:16px;
    margin-bottom: 50px;
    text-align: center;
}

@media (max-width: 991px) {
    p.h2-intro {
        padding: 20px 15px;
        text-align: left;
    }
}

/*****************************
* Piwigo header (navbar) CSS *
******************************/

.language-available {
    background-color: #5593F4;
    color:white;
    padding:10px;
    text-align: center;
    font-size: 18px;
}

.language-available a {
    color:white;
}

.navbar {
  border:none;
  margin-top:20px;
}

.navbar-default {
  background-color:transparent;
}

.nav > li > a {
  text-transform:uppercase;
  font-weight: 600;
}

.navbar-brand {
    padding-top: 0;
    /* margin-top:-6px; */
}
.navbar-brand img {
    height: 50px;
}

.nav > li > a.pwg-navbar-button-demo {
  float: left;
}

.pwg-navbar-button-demo span {
    border:1px solid #ff3363;
    transition: background-color 0.2s ease-out;
    -webkit-transition: background-color 0.2s ease-out;
    -moz-transition: background-color 0.2s ease-out;
    padding:15px 25px;
}

.pwg-navbar-button .sign-up-link{
  padding-top:10px;
}

.pwg-navbar-button .sign-up-link span{
  float:right;
}

.navbar-default .navbar-nav > li > a:hover {
    color: #ff3363;
}

.navbar-default .navbar-nav > li > a.pwg-navbar-button-demo {
    color:#ff3363;
    display: inline;
}

.navbar-default .navbar-nav > li > a.pwg-navbar-button-demo:hover {
}

.navbar-default .navbar-nav > li.pwg-navbar-button-demo-list {
    border: none;
}

.pwg-navbar-button-demo span:hover {
    background-color: #ff3363;
    color:#ffffff;
}

.nav > li > a.pwg-navbar-button-get-piwigo {
}

.pwg-navbar-button-get-piwigo span {
    background-color: #ff3363;
    padding:15px 25px;
    border:1px solid #ff3363;
}
.pwg-navbar-button-get-piwigo span:hover{
  box-shadow: 0 0 6px #888;
}

.navbar-default .navbar-nav > li > a.pwg-navbar-button-get-piwigo {
    color:#ffffff;
    display: inline-block;
}

.navbar-default .navbar-nav > li > a.pwg-navbar-button-get-piwigo:hover {
}

.pwg-navbar-button-piwigo span:hover {
    background-color: #ff7700;
    color:#ffffff;
}

.navbar .glyphicon-home:before {
    font-size:12px;
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
    color: #ff7700;
    background-color: transparent;
}

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover {
    color: #ff3363;
    background-color: transparent;
}

.navbar-default .navbar-nav > li > a > span.glyphicon {
    display: none;
}

.navbar-default .navbar-nav > li > a > i.icon-puzzle {
    display: none;
}

@media (max-width: 1200px) {
    .navbar-brand img {
        height: 40px;
    }
    .nav > li > a {
        padding: 16px 8px 10px 8px;
    }
}


.navbar-default .navbar-toggle .icon-bar {
    background-color: #ff3363;
}

.navbar-default .navbar-toggle {
    background-color: #FFFFFF;
    /* border: 2px solid #FF3363; */
    border: none;
    border-radius: 0;
}

.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
    background-color: #FFFFFF;
}

.dropdown-menu {
    padding: 0 0;
}

.dropdown-menu li:focus, .dropdown-menu li:hover {
    transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    /*background-color: #FF7700;*/
}

.dropdown-menu > li > a {
    color: #777;
    padding-top: 13px;
    padding-bottom: 13px;
    font-weight: 600;
}

.dropdown-menu > li:focus > a, .dropdown-menu > li:hover > a {
    color: #ff3363;
}

.dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover {
    background-color: transparent;
}

.dropdown-menu {
    left: 50% !important;
    margin-left: -79px;
}

.dropdown-menu li {
    padding: 0px 0;
}
.dropdown-menu:before {
  position: absolute;
  top: -7px;
  left: 72px;
  display: inline-block;
  border-right: 7px solid transparent;
  border-bottom: 7px solid #ccc;
  border-left: 7px solid transparent;
  border-bottom-color: rgba(0, 0, 0, 0.2);
  content: '';
}

.dropdown-menu:after {
  position: absolute;
  top: -6px;
  left: 73px;
  display: inline-block;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #ffffff;
  border-left: 6px solid transparent;
  content: '';
}

@media (min-width: 992px) and (max-width: 1199px) {
    .navbar-brand {
        margin-top: 0px;
        padding-top: 5px;
    }
}

/* Boostrap change Navbar collapse sooner than 768px */

@media (min-width: 768px) and (max-width: 991px) {
    .navbar-nav .open .dropdown-menu {
        position: static;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: transparent;
        border: 0;
        -webkit-box-shadow: none;
                box-shadow: none;
    }
    .navbar-nav .open .dropdown-menu > li > a,
    .navbar-nav .open .dropdown-menu .dropdown-header {
        padding: 15px 15px 15px 25px;
    }
    .navbar-nav .open .dropdown-menu > li > a {
        line-height: 20px;
    }
    .navbar-nav .open .dropdown-menu > li > a:hover,
    .navbar-nav .open .dropdown-menu > li > a:focus {
        background-image: none;
    }
    .navbar-right .dropdown-menu {
        right: 0;
        left: auto;
    }
    .navbar-right .dropdown-menu-left {
        right: auto;
        left: 0;
    }
    .navbar.navbar-default .container {
        padding-right: 0px;
        padding-left: 0px;
        width: auto;
    }
    .collapse.in {
        padding-left: 0px;
    }
}

@media (max-width: 991px) {
    .navbar-brand img {
        height: 30px;
        margin-left: 15px;
        margin-bottom: -5px;
    }
    .navbar-default .navbar-nav > li.navbar-btn {
        border: none;
    }
    .navbar-default .navbar-nav > li.navbar-btn a {
        float: left;
    }
    .navbar-header {
        float: none;
    }
    .navbar {
        margin-top: 0px;
        margin-bottom: 0px;
/*
        border-bottom: 1px solid #ddd;
*/
    }
    .navbar-left,.navbar-right {
        float: none !important;
    }
    .navbar-brand {
        float: none;
        margin-top: 5px;
    }
    .navbar-toggle {
        display: block;
    }
    .navbar-default .navbar-toggle {
        margin-top: 20px;
    }
    .pwg-navbar-button {
        text-align: center;
    }
    .navbar-default .navbar-nav > li > a.pwg-navbar-button-demo {
        color:#ff3363;
        float: none;
        display: inline-block;
        margin: 0 5px;
        margin-top: 40px;
        margin-bottom: 40px;
    }
    .navbar-default .navbar-nav > li.pwg-navbar-button {
        border: none;
    }
    .navbar-default .navbar-nav > li > a.pwg-navbar-button-get-piwigo {
        color:#ffffff;
        float: none;
        display: inline-block;
        margin: 0 5px;
        margin-top: 40px;
        margin-bottom: 40px;
    }
    .navbar-default .navbar-nav .open .dropdown-menu > li > a {
        padding-left: 45px;
        letter-spacing: 1px;
        text-transform: uppercase;
    }
    .pwg-navbar-button-get-piwigo span {
        background-color: #ff3363;
        padding: 10px 30px;
    }
    .pwg-navbar-button-demo span {
        padding: 10px 30px;
    }
    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }
    .nav.navbar-nav.navbar-right {
        margin-bottom: 0px;
    }
    .navbar-fixed-top {
        top: 0;
        border-width: 0 0 1px;
    }
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        float: none!important;
        margin-top: 0px;
        margin-bottom: 0px;
    }
    .navbar-nav>li {
        float: none;
    }
    .navbar-nav>li>a {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .collapse.in{
        display:block !important;
    }
    .navbar-default .navbar-nav > li {
        border-bottom: 1px solid #E7E7E7;
    }
    .navbar-default .navbar-nav > li > a > span.glyphicon {
        display: inline;
        margin-left: 3px;
        margin-right: 3px;
    }
    .navbar-default .navbar-nav > li > a > i.icon-puzzle {
        display: inline;
        margin-right: 3px;
    }
    .dropdown-menu {
        left: 0% !important;
        margin-left: 0px;
        padding: 0 0;
    }
    .dropdown-menu li:focus, .dropdown-menu li:hover {
        background-color: #ff3363 !important;
    }
    .dropdown-menu > li:focus > a, .dropdown-menu > li:hover > a {
        color: white !important;
    }
    .dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover {
        background-color: transparent !important;
    }
    .dropdown-menu:before {
        top: 0px;
        left: 0px;
        display: none;
        border: none;
    }
    .dropdown-menu:after {
        top: 0px;
        left: 0px;
        display: none;
        border: none;
    }
}

@media (max-width: 767px) {
    .pwg-navbar-button-get-piwigo span, .pwg-navbar-button-demo span {
        padding: 10px 20px;
    }

    .nav > li > a.pwg-navbar-button-demo, .nav > li > a.pwg-navbar-button-get-piwigo {
        padding: 0;
    }
}

.navbar-default .navbar-nav>li>.pwg-navbar-demo-link{
  color:#ff3363;
}
.navbar-default .navbar-nav>li>.pwg-navbar-demo-link:hover{
  font-weight:700;
}

/* -------------- */
/* section banner */
/* -------------- */

.pwg-banner {
    padding-top: 10px;
    padding-bottom: 50px;
    overflow: hidden;
    position:relative;
}

.pwg-banner .pwg-tagline {
    padding:0;
}

.pwg-banner .pwg-tagline h1 {
    margin-top: 20px;
    font-size: 56px;
    font-weight: 900;
    text-align: left;
    color:#3c3c3c;
    line-height: 76px;
    transition: all 1s;
}

.pwg-banner .pwg-tagline p {
    color:#7e7e7e;
    font-size: 20px;
    margin-top: 40px;
    font-weight: 700;
    line-height:28px;
    transition: all 1s;
}

#heberge-france-sticker{
    position:absolute;
    width:150px;
    top:0;
    left:25%;
    margin-top:0;
    display:none;
}

.pwg-banner img {
  width:135%;
  height:auto;
  margin-top:50px;
}

@media (min-width: 768px) and (max-width: 991px) {
    .pwg-banner .pwg-tagline h1 {
        text-align: center;
    }
}

@media (max-width: 1199px) {
    .pwg-banner img {
        height:auto;
        margin-top: 70px;
    }
}

@media (max-width: 992px) {
    .pwg-version span {
        font-size: 10px;
    }
    .pwg-banner {
        text-align: center;
        position: relative;
        width: 100%;
        height: 100%;
    }
    .pwg-banner .pwg-tagline h1 {
        text-align:center;
        font-size: 30px;
        font-weight: 700;
        line-height: 50px;
        margin-bottom: 40px;
    }
    .pwg-banner .pwg-tagline h1 br {
        display: none;
    }
    .pwg-banner .pwg-tagline p {
        margin-top: 10px;
        font-size: 18px;
    }
    .pwg-banner .btn {
    }
    .pwg-banner img {
        margin:0 auto;
        margin-top: 50px;
        width: 100%;
        height: auto;

    }
    #heberge-france-sticker{
        width:100px;
        margin-top:20px;
    }
    .pwg-banner img{
        margin-top:70px;
    }
}

@media (max-width: 767px) {
    .pwg-banner .pwg-tagline {
        padding:0 25px;
    }
    .pwg-banner .pwg-tagline p {
        font-size: 16px;
        margin-top: 40px;
        text-align: left;
        padding: 0;
        line-height: normal;
    }
    .pwg-banner .pwg-tagline h1 {
        text-align: left;
        font-weight: 900;
        line-height: 40px;
        padding: 0;
    }
}
/*******************
* Piwigo index CSS *
********************/


/* Organization subscribed to piwigo */

.container-organization {
    background-color: #fff;
}

.container-organization h2 {
    font-size:20px;
    margin-top: 27px;
    letter-spacing: 1px;
    text-align: center;
}

.organization-content {
    padding: 20px 0 20px 0;
}

.organization-content img {
    width: 100%;
    height: auto;
    max-width: 200px;
    margin-bottom: 10px;
    margin-top: 10px;
    vertical-align: middle;
}

.helper {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

.organization-content .col-xs-6 {
    min-height: 100px;
}

/* why an image library */

.pcom-home-why {
    padding: 50px 10px;
}

.pcom-home-why img {
    height: 150px;
}

.pcom-home-why div.why-block {
    margin: 0 0 100px 0;
}

@media (max-width: 767px) {
    .pcom-home-why div.why-block {
        margin-bottom: 50px;
    }
}

.pcom-home-why div.why-block p {
    margin-top:20px;
    padding: 0 60px;
    color: #3c3c3c;
    font-weight: 700;
    font-size:16px;
    margin-bottom: 0;
}

.homepage-batch-manager-image {
    text-align: center;
    padding-left: 15px;
    padding-right: 15px;
}

.homepage-batch-manager-image img {
    width: 100%;
    height: auto;
    margin-bottom: 50px;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
}

.btn-know-content {
    padding-bottom: 40px;
}

.btn-know-content a {
    font-size:18px;
    font-weight: bold;
    letter-spacing: 1px;
}

/* Who are our users - different type of users */

.container-home-users {
    padding: 50px 0 100px 0;
}

.container-home-users a:hover {
    text-decoration: none;
}

.container-home-users img {
    height:150px;
    width: 95%;
}
.container-home-users h3 {
    color: #3c3c3c;
    font-weight: 700;
    font-size: 16px;
}

@media (max-width: 991px) {
    .container-home-users {
        padding-bottom: 30px;
    }

    .container-home-users h3 {
        margin-bottom: 50px;
    }
}

/* Section Why Piwigo */
.home-why-piwigo {
    padding-bottom: 50px;
}
.home-why-piwigo h2 {
    text-align: center;
    margin:60px 0 80px 0;
}

.home-why-piwigo ul {
    border-left: 5px solid #ffe9ee;
    padding: 0;
    max-width: 550px;
    margin: 0 auto;
}

.home-why-piwigo li {
    list-style-type: none;
    margin-bottom: 30px;
    font-size: 16px;
    font-weight: 700;
}

.home-why-piwigo li a {
    color: #333;
}

.home-why-piwigo img {
    width: 70px;
    margin-left: -38px;
    margin-right: 38px;
}

@media (max-width: 700px) {
    .home-why-piwigo ul {
        border-left: none;
    }

    .home-why-piwigo li {
        margin-bottom:0;
        height: 90px;
    }

    .home-why-piwigo img {
        margin-left: 5px;
        margin-right: 16px;
        float:left;
    }
}

/* love */
.home-love {
    background: transparent url('../images/home/catrin-johnson-486189-unsplash-small.jpg') center center no-repeat;
    background-size:cover;
    padding-bottom: 50px;
}

.home-love h2 {
    text-align:center;
    margin: 50px 0 80px 0;
}

.home-love .row .col {
    padding: 26px;
}

.home-love .row .col .quote {
    background-color: white;
    border-radius: 10px;
    padding: 40px;
    margin-bottom: 50px;
}

.home-love .row .col .quote > img {
    width: 75px;
    margin-top: -112px;
}

.home-love .quote > p {
    font-size: 18px;
    font-weight: 600;
}

.home-love .author {
    margin-top: 40px;
    font-weight: 700;
    color:#7e7e7e;
    min-height: 50px;
    display: table;
}

.home-love .author img {
    width: 50px;
    display: table-cell;
    margin-right: 10px;
}

.home-love .author span {
  display: table-cell;
  vertical-align: middle;
  line-height: normal;
}

.home-love .author img.avatar-photographer {
    width: 90px;
}

/* home-start */
.home-start {
    padding:100px 0 50px 0;
    overflow: hidden;
}

.home-start img {
    width: 540px;
    margin-left: px;
}

.home-start h2 {
    margin-top: 0;
    margin-bottom: 50px;
    text-align: left;
}

.home-start p {
    font-size: 16px;
    font-weight: 700;
    color:#7e7e7e;
    margin-bottom: 20px;
}

.home-start .pwg-cta br {
    display: none;
}

@media (max-width: 1199px) {
    .home-start img {
        height: auto;
        width:100%;
        margin-top: 70px;
    }
}

@media (max-width: 991px) {
    .home-start h2 {
        text-align: center;
        padding: 0;
    }
    .home-start img {
        display: none;
    }
    .home-start div.cta-container {
        text-align: center;
    }
    .home-start .pwg-cta br {
        display: inline;
    }
}

@media (max-width: 767px) {
    .home-start h2 {
        text-align: left;
    }
}

/**********
* Pricing *
***********/
.pcom-pricing br {
  display: block;
}
.pcom-pricing .container{
  max-width:1170px
} 

.pcom-pricing .p-15{
  padding-left:15px;
  padding-right:15px;
}

.pcom-pricing .p-30{
  padding:30px;
}

.pcom-pricing .mt-30{
  margin-top:30px;
}

.pcom-pricing .mt-15{
  margin-top:15px;
}

.pcom-pricing .row.height-100{
  display: flex;
}

.pcom-pricing .col-md-3.height-100{
  flex: 1;
}

.pcom-pricing h1 {
  color:#3c3c3c;
  font-size:3rem;
  font-weight: 900;
  text-align: center;
  margin: 70px 0 8px 0;
}

.pcom-pricing p {
  color:#3c3c3c;
  font-size:16px;
  font-weight: 700;
  text-align: center;
}

.pcom-pricing section{
  padding-top:0;
}

.pcom-pricing.purple-wave {
  background-image: url(../images/pricing/pricing-page-large-background.svg);
  background-repeat: no-repeat;
  background-position: top;
  background-size:100%;
}

.pcom-pricing .purple-background{
  background-color:#E8E4F9;
}

.pcom-pricing .switch button.bg-white,
.pcom-pricing .switch button.bg-white:hover{
  color:#ff3363;
}


.pcom-pricing .switch span{
  width: auto;
  background-color: white;
  border-radius: 15px;
  padding:10px;
  margin: 0 auto;
}

.pcom-pricing .switch p{
  white-space: normal;
  color:inherit;
  padding-top:15px;
  font-size:15px;
  font-weight:400;
}

.pcom-pricing .switch br{
  display:block;
}

.pcom-pricing .switch i{
  margin-right:10px;
  font-size:25px;
}

.pcom-pricing .switch i:before{
  vertical-align:top;
}


.pcom-pricing .pricing-switch{
  width: 275px;
  font-weight: 700;
  font-size: 18px!important;
  /* line-height: 25px; */
}

.pcom-pricing .pricing-switch:focus{
  outline:none;
}

.pcom-pricing #cloud.pricing-switch{
  border-radius: 9px 0px 0px 9px;
  border:none;
  margin-bottom:0;
}

.pcom-pricing #on_premise.pricing-switch{
  border-radius: 0px 9px 9px 0px;
  margin-left:-3px;
  border:none;
  margin-bottom:0;
}

.pcom-pricing .bg-white {
  background-color:white;
} 

.pcom-pricing .bg-pink {
  background-color:#ff3363;
  color:white;
} 

.pcom-pricing .border-pink {
  border:1px solid #ff3363;
  color:#ff3363;
  background-color:transparent;
} 

.pcom-pricing a .bg-pink{
  border:none;
  font-weight:normal;
  padding: 20px 10px;
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
  letter-spacing: 0em;
  text-align: center;
}

.pcom-pricing button.border-pink,
.pcom-pricing #contact_popin a.back_to_pricing_plans{
  font-weight:normal;
  padding: 20px 25px;
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
  letter-spacing: 0em;
  text-align: center;
  border-radius:0;
}

.pcom-pricing button.bg-pink{
  font-weight:normal;
  padding: 20px 25px;
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
  letter-spacing: 0em;
  text-align: center;
  border:none;
  margin-bottom:30px;
  border-radius:0;
}

.pcom-pricing button.bg-pink:hover{
      box-shadow: 0 0 6px #888;
}

.pcom-pricing .bg-grey{
  background-color:#F8F8F8;
  color:black;
  margin-top:60px;
} 

.pcom-pricing .bg-light-pink{
  background-color: #FEE9EF;
  margin-top:30px;
} 

.pcom-pricing .bg-light-grey{
  background-color: #f9f9f9;
  margin-top:30px;
} 

.pcom-pricing .text-pink,
.pcom-pricing #cloud_content td h3 i,
.pcom-pricing #on_premise_content td i{
  color:#ff3363;
} 

.pcom-pricing #on_premise_content td i{
  margin-right:15px;
}

.pcom-pricing .box-shadow{
  box-shadow: 0px 8px 35px rgba(0, 0, 0, 0.05);
}

.pcom-pricing .plan_content{
  padding:0px;
}

.pcom-pricing .top-border-radius{
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.pcom-pricing #cloud_content .cloud_subcontent,
.pcom-pricing #on_premise_content .on_premise_subcontent{
  padding:30px 15px;
  border-radius:10px;
}

.pcom-pricing #on_premise_content .on_premise_subcontent{
  padding-left:60px;
  padding-right:60px;
}

.pcom-pricing #on_premise_content .plan_explanation{
  font-size:12px;
}

.pcom-pricing #on_premise_content .on_premise_subcontent .deploy_yourself{
  margin: 0 auto;
  max-width:75%;
}

.pcom-pricing #on_premise_content .on_premise_subcontent .deploy_yourself i{
  color:#585656;
  margin-right:15px;
}

.pcom-pricing #on_premise_content .on_premise_subcontent .deploy_yourself p{
  font-weight: 400;
  font-size: 14px;
  line-height: 18px;
  color:#585656;
  padding-bottom:10px;
  text-align:left;
}

.pcom-pricing #on_premise_content .on_premise_subcontent .plan_explanation{
  font-size:12px;
  font-weight:400;
} 

.pcom-pricing #cloud_content,
.pcom-pricing #cloud_subtitle{
  display:block;
}

.pcom-pricing #on_premise_content,
.pcom-pricing #on_premise_subtitle{
  display:none;
}

.pcom-pricing #on_premise_content .bg-white {
  max-width:900px;
  width:60%;
  margin:0 auto;
}

.pcom-pricing #cloud_content table,
.pcom-pricing #on_premise_content table.border-spacing{
  border-spacing: 15px 0;
  border-collapse: unset;
}

.pcom-pricing #cloud_content table.inner-table{
  border-spacing: 7px 0;
}

/* .pcom-pricing #on_premise_content table{
  margin:0 auto;
} */

.pcom-pricing #cloud_content table tr{
  vertical-align:top;
}

.pcom-pricing #cloud_content td h3,
.pcom-pricing #cloud_content td h3 i,
.pcom-pricing #on_premise_content h3{
  font-weight: 700;
  font-size: 22px;
  line-height: 30px;
  margin-top:15px;
}

.pcom-pricing #cloud_content h4,
.pcom-pricing #on_premise_content h4{
  font-weight: 700;
  font-size: 16px;
  line-height: 22px;
  margin-top:30px;
}

.pcom-pricing #on_premise_content h4{
  margin-bottom:20px;
}

.pcom-pricing #cloud_content .pcom-pricing-faq h4,
.pcom-pricing #on_premise_content .pcom-pricing-faq h4{
  margin-top: 5px;
  padding-bottom: 0;
  margin-bottom: 5px;
  padding-right:15px;
 }

.pcom-pricing #cloud_content .plan_explanation{
  font-weight: 400;
  font-size: 11px;
  line-height: 15px;
  text-align: center;
  color: #737272;
}

.pcom-pricing #cloud_content .vip_offer .plan_explanation,
.on_premise_included_content{
  font-weight: 400;
  font-size: 15px;
  line-height: 20px;
  text-align: center;
  color: #3C3C3C!important;
}

.on_premise_included_content p{
  text-align:left;
  font-size:14px;
  font-weight:400;
}
.on_premise_included_content i{
  color:#F32B68;
  margin-right:15px;
}

.on_premise_included_content i.icon-check-alt:before{
  margin:0
}

.pcom-pricing #cloud_content .vip_offer .price_block{
  padding:0;
  margin-left:30px;
  margin-top:20px;
}

.pcom-pricing #cloud_content .vip_offer .price_block p {
  text-align:left;
}

.pcom-pricing #cloud_content .vip_offer p.plan_explanation {
  font-size:15px;
}


.pcom-pricing #cloud_content .price_block,
.pcom-pricing #on_premise_content .price_block_table{
  padding:30px 0;
  padding-top:20px;
}

.pcom-pricing #on_premise_content .price_block p.subtext{
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  line-height: 15px;
  text-align: center;
  color: #737272;
}

.pcom-pricing #cloud_content .price_block .number,
.pcom-pricing #on_premise_content .price_block .number{
  font-weight: 700;
  font-size: 29px;
  line-height: 39px;
}

.pcom-pricing #cloud_content .price_block .ht{
  font-weight: 400;
  font-size: 15px;
  line-height: 20px;  
}
.pcom-pricing #cloud_content ul{
  padding-left:0;
}

.pcom-pricing #cloud_content .pcom-pricing-faq ul{
  margin-left:15px;
}

.pcom-pricing #cloud_content .features-list li,
.pcom-pricing #cloud_content .features-list i{
  display:inline-block;
}

.pcom-pricing #cloud_content td,
.pcom-pricing #on_premise_content td,
.pcom-pricing #on_premise_content .on_premise_explanation{
  list-style: none;
  line-height: 25px;
  font-weight: 400;
  font-size: 15px;
}

.pcom-pricing #cloud_content td.bg-pink{
  font-weight: 700;
  padding-top:5px;
  padding-bottom:5px;
}

.pcom-pricing #cloud_content td i{
  color:#7E7E7E;
  margin-right:15px;
  font-size:15px;
}

.pcom-pricing #cloud_content .icon-team:before{
  width:fit-content;
}

.pcom-pricing #cloud_content .thirty_day_free_trial{
  font-weight: 700;
  font-size: 16px;
  line-height: 22px;
  text-align: center;
  text-decoration-line: underline;
  color: #F32B68;
}

.pcom-pricing .br-top{
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.pcom-pricing .br-bottom{
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  padding:30px 0;
}

.button-row .br-bottom{
  padding-left:15px;
  padding-right:15px;
}

.pcom-pricing #cloud_content .size_storage,
.pcom-pricing #cloud_content .personalisation{
  text-decoration:none;
}

.pcom-pricing #cloud_content .size_storage:hover,
.pcom-pricing #cloud_content .personalisation:hover{
  cursor:pointer;
  text-decoration:underline;
}

.pcom-pricing #cloud_content .vip_offer{
  margin-top:30px;
  border-spacing: 0;
  border-collapse: collapse;
}

.pcom-pricing #cloud_content .vip_offer .width-50{
  float:left;
}

.pcom-pricing #cloud_content #compare_plans{
  margin-top:70px;
  padding-right:30px;
}

.pcom-pricing #cloud_content #compare_plans h4{
  margin-bottom:10px;
}

.pcom-pricing #cloud_content .details_table h4{
  font-weight: 700;
  font-size: 26px;
  line-height: 31px;
  text-align: center;
  margin:0;
}

.pcom-pricing #cloud_content .details_table .plan_explanation{
  padding-top:10px;
}

.pcom-pricing #cloud_content .details_table h4.text-pink{
  text-align:left;
}

.pcom-pricing #cloud_content .details_table table{
  border-collapse: collapse;
  margin-top:30px;
}

.pcom-pricing #cloud_content .details_table td{
  border-bottom:0px;
  border-top:0px;
  padding:15px 10px;
  width:15%;
}

.pcom-pricing #cloud_content .details_table tr td:first-child { 
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  text-align:left;
  width:25%;
}

.pcom-pricing #cloud_content .details_table tr td:last-child { 
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}

.pcom-pricing #cloud_content .details_table thead tr{
  border-top: 30px solid transparent;
}

.pcom-pricing #cloud_content .details_table tbody td{
  font-size:16px;
  line-height:22px;
  text-align:center;
}

.pcom-pricing #cloud_content .details_table tbody td:not(:first-child),
.pcom-pricing #size_storage_popin_content table td:not(:first-child){
  border-left: solid 1px #8E8E8E;
}

.pcom-pricing #size_storage_popin_content table{
  margin-top:45px;
  width:100%;
}

.pcom-pricing #cloud_content .details_table tr:nth-child(odd){
  border-radius: 10px;
}

.pcom-pricing #cloud_content .details_table thead{
  margin-top:15px;
}

.pcom-pricing #cloud_content .details_table .icon-check-alt{
  color: #F32B68;
  margin: 0;
  padding: 8px 10px;
  font-size:12px;
  background-color: #FEE9EF;
  vertical-align: middle;
  border-radius: 30px;
}

.pcom-pricing #cloud_content .details_table .icon-check-alt:before{
  margin-left:-1px;
  font-weight:700;
}

.pcom-pricing .popin {
  position:fixed;
  width:100%;
  height:100%;
  top:0;
  left:0;
  display:none;
  z-index:99;
}

.pcom-pricing .popin .blocker{
  background-color: rgba(0,0,0,0.5);
  width:100%;
  height:100%;
  position:fixed;
  width:100%;
  height:100%;
  top:0;
  left:0;
}

.pcom-pricing .popin-content{
  position:absolute;
  width:50%;
  background-color:white;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  border-radius:10px;
  padding:80px 30px;
  z-index:100;
  max-height:86%;
  overflow-y:auto;
}

.pcom-pricing .icon-cross{
  position: absolute;
  right: 25px;
  top: 25px;
  color: black;
}


.pcom-pricing .icon-cross:hover{
  cursor:pointer;
}

.pcom-pricing .popin h3{
  text-align:center;
  font-weight: 700;
  font-size: 22px;
  line-height: 30px;
  margin-top:0px;
}

.pcom-pricing .popin p{
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  text-align: center;
}

.pcom-pricing #size_storage_popin_content table th,
.pcom-pricing #size_storage_popin_content table td{
  text-align:center;
}

.pcom-pricing .question_and_content h4{
  text-align:left;
  margin-top:23px;
  padding-bottom:10px;
}

.question_and_content a{
  color: #F32B68;
}

.pcom-pricing #size_storage_popin_content th{
  font-weight: 700;
  font-size: 22px;
  line-height: 30px;
  text-align: center;
  color: #F32B68;
  padding-bottom:15px;
}

.pcom-pricing #size_storage_popin_content td p{
  font-weight: 700;
  font-size: 20px;
  line-height: 27px;
  text-align: center;
  color: rgba(60, 60, 60, 0.8);
  margin-bottom:0;
}

.pcom-pricing #size_storage_popin_content td .ht{
  font-size: 10px;
}

.pcom-pricing #size_storage_popin .mobile_content .size{
  font-weight: 700;
  font-size: 22px;
  text-align: center;
  color: #F32B68;
  padding:0;
  margin:0
}

.pcom-pricing #size_storage_popin .mobile_content .number{
  font-weight: 700;
  font-size: 22px;
}

.pcom-pricing #size_storage_popin .mobile_content .ht{
  font-weight: 700;
  font-size: 12px;
}

.pcom-pricing #contact_popin input,
.pcom-pricing #contact_popin textarea{
  font-size: 15px;
  width:100%;
  border: 1px solid #D1D1D1;
  border-radius: 5px;
}

.pcom-pricing #contact_popin textarea{
  height:100px;
}

.pcom-pricing #contact_popin input:focus-visible,
.pcom-pricing #contact_popin textarea:focus-visible{
  background: #F8F8F8;
  outline:none;
}

.pcom-pricing #contact_popin h4{
  font-weight: 700;
  font-size: 16px;
  line-height: 22px;
}

.pcom-pricing #contact_popin h4 span{
  color:#F32B68;
}

.pcom-pricing #contact_popin button,
.pcom-pricing #contact_popin a{
  margin-top:30px;
}

.pcom-pricing #contact_popin button #see_pricing_plans{
  float:unset;
}

.pcom-pricing #size_storage_popin_content button.back_to_pricing_plans{
  display: block;
  margin: 0 auto;
  margin-top: 50px;
}

.pcom-pricing #personalisation_popin button.back_to_pricing_plans{
  border: 1px solid #ff3363;
}

.pcom-pricing #personalisation_popin .see_examples{
  color:#ff3363;
}

.pcom-pricing #personalisation_popin .see_examples:hover{
  text-decoration:underline;
}

.pcom-pricing #personalisation_popin button.back_to_pricing_plans{
  margin-top:-5px;
}

.pcom-pricing #cloud_content td .icon-tooltip{
  position:relative;
  margin-left:5px;
  font-size:13px;
}

.pcom-pricing .tooltip_content{
  display:none;
  width: 200px;
  background-color: white;
  border: 1px solid #F32B68;
  color: black;
  font-weight: 400;
  font-size: 12px;
  font-style: normal;
  text-align: center;
  border-radius: 6px;
  padding: 15px;
  position: absolute;
  z-index: 1;
  transition: opacity 0.3s;
  /* top: 30px; */
  left:50%;
  transform:translateX(-50%);
}

.tooltip_content_desktop{
  left: 50%;
  transform: translateX(-50%);
}

.pcom-pricing .tooltip_content::after{
  content: "";
  position: absolute;
  bottom: 100%;
  left: 50%;
  margin-left: -8px;
  border-width: 8px;
  border-style: solid;
  border-color: transparent transparent #F32B68 transparent;
}

.pcom-pricing .tooltip_content li{
  margin-left:5px;
  padding-bottom:5px;
}

.icon-tooltip:hover > .tooltip_content{
  display:block;
}

.pcom-pricing .icon-up-dir{
  position:relative;
  margin-left:15px;
}

.pcom-pricing .icon-up-dir::after{
  content: "";
  position:absolute;
  margin-left: -8px;
  border-width: 8px;
  border-style: solid;
  border-color: #F32B68 transparent transparent transparent;
  top:46%;
}

.pcom-pricing .icon-up-dir.revert_arrow::after{
  content: "";
  position: absolute;
  margin-left: -8px;
  border-width: 8px;
  top: 0;
  border-style: solid;
  border-color: transparent transparent #F32B68 transparent;
}

.pcom-pricing-faq{
  margin-top:60px;
  border-top:1px solid #d1d1d1;
}

.pcom-pricing-faq h2{
  margin:60px 0;
}

.pcom-pricing-faq h3{
  font-weight: 700;
  font-size: 18px;
  line-height: 25px;
  margin-top:5px;
  margin-right:30px;
}

.pcom-pricing-faq p,
.pcom-pricing-faq li{
  font-weight: 400;
  font-size: 14px;
  text-align:left;
}

.pcom-pricing-faq .faq-answer{
  display:none;
  -webkit-animation: 1s normal forwards ease-in-out;
  -moz-animation: 1s normal forwards ease-in-out;
  animation: 1s normal forwards ease-in-out;

  -webkit-transform-origin: 50% 0%;
  -moz-transform-origin: 50% 0%;
  transform-origin: 50% 0%;
}

.pcom-pricing-faq .icon-cross{
  top:39px;
  right:40px!important;
}

.pcom-pricing-faq .question_and_content_container{
  position:relative;
}

.pcom-pricing-faq .question_and_content_container:hover{
  cursor:pointer;
}

#cloud_content .discover-block {
  position:relative;
}

#cloud_content .discover-block i.icon-plus,
#cloud_content .discover-block i.icon-cross,
.pcom-pricing-faq .question_and_content_container i{
  color:#F32B68;
  position:absolute;
  right:30px;
  font-size:15px;
  margin:0;
}

#cloud_content .discover-block i.icon-plus,
#cloud_content .discover-block i.icon-cross{
  right:0;
  top:0;
}

#cloud_content .discover-block i.icon-plus,
.pcom-pricing-faq .question_and_content_container i.icon-plus{
  font-size:20px;
}

#cloud_content .discover-block i.icon-cross{
  font-size:15px;
}

#cloud_content .discover-block i.icon-plus,
#cloud_content .discover-block i.icon-cross{
  position:relative;
}

.pcom-pricing-faq .question_and_content_container .question_and_content{
  background: #F8F8F8;
  border-radius: 10px;
  padding:20px 30px;
  margin: 15px 0;
}

/*Adapt pricing page for mobile*/
.pcom-pricing .mobile_content,
.pcom-pricing .discover-more,
#contact_popin_content_form_sucess,
#contact_popin_content_form_error{
  display:none;
}

.pcom-pricing #cloud_content .details_table #sticky-offers-bar tbody td:not(:first-child){
  border-left: 0px;
}

.pcom-pricing #cloud_content .offer-names-full .rotate-text{
  rotate:-70deg;
  color:white;
  font-size:15px;
  text-transform: uppercase;
}

.pcom-pricing #cloud_content table.offer-names-icons{
  margin-top:5px;
  margin-bottom:5px;
}

.pcom-pricing #cloud_content .offer-names-icons i{
  color:white;
  font-size: 20px;
  margin:0 auto;
}

.pcom-pricing #cloud_content .offer-names-icons td{
  padding:0;
}

.pcom-pricing #cloud_content #sticky-offers-bar{
  top:-1px;
  z-index:99;
  margin:0;
  display:block;
  position: -webkit-sticky;
  position:sticky;
  padding:0 25px;
}

.pcom-pricing #cloud_content #sticky-offers-bar .offer-names-icons{
  display:none;
}

.pcom-pricing #cloud_content #sticky-offers-bar table{
  margin:0;
}

.pcom-pricing #cloud_content #sticky-offers-bar.is-pinned {
  top:-100px;
}

.pcom-pricing #cloud_content #sticky-offers-bar.is-pinned .offer-names-icons{
  display:block;
}

.pcom-pricing #cloud_content .offer-names-full td{
  padding-top:60px;
  padding-bottom:50px;
}

.pcom-pricing .pricing-dropdown{
  position:relative;
}

.pcom-pricing .pricing-dropdown h3 {
  width: 100%;
  left: 0;
  right: 0;
  padding: 20px;
  margin: 0;
  font-weight: 700;
  border-bottom: 2px solid white;
}

.pcom-pricing .pricing-dropdown thead td{
  font-weight: 700;
  font-size: 16px;
}

.pcom-pricing .popin #contact_popin_content_form_error p{
  background-color:rgb(255,0,0,0.2);
  border-left:2px solid #ff0000;
  text-align:left;
  color:#ff0000;
  padding:5px 10px;
}

@media  (max-width:1200px) {
  .pcom-pricing #on_premise_content .desktop_content{
    display:none!important;
  }
  .pcom-pricing #on_premise_content .mobile_content{
    display:block;
    margin:15px;
  }
}

@media  (max-width:992px) {
  .pcom-pricing.purple-wave{
    background-size:200%;
  }

  .pcom-pricing .desktop_content{
    display:none!important;
  }

  .pcom-pricing .mobile_content{
    display:block;
    margin:15px;
  }

  .pcom-pricing #cloud_content .mobile_content.cloud_subcontent{
    padding:0;
  }

  .pcom-pricing .mobile_content{
    margin:0;
  }

  .pcom-pricing #on_premise_content table.price_block_table.mobile_content{
    border-spacing:0 15px;
  }
  .pcom-pricing #cloud_content td,
  .pcom-pricing #on_premise_content td,
  .pcom-pricing #on_premise_content .on_premise_explanation{
    text-align:left;
  }

  .pcom-pricing .plan_explanation{
    padding:0 15px;
  }

  .pcom-pricing #cloud_content .price_block,
  .pcom-pricing #cloud_content .button-row td,
  .pcom-pricing #cloud_content .discover-block td{
    text-align:center;
    padding:20px 0;
  }

  .pcom-pricing #cloud_content .discover-block .plus.discover-more-text::before{
    content: "+ "
  }

  .pcom-pricing #cloud_content .discover-block .minus.discover-more-text::before{
    content: "- "
  }

  .pcom-pricing #cloud_content .discover-block td{
    font-weight: 800;
    font-size: 16px;
    line-height: 22px;
    color:#000000;
    text-align:center;
    padding-bottom:45px;
  }
  .pcom-pricing #cloud_content #compare_plans{
    margin:30px 0;
  }

  .pcom-pricing #cloud_content table.inner-table{
    margin-left:15px;
  }

  .pcom-pricing #cloud_content td h3{
    margin-top:45px;
  }

  .pcom-pricing #cloud_content .vip_offer td h3{
    margin-top:15px;
  }

  .pcom-pricing #cloud_content .w-25{
    width:25vw!important;
  }

  .pcom-pricing #cloud_content .details_table tbody td:not(:first-child), 
  .pcom-pricing #size_storage_popin_content table td:not(:first-child){
    border:none;
  }

  .pcom-pricing #cloud_content .details_table h4{
    font-size:16px;
  }
  .pcom-pricing .pricing-dropdown .br-bottom{
    padding:0;
    padding-bottom:15px;
  }

  .pcom-pricing #cloud_content .details_table .pricing-dropdown table{
    margin:0;
  }

  /* .pcom-pricing .mobile_content .icon-tooltip{
    position:relative;
 
  } */

  .pcom-pricing .offer-names-full,
  .pcom-pricing .offer-names-icons{
    margin:0;
    padding:0;
  } 

  .pcom-pricing .pricing-dropdown .icon-up-dir{
    position:absolute;
    right:45px;
    margin-top: 7px;
  }

  .pcom-pricing .pricing-dropdown .icon-up-dir.revert_arrow{
    margin-top: 0px;
  }

  .pcom-pricing .pricing-dropdown .icon-up-dir::after{
    margin-left: 0;

  }

  .pcom-pricing .pricing-dropdown .discoverMoreDetails{
    display:none;
    margin:0 25px;
    margin-bottom:45px;

  }

  .pcom-pricing #cloud_content .details_table .pricing-dropdown tr td{
    text-align:center;
    width:20%;
  }

  .pcom-pricing .popin-content{
    width:75%;
  }

  .pcom-pricing #cloud_content .discover-more .br-bottom{
    padding-top:0;
  }

  .pcom-pricing #cloud_content table.pt-5{
    padding-top:35px!important;
  }

  .pcom-pricing #cloud_content .vip_offer .price_block{
    margin-left:-15px;
    margin-top:30px;
  }

  .pcom-pricing #on_premise_content .bg-white{
    max-width:75%;
  }

}

@media  (max-width:768px) {
  .pcom-pricing.purple-wave {
    background-image: url(../images/pricing/pricing-page-small-background.svg);
    background-repeat: no-repeat;
    background-position: top;
    background-size:100%;
  }

  .pcom-pricing #cloud_content .cloud_subcontent, 
  .pcom-pricing #on_premise_content .on_premise_subcontent{
    padding:30px;
  }

  .pcom-pricing #on_premise_content .bg-white{
    max-width:75%;
  }

  .pcom-pricing #cloud.pricing-switch,
  .pcom-pricing #on_premise.pricing-switch{
    display:block!important;
    margin:0 auto;
    border-radius:9px;
  }

  .pcom-pricing #on_premise.pricing-switch{
    margin-top:15px;
  }

  .pcom-pricing #cloud_content .offer-names-full td {
    padding-top: 40px;
    padding-bottom: 30px;
    padding-left: 0px;
    padding-right:0px;
  } 

  .pcom-pricing .popin-content{
    padding: 50px 15px;
    font-weight: 600;
    font-size: 20px;
  }

}

@media  (max-width:630px) {
  .pcom-pricing #personalisation_popin button.back_to_pricing_plans{
    margin-bottom:30px;
  }
}

@media  (max-width:550px) {
  #cloud_subtitle,
  #on_premise_subtitle{
    margin:0 30px;
  }

  .pcom-pricing .pricing-dropdown h3{
    font-size:17px;
  }

  .pcom-pricing #cloud_content .details_table tbody td{
    font-size:12px;
  }

  .pcom-pricing #cloud_content .offer-names-full .rotate-text{
    font-size: 12px;
  }

  .pcom-pricing #cloud_content #sticky-offers-bar{
    padding:0 16px;
  }
}

.pcom-pricing .pdf-link{
  display:block;
  text-decoration:underline;
  font-weight:700;
  color:#888;
  margin-top:75px;
}

/***********
 * Product *
 ***********/

 @media (min-width: 991px) and (max-width: 1200px) {
  .accordion-section .accordion .btn{
    white-space: normal;
  }

  .pcom-product-feature .pcom-label {
    width: 85% !important;
  }

  .accordion-section img {
    width: 450px !important;
    margin: 0 !important;
    height: 330px !important;
  }
}

 @media (min-width: 700px) and (max-width: 991px) {

  .pcom-product-feature .pcom-label {
    width: 85% !important;
  }

  .accordion-section img {
    width: 350px !important;
    margin: 0 !important;
    height: 265px !important;
  }

  .accordion-section .accordion .btn{
    white-space: normal;
  }

  .accordion-section.reverse .accordion {
    margin-right: 0px !important;
  }
}

 @media (max-width: 700px) {
  .pcom-product-feature h3 {
    font-size: 18px !important;
  }

  .pcom-product-feature .feature-row img {
    max-width: 40px !important;
  }

  .pcom-align-center {
    flex-direction: column;
  }

  .feature-row {
    justify-content: center;
    margin: 5px 0;
    height: 60px;
    width: 75%;
  }

  .accordion-section {
  flex-direction: column !important;
  }

  .accordion-section .accordion {
    width: 100% !important;
    }

  .accordion-section.reverse .accordion {
    margin-right: 0px !important;
  }

  .accordion-section .accordion .btn{
    white-space: normal;
  }

  .pcom-product-feature .pcom-label {
    width: 85% !important;
  }

  .accordion-section img:not(.stat-visit) {
    width: 350px !important;
    margin: 20px 0 0 0 !important;
    height: 265px !important;
  }
  .accordion-section img.stat-visit {
    width: 350px !important;
    margin: 20px 0 0 0 !important;
    height: 235px !important;
  }

  .pcom-product-feature {
    margin-bottom: 30px !important;
  }
 }

 .page-product .pwg-banner img{
   width:135%;
   margin-top:0;
 }

.pcom-product-feature {
    margin-bottom: 150px;
}

.pcom-product-feature .pcom-align-center {
  display: flex;
  align-items: center;
  justify-content: space-evenly;
}

.pcom-product-feature h2 {
    text-align: center;
    margin-bottom: 0px;
}
.pcom-product-feature h2 img {
    height: 66px;
    margin-right: 20px;
}

.pcom-product-feature .pcom-label {
  font-size: 15px;
  font-weight: 700;
  width: 65%;
}

.pcom-product-feature .feature-row {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.pcom-product-feature .feature-row img{
  max-width: 50px;
  max-height: 50px;
  margin-right: 10px;
}

.accordion .icon-accordion {
  display: inline-block;
  height: 20px;
  width: 20px;
}

.accordion #headingOne-1 .icon-accordion {
  background-image : url(../images/product/file-import-icon.svg);
  background-size: cover;
}
.accordion #headingTwo-1 .icon-accordion {
  background-image : url(../images/product/mobile-upload-icon.svg);
  background-size: cover;
  transform: scale(0.8);
  height: 32px;
}
.accordion #headingThree-1 .icon-accordion {
  background-image : url(../images/product/allow-tiers-icon.svg);
  background-size: cover;
}
.accordion #headingFour-1 .icon-accordion {
  background-image : url(../images/product/various-format-icon.svg);
  background-size: cover;
}

.accordion #headingOne-2 .icon-accordion {
  background-image : url(../images/product/album-limited-icon.svg);
  background-size: cover;
  transform: scale(0.6);
  width: 38px;
  margin-left: -9px;
  margin-right: -8px;
}
.accordion #headingTwo-2 .icon-accordion {
  background-image : url(../images/product/tags-icon.svg);
  background-size: cover;
}
.accordion #headingThree-2 .icon-accordion {
  background-image : url(../images/product/geolocalisation-icon.svg);
  background-size: cover;
  transform: scale(0.8);
  height: 26px;
}
.accordion #headingFour-2 .icon-accordion {
  background-image : url(../images/product/perf-search-icon.svg);
  background-size: cover;
}
.accordion #headingFive-2 .icon-accordion {
  background-image : url(../images/product/metadata-icon.svg);
  background-size: cover;
  transform: scale(0.8);
  height: 28px;
}
.accordion #headingSix-2 .icon-accordion {
  background-image : url(../images/product/personnal-collec-icon.svg);
  background-size: cover;
  transform: scale(0.9);
  height: 22px;
}

.accordion #headingOne-3 .icon-accordion {
  background-image : url(../images/product/users-groups-icon.svg);
  background-size: cover;
  transform: scale(0.8);
  width: 30px;
  margin-left: -5px;
  margin-right: -5px;
}
.accordion #headingTwo-3 .icon-accordion {
  background-image : url(../images/product/share-link-icon.svg);
  background-size: cover;
}
.accordion #headingThree-3 .icon-accordion {
  background-image : url(../images/product/public-private-icon.svg);
  background-size: cover;
  height: 22px;
}
.accordion #headingFour-3 .icon-accordion {
  background-image : url(../images/product/download-options-icon.svg);
  background-size: cover;
}
.accordion #headingFive-3 .icon-accordion {
  background-image : url(../images/product/collab-comm-icon.svg);
  background-size: cover;
  transform: scale(0.9);
  width: 22px;
}

.accordion #headingOne-4 .icon-accordion {
  background-image : url(../images/product/theme-pers-icon.svg);
  background-size: cover;
  transform: scale(0.9);
  width: 22px;
}
.accordion #headingTwo-4 .icon-accordion {
  background-image : url(../images/product/options-plugins-icon.svg);
  background-size: cover;
  height: 22px;
}
.accordion #headingThree-4 .icon-accordion {
  background-image : url(../images/product/advanced-pers-icon.svg);
  background-size: cover;
}

.accordion #headingOne-5 .icon-accordion {
  background-image : url(../images/product/stat-visit-icon.svg);
  background-size: cover;
  transform: scale(0.7);
  width: 31px;
  margin-left: -5px;
  margin-right: -5px;
}
.accordion #headingTwo-5 .icon-accordion {
  background-image : url(../images/product/history-icon.svg);
  background-size: cover;
}
.accordion #headingThree-5 .icon-accordion {
  background-image : url(../images/product/stat-tools-icon.svg);
  background-size: cover;
  height: 22px;
}

.accordion #headingOne-6 .icon-accordion {
  background-image : url(../images/product/private-icon.svg);
  background-size: cover;
  height: 22px;
}
.accordion #headingTwo-6 .icon-accordion {
  background-image : url(../images/product/french-host-icon.svg);
  background-size: cover;
  transform: scale(0.7);
  width: 31px;
  margin-left: -5px;
  margin-right: -5px;
}
.accordion #headingThree-6 .icon-accordion {
  background-image : url(../images/product/saves-icon.svg);
  background-size: cover;
  transform: scale(0.9);
}
.accordion #headingFour-6 .icon-accordion {
  background-image : url(../images/product/data-icon.svg);
  background-size: cover;
  height: 22px;
}


.accordion-section .accordion {
  width: 50%;
}

.accordion button {
  text-align: left;
  width: 100%;
  padding: 10px;
}

.accordion button p {
  white-space: normal;
  margin-top: 5px;
}

.accordion .btn-title {
  display: flex;
  align-items: center;
}

.accordion button span.glyphicon {
  margin-left: auto;
  margin-right: 5px;
}

.accordion button span.pcom-label {
  margin-left: 10px;
}

.accordion button .glyphicon {
  transform: rotate(180deg);
  transition: 0.3s;
}
.accordion button.collapsed .glyphicon {
  transform: rotate(0deg);
  transition: 0.3s;
}

.pcom-product-feature .accordion p {
  font-weight: 600;
  font-size: 13px;
  margin: 0px;
  opacity: 0.75;
}
.pcom-product-container{
    position: relative;
}

.accordion button:active {
  box-shadow: none;
}

.accordion .btn-purple:not(.collapsed) {
  border: 2px solid #8869f3;
  background-color: #dfd9f4;
  transition: 0.3s;
}
.accordion .btn-purple .glyphicon {
  color: #8869f3;
}

.accordion .btn-orange:not(.collapsed) {
  border: 2px solid #ffa646;
  background-color: #ffe8ce;
  transition: 0.3s;
}
.accordion .btn-orange .glyphicon {
  color: #ffa646;
}

.accordion .btn-red:not(.collapsed) {
  border: 2px solid #ff2f63;
  background-color: #ffe9ee;
  transition: 0.3s;
}
.accordion .btn-red .glyphicon {
  color: #ff2f63;
}

.accordion .btn-blue:not(.collapsed) {
  border: 2px solid #4992ac;
  background-color: #e5f4f9;
  transition: 0.3s;
}
.accordion .btn-blue .glyphicon {
  color: #4992ac;
}

.accordion .btn-green:not(.collapsed) {
  border: 2px solid #6bcc63;
  background-color: #d5fed4;
  transition: 0.3s;
}
.accordion .btn-green .glyphicon {
  color: #6bcc63;
}

.accordion .btn-pink:not(.collapsed) {
  border: 2px solid #ff9cb3;
  background-color: #ffe9ee;
  transition: 0.3s;
}
.accordion .btn-pink .glyphicon {
  color: #ff9cb3;
}

.accordion .btn.collapsed {
  border: 2px solid transparent;
  background-color: transparent;
  transition: 0.3s;
}

.accordion .btn-content {
  margin-top: 10px;
}

.accordion-section {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
  align-items: center;
  margin-top: 50px;
}
.accordion-section.reverse {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  width: 100%;
  align-items: center;
  margin-top: 50px;
}
.accordion-section.reverse .accordion {
  margin-right: -50px;
}


.accordion-section img {
  width: auto;
  margin: 0 auto;
  height: 400px;
}

.pcom-product-feature-hosting-text {
  margin: 0;
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0;
}

.pcom-product-feature-tags-text{
  margin: 0;
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 0;
}

@media (max-width: 991px) {
    .pcom-product-feature h2 {
        text-align: center;
    }
    .pcom-product-feature h2 img {
        display: block;
        margin: 10px auto;
    }
    .pcom-product-feature-hosting-text {
      position:relative;
      -ms-transform:inherit;
      transform: inherit;
      top:auto;
      left: auto;
    }
    .pcom-product-feature-tags-text{
      transform: initial;
      position:relative;
    }
}

.pcom-product-feature h3 {
    font-size: 25px;
    font-weight: 800;
    color: #7e7e7e;
    margin: 50px 0;
}

.pcom-product-feature p {
    font-weight: 600;
    font-size: 15px;
    margin-bottom: 20px;
}

@media (max-width: 991px) {
    .pcom-product-feature {
        margin-bottom: 50px;
    }

    .pcom-product-feature h3 {
        margin-top: 20px;
        padding: 0 25px;
    }

    .pcom-product-feature p {
        padding: 0 25px;
    }
}

.pcom-product-feature .row img {
    width: 100%;
}

.pcom-product-feature .carousel {
    box-shadow: 0 0 20px #bbb;
}

@media (max-width: 991px) {
    .pcom-product-feature .carousel {
        margin-bottom: 50px;
    }
}

/* TODO bug with left/right arrows, hide for now */
.carousel-control {
    display: none;
}

.pcom-product-feature .carousel-indicators {
    bottom: -60px;
}

.pcom-product-feature .carousel-indicators li {
    background-color: #ffe9ee;
    border:none;
}

.pcom-product-feature .carousel-indicators li.active {
    background-color: #ff3363;
}

.pcom-product-start {
    text-align: center;
    padding-bottom: 50px;
}

.pcom-product-start h2 {
    text-align: center;
}

.pcom-product-start .btn.pwg-cta {
    margin-top: 100px;
}

.pcom-clien-icam section.pcom-product-start{
  padding-top:80px!important;
}


.pcom-product-feature-permissions h3 {
    margin-top:50px;
}

/********************
*Demonstration page*
********************/

.Demo-page-intro{
    position:relative;
    display:block;
}

.demo-page-intro-text{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
}

.demo-page h1{
    margin-top: 20px;
    font-size: 56px;
    font-weight: 900;
    text-align: left;
    color: #3c3c3c;
    line-height: 76px;
    transition: all 1s;
}

.demo-page .demo-page-intro-text p{
    color: #7e7e7e;
    font-size: 20px;
    margin-top: 40px;
    font-weight: 700;
    line-height: 28px;
    transition: all 1s;
}

.demo-page-intro-image{
    text-align:center;
    float:right;
    padding:40px 0;
}

.demo-page-intro-image img{
    width:100%;
}

.demo-page .container .row{
    padding: 0 15px;
}

.demo-img-gallery{
    position:relative;
}

.demo-img-gallery .demo-gallery-screenshots{
    margin:40px 0;
    padding:0;
}

.demo-gallery-description{
    margin-top:90px;
}

.demo-img-gallery .demo-gallery-screenshots img{
    width:100%;
    box-shadow:0 0 10px #d1d1d1;
}

.demo-img-gallery .demo-gallery-screenshots .demo-gallery-description h3{
    font-size: 25px;
    font-weight: 800;
    color: #7e7e7e;
}

.demo-img-gallery .demo-gallery-screenshots .demo-gallery-description a:hover h3{
    color:#ff3363;
}

.demo-img-gallery .demo-gallery-screenshots .demo-gallery-description a:hover{
    text-decoration:underline #ff3363;
}

@media (max-width:1200px){
    .demo-gallery-description{
        margin-top:60px;
    }
}

@media (max-width:991px){
    .demo-page h1{
        text-align: center;
        font-size: 30px;
        font-weight: 700;
        line-height: 50px;
        margin-bottom: 40px;
    }
    .demo-page-intro-image{
        text-align:center;
    }
    .demo-page .demo-page-intro-text p{
        margin-top: 10px;
        font-size: 18px;
        padding-bottom:50px;
    }
    .demo-gallery-description{
        margin-top:40px;
        margin-bottom:80px;
    }

    .demo-page-intro-text{
        position:inherit;
        top:inherit;
        transform:inherit;
    }

    .demo-page-intro-image{
        text-align:center;
        float:none;
    }
    
}


/********************
 * Terms of Service *
 ********************/

.container.tos {
    padding: 0 200px;
    font-size: 18px;
    text-align: justify;
}

.container.tos a {
    color: #ff3363;
}

.container.tos h1 {
    font-size: 40px;
    font-weight: 700;
    color: #3c3c3c;
    text-align: center;
    margin-top: 50px;
    margin-bottom: 80px;
}

.container.tos p {
    margin-bottom: 30px;
}

.container.tos h3 {
    font-size: 25px;
    font-weight: 700;
    margin-top: 70px;
    margin-bottom: 30px;
    text-align: left;
}

.container.tos ul li {
    margin-bottom: 20px;
}

.container.tos ul li ul {
    margin-top: 10px;
}

.container.tos ul li ul li {
    margin-bottom: 5px;
}  

.pcom-tos-history {
    margin-top:50px;
}
.pcom-tos-history {
    color: #7e7e7e;
}
.container.tos .pcom-tos-history h3 {
    font-size: 18px;
    margin-bottom: 20px;
}
.pcom-tos-history ul {
    font-size: 14px;
    font-weight: 700;
}
.container.tos .pcom-tos-history ul li {
    margin-bottom: 10px;
}

.container.tos .pcom-tos-translation {
    margin-top: 70px;
    text-align: center;
}
.container.tos .pcom-tos-translation span {
    padding: 10px 20px;
    background-color: #eee;
    border-radius: 5px;
    font-size: 14px;
}

@media (max-width: 991px) {
    .container.tos {
        padding: 0 40px;
        text-align: left;
    }
}

/******************
 * Piwigo contact *
 ******************/

/*
body.page-contact nav, body.page-contact footer {
    display: none;
}
*/

.container-contact-banner p {
    font-size: 16px;
    font-weight: 700;
    color: #7e7e7e;
}

.container-contact-banner .icon-mail, .container-contact-banner .pcom-contact-phone {
    color:#595959;
}

.container-contact-banner, .container-contact-form {
    margin: 0 auto 50px auto;
    width: 800px;
    font-size: 18px;
}

@media (max-width: 767px) {
    .container-contact-banner, .container-contact-form {
        width: 100%;
        padding: 0 40px;
    }
}

.container-contact-banner h1 {
    font-size: 40px;
    font-weight: 700;
    color: #3c3c3c;
    text-align: center;
    margin: 50px 0;
}

.container-contact-form label {
    color: #777;
}

.container-contact-form input,
.container-contact-form textarea {
    margin-top: 10px;
    transition: background-color 0.2s ease-out;
    -webkit-transition: background-color 0.2s ease-out;
    -moz-transition: background-color 0.2s ease-out;
    display: block;
    width: 100%;
    border: 2px solid #ddd;
}

.container-contact-form textarea {
    height: 300px;
    padding: 12px;
}

.container-contact-form input:active,
.container-contact-form textarea:active,
.container-contact-form select:active,
.container-contact-form input:focus,
.container-contact-form textarea:focus,
.container-contact-form select:focus {
    /*
    border: 2px solid #FF3363;
    box-shadow: 0 0 0;
    */
}


.btn-send-mail {
    margin-top: 30px;
    font-size: 20px;
    font-weight: 700;
    color: #FFF;
    border-radius: 0px;
    background-color: #FF3363;
    padding: 10px 40px;
    border: none;
    transition: background-color 0.2s ease-out;
    -webkit-transition: background-color 0.2s ease-out;
    -moz-transition: background-color 0.2s ease-out;
}

.btn.disabled {
    background-color: #eee;
}

.contact-success {
    margin-top: 50px;
    margin-bottom: 50px;
    font-size: 28px;
    background-color: #d4edda;
    border: 1px solid #c3e6cb;
    border-radius: 5px;
    padding: 20px 0;
}

.container-contact-banner .contact-success p {
    color: #1D5D2B;
}

 @media (max-width: 380px) {
    .btn-send-mail {
        padding-left: 50px;
        padding-right: 50px;
    }
 }

.btn-send-mail:hover, .btn-send-mail:focus {
    color: #fff;
    box-shadow: 0 0 3px #bbb;
}

.input-email {
    height: 45px;
    padding: 5px 12px;
}

.contact-submit {
    text-align: left;
}

/*****************
 * Piwigo signup *
 *****************/

body.page-signup nav, body.page-signup footer {
    display: none;
}

.container.registration-disabled {
    text-align: center;

    position: absolute;
    top: 50%;
    margin-top: -90px;
    left: 50%;
    margin-left: -570px;
}

.container.registration-disabled p {
    font-size: 25px;
    font-weight: bold;
}

.container.registration-disabled a.pwg-cta {
    margin-top: 10px;
}

.container.pcom-signup {
/*
    margin-top: 80px;
*/
    position: absolute;
top: 50%;
margin-top: -344px;
left: 50%;
margin-left: -570px;
}

.pcom-signup-logo {
    text-align: right;
}

.pcom-signup-logo img {
    margin-top: 30px;
    margin-right: 50px;
    height: 150px;
}

.pcom-signup h1 {
    font-size: 35px;
    font-weight: 700;
    color: #3c3c3c;
}

.pcom-signup p.h1-intro {
    margin-bottom: 50px;
}

.pcom-signup a {
    color: #ff3363;
}

.pcom-signup a:hover, .pcom-signup a:focus {
    text-decoration: none;
}

.pcom-signup label {
    color: #777;
}

.pcom-signup .form-control {
    margin-top: 10px;
}

.pcom-signup .input-group {
    margin-top: 10px;
}

.pcom-signup .input-group .form-control {
    margin-top: 0;
}

.pcom-signup input[name=username] {
    border-right: 1px solid #f1f1f1;
}
.pcom-signup .input-group-addon {
    background-color: white;
}

.pcom-signup #showPassword {
    float: right;
}

.pcom-signup .form-group {
    margin-top: 30px;
}

.pcom-signup input[name=password] {
    margin-bottom: 10px;
}

label.pcom-signup-email-password {
    float: right;
    cursor: pointer;
}

.pcom-signup input[type=text], .pcom-signup input[type=password], .pcom-signup input[type=email] {
    height: 47px;
}

.pcom-signup-submit-row {
    margin-top: 50px;
    margin-bottom: 50px;
}

.pcom-signup-submit-col {
    padding-right: 0;
}

.pcom-signup-submit-row input {
    margin: 0;
    width: 100%;
    padding: 10px;
}

.pcom-signup .with-errors {
    color: #bf3e0b;
    font-weight: 600;
}

.wait-for-server {
    background-color: #ff3363;
    display: block;
    text-align: center;
    padding: 10px;
    font-size: 20px;
    color: white;
    display: none;
}

@media (max-width: 991px) {
    .container.pcom-signup {
        position: static;
        margin-top: 0;
        margin-bottom: 20px;
        margin-left: 0;
        padding: 0 35px;
    }

    .pcom-signup-logo {
        text-align: center;
    }

    .pcom-signup-logo img {
        margin: 30px 0 10px 0;
        height: 100px;
    }

    .pcom-signup h1 {
        text-align: center;
        font-size: 30px;
        margin-bottom: 20px;
    }

    .pcom-signup-submit-col {
        padding-right: 15px;
    }

    .pcom-signup-legal {
        margin-top: 20px;
    }
}

@media (max-height: 700px) {
    .container.pcom-signup {
        position: static;
        margin: 10px auto;
        padding: 0 35px;
    }
}

.pcom-signup-wait-for-install {
    display: none;
    margin-top: 0;
    text-align: center;
}

.pcom-signup-wait-for-install p {
    font-size: 25px;
    font-weight: 600;
    color: #1d1d1b;
}

.pcom-signup-wait-for-install img {
    width: 100%;
    max-width: 600px;
    margin-bottom: 50px;
}

.pcom-signup-wait-for-install br {
    display: inline;
}

/**********
 * Signin *
 **********/

.pwg-banner.pcom-signin {
    margin-top: 50px;
}

.pwg-banner.pcom-signin img {
    width: 95%;
    height: auto;
    margin-top: 20px;
}

.pwg-banner.pcom-signin .pwg-tagline {
    padding-left: 40px;
}

@media (max-width: 991px) {
    .pwg-banner.pcom-signin {
        margin-top: 0;
    }
    .pwg-banner.pcom-signin .pwg-tagline {
        padding: 0 25px;
    }
}

/**********
  * About *
  *********/

.pcom-about {
    background-color: #f8f9fa;
    border-top: 2px solid #eee;
    margin-bottom: -50px;
    padding-bottom: 50px;
}

.pcom-about-banner h1 {
    text-align: center;
    font-size: 56px;
    font-weight: 900;
    color: #3c3c3c;
    margin: 80px 0;
}

.pcom-about-banner-card {
    background-color: #fff;
    box-shadow: 0 1px 2px #ccc;
    border-radius: 10px;
    padding: 40px 10px;
    text-align: center;
    margin: 5px;
}

.pcom-about-banner-card img {
    width: 70px;
}

.pcom-about-banner-card .qty {
    margin: 20px 0;
    color: #3c3c3c;
    font-size: 40px;
    font-weight: 900;
}

.pcom-about-banner-card .pcom-label {
    color: #7e7e7e;
    font-weight: 700;
}

.pcom-about-history {
    margin-top: 80px;
    background-image: url('../images/about/about-history-line.svg');
    background-repeat: no-repeat;
    background-position: 0 220px;
}

.pcom-about-history h2 {
    text-align: left;
}


.history-card {
    background-color: #fff;
    /*border: 1px solid #ddd;*/
    box-shadow: 0 1px 2px #ccc;
    border-radius: 10px;
    padding: 20px;
}

.pcom-about-history-step1 {
    margin-top: 70px;
}
.pcom-about-history-step1 .history-card {
    margin-left: 100px;
    margin-top: 7px;
}
.pcom-about-history-step1 .pcom-about-history-col-illustration {
    text-align: right;
}
.pcom-about-history-step1 img {
    width: 450px;
}

.pcom-about-history-step2 {
    margin-top: 193px;
}
.pcom-about-history-step2 img {
    width: 500px;
}

.pcom-about-history-step2 .history-card {
    margin-right: 100px;
    margin-top: 93px;
}

.pcom-about-history-step3 {
    margin-top: 56px;
}
.pcom-about-history-step3 .pcom-about-history-col-illustration {
    text-align: right;
}
.pcom-about-history-step3 img {
    width: 450px;
}

.pcom-about-history-step3 .history-card {
    margin-left: 100px;
    margin-top: 82px;
}

.pcom-about-history-step4 {
    margin-top: 300px;
}
.pcom-about-history-step4 img {
    width: 450px;
}

.pcom-about-history-step4 .history-card {
    margin-right: 100px;
    margin-top: 154px;
}

.pcom-about-history-step5 {
    margin-top: 481px;
}

.pcom-about-history-step5 div {
    text-align: center;
}
.pcom-about-history-step5 .history-card {
    margin-left: -26px;
}
.pcom-about-history-step5 img {
    width: 500px;
    margin-top: 80px;
    margin-left: -26px;
}

.pcom-about-values {
    padding-bottom: 30px;
}

.pcom-about-values h2 {
    margin-top: 100px;
    margin-bottom: 50px;
}

.pcom-about-values-card {
    background-color: #fff;
    box-shadow: 0 1px 2px #ccc;
    border-radius: 10px;
    padding: 40px;
    text-align: center;
    margin: 20px 0;
}

.pcom-about-values-card.card-left {
    margin-left: 120px;
    margin-right: 5px;
}

.pcom-about-values-card.card-right {
    margin-left: 5px;
    margin-right: 120px;
}

.pcom-about-values-card img {
     width: 70px;
 }

.pcom-about-values-card h3 {
    margin: 30px 0;
    color: #3c3c3c;
    font-size: 25px;
    font-weight: 900;
}

.pcom-about-values-card p {
    text-align: left;
    color: #7e7e7e;
    font-weight: 700;
}

@media (max-width: 1200px) {
    .pcom-about-banner .col-md-3 {
        padding: 10px;
    }
    .pcom-about-banner-card .qty {
        font-size: 30px;
    }

    /* step 1 */
    .pcom-about-history-step1 .history-card {
        margin-left: 80px;
        margin-top: 31px;
    }
    .pcom-about-history-step1 img {
        width: 400px;
    }

    /* step 2 */
    .pcom-about-history-step2 {
        margin-top: 131px;
    }
    .pcom-about-history-step2 img {
        width: 450px;
    }
    .pcom-about-history-step2 .history-card {
        margin-right: 80px;
        margin-top: 106px;
    }

    /* step 3 */
    .pcom-about-history-step3 img {
        width: 400px;
    }
    .pcom-about-history-step3 .history-card {
        margin-left: 80px;
        margin-top: 40px;
    }

    /* step 4 */
    .pcom-about-history-step4 {
        margin-top: 200px;
    }
    .pcom-about-history-step4 .history-card {
        margin-right: 80px;
        margin-top: 157px;
    }

    /* step 5 */
    .pcom-about-history-step5 {
        margin-top: 350px;
    }
}

.pcom-about-history-border-left {
    border-left: none;
}

.pcom-about .icon-years {
    display: none;
}

@media (max-width: 991px) {
    .pcom-about-history {
        background: none;
    }
    .pcom-about-history-border-left {
        border-left: 5px solid #ffe9ee;
        margin-left: 50px;
    }
    .pcom-about .icon-years {
        display: block;
        float:left;
        width: 70px;
    }

    .pcom-about-history h2 {
        text-align: left;
        margin-bottom: 181px;
    }

    /* step 1 */
    .pcom-about-history-step1 {
        margin-top: -89px;
    }
    .pcom-about-history-step1 .icon-years {
        margin: 0 0 0 -38px;
    }
    .pcom-about-history-step1 .pcom-about-history-col-illustration {
        background-color: #f8f9fa;
    }
    .pcom-about-history-step1 .pcom-about-history-col-illustration img {
        width: 300px;
        margin-top: -168px;
    }
    .pcom-about-history-step1 .history-card {
        margin-left: 60px;
        margin-top: -22px;
        margin-right: 20px;
    }

    /* step 2 */
    .pcom-about-history-step2 {
        margin-top: 20px;
    }
    .pcom-about-history-step2 .pcom-about-history-col-illustration img {
        width: 250px;
        margin-left: 50px;
    }
    .pcom-about-history-step2 .icon-years {
        margin: 29px 0 0 -37px;
    }
    .pcom-about-history-step2 .history-card {
        margin: -84px 20px 0 60px;
    }

    /* step 3 */
    .pcom-about-history-step3 img {
        width: 200px;
    }
    .pcom-about-history-step3 .icon-years {
        margin: 43px 0 0 -37px;
    }
    .pcom-about-history-step3 .history-card {
        margin: 0 20px 0 60px;
    }

    /* step 4 */
    .pcom-about-history-step4 {
        margin-top: 20px;
    }
    .pcom-about-history-step4 .pcom-about-history-col-illustration img {
        width: 250px;
        margin-left: 50px;
    }
    .pcom-about-history-step4 .icon-years {
        margin: 5px 0 0 -37px;
    }
    .pcom-about-history-step4 .history-card {
        margin: 10px 20px 0 60px;
    }

    /* step 5 */
    .pcom-about-history-step5 {
        margin-top: 0;
    }
    .pcom-about-history-step5 .icon-years {
        margin: -3px 0 0 -37px;
    }
    .pcom-about-history-step5 .history-card {
        display: block;
        margin: 172px 20px 0 60px;
        text-align: left;
    }
    .pcom-about-history-step5 .pcom-about-history-col-illustration {
        background-color: #f8f9fa;
        margin-top: 7px;
        text-align: right;
    }
    .pcom-about-history-step5 .pcom-about-history-col-illustration img {
        width: 350px;
        margin-top: -275px;
        margin-left: -26px;
    }

    .pcom-about-values-card.card-left, .pcom-about-values-card.card-right {
        max-width: 500px;
        margin: 20px auto;
    }
}

@media (max-width: 767px) {
    .pcom-about-banner {
        padding: 0 30px;
    }
    .pcom-about-banner h1 {
        font-size: 30px;
        margin: 40px 0;
    }
    .pcom-about-banner .col-md-3 {
        padding: 5px;
    }

    .pcom-about .qty {
        font-size: 20px;
    }

    .pcom-about-banner-card {
        margin: 0;
    }

    .pcom-about-banner-card .pcom-label {
        height: 22px;
    }

    .pcom-about-history {
        margin-top: 30px;
    }

    .pcom-about-history-step1 .pcom-about-history-col-illustration img {
        width: 200px;
        margin-top: -106px;
    }

    .pcom-about-history-step5 .pcom-about-history-col-illustration img {
        width: 220px;
    }

/*    .pcom-about-history-step5 .icon-years {
        margin: 12px 0 0 -37px;
    }
*/
    .pcom-about-values h2 {
        margin-top: 40px;
        margin-bottom: 40px;
        text-align: center;
    }

    .pcom-about-values-card.card-left, .pcom-about-values-card.card-right {
        margin: 20px;
    }
}

@media (max-width: 523px) {
    .pcom-about-history-step5 .icon-years {
        margin: 12px 0 0 -37px;
    }
    .pcom-about-history-step5 .pcom-about-history-col-illustration img {
       margin-top: -275px;
    }
    .pcom-about-history-step5 .pcom-about-history-col-illustration {
        margin-top: 2px;
    }
}

@media (max-width: 373px) {
    .pcom-about-history-step5 .icon-years {
        margin: 32px 0 0 -37px;
    }
    .pcom-about-history-step5 .pcom-about-history-col-illustration img {
       margin-top: -306px;
   }
}

@media (max-width: 325px) {
    .pcom-about-history-step5 .icon-years {
        margin: 51px 0 0 -37px;
    }
    .pcom-about-history-step5 .pcom-about-history-col-illustration img {
       margin-top: -356px;
   }
}

/********
  * Why *
  *******/

.pcom-why {
    background-color: #f8f9fa;
    border-top: 2px solid #eee;
    margin-bottom: -50px;
    /*padding-bottom: 50px;*/
}

.pcom-why-banner {
    margin-bottom: 60px;
}

.pcom-why-banner h1 {
    text-align: center;
    font-size: 56px;
    font-weight: 900;
    color: #3c3c3c;
    margin: 80px 0;
}

.pcom-why-banner .pwg-tagline {
    text-align: center;
    color: #7e7e7e;
    font-weight: 700;
    max-width: 800px;
    margin: 0 auto 90px auto;
    font-size: 20px;
}

a.pcom-why-topmenu-card {
    display: block;
    border-radius: 10px;
    padding: 0 10px;
    text-align: center;
    background-color: #fff;
    box-shadow: 0 1px 2px #ccc;
    margin: 5px;
}

a.pcom-why-topmenu-card:hover {
    text-decoration: none;
    box-shadow: 0 1px 10px #ccc;
}

.pcom-why-topmenu-card img {
    width: 70px;
    margin-top: 30px;
}

.pcom-why-topmenu-card .pcom-label {
    margin: 20px 0;
    color: #3c3c3c;
    font-size: 16px;
    font-weight: 700;
}

.pcom-why-topmenu-card img.pcom-goto {
    width: 50px;
    margin-bottom: -27px;
    margin-top: 0;
}

.pcom-why h2 {
    font-size: 38px;
}

.pcom-why h2 img {
    width: 70px;
    margin-right: 20px;
}

.pcom-why p {
    font-weight: 600;
    max-width: 450px;
    font-size: 15px;
}

.pcom-why-gotomenu {
    margin-top:40px;
    text-align: right;
}
.pcom-why-gotomenu img {
    width: 60px;
}

@media (max-width: 1200px) {
    a.pcom-why-topmenu-card {
        margin: 0;
    }

    .pcom-why-topmenu-card .pcom-label {
        font-size: 15px;
    }
}

@media (max-width: 991px) {
    .pcom-why-banner h1 {
        margin: 40px 0;
    }
    .pcom-why-banner .pwg-tagline {
        margin: 0 25px 40px 25px;
        font-size: 16px;
        text-align: left;
    }
    .pcom-why-topmenu-card img.pcom-goto {
        display: none;
    }

    a.pcom-why-topmenu-card {
        padding: 10px;
        margin: 15px 10px;
        height: 70px;
    }

    .pcom-why-topmenu-card img {
        width: 50px;
        margin-top: 0;
        float: left;
        margin-right: 15px;
        margin-left: 5px;
    }

    .pcom-why-topmenu-card .pcom-label {
        margin: 0;
        font-size: 18px;
        text-align: left;
        line-height: 50px;
    }
}

@media (max-width: 767px) {
    .pcom-why-banner h1 {
        font-size: 30px;
    }
    .pcom-why-topmenu-card img {
        width: 35px;
        margin-top: 8px;
        margin-right: 5px;
        margin-left: 0;
    }

    a.pcom-why-topmenu-card {
        padding: 0 10px;
        margin: 15px 5px;
        height: 49px;
    }

    .pcom-why-topmenu-card .pcom-label {
        margin: 0;
        font-size: 14px;
        padding: 10px 0px;
        line-height: 30px;
    }

    .pcom-why h2 {
        font-size: 25px;
        text-align: center;
    }
    .pcom-why h2 img {
        display: block;
        margin: 10px auto;
    }
}

/* section affordable */
.pcom-why-affordable-header {
    height: 74px;
    background-image: url(../images/why/wave-affordable-top.png);
    background-repeat: repeat-x;
    background-position: bottom;
    /*margin-bottom: -1px;*/
    /*background-size: cover;*/
}

.pcom-why-affordable-footer {
    height: 101px;
    background-image: url(../images/why/wave-affordable-bottom.png);
    background-repeat: repeat-x;
    background-position: top;
}

.pcom-why-affordable-body {
    background-color: #ff2f63;
}

.pcom-why-affordable h2 {
    color: #f3f3f3;
    margin-bottom: 100px;
}

.pcom-why-affordable-illustration {
    text-align: center;
}
.pcom-why-affordable-illustration img {
    max-width: 400px;
}

.pcom-why-affordable p {
    color: #f3f3f3;
    font-weight: 700;
    margin-top: 35px;
}

.pcom-why-affordable p a {
    color: white;
    border-bottom: 1px solid white;
}
.pcom-why-affordable p a:hover {
    text-decoration: none;
}

@media (max-width: 991px) {
    .pcom-why-affordable h2 {
        margin-bottom: 40px;
    }
    .pcom-why-affordable p {
        max-width: none;
        padding: 0 50px;
    }
}

@media (max-width: 767px) {
    .pcom-why-affordable p {
        padding: 0 25px;
    }
}

/* section simplicity */

.pcom-why-simplicity h2 {
    margin: 50px 0 100px 0;
}

.pcom-why-simplicity p {
    margin-top: 70px;
    margin-left: 50px;
    color: #7e7e7e;
}

.pcom-why-simplicity-illustration img {
    max-width: 400px;
    margin-left: 20px;
}

@media (max-width: 991px) {
    .pcom-why-simplicity h2 {
        margin-bottom: 50px;
    }
    .pcom-why-simplicity-illustration {
        text-align: center;
    }
    .pcom-why-simplicity p {
        max-width: none;
        padding: 0 50px;
        margin-left: 0;
    }
}
@media (max-width: 767px) {
    .pcom-why-simplicity p {
        padding: 0 25px;
    }
}

/* section cloud */
.pcom-why-cloud-header {
    height: 170px;
    background-image: url(../images/why/wave-cloud-top.png);
    background-repeat: repeat-x;
    background-position: bottom;
}

.pcom-why-cloud-footer {
    height: 107px;
    background-image: url(../images/why/wave-cloud-bottom.png);
    background-repeat: repeat-x;
    background-position: top;
}

.pcom-why-cloud-body {
    background-color: #119ccc;
}

.pcom-why-cloud h2 {
    color: #f3f3f3;
    margin-bottom: 100px;
    margin-top: 0;
}
.pcom-why-cloud p {
    color: #f3f3f3;
    font-weight: 700;
    margin-left: 50px;
    margin-top: 30px;
}

@media (max-width: 991px) {
    .pcom-why-cloud h2 {
        margin-bottom: 50px;
    }
    .pcom-why-cloud-illustration {
        text-align: center;
    }
    .pcom-why-cloud-illustration img {
        max-width: 450px;
    }
    .pcom-why-cloud p {
        max-width: none;
        padding: 0 50px;
        margin-left: 0;
    }
}

@media (max-width: 767px) {
    .pcom-why-cloud p {
        padding: 0 25px;
    }
}

/* section support */
.pcom-why-support h2 {
    margin: 50px 0 100px 0;
}

.pcom-why-support p {
    margin-left: 50px;
    margin-bottom: 30px;
    color: #7e7e7e;
}

.pcom-why-support-illustration img {
    /*margin-top: 50px;*/
}

@media (max-width: 991px) {
    .pcom-why-support h2 {
        margin-bottom: 50px;
    }
    .pcom-why-support-illustration {
        text-align: center;
    }
    .pcom-why-support-illustration img {
        max-width: 600px;
    }
    .pcom-why-support p {
        max-width: none;
        padding: 0 50px;
        margin-top: 50px;
        margin-left: 0;
    }
}

@media (max-width: 767px) {
    .pcom-why-support p {
        padding: 0 25px;
    }
}

/* section security */
.pcom-why-security {
    margin-top: 50px;
    background-color: #4b4b4b;
}

.pcom-why-security h2 {
    color: #f3f3f3;
    margin: 100px 0;
}

.pcom-why-security-card {
    background-color: #575757;
    border-radius: 10px;
    box-shadow: 0 2px 2px #444;
    text-align: center;
    padding:40px;
    color: #e7e7e7;
    margin: 40px 0;
}

.pcom-why-security-cards-left {
    padding-left: 100px;
    padding-right: 20px;
}

.pcom-why-security-cards-right {
    padding-left: 20px;
    padding-right: 100px;
}

.pcom-why-security-card img {
    width: 70px;
}
.pcom-why-security-card h3 {
    font-weight: 800;
    line-height: 32px;
    margin-bottom: 23px;
}
.pcom-why-security-card p {
    color: #b1b1b1;
    text-align: left;
}

.pcom-why-security-cta {
    text-align: center;
    padding: 80px 20px 100px 20px;
}
.pcom-why-security-cta a.btn.pwg-cta {
    margin-top: 0;
}
.pcom-why-security-cta a.btn.pwg-cta:hover {
    box-shadow: 0 0 10px #222;
}

@media (max-width: 991px) {
    .pcom-why-security h2 {
        margin: 50px 0 30px 0;
    }
    .pcom-why-security-cards-left, .pcom-why-security-cards-right {
        padding: 0 40px;
    }
    .pcom-why-security-card {
        margin: 50px 0 0 0;
    }
}
@media (max-width: 767px) {
    .pcom-why-security h3 {
        font-size: 20px;
    }
}

/************
 * Solution *
 ************/

.pcom-solution-example-card {
    overflow: hidden;
    border-radius: 10px;
    border: 1px solid #ddd;
}

.pcom-solution-example-card .pcom-image {
    height: 260px;
    background-size: cover;
    background-position: center;
}

.pcom-solution-example-card-hotel .pcom-image {
    background-image: url(../images/solution_for_tourism/tourism-example-hotel-sd.jpg);
}
.pcom-solution-example-card-visits .pcom-image {
    background-image: url(../images/solution_for_tourism/tourism-example-visit-sd.jpg);
}
.pcom-solution-example-card-museum .pcom-image {
    background-image: url(../images/solution_for_tourism/tourism-example-museum.jpg);
}
.pcom-solution-example-card-ski .pcom-image {
    background-image: url(../images/solution_for_tourism/tourism-example-ski-station-sd.jpg);
}
.pcom-solution-example-card-administration .pcom-image {
    background-image: url(../images/solution_for_public_sector/public-sector-example-administration.jpg);
}
.pcom-solution-example-card-education .pcom-image {
    background-image: url(../images/solution_for_public_sector/public-sector-example-education.jpg);
}
.pcom-solution-example-card-gov .pcom-image {
    background-image: url(../images/solution_for_public_sector/public-sector-example-gov.jpg);
}
.pcom-solution-example-card-urban-agency .pcom-image {
    background-image: url(../images/solution_for_public_sector/public-sector-example-urban-agency.jpg);
}
.pcom-solution-example-card-agencies .pcom-image {
    background-image: url(../images/solution_for_companies/companies-example-agencies-sd.jpg);
}
.pcom-solution-example-card-ecommerce .pcom-image {
    background-image: url(../images/solution_for_companies/companies-example-ecommerce-sd.jpg);
}
.pcom-solution-example-card-goods .pcom-image {
    background-image: url(../images/solution_for_companies/companies-example-goods-industry-sd.jpg);
}
.pcom-solution-example-card-distribution .pcom-image {
    background-image: url(../images/solution_for_companies/companies-example-contruction-sd.jpg);
}
.pcom-solution-example-card-wedding .pcom-image {
    background-image: url(../images/solution_for_photographers/photographers-example-wedding-sd.jpg);
}
.pcom-solution-example-card-live-performance .pcom-image {
    background-image: url(../images/solution_for_photographers/photographers-example-live-performance-sd.jpg);
}
.pcom-solution-example-card-collection .pcom-image {
    background-image: url(../images/solution_for_photographers/photographers-example-collection-sd.jpg);
}
.pcom-solution-example-card-private-users .pcom-image {
    background-image: url(../images/solution_for_photographers/photographers-example-private-users-sd.jpg);
}

.pcom-solution-example-card .pcom-label {
    text-align: center;
    padding: 0 10px;
    font-size: 18px;
    color: #3c3c3c;
    font-weight: 700;
    height: 65px;
    display: table;
    width: 100%;
}

.pcom-solution-example-card .pcom-label span {
    display: table-cell;
    vertical-align: middle;
}

.pcom-solution-features {
    padding-left: 50px;
}
.pcom-solution-feature {
    margin-top: 100px;
    display: table;
}
.pcom-solution-feature .pcom-image {
    display: table-cell;
    vertical-align: middle;
}
.pcom-solution-feature .pcom-image img {
    width: 40px;
    margin-right: 40px;
}
.pcom-solution-feature .pcom-label {
    display: table-cell;
    vertical-align: middle;
    padding-right: 100px;
    font-size: 18px;
    font-weight: 700;
}

.pcom-solution-features-cta {
    text-align: center;
    margin-top: 50px;
}

.page-solution_for_photographers .pcom-solution-features-cta {
    margin-bottom: 100px;
}

.pcom-solution-logos {
    margin-top: 100px;
}
.pcom-solution-logos p {
    text-align: center;
    font-size: 18px;
}
.pcom-solution-logos .organization-content {
    padding: 0;
    margin: 30px 0;
}
.organization-content img.logo-oceanopolis {
    max-width: 180px;
}
.pcom-solution-logos .organization-content img.logo-siblu {
    max-width: 140px;
}
.pcom-solution-logos .organization-content img.logo-archea {
    max-width: 140px;
}
.pcom-solution-logos .organization-content img.logo-pnrlg {
    max-width: 108px;
}
.pcom-solution-logos .organization-content img.logo-ect {
    max-width: 150px;
}
.pcom-solution-logos .organization-content img.logo-ot33 {
    max-width: 100px;
}
.pcom-solution-logos .organization-content img.logo-indre {
    max-width: 100px;
}

.pcom-solution-quotes.home-love {
    padding-top: 70px;
    background: transparent url('../images/solution_for_tourism/tourism-quotes-background-sd.jpg') center center no-repeat;
    background-size: cover;
}

.pcom-solution-quotes.home-love.pcom-solution-quotes-companies {
    background: transparent url('../images/solution_for_companies/companies-quotes-background-sd.jpg') center center no-repeat;
    background-size: cover;
}
.pcom-solution-quotes.home-love.pcom-solution-quotes-public-sector {
    background: transparent url('../images/solution_for_public_sector/public-sector-quotes-background-sd.jpg') center center no-repeat;
    background-size: cover;
}
.pcom-solution-quotes.home-love.pcom-solution-quotes-photographers {
    background: transparent url('../images/solution_for_photographers/photographers-quotes-background-sd.jpg') center center no-repeat;
    background-size: cover;
}

.pcom-solution-start {
    text-align: center;
    margin-top: 100px;
}
.pcom-solution-start .pwg-cta {
    margin: 100px 0;
}

@media (max-width: 1199px) {
    .pcom-solution-example-card .pcom-image {
        height: 210px;
    }
}
@media (max-width: 991px) {
    .pcom-solution-examples {
        padding: 0 30px;
    }
    .pcom-solution-example-card {
        margin-bottom: 30px;
    }
}
@media (max-width: 767px) {
    .pcom-solution-features {
        margin-top: 0;
        padding: 0 30px;
    }
    .pcom-solution-feature {
        margin-top: 50px;
    }
    .pcom-solution-feature .pcom-image img {
        margin-right: 30px;
    }
    .pcom-solution-feature .pcom-label {
        padding-right: 0;
    }
}

/***********
 * Page Clients *
 ***********/


#client-page{
  background-color:white;
  z-index:-1;
  text-align:center;
  margin-bottom: -50px;
  padding-bottom:30px;
}

#client-page .container-fluid{
  padding:0;
}

section{
  padding-top:40px;
}

.pcom-client-icam .pcom-product-start{
  padding-top:80px!important;
}


#client-page #first-section{
  padding-bottom:20px;
  position:relative;
}

#client-page #first-section .container{
    position:relative;
}

#client-page #second-section-content{
  background-color:#ffe2e8;
}

#client-page #second-section-content h2{
  color:#ef4069;
}
#client-page #second-section-content h3{
  color:#ef4069;
  padding:0 70px;
}

#client-page #third-section-content{
  background-color:rgb(255, 255, 255);
}

#client-page #fourth-section-content{
  background-color:rgb(126, 114, 192, 0.5);
}

#client-page #fourth-section-content h2{
  color:#4B4473;
}

#second-section, #third-section, #fourth-section{
  position: relative!important;
  text-align: center;
}

#client-page h1{
  font-size: 56px;
  font-weight: 900;
  color: #3c3c3c;
  line-height: 76px;
  transition: all 1s;
  text-align:left;
  margin:0;
  padding:0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

br {
    display: none;
}

@media (max-width: 991px){
  #client-page h1{
    font-size:30px;
    line-height:40px;
    padding:0 25px;
    text-align:left;
    max-width:100%;
    position: inherit;
    top: inherit;
    transform: inherit;
    width:100%;
  }
  #client-page h2{
    font-size:38px;
  }
}

.client-page .first-section{
    position:relative;
}

.h1-container-client-page{
    position:absolute;
    top: 50%;
    transform:translateY(-50%);
}

.first-image-client-page-container{
    float:right;
}

.first-image-client-page-container img{
  width:100%;
}

#client-page #first-image{
  display:block;
  margin: 50px auto;
  margin-top: 30px;
  z-index:1;
  float:right;
}

#client-page #first-image img{
    width:80%;
}

#client-page h2{
  text-align:center;
  margin: 30px;
  font-size: 40px;
  font-weight: 900;
  color: #3c3c3c;
  line-height: 1.1;
  transition: all 1s;
  z-index:1;
}

#client-page h3{
  text-align:center;
  color: #7e7e7e;
  font-size: 20px;
  font-weight: 700;
  line-height: 28px;
  transition: all 1s;
  z-index:1;
  margin:5px 0;
}
#section-client-use-case{
  margin:15px auto;
  width:90%;
}

 #fourth-section .avis{
  font-size:15px!important;
  font-weight:600;
}

 .client-user-case-summary{
   font-size:14px;
   font-weight:600;
   margin-top:15px;
   min-height:190px;
 }

 .client-user-case-quote{
   font-size:12px;
   font-style:italic;
   color:#868686;
   margin-top:15px;
   min-height:140px;
 }

.client-use-case{
  display:inline-block;
  background-color:white;
  height:auto;
  padding:20px;
  text-align:left;
  box-shadow: 0px 0px 10px #ffb0bf;
  margin:15px 0;
}

.logo-client-use-case{
  height:86px;
  width:100%;
  margin:0 auto;
  display:block;
  object-fit:contain;
}

.clientUserCaseTextContainer{
  position:relative;
  height:100%;
  display:block;
}

.client-use-case button {
  background-color:white;
  color:#e73b65;
  border:1px solid #e73b65;
  padding:10px;
  font-size:15px;
  font-weight:700;
  margin-top:17px;
}
.client-use-case button:hover{
  background-color:#ef4069;
  color:white;
  transition: background-color 0.2s ease-out;
    -webkit-transition: background-color 0.2s ease-out;
    -moz-transition: background-color 0.2s ease-out;
}

.read-case-button{
  margin:0 auto
}
#clientusecase5 .client-user-case-quote,
#clientusecase5 .client-user-case-summary{
 min-height:auto
}

#clientusecase5 .client-use-case{
  width:100%;
}

@media (min-width:1200px){
  .client-user-case-quote{
    min-height:103px;
  }
  .client-user-case-summary{
    min-height:130px;
  }
}

@media (max-width:991px){
  .client-user-case-summary, .client-user-case-quote{
    min-height:auto;
  }
  .read-case-button{
    text-align:center;
  }
  #clientusacase1 img, #clientusecase2 img, #clientusecase3 img, #clientusecase4 img, #clientusecase5 img{
    height:100px;
    object-fit:contain;
  }
}

@media (max-width:580px){
  .client-use-case button{
    margin-top:15px !important;
  }
}

/*
#client-page p{
  margin:15px;
}*/

.client-logos{
  width:100%;
}

.client-logos img{
  width:150px;
  padding:20px;
  z-index:1;
}

.speech-bubble{
    float:left;
}

.citation{
  background-color:white;
  text-align: center;
  text-align: center;
  padding:40px;
  margin-top:50px;
  margin-bottom:0;
}

#speech-bubble-triangle{
  width:50px;
}


.speech-triangle1:before {
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  border-left: 15px solid white;
  border-right: 15px solid transparent;
  border-top: 15px solid white;
  border-bottom: 15px solid transparent;
  left: 30px;
  bottom: -19px;
}
.speech-triangle2:before {
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  border-left: 15px solid transparent;
  border-right: 15px solid white;
  border-top: 15px solid white;
  border-bottom: 15px solid transparent;
  right: 100px;
  bottom: -19px;
}
.speech-triangle3:before {
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  border-left: 15px solid white;
  border-right: 15px solid transparent;
  border-top: 15px solid white;
  border-bottom: 15px solid transparent;
  left: 150px;
  bottom: -19px;
}

.author-avis{
  font-size:14px;
  font-weight:700;
  color:#7e7e7e;
  line-height:19px;
  margin-top:20px;
}


#client-page .author-avis p{
    margin:0;
}

#client-page .avis{
    padding-top:15px;
    margin:0;
}

#subscribe-button{
  position:relative;
}

.image-pers{
  height:400px;
  padding:0 20px;
}

@media (max-width:850px){
  .image-pers{
    height:200px;
  }
}

@media (max-width:640px){
  .image-pers{
    height:100px;
  }
}

@media (max-width:510px){
  .image-pers{
    display:none;
  }
}

#client-page .pcom-solution-start{
  display:inline-block;
  width:90%;
  margin:0 auto;
  padding:0;
}

.quotes-type1{
  width:30px;
  transform: rotate(180deg);
  float:left;
}


.quotes-type2{
  width:30px;
  transform: rotate(180deg);
  display:block;
  position:absolute;
  top:75px;
  left:40px;
}

.quotes-type3{
  width:30px;
  position:absolute;
  right:40px;
}

#fourth-section #pers1{
  height:200px;
  float:left;
  transform: scaleX(-1);
  position:relative;
  display:block;
  top:70px;
  left:0;
  z-index: 1;
}

.pers1-bubble{
  padding-left:0;
}

#fourth-section #pers2{
  height:200px;
  float:right;
  transform: scaleX(-1);
  position:relative;
  display:block;
  top:130px;
  right:0;
  z-index: 1;
}
#fourth-section #pers5{
  height:200px;
  float:right;
  transform: scaleX(-1);
  position:relative;
  display:block;
  top:-420px;
  right:0;
  z-index: 1;
}

#fourth-section #pers6{
  height:200px;
  float:right;
  position:relative;
  display:block;
  top:90px;
  right:0;
  z-index: 1;
}

@media (max-width:600px){
  #section-client-use-case p, #fourth-section .avis{
    font-size:12px!important;
  }
  .client-logos img{
    width:100px!important;
  }
}

@media (max-width:500px){
  #fourth-section #pers2{
    height:140px;
  }
  #fourth-section #pers1{
    height:95px;
  }
  #fourth-section #pers6{
    height:135px;
  }
}

/*************
 * Client Indre *
 **************/

 .pcom-client-indre {
    padding-top: 80px;
    margin-bottom: -50px;
    background-color: #f8f9fa;
    border-top: 2px solid #eee;
}

.pcom-client-indre p {
    font-size: 15px;
    color: #777;
    font-weight: 600;
}

.pcom-client-quote {
    max-width: 950px;
    background-image: url(../images/client_indre/indre-logo.png);
    background-repeat: no-repeat;
    background-size: 200px;
}

.client-indre-logo-mobile-display{
    display:none;
}

.client-quote {
    background-color: #fff;
    border: 1px solid #eee;
    padding: 40px 50px;
    margin: 33px 0 0 166px;
    box-shadow: 3px 3px 5px rgba(33, 33, 33, 0.2);
    background-image: url(../images/client_icam/quotes.svg);
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: 14px 22px;
}

.client-quote-message {
    font-size: 33px;
    font-weight: 300;
}

.client-quote-caption {
    margin-top: 20px;
    color: #777;
    font-size: 16px;
}

.pcom-client-intro {
    max-width: 780px;
    margin-top: 40px;
    margin-bottom: 80px;
}
.pcom-client-intro-title{
    max-width: 780px;
    padding:0 15px;
}

.pcom-client-intro-title h1 {
    font-size: 38px;
    font-weight: 900;
    margin-bottom: 80px;
}

.pcom-client-indre .pcom-client-full-width-banner {
    height: 180px;
    background-image: url(../images/client_indre/full-width-background.jpg);
    background-size: cover;
    background-position: center;
}

.pcom-client-content {
    max-width: 780px;
}

.pcom-client-content h2 {
    font-size: 24px;
    font-weight: 900;
    margin-bottom: 40px;
    text-align: left;
    margin-top: 50px;
}

.pcom-client-content .client-screenshot {
    width: 100%;
    margin: 80px 0;
}

.pcom-client-photos {
    margin-top: 65px;
    margin-bottom: 80px;
    padding:15px 0;
}

.pcom-client-photos div.col-md-6:first-child {
    padding-right: 6px;
}

.pcom-client-photos div.col-md-6:nth-child(2) img:first-child {
    margin-bottom: 22px;
}

.pcom-client-photos img {
    width: 100%;
}

.copyright-ect-images{
    padding-left:15px;
}

.pcom-client-photos-ect{
  position:relative;
}

.pcom-client-content .client-quote {
    margin: 80px 0 0 0;
    padding: 60px 70px 40px 70px;
    background-size: 38px;
    background-position: 31px 30px;
}

.pcom-client-content .client-quote .client-quote-message {
    font-size: 20px;
}
.pcom-client-content .client-quote .client-quote-caption {
    font-size: 14px;
}

.pcom-client-indre .pcom-solution-start {
    margin-top: 0;
}

.strangeNumbers {
    word-spacing: -2px;
    white-space: nowrap;
}

@media (max-width:768px){
    .pcom-client-indre{
        padding-top:40px;
    }
    .pcom-client-quote{
        background-image:none;
    }
    .client-quote{
        margin: 80px 0 0 0;
        padding: 60px 70px 40px 70px;
    }
    .client-indre-logo-mobile-display{
        display:block;
        width: 200px;
        margin: 0 auto;

    }
}

/*************
 * Client Icam *
 **************/

.pcom-client-icam {
   background-color:#f8f9fa;
   z-index:-1;
   margin-bottom: -50px;
   padding-bottom:30px;
 }

 .pcom-client-icam .pcom-client-intro {
    margin-top: 0px;
}

 .pcom-client-icam  .logo-icam{
   height:280px;
  padding-bottom:80px;
}

.pcom-client-icam .pcom-client-content{
    padding-top:80px!important;
}

 .pcom-client-icam .pcom-client-full-width-banner {
     height: 300px;
     background-image: url(../images/client_icam/panorama.jpg);
     background-size: cover;
     background-position: left;
 }

  .pcom-client-icam .icam-logo{
    position: absolute;
    width: 190px;
    right: 410px;
  }

 .pcom-client-icam .chiffres-cles{
   float:left;
   background-color: #fff;
   border: 1px solid #eee;
   padding: 40px 50px;
   box-shadow: 3px 3px 5px rgba(33, 33, 33, 0.2);
   text-align:center;
 }

.pcom-client-icam .chiffres{
  float:left;
  background-color: #fff;
  border: 1px solid #eee;
  padding: 10px;
  text-align:center;
  box-shadow: 3px 3px 5px rgba(33, 33, 33, 0.2);
  height:150px;
  margin-top:30px;
  vertical-align: middle;
  display: flex;
  flex-direction: column;
  justify-content: center;
  z-index:0;
}
.pcom-client-intro h1{
  padding:0 15px;
}

.pcom-client-icam h2, .pcom-client-indre h2, .pcom-client-ect h2, .pcom-client-cotentin h2{
  font-size: 30px !important;
}


.pcom-client-icam h2 {
  margin:0 !important;
  padding:0;

}

.pcom-client-icam p {
  font-size: 15px;
  color: #777;
  font-weight: 600;
  padding:15px 0;
}

.chiffres-grand{
  font-size:30px;
  font-weight:700;
}

.chiffres-tag{
  font-size:15px;
}

.left-ring1{
  height:65px;
  position:absolute;
  top:-47px;
  left:7px;
  z-index:1;
}

.right-ring1{
  height:40px;
  position:absolute;
  top:-35px;
  left:23px;
  z-index:-1;
}

.left-ring2{
  height:65px;
  position:absolute;
  top:-47px;
  right:20px;
  z-index:1;
}

.right-ring2{
  height:40px;
  position:absolute;
  top:-35px;
  right:7px;
  z-index:-1;
}

.pcom-client-icam .pcom-client-intro  p{
    padding-top:0;
  }


@media (max-width: 991px){
  .pcom-client-icam .icam-logo{
    position:relative;
    right:0;
  }
  .pcom-client-icam h2, .pcom-client-indre h2, .pcom-client-ect h2, .pcom-client-cotentin h2{
    font-size:20px!important;
  }

  .pcom-client-content .client-quote .client-quote-message{
    font-size:17px;
  }
  .pcom-client-photos div.col-md-6:first-child{
    padding:15px;
    padding-top:0;
  }
  .pcom-client-icam .chiffres-cles h2{
    text-align:center!important;
  }
  .pcom-client-icam  .logo-icam{
    height:200px;
 }
}
@media (max-width: 530px){
  .chiffres-grand {
    font-size: 10px;
    font-weight: 700;
  }
  .chiffres-tag {
    font-size: 7px;
  }
  .pcom-client-icam .chiffres{
    height:90px;
  }
  .pcom-client-icam .pcom-client-full-width-banner{
    height:150px;
  }
  .pcom-client-icam  .logo-icam{
    height:200px;
 }
}

@media (max-width: 760px){
  .chiffres-cles-container{
    padding:0;
  }
  .left-ring1, .right-ring1, .left-ring2, .right-ring2{
    display:none;
  }
  .pcom-client-icam .pcom-client-intro  p{
    padding-top:30px;
  }
  .pcom-client-icam .chiffres{
    margin-bottom:0px!important;
  }
}

/*************
 * Client ECT *
 **************/

 .pcom-client-ect .pcom-client-full-width-banner {
    height:224px;
    background-image: url(../images/client_ect/full-width-background.jpg);
    background-size: cover;
    background-position: left;
 }

.pcom-client-ect #first-picture{
  height:auto;
  padding-right: 0;
}

 .pcom-client-ect .pcom-client-intro h1, 
 .pcom-client-cotentin .pcom-client-intro h1,
 .pcom-client-wessex-water .pcom-client-intro  h1{
   padding:0;
 }

.pcom-client-ect .pcom-client-intro p,
.pcom-client-wessex-water .pcom-client-intro p{
  margin-top:40px;
}

.pcom-client-ect .pcom-client-content .quote1{
  margin:0;
}

.pcom-client-ect .client-screenshot{
  width:100%;
  margin:80px 0;
  max-width:1050px;
}

.pcom-client-ect .pcom-solution-start, .pcom-client-cotentin .pcom-solution-start{
  margin:0;
  width:100%;
}

.pcom-client-ect p,
.pcom-client-wessex-water p{
  font-size: 15px;
   color: #777;
   font-weight: 600;
}

.pcom-client-ect .pcom-product-start h2{
  margin-top: 50px;
  margin-bottom: 0;
}

#logo-ect{
  padding:0;
}

.ect-logo-and-photo{
  margin:40px 0;
}

@media (max-width: 991px){
  .pcom-client-ect .pcom-client-content h2{
    margin-left:0;
    padding-left:0;
  }
}


/*************
 * Client Cotentin*
 **************/

 .pcom-client-cotentin .pcom-client-full-width-banner {
    height:314px;
    background-image: url(../images/client_cotentin/banner.jpg);
    background-size: cover;
    background-position: right;
 }

 .pcom-client-cotentin .client-screenshot{
   width:100%;
   max-width:1095px;
 }

 #logo-cotentin{
   max-width:300px;
   padding:40px 0;
 }

 .pcom-client-cotentin .pcom-client-intro p{
   margin-top:30px;
 }

 .pcom-client-cotentin p{
   font-size: 15px;
    color: #777;
    font-weight: 600;
 }

.pcom-client-cotentin .pcom-client-content {
  padding:0;
}

.pcom-client-cotentin .pcom-client-photos{
    padding:0;
  }

.pcom-client-cotentin  .pcom-client-content h2{
    margin-top:80px;
  }

.pcom-client-cotentin .pcom-product-start h2{
    margin-top: 50px;
    margin-bottom: 0;
  }

 @media (max-width: 991px){
   .pcom-client-cotentin .pcom-client-content h2{
     margin-left:0;
     padding-left:0;
   }
 }

/******************
Client Wessex Water
*******************/

.pcom-client-wessex-water .client-screenshot{
  box-shadow: 0 0 10px #ccc;
}

.pcom-client-wessex-water .client-mockup{
  margin-top:80px;
  width:100%;
}

.pcom-client-wessex-water .pcom-client-full-width-banner{
  height: 250px;
  background-image: url(../images/client_wessex_water/banner.jpg);
  background-size: cover;
  background-position: top center;
}

/*******
 * 404 *
 *******/

.pwg-banner.pcom-404 {
    margin-top: 100px;
    margin-bottom: 100px;
}

.pwg-banner.pcom-404 img {
    width: 100%;
    height: auto;
}

.pwg-banner.pcom-404 .pwg-tagline {
    padding-right: 100px;
}

/*********************
 * Piwigo footer CSS *
 *********************/

footer {
    margin-top: 50px;
    background-color: #3c3c3c;
    color: #ddd;
}

/* Footer container-fluide */

.footer {
    padding-top: 80px;
    padding-bottom: 40px;
}

@media (max-width: 991px) {
    .footer {
        padding-top: 40px;
    }
}

/* language switch */

.footer-language {
    text-align: right;
}

.footer-language li a {
    color:#f3f3f3;
}

.footer-language li a:hover {
    color:white;
}

.footer-language .glyphicon {
    font-size: 16px;
    margin-top: -2px;
    vertical-align: middle;
    margin-left: 10px;
}

@media (max-width: 991px) {
}

.footer-language li {
    list-style-type: none;
    font-size: 12px;
    font-weight: 600;
    line-height: 28px;
}

.footer-language a {
    color: #ff3363;
    text-decoration: none;
}

.footer-language .dropdown-menu {
    right:0;
    left:unset !important;
    background-color: #333;
    min-width: initial;
    text-align: right;
}

.footer-language .dropdown-menu::before, .footer-language .dropdown-menu::after {
    display: none;
}

.footer-language .dropdown-menu li:hover {
    background-color: white;
}

.footer-language .dropdown-menu li a {
    font-weight: 600;
}

.footer-language .dropdown-menu li:hover a {
    color:#3c3c3c;
}
/* Elements in a list Discover - extension ... */

.footer-list ul {
    padding-left: 0px;
    list-style-type: none;
}

.footer-list ul li {
    margin-top: 9px;
}

.footer-list a {
    color: #ddd;
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
}

.footer-list a:hover {
    color:#fff;
}

.footer-list h5 {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 20px;
}

.blog_post_since {
    color:#bbb;
    font-size: 12px;
    font-weight: 600;
}

@media (max-width: 991px) {
    .footer-list {
        padding-bottom: 40px;
    }

    .footer-blog ul li a {
        max-width: 70%;
        overflow: hidden;
        text-overflow: ellipsis;
        display: inline-block;
        white-space: nowrap;
    }

    .blog_post_since {
        vertical-align: top;
        height: 23px;
        display: inline-block;
        line-height: 23px;
        padding-left: 5px;
    }
}

/* Bottom line */
.pcom-footer-bottom-line {
    margin-top: 80px;
}

@media (max-width: 991px) {
    .pcom-footer-bottom-line {
        margin-top: 0;
    }
}

.pcom-social {
    padding: 0 10px;
}

.pcom-social a i {
    font-size: 20px;
    color: #ff3363;
}

.pcom-copyright {
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    line-height: 28px;
    padding: 0;
}
