/* ==========================================================================
   Author's custom styles
   ========================================================================== */

body {padding:0; margin:0; font-family: 'Open+Sans', sans-serif; font-weight: 300; line-height: 170%; font-size: 16px; overflow-x: hidden;}

body {background-attachment: scroll; background-repeat: no-repeat; background-size: 100%; background-position: top left;}

a, a:hover, a:focus {color:#d2232a;}
p {margin-bottom: 30px;}
h2 {margin-bottom: 30px;}

h1,h2,h3,h4 {font-family: brandon-grotesque, sans-serif; font-weight: 700; font-style: normal;}
.brandon-medium {font-family: brandon-grotesque, sans-serif; font-weight: 500; font-style: normal;}

.u-shadow {
    text-shadow: 0 0 30px rgba(0, 0, 0, 0.3), 10px 0 30px rgba(0, 0, 0, 0.3), 0 10px 30px rgba(0, 0, 0, 0.3), 10px 10px 30px rgba(0, 0, 0, 0.3);}

/*Header*/

header {width: 100%; padding: 15px 0 0; transition: 0.5s; background-color: #FFF; top: 0; position: fixed; z-index: 2;}
header h1 {margin: 0; width: 300px; height: 54px;}
header h1 a {display: block; text-indent: -9000px; background-attachment: scroll; background-repeat: no-repeat; background-size: contain; background-image: url(../img/sistema-bibliotecas-udp-logo.png); width: 100%; height: 100%;}
header.header-scroll { }

header form {float: right; margin-top: 10px; width: 100%;}
header form input#s {width: 70%;
    border-radius: 0;
    border: 1px solid #666;}
header form button#searchsubmit {border: none; background-color:#FFF;}


/*Menu Desktop*/

section.menu-global {width: 100%; background-color: #000;}
ul.menu-desktop {padding-left: 0; height:auto; width: auto; display: inline-block; margin-left: 0; float: left; margin-bottom: 0; font-family: brandon-grotesque, sans-serif; font-weight: 700; font-style: normal;}
ul.menu-desktop li {list-style: none; float: left; height:auto; font-size: 12px; text-transform: uppercase;}
ul.menu-desktop li a {padding: 10px 20px;  letter-spacing: 1px; opacity: 0.8; display: block; vertical-align: middle; color: #FFF;}
ul.menu-desktop li a:hover, ul.menu-desktop li a:focus {color: #FFF; text-decoration: none; opacity: 1;}
ul.menu-desktop li.current_page_parent a, ul.menu-desktop li.current_page_item a {}
ul.menu-desktop li ul.dropdown-menu li.current_page_item a {border-bottom:none}

b.caret { border-top: 4px solid #FFF;}
ul.menu-desktop li ul.dropdown-menu li { display:block; width:100%; height: 30px;}
ul.menu-desktop li ul.dropdown-menu { background-color: rgba(0,0,0,1); border:none; margin-top:0; border-radius:0; -moz-border-radius:0; -webkit-border-radius:0; padding:0; z-index:3000; padding-bottom: 20px;}
ul.menu-desktop li ul.dropdown-menu li a { color:#FFF; opacity:0.8; text-decoration:none;  font-size:12px;}
ul.menu-desktop li ul.dropdown-menu li a:hover { opacity:1; color:#FFF; background: none; background-image:none;}
ul.menu-desktop li ul.dropdown-menu li:hover { opacity:1; color:#FFF; background-color: none}

  .dropdown:hover .dropdown-menu {
    display: block;
  }


/*Menu Mobile*/

a.btn-top-menu { height:50px; width:50px; cursor:pointer; display:none; position:fixed; top:20px; right:25px; color:#000; font-size:36px; text-align:center; z-index: 1000;}
a.btn-top-menu:hover {background:none;}
a.close-menu-global { background:none; }
a#boton-cerrar-menu { color:#000;}
body.home a.btn-top-menu {color:#FFF;}

header.header-scroll a.btn-top-menu {color:#000;}
div.mobile-menu { position:absolute; top:120; left:0; width:100%; background-color:#FFF; z-index:999; text-align:left; padding-bottom:30px; height: 200vh; padding-top:0; }
div.mobile-menu ul { margin:0; padding-left:0;}
div.mobile-menu ul li { font-size:16px; padding:5px 0; margin-left:0; list-style:none; text-align:left; font-weight: 500; color:#000;}
div.mobile-menu ul li a { color:#000;}
div.mobile-menu ul li ul {padding-left: 15px; margin-top: 20px;}
div.mobile-menu ul li ul li {padding-top: 5px;}

div.mobile-menu h1 {margin: 0; width: 260px; height: 60px;}
div.mobile-menu h1 a {display: block; text-indent: -9000px; background-attachment: scroll; background-repeat: no-repeat; background-size: contain; background-image: url(../img/logo-observatorio-color.png); width: 100%; height: 100%;}


/*Content*/
div.content {position: relative; margin-top: 134px; width: 100%; min-height: 600px; z-index: 1;}


a.prev {
    position: absolute;
    font-size: 48px;
    color: #000;
    top: 240px;
    right: 220px;
    text-decoration: none;
    z-index: 200;
	width: 50px;
    text-align: center;
}

a.next {
    position: absolute;
    font-size: 48px;
    color: #000;
    top: 240px;
    right: 160px;
    text-decoration: none;
    z-index: 200;
	width: 50px;
    text-align: center;
}

/*Home*/

section.destacados-portada a.prev { text-indent: -9000px; display: block; height: 50px; background-attachment: scroll; background-position: center center; background-size: contain; background-image: url(../img/flecha-box-white-left.png);}
section.destacados-portada a.prev:hover {background-image: url(../img/flecha-box-black-left.png);}
section.destacados-portada a.next { text-indent: -9000px; display: block; height: 50px; background-attachment: scroll; background-position: center center; background-size: contain; background-image: url(../img/flecha-box-white.png);}
section.destacados-portada a.next:hover {background-image: url(../img/flecha-box-black.png);}
section.destacados-portada a.prev, section.destacados-portada a.next {transition: 0.5s;}


section.destacados-portada { min-height: 280px; background-color: #f2f3f7; padding: 20px 0;}
section.destacados-portada h2 { font-size: 48px; padding-right: 30px; line-height: 118%; margin-top: 0;}
section.destacados-portada h2 a {color:#000;}
section.destacados-portada p {}
section.destacados-portada div.slider-home {width: 100%;}
section.destacados-portada div.slide {width: 100%;}

section.bibliotecas-portada {background-color: #FFF; padding: 40px 0;}
section.bibliotecas-portada h2 { font-size: 32px; padding-right: 30px; line-height: 130%; margin-top: 0;}
.bx-wrapper img {}
.bx-wrapper {z-index:1;}
.bx-wrapper .bx-viewport { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; border: none; background: none; left: 0;}
.bx-wrapper .bx-controls-direction a {     transition: 0.5s; opacity: 1; position: relative; width: 50px; margin-top: 0;}
.bx-wrapper .bx-controls-direction a.bx-prev {text-indent: -9000px; display: block; height: 50px; background-attachment: scroll; background-position: center center; background-size: contain; background-image: url(../img/flecha-box-white-left.png); left: auto;}
.bx-wrapper .bx-controls-direction a.bx-prev:hover {background-image: url(../img/flecha-box-black-left.png);}
.bx-wrapper .bx-controls-direction a.bx-next {text-indent: -9000px; display: block; height: 50px; background-attachment: scroll; background-position: center center; background-size: contain; background-image: url(../img/flecha-box-white.png); right: auto}
.bx-wrapper .bx-controls-direction a.bx-next:hover {background-image: url(../img/flecha-box-black.png);}
.bx-wrapper .bx-controls-direction {    position: absolute; top: 10%; left: -100px;}




ul.slider-bibliotecas li {background-color: #f2f3f7; min-height: 280px;}
ul.slider-bibliotecas li h4 {margin: 20px; font-size: 20px;}
ul.slider-bibliotecas li h4 a {color: #000;}
ul.slider-bibliotecas li p {margin-left: 20px; font-family: brandon-grotesque, sans-serif;font-weight: 700; font-style: normal; font-size: 13px; letter-spacing: 1px;}
ul.slider-bibliotecas li p a {color: #000; text-transform: uppercase;}
ul.slider-bibliotecas li p a:hover {text-decoration: none;}
ul.slider-bibliotecas li p a span {color:#d2232a;}

section.titulos-portada {}
section.titulos-portada { min-height: 400px; background-color: #FFF; padding: 60px 0;}
section.titulos-portada h2 { font-size: 42px; padding-right: 30px; line-height: 130%; margin-top: 0; margin-bottom: 60px;}
div.repeat-nuevos-titulos {margin-bottom: 30px;}
a.thumb-nuevos-titulos {min-height: 280px; background-attachment: scroll; background-repeat: no-repeat; background-position: top center; background-size: cover; display: block; margin-bottom: 15px;}
div.repeat-nuevos-titulos h4 {margin-bottom: 20px; font-size: 20px;}
div.repeat-nuevos-titulos p {font-family: brandon-grotesque, sans-serif;font-weight: 700; font-style: normal; font-size: 13px; letter-spacing: 1px;}
div.repeat-nuevos-titulos p.autor {font-family: 'Open+Sans', sans-serif; font-weight: normal;}
div.repeat-nuevos-titulos p a {color: #000; text-transform: uppercase;}
div.repeat-nuevos-titulos p a:hover {text-decoration: none;}
div.repeat-nuevos-titulos p a span {color:#d2232a;}

body.page-parent section.tres-destacados-portada {min-height: 400px; background-color: #f2f3f7; padding: 60px 0 120px;}
section.tres-destacados-portada a {display: block; min-height: 320px; background-attachment: scroll; background-size: cover; background-position: center center; background-repeat: no-repeat; padding: 30px; color: #FFF;font-family: brandon-grotesque, sans-serif;font-weight: 700; font-style: normal; font-size: 28px; letter-spacing: 1px; text-transform: uppercase; line-height: 130%; text-align: left; margin-bottom: 30px; }
section.tres-destacados-portada a:hover { text-decoration: none;}


.no-gutter {
  margin-right: 0;
  margin-left: 0;
}

.no-gutter > [class*="col-"] {
  padding-right: 0;
  padding-left: 0;
}


/*Page*/

section.breadcrum { width: 100%; height: 55px; padding-top: 20px; margin-bottom: 16px; margin-top: 0; color: #666; font-size: 14px; font-family: brandon-grotesque, sans-serif; font-weight: 500; font-style: normal;}
section.breadcrum p { margin-bottom: 0; font-weight: 300;}
section.breadcrum p span { color: #666;}
section.breadcrum p a { color: #000;}
section.breadcrum a {color: #333;}
section.breadcrum a:hover {}

.img-page-container img { width: 100%; height: auto;}
.content-container {padding-bottom: 30px;}
.content-container h2 {margin-bottom: 30px; line-height: 130%; text-transform: uppercase; color:#d2232a; font-size: 42px; }
.content-container h3 {font-weight: 500; font-style: normal; margin-bottom: 30px; line-height: 130%; font-size: 24px; padding-right: 30px;}
.content-container h4 {font-weight: 500; font-style: normal; margin-bottom: 30px; line-height: 130%; font-size: 24px; padding-right: 30px;}
.content-container p {margin-bottom: 30px;}
.content-container ul li {margin-bottom: 15px;}


/*Equipo*/
.repeat-equipo { background-color: #f2f3f7; margin-bottom: 30px; min-height: 550px; padding-bottom: 30px;}
.repeat-equipo div.thumb-persona {height: 280px; margin-bottom: 15px; display: block; width: 100%; background-attachment: scroll; background-position: top center; background-size: cover; background-repeat: no-repeat; margin-top: 0;}
.repeat-equipo h3 { font-size: 24px; font-weight: 600; line-height: 130%; margin-top: 10px; margin-bottom: 10px; padding-top: 10px;  padding: 0 15px;}
.repeat-equipo p.cargo {color: #222; font-size: 14px; margin-bottom: 5px; padding: 0 15px; font-weight: 500;}
.repeat-equipo p.email {color: #222; font-size: 14px; margin-bottom: 5px; padding: 0 15px;}
.repeat-equipo p.email a {color: #222; text-decoration: underline;}

/*Catálogo Online*/
body.page-id-24 .content-container {padding-bottom: 0;}
.container-form-catalogo-online {padding-bottom: 90px;}
form.form-catalogo-online {}
form.form-catalogo-online select {border-radius: 0; width: 100%; height: 40px; padding: 5px; margin-bottom: 15px;}
form.form-catalogo-online input {border-radius: 0; background-color: #FFF; color: #000; width: 100%; height: 40px; border:1px solid #000; padding: 5px; margin-bottom: 15px;}
form.form-catalogo-online input#boton-catalogo-online {border-radius: 0; background-color: #000; color: #FFF; width: 100%; height: 40px; border:1px solid #000; font-family: brandon-grotesque, sans-serif; font-weight: 700; font-style: normal; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 15px;}


/*Formato Tesis */
 a.repeat-formato {height: 100%; display: block; width: 100%; padding: 30px; color: #FFF; font-size: 24px; font-family: brandon-grotesque, sans-serif; font-weight: 700; font-style: normal; text-transform: uppercase; letter-spacing: 1px; position: relative; background-color: #323232; margin-bottom: 60px; min-height: 300px; opacity: 0.8;}
 a.repeat-formato i {position: absolute; right: 30px; top: 30px; }
a.repeat-formato:hover {text-decoration: none; opacity: 1;}

/*Recursos */
 a.repeat-recurso {height: 100%; display: block; width: 100%; padding: 90px 30px; color: #FFF; font-size: 18px; font-family: brandon-grotesque, sans-serif; font-weight: 700; font-style: normal; text-transform: uppercase; letter-spacing: 1px; position: relative; background-color: #323232; margin-bottom: 30px; min-height: 290px; opacity: 0.8; background-attachment: scroll; background-repeat: no-repeat; background-position: center center; background-size: cover;}
 a.repeat-recurso i {position: absolute; right: 30px; top: 30px; }
a.repeat-recurso:hover {text-decoration: none; opacity: 1;}

/*Colecciones Electrónicas*/
body.page-id-26 .content-container {padding-bottom: 30px;}

/*Colapsables*/

.panel-heading [data-toggle="collapse"].collapsed:after{
    content: "+ ";
    float: right;
	display: inline-block;
	font-size: 40px;
	margin-right: 10px;
	line-height: 20px;
	margin-top: 0;
}
.panel-heading [data-toggle="collapse"]:after {
    content: "- ";
    float: right;
	display: inline-block;
	font-size: 40px;
	margin-right: 10px;
	margin-top: 0;
}

/*Page Colapsables*/

div.panel-group { margin-top: 0; margin-bottom: 60px;}
div.panel-group div.panel-default { box-shadow: none; border: none; border-radius: 0; margin-bottom: 15px; border:1px solid #000; }
div.panel-group div.panel-default div.panel-heading {  background: none; border: none; padding:10px 20px; border-bottom: none;}
div.panel-group div.panel-default div.panel-heading h4 { font-size: 18px; font-weight: 700; text-transform: uppercase; margin-bottom: 0;}
div.panel-group div.panel-default div.panel-heading h4 a { display: block; color:#000;}
div.panel-group div.panel-default div.panel-heading h4 a:hover  { text-decoration: none; color:#000; }
div.panel-group div.panel-default div.panel-heading h4 a:focus  { text-decoration: none; color:#000; }
div.panel-group div.panel-default ul.list-group { padding-left: 0; border-radius: 0; box-shadow: none;}
div.panel-group div.panel-default ul.list-group li { padding-left: 20px; list-style: none; margin: 10px; font-size: 12px;}
div.panel-group div.panel-default ul.list-group li a { color:#000; opacity: 0.8; text-decoration: none;}
div.panel-group div.panel-default ul.list-group li a:hover { color:#000; opacity: 0.8; text-decoration: none;}

/*Suscripciones UDP*/
body.page-id-28 .content-container {padding-bottom: 30px;}

body.page-id-28 .nav-pills {border: 1px solid #333; margin-bottom: 30px;}
body.page-id-28 .nav-pills>li>a {border-radius: 0; color: #333; font-family: brandon-grotesque, sans-serif;font-weight: 700; font-style: normal; font-size: 16px;}
body.page-id-28 .nav-pills>li.active>a, body.page-id-28 .nav-pills>li.active>a:hover, body.page-id-28 .nav-pills>li.active>a:focus {background-color: #333; color: #FFF;}

div.repeat-suscripcion {margin-bottom: 30px; padding: 30px; background-color: #f2f3f7; position: relative; min-height: 280px;}
div.repeat-suscripcion p {}
div.repeat-suscripcion p.link-suscripcion {margin-left: 0; font-family: brandon-grotesque, sans-serif;font-weight: 700; font-style: normal; font-size: 13px; letter-spacing: 1px; margin-top: 30px; margin-bottom: 0;}
div.repeat-suscripcion p.link-suscripcion a {color: #000; text-transform: uppercase;}
div.repeat-suscripcion p.link-suscripcion a:hover {text-decoration: none;}
div.repeat-suscripcion p.link-suscripcion a span {color:#d2232a;}
div.repeat-suscripcion span.acceso {position: absolute; top: 15px; right: 15px; color:#d2232a; font-size: 24px; font-weight: 900; }

/*Acceso Remoto*/
body.page-id-323 .content-container {padding-bottom: 30px;}

body.page-id-323 .nav-pills {border: 1px solid #333; margin-bottom: 30px;}
body.page-id-323 .nav-pills>li>a {border-radius: 0; color: #333; font-family: brandon-grotesque, sans-serif;font-weight: 700; font-style: normal; font-size: 16px;}
body.page-id-323 .nav-pills>li.active>a, body.page-id-28 .nav-pills>li.active>a:hover, body.page-id-28 .nav-pills>li.active>a:focus {background-color: #333; color: #FFF;}

/*Sugerencia de Libros*/
form.wpcf7-form {width: 100%;}
form.wpcf7-form label {width: 100%;}
form.wpcf7-form input {width: 100%; border-radius: 0; border:1px solid #CCC; padding: 5px 10px;}
form.wpcf7-form textarea {width: 100%; border-radius: 0; border:1px solid #CCC; padding: 10px;}
form.wpcf7-form input.wpcf7-submit {font-family: brandon-grotesque, sans-serif;font-weight: 700; font-style: normal; font-size: 16px; letter-spacing: 1px; margin-top: 30px; background-color: #000; color: #FFF; text-transform: uppercase; text-align: center; width: auto; display: inline-block; padding: 10px 30px;}

/*Contacto*/
.repeat-contacto {}
 .repeat-contacto a {height: 100%; display: block; width: 100%; padding: 30px; color: #FFF; font-size: 24px; font-family: brandon-grotesque, sans-serif; font-weight: 700; font-style: normal;  letter-spacing: 1px; position: relative; background-color: #323232; margin-bottom: 60px; min-height: 240px; opacity: 0.8;}
 .repeat-contacto a i {color:#d2232a; font-size: 24px; }
.repeat-contacto a:hover {text-decoration: none; opacity: 1;}
.repeat-contacto a p {font-weight: 400;}

/*Noticias*/
.repeat-noticia { background-color: #f2f3f7; margin-bottom: 30px; min-height: 460px; }
.repeat-noticia a.thumb-noticia {height: 240px; margin-bottom: 15px; display: block; width: 100%; background-attachment: scroll; background-position: center center; background-size: cover; background-repeat: no-repeat; margin-top: 0;}
.repeat-noticia h3 { font-size: 24px; font-weight: 600; line-height: 130%; margin-top: 10px; margin-bottom: 10px; padding-top: 10px;  padding: 0 15px;}
.repeat-noticia h3 a {color:#000;}
.repeat-noticia p.fecha {color: #222; font-size: 14px; margin-bottom: 5px; padding: 0 15px; font-family: brandon-grotesque, sans-serif; font-weight: 400; font-style: normal; text-transform: uppercase;}
.repeat-noticia p.ver-mas {margin-left: 20px; font-family: brandon-grotesque, sans-serif;font-weight: 700; font-style: normal; font-size: 13px; letter-spacing: 1px;}
.repeat-noticia p.ver-mas a {color: #000; text-transform: uppercase;}
.repeat-noticia p.ver-mas a:hover {text-decoration: none;}
.repeat-noticia p.ver-mas a span {color:#d2232a;}


/*Videos*/
.repeat-video {margin-top: 30px; padding: 15px; background-color: #FFF; min-height: 360px;}
.repeat-video a {color: #000;}
.repeat-video div {height: 190px; background-size: contain; margin-bottom: 10px; text-align: center; padding-top: 27%;}
.repeat-video a div i {font-size: 48px; color: #FFF;}
.repeat-video h3 { font-size: 18px; font-weight: 400; line-height: 130%; margin-top: 0; margin-bottom: 10px; font-family: 'Roboto', sans-serif; font-weight: 600;}
.repeat-video h3 a {color: #000;}
.repeat-video p {color: #5d8cf6; font-size: 12px; margin-bottom: 0;}



/*Single*/
section.single {}
section.single div.single-content {padding-bottom: 120px;}
section.single div.single-content h2 { font-size: 24px;}



ul.menu_social {  width: 40px; height: 160px; top: 200px; right: 40px; position: fixed; padding-left: 0; text-align: center; z-index: 1; background-color: #FFF;}
ul.menu_social li { margin: 0 0; list-style: none;  width: 40px; height: 40px;}
ul.menu_social li a { color: #000; text-decoration: none; width: 40px; height: 40px; text-align: center; display: block;}
.menu_social li.whatsapp a {border-bottom: none;}
ul.menu_social li a i { font-size: 20px; vertical-align: bottom;}
.menu_social li.email a:hover{color:#000}
.menu_social li.facebook a:hover{color:#3b5998}
.menu_social li.twitter a:hover{color:#00aced}
.menu_social li.whatsapp a:hover{color:#25D366}
.menu_social li.linkedin a:hover{color:#0e76a8}





/*Footer*/
section.prefooter {background-color: #323232; height: 180px; text-align: center; padding-top: 60px; position: relative; padding-bottom: 90px;}
section.prefooter img.logo-footer {width: 70%; margin: 0 auto 30px auto; height: auto;}
section.prefooter img.logo-footer-biblioteca {width: 50%; margin: -15px auto 30px auto; height: auto;}

footer {background-color: #000; color: #FFF; text-align: center; padding-top: 60px; padding-bottom: 30px; min-height: 240px; font-size: 12px;}
footer a, footer a:hover {color: #FFF; text-decoration: none;}
footer .social-icons {padding-top: 30px;}
footer .social-icons a {color: #FFF; display: inline-block; margin: 0 10px 0 30px; vertical-align: sub;}
footer .social-icons a i {font-size: 24px;}
footer img.logo-footer {width: 70%; margin: 0 auto 30px auto; height: auto;}
footer ul { padding-left: 30px;}
footer ul li {list-style: none; text-align: left; font-family: brandon-grotesque, sans-serif; font-weight: 500; font-style: normal; font-size: 18px;}
footer ul li a {display: block; padding: 5px 0 5px 40px; background-attachment: scroll; background-image: url(../img/flecha-footer.png); background-position: left center; background-repeat: no-repeat;}

.col-xs-15,
.col-sm-15,
.col-md-15,
.col-lg-15 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.col-xs-15 {
    width: 20%;
    float: left;
}
@media (min-width: 768px) {
.col-sm-15 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 992px) {
    .col-md-15 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 1200px) {
    .col-lg-15 {
        width: 20%;
        float: left;
    }
}



/* Large desktop */
@media (min-width: 1200px) { 



}

/* Desktop 1024 */
@media (min-width: 980px) and (max-width: 1199px) { 

}

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) { 

	ul.menu-desktop {display: none;}
	a.btn-top-menu {display: block;}
	section.prefooter {height: auto;}
	header form {margin-top: 0; margin-bottom: 20px;}
	header form input#s {width: 90%;}
}

/* Landscape phone to portrait tablet */
@media (min-width: 481px) and (max-width: 767px) { 
	
	ul.menu-desktop {display: none;}
	a.btn-top-menu {display: block;}
	section.prefooter {height: auto;}
	header form {margin-top: 0; margin-bottom: 20px;}
	header form input#s {width: 90%;}
}

/* Landscape phones and down */
@media (max-width: 480px) {
ul.menu-desktop {display: none;}
	a.btn-top-menu {display: block;}
	section.prefooter {height: auto;}
	header form {margin-top: 0; margin-bottom: 20px;}
	header form input#s {width: 90%;}
}