New clothes

This commit is contained in:
Manos Katsomallos 2019-12-31 03:26:38 +02:00
parent 99b5e695e0
commit 436564c658
95 changed files with 621 additions and 36688 deletions

View File

@ -1,802 +0,0 @@
/*
=====================================================================
* Ceevee v1.0 Default Stylesheet
* url: styleshout.com
* 03-17-2014
=====================================================================
TOC:
a. Webfonts and Icon fonts
b. Reset
c. Default Styles
1. Basic
2. Typography
3. Links
4. Images
5. Buttons
6. Forms
d. Grid
e. Others
1. Clearing
2. Misc
===================================================================== */
/* ------------------------------------------------------------------ */
/* a. Webfonts and Icon fonts
------------------------------------------------------------------ */
@import url("fonts.css");
@import url("fontello/css/fontello.css");
/* ------------------------------------------------------------------
/* b. Reset
Adapted from:
Normalize.css - https://github.com/necolas/normalize.css/
HTML5 Doctor Reset - html5doctor.com/html-5-reset-stylesheet/
/* ------------------------------------------------------------------ */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
display: block;
}
audio,
canvas,
video {
display: inline-block;
}
audio:not([controls]) {
display: none;
height: 0;
}
[hidden] { display: none; }
code, kbd, pre, samp {
font-family: monospace, serif;
font-size: 1em;
}
pre {
white-space: pre;
white-space: pre-wrap;
word-wrap: break-word;
}
blockquote, q { quotes: &#8220 “ }
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
ins {
background-color: #ff9;
color: #000;
text-decoration: none;
}
mark {
background-color: #A7F4F6;
color: #555;
}
del { text-decoration: line-through; }
abbr[title], dfn[title] {
border-bottom: 1px dotted;
cursor: help;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
/* ------------------------------------------------------------------ */
/* c. Default and Basic Styles
Adapted from:
Skeleton CSS Framework - http://www.getskeleton.com/
Typeplate Typographic Starter Kit - http://typeplate.com/
/* ------------------------------------------------------------------ */
/* 1. Basic ------------------------------------------------------- */
*,
*:before,
*:after {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
html {
font-size: 62.5%;
-webkit-font-smoothing: antialiased;
}
body {
background: #fff;
font-family: 'opensans-regular', sans-serif;
font-weight: normal;
font-size: 15px;
line-height: 30px;
color: #838C95;
-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
-webkit-text-size-adjust: 100%;
}
/* 2. Typography
Vertical rhythm with leading derived from 6
--------------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
color: #313131;
font-family: 'opensans-bold', sans-serif;
font-weight: normal;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; }
h1 { font-size: 38px; line-height: 42px; margin-bottom: 12px; letter-spacing: -1px; }
h2 { font-size: 28px; line-height: 36px; margin-bottom: 6px; }
h3 { font-size: 22px; line-height: 30px; margin-bottom: 12px; }
h4 { font-size: 20px; line-height: 30px; margin-bottom: 6px; }
h5 { font-size: 18px; line-height: 30px; }
h6 { font-size: 14px; line-height: 30px; }
.subheader { }
p { margin: 0 0 30px 0; }
p img { margin: 0; }
p.lead {
font: 19px/36px 'opensans-light', sans-serif;
margin-bottom: 18px;
}
/* for 'em' and 'strong' tags, font-size and line-height should be same with
the body tag due to rendering problems in some browsers */
em { font: 15px/30px 'opensans-italic', sans-serif; }
strong, b { font: 15px/30px 'opensans-bold', sans-serif; }
small { font-size: 11px; line-height: inherit; }
/* Blockquotes */
blockquote {
margin: 30px 0px;
padding-left: 40px;
position: relative;
}
blockquote:before {
content: "\201C";
opacity: 0.45;
font-size: 80px;
line-height: 0px;
margin: 0;
font-family: arial, sans-serif;
position: absolute;
top: 30px;
left: 0;
}
blockquote p {
font-family: 'librebaskerville-italic', serif;
padding: 0;
font-size: 18px;
line-height: 36px;
}
blockquote cite {
display: block;
font-size: 12px;
font-style: normal;
line-height: 18px;
}
blockquote cite:before { content: "\2014 \0020"; }
blockquote cite a,
blockquote cite a:visited { color: #8B9798; border: none }
/* ---------------------------------------------------------------------
/* Pull Quotes Markup
/*
<aside class="pull-quote">
<blockquote>
<p></p>
</blockquote>
</aside>
/*
/* --------------------------------------------------------------------- */
.pull-quote {
position: relative;
padding: 18px 30px 18px 0px;
}
.pull-quote:before,
.pull-quote:after {
height: 1em;
opacity: 0.45;
position: absolute;
font-size: 80px;
font-family: Arial, Sans-Serif;
}
.pull-quote:before {
content: "\201C";
top: 33px;
left: 0;
}
.pull-quote:after {
content: '\201D';
bottom: -33px;
right: 0;
}
.pull-quote blockquote {
margin: 0;
}
.pull-quote blockquote:before {
content: none;
}
/* Abbreviations */
abbr {
font-family: 'opensans-bold', sans-serif;
font-variant: small-caps;
text-transform: lowercase;
letter-spacing: .5px;
color: gray;
}
abbr:hover { cursor: help; }
/* drop cap */
.drop-cap:first-letter {
float: left;
margin: 0;
padding: 14px 6px 0 0;
font-size: 84px;
font-family: /* Copperplate */ 'opensans-bold', sans-serif;
line-height: 60px;
text-indent: 0;
background: transparent;
color: inherit;
}
hr { border: solid #E3E3E3; border-width: 1px 0 0; clear: both; margin: 11px 0 30px; height: 0; }
/* 3. Links ------------------------------------------------------- */
a, a:visited {
text-decoration: none;
outline: 0;
color: #11ABB0;
-webkit-transition: color .3s ease-in-out;
-moz-transition: color .3s ease-in-out;
-o-transition: color .3s ease-in-out;
transition: color .3s ease-in-out;
}
a:hover, a:focus { color: #313131; }
p a, p a:visited { line-height: inherit; }
/* 4. List --------------------------------------------------------- */
ul, ol { margin-bottom: 24px; margin-top: 12px; }
ul { list-style: none outside; }
ol { list-style: decimal; }
ol, ul.square, ul.circle, ul.disc { margin-left: 30px; }
ul.square { list-style: square outside; }
ul.circle { list-style: circle outside; }
ul.disc { list-style: disc outside; }
ul ul, ul ol,
ol ol, ol ul { margin: 6px 0 6px 30px; }
ul ul li, ul ol li,
ol ol li, ol ul li { margin-bottom: 6px; }
li { line-height: 18px; margin-bottom: 12px; }
ul.large li { }
li p { }
/* ---------------------------------------------------------------------
/* Stats Tab Markup
<ul class="stats-tabs">
<li><a href="#">[value]<b>[name]</b></a></li>
</ul>
Extend this object into your markup.
/*
/* --------------------------------------------------------------------- */
.stats-tabs {
padding: 0;
margin: 24px 0;
}
.stats-tabs li {
display: inline-block;
margin: 0 10px 18px 0;
padding: 0 10px 0 0;
border-right: 1px solid #ccc;
}
.stats-tabs li:last-child {
margin: 0;
padding: 0;
border: none;
}
.stats-tabs li a {
display: inline-block;
font-size: 22px;
font-family: 'opensans-bold', sans-serif;
border: none;
color: #313131;
}
.stats-tabs li a:hover {
color:#11ABB0;
}
.stats-tabs li a b {
display: block;
margin: 6px 0 0 0;
font-size: 13px;
font-family: 'opensans-regular', sans-serif;
color: #8B9798;
}
/* definition list */
dl { margin: 12px 0; }
dt { margin: 0; color:#11ABB0; }
dd { margin: 0 0 0 20px; }
/* Lining Definition Style Markup */
.lining dt,
.lining dd {
display: inline;
margin: 0;
}
.lining dt + dt:before,
.lining dd + dt:before {
content: "\A";
white-space: pre;
}
.lining dd + dd:before {
content: ", ";
}
.lining dd:before {
content: ": ";
margin-left: -0.2em;
}
/* Dictionary Definition Style Markup */
.dictionary-style dt {
display: inline;
counter-reset: definitions;
}
.dictionary-style dt + dt:before {
content: ", ";
margin-left: -0.2em;
}
.dictionary-style dd {
display: block;
counter-increment: definitions;
}
.dictionary-style dd:before {
content: counter(definitions, decimal) ". ";
}
/* Pagination */
.pagination {
margin: 36px auto;
text-align: center;
}
.pagination ul li {
display: inline-block;
margin: 0;
padding: 0;
}
.pagination .page-numbers {
font: 15px/18px 'opensans-bold', sans-serif;
display: inline-block;
padding: 6px 10px;
margin-right: 3px;
margin-bottom: 6px;
color: #6E757C;
background-color: #E6E8EB;
-webkit-transition: all 200ms ease-in-out;
-moz-transition: all 200ms ease-in-out;
-o-transition: all 200ms ease-in-out;
-ms-transition: all 200ms ease-in-out;
transition: all 200ms ease-in-out;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
}
.pagination .page-numbers:hover {
background: #838A91;
color: #fff;
}
.pagination .current,
.pagination .current:hover {
background-color: #11ABB0;
color: #fff;
}
.pagination .inactive,
.pagination .inactive:hover {
background-color: #E6E8EB;
color: #A9ADB2;
}
.pagination .prev, .pagination .next {}
/* 5. Images --------------------------------------------------------- */
img {
max-width: 100%;
height: auto;
}
img.pull-right { margin: 12px 0px 0px 18px; }
img.pull-left { margin: 12px 18px 0px 0px; }
/* 6. Buttons --------------------------------------------------------- */
.button,
.button:visited,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
font: 16px/30px 'opensans-bold', sans-serif;
background: #11ABB0;
display: inline-block;
text-decoration: none;
letter-spacing: 0;
color: #fff;
padding: 12px 20px;
margin-bottom: 18px;
border: none;
cursor: pointer;
height: auto;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
}
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover {
background: #3d4145;
color: #fff;
}
.button:active,
button:active,
input[type="submit"]:active,
input[type="reset"]:active,
input[type="button"]:active {
background: #3d4145;
color: #fff;
}
.button.full-width,
button.full-width,
input[type="submit"].full-width,
input[type="reset"].full-width,
input[type="button"].full-width {
width: 100%;
padding-left: 0 !important;
padding-right: 0 !important;
text-align: center;
}
/* Fix for odd Mozilla border & padding issues */
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
/* 7. Forms --------------------------------------------------------- */
form { margin-bottom: 24px; }
fieldset { margin-bottom: 24px; }
input[type="text"],
input[type="password"],
input[type="email"],
textarea,
select {
display: block;
padding: 18px 15px;
margin: 0 0 24px 0;
border: 0;
outline: none;
vertical-align: middle;
min-width: 225px;
max-width: 100%;
font-size: 15px;
line-height: 24px;
color: #647373;
background: #D3D9D9;
}
/* select { padding: 0;
width: 220px;
} */
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
textarea:focus {
color: #B3B7BC;
background-color: #3d4145;
}
textarea { min-height: 220px; }
label,
legend {
font: 16px/24px 'opensans-bold', sans-serif;
margin: 12px 0;
color: #3d4145;
display: block;
}
label span,
legend span {
color: #8B9798;
font: 14px/24px 'opensans-regular', sans-serif;
}
input[type="checkbox"],
input[type="radio"] {
font-size: 15px;
color: #737373;
}
input[type="checkbox"] { display: inline; }
/* ------------------------------------------------------------------ */
/* d. Grid
---------------------------------------------------------------------
gutter = 40px.
/* ------------------------------------------------------------------ */
/* default
--------------------------------------------------------------- */
.row {
width: 96%;
max-width: 1020px;
margin: 0 auto;
}
/* fixed width for IE8 */
.ie .row { width: 1000px ; }
.narrow .row { max-width: 980px; }
.row .row { width: auto; max-width: none; margin: 0 -20px; }
/* row clearing */
.row:before,
.row:after {
content: " ";
display: table;
}
.row:after {
clear: both;
}
.column, .columns {
position: relative;
padding: 0 20px;
min-height: 1px;
float: left;
}
.column.centered, .columns.centered {
float: none;
margin: 0 auto;
}
/* removed gutters */
.row.collapsed > .column,
.row.collapsed > .columns,
.column.collapsed, .columns.collapsed { padding: 0; }
[class*="column"] + [class*="column"]:last-child { float: right; }
[class*="column"] + [class*="column"].end { float: right; }
/* column widths */
.row .one { width: 8.33333%; }
.row .two { width: 16.66667%; }
.row .three { width: 25%; }
.row .four { width: 33.33333%; }
.row .five { width: 41.66667%; }
.row .six { width: 50%; }
.row .seven { width: 58.33333%; }
.row .eight { width: 66.66667%; }
.row .nine { width: 75%; }
.row .ten { width: 83.33333%; }
.row .eleven { width: 91.66667%; }
.row .twelve { width: 100%; }
/* Offsets */
.row .offset-1 { margin-left: 8.33333%; }
.row .offset-2 { margin-left: 16.66667%; }
.row .offset-3 { margin-left: 25%; }
.row .offset-4 { margin-left: 33.33333%; }
.row .offset-5 { margin-left: 41.66667%; }
.row .offset-6 { margin-left: 50%; }
.row .offset-7 { margin-left: 58.33333%; }
.row .offset-8 { margin-left: 66.66667%; }
.row .offset-9 { margin-left: 75%; }
.row .offset-10 { margin-left: 83.33333%; }
.row .offset-11 { margin-left: 91.66667%; }
/* Push/Pull */
.row .push-1 { left: 8.33333%; }
.row .pull-1 { right: 8.33333%; }
.row .push-2 { left: 16.66667%; }
.row .pull-2 { right: 16.66667%; }
.row .push-3 { left: 25%; }
.row .pull-3 { right: 25%; }
.row .push-4 { left: 33.33333%; }
.row .pull-4 { right: 33.33333%; }
.row .push-5 { left: 41.66667%; }
.row .pull-5 { right: 41.66667%; }
.row .push-6 { left: 50%; }
.row .pull-6 { right: 50%; }
.row .push-7 { left: 58.33333%; }
.row .pull-7 { right: 58.33333%; }
.row .push-8 { left: 66.66667%; }
.row .pull-8 { right: 66.66667%; }
.row .push-9 { left: 75%; }
.row .pull-9 { right: 75%; }
.row .push-10 { left: 83.33333%; }
.row .pull-10 { right: 83.33333%; }
.row .push-11 { left: 91.66667%; }
.row .pull-11 { right: 91.66667%; }
/* block grids
--------------------------------------------------------------------- */
.bgrid-sixths [class*="column"] { width: 16.66667%; }
.bgrid-quarters [class*="column"] { width: 25%; }
.bgrid-thirds [class*="column"] { width: 33.33333%; }
.bgrid-halves [class*="column"] { width: 50%; }
[class*="bgrid"] [class*="column"] + [class*="column"]:last-child { float: left; }
/* Left clearing for block grid columns - columns that changes width in
different screen sizes. Allows columns with different heights to align
properly.
--------------------------------------------------------------------- */
.first { clear: left; } /* first column in default screen */
.s-first { clear: none; } /* first column in smaller screens */
/* smaller screens
--------------------------------------------------------------- */
@media only screen and (max-width: 900px) {
/* block grids on small screens */
.s-bgrid-sixths [class*="column"] { width: 16.66667%; }
.s-bgrid-quarters [class*="column"] { width: 25%; }
.s-bgrid-thirds [class*="column"] { width: 33.33333%; }
.s-bgrid-halves [class*="column"] { width: 50%; }
/* block grids left clearing */
.first { clear: none; }
.s-first { clear: left; }
}
/* mobile wide/smaller tablets
--------------------------------------------------------------- */
@media only screen and (max-width: 767px) {
.row {
width: 460px;
margin: 0 auto;
padding: 0;
}
.column, .columns {
width: auto !important;
float: none;
margin-left: 0;
margin-right: 0;
padding: 0 30px;
}
.row .row { width: auto; max-width: none; margin: 0 -30px; }
[class*="column"] + [class*="column"]:last-child { float: none; }
[class*="bgrid"] [class*="column"] + [class*="column"]:last-child { float: none; }
/* Offsets */
.row .offset-1 { margin-left: 0%; }
.row .offset-2 { margin-left: 0%; }
.row .offset-3 { margin-left: 0%; }
.row .offset-4 { margin-left: 0%; }
.row .offset-5 { margin-left: 0%; }
.row .offset-6 { margin-left: 0%; }
.row .offset-7 { margin-left: 0%; }
.row .offset-8 { margin-left: 0%; }
.row .offset-9 { margin-left: 0%; }
.row .offset-10 { margin-left: 0%; }
.row .offset-11 { margin-left: 0%; }
}
/* mobile narrow
--------------------------------------------------------------- */
@media only screen and (max-width: 460px) {
.row { width: auto; }
}
/* larger screens
--------------------------------------------------------------- */
@media screen and (min-width: 1200px) {
.wide .row { max-width: 1180px; }
}
/* ------------------------------------------------------------------ */
/* e. Others
/* ------------------------------------------------------------------ */
/* 1. Clearing
(http://nicolasgallagher.com/micro-clearfix-hack/
--------------------------------------------------------------------- */
.cf:before,
.cf:after {
content: " ";
display: table;
}
.cf:after {
clear: both;
}
/* 2. Misc -------------------------------------------------------- */
.remove-bottom { margin-bottom: 0 !important; }
.half-bottom { margin-bottom: 12px !important; }
.add-bottom { margin-bottom: 24px !important; }
.no-border { border: none; }
.text-center { text-align: center !important; }
.text-left { text-align: left !important; }
.text-right { text-align: right !important; }
.pull-left { float: left !important; }
.pull-right { float: right !important; }
.align-center {
margin-left: auto !important;
margin-right: auto !important;
text-align: center !important;
}

View File

@ -1,85 +0,0 @@
/*
Animation example, for spinners
*/
.animate-spin {
-moz-animation: spin 2s infinite linear;
-o-animation: spin 2s infinite linear;
-webkit-animation: spin 2s infinite linear;
animation: spin 2s infinite linear;
display: inline-block;
}
@-moz-keyframes spin {
0% {
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-moz-transform: rotate(359deg);
-o-transform: rotate(359deg);
-webkit-transform: rotate(359deg);
transform: rotate(359deg);
}
}
@-webkit-keyframes spin {
0% {
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-moz-transform: rotate(359deg);
-o-transform: rotate(359deg);
-webkit-transform: rotate(359deg);
transform: rotate(359deg);
}
}
@-o-keyframes spin {
0% {
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-moz-transform: rotate(359deg);
-o-transform: rotate(359deg);
-webkit-transform: rotate(359deg);
transform: rotate(359deg);
}
}
@-ms-keyframes spin {
0% {
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-moz-transform: rotate(359deg);
-o-transform: rotate(359deg);
-webkit-transform: rotate(359deg);
transform: rotate(359deg);
}
}
@keyframes spin {
0% {
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-moz-transform: rotate(359deg);
-o-transform: rotate(359deg);
-webkit-transform: rotate(359deg);
transform: rotate(359deg);
}
}

View File

@ -1,17 +0,0 @@
.icon-mail-1:before { content: '\e807'; } /* '' */
.icon-up-circle:before { content: '\e80c'; } /* '' */
.icon-down-circle-1:before { content: '\e80d'; } /* '' */
.icon-left-circle-1:before { content: '\e80e'; } /* '' */
.icon-right-circle-1:before { content: '\e80f'; } /* '' */
.icon-up-circle-1:before { content: '\e810'; } /* '' */
.icon-mail-2:before { content: '\e805'; } /* '' */
.icon-mail:before { content: '\e806'; } /* '' */
.icon-plus:before { content: '\e808'; } /* '' */
.icon-left-open:before { content: '\e801'; } /* '' */
.icon-right-open:before { content: '\e802'; } /* '' */
.icon-up-open:before { content: '\e803'; } /* '' */
.icon-down-circle:before { content: '\e809'; } /* '' */
.icon-left-circle:before { content: '\e80a'; } /* '' */
.icon-right-circle:before { content: '\e80b'; } /* '' */
.icon-down-open:before { content: '\e800'; } /* '' */

File diff suppressed because one or more lines are too long

View File

@ -1,17 +0,0 @@
.icon-mail-1 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe807;&nbsp;'); }
.icon-up-circle { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe80c;&nbsp;'); }
.icon-down-circle-1 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe80d;&nbsp;'); }
.icon-left-circle-1 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe80e;&nbsp;'); }
.icon-right-circle-1 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe80f;&nbsp;'); }
.icon-up-circle-1 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe810;&nbsp;'); }
.icon-mail-2 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe805;&nbsp;'); }
.icon-mail { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe806;&nbsp;'); }
.icon-plus { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe808;&nbsp;'); }
.icon-left-open { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe801;&nbsp;'); }
.icon-right-open { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe802;&nbsp;'); }
.icon-up-open { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe803;&nbsp;'); }
.icon-down-circle { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe809;&nbsp;'); }
.icon-left-circle { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe80a;&nbsp;'); }
.icon-right-circle { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe80b;&nbsp;'); }
.icon-down-open { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe800;&nbsp;'); }

View File

@ -1,28 +0,0 @@
[class^="icon-"], [class*=" icon-"] {
font-family: 'fontello';
font-style: normal;
font-weight: normal;
/* fix buttons height */
line-height: 1em;
/* you can be more comfortable with increased icons size */
/* font-size: 120%; */
}
.icon-mail-1 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe807;&nbsp;'); }
.icon-up-circle { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe80c;&nbsp;'); }
.icon-down-circle-1 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe80d;&nbsp;'); }
.icon-left-circle-1 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe80e;&nbsp;'); }
.icon-right-circle-1 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe80f;&nbsp;'); }
.icon-up-circle-1 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe810;&nbsp;'); }
.icon-mail-2 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe805;&nbsp;'); }
.icon-mail { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe806;&nbsp;'); }
.icon-plus { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe808;&nbsp;'); }
.icon-left-open { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe801;&nbsp;'); }
.icon-right-open { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe802;&nbsp;'); }
.icon-up-open { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe803;&nbsp;'); }
.icon-down-circle { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe809;&nbsp;'); }
.icon-left-circle { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe80a;&nbsp;'); }
.icon-right-circle { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe80b;&nbsp;'); }
.icon-down-open { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe800;&nbsp;'); }

View File

@ -1,68 +0,0 @@
@font-face {
font-family: 'fontello';
src: url('../font/fontello.eot?13439518');
src: url('../font/fontello.eot?13439518#iefix') format('embedded-opentype'),
url('../font/fontello.woff?13439518') format('woff'),
url('../font/fontello.ttf?13439518') format('truetype'),
url('../font/fontello.svg?13439518#fontello') format('svg');
font-weight: normal;
font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
@font-face {
font-family: 'fontello';
src: url('../font/fontello.svg?13439518#fontello') format('svg');
}
}
*/
[class^="icon-"]:before, [class*=" icon-"]:before {
font-family: "fontello";
font-style: normal;
font-weight: normal;
speak: none;
display: inline-block;
text-decoration: inherit;
width: 1em;
margin-right: .2em;
text-align: center;
/* opacity: .8; */
/* For safety - reset parent styles, that can break glyph codes*/
font-variant: normal;
text-transform: none;
/* fix buttons height, for twitter bootstrap */
line-height: 1em;
/* Animation center compensation - margins should be symmetric */
/* remove if not needed */
margin-left: .2em;
/* you can be more comfortable with increased icons size */
/* font-size: 120%; */
/* Uncomment for 3D effect */
/* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
.icon-mail-1:before { content: '\e807'; } /* '' */
.icon-up-circle:before { content: '\e80c'; } /* '' */
.icon-down-circle-1:before { content: '\e80d'; } /* '' */
.icon-left-circle-1:before { content: '\e80e'; } /* '' */
.icon-right-circle-1:before { content: '\e80f'; } /* '' */
.icon-up-circle-1:before { content: '\e810'; } /* '' */
.icon-mail-2:before { content: '\e805'; } /* '' */
.icon-mail:before { content: '\e806'; } /* '' */
.icon-plus:before { content: '\e808'; } /* '' */
.icon-left-open:before { content: '\e801'; } /* '' */
.icon-right-open:before { content: '\e802'; } /* '' */
.icon-up-open:before { content: '\e803'; } /* '' */
.icon-down-circle:before { content: '\e809'; } /* '' */
.icon-left-circle:before { content: '\e80a'; } /* '' */
.icon-right-circle:before { content: '\e80b'; } /* '' */
.icon-down-open:before { content: '\e800'; } /* '' */

Binary file not shown.

View File

@ -1,27 +0,0 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>Copyright (C) 2014 by original authors @ fontello.com</metadata>
<defs>
<font id="fontello" horiz-adv-x="1000" >
<font-face font-family="fontello" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="850" descent="-150" />
<missing-glyph horiz-adv-x="1000" />
<glyph glyph-name="mail-1" unicode="&#xe807;" d="m467 366l-449 210l0 109l893 0l0-109z m0-123l444 210l0-437l-893 0l0 438z" horiz-adv-x="928" />
<glyph glyph-name="up-circle" unicode="&#xe80c;" d="m1000 349q0-136-67-251t-182-182t-251-67t-251 67t-182 182t-67 251t67 251t182 182t251 67t251-67t182-182t67-251z m-339-118l71 71l-232 233l-232-233l71-71l161 161z" horiz-adv-x="1000" />
<glyph glyph-name="down-circle-1" unicode="&#xe80d;" d="m911 350q0-184-131-315t-315-132t-316 132t-131 315t131 316t316 131t315-131t131-316z m-670-1l223-222l222 222l-165 0l0 225l-112 0l0-225l-168 0z" horiz-adv-x="928" />
<glyph glyph-name="left-circle-1" unicode="&#xe80e;" d="m465-97q-185 0-316 132t-131 315t131 316t316 131t315-131t131-316t-131-315t-315-132z m-2 671l-222-223l222-222l0 166l225 0l0 112l-225 0l0 167z" horiz-adv-x="928" />
<glyph glyph-name="right-circle-1" unicode="&#xe80f;" d="m465 797q184 0 315-131t131-316t-131-315t-315-132t-316 132t-131 315t131 316t316 131z m1-670l222 224l-222 222l0-166l-225 0l0-112l225 0l0-168z" horiz-adv-x="928" />
<glyph glyph-name="up-circle-1" unicode="&#xe810;" d="m18 350q0 185 130 316t316 131q185 0 316-131t131-316t-131-315t-315-132t-316 132t-131 315z m670 2l-224 222l-222-222l167 0l0-225l112 0l0 225l167 0z" horiz-adv-x="928" />
<glyph glyph-name="mail-2" unicode="&#xe805;" d="m580 306l258-267l-789 0l259 264l135-127z m-517 355l760 0l-380-362z m566-309l257 242l0-508z m-629-266l0 508l259-243z" horiz-adv-x="886" />
<glyph glyph-name="mail" unicode="&#xe806;" d="m0-29l324 342l176-100l176 100l324-342l-1000 0z m0 114l0 414l254-147z m0 503l0 141l1000 0l0-141l-500-285z m746-236l254 147l0-414z" horiz-adv-x="1000" />
<glyph glyph-name="plus" unicode="&#xe808;" d="m911 462l0-223l-335 0l0-336l-223 0l0 336l-335 0l0 223l335 0l0 335l223 0l0-335l335 0z" horiz-adv-x="928" />
<glyph glyph-name="left-open" unicode="&#xe801;" d="m0 350l148 149l352 351l148-148l-351-352l351-352l-148-148l-352 352z" horiz-adv-x="648" />
<glyph glyph-name="right-open" unicode="&#xe802;" d="m0-2l352 352l-352 352l148 148l352-351l148-149l-148-148l-352-352z" horiz-adv-x="648" />
<glyph glyph-name="up-open" unicode="&#xe803;" d="m0 174l352 352l148 148l148-148l352-352l-148-148l-352 351l-352-351z" horiz-adv-x="1000" />
<glyph glyph-name="down-circle" unicode="&#xe809;" d="m1000 349q0-136-67-251t-182-182t-251-67t-251 67t-182 182t-67 251t67 251t182 182t251 67t251-67t182-182t67-251z m-500-186l232 233l-71 71l-161-161l-161 161l-71-71z" horiz-adv-x="1000" />
<glyph glyph-name="left-circle" unicode="&#xe80a;" d="m1000 349q0-136-67-251t-182-182t-251-67t-251 67t-182 182t-67 251t67 251t182 182t251 67t251-67t182-182t67-251z m-453-232l71 71l-161 161l161 161l-71 71l-233-232z" horiz-adv-x="1000" />
<glyph glyph-name="right-circle" unicode="&#xe80b;" d="m1000 349q0-136-67-251t-182-182t-251-67t-251 67t-182 182t-67 251t67 251t182 182t251 67t251-67t182-182t67-251z m-547-232l233 232l-233 232l-71-71l161-161l-161-161z" horiz-adv-x="1000" />
<glyph glyph-name="down-open" unicode="&#xe800;" d="m0 526l148 148l352-351l352 351l148-148l-352-352l-148-148l-148 148z" horiz-adv-x="1000" />
</font>
</defs>
</svg>

Before

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

Binary file not shown.

View File

@ -1,157 +0,0 @@
/* Generated by Font Squirrel (http://www.fontsquirrel.com) */
/*
* Open Sans
================================================================================ */
@font-face {
font-family: 'opensans-regular';
src: url('fonts/opensans/OpenSans-Regular-webfont.eot');
src: url('fonts/opensans/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/opensans/OpenSans-Regular-webfont.woff') format('woff'),
url('fonts/opensans/OpenSans-Regular-webfont.ttf') format('truetype'),
url('fonts/opensans/OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'opensans-italic';
src: url('fonts/opensans/OpenSans-Italic-webfont.eot');
src: url('fonts/opensans/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/opensans/OpenSans-Italic-webfont.woff') format('woff'),
url('fonts/opensans/OpenSans-Italic-webfont.ttf') format('truetype'),
url('fonts/opensans/OpenSans-Italic-webfont.svg#open_sansitalic') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'opensans-light';
src: url('fonts/opensans/OpenSans-Light-webfont.eot');
src: url('fonts/opensans/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/opensans/OpenSans-Light-webfont.woff') format('woff'),
url('fonts/opensans/OpenSans-Light-webfont.ttf') format('truetype'),
url('fonts/opensans/OpenSans-Light-webfont.svg#open_sanslight') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'opensans-light-italic';
src: url('fonts/opensans/OpenSans-LightItalic-webfont.eot');
src: url('fonts/opensans/OpenSans-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/opensans/OpenSans-LightItalic-webfont.woff') format('woff'),
url('fonts/opensans/OpenSans-LightItalic-webfont.ttf') format('truetype'),
url('fonts/opensans/OpenSans-LightItalic-webfont.svg#open_sanslight_italic') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'opensans-semibold';
src: url('fonts/opensans/OpenSans-Semibold-webfont.eot');
src: url('fonts/opensans/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/opensans/OpenSans-Semibold-webfont.woff') format('woff'),
url('fonts/opensans/OpenSans-Semibold-webfont.ttf') format('truetype'),
url('fonts/opensans/OpenSans-Semibold-webfont.svg#open_sanssemibold') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'opensans-semibold-italic';
src: url('fonts/opensans/OpenSans-SemiboldItalic-webfont.eot');
src: url('fonts/opensans/OpenSans-SemiboldItalic-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/opensans/OpenSans-SemiboldItalic-webfont.woff') format('woff'),
url('fonts/opensans/OpenSans-SemiboldItalic-webfont.ttf') format('truetype'),
url('fonts/opensans/OpenSans-SemiboldItalic-webfont.svg#open_sanssemibold_italic') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'opensans-bold';
src: url('fonts/opensans/OpenSans-Bold-webfont.eot');
src: url('fonts/opensans/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/opensans/OpenSans-Bold-webfont.woff') format('woff'),
url('fonts/opensans/OpenSans-Bold-webfont.ttf') format('truetype'),
url('fonts/opensans/OpenSans-Bold-webfont.svg#open_sansbold') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'opensans-bold-italic';
src: url('fonts/opensans/OpenSans-BoldItalic-webfont.eot');
src: url('fonts/opensans/OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/opensans/OpenSans-BoldItalic-webfont.woff') format('woff'),
url('fonts/opensans/OpenSans-BoldItalic-webfont.ttf') format('truetype'),
url('fonts/opensans/OpenSans-BoldItalic-webfont.svg#open_sansbold_italic') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'opensans-extrabold';
src: url('fonts/opensans/OpenSans-ExtraBold-webfont.eot');
src: url('fonts/opensans/OpenSans-ExtraBold-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/opensans/OpenSans-ExtraBold-webfont.woff') format('woff'),
url('fonts/opensans/OpenSans-ExtraBold-webfont.ttf') format('truetype'),
url('fonts/opensans/OpenSans-ExtraBold-webfont.svg#open_sansextrabold') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'opensans-extrabold-italic';
src: url('fonts/opensans/OpenSans-ExtraBoldItalic-webfont.eot');
src: url('fonts/opensans/OpenSans-ExtraBoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/opensans/OpenSans-ExtraBoldItalic-webfont.woff') format('woff'),
url('fonts/opensans/OpenSans-ExtraBoldItalic-webfont.ttf') format('truetype'),
url('fonts/opensans/OpenSans-ExtraBoldItalic-webfont.svg#open_sansextrabold_italic') format('svg');
font-weight: normal;
font-style: normal;
}
/*
* Libre Baskerville
================================================================================ */
@font-face {
font-family: 'librebaskerville-bold';
src: url('fonts/librebaskerville/librebaskerville-bold-webfont.eot');
src: url('fonts/librebaskerville/librebaskerville-bold-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/librebaskerville/librebaskerville-bold-webfont.woff') format('woff'),
url('fonts/librebaskerville/librebaskerville-bold-webfont.ttf') format('truetype'),
url('fonts/librebaskerville/librebaskerville-bold-webfont.svg#libre_baskervillebold') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'librebaskerville-italic';
src: url('fonts/librebaskerville/librebaskerville-italic-webfont.eot');
src: url('fonts/librebaskerville/librebaskerville-italic-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/librebaskerville/librebaskerville-italic-webfont.woff') format('woff'),
url('fonts/librebaskerville/librebaskerville-italic-webfont.ttf') format('truetype'),
url('fonts/librebaskerville/librebaskerville-italic-webfont.svg#libre_baskervilleitalic') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'librebaskerville-regular';
src: url('fonts/librebaskerville/librebaskerville-regular-webfont.eot');
src: url('fonts/librebaskerville/librebaskerville-regular-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/librebaskerville/librebaskerville-regular-webfont.woff') format('woff'),
url('fonts/librebaskerville/librebaskerville-regular-webfont.ttf') format('truetype'),
url('fonts/librebaskerville/librebaskerville-regular-webfont.svg#libre_baskervilleregular') format('svg');
font-weight: normal;
font-style: normal;
}
/*
* FIXED for Font-Face Chrome Rendering
================================================================================ */
@media screen and (-webkit-min-device-pixel-ratio:0) {
@font-face {
font-family: 'opensans-semibold';
src: url('fonts/opensans/OpenSans-Semibold-webfont.svg#open_sanssemibold') format('svg');
}
@font-face {
font-family: 'opensans-bold';
src: url('fonts/opensans/OpenSans-Bold-webfont.svg#open_sansbold') format('svg');
}
}

File diff suppressed because it is too large Load Diff

Before

Width:  |  Height:  |  Size: 187 KiB

File diff suppressed because it is too large Load Diff

Before

Width:  |  Height:  |  Size: 282 KiB

File diff suppressed because it is too large Load Diff

Before

Width:  |  Height:  |  Size: 182 KiB

File diff suppressed because it is too large Load Diff

Before

Width:  |  Height:  |  Size: 116 KiB

File diff suppressed because it is too large Load Diff

Before

Width:  |  Height:  |  Size: 118 KiB

File diff suppressed because it is too large Load Diff

Before

Width:  |  Height:  |  Size: 116 KiB

File diff suppressed because it is too large Load Diff

Before

Width:  |  Height:  |  Size: 118 KiB

File diff suppressed because it is too large Load Diff

Before

Width:  |  Height:  |  Size: 120 KiB

File diff suppressed because it is too large Load Diff

Before

Width:  |  Height:  |  Size: 114 KiB

File diff suppressed because it is too large Load Diff

Before

Width:  |  Height:  |  Size: 120 KiB

File diff suppressed because it is too large Load Diff

Before

Width:  |  Height:  |  Size: 117 KiB

File diff suppressed because it is too large Load Diff

Before

Width:  |  Height:  |  Size: 116 KiB

File diff suppressed because it is too large Load Diff

Before

Width:  |  Height:  |  Size: 120 KiB

View File

@ -1,986 +0,0 @@
/*
=====================================================================
* Ceevee v1.0 Layout Stylesheet
* url: styleshout.com
* 03-18-2014
=====================================================================
TOC:
a. General Styles
b. Header Styles
c. About Section
d. Resume Section
e. Portfolio Section
f. Call To Action Section
g. Testimonials Section
h. Contact Section
i. Footer
===================================================================== */
/* ------------------------------------------------------------------ */
/* a. General Styles
/* ------------------------------------------------------------------ */
body { background: #0f0f0f; }
/* ------------------------------------------------------------------ */
/* b. Header Styles
/* ------------------------------------------------------------------ */
header {
position: relative;
height: 800px;
min-height: 500px;
width: 100%;
background: #161415 url(../images/header-background.jpg) no-repeat bottom center;
background-size: cover !important;
-webkit-background-size: cover !important;
text-align: center;
overflow: hidden;
}
/* vertically center banner section */
header:before {
content: '';
display: inline-block;
vertical-align: middle;
height: 100%;
}
header .banner {
display: inline-block;
vertical-align: middle;
margin: 0 auto;
width: 85%;
padding-bottom: 30px;
text-align: center;
}
header .banner-text { width: 100%; }
header .banner-text h1 {
font: 90px/1.1em 'opensans-bold', sans-serif;
color: #fff;
letter-spacing: -2px;
margin: 0 auto 18px auto;
text-shadow: 0px 1px 3px rgba(0, 0, 0, .8);
}
header .banner-text h3 {
font: 18px/1.9em 'librebaskerville-regular', serif;
color: #A8A8A8;
margin: 0 auto;
width: 70%;
text-shadow: 0px 1px 2px rgba(0, 0, 0, .5);
}
header .banner-text h3 span,
header .banner-text h3 a {
color: #fff;
}
header .banner-text hr {
width: 60%;
margin: 18px auto 24px auto;
border-color: #2F2D2E;
border-color: rgba(150, 150, 150, .1);
}
/* header social links */
header .social {
margin: 24px 0;
padding: 0;
font-size: 30px;
text-shadow: 0px 1px 2px rgba(0, 0, 0, .8);
}
header .social li {
display: inline-block;
margin: 0 15px;
padding: 0;
}
header .social li a { color: #fff; }
header .social li a:hover { color: #11ABB0; }
/* scrolldown link */
header .scrolldown a {
position: absolute;
bottom: 30px;
left: 50%;
margin-left: -29px;
color: #fff;
display: block;
height: 42px;
width: 42px;
font-size: 42px;
line-height: 42px;
color: #fff;
border-radius: 100%;
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}
header .scrolldown a:hover { color: #11ABB0; }
/* primary navigation
--------------------------------------------------------------------- */
#nav-wrap ul, #nav-wrap li, #nav-wrap a {
margin: 0;
padding: 0;
border: none;
outline: none;
}
/* nav-wrap */
#nav-wrap {
font: 12px 'opensans-bold', sans-serif;
width: 100%;
text-transform: uppercase;
letter-spacing: 2.5px;
margin: 0 auto;
z-index: 100;
position: fixed;
left: 0;
top: 0;
}
.opaque { background-color: #333; }
/* hide toggle button */
#nav-wrap > a.mobile-btn { display: none; }
ul#nav {
min-height: 48px;
width: auto;
/* center align the menu */
text-align: center;
}
ul#nav li {
position: relative;
list-style: none;
height: 48px;
display: inline-block;
}
/* Links */
ul#nav li a {
/* 8px padding top + 8px padding bottom + 32px line-height = 48px */
display: inline-block;
padding: 8px 13px;
line-height: 32px;
text-decoration: none;
text-align: left;
color: #fff;
-webkit-transition: color .2s ease-in-out;
-moz-transition: color .2s ease-in-out;
-o-transition: color .2s ease-in-out;
-ms-transition: color .2s ease-in-out;
transition: color .2s ease-in-out;
}
ul#nav li a:active { background-color: transparent !important; }
ul#nav li.current a { color: #F06000; }
/* ------------------------------------------------------------------ */
/* c. About Section
/* ------------------------------------------------------------------ */
#about {
background: #2B2B2B;
padding-top: 96px;
padding-bottom: 66px;
overflow: hidden;
}
#about a, #about a:visited { color: #fff; }
#about a:hover, #about a:focus { color: #11ABB0; }
#about h2 {
font: 22px/30px 'opensans-bold', sans-serif;
color: #fff;
margin-bottom: 12px;
}
#about p {
line-height: 30px;
color: #7A7A7A;
}
#about .profile-pic {
position: relative;
width: 120px;
height: 120px;
border-radius: 100%;
}
#about .contact-details { width: 41.66667%; }
#about .download {
width: 58.33333%;
padding-top: 6px;
}
#about .main-col { padding-right: 5%; }
#about .download .button {
margin-top: 6px;
background: #444;
}
#about .download .button:hover {
background: #fff;
color: #2B2B2B;
}
#about .download .button i {
margin-right: 15px;
font-size: 20px;
}
/* ------------------------------------------------------------------ */
/* d. Resume Section
/* ------------------------------------------------------------------ */
#resume {
background: #fff;
padding-top: 90px;
padding-bottom: 72px;
overflow: hidden;
}
#resume a, #resume a:visited { color: #11ABB0; }
#resume a:hover, #resume a:focus { color: #313131; }
#resume h1 {
font: 18px/24px 'opensans-bold', sans-serif;
text-transform: uppercase;
letter-spacing: 1px;
}
#resume h1 span {
border-bottom: 3px solid #11ABB0;
padding-bottom: 6px;
}
#resume h3 {
font: 25px/30px 'opensans-bold', sans-serif;
}
#resume .header-col { padding-top: 9px; }
#resume .main-col { padding-right: 10%; }
.education, .work {
margin-bottom: 48px;
padding-bottom: 24px;
border-bottom: 1px solid #E8E8E8;
}
#resume .info {
font: 16px/24px 'librebaskerville-italic', serif;
color: #6E7881;
margin-bottom: 18px;
margin-top: 9px;
}
#resume .info span {
margin-right: 5px;
margin-left: 5px;
}
#resume .date {
font: 15px/24px 'opensans-regular', sans-serif;
margin-top: 6px;
}
/*----------------------------------------------*/
/* Skill Bars
/*----------------------------------------------*/
.bars {
width: 95%;
float: left;
padding: 0;
text-align: left;
}
.bars .skills {
margin-top: 36px;
list-style: none;
}
.bars li {
position: relative;
margin-bottom: 60px;
background: #ccc;
height: 42px;
border-radius: 3px;
}
.bars li em {
font: 15px 'opensans-bold', sans-serif;
color: #313131;
text-transform: uppercase;
letter-spacing: 2px;
font-weight: normal;
position: relative;
top: -36px;
}
.bar-expand {
position: absolute;
left: 0;
top: 0;
margin: 0;
padding-right: 24px;
background: #313131;
display: inline-block;
height: 42px;
line-height: 42px;
border-radius: 3px 0 0 3px;
}
.data {
width: 75%;
-moz-animation: data 3s ease;
-webkit-animation: data 3s ease;
}
.iot {
width: 80%;
-moz-animation: iot 3s ease;
-webkit-animation: iot 3s ease;
}
.software {
width: 70%;
-moz-animation: software 3s ease;
-webkit-animation: software 3s ease;
}
.ubicom {
width: 80%;
-moz-animation: ubicom 3s ease;
-webkit-animation: ubicom 3s ease;
}
@-moz-keyframes data {
0% { width: 0px; }
100% { width: 75%; }
}
@-moz-keyframes iot {
0% { width: 0px; }
100% { width: 80%; }
}
@-moz-keyframes software {
0% { width: 0px; }
100% { width: 70%; }
}
@-moz-keyframes ubicom {
0% { width: 0px; }
100% { width: 80%; }
}
@-webkit-keyframes data {
0% { width: 0px; }
100% { width: 75%; }
}
@-webkit-keyframes iot {
0% { width: 0px; }
100% { width: 80%; }
}
@-webkit-keyframes software {
0% { width: 0px; }
100% { width: 70%; }
}
@-webkit-keyframes ubicom {
0% { width: 0px; }
100% { width: 80%; }
}
/* ------------------------------------------------------------------ */
/* e. Portfolio Section
/* ------------------------------------------------------------------ */
#portfolio {
background: #ebeeee;
padding-top: 90px;
padding-bottom: 60px;
}
#portfolio h1 {
font: 15px/24px 'opensans-semibold', sans-serif;
text-transform: uppercase;
letter-spacing: 1px;
text-align: center;
margin-bottom: 48px;
color: #95A3A3;
}
/* Portfolio Content */
#portfolio-wrapper .columns { margin-bottom: 36px; }
.portfolio-item .item-wrap {
background: #fff;
overflow: hidden;
position: relative;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.portfolio-item .item-wrap a {
display: block;
cursor: pointer;
}
/* overlay */
.portfolio-item .item-wrap .overlay {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
opacity: 0;
-moz-opacity: 0;
filter:alpha(opacity=0);
-webkit-transition: opacity 0.3s ease-in-out;
-moz-transition: opacity 0.3s ease-in-out;
-o-transition: opacity 0.3s ease-in-out;
transition: opacity 0.3s ease-in-out;
background: url(../images/overlay-bg.png) repeat;
}
.portfolio-item .item-wrap .link-icon {
display: block;
color: #fff;
height: 30px;
width: 30px;
font-size: 18px;
line-height: 30px;
text-align: center;
opacity: 0;
-moz-opacity: 0;
filter:alpha(opacity=0);
-webkit-transition: opacity 0.3s ease-in-out;
-moz-transition: opacity 0.3s ease-in-out;
-o-transition: opacity 0.3s ease-in-out;
transition: opacity 0.3s ease-in-out;
position: absolute;
top: 50%;
left: 50%;
margin-left: -15px;
margin-top: -15px;
}
.portfolio-item .item-wrap img {
vertical-align: bottom;
}
.portfolio-item .portfolio-item-meta { padding: 18px }
.portfolio-item .portfolio-item-meta h5 {
font: 14px/21px 'opensans-bold', sans-serif;
color: #fff;
}
.portfolio-item .portfolio-item-meta p {
font: 12px/18px 'opensans-light', sans-serif;
color: #c6c7c7;
margin-bottom: 0;
}
/* on hover */
.portfolio-item:hover .overlay {
opacity: 1;
-moz-opacity: 1;
filter:alpha(opacity=100);
}
.portfolio-item:hover .link-icon {
opacity: 1;
-moz-opacity: 1;
filter:alpha(opacity=100);
}
/* popup modal */
.popup-modal {
max-width: 550px;
background: #fff;
position: relative;
margin: 0 auto;
}
.popup-modal .description-box { padding: 12px 36px 18px 36px; }
.popup-modal .description-box h4 {
font: 15px/24px 'opensans-bold', sans-serif;
margin-bottom: 12px;
color: #111;
}
.popup-modal .description-box p {
font: 14px/24px 'opensans-regular', sans-serif;
color: #A1A1A1;
margin-bottom: 12px;
}
.popup-modal .description-box .categories {
font: 11px/21px 'opensans-light', sans-serif;
color: #A1A1A1;
text-transform: uppercase;
letter-spacing: 2px;
display: block;
text-align: left;
}
.popup-modal .description-box .categories i {
margin-right: 8px;
}
.popup-modal .link-box {
padding: 18px 36px;
background: #111;
text-align: left;
}
.popup-modal .link-box a {
color: #fff;
font: 11px/21px 'opensans-bold', sans-serif;
text-transform: uppercase;
letter-spacing: 3px;
cursor: pointer;
}
.popup-modal a:hover { color: #00CCCC; }
.popup-modal a.popup-modal-dismiss { margin-left: 24px; }
/* fadein/fadeout effect for modal popup
/* ------------------------------------------------------------------ */
/* content at start */
.mfp-fade.mfp-wrap .mfp-content .popup-modal {
opacity: 0;
-webkit-transition: all 200ms ease-in-out;
-moz-transition: all 200ms ease-in-out;
-o-transition: all 200ms ease-in-out;
-ms-transition: all 200ms ease-in-out;
transition: all 200ms ease-in-out;
}
/* content fadein */
.mfp-fade.mfp-wrap.mfp-ready .mfp-content .popup-modal {
opacity: 1;
}
/* content fadeout */
.mfp-fade.mfp-wrap.mfp-removing .mfp-content .popup-modal {
opacity: 0;
}
/* ------------------------------------------------------------------ */
/* f. Call To Action Section
/* ------------------------------------------------------------------ */
#call-to-action {
background: #212121;
padding-top: 66px;
padding-bottom: 48px;
}
#call-to-action h1 {
font: 18px/24px 'opensans-bold', sans-serif;
text-transform: uppercase;
letter-spacing: 3px;
color: #fff;
}
#call-to-action h1 span { display: none; }
#call-to-action .header-col h1:before {
font-family: 'FontAwesome';
content: "\f0ac";
padding-right: 10px;
font-size: 72px;
line-height: 72px;
text-align: left;
float: left;
color: #fff;
}
#call-to-action .action {
margin-top: 12px;
}
#call-to-action h2 {
font: 28px/36px 'opensans-bold', sans-serif;
color: #EBEEEE;
margin-bottom: 6px;
}
#call-to-action h2 a {
color: inherit;
}
#call-to-action p {
color: #636363;
font-size: 17px;
}
/*#
call-to-action .button {
color:#fff;
background: #0D0D0D;
}
*/
#call-to-action .button:hover,
#call-to-action .button:active {
background: #FFFFFF;
color: #0D0D0D;
}
#call-to-action p span {
font-family: 'opensans-semibold', sans-serif;
color: #D8D8D8;
}
/* ------------------------------------------------------------------
/* g. Testimonials
/* ------------------------------------------------------------------ */
#testimonials {
background: #1F1F1F url(../images/testimonials-bg.jpg) no-repeat center center;
background-size: cover !important;
-webkit-background-size: cover !important;
background-attachment: fixed;
position: relative;
min-height: 200px;
width: 100%;
overflow: hidden;
}
#testimonials .text-container {
padding-top: 96px;
padding-bottom: 66px;
}
#testimonials h1 {
font: 18px/24px 'opensans-bold', sans-serif;
text-transform: uppercase;
letter-spacing: 3px;
color: #fff;
}
#testimonials h1 span { display: none; }
#testimonials .header-col { padding-top: 9px; }
#testimonials .header-col h1:before {
font-family: 'FontAwesome';
content: "\f10d";
padding-right: 10px;
font-size: 72px;
line-height: 72px;
text-align: left;
float: left;
color: #fff;
}
/* Blockquotes */
#testimonials blockquote {
margin: 0 0px 30px 0px;
padding-left: 0;
position: relative;
text-shadow: 0px 1px 3px rgba(0, 0, 0, 1);
}
#testimonials blockquote:before { content: none; }
#testimonials blockquote p {
font-family: 'librebaskerville-italic', serif;
padding: 0;
font-size: 24px;
line-height: 48px;
color: #fff
}
#testimonials blockquote cite {
display: block;
font-size: 12px;
font-style: normal;
line-height: 18px;
color: #fff;
}
#testimonials blockquote cite:before { content: "\2014 \0020"; }
#testimonials blockquote cite a,
#testimonials blockquote cite a:visited { color: #8B9798; border: none }
/* Flex Slider
/* ------------------------------------------------------------------ */
/* Reset */
.flexslider a:active,
.flexslider a:focus { outline: none; }
.slides,
.flex-control-nav,
.flex-direction-nav { margin: 0; padding: 0; list-style: none; }
.slides li { margin: 0; padding: 0;}
/* Necessary Styles */
.flexslider {
position: relative;
zoom: 1;
margin: 0;
padding: 0;
}
.flexslider .slides { zoom: 1; }
.flexslider .slides > li { position: relative; }
/* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides > li { display: none; -webkit-backface-visibility: hidden; }
/* Suggested container for slide animation setups. Can replace this with your own */
.flex-container { zoom: 1; position: relative; }
/* Clearfix for .slides */
.slides:before,
.slides:after {
content: " ";
display: table;
}
.slides:after {
clear: both;
}
/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
* include js that eliminates this class on page load */
.no-js .slides > li:first-child { display: block; }
/* Slider Styles */
.slides { zoom: 1; }
.slides > li {
/*margin-right: 5px; */
overflow: hidden;
}
/* Control Nav */
.flex-control-nav {
width: 100%;
position: absolute;
bottom: -20px;
text-align: left;
}
.flex-control-nav li {
margin: 0 6px;
display: inline-block;
zoom: 1;
*display: inline;
}
.flex-control-paging li a {
width: 12px;
height: 12px;
display: block;
background: #ddd;
background: rgba(255, 255, 255, .3);
cursor: pointer;
text-indent: -9999px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
-o-border-radius: 20px;
border-radius: 20px;
box-shadow: inset 0 0 3px rgba(255, 255, 255, .3);
}
.flex-control-paging li a:hover {
background: #CCC;
background: rgba(255, 255, 255, .7);
}
.flex-control-paging li a.flex-active {
background: #fff;
background: rgba(255, 255, 255, .9);
cursor: default;
}
/* ------------------------------------------------------------------ */
/* h. Contact Section
/* ------------------------------------------------------------------ */
#contact {
background: #191919;
padding-top: 96px;
padding-bottom: 102px;
color: #636363;
}
#contact .section-head { margin-bottom: 42px; }
#contact a, #contact a:visited { color: #11ABB0; }
#contact a:hover, #contact a:focus { color: #fff; }
#contact h1 {
font: 18px/24px 'opensans-bold', sans-serif;
text-transform: uppercase;
letter-spacing: 3px;
color: #EBEEEE;
margin-bottom: 6px;
}
#contact h1 span { display: none; }
#contact h1:before {
font-family: 'FontAwesome';
content: "\f0e0";
padding-right: 10px;
font-size: 72px;
line-height: 72px;
text-align: left;
float: left;
color: #ebeeee;
}
#contact h4 {
font: 16px/24px 'opensans-bold', sans-serif;
color: #EBEEEE;
margin-bottom: 6px;
}
#contact p.lead {
font: 18px/36px 'opensans-light', sans-serif;
padding-right: 3%;
}
#contact .header-col { padding-top: 6px; }
/* contact form */
#contact form {
margin-bottom: 30px;
/*text-align: center;*/
}
#contact label {
font: 15px/24px 'opensans-bold', sans-serif;
margin: 12px 0;
color: #EBEEEE;
display: inline-block;
float: left;
width: 26%;
}
#contact input,
#contact textarea,
#contact select {
padding: 18px 20px;
color: #eee;
background: #373233;
margin-bottom: 42px;
border: 0;
outline: none;
font-size: 15px;
line-height: 24px;
/*width: 65%;*/
width: 100%;
}
#contact input:focus,
#contact textarea:focus,
#contact select:focus {
color: #fff;
background-color: #11ABB0;
}
#contact button.submit {
text-transform: uppercase;
letter-spacing: 3px;
color:#fff;
background: #0D0D0D;
border: none;
cursor: pointer;
height: auto;
display: inline-block;
border-radius: 3px;
/*margin-left: 26%;*/
}
#contact button.submit:hover {
color: #0D0D0D;
background: #fff;
}
#contact span.required {
color: #11ABB0;
font-size: 13px;
}
#message-warning, #message-success {
display: none;
background: #0F0F0F;
padding: 24px 24px;
margin-bottom: 36px;
width: 65%;
/*margin-left: 26%;*/
}
#message-warning { color: #D72828; }
#message-success { color: #11ABB0; }
#message-warning i,
#message-success i {
margin-right: 10px;
}
#image-loader {
display: none;
position: relative;
left: 18px;
top: 10px;
}
#image-loader > img {
height: 32px;
}
/* Twitter Feed */
#twitter {
margin-top: 12px;
padding: 0;
}
#twitter li {
margin: 6px 0px 12px 0;
line-height: 30px;
}
#twitter li span {
display: block;
}
#twitter li b a {
font: 13px/36px 'opensans-regular', Sans-serif;
color: #474747 !important;
border: none;
}
/* ------------------------------------------------------------------ */
/* i. Footer
/* ------------------------------------------------------------------ */
footer {
padding-top: 48px;
margin-bottom: 48px;
color: #303030;
font-size: 14px;
text-align: center;
position: relative;
}
footer a, footer a:visited { color: #525252; }
footer a:hover, footer a:focus { color: #fff; }
/* copyright */
footer .copyright {
margin: 0;
padding: 0;
}
footer .copyright li {
display: inline-block;
margin: 0;
padding: 0;
line-height: 24px;
}
.ie footer .copyright li {
display: inline;
}
footer .copyright li:before {
content: "\2022";
padding-left: 10px;
padding-right: 10px;
color: #095153;
}
footer .copyright li:first-child:before {
display: none;
}
/* social links */
footer .social-links {
margin: 18px 0 30px 0;
padding: 0;
font-size: 30px;
}
footer .social-links li {
display: inline-block;
margin: 0;
padding: 0;
margin-left: 42px;
color: #F06000;
}
footer .social-links li:first-child { margin-left: 0; }
/* Go To Top Button */
#go-top {
position: absolute;
top: -24px;
left: 50%;
margin-left: -30px;
}
#go-top a {
text-decoration: none;
border: 0 none;
display: block;
width: 60px;
height: 60px;
background-color: #525252;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
color: #fff;
font-size: 21px;
line-height: 60px;
border-radius: 100%;
}
#go-top a:hover { background-color: #0F9095; }

