Files
resume/style/style.screen.css
2014-05-31 16:22:09 +02:00

639 lines
11 KiB
CSS

/* Style */
/* Normalize */
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, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
border:0;
outline:0;
font-weight:inherit;
font-style:inherit;
font-size:100%;
font-family:inherit;
vertical-align:baseline;
margin:0;
padding:0;
}
:focus {
outline:0;
}
body {
background:#000033 url(../images/bg.gif) 0 0 repeat;
color:#333;
font:12px Arial, Helvetica, sans-serif;
line-height:22px;
}
ol, ul {
list-style:none;
}
table {
border-collapse:separate;
border-spacing:0;
}
caption, th, td {
text-align:left;
font-weight:400;
}
blockquote:before, blockquote:after, q:before, q:after {
content:"";
}
a, a:visited {
color:#06A;
text-decoration:none;
}
a:hover {
color:#637BFF;
}
strong {
font-weight:700;
}
em {
font-style:italic;
}
input[type=submit], input[type=reset], input[type=button], .clickable {
cursor:pointer;
}
.fixed:after {
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
.fixed {
display:block;
min-height:1%;
}
* html .fixed {
height:1%;
}
/* Commons */
.btn {
height:25px;
padding:2px;
width:80px;
}
.section {
border-bottom:1px solid #dfdfdf;
margin:0 39px;
padding:30px 0;
}
.hide {
display:none;
}
.inline_title {
font-weight:700;
margin-right:5px;
}
.arrow_up {
position:fixed;
display:none;
top:100%;
margin-top:-99px; /* - 66px cv margin bottom - 2 to_top borders - 25 to_top height - 6 center of the space left */
margin-left:747px; /* 780 cv width - 27 to_top width - (39-27)/2 center of the space left */
background-color:#eee;
border:1px solid #838383;
z-index:10;
width:25px;
height:25px;
}
.arrow_up a {
width:100%;
}
.arrow_up:hover {
background-color:#FFFFFF;
}
/* Commons - Section */
.section_name {
float:left;
width:200px;
}
.section_items {
float:right;
margin-right:10px;
width:490px;
}
h2.section_name {
color:#3C4756;
font-size:24px;
font-style:italic;
font-weight:400;
letter-spacing:0px;
}
/* Commons - Item */
.item {
margin-bottom:20px;
padding-bottom:20px;
border-bottom:1px solid #dfdfdf;
}
.item p {
text-align:justify;
padding:0 0 15px;
}
.item p.last {
padding:0;
}
.last_item {
margin-bottom:0;
padding-bottom:0;
border-bottom:none;
}
.item h2 {
color:#06A;
font-family:Georgia, serif;
font-size:24px;
font-weight:400;
letter-spacing:-1px;
}
.item h2 a {
}
.item h3 {
margin-top:3px;
color:#637BFF;
font-family:Georgia, serif;
font-size:16px;
font-style:italic;
font-weight:400;
}
.item h4 {
float:right;
border-top:1px solid #dfdfdf;
border-bottom:1px solid #dfdfdf;
color:#666;
font-style:italic;
padding:0 7px;
}
.item ul {
text-align:justify;
padding:15px 0;
}
.item ul li {
list-style-type:square;
font-size:12px;
}
.item ul li.last {
margin-bottom:0;
}
.item ul li ul {
padding:0;
}
.item ul li ul li{
list-style-type:disc;
margin-left:25px;
margin-bottom:0;
font-weight:normal;
}
/* Commons - Tipsy */
.tipsy {
padding:5px;
font-size:10px;
position:absolute;
z-index: 100000;
}
.tipsy-inner {
padding:5px 8px 4px 8px;
background-color:#000000;
color:#FFFFFF;
max-width:200px;
text-align:center;
}
.tipsy-inner {
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
}
.tipsy-arrow {
position:absolute;
background:url('../images/tipsy.gif') no-repeat top left;
width:9px;
height:5px;
}
.tipsy-n .tipsy-arrow {
top:0;
left:50%;
margin-left:-4px;
}
.tipsy-nw .tipsy-arrow {
top:0;
left:10px;
}
.tipsy-ne .tipsy-arrow {
top:0;
right:10px;
}
.tipsy-s .tipsy-arrow {
bottom:0;
left:50%;
margin-left:-4px;
background-position:bottom left;
}
.tipsy-sw .tipsy-arrow {
bottom:0;
left:10px;
background-position:bottom left;
}
.tipsy-se .tipsy-arrow {
bottom:0;
right:10px;
background-position:bottom left;
}
.tipsy-e .tipsy-arrow {
top:50%;
margin-top:-4px;
right:0;
width:5px;
height:9px;
background-position:top right;
}
.tipsy-w .tipsy-arrow {
top:50%;
margin-top:-4px;
left:0;
width:5px;
height:9px;
}
.tipsy-s {
margin-top:-15px;
}
.tipsy-e {
margin-left:-15px;
}
/* Container */
#cv {
width:780px;
background-color:#FFFFFF;
border:1px solid #637BFF;
margin:66px auto;
padding:0 0 40px;
}
/* Header */
.header {
background:url(../images/grey_bg.jpg) 0 0 repeat;
margin:0;
padding:30px 40px 29px;
position:relative;
}
/* Header - Person */
.person {
float:left;
margin-top:15px;
width:500px;
}
.person img {
float:left;
margin-right:25px;
background-color:#FFF;
border:1px solid #dedede;
padding:10px;
}
.person h1 {
margin-top:45px; /* (152 pic - 46 h1 - 16 h2)/2 */
color:#475261;
font-size:46px;
font-weight:700;
}
.person h2 {
color:#475261;
font-family:Arial, Helvetica, sans-serif;
font-size:18px;
line-height:16px;
font-weight:400;
text-transform:uppercase;
}
/* Header - Card */
.paperclip {
background: transparent url(../images/paperclip_clipped.png) 0 0 no-repeat;
width:64px;
height:64px;
position:absolute;
top:7px;
right:40px;
}
#card {
float:right;
border-style:solid;
border-width: 1px 2px 2px 1px;
border-color: #DEDEDE #808080 #808080 #DEDEDE;
padding:10px;
background:#FFFFFF;
}
#card ul {
list-style:none;
}
#card ul.card_buttons li {
display:inline;
margin-right:5px;
}
#card ul.card_items li {
background:url(../images/socials/default.png) 0 3px no-repeat;
padding-left:21px;
}
#card ul.card_items li.xp {
background-image:url(../images/experience.png);
}
#card ul.card_items li.university {
background-image:url(../images/university.png);
}
#card ul.card_items li.globe {
background-image:url(../images/globe.png);
}
#card ul.card_items li a, #card ul.card_items li a:visited {
color:#333333;
}
#card ul.card_items li a:hover {
color:#000000;
}
#card .contact_me_btn {
background-image:none;
background:#F8F8F8 url('../images/contactme.png') 90% 50% no-repeat;
border:1px solid #DEDEDE;
color:#4B5564;
display:block;
font-size:15px;
font-weight:700;
text-decoration:none;
margin-top:10px;
padding:10px 50px 10px 15px;
}
#card .contact_me_btn:hover {
border-color:#637BFF;
}
/* Main - Contact */
.contact {
}
#contact_me {
background:#f8f8f8 url(../images/grey_bg.jpg) 0 0 repeat;
border:1px solid #dfdfdf;
padding:40px 40px;
position:relative;
}
#contact_me p {
clear:both;
text-align:center;
}
#contact_me input, #contact_me textarea {
background-color:#fff;
border:1px solid #ccc;
color:#515151;
width:250px;
padding:5px;
margin:5px;
font-size:12px;
line-height:12px;
}
#contact_me .large_box {
width:522px; /* 250*2 + 5*2 padding + 5*2 margins + 1*2 borders */
}
#contact_me textarea {
height:150px;
overflow:auto;
font:12px Arial, Helvetica, sans-serif;
}
#contact_me .btn {
width:90px;
padding:0;
font-weight:600;
}
#contact_me .btn:hover {
border-color:#637BFF;
}
#contact_me #formstatus {
clear:both;
height:27px; /*15 5*2 padding 1*2 borders */
}
#contact_me #formstatus .message {
width:522px; /* 250*2 + 5*2 padding + 5*2 margins + 1*2 borders */
margin:auto;
padding:5px;
border:1px solid #D4D4D4;
background:white;
font-size:12px;
line-height:15px;
font-weight:700;
}
#contact_me #formstatus .error {
color:red;
}
#contact_me #formstatus .warning {
color:orange;
}
#contact_me #formstatus .success {
color:#0C3;
border:none;
background:none;
}
#contact_me #formstatus .loading {
color:#515151;
background:#FFFFFF url(../images/loading_white.gif) 509px 50% no-repeat;
}
#contact_me .close {
position:absolute;
top:10px;
right:10px;
margin:0;
padding:0;
width:26px;
height:26px;
background:#FFFFFF url(../images/close.png) 0 0 no-repeat;
}
/* Main - Profile */
.profile {
}
/* Main - Work */
.work {
}
.work h3 {
margin-bottom:15px;
}
.work span.company {
text-transform:uppercase;
}
.work .item ul li {
list-style-type:none;
margin-bottom:30px;
border:1px solid #DEDEDE;
padding-top:30px;
padding-right:15px;
}
.work .item ul li.last {
margin-bottom:0;
}
.work .item .cover {
float:left;
margin:-15px 15px 15px 15px;
border-left:15px solid #637BFF;
}
.work .item .info {
border:1px solid #DEDEDE;
border-left:none;
padding:10px;
width:115px;
background:#F8F8F8;
}
.work .item .info p {
text-align:center;
padding:0;
border-bottom:1px solid #dedede;
}
.work .item .info p a {
/* font-family:Georgia; */
font-size:16px;
font-weight:700;
}
.work .item .info p a img {
margin:0 3px 0 0;
}
.work .item .info ul {
margin-top:5px;
}
.work .item .info ul li {
list-style-position:inside;
list-style-type:square;
background:#F8F8F8;
margin-left:5px;
line-height:20px;
margin-bottom:0;
font-size:11px;
line-height:16px;
}
.work .item ul li span.title {
font-size:13px;
font-weight:700;
}
.work .item ul li ul li {
border:none;
padding:0;
list-style-type:disc;
}
.work .item ul li ul li.subtitle {
margin-left:0;
list-style:none;
font-style:italic;
margin-bottom:15px;
}
.work .item ul li ul li.action {
margin-bottom:5px;
color:#4B5564;
clear:both;
}
.work .item ul li ul li.action ul li {
list-style-type:square;
color:grey;
margin-bottom:0;
}
.work .item ul.standalone li{
border:none;
margin:0 0 0 15px;
padding:0;
}
/* Main - Language */
.language {
}
.language ul {
margin-left:25px;
}
/* Main - Technical */
.technical {
}
.technical h2 {
margin-bottom:15px;
}
.technical p {
padding-bottom:0;
}
.technical ul li {
margin-left:25px;
margin-bottom:15px;
font-weight:700;
}
.technical ul li.no_child {
font-weight:normal;
margin-bottom:5px;
}
.technical ul li.last {
margin-bottom:0;
}
.technical ul {
padding-bottom:0;
}
/* Main - Education */
.education {
border-bottom:none;
}
.education a.logo {
float:left;
width:70px;
height:35px; /* 24 h2 + 16 h3 + 3 margin - 2 border - 3*2 padding */
padding:3px;
border:1px solid #DFDFDF;
margin-top:0px;
margin-right:10px;
background-position:3px 3px;
background-repeat:no-repeat;
}
.education a.netapp {
background-image:url('../images/netapp.gif');
}
.education a.cfa {
background-image:url('../images/cfa.png');
}
.education p {
margin:0 0 0 15px;
padding:0;
}
.education a.details {
margin-left:15px;
font-style:italic;
}
.education ul li {
margin-left:25px;
font-weight:700;
}
.education ul li ul li {
margin-left:15px;
font-style:italic;
list-style-type:none;
font-weight:normal;
}
.education ul li ul li ul li {
font-style:normal;
}
/* Tests */