@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {

  main {
    min-height: 200px
  }
}


body.odonto{
	font-family: 'Lato', sans-serif;
	font-size: 10px;	
	background: #EBEBEB url(../img/main-pattern.png);
	/*background: #EBEBEB url(http://thmbcache.com/thumbs/970410/c/fondos/fondo1.jpg);*/
	/*background: #EBEBEB url(http://www.fondoshd.mx/wallpapers/3d-cubes-2379.jpg);*/
	/*background: #EBEBEB url(http://culturaeducativa.org/wp-content/uploads/2013/11/ipn.jpeg);*/
}

h1,h2,h3,.allan{
	font-family: 'Allan', sans-serif;
	
	
}

img{
	max-width:100%;
	margin:0;
}
.imgsm{
	margin-top: -7px;
}
.quitarf{
	float: none;
}

.fder{
	float: right;
}

.espacio-arriba{
	margin-top: 100px;
}
.espaciom-arriba{
	margin-top: 15px;
}
.espacioe-arriba{
	margin-top: 20px;
}
.espacio-derecha{
	margin-right: 2em;
}
.lato{
	font-family: 'Lato', sans-serif;
}

.indie{
	font-family: 'Indie-Flower', cursive;
}
.simo{
	font-family: 'Simonetta', cursive;
}
.pacifico{
	font-family: 'Pacifico', cursive;
}
.dr{
	font-family: 'Dr Sugiyama', cursive;
}
.oswa{
	font-family: 'Oswald', sans-serif;
}
.rosario{
	font-family: 'Rosario', sans-serif;
}

.casigrande{
	font-size: 3em;
}
.mediano{
	font-size: 2em;
}

.chico{
	font-size: 1.5em;
}
.verde{
	color:#04B486;
}

.miguinda{
	color:#620730;
}
.blanco{
	color:#FFFFFF;
}
.fondog{
	background:#620730;
	color:#FFFFFF;
}

.l{
	color:#F24D2A;
}
.no-lista{
	margin: 0px;
	padding: 0px;
}
.no-lista li{
list-style-type: none;
}
.prueba{
	float: none;
	display: inline-block;
	mmargin-right: -4px;	
}
.se-gris{
	background-color: #eee;
}
.padding-largo{
	padding: 5px; 10px;
}

.mirojo{
 color:#961019;
}

.minaranja{
 color:#ED4103;
}
.mimorado{
 color:#551AA6;
}
.micolor{
 color:#AD1736;
} 
.miazul{
 color:#176ED4;
}
.miblanco{
 color:#FFF;
}


/*Iconos Creditos*/



.one {
display:none;
  font-family: Helvetica;
  font-size: 10px;
  color: #FFFFFF;
  text-align: center;
  text-shadow: 2px 1px 2px rgba(0,0,0,.4);
  padding: 1px 0px 0px 0px;
}



.two:hover .one{
  display: inline;
  position: absolute;
  top: -300px;
  left: -150px;
  width: 300px;
  height: 260px;
  font-size:10px;
  border-radius: 5px;
  background-color: #000000; 
}
/* Fin on mouse & hover */
 
.Elemento { /* global button class */
  background-color: white;
  border-radius: 3.6rem;
  cursor: pointer;
  display: inline-block;
  font-size: 1.0rem;
  height: 3.6rem;
  line-height: 3.6rem;
  margin: 0 10px;
  position: relative;
  text-align: center;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 3.6rem;
  z-index: 20;
}      

.Elemento2 { /* global button class */
  background-color: white;
  border-radius: 3.6rem;
  cursor: pointer;
  display: inline-block;
  font-size: 1.0rem;
  height: 3.6rem;
  line-height: 2.5rem;
  margin: 0 10px;
  position: relative;
  text-align: center;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 3.6rem;
  z-index: 20;
}  

/*Termina iconos creditos*/

.btn-guinda { 
  color: #FFFFFF; 
  background-color: #731E3D; 
  border-color: #59092D; 
} 
 
