@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);
@font-face {
	font-family: 'codropsicons';
	src:url('icomoon/fonts/icomoon.eot');
	src:url('icomoon/fonts/icomoon.eot?#iefix') format('embedded-opentype'),
		url('icomoon/fonts/icomoon.woff') format('woff'),
		url('icomoon/fonts/icomoon.ttf') format('truetype'),
		url('icomoon/fonts/icomoon.svg#codropsicons') format('svg');
	font-weight: normal;
	font-style: normal;
}

body {
    //color:white;
    background: white;
}

.container > header,
.codrops-top {
	font-family: 'Lato', Arial, sans-serif;
}

.container > header {
	margin: 0 auto;
	padding: 60px 70px;
	background: rgba(0,0,0,0.05);
}

.container > header a {
	color: #74818e;
	text-decoration: none;
	outline: none;
}

.container > header a:hover {
	color: #4f7bab;
}

.container > header h1 {
	font-size: 3.2em;
	line-height: 1.3;
	margin: 0;
	font-weight: 300;
}

.container > header span {
	display: block;
	font-size: 55%;
	color: #74818e;
	padding: 0 0 0.6em 0.1em;
}


.codrops-icon:before {
	font-family: 'codropsicons';
	margin: 0 4px;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
}

.codrops-icon-datawork:before {
	content: "\e059";
}

.codrops-icon-portal:before {
	content: "\e00c";
}

.codrops-icon-home:before {
	content: "\e000";
}


@media screen and (max-width: 1025px) {
	.container > header {
		margin: 0 auto;
		padding: 60px 10px;
		font-size: 80%;
		text-align: right;
	}
}

@media screen and (max-width: 740px) {
	.codrops-icon span {
		display: none;
	}

}


input[type=text], input[type=submit], input[type=reset], input[type=button], select{
    border: 2px solid white;
    -webkit-box-shadow:
      inset 0 0 4px  rgba(0,0,0,0.1),
            0 0 8px rgba(0,0,0,0.1);
    -moz-box-shadow:
      inset 0 0 4px  rgba(0,0,0,0.1),
            0 0 8px rgba(0,0,0,0.1);
    box-shadow:
      inset 0 0 4px  rgba(0,0,0,0.1),
            0 0 8px rgba(0,0,0,0.1);

    background: WhiteSmoke;
    margin: 0 0 10px 0;
    color: gray;
    width: 200px;
        //padding:4px 2px;
}


.boton_menu {
    border: 2px solid white;
    -webkit-box-shadow:
      inset 0 0 8px  rgba(0,0,0,0.1),
            0 0 16px rgba(0,0,0,0.1);
    -moz-box-shadow:
      inset 0 0 8px  rgba(0,0,0,0.1),
            0 0 16px rgba(0,0,0,0.1);
    box-shadow:
      inset 0 0 8px  rgba(0,0,0,0.1),
            0 0 16px rgba(0,0,0,0.1);

    background: #0A0A0A;
    margin: 0px 0px 10px 0px;
    color: WhiteSmoke;
    width: 250px;
    padding:20px 2px;
}

.boton_menu:hover {
    box-shadow: 0 0 5px #0A0A0A;
    //background: WhiteSmoke;
    //color:#0A0A0A;
}




    /* ----------- My Form ----------- */
.myform{
margin:0 auto;
width: auto;
padding:14px;
}

/* ----------- stylized ----------- */
#stylized{
        border:solid 1px gray; // #b7ddf2;
        background: white; //#ebf4fb;
}
#stylized h1 {
    font-size:1.5em;
    font-weight:bold;
    margin-bottom:8px;
}
#stylized p{
    font-size:11px;
    color:#666666;
    margin-bottom:20px;
    border-bottom:solid 1px gray; //#b7ddf2;
    padding-bottom:10px;
}
#stylized label{
display:block;
font-weight:bold;
text-align:right;
width:140px;
float:left;
}
#stylized .small{
color:#666666;
display:block;
font-size:11px;
font-weight:normal;
text-align:right;
width:140px;
}


#table {
    display: table;
}

#row  {
    display: table-row;
}

#cell {
    display: table-cell;
    vertical-align:middle;
    padding:4px 2px;
    float:left;
}



label{
        color: gray;
        font-size: small;
    }

//form {border:0; margin:0; padding:0;}
.spacer{clear:both; height:1px;}

.message {
    border: 1px solid;
    margin: 10px 0px;
    padding: 15px 10px 15px 10px;
}
.info {
    color: #00529B;
    background: #bde5f8;
}
.success {
    color: #4F8A10;
    background: #dff2bf;
}
.warning {
    color: #9F6000;
    background: #feefb3;
}
.error {
    color: #D8000C;
    background: #ffbaba;
}
.validation {
    color: #D63301;
    background: #FFCCBA;
}
