body {

    margin: 0;

    padding: 0;

    overflow-x: hidden;

    font-family: Arial, Helvetica, sans-serif;

    color: rgb(51, 51, 51);

    background-color: rgb(242, 242, 242);



}



* {

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

}



h1,

h2 {

    margin: 0;

    padding: 0;

}



.divToScale:hover {

    transform: scale(1.05);

    -webkit-transform: scale(1.05);

    -ms-transform: scale(1.05);



}



.colorLogo {

    color: rgb(217, 25, 24);

    font-size: 90%;

}



.bigger {

    font-size: 120%;

}



.container-page {

    width: 100vw;

    height: auto;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

    -ms-flex-direction: column;

    flex-direction: column;

}



/* MENU /*/



.pseudoLogo {

    width: 30%;

    -ms-flex-item-align: center;

    -ms-grid-row-align: center;

    align-self: center;

    font-size: 1.75em;

}



.pseudoLogo i {

    padding: .7em;

}



nav {

    height: 10vh;

    width: 100%;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: horizontal;

    -webkit-box-direction: normal;

    -ms-flex-direction: row;

    flex-direction: row;

    -webkit-box-align: center;

    -ms-flex-align: center;

    align-items: center;

    -webkit-box-pack: end;

    -ms-flex-pack: end;

    justify-content: flex-end;

    position: fixed;

    background-color: white;

    z-index: 2;

}



nav ul {

    padding: 0 3em;

    margin: 0;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: horizontal;

    -webkit-box-direction: normal;

    -ms-flex-direction: row;

    flex-direction: row;





}



nav li {

    margin: .5em;

    padding: .7em;

    border-top: 3px solid transparent;

    list-style-type: none;

    -webkit-transition: border-top .5s linear;

    -o-transition: border-top .5s linear;

    transition: border-top .5s linear;



}



nav li:hover {

    border-top: 3px solid rgb(51, 51, 51);

}



nav .active {

    border-top: 3px solid rgb(217, 25, 24);

}



a {

    text-decoration: none;

    text-transform: uppercase;

    font-weight: bold;

    color: rgb(51, 51, 51);



}





/* main-section /*/

.tableauPlaceholder{

    margin-top: 10vh;

}

.main-section {

    width: 100%;

    height: 90vh;

    margin-top: 10vh;

    display: -ms-grid;

    display: grid;

   grid-template-rows: 0.5fr 1fr 1fr 0.5fr;

   grid-template-columns: 0.5fr 3fr 2fr 0.5fr;

    grid-gap: 2em;

}



.main-section {

    color: white;

}



section div {

    box-shadow: 3px 3px 5px rgb(51, 51, 51);

    -webkit-box-shadow: 3px 3px 5px rgb(51, 51, 51);

}



.main-section-heading {

    padding: 1.5em;

    grid-area: 2/2/4/3;

    -webkit-transition: all .2s linear;

    -o-transition: all .2s linear;

    transition: all .2s linear;

    -webkit-box-ordinal-group: 2;

    -ms-flex-order: 1;

    order: 1;

    background-color: rgb(217, 25, 24);

}



.main-section-heading-list {

    border: none;

}



.main-section-client::after {

    content: "";

    width: 100%;

    height: 100%;

    display: block;

    background: url("../img/analysis.jpeg") center/cover no-repeat scroll;

    -webkit-filter: blur(1.5px);

    filter: blur(1.5px);

    -webkit-transition: all .5s linear;

    -o-transition: all .5s linear;

    transition: all .5s linear;

}



.main-section-client:hover::after {

    -webkit-filter: blur(0);

    filter: blur(0);

}



.main-section-accepter {

    grid-area: 2/3/3/4;

    position: relative;

    -webkit-box-ordinal-group: 3;

    -ms-flex-order: 2;

    order: 2;

    -webkit-transition: all .2s linear;

    -o-transition: all .2s linear;

    transition: all .2s linear;

}



.main-section-accepter::after {

    content: "";

    display: block;

    background: url("../img/card.jpg") center/cover no-repeat scroll;

    width: 100%;

    height: 100%;

    -webkit-filter: blur(1.5px);

    filter: blur(1.5px);

    -webkit-transition: all .5s linear;

    -o-transition: all .5s linear;

    transition: all .5s linear;

}