.btn-guinda:hover, 
.btn-guinda:focus, 
.btn-guinda:active, 
.btn-guinda.active, 
.open .dropdown-toggle.btn-guinda { 
  color: #FFFFFF; 
  background-color: #99143A; 
  border-color: #59092D; 
} 
 
.btn-guinda:active, 
.btn-guinda.active, 
.open .dropdown-toggle.btn-guinda { 
  background-image: none; 
} 
 
.btn-guinda.disabled, 
.btn-guinda[disabled], 
fieldset[disabled] .btn-guinda, 
.btn-guinda.disabled:hover, 
.btn-guinda[disabled]:hover, 
fieldset[disabled] .btn-guinda:hover, 
.btn-guinda.disabled:focus, 
.btn-guinda[disabled]:focus, 
fieldset[disabled] .btn-guinda:focus, 
.btn-guinda.disabled:active, 
.btn-guinda[disabled]:active, 
fieldset[disabled] .btn-guinda:active, 
.btn-guinda.disabled.active, 
.btn-guinda[disabled].active, 
fieldset[disabled] .btn-guinda.active { 
  background-color: #731E3D; 
  border-color: #59092D; 
} 
 
.btn-guinda .badge { 
  color: #731E3D; 
  background-color: #FFFFFF; 
}


.btn-cancel { 
  color: #FFFFFF; 
  background-color: #3D3A3A; 
  border-color: #3C3C3D; 
} 
 
.btn-cancel:hover, 
.btn-cancel:focus, 
.btn-cancel:active, 
.btn-cancel.active, 
.open .dropdown-toggle.btn-cancel { 
  color: #FFFFFF; 
  background-color: #1C1C1C; 
  border-color: #3C3C3D; 
} 
 
.btn-cancel:active, 
.btn-cancel.active, 
.open .dropdown-toggle.btn-cancel { 
  background-image: none; 
} 
 
.btn-cancel.disabled, 
.btn-cancel[disabled], 
fieldset[disabled] .btn-cancel, 
.btn-cancel.disabled:hover, 
.btn-cancel[disabled]:hover, 
fieldset[disabled] .btn-cancel:hover, 
.btn-cancel.disabled:focus, 
.btn-cancel[disabled]:focus, 
fieldset[disabled] .btn-cancel:focus, 
.btn-cancel.disabled:active, 
.btn-cancel[disabled]:active, 
fieldset[disabled] .btn-cancel:active, 
.btn-cancel.disabled.active, 
.btn-cancel[disabled].active, 
fieldset[disabled] .btn-cancel.active { 
  background-color: #3D3A3A; 
  border-color: #3C3C3D; 
} 
 
.btn-cancel .badge { 
  color: #3D3A3A; 
  background-color: #FFFFFF; 
}


/*Imagenes*/

.portfolio {
  position: relative;
  width: 100%;
  height: 200px;
  padding: 0;
  overflow: hidden;
  margin: 0;
}

.portfolio_items {
  position: absolute;
  left: 0;
  top: 0;
  width: 400%;
  -webkit-animation: slide 20s infinite ease;
  animation: slide 20s infinite linear;
}

.portfolio_item {
  position: relative;
  display: block;
  padding: 0;
  margin: 0;
  float: left;
  width: 25%;
}

.portfolio_item img {
  width: 100%;
  border: 0;
  outline: 0;
  display: block;
}

.portfolio_item figcaption {
  position: absolute;
  top: 0%;
  left: 0;
  width: 25%;
  height: 1.5em;
  line-height: 1.5em;
  padding: 1%;
  text-align: center;
  border-radius: 0 5px 5px 0;
  background: black;
  background: rgba(0, 0, 0, 0.3);
  color: #fff;
  transition: all 1s ease;
}
/* fx */

@keyframes leftRight {
  0% {
    width: 0%;
  }
  30% {
    width: 50%;
  }
  32% {
    width: 0%;
  }
  63% {
    width: 50%;
  }
  64% {
    width: 0%;
  }
  97% {
    width: 50%;
  }
  98% {
    width: 0%;
  }
}

