body {
   margin:0;
   padding:0;
   height:auto;
   width:100%;
   position: relative;
   font-family: 'Lobster', cursive;
}

a{
  margin-right: auto;
  margin-left: auto;
}

dl dt a
    {
      display: block;
    }
  dl dd
  {
    overflow: hidden;
    -webkit-transition: height 1s ease;
    -moz-transition: height 1s ease;
    -o-transition: height 1s ease;
  }
dl dd:not(:target) { height: 0px; }
dl dd:target { height: 62vh; }
dl a.ie:hover dd,
  dl a.ie:focus dd
  {
    height: auto;

  }


.police{
  font-family: 'Lobster', cursive;
}

.blackfont a{
  color: #000;
}
.blackfont a:hover{
  color: #000;
  text-decoration: none;
}

  .modal-lg {
    width: 25%!important;
  }
  

.hover img:hover{
  opacity: 0.7;
}



.menu a{
  color: white;
}

.menu a:hover{
  color: #fff;
  text-decoration: none;
}

.menu a:active{
  color: #fff;
  text-decoration: none;
}

.menu a:link{
  color: #fff;
  text-decoration: none;
}

.menu a:visited{
  color: #fff;
  text-decoration: none;
}

.whiteM {
  width: 100%;
  height: 40vh;
  background: white;
  -webkit-clip-path: polygon(50% 60%, 100% 0, 100% 100%, 0 100%, 0 0);
clip-path: polygon(50% 60%, 100% 0, 100% 100%, 0 100%, 0 0);
}

img{
  opacity: 1;
}


.triangle{
  position:absolute; 
  margin-left:11.2vw;
width: 75%;
  height: 28vh;
  background: white;
  -webkit-clip-path: polygon(50% 80%, 0 0, 100% 0);
clip-path: polygon(50% 80%, 0 0, 100% 0);
}



.background{
  background-image: url(../images/background2.jpg);
  background-size: 100%;
  opacity: 1;
  width: 100%;
  }

/*.border-leaf{
  border: 15px solid transparent;
  padding: 20px;
  -webkit-border-image: url(./../images/border_leaf.jpg) 60 round;
  -o-border-image: url(./../images/border_leaf.jpg) 60 round;
    border-image: url(./../images/border_leaf.jpg) 60 round;
    background-image: transparent;
  left:auto;  
}*/




.menu_hover {
    
    border-bottom: 3px solid transparent;    
    width: 0px;
    transition: 0.5s ease;
}
.menu_hover:hover {
    border-bottom: 3px solid #FFF;
    width: 100%;
    transition: 0.5s ease;
    text-decoration: none;
    color: #FFF;
}

.menu_hover:active{
  border: 3px solid #fff;
  padding: 4%;
  transition: 0.2s;
}




.rond{
  width:30%;
  height:90%;
  background-image: url(../images/image1.jpg);
  margin-left: 32%;
  -webkit-border-radius:50%;
  -moz-border-radius:50%;
  -o-border-radius:50%;
  border-radius:50%;
  border: solid 20px grey;
  top:-100px;
  float: middle;
  position: absolute;
}






.logo{
  height: 160px;
  width: 260px;
  background-color: #C0C0C0;
  margin-top: 2%;
  margin-left: auto;
  margin-right: auto;
  opacity: 0.6;
  margin: none;
  padding: 20px;
}

.logoXS{
  height: 140px;
  width: 240px;
  background-color: #C0C0C0;
  margin-top: 2%;
  margin-left: auto;
  margin-right: auto;
  opacity: 0.6;
  margin: none;
  padding: 20px;
}


.logo2{
  height: 260px;
  width: 360px;
  background-color: #C0C0C0;
  margin-top: 5%;
  margin-left: auto;
  margin-right: auto;
  opacity: 0.6;
  margin: none;
  padding: 20px;
}

