/* Stylesheets */

/* -------------------------------------------------------------- */
/* DO NOT TOUCH !!! */
/* -------------------------------------------------------------- */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, dialog {display: block}
audio[controls],canvas,video {display: inline-block; *display: inline; zoom: 1}
/* PAGE BASICS */
html { height: 100%; font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%}
body { margin: 0; min-height: 100%; -webkit-font-smoothing:antialiased; font-smoothing:antialiased; text-rendering:optimizeLegibility; overflow:auto} 
/* TYPOGRAPHY Vertical Rhythm */
body, button, input, select, textarea {font: normal 100%/1.5em 'HelveticaNeue-Light', 'Helvetica Neue', 'Arial', sans-serif; *font-size: 1em; color:#000} 
p, blockquote, q, pre, address, hr, code, samp, dl, ol, ul, form, table, fieldset, menu, img {margin: 0 0 1.5em; padding: 0}
p, ul, blockquote, pre, td, th, label { font-size: 1em; line-height: 1.5em; margin: 0 0 1.5em 0; } 
/* HYPERLINKS */
a {text-decoration: underline; color:#990000}
a:hover {text-decoration: underline}
a:focus {outline: thin dotted}
a:hover, a:active {outline: none} 
a.maillink { text-decoration:none; color:#000000}
a.maillink:hover {color:red}
/* MEDIA */
img, object, embed, video {max-width: 100%;	_width: 100%} 
img {border: 0;	-ms-interpolation-mode: bicubic} 
svg:not(:root) {overflow: hidden} 
/* MICRO CLEARFIX HACK */
.cf:before, .cf:after {content:"";display:table} 
.cf:after {clear:both}
.cf {zoom:1} 
.clear {clear:both}
.cl {clear:both}
.nomargin {margin:0}
.nopadding {padding:0}
.center {text-align:center;}
.nophone {display:block}
.fl	{float:left}

/* -------------------------------------------------------------- */
/* SAMUEL Styles */
/* -------------------------------------------------------------- */

/* Wrapper */
.wrp {width: 98%; max-width:1100px; margin:2em auto; } /* wrapper class */
.wrp {border:0px solid #000; }
.footerlinks { margin:2em 0 0 2em; font-weight:normal; font-size:1.2em; color:#000}
.footerlinks a{ text-decoration:none; color:#000}
.footerlinks a:hover{ color:red}
.table_headline {margin:0 0 2em 6.5em}
table td { font-size:0.9em; padding:0em 0; vertical-align:top}
table td {padding-right:3em}
table td + td {padding-right:0em}

/* Handy */
@media only screen and (min-width: 240px) {
.table_headline {margin:0 0 2em 5em}

table td {padding-right:0.1em; padding-bottom:0.5em; width:30%}
table td + td {padding-right:0em; width:70%}

.content td {font-size:0.76em}
.footer {margin-top:2em;}
.logo { float:none; width:41px; margin:0 auto}	
.footerlinks { float:none; margin:0em 0 0 2em; }	
}

/* Handy */
@media only screen and (min-width: 400px) {
.wrp {width: 98%; max-width:400px; margin:2em auto; } /* wrapper class */
.table_headline {margin:0 0 2em 5em}

table td {padding-right:0.1em; padding-bottom:0.5em; width:30%}
table td + td {padding-right:0em; width:70%}

.content td {font-size:0.76em}
.footer {margin-top:2em;}
.logo { float:none; width:41px; margin:0 auto}	
.footerlinks { float:none; margin:0em 0 0 2em; }	
}

/* Tablet */
@media only screen and (min-width: 768px) {
.wrp {width: 96%;  max-width:780px; margin:0.5em auto; border:0px solid red} 
.table_headline {margin:0 0 2em 6.5em}
.footer {margin-top:2em;}
.foto { float:left;  }
.foto img {width:180px}
.content { float:left; margin: 0 0 0 1em; width:500px }
.logo { float:left; }	
.footerlinks { float:left; margin:1em 0 0 2em; }
table td {padding-right:1em; padding-bottom:0.0em;}
.content td {font-size:0.8em}

}

/* Tablet Landscape  */
@media only screen and (min-width: 1024px) {
.wrp {width: 98%; max-width:850px; margin:0.5em auto; border:0px solid red} /* wrapper class */
.footer {margin-top:1em;}
.foto img {width:240px}
.content { float:left; margin: 0 0 0 1em; width:580px; }
table td {padding-right:2em}
.content td {font-size:0.9em}
}


/* Desktop Standard */
@media only screen and (min-width: 1200px) {
.wrp {width: 98%; max-width:850px; margin:2em auto; }
.footer {margin-top:2em;}
.foto img {width:240px}
.content { float:left; margin: 0 0 0 2em; width:570px }
table td {padding-right:0.1em; padding-bottom:0em; width:20%; font-size:0.9em}
table td + td {padding-right:0em; width:80%}
}

/* Desktop WideScreen */
@media only screen and (min-width: 1600px) {
.wrp {width: 98%; max-width:1100px; margin:2em auto; }
.footer {margin-top:2em;}
.foto img {width:264px}
.content { float:left; margin: 0 0 0 2em; width:auto }
.content td {font-size:0.9em}
}