@charset "UTF-8";
/* CSS Document */

html {
	
	
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}

body { margin: 0 auto; }
footer, header { position: relative; clear: both; }
.left-column, .right-column, .side-nav, footer, header {border: 1px solid  #ccc; padding: 1.25em; margin: .5em; }

/* LAYOUT STYLES */
#Content, #Alphaindex {height: 80vh; overflow: scroll; overflow-x: hidden;}

html, body {height: 100%;}



.body {background-image: url("/images/Background-Analglypta-white.gif");
}

.body {backgrond-attachment: fixed;
}


#Content::-webkit-scrollbar, #Alphaindex::-webkit-scrollbar, #Quick::-webkit-scrollbar, body::-webkit-scrollbar {display: none;} /* NO SCROLLBARS COLUMNS AND BODY*/

 NO FUNCIONA, DE ALGUNA FORMA HAY QUE ACCEDER A LAS IMG DE DENTRO DEL HTML CARGADO CON JAVASCRIPT 
 CSS PARA LAS IMAGENES Y ASI HACEN RESIZE SEGUN EL PARENT QUE ES #Content en la plantilla 
#Content img {height: auto;  max-width: 100%; max-height: 100%;}
 CSS PARA LAS IMAGENES Y ASI HACEN RESIZE SEGUN EL PARENT QUE ES #Content en la plantilla 

/* LAYOUT STYLES */
a {text-decoration:none;}

/* CENTER NAVTOP AND NAVLEFT ELEMENTS*/
ul.navTop, ul.navLeft {display: inline-block;}
ul {text-align: center;}
/* CENTER NAVTOP AND NAVLEFT ELEMENTS*/


/* QUICKLINKS BOX-SHADOW*/
.linkshadow {
  -moz-box-shadow:    7px 4px 10px 2px #888;
  -webkit-box-shadow: -7px 4px 10px 2px #888;
  box-shadow:         7px 4px 10px 2px #888;
}

	
.h2 {
	margin: 5px;
	font-size: 20px;
	font-family: Cambria;
	colour: ;#000000
	font-weight: 200;
}

	


.navTop {
  list-style: none;
  margin-left: 0;
  margin-bottom: 0;
  padding-left: 0;
}

.navTop > li,
.navTop > li > a {
  display: inline-block;
  *display: inline;
  zoom: 1;
  text-decoration: none; /* REMOVE THE UNDERLINE OF TEXT IN HEADER AND FOOTER ELEMENTS*/
}



.inline-items {
  margin-top: 0;
}

.inline-items li {
  margin-left: 0;
  padding-left: 10px;
  padding-right: 10px;
}

.inline-items li:first-child {
  margin-left: 0;
  border: none;
  padding-left: 0;
  padding-right: 10px;
}

.inline-items li:last-child {
  padding-right: 0;
}

 
/* MEDIA QUERIES */
@media screen and (min-width: 47.5em ) {
  .side-nav { width: auto;}

  .columns-container { 
    float: left;
  }

  .left-column { 
    margin-right: 20em;
    float: centre;
  }


div.any {
   position: absolute; /*position: fixed;*/
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   /*You can add anything else to this like image, background-color, etc.*/
}

	
}

@media screen and ( min-width: 62.5em ) {

  .side-nav {
    width: 9.5em;
    margin-right: -10.75em;
    float: left;
  }

  .left-column {
    margin-left: 10.7em;
  }

  .navLeft > li,
  .navLeft > li > a {
    display: block;
    *display: block;
    zoom: 1;
  }

  .inline-items li { padding-left: 0; border: none;}
    
}
  box-sizing: border-box;
}

.body {background-image: url("/images/Background-Analglypta-white.gif");
}

.body {backgrond-attachment: fixed;
}


.rotbox {
    width: auto;
    padding: 0px;
    border: 0px ;
    margin: 30px;
	-moz-box-shadow: 4px 4px 10px #000;
  -webkit-box-shadow: 4px 4px 10px #000;
  box-shadow: 4px 4px 10px #000;  
	
}

.vertbox {
    width: auto;
    padding: 0px;
    border: 0px ;
    margin: 30px;
	-moz-box-shadow: 4px 4px 10px #000;
  -webkit-box-shadow: 4px 4px 10px #000;
  box-shadow: 4px 4px 10px #000;  
	
}
.inline { 
    display: inline;  
    margin:10px;
 }

/* IMAGES BOX-SHADOW*/
.shadow {
  -moz-box-shadow:    7px 2px 10px #888;
  -webkit-box-shadow: -7px 2px 10px #888;
  box-shadow:         7px 2px 10px #888;
}

div.any {
   position: absolute; /*position: fixed;*/
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   /*You can add anything else to this like image, background-color, etc.*/
}


/* GENERAL TEXT COLOURS*/


.tan {
	color: #800000;
}
.white {
	color: #FFF;
}
.Black {
	color: #000;
}
.red {
	color: #F00;
}
.red em {
	color: #F00;
}
red {
	color: #F00;
}

  .Light_Grey {
	color: #C1C1C1;
}
  .Background_Grey {
	color: #D0D0D0;
}
  .Dark_Grey {
	color: #888;
}
	/* SHADOWED TEXT & COLOUR*/
	
