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
4 years ago
|
/*
|
||
|
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;
|
||
|
}
|
||
|
}
|