body,html {
  height:100%;
  margin:0;
  background:#4e4a42;
  font-family: sans-serif!important;
  font-size: 16px;
  }

  video, img {
  height:100%; width:100%;
  border-radius: 5px;
  }
video {background-color: #4e4a42;}

button:focus, a:focus {
  outline:none!important;
  }
button:active {opacity:0.5;}
section {
  min-height: 250px!important;
  position: relative;
  background-attachment: fixed;
  background-repeat: no repeat;
  background-position: top center;
  background-size: cover;
  padding-top: 1px;
  background-image: url('http://www.ingenierielinguistique.fr/traduction/images/26.jpg') ;
  }

section:nth-of-type(2) {
  background-image: url('http://www.ingenierielinguistique.fr/traduction/images/25.jpg')}


h1,p, h2 {
  padding:15px 15px 15px 40px;
  }
 
/*logo*/
#logo {
  height:50px; width:60px; 
  float:left; margin:-15px 25px 0 -15px; 
  }

#logo:hover {
  background-color: rgba(255, 255, 255, 0.05); 
  border-radius: 10px
  }

/*nav menu */
#Hd {
  margin: 100px 100px 50px 100px;
  padding: 50px;
  }
.Hd {
  color:#fff; background-color: rgba(24, 92, 146, 0.9);
  border-radius: 5px;
  }

#mainMenu a:hover {
  color:#fff; background-color: rgba(24, 92, 146, 0.9);
  border-radius: 5px}

.dropdown-menu a:hover {
  background-color: rgba(0, 0, 0, 0.2)!important; 
  border-radius: 0!important;
  }

#buttons button {margin: 2px;}

#jumbOut {margin-bottom:-30px}
.jumbotron {
  background-color: rgba(24, 92, 146, 0.9)!important;
  margin: 0 100px 0 100px;
  padding:50px 0 50px;
  }
 

 #jumbIn {background-color: white; border-radius: 5px} 
  
/* Jumbotron img */

#my img {
  height:155px; width:155px; 
  margin: 20px 30px 10px 40px; 
  box-shadow:  0px 0px 50px black;
  padding:10px;
}

/* Jumbotron img */

#service img {
  height:155px; width:155px; 
  margin: 25px 10px 20px 10px; 
  box-shadow:  0px 0px 10px navy;
  padding:15px;
}

/*portfolio*/

#portfolio {
  padding-top: 50px;
}

#rowPortf {
  margin: 0 100px 0 100px; 
  padding-bottom: 25px;
}

#carousel {
  width: 700px;
  margin: 0 auto;
  padding-top: 20px;
}

.devices {
  position: relative;
  height: 575px;
  overflow: hidden;
}

.mobile {
  background: url('http://www.ingenierielinguistique.fr/traduction/images/ecran.png') no-repeat -278px -479px;
  position: absolute;
  width: 130px;
  height: 251px;
  top: 330px;
  left: 520px;
  z-index: 3;
}

.mobile img {
  position: absolute;
  width: 108px;
  height: 162px;
  top: 41px;
  left: 11px;
  
}

.tablet {
  background: url('http://www.ingenierielinguistique.fr/traduction/images/ecran.png') no-repeat 0 -470px;
  width: 264px;
  height: 348px;
  z-index: 2;
  position: absolute;
  top: 227px;
  overflow: hidden;
}
.tablet img {
 width: 212px;
  height: 290px;
  position: absolute;
  top: 30px;
  left:25px;
}

.desktop {
  position: absolute;
  width: 594px;
  height: 457px;
  background: url('http://www.ingenierielinguistique.fr/traduction/images/ecran.png') no-repeat 0 0;
  top: 0px;
  left: 100px;
  overflow: hidden;
}
.desktop img {
  position: absolute;
  width: 549px;
  height: 315px;
  left:20px;
  top:22px;
}
.carousel-control:hover {
  background-color: rgba(255,255,255,0.5)
}

/*footer */
.row-centered {
  text-align: center;
}
.fixed {
  position: fixed; bottom:0; left:0; 
  border-radius: 0  30px 0 0!important;
}
/* Medium Devices, Desktops /-md-/*/
@media only screen and (max-width : 992px) {
.jumbotron {margin: 0  auto;}
#rowPortf { margin:0 auto;}
}

