body{
	font-family:'Montserrat', sans-serif;
    background-color: #fff;
    overflow-x: hidden;
}

/*barre de navigation*/
.navbar {
    background-color: #438ece;
    overflow: hidden;
    height: 65px;
    position: fixed;
    width:100%;
    z-index: 10;
}

.navbar a {
    float:left;
    display: inline;
    color: #f2f2f2;
    text-align: center;
    padding: 12px 20px;
    text-decoration: none;
    font-size: 17px;
}

.navbar ul {
    list-style: none;
}

.navbar ul li {
    padding-left: 25px;
    margin: 8px 0 0 0;
    list-style: none;
}

.navbar a:hover {
    background-color: #438ece;
    color: #FFF;
}

/* le menu coulissant de coté*/
.side-nav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index:11;
    top: 0;
    left: 0;
    background-color: #111;
    opacity: 0.9;
    overflow-x: hidden;
    padding-top: 60px;
    transition: 1s;
}

.side-nav a {
    padding: 10px 10px 10px 30px;
    text-decoration: none;
    font-size: 22px;
    color: #ccc;
    display: block;
    transition: 0.3s;
}

.side-nav a:hover {
    color: #fff;
}

.side-nav .btn-close {
    position: absolute;
    top: 0;
    right: 22px;
    font-size: 36px;
    margin-left: 50px
}
.fast {float:right;color:#fff;font-size:0.850em;margin-right: 10px;}
.fast a {float:right;font-size:1em; padding:0 10px 0 5px;}

/* Radial Out nav menu*/
.hvr-radial-out {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  overflow: hidden;
  background: #438ece;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
  border-radius: 6px;
}
.hvr-radial-out:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #3a0000;
  border-radius: 100%;
  -webkit-transform: scale(0);
  transform: scale(0);
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-radial-out:hover, .hvr-radial-out:focus, .hvr-radial-out:active {
  color: white;
}
.hvr-radial-out:hover:before, .hvr-radial-out:focus:before, .hvr-radial-out:active:before {
  -webkit-transform: scale(2);
  transform: scale(2);
}
/* Sections
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.section {
  padding: 3rem 0 3rem;
  text-align: center;
}

.section-heading,
.section-description {
  margin-top: 4rem;
  margin-bottom: 4rem;
}

h1, h2, .section-heading  {
    color: #fff;
    text-shadow: -1px 1px 2px #120000;
}

.center {
    text-align: center;
}

.section-a {
    background-size: cover;
    padding-bottom: 5rem;
}

.section-a h5 {
    color: #380000;
    /*text-shadow: -1px 1px 2px #120000;*/
}

.section-t img {
    margin-right: 0.5em;
    margin-bottom: 0.5em;
    -webkit-box-shadow: -1px 1px 15px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: -1px 1px 15px 0px rgba(0,0,0,0.75);
    box-shadow: -1px 1px 15px 0px rgba(0,0,0,0.75);
}

.section-t h3 {
    color: #3a0000;
}

.section-a h5 {
    margin-bottom: 1rem;
}
/* section réalisations*/
.section-b {
background-color: #438ece;
background-image: url("data:image/svg+xml,%3Csvg width='100' height='20' viewBox='0 0 100 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21.184 20c.357-.13.72-.264 1.088-.402l1.768-.661C33.64 15.347 39.647 14 50 14c10.271 0 15.362 1.222 24.629 4.928.955.383 1.869.74 2.75 1.072h6.225c-2.51-.73-5.139-1.691-8.233-2.928C65.888 13.278 60.562 12 50 12c-10.626 0-16.855 1.397-26.66 5.063l-1.767.662c-2.475.923-4.66 1.674-6.724 2.275h6.335zm0-20C13.258 2.892 8.077 4 0 4V2c5.744 0 9.951-.574 14.85-2h6.334zM77.38 0C85.239 2.966 90.502 4 100 4V2c-6.842 0-11.386-.542-16.396-2h-6.225zM0 14c8.44 0 13.718-1.21 22.272-4.402l1.768-.661C33.64 5.347 39.647 4 50 4c10.271 0 15.362 1.222 24.629 4.928C84.112 12.722 89.438 14 100 14v-2c-10.271 0-15.362-1.222-24.629-4.928C65.888 3.278 60.562 2 50 2 39.374 2 33.145 3.397 23.34 7.063l-1.767.662C13.223 10.84 8.163 12 0 12v2z' fill='%234fa6f0' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E");
    /*background-size: cover;*/
    color: #438ece;
    padding-bottom: 10rem;
}