.logo2XS{
  height: 160px;
  width: 280px;
  background-color: #C0C0C0;
  margin-top: 5%;
  margin-left: auto;
  margin-right: auto;
  opacity: 0.6;
  margin: none;
  padding: 20px;
}


.cont{
  width: 800px;
  height: 500px;
  background: transparent;
  overflow: hidden;
  position: relative;
  }

.rotate{
  -ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Safari */
    transform: rotate(90deg);
}


#diagonal1{
  height: 1000px;
  width: 500px;
  overflow: hidden;
  -ms-transform: rotate(-45deg); /* IE 9 */
    -webkit-transform: rotate(-45deg); /* Safari */
    transform: rotate(-45deg);
   position: absolute;
   bottom: -500px;
   left: -105px;
}

#diagonal2{
  height: 1000px;
  width: 500px;
  overflow: hidden;
  -ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Safari */
    transform: rotate(45deg);
   position: absolute;
   bottom: -500px;
   right: -105px;
}


.full{
  width: auto;
  height: auto;
  display: block;
  z-index: 100;
}

.break-word{
    display: block;
    word-wrap: break-word;
}

.glyphicon{
  font-size: 5em;
}

h3.text1{
  margin-left: 10%;
  margin-right: 10%;
}

.background2{
  position: absolute;
  height: 500px;
  width: 500px;
  left: 0;
  overflow:hidden;

}

.background3{
  position: absolute;
  height: 500px;
  width: 500px;
  right: 0;
  overflow:hidden;
}


.center{
  text-align: center;
  margin-left: 10%;
  margin-right: 10%;
  vertical-align: middle
}

.center2{
  text-align: center;
  margin-left: 25%;
  margin-right: 25%;
  vertical-align: middle
}

.titreXS{
  padding-left: 20px;
  padding-right: 20px;
  padding-top:0!important;
  padding-bottom:0;
  border: 3px solid #808080; 
  border-top:0!important; 
  display: block; 
  height: 120px;
  width: 240px;
}

.titreLG{
  padding: 20px; 
  padding-top:0!important; 
  border: 3px solid #808080; 
  border-top:0!important; 
  display: block; 
  height: 220px; 
  width: 320px;
}

.titre2xs{
  padding: 20px; 
  border: 3px solid #808080!important; 
  display: block; 
  height: 100px; 
  width: 200px;
}

.titre2lg{
  padding: 20px; 
  border: 3px solid #808080!important; 
  display: block; 
  height: 120px; 
  width: 220px;
}

.glyphshop{
  width:100%;
  height: 30px;
  width: 30px;
  font-size: 70px; 
  margin-left:0;
}

.placebtn{
  padding-left:0; 
  padding-right:0; 
  padding-top:10px; 
  padding-bottom:10px; 
  margin-top:30%;
}

.bgwhite{
  background-color: white;
}

.txtcenter{
  text-align: center;
}

.font1em{
  font-size:1em;
}

.font3em{
  font-size:3em;
}

.font5{
  font-size: 5px!important;
}

.font26{
  font-size: 26px!important;
}

.font50{
  font-size: 50px;
}

.font10vh{
  font-size: 10vh;
}

.font100{
  font-size: 100px;
}



.borderl{
  border-left: solid 1px #000;
}

.borderr{
  border-right: solid 1px #000;
}

.wi100p{
  width: 100px!important;
}

.wi120p{
  width: 120px!important;
}

.wi150p{
  width: 150px;
}

.wi200p{
  width: 200px;
}

.wi75{
  width: 75%;
}

.wi100{
  width: 100%;
}

.hauto{
  height:auto;
}

.h40{
  height: 40px;
}

.h63{
  height: 63px;
}

.h100{
  height: 100px;
}

.h120{
  height: 120px!important;
}

.h150{
  height: 150px;
}

.h175{
  height: 175px;
}

.h200{
  height: 200px!important;
}

.h250{
  height:250px;
}

.h280{
  height:280px;
}

.h300{
  height: 300px;
}

.h320{
  height: 320px;
}

.h350{
  height: 350px;
}