View File

@ -1,368 +0,0 @@
/* Magnific Popup CSS */
.mfp-bg {
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1042;
overflow: hidden;
position: fixed;
background: #000;
opacity: 0.8;
filter: alpha(opacity=80); }
.mfp-wrap {
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1043;
position: fixed;
outline: none !important;
-webkit-backface-visibility: hidden; }
.mfp-container {
text-align: center;
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
padding: 0 8px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box; }
.mfp-container:before {
content: '';
display: inline-block;
height: 100%;
vertical-align: middle; }
.mfp-align-top .mfp-container:before {
display: none; }
.mfp-content {
position: relative;
display: inline-block;
vertical-align: middle;
margin: 0 auto;
text-align: left;
z-index: 1045; }
.mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content {
width: 100%;
cursor: auto; }
.mfp-ajax-cur {
cursor: progress; }
.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
cursor: -moz-zoom-out;
cursor: -webkit-zoom-out;
cursor: zoom-out; }
.mfp-zoom {
cursor: pointer;
cursor: -webkit-zoom-in;
cursor: -moz-zoom-in;
cursor: zoom-in; }
.mfp-auto-cursor .mfp-content {
cursor: auto; }
.mfp-close, .mfp-arrow, .mfp-preloader, .mfp-counter {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none; }
.mfp-loading.mfp-figure {
display: none; }
.mfp-hide {
display: none !important; }
.mfp-preloader {
color: #cccccc;
position: absolute;
top: 50%;
width: auto;
text-align: center;
margin-top: -0.8em;
left: 8px;
right: 8px;
z-index: 1044; }
.mfp-preloader a {
color: #cccccc; }
.mfp-preloader a:hover {
color: white; }
.mfp-s-ready .mfp-preloader {
display: none; }
.mfp-s-error .mfp-content {
display: none; }
button.mfp-close, button.mfp-arrow {
overflow: visible;
cursor: pointer;
background: transparent;
border: 0;
-webkit-appearance: none;
display: block;
outline: none;
padding: 0;
z-index: 1046;
-webkit-box-shadow: none;
box-shadow: none; }
button::-moz-focus-inner {
padding: 0;
border: 0; }
.mfp-close {
width: 44px;
height: 44px;
line-height: 44px;
position: absolute;
right: 0;
top: 0;
text-decoration: none;
text-align: center;
opacity: 0.65;
filter: alpha(opacity=65);
padding: 0 0 18px 10px;
color: white;
font-style: normal;
font-size: 28px;
font-family: Arial, Baskerville, monospace; }
.mfp-close:hover, .mfp-close:focus {
opacity: 1;
filter: alpha(opacity=100); }
.mfp-close:active {
top: 1px; }
.mfp-close-btn-in .mfp-close {
color: #333333; }
.mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close {
color: white;
right: -6px;
text-align: right;
padding-right: 6px;
width: 100%; }
.mfp-counter {
position: absolute;
top: 0;
right: 0;
color: #cccccc;
font-size: 12px;
line-height: 18px; }
.mfp-arrow {
position: absolute;
opacity: 0.65;
filter: alpha(opacity=65);
margin: 0;
top: 50%;
margin-top: -55px;
padding: 0;
width: 90px;
height: 110px;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
.mfp-arrow:active {
margin-top: -54px; }
.mfp-arrow:hover, .mfp-arrow:focus {
opacity: 1;
filter: alpha(opacity=100); }
.mfp-arrow:before, .mfp-arrow:after, .mfp-arrow .mfp-b, .mfp-arrow .mfp-a {
content: '';
display: block;
width: 0;
height: 0;
position: absolute;
left: 0;
top: 0;
margin-top: 35px;
margin-left: 35px;
border: medium inset transparent; }
.mfp-arrow:after, .mfp-arrow .mfp-a {
border-top-width: 13px;
border-bottom-width: 13px;
top: 8px; }
.mfp-arrow:before, .mfp-arrow .mfp-b {
border-top-width: 21px;
border-bottom-width: 21px;
opacity: 0.7; }
.mfp-arrow-left {
left: 0; }
.mfp-arrow-left:after, .mfp-arrow-left .mfp-a {
border-right: 17px solid white;
margin-left: 31px; }
.mfp-arrow-left:before, .mfp-arrow-left .mfp-b {
margin-left: 25px;
border-right: 27px solid #3f3f3f; }
.mfp-arrow-right {
right: 0; }
.mfp-arrow-right:after, .mfp-arrow-right .mfp-a {
border-left: 17px solid white;
margin-left: 39px; }
.mfp-arrow-right:before, .mfp-arrow-right .mfp-b {
border-left: 27px solid #3f3f3f; }
.mfp-iframe-holder {
padding-top: 40px;
padding-bottom: 40px; }
.mfp-iframe-holder .mfp-content {
line-height: 0;
width: 100%;
max-width: 900px; }
.mfp-iframe-holder .mfp-close {
top: -40px; }
.mfp-iframe-scaler {
width: 100%;
height: 0;
overflow: hidden;
padding-top: 56.25%; }
.mfp-iframe-scaler iframe {
position: absolute;
display: block;
top: 0;
left: 0;
width: 100%;
height: 100%;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
background: black; }
/* Main image in popup */
img.mfp-img {
width: auto;
max-width: 100%;
height: auto;
display: block;
line-height: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 40px 0 40px;
margin: 0 auto; }
/* The shadow behind the image */
.mfp-figure {
line-height: 0; }
.mfp-figure:after {
content: '';
position: absolute;
left: 0;
top: 40px;
bottom: 40px;
display: block;
right: 0;
width: auto;
height: auto;
z-index: -1;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
background: #444444; }
.mfp-figure small {
color: #bdbdbd;
display: block;
font-size: 12px;
line-height: 14px; }
.mfp-figure figure {
margin: 0; }
.mfp-bottom-bar {
margin-top: -36px;
position: absolute;
top: 100%;
left: 0;
width: 100%;
cursor: auto; }
.mfp-title {
text-align: left;
line-height: 18px;
color: #f3f3f3;
word-wrap: break-word;
padding-right: 36px; }
.mfp-image-holder .mfp-content {
max-width: 100%; }
.mfp-gallery .mfp-image-holder .mfp-figure {
cursor: pointer; }
@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
/**
* Remove all paddings around the image on small screen
*/
.mfp-img-mobile .mfp-image-holder {
padding-left: 0;
padding-right: 0; }
.mfp-img-mobile img.mfp-img {
padding: 0; }
.mfp-img-mobile .mfp-figure:after {
top: 0;
bottom: 0; }
.mfp-img-mobile .mfp-figure small {
display: inline;
margin-left: 5px; }
.mfp-img-mobile .mfp-bottom-bar {
background: rgba(0, 0, 0, 0.6);
bottom: 0;
margin: 0;
top: auto;
padding: 3px 5px;
position: fixed;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box; }
.mfp-img-mobile .mfp-bottom-bar:empty {
padding: 0; }
.mfp-img-mobile .mfp-counter {
right: 5px;
top: 3px; }
.mfp-img-mobile .mfp-close {
top: 0;
right: 0;
width: 35px;
height: 35px;
line-height: 35px;
background: rgba(0, 0, 0, 0.6);
position: fixed;
text-align: center;
padding: 0; } }
@media all and (max-width: 900px) {
.mfp-arrow {
-webkit-transform: scale(0.75);
transform: scale(0.75); }
.mfp-arrow-left {
-webkit-transform-origin: 0;
transform-origin: 0; }
.mfp-arrow-right {
-webkit-transform-origin: 100%;
transform-origin: 100%; }
.mfp-container {
padding-left: 6px;
padding-right: 6px; } }
.mfp-ie7 .mfp-img {
padding: 0; }
.mfp-ie7 .mfp-bottom-bar {
width: 600px;
left: 50%;
margin-left: -300px;
margin-top: 5px;
padding-bottom: 5px; }
.mfp-ie7 .mfp-container {
padding: 0; }
.mfp-ie7 .mfp-content {
padding-top: 44px; }
.mfp-ie7 .mfp-close {
top: 0;
right: 0;
padding-top: 0; }

View File

@ -1,382 +0,0 @@
/* ==================================================================
* Ceevee Media Queries
* url: styleshout.com
* 03-18-2014
/* ================================================================== */
/* screenwidth less than 1024px
--------------------------------------------------------------------- */
@media only screen and (max-width: 1024px) {
/* header styles
------------------------------------------------------------------ */
header .banner-text h1 {
font: 80px/1.1em 'opensans-bold', sans-serif;
letter-spacing: -1px;
margin: 0 auto 12px auto;
}
}
/* screenwidth less than 900px
--------------------------------------------------------------------- */
@media only screen and (max-width: 900px) {
/* header styles
------------------------------------------------------------------ */
header .banner { padding-bottom: 12px; }
header .banner-text h1 {
font: 78px/1.1em 'opensans-bold', sans-serif;
letter-spacing: -1px;
}
header .banner-text h3 {
font: 17px/1.9em 'librebaskerville-regular', serif;
width: 80%;
}
header .banner-text hr {
width: 65%;
margin: 12px auto;
}
/* nav-wrap */
#nav-wrap {
font: 11px 'opensans-bold', sans-serif;
letter-spacing: 1.5px;
}
/* About Section
------------------------------------------------------------------- */
#about .profile-pic {
width: 114px;
height: 114px;
margin-left: 12px;
}
#about .contact-details { width: 50%; }
#about .download { width: 50%; }
/* Resume Section
------------------------------------------------------------------- */
#resume h1 { font: 16px/24px 'opensans-bold', sans-serif; }
#resume .main-col { padding-right: 5%; }
/* Testimonials Section
------------------------------------------------------------------- */
#testimonials .header-col h1:before {
font-size: 66px;
line-height: 66px;
}
#testimonials blockquote p {
font-size: 22px;
line-height: 46px;
}
/* Call to Action Section
------------------------------------------------------------------- */
#call-to-action .header-col h1:before {
font-size: 66px;
line-height: 66px;
}
/* Contact Section
------------------------------------------------------------------- */
#contact .section-head { margin-bottom: 30px; }
#contact .header-col h1:before {
font-size: 66px;
line-height: 66px;
}
#contact .section-head p.lead { font: 17px/33px opensans-light, sans-serif; }
}
/* mobile wide/smaller tablets
---------------------------------------------------------------------- */
@media only screen and (max-width: 767px) {
/* mobile navigation
-------------------------------------------------------------------- */
#nav-wrap {
font: 12px 'opensans-bold', sans-serif;
background: transparent !important;
letter-spacing: 1.5px;
width: auto;
position: fixed;
top: 0;
right: 0;
}
#nav-wrap > a {
width: 48px;
height: 48px;
text-align: left;
background-color: #CC5200;
position: relative;
border: none;
float: right;
font: 0/0 a;
text-shadow: none;
color: transparent;
position: relative;
top: 0px;
right: 30px;
}
#nav-wrap > a:before,
#nav-wrap > a:after {
position: absolute;
border: 2px solid #fff;
top: 35%;
left: 25%;
right: 25%;
content: '';
}
#nav-wrap > a:after { top: 60%; }
/* toggle buttons */
#nav-wrap:not( :target ) > a:first-of-type,
#nav-wrap:target > a:last-of-type {
display: block;
}
/* hide menu panel */
#nav-wrap ul#nav {
height: auto;
display: none;
clear: both;
width: auto;
float: right;
position: relative;
top: 12px;
right: 0;
}
/* display menu panels */
#nav-wrap:target > ul#nav {
display: block;
padding: 30px 20px 48px 20px;
background: #1f2024;
margin: 0 30px;
clear: both;
}
ul#nav li {
display: block;
height: auto;
margin: 0 auto;
padding: 0 4%;
text-align: left;
border-bottom: 1px solid #2D2E34;
border-bottom-style: dotted;
}
ul#nav li a {
display: block;
margin: 0;
padding: 0;
margin: 12px 0;
line-height: 16px; /* reset line-height from 48px */
border: none;
}
/* Header Styles
-------------------------------------------------------------------- */
header .banner {
padding-bottom: 12px;
padding-top: 6px;
}
header .banner-text h1 { font: 68px/1.1em 'opensans-bold', sans-serif; }
header .banner-text h3 {
font: 16px/1.9em 'librebaskerville-regular', serif;
width: 85%;
}
header .banner-text hr {
width: 80%;
margin: 18px auto;
}
/* header social links */
header .social {
margin: 18px 0 24px 0;
font-size: 24px;
line-height: 36px;
}
header .social li { margin: 0 10px; }
/* scrolldown link */
header .scrolldown { display: none; }
/* About Section
-------------------------------------------------------------------- */
#about .profile-pic { display: none; }
#about .download .button {
width: 100%;
text-align: center;
padding: 15px 20px;
}
#about .main-col { padding-right: 30px; }
/* Resume Section
--------------------------------------------------------------------- */
#resume .header-col {
padding-top: 0;
margin-bottom: 48px;
text-align: center;
}
#resume h1 { letter-spacing: 3px; }
#resume .main-col { padding-right: 30px; }
#resume h3, #resume .info { text-align: center; }
.bars { width: 100%; }
/* Call To Action Section
/* ----------------------------------------------------------------- */
#call-to-action { text-align: center; }
#call-to-action h1 {
font: 16px/24px 'opensans-bold', sans-serif;
text-align: center;
margin-bottom: 30px;
text-shadow: 0px 1px 3px rgba(0, 0, 0, 1);
}
#call-to-action h1 span { display: block; }
#call-to-action .header-col h1:before { content: none; }
#call-to-action p { font-size: 15px; }
/* Portfolio Section
/* ----------------------------------------------------------------- */
#portfolio-wrapper .columns { margin-bottom: 40px; }
.popup-modal { max-width: 85%; }
/* Testimonials Section
----------------------------------------------------------------------- */
#testimonials .text-container { text-align: center; }
#testimonials h1 {
font: 16px/24px 'opensans-bold', sans-serif;
text-align: center;
margin-bottom: 30px;
text-shadow: 0px 1px 3px rgba(0, 0, 0, 1);
}
#testimonials h1 span { display: block; }
#testimonials .header-col h1:before { content: none; }
#testimonials blockquote { padding-bottom: 24px; }
#testimonials blockquote p {
font-size: 20px;
line-height: 42px;
}
/* Control Nav */
.flex-control-nav {
text-align: center;
margin-left: -30px;
}
/* contact Section
----------------------------------------------------------------------- */
#contact { padding-bottom: 66px; }
#contact .section-head { margin-bottom: 12px; }
#contact .section-head h1 {
font: 16px/24px 'opensans-bold', sans-serif;
text-align: center;
margin-bottom: 30px;
text-shadow: 0px 1px 3px rgba(0, 0, 0, 1);
}
#contact h1 span { display: block; }
#contact .header-col { padding-top: 0; }
#contact .header-col h1:before { content: none; }
#contact .section-head p.lead { text-align: center;}
/* form */
#contact label {
float: none;
width: 100%;
}
#contact input,
#contact textarea,
#contact select {
margin-bottom: 6px;
width: 100%;
}
#contact button.submit { margin: 30px 0 24px 0; }
#message-warning, #message-success {
width: 100%;
margin-left: 0;
}
/* footer
------------------------------------------------------------------------ */
/* copyright */
footer .copyright li:before { content: none; }
footer .copyright li { margin-right: 12px; }
/* social links */
footer .social-links { font-size: 22px; }
footer .social-links li { margin-left: 18px; }
/* Go To Top Button */
#go-top { margin-left: -22px; }
#go-top a {
width: 54px;
height: 54px;
font-size: 18px;
line-height: 54px;
}
}
/* mobile narrow
-------------------------------------------------------------------------- */
@media only screen and (max-width: 480px) {
/* mobile navigation
-------------------------------------------------------------------- */
#nav-wrap ul#nav { width: auto; float: none; }
/* header styles
-------------------------------------------------------------------- */
header .banner { padding-top: 24px; }
header .banner-text h1 {
font: 40px/1.1em 'opensans-bold', sans-serif;
margin: 0 auto 24px auto;
}
header .banner-text h3 {
font: 14px/1.9em 'librebaskerville-regular', sans-serif;
width: 90%;
}
/* header social links */
header .social { font-size: 20px;}
header .social li { margin: 0 6px; }
/* footer
------------------------------------------------------------------------ */
/* social links */
footer .social-links { font-size: 20px; }
footer .social-links li { margin-left: 14px; }
}

