/* reset css */
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
}

/* fonts */
@font-face 
{
  font-family:"Vegur-Light";
  src: url("Vegur-L_0600.eot?") format("eot"),
       url("Vegur-L_0600.woff") format("woff"),
       url("Vegur-L_0600.ttf") format("truetype"),
       url("Vegur-L_0600.svg#Vegur-Light") format("svg");
  font-weight:normal;
  font-style:normal;
}

h1, h2, h3, h4, h5, h6
{
  font-family: 'Didact Gothic', "Vegur-Light", sans-serif;
  margin: 5px 0 3px 0;
  
}

/* generic html elements styles */

h1
{
  font-size: 40px;
}

h2
{
  font-size: 35px;
}

h3
{
  font-size: 30px;
}

h4
{
  font-size: 25px;
}

h5
{
  font-size: 20px;
}

h6
{
  font-size: 15px;
}

p
{
  margin: 10px;
}

.left
{
  position: relative;
  float: left;
}

.right
{
  position: relative;
  float: right;
}

.align-left
{
  text-align: left;
}

.align-center
{
  text-align: center;
}

.align-right
{
  text-align: right;
}

.borderless
{
  border: 0;
}

/* notifications */
section.flash
{
  margin: 5px 15px 5px 15px;
  padding: 15px 10px 10px 10px;
  background: rgba(255,255,255,0.15);
  font-size: 13px;
  vertical-align: middle;
  min-height: 30px;
}

section.flash.success
{
  background: url(../images/flash_icon_success.png) 10px 10px no-repeat, rgba(255,255,255,0.15);
  padding-left: 52px;
}

section.flash.warning
{
  background: url(../images/flash_icon_warning.png) 10px 10px no-repeat, rgba(255,255,255,0.15);
  padding-left: 52px;
}

section.flash.tip
{
  background: url(../images/flash_icon_tip.png) 10px 10px no-repeat, rgba(255,255,255,0.15);
  padding-left: 52px;
}

section.flash.question
{
  background: url(../images/flash_icon_question.png) 10px 10px no-repeat, rgba(255,255,255,0.15);
  padding-left: 52px;
}

section.flash.information
{
  background: url(../images/flash_icon_information.png) 10px 10px no-repeat, rgba(255,255,255,0.15);
  padding-left: 52px;
}

section.flash.failure, section.flash.error
{
  background: url(../images/flash_icon_failure.png) 10px 10px no-repeat, rgba(255,255,255,0.15);
  padding-left: 52px;
}

section.flash.inline
{
  display: inline;
  margin: 2px;
  padding-top: 10px;
  line-height: 32px;
  background-position: 5px 5px;
}

pre
{
  font-family: monospace;
  white-space: pre;
  clear: none;
}

strong
{
  font-weight: bold;
  color: red;
}

b
{
  font-weight: bold;
}

em
{
  font-style: italic;
}

#container hr
{
  background: #4c94c6;
  height: 0px;
  width: 90%;
  border: 0;
  
  margin-bottom: 20px;
  
  -webkit-box-shadow: 0px 0px 2px 1px #4c94c6;
  -moz-box-shadow: 0px 0px 2px 1px #4c94c6;
  box-shadow: 0px 0px 2px 1px #4c94c6;   
   
}

#container a
{
   color: #ff6126;
   font-weight: bold;
   text-decoration: none; 

   
   text-shadow:
		 0px -1px 2px #000,     /* north      */
		 0px  1px 2px #000,     /* south      */
		-1px  0px 2px #000,     /* west       */
		 1px  0px 2px #000,     /* east       */
		-1px -1px 2px #000,     /* north-west */
		-1px  1px 2px #000,     /* north-east */
		 1px -1px 2px #000,     /* south-west */
		 1px  1px 2px #000;   
}

#container a:hover
{
   text-decoration: underline;
}

#container a:visited
{
   color: #ffc826;
}