@-webkit-keyframes leftRight {
  0% {
    width: 0%;
  }
  30% {
    width: 50%;
  }
  32% {
    width: 0%;
  }
  63% {
    width: 50%;
  }
  64% {
    width: 0%;
  }
  98% {
    width: 50%;
  }
  100% {
    width: 0%;
  }
}

@-webkit-keyframes slide {
  0% {
    left: 0%;
    opacity: 0;
  }
  3% {
    left: 0%;
    opacity: 1;
  }
  30% {
    left: 0%;
    opacity: 1;
  }
  33% {
    left: 0%;
    opacity: 0;
  }
  34% {
    left: -100%;
    opacity: 0;
  }
  37% {
    left: -100%;
    opacity: 1;
  }
  63% {
    left: -100%;
    opacity: 1;
  }
  66% {
    left: -100%;
    opacity: 0;
  }
  67% {
    left: -200%;
    opacity: 0
  }
  70% {
    left: -200%;
    opacity: 1;
  }
  96% {
    left: -200%;
    opacity: 1;
  }
  99% {
    left: -200%;
    opacity: 0;
  }
  100% {
    left: 0%;
    opacity: 0;
  }
}

@keyframes slide {
  0% {
    left: 0%;
    opacity: 0;
  }
  3% {
    left: 0%;
    opacity: 1;
  }
  30% {
    left: 0%;
    opacity: 1;
  }
  33% {
    left: 0%;
    opacity: 0;
  }
  34% {
    left: -100%;
    opacity: 0;
  }
  37% {
    left: -100%;
    opacity: 1;
  }
  63% {
    left: -100%;
    opacity: 1;
  }
  66% {
    left: -100%;
    opacity: 0;
  }
  67% {
    left: -200%;
    opacity: 0
  }
  70% {
    left: -200%;
    opacity: 1;
  }
  96% {
    left: -200%;
    opacity: 1;
  }
  99% {
    left: -200%;
    opacity: 0;
  }
  100% {
    left: 0%;
    opacity: 0;
  }
}

/*Termina Imagenes*/


.navbar {
  background: #6B0A21;
  color: #fff;  
  width:100%;
  z-index:1;
  position:fixed;
}



footer {
  background: #6B0A21;
  color: #ffffff;
  width:100%;
  display: flex;
  flex-flow: row wrap;  
  bottom: 0;
  /*you could also get rid of the .wrapper justify-content and use margin-top: auto*/
}




.icon-button {
  background-color: white;
  border-radius: 3.6rem;
  cursor: pointer;
  display: inline-block;
  font-size: 2.0rem;
  height: 3.6rem;
  line-height: 3.6rem;
  margin: 0 5px;
  position: relative;
  text-align: center;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 3.6rem;
}


/* Circle */

.icon-button span {
  border-radius: 0;
  display: block;
  height: 0;
  left: 50%;
  margin: 0;
  position: absolute;
  top: 50%;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
  width: 0;
}

.icon-button:hover span {
  width: 3.6rem;
  height: 3.6rem;
  border-radius: 3.6rem;
  margin: -1.8rem;
}

.twitter span {
  background-color: #4099ff;
}

.facebook span {
  background-color: #3B5998;
}

.google-plus span {
  background-color: #db5a3c;
}

.youtube span {
  background-color: #cc181e;
}

/* Icons */

.icon-button i {
  background: none;
  color: white;
  height: 3.6rem;
  left: 0;
  line-height: 3.6rem;
  position: absolute;
  top: 0;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
  width: 3.6rem;
  z-index: 10;
}

.icon-button .icon-twitter {
  color: #4099ff;
}

.icon-button .icon-facebook {
  color: #3B5998;
}

.icon-button .icon-google-plus {
  color: #db5a3c;
}

.icon-button .icon-youtube {
  color: #cc181e;
}

.icon-button:hover .icon-twitter,
.icon-button:hover .icon-facebook,
.icon-button:hover .icon-google-plus,
.icon-button:hover .icon-youtube {
  color: white;
}