387
css/styles.css Normal file
View File

@ -0,0 +1,387 @@
body, html {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
scroll-behavior: smooth;
background-color: black;
}
h1, h2, h3, h4, h5, p {
padding: 0;
margin: 0;
}
#nav-mini {
display: none;
}
#nav {
background-color: black;
position: fixed;
display: flex;
justify-content: center;
top: 0;
width: 100%;
z-index: 1;
}
#nav a {
color: white;
display: block;
float: center;
font-family: sans-serif;
font-size: calc(0.75em + 0.1vw);
font-weight: bold;
outline: 0;
padding: 1em;
text-decoration: none;
text-align: center;
text-shadow: 0 0 0.5em black;
text-transform: uppercase;
}
#nav a:hover {
color: gray;
}
#home {
background-image: url("../img/background.jpg");
height: 100%;
width: 100%;
background-position: bottom;
background-repeat: no-repeat;
background-size: cover;
}
#home .content {
margin: 0;
width: 90%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
}
#home .title {
color: white;
font-family: sans-serif;
font-size: calc(2.25em + 3vw);
font-weight: bold;
margin-bottom: 0.25em;
text-shadow: 0 0 0.1em black;
}
#home .subtitle {
color: lightgray;
font-family: serif;
font-size: calc(1em + 0.5vw);
font-weight: normal;
font-style: italic;
margin-bottom: 2.5em;
text-shadow: 0 0 0.1em black;
}
#home .social, #footer .social {
display: block;
}
#home .social a, #footer .social a {
outline: 0;
text-decoration: none;
margin: 0.75em;
}
#home .social a img, #footer .social a img {
display: inline-block;
vertical-align: middle;
height: calc(1em + 1vw);
width: calc(1em + 1vw);
}
#home .social a img {
filter: invert(100%) drop-shadow(0 0 0.1em black);
}
#home .social a img:hover {
filter: invert(75%) drop-shadow(0 0 0.1em black);
}
#about, #contact {
background: black;
}
#about .content, #contact .content, #experience .content, #education .content {
width: 80%;
max-width: 50em;
margin: 0 auto;
padding: 6em 1em;
}
#about .left img {
border-radius: 100%;
width: 7em;
}
#about .title, #contact .title {
color: white;
font-family: sans-serif;
font-size: 1.5em;
font-weight: bold;
margin-bottom: 0.5em;
}
#about .text, #contact .text {
color: lightgray;
font-family: sans-serif;
font-size: 1em;
text-align: justify;
}
#about p, #experience p, #education p, #contact p{
margin-bottom: 0.5em;
}
#experience, #education {
background: white;
}
#about .left, #experience .left, #education .left {
float: left;
width: 30%;
text-align: left;
}
#about .right, #experience .right, #education .right {
display: block;
width: 70%;
margin-left: 30%;
}
#experience .title, #education .title {
display: inline;
color: black;
text-transform: uppercase;
font-family: sans-serif;
font-size: 1em;
font-weight: bold;
padding-bottom: 0.2em;
border-bottom: 0.2em solid lightgray;
}
#experience .organization, #education .university {
color: black;
font-family: sans-serif;
font-size: 1.5em;
font-weight: bold;
margin-bottom: 0.5em;
}
#experience .position, #education .degree {
color: dimgray;
font-family: serif;
font-size: 1.1em;
font-style: italic;
font-weight: normal;
margin-bottom: 0.5em;
}
#experience .date, #education .date {
color: dimgray;
font-family: sans-serif;
font-size: 0.9em;
font-style: normal;
font-weight: normal;
display: inline-block;
}
#experience .description, #education .description {
color: dimgray;
font-family: sans-serif;
font-size: 1em;
font-weight: normal;
text-align: justify;
margin-bottom: 2em;
}
#education .content {
border-top: 0.1em solid lightgray;
}
#education .thesis {
color: dimgray;
font-family: sans-serif;
font-size: 0.9em;
font-weight: bold;
margin-bottom: 0.5em;
}
#education .description a {
color: dimgray;
font-family: sans-serif;
font-size: 0.9em;
font-weight: bold;
text-decoration: none;
outline: 0;
}
#contact .text {
display: inline-block;
}
#contact .button {
border-radius: 0.1em;
float: right;
outline: 0;
text-decoration: none;
padding: 0.75em;
color: black;
height: 1.75em;
padding: 0.5em 1em;
background-color: white;
min-width: 12em;
font-size: 1em;
text-align: center;
}
#contact .button:hover, #contact .button:active {
background-color: dimgray;
color: white;
}
#contact .button:hover > img, #contact .button:active > img {
filter: invert(100%);
}
#contact .button img {
filter: invert(0%);
height: 1.75em;
width: 1.75em;
display: inline-block;
vertical-align: middle;
}
#contact .button .label {
display: inline-block;
vertical-align: middle;
font-weight: bold;
padding-left: 1em;
}
#footer {
background-color: black;
text-align: center;
padding: 0 1em 1em;
}
#footer .social a img {
filter: invert(25%) drop-shadow(0 0 0.1em black);
}
#footer .social a img:hover {
filter: invert(100%) drop-shadow(0 0 0.1em black);
}
#footer .text {
margin-top: 2em;
font-size: 0.75em;
font-weight: normal;
text-align: center;
color: gray;
display: block;
}
@media (max-width: 600px) {
/* Navigation */
#nav {
display: none;
}
#nav-mini .menu {
display: none;
box-shadow: 0 0 0.5em black;
}
#nav-mini .menu a {
border-radius: 0.1em;
font-size: 0.75em;
display: block;
padding: 0.75em;
color: white;
background-color: black;
text-decoration: none;
text-transform: uppercase;
font-weight: bold;
outline: 0;
}
#nav-mini .menu a:hover {
color: gray;
}
#nav-mini {
background: black;
/* display: block; */
position: fixed;
top: 0;
left: 2em;
outline: 0;
text-decoration: none;
z-index: 1;
}
#nav-mini:active > img {
filter: invert(100%);
box-shadow: 0 0 0.5em white;
color: gray;
cursor: pointer;
}
#nav-mini:active .menu {
display: block;
}
#nav-mini img {
display: block;
background-color: white;
height: 1.75em;
width: 1.75em;
padding: 0.5em;
box-shadow: 0 0 0.5em black;
}
/* About */
#about .left {
display: none;
}
#about .right {
width: 100%;
margin-left: 0;
}
/* Resume */
#experience .left, #education .left {
float: none;
text-align: center;
width: 100%;
margin-bottom: 3em;
}
#experience .right, #education .right {
width: 100%;
margin-left: 0;
}
/* Contact */
#contact .text {
margin-bottom: 2em;
}
#contact .button {
display: block;
margin: 0 auto;
float: none;
}
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 935 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.8 KiB