.h400{
  height: 400px;
}

.h500{
  height: 500px!important;
}

.h550{
  height: 550px;
}

.h600{
  height: 600px;
}

.h700{
  height: 700px;
}

.h800{
  height: 800px;
}

.h900{
  height: 900px;
}

.h1000{
  height: 1000px;
}

.h1200{
  height:1200px;
}

.h1450{
  height: 1450px;
}


.h10p{
  height: 10%;
}

.h75p{
  height:75%;
}

.h100p{
  height:100%;
}



.margleft12{
  margin-left:12%;
}

.marg0{
  margin:0%;
}

.marg5{
  margin:5%;
}

.marg10{
  margin:10%;
}

.marg15{
  margin:15%;
}

.margtop1{
  margin-top: 1%
}

.margtop2{
  margin-top:2%;
}

.margtop10{
  margin-top: 10%;
}

.margtop30vh{
  margin-top: 30vh;
}

.margleft0{
  margin-left: 0;
}

.margleft4{
  margin-left:4%;
}

.margleft15{
  margin-left:15%;
}

.margleft40{
  margin-left:40%;
}

.margleft8vw{
  margin-left:8vw;
}

.padd0{
  padding:0!important;
}

.pad3{
  padding: 3%;
}

.pad5{
  padding: 5%;
}

.padtop{
  padding-top: 5%;
}

.top-500{
  padding-top: 5%;
  top:-500px;
}

.padtop2{
  padding-top: 2%;
}

.padtop3{
  padding-top: 3%;
}

.padtop4{
  padding-top: 4%;
}

.padtop1{
  padding-top: 1%;
} 

.padtop10{
  padding-top: 10%;
}

.padtop5{
  padding-top: 5%;
}

.padtop2-5{
  padding-top: 2.5%;
}

.padtop7{
  padding-top: 7%;
}

.padtop17{
  padding-top: 17%;
}

.paddr0{
  padding-right: 0;
}

.padbot{
  padding-bottom: 5%;
}

.padbot3{
  padding-bottom: 3%;
}

.padbot5{
  padding-bottom: 5%;
}

.padbot10{
  padding-bottom: 10%!important;
}

.padbot15{
  padding-bottom: 15%;
}

.margtop{
  margin-top: 4%;
}

.margtop0{
  margin-top: 0%;
}

.margtop05{
  margin-top: 0.5%;
}

.margtop5{
  margin-top: 5%;
}

.margbot3{
  margin-bottom: 3%;
}

.margbot{
  margin-bottom: 4%;
}

.margbot5{
  margin-bottom: 5%;
}

.margbot10{
  margin-bottom: 10%;
}

.paddleft{
    padding-left: 0!important;
}

.paddleft20p{
    padding-left: 20px;
}

.paddleft15p{
    padding-left: 15px;
}

.paddright{
    padding-right: 0!important;
}
.border-horiz{
  padding-top: 3%;
  border-bottom: solid 1px #000;
  border-top: solid 1px #000;
  margin-left: 10%;
  margin-right: 10%;
}

.border-top{
  border-top: solid 3px #808080;
}

.radius{
  overflow:hidden;
  -webkit-border-radius:50%;
  -moz-border-radius:50%;
  border-radius:50%;
}

.radius2{
  overflow:hidden;
  -webkit-border-radius:10%;
  -moz-border-radius:10%;
  border-radius:10%;
}


.ombre{
    -webkit-box-shadow: 5px 0px 12px rgba(0, 0, 0, .5);
            box-shadow: -5px 0px 12px rgba(0, 0, 0, .5);
}

.transp
{
  background-color: transparent;
}

.white
{
  background-color: white;
}

.fontwhite{
  color: white;
}

.menu{
  padding-top:1%;
  font-size: 22px;
  width: auto;
  height: 70px;
  margin-left: auto;
  margin-right: auto;
  top: 0;
  opacity: 1!important;
}