#container img 
{
  margin: 3px;
  padding: 3px;
  border: 1px #fff dashed;
}

#container ul
{
  list-style-type: circle;
  padding-left: 30px;
}

#container ol
{
  list-style-type: decimal;
  padding-left: 30px;
}

/* fancy tables */

#container table
{
  border-collapse: collapse;
  margin: 5px 5px 5px 10px;
  
}

#container table tr:nth-child(even)
{
  background: #257ab6;
}

/* tables without thead and tbody */

#container td
{
  border: 2px solid #5b9fcf;
  box-shadow: 0px 0px 50px 1px #4c94c6;
} 

#container table tr:first-child td
{
  border-top: 0px;
}

#container table tr:first-child td:first-child
{
  border-left: 0px;
}

#container table tr:first-child td:last-child
{
  border-right: 0px;
}

#container table tr:last-child td
{
  border-bottom: 0px; 
}

#container table tr:last-child td:first-child
{
  border-left: 0px;
}

#container table tr:last-child td:last-child
{
  border-right: 0px;
}

#container table tr td:last-child
{
  border-right: 0px;
}

#container table tr td:first-child
{
  border-left: 0px;
}

#container td
{
  padding: 5px;
}

/* tables with thead */

#container table thead tr 
{
  border-bottom: 3px dashed #5b9fcf;
  text-transform: uppercase;
  /* color: #f7912d; */
  color: yellow;

  font-size: 16px;
  font-weight: bold;
  
     text-shadow:
		 0px -1px 2px #000,     /* north      */
		 0px  1px 2px #000,     /* south      */
		-1px  0px 2px #000,     /* west       */
		 1px  0px 2px #000,     /* east       */
		-1px -1px 2px #000,     /* north-west */
		-1px  1px 2px #000,     /* north-east */
		 1px -1px 2px #000,     /* south-west */
		 1px  1px 2px #000;   
  
} 

/* cool submit buttons */

input[type=button], input[type=submit]
{
  width: 180px;
  height: 55px;
 	
  background: #1c7ed2 repeat-x;
  border: 0;
  
  font-family: "Trebuchet MS",Helvetica,Jamrul,sans-serif;
  font-size: 22px;
  font-weight: bold;
  color: #fff;
  
  cursor: pointer;
  
  /* gradient in background */
  background: #69b3f2; /* Old browsers */
  background: -moz-linear-gradient(top, #69b3f2 0%, #54a3e5 49%, #308ede 51%, #1579ce 100%, #60aced 100%, #1c7ed2 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#69b3f2), color-stop(49%,#54a3e5), color-stop(51%,#308ede), color-stop(100%,#1579ce), color-stop(100%,#60aced), color-stop(100%,#1c7ed2)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #69b3f2 0%,#54a3e5 49%,#308ede 51%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #69b3f2 0%,#54a3e5 49%,#308ede 51%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* Opera11.10+ */
  background: -ms-linear-gradient(top, #69b3f2 0%,#54a3e5 49%,#308ede 51%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* IE10+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#69b3f2', endColorstr='#1c7ed2',GradientType=0 ); /* IE6-9 */
  background: linear-gradient(top, #69b3f2 0%,#54a3e5 49%,#308ede 51%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* W3C */
  
  /* round radius */
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;

  /* shadows */
  -webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.3), inset 0px 1px 0px 0px rgba(255,255,255,0.5);
  -moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.3), inset 0px 1px 0px 0px rgba(255,255,255,0.5);
  box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.3), inset 0px 1px 0px 0px rgba(255,255,255,0.5); 	
}

