@media screen{

body{font-family: 'Open Sans', Verdana, sans-serif !important; background-color: #FAFAFA}

a{		transition: color .2s ease;
	 -o-transition: color .2s ease;
   -moz-transition: color .2s ease;
-webkit-transition: color .2s ease;}

/* Header */
header{height: 160px; background-color: #232323; color: white;}
header .logo img{border: 5px solid white; border-radius: 100%}
header .logo{height: 95px; 
width: 150px; text-align: center; padding: 30px 25px; float: left
}
header .info{float: left; padding: 45px 0 0}
header .info *{margin: 0}
header .info .nombre{color: white; font-weight: 300}

/* Wrapper */

.info-bar{height: 35px; padding: 3px 15px 0}
.info-bar:after{content: ""; border-bottom: 2px solid; display: block; clear: both}
.info-bar p{font-size: 12px; margin-bottom: 0}

/* Navegacion primaria */
.nav-prim{width: 150px; background-color: #323232; text-align: center; color: white}
.nav-prim .info-bar:after {border-color: #464646}
.nav-prim .info-bar h6{color: white; font-size: 14px;}
.nav-prim .side-nav li{font-size: 12px; margin: 0;
		transition: background-color .2s ease;
	 -o-transition: background-color .2s ease;
   -moz-transition: background-color .2s ease;
-webkit-transition: background-color .2s ease;
}
.nav-prim .side-nav li a{height: 70px; color: white !important}
.nav-prim .side-nav li:hover a{color: #05C8FF !important}
.nav-prim .side-nav li:hover{background-color: #464646}
.nav-prim .side-nav li.active{background-color: #05C8FF !important}
.nav-prim .side-nav li.active:hover a{color: white !important}
.nav-prim .side-nav li .icon{display: block;margin: 0 0 5px auto}

.nav-prim, .nav-interna{float: left; height: 100%}

/* Navegacion interna */
.nav-interna{background-color: #F0F0F0; width: 170px}
.nav-interna .info-bar:after {border-color: #DCDCDC}
.nav-interna .info-bar h6{color: #323232; font-size: 14px;}
.links-interna{padding: 10px; font-size: 13px; list-style-type: disc;}
.links-interna li{margin: 5px 0;}
.links-interna a{color: #969696}
.links-interna li.active a{color: #646464; font-weight: 600}
.links-interna a:hover{text-decoration: underline;}

nav, .contenido-wrapper{float: left;}


/* Contenido */
.contenido-wrapper{background-color: white; width: calc(100% - 150px - 170px)}
.contenido-wrapper .info-bar:after {border-color: #F0F0F0}
.contenido-wrapper .info-bar div{padding: 6px 0}

.titulo{color: #05C8FF; font-weight: 700}
.titulo:after{ content:""; width: 50%; border-bottom: 2px solid #05C8FF; margin-bottom: 25px; display: block}
.contenido ul{list-style-type: square}

/* Footer */

footer{padding:15px 0 0; clear: both}
footer p{font-size: 12px}

}

@media screen and (max-width: 768px){

header{height: auto; padding: 15px; text-align: center}
header .logo img{width: 70px; border: 3px solid white;}
header .logo, header .info{float:none; padding: 0; height: auto; width: 100%}
.wrapper{min-height: auto}

.nav-prim{width: 60px}
.nav-prim .info-bar{display: none}
.nav-prim .side-nav li a{height: auto}
.nav-prim .side-nav li span{display: none}

.nav-interna{display: none}

.contenido-wrapper{background-color: white; width: calc(100% - 60px)}
.contenido-wrapper .info-bar {height: auto}

}