/* CSS Document */
body {font-family:Verdana, Arial, Helvetica, sans-serif;
background: #fff8f2 url(img/bg-top.png) top repeat-x; padding:0; margin:0; color:#333;}
h1 {color: #334477; padding:10px 0 0 10px; margin:0; font-size:2.2em} h1 a {color:#334477; text-decoration:none}
h1 a:hover {color: #000033}
h2 { color: #FF9934; padding: 0 0 10px 0; margin:0}
#logo h2 {padding:3px 0 0 10px; margin:0; font-size:1.2em; color: #555}
#logo p{color:#666; padding:0 0 0 10px; margin:0; letter-spacing:-1px}
p {font-size:1em;line-height:normal}
p a{color:#000; text-decoration:blink}
p a:hover{color:#999999; text-decoration:underline}
.right h2 {color:#334477;}
.site-url a{color:#999}
.post-title{line-height:normal}
.prov{font-size:.8em}
.display{display:none;}

#tot2{ position:relative; 
background:#EEE url(img/x.jpg) repeat-y;
max-width:930px;
margin:0 auto ;
padding:4px;
-moz-border-radius: 13px;
border-radius: 13px;
border: #ccc solid 1px;
height:auto; overflow:hidden;
}
#header{position:relative; padding:0; 
max-width:920px; 
margin:10px auto 1px auto;
min-height:160px;
background: #FFFFFF url(img/head-md.jpg) no-repeat center top
}
#logo {position:relative; padding:0; float:left; }
#tel {float:right; margin:10px 20px; padding:0; max-width:350px; }
#tel p{color:#333; padding:0; margin:20px 10px 5px 0; font-size:24px; text-shadow:#fff 3px 3px 3px;text-align:center}
#tel p a{color:#333;}

.right ul{padding:0; list-style:none; margin:0; font-size:14px }
.right ul li {display:block; padding:5px 0; list-style:none; margin:0 }
.right ul li a{color: #334477; text-decoration:none;}
.right ul li a:hover{color: #CC6600; }

.imagen {position:relative; 
background-color:#FFFFFF; 
max-width:100%; padding:0 0 0 4px; height: auto; 
margin:0 auto 0 auto; padding-top:6px;
}
.imagen a img{ border:#666 1px solid; padding:1px; margin:2px; max-width:285px; 
filter:alpha(opacity=100);
        -moz-opacity:1.0;
        -khtml-opacity: 1.0;
        opacity: 1.0;       
}
.imagen a:hover img {border:#333 1px solid; padding:1px;
		filter:alpha(opacity=70);
        -moz-opacity:0.7;
        -khtml-opacity: 0.7;
        opacity: 0.7;}
#contenido { 
position:relative; 
background-color:#FFFFFF;
max-width:900px;
margin:0 auto;
padding:10px;
height: auto; overflow:hidden;
-webkit-box-shadow: inset 0px 0px 5px 0px rgba(204,204,204,1);
-moz-box-shadow: inset 0px 0px 5px 0px rgba(204,204,204,1);
box-shadow: inset 0px 0px 5px 0px rgba(204,204,204,1);
}
#center {
position:relative; 
max-width:570px;float:left; margin:0; 
padding:0 25px 10px 10px; height: auto; 
}
.max{width:100%;margin-bottom:20px;}
.right {position:relative; max-width:305px; background: transparent url(img/tr75.png); float:left; 
margin: 0 0 20px 5px; 
padding-right:20px;
height: auto; overflow:hidden;
}
.right i, #center i{color:#FF6600; font-size:1.2em; line-height:1.2em}
.flow{max-width:30%;float: left; padding-left:1% } 
.flow img{width:300px; margin-bottom:15px }
#btm{position:relative; max-width:890px; margin:10px auto; text-align:center
}
#btm h4 { font:13px Verdana, Arial, Helvetica, sans-serif; color:#999; font-weight:bold}
#btm h4 a {color:#999; text-decoration:none}
#btm h4 a:hover {text-decoration:underline}
#center p img {float:left; margin:0 0 5px 0;}
h5,.design {position:relative;text-align:center; margin:0 auto; font-size:12px; width:300px; padding-bottom:5px} h5 a,.design a{color:#ccc;text-decoration:none;}
.linia{clear:both; border-top:1px solid #FF9934; margin:10px 5px 25px 5px; }

/* Add a black background color to the top navigation */
.topnav {
    background-color: #334477;
    overflow: hidden;
}
.topnav ul{margin:0; border-top:2px #333 solid}
/* 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;}

/* Change the color of links on hover */
.topnav a:hover {
    background-color: #ddd;
    color: black;}

/* 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;} 

/* 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) {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
  }
  #logo{height:auto}
  #logo h1{font-size:1.8em; padding-top:5px}
  img{width:100%; border:0; padding:0}
  #contenido,#center{padding:1px;margin:1px}
  .slideshow {overflow-x: auto; width:100%;}
  .imagen a img{margin-left: auto; margin-right: auto; display: block; padding:4px;}
  ul li{padding:5px 0}
}

/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 600px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive a.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  .imagen {display:none;margin:0;padding:0;visibility: hidden}
  
  .display {max-height:auto;max-width:100%; display: block}
}