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

/* ------------------------------------------------------------ *\
|* ------------------------------------------------------------ *|
|* CSS Reset
|* ------------------------------------------------------------ *|
\* ------------------------------------------------------------ */
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,
font,
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 {
    background: transparent;
    border: 0;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
}
body {
    line-height: 1
}
h1,
h2,
h3,
h4,
h5,
h6 {
    clear: both;
    font-weight: normal;
}
ol,
ul {
    list-style: none
}
blockquote {
    quotes: none
}
blockquote:before,
blockquote:after {
    content: '';
    content: none;
}
del {
    text-decoration: line-through
}
/* tables still need 'cellspacing="0"' in the markup */
table {
    border-collapse: collapse;
    border-spacing: 0;
}
a img {
    border: none
}
/* ------------------------------------------------------------ *\
|* ------------------------------------------------------------ *|
|* Globals
|* ------------------------------------------------------------ *|
\* ------------------------------------------------------------ */
*,
*:before,
*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
body {
    background-color: #fff;
    color: #666;
    font-family: "Verdana", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.8;
}
/* Headings */
h1,
h2,
h3,
h4,
h5,
h6 {
    line-height: 1;
    font-weight: 400;
}
a {
    text-decoration: none;
    color: #444;
}

a.yellow{
	color: #fcb040;
}

a.orange{
	color: #f26335;
}

a.red{
	color: #bf1e2e;
}

a.green{
	color: #8dc63f;
}




a:hover {
    color: #aaa;
}
/* clear floated divs */
.clearfix:after {
    content: "";
    display: table;
    clear: both;
}


*{
    -webkit-transition:all 1s ease;
    -moz-transition:all 1s ease;
    -o-transition:all 1s ease;
    transition:all 1s ease;
}

.center {text-align:center;}
.left {text-align:left;}
.indent {padding-left:30px;}
img {
	max-width: 100%;
}

.stackable {
	margin-bottom:20px;
}

@media (max-width:768px){
.footer {
	font-size:12px;
}
}

@media (min-width:1000px){
img.spacer {
	width:100%
}
	
}
.canvas {
	width:100%;
	margin:auto;
	background-color:#fff;
	background-size:99.9% auto;
	background-repeat:no-repeat;
	background-position: top center;
	}

#wrapper_home {
	background-image:url(../i/bg_home.jpg);
	}
	
#wrapper_vocapass {
	background-image:url(../i/bg_vocapass.jpg);
	}
	
#wrapper_vocasign {
	background-image:url(../i/bg_vocasign.jpg);
	}
	
#wrapper_vocamatch {
	background-image:url(../i/bg_vocamatch.jpg);
	}
	

	
.topnav {
	text-align: right;
	padding-top: 10px;
	padding-right: 20px;
}

img.top {
	margin-right: 5px;
	}


img.top {
		width:5%;
		height: 5%;
		
	}
	
	/* FORMS */

.formwrapper {
    margin: 10px;
    max-width:640px;
}
 
#contact_form {
    text-shadow:0 1px 0 #FFF;
    border-radius:4px;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    background:#F9F9F9;
    padding:25px;
     
}
 



label, #formtext {
    cursor:pointer;
    margin:4px 0;
   
    display:block;
    font-weight:800;
	
	
     
}
 
input, textarea {
    display:block;
    width:90%;
    border-radius:4px;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    background-color:#f4f4f4;
   
    border:1px solid #5f5f5f;
    padding:10px;
    margin-bottom:25px;
}





.radio {
    display:inline;
    width:20px;
    border-radius:0px;
    -webkit-border-radius:0px;
    -moz-border-radius:0px;
    background-color:#f4f4f4;
   
    border:0px solid #5f5f5f;
    padding:0px;
    margin-bottom:0px;
}
 
.sendButton {
    cursor:pointer;
    -moz-box-shadow:inset 0px 1px 0px 0px #fce2c1;
    -webkit-box-shadow:inset 0px 1px 0px 0px #fce2c1;
    box-shadow:inset 0px 1px 0px 0px #fce2c1;
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ffc477), color-stop(1, #fb9e25) );
    background:-moz-linear-gradient( center top, #ffc477 5%, #fb9e25 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffc477', endColorstr='#fb9e25');
    background-color:#ffc477;
    -webkit-border-radius:16px;
    -moz-border-radius:16px;
    border-radius:16px;
    border:1px solid #eeb44f;
    color:#ffffff;
    font-family:Arial;
    font-size:14px;
  
    font-weight:bold;
    text-shadow:1px 1px 0px #cc9f52;
}
.sendButton:hover {
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #fb9e25), color-stop(1, #ffc477) );
    background:-moz-linear-gradient( center top, #fb9e25 5%, #ffc477 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fb9e25', endColorstr='#ffc477');
    background-color:#fb9e25;
}