.navXS{
  position: fixed;
  top: 0;
  height: 50px;
  padding-top: 0;
  padding-bottom: 1%;
  width: 100%;
  background-color: #2E2C59;
   color: white;
}



#nav{
  display:none;
} 


#nav.affix {
    position: fixed;
    top: 0;
    padding-top: 0;
    padding-bottom: 1%;
    width: 100%;
    background-color: #2E2C59;
    z-index: 999;
    -webkit-transition: all 1s ease-in;
    transition: all 1s ease-in;
    opacity: 1!important;
}

footer .subFooter {
    color: #777777;
    font-size: 12px;
    padding: 8px 0;
    background-color: #e5e5e5;
    border-top: 3px solid #ddd;
    bottom: 0;
    width: 100%;
    position: absolute;
    height: 40px;
    }


a.triangle:hover{
  -webkit-box-shadow: 15px 15px 15px #ffd700;
            box-shadow: 15px 15px 15px #ffd700;
}









button {
  background: none;
  border: 0;
  box-sizing: border-box;
  box-shadow: inset 0 0 0 2px #000;
  color: #000;
  font-size: inherit;
  font-weight: 700;
  margin: 1em;
  padding: 1em 2em;
  text-align: center;
  text-transform: capitalize;

  position: relative;
  vertical-align: middle;
}
  button::before,
  button::after {
    box-sizing: border-box;
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
  }


.spin {
  width: 5em;
  height: 5em;
  padding: 0;
  }
  .spin:hover {
    color: #ffd700;
  }

  .spin::before,
  .spin::after {
    top: 0;
    left: 0;
  }

  .spin::before {
    border: 2px solid transparent;
  }

  .spin:hover::before {
    border-top-color: #ffd700; 
    border-right-color: #ffd700;
    border-bottom-color: #ffd700;

    transition:
      border-top-color 0.15s linear,  
      border-right-color 0.15s linear 0.10s,
      border-bottom-color 0.15s linear 0.20s;
  }

  .spin::after {
    border: 0 solid transparent;
  }

  .spin:hover::after {
    border-top: 2px solid #ffd700;     
    border-left-width: 2px; 
    border-right-width: 2px; 
    transform: rotate(270deg);  
    transition:
      transform 0.4s linear 0s,
      border-left-width 0s linear 0.45s;
  }


  .spin2 {
  width: 5em;
  height: 5em;
  padding: 0;
  }
  .spin2:hover {
    color: #ffd700;
  }

  .spin2::before,
  .spin2::after {
    top: 0;
    left: 0;
  }

  .spin2::before {
    border: 4px solid transparent;
  }

  .spin2:hover::before {
    border-top-color: #ffd700; 
    border-right-color: #ffd700;
    border-bottom-color: #ffd700;

    transition:
      border-top-color 0.15s linear,  
      border-right-color 0.15s linear 0.10s,
      border-bottom-color 0.15s linear 0.20s;
  }

  .spin2::after {
    border: 0 solid transparent;
  }

  .spin2:hover::after {
    border-top: 4px solid #ffd700;     
    border-left-width: 4px; 
    border-right-width: 4px; 
    transform: rotate(270deg);  
    transition:
      transform 0.4s linear 0s,
      border-left-width 0s linear 0.45s;
  }


.circle {
  border-radius: 100%;
  box-shadow: none;
  }  
  .circle::before,
  .circle::after {
    border-radius: 100%;
  }


@media (min-width: 768px) {
.background{
  background-image: url(../images/background2.jpg);
  background-size: 100%;
  background-attachment: fixed;
  opacity: 1;
  width: 100%;
  } 
}

@media (min-width: 992px) {
.background{
  background-image: url(../images/background2.jpg);
  background-size: 100%;
  background-attachment: fixed;
  opacity: 1;
  width: 100%;
  }
}

@media (min-width: 1200px) {
.background{
  background-image: url(../images/background2.jpg);
  background-size: 100%;
  background-attachment: fixed;
  opacity: 1;
  width: 100%;
}
}