.section-ancre {
    background-color: #89c5f7;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80' width='80' height='80'%3E%3Cpath fill='%2370b7f4' fill-opacity='0.49' d='M14 16H9v-2h5V9.87a4 4 0 1 1 2 0V14h5v2h-5v15.95A10 10 0 0 0 23.66 27l-3.46-2 8.2-2.2-2.9 5a12 12 0 0 1-21 0l-2.89-5 8.2 2.2-3.47 2A10 10 0 0 0 14 31.95V16zm40 40h-5v-2h5v-4.13a4 4 0 1 1 2 0V54h5v2h-5v15.95A10 10 0 0 0 63.66 67l-3.47-2 8.2-2.2-2.88 5a12 12 0 0 1-21.02 0l-2.88-5 8.2 2.2-3.47 2A10 10 0 0 0 54 71.95V56zm-39 6a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm40-40a2 2 0 1 1 0-4 2 2 0 0 1 0 4zM15 8a2 2 0 1 0 0-4 2 2 0 0 0 0 4zm40 40a2 2 0 1 0 0-4 2 2 0 0 0 0 4z'%3E%3C/path%3E%3C/svg%3E");
}

.section-ancre2{
   background-color: #e6e8ea;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 56 28' width='56' height='28'%3E%3Cpath fill='%23ffffff' fill-opacity='0.4' d='M56 26v2h-7.75c2.3-1.27 4.94-2 7.75-2zm-26 2a2 2 0 1 0-4 0h-4.09A25.98 25.98 0 0 0 0 16v-2c.67 0 1.34.02 2 .07V14a2 2 0 0 0-2-2v-2a4 4 0 0 1 3.98 3.6 28.09 28.09 0 0 1 2.8-3.86A8 8 0 0 0 0 6V4a9.99 9.99 0 0 1 8.17 4.23c.94-.95 1.96-1.83 3.03-2.63A13.98 13.98 0 0 0 0 0h7.75c2 1.1 3.73 2.63 5.1 4.45 1.12-.72 2.3-1.37 3.53-1.93A20.1 20.1 0 0 0 14.28 0h2.7c.45.56.88 1.14 1.29 1.74 1.3-.48 2.63-.87 4-1.15-.11-.2-.23-.4-.36-.59H26v.07a28.4 28.4 0 0 1 4 0V0h4.09l-.37.59c1.38.28 2.72.67 4.01 1.15.4-.6.84-1.18 1.3-1.74h2.69a20.1 20.1 0 0 0-2.1 2.52c1.23.56 2.41 1.2 3.54 1.93A16.08 16.08 0 0 1 48.25 0H56c-4.58 0-8.65 2.2-11.2 5.6 1.07.8 2.09 1.68 3.03 2.63A9.99 9.99 0 0 1 56 4v2a8 8 0 0 0-6.77 3.74c1.03 1.2 1.97 2.5 2.79 3.86A4 4 0 0 1 56 10v2a2 2 0 0 0-2 2.07 28.4 28.4 0 0 1 2-.07v2c-9.2 0-17.3 4.78-21.91 12H30zM7.75 28H0v-2c2.81 0 5.46.73 7.75 2zM56 20v2c-5.6 0-10.65 2.3-14.28 6h-2.7c4.04-4.89 10.15-8 16.98-8zm-39.03 8h-2.69C10.65 24.3 5.6 22 0 22v-2c6.83 0 12.94 3.11 16.97 8zm15.01-.4a28.09 28.09 0 0 1 2.8-3.86 8 8 0 0 0-13.55 0c1.03 1.2 1.97 2.5 2.79 3.86a4 4 0 0 1 7.96 0zm14.29-11.86c1.3-.48 2.63-.87 4-1.15a25.99 25.99 0 0 0-44.55 0c1.38.28 2.72.67 4.01 1.15a21.98 21.98 0 0 1 36.54 0zm-5.43 2.71c1.13-.72 2.3-1.37 3.54-1.93a19.98 19.98 0 0 0-32.76 0c1.23.56 2.41 1.2 3.54 1.93a15.98 15.98 0 0 1 25.68 0zm-4.67 3.78c.94-.95 1.96-1.83 3.03-2.63a13.98 13.98 0 0 0-22.4 0c1.07.8 2.09 1.68 3.03 2.63a9.99 9.99 0 0 1 16.34 0z'%3E%3C/path%3E%3C/svg%3E");
}