.icon-youtube-sign:before {
  font-family: "FontAwesome";
  content: "\f166";
}

.icon-youtube:before {
  font-family: "FontAwesome";
  content: "\f16a";
}



.custom-list li{
  padding-right:10px;
  padding-top:0px;
}


@media (min-width: 240px) 
{
 .cuerpo{
	font-family: 'Lato', sans-serif;
	font-size: 8px;	
 }
 #hlogo
 {
  padding-top:0px;
  width:70px;
  height:42px;
 }
 #bsis
 {  
  padding-top:3px;
  width:60%;  
 }
 #hh1
 {
  font-size:1em;
 }
 #ing
 {
  font-family: 'Pacifico', cursive;
  font-size: 1.8em;
 }
 .navbar
 {
  height:60px;
 }
 .navbar ul li
 {
  padding-top: 10px;
 }
 .navbar ul li
 {
  background:#000000;
  color:#fffff;
  z-index: 0;
 }

 .main
 {
  padding-top:65px; 
  padding-bottom:10px; 
 }
.credits
{
 width="50%"
}
 #titulo
 {
  font-size:1em;
 }
 .grande{
	font-size: 2.5em;
}

 footer
 {
  font-size: 8.5px;
 }
 footer div
 {
  padding-top:4px;
  padding-bottom:4px;
 }
 #saludo {
    font-size: 1em;
    padding-top:5px; 
    padding-left: 3px;
  }
  .portfolio_item figcaption {
    width: 50%
  }
  .portfolio {
    height: 150px;
  }
  .pimg {
    height: 150px;
  }
}
}


@media (min-width: 320px) 
{
#saludo {
    font-size: 1em;
    padding-top: 8px; 
    padding-left: 10px;
  }
  .portfolio_item figcaption {
    width: 35%
  }
  .portfolio {
    height: 150px;
  }
  .pimg {
    height: 150px;
  }
}

@media (min-width: 480px) 
{
 #bsis
 {  
  padding-top:8px;
  width:40%;  
 }
 #saludo {
    font-size: 2em;
    padding-top:15px; 
    padding-left: 15px;
  }
  .portfolio_item figcaption {
    width: 25%
  }
  .portfolio {
    height: 250px;
  }
  .pimg {
    height: 250px;
  }
}

@media (min-width: 760px) 
{
 #hlogo
 {
  padding-top: 5px;
  width:100px;
  height:60px;
 }
 .navbar ul li
 {
  padding-top: 30px;
 }
 .navbar ul li
 {
  background:none;
  font-size:10px;
 }
 #bsis
 {  
  padding-top:10px;
  width:25%;  
 }
 #hh1
 {
  font-size:2em;
 }
 #ing
 {
  font-family: 'Pacifico', cursive;
  font-size: 2.5em;
  padding.top:10px;
 }
 .navbar
 {
  height:85px;
  font-family: 'Oswald', sans-serif;
  font-size:11px;
 }
 #titulo
 {
  font-size:4em;
 }
 .grande{
	font-size: 5em;
}
.cuerpo{
	font-family: 'Rosario', sans-serif;
	font-size: 1.5em;	
 }
  .main
{
 padding-top:80px;
 padding-bottom:140px;
}
 

 footer
 {
  font-size:10px;
  position: fixed;
 }
 footer div
 {
  padding-top:10px;
  padding-bottom:10px;
 }
 #saludo {
    font-size: 4em;
    padding-top:5px; 
    padding-left: 30px;
  }
  
  .portfolio_item figcaption {
    width: 20%
  }
  .portfolio {
    height: 350px;
  }
  .pimg {
    height: 350px;
  }
}
@media (min-width: 1400px) 
{
 #bsis
 {  
  padding-top:10px;
  width:25%;  
 }
 #hh1
 {
  font-size:2.5em;
 }
 .portfolio {
    height: 600px;
  }
  .pimg {
    height: 600px;
  }
}