/*mise en pahe globale*/
        h2 {
            text-transform: uppercase;
            font-family: "Philosopher";
            font-weight: bold;
        }        /*bouton entete*/
    
        
        /*footer*/
        .footer {
            background: linear-gradient(135deg, #2c5364, #0f2027);
            color: white;
            border-radius: 20px 20px 0 0;
        }
        .footer-logo img {
            width: 60px;
        }
        .footer-link {
            text-decoration: none;
            color: white;
        }
        .footer-contact .btn {
            border: 2px solid #4caf50;
            color: #4caf50;
        }
        .footer-contact .btn:hover {
            background-color: #4caf50;
            color: white;
        }
        
        /*bouton 3D*/
        /** {
	    margin: 0;
	    padding: 0;
	    box-sizing: border-box;
        }

        /*body {
	    height: 100vh;
	    overflow: hidden;
	    display: flex;
	    flex-direction: column;
	    align-items: center;
	    justify-content: center;
	    background: #333;
        }*/

        .noselect {
            -webkit-touch-callout: none;
            -webkit-user-select: none;
            -khtml-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
		    -webkit-tap-highlight-color: transparent;
        }

        .buttonD {
	        width: 150px;
	        height: 50px;
	        cursor: pointer;
	        background: transparent;
	        margin: 10px;
	        border: none;
	        border-radius: 10px;
	        box-shadow: -5px -5px 15px #444, 5px 5px 15px #222, inset 5px 5px 10px #444, inset -5px -5px 10px #222;
	        color: #222;
	        font-size: 16px;
    }
        .buttonW {
	        width: 150px;
	        height: 50px;
	        cursor: pointer;
	        background: transparent;
	        margin: 10px;
	        border: none;
	        border-radius: 10px;
	        box-shadow: -5px -5px 15px #b5b8d1, 5px 5px 15px #b5b8d1, inset 5px 5px 10px #b5b8d1, inset -5px -5px 10px #b5b8d1;
	        color: #b5b8d1;
	        font-size: 16px;
    }

        .buttonD:hover {
	        box-shadow: -5px -5px 15px #444, 5px 5px 15px #222, inset 5px 5px 10px #222, inset -5px -5px 10px #444;
	        font-size: 15px;
	        transition: 500ms;
    }
        .buttonW:hover {
	        box-shadow: -5px -5px 15px #b5b8d1, 5px 5px 15px #b5b8d1, inset 5px 5px 10px #b5b8d1, inset -5px -5px 10px #b5b8d1;
	        font-size: 15px;
	        transition: 500ms;
    }

        button:focus {
	        outline: none;
        }

        .red:hover {
	        color: #f07171;
	        text-shadow: 0px 0px 10px #f07171;
        }

        .green:hover {
		    color: #93f071;
	        text-shadow: 0px 0px 10px #93f071;
        }

        .blue:hover {
	        color: #71b7f0;
	        text-shadow: 0px 0px 10px #71b7f0;
        }

        .purple:hover {
	        color: #b971f0;
	        text-shadow: 0px 0px 10px #b971f0;
        }

        /*button {
            padding: 1em 2em;
            background-color: #152242;
            border: none;
            border-radius: 1000px;
            font-family: 'phylosophy';
            color: white;
            position: relative;
            z-index: 1;

            display: flex;
            justify-content: center;
            align-items: center;            
        }

        button::after {
            content: '' ;
            position: absolute;
            height: 107%;
            width: 104%;
            border-radius: 1000px;
            background-image: linear-gradient(to bottom right, #fb0094, #0000ff);
            z-index: 0;
        }
        button:hover{
            z-index: 0;
            box-shadow: 40 0 100px  #fb0094, -40 0 100px  #280a8a;
        }
        .buttondiv {
            background-color: #280a8a;
            min-height: 100vh;
            display: flex;
            justify-content: center;
            align-items: center;
            box-shadow: inset;
        }*/
        

        .buttonpint{
            position: relative;
            display: flex;
            align-items: center;
            justify-content: center;
            /*width: 180px;
            height: 60px;*/
            background-color: transparent;
            color: #222;
            text-decoration: none;
            font-family: "Nunito Sans", sans-serif;
            font-size: 24px;
            /*letter-spacing: 2px;
            border-radius: 30px;*/
            border: none;
            box-shadow: 12px 12px 16px 0 #c6bacf, -12px -12px 16px 0 #f2ebfc, inset 0 0 0 0 transparent;
            transition: box-shadow 200ms, transform 300ms cubic-bezier(.2,2,1,1);
        }

        .buttonpint:hover{
            color: #434245;
        }

        .buttonpint:active{
            box-shadow: 0 0 0 transparent, 0 0 0 transparent, inset 8px 8px 12px 0px rgba(198, 186, 207, .9), inset -8px -8px 12px 0px rgba(242, 235, 252, 0.9);
  transform: scale(.9);
        }

        .btnD{
            color: white;
	        box-shadow: -5px -5px 15px #222F50, 5px 5px 35px #000000;
        }
        .btnW{
            color: white;
	        box-shadow: -5px -5px 15px /* #FFFFFF*/, 5px 5px 35px /*#0D2750*/;
        }

        /*-------------------------genered-------------------------*/