.main-section-accepter:hover::after {

    -webkit-filter: blur(0);

    filter: blur(0);

}



.main-section-client {

    -webkit-box-ordinal-group: 4;

    -ms-flex-order: 3;

    order: 3;

    -webkit-transition: all .2s linear;

    -o-transition: all .2s linear;

    transition: all .2s linear;

    grid-area: 3/3/4/4;

    position: relative;

    background: url("../img/analysis.jpeg") center/cover no-repeat scroll;





}



.footer-main-section {

    width: 100%;

    position: absolute;

    bottom: 5%;

    z-index: 1;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: horizontal;

    -webkit-box-direction: normal;

    -ms-flex-direction: row;

    flex-direction: row;

}



footer h2 {

    width: 72%;

    text-align: center;

    text-shadow: 3px 3px 17px rgb(51, 51, 51);

}



.btn-goTo {

    border: none;

    color: white;

    background-color: rgba(217, 25, 24, 0.7);

    padding: .3em .6em;

    width: 28%;

    text-align: center;

    -webkit-transition: background-color .5s linear;

    -o-transition: background-color .5s linear;

    transition: background-color .5s linear;

}



.btn-goTo i {

    font-size: 100%;

}



.btn-goTo:hover {

    background-color: rgba(217, 25, 24, 1);

}



footer {

    padding: .3em;

    background-color: rgb(217, 25, 24);

    text-align: center;

    color: white;

}





.headerAnalysisOfShopClients,

.headerAnalysisCardAccepter {

    width: 100%;

    height: 50vh;

    margin-top: 10vh;

    position: relative;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-pack: center;

    -ms-flex-pack: center;

    justify-content: center;

    -webkit-box-align: end;

    -ms-flex-align: end;

    align-items: flex-end;

}



.headerAnalysisOfShopClients::after {

    content: "";

    width: 100%;

    height: 100%;

    position: absolute;

    -webkit-filter: grayscale(100%) brightness(40%) sepia(100%) hue-rotate(-50deg) saturate(500%) contrast(0.9);

    filter: grayscale(100%) brightness(40%) sepia(100%) hue-rotate(-50deg) saturate(500%) contrast(0.9);

    background: url("../img/analysisbig.jpeg") center/cover no-repeat fixed;

}



.headerAnalysisCardAccepter::after {

    content: "";

    width: 100%;

    height: 100%;

    position: absolute;

    -webkit-filter: grayscale(100%) brightness(40%) sepia(100%) hue-rotate(-50deg) saturate(500%) contrast(0.9);

    filter: grayscale(100%) brightness(40%) sepia(100%) hue-rotate(-50deg) saturate(500%) contrast(0.9);

    background: url("../img/cardbig.jpg") center/cover no-repeat fixed;

}



.headingTextContent {

    padding-bottom: 2em;

    z-index: 1;

    color: white;

    text-align: center;

    text-shadow: 3px 3px 17px rgb(51, 51, 51);

}



.client-analisis-section,

.accpater-analisis-section {

    padding: 2em 3em;

    color: white;

    background-color: rgb(217, 25, 24);

}





.mainWis{

    width: 100vw;

    height: auto;

    position: relative;

    height: 1000px;

}



.containerTablo {

    margin: 2em 0 1em 0;

   position: absolute;

   top:50%;

   left: 50%;

   transform: translate(-50%,-50%);

    box-shadow: none;

    -webkit-box-shadow: none;



}



@media (max-width: 768px){



    body {

        width: 100vw;

        height: auto;

        overflow: scroll;

        max-width:100vw;

    }



    .container-page {

        display: flex;

        flex-direction: column;



    }



    nav {

        display: flex;

        flex-direction: column;

        width: 100vw;

        height: auto;

    }



    .pseudoLogo {

        text-align: center;

        width: 100vw;

    }



    main {

        width: 100vw;

        display: flex;

        flex-direction: column;



    }



    .main-section {

        margin-top: 25vh;

        display: flex;

        flex-direction: column;

        height: auto;

        width: 100vw;

    }



    .main-section div {

        width: 100vw;

        height: 50vh;

    }

}

@media (max-width: 384px){



}