.section-water {
background-color: #438ece;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='18' viewBox='0 0 100 18'%3E%3Cpath fill='%2357a8ee' fill-opacity='0.4' d='M61.82 18c3.47-1.45 6.86-3.78 11.3-7.34C78 6.76 80.34 5.1 83.87 3.42 88.56 1.16 93.75 0 100 0v6.16C98.76 6.05 97.43 6 96 6c-9.59 0-14.23 2.23-23.13 9.34-1.28 1.03-2.39 1.9-3.4 2.66h-7.65zm-23.64 0H22.52c-1-.76-2.1-1.63-3.4-2.66C11.57 9.3 7.08 6.78 0 6.16V0c6.25 0 11.44 1.16 16.14 3.42 3.53 1.7 5.87 3.35 10.73 7.24 4.45 3.56 7.84 5.9 11.31 7.34zM61.82 0h7.66a39.57 39.57 0 0 1-7.34 4.58C57.44 6.84 52.25 8 46 8S34.56 6.84 29.86 4.58A39.57 39.57 0 0 1 22.52 0h15.66C41.65 1.44 45.21 2 50 2c4.8 0 8.35-.56 11.82-2z'%3E%3C/path%3E%3C/svg%3E");
}

/* HOVER EFFECTS AND ANIMATION*/
/* Glow */
.animated {
  animation-duration: 2s;
  animation-fill-mode: both;
}

/*.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
  -webkit-animation-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
  animation-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955); }*/

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.fadeInUp {
  animation-name: fadeInUp;
}

.hvr-glow {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 10px #000;
  -webkit-transition-duration: 1s;
  transition-duration: 1s;
  -webkit-transition-property: box-shadow;
  transition-property: box-shadow;
}

.hvr-glow:hover, .hvr-glow:focus, .hvr-glow:active {
  box-shadow: 0 0 40px rgba(0, 0, 0, 0.9);
}

.hvr-glow-2:hover, .hvr-glow:focus, .hvr-glow:active {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.9);
}

/* Buzz Out */
@-webkit-keyframes hvr-buzz-out {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  90% {
    -webkit-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }
  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}
@keyframes hvr-buzz-out {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  90% {
    -webkit-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }
  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}
.hvr-buzz-out {
  display: inline-block;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
}
.hvr-buzz-out:hover, .hvr-buzz-out:focus, .hvr-buzz-out:active {
  -webkit-animation-name: hvr-buzz-out;
  animation-name: hvr-buzz-out;
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

/* section à propos*/

.card-wrapper {
  /*width: 400px;*/
  height: 500px;
  position: relative;
}

.card {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 350px;
    height: 450px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 5px 18px rgba(0, 0, 0, 0.4);
    cursor: pointer;
    transition: 0.5s;
    border: 3px solid #438ece;
    }

.card .card-image {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 2;
    background-color: #000;
    transition: .5s;
}

.card:hover img {
    opacity: 0.4;
    transition: .5s;
}

.card:hover .card-image {
    transform: translateY(-100px);
    transition: all .9s;
}

/* socials icons */
.social-icons {
    display: flex;
    position: absolute;
    top: 70%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;   
}

.social-icons li {
    list-style-type: none;
}

.social-icons li a {
    position: relative;
    display: block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    background: #fff;
    font-size: 23px;
    color: #333;
    font-weight: bold;
    margin: 0 6px;
    transition: .4s;
    transform: translateY(200px);
    opacity: 0;
}

.card:hover .social-icons li a {
    transform: translateY(0px);
    opacity: 1;
}

.social-icons li a:hover {
    background: #000;
    transition: .2s;
}

.social-icons li a:hover .fab {
   color: #fff;
}

.social-icons li a .fab {
    transition: .8s;
}

.social-icons li a .fab:hover {
    transform: rotateY(360deg);
    color: #fff;
}

.card:hover li:nth-child(1) a {
    transition-delay: 0.1s;
}

.card:hover li:nth-child(2) a {
    transition-delay: 0.2s;
}

.card:hover li:nth-child(3) a {
    transition-delay: 0.3s;
}

.card:hover li:nth-child(4) a {
    transition-delay: 0.4s;
}

.details {
    position: absolute;
    bottom: 0;
    left: 0;
    background: #fff;
    width: 100%;
    height: 120px;
    z-index: 1;
    padding: 10px;
}

.details h2 {
    margin: 30px 0;
    padding: -10px;
    text-align: center;
    color: #000;
}

.details h2 .job-title {
    font-size: 1.8rem;
    line-height: 1.5rem;
    color: #333;
    font-weight: 300;
}

/***** section description ******/

.section-c .section-description {
    margin-bottom: 4rem;
}

/* section réseaux sociaux*/
.section-d  {
    margin-bottom: 0;
    background-color: #3a0000;
}

.section-d .fa {
    font-size: 60px;
    margin-bottom: 1rem;
    padding: 2rem 2rem 1rem 2rem;
    color:#fff;
}

h4, h5, .section-d {
    color: #fff;
}

.space {
    padding-top:7rem;
}

.one-half h5 {
    text-align: left;
    color: #fff;
    text-shadow:-1px 1px 2px #120000;
}

.one-half h6 {
    font-weight:600;
    text-align: left;
    color: #438ece;
 
}

.six.columns {
    text-align: left;
    margin-bottom: 0rem;
    color: #000;
}

.six.columns a {
    color: #380000;

}
.six.columns a:hover {
    color: #b55a30;

}

.six.columns h5 {
    color:#380000;
} 

.sand {
    color: #380000;
}

/*h3, h4, .six.columns {
    color: #380000;
}*/ 

.typo-left {
    text-align: left;
}

.typo-center {
    text-align: center;
}

.typo-shadow {
    text-align: left;
    text-shadow: -1px 1px 2px #120000;
}

.typo-shadow-center {
    text-align: center;
    text-shadow: -1px 1px 2px #120000;
}

.water {
    color: #438ece;
}

.dark {
    color: #000;
}

.cloud {
    background-image:url(../images/iledoweb.jpg);
    background-repeat: no-repeat;
    background-position:bottom;
    background-size: cover;
    /*background: #b1d8f5; /* Old browsers */
    /*background: -webkit-linear-gradient(#b1d8f5 0%, #e6f8fd 24%, #fdffff 76%);*/
    /*background: -o-linear-gradient(#b1d8f5 0%, #e6f8fd 24%, #fdffff 76%);*/
    /*background: linear-gradient(#b1d8f5 0%, #e6f8fd 24%, #fdffff 76%); /* FF3.6-15 */ /* Chrome10-25,Safari5.1-6 */ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b1d8f5', endColorstr='#fdffff',GradientType=0 ); /* IE6-9 */
    /*color: #333;*/
}

.showcase-img {
    position: relative;
    width: auto;
    margin: 0 auto;
    padding-bottom: 3em;
}

.sphere {
    background-color: #fff;
    width: 400px;
    margin: auto;
    opacity: 0.8;
    border-radius: 75%;
}


/* animation
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Style the Image Used to Trigger the Modal */
#myImg {
    border-radius: 10px;
    cursor: pointer;
    transition: 0.3s;
}

