@font-face {
    font-family: 'Celebes Regular';
    font-style: normal;
    font-weight: normal;
    src: local('Celebes Regular'), url('font/Celebes-Regular.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Celebes Italic';
    font-style: normal;
    font-weight: normal;
    src: local('Celebes Italic'), url('font/Celebes-Italic.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Celebes Thin';
    font-style: normal;
    font-weight: normal;
    src: local('Celebes Thin'), url('font/Celebes-Thin.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Celebes Thin Italic';
    font-style: normal;
    font-weight: normal;
    src: local('Celebes Thin Italic'), url('font/Celebes-ThinItalic.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Celebes Light';
    font-style: normal;
    font-weight: normal;
    src: local('Celebes Light'), url('font/Celebes-Light.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Celebes Light Italic';
    font-style: normal;
    font-weight: normal;
    src: local('Celebes Light Italic'), url('font/Celebes-LightItalic.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Celebes SemiBold';
    font-style: normal;
    font-weight: normal;
    src: local('Celebes SemiBold'), url('font/Celebes-SemiBold.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Celebes SemiBold Italic';
    font-style: normal;
    font-weight: normal;
    src: local('Celebes SemiBold Italic'), url('font/Celebes-SemiBoldItalic.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Celebes Bold';
    font-style: normal;
    font-weight: normal;
    src: local('Celebes Bold'), url('font/Celebes-Bold.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Celebes Bold Italic';
    font-style: normal;
    font-weight: normal;
    src: local('Celebes Bold Italic'), url('font/Celebes-BoldItalic.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Celebes ExtraBold';
    font-style: normal;
    font-weight: normal;
    src: local('Celebes ExtraBold'), url('font/Celebes-ExtraBold.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Celebes ExtraBold Italic';
    font-style: normal;
    font-weight: normal;
    src: local('Celebes ExtraBold Italic'), url('font/Celebes-ExtraBoldItalic.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Celebes Black';
    font-style: normal;
    font-weight: normal;
    src: local('Celebes Black'), url('font/Celebes-Black.woff') format('woff');
    }
    

    @font-face {
    font-family: 'Celebes Black Italic';
    font-style: normal;
    font-weight: normal;
    src: local('Celebes Black Italic'), url('font/Celebes-BlackItalic.woff') format('woff');
    }
html {
    height: 100%;
}
body{
	background-color: #343432;
background: linear-gradient(200deg, rgba(62,62,60,1) 27%, rgba(52,52,50,0) 0%),
            linear-gradient(340deg, rgba(62,62,60,1) 27%, rgba(52,52,50,1) 0%);
	font-family: 'Celebes Regular';
	height: 100%;
}

img#logo{
  border: 0px solid #ffffff;
  border-radius: 0px;
  padding: 5px;
  margin:0px;
  width: 175px;
  height: 175px;
}
img#moi{
  border: 0px solid #ffffff;
  border-radius: 0px;
  padding: 5px;
  margin:0px;
  width: 125px;
  height: 125px;
}
h2{
  font-family:'Celebes Bold';
  font-size: 40px;
  color: #eeeedd;
  
}
h1{

  font-weight: bold;
  font-size: 40px;
  
}


.nav {
    position: relative;
    display: flex;
    list-style: none;
    padding: 10px 20px;
	margin:0px;
			top:-30px;
    a {
        position: relative;
        padding: 0.6em 1.5em;
        font-size: 20px;
        border: none;
        outline: none;
        color: #fff;
        display: inline-block;
        text-decoration: none;
        text-shadow: 1px 1px 0 #888;
        z-index: 3;

    }

    .slide1,
    .slide2 {
        position: absolute;
        display: inline-block;
        height: 0.4em;
        box-shadow: 1px 1px 0 #666;
        transition: all 0.6s cubic-bezier(0.10, 1, 0.50, 1.05);
        //transform: skew(-45deg);
        bottom: 0px;
        height: 100%;
		   transform-origin :60% 50%;
   transform:perspective(150px) rotateY(45deg); 
				//background: linear-gradient(200deg, rgba(62,62,60,1) 27%, rgba(52,52,50,0) 0%),
            //linear-gradient(340deg, rgba(62,62,60,1) 27%, rgba(52,52,50,1) 0%);
    }
    .slide1 {
        background-color: #6e6e6c;
        z-index: 2;
    }
    .slide2 {
        opacity: 0;
        background-color: transparent;
        border: 1px solid #eeeeee70;
        z-index: 1;

    }
}

// *************** Presentation ******************** //

*,
*::before,
*::after {
    box-sizing: border-box;
}
ul.nav {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #e0e0e0;
    font-family: 'Celebes SemiBold';
    line-height: 2;
    
	background-color: transparent;
}
#show-page{
	  position: relative;
  top: 20px;
  left: 10%;
width:80%;

  height: 75%;
  border: 3px solid #8e8e8c;
  background-color: #616162;
	
}
table, td, tr {
  border: 0px solid;

}
table,td.core{
	height:100%;
}
h3{
	color: #eeeeee;
	font-size: 28px;
	margin:30px;
	text-decoration: underline;
}
p{
	color: #dddddd;
		font-size: 18px;
		margin:30px;
}
a.mail{
	color: #ffffff;	
	
}
a:visited {
  color: #ffffff;
          font-size: 20px;
}
a:hover {
  color: #dddddd;
          font-size: 20px;
}
a {
  color: #ffffff;
          font-size: 20px;
}