mirror of https://github.com/iotcat/CV.git
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
555 lines
8.2 KiB
555 lines
8.2 KiB
/* |
|
Author: W3layout |
|
Author URL: http://w3layouts.com |
|
License: Creative Commons Attribution 3.0 Unported |
|
License URL: http://creativecommons.org/licenses/by/3.0/ |
|
*/ |
|
h4, h5, h6, |
|
h1, h2, h3 {margin: 0;} |
|
ul, ol {margin: 0; padding:0; margin-left: 8px} |
|
p {margin: 0;} |
|
html, body{ |
|
font-family: 'Ubuntu', sans-serif; |
|
font-size: 100%; |
|
background: #ffffff; |
|
} |
|
body a{ |
|
transition:0.5s all; |
|
-webkit-transition:0.5s all; |
|
-moz-transition:0.5s all; |
|
-o-transition:0.5s all; |
|
-ms-transition:0.5s all; |
|
} |
|
body { |
|
padding-top:0px; |
|
} |
|
a:focus { |
|
outline: thin dotted; |
|
outline: 0px auto -webkit-focus-ring-color; |
|
outline-offset: 0px; |
|
text-decoration:none; |
|
} |
|
/*-- header_top --*/ |
|
.sidebar{ |
|
background:#6ecadc; |
|
top: 0px; |
|
padding:2em 30px; |
|
} |
|
.sidebar h1{ |
|
font-size:2.5em; |
|
font-weight:700; |
|
margin-bottom:1em; |
|
COLOR:#fff; |
|
font-family: 'Varela Round', sans-serif; |
|
|
|
} |
|
.sidebar img{ |
|
border:1px solid #fff; |
|
padding:1em; |
|
width:100%; |
|
} |
|
.details{ |
|
margin-top:2em; |
|
} |
|
.details h3{ |
|
font-weight:600; |
|
font-size:1em; |
|
color:#fff; |
|
} |
|
|
|
.details p{ |
|
color:#101010; |
|
font-size:0.9em; |
|
margin:5px 0 2em 0; |
|
} |
|
.details p a{ |
|
color:#101010; |
|
font-size:0.9em; |
|
} |
|
address h3{ |
|
margin-bottom:5px; |
|
} |
|
address span{ |
|
display:block; |
|
color:#101010; |
|
font-size:0.9em; |
|
line-height:1.5em; |
|
} |
|
/*----*/ |
|
.main{ |
|
padding:2em 0; |
|
} |
|
.content{ |
|
margin-right:3em; |
|
} |
|
.glyphicon { |
|
top:1px; |
|
} |
|
.glyphicon-file:before,.glyphicon-print:before,.glyphicon-envelope:before,.glyphicon-picture:before{ |
|
margin-right: 9px; |
|
font-size: 14px; |
|
color: #6ecadc; |
|
} |
|
.details_header{ |
|
padding: 0em 1em 0 2em; |
|
} |
|
.details_header ul li{ |
|
display:inline-block; |
|
} |
|
.details_header ul li a{ |
|
padding:0 1em; |
|
color:#333; |
|
} |
|
.details_header ul li a:hover{ |
|
color:#6ecadc; |
|
} |
|
.company { |
|
margin:2em 0; |
|
} |
|
.company h3{ |
|
color: #FFF; |
|
padding: 5px 41px 5px 30px; |
|
display: inline-block; |
|
} |
|
.skills h3{ |
|
color: #FFF; |
|
padding: 5px 98px 5px 30px; |
|
display: inline-block; |
|
} |
|
.company_details,.education_details { |
|
padding:1.5em 0 0em 2em; |
|
} |
|
.company_details h4,.education_details h4{ |
|
color:#333; |
|
font-weight:600; |
|
font-size:1.5em; |
|
margin-bottom:6px; |
|
font-family: 'Varela Round', sans-serif; |
|
} |
|
.company_details h4 span,.education_details h4 span{ |
|
font-size: 0.65em; |
|
margin-left: 5px; |
|
color: #999; |
|
font-weight:400; |
|
} |
|
.company_details h6,.education_details h6{ |
|
font-weight:400; |
|
margin-bottom:1.3em; |
|
font-size:0.9em; |
|
} |
|
.company_details p,.skill_info p,.education_details p{ |
|
color:#999; |
|
font-weight:300; |
|
line-height:1.7em; |
|
} |
|
.cmpny1{ |
|
border-bottom:3px dashed #999; |
|
padding-bottom:1em; |
|
} |
|
.skills{ |
|
margin:2em 0; |
|
} |
|
.skill_info { |
|
padding:1.5em 0 0 2em; |
|
} |
|
.skill_list{ |
|
padding:1.5em 0 0 2em; |
|
} |
|
.skill1,.skill2{ |
|
float:left; |
|
width:30%; |
|
} |
|
.skill1 h4,.skill2 h4{ |
|
color:#333; |
|
font-weight:600; |
|
margin-bottom:1em; |
|
display:inline-block; |
|
} |
|
.skill1 ul,.skill2 ul{ |
|
padding-left:4em; |
|
} |
|
.skill1 ul li,.skill2 ul li{ |
|
color:#333; |
|
} |
|
.education h3{ |
|
background: #999; |
|
color: #FFF; |
|
padding: 5px 190px 5px 30px; |
|
display: inline-block; |
|
} |
|
h3.clr1{ |
|
background:#6ecadc; |
|
} |
|
h3.clr2{ |
|
background:#e9a820; |
|
} |
|
h3.clr3{ |
|
background:#3eb991; |
|
} |
|
h3.clr4{ |
|
background:#c25ce5; |
|
} |
|
h3.clr5{ |
|
background:#56f57e; |
|
} |
|
.copywrite{ |
|
padding-left:2em; |
|
margin-top:1em; |
|
} |
|
.copywrite p{ |
|
color:#999; |
|
font-size:0.9em; |
|
} |
|
.copywrite p a{ |
|
color:#999; |
|
} |
|
.copywrite p a:hover{ |
|
color:#6ecadc; |
|
} |
|
.contact-grid form{ |
|
padding:2em 0 0 2em; |
|
} |
|
.contact-grid input[type="text"], .contact-grid textarea { |
|
width: 80%; |
|
padding: 0.7em; |
|
margin: 0.5em 0; |
|
background: none; |
|
outline: none; |
|
border: 1px solid #A09F9F; |
|
font-size: 1em; |
|
color: #A09F9F; |
|
-webkit-appearance: none; |
|
} |
|
.send input[type="submit"] { |
|
width: 14%; |
|
font-size: 1.1em; |
|
background:#e9a820; |
|
padding: 0.4em 0.8em; |
|
text-align: center; |
|
color: #fff; |
|
border: none; |
|
outline: none; |
|
-webkit-appearance: none; |
|
} |
|
.send input[type="submit"]:hover { |
|
background: #6ecadc; |
|
} |
|
.contact-grid textarea { |
|
resize: none; |
|
} |
|
.map{ |
|
padding:2em 0 0 2em; |
|
} |
|
.map iframe { |
|
width: 100%; |
|
height: 350px; |
|
border: none; |
|
} |
|
/*--responsive--*/ |
|
@media (max-width: 1366px){ |
|
.sidebar h1 { |
|
font-size: 2em; |
|
} |
|
} |
|
@media (max-width: 1024px){ |
|
.sidebar { |
|
padding: 2em 17px; |
|
width:20%; |
|
} |
|
.sidebar h1 { |
|
font-size: 1.6em; |
|
} |
|
.main { |
|
margin-left: 19.666667%; |
|
width: 80%; |
|
} |
|
} |
|
@media (max-width: 768px){ |
|
.sidebar { |
|
width: 22%; |
|
} |
|
.main { |
|
margin-left: 21.666667%; |
|
width: 78%; |
|
} |
|
.sidebar h1 { |
|
font-size: 1.4em; |
|
} |
|
.sidebar img { |
|
padding: 0.5em; |
|
width: 89%; |
|
} |
|
.details_header { |
|
padding: 0em 1em 0 1em; |
|
} |
|
.details_header ul li a { |
|
padding: 0 1em; |
|
font-size: 0.9em; |
|
} |
|
.company h3,.skills h3,.education h3{ |
|
font-size: 1.2em; |
|
} |
|
.company_details h4, .education_details h4 { |
|
font-size: 1.1em; |
|
} |
|
.company_details h6, .education_details h6 { |
|
font-size: 0.8em; |
|
} |
|
.company_details p, .skill_info p, .education_details p { |
|
font-size: 0.8em; |
|
} |
|
.cmpny1 { |
|
padding-bottom: 1.5em; |
|
} |
|
.skill1, .skill2 { |
|
float: left; |
|
width: 50%; |
|
} |
|
.skill1 ul li,.skill2 ul li{ |
|
font-size:0.85em; |
|
} |
|
.skill1 h4, .skill2 h4 { |
|
font-size: 1em; |
|
} |
|
.skill_list { |
|
padding: 0.7em 0 0 2em; |
|
} |
|
.details p { |
|
font-size: 0.75em; |
|
} |
|
address span { |
|
font-size: 0.8em; |
|
} |
|
.contact-grid input[type="text"], .contact-grid textarea { |
|
width: 100%; |
|
font-size: 0.8em; |
|
} |
|
.send input[type="submit"] { |
|
width: 20%; |
|
font-size:0.85em; |
|
} |
|
} |
|
@media (max-width: 736px){ |
|
.sidebar { |
|
width: 100%; |
|
} |
|
.main { |
|
margin-left: 0; |
|
width: 100%; |
|
} |
|
.sidebar_top{ |
|
width:30%; |
|
float:left; |
|
margin-right:5%; |
|
} |
|
.details{ |
|
width:30%; |
|
float:right; |
|
} |
|
} |
|
@media (max-width: 640px){ |
|
.sidebar { |
|
width: 100%; |
|
} |
|
.main { |
|
margin-left: 0; |
|
width: 100%; |
|
} |
|
.sidebar_top{ |
|
width:30%; |
|
float:left; |
|
margin-right:5%; |
|
} |
|
.details{ |
|
width:30%; |
|
float:right; |
|
} |
|
.sidebar img{ |
|
width:100%; |
|
} |
|
.details p { |
|
font-size: 0.9em; |
|
margin: 5px 0 1em 0; |
|
} |
|
.details h3 { |
|
font-size: 0.9em; |
|
} |
|
} |
|
@media (max-width: 600px){ |
|
address { |
|
margin-bottom:0px; |
|
} |
|
.sidebar_top { |
|
width: 32%; |
|
} |
|
.sidebar img { |
|
width: 85%; |
|
} |
|
} |
|
@media (max-width: 568px){ |
|
.details_header ul li a { |
|
padding: 0 0.5em; |
|
font-size: 0.9em; |
|
} |
|
} |
|
@media (max-width: 480px){ |
|
.content { |
|
margin-right: 2em; |
|
} |
|
.glyphicon-save:before, .glyphicon-print:before, .glyphicon-envelope:before, .glyphicon-picture:before { |
|
margin-right: 6px; |
|
font-size: 12px; |
|
} |
|
.details_header ul li a { |
|
padding: 0 0.5em; |
|
font-size: 0.85em; |
|
} |
|
.details { |
|
width: 36%; |
|
} |
|
.sidebar h1 { |
|
font-size: 1.3em; |
|
} |
|
.sidebar_top { |
|
width: 38%; |
|
} |
|
address { |
|
margin-bottom: 0px; |
|
} |
|
.copywrite{ |
|
padding-left:1em; |
|
} |
|
.map iframe { |
|
height: 246px; |
|
} |
|
} |
|
@media (max-width: 414px){ |
|
.sidebar_top { |
|
width: 45%; |
|
} |
|
.sidebar img { |
|
width: 91%; |
|
} |
|
.details { |
|
width: 42%; |
|
} |
|
.details_header { |
|
padding: 0em 0em 0 1em; |
|
} |
|
.details_header ul li a { |
|
padding: 0 0.3em; |
|
font-size: 0.75em; |
|
} |
|
.skill1 ul, .skill2 ul { |
|
padding-left: 3em; |
|
} |
|
} |
|
@media (max-width: 384px){ |
|
.sidebar h1 { |
|
font-size: 1.2em; |
|
} |
|
.details { |
|
width: 45%; |
|
} |
|
.details_header ul { |
|
text-align: center; |
|
} |
|
.details_header ul li a { |
|
padding: 0 1em; |
|
font-size: 0.75em; |
|
} |
|
.main { |
|
padding: 1em 0 2em 0; |
|
} |
|
.company_details, .education_details,.skill_info { |
|
padding: 1em 0 0em 1em; |
|
} |
|
.company h3 { |
|
padding: 5px 41px 5px 16px; |
|
} |
|
.company_details h4, .education_details h4 { |
|
font-size: 0.9em; |
|
} |
|
.company_details h6, .education_details h6 { |
|
font-size: 0.6em; |
|
} |
|
.company { |
|
margin: 1em 0; |
|
} |
|
.skills { |
|
margin: 1em 0; |
|
} |
|
.company h3, .skills h3, .education h3 { |
|
font-size: 1em; |
|
} |
|
.skills h3 { |
|
padding: 5px 98px 5px 16px; |
|
} |
|
.skill1 ul, .skill2 ul { |
|
padding-left: 2em; |
|
} |
|
.skill1 ul li, .skill2 ul li { |
|
font-size: 0.75em; |
|
} |
|
.skill_list { |
|
padding: 0.5em 0 0 1.5em; |
|
} |
|
.education h3 { |
|
padding: 5px 190px 5px 16px; |
|
} |
|
.copywrite p{ |
|
font-size:0.7em; |
|
} |
|
} |
|
@media (max-width: 375px){ |
|
.sidebar h1 { |
|
font-size: 1em; |
|
} |
|
.sidebar img { |
|
width: 70%; |
|
} |
|
.details h3 { |
|
font-size: 0.8em; |
|
} |
|
.details p { |
|
font-size: 0.75em; |
|
margin: 5px 0 0.5em 0; |
|
} |
|
address span { |
|
font-size: 0.7em; |
|
} |
|
.sidebar { |
|
padding: 1.5em 17px 1em 17px; |
|
} |
|
.details_header { |
|
padding: 0em 0em 0 1em; |
|
text-align: center; |
|
} |
|
.details_header ul li a { |
|
line-height: 2em; |
|
} |
|
} |
|
@media (max-width: 320px){ |
|
.sidebar_top { |
|
width: 50%; |
|
} |
|
.sidebar img { |
|
width: 80%; |
|
} |
|
.details h3 { |
|
font-size: 0.7em; |
|
} |
|
.content { |
|
margin-right: 1em; |
|
} |
|
.details_header ul li a { |
|
padding: 0 0.5em; |
|
font-size: 0.75em; |
|
} |
|
.skill1 h4, .skill2 h4 { |
|
font-size: 0.85em; |
|
} |
|
.skill1 ul, .skill2 ul { |
|
padding-left: 1.5em; |
|
} |
|
} |