/* Small Devices, Tablets /-sm-/*/
@media only screen and (max-width : 768px) {
.img-zoom-out {margin: 40px!important}
#Hd {margin: 50px 0 50px 0; padding: 0 0 50px 0;}
#rowPortf { margin:0 0px  0 auto; overflow: hidden}
}

/* Extra Small Devices, Phones /-xs-/ */
@media only screen and (max-width : 480px) {
#my img {margin: 30px 70px 30px 90px;}
.jumbotron {padding: 20px 0 20px 0;}
.desktop, .mobile {display:none;}
.tablet {top:0; left:8%}
.carousel-indicators {left:27%!important;}
.carousel-indicators>li, .carousel-indicators>.active {
	width:2em!important; height:2em!important; border-radius: 50%!important;
}
.devices {height:422px;}
#rowPortf { margin:0 auto;}
#rowPortf h2{margin-left: -50px}
}

/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {
.tablet {top:0; left:5%}
.carousel-indicators {left:24%;}
#rowPortf h2{margin-left: -70px}
}
/* Lista */
.footer {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 1rem;
  background-color: rgba(24, 92, 146, 0.9);
  text-align: center;
}

ul {
list-style-image:url('http://www.ingenierielinguistique.fr/traduction/images/liste.png');
}
/* TEXTO */
bl
{
color : #0000FF;
} 

r
{
color : #DF0101;
} 
mot { 
	border: 1px; 
	background: #FFFF00; 
	padding: 0.5px; }
pal { 
	border: 1px; 
	background: #C8FE2E; 
	padding: 0.5px; }
.palabras {
  position: relative;
  display: inline-block;
  width:100px;
  text-align: center;
  border-bottom:1px solid red;
  margin-bottom:-02px;
}
.cambio {
  position:absolute;
  overflow:hidden;
  display: inline-block;
  color:red;
  width:100%;
  left:0;
  bottom:0;
  height:0;
  opacity:0;
  text-rendering:optimizeLegibility;
  -webkit-animation : revealNextWord 12s ease-in-out infinite;
          animation : revealNextWord 12s ease-in-out infinite;
}

.cambio:nth-child(2) {
  -webkit-animation-delay:2s;
          animation-delay:2s;
}
.cambio:nth-child(3) {
  -webkit-animation-delay:4s;
          animation-delay:4s;
}
.cambio:nth-child(4) {
  -webkit-animation-delay:6s;
          animation-delay:6s;
}
.cambio:nth-child(5) {
  -webkit-animation-delay:8s;
          animation-delay:8s;
}
.cambio:nth-child(6) {
  -webkit-animation-delay:10s;
          animation-delay:10s;
}
@-webkit-keyframes revealNextWord {
    0% { opacity: .3; height: 0; }
    10% { opacity: 1; height: 1.2em; }
    20% { opacity: 1; height: 1.2em; }
	  28% { opacity: 0; height:2em;}
    100% { opacity: 0; }
}

@keyframes revealNextWord {
    0% { opacity: .3; height: 0; }
    10% { opacity: 1; height: 1.2em; }
    20% { opacity: 1; height: 1.2em; }
	  28% { opacity: 0; height:2em;}
    100% { opacity: 0; }
}
.wrap{
	max-width: 700px;
	margin:180px auto;
}

.type-wrap{
	margin:15px auto;
	padding:20px;
	background:black;
	border-radius:5px;
	border:#1616eb 1px solid;
}

/* code for animated blinking cursor */
        .typed-cursor{
			color: #81eb16;
            opacity: 1;
            font-weight: 100;
            -webkit-animation: blink 0.7s infinite;
            -moz-animation: blink 0.7s infinite;
            -ms-animation: blink 0.7s infinite;
            -o-animation: blink 0.7s infinite;
            animation: blink 0.7s infinite;
        }
        @-keyframes blink{
            0% { opacity:1; }
            50% { opacity:0; }
            100% { opacity:1; }
        }
        @-webkit-keyframes blink{
            0% { opacity:1; }
            50% { opacity:0; }
            100% { opacity:1; }
        }
        @-moz-keyframes blink{
            0% { opacity:1; }
            50% { opacity:0; }
            100% { opacity:1; }
        }
        @-ms-keyframes blink{
            0% { opacity:1; }
            50% { opacity:0; }
            100% { opacity:1; }
        }
        @-o-keyframes blink{
            0% { opacity:1; }
            50% { opacity:0; }
            100% { opacity:1; }
        }