View File

Before

Width:  |  Height:  |  Size: 72 KiB

After

Width:  |  Height:  |  Size: 72 KiB

1
img/download.svg Normal file
View File

@ -0,0 +1 @@
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="download" class="svg-inline--fa fa-download fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M216 0h80c13.3 0 24 10.7 24 24v168h87.7c17.8 0 26.7 21.5 14.1 34.1L269.7 378.3c-7.5 7.5-19.8 7.5-27.3 0L90.1 226.1c-12.6-12.6-3.7-34.1 14.1-34.1H192V24c0-13.3 10.7-24 24-24zm296 376v112c0 13.3-10.7 24-24 24H24c-13.3 0-24-10.7-24-24V376c0-13.3 10.7-24 24-24h146.7l49 49c20.1 20.1 52.5 20.1 72.6 0l49-49H488c13.3 0 24 10.7 24 24zm-124 88c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20zm64 0c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20z"></path></svg>

After

Width:  |  Height:  |  Size: 678 B

1
img/email.svg Normal file
View File

@ -0,0 +1 @@
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="at" class="svg-inline--fa fa-at fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M256 8C118.941 8 8 118.919 8 256c0 137.059 110.919 248 248 248 48.154 0 95.342-14.14 135.408-40.223 12.005-7.815 14.625-24.288 5.552-35.372l-10.177-12.433c-7.671-9.371-21.179-11.667-31.373-5.129C325.92 429.757 291.314 440 256 440c-101.458 0-184-82.542-184-184S154.542 72 256 72c100.139 0 184 57.619 184 160 0 38.786-21.093 79.742-58.17 83.693-17.349-.454-16.91-12.857-13.476-30.024l23.433-121.11C394.653 149.75 383.308 136 368.225 136h-44.981a13.518 13.518 0 0 0-13.432 11.993l-.01.092c-14.697-17.901-40.448-21.775-59.971-21.775-74.58 0-137.831 62.234-137.831 151.46 0 65.303 36.785 105.87 96 105.87 26.984 0 57.369-15.637 74.991-38.333 9.522 34.104 40.613 34.103 70.71 34.103C462.609 379.41 504 307.798 504 232 504 95.653 394.023 8 256 8zm-21.68 304.43c-22.249 0-36.07-15.623-36.07-40.771 0-44.993 30.779-72.729 58.63-72.729 22.292 0 35.601 15.241 35.601 40.77 0 45.061-33.875 72.73-58.161 72.73z"></path></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