#myImg2 {
    border-radius: 10px;
    cursor: pointer;
    transition: 0.3s;
}

#myImg3 {
    border-radius: 10px;
    cursor: pointer;
    transition: 0.3s;
}

#myImg4 {
    border-radius: 10px;
    cursor: pointer;
    transition: 0.3s;
}

#myImg5 {
    border-radius: 10px;
    cursor: pointer;
    transition: 0.3s;
}

#myImg6 {
    border-radius: 10px;
    cursor: pointer;
    transition: 0.3s;
}

/*#myImg7 {
    border-radius: 10px;
    cursor: pointer;
    transition: 0.3s;
}

#myImg8 {
    border-radius: 10px;
    cursor: pointer;
    transition: 0.3s;
}*/

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}

/* Modal Content (Image) */
.modal-content {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    border-radius: 10px;
}

/* Caption of Modal Image (Image Text) - Same Width as the Image */
#caption {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
}

#caption2 {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
}

#caption3 {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
}

#caption4 {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
}

#caption5 {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
}

#caption6 {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
}

/*#caption7 {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
}

#caption8 {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
}*/

/* Add Animation - Zoom in the Modal */
.modal-content, #caption { 
    -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s;
}

@keyframes zoom {
    from {transform:scale(0);} 
    to {transform:scale(1);}
}

/* The Close Button */
.close {
    position: absolute;
    top: 50px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
}

.close:hover,
.close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width:940px){.fast {display:none;}
}

@media only screen and (max-width: 700px){
    .modal-content {
        width: 100%;
    }
    .fast{display: none; }
}

@media only screen and (min-width: 550px) {
    .showcase-heading {
        font-size: 3.0rem;
        padding-top: 11rem;
    }    
    .open-slide {display:none;}
}

@media only screen and (max-width: 568px){
    
    .navbar-nav{display:none;}
    .sphere { 
            background-color: #fff;
            width: 100%;
            margin: 0 auto;
            opacity: 0.9;
            border-radius: 100%;
    }
    .fast{display: none; }
    h5 {
        font-size: 1.1em;
    }
    .u-max-full-width-circle {
          max-width: 50%;
    }
   
}