﻿html,
body { margin:0; padding:0; height:100%; }
img {border:0}
:focus {outline-width:none}
ul, li {margin:0; padding:0; list-style-type:none;}
h1 { font-family: Roboto Condensed, Arial Narrow, Helvetica Neue, sans-serif; font-size: 16px; font-style: bold; color: #1a1a1a;}
h2 { font-family: Roboto Condensed, Arial Narrow, Helvetica Neue, sans-serif; font-size: 13px; font-style: bold; color: #818181;}
h2 a {color: #818181;}
a {color: #1a1a1a; text-decoration: none;}
a:hover {
color: #818181;
filter:alpha(opacity=80);
-moz-opacity: 0.8;
opacity: 0.8;
-khtml-opacity: 0.8;
-o-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;}

#wrapper {
height:100%;
min-height: 100%;
}

nav {
width: 100%;
height: 40px;
background-color: #f6f6f6;
box-shadow: 0 8px 3px rgba(0,0,0,.2);
position: fixed;
padding-top: 45px;
color: #1a1a1a;
font-size: 18px;
font-family: Roboto Condensed, Arial Narrow, Helvetica Neue, sans-serif;
font-style: bold;
text-align: center;
z-index: 10;
}
   nav li {
   display: inline;
   padding-right: 25px;
   padding-left: 25px;}
#container_header{width: 100%; height: 146px; background-color: #b5f37f; padding-top: 85px; }
header {
width: 95px; 
margin-right: auto; 
margin-left: auto; 
}
   header img{
   position: fixed;
   z-index: 9;	 
 }
   
#wrapper_work{
width: 100%;
background-color: #b5f37f;
}   
#container_work {
width: 80%;
padding: 50px 0 60px 0;
margin: 0 0 0 13%;       
}

 #container_work a{
   filter:alpha(opacity=80);
   -moz-opacity: 0.8;
   opacity: 0.8;
   -khtml-opacity: 0.8; }
   #container_work a:hover{
   filter:alpha(opacity=100);
   -moz-opacity: 1;
   opacity: 1;
   -khtml-opacity: 1;
   -o-transition: all 0.3s ease;
   -webkit-transition: all 0.3s ease;
   -moz-transition: all 0.3s ease;}
   #container_work img{
   width: 15%;}   
   
#mobilegif_wrapper {display: none;}
   
.spanish  {
width:300px;
float: left;
padding: 0px 0px 0px 5px;
color: #1a1a1a;
}

.english{
width:300px;
float: right;
padding: 0px 0px 0px 5px;
color: #818181;
}
   .english h1 {color: #818181;}   

#wrapper_about{
width: 100%;
height: 650px;
background-color: #fdfeac;
}   
   
#wrapper_contact{
width: 100%;
height: 580px;
background-color: #caf2f6;
}

.container{
width: 650px;
padding-top: 280px;
margin-left: auto;
margin-right: auto;
font-size: 13pt;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
}     

#footer {
width: 100%;
background-color: #ff0000;
color: #494949;
text-align:center;
font-size: 16px;
text-align:center;
}

#to_top { display: none;}











/*   *** media queries ***********************************************************************************************   */

@media screen and (max-width: 610px) {
h1 {font-size: 110%;}
nav {
position: static;
opacity: 0.9;
width: 100%;
height: auto;
padding: 2% 0% 2% 0;
font-size: 115%;
line-height: 180%;
}
   nav li {
   display: block;
   padding-right: 0px;
  padding-left: 0px;}
   
#container_header{width: 100%; height: 0px; background-color: #f9007f; padding-top: 0px; }

header {
width: 85px; 
height: auto;
margin-right: auto; 
margin-left: auto;   
}
   header img{
   width: 85px;
   position: static;
   z-index: 9;}
   
#container_work{ display: none;}  
 
#mobilegif_wrapper {display: block;
height: 220px;
padding-top: 160px;
background-color: #b5f37f; }
#mobilegif_container {
height:200px;
width: 200px;
margin-left:auto;
margin-right: auto;	}
#mobilegif_container img { height: 200px; width: 200px;}
  
.spanish  {
width: 100%;
float: none;
padding: 0px 0px 30px 0px;
color: #1a1a1a;
}

.english{
width: 100%;
float: none;
padding: 0px 0px 30px 0px;
color: #818181;
}
   .english h1 {color: #818181;}   

#wrapper_about{
width: 100%;
height: auto;
background-color: #fdfeac;
}   
   
#wrapper_contact{
width: 100%;
height: auto;
background-color: #caf2f6;
}

.container{
width: 93%;
height: 100%;
padding-top: 10%;
padding-bottom: 10%;
margin-left: auto;
margin-right: auto;
font-size: 100%;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
}  

#to_top {
opacity: 0.6;
width: 45px;
height: 45px;
border-radius: 50px;
background-color: #818181;
display: block;
color: #fff;
text-align:center;
font-size: 35px;
font-weight: bold;
clear: both;
margin-left:auto;
margin-right: auto;
}   

#footer {
width: 100%;
background-color: #ff0000;
color: #494949;
font-size: 100%;
text-align:center;
}


}
   