1
img/github.svg Normal file
View File

@ -0,0 +1 @@
<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="github" class="svg-inline--fa fa-github fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512"><path fill="currentColor" d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"></path></svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

1
img/instagram.svg Normal file
View File

@ -0,0 +1 @@
<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="instagram" class="svg-inline--fa fa-instagram fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z"></path></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

1
img/linkedin.svg Normal file
View File

@ -0,0 +1 @@
<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="linkedin" class="svg-inline--fa fa-linkedin fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"></path></svg>

After

Width:  |  Height:  |  Size: 660 B

1
img/menu.svg Normal file
View File

@ -0,0 +1 @@
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="bars" class="svg-inline--fa fa-bars fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M16 132h416c8.837 0 16-7.163 16-16V76c0-8.837-7.163-16-16-16H16C7.163 60 0 67.163 0 76v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16z"></path></svg>

After

Width:  |  Height:  |  Size: 569 B

View File

Before

Width:  |  Height:  |  Size: 21 KiB

After

Width:  |  Height:  |  Size: 21 KiB

View File

Before

Width:  |  Height:  |  Size: 56 KiB

After

Width:  |  Height:  |  Size: 56 KiB

1
img/twitter.svg Normal file
View File

@ -0,0 +1 @@
<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="twitter" class="svg-inline--fa fa-twitter fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"></path></svg>