h1 {text-shadow: 3px 3px 4px #848484;}	

.Background_Pale_Grey {
	color: #F2F2F2;
}
.Background_Pale_Grey1 {
	color: #F2F2F2;
}
.Captions {
}





.Background_Grey-light {
	color: #FDFDFD;
}
<style>
body {
  font-family: Arial, Helvetica, sans-serif;
}

.navbar {
  overflow: hidden;
  background-color: #333;
}

.navbar a {
  float: left;
  font-size: 16px;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.dropdown {
  float: left;
  overflow: hidden;
}

.dropdown .dropbtn {
  font-size: 16px;  
  border: none;
  outline: none;
  color: white;
  padding: 14px 16px;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}

.navbar a:hover, .dropdown:hover .dropbtn {
  background-color: red;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  float: none;
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdown-content a:hover {
  background-color: #ddd;
}

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

div.scrollmenu {
  background-color: #333;
  overflow: auto;
  white-space: nowrap;
}

div.scrollmenu a {
  display: inline-block;
  color: white;
  text-align: center;
  padding: 14px;
  text-decoration: none;
}

div.scrollmenu a:hover {
  background-color: #777;
}









/* Add a black background color to the top navigation */
.topnav {
  background-color: #333;
  overflow: hidden;
}

/* Style the links inside the navigation bar */
.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}

/* Add an active class to highlight the current page */
.active {
  background-color: #4CAF50;
  color: white;
}

/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {
  display: none;
}

/* Dropdown container - needed to position the dropdown content */
.dropdown {
  float: left;
  overflow: hidden;
}

/* Style the dropdown button to fit inside the topnav */
.dropdown .dropbtn {
  font-size: 17px; 
  border: none;
  outline: none;
  color: white;
  padding: 14px 16px;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}

/* Style the dropdown content (hidden by default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

/* Style the links inside the dropdown */
.dropdown-content a {
  float: none;
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

/* Add a dark background on topnav links and the dropdown button on hover */
.topnav a:hover, .dropdown:hover .dropbtn {
  background-color: #555;
  color: white;
}

/* Add a grey background to dropdown links on hover */
.dropdown-content a:hover {
  background-color: #ddd;
  color: black;
}

/* Show the dropdown menu when the user moves the mouse over the dropdown button */
.dropdown:hover .dropdown-content {
  display: block;
}

/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
@media screen and (max-width: 600px) {
  .topnav a:not(:first-child), .dropdown .dropbtn {
    display: none;
  }
  .topnav a.icon {
    float: right;
    display: block;
  }
   .style41 {font-family: Verdana;
	font-size: 12px;
}
  .Light_Grey {
	color: #C1C1C1;
}
  .Background_Grey {
	color: #D0D0D0;
}
 
 .iframe {
	-webkit-overflow-scrolling: touch;
}

/* GENERAL TEXT COLOURS*/
 

.tan {
	color: #800000;
}
.white {
	color: #FFF;
}
.Black {
	color: #000;
}
.red {
	color: #F00;
}
.red em {
	color: #F00;
}
red {
	color: #F00;
}

.Light_Grey {
	color: #C1C1C1;
}
.Background_Grey {
	color: #D0D0D0;
}
.Dark_Grey {
	color: #888;
}
.container {
			 display: inline-block; 
		}
	/* SHADOWED TEXT & COLOUR*/
	
h1 {text-shadow: 3px 3px 4px #848484;}


p.dotted {border-style: dotted;
}


p.dashed {border-style: dashed;
}
p.solid {border-style: solid;}
p.double {border-style: double;}
p.groove {border-style: groove;}
p.ridge {border-style: ridge;}
p.inset {border-style: inset;}
p.outset {border-style: outset;}
p.none {border-style: none;}
p.hidden {border-style: hidden;}
p.mix {border-style: dotted dashed solid double;} 


.h2-strong-em-grey {
	color: #A1A1A1;
}

  
.element {
  font-size: small;
}

.element {
  font-size: medium;
}

.element {
  font-size: large;
}

/* .box div holds the bottom image */


  .box {
    
    background: url(../images/boxBottom.jpg); 
    background-repeat: no-repeat
    background-attachment: scroll left bottom;
    background-position: left bottom;
    margin-bottom: 10px;
    padding: 0 0 15px;
    width: 250px;
 }

 /*  this is the title h3 tag and contains the background
     image for the title	*/

  .box h3 {

    background: url(../images/box.jpg) repeat scroll 0 0;
    color: #000;
    font-size: 17px;
    height: 35px;
    line-height: 30px;
    margin: 0;
    padding: 0 15px;
  
 }

 /* The paragraph tag contains the side borders mark-up */

 .box p {

    background: #ffffff none repeat scroll 0 0;
    border-color: #CCC;
    border-width: 0 1px;
    border-style: solid;
    color: #444444;
    font-size: 11px;
    line-height: 1.3em;
    margin: 0;
    padding: 15px 14px 0;
    width: 220px;
 }
  



.h2-TAN {
	color: #6B1502;
}
.h2 TAN em strong {
	color: #730002;
}
TAN em strong H2 {
	color: #730002;
}
.h2 em strong {
	color: #730002;
}

/* [1] The container */
.img-hover-zoom {
  height: 300px; /* [1.1] Set it as per your need */
  overflow: hidden; /* [1.2] Hide the overflowing of child elements */
}

/* [2] Transition property for smooth transformation of images */
.img-hover-zoom img {
  transition: transform .5s ease;
}

/* [3] Finally, transforming the image when container gets hovered */
.img-hover-zoom:hover img {
  transform: scale(1.5);
}.h2-tan {
	color: #802B00;
}
.Tan-h2 {
	color: #8A1600;
}
.h2 .brown em {
	color: #700000;
}
.h2 .brown em {
	color: #780000;
}
.h2-brown-em {
	color: #7A0000;
}
.h2-brown-em {
	font-family: Verdana;
	font-size: 18px;
	font-style: italic;
	font-weight: normal;
	font-variant: normal;
	color: #730002;
	text-decoration: none;
}
.h2-brown-em {
	font-family: Verdana;
	font-size: 18px;
	font-style: italic;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #730002;
	text-decoration: none;
}
.red font strong {
	color: #E60000;
}