input[type=button]:hover, input[type=submit]:hover
{
    background: #79bbf3; /* Old browsers */
    background: -moz-linear-gradient(top, #79bbf3 0%, #66ade8 49%, #308ede 51%, #1579ce 100%, #60aced 100%, #1c7ed2 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#79bbf3), color-stop(49%,#66ade8), color-stop(51%,#308ede), color-stop(100%,#1579ce), color-stop(100%,#60aced), color-stop(100%,#1c7ed2)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #79bbf3 0%,#66ade8 49%,#308ede 51%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #79bbf3 0%,#66ade8 49%,#308ede 51%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* Opera11.10+ */
    background: -ms-linear-gradient(top, #79bbf3 0%,#66ade8 49%,#308ede 51%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* IE10+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#79bbf3', endColorstr='#1c7ed2',GradientType=0 ); /* IE6-9 */
    background: linear-gradient(top, #79bbf3 0%,#66ade8 49%,#308ede 51%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* W3C */ 
                                                                                                                          
}

input[type=button]:active, input[type=submit]:active
{
	-moz-box-shadow:
		inset 0px -1px 0px rgba(255, 255, 255, 0.5),
		inset 0px 5px 20px rgba(10, 10, 10, 0.2),
		inset 0px 1px 1px rgba(10, 10, 10, 0.3),
		0px 0px 2px #4d4d4d;
	-webkit-box-shadow:
		inset 0px -1px 0px rgba(255, 255, 255, 0.5),
		inset 0px 5px 20px rgba(10, 10, 10, 0.2),
		inset 0px 1px 1px rgba(10, 10, 10, 0.3),
		0px 0px 2px #4d4d4d;
	box-shadow:
		inset 0px -1px 0px rgba(255, 255, 255, 0.5),
		inset 0px 5px 20px rgba(10, 10, 10, 0.2),
		inset 0px 1px 1px rgba(10, 10, 10, 0.3),
		0px 0px 2px #4d4d4d;
		
  background: #69b3f2; /* Old browsers */
  background: -moz-linear-gradient(top, #69b3f2 0%, #54a3e5 53%, #308ede 55%, #1579ce 100%, #60aced 100%, #1c7ed2 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#69b3f2), color-stop(53%,#54a3e5), color-stop(55%,#308ede), color-stop(100%,#1579ce), color-stop(100%,#60aced), color-stop(100%,#1c7ed2)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #69b3f2 0%,#54a3e5 53%,#308ede 55%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #69b3f2 0%,#54a3e5 53%,#308ede 55%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* Opera11.10+ */
  background: -ms-linear-gradient(top, #69b3f2 0%,#54a3e5 53%,#308ede 55%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* IE10+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#69b3f2', endColorstr='#1c7ed2',GradientType=0 ); /* IE6-9 */
  background: linear-gradient(top, #69b3f2 0%,#54a3e5 53%,#308ede 55%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* W3C */
  padding-top: 5px;		
}

input[type=text], input[type=password], select, textarea
{
  height: 20px;
  width: 300px;
}

input[type=text], input[type=password], textarea
{ 
  outline: none;
  
  font-family: "Trebuchet MS",Helvetica,Jamrul,sans-serif;
  font-size: 13px;
  font-weight: bold;

  border: 1px solid gray;

  padding: 0px 5px 0px 5px;

  background: #fff;
  color: #000;

  /* shadows */
  -webkit-box-shadow: inset 0px 5px 4px -2px #c4c4c4;
  -moz-box-shadow: inset 0px 5px 4px -2px #c4c4c4;
  box-shadow: inset 0px 5px 4px -2px #c4c4c4;
  
  /* round radius */
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;  
}

input[type=text]:focus, input[type=password]:focus, textarea:focus, .field_with_errors input[type=text]:focus, .field_with_errors input[type=password]:focus
{
  color: #114b79; 

  border: 1px solid #008df2;

  background: #e0f2fd;

  /* shadows */
  -webkit-box-shadow: inset 0px 5px 4px -2px #89cfff;
  -moz-box-shadow: inset 0px 5px 4px -2px #89cfff;
  box-shadow: inset 0px 5px 4px -2px #89cfff;
}

input[type=checkbox], input[type=radio] 
{
  -khtml-appearance: none;
	width: 25px;
	height: 25px;
	padding: 0 5px 0 0;
	background: url(../images/checkbox.png) no-repeat;

}

input[type=radio]
{
  background: url(../images/radio.png) no-repeat;
}

input[type=checkbox]:active, input[type=radio]:active 
{
  background-position: 0px -25px;
}

input[type=checkbox]:checked, input[type=radio]:checked 
{
  background-position: 0px -50px;
}

input[type=checkbox]:checked:active, input[type=radio]:checked:active 
{
  background-position: 0px -75px;
}

input[type="radio"]:disabled, input[type="checkbox"]:disabled, input[type=text]:disabled, input[type=password]:disabled, textarea:disabled, select:disabled
{
  opacity: .8;
}

select
{
  -khtml-appearance: none;
  
  height: 25px;
  
  background: #69b3f2 url(../images/arrow.gif) no-repeat 98% 50%;

  outline: none;
  
  font-family: "Trebuchet MS",Helvetica,Jamrul,sans-serif;
  font-size: 13px;
  font-weight: bold;

  border: 0;

  padding: 0px 5px 0px 5px;


  color: #fff;
 
  /* gradient in background */
  background:  #69b3f2 url(../images/arrow.png) no-repeat 97% 50%; /* Old browsers */
  background: url(../images/arrow.png) no-repeat 97% 50%, -moz-linear-gradient(top, #69b3f2 0%, #54a3e5 49%, #308ede 51%, #1579ce 100%, #60aced 100%, #1c7ed2 100%); /* FF3.6+ */
  background: url(../images/arrow.png) no-repeat 97% 50%, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#69b3f2), color-stop(49%,#54a3e5), color-stop(51%,#308ede), color-stop(100%,#1579ce), color-stop(100%,#60aced), color-stop(100%,#1c7ed2)); /* Chrome,Safari4+ */
  background: url(../images/arrow.png) no-repeat 97% 50%, -webkit-linear-gradient(top, #69b3f2 0%,#54a3e5 49%,#308ede 51%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* Chrome10+,Safari5.1+ */
  background: url(../images/arrow.png) no-repeat 97% 50%, -o-linear-gradient(top, #69b3f2 0%,#54a3e5 49%,#308ede 51%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* Opera11.10+ */
  background: url(../images/arrow.png) no-repeat 97% 50%, -ms-linear-gradient(top, #69b3f2 0%,#54a3e5 49%,#308ede 51%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* IE10+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#69b3f2', endColorstr='#1c7ed2',GradientType=0 ); /* IE6-9 */
  background: url(../images/arrow.png) no-repeat 97% 50%, linear-gradient(top, #69b3f2 0%,#54a3e5 49%,#308ede 51%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* W3C */
 

  /* shadows */
  -webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.3), inset 0px 1px 0px 0px rgba(255,255,255,0.5);
  -moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.3), inset 0px 1px 0px 0px rgba(255,255,255,0.5);
  box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.3), inset 0px 1px 0px 0px rgba(255,255,255,0.5); 	

  
  /* round radius */
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;  
  
}

select:hover
{
  background: #79bbf3 url(../images/arrow.png) no-repeat 97% 50%; /* Old browsers */
  background: url(../images/arrow.png) no-repeat 97% 50%, -moz-linear-gradient(top, #79bbf3 0%, #66ade8 49%, #308ede 51%, #1579ce 100%, #60aced 100%, #1c7ed2 100%); /* FF3.6+ */
  background: url(../images/arrow.png) no-repeat 97% 50%, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#79bbf3), color-stop(49%,#66ade8), color-stop(51%,#308ede), color-stop(100%,#1579ce), color-stop(100%,#60aced), color-stop(100%,#1c7ed2)); /* Chrome,Safari4+ */
  background: url(../images/arrow.png) no-repeat 97% 50%, -webkit-linear-gradient(top, #79bbf3 0%,#66ade8 49%,#308ede 51%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* Chrome10+,Safari5.1+ */
  background: url(../images/arrow.png) no-repeat 97% 50%, -o-linear-gradient(top, #79bbf3 0%,#66ade8 49%,#308ede 51%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* Opera11.10+ */
  background: url(../images/arrow.png) no-repeat 97% 50%, -ms-linear-gradient(top, #79bbf3 0%,#66ade8 49%,#308ede 51%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* IE10+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#79bbf3', endColorstr='#1c7ed2',GradientType=0 ); /* IE6-9 */
  background: url(../images/arrow.png) no-repeat 97% 50%, linear-gradient(top, #79bbf3 0%,#66ade8 49%,#308ede 51%,#1579ce 100%,#60aced 100%,#1c7ed2 100%); /* W3C */ 
}

select option
{
  color: #000;
}

textarea
{
  height: 200px;
  padding: 5px;
}

/* rails forms */

#error_explanation
{
  background: rgba(255,255,255,0.2);
  border: 1px dashed red;
  padding: 10px;
  margin: 15px;
}

#error_explanation h2
{
  font-size: 20px;
  color: #fff;
  
  text-shadow:
		 0px -1px 2px rgba(0,0,0,0.1),     /* north      */
		 0px  1px 2px rgba(0,0,0,0.1),     /* south      */
		-1px  0px 2px rgba(0,0,0,0.1),     /* west       */
		 1px  0px 2px rgba(0,0,0,0.1),     /* east       */
		-1px -1px 2px rgba(0,0,0,0.1),     /* north-west */
		-1px  1px 2px rgba(0,0,0,0.1),     /* north-east */
		 1px -1px 2px rgba(0,0,0,0.1),     /* south-west */
		 1px  1px 2px rgba(0,0,0,0.1);   
}

form
{
  position: relative;
}

#error_explanation ul li
{
  font-weight: bold;
}

.field_with_errors
{
  clear: none;
  display: inline;
}

.field, .actions
{
  margin: 5px 15px 5px 15px;
  position: relative;
}

.field
{
  border-bottom: 2px solid #5b9fcf;
  padding-bottom: 5px;
  padding-top: 0px;
  
}

.field label
{
  position: absolute;
  padding-top: 2px;
}

.field input
{
  margin-left: 53%;

  width: 45%;
}

.actions input
{
  margin-left: 53%;

  width: 47%;   
}


.field_with_errors input[type=text], .field_with_errors input[type=password], .field_with_errors textarea
{
  color: #c0272d; 

  border: 1px solid #c0272d;

  background: #ffebec;

  /* shadows */
  -webkit-box-shadow: inset 0px 5px 4px -2px #fb9b9e;
  -moz-box-shadow: inset 0px 5px 4px -2px #fb9b9e;
  box-shadow: inset 0px 5px 4px -2px #fb9b9e;
}

.field br, .field_with_errors br
{
  display: none;
  line-height: 0px;
  clear: none;
}

.field_with_errors label
{
  color: red;      
}

form.new_user
{
  width: 360px;
}

form.new_user .field input, form.new_user .actions input
{
   margin-left: 100px;
   width: 220px;
}
               
/* sign in form */               
                              
form.new_session 
{
  float: right;
  width: auto;
  text-align: right;

}                              
                    
form.new_session .fields
{
  display: inline;
  float: left;
}                    
                                              
form.new_session .field, form.new_session .actions 
{
  width: auto;
  float: left;
  display: inline;
  border: 0px;
  padding: 0;
  margin: 5px;
}


form.new_session .field input
{
  margin: 0;
  width: 100px;    
}

form.new_session .actions input
{
  margin: 0px;
  width: 55px;
  height: 23px;
  font-size: 14px;  
  
}       

form.new_session br
{
  display: block;
}


form.new_session a#lost_password_link
{
  text-decoration: none;
  color: #fff;
  font-size: 10px;
  font-weight: bold;
  margin: 0 5px;
}                  

form.new_session a#lost_password_link:hover
{
  text-decoration: underline;
}

#login span
{
  float: left;
  width: 50px;
  text-align: center;
  padding: 13px 30px 0px 15px;
  font-size: 16px;
  line-height: 18px;
}

#login div#socialNetworksLogin
{
  position: absolute;
  bottom: 35px;
  right: 30px;
}

#login div#socialNetworksLogin img
{
  height: 22px;
}

#login div#bracket
{
  font-family: 'Didact Gothic', "Vegur-Light", sans-serif;
  float: left;
  font-size: 85px;
}
           
/* top menu design */

header nav
{
  font-family: 'Didact Gothic', "Vegur-Light", sans-serif;
  position: relative;
  height: 100%;
  float: right;
}

header nav ul
{
  float: right;
  width: auto;
  padding: 22px 0px 12px 0px;
}

header nav a
{
  width: auto;
  color: #fff;
  font-size: 22px;
  text-decoration: none; 
  background: url(../images/menu_line.png) right top no-repeat;
  padding: 12px 26px 16px 4px;
}

header nav ul li
{
  display: inline;
  position: relative;
  list-style: none;
  width: auto;
}

header nav ul li:last-child a
{
  border: 0;
  background: url(../images/menu_line_last.png) right no-repeat;
  padding-right: 15px;
}

/* sub ul */
header nav ul li nav
{
  display: block;
  
  position: absolute;
  right: 5px;
  top: 31px;
   
  width: 300px;
  height: 0px;
  overflow: show;
}

header nav ul li:last-child nav
{
   right: 0px;
}

header nav ul li nav ul
{
  
  /* styling submenu */
  background: url(../images/background_menu.png) repeat;
  /* shadows */
  
  -webkit-box-shadow: 2px 0px 5px 0px #015591, -2px 0px 5px 0px #015591;
  -moz-box-shadow: 2px 0px 5px 0px #015591, -2px 0px 5px 0px #015591;
  box-shadow: 2px 0px 5px 0px #015591, -2px 0px 5px 0px #015591;
  
  /* border radius */
  -moz-border-radius-bottomright: 10px;
  -moz-border-radius-bottomleft: 10px;
  -webkit-border-radius: 0px 0px 10px 10px;
  border-radius: 0px 0px 10px 10px;
 
    
  padding: 0;

  overflow: hidden;
  display: none;  
  height: auto; 
  
}

header nav ul li ul li
{
  list-style: none;
  display: block;
  
  height: 36px;
  padding: 0px 5px 0px 3px;

  border-bottom: 1px solid #3586bf;
}

header nav ul li ul li:last-child
{
  margin: 0;
  border: 0;
  padding-bottom: 0;
  
  /* border radius */
  -moz-border-radius-bottomright: 10px;
  -moz-border-radius-bottomleft: 10px;
  -webkit-border-radius: 0px 0px 10px 10px;
  border-radius: 0px 0px 10px 10px;  
}


header nav ul li ul li a, header nav ul li:last-child ul li a, header nav ul li ul li:last-child a
{
  display: block;
  font-size: 20px;
  background: transparent;
 
  text-align: right;
  
  width: 100%;
  
  margin: 0;
                         
  padding: 8px 0px 8px 0px;
}

header nav ul li:hover ul li:last-child a
{
  padding-bottom: 0px;
}

header nav ul li ul li img, header nav ul li ul li:last-child img
{
  position: relative;
  float: left;
  
  margin: -3px 10px 0px 3px; 
  width: 28px;
  height: 28px;
}

header nav ul li ul li:hover
{
  background: #0d72b8;
}

header nav ul li ul li:last-child a
{
  background: transparent;
  float: right;

}

/* layout styles*/     

html
{
  font-family: "Trebuchet MS",Helvetica,Jamrul,sans-serif;
  width: 800px;
  overflow-x: hidden;
}
 
body
{
  background-image: url(../images/background_stripe.png);
  background-color: #fff;  
  background-repeat: repeat-x; 
  width: 100%;
  height: 100%;  
  position: absolute;   
  
  color: white;
  font-size: 15px;
}

#box
{
  background: url(../images/background_image.png) top center no-repeat;
  width: 100%;
  /*height: 714px; */
  height: 100%;

  position: absolute;
}

header
{
  /* overflow: hidden */

  width: 800px;
  height: 59px;
  position: relative;
   
  margin: 0px auto; 
  
}

#logo
{
  position: relative;
  margin: 7px 5px;
  float: left;
}

#logo.main
{
  margin: 17px 5px;
}

#container
{
  overflow: hidden;

  width: 770px;
  min-height: 600px;
  
  background: url(../images/background_body.png) repeat-y;

  
  padding: 15px;  
  margin: 0px auto; 
  
  /* shadows */
  
  -webkit-box-shadow: 2px 0px 5px 1px #015591, -2px 0px 5px 1px #015591,0px 10px 20px -9px #000000;
  -moz-box-shadow: 2px 0px 5px 1px #015591, -2px 0px 5px 1px #015591,0px 10px 20px -9px #000000;
  box-shadow: 2px 0px 5px 1px #015591, -2px 0px 5px 1px #015591,0px 10px 20px -9px #000000; 
}

#container.main
{
  margin: 200px auto;
  margin-bottom: 15px;
  background: url(../images/background_body_main.png) repeat-y;  
}


#login
{
  overflow: hidden;

  position: relative;
  float: right;

  width: 455px;
  height: 85px;
  
  background: rgba(255,255,255,0.14);
   
  padding: 25px;  
  margin: 0px auto; 
  
  /* shadows */  
  -webkit-box-shadow: 2px 0px 5px 1px #015591, -2px 0px 5px 1px #015591;
  -moz-box-shadow: 2px 0px 5px 1px #015591, -2px 0px 5px 1px #015591;
  box-shadow: 2px 0px 5px 1px #015591, -2px 0px 5px 1px #015591;
}

header h1
{
  clear: both;
  
  padding: 43px 0px 0px 0px;
  text-align: center;
  font-size: 40px;
}

section#socialNetworks
{
  position: absolute;
  
  width: 140px;
  height: 100px;
  
  
  left: 850px;
  top: 32px;

  overflow: hidden;
}

section#socialNetworks hr
{
  width: 0;
  border: 0;
  height: 0;
  /* lol, although it's 0x0 large, it does it's job! */
}

section#flags
{
  position: absolute;
                                                                      
  width: 30px;
  height: 200px;
  
  top: 60px;
  left: -33px;
}


section#flags.main
{ 
  top: 260px;
}

section#flags img
{
  margin-bottom: 5px;
  padding: 1px;
  border: 1px solid #5b9fcf;
}

footer
{
  position: relative;

  width: 800px;
  height: 130px;

  margin: 20px auto;
  
  font-size: 13px;  
  font-family: Tahoma;
 
}

footer div
{
  float: left;

  margin: 20px 0px 0px 25px;
  
  color: #989898;
}

footer a
{
  color: gray;
  text-decoration: none;
  
  font-weight: bold;
}

footer a:hover
{
  text-decoration: underline;
}

footer li
{
  margin: 6px;
}

footer nav ul
{
  float: left;
  width: 150px;
  padding-left: 50px;
  
}

footer img
{
  float: right;

  margin: 10px 15px;
}

#container section.sidebar
{
  position: relative;
  width: 300px;

  margin: 15px;
  padding: 15px;
  background: rgba(255,255,255,0.15);  
}

#container section.sidebar.light
{
  padding: 0px 15px 0px 15px;
  background: transparent;
}

#container section.sidebar.light.left
{
  border-right: #4c94c6 1px solid;  
}

#container section.sidebar.light.right
{
  border-left: #4c94c6 1px solid;  
}