After

Width:  |  Height:  |  Size: 1.0 KiB

View File

@ -1,49 +0,0 @@
<?php
/**
* PHPMailer SPL autoloader.
* PHP Version 5
* @package PHPMailer
* @link https://github.com/PHPMailer/PHPMailer/ The PHPMailer GitHub project
* @author Marcus Bointon (Synchro/coolbru) <phpmailer@synchromedia.co.uk>
* @author Jim Jagielski (jimjag) <jimjag@gmail.com>
* @author Andy Prevost (codeworxtech) <codeworxtech@users.sourceforge.net>
* @author Brent R. Matzelle (original founder)
* @copyright 2012 - 2014 Marcus Bointon
* @copyright 2010 - 2012 Jim Jagielski
* @copyright 2004 - 2009 Andy Prevost
* @license http://www.gnu.org/copyleft/lesser.html GNU Lesser General Public License
* @note This program is distributed in the hope that it will be useful - WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE.
*/
/**
* PHPMailer SPL autoloader.
* @param string $classname The name of the class to load
*/
function PHPMailerAutoload($classname)
{
//Can't use __DIR__ as it's only in PHP 5.3+
$filename = dirname(__FILE__).DIRECTORY_SEPARATOR.'class.'.strtolower($classname).'.php';
if (is_readable($filename)) {
require $filename;
}
}
if (version_compare(PHP_VERSION, '5.1.2', '>=')) {
//SPL autoloading was introduced in PHP 5.1.2
if (version_compare(PHP_VERSION, '5.3.0', '>=')) {
spl_autoload_register('PHPMailerAutoload', true, true);
} else {
spl_autoload_register('PHPMailerAutoload');
}
} else {
/**
* Fall back to traditional autoload for old PHP versions
* @param string $classname The name of the class to load
*/
function __autoload($classname)
{
PHPMailerAutoload($classname);
}
}

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@ -1,80 +0,0 @@
<?php
require 'PHPMailerAutoload.php';
if($_POST) {
$captcha = '';
$error = array();
$name = trim(stripslashes($_POST['contactName']));
$email = trim(stripslashes($_POST['contactEmail']));
$subject = trim(stripslashes($_POST['contactSubject']));
$contact_message = trim(stripslashes($_POST['contactMessage']));
if(isset($_POST['contactCaptcha'])){
$captcha = $_POST['contactCaptcha'];
}
// Check Name
if (strlen($name) < 2) {
$error['name'] = "Please enter your name.";
}
// Check Email
if (!preg_match('/^[a-z0-9&\'\.\-_\+]+@[a-z0-9\-]+\.([a-z0-9\-]+\.)*+[a-z]{2}/is', $email)) {
$error['email'] = "Please enter a valid email address.";
}
// Check Message
if (strlen($contact_message) < 10) {
$error['message'] = "Please enter your message. It should have at least 10 characters.";
}
// Captcha
if (!$captcha){
$error['captcha'] = "Please check the CAPTCHA field.";
} else {
$captchaResponse = json_decode(file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=6Le1wRcTAAAAADbdnvPLKQ_hupTI4jzaGGXFQhQA&response=".$captcha."&remoteip=".$_SERVER['REMOTE_ADDR']), true);
if($captchaResponse['success'] == false) {
$error['captcha'] = "You are a robot.";
}
}
$mail = new PHPMailer;
//$mail->SMTPDebug = 3; // Enable verbose debug output
$mail->isSMTP(); // Set mailer to use SMTP
$mail->Host = 'smtp.zoho.com;'; // Specify main and backup SMTP servers
$mail->SMTPAuth = true; // Enable SMTP authentication
$mail->Username = 'contact@delkappa.com'; // SMTP username
$mail->Password = '2MR4J&R674b1'; // SMTP password
$mail->SMTPSecure = 'ssl'; // Enable TLS encryption, `ssl` also accepted
$mail->Port = 465; // TCP port to connect to
$mail->setFrom('contact@delkappa.com', $name);
$mail->addAddress('manos@delkappa.com', 'Manos Katsomallos'); // Add a recipient
$mail->addReplyTo($email, $name);
$mail->Subject = $subject;
$mail->Body = $contact_message;
if (!$error) {
if (!$mail->send()) {
echo "Something went wrong. Please try again.";
} else {
echo "OK";
}
} # end if - no validation error
else {
$response = (isset($error['name'])) ? $error['name'] . "<br /> \n" : null;
$response .= (isset($error['email'])) ? $error['email'] . "<br /> \n" : null;
$response .= (isset($error['message'])) ? $error['message'] . "<br />" : null;
$response .= (isset($error['captcha'])) ? $error['captcha'] . "<br />" : null;
echo $response;
} # end if - there was a validation error
}
?>

View File

@ -1,380 +1,227 @@
<!DOCTYPE html>
<!--[if lt IE 8 ]><html class="no-js ie ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]><html class="no-js ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 8)|!(IE)]><!-->
<html class="no-js" lang="en"> <!--<![endif]-->
<head>
<!--
Theme: Ceevee
Forked from Styleshout
http://www.styleshout.com/free-templates/ceevee
================================================== -->
<!--- Basic Page Needs
================================================== -->
<meta charset="utf-8">
<title>Manos Katsomallos</title>
<meta name="title" content="Manos Katsomallos" />
<meta name="description" content="Computer scientist, software engineer, son of his father and not his brother.">
<meta name="keywords" content="manos katsomallos, emmanouil katsomallos, katsomallos">
<meta property="og:url" content="https://delkappa.com" />
<meta property="og:title" content="Manos Katsomallos" />
<meta property="og:description" content="Computer scientist, software engineer, son of his father and not his brother." />
<meta property="og:image" content="https://delkappa.com/images/profilepic-og.jpg" />
<!-- Mobile Specific Metas
================================================== -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- CSS
================================================== -->
<link rel="stylesheet" href="css/default.css">
<link rel="stylesheet" href="css/layout.css">
<link rel="stylesheet" href="css/media-queries.css">
<link rel="stylesheet" href="css/magnific-popup.css">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<!-- Scripts
================================================== -->
<script src="js/modernizr.js"></script>
<!-- Favicons
================================================== -->
<link rel="shortcut icon" href="images/favicon.ico" >
</head>
<body>
<!-- Header
Photo: Play Among The Stars
By David L. Labrie — National Geographic Your Shot
http://yourshot.nationalgeographic.com/photos/6755620
================================================== -->
<header id="home">
<nav id="nav-wrap">
<a class="mobile-btn" href="#nav-wrap" title="Show navigation">Show navigation</a>
<a class="mobile-btn" href="#" title="Hide navigation">Hide navigation</a>
<ul id="nav" class="nav">
<li class="current"><a class="smoothscroll" href="#home">Home</a></li>
<li><a class="smoothscroll" href="#about">About</a></li>
<li><a class="smoothscroll" href="#resume">Resume</a></li>
</ul> <!-- end #nav -->
</nav> <!-- end #nav-wrap -->
<div class="row banner">
<div class="banner-text">
<h1 class="responsive-headline">manos katsomallos</h1>
<h3>Computer scientist, software engineer, <br>son of his father and not his brother.</h3>
<hr/>
<ul class="social">
<li><a href="mailto:manos@delkappa.com" title="email" target="_blank"><i class="fa fa-at"></i></a></li>
<li><a href="//github.com/delkappa" title="GitHub" target="_blank"><i class="fa fa-github"></i></a></li>
<li><a href="//instagram.com/delkappa" title="Instagram" target="_blank"><i class="fa fa-instagram"></i></a></li>
<li><a href="//linkedin.com/in/delkappa" title="LinkedIn" target="_blank"><i class="fa fa-linkedin"></i></a></li>
<li><a href="//twitter.com/delkappa" title="Twitter" target="_blank"><i class="fa fa-twitter"></i></a></li>
</ul>
</div>
</div>
<p class="scrolldown">
<a class="smoothscroll" href="#about"><i class="icon-down-circle"></i></a>
</p>
</header> <!-- Header End -->
<!-- About Section
================================================== -->
<section id="about">
<div class="row">
<div class="three columns">
<img class="profile-pic" src="images/profilepic.jpg" alt="" />
</div>
<div class="nine columns main-col" >
<h2>About</h2>
<p style="text-align: justify">
Manos is a Research &amp; Teaching Assistant at the University of Paris-Seine in France, doing a PhD in Computer Science on "Quality &amp; Privacy in User-generated Big Data: Algorithms &amp; Techniques".
</p>
<p style="text-align: justify">
He holds an MSc in Science &amp; Technology of Electrical &amp; Computer Engineering and an Engineer's Degree (5-year programme) in Computer &amp; Communication Engineering from the University of Thessaly in Greece.
</p>
<p style="text-align: justify">
His broad research interests focus in (but are not limited to) the area of Ubiquitous Computing, Internet of Things and especially Crowdsensing and Data Management.
</p>
<div class="row">
<div class="columns contact-details">
<h2>Contact Details</h2>
<p class="address">
<span>Manos Katsomallos</span>
<br>
<span>2 Avenue Adolphe Chauvin</span>
<br>
<span>Bâtiment A</span>
<br>
<span>Bureau 564</span>
<br>
<span>95300 Pontoise</span>
<br>
<span>France</span>
<br>
<span>+33 1 34 25 66 55</span>
<br>
<span>manos@delkappa.com</span>
</p>
</div>
<div class="columns download">
<p>
<a href="https://cloud.delkappa.com/s/AXdRFidn8xKwPLC/download" class="button"><i class="fa fa-download"></i>Download Resume</a>
</p>
</div>
</div> <!-- end row -->
</div> <!-- end .main-col -->
</div>
</section> <!-- About Section End-->
<!-- Resume Section
================================================== -->
<section id="resume">
<!-- Education
=============================================== -->
<div class="row education">
<div class="three columns header-col">
<h1><span>Education</span></h1>
</div>
<div class="nine columns main-col">
<div class="row item">
<div class="twelve columns">
<h3>University of Cergy-Pontoise</h3>
<p class="info">
Doctor of Philosophy (PhD), Computer Science<span>&bull;</span><em class="date">Ongoing</em>
</p>
<h6>Quality &amp; Privacy in User-generated Big Data: Algorithms &amp; Techniques</h6>
<p style="text-align: justify;">
Exploring integration issues for spatiotemporal at crowdsourcing platforms and understanding the impact to the privacy of personal information. Studying matters relating to the effect of size of data to the quality and the impact of improved quality on users' privacy.
</p>
</div>
</div> <!-- item end -->
<div class="row item">
<div class="twelve columns">
<h3>University of Thessaly</h3>
<p class="info">
Master of Science (MSc), Science &amp; Technology of Electrical &amp; Computer Engineering<span>&bull;</span><em class="date">2015</em>
</p>
<h6>Mechanisms for the Dynamic Installation &amp; Control of Data Collection Tasks on Smartphones</h6>
<p style="text-align: justify;">
Extended <i>EasyHarvest</i> to support the flexible development, installation and activation of dynamic standalone and collaborative privacy mechanisms using Wi-Fi Direct on mobile personal devices, as independently developed software components that can be used in conjunction with sensing applications that run on the device. <a href="//cloud.delkappa.com/s/AYeibPNXcFWReHn" target="_blank">[Read More]</a>
</p>
</div>
</div> <!-- item end -->
<div class="row item">
<div class="twelve columns">
<h3>University of Thessaly</h3>
<p class="info">
Engineer's Degree (5-year programme), Computer &amp; Communication Engineering<span>&bull;</span><em class="date">2014</em>
</p>
<h6>Deployment &amp; Controlled Execution of Sensing Tasks on Smartphones</h6>
<p style="text-align: justify;">
Built <i>EasyHarvest</i>, a crowdsourcing framework that simplifies the deployment and controlled execution of large-scale sensing applications on Android smartphones via a single web interface. Introduced a RESTful API in Java on top of Tomcat for client-server communication and data collection organized in SQL and XML structures. <a href="//cloud.delkappa.com/s/CZPZWwHdXASn4SP" target="_blank">[Read More]</a>
</p>
</div>
</div> <!-- item end -->
</div> <!-- main-col end -->
</div> <!-- End Education -->
<!-- Work
=============================================== -->
<div class="row work">
<div class="three columns header-col">
<h1><span>Experience</span></h1>
</div>
<div class="nine columns main-col">
<div class="row item">
<div class="twelve columns">
<h3>University of Cergy-Pontoise</h3>
<p class="info">
Research &amp; Teaching Assistant<span>&bull;</span>
<em class="date">Oct 2016 - Present</em>
</p>
<p style="text-align: justify;">
Assisted the preparation and conducting of 2 undergraduate ('Developing Applications for Mobile Devices' and 'Web Services &amp; Service Oriented Architectures') and 3 graduate ('Advanced Databases', 'Data Integration &amp; Warehouses', and 'Embedded Java Workshop') courses.<br/>
Supervised 7 undergraduate students for 3 internships and 1 project.
</p>
<p style="text-align: justify;">
</p>
</div>
</div> <!-- item end -->
<div class="row item">
<div class="twelve columns">
<h3>LET'S GO travel net</h3>
<p class="info">
IT Consultant<span>&bull;</span>
<em class="date">Oct 2015 - Sep 2016</em>
</p>
<p style="text-align: justify;">
Designed <i>Live Like Local</i>, a collaborative cross-platform framework that facilitates the communication of citizens with local authorities. Let visitors discover how the locals live, and allow businesses to offer unique experiences and maximize their profits.
</p>
</div>
</div> <!-- item end -->
<div class="row item">
<div class="twelve columns">
<h3>CERN</h3>
<p class="info">
Intern<span>&bull;</span>
<em class="date">Jul - Sep 2015</em>
</p>
<p style="text-align: justify;">
Asserted with Google Test and further developed <i>CernVM WebAPI</i>, an infrastructure in C++ that enables launching computational jobs on volunteer, cluster and cloud nodes. Supported with this technology <i>Virtual Atom Smasher</i>, a CERN interactive educational game in JavaScript, and upgraded its UI.
</p>
</div>
</div> <!-- item end -->
<div class="row item">
<div class="twelve columns">
<h3>University of Thessaly</h3>
<p class="info">
Graduate Assistant<span>&bull;</span>
<em class="date">Sep 2014 - Jun 2015</em>
</p>
<p style="text-align: justify;">
Assisted the preparation and conducting of 2 undergraduate courses ('Concurrent Programming' and 'System Programming').
</p>
</div>
</div> <!-- item end -->
</div> <!-- main-col end -->
</div> <!-- End Work -->
<!-- Skills
=============================================== -->
<div class="row skill">
<div class="three columns header-col">
<h1><span>Skills</span></h1>
</div>
<div class="nine columns main-col">
<div class="bars">
<ul class="skills">
<li><span class="bar-expand data"></span><em>Data Management</em></li>
<li><span class="bar-expand iot"></span><em>Internet of Things</em></li>
<li><span class="bar-expand software"></span><em>Software Engineering</em></li>
<li><span class="bar-expand ubicom"></span><em>Ubiquitous Computing</em></li>
</ul>
</div><!-- end skill-bars -->
</div> <!-- main-col end -->
</div> <!-- End skills -->
</section> <!-- Resume Section End-->
<!-- footer
================================================== -->
<footer>
<div class="row">
<div class="twelve columns">
<ul class="social-links">
<li><a href="mailto:manos@delkappa.com" title="email" target="_blank"><i class="fa fa-at"></i></a></li>
<li><a href="//github.com/delkappa" title="GitHub" target="_blank"><i class="fa fa-github"></i></a></li>
<li><a href="//instagram.com/delkappa" title="Instagram" target="_blank"><i class="fa fa-instagram"></i></a></li>
<li><a href="//linkedin.com/in/delkappa" title="LinkedIn" target="_blank"><i class="fa fa-linkedin"></i></a></li>
<li><a href="//twitter.com/delkappa" title="Twitter" target="_blank"><i class="fa fa-twitter"></i></a></li>
</ul>
<ul class="copyright">
<li>&copy; <script type="text/javascript">document.write(new Date().getFullYear());</script> Manos Katsomallos</li>
</ul>
</div>
<div id="go-top"><a class="smoothscroll" title="Back to Top" href="#home"><i class="icon-up-open"></i></a></div>
</div>
</footer> <!-- Footer End-->
<!-- Java Script
================================================== -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/jquery-1.10.2.min.js"><\/script>')</script>
<script type="text/javascript" src="js/jquery-migrate-1.2.1.min.js"></script>
<script src="js/jquery.flexslider.js"></script>
<script src="js/waypoints.js"></script>
<script src="js/jquery.fittext.js"></script>
<script src="js/magnific-popup.js"></script>
<script src="js/init.js"></script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta name="title" content="Manos Katsomallos" />
<meta name="description" content="Computer scientist, problem solver, son of his father and not his brother.">
<meta name="keywords" content="manos katsomallos, emmanouil katsomallos, katsomallos">
<meta property="og:url" content="https://delkappa.com" />
<meta property="og:title" content="Manos Katsomallos" />
<meta property="og:description" content="Computer scientist, problem solver, son of his father and not his brother." />
<meta property="og:image" content="https://delkappa.com/img/profilepic-og.jpg" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" href="img/favicon.ico">
<link rel="stylesheet" href="css/styles.css">
<title>Manos Katsomallos</title>
</head>
<body>
<nav id="nav">
<a href="#home">Home</a>
<a href="#about">About</a>
<a href="#experience">Experience</a>
<a href="#education">Education</a>
<a href="#contact">Contact</a>
</nav>
<nav id="nav-mini">
<img src="img/menu.svg"/>
<div class="menu">
<a href="#home">Home</a>
<a href="#about">About</a>
<a href="#experience">Experience</a>
<a href="#education">Education</a>
<a href="#contact">Contact</a>
</div>
</nav>
<div id="home">
<div class="content">
<div class="title">Manos Katsomallos</div>
<div class="subtitle">Computer scientist, problem solver,<br>son of his father and not his brother.</div>
<div class="social">
<a href="mailto:manos@delkappa.com" target="_blank"><img src="img/email.svg"/></a>
<a href="https://github.com/delkappa" target="_blank">
<img src="img/github.svg"/>
</a>
<a href="https://instagram.com/delkappa" target="_blank">
<img src="img/instagram.svg"/>
</a>
<a href="https://linkedin.com/in/delkappa" target="_blank">
<img src="img/linkedin.svg"/>
</a>
<a href="https://twitter.com/delkappa" target="_blank">
<img src="img/twitter.svg"/>
</a>
</div>
</div>
</div>
<div id="about">
<div class="content">
<div class="left">
<img src="img/profilepic.jpg"></img>
</div>
<div class="right">
<div class="title">About</div>
<div class="text">
<p>Manos is a Research &amp; Teaching Assistant at the University of Paris-Seine in France, doing a PhD in Computer Science on "Quality &amp; Privacy in User-generated Big Data: Algorithms &amp; Techniques".</p>
<p>He holds an MSc in Science &amp; Technology of Electrical &amp; Computer Engineering and an Engineer's Degree (5-year programme) in Computer &amp; Communication Engineering from the University of Thessaly in Greece.</p>
<p>His broad research interests focus in (but are not limited to) the area of Ubiquitous Computing, Internet of Things and especially Crowdsensing and Data Management.</p>
</div>
</div>
</div>
</div>
<div id="experience">
<div class="content">
<div class="left">
<h1 class="title">Experience</h1>
</div>
<div class="right">
<h2 class="organization">University of Cergy-Pontoise</h2>
<h3 class="position">
Research &amp; Teaching Assistant
<div class="date">(Oct 2016 - Present)</div>
</h3>
<div class="description">
<p>
Assisted the preparation and conducting of 2 undergraduate (<i>Developing Applications for Mobile Devices</i> and <i>Web Services &amp; Service Oriented Architectures</i>) and 3 graduate (<i>Advanced Databases</i>, <i>Data Integration &amp; Warehouses</i>, and <i>Embedded Java Workshop</i>) courses.
</p>
<p>
Supervised 7 undergraduate students for 3 internships and 1 project.
</p>
</div>
<h2 class="organization">LET'S GO travel net</h2>
<h3 class="position">
IT Consultant
<div class="date">(Oct 2015 - Sep 2016)</div>
</h3>
<div class="description">
<p>
Designed <i>Live Like Local</i>, a collaborative cross-platform framework that facilitates the communication of citizens with local authorities.
Let visitors discover how the locals live, and allow businesses to offer unique experiences and maximize their profits.
</p>
</div>
<h2 class="organization">CERN</h2>
<h3 class="position">
Intern
<div class="date">(Jul - Sep 2015)</div>
</h3>
<div class="description">
<p>
Asserted with Google Test and further developed <i>CernVM WebAPI</i>, an infrastructure in C++ that enables launching computational jobs on volunteer, cluster and cloud nodes.
Supported with this technology <i>Virtual Atom Smasher</i>, a CERN interactive educational game in JavaScript, and upgraded its UI.
</p>
</div>
<h2 class="organization">University of Thessaly</h2>
<h3 class="position">
Graduate Assistant
<div class="date">(Sep 2014 - Jun 2015)</div>
</h3>
<div class="description" style="margin-bottom: 0;">
<p>
Assisted the preparation and conducting of 2 undergraduate courses (<i>Concurrent Programming</i> and <i>System Programming</i>).
</p>
</div>
</div>
</div>
</div>
<div id="education">
<div class="content">
<div class="left">
<h1 class="title">Education</h1>
</div>
<div class="right">
<h2 class="university">University of Cergy-Pontoise</h2>
<h3 class="degree">
Doctor of Philosophy (PhD), Computer Science
<div class="date">(Ongoing)</div>
</h3>
<h4 class="thesis">Quality &amp; Privacy in User-generated Big Data: Algorithms &amp; Techniques</h4>
<div class="description">
<p>
Exploring integration issues for spatiotemporal at crowdsourcing platforms and understanding the impact to the privacy of personal information.
Studying matters relating to the effect of size of data to the quality and the impact of improved quality on users' privacy.
</p>
</div>
<h2 class="university">University of Thessaly</h2>
<h3 class="degree">
Master of Science (MSc), Science &amp; Technology of Electrical &amp; Computer Engineering
<div class="date">(2015)</div>
</h3>
<h4 class="thesis">Mechanisms for the Dynamic Installation &amp; Control of Data Collection Tasks on Smartphones</h4>
<div class="description">
<p>
Extended <i>EasyHarvest</i> to support the flexible development, installation and activation of dynamic standalone and collaborative privacy mechanisms using Wi-Fi Direct on mobile personal devices, as independently developed software components that can be used in conjunction with sensing applications that run on the device.
<a href="//cloud.delkappa.com/s/AYeibPNXcFWReHn" target="_blank">&#91;Read more&#93;</a>
</p>
</div>
<h2 class="university">University of Thessaly</h2>
<h3 class="degree">
Engineer's Degree (5-year programme), Computer &amp; Communication Engineering
<div class="date">(2014)</div>
</h3>
<h4 class="thesis">Deployment &amp; Controlled Execution of Sensing Tasks on Smartphones</h4>
<div class="description">
<p>
Built <i>EasyHarvest</i>, a crowdsourcing framework that simplifies the deployment and controlled execution of large-scale sensing applications on Android smartphones via a single web interface. Introduced a RESTful API in Java on top of Tomcat for client-server communication and data collection organized in SQL and XML structures.
<a href="//cloud.delkappa.com/s/CZPZWwHdXASn4SP" target="_blank">&#91;Read more&#93;</a>
</p>
</div>
</div>
</div>
</div>
<div id="contact">
<div class="content">
<h1 class="title">Contact</h1>
<div class="text">
<p>
Manos Katsomallos<br>
2 Avenue Adolphe Chauvin<br>
Bâtiment A<br>
Bureau 564<br>
95300 Pontoise<br>
France<br>
+33 1 34 25 66 55<br>
manos&#64;delkappa.com
</p>
</div>
<a class="button" href="https://cloud.delkappa.com/s/AXdRFidn8xKwPLC/download" target="_blank">
<img src="img/download.svg"/><div class="label">Download resume</div>
</a>
</div>
</div>
<footer id="footer">
<div class="social">
<a href="mailto:manos@delkappa.com" target="_blank"><img src="img/email.svg"/></a>
<a href="https://github.com/delkappa" target="_blank">
<img src="img/github.svg"/>
</a>
<a href="https://instagram.com/delkappa" target="_blank">
<img src="img/instagram.svg"/>
</a>
<a href="https://linkedin.com/in/delkappa" target="_blank">
<img src="img/linkedin.svg"/>
</a>
<a href="https://twitter.com/delkappa" target="_blank">
<img src="img/twitter.svg"/>
</a>
</div>
<div class="text">&copy; 2020 Manos Katsomallos</div>
</footer>
</body>
</html>

View File

@ -1,184 +0,0 @@
/*-----------------------------------------------------------------------------------
/*
/* Init JS
/*
-----------------------------------------------------------------------------------*/
jQuery(document).ready(function($) {
/*----------------------------------------------------*/
/* FitText Settings
------------------------------------------------------ */
setTimeout(function() {
$('h1.responsive-headline').fitText(1, { minFontSize: '40px', maxFontSize: '90px' });
}, 100);
/*----------------------------------------------------*/
/* Smooth Scrolling
------------------------------------------------------ */
$('.smoothscroll').on('click',function (e) {
e.preventDefault();
var target = this.hash,
$target = $(target);
$('html, body').stop().animate({
'scrollTop': $target.offset().top
}, 800, 'swing', function () {
window.location.hash = target;
});
});
/*----------------------------------------------------*/
/* Highlight the current section in the navigation bar
------------------------------------------------------*/
var sections = $("section");
var navigation_links = $("#nav-wrap a");
sections.waypoint({
handler: function(event, direction) {
var active_section;
active_section = $(this);
if (direction === "up") active_section = active_section.prev();
var active_link = $('#nav-wrap a[href="#' + active_section.attr("id") + '"]');
navigation_links.parent().removeClass("current");
active_link.parent().addClass("current");
},
offset: '35%'
});
/*----------------------------------------------------*/
/* Make sure that #header-background-image height is
/* equal to the browser height.
------------------------------------------------------ */
$('header').css({ 'height': $(window).height() });
$(window).on('resize', function() {
$('header').css({ 'height': $(window).height() });
$('body').css({ 'width': $(window).width() })
});
/*----------------------------------------------------*/
/* Fade In/Out Primary Navigation
------------------------------------------------------*/
$(window).on('scroll', function() {
var h = $('header').height();
var y = $(window).scrollTop();
var nav = $('#nav-wrap');
if ( (y > h*.20) && (y < h) && ($(window).outerWidth() > 768 ) ) {
nav.fadeOut('fast');
}
else {
if (y < h*.20) {
nav.removeClass('opaque').fadeIn('fast');
}
else {
nav.addClass('opaque').fadeIn('fast');
}
}
});
/*----------------------------------------------------*/
/* Modal Popup
------------------------------------------------------*/
$('.item-wrap a').magnificPopup({
type:'inline',
fixedContentPos: false,
removalDelay: 200,
showCloseBtn: false,
mainClass: 'mfp-fade'
});
$(document).on('click', '.popup-modal-dismiss', function (e) {
e.preventDefault();
$.magnificPopup.close();
});
/*----------------------------------------------------*/
/* Flexslider
/*----------------------------------------------------*/
$('.flexslider').flexslider({
namespace: "flex-",
controlsContainer: ".flex-container",
animation: 'slide',
controlNav: true,
directionNav: false,
smoothHeight: true,
slideshowSpeed: 7000,
animationSpeed: 600,
randomize: false,
});
/*----------------------------------------------------*/
/* contact form
------------------------------------------------------*/
$('form#contactForm button.submit').click(function() {
$('form#contactForm button.submit').prop('disabled', true);
$('#image-loader').fadeIn();
var contactName = $('#contactForm #contactName').val();
var contactEmail = $('#contactForm #contactEmail').val();
var contactSubject = $('#contactForm #contactSubject').val();
var contactMessage = $('#contactForm #contactMessage').val();
var contactCaptcha = $('#g-recaptcha-response').val();
var data = 'contactName=' + contactName + '&contactEmail=' + contactEmail +
'&contactSubject=' + contactSubject + '&contactMessage=' + contactMessage +
'&contactCaptcha=' + contactCaptcha;
$.ajax({
type: "POST",
url: "inc/sendEmail.php",
data: data,
success: function(msg) {
// Message was sent
if (msg == 'OK') {
$('#image-loader').fadeOut();
$('#message-warning').hide();
$('#contactForm').fadeOut();
$('#message-success').fadeIn();
}
// There was an error
else {
$('#image-loader').fadeOut();
$('#message-warning').html(msg);
$('#message-warning').fadeIn();
}
grecaptcha.reset();
$('form#contactForm button.submit').prop('disabled', false);
}
});
return false;
});
});

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,43 +0,0 @@
/*global jQuery */
/*!
* FitText.js 1.1
*
* Copyright 2011, Dave Rupert http://daverupert.com
* Released under the WTFPL license
* http://sam.zoy.org/wtfpl/
*
* Date: Thu May 05 14:23:00 2011 -0600
*/
(function( $ ){
$.fn.fitText = function( kompressor, options ) {
// Setup options
var compressor = kompressor || 1,
settings = $.extend({
'minFontSize' : Number.NEGATIVE_INFINITY,
'maxFontSize' : Number.POSITIVE_INFINITY
}, options);
return this.each(function(){
// Store the object
var $this = $(this);
// Resizer() resizes items based on the object width divided by the compressor * 10
var resizer = function () {
$this.css('font-size', Math.max(Math.min($this.width() / (compressor*10), parseFloat(settings.maxFontSize)), parseFloat(settings.minFontSize)));
};
// Call once to set.
resizer();
// Call on resize. Opera debounces their resize by default.
$(window).on('resize.fittext orientationchange.fittext', resizer);
});
};
})( jQuery );

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,8 +0,0 @@
/*
jQuery Waypoints - v1.1.7
Copyright (c) 2011-2012 Caleb Troughton
Dual licensed under the MIT license and GPL license.
https://github.com/imakewebthings/jquery-waypoints/blob/master/MIT-license.txt
https://github.com/imakewebthings/jquery-waypoints/blob/master/GPL-license.txt
*/
(function($,k,m,i,d){var e=$(i),g="waypoint.reached",b=function(o,n){o.element.trigger(g,n);if(o.options.triggerOnce){o.element[k]("destroy")}},h=function(p,o){if(!o){return -1}var n=o.waypoints.length-1;while(n>=0&&o.waypoints[n].element[0]!==p[0]){n-=1}return n},f=[],l=function(n){$.extend(this,{element:$(n),oldScroll:0,waypoints:[],didScroll:false,didResize:false,doScroll:$.proxy(function(){var q=this.element.scrollTop(),p=q>this.oldScroll,s=this,r=$.grep(this.waypoints,function(u,t){return p?(u.offset>s.oldScroll&&u.offset<=q):(u.offset<=s.oldScroll&&u.offset>q)}),o=r.length;if(!this.oldScroll||!q){$[m]("refresh")}this.oldScroll=q;if(!o){return}if(!p){r.reverse()}$.each(r,function(u,t){if(t.options.continuous||u===o-1){b(t,[p?"down":"up"])}})},this)});$(n).bind("scroll.waypoints",$.proxy(function(){if(!this.didScroll){this.didScroll=true;i.setTimeout($.proxy(function(){this.doScroll();this.didScroll=false},this),$[m].settings.scrollThrottle)}},this)).bind("resize.waypoints",$.proxy(function(){if(!this.didResize){this.didResize=true;i.setTimeout($.proxy(function(){$[m]("refresh");this.didResize=false},this),$[m].settings.resizeThrottle)}},this));e.load($.proxy(function(){this.doScroll()},this))},j=function(n){var o=null;$.each(f,function(p,q){if(q.element[0]===n){o=q;return false}});return o},c={init:function(o,n){this.each(function(){var u=$.fn[k].defaults.context,q,t=$(this);if(n&&n.context){u=n.context}if(!$.isWindow(u)){u=t.closest(u)[0]}q=j(u);if(!q){q=new l(u);f.push(q)}var p=h(t,q),s=p<0?$.fn[k].defaults:q.waypoints[p].options,r=$.extend({},s,n);r.offset=r.offset==="bottom-in-view"?function(){var v=$.isWindow(u)?$[m]("viewportHeight"):$(u).height();return v-$(this).outerHeight()}:r.offset;if(p<0){q.waypoints.push({element:t,offset:null,options:r})}else{q.waypoints[p].options=r}if(o){t.bind(g,o)}if(n&&n.handler){t.bind(g,n.handler)}});$[m]("refresh");return this},remove:function(){return this.each(function(o,p){var n=$(p);$.each(f,function(r,s){var q=h(n,s);if(q>=0){s.waypoints.splice(q,1);if(!s.waypoints.length){s.element.unbind("scroll.waypoints resize.waypoints");f.splice(r,1)}}})})},destroy:function(){return this.unbind(g)[k]("remove")}},a={refresh:function(){$.each(f,function(r,s){var q=$.isWindow(s.element[0]),n=q?0:s.element.offset().top,p=q?$[m]("viewportHeight"):s.element.height(),o=q?0:s.element.scrollTop();$.each(s.waypoints,function(u,x){if(!x){return}var t=x.options.offset,w=x.offset;if(typeof x.options.offset==="function"){t=x.options.offset.apply(x.element)}else{if(typeof x.options.offset==="string"){var v=parseFloat(x.options.offset);t=x.options.offset.indexOf("%")?Math.ceil(p*(v/100)):v}}x.offset=x.element.offset().top-n+o-t;if(x.options.onlyOnScroll){return}if(w!==null&&s.oldScroll>w&&s.oldScroll<=x.offset){b(x,["up"])}else{if(w!==null&&s.oldScroll<w&&s.oldScroll>=x.offset){b(x,["down"])}else{if(!w&&s.element.scrollTop()>x.offset){b(x,["down"])}}}});s.waypoints.sort(function(u,t){return u.offset-t.offset})})},viewportHeight:function(){return(i.innerHeight?i.innerHeight:e.height())},aggregate:function(){var n=$();$.each(f,function(o,p){$.each(p.waypoints,function(q,r){n=n.add(r.element)})});return n}};$.fn[k]=function(n){if(c[n]){return c[n].apply(this,Array.prototype.slice.call(arguments,1))}else{if(typeof n==="function"||!n){return c.init.apply(this,arguments)}else{if(typeof n==="object"){return c.init.apply(this,[null,n])}else{$.error("Method "+n+" does not exist on jQuery "+k)}}}};$.fn[k].defaults={continuous:true,offset:0,triggerOnce:false,context:i};$[m]=function(n){if(a[n]){return a[n].apply(this)}else{return a.aggregate()}};$[m].settings={resizeThrottle:200,scrollThrottle:100};e.load(function(){$[m]("refresh")})})(jQuery,"waypoint